/* ===== 蝉脉AI创作 - 蝉脉橙主题（LOGO #F95901）+ 彩色图标 ===== */
* { margin: 0; padding: 0; box-sizing: border-box; -webkit-tap-highlight-color: transparent; }

:root {
  --primary: #f95901;
  --primary-light: #ff7a2e;
  --grad: linear-gradient(135deg, #ff8845 0%, #f94400 100%);
  --bg1: #ffefe3;
  --bg2: #fffbf7;
  --card: #ffffff;
  --text: #3a2a1e;
  --text2: #a08c7c;
  --chip-bg: #fff1e7;
  --danger: #ef4444;
  --radius: 20px;
}

body {
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif;
  background: linear-gradient(180deg, var(--bg1) 0%, var(--bg2) 360px);
  min-height: 100vh;
  color: var(--text);
  font-size: 15px;
  padding-bottom: 76px; /* 给底部 TabBar 留位 */
}

/* ===== 顶部标题栏 ===== */
.topbar {
  position: sticky; top: 0; z-index: 50;
  background: rgba(255, 251, 247, 0.92);
  backdrop-filter: blur(10px);
  padding: 14px 16px 8px;
}
.topbar-inner {
  max-width: 720px; margin: 0 auto;
  display: flex; align-items: center; justify-content: space-between;
}
.topbar-title { font-size: 18px; font-weight: 800; letter-spacing: 0.5px; }

/* PC 顶部导航（默认隐藏，≥1024px 显示） */
.topnav { display: none; gap: 4px; }
.topnav .tab-item.nav {
  flex-direction: row; gap: 5px;
  font-size: 14px; font-weight: 700; color: var(--text2);
  padding: 8px 16px; border-radius: 999px;
  transition: all 0.15s;
}
.topnav .tab-item.nav:hover { background: var(--chip-bg); color: var(--primary); }
.topnav .tab-item.nav.active {
  background: var(--grad); color: #fff;
  box-shadow: 0 4px 12px rgba(249, 89, 1, 0.30);
}
.quota-chip {
  border: none; cursor: pointer;
  background: var(--grad); color: #fff;
  font-size: 12.5px; font-weight: 600;
  padding: 6px 12px; border-radius: 999px;
  min-width: 40px; text-align: center;
}
.quota-chip.empty { background: #efe0d4; color: var(--text2); }

/* 顶栏右侧刷新按钮 */
.reload-btn {
  width: 32px; height: 32px;
  border-radius: 50%;
  border: 1px solid rgba(249, 89, 1, 0.22);
  background: rgba(249, 89, 1, 0.06);
  color: var(--primary, #f95901);
  font-size: 18px; line-height: 1;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  padding: 0;
  margin-left: 8px;
  transition: transform 0.25s ease, background 0.2s ease;
  -webkit-tap-highlight-color: transparent;
}
.reload-btn:hover { background: rgba(249, 89, 1, 0.14); }
.reload-btn:active { transform: scale(0.92); }
.reload-btn.spin { animation: reloadSpin 0.7s linear infinite; pointer-events: none; }
@keyframes reloadSpin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

/* ===== 视图切换 ===== */
.view { display: none; }
.view.active { display: block; }
.subpanel { display: none; }
.subpanel.active { display: block; }

/* ===== Hero Banner ===== */
.hero {
  position: relative; overflow: hidden;
  border-radius: 22px; padding: 30px 20px 26px;
  color: #fff; text-align: center; margin-bottom: 20px;
  box-shadow: 0 10px 26px rgba(249, 89, 1, 0.28);
}
.hero-home { background: linear-gradient(135deg, #ffb066 0%, #ff7a2e 45%, #f94400 100%); }
.hero-agent { background: linear-gradient(135deg, #d1352b 0%, #a01818 55%, #6f0f0f 100%); }
/* 子页 Hero（文案/图片/视频），比首页略紧凑 */
.hero-page { padding: 22px 18px 20px; margin-bottom: 16px; }
.hero-page .hero-title { font-size: 22px; }
.hero-page .hero-sub { margin-top: 8px; font-size: 12.5px; }
.hero-copy { background: linear-gradient(135deg, #6fb1ff 0%, #3b7bff 50%, #2450e0 100%); box-shadow: 0 10px 26px rgba(59, 123, 255, 0.28); }
.hero-image { background: linear-gradient(135deg, #c08cff 0%, #8b5cf6 50%, #6a35d8 100%); box-shadow: 0 10px 26px rgba(139, 92, 246, 0.28); }
.hero-video { background: linear-gradient(135deg, #ff7d9c 0%, #f9445e 50%, #d31f4f 100%); box-shadow: 0 10px 26px rgba(249, 68, 94, 0.28); }
.hero-title { font-size: 30px; font-weight: 900; letter-spacing: 1px; text-shadow: 0 2px 8px rgba(0,0,0,0.14); }
.hero-slogan {
  display: inline-block; margin-top: 12px;
  background: rgba(255,255,255,0.94); color: var(--primary);
  font-size: 15px; font-weight: 800; padding: 7px 20px; border-radius: 999px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.12);
}
.hero-slogan.red { color: #c22222; }
.hero-sub { margin-top: 12px; font-size: 13px; opacity: 0.92; letter-spacing: 0.5px; }
.hero-deco { position: absolute; font-size: 26px; opacity: 0.5; filter: blur(0.3px); }
.deco-1 { top: 14px; left: 18px; }
.deco-2 { top: 12px; right: 20px; font-size: 20px; opacity: 0.4; }
.deco-3 { bottom: 14px; left: 24px; font-size: 20px; opacity: 0.35; }

/* ===== 区块标题 ===== */
.section-head {
  display: flex; align-items: center; gap: 7px;
  font-size: 17px; font-weight: 800; margin: 4px 0 14px;
}
.section-head .bar { width: 4px; height: 16px; border-radius: 2px; background: var(--grad); }

/* ===== 一键爆款组合卡 ===== */
.combo-card {
  display: flex; align-items: center; gap: 14px;
  background: var(--grad); color: #fff;
  border-radius: 18px; padding: 18px 16px;
  cursor: pointer; margin-bottom: 18px;
  box-shadow: 0 8px 20px rgba(249, 89, 1, 0.30);
  transition: transform 0.12s;
}
.combo-card:active { transform: scale(0.98); }
.combo-ico { font-size: 32px; flex: 0 0 auto; }
.combo-main { flex: 1; min-width: 0; }
.combo-name { font-size: 17px; font-weight: 800; letter-spacing: 0.5px; }
.combo-sub { font-size: 12.5px; opacity: 0.92; margin-top: 4px; line-height: 1.5; }
.combo-arrow { font-size: 26px; opacity: 0.85; flex: 0 0 auto; font-weight: 700; }

/* ===== 功能宫格 ===== */
.func-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 13px; }
.func-grid.two { grid-template-columns: repeat(2, 1fr); }
.func-grid.three { grid-template-columns: repeat(3, 1fr); }
.func-card {
  background: var(--card); border-radius: 18px;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 18px 10px; cursor: pointer;
  transition: transform 0.12s, box-shadow 0.12s;
  box-shadow: 0 3px 12px rgba(249, 89, 1, 0.07);
}
.func-card:active { transform: scale(0.96); }
.func-card.row { flex-direction: row; justify-content: flex-start; gap: 12px; padding: 14px 14px; }
.func-ico {
  width: 54px; height: 54px; border-radius: 17px;
  display: flex; align-items: center; justify-content: center;
  font-size: 26px; color: #fff; box-shadow: 0 4px 10px rgba(0,0,0,0.12);
}
.func-card.row .func-ico { width: 46px; height: 46px; border-radius: 14px; font-size: 22px; flex: 0 0 auto; }
.func-name { margin-top: 10px; font-size: 13.5px; font-weight: 600; color: var(--text); }
.func-card.row .func-name { margin-top: 0; font-size: 15px; }

/* ===== 彩色渐变图标 ===== */
.f-orange { background: linear-gradient(135deg, #ffad64, #f95901); }
.f-red    { background: linear-gradient(135deg, #ff8a7a, #ef4444); }
.f-green  { background: linear-gradient(135deg, #8fe3b0, #22c55e); }
.f-pink   { background: linear-gradient(135deg, #ffa7c0, #ec4899); }
.f-blue   { background: linear-gradient(135deg, #7cb8ff, #3b82f6); }
.f-cyan   { background: linear-gradient(135deg, #7fdcf0, #06b6d4); }
.f-purple { background: linear-gradient(135deg, #b69cff, #8b5cf6); }
.f-yellow { background: linear-gradient(135deg, #ffe08a, #f59e0b); }
.f-brown  { background: linear-gradient(135deg, #d9a066, #a16207); }

/* ===== 我的页：会员卡 ===== */
.vip-card {
  background: linear-gradient(135deg, #ffb36b 0%, #f95901 50%, #e04e00 100%);
  border-radius: 22px; padding: 26px 20px 22px; text-align: center; color: #fff;
  margin-bottom: 20px; box-shadow: 0 10px 26px rgba(249, 89, 1, 0.28);
  position: relative; overflow: hidden;
}
.vip-card::after {
  content: ''; position: absolute; right: -40px; top: -40px; width: 170px; height: 170px;
  background: radial-gradient(circle, rgba(255,255,255,0.28) 0%, transparent 70%);
  border-radius: 50%; pointer-events: none;
}
.vip-avatar {
  width: 86px; height: 86px; border-radius: 50%;
  background: #fff; border: 3px solid rgba(255,255,255,0.85);
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 12px; overflow: hidden; box-shadow: 0 4px 16px rgba(0,0,0,0.2);
}
.vip-avatar img { width: 70%; height: 70%; object-fit: contain; }
.vip-name { font-size: 20px; font-weight: 800; letter-spacing: 0.5px; }
.vip-wechat { font-size: 12.5px; opacity: 0.9; margin-top: 6px; }
.vip-hint { font-size: 12.5px; opacity: 0.92; margin-top: 16px; color: #fff; }
.vip-badge {
  display: inline-flex; align-items: center; gap: 5px; margin-top: 14px;
  background: linear-gradient(135deg, #ffe08a 0%, #ffc459 100%); color: #7a4b00;
  font-size: 13px; font-weight: 800; padding: 7px 16px; border-radius: 999px;
  box-shadow: 0 3px 10px rgba(0,0,0,0.16);
}
.mine-footer { text-align: center; margin-top: 26px; }
.mine-footer .brand { font-size: 15px; font-weight: 800; color: var(--text2); }
.mine-footer .links { margin-top: 8px; font-size: 12px; color: var(--text2); }

/* ===== 功能子页顶部 ===== */
.sub-topbar {
  display: flex; align-items: center; gap: 10px;
  margin-bottom: 14px; padding: 4px 2px;
}
.sub-back {
  width: 32px; height: 32px; border-radius: 10px;
  background: var(--chip-bg); color: var(--primary);
  font-size: 22px; line-height: 30px; text-align: center; font-weight: 700;
  cursor: pointer; flex: 0 0 auto;
}
.sub-title { font-size: 18px; font-weight: 800; }

/* ===== 布局 ===== */
.main { max-width: 720px; margin: 0 auto; padding: 0 16px 30px; }

/* ===== 卡片 ===== */
.card {
  background: var(--card); border-radius: var(--radius);
  padding: 18px 16px; margin-bottom: 14px;
  box-shadow: 0 2px 10px rgba(249, 89, 1, 0.08);
}
.card-title { font-size: 16px; font-weight: 700; margin-bottom: 12px; display: flex; align-items: center; gap: 6px; }
.subpanel.active .results { margin-top: 14px; }
.badge-req {
  font-size: 11px; color: #dc2626; background: #fee2e2;
  padding: 2px 7px; border-radius: 6px; font-weight: 600;
}

/* ===== 描述输入区 ===== */
.prompt-area {
  width: 100%; border: none; outline: none; resize: vertical;
  background: #fff5ee; border-radius: 14px;
  padding: 13px 14px; font-size: 15px; color: var(--text);
  font-family: inherit; line-height: 1.6; min-height: 96px;
}
.prompt-area::placeholder { color: #c9a899; }
.prompt-area:focus { box-shadow: 0 0 0 2px rgba(255, 122, 46, 0.25); }
.prompt-toolbar { display: flex; align-items: center; gap: 8px; margin-top: 10px; }
.tool-btn {
  border: none; cursor: pointer; font-family: inherit;
  background: var(--chip-bg); color: var(--text);
  font-size: 13px; font-weight: 600;
  padding: 7px 13px; border-radius: 999px;
}
.tool-btn:active { opacity: 0.7; }
.tool-btn.ai { background: var(--grad); color: #fff; box-shadow: 0 3px 8px rgba(249, 89, 1, 0.26); }
.tool-btn:disabled { opacity: 0.55; cursor: not-allowed; }
.char-count { margin-left: auto; font-size: 12px; color: #c9a899; }

/* ===== 快速选择 ===== */
.cat-tabs { margin-bottom: 10px; }
.chips { display: flex; flex-wrap: wrap; gap: 9px; }
.chip {
  border: none; cursor: pointer; font-family: inherit;
  background: var(--chip-bg); color: var(--text);
  font-size: 13.5px; font-weight: 500;
  padding: 8px 16px; border-radius: 999px;
  transition: all 0.15s;
}
.chip.active { background: var(--grad); color: #fff; box-shadow: 0 3px 8px rgba(249, 89, 1, 0.26); }
.chip.on { background: var(--grad); color: #fff; box-shadow: 0 3px 8px rgba(249, 89, 1, 0.26); }
.style-select .chip.active::after { content: ' ✓'; }
.tag-muted { font-size: 12px; color: #9aa3b2; font-weight: 400; margin-left: 6px; }
.cat-tabs .chip { padding: 7px 15px; }
.cat-tabs .chip:not(.active) { background: transparent; border: 1px solid #f5d9c8; }

/* ===== 尺寸选择 ===== */
.size-row { display: flex; gap: 10px; overflow-x: auto; padding-bottom: 4px; }
.size-opt {
  flex: 0 0 auto; min-width: 118px; cursor: pointer; font-family: inherit;
  border: 1.5px solid #f3dccb; background: #fffcf8;
  border-radius: 14px; padding: 12px 14px;
  display: flex; flex-direction: column; align-items: center; gap: 3px;
  transition: all 0.15s;
}
.size-opt .size-name { font-size: 14.5px; font-weight: 700; color: var(--text); }
.size-opt .size-sub { font-size: 12px; color: var(--text2); }
.size-opt.active { background: var(--grad); border-color: transparent; box-shadow: 0 4px 12px rgba(249, 89, 1, 0.30); }
.size-opt.active .size-name, .size-opt.active .size-sub { color: #fff; }

/* ===== 上传区 ===== */
.upload-dash {
  border: 2px dashed #f0c6ac; border-radius: 16px;
  background: #fffcf8; cursor: pointer;
  padding: 28px 16px; text-align: center;
}
.upload-dash:active { background: #ffe9da; }
.upload-icon { font-size: 34px; margin-bottom: 8px; }
.upload-main { font-size: 15.5px; font-weight: 700; color: var(--text); }
.upload-sub { font-size: 12.5px; color: var(--text2); margin-top: 5px; }
.thumb-list { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 12px; }
.thumb {
  position: relative; width: 72px; height: 72px;
  border-radius: 12px; overflow: hidden;
  border: 1.5px solid #f3dccb;
}
.thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.thumb-del {
  position: absolute; top: 2px; right: 2px;
  width: 20px; height: 20px; border-radius: 50%;
  background: rgba(0,0,0,0.55); color: #fff;
  font-size: 13px; line-height: 20px; text-align: center; cursor: pointer;
}

/* ===== 生成按钮区 ===== */
.gen-card {
  background: var(--card); border-radius: var(--radius);
  padding: 20px 16px; margin-bottom: 14px; text-align: center;
  box-shadow: 0 2px 10px rgba(249, 89, 1, 0.08);
}
.gen-btn {
  width: 100%; border: none; cursor: pointer; font-family: inherit;
  background: var(--grad); color: #fff;
  font-size: 17px; font-weight: 700; letter-spacing: 2px;
  padding: 15px; border-radius: 999px;
  box-shadow: 0 6px 18px rgba(249, 89, 1, 0.35);
  display: flex; align-items: center; justify-content: center; gap: 8px;
}
.gen-btn:active { transform: scale(0.98); }
.gen-btn:disabled { opacity: 0.6; cursor: not-allowed; }
.gen-hint { font-size: 13px; color: var(--text2); margin-top: 12px; }
.gen-hint.dim { color: #c9a793; margin-top: 6px; }
.spinner {
  display: inline-block; width: 16px; height: 16px;
  border: 2px solid rgba(255,255,255,0.4); border-top-color: #fff;
  border-radius: 50%; animation: spin 0.8s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* ===== 免责声明 ===== */
.disclaimer {
  background: #fdf6dd; border-radius: 12px;
  padding: 12px 14px; font-size: 12px; line-height: 1.7;
  color: #9c8a3d; margin-top: 14px;
}

/* ===== 结果区 ===== */
.results { padding: 16px; }
.result-item { border-bottom: 1px solid #f6ece3; padding: 12px 0; }
.result-item:first-child { padding-top: 0; }
.result-item:last-child { border-bottom: none; padding-bottom: 0; }
.result-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.result-tag {
  font-size: 12px; font-weight: 700; color: var(--primary);
  background: var(--chip-bg); padding: 3px 10px; border-radius: 8px;
}
.result-text { font-size: 14.5px; line-height: 1.75; white-space: pre-wrap; word-break: break-word; }
.btn-copy {
  border: none; cursor: pointer; font-family: inherit;
  background: var(--chip-bg); color: var(--primary);
  font-size: 12.5px; font-weight: 600; padding: 5px 12px; border-radius: 999px;
}
.preview-img { width: 100%; border-radius: 14px; display: block; cursor: zoom-in; }
.img-actions { display: flex; gap: 10px; margin-top: 12px; justify-content: center; }

/* ===== 小红书爆款文案 · 三段式 ===== */
.xhs-item { margin-bottom: 6px; }
.xhs-label {
  font-size: 12.5px; font-weight: 700; color: #6a5bd8;
  margin: 10px 0 6px;
}
.xhs-title-box {
  position: relative; background: #f6f2ff; border: 1px solid #e3dcfa;
  border-radius: 12px; padding: 12px 40px 12px 13px;
  font-size: 14.5px; line-height: 1.6; font-weight: 600;
  color: #4a3a8f; word-break: break-word;
}
.xhs-title-copy {
  position: absolute; right: 9px; top: 50%; transform: translateY(-50%);
  border: none; cursor: pointer; background: transparent;
  font-size: 16px; line-height: 1; padding: 4px;
}
.xhs-body { margin-top: 2px; }
.xhs-body .xhs-para { margin: 0 0 12px; white-space: pre-wrap; word-break: break-word; }
.xhs-body .xhs-para:last-child { margin-bottom: 0; }
.xhs-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 2px; }
.xhs-tag {
  border: none; cursor: pointer; font-family: inherit;
  background: #8b7ae8; color: #fff;
  font-size: 12.5px; font-weight: 600; padding: 7px 14px; border-radius: 999px;
  box-shadow: 0 2px 6px rgba(122, 105, 220, 0.22);
  transition: transform 0.12s, background 0.12s;
}
.xhs-tag:hover { background: #7a69dc; transform: translateY(-1px); }
.xhs-gen-img { margin-top: 12px; }

/* ===== 爆款标题 · 结果 ===== */
.title-item { margin-bottom: 6px; }
.title-item .title-box {
  background: #f6f2ff; border: 1px solid #e3dcfa; border-radius: 12px;
  padding: 12px 14px; font-size: 15px; line-height: 1.6; font-weight: 600;
  color: #4a3a8f; word-break: break-word;
}
.title-note {
  margin-top: 8px; font-size: 12.5px; line-height: 1.5;
  color: #8a8aa0;
}
.title-note::before { content: '💡 '; }

/* ===== 爆款标题 · 复制全部汇总栏 ===== */
.title-summary {
  display: flex; align-items: center; justify-content: space-between;
  background: #f6f2ff; border: 1px solid #e3dcfa; border-radius: 12px;
  padding: 10px 14px; margin-bottom: 12px;
}
.title-summary-text {
  font-size: 14px; font-weight: 700; color: #4a3a8f;
}
.title-summary .copy-all {
  background: var(--primary); color: #fff; border: none; cursor: pointer;
  font-family: inherit; font-size: 13px; font-weight: 700;
  padding: 7px 16px; border-radius: 999px;
  box-shadow: 0 2px 8px rgba(249, 89, 1, 0.25);
}
.title-summary .copy-all:active { transform: scale(.96); }

/* ===== 爆款标题 · 生成中特效 ===== */
.gen-pulse .big-spinner {
  border-color: #e3dcfa; border-top-color: #7c6cf0;
}
.gen-pulse { color: #7c6cf0; animation: genFade 1.6s ease-in-out infinite; }
@keyframes genFade { 0%, 100% { opacity: .75; } 50% { opacity: 1; } }

.placeholder { color: #c9a899; text-align: center; padding: 20px 0; font-size: 14px; }
.loading-anim { text-align: center; padding: 26px 0; color: var(--text2); font-size: 14px; }
.loading-anim .big-spinner {
  display: block; margin: 0 auto 12px; width: 30px; height: 30px;
  border: 3px solid #f6dfd2; border-top-color: var(--primary);
  border-radius: 50%; animation: spin 0.9s linear infinite;
}

/* ===== 错误提示 ===== */
.error-tip {
  background: #fef2f2; color: #dc2626;
  border-radius: 12px; padding: 11px 14px;
  font-size: 13.5px; margin-bottom: 14px;
}

/* ===== 历史统计 ===== */
.stats-card {
  background: var(--card); border-radius: var(--radius);
  display: flex; padding: 16px 0; margin-bottom: 12px;
  box-shadow: 0 2px 10px rgba(249, 89, 1, 0.08);
}
.stat { flex: 1; text-align: center; display: flex; flex-direction: column; gap: 3px; }
.stat + .stat { border-left: 1px solid #f6ece3; }
.stat-num { font-size: 22px; font-weight: 800; color: var(--primary); }
#statRunning { color: #f59e0b; }
.stat-label { font-size: 12.5px; color: var(--text2); }
.tip-bar {
  background: #ffe9da; color: var(--primary);
  font-size: 13px; font-weight: 500;
  border-radius: 12px; padding: 10px 14px; margin-bottom: 14px;
}

/* ===== 历史网格 ===== */
.history-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (min-width: 560px) { .history-grid { grid-template-columns: 1fr 1fr 1fr; } }
.h-card {
  background: var(--card); border-radius: 16px; overflow: hidden; cursor: pointer;
  box-shadow: 0 2px 10px rgba(249, 89, 1, 0.08);
  display: flex; flex-direction: column;
}
.h-thumb-wrap { position: relative; aspect-ratio: 1; background: #fff1e7; }
.h-thumb { width: 100%; height: 100%; object-fit: cover; display: block; }
.h-thumb-text {
  width: 100%; height: 100%; display: flex; align-items: center;
  padding: 12px; font-size: 12.5px; line-height: 1.6; color: var(--text2);
  display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden;
}
.h-status {
  position: absolute; top: 8px; left: 8px;
  font-size: 11px; font-weight: 600; color: #059669;
  background: rgba(255,255,255,0.92); padding: 3px 9px; border-radius: 8px;
}
.h-status.running { color: #d97706; }
.h-type {
  position: absolute; top: 8px; right: 8px;
  font-size: 11px; font-weight: 600; color: #fff;
  background: var(--primary-light); padding: 3px 8px; border-radius: 8px;
}
.h-prompt {
  font-size: 13px; line-height: 1.5; padding: 10px 12px 4px;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  min-height: 47px;
}
.h-time { font-size: 11.5px; color: #c9a793; padding: 4px 12px 12px; }
.empty-state { text-align: center; padding: 60px 0; color: var(--text2); }
.empty-icon { font-size: 46px; margin-bottom: 10px; }

/* ===== 弹窗 ===== */
.modal-mask {
  position: fixed; inset: 0; z-index: 100;
  background: rgba(45, 23, 8, 0.55);
  display: flex; align-items: center; justify-content: center;
  padding: 20px; backdrop-filter: blur(3px);
}
.modal-card {
  background: #fff; border-radius: 22px;
  width: 100%; max-width: 400px; max-height: 86vh; overflow-y: auto;
  padding: 22px 18px;
}
.modal-card.preview { max-width: 560px; }
.modal-title { font-size: 17px; font-weight: 800; text-align: center; margin-bottom: 12px; }
.modal-hint { font-size: 13px; color: var(--text2); line-height: 1.6; margin-bottom: 14px; }
.text-input {
  width: 100%; border: 1.5px solid #f5d9c8; outline: none;
  border-radius: 12px; padding: 13px 14px; font-size: 16px;
  font-family: inherit; margin-bottom: 14px; letter-spacing: 2px;
  text-align: center; text-transform: uppercase; color: var(--text);
}
.text-input:focus { border-color: var(--primary-light); }
.modal-close {
  width: 100%; border: none; cursor: pointer; font-family: inherit;
  background: var(--chip-bg); color: var(--text2);
  font-size: 14px; font-weight: 600; padding: 12px; border-radius: 999px;
  margin-top: 10px;
}
.error-tip + .modal-close, .modal-card .error-tip { margin-top: 0; margin-bottom: 4px; }

/* ===== 底部 TabBar ===== */
.tabbar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 60;
  display: flex; justify-content: space-around; align-items: center;
  background: rgba(255, 252, 248, 0.96);
  backdrop-filter: blur(12px);
  border-top: 1px solid #ffe4d3;
  padding: 8px 0 calc(6px + env(safe-area-inset-bottom));
}
.tab-item {
  border: none; background: transparent; cursor: pointer; font-family: inherit;
  display: flex; flex-direction: column; align-items: center; gap: 4px;
  padding: 4px 8px; border-radius: 14px; flex: 0 0 auto;
}
.tab-ico {
  width: 40px; height: 40px; border-radius: 14px;
  display: flex; align-items: center; justify-content: center;
  font-size: 22px; color: #fff; box-shadow: 0 3px 8px rgba(0,0,0,0.1);
}
.tab-label { font-size: 12px; font-weight: 700; color: var(--text2); }
.tab-item.active .tab-label { color: var(--primary); }
.tab-item.active { box-shadow: 0 4px 14px rgba(249, 89, 1, 0.18); }

/* ===== 底栏 ===== */
.footer { text-align: center; font-size: 12px; color: #c9a793; padding: 12px 0 26px; }

/* ===== 全部功能矩阵（招商展示页） ===== */
.af-hero {
  background: var(--grad);
  border-radius: var(--radius);
  padding: 22px 18px;
  color: #fff;
  margin-bottom: 14px;
  box-shadow: 0 6px 18px rgba(249, 89, 1, 0.25);
}
.af-hero-title { font-size: 20px; font-weight: 800; letter-spacing: 0.5px; }
.af-hero-sub { font-size: 13px; opacity: 0.92; margin-top: 6px; }
.af-hero-stats {
  display: flex; align-items: center; flex-wrap: wrap; gap: 8px;
  margin-top: 14px; font-size: 12.5px;
}
.af-hero-stats b { font-size: 16px; font-weight: 800; margin-right: 2px; }
.af-dot { width: 4px; height: 4px; border-radius: 50%; background: rgba(255,255,255,0.6); }

.af-group-head {
  display: flex; align-items: center; gap: 8px;
  font-size: 15px; font-weight: 800; color: var(--text);
  margin: 18px 2px 10px;
}
.af-group-head .bar { width: 4px; height: 16px; border-radius: 2px; background: var(--primary); }

.af-list { background: var(--card); border-radius: var(--radius); overflow: hidden; box-shadow: 0 2px 10px rgba(249, 89, 1, 0.06); }
.af-item {
  display: flex; align-items: center; gap: 12px;
  padding: 13px 14px; cursor: pointer;
  border-bottom: 1px solid #f6ece3;
  transition: background 0.15s;
}
.af-item:last-child { border-bottom: none; }
.af-item:active { background: #fff1e7; }
.af-ico {
  width: 40px; height: 40px; border-radius: 13px; flex: 0 0 auto;
  display: flex; align-items: center; justify-content: center;
  font-size: 20px; color: #fff; box-shadow: 0 3px 8px rgba(0,0,0,0.08);
}
.af-main { flex: 1; min-width: 0; }
.af-name { font-size: 14.5px; font-weight: 700; color: var(--text); display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.af-desc { font-size: 12px; color: var(--text2); margin-top: 3px; }
.af-badge {
  font-size: 10px; font-weight: 700; padding: 2px 7px; border-radius: 999px;
  background: #f0f0f0; color: #999; flex: 0 0 auto;
}
.af-badge.on { background: #e7f7ef; color: #059669; }
.af-go { color: #d9c2b2; font-size: 18px; flex: 0 0 auto; }

.af-footer {
  text-align: center; font-size: 12.5px; color: var(--text2);
  margin: 18px 0 6px; line-height: 1.8;
}


/* ===== 三端自适应 =====
   手机 <768px（默认） / 平板 768-1023px / PC ≥1024px */

/* ---------- 平板端 ---------- */
@media (min-width: 768px) and (max-width: 1023px) {
  .topbar-inner, .main { max-width: 860px; }
  .main { padding: 0 24px 30px; }
  .func-grid { grid-template-columns: repeat(4, 1fr); gap: 16px; }
  .func-grid.two { grid-template-columns: repeat(3, 1fr); }
  .history-grid { grid-template-columns: repeat(4, 1fr); }
  .quick-row { gap: 18px; }
  .hero { padding: 40px 28px 34px; }
  .hero-title { font-size: 36px; }
}

/* ---------- PC 端 ---------- */
@media (min-width: 1024px) {
  body { padding-bottom: 20px; }               /* 无底部 TabBar */
  .tabbar { display: none; }                    /* 底部 TabBar 让位给顶部导航 */
  .topnav { display: flex; }                    /* 显示 PC 顶部导航 */
  .topbar-inner, .main { max-width: 1100px; }
  .main { padding: 0 28px 40px; }
  .topbar { padding: 12px 16px 10px; }
  .topbar-inner { gap: 16px; }

  /* 宫格铺 5 列，一屏看全功能 */
  .func-grid { grid-template-columns: repeat(5, 1fr); gap: 16px; }
  .func-grid.two { grid-template-columns: repeat(3, 1fr); }
  .func-grid.three { grid-template-columns: repeat(5, 1fr); }
  .history-grid { grid-template-columns: repeat(5, 1fr); gap: 16px; }

  .hero { padding: 48px 32px 42px; }
  .hero-title { font-size: 40px; }
  .quick-row { gap: 22px; }

  /* 鼠标悬停反馈 */
  .func-card:hover, .quick-item .quick-ico:hover { transform: translateY(-3px); }
  .func-card:hover { box-shadow: 0 10px 24px rgba(249, 89, 1, 0.16); }
  .func-card { transition: transform 0.15s, box-shadow 0.15s; }
  .combo-card:hover { transform: translateY(-2px); box-shadow: 0 12px 28px rgba(249, 89, 1, 0.36); }
  .af-item:hover { background: #fff1e7; }
  .chip:hover:not(.active) { background: #ffe4d3; }

  /* 生成子页左右分栏：表单左、结果右 */
  .subpanel#sub-copy.active,
  .subpanel#sub-t2i.active,
  .subpanel#sub-i2i.active {
    display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 14px; align-items: start;
  }
  .subpanel#sub-copy.active .sub-topbar,
  .subpanel#sub-t2i.active .sub-topbar,
  .subpanel#sub-i2i.active .sub-topbar,
  .subpanel#sub-copy.active .gen-card,
  .subpanel#sub-t2i.active .gen-card,
  .subpanel#sub-i2i.active .gen-card,
  .subpanel#sub-copy.active .disclaimer,
  .subpanel#sub-t2i.active .disclaimer,
  .subpanel#sub-i2i.active .disclaimer,
  .subpanel#sub-copy.active .error-tip,
  .subpanel#sub-t2i.active .error-tip,
  .subpanel#sub-i2i.active .error-tip { grid-column: 1 / -1; }
  .subpanel#sub-copy.active .results,
  .subpanel#sub-t2i.active .results,
  .subpanel#sub-i2i.active .results { grid-column: 2; }

  /* 全部功能矩阵：双列排布 */
  .af-list { display: grid; grid-template-columns: 1fr 1fr; }
  .af-item:nth-last-child(-n+2) { border-bottom: none; }
  .af-hero { padding: 30px 26px; }
}

/* ===== 激活成功特效 ===== */
.actfx { position: fixed; inset: 0; z-index: 999; display: flex; align-items: center; justify-content: center; background: rgba(30, 14, 4, 0.88); backdrop-filter: blur(6px); animation: actfxIn .35s ease both; overflow: hidden; }
@keyframes actfxIn { from { opacity: 0; } to { opacity: 1; } }
.actfx.out { animation: actfxOut .3s ease both; }
@keyframes actfxOut { from { opacity: 1; } to { opacity: 0; } }

/* 旋转放射光柱 */
.actfx-rays { position: absolute; inset: -60%; background: conic-gradient(from 0deg, transparent 0deg, rgba(255, 196, 89, 0.16) 12deg, transparent 24deg, transparent 36deg, rgba(255, 196, 89, 0.10) 48deg, transparent 60deg, transparent 72deg, rgba(255, 196, 89, 0.16) 84deg, transparent 96deg, transparent 120deg, rgba(255, 196, 89, 0.10) 132deg, transparent 144deg, transparent 180deg, rgba(255, 196, 89, 0.16) 192deg, transparent 204deg, transparent 240deg, rgba(255, 196, 89, 0.10) 252deg, transparent 264deg, transparent 300deg, rgba(255, 196, 89, 0.16) 312deg, transparent 324deg, transparent 352deg); animation: raysSpin 14s linear infinite; }
@keyframes raysSpin { to { transform: rotate(360deg); } }

.actfx-card { position: relative; z-index: 2; width: min(86vw, 360px); text-align: center; padding: 34px 26px 26px; border-radius: 24px; background: linear-gradient(160deg, #fffdf6 0%, #fff4e0 100%); border: 2px solid rgba(249, 89, 1, 0.25); box-shadow: 0 0 0 6px rgba(255, 196, 89, 0.15), 0 24px 60px rgba(0, 0, 0, 0.5); animation: cardPop .55s cubic-bezier(.18, .89, .32, 1.28) .12s both; }
@keyframes cardPop { from { transform: scale(.6) translateY(30px); opacity: 0; } to { transform: scale(1) translateY(0); opacity: 1; } }

.actfx-badge { font-size: 58px; line-height: 1; margin-bottom: 8px; animation: badgeBounce 1.6s ease-in-out infinite; filter: drop-shadow(0 6px 14px rgba(249, 89, 1, 0.35)); }
@keyframes badgeBounce { 0%, 100% { transform: translateY(0) scale(1); } 50% { transform: translateY(-8px) scale(1.06); } }

.actfx-congrats { font-size: 15px; letter-spacing: 4px; color: #a0622a; font-weight: 700; margin-bottom: 8px; animation: fadeUp .5s ease .35s both; }
.actfx-plan { font-size: 34px; font-weight: 900; line-height: 1.2; background: linear-gradient(120deg, #ff9a3d 0%, #f95901 45%, #b8860b 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; animation: planShine 2.2s ease-in-out .45s both, fadeUp .5s ease .45s both; }
@keyframes planShine { 0%, 100% { filter: brightness(1); } 50% { filter: brightness(1.35); } }
@keyframes fadeUp { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }
.actfx-sub { font-size: 13px; color: #a08c7c; margin-top: 4px; letter-spacing: 2px; animation: fadeUp .5s ease .6s both; }
.actfx-remain { margin: 18px 0 20px; font-size: 14px; color: #5c4632; background: #fff; border: 1px dashed rgba(249, 89, 1, 0.35); border-radius: 12px; padding: 10px; animation: fadeUp .5s ease .75s both; }
.actfx-remain b { color: #f95901; font-size: 20px; margin: 0 2px; }
.actfx-btn { border: none; cursor: pointer; font-family: inherit; width: 100%; padding: 13px; border-radius: 14px; font-size: 16px; font-weight: 800; color: #fff; background: linear-gradient(135deg, #ff8845 0%, #f94400 100%); box-shadow: 0 8px 20px rgba(249, 89, 1, 0.4); animation: fadeUp .5s ease .9s both; }
.actfx-btn:active { transform: scale(.97); }

/* 彩带粒子 */
.actfx-confetti { position: absolute; z-index: 3; top: -12px; width: 9px; height: 14px; border-radius: 2px; opacity: 0; animation: confettiFall linear forwards; }
@keyframes confettiFall {
  0% { opacity: 1; transform: translateY(-20px) rotate(0deg); }
  85% { opacity: 1; }
  100% { opacity: 0; transform: translateY(105vh) rotate(720deg); }
}

/* PC 端特效卡稍大 */
@media (min-width: 1024px) {
  .actfx-card { width: 400px; padding: 42px 34px 32px; }
  .actfx-badge { font-size: 68px; }
  .actfx-plan { font-size: 40px; }
}

/* ===== 我的页：联系方式弹窗 ===== */
.contact-card {
  width: min(88vw, 340px); background: #fff; border-radius: 20px; overflow: hidden;
  box-shadow: 0 24px 60px rgba(0,0,0,0.4); animation: cardPop .45s cubic-bezier(.18,.89,.32,1.2) both;
}
.contact-head {
  position: relative; background: linear-gradient(135deg, #34c0a0, #2aa87b);
  color: #fff; padding: 16px; text-align: center; font-size: 17px; font-weight: 800;
}
.contact-x {
  position: absolute; right: 14px; top: 50%; transform: translateY(-50%);
  background: rgba(255,255,255,0.22); border: none; color: #fff; cursor: pointer;
  width: 26px; height: 26px; border-radius: 50%; font-size: 14px; line-height: 1;
}
.contact-body { padding: 24px 20px 26px; text-align: center; }
.contact-qr { width: 180px; height: 180px; margin: 0 auto; border-radius: 14px; overflow: hidden; border: 1px solid #eee; }
.contact-qr img { width: 100%; height: 100%; object-fit: contain; }
.contact-qr-tip { font-size: 12.5px; color: var(--text2); margin-top: 12px; }
.contact-wechat { display: flex; align-items: center; justify-content: center; gap: 10px; margin-top: 16px; font-size: 15px; color: var(--text); }
.contact-wechat .c-label { color: var(--text2); font-size: 13.5px; }
.contact-copy {
  width: 100%; margin-top: 18px; padding: 13px; border-radius: 14px; border: none; cursor: pointer;
  background: linear-gradient(135deg, #34c0a0, #2aa87b); color: #fff; font-size: 16px; font-weight: 800;
  box-shadow: 0 6px 16px rgba(42,168,123,0.35);
}
.contact-copy:active { transform: scale(.97); }

/* ===== 功能状态页 ===== */
.status-hero {
  background: radial-gradient(120% 140% at 50% 0%, #2b3a5e 0%, #1c2440 60%, #121a30 100%);
  border-radius: 22px; padding: 30px 20px 26px; text-align: center; color: #fff;
  margin-bottom: 16px; box-shadow: 0 12px 30px rgba(0,0,0,0.18);
}
.ring { position: relative; width: 150px; height: 150px; margin: 0 auto 4px; }
.ring svg { width: 150px; height: 150px; transform: rotate(-90deg); }
.ring-track { fill: none; stroke: rgba(255,255,255,0.15); stroke-width: 10; stroke-linecap: round; }
.ring-bar { fill: none; stroke-width: 10; stroke-linecap: round; transition: stroke-dashoffset 1s ease; }
.ring-num { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 20px; font-weight: 800; }
.ring-num b { font-size: 46px; font-weight: 900; line-height: 1; }
.hero-title { font-size: 17px; font-weight: 800; margin-top: 14px; }
.hero-sub { font-size: 13px; opacity: 0.85; margin-top: 6px; }
.hero-time { font-size: 12px; opacity: 0.7; margin-top: 12px; }

.status-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 13px; }
.status-item {
  background: #fff; border-radius: 18px; padding: 18px 14px 16px; text-align: center;
  box-shadow: 0 3px 12px rgba(249, 89, 1, 0.06); position: relative;
}
.status-item .dot {
  position: absolute; top: 12px; right: 12px; width: 8px; height: 8px; border-radius: 50%;
  background: #22c55e; box-shadow: 0 0 0 3px rgba(34,197,94,0.18);
}
.status-item.na .dot { background: #cbd5e1; box-shadow: 0 0 0 3px rgba(203,213,225,0.2); }
.s-ring { position: relative; width: 74px; height: 74px; margin: 0 auto; }
.s-ring svg { width: 74px; height: 74px; transform: rotate(-90deg); }
.s-ring .ring-track { stroke: #f1ece6; stroke-width: 6; }
.s-ring .ring-bar { stroke-width: 6; }
.s-num { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 16px; font-weight: 800; color: var(--text); }
.s-name { font-size: 13.5px; font-weight: 700; color: var(--text); margin-top: 12px; }

@media (min-width: 560px) { .status-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 900px) {
  .status-grid { grid-template-columns: repeat(4, 1fr); gap: 16px; }
  .status-hero { padding: 36px 24px 30px; }
}

/* ================================================================
   账号系统：登录横幅 / 会员卡登录按钮 / 请先登录弹窗 / 登录·注册全屏层
   （沿用蝉脉橙主题，布局还原参考图）
   ================================================================ */

/* ---- 首页登录横幅 ---- */
.login-banner{
  display:flex; align-items:center; gap:12px;
  background: linear-gradient(135deg, #ff9a46, #f95901);
  border-radius:18px; padding:14px 16px; margin-bottom:16px; color:#fff;
  box-shadow:0 8px 20px rgba(249,89,1,0.28);
}
.lb-logo{ width:46px; height:46px; border-radius:50%; background:#fff; display:flex; align-items:center; justify-content:center; flex:0 0 auto; overflow:hidden; box-shadow:0 3px 8px rgba(0,0,0,0.15); }
.lb-logo img{ width:70%; height:70%; object-fit:contain; }
.lb-main{ flex:1; min-width:0; }
.lb-text{ font-size:15px; font-weight:800; }
.lb-sub{ font-size:12px; opacity:.9; margin-top:3px; }
.lb-btn{ border:none; background:#fff; color:#f95901; font-size:13px; font-weight:800; padding:9px 16px; border-radius:999px; cursor:pointer; flex:0 0 auto; box-shadow:0 4px 12px rgba(0,0,0,0.12); font-family:inherit; }

/* ---- 会员卡「立即登录」按钮 ---- */
.vip-login-btn{ border:none; margin-top:16px; background:#fff; color:#f95901; font-size:15px; font-weight:800; padding:11px 30px; border-radius:999px; cursor:pointer; box-shadow:0 6px 16px rgba(0,0,0,0.2); font-family:inherit; }
.vip-login-btn:active{ transform:scale(.96); }

/* ---- 请先登录弹窗 ---- */
.pt-card{ background:#fff; border-radius:20px; width:min(82vw,320px); padding:24px 22px 22px; text-align:center; box-shadow:0 24px 60px rgba(0,0,0,0.4); animation:cardPop .4s cubic-bezier(.18,.89,.32,1.2) both; }
.pt-line{ width:44px; height:5px; border-radius:3px; background:#eee; margin:0 auto 18px; }
.pt-title{ font-size:14px; color:#8a7462; margin-bottom:10px; }
.pt-body{ font-size:19px; font-weight:800; color:#2c2018; margin-bottom:22px; }
.pt-btns{ display:flex; gap:12px; }
.pt-btn{ flex:1; border:none; border-radius:999px; padding:13px; font-size:15px; font-weight:700; cursor:pointer; font-family:inherit; }
.pt-btn.ghost{ background:#f0f0f0; color:#888; }
.pt-btn.solid{ background:linear-gradient(135deg,#52c97a,#22a95e); color:#fff; box-shadow:0 6px 14px rgba(34,169,94,0.3); }

/* ---- 登录 / 注册 全屏层 ---- */
.auth-screen{ position:fixed; inset:0; z-index:200; overflow-y:auto; background:linear-gradient(180deg,#fff6ef 0%,#ffe7d4 100%); }
.auth-view{ min-height:100%; }
.auth-topbar{ position:sticky; top:0; display:flex; align-items:center; justify-content:space-between; padding:14px 16px; background:rgba(255,246,239,0.9); backdrop-filter:blur(8px); z-index:2; }
.auth-back{ width:34px; height:34px; display:flex; align-items:center; justify-content:center; font-size:28px; color:#5a4636; cursor:pointer; }
.auth-title{ font-size:17px; font-weight:700; color:#3a2a1e; }
.auth-tb-space{ width:34px; }
.auth-wrap{ max-width:520px; margin:0 auto; padding:10px 22px 50px; }
.auth-logo{ width:88px; height:88px; border-radius:24px; margin:0 auto -26px; position:relative; z-index:2; background:linear-gradient(135deg,#ff8845,#f94400); display:flex; align-items:center; justify-content:center; box-shadow:0 10px 24px rgba(249,89,1,0.35); overflow:hidden; }
.auth-logo img{ width:68%; height:68%; object-fit:contain; }
.auth-logo.emoji{ font-size:46px; background:#fff; border:1px solid #f5d9c8; box-shadow:0 8px 20px rgba(0,0,0,0.1); }
.auth-card{ position:relative; z-index:1; background:#fff; border-radius:28px; padding:50px 24px 28px; box-shadow:0 20px 50px rgba(180,110,60,0.15); }
.auth-welcome{ text-align:center; font-size:24px; font-weight:900; color:#2c2018; }
.auth-welcome-sub{ text-align:center; font-size:13px; color:#a08c7c; margin-top:8px; }
.auth-tabs{ display:flex; background:#f5ece4; border-radius:12px; padding:4px; margin:22px 0 18px; }
.auth-tab{ flex:1; border:none; background:transparent; padding:11px; border-radius:9px; font-size:14.5px; font-weight:600; color:#8a7462; cursor:pointer; font-family:inherit; transition:all .15s; }
.auth-tab.active{ background:linear-gradient(135deg,#ff8845,#f94400); color:#fff; box-shadow:0 4px 12px rgba(249,89,1,0.3); }
.auth-form{ display:flex; flex-direction:column; gap:14px; }
.auth-form[style*="display:none"]{ display:none; }
.auth-field{ position:relative; }
.auth-field input{ width:100%; border:1.5px solid #eadccf; border-radius:12px; padding:14px 16px; font-size:15px; color:#3a2a1e; background:#fff; outline:none; font-family:inherit; transition:border-color .15s; }
.auth-field input::placeholder{ color:#b9a493; }
.auth-field input:focus{ border-color:#ff7a2e; box-shadow:0 0 0 3px rgba(255,122,46,0.12); }
.auth-form.filled .auth-field input{ background:#f6f1ec; border-color:transparent; }
.auth-form.filled .auth-field input:focus{ background:#fff; border-color:#ff7a2e; }
.auth-eye{ position:absolute; right:14px; top:50%; transform:translateY(-50%); cursor:pointer; font-size:18px; opacity:.5; user-select:none; }
.auth-field.code input{ padding-right:112px; }
.auth-code-btn{ position:absolute; right:6px; top:50%; transform:translateY(-50%); border:none; background:#ffe4d3; color:#f95901; font-size:12.5px; font-weight:700; padding:10px 12px; border-radius:9px; cursor:pointer; font-family:inherit; }
.auth-code-btn:disabled{ opacity:.5; cursor:not-allowed; }
.auth-agree{ display:flex; align-items:center; gap:8px; font-size:12.5px; color:#8a7462; margin:18px 2px; cursor:pointer; }
.auth-agree input{ width:17px; height:17px; accent-color:#f95901; cursor:pointer; }
.auth-agree em{ color:#4c7bd9; font-style:normal; }
.auth-submit{ width:100%; border:none; border-radius:999px; padding:15px; font-size:17px; font-weight:800; letter-spacing:6px; color:#fff; background:linear-gradient(135deg,#ff9a46,#f95901); cursor:pointer; box-shadow:0 8px 20px rgba(249,89,1,0.35); font-family:inherit; transition:all .15s; }
.auth-submit:disabled{ background:#e7dcd2; color:#b9a493; box-shadow:none; cursor:not-allowed; }
.auth-submit:active:not(:disabled){ transform:scale(.98); }
.auth-msg{ font-size:12.5px; text-align:center; color:#dc2626; margin-top:12px; min-height:16px; line-height:1.5; }
.auth-divider{ display:flex; align-items:center; gap:12px; margin:22px 0 18px; color:#b9a493; font-size:12.5px; }
.auth-divider::before,.auth-divider::after{ content:''; flex:1; height:1px; background:#eee3d8; }
.auth-wechat{ width:100%; border:none; border-radius:999px; padding:14px; font-size:16px; font-weight:700; color:#fff; background:linear-gradient(135deg,#52c97a,#22a95e); cursor:pointer; box-shadow:0 8px 20px rgba(34,169,94,0.35); font-family:inherit; display:flex; align-items:center; justify-content:center; gap:8px; }
.auth-switch{ text-align:center; font-size:13px; color:#8a7462; margin-top:20px; }
.auth-switch a{ color:#f95901; font-weight:700; cursor:pointer; }
@media (min-width:560px){ .auth-wrap{ padding:14px 24px 60px; } .auth-card{ padding:52px 30px 30px; } }

/* =====================================================================
   卡密中心（商品 / 库存 / 售后 / 累计 / 红线规则）
   ===================================================================== */
.cc-user-chip { position:absolute; right:18px; font-size:12px; color:var(--text2); max-width:140px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* 身份卡 */
.cc-identity {
  display:flex; align-items:center; gap:12px;
  background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);
  color:#fff; border-radius:18px; padding:16px; margin-bottom:14px;
  box-shadow:0 6px 18px rgba(102,126,234,.28);
}
.cc-id-avatar { width:46px; height:46px; border-radius:14px; background:rgba(255,255,255,.22); display:flex; align-items:center; justify-content:center; font-size:24px; flex-shrink:0; }
.cc-id-main { flex:1; min-width:0; }
.cc-id-name { font-size:16px; font-weight:800; display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.cc-id-badge { font-size:11px; font-weight:700; padding:2px 8px; border-radius:999px; background:rgba(255,255,255,.25); }
.cc-id-sub { font-size:12px; opacity:.9; margin-top:4px; line-height:1.5; }

/* Tab */
.cc-tabs { display:flex; gap:6px; background:#fff; border-radius:14px; padding:6px; margin-bottom:14px; box-shadow:0 2px 8px rgba(0,0,0,.05); }
.cc-tab {
  flex:1; border:none; background:transparent; border-radius:10px; padding:8px 2px;
  font-size:17px; cursor:pointer; color:var(--text2); line-height:1.2;
  display:flex; flex-direction:column; align-items:center; gap:2px; transition:.18s;
}
.cc-tab em { font-style:normal; font-size:11px; font-weight:600; }
.cc-tab.active { background:var(--grad); color:#fff; box-shadow:0 3px 8px rgba(249,89,1,.26); }
.cc-panel { animation:ccFade .22s ease; }
@keyframes ccFade { from{opacity:0;transform:translateY(6px)} to{opacity:1;transform:none} }

/* 商品卡（横向卡券形态） */
.cc-product-list { display:flex; flex-direction:column; gap:10px; }
.cc-pd {
  position:relative; display:flex; background:#fff; border:1px solid #EFEFF4;
  border-radius:16px; overflow:hidden; box-shadow:0 2px 10px rgba(24,18,40,.045);
  transition:box-shadow .2s, transform .2s;
}
.cc-pd:hover { box-shadow:0 6px 20px rgba(24,18,40,.09); transform:translateY(-1px); }

/* 左侧券根：主题渐变 + 斜纹票面 + 虚线撕口 */
.cc-pd-stub {
  position:relative; flex:none; width:74px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px;
  background:linear-gradient(150deg,var(--c2) 0%,var(--c1) 100%);
  border-right:1.5px dashed rgba(255,255,255,.75);
  box-shadow:inset -6px 0 12px -6px rgba(0,0,0,.18);
}
.cc-pd-stub::before {
  content:''; position:absolute; left:0; top:0; bottom:0; width:74px;
  background:repeating-linear-gradient(45deg, rgba(255,255,255,.10) 0 5px, rgba(255,255,255,0) 5px 11px);
  pointer-events:none;
}
.cc-pd-stub span { position:relative; font-size:23px; line-height:1; filter:drop-shadow(0 2px 3px rgba(0,0,0,.18)); }
.cc-pd-stub b { position:relative; font-size:12px; font-weight:800; color:#fff; letter-spacing:.5px; opacity:.96; }

.cc-pd-body { flex:1; min-width:0; padding:11px 12px 10px; display:flex; flex-direction:column; }
.cc-pd-t { display:flex; align-items:center; gap:7px; }
.cc-pd-t b { font-size:15px; font-weight:800; color:#16161D; letter-spacing:.2px; }
.cc-pd-t u {
  text-decoration:none; font-size:10px; font-weight:800; color:#fff; letter-spacing:.2px;
  background:linear-gradient(135deg,var(--c1),var(--c2)); border-radius:999px; padding:2px 8px;
  box-shadow:0 2px 6px var(--c1g);
}
.cc-pd-sub { font-size:11px; color:#8E8E9C; margin-top:3px; }
.cc-pd-chips { display:flex; flex-wrap:wrap; gap:4px 5px; margin:7px 0 9px; }
.cc-pd-chips i {
  font-style:normal; font-size:10.5px; color:#6E6E80; background:#F5F5F8;
  border-radius:5px; padding:2.5px 7px; white-space:nowrap;
}

.cc-pd-foot { margin-top:auto; display:flex; align-items:center; justify-content:space-between; gap:8px; flex-wrap:wrap; }
.cc-pd-money { display:flex; align-items:baseline; gap:6px; min-width:0; }
.cc-pd-price { font-size:23px; font-weight:800; color:#16161D; line-height:1; letter-spacing:-.3px; }
.cc-pd-price i { font-style:normal; font-size:13px; font-weight:800; margin-right:1px; }
.cc-pd-money s { font-size:11px; color:#A8A8B6; font-weight:600; }
.cc-pd-money em {
  font-style:normal; font-size:10px; font-weight:800; color:#fff;
  background:linear-gradient(135deg,var(--c1),var(--c2)); border-radius:4px; padding:1.5px 5px;
}
.cc-pd-act { display:flex; align-items:center; gap:7px; flex:none; }
.cc-pd-btn {
  border:none; border-radius:9px; padding:8px 15px; font-size:13px; font-weight:800; color:#fff;
  background:linear-gradient(135deg,var(--c1),var(--c2)); cursor:pointer; white-space:nowrap;
  box-shadow:0 3px 9px var(--c1g); transition:transform .15s, box-shadow .15s;
}
.cc-pd-btn:active { transform:scale(.95); box-shadow:0 1px 4px var(--c1g); }

/* 累计 · 奖励卡片（主题色渐变版） */
.cc-rw { position:relative; background:#fff; border:1px solid #f0e8ee; border-radius:16px; padding:14px 14px 12px; margin-bottom:10px; overflow:hidden; box-shadow:0 2px 10px rgba(60,20,50,.05); }
.cc-rw::before { content:''; position:absolute; left:0; top:0; bottom:0; width:4px; background:linear-gradient(180deg,var(--c1),var(--c2)); }
.cc-rw.ready { border-color:var(--c1); background:#fff; background:linear-gradient(135deg,color-mix(in srgb,var(--c1) 7%,#fff) 0%,#fff 55%); box-shadow:0 4px 16px rgba(0,0,0,.12); box-shadow:0 4px 16px color-mix(in srgb,var(--c1) 25%,transparent); }
.cc-rw-head { display:flex; align-items:center; gap:10px; }
.cc-rw-ico { width:38px; height:38px; flex:none; display:flex; align-items:center; justify-content:center; font-size:20px; border-radius:12px; background:linear-gradient(135deg,var(--c1),var(--c2)); box-shadow:0 3px 8px color-mix(in srgb,var(--c1) 35%,transparent); }
.cc-rw-info { flex:1; min-width:0; }
.cc-rw-info b { display:block; font-size:15px; line-height:1.2; }
.cc-rw-info span { display:block; font-size:11px; color:var(--text2); margin-top:2px; }
.cc-rw-pct { font-size:13px; font-weight:800; color:var(--c1); }
.cc-rw-bar { height:7px; background:#f3eef2; border-radius:999px; overflow:hidden; margin-top:10px; }
.cc-rw-bar span { display:block; height:100%; border-radius:999px; background:linear-gradient(90deg,var(--c1),var(--c2)); transition:width .4s; }
.cc-rw-foot { margin-top:9px; font-size:12px; color:var(--text2); line-height:1.5; }
.cc-rw-foot b { color:var(--c1); font-size:14px; }
.cc-claim-btn:active { transform:scale(.98); }

/* 领取奖励入口：卡片右侧按钮 */
.cc-rw-claim { flex:none; border:none; border-radius:999px; padding:7px 14px; font-size:12px; font-weight:800; color:#fff; background:linear-gradient(135deg,var(--c1),var(--c2)); cursor:pointer; white-space:nowrap; box-shadow:0 3px 10px rgba(0,0,0,.18); box-shadow:0 3px 10px color-mix(in srgb,var(--c1) 40%,transparent); animation:ccPulse 1.6s ease-in-out infinite; }
.cc-rw-claim:active { transform:scale(.96); }
@keyframes ccPulse { 0%,100%{transform:scale(1);opacity:1} 50%{transform:scale(1.05);opacity:.92} }

/* 🎁 领取奖励弹窗 */
.cc-confetti { position:absolute; left:0; top:0; width:100%; height:100%; pointer-events:none; z-index:2; }
.cc-rw-card { text-align:center; overflow:hidden; }
.cc-rw-gift { font-size:64px; line-height:1; margin:6px 0 8px; animation:ccGiftPop .7s cubic-bezier(.2,1.6,.4,1) both; }
@keyframes ccGiftPop { 0%{transform:scale(0) rotate(-25deg);opacity:0} 60%{transform:scale(1.25) rotate(8deg)} 100%{transform:scale(1) rotate(0);opacity:1} }
.cc-rw-sub { font-size:12px; color:var(--text2); margin-bottom:12px; }
.cc-rw-sub b { color:var(--primary); }
.cc-rw-code { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:16px; font-weight:800; letter-spacing:.5px; background:linear-gradient(135deg,#fff5f8,#f3f0ff); border:1.5px dashed var(--primary); color:var(--text); border-radius:12px; padding:12px 10px; margin-bottom:12px; word-break:break-all; animation:ccCodeIn .5s .35s both; }
@keyframes ccCodeIn { from{opacity:0;transform:translateY(8px)} to{opacity:1;transform:none} }
.cc-rw-accept { margin-top:8px; background:linear-gradient(135deg,#FF6B35,#FF3D68); }
.cc-rw-note { margin-top:10px; font-size:11px; color:var(--text2); }

/* 数量选择（与按钮同行的紧凑步进器） */
.cc-qty { display:flex; align-items:center; border:1px solid var(--c1b); border-radius:9px; overflow:hidden; background:#fff; }
.cc-qty button { width:26px; height:28px; border:none; background:var(--c1s); color:var(--c1d); font-size:15px; font-weight:800; line-height:1; cursor:pointer; }
.cc-qty button:active { background:var(--c1m); color:#fff; }
.cc-qty span { min-width:30px; height:28px; line-height:28px; text-align:center; font-weight:800; font-size:13px; color:#16161D; }

/* 库存 */
.cc-filter { display:flex; gap:8px; margin-bottom:10px; }
.cc-chip { border:1px solid #eee; background:#fff; border-radius:999px; padding:6px 14px; font-size:12px; font-weight:600; color:var(--text2); cursor:pointer; }
.cc-chip.active { background:var(--grad); color:#fff; border-color:transparent; }
.cc-stock-list { display:flex; flex-direction:column; gap:8px; }
.cc-code-item {
  background:#fff; border-radius:14px; padding:12px 14px; box-shadow:0 2px 8px rgba(0,0,0,.05);
  display:flex; align-items:center; gap:10px; cursor:pointer; transition:.15s;
}
.cc-code-item:active { transform:scale(.99); }
.cc-code-item.is-used { background:#fafafa; }
.cc-code-item.is-used .cc-code-no { text-decoration:line-through; color:#bbb; }
.cc-code-item.is-used .cc-code-name { text-decoration:line-through; color:#bbb; }
.cc-code-item.is-expired { opacity:.6; }
.cc-code-emoji { font-size:22px; flex-shrink:0; }
.cc-code-main { flex:1; min-width:0; }
.cc-code-name { font-size:14px; font-weight:700; }
.cc-code-no { font-size:12px; color:var(--text2); font-family:ui-monospace,Menlo,monospace; margin-top:2px; word-break:break-all; }
.cc-code-meta { font-size:11px; color:#bbb; margin-top:3px; }
.cc-code-state { font-size:11px; font-weight:700; padding:3px 9px; border-radius:999px; white-space:nowrap; flex-shrink:0; }
.cc-state-unused { background:#e8f8ee; color:#16a34a; }
.cc-state-used { background:#f1f1f1; color:#999; }
.cc-state-expired { background:#fdecec; color:#e0533d; }
.cc-code-act { border:none; background:var(--grad); color:#fff; font-size:12px; font-weight:700; padding:6px 12px; border-radius:8px; cursor:pointer; white-space:nowrap; flex-shrink:0; }

/* 空状态 */
.cc-empty { text-align:center; color:var(--text2); font-size:13px; padding:34px 10px; }
.cc-empty div:first-child { font-size:38px; margin-bottom:8px; }

/* 累计拿卡 */
.cc-growth-hero { position:relative; overflow:hidden; background:linear-gradient(120deg,#FF416C 0%,#C724B1 60%,#7C4DFF 100%); border-radius:18px; padding:16px 18px; color:#fff; display:flex; align-items:center; gap:16px; box-shadow:0 6px 18px rgba(199,36,177,.28); }
.cc-growth-hero::before { content:''; position:absolute; right:-30px; top:-40px; width:120px; height:120px; border-radius:50%; background:rgba(255,255,255,.14); }
.cc-growth-hero::after { content:''; position:absolute; right:24px; bottom:-50px; width:90px; height:90px; border-radius:50%; background:rgba(255,255,255,.10); }
.cc-g-left { flex:none; text-align:center; }
.cc-g-num { font-size:38px; font-weight:800; line-height:1.05; text-shadow:0 2px 8px rgba(0,0,0,.15); }
.cc-g-label { font-size:11px; opacity:.92; margin-top:2px; }
.cc-g-divider { flex:none; width:1px; align-self:stretch; background:rgba(255,255,255,.28); }
.cc-g-right { position:relative; z-index:1; flex:1; font-size:13px; font-weight:700; line-height:1.55; }
.cc-g-gift { font-size:18px; margin-right:6px; }
.cc-level-row { display:flex; align-items:center; gap:10px; background:#fff; border-radius:12px; padding:10px 12px; margin-top:8px; box-shadow:0 2px 6px rgba(0,0,0,.04); }
.cc-level-row.cur { border:2px solid var(--primary); }
.cc-lv-badge { font-size:20px; }
.cc-lv-main { flex:1; min-width:0; }
.cc-lv-name { font-size:13px; font-weight:700; }
.cc-lv-th { font-size:11px; color:var(--text2); }
.cc-lv-price { font-size:12px; font-weight:700; color:var(--primary); white-space:nowrap; }

/* 规则 */
.cc-rule { display:flex; gap:10px; background:#fff; border-radius:12px; padding:12px 14px; margin-bottom:8px; box-shadow:0 2px 6px rgba(0,0,0,.04); }
.cc-rule-icon { font-size:18px; flex-shrink:0; }
.cc-rule-title { font-size:14px; font-weight:700; margin-bottom:3px; }
.cc-rule-body { font-size:12px; color:var(--text2); line-height:1.65; }

/* 说明小字 */
.cc-note { font-size:12px; color:var(--text2); line-height:1.7; margin-top:10px; }
.cc-msg { font-size:12px; margin-top:8px; line-height:1.6; min-height:18px; }

/* 支付弹窗 */
.cc-pay-card { max-width:360px; }
.cc-pay-goods { display:flex; align-items:center; gap:10px; background:#fafafa; border-radius:12px; padding:12px; margin:12px 0; }
.cc-pay-emoji { font-size:26px; }
.cc-pay-info { flex:1; min-width:0; }
.cc-pay-name { font-size:14px; font-weight:700; }
.cc-pay-qty { font-size:12px; color:var(--text2); }
.cc-pay-amount { font-size:22px; font-weight:800; color:var(--primary); }
.cc-pay-methods { display:flex; gap:8px; margin-bottom:12px; }
.cc-pay-m { flex:1; border:2px solid #eee; background:#fff; border-radius:12px; padding:10px 4px; font-size:13px; font-weight:700; cursor:pointer; color:var(--text2); display:flex; align-items:center; justify-content:center; gap:4px; }
.cc-pay-m.active { border-color:var(--primary); color:var(--primary); background:#fff6f0; }
.cc-qr-wrap { text-align:center; padding:6px 0 12px; }
.cc-qr { border-radius:10px; border:1px solid #eee; }
.cc-qr-tip { font-size:13px; font-weight:700; margin-top:8px; }
.cc-demo-tip { font-size:11px; color:#c0392b; margin-top:4px; }
.cc-pay-order { font-size:11px; color:var(--text2); text-align:center; margin-bottom:10px; }

/* 成功弹窗 */
.cc-success-icon { font-size:46px; text-align:center; margin-bottom:6px; }
.cc-success-sub { font-size:12px; color:var(--text2); text-align:center; margin-bottom:12px; }
.cc-success-codes { background:#fafafa; border-radius:12px; padding:12px; margin-bottom:12px; max-height:200px; overflow:auto; }
.cc-sc-item { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:6px 0; border-bottom:1px dashed #eee; }
.cc-sc-item:last-child { border-bottom:none; }
.cc-sc-no { font-family:ui-monospace,Menlo,monospace; font-size:13px; font-weight:700; word-break:break-all; }
.cc-sc-tag { font-size:11px; color:var(--text2); white-space:nowrap; }

/* ---------- 爆款口播：三步向导 ---------- */
.kb-steps { display:flex; align-items:flex-start; justify-content:center; gap:8px; padding:18px 12px 6px; }
.kb-step { display:flex; flex-direction:column; align-items:center; gap:4px; width:84px; }
.kb-dot { width:34px; height:34px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  font-size:15px; font-weight:800; color:#fff; background:#e6e6e6; transition:all .25s; }
.kb-label { font-size:12px; color:var(--text2, #999); }
.kb-step.active .kb-dot { background:var(--primary, #f95901); box-shadow:0 2px 8px rgba(249,89,1,.35); }
.kb-step.active .kb-label { color:var(--primary, #f95901); font-weight:700; }
.kb-line { flex:1; height:2px; background:#e6e6e6; margin-top:17px; transition:background .25s; }
.kb-line.active { background:var(--primary, #f95901); }
.kb-panel { padding-top:8px; }
.kb-sub { font-size:12px; color:var(--text2, #999); margin:2px 0 12px; }
.kb-link-row { display:flex; gap:8px; align-items:flex-start; }
.kb-link-row .kb-input { flex:1; resize:none; }
.kb-link-row .tool-btn { height:48px; white-space:nowrap; }
.kb-parse-btn { width:100%; margin-top:12px; }
.kb-use-text { background:var(--primary-light, #ff7a2e); font-weight:700; }
.kb-divider { display:flex; align-items:center; text-align:center; color:var(--text2, #999);
  font-size:12px; margin:16px 0 12px; }
.kb-divider::before, .kb-divider::after { content:''; flex:1; height:1px; background:#eee; }
.kb-divider span { padding:0 10px; }
.kb-backline { text-align:center; margin-top:6px; }
.kb-back { color:var(--primary, #f95901); font-weight:700; cursor:pointer; }
.kb-back:hover { text-decoration:underline; }
.kb-kv { font-size:13px; line-height:1.7; margin-bottom:8px; }
.kb-kv b { color:var(--primary, #f95901); margin-right:6px; font-weight:700; }
.kb-ref { background:var(--chip-bg, #f5f5f5); border-radius:10px; padding:10px 12px; font-size:13px;
  line-height:1.7; color:var(--text, #333); white-space:pre-wrap; }
.kb-confirm-row { display:flex; gap:10px; padding:8px 0; border-bottom:1px dashed #eee; font-size:13px; }
.kb-confirm-row:last-child { border-bottom:none; }
.kb-confirm-label { color:var(--text2, #999); white-space:nowrap; }
.kb-confirm-val { color:var(--text, #333); word-break:break-all; }
.kb-field { margin:10px 0; }
.kb-field-label { display:inline-block; font-size:12px; font-weight:700; color:var(--primary, #f95901);
  margin-bottom:4px; }
.kb-field-val { font-size:13.5px; line-height:1.8; color:var(--text, #333); white-space:pre-wrap; }
.kb-field-body { background:var(--chip-bg, #f5f5f5); border-left:3px solid var(--primary, #f95901);
  border-radius:8px; padding:10px 12px; }
.kb-script-item .result-tag { background:#ffe9da; color:var(--primary, #f95901); }

/* ---------- 爆款口播：完成步绿色 / 参考文案卡片 / 分步脚本 / 进度条 ---------- */
.kb-step.done .kb-dot { background:#22c55e; box-shadow:0 2px 8px rgba(34,197,94,.3); }
.kb-step.done .kb-label { color:#22c55e; }
/* 参考文案全文卡片 */
.kb-refcard { overflow:hidden; padding:0 !important; margin-bottom:12px; }
.kb-refcard-top { display:flex; justify-content:space-between; align-items:center;
  background:#fff6e8; padding:10px 14px; font-size:13px; font-weight:700; color:#8a6d3b; }
.kb-ref-copy { background:#eef4ff; color:#3b82f6; border:none; border-radius:8px; padding:5px 12px;
  font-size:12px; font-weight:700; cursor:pointer; }
.kb-ref-copy:active { transform:scale(.95); }
.kb-refcard-body { padding:14px; font-size:13.5px; line-height:1.85; color:var(--text, #333);
  white-space:pre-wrap; }
/* 自定义行业 */
.kb-custom-chip { border-style:dashed !important; color:var(--primary, #f95901) !important; }
.kb-custom-row { display:flex; gap:8px; margin-top:10px; }
.kb-custom-row .prompt-area { flex:1; }
.kb-custom-row .gen-btn { width:auto; padding:0 18px; }
/* 拆解（亮点/可借鉴/可优化） */
.kb-decomp { position:relative; padding:10px 12px 10px 14px; margin:8px 0; border-radius:10px;
  background:var(--chip-bg, #f5f5f5); font-size:13px; line-height:1.7; color:var(--text, #333); }
.kb-decomp .kd-ico { margin-right:6px; }
.kb-decomp .kd-label { font-weight:700; margin-right:6px; color:var(--primary, #f95901); }
.kb-decomp .kd-text { margin-top:4px; }
/* 分步脚本卡片：左侧竖条颜色渐变 */
.result-item.kb-step-item { border-left:4px solid var(--kb-c, #f95901); padding:12px 14px 14px; }
.kb-step-item.c-orange { --kb-c:#ff5a3c; }
.kb-step-item.c-orange2 { --kb-c:#ff8a3c; }
.kb-step-item.c-gold { --kb-c:#ffb020; }
.kb-step-item.c-green { --kb-c:#22c55e; }
.kb-step-item.c-purple { --kb-c:#7c5cff; }
.kb-step-item.c-pink { --kb-c:#ff5c9e; }
.kb-step-item .result-tag { background:#fff4e8; color:#b45309; }
.kb-step-body { font-size:13.5px; line-height:1.85; color:var(--text, #333); white-space:pre-wrap; margin-top:2px; }
/* 拍摄小贴士 */
.kb-tip { background:#eef6ff; border:1px solid #d3e8ff; border-radius:12px; padding:12px 14px; margin-top:14px; }
.kb-tip-h { font-size:13.5px; font-weight:800; color:#2563eb; margin-bottom:4px; }
.kb-tip-b { font-size:13px; line-height:1.75; color:var(--text, #333); }
/* 底部操作：一键复制全部 + 重新生成/新脚本 */
.kb-script-footer { margin-top:16px; }
.kb-copy-all { width:100%; }
.kb-script-small { display:flex; gap:10px; margin-top:12px; }
.kb-script-small .btn-copy { flex:1; justify-content:center; padding:11px 0; font-weight:700; }
.kb-regen { background:#fff; color:var(--primary, #f95901); border:1.5px solid #ffe0cc; }
.kb-newsc { background:var(--primary, #f95901); color:#fff; }
/* 进度条 loading */
.kb-loading { text-align:center; padding:34px 18px; }
.kb-loading-ico { width:64px; height:64px; margin:0 auto 12px; border-radius:50%;
  background:radial-gradient(circle at 30% 30%, #ffb066, #f95901); display:flex; align-items:center;
  justify-content:center; font-size:28px; color:#fff; box-shadow:0 6px 20px rgba(249,89,1,.4);
  animation:kbPulse 1.6s ease-in-out infinite; }
@keyframes kbPulse { 0%,100%{transform:scale(1)} 50%{transform:scale(1.08)} }
.kb-loading-text { font-size:15px; font-weight:700; color:var(--text, #333); margin-bottom:6px; }
.kb-loading-dots { margin:6px 0 16px; }
.kb-loading-dots span { display:inline-block; width:7px; height:7px; margin:0 3px; border-radius:50%;
  background:var(--primary, #f95901); opacity:.4; animation:kbDot 1s infinite; }
.kb-loading-dots span:nth-child(2){ animation-delay:.2s }
.kb-loading-dots span:nth-child(3){ animation-delay:.4s }
@keyframes kbDot { 0%,80%,100%{opacity:.3; transform:scale(.85)} 40%{opacity:1; transform:scale(1.1)} }
.kb-progress { height:8px; background:#f1e4da; border-radius:5px; overflow:hidden; max-width:280px;
  margin:0 auto; }
.kb-progress-bar { height:100%; width:0; background:linear-gradient(90deg,#ff8a3c,#f95901);
  border-radius:5px; transition:width .3s; }
.kb-progress-num { margin-top:8px; font-size:14px; font-weight:800; color:var(--primary, #f95901); }

/* ---------- 爆款口播：解析来源徽标 + 推荐文案输入框 ---------- */
.kb-src-note { font-size:12.5px; line-height:1.7; border-radius:10px; padding:10px 12px; margin:6px 0 12px; }
.kb-src-note b { font-weight:800; }
.kb-src-infer { background:#fff6e8; border:1px solid #ffe0b2; color:#8a5a00; }
.kb-src-infer b { color:#c2410c; }
.kb-src-text { background:#eefdf3; border:1px solid #c5efd3; color:#166534; }
.kb-src-text b { color:#15803d; }
.kb-textarea { border-color:#ffd9b3 !important; background:#fffdf8; }
.kb-textarea:focus { border-color:var(--primary, #f95901) !important; box-shadow:0 0 0 3px rgba(249,89,1,.12); }
