/* 创业地推 H5 样式（首页 / 群 / 内容页 / 个人中心 / 排行） */
:root {
  --brand: #f97316;          /* 老板指定琥珀橙，保留为品牌主色 */
  --brand2: #ff7a1a;         /* 改动：更暖更亮，与原渐变观感拉开差异 */
  --ink: #26211e;            /* 新增：深炭色，用于高对比区块（如加入横幅） */
  --green: #07c160;
  --bg: #f6f5f2;             /* 改动：极淡暖灰，区别于通用冷灰 */
  --card: #ffffff;
  --text: #221e1b;           /* 改动：暖黑，非纯冷黑 */
  --sub: #8d8a86;
  --line: #ece8e3;
  --ok: #07c160;
  --warn: #f59e0b;
  --red: #e5484d;
}
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html, body { margin: 0; padding: 0; }
body {
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif;
  background: var(--bg); color: var(--text); font-size: 15px; line-height: 1.62;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
/* 中文标题字重梯度（差异化：统一以字重 + 间距拉开层次，不靠字号堆砌） */
.sec-head, .ib-h, .page-h, .vip-head h2, .phb-line, .pub-pill, .pub-slogan span, .rank-hero .rh-tt {
  letter-spacing: .5px;
}
.ih-tt, .phb-line, .rh-tt { letter-spacing: 1px; }
#app { max-width: 480px; margin: 0 auto; min-height: 100vh; background: var(--bg);
  display: flex; flex-direction: column; position: relative; }
#main { flex: 1; padding: 0 16px 84px; }
.loading, .empty { text-align: center; color: var(--sub); padding: 48px 16px; font-size: 14px; }
/* 触底加载的底部提示（加载中 / 已经到底了） */
.feed-tip { text-align: center; color: var(--sub); font-size: 13.5px; padding: 16px 12px 6px; }
.feed-tip.end { color: #c2c7cf; padding: 20px 12px 8px; }
.feed-tip.end::before, .feed-tip.end::after {
  content: ''; display: inline-block; width: 26px; height: 1px; background: #e3e6ea;
  vertical-align: middle; margin: 0 10px;
}
.toast {
  position: fixed; left: 50%; top: 40%; transform: translateX(-50%);
  background: rgba(0,0,0,.82); color: #fff; padding: 12px 20px; border-radius: 10px;
  font-size: 14px; z-index: 999; max-width: 80%;
}

/* ============ 底部 Tab ============ */
.tabs {
  position: fixed; bottom: 0; left: 50%; transform: translateX(-50%);
  width: 100%; max-width: 480px; height: 64px; background: #fff;
  border-top: 1px solid var(--line); display: flex; z-index: 50;
  padding-bottom: env(safe-area-inset-bottom);
  box-shadow: 0 -2px 12px rgba(0,0,0,.04);
}
.tab { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; color: #9aa0aa; }
.tab.active { color: var(--brand); font-weight: 600; }
.tab-ic { width: 25px; height: 25px; }
.tab-ic svg { width: 100%; height: 100%; }
.tab-tx { font-size: 12px; margin-top: 3px; }
.tab-plus { position: relative; }
.plus-btn {
  width: 50px; height: 50px; border-radius: 50%; background: linear-gradient(135deg, var(--brand), var(--brand2));
  color: #fff; font-size: 30px; line-height: 48px; text-align: center; font-weight: 300;
  box-shadow: 0 6px 16px rgba(249,115,22,.38); margin-top: -20px;
}
.tab-plus .tab-tx { color: #9aa0aa; }
.tab-plus.active .tab-tx { color: var(--brand); }

/* ============ 首页 ============ */
.home-top { padding: 14px 0 0; }
.hs-box { display: flex; align-items: center; background: #fff; border-radius: 24px; padding: 11px 16px; box-shadow: 0 2px 10px rgba(0,0,0,.05); }
.hs-box.inline { margin-bottom: 14px; }
.hs-ic { width: 18px; height: 18px; flex: 0 0 auto; }
.hs-box input { flex: 1; border: none; outline: none; font-size: 14px; margin-left: 10px; background: transparent; }
.hs-btn { color: var(--brand); font-size: 14px; font-weight: 600; flex: 0 0 auto; }

.banner-wrap { position: relative; margin-top: 14px; border-radius: 18px; overflow: hidden; box-shadow: 0 6px 20px rgba(200,90,50,.14); }
.banner-track { display: flex; transition: transform .45s cubic-bezier(.4,0,.2,1); }
.slide { flex: 0 0 100%; height: 146px; padding: 24px 22px; color: #fff; position: relative; overflow: hidden; }
.slide-red { background: linear-gradient(120deg,#e24b4a,#f97316 70%); }
.slide-orange { background: linear-gradient(120deg,#fb923c,#fdba74); }
.slide-blue { background: linear-gradient(120deg,#f97316,#fdba74); }
.slide-tt { font-size: 25px; font-weight: 800; letter-spacing: 1px; }
.slide-sub { font-size: 14px; opacity: .94; margin-top: 8px; }
.slide-deco { position: absolute; right: -30px; top: -30px; width: 150px; height: 150px; border-radius: 50%; background: rgba(255,255,255,.12); }
.dots { position: absolute; bottom: 10px; left: 0; right: 0; display: flex; justify-content: center; gap: 6px; }
.dots i { width: 6px; height: 6px; border-radius: 50%; background: rgba(255,255,255,.55); }
.dots i.on { background: #fff; width: 14px; border-radius: 3px; }

.notice { display: flex; align-items: center; gap: 8px; background: #fff8e6; color: #a8760a;
  border-radius: 12px; padding: 11px 14px; margin-top: 14px; font-size: 13px; overflow: hidden; }
.notice.small { margin: 0 0 14px; }
.notice-ic { width: 16px; height: 16px; fill: #f2a209; flex: 0 0 auto; }
.notice-body { flex: 1; overflow: hidden; }
.notice-track { white-space: nowrap; display: inline-block; }
.notice-track.rolling { animation: marquee 16s linear infinite; }
.notice-track.rolling span { margin-right: 48px; }
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }

.grid-box { background: #fff; border-radius: 18px; margin-top: 14px; padding: 18px 8px 10px;
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px 0; }
.grid-item { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.grid-ic { width: 48px; height: 48px; border-radius: 14px; display: flex; align-items: center; justify-content: center; }
.grid-ic svg { width: 26px; height: 26px; }
.grid-name { font-size: 13px; color: #4b5158; }

.join-banner { margin-top: 16px; border-radius: 18px; padding: 20px;
  background: linear-gradient(120deg,#2b2622,#4a3b32);
  display: flex; align-items: center; gap: 12px; color: #fff; }
.jb-left { flex: 1; }
.jb-tt { font-size: 19px; font-weight: 800; line-height: 1.35; }
.jb-sub { font-size: 12.5px; opacity: .93; margin-top: 6px; }
.jb-btn { background: linear-gradient(135deg,#ffe066,#ffb703); color: #7a4a00; font-weight: 800;
  padding: 12px 22px; border-radius: 24px; font-size: 16px; flex: 0 0 auto; }

.sec-head { display: flex; align-items: center; margin: 22px 2px 12px; font-size: 17px; font-weight: 700; }
.sh-line { width: 4px; height: 17px; background: var(--brand); border-radius: 2px; margin-right: 8px; }
.sh-more { margin-left: auto; font-size: 13px; color: var(--sub); font-weight: 400; }

/* ============ 通用列表行 ============ */
.list-box { background: #fff; border-radius: 18px; overflow: hidden; }
.row { display: flex; align-items: center; gap: 14px; padding: 15px 16px; border-bottom: 1px solid #f4f5f7; }
.row:last-child { border-bottom: none; }
.row-logo { width: 52px; height: 52px; border-radius: 14px; background: #fff6f2; display: flex;
  align-items: center; justify-content: center; font-size: 26px; flex: 0 0 auto; overflow: hidden; }
.row-logo-img { width: 100%; height: 100%; object-fit: cover; border-radius: 14px; display: block; }
.row-logo img { width: 100%; height: 100%; object-fit: cover; border-radius: 14px; display: block; }
.row-body { flex: 1; min-width: 0; }
.row-name { font-size: 16px; font-weight: 600; display: flex; align-items: center; gap: 6px; }
.row-sub { font-size: 13px; color: var(--sub); margin-top: 5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.row-pay { font-size: 14px; color: var(--brand); margin-top: 6px; }
.row-pay b { font-size: 17px; }
.row-right { display: flex; flex-direction: column; align-items: flex-end; gap: 5px; flex: 0 0 auto; }
.row-time { font-size: 12px; color: #b6bcc6; }
.row-arrow { color: #c8cdd6; font-size: 20px; line-height: 1; }
.row-enter { font-size: 13px; color: #4b8bf5; }
.rr-no { width: 24px; text-align: center; font-weight: 700; color: var(--sub); flex: 0 0 auto; }

/* 4 格拼图头像 */
.quad { width: 52px; height: 52px; border-radius: 14px; overflow: hidden; flex: 0 0 auto;
  display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; gap: 1px; background: #fff; }
.quad span { display: flex; align-items: center; justify-content: center; font-size: 15px; line-height: 1; }
/* 群真实头像图 */
.quad-img { padding: 0; }
.quad-img img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* 宫格真实图标 */
.grid-ic .grid-img { width: 100%; height: 100%; object-fit: contain; border-radius: 14px; }

/* 轮播真实海报图 + 遮罩（保证文字可读） */
.slide-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.slide-mask { position: absolute; inset: 0; z-index: 1; background: linear-gradient(120deg, rgba(0,0,0,.42), rgba(0,0,0,.12)); }
.slide-tt, .slide-sub, .slide-deco { position: relative; z-index: 2; }

/* ============ 子页头 ============ */
.sub-head { display: flex; align-items: center; height: 52px; padding: 0; }
.sub-head.dark .btn-back, .sub-head.dark .sub-tt { color: #fff; }
.btn-back { background: none; border: none; color: #4b5158; font-size: 24px; line-height: 1; padding: 0 10px 0 0; }
.sub-tt { flex: 1; font-size: 18px; font-weight: 600; }
.sub-right { width: 28px; }
.sub-tip { font-size: 13px; color: var(--sub); padding: 0 2px 14px; line-height: 1.7; }
.sub-tip.official-tip { font-size: 15px; font-weight: 600; color: #333; line-height: 1.6; }

/* ============ 群详情 ============ */
.chat-card { margin-bottom: 16px; }
.chat-top { display: flex; align-items: center; gap: 14px; }
.chat-name { font-size: 19px; font-weight: 700; }
.chat-meta { font-size: 13px; color: var(--sub); margin-top: 12px; }
.chat-desc { font-size: 14px; color: #444; margin-top: 10px; line-height: 1.7; }
.chat-join, .chat-notice { margin-bottom: 16px; }
.cj-h { font-size: 16px; font-weight: 600; margin-bottom: 12px; }
.cj-row { display: flex; justify-content: space-between; align-items: center; background: #f7f8fa;
  border-radius: 12px; padding: 13px 15px; margin-bottom: 14px; font-size: 14px; }
.cj-row b { color: var(--brand); }
.rule-list { margin: 0; padding-left: 20px; font-size: 14px; color: #555; line-height: 1.8; }
.rule-list li { margin: 7px 0; }

/* ============ 内容页 ============ */
.info-page { margin: 0 -16px; }
.info-page .sub-head { padding: 0 16px; position: absolute; z-index: 3; width: 100%; max-width: 480px; }
.info-hero { padding: 54px 24px 32px; color: #fff; text-align: center; border-radius: 0 0 26px 26px; }
.ih-sub { font-size: 13px; opacity: .9; }
.ih-emoji { font-size: 54px; margin: 14px 0 10px; }
.ih-tt { font-size: 26px; font-weight: 800; }
.ih-desc { font-size: 14px; opacity: .93; margin-top: 12px; line-height: 1.7; }
.info-body { padding: 18px 16px 24px; }
.ib-h { font-size: 17px; font-weight: 700; margin: 22px 0 14px; }
.ib-notice { background: #fff8e6; color: #a8760a; border-radius: 14px; padding: 14px 16px; font-size: 13.5px; margin-bottom: 16px; line-height: 1.7; }
.ib-points { display: flex; flex-direction: column; gap: 14px; }
.ib-point { background: #fff; border-radius: 18px; padding: 18px; display: flex; gap: 14px; }
.ibp-emoji { width: 48px; height: 48px; border-radius: 50%; background: #eef4ff; display: flex;
  align-items: center; justify-content: center; font-size: 24px; flex: 0 0 auto; }
.ibp-tt { font-size: 16px; font-weight: 700; margin-bottom: 7px; }
.ibp-line { font-size: 14px; color: #5d646c; line-height: 1.85; }
.ib-steps { display: flex; flex-direction: column; gap: 14px; margin-top: 16px; }
.ib-step { background: #fff; border-radius: 18px; padding: 17px 18px; display: flex; gap: 14px; align-items: flex-start; }
.ibs-no { width: 40px; height: 40px; border-radius: 12px; background: linear-gradient(135deg,var(--brand),var(--brand2));
  color: #fff; font-weight: 800; font-size: 16px; display: flex; align-items: center; justify-content: center; flex: 0 0 auto; }
.ibs-tt { font-size: 16px; font-weight: 700; }
.ibs-desc { font-size: 14px; color: #5d646c; margin-top: 6px; line-height: 1.8; }
.ib-quote { background: #fff; border-radius: 18px; padding: 18px; margin-bottom: 14px; }
.ibq-tt { font-size: 15.5px; font-weight: 700; margin-bottom: 10px; color: var(--brand); }
.ibq-tx { font-size: 14.5px; color: #4b5158; line-height: 1.95; }
.ib-stats { display: flex; background: #fff; border-radius: 18px; padding: 20px 0; margin-bottom: 14px; }
.ibs-item, .ib-stats .ibs { flex: 1; text-align: center; }
.ib-stats .ibs-v { font-size: 22px; font-weight: 800; color: var(--brand); }
.ib-stats .ibs-l { font-size: 13px; color: var(--sub); margin-top: 5px; }
.ib-qr { background: #fff; border-radius: 18px; padding: 24px; text-align: center; }
.ibq-tip { font-size: 16px; font-weight: 600; margin-top: 14px; }
.ibq-sub { font-size: 13px; color: var(--sub); margin-top: 6px; }
.ib-qr .btn-mini { margin-top: 16px; }
.ib-phone { background: #fff; border-radius: 18px; padding: 18px; display: flex; align-items: center;
  justify-content: center; gap: 12px; }
.ibp-label { font-size: 14px; color: var(--sub); }
.ib-phone b { font-size: 20px; color: var(--brand); letter-spacing: .5px; }

/* 伪二维码 */
.qr { width: 150px; height: 150px; margin: 16px auto 0; display: grid;
  grid-template-columns: repeat(21, 1fr); grid-template-rows: repeat(21, 1fr);
  padding: 8px; background: #fff; border-radius: 10px; border: 1px solid var(--line); }
.qr i { background: transparent; }
.qr i.on { background: #1f2329; }

/* ============ 个人中心 ============ */
.me-top { display: flex; align-items: center; gap: 16px; padding: 24px 2px 20px; }
.me-avatar { width: 66px; height: 66px; border-radius: 50%; background: #fff; display: flex;
  align-items: center; justify-content: center; font-size: 34px; box-shadow: 0 2px 10px rgba(0,0,0,.08); }
.me-info { flex: 1; }
.me-name { font-size: 20px; font-weight: 700; }
.me-tag { display: inline-block; margin-top: 8px; font-size: 12px; color: var(--sub);
  border: 1px solid #d8dce2; border-radius: 12px; padding: 2px 10px; }
.me-tag.on { color: var(--brand); border-color: var(--brand); background: #fff5f2; font-weight: 600; }
/* 个人中心位置1：未完成微信授权时的授权入口（授权完成后整块隐藏） */
.me-tag.me-auth { color: var(--brand); border-color: var(--brand); background: #fff5f2; cursor: pointer; }
.me-tag.me-auth:active { opacity: .7; }
.me-more { font-size: 13px; color: var(--sub); }
/* 个人中心：头像可点 → 授权同步微信昵称/头像 */
.me-avatar { cursor: pointer; border: 2px solid transparent; transition: border-color .15s; }
.me-avatar:hover { border-color: var(--brand); }
.me-avatar img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; display: block; }
.me-sync { margin-top: 8px; font-size: 12px; color: var(--brand); cursor: pointer; }
.me-sync:active { opacity: .7; }

.me-card { background: linear-gradient(135deg, var(--brand), var(--brand2)); border-radius: 20px; padding: 22px 0;
  display: flex; color: #fff; margin-bottom: 16px; box-shadow: 0 8px 22px rgba(249,115,22,.25); }
.mc-col { flex: 1; text-align: center; }
.mc-div { width: 1px; background: rgba(255,255,255,.3); }
.mc-l { font-size: 13px; opacity: .93; }
.mc-v { font-size: 28px; font-weight: 800; margin: 4px 0; }
.mc-a { font-size: 13px; opacity: .96; }

.me-invite { background: #fff; border-radius: 18px; padding: 16px 18px; display: flex;
  align-items: center; font-size: 15px; margin-bottom: 16px; }
.me-invite b { color: var(--brand); }
.mi-go { margin-left: auto; color: var(--sub); font-size: 13px; }

.btn-green { width: 100%; border: none; border-radius: 26px; padding: 15px; font-size: 16.5px;
  font-weight: 700; color: #fff; background: linear-gradient(135deg, var(--brand), var(--brand2));
  box-shadow: 0 8px 18px rgba(249,115,22,.28); margin-bottom: 18px; }

.me-menu { background: #fff; border-radius: 18px; overflow: hidden; margin-bottom: 16px; }
.mm-item { display: flex; align-items: center; gap: 14px; padding: 17px 18px; font-size: 15.5px;
  border-bottom: 1px solid #f4f5f7; }
.mm-item:last-child { border-bottom: none; }
.mm-ic { font-size: 18px; width: 24px; text-align: center; }
.mm-ar { margin-left: auto; color: #c8cdd6; font-size: 20px; }

.me-follow { background: #fff; border-radius: 18px; padding: 16px 18px; display: flex;
  align-items: center; gap: 14px; }
.mf-tt { font-size: 15.5px; font-weight: 600; }
.mf-sub { font-size: 13px; color: var(--sub); margin-top: 6px; max-width: 160px; }
.mf-qr { width: 96px; height: 96px; margin-left: auto; border-radius: 10px; flex: 0 0 auto;
  border: 1px solid var(--line); background: #fff; overflow: hidden;
  display: flex; align-items: center; justify-content: center; }
.mf-qr img { width: 100%; height: 100%; object-fit: contain; }
.mf-qr-tip { font-size: 11px; color: #b6bcc6; text-align: center; line-height: 1.4; }
.mf-hint { font-size: 11px; color: var(--brand, #f97316); margin-top: 7px; line-height: 1.3; }
.mf-done { flex: 0 0 auto; font-size: 12px; color: #07b95a; background: #e7f9ef; border-radius: 999px; padding: 5px 11px; font-weight: 600; }
.me-foot { text-align: center; font-size: 12px; color: #b6bcc6; padding: 24px 0 6px; }

/* ============ 会员 ============ */
.page-h { font-size: 21px; margin: 18px 0 16px; }
.vip-head { padding: 20px 2px 14px; }
.vip-head h2 { margin: 0 0 8px; font-size: 23px; }
.vip-state { font-size: 13px; color: var(--sub); }
.vip-state.on { color: var(--ok); }
.vip-benefits-top { background: #fff; border-radius: 18px; padding: 16px 18px; margin-bottom: 16px; }
.vbt { font-size: 14.5px; color: #4b5158; line-height: 2.1; }
.vip-bargain-left { background: #fff7f1; border: 1px solid #ffd9bf; color: #c2410c; border-radius: 14px;
  padding: 11px 14px; font-size: 13px; margin-bottom: 16px; }
.vip-bargain-left b { color: var(--brand, #f97316); font-size: 15px; }
.vip-list { display: flex; flex-direction: column; gap: 16px; }
.vip-card { position: relative; border: 1.5px solid var(--brand); }
.vip-card.rec { border-color: var(--brand); }
.rec-badge { position: absolute; top: -1px; right: 16px; background: var(--brand); color: #fff;
  font-size: 12px; padding: 3px 12px; border-radius: 0 0 10px 10px; font-weight: 600; }
.vip-name { font-size: 18px; font-weight: 600; }
.vip-price { margin: 10px 0; }
.vip-price b { font-size: 30px; color: var(--brand); }
.vip-price s { color: var(--sub); margin-left: 10px; font-size: 14px; }
.vip-desc { font-size: 13.5px; color: var(--sub); }
.vip-rebate { display: inline-block; margin: 8px 0; padding: 4px 14px; font-size: 13px; font-weight: 600;
  color: var(--brand); background: rgba(249,115,22,.08); border: 1px solid rgba(249,115,22,.25); border-radius: 20px; }
.vip-benefits { margin: 14px 0; padding-left: 20px; font-size: 14.5px; color: #444; line-height: 1.9; }
.vip-benefits li { margin: 7px 0; }
.vip-btn { margin-top: 10px; }
.vip-tip { font-size: 13px; color: var(--sub); margin-top: 20px; line-height: 1.75; }

/* ============ 排行榜 ============ */
.rank-hero { margin: 0 -16px; background: linear-gradient(160deg, var(--brand), var(--brand2)); color: #fff;
  text-align: center; padding: 24px 0 20px; border-radius: 0 0 24px 24px; }
.rh-svg { width: 130px; height: 66px; }
.rh-tt { font-size: 24px; font-weight: 800; margin-top: 6px; letter-spacing: 1px; }
.rank-tabs { display: flex; gap: 12px; margin: 16px 0; }
.rt { padding: 8px 20px; background: #fff; border-radius: 20px; font-size: 14px; color: var(--sub); border: 1px solid var(--line); }
.rt.active { background: var(--brand); color: #fff; border-color: var(--brand); font-weight: 600; }
.rank-period { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; }
.rp-l { font-size: 14px; color: #fff; background: #b9c0cb; padding: 4px 14px; border-radius: 14px; }
.rp-l i { font-style: normal; }
.rp-v { font-size: 14px; font-weight: 700; color: var(--brand); }
.rank-stats { background: #fff; border-radius: 18px; display: flex; padding: 20px 0; margin-bottom: 16px; }
.rs { flex: 1; text-align: center; }
.rs-div { width: 1px; background: var(--line); }
.rs-tt { font-size: 15.5px; font-weight: 600; }
.rs-g { font-size: 13px; color: #ea580c; margin-top: 7px; }
.rank-top3 { display: flex; flex-direction: column; gap: 14px; margin-bottom: 16px; }
.rt3-card { display: flex; align-items: center; gap: 14px; padding: 17px 18px; border-radius: 18px;
  background: linear-gradient(120deg, var(--brand), var(--brand2) 80%); color: #fff; position: relative;
  box-shadow: 0 8px 20px rgba(249,115,22,.22); }
.rt3-card:nth-child(2) { background: linear-gradient(120deg,#fb923c,#fdba74 80%); }
.rt3-card:nth-child(3) { background: linear-gradient(120deg,#fdba74,#fed7aa 80%); }
.medal { width: 30px; height: 30px; border-radius: 50%; display: flex; align-items: center;
  justify-content: center; font-size: 12px; font-weight: 800; flex: 0 0 auto; }
.medal-g { background: linear-gradient(135deg,#ffd75e,#f5a623); color: #7a4a00; }
.medal-s { background: linear-gradient(135deg,#e2e8f0,#b6c0cc); color: #4b5158; }
.medal-b { background: linear-gradient(135deg,#e8b98a,#c98a4b); color: #5c3410; }
.rt3-avatar { width: 46px; height: 46px; border-radius: 50%; background: rgba(255,255,255,.24);
  display: flex; align-items: center; justify-content: center; font-size: 23px; flex: 0 0 auto; }
.rt3-avatar img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; display: block; }
.rt3-body { flex: 1; min-width: 0; }
.rt3-name { font-size: 16px; font-weight: 700; }
.rt3-sub { font-size: 13px; opacity: .92; margin-top: 4px; }
.rt3-val { font-size: 13px; flex: 0 0 auto; }
.rt3-val b { font-size: 18px; }
.rank-rest { background: #fff; border-radius: 18px; overflow: hidden; margin-bottom: 16px; }
.rank-note { background: #fdf6e3; color: #a8760a; border-radius: 18px; padding: 16px 18px;
  font-size: 13.5px; line-height: 1.85; }

/* ============ 表单 / 按钮 ============ */
.form { display: flex; flex-direction: column; gap: 16px; }
.form label { display: flex; flex-direction: column; font-size: 14px; color: #444; gap: 8px; }
.form input, .form select, .form textarea { border: 1px solid var(--line); border-radius: 12px;
  padding: 13px 14px; font-size: 15px; outline: none; font-family: inherit; background: #fff; }
.form-tip { font-size: 13px; color: var(--sub); }
.btn-primary { background: linear-gradient(135deg, var(--brand), var(--brand2)); color: #fff;
  border: none; border-radius: 14px; padding: 14px 22px; font-size: 16px; font-weight: 600;
  width: 100%; cursor: pointer; box-shadow: 0 6px 16px rgba(249,115,22,.24); }
.btn-primary:disabled { opacity: .6; box-shadow: none; }
.btn-ghost { background: #fff; color: var(--sub); border: 1px solid var(--line); border-radius: 14px;
  padding: 13px; width: 100%; margin-top: 20px; font-size: 15px; }
.btn-mini { background: #fff3ef; color: var(--brand); border: none; border-radius: 8px; padding: 6px 16px; font-size: 13px; }
.card { background: var(--card); border-radius: 18px; padding: 18px; box-shadow: 0 2px 12px rgba(0,0,0,.05); }
.card.mini { padding: 14px 16px; margin-bottom: 12px; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; }
.pub-tip { margin-bottom: 16px; }
.pt-h { font-size: 16px; font-weight: 700; }
.pt-tx { font-size: 14px; color: var(--sub); margin-top: 8px; line-height: 1.8; }
.pt-a { font-size: 14px; color: var(--brand); margin-top: 8px; }
.my-proj { margin-top: 20px; }
.my-proj-h { font-size: 14px; color: var(--sub); margin-bottom: 12px; }
.mp-name { font-weight: 500; flex: 1 1 auto; min-width: 0; word-break: break-all; }
.mp-state { font-size: 13px; flex: 0 0 auto; }
.mp-del { flex: 0 0 auto; font-size: 12px; line-height: 1; padding: 5px 10px; color: #e24b4a; background: #fff2f2; border: 1px solid #f0c5c5; border-radius: 6px; }
.mp-del:disabled { opacity: .6; }
.state-online { color: var(--ok); } .state-pending { color: var(--warn); }
.state-rejected { color: #e54d42; } .state-offline { color: var(--sub); }
.mp-reason { width: 100%; font-size: 13px; color: #e54d42; margin-top: 6px; }

/* ============ 项目详情 ============ */
.detail { padding-bottom: 20px; }
.detail-ic { font-size: 48px; text-align: center; }
.detail-ic-img { width: 84px; height: 84px; object-fit: cover; border-radius: 16px; display: inline-block;
  vertical-align: middle; background: #fff6f2; }
.detail h2 { text-align: center; margin: 8px 0; font-size: 19px; }
.detail-meta { text-align: center; color: var(--sub); font-size: 12px; }
.detail-time { text-align: center; color: #b6bcc6; font-size: 11.5px; margin-top: 4px; }
.detail-pay { text-align: center; margin: 14px 0; font-size: 17px; }
.detail-pay b { color: var(--brand); font-size: 26px; }
.detail-desc { background: #fff; border-radius: 16px; padding: 16px; color: #444; white-space: pre-wrap; font-size: 15px; line-height: 1.85; }
.lock-box, .link-box { background: #fff; border-radius: 18px; padding: 26px; text-align: center; margin-top: 18px; }
.lock-ic { font-size: 42px; }
.lock-box div { margin: 10px 0; color: var(--sub); font-size: 15px; }
.lock-sub { font-size: 13.5px; }
.link-box .link-label { color: var(--sub); font-size: 13.5px; }
.link-value { background: #f5f6f8; border-radius: 12px; padding: 14px; margin: 12px 0;
  word-break: break-all; font-size: 14.5px; }
.contact-line { display: flex; align-items: center; gap: 10px; background: #f5f6f8; border-radius: 12px;
  padding: 13px 15px; margin-top: 10px; text-align: left; }
.contact-line .cl-k { flex: 0 0 auto; font-size: 13.5px; color: var(--sub); }
.contact-line .cl-v { flex: 1; font-size: 15px; color: #2b3138; word-break: break-all; }
.contact-line .cl-btn { flex: 0 0 auto; border: none; background: var(--brand); color: #fff;
  font-size: 13px; padding: 7px 16px; border-radius: 16px; }
.cats { display: flex; gap: 10px; overflow-x: auto; padding: 0 0 14px; }
.cat { flex: 0 0 auto; padding: 7px 16px; background: #fff; border-radius: 18px; font-size: 13.5px;
  color: var(--sub); border: 1px solid var(--line); }
.cat.active { background: var(--brand); color: #fff; border-color: var(--brand); font-weight: 600; }
.tag-new { background: #f97316; color: #fff; font-size: 12px; padding: 3px 9px; border-radius: 7px; margin-left: 6px; font-weight: 700; }
.tag-hot { background: #fb923c; color: #fff; font-size: 12px; padding: 3px 9px; border-radius: 7px; margin-left: 6px; font-weight: 700; }
.tag-guar { background: linear-gradient(100deg,#fb923c,#f97316); color: #fff; font-size: 12px; padding: 3px 9px; border-radius: 7px; margin-left: 6px; font-weight: 700; }
/* 【官】官方资源：金色徽标，与 热/新/保 的橙色系区分开，突出权威性 */
.tag-offi { background: linear-gradient(100deg,#fbbf24,#b45309); color: #fff; font-size: 12px; padding: 3px 9px; border-radius: 7px; margin-left: 6px; font-weight: 700; }
.sc-qr { text-align: center; margin: 18px 0; }
.sc-qr img { width: 200px; height: 200px; object-fit: contain; border-radius: 16px; background: #fff; }
/* 项目详情：对接二维码（仅会员可见）*/
.proj-qr { text-align: center; margin: 18px 0 4px; }
.proj-qr img { width: 200px; height: 200px; object-fit: contain; border-radius: 14px; background: #fff; border: 1px solid var(--line); }
.proj-qr .pq-tip { font-size: 13.5px; color: var(--sub); margin-top: 10px; }

/* ============ 项目详情（海报营销风 B）============ */
.pdb { margin: 0 -16px; }
.pdb-hero { background: var(--brand); padding: 14px 20px 38px; }
.pdb-nav { display: flex; align-items: center; justify-content: space-between; color: #fff; font-size: 14px; }
.pdb-nav .bk { font-size: 22px; line-height: 1; }
.pdb-nav .pdb-share { font-size: 14px; cursor: pointer; padding: 2px 2px 2px 10px; }
.pdb-nav .pdb-share:active { opacity: .65; }
.pdb-brand { display: flex; align-items: center; gap: 12px; margin-top: 20px; }
.pdb-logo { width: 54px; height: 54px; border-radius: 14px; background: #fff; overflow: hidden;
  display: flex; align-items: center; justify-content: center; font-size: 26px; flex: 0 0 auto; }
.pdb-logo-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pdb-name { color: #fff; font-size: 20px; font-weight: 600; line-height: 1.4; }
.pdb-pay { display: flex; align-items: baseline; gap: 10px; margin-top: 18px; }
.pdb-pay .l { color: #ffd9cf; font-size: 13px; }
.pdb-pay .n { color: #fff; font-size: 38px; font-weight: 700; line-height: 1; }
.pdb-pay .u { color: #ffd9cf; font-size: 13px; }
.pdb-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.pdb-tags span { background: rgba(255,255,255,.24); color: #fff; font-size: 12.5px; padding: 3px 11px; border-radius: 7px; }
.pdb-tags span.on { background: #fff; color: var(--brand); font-weight: 700; }
.pdb-tags span.offi { background: #422006; color: #fcd34d; font-weight: 700; }
.pdb-body { padding: 0 16px 20px; }
.pdb-card { margin-top: -24px; background: #fff; border-radius: 22px; padding: 24px 20px;
  box-shadow: 0 10px 26px rgba(200,90,50,.12); }
.pdb-desc { font-size: 15px; line-height: 2.05; color: var(--text); text-align: center; white-space: pre-wrap;
  border: 2px solid #fdba74; border-radius: 18px; padding: 22px 20px;
  background: linear-gradient(180deg,#fff7ed,#fff); position: relative; overflow: hidden;
  box-shadow: 0 0 0 4px rgba(249,115,22,.07); }
.pdb-desc::before { content: ''; position: absolute; left: 0; top: 0; right: 0; height: 4px;
  background: linear-gradient(90deg, var(--brand), var(--brand2)); }
.pdb-dash { border-top: 1px dashed var(--line); margin: 20px 0 18px; }
.pdb-upd { font-size: 12.5px; color: #b6bcc6; text-align: center; }
/* 详情页二维码卡片：排在「对接方式」下方，二维码放大并居中（2026-09-27 老板要求顺序改为 2/3/1） */
.pdb-qcard { background: #fff; border-radius: 18px; padding: 22px 20px 20px; margin-top: 16px;
  text-align: center; box-shadow: 0 8px 22px rgba(200,90,50,.10); }
.pdb-qcard .pdb-qt { font-size: 14.5px; font-weight: 600; color: var(--text); line-height: 1.7; }
/* 覆盖全局 .qr 的 150px 伪二维码样式：放大到 min(64vw,240px) 并水平居中 */
.pdb-qcard .qr { display: block; width: min(64vw, 240px); max-width: 100%; height: auto;
  aspect-ratio: 1 / 1; margin: 16px auto 0; padding: 8px; object-fit: contain;
  border-radius: 14px; border: 1px solid var(--line); background: #fff;
  box-shadow: 0 6px 18px rgba(200,90,50,.10); }
.pdb-sec { background: #fff; border-radius: 18px; padding: 18px; margin-top: 16px; }
.pdb-sec .h { display: flex; align-items: center; justify-content: space-between; font-size: 15px;
  font-weight: 600; color: var(--text); margin-bottom: 6px; }
.pdb-sec .h i { font-style: normal; font-size: 12.5px; color: var(--sub); font-weight: 400; }
.pdb-sec .contact-line { background: #f7f8fa; }
/* 佣金规则说明：全站固定文案，详情页与分享页共用；小字号、低存在感，不抢主视觉 */
.rules-box { background: #fff; border-radius: 16px; padding: 14px 16px; margin-top: 16px;
  border: 1px dashed #e4e7eb; }
.rules-box .rt { font-size: 13px; font-weight: 500; color: #6b7280; margin-bottom: 8px; }
.rules-box .ri { display: flex; gap: 7px; font-size: 12.5px; line-height: 1.95; color: var(--sub); }
.rules-box .ri + .ri { margin-top: 5px; }
.rules-box .ri i { font-style: normal; flex: 0 0 auto; color: var(--brand); font-weight: 500; }
.rules-box .ri span { flex: 1; }
.pdb-notify { background: #fff; border-radius: 18px; padding: 17px 18px; margin-top: 16px;
  display: flex; align-items: center; gap: 12px; }
.pdb-notify .nt { flex: 1; min-width: 0; }
.pdb-notify .nt b { display: block; font-size: 15px; color: var(--text); }
.pdb-notify .nt span { display: block; font-size: 12.5px; color: var(--sub); margin-top: 5px; line-height: 1.6; }
.pdb-sw { position: relative; width: 46px; height: 26px; border-radius: 13px; background: #d8dde4;
  flex: 0 0 auto; transition: background .18s; }
.pdb-sw.on { background: var(--brand); }
.pdb-sw::after { content: ''; position: absolute; top: 2px; left: 2px; width: 22px; height: 22px;
  border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.15); transition: left .18s; }
.pdb-sw.on::after { left: 22px; }
.pdb-actions { display: flex; gap: 12px; margin-top: 18px; }
.pdb-actions button { border: none; border-radius: 14px; padding: 15px; font-size: 15px; }
.pdb-actions .gh { flex: 1; background: #fff; color: var(--text); border: 1px solid var(--line); }
.pdb-actions .pr { flex: 1.4; background: var(--brand); color: #fff; font-weight: 600; }
.pdb .free-box { margin-top: 16px; }
.pdb .lock-box { margin-top: 16px; }

/* ============ 我的（小节 / 提现 / 明细）============ */
.sec { background: #fff; border-radius: 18px; padding: 18px; margin-bottom: 16px; }
.sec-h { font-size: 16px; font-weight: 600; margin-bottom: 14px; }
.sec .empty { padding: 24px 0; }
.earn-amt { color: var(--brand); font-weight: 600; }
.wd-card { text-align: center; }
.wd-l { font-size: 14px; color: var(--sub); }
.wd-v { font-size: 40px; font-weight: 800; color: var(--brand); margin: 10px 0 22px; }
.wd-row { display: flex; gap: 12px; margin-bottom: 16px; }
.wd-input { width: 100%; box-sizing: border-box; border: 1px solid var(--line); border-radius: 12px; padding: 14px 15px; outline: none; text-align: left; color: var(--text); background: #fff; line-height: 1.45; font-size: 15px; }
.wd-input:focus { border-color: var(--brand); }
.wd-row .wd-input { flex: 1; width: auto; }
.wd-name { margin-top: 10px; margin-bottom: 18px; }
.agree { font-size: 14.5px; color: #4b5158; line-height: 2; }
.agree h3 { font-size: 18px; color: var(--text); margin: 0 0 14px; }
.agree p { margin: 12px 0; }
.agree-foot { color: var(--sub); font-size: 13px; margin-top: 20px; text-align: center; }
.service-card { text-align: center; }
.sc-emoji { font-size: 48px; }
.sc-tt { font-size: 18px; font-weight: 700; margin: 8px 0 18px; }
.sc-row { display: flex; justify-content: space-between; background: #f7f8fa; border-radius: 14px;
  padding: 15px 17px; margin-bottom: 14px; font-size: 15.5px; }
.sc-row b { color: var(--brand); }
.sc-row + .btn-primary { margin-top: 14px; }
.sc-qr-wrap { margin: 6px 0 18px; }
.sc-qr-wrap img { width: 200px; height: 200px; object-fit: contain; border-radius: 16px; background: #fff; }
.sc-qr-blank { width: 200px; height: 200px; margin: 0 auto; border: 2px dashed #ffc8a8; border-radius: 16px;
  display: flex; align-items: center; justify-content: center; text-align: center;
  color: #d69a76; font-size: 14px; line-height: 1.6;
  background: repeating-linear-gradient(45deg,#fff8f3,#fff8f3 10px,#fff2e8 10px,#fff2e8 20px); }
.promo-card { text-align: center; }
.promo-code { font-size: 36px; font-weight: 800; color: var(--brand); letter-spacing: 4px; }
.promo-sub { font-size: 13px; color: var(--sub); margin: 8px 0 6px; }
.promo-stat { font-size: 14.5px; color: #4b5158; margin: 16px 0; }
.promo-stat b { color: var(--brand); }

/* ============ 分享（落地页 / 分享弹层）============ */
.share-detail { padding-top: 14px; }
/* 分享落地页顶部品牌条：点一下回系统首页（解决「从分享链接进来后回不到首页」）*/
.share-brand { display: flex; align-items: baseline; gap: 8px; padding: 2px 2px 14px; cursor: pointer; }
.share-brand .sb-logo { font-size: 17px; font-weight: 800; color: var(--brand); letter-spacing: .5px; }
.share-brand .sb-sub { font-size: 12px; color: var(--sub); }
.share-badge { display: inline-block; margin: 3px 0 14px; font-size: 13px; color: #fff;
  background: linear-gradient(135deg, #fb923c, #f97316); padding: 5px 16px; border-radius: 22px; }
.share-mask { position: fixed; left: 0; top: 0; right: 0; bottom: 0; background: rgba(0,0,0,.45);
  display: flex; align-items: flex-end; z-index: 999; }
.share-sheet { width: 100%; box-sizing: border-box; background: #fff; border-radius: 20px 20px 0 0;
  padding: 22px 20px 28px; animation: shareUp .22s ease; }
@keyframes shareUp { from { transform: translateY(100%); } to { transform: translateY(0); } }
.share-h { font-size: 18px; font-weight: 700; color: var(--text); }
.share-tip { font-size: 12px; color: var(--sub); margin: 8px 0 12px; line-height: 1.7; }
.share-tip b { color: var(--brand); }
.share-url { width: 100%; box-sizing: border-box; border: 1px solid var(--line); border-radius: 8px;
  padding: 10px; font-size: 12px; color: #333; background: #f7f8fa; }
/* 砍价固定话术：只给一段可复制文案，不发二维码 / 网址链接 */
.share-text { width: 100%; box-sizing: border-box; border: 1px solid var(--line); border-radius: 8px;
  padding: 10px; font-size: 13px; line-height: 1.7; color: #333; background: #fff7ed;
  font-family: inherit; resize: none; }
.share-btns { display: flex; gap: 10px; margin-top: 14px; }
.share-btns .btn-primary { flex: 1; }
.share-btns .btn-ghost { flex: 0 0 36%; margin-top: 0; }
.share-wx { font-size: 12px; color: #b0b6bd; margin-top: 12px; text-align: center; }
/* 微信内 H5 的「转发引导」层：不给链接、不给二维码，只教用户点右上角 ··· */
.share-guide { text-align: center; }
.share-guide .sg-arrow { font-size: 30px; line-height: 1; color: var(--brand); margin-bottom: 4px; }
.share-guide .sg-main { font-size: 17px; font-weight: 800; color: var(--text); margin-top: 12px; }
.share-guide .sg-main b { color: var(--brand); letter-spacing: 1px; }
.share-guide .sg-sub { font-size: 12px; color: var(--sub); margin-top: 8px; line-height: 1.7; }
.share-guide .sg-sub #txSharePromo { color: var(--brand); }
.share-guide .btn-primary { width: 100%; margin-top: 18px; }

/* ===== 项目图标选择器（品牌库下拉 / 上传 / 域名获取）===== */
.fld-block { font-size: 13.5px; color: #7b8694; margin: 8px 0 3px; font-weight: 600; }
.icon-pick { border: 1px solid #e6eaf0; border-radius: 16px; padding: 16px; background: #fafbfc; margin-top: 8px; }
.ip-row { display: flex; align-items: center; gap: 16px; }
.ip-preview { width: 64px; height: 64px; border-radius: 14px; background: #fff; border: 1px solid #e6eaf0; display: flex; align-items: center; justify-content: center; overflow: hidden; flex: 0 0 auto; }
.ip-preview img { width: 100%; height: 100%; object-fit: contain; }
.ip-preview .ip-ph { font-size: 13px; color: #9aa3af; }
.ip-btns { display: flex; gap: 10px; flex-wrap: wrap; }
.ip-fetch { display: flex; gap: 10px; margin-top: 14px; }
.ip-fetch input { flex: 1; padding: 11px 14px; border: 1px solid #d7dce5; border-radius: 12px; font-size: 14.5px; }
.logo-pop { margin-top: 14px; border: 1px solid #e6eaf0; border-radius: 16px; background: #fff; padding: 14px; }
.lp-head { display: flex; gap: 10px; margin-bottom: 12px; }
.lp-head input { flex: 1; padding: 11px 14px; border: 1px solid #d7dce5; border-radius: 12px; font-size: 14.5px; }
.lp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(84px, 1fr)); gap: 10px; max-height: 280px; overflow-y: auto; }
.lg-item { border: 1px solid #eef1f5; border-radius: 12px; padding: 9px 5px; text-align: center; cursor: pointer; background: #fff; transition: .15s; }
.lg-item:hover { border-color: var(--brand); background: #fff6f2; }
.lg-item img { width: 38px; height: 38px; object-fit: contain; border-radius: 8px; }
.lg-item span { display: block; font-size: 12px; color: #5a6373; margin-top: 6px; line-height: 1.25; }

/* ============ 项目投放引导页（底部【+】）============ */
.pub { margin: 0 -16px; padding-bottom: 12px; background: #fff8f3; }
.pub-hero { position: relative; padding: 24px 18px 32px; background:
  radial-gradient(120% 80% at 80% 0%, #ffe7d6 0%, #fff8f3 62%), #fff8f3; overflow: hidden; }
.phb { position: relative; z-index: 2; text-align: center; }
.phb-line { font-size: 60px; font-weight: 900; letter-spacing: 7px; line-height: 1.06;
  background: linear-gradient(180deg,#fb923c,#e8590c 78%); -webkit-background-clip: text; background-clip: text; color: transparent;
  text-shadow: 0 2px 0 rgba(255,255,255,.4); }
.phb-tag { display: inline-block; margin: 10px 0; padding: 7px 24px; border-radius: 7px; font-size: 18px; font-weight: 800;
  color: #fff; letter-spacing: 2px; transform: rotate(-2.5deg);
  background: linear-gradient(100deg,#f97316,#e8590c); box-shadow: 0 5px 14px rgba(249,115,22,.32); }
.pub-phone { position: relative; width: 292px; margin: 10px auto 0; }
.pub-phone-in { border: 7px solid #2b2b2f; border-radius: 28px; background: #fff; padding: 26px 17px 24px; box-shadow: 0 18px 34px rgba(160,90,40,.22); }
.pp-title { text-align: center; font-size: 17px; font-weight: 800; color: #2b2b2f; margin-bottom: 18px; }
.pp-bub { position: relative; display: flex; flex-direction: column; border-radius: 16px; padding: 14px 16px; margin-bottom: 14px; font-size: 15px; font-weight: 600; }
.pp-bub i { font-style: normal; font-weight: 800; margin-left: 5px; }
.pp-bub span { font-size: 13px; margin-top: 4px; font-weight: 400; opacity: .92; }
.b-y { background: #ffd85e; color: #7a4a00; box-shadow: 0 3px 8px rgba(255,190,60,.4); }
.b-b { background: #fff3e2; color: #b25a12; border: 1px solid #ffe0bd; }
.pp-coin { position: absolute; width: 34px; height: 34px; border-radius: 50%; background: linear-gradient(135deg,#ffd85e,#f5a623); color: #a35c00;
  font-size: 18px; font-weight: 800; line-height: 34px; text-align: center; box-shadow: 0 3px 8px rgba(230,160,40,.35); }
.pp-coin.c1 { right: -15px; top: 32px; }
.pp-coin.c2 { left: -17px; bottom: 46px; }

/* 投放页新增：价值点卡片条（替换原「手机样机 + 气泡」模块，规避与参照平台雷同） */
.pub-values { display: flex; gap: 10px; margin: 18px 0 4px; position: relative; z-index: 2; }
.pv { flex: 1; background: #fff; border-radius: 16px; padding: 14px 8px; text-align: center;
  box-shadow: 0 6px 16px rgba(200,120,70,.12); border: 1px solid #ffe7d6; }
.pv b { display: block; font-size: 17px; font-weight: 800; color: var(--brand); letter-spacing: .5px; }
.pv span { display: block; font-size: 12px; color: #8a7a70; margin-top: 4px; line-height: 1.4; }

.pub-sec { padding: 4px 16px 0; margin-top: 24px; }
.pub-pill { display: table; margin: 0 auto 16px; padding: 9px 30px; border-radius: 999px; font-size: 16.5px; font-weight: 800; letter-spacing: 1px;
  color: #fff; background: linear-gradient(100deg,#fb923c,#f97316); box-shadow: 0 6px 16px rgba(249,115,22,.30); }
.pill-mm { background: linear-gradient(100deg,#fdba74,#fb923c); letter-spacing: 0; font-size: 15px; }
.pill-flow { background: linear-gradient(100deg,#fb923c,#f97316); }
.pub-card { background: #fff; border-radius: 18px; padding: 20px 18px; box-shadow: 0 5px 18px rgba(200,120,70,.12); border: 1px solid #ffe7d6; }
.pub-about p { margin: 0 0 12px; font-size: 15px; line-height: 1.88; color: #5b5049; }
.pub-about p:last-child { margin-bottom: 0; }

.pub-wall { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; padding: 18px 14px; background: #fff; border-radius: 18px; border: 1px solid #ffe7d6; box-shadow: 0 5px 18px rgba(200,120,70,.10); }
.pw-item { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 7px; height: 74px;
  background: #fffdfb; border-radius: 14px; border: 1px solid #f4f0ec; }
.pw-item img { width: 32px; height: 32px; object-fit: contain; border-radius: 8px; background: #fff; }
.pw-item span { font-size: 12.5px; color: #6b5b52; }
.pw-tx span { font-size: 14px; font-weight: 700; color: #f97316; }
.pub-wall-load { grid-column: 1 / -1; text-align: center; color: #b9a99f; font-size: 13.5px; padding: 18px 0; }

.pub-flow { display: flex; flex-direction: column; gap: 14px; }
.pf-item { display: flex; align-items: center; gap: 14px; background: #fff; border-radius: 18px; padding: 15px; border: 1px solid #ffe7d6; box-shadow: 0 5px 16px rgba(200,120,70,.10); }
.pf-num { flex: 0 0 auto; width: 58px; height: 52px; border-radius: 14px; font-size: 28px; font-weight: 900; color: #fff; text-align: center; line-height: 52px;
  background: linear-gradient(135deg,#fb923c,#f97316); box-shadow: 0 5px 14px rgba(249,115,22,.28); }
.pf-body { flex: 1; min-width: 0; }
.pf-tag { display: inline-block; padding: 3px 12px; border-radius: 7px; font-size: 13.5px; font-weight: 800; color: #fff; background: linear-gradient(100deg,#fb923c,#f97316); }
.pf-tx { font-size: 14px; color: #6b5b52; margin-top: 7px; line-height: 1.62; }

.pub-slogan { display: flex; align-items: center; justify-content: center; gap: 9px; margin: 4px 0 16px; }
.pub-slogan span { font-size: 19px; font-weight: 900; letter-spacing: 2px; color: #2b2b2f; }
.pub-slogan i { font-style: normal; font-size: 14px; color: #fb923c; letter-spacing: -2px; }
.pub-qr { background: #fff; border-radius: 20px; padding: 22px 18px; text-align: center; border: 1px solid #ffe7d6; box-shadow: 0 8px 22px rgba(200,120,70,.12); }
.pq-card { width: 200px; height: 200px; margin: 0 auto; border-radius: 14px; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.pq-img { width: 100%; height: 100%; object-fit: contain; }
.pq-blank { width: 100%; height: 100%; border: 2px dashed #ffc8a8; border-radius: 14px; display: flex; align-items: center; justify-content: center;
  color: #d69a76; font-size: 13.5px; background: repeating-linear-gradient(45deg,#fff8f3,#fff8f3 10px,#fff2e8 10px,#fff2e8 20px); }
.pq-btn { display: inline-block; margin-top: 18px; padding: 14px 40px; border-radius: 999px; color: #fff; font-size: 16.5px; font-weight: 800; letter-spacing: 1px;
  background: linear-gradient(100deg,#f97316,#e8590c); box-shadow: 0 7px 18px rgba(249,115,22,.28); }
.pq-tip { margin-top: 12px; font-size: 13.5px; color: #9a8b82; }
.pq-tip b { color: var(--brand); }
.pub-note { margin: 20px 16px 6px; padding: 14px 16px; border-radius: 16px; background: #fff2e8; border: 1px solid #ffd9c0;
  font-size: 14px; color: #a9500f; line-height: 1.75; }
.pub-note b { color: #ea580c; }
.pub-limit { margin: 2px 0 14px; padding: 10px 12px; border-radius: 12px; font-size: 13px; line-height: 1.6; }
.pub-limit.free { background: #fff7ed; border: 1px solid #fed7aa; color: #9a3412; }
.pub-limit.vip { background: #ecfdf5; border: 1px solid #bbf7d0; color: #065f46; }
.pub-limit b { font-size: 15px; }

/* 图片全屏预览（二维码 / 海报） */
.img-view { position: fixed; inset: 0; z-index: 999; background: rgba(0,0,0,.86); display: flex; flex-direction: column; align-items: center; justify-content: center; }
.img-view img { max-width: 84%; max-height: 76%; border-radius: 14px; background: #fff; }
.img-view-tip { color: #e2e2e2; font-size: 14px; margin-top: 16px; }

/* ============ 免费开放日（每月固定一天，非会员免费看 1 个项目）============ */
.free-banner { display: flex; align-items: center; gap: 14px; margin-top: 14px; padding: 16px 18px; border-radius: 18px;
  background: linear-gradient(100deg, #fff1e6, #ffe3d2); border: 1px solid #ffd2b8; }
.free-banner .fb-l { flex: 1; min-width: 0; }
.free-banner .fb-tt { font-size: 15.5px; font-weight: 800; color: #b3391b; }
.free-banner .fb-sub { font-size: 13.5px; color: #a05f45; margin-top: 5px; line-height: 1.55; }
.free-banner .fb-btn { flex: 0 0 auto; padding: 11px 18px; border-radius: 999px; font-size: 14px; font-weight: 800; color: #fff;
  background: linear-gradient(100deg, #fb923c, #ea580c); white-space: nowrap; }
.free-banner.used { background: #f6f7f9; border-color: #e6eaf0; }
.free-banner.used .fb-tt { color: #56606d; }
.free-banner.used .fb-sub { color: #8b949f; }
.free-banner.used .fb-btn { background: linear-gradient(100deg, var(--brand), var(--brand2)); }

/* ============ 返佣宣传位：首页横幅 ============ */
.promo-banner { display: flex; align-items: center; gap: 14px; margin-top: 14px; padding: 16px 18px; border-radius: 18px;
  background: linear-gradient(100deg, #fff1e6, #ffe3d2); border: 1px solid #ffd2b8; cursor: pointer; }
.promo-banner .pb-l { flex: 1; min-width: 0; }
.promo-banner .pb-tt { font-size: 15.5px; font-weight: 800; color: #b3391b; line-height: 1.42; }
.promo-banner .pb-sub { font-size: 13px; color: #a05f45; margin-top: 5px; line-height: 1.55; }
.promo-banner .pb-btn { flex: 0 0 auto; padding: 11px 18px; border-radius: 999px; font-size: 14px; font-weight: 800; color: #fff;
  background: linear-gradient(100deg, var(--brand), var(--brand2)); white-space: nowrap; }

/* ============ 返佣宣传位：进场弹窗（每天最多一次）============ */
.promo-mask { position: fixed; inset: 0; background: rgba(20,14,10,.55); z-index: 9999;
  display: flex; align-items: center; justify-content: center; padding: 24px; }
.promo-pop { width: 100%; max-width: 320px; background: #fff; border-radius: 22px; padding: 28px 22px 16px; text-align: center;
  animation: promoIn .22s ease-out; }
@keyframes promoIn { from { opacity: 0; transform: translateY(10px) scale(.97); } to { opacity: 1; transform: none; } }
.promo-pop .pp-badge { width: 62px; height: 62px; margin: 0 auto 14px; border-radius: 50%; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; line-height: 1.16;
  font-size: 19px; font-weight: 800; color: #fff; background: linear-gradient(120deg, var(--brand2), var(--brand)); }
.promo-pop .pp-tt { font-size: 17.5px; font-weight: 800; color: #22262b; line-height: 1.4; }
.promo-pop .pp-sub { font-size: 13.5px; color: #6b7280; margin-top: 9px; line-height: 1.7; }
.promo-pop .pp-btn { margin-top: 20px; padding: 14px; border-radius: 999px; font-size: 15.5px; font-weight: 800; color: #fff;
  background: linear-gradient(100deg, var(--brand), var(--brand2)); cursor: pointer; }
.promo-pop .pp-later { margin-top: 12px; font-size: 13px; color: #9aa1ab; padding: 6px; cursor: pointer; }

.free-box { background: #fff; border: 1px solid #ffd2b8; border-radius: 18px; padding: 26px 20px; text-align: center; margin-top: 18px; }
.free-box .free-ic { font-size: 42px; }
.free-box .free-tt { margin: 10px 0 6px; font-size: 17.5px; font-weight: 800; color: #b3391b; }
.free-box .free-sub { font-size: 14px; color: var(--sub); line-height: 1.65; margin-bottom: 18px; }
.free-box .free-tip { font-size: 13px; color: #a89b92; margin-top: 12px; line-height: 1.65; }

.free-note { display: flex; align-items: center; gap: 10px; margin: 0 0 14px; padding: 13px 15px; border-radius: 14px;
  background: #fff6ef; border: 1px solid #ffe3d2; font-size: 13.5px; color: #a9500f; line-height: 1.55; }
.free-note .fn-ic { flex: 0 0 auto; font-size: 16px; }
.free-note .fn-tx { flex: 1; }
.free-note.on { background: linear-gradient(100deg, #fff1e6, #ffe3d2); border-color: #ffd2b8; font-weight: 700; color: #b3391b; }

/* ===== 会员页砍价入口 ===== */
.vip-bargain-tag { margin-top: 8px; font-size: 13px; color: #b3391b; background: #fff1e6; border: 1px solid #ffd2b8; border-radius: 10px; padding: 7px 10px; }
.vip-btns { display: flex; gap: 10px; margin-top: 14px; }
.vip-btns .vip-btn { margin-top: 0; flex: 1; }
.vip-btn-bargain { flex: 1; }

/* ===== 砍价详情页 ===== */
.bg-card { background: #fff; border: 1px solid #ffd2b8; border-radius: 18px; padding: 22px 18px; margin-top: 14px; text-align: center; }
.bg-tier { font-size: 13.5px; color: #6b7280; }
.bg-cut { margin-top: 6px; font-size: 15px; color: #6b7280; }
.bg-cut b { font-size: 34px; font-weight: 800; color: var(--brand); margin-left: 4px; }
.bg-sub { margin-top: 6px; font-size: 13px; color: #9aa1ab; }
.bg-steps { display: flex; gap: 6px; margin: 14px 0 4px; }
.bg-step { flex: 1; min-width: 0; text-align: center; border: 1px solid #efe3d9; border-radius: 10px; padding: 8px 2px; background: #fff; }
.bg-step i { display: block; width: 22px; height: 22px; line-height: 22px; border-radius: 50%; margin: 0 auto 5px; font-style: normal; font-size: 12px; font-weight: 700; background: #f1efe8; color: #9a9188; }
.bg-step b { display: block; font-size: 12px; font-weight: 500; color: #6b7280; white-space: nowrap; }
.bg-step s { display: block; font-size: 11px; color: #b3a89f; margin-top: 2px; text-decoration: none; }
.bg-step.done i { background: var(--brand); color: #fff; }
.bg-step.done b { color: var(--brand); }
.bg-step.active { border-color: var(--brand); background: #fff7ed; box-shadow: 0 0 0 1px var(--brand) inset; }
.bg-step.active i { background: var(--brand); color: #fff; }
.bg-step.active b { color: #b3391b; }
.bg-step.locked { opacity: .55; }
.bg-leveltip { margin-top: 12px; font-size: 13.5px; color: #b3391b; background: #fff1e6; border-radius: 12px; padding: 10px 12px; line-height: 1.55; }
.bg-leveltip b { color: var(--brand); }
.bg-bar { height: 10px; border-radius: 999px; background: #f1ece7; overflow: hidden; margin: 16px 0 12px; }
.bg-bar i { display: block; height: 100%; border-radius: 999px; background: linear-gradient(100deg, var(--brand), var(--brand2)); }
.bg-tip { font-size: 13.5px; color: #b3391b; background: #fff1e6; border-radius: 12px; padding: 10px; line-height: 1.55; }
.bg-owner { margin-top: 12px; font-size: 13.5px; color: #6b7280; }
.bg-avtitle { margin-top: 18px; font-size: 13px; color: #9aa1ab; text-align: left; }
.bg-avs { display: flex; gap: 8px; margin-top: 10px; }
.bg-av { width: 34px; height: 34px; border-radius: 50%; background: #ffe2d1; color: #b3391b; font-size: 14px; font-weight: 700;
  display: flex; align-items: center; justify-content: center; overflow: hidden; }
.bg-av img { width: 100%; height: 100%; object-fit: cover; }
.bg-av-empty { background: #fff; border: 1px dashed #e3d8cf; color: #c9bdb3; font-weight: 400; }
.bg-actions { display: flex; flex-direction: column; gap: 10px; margin-top: 20px; }
.bg-note { font-size: 12.5px; color: #9aa1ab; }
.bg-rules { margin: 16px 2px 30px; font-size: 12.5px; color: #a89b92; line-height: 1.7; }

/* ============ 微动效（差异化：轻量入场，突出内容、不抢视觉）============ */
@keyframes fxFadeUp { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@keyframes fxPop { from { opacity: 0; transform: scale(.96); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: no-preference) {
  /* 区块级卡片：进入页面时轻轻上浮淡入（每次路由渲染都会触发，符合直觉） */
  .join-banner, .sec, .card, .list-box, .pub-card, .pub-wall, .pf-item,
  .free-banner, .promo-banner, .ib-point, .ib-step, .ib-quote, .ib-stats,
  .free-box, .info-hero, .rank-hero { animation: fxFadeUp .42s cubic-bezier(.22,.61,.36,1) both; }
  /* 价值点卡片：依次错峰弹入，强化「真/快/稳」节奏感 */
  .pv { animation: fxPop .4s cubic-bezier(.22,.61,.36,1) both; }
  .pv:nth-child(2) { animation-delay: .06s; }
  .pv:nth-child(3) { animation-delay: .12s; }
  /* 首页九宫格：逐格入场 */
  .grid-item { animation: fxFadeUp .36s cubic-bezier(.22,.61,.36,1) both; }
  .grid-item:nth-child(2) { animation-delay: .04s; }
  .grid-item:nth-child(3) { animation-delay: .08s; }
  .grid-item:nth-child(4) { animation-delay: .12s; }
  /* 品牌墙：错峰淡入 */
  .pw-item { animation: fxFadeUp .34s ease both; }
  .pw-item:nth-child(3n+2) { animation-delay: .05s; }
  .pw-item:nth-child(3n) { animation-delay: .1s; }
  /* 列表行：轻微上浮，长列表不至于太跳 */
  .row, .mm-item { animation: fxFadeUp .3s ease both; }
  /* 标签胶囊：弹入 */
  .tag-new, .tag-hot, .tag-guar, .tag-offi, .cat, .sh-more { animation: fxPop .3s ease both; }
}

/* ============ 10 次砍价链接领奖落地页 ============ */
.bg-gift { min-height: 100vh; display: flex; align-items: center; justify-content: center;
  padding: 24px 18px; background: linear-gradient(160deg, #fff7ef 0%, #fff 60%); }
.bg-gift-card { width: 100%; max-width: 420px; background: #fff; border-radius: 24px;
  box-shadow: 0 12px 40px rgba(249,115,22,.14); padding: 34px 24px 28px; text-align: center; }
.bg-gift-emoji { font-size: 54px; line-height: 1; }
.bg-gift-tt { font-size: 20px; font-weight: 800; color: #1f2329; margin-top: 12px; }
.bg-gift-sub { font-size: 13.5px; color: var(--sub, #888); margin-top: 8px; line-height: 1.7; }
.bg-gift-sub b { color: var(--brand, #f97316); }
.bg-gift-body { margin-top: 22px; min-height: 40px; }
.bg-gift-ok { font-size: 18px; font-weight: 700; color: #1f2329; }
.bg-gift-big { font-size: 44px; font-weight: 900; color: var(--brand, #f97316); margin: 10px 0 4px;
  letter-spacing: 1px; }
.bg-gift-tip { font-size: 14px; color: var(--sub, #888); line-height: 1.8; margin-bottom: 18px; }
.bg-gift-body .btn-primary { margin-top: 18px; width: 100%; max-width: 260px; }

/* ============ 发布者「已实名」徽章 ============ */
.tag-verified { background: linear-gradient(100deg,#10b981,#059669); color: #fff; font-size: 12px; padding: 3px 9px; border-radius: 7px; margin-left: 6px; font-weight: 700; }
.pdb-tags span.vrf { background: linear-gradient(100deg,#10b981,#059669); color: #fff; font-weight: 700; }
.mini-vrf { display: inline-block; margin-left: 7px; padding: 1px 8px; border-radius: 999px; font-size: 11px; font-weight: 700; color: #059669; background: #ecfdf5; border: 1px solid #a7f3d0; vertical-align: middle; }

/* ============ 发布页：实名核验卡片 + 发布表单 ============ */
.pub-vrf { display: flex; align-items: center; gap: 12px; padding: 16px 16px; border-radius: 16px; margin-bottom: 16px; }
.pub-vrf.no { background: #fff7ed; border: 1px solid #fed7aa; }
.pub-vrf.ok { background: #ecfdf5; border: 1px solid #a7f3d0; }
.pvf-ic { font-size: 26px; line-height: 1; flex: none; }
.pvf-tx { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.pvf-tx b { font-size: 15px; color: #1f2329; }
.pvf-tx span { font-size: 12.5px; color: #8a7f77; line-height: 1.5; }
.pvf-btn { flex: none; border: 0; border-radius: 999px; padding: 9px 18px; font-size: 14px; font-weight: 800; color: #fff; background: linear-gradient(100deg,#fb923c,#f97316); box-shadow: 0 6px 16px rgba(249,115,22,.3); }
.pvf-btn:active { transform: scale(.97); }
.pvf-btn:disabled { opacity: .6; }

.pub-form { background: #fff; border-radius: 18px; padding: 18px 16px; box-shadow: 0 5px 18px rgba(200,120,70,.1); border: 1px solid #ffe7d6; }
.pf-field { margin-bottom: 14px; }
.pf-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.pf-label { display: block; font-size: 13.5px; font-weight: 700; color: #3f3a36; margin-bottom: 7px; }
.pf-label i { color: #e24b4a; font-style: normal; }
.pf-input { width: 100%; box-sizing: border-box; padding: 11px 12px; border: 1.5px solid #eee0d5; border-radius: 12px; font-size: 15px; color: #2b2b2f; background: #fffdfb; }
.pf-input:focus { outline: none; border-color: #f97316; }
.pf-area { width: 100%; box-sizing: border-box; padding: 11px 12px; border: 1.5px solid #eee0d5; border-radius: 12px; font-size: 14.5px; color: #2b2b2f; background: #fffdfb; resize: vertical; }
.pf-area:focus { outline: none; border-color: #f97316; }
.pf-hint { font-size: 12px; color: #a99e95; margin-top: 6px; }
.pf-upload { border: 1.5px dashed #e7d3c2; border-radius: 12px; padding: 12px; text-align: center; cursor: pointer; background: #fffdfb; }
.pf-up-pv img { width: 56px; height: 56px; border-radius: 10px; object-fit: cover; }
.pf-up-ph { font-size: 13px; color: #b6a89d; }
.pf-submit { width: 100%; border: 0; border-radius: 14px; padding: 14px; font-size: 16px; font-weight: 800; color: #fff; background: linear-gradient(100deg,#fb923c,#f97316); box-shadow: 0 8px 20px rgba(249,115,22,.28); margin-top: 4px; }
.pf-submit:active { transform: scale(.99); }
.pf-submit:disabled { opacity: .6; }
.pf-tip { font-size: 12px; color: #a99e95; margin-top: 10px; line-height: 1.6; }

/* ===== 实名认证三步向导（2026-10-16）===== */
.rn-page { padding: 14px 12px 24px; }
.rn-steps { display: flex; gap: 8px; margin-bottom: 14px; }
.rn-step { flex: 1; text-align: center; font-size: 12px; padding: 8px 4px; border-radius: 10px; background: #f4ede7; color: #a99e95; border: 1px solid #efe3da; }
.rn-step.cur { background: #fff4ec; color: #f97316; border-color: #fbcfa8; font-weight: 700; }
.rn-step.on { background: #eaf7ee; color: #2f9e54; border-color: #cdeed6; font-weight: 700; }
.rn-card { background: #fff; border-radius: 18px; padding: 18px 16px; box-shadow: 0 5px 18px rgba(200,120,70,.1); border: 1px solid #ffe7d6; }
.rn-h { font-size: 17px; font-weight: 800; color: #3f3a36; margin-bottom: 8px; }
.rn-tip { font-size: 12.5px; color: #a99e95; line-height: 1.6; margin-bottom: 16px; }
.rn-field { margin-bottom: 14px; }
.rn-field label { display: block; font-size: 13.5px; font-weight: 700; color: #3f3a36; margin-bottom: 7px; }
.rn-input { width: 100%; box-sizing: border-box; padding: 11px 12px; border: 1.5px solid #eee0d5; border-radius: 12px; font-size: 15px; color: #2b2b2f; background: #fffdfb; }
.rn-input:focus { outline: none; border-color: #f97316; }
.rn-pay { background: #fff8f2; border: 1px solid #ffe1cb; border-radius: 14px; padding: 14px; margin-bottom: 16px; }
.rn-pay-name { font-size: 14px; color: #6b5f57; margin-bottom: 6px; }
.rn-pay-price b { font-size: 26px; color: #f97316; font-weight: 800; }
.rn-pay-benefits { margin: 12px 0 0; padding-left: 2px; list-style: none; }
.rn-pay-benefits li { font-size: 13px; color: #5b524c; line-height: 1.9; }
.rn-face { background: #f7f9fb; border: 1px dashed #d6e0e8; border-radius: 14px; padding: 22px 14px; text-align: center; margin-bottom: 16px; }
.rn-face-ic { font-size: 44px; }
.rn-face-sub { font-size: 12px; color: #a99e95; margin-top: 8px; line-height: 1.6; }
.rn-done-ic { font-size: 48px; text-align: center; }
.rn-done-tt { text-align: center; font-size: 17px; font-weight: 800; color: #3f3a36; margin-top: 8px; }
.rn-done-sub { text-align: center; font-size: 13px; color: #a99e95; margin: 6px 0 18px; }

/* ---------- 微信授权引导页（第一屏全屏拦截，2026-10-22）---------- */
.auth-gate { position: fixed; inset: 0; z-index: 9999; background: #fffaf7;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 32px 24px; box-sizing: border-box; text-align: center; }
.ag-inner { width: 100%; max-width: 340px; display: flex; flex-direction: column; align-items: center; }
.ag-brand { font-size: 15px; font-weight: 700; letter-spacing: 2px; color: #f97316; margin-bottom: 22px; }
.ag-title { margin: 0 0 20px; font-size: 30px; line-height: 1.35; font-weight: 800; color: #1f2937; }
.ag-tags { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; margin-bottom: 56px; }
.ag-tag { background: #fff1e6; color: #ea580c; font-size: 13px; font-weight: 600;
  padding: 6px 14px; border-radius: 999px; }
.ag-foot { width: 100%; margin-top: auto; }
.ag-btn { width: 100%; height: 50px; border: none; border-radius: 25px; background: #07c160; color: #fff;
  font-size: 17px; font-weight: 600; display: flex; align-items: center; justify-content: center; gap: 8px;
  cursor: pointer; -webkit-tap-highlight-color: transparent; }
.ag-btn:active { opacity: .9; }
.ag-tip { margin-top: 14px; font-size: 12px; color: #9ca3af; }