/* 多渠道搜索 —— 渠道条 / 搜索区 / 结果网格
   复用 style.css 的马卡龙粉蓝变量（--deer/--deer2/--cream/--blush/--line/--card/--ink/--sub） */

/* ── 热词 / 搜索历史 ──
   搜索框本身已移到站头（全站每页都有，样式在 style.css），
   页面里只剩这条热词带，所以原来那块渐变搜索区（.searchwrap/.sform）整段删掉，
   免得留一条什么都不装的渐变横幅。
   :empty 时整条不占位 —— 新用户没有历史、后端热词也可能为空。 */
.hotwords { max-width: var(--wrap); margin: 0 auto; padding: 14px 24px 0;
  display: flex; gap: 7px; flex-wrap: wrap; align-items: center; }
.hotwords:empty { display: none; }
.hotwords span {
  background: #fff; border: 1px solid var(--line); border-radius: 14px;
  padding: 4px 13px; font-size: 12.5px; color: var(--sub); cursor: pointer; transition: .16s;
}
.hotwords span:hover { border-color: var(--deer2); color: var(--deer); }

/* ── 工具行（排序 + 计数）── */
.toolrow { max-width: var(--wrap); margin: 0 auto; padding: 18px 24px 0; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.sorts { display: flex; gap: 6px; flex-wrap: wrap; }
.sortbtn { border: 1px solid var(--line); background: #fff; border-radius: 14px; padding: 6px 15px; font-size: 13px; color: var(--sub); cursor: pointer; font: inherit; font-size: 13px; transition: .16s; }
.sortbtn:hover { border-color: var(--deer2); color: var(--ink); }
.sortbtn.on { background: var(--deer); border-color: var(--deer); color: #fff; font-weight: 700; }
.rescount { margin-left: auto; font-size: 12.5px; color: var(--sub); }

/* ── 结果网格 ── */
.pgrid { max-width: var(--wrap); margin: 0 auto; padding: 16px 24px 56px; display: grid; grid-template-columns: repeat(auto-fill,minmax(176px,1fr)); gap: 16px; }
.pcard { background: var(--card); border: 1px solid var(--line); border-radius: 14px; overflow: hidden; display: flex; flex-direction: column; transition: .2s; }
/* ⚠️ 卡片一律「1px 描边、不加阴影」：满屏投影会让页面看起来在漂。
   阴影只留给浮层（弹窗 / 抽屉 / 下拉 / Toast / 吸顶）。 */
.pcard:hover { transform: translateY(-3px); border-color: var(--deer); text-decoration: none; }
.pcard .ph { aspect-ratio: 1; background: #F7F5F6; position: relative; overflow: hidden; }
/* contain 而不是 cover：七个渠道的图**长宽比不一样**，正方框 + cover 会裁掉边料。
   实测各渠道原图比例：煤炉/雅虎/乐天 1:1（contain 下正好填满，无影响）、
   骏河屋 651×1024（2:3 游戏封面）、亚马逊 301×400、SNK 1000×730。
   2026-07-30 用户反馈：骏河屋游戏封面上下被切掉约 36%，标题都看不全。
   购物场景里裁掉商品本体比留白更糟 —— 留白只是不好看，裁切是**信息丢失**。 */
.pcard .ph img { width: 100%; height: 100%; object-fit: contain; }
.pcard .ph .noimg { position: absolute; inset: 0; display: grid; place-items: center; font-size: 12px; color: #C6AEB9; }
.pcard .plat { position: absolute; left: 8px; top: 8px; background: rgba(255,255,255,.94); color: var(--deer); font-size: 10.5px; font-weight: 700; border-radius: 10px; padding: 3px 9px; letter-spacing: .3px; }
.pcard .soldout { position: absolute; inset: 0; background: rgba(74,59,68,.55); color: #fff; display: grid; place-items: center; font-size: 14px; font-weight: 700; }
/* ⚠️ 三行信息（日元 / 人民币 / 标题）**贴底对齐**，标题固定占两行。
   卡片高度与图片高度本来就都是一致的，参差不齐的只有文字块：标题 1 行还是
   2 行取决于商品名长短，实测同一屏里 1 行标题的卡片价格高出正好 18px
   （一个行高）。两条一起才治得住：
     justify-content:flex-end  → 文字块整体贴底，最后一行永远在同一条线上；
     .nm 的 min-height 两行    → 短标题也占两行，价格行到图片下沿的距离恒定。
   ⚠️ 搜索卡的来源行（.srcrow）用 margin-bottom:auto 钉在顶部 ——
      auto 外边距会吸走全部剩余空间，优先级高于 justify-content，
      所以「来源行在上、价格与标题在下」两件事不冲突。
      收藏页没有这一行，走 justify-content 即可。 */
.pcard .bd { padding: 11px 12px 13px; display: flex; flex-direction: column; gap: 5px; flex: 1;
  justify-content: flex-end; }
.pcard .srcrow { margin-bottom: auto; }
.pcard .jp { font-size: 17px; font-weight: 700; color: var(--deer); line-height: 1.2; }
.pcard .jp em { font-style: normal; font-size: 11px; font-weight: 500; color: var(--sub); margin-left: 2px; }
/* 人民币参考价是金额 —— 按「金额一律墨色」走 --sub，不用彩色。 */
.pcard .cn { font-size: 11.5px; color: var(--sub); font-variant-numeric: tabular-nums; }
/* 固定两行：3em = 2 × line-height(1.5)。短标题留白，长标题省略号截断，
   一排卡片的标题区高度一致。 */
.pcard .nm { font-size: 12.5px; color: var(--ink); line-height: 1.5; min-height: 3em;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.pcard .shop { font-size: 10.5px; color: var(--sub); display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }

/* 骨架屏 */
.pskel { background: var(--card); border: 1px solid var(--line); border-radius: 14px; aspect-ratio: .68; animation: pulse 1.4s ease-in-out infinite; }
@keyframes pulse { 0%,100% { opacity: .5 } 50% { opacity: .9 } }
@media (prefers-reduced-motion: reduce) { .pskel { animation: none } .pcard:hover { transform: none } }

/* 空态 / 提示 */
.state { max-width: 560px; margin: 40px auto 60px; text-align: center; padding: 0 24px; }
.state .mi { font-size: 46px; margin-bottom: 12px; }
.state h3 { font-size: 17px; margin-bottom: 8px; color: var(--ink); }
.state p { font-size: 13.5px; color: var(--sub); }
.state .retry { margin-top: 14px; border: 1px solid var(--deer); background: #fff;
  color: var(--deer); border-radius: 14px; padding: 8px 20px; font: inherit;
  font-size: 13px; font-weight: 700; cursor: pointer; }
.state .retry:hover { background: var(--cream); }
.state .setup { margin-top: 14px; background: #F7F5F6; border: 1px dashed var(--deer2); border-radius: 14px; padding: 14px 16px; font-size: 12.5px; color: var(--ink); text-align: left; line-height: 1.75; }

/* 渠道说明条 */
.chnote { max-width: var(--wrap); margin: 14px auto 0; padding: 0 24px; }
.chnote .box { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 11px 16px; font-size: 12.5px; color: var(--sub); display: flex; gap: 10px; align-items: flex-start; }
.chnote .box b { color: var(--ink); }

@media (max-width: 640px) {
  .searchwrap h1 { font-size: 21px; }
  .sform button { padding: 12px 20px; }
  .pgrid { grid-template-columns: repeat(auto-fill,minmax(148px,1fr)); gap: 12px; }
}

/* ── 首页：四大货源渠道 + 搜索入口（index.html 插入段）── */
.chband { background: #fff; border-bottom: 1px solid var(--line); }
.chband-in { max-width: var(--wrap); margin: 0 auto; padding: 44px 24px 48px; }
.chband-hd { text-align: center; margin-bottom: 22px; }
.chband-hd h2 { font-size: 23px; line-height: 1.45; margin-bottom: 6px; }
.chband-hd p { font-size: 13.5px; color: var(--sub); }
.chband-form { display: flex; gap: 8px; max-width: 620px; margin: 0 auto 26px; background: #F7F5F6; border: 1.5px solid var(--line); border-radius: 30px; padding: 5px; transition: .18s; }
/* 聚焦用墨色描边，不用粉色光晕（同站头搜索框） */
.chband-form:focus-within { border-color: var(--deer2);  }
.chband-form input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font: inherit; font-size: 15px; padding: 11px 8px 11px 19px; color: var(--ink); }
.chband-form input::placeholder { color: #C6AEB9; }
.chband-form button { border: 0; cursor: pointer; font: inherit; font-weight: 700; font-size: 14.5px; color: #fff; background: var(--deer); border-radius: 14px; padding: 11px 30px; white-space: nowrap; transition: .18s; }
.chband-form button:hover { background: #E4527C; }
.chband-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(198px,1fr)); gap: 13px; }
.chcard { background: var(--card); border: 1.5px solid var(--line); border-radius: 14px; padding: 20px 18px 18px; text-align: center; transition: .2s; display: flex; flex-direction: column; align-items: center; gap: 3px; }
.chcard:hover { transform: translateY(-3px); border-color: var(--deer); text-decoration: none; }
.chcard .ic { width: 44px; height: 44px; display: grid; place-items: center; line-height: 1.1; margin-bottom: 5px; }
.chcard .ic img { width: 38px; height: 38px; object-fit: contain; display: block; }
.chcard b { font-size: 15.5px; color: var(--ink); font-weight: 700; }
.chcard small { font-size: 10.5px; color: var(--sub); letter-spacing: .4px; }
.chcard i { font-style: normal; font-size: 12px; color: var(--sub); margin-top: 7px; line-height: 1.6; }
.chcard.soon { opacity: .62; }
.chcard.soon:hover { transform: none; border-color: var(--line); }
/* 「即将开放」是中性信息，用信息色而不是品牌粉 */
.chcard.soon i { color: var(--info); background: var(--info-bg); border-radius: var(--r-md); padding: 2px 10px; font-weight: 700; font-size: 11px; }
@media (max-width: 640px) {
  .chband-in { padding: 32px 20px 36px; }
  .chband-hd h2 { font-size: 19px; }
  .chband-form button { padding: 11px 20px; }
  .chband-grid { grid-template-columns: repeat(auto-fit,minmax(150px,1fr)); gap: 10px; }
}

/* ── 关键词翻译提示条 ──────────────────────────────────────
   对标挖煤姬的「"包包"已经翻译为"バッグ"进行搜索… 翻译不准?」。
   三种状态用两套配色区分：已翻译/原文=粉色常规，未翻译=黄色警示。 */
.trnote{max-width:var(--wrap);margin:10px auto 0;padding:9px 14px;background:#F7F5F6;
  border:1px solid var(--line);border-radius:10px;font-size:12.8px;color:var(--ink);
  display:flex;gap:8px;align-items:center;flex-wrap:wrap;line-height:1.7}
.trnote b{color:var(--deer)}
.trnote .pair{color:var(--sub)}
.trnote a{margin-left:auto;color:var(--deer);cursor:pointer;white-space:nowrap;font-weight:700}
.trnote a:hover{text-decoration:underline}
.trnote.warn{background:#FFF9EC;border-color:#F0DFB8;color:#7A5B18}
.trnote.warn b{color:#B07A12}
@media (max-width:760px){.trnote{margin:10px 16px 0}.trnote a{margin-left:0;width:100%}}

/* ── 触底自动加载指示 ────────────────────────────────────────
   哨兵元素本身就是"加载中"，被滚进视口即触发下一页。
   按钮作为兜底默认 hidden，只有 IntersectionObserver 不可用时才显示。 */
.autoload{display:flex;align-items:center;justify-content:center;gap:9px;
  padding:22px 0 30px;font-size:13px;color:var(--sub)}
.autoload .dots{display:inline-flex;gap:4px}
.autoload .dots i{width:6px;height:6px;border-radius:50%;background:var(--deer2);
  animation:ylt-dot 1s ease-in-out infinite}
.autoload .dots i:nth-child(2){animation-delay:.16s}
.autoload .dots i:nth-child(3){animation-delay:.32s}
@keyframes ylt-dot{0%,80%,100%{opacity:.28;transform:translateY(0)}
  40%{opacity:1;transform:translateY(-4px)}}
@media (prefers-reduced-motion:reduce){.autoload .dots i{animation:none;opacity:.6}}

/* ══════════ 标准商品卡 · 七槽位 ══════════
   模块库要求三种卡同高、同槽位、同对齐线。 */
/* 槽1 类型角标：格式恒为「类型 · 状态」，压在图片左上 */
.pcard .ph .kind{position:absolute;left:7px;top:7px;z-index:2;
  background:rgba(74,59,68,.82);color:#fff;font-size:10.5px;font-weight:700;
  padding:2.5px 8px;border-radius:9px;letter-spacing:.2px}
/* 槽2 来源行：渠道 logo + **渠道全名**（中文半段 + 日文原名）+ 卖家类型。
   ⚠️ 原来是字母徽标 + 接口短名（「乐」+「乐天」），与筛选芯片、站头下拉的
      「乐天市场 楽天市場」对不上 —— 同一个渠道全站只有一种叫法。
   ⚠️ 卡片窄，全名常放不下：.sname（中文半段）**不收缩**，.sja（日文原名）
      收缩并省略号截断。中文那半段任何宽度下都完整，截掉的只会是日文尾巴。 */
.pcard .srcrow{display:flex;align-items:center;gap:6px;margin-bottom:5px;min-width:0}
.pcard .srcrow .sb{width:18px;height:18px;flex:0 0 auto;border-radius:5px;
  background:var(--ink);color:#fff;font-size:10px;font-weight:700;
  display:grid;place-items:center;letter-spacing:-.3px;overflow:hidden}
/* 有 logo 图的渠道：白底装图（各站图标形状/底色不一），没有的仍是深底字母徽标 */
.pcard .srcrow .sb.img{background:#fff;border:1px solid var(--line)}
.pcard .srcrow .sb img{width:16px;height:16px;object-fit:contain;display:block}
.pcard .srcrow .sb i{font-style:normal}
.pcard .srcrow .sb i[hidden]{display:none}
.pcard .srcrow .sname{font-size:11.5px;color:var(--ink);font-weight:700;flex:0 0 auto;white-space:nowrap}
.pcard .srcrow .sja{font-size:11px;color:var(--sub);flex:0 1 auto;min-width:0;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pcard .srcrow .skind{font-size:11px;color:var(--sub)}
/* 槽4/5 价格：日元为主价（等宽等位），人民币只作参考 */
.pcard .jp{font-variant-numeric:tabular-nums}
.pcard .cn.na{color:var(--bad);font-size:11px;line-height:1.5}
/* 槽6 成色行：**来源原文（日文）为主**，我们的中文统一等级为辅。
   站里没有接机器翻译，中文那一侧是自建词典逐词翻译，摆成主值会误导用户，
   而且判定与售后都以原文为准（见 search.html card() 里的说明）。
   语义色留给中文等级 —— 颜色是我们的判定，不该染在来源原文上。 */
.pcard .cdrow{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:6px}
.pcard .cd{font-size:11px;font-weight:700;padding:2px 7px;border-radius:6px;white-space:nowrap}
/* 原文可能很长（「目立った傷や汚れなし」），允许占满一行再截断 */
.pcard .cd.raw{background:#F1EEEA;color:var(--ink);font-weight:500;
  max-width:100%;overflow:hidden;text-overflow:ellipsis}
/* 中文统一等级：压一档字号，明确是次要标注而不是商品本身的描述 */
.pcard .cdstd{font-size:10px;font-weight:700;padding:1px 6px;border-radius:7px;white-space:nowrap}
.pcard .cd.t-success,.pcard .cdstd.t-success{background:#E6F7EC;color:#1D7A43}
.pcard .cd.t-good,.pcard .cdstd.t-good{background:#EEF4FF;color:#2F5C86}
.pcard .cd.t-warning,.pcard .cdstd.t-warning{background:#FFF3E0;color:#8A5A00}
.pcard .cd.t-danger,.pcard .cdstd.t-danger{background:var(--bad-bg);color:var(--bad)}
.pcard .cd.t-muted,.pcard .cdstd.t-muted{background:#F1EEEA;color:#8B8078}
/* 槽7 备注：缺失走 A14 占位，不留空行也不显示「—」 */
.pcard .note{font-size:11px;color:var(--sub);margin-top:5px;line-height:1.4;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pcard .note .na{color:#B0A5AC}

/* 槽5 到仓价。模块库要求这一行恒定显示；我们目前没有真实的服务费/境内运费数据，
   所以按 A14 给占位并说明原因，而不是编一个数字糊上去。 */
/* `.landed`（到岸价）样式已删（2026-08-16）—— 产品拍板不显示到岸价，同 search.html。 */

/* 热词 / 搜索历史标签。历史优先展示，热词全部是中文（搜索时后端自动译日文）。 */
.hotwords .hotlbl{font-style:normal;font-size:12px;color:var(--ink2);margin-right:4px;align-self:center}
.hotwords .hotclr{font-size:12px;color:var(--ink2);cursor:pointer;align-self:center;margin-left:2px;
  text-decoration:underline;text-underline-offset:2px}
.hotwords .hotclr:hover{color:var(--deer)}

/* 无报价（駿河屋售罄品只有定价、没有在售报价）—— 0 元不是价格 */
.pcard .noprice { font-size: 13px; font-weight: 500; color: var(--sub); }
/* 拍卖专用：竞拍价不是成交价，必须在卡片上说清楚 */
/* 一口价 / 仅竞拍角标放**左下角**：
     · 卡片下半部分（标题、价格）全是左对齐的，角标贴左下正好接上这条阅读线；
       放右下会在图和标题之间横生一个孤立的右锚点，视线要多折一次。
     · 商品图的主体几乎都在中上部（服饰挂拍、玩具正面照），左下角最空。
     · 右上角原来是它的位置，但那里和风控角标（禁/注）挤在一起，两个角标叠着。
   要改回右下角只需把 left 换成 right。 */
.pcard .auc { position: absolute; bottom: 8px; left: 8px; z-index: 2;
  font-size: 10.5px; font-weight: 700; border-radius: 6px; padding: 2px 7px;
  background: rgba(31,122,76,.92); color: #fff; letter-spacing: .3px; }
.pcard .auc.bid { background: rgba(154,74,56,.94); }
.pcard .aucrow { display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap;
  font-size: 11px; color: var(--sub); margin-top: -2px; }
.pcard .aucrow b { font-weight: 600; color: var(--sub); }


/* ── 风控提示（2026-07-31）────────────────────────────────
   卡片右上角的小图标，点开看原因。为什么不直接铺一行文字：
   实测「写真集」一搜 8/8 全打标，铺文字会把商品名挤没，
   而这类提示对大多数商品是噪音。 */
/* ⚠️ 它浮在**商品照片**上，是这一批里唯一「底下不是我们自己的白底」的浮层：
   全站去阴影（2026-08-20）之后没有投影托着，遇到浅色或花哨的图就会糊进去。
   所以改用 1px 描边压边界（padding 各减 1px，视觉尺寸不变）。 */
.pcard .ph .rsk{position:absolute;left:8px;top:8px;z-index:2;
  background:rgba(245,174,83,.94);color:#4a2c00;font-size:13px;line-height:1;
  padding:4px 6px;border:1px solid rgba(74,44,0,.34);border-radius:9px;cursor:pointer}
.pcard .ph .rsk.ship{background:rgba(91,155,255,.94);color:#fff;border-color:rgba(20,52,110,.34)}
.pcard .ph .rsk:hover{filter:brightness(1.06)}

/* 搜索词被拦的整页态 */
.blocked{text-align:center;padding:56px 24px;max-width:520px;margin:0 auto}
.blocked .bi{font-size:44px;line-height:1;margin-bottom:14px}
.blocked .bt{font-size:17px;font-weight:600;color:#333;margin-bottom:10px}
.blocked .bp{font-size:14px;color:#777;line-height:1.7;margin-bottom:18px}
.blocked .bbtn{background:none;border:1px solid #d8607a;color:#d8607a;
  border-radius:22px;padding:9px 22px;font-size:14px;cursor:pointer}
.blocked .bbtn:hover{background:#d8607a;color:#fff}

/* 商详页：禁运 / 限运提示条 */
.riskbar{border-radius:10px;padding:12px 15px;margin:12px 0;font-size:14px;line-height:1.65}
.riskbar.block{background:#fdf0f2;border:1px solid #f3c9d1;color:#a33249}
.riskbar.ship{background:#eef4ff;border:1px solid #cfe0ff;color:#2b5cad}
.riskbar.warn{background:#fff8ec;border:1px solid #f2e0bd;color:#8a6416}
.riskbar b{display:block;margin-bottom:3px}
.riskbar .rbtn{margin-top:9px;background:none;border:1px solid currentColor;color:inherit;
  border-radius:14px;padding:6px 15px;font-size:13px;cursor:pointer}
.riskbar .rbtn:hover{opacity:.75}

/* ── 品类条 ──────────────────────────────────────────────
   原 category.html 的分类浏览并入搜索页后新增。视觉上与渠道选择器同族，
   但用更轻的胶囊以区分「渠道=去哪买」和「品类=买什么」两个维度。
   一级用统一分类（server 负责翻译成各渠道原生参数），选中后展开二级。 */
.catbar { background: var(--card); border-bottom: 1px solid var(--line); }
.catbar .inner { max-width: var(--wrap); margin: 0 auto; padding: 9px 24px; }
.catrow { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.catrow.sub { margin-top: 8px; padding-top: 8px; border-top: 1px dashed var(--line); }
.catbar .lbl { font-size: 12px; color: var(--sub); letter-spacing: 1px; margin-right: 4px; }
.cat {
  padding: 5px 13px; border-radius: 14px; border: 1px solid var(--line);
  background: #fff; cursor: pointer; font-size: 13px; color: var(--ink);
  white-space: nowrap; transition: .16s; font-family: inherit;
}
.cat:hover { border-color: var(--deer2); color: var(--deer); }
.cat.on { background: var(--cream); border-color: var(--deer); color: var(--deer); font-weight: 700; }
.cat.all { color: var(--sub); }
.cat.all.on { color: var(--deer); }
.cat:disabled, .sortbtn:disabled { opacity: .55; cursor: wait; }
@media (max-width: 760px) {
  .catbar .inner { padding: 8px 16px; }
  .catrow { gap: 6px; overflow-x: auto; flex-wrap: nowrap; scrollbar-width: none; }
  .catrow::-webkit-scrollbar { display: none; }
  .cat { flex: 0 0 auto; }
}

/* ── 首页落地态模块 ──────────────────────────────────────
   首页默认不预选渠道/品类，展示搜索框 + 下列模块；
   用户搜索或选渠道/品类后整块隐藏，切到结果流。 */
.hm-wrap { max-width: var(--wrap); margin: 0 auto; padding: 16px 24px 30px;
  display: grid; grid-template-columns: 1fr 300px; gap: 18px; align-items: start; }
.hm-main { display: flex; flex-direction: column; gap: 14px; }

/* 待配置内容位 —— 如实标注，不放假活动 */
.hm-slot { border: 1px dashed var(--line); border-radius: 14px; background: var(--card); padding: 20px 22px; }
.hm-slot-t { font-size: 13px; font-weight: 700; color: var(--sub); }
.hm-slot-d { font-size: 12.5px; color: var(--sub); margin-top: 6px; line-height: 1.75; }

/* 分渠道模块 */
.hm-ch { background: var(--card); border: 1px solid var(--line); border-radius: 14px; padding: 16px 18px; }
.hm-chhead { display: flex; align-items: baseline; gap: 8px; }
.hm-chhead b { font-size: 15.5px; }
.hm-chhead small { font-size: 11.5px; color: var(--sub); }
.hm-chhead .more { margin-left: auto; font-size: 12.5px; color: var(--deer); cursor: pointer; }
.hm-chdesc { font-size: 12.5px; color: var(--sub); margin-top: 5px; line-height: 1.7; }
.hm-cats { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.hm-cat { padding: 7px 14px; border-radius: 14px; border: 1px solid var(--line);
  background: #fff; font-size: 13px; color: var(--ink); cursor: pointer; transition: .16s; }
.hm-cat:hover { border-color: var(--deer); color: var(--deer); text-decoration: none; }

/* 右侧栏 */
.hm-side { display: flex; flex-direction: column; gap: 12px; }
.hm-card { background: var(--card); border: 1px solid var(--line); border-radius: 14px; padding: 15px 17px; }
.hm-card h3 { font-size: 14px; margin: 0 0 10px; }
.hm-card a { display: block; font-size: 13px; color: var(--ink); padding: 5px 0; }
.hm-card a:hover { color: var(--deer); text-decoration: none; }
.hm-card p { font-size: 12.5px; color: var(--sub); line-height: 1.75; margin: 0 0 10px; }
.hm-card .hm-empty { color: #B5A8AE; font-size: 12px; margin: 0; }
.hm-btn { display: inline-block !important; background: var(--deer); color: #fff !important;
  border-radius: 14px; padding: 8px 16px !important; font-weight: 700; font-size: 13px; }
.hm-btn:hover { background: #E4527C; color: #fff !important; }

@media (max-width: 900px) {
  .hm-wrap { grid-template-columns: 1fr; padding: 14px 16px 24px; }
}

/* 无结果页的「帮我买」兜底入口 —— 搜不到不能让用户走空 */
.nores-agent { margin: 20px auto 0; max-width: 460px; background: #F7F5F6;
  border: 1px solid var(--line); border-radius: 14px; padding: 16px 18px; text-align: left; }
.nores-agent b { display: block; font-size: 14px; margin-bottom: 6px; }
.nores-agent p { font-size: 12.5px; color: var(--sub); line-height: 1.8; margin: 0 0 12px; }
.nores-agent .btn { display: inline-block; background: var(--deer); color: #fff;
  border: 1px solid var(--deer); border-radius: 14px; padding: 9px 20px; font: inherit;
  font-size: 13.5px; font-weight: 700; cursor: pointer; }
.nores-agent .btn:hover { background: #E4527C; color: #fff; text-decoration: none; }
.nores-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.nores-agent .btn.ghost { background: #fff; color: var(--deer); }
.nores-agent .btn.ghost:hover { background: var(--cream); color: var(--deer); }