:root{
  --bg:#FAF9F6;
  --card:#FFFFFF;
  --ink:#23201D;
  --ink2:#5C5751;
  /* 2026-09-28 加深：原 #8E8880 在浅底上对比度只有 3.3，低于 WCAG AA 的 4.5。
     现 #6E6A64 在 #FAF9F6 上约 5.1、在白卡上约 5.4，都达标。不要再调浅。 */
  --ink3:#6E6A64;
  --line:rgba(0,0,0,0.10);
  --line2:rgba(0,0,0,0.18);
  --brand:#A8321E;
  /* --brand 当「文字/描边」用，--brand-solid 当「实心按钮底」用（配白字）。
     亮色模式下两个值是同一个；深色模式下必须分开：文字在深底上要提亮才看得清，
     而按钮底太亮就压不住白字了。 */
  --brand-solid:#A8321E;
  --brand-soft:#FBEEEB;
  --deep:#1F4E79;
  --deep-solid:#1F4E79;
  --deep-soft:#EAF1F7;
  --ok:#2F6B3C;
  --ok-soft:#EAF3EC;
  --radius:12px;
  --radius-lg:16px;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background:var(--bg);
  color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  font-size:15px;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  /* 粘一长串网址/型号进搜索框，窄屏上会把页面横向撑破（实测撑出 340px）。
     anywhere 连 min-content 宽度一起算，比 break-word 可靠；中文本来就会换行，不受影响 */
  overflow-wrap:anywhere;
}
a{color:inherit;text-decoration:none;}
/* 键盘 Tab 时能看清焦点在哪。:focus-visible 只在键盘操作时出现，鼠标点击不会冒出来 */
:focus-visible{outline:2px solid var(--brand);outline-offset:2px;border-radius:4px;}
.searchbox input:focus-visible{outline:none;}
.container{max-width:1080px;margin:0 auto;padding:0 20px;}

/* JS 没跑起来时才会出现的兜底提示（平时不渲染） */
.noscript{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:30px 24px;margin:48px auto;max-width:560px;text-align:center;
}
.noscript b{display:block;font-size:16px;font-weight:600;margin-bottom:10px;}
.noscript p{margin:6px 0 0;font-size:13.5px;color:var(--ink2);line-height:1.8;}

/* ---------- 首页静态正文（搜索引擎能读到的那段）----------
   JS 一渲染这段就被整段替换掉，所以这些样式只在「爬虫抓取」或
   「JS 还没跑起来」时起作用。别在这里加动画，它本来就是一闪而过。
   ⚠️ 全用 var()，深色模式自动跟着变，不要写死颜色。 */
.seo-static{padding:32px 0 12px;}
.seo-static h1{font-size:26px;line-height:1.35;margin:0 0 12px;font-weight:700;letter-spacing:-0.3px;}
.seo-static h2{font-size:17px;margin:30px 0 12px;font-weight:600;}
.seo-static p{font-size:14px;line-height:1.85;color:var(--ink2);}
.seo-lead{margin:0 0 8px;font-size:15px!important;line-height:1.85;color:var(--ink2);}
.seo-clusters{
  list-style:none;padding:0;margin:0;display:grid;gap:1px;
  background:var(--line);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;
}
.seo-clusters li{background:var(--card);padding:11px 14px;font-size:14px;line-height:1.6;}
.seo-clusters b{display:block;font-weight:600;}
.seo-clusters span{color:var(--ink3);font-size:13px;}
.seo-steps{margin:0;padding-left:22px;font-size:14px;line-height:1.85;color:var(--ink2);}
.seo-contact{margin-top:26px;padding-top:18px;border-top:1px solid var(--line);}
.seo-contact a{color:var(--brand);text-decoration:underline;display:inline-block;padding:12px 0;}
@media (min-width:720px){
  .seo-static h1{font-size:32px;}
  .seo-clusters{grid-template-columns:1fr 1fr;}
}

/* ---------- 顶部 ---------- */
header.site{
  background:var(--card);border-bottom:1px solid var(--line);
  position:sticky;top:0;z-index:50;
}
.nav{display:flex;align-items:center;gap:24px;height:60px;}
.logo{display:flex;align-items:baseline;gap:8px;font-size:18px;font-weight:600;letter-spacing:-.01em;}
.logo .mark{
  width:38px;height:38px;display:flex;align-items:center;justify-content:center;
  align-self:center;flex:none;
}
.logo .mark svg{display:block;}
.logo .sub{font-size:12px;color:var(--ink3);font-weight:400;}
.nav-links{display:flex;gap:22px;margin-left:auto;font-size:14.5px;color:var(--ink2);}
.nav-links a:hover{color:var(--brand);}
.nav-links a.on{color:var(--brand);font-weight:500;}
.nav-links a.nav-contact{
  color:var(--brand);border:1px solid var(--line2);border-radius:999px;
  padding:4px 12px;margin-left:-6px;
}
.nav-links a.nav-contact:hover{background:var(--brand-solid);border-color:var(--brand);color:#fff;}
.nav-contact-wrap{position:relative;display:inline-flex;align-items:center;}
.contact-pop{
  display:none;position:absolute;top:calc(100% + 10px);right:0;z-index:60;
  background:var(--card);border:1px solid var(--line);border-radius:12px;
  box-shadow:0 8px 24px rgba(0,0,0,.10);padding:14px 16px;min-width:200px;text-align:center;
}
.contact-pop.show{display:block;}
.cp-label{font-size:12px;color:var(--ink3);margin-bottom:4px;}
.cp-mail{font-size:15px;color:var(--ink);font-weight:500;letter-spacing:.01em;word-break:break-all;}
.cp-copy{
  margin-top:10px;width:100%;background:none;border:1px solid var(--line2);
  border-radius:8px;padding:5px 10px;font-size:13px;font-family:inherit;
  color:var(--ink2);cursor:pointer;
}
.cp-copy:hover{border-color:var(--brand);color:var(--brand);}

/* 「登录 / 我的」入口：没登录是个空心丸子，登录了填浅红底 */
.nav-user-wrap{position:relative;display:inline-flex;align-items:center;}
.nav-links a.nav-user{
  color:var(--brand);border:1px solid var(--line2);border-radius:999px;
  padding:4px 12px;margin-left:-6px;
}
.nav-links a.nav-user:hover{background:var(--brand-solid);border-color:var(--brand);color:#fff;}
.nav-links a.nav-user.signed{background:var(--brand-soft);border-color:var(--brand);font-weight:500;}
.nav-links a.nav-user.signed:hover{background:var(--brand-solid);color:#fff;}
.user-pop{min-width:190px;max-width:250px;}
.cp-name{font-size:15px;font-weight:600;color:var(--ink);word-break:break-all;}
.cp-sub{font-size:12.5px;color:var(--ink3);margin-top:3px;}

/* ---------- 登录弹窗 ---------- */
.modal{display:none;position:fixed;inset:0;z-index:200;}
.modal.show{display:block;}
.modal-mask{position:absolute;inset:0;background:rgba(35,32,29,0.45);}
.modal-card{
  position:relative;z-index:1;background:var(--card);border:1px solid var(--line);
  width:min(430px, calc(100vw - 32px));margin:8vh auto 0;
  border-radius:16px;box-shadow:0 18px 50px rgba(0,0,0,0.22);
  padding:24px 24px 20px;max-height:84vh;overflow-y:auto;
}
.modal-card h3{font-size:19px;font-weight:600;margin:0 0 6px;}
.modal-sub{font-size:13.5px;color:var(--ink2);margin:0 0 18px;line-height:1.7;}
.modal-foot{font-size:12.5px;color:var(--ink3);margin:12px 0 0;text-align:center;}
.modal-card .btn-primary{width:100%;}   /* 弹窗里的主按钮跟输入框同宽，看着才像一条流程 */
.code-row2{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:stretch;}
.code-row2 input{width:100%;}
.f-note.tap{cursor:pointer;color:#7A2515;}
.nav-toggle{display:none;}

/* ---------- Hero ---------- */
.hero{padding:52px 0 40px;text-align:center;}
.hero h1{font-size:32px;font-weight:600;margin:0 0 12px;letter-spacing:-.02em;line-height:1.35;}
.hero h1 em{font-style:normal;color:var(--brand);}
.hero p.lead{color:var(--ink2);margin:0 0 28px;font-size:15.5px;}

.searchbox{
  display:flex;max-width:620px;margin:0 auto;background:var(--card);
  border:1.5px solid var(--line2);border-radius:14px;padding:6px;
  box-shadow:0 1px 2px rgba(0,0,0,0.03);
}
.searchbox:focus-within{border-color:var(--brand);box-shadow:0 0 0 3px rgba(168,50,30,.14);}
.searchbox input{
  flex:1;min-width:0;border:none;outline:none;padding:11px 14px;font-size:15.5px;
  background:transparent;color:var(--ink);font-family:inherit;
}
.searchbox input::placeholder{color:var(--ink3);}
.searchbox button{
  border:none;background:var(--brand-solid);color:#fff;font-size:15px;font-weight:500;
  padding:0 26px;min-height:44px;border-radius:10px;cursor:pointer;font-family:inherit;
}
.searchbox button:hover{background:#8F2917;}

.hotwords{
  margin-top:12px;color:var(--ink3);font-size:13.5px;
  display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:2px 4px;
}
.hotwords b{color:var(--ink2);font-weight:400;margin-right:6px;}
/* 热词原来只有 27×17px，手指根本点不中；现在撑到 38px 高（手机 44px）。
   虚线下划线改用 text-decoration，这样它只跟着文字走，不跟着加大的热区走 */
.hotwords a{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:38px;min-width:44px;padding:0 8px;
  color:var(--ink2);text-decoration:underline dashed var(--line2);text-underline-offset:4px;
}
.hotwords a:hover{color:var(--brand);text-decoration-color:var(--brand);}

.stats{display:flex;justify-content:center;gap:48px;margin-top:32px;}
.stat{text-align:center;}
.stat .num{font-size:26px;font-weight:600;color:var(--brand);line-height:1.2;}
.stat .lbl{font-size:13px;color:var(--ink3);margin-top:2px;}

/* ---------- 首页：三个意图入口 ---------- */
.hero-acts{
  display:grid;grid-template-columns:repeat(3,1fr);gap:12px;
  max-width:780px;margin:26px auto 0;text-align:left;
}
.hero-acts a{
  display:block;background:var(--card);border:1px solid var(--line);
  border-radius:var(--radius);padding:14px 16px;
  transition:border-color .15s,transform .15s;
}
.hero-acts a:hover{border-color:var(--brand);transform:translateY(-2px);}
.hero-acts b{display:block;font-size:15px;font-weight:600;margin-bottom:3px;}
.hero-acts a:first-child b{color:var(--brand);}
.hero-acts span{display:block;font-size:12.5px;color:var(--ink3);line-height:1.5;}

/* ---------- 首页：产业带标签流 ---------- */
.cat-chips{display:flex;flex-wrap:wrap;gap:8px;}
.cat-chip{
  display:inline-flex;align-items:center;gap:6px;min-height:38px;
  background:var(--card);border:1px solid var(--line);border-radius:20px;
  padding:0 14px;font-size:13.5px;color:var(--ink2);
  transition:border-color .15s,color .15s;
}
.cat-chip:hover{border-color:var(--brand);color:var(--brand);}
.cat-chip i{font-style:normal;font-size:12px;color:var(--ink3);}
.cat-chip:hover i{color:var(--brand);}
.sec-foot{font-size:13px;color:var(--ink3);margin:16px 0 0;}
.sec-foot a{color:var(--brand);display:inline-flex;align-items:center;min-height:38px;}

/* ---------- 首页：工厂入口条 ---------- */
.entry-row{
  display:flex;align-items:center;gap:16px;
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:16px 20px;transition:border-color .15s;
}
.entry-row:hover{border-color:var(--brand);}
.entry-row .er-num{font-size:26px;font-weight:600;color:var(--brand);line-height:1;}
.entry-row .er-txt{flex:1;min-width:0;}
.entry-row .er-txt b{display:block;font-size:14.5px;font-weight:600;}
.entry-row .er-txt span{display:block;font-size:13px;color:var(--ink3);margin-top:2px;}
.entry-row .er-go{font-size:13.5px;color:var(--ink3);white-space:nowrap;}
.entry-row:hover .er-go{color:var(--brand);}

/* ---------- 首页：三步说明 ---------- */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.step{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:14px 16px;
}
.step b{
  display:inline-block;width:22px;height:22px;line-height:22px;text-align:center;
  border-radius:50%;background:var(--brand-soft);color:var(--brand);
  font-size:13px;font-weight:600;margin-bottom:8px;
}
.step span{display:block;font-size:13px;color:var(--ink2);line-height:1.6;}

/* ---------- 区块 ---------- */
section.block{padding:38px 0;}
.block-head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:18px;}
.block-head h2{font-size:19px;font-weight:600;margin:0;}
.block-head .more{font-size:13.5px;color:var(--ink3);}
a.more{display:inline-flex;align-items:center;min-height:38px;padding-left:10px;}
.block-head .more:hover{color:var(--brand);}

/* ---------- 产业带卡片 ---------- */
.cluster-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(238px,1fr));gap:14px;}
.cluster-card{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:18px;cursor:pointer;transition:border-color .15s,transform .15s;
}
.cluster-card:hover{border-color:var(--brand);transform:translateY(-2px);}
.cluster-card h3{margin:0 0 4px;font-size:15.5px;font-weight:600;}
.cluster-card .loc{font-size:12.5px;color:var(--ink3);margin-bottom:10px;}
.cluster-card p{margin:0 0 12px;font-size:13.5px;color:var(--ink2);line-height:1.6;}
.cluster-card .tags{display:flex;flex-wrap:wrap;gap:6px;}
.mini-tag{
  font-size:12px;background:var(--bg);border:1px solid var(--line);
  border-radius:6px;padding:2px 8px;color:var(--ink2);
}
.mini-tag.red{background:var(--brand-soft);border-color:rgba(168,50,30,0.18);color:var(--brand);}

/* ---------- 工厂卡片 ---------- */
.factory-list{display:flex;flex-direction:column;gap:12px;}
.factory-card{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:18px 20px;cursor:pointer;transition:border-color .15s;
}
.factory-card:hover{border-color:var(--line2);}
.fc-top{display:flex;align-items:flex-start;gap:12px;flex-wrap:wrap;}
.fc-name{font-size:16px;font-weight:600;margin:0;}
.badge{
  font-size:11.5px;padding:2px 8px;border-radius:5px;font-weight:500;white-space:nowrap;
}
.badge.v{background:var(--ok-soft);color:var(--ok);}
.badge.nv{background:var(--bg);color:var(--ink3);border:1px solid var(--line);}
.badge.ex{background:var(--deep-soft);color:var(--deep);}
.badge.sup{background:var(--deep-soft);color:var(--deep);}
.badge.buy{background:var(--brand-soft);color:var(--brand);}
.badge.soon{background:#FCE9C9;color:#8A5A0B;}
.board-card{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:16px 20px;cursor:pointer;transition:border-color .15s;
}
.board-card:hover{border-color:var(--line2);}
/* 供需大厅首批只露 8 条，其余先藏起来，点「显示更多」再逐批放出 */
.bc-extra{display:none;}
.bc-extra.bc-shown{display:block;}
.load-more-wrap{display:flex;justify-content:center;margin-top:18px;}
.bc-title{font-size:15.5px;font-weight:600;margin:0 0 6px;line-height:1.5;}
.bc-meta{font-size:12.5px;color:var(--ink3);margin-bottom:8px;}
.bc-meta span:not(:last-child)::after{content:' · ';margin:0 6px;color:var(--line2);}
.bc-foot{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:8px;}
.bc-qty{font-size:12.5px;color:var(--ink2);margin-right:4px;}
.post-hero{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:16px 18px;margin-bottom:16px;display:flex;justify-content:space-between;
  align-items:center;gap:14px;flex-wrap:wrap;
}
.post-hero p{margin:0;font-size:13.5px;color:var(--ink2);}
.btn-ghost{
  display:inline-flex;align-items:center;justify-content:center;min-height:40px;
  background:transparent;border:1px solid var(--brand);color:var(--brand);
  border-radius:9px;padding:0 18px;font-size:14px;cursor:pointer;font-family:inherit;
}
.btn-ghost:hover{background:var(--brand-soft);}

/* ---------- 站内消息 ---------- */
/* align-items:stretch 让左右两栏一样高 —— 之前左栏 200px、右栏 520px，看着像半成品 */
.chat-layout{display:grid;grid-template-columns:270px 1fr;gap:14px;align-items:stretch;}
.chat-side{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;display:flex;flex-direction:column;max-height:520px;
}
.me-card{
  padding:12px 14px;border-bottom:1px solid var(--line);background:var(--bg);
  display:flex;align-items:center;gap:10px;flex:none;
}
.me-card .avatar{background:var(--brand-soft);color:var(--brand);}
.me-name{font-size:14px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.me-sub{font-size:12.5px;color:var(--ink3);margin-top:1px;}
.conv-list{flex:1;overflow-y:auto;}
.conv-empty{padding:16px 14px;font-size:12.5px;color:var(--ink3);line-height:1.75;}

/* 没登录时的引导卡 */
.chat-gate{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:40px 24px;text-align:center;
}
.gate-title{font-size:17px;font-weight:600;margin-bottom:8px;}
.gate-sub{
  font-size:13.5px;color:var(--ink2);line-height:1.8;
  margin:0 auto 20px;max-width:430px;
}
.gate-btn{width:auto;min-width:170px;}
.chat-side .side-head{
  padding:12px 14px;border-bottom:1px solid var(--line);
  font-size:13.5px;color:var(--ink2);display:flex;justify-content:space-between;align-items:center;
}
.conv{padding:11px 14px;border-bottom:1px solid var(--line);cursor:pointer;}
.conv:hover{background:var(--bg);}
.conv.on{background:var(--deep-soft);}
.conv .n{font-size:14px;font-weight:500;display:flex;justify-content:space-between;gap:8px;align-items:center;}
.conv .n .cname{
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;flex:1;
  display:flex;align-items:center;
}
.chat-side select{
  width:100%;border:1px solid var(--line2);border-radius:8px;padding:6px 8px;
  font-size:13px;font-family:inherit;background:var(--card);color:var(--ink);outline:none;
}
.chat-side select:focus{border-color:var(--brand);}
.conv .p{font-size:12.5px;color:var(--ink3);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.dot{
  display:inline-block;min-width:17px;height:17px;padding:0 5px;border-radius:9px;
  background:var(--brand-solid);color:#fff;font-size:11px;line-height:17px;text-align:center;
}
.online-dot{
  display:inline-block;width:7px;height:7px;border-radius:50%;
  background:#C9C5BD;margin-right:5px;vertical-align:middle;
}
.online-dot.on{background:#3E9B57;}

.chat-main{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  display:flex;flex-direction:column;height:520px;
}
.chat-main .ch-head{
  padding:12px 16px;border-bottom:1px solid var(--line);
  display:flex;align-items:center;gap:10px;
}
.chat-main .ch-head .nm{font-size:15px;font-weight:600;}
.chat-main .ch-head .st{font-size:12px;color:var(--ink3);}
/* 「返回」只在手机出现（规则在下面的移动端媒体查询里） */
.ch-back{display:none;}
.ch-body{flex:1;overflow-y:auto;padding:16px;background:#FCFBF9;}
.msg{display:flex;gap:8px;margin-bottom:14px;align-items:flex-end;}
.msg.me{flex-direction:row-reverse;}
.avatar{
  width:30px;height:30px;border-radius:50%;background:var(--deep-soft);color:var(--deep);
  font-size:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-weight:500;
}
.msg.me .avatar{background:var(--brand-soft);color:var(--brand);}
.bubble{
  background:#F1EFE8;padding:9px 13px;border-radius:12px;max-width:70%;
  font-size:14px;line-height:1.65;word-break:break-word;
}
.msg.me .bubble{background:var(--deep-solid);color:#fff;}
.msg .time{font-size:11px;color:var(--ink3);margin:0 4px 2px;}
.ch-foot{border-top:1px solid var(--line);padding:10px 12px;display:flex;gap:8px;}
.ch-foot input{
  flex:1;border:1px solid var(--line2);border-radius:9px;padding:8px 12px;
  font-size:14.5px;font-family:inherit;outline:none;color:var(--ink);
}
.ch-foot input:focus{border-color:var(--brand);}
.ch-foot button{
  background:var(--brand-solid);color:#fff;border:none;border-radius:9px;
  padding:0 20px;font-size:14.5px;cursor:pointer;font-family:inherit;
}
.ch-foot button:hover{background:#8F2917;}
.typing{font-size:12.5px;color:var(--ink3);padding:0 16px 8px;}

.chat-empty{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  height:100%;color:var(--ink3);font-size:14px;gap:8px;text-align:center;padding:20px;
}
.sim-tip{
  background:var(--brand-soft);border:1px solid rgba(168,50,30,0.15);border-radius:10px;
  padding:8px 12px 8px 14px;font-size:12.5px;color:#7A2515;margin-bottom:14px;
  display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
}
.sim-text{line-height:1.6;}
.sim-toggle{
  flex:none;font-family:inherit;font-size:12.5px;cursor:pointer;min-height:34px;
  border:1px solid var(--brand);background:var(--brand-solid);color:#fff;
  border-radius:999px;padding:0 15px;
}
.sim-toggle.off{background:transparent;color:var(--brand);}

#toastBox{position:fixed;right:18px;bottom:18px;z-index:999;display:flex;flex-direction:column;gap:8px;}
.toast{
  background:#2C2C2A;color:#fff;padding:10px 16px;border-radius:10px;font-size:13.5px;
  box-shadow:0 4px 14px rgba(0,0,0,0.15);cursor:pointer;max-width:300px;
}

@media (max-width:720px){
  /* 手机屏放不下「会话列表 + 聊天窗」两块，改成两屏：
     进页面先看列表，点某条会话才切到聊天；聊天窗左上角有「返回」。
     切换靠 data-view 属性，不需要额外的 JS 状态，浏览器后退键也能用。 */
  .chat-layout{grid-template-columns:1fr;}
  .chat-page[data-view="list"] .chat-main{display:none;}
  .chat-page[data-view="room"] .chat-side,
  .chat-page[data-view="room"] .sim-tip{display:none;}
  .chat-side{max-height:none;}
  /* 高度由 fitChatHeight() 按屏幕剩余空间算（写在 app.js 里） */
  .chat-main{height:auto;min-height:0;}
  .ch-back{
    display:inline-flex;align-items:center;justify-content:center;
    min-height:44px;min-width:56px;flex:none;
    background:none;border:1px solid var(--line2);border-radius:9px;
    color:var(--ink2);font-size:13.5px;font-family:inherit;cursor:pointer;
  }
  .ch-foot input,.ch-foot button{min-height:44px;}
  .sim-toggle{min-height:44px;}
  .mobile-only{display:block;}

  /* 聊天室要一屏装下：把标题和页脚都收掉，高度全省给聊天窗。
     不收的话页面总高 1040 > 屏高 844，底下还能再滚 196px ——
     变成「消息区自己滚 + 整页还能滚」两层滚动，手感很乱。
     页脚在 #app 外面，只能靠 :has() 选；老浏览器不支持就只是底下多一截页脚，不影响用。 */
  .chat-page[data-view="room"] .block-head{display:none;}
  .chat-page[data-view="room"]{padding-bottom:0;}
  body:has(.chat-page[data-view="room"]) footer.site{display:none;}
}
.fc-meta{font-size:13px;color:var(--ink3);margin:6px 0 10px;}
.fc-meta span:not(:last-child)::after{content:' · ';margin:0 6px;color:var(--line2);}
.fc-prods{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px;}
.fc-intro{font-size:13.5px;color:var(--ink2);margin:0;}

/* ---------- 筛选 ---------- */
.filters{
  display:flex;flex-wrap:wrap;gap:8px;align-items:center;
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:12px 14px;margin-bottom:16px;
}
.filters .flabel{font-size:13px;color:var(--ink3);margin-right:2px;}
/* 「筛选条件」开关只在手机出现（规则在下面的移动端媒体查询里），桌面一直是展开的 */
.filters-toggle{display:none;}
.chip{
  display:inline-flex;align-items:center;min-height:36px;padding:0 14px;
  font-size:13px;border-radius:20px;border:1px solid var(--line);
  background:transparent;color:var(--ink2);cursor:pointer;font-family:inherit;
}
.chip:hover{border-color:var(--line2);}
.chip.on{background:var(--brand-solid);border-color:var(--brand);color:#fff;}

/* ---------- 详情页 ---------- */
/* ⚠️ 这里必须带左右 20px。它总和 .container 一起用（class="container detail-wrap"），
   而本规则写在 .container 之后、优先级相同 → 会把 .container 的 padding:0 20px 整个覆盖掉。
   历史上写成 `padding:32px 0 60px`，结果手机端左右留白变 0，
   入驻/发布/隐私/详情四类页面文字全贴屏幕边（2026-10-26 修）。 */
.detail-wrap{max-width:820px;margin:0 auto;padding:32px 20px 60px;}
.back{font-size:13.5px;color:var(--ink3);display:inline-flex;align-items:center;min-height:38px;margin-bottom:12px;}
.back:hover{color:var(--brand);}
.detail-card{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius-lg);
  padding:28px;margin-bottom:16px;
}
.detail-card h1{font-size:24px;font-weight:600;margin:0 0 10px;line-height:1.4;}
.detail-badges{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px;}
.kv-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px 24px;}
.kv{display:flex;gap:10px;font-size:14px;}
.kv .k{color:var(--ink3);min-width:60px;}
.kv .v{color:var(--ink);}
.detail-sec{margin-top:24px;padding-top:20px;border-top:1px solid var(--line);}
.detail-sec h3{font-size:14.5px;font-weight:600;margin:0 0 10px;color:var(--ink2);}
.detail-sec p{margin:0;font-size:14.5px;color:var(--ink2);}
.contact-box{
  background:var(--deep-soft);border:1px solid rgba(31,78,121,0.15);
  border-radius:var(--radius);padding:18px 20px;margin-top:16px;
}
.contact-box .hint{font-size:13.5px;color:var(--deep);margin:0 0 12px;}
.contact-box .btn{
  display:inline-flex;align-items:center;justify-content:center;min-height:42px;
  background:var(--deep-solid);color:#fff;padding:0 20px;
  border-radius:9px;font-size:14px;cursor:pointer;border:none;font-family:inherit;
}
.contact-box .btn:hover{background:#173C5E;}

/* ---------- 表单 ---------- */
.form-row{margin-bottom:14px;}
.form-row label{display:block;font-size:13.5px;color:var(--ink2);margin-bottom:6px;}
.form-row input,.form-row select,.form-row textarea{
  width:100%;border:1px solid var(--line2);border-radius:9px;padding:9px 12px;
  font-size:14.5px;font-family:inherit;background:var(--card);color:var(--ink);outline:none;
}
.form-row input:focus,.form-row select:focus,.form-row textarea:focus{border-color:var(--brand);}
.form-row textarea{min-height:88px;resize:vertical;}
.form-two{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.btn-primary{
  background:var(--brand-solid);color:#fff;border:none;border-radius:10px;
  padding:11px 28px;font-size:15px;font-weight:500;cursor:pointer;font-family:inherit;
}
.btn-primary:hover{background:#8F2917;}
.notice{
  background:var(--brand-soft);border:1px solid rgba(168,50,30,0.15);
  border-radius:10px;padding:14px 16px;font-size:13.5px;color:#7A2515;margin-bottom:18px;
}
.notice b{font-weight:600;}

/* ---------- 表单：必填星号 / 漏填提示 / 验证码 ---------- */
.req{color:var(--brand);font-style:normal;font-weight:600;margin-right:3px;}
.req-note{font-size:12.5px;color:var(--ink3);margin:0 0 12px;}
.req-summary{
  display:none;background:var(--brand-soft);border:1px solid rgba(168,50,30,0.22);
  border-radius:10px;padding:11px 14px;font-size:13.5px;color:#7A2515;margin:0 0 16px;line-height:1.7;
}
.req-summary.show{display:block;}
.req-summary b{font-weight:600;}
.req-summary .sm{display:block;color:#96604F;font-size:12.5px;margin-top:2px;}
.form-sec{
  font-size:13.5px;font-weight:600;color:var(--ink2);margin:22px 0 12px;
  padding-bottom:6px;border-bottom:1px solid var(--line);
}
.form-sec:first-of-type{margin-top:6px;}
.f-err{font-size:12.5px;color:var(--brand);line-height:1.6;margin-top:5px;min-height:0;}
.f-err:empty{display:none;}
.form-row.invalid input,.form-row.invalid select,.form-row.invalid textarea{border-color:var(--brand);background:#FFFAF9;}
.form-row.invalid input.code-code{border-color:var(--brand);}
.f-note{font-size:12.5px;color:var(--ink3);line-height:1.6;margin-top:6px;}
.f-note.bad{color:#7A2515;}
.code-row{display:grid;grid-template-columns:1.15fr 1fr auto;gap:8px;align-items:stretch;}
.code-row input{width:100%;}
.btn-code{
  font-family:inherit;font-size:13.5px;white-space:nowrap;padding:0 14px;border-radius:9px;cursor:pointer;
  border:1px solid var(--brand);background:var(--brand-soft);color:var(--brand);font-weight:500;
}
.btn-code:hover{background:var(--brand-solid);color:#fff;}
.btn-code.off,.btn-code:disabled{
  border-color:var(--line2);background:#F2F1EE;color:var(--ink3);cursor:not-allowed;
}

/* ---------- 空态 ---------- */
.empty{
  text-align:center;padding:56px 20px;background:var(--card);
  border:1px solid var(--line);border-radius:var(--radius);
}
.empty p{color:var(--ink2);margin:0 0 6px;}
.empty .sub{color:var(--ink3);font-size:13.5px;}
/* 找不到东西时给出的出路 */
.empty-acts{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:18px;}
.empty-hot{
  display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:center;
  margin-top:20px;padding-top:18px;border-top:1px solid var(--line);
  font-size:13px;color:var(--ink3);
}
.empty-hot>span{width:100%;margin-bottom:2px;}
.empty-more{margin-top:16px;font-size:13.5px;}
.empty-more a{color:var(--brand);display:inline-flex;align-items:center;min-height:38px;}
/* 一个都对不上时给一个「你是不是想找 X」的下台阶 */
.empty-hint{font-size:14.5px;color:var(--ink2);margin:14px 0 0;}
.empty-hint a{
  color:var(--brand);font-weight:500;display:inline-flex;align-items:center;min-height:38px;
  text-decoration:underline;text-underline-offset:3px;
}
/* 拆字兜底出来的结果标明一下，别让客户以为站里真有这些「完全匹配」的厂 */
.fuzzy-tip{
  background:var(--deep-soft);border:1px solid rgba(31,78,121,0.15);border-radius:10px;
  padding:10px 14px;font-size:13px;color:var(--deep);margin-bottom:14px;line-height:1.65;
}
.fuzzy-tip b{font-weight:600;}

/* ---------- 页脚 ---------- */
footer.site{
  margin-top:40px;border-top:1px solid var(--line);
  background:var(--card);padding:28px 0;font-size:13.5px;color:var(--ink3);
}
footer.site .inner{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;}
/* 页脚里的隐私政策入口。法律要求它得能被找到，不能藏起来 */
footer.site .foot-links a{border-bottom:1px solid currentColor;padding-bottom:1px;}
footer.site .foot-links a:hover{color:var(--brand);}
/* 手机上撑到 44px：这是独立链接（不是句子里的），手指得点得准 */
@media (max-width:720px){
  footer.site .foot-links{display:flex;flex-wrap:wrap;gap:4px 16px;}
  footer.site .foot-links a{display:inline-flex;align-items:center;min-height:44px;border-bottom:none;}
}
/* 备案号（公安联网备案号也必须展示，并链回工信部查询页） */
.beian{margin-top:8px;font-size:13px;line-height:1.9;}
.beian a{border-bottom:1px solid currentColor;}

/* ---------- 明示同意勾选框（登录弹窗 / 入驻 / 发布 三处共用） ---------- */
/* 收集个人信息前必须先取得主动勾选，所以这个框默认不勾、且必填 */
/* 选择器必须写成 .form-row label.agree：站里已有 `.form-row label{display:block}`(0,1,1)，
   只写 `.agree`(0,1,0) 会被它压过去、整行变回竖排。 */
.form-row label.agree{display:flex;align-items:flex-start;gap:9px;cursor:pointer;
  font-size:13.5px;line-height:1.6;color:var(--ink2);font-weight:400;
  padding:8px 0;margin-bottom:0;   /* 整行可点，手指够得着 */
}
.agree input[type="checkbox"]{
  flex:0 0 auto;width:18px;height:18px;margin:2px 0 0;accent-color:var(--brand-solid);cursor:pointer;
}
.agree span{flex:1 1 auto;}
.agree a{color:var(--brand);border-bottom:1px solid currentColor;}
.agree b{color:var(--ink);font-weight:600;}
/* 手机端把整行撑到 44px，满足可点区域要求 */
@media (max-width:720px){
  /* 同样要带上 .form-row 前缀才压得住基础规则 */
  .form-row label.agree{min-height:44px;align-items:center;padding:6px 0;}
  .agree input[type="checkbox"]{width:20px;height:20px;margin-top:0;}
}
/* 勾选框那一行不需要 label 顶栏的加粗样式 */
.form-row-agree{margin-top:6px;}

/* ---------- 移动端 ---------- */
@media (max-width:720px){
  .hero{padding:36px 0 28px;}
  .hero h1{font-size:24px;}
  .stats{gap:26px;}
  .stat .num{font-size:21px;}
  .nav-links{display:none;}
  .nav-links.show{
    display:flex;flex-direction:column;position:absolute;top:60px;left:0;right:0;
    background:var(--card);border-bottom:1px solid var(--line);padding:12px 20px;gap:14px;
  }
  /* 菜单展开后，每一项都要够手指点 */
  .nav-links.show a{display:inline-flex;align-items:center;min-height:44px;}
  .nav-contact-wrap,.nav-user-wrap{display:block;}
  .contact-pop,.user-pop{position:static;margin-top:6px;box-shadow:none;min-width:0;max-width:none;}
  .nav-toggle{
    display:inline-flex;align-items:center;justify-content:center;min-height:44px;
    margin-left:auto;background:none;border:1px solid var(--line2);
    border-radius:8px;padding:0 14px;font-size:13.5px;cursor:pointer;font-family:inherit;color:var(--ink2);
  }
  .detail-card{padding:20px;}
  .detail-card h1{font-size:20px;}

  /* 首屏要能看到「货」：把「最新供需」提到「按产业找」前面（桌面端顺序不变）。
     第一步是把三个入口卡从三行压成一行、副标题收掉 */
  #app>.container.home{display:flex;flex-direction:column;}
  .container.home>.hero{order:1;}
  .container.home>.sec-board{order:2;}
  .container.home>.sec-cats{order:3;}
  .container.home>.entry-row{order:4;}
  .container.home>.sec-howto{order:5;}

  .hero-acts{grid-template-columns:repeat(3,1fr);gap:8px;margin-top:18px;}
  .hero-acts a{padding:12px 6px;text-align:center;}
  .hero-acts b{font-size:13.5px;margin-bottom:0;line-height:1.4;}
  .hero-acts span{display:none;}

  /* 品类标签流：手机上改成一行横向滑动，省下约 240px 首屏高度 */
  .cat-chips{
    flex-wrap:nowrap;overflow-x:auto;gap:8px;padding-bottom:4px;
    -webkit-overflow-scrolling:touch;scrollbar-width:none;
  }
  .cat-chips::-webkit-scrollbar{display:none;}
  .cat-chip{flex:none;min-height:44px;font-size:13px;padding:0 14px;}

  .steps{grid-template-columns:1fr;gap:10px;}
  .entry-row{gap:12px;padding:14px 16px;}
  .entry-row .er-num{font-size:22px;}
  .form-two{grid-template-columns:1fr;}
  .code-row{grid-template-columns:1fr 1fr;}
  .btn-code{grid-column:1 / -1;min-height:44px;padding:0 14px;margin-top:2px;}
  .kv-grid{grid-template-columns:1fr;}

  /* 手指够得着：手机上所有可点区域至少 44px */
  .logo{min-height:44px;}
  .hotwords a{min-height:44px;}
  .sec-foot a{min-height:44px;}
  .chip{min-height:44px;}
  a.more,.back{min-height:44px;}
  .contact-box .btn,.btn-ghost{min-height:44px;}
  .btn-primary{min-height:48px;width:100%;}
  .form-row input,.form-row select,.form-row textarea{min-height:44px;}
  .cp-copy{min-height:44px;}
  .conv{padding:13px 14px;}
  .empty-more a{min-height:44px;}
  .chat-side select{min-height:44px;}

  /* 筛选默认收起，免得筛选墙把第一条供需顶出屏幕 */
  .filters-toggle{
    display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;
    padding:0 16px;margin-bottom:12px;
    border:1px solid var(--line2);border-radius:10px;background:var(--card);
    color:var(--ink2);font-size:14px;font-family:inherit;cursor:pointer;
  }
  .filters{display:none;}
  .filters.open{display:flex;}
}

/* 桌面端：供需卡片两栏，别再一条独占一整行 */
@media (min-width:721px){
  .board-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:start;}
}

/* ---------- 深色模式 ---------- */
/* 全站配色都是 CSS 变量写的，所以把变量翻一遍就成；
   剩下几处写死的浅色（聊天背景、气泡、角标、toast）单独收拾。
   注意 --brand 和 --brand-solid 在这里必须取不同值：
   文字要提亮（否则深底上糊成一团），实心按钮底要压暗（否则白字看不清）。 */
@media (prefers-color-scheme: dark){
  :root{
    --bg:#17150F;
    --card:#211E17;
    --ink:#F2EFE8;
    --ink2:#C6C1B6;
    --ink3:#979184;
    --line:rgba(255,255,255,0.11);
    --line2:rgba(255,255,255,0.22);
    --brand:#E4634A;
    --brand-solid:#C4452B;
    --brand-soft:#2E1A14;
    --deep:#8FC0EA;
    --deep-solid:#1F4E79;
    --deep-soft:#1B2836;
    --ok:#7FC98D;
    --ok-soft:#1C2C1F;
  }
  .ch-body{background:#191712;}
  .bubble{background:#2B2721;}
  .badge.soon{background:#3A2A12;color:#EFB65C;}
  .online-dot{background:#5A564E;}
  .toast{background:#EDEAE3;color:#1A1815;}
  .btn-code.off,.btn-code:disabled{background:#2B2721;}
  .form-row.invalid input,.form-row.invalid select,.form-row.invalid textarea{background:#2A1A16;}
  .modal-mask{background:rgba(0,0,0,0.68);}
  .f-note.tap,.notice,.sim-tip,.req-summary,.f-note.bad{color:#E9A08C;}
  .req-summary .sm{color:#C9968A;}
  .contact-box{border-color:var(--line);}
  /* 详情页那张浅蓝底的「联系工厂」卡里，红字在深蓝底上只有 4.41，差一点 ——
     改用同色系的浅蓝，跟旁边的提示文字也统一 */
  .contact-box .btn-ghost{color:var(--deep);border-color:var(--deep);}
  .searchbox button:hover,.ch-foot button:hover,.btn-primary:hover{background:#A9361F;}
  .contact-box .btn:hover{background:#2A6BA8;}
}

/* ---------- 打印 ---------- */
/* 采购商把工厂详情页 Ctrl+P 存成 PDF 发给同事时，纸上不该印着菜单、页脚和一排按钮。
   项目里其他文档 HTML 都带了打印样式，就站点漏了。 */
@media print{
  header.site,footer.site,#toastBox,.modal,
  .searchbox,.hotwords,.hero-acts,.steps,.filters,.filters-toggle,
  .load-more-wrap,.sim-tip,.back,
  .nav-toggle,.ch-back,.cp-copy,.btn-primary,.btn-ghost,.btn-code,
  button{display:none !important;}

  body{background:#fff;color:#000;}
  .container{max-width:none;padding:0;}
  .detail-wrap{max-width:none;padding:0;}

  /* 卡片去掉圆角和阴影、边框改浅灰，省墨也干净 */
  .detail-card,.factory-card,.board-card,.cluster-card,.step,.entry-row,.contact-box{
    border-radius:0;border:1px solid #ccc;box-shadow:none;background:#fff;
  }
  /* 一张卡别被切成两页 */
  .detail-card,.factory-card,.board-card,.cluster-card,.step,.detail-sec,.kv-grid{
    page-break-inside:avoid;
  }
  a{color:#000;text-decoration:none;}
  .kv .k,.fc-meta,.bc-meta,.loc,.detail-sec h3{color:#333;}
  /* 打印出来看不出颜色，核验角标得带上文字 */
  .badge{border:1px solid #999;}
}