/* ============================================================
   华人888 · 设计系统
   皮肤基准：W01 金属光泽（银白金属渐变 + 铬色描边 + 橙色强调）
   排版基准：V3 科技风版式
   亮/暗双模，硬约束：hover 不位移、transition 显式列属性
   ============================================================ */

:root{
  --ink:#10141a; --ink2:#66717e; --ink3:#8792a0;
  --line:rgba(183,192,203,.55); --line2:rgba(183,192,203,.85);
  --metal:linear-gradient(160deg,#ffffff 0%,#f1f5f9 52%,#dfe6ee 100%);
  --metal-soft:linear-gradient(160deg,#ffffff,#e9eef4);
  --graphite:linear-gradient(160deg,#2c3644 0%,#171d26 55%,#0d1218 100%);
  --orange:linear-gradient(150deg,#ff8a3d,#ff6a1a 55%,#e4510b);
  --o:#e4510b; --o2:#ff6a1a; --green:#129f6a; --red:#c9382a; --blue:#2f6fd0;
  --edge:0 1px 0 rgba(255,255,255,.95) inset;
  --shadow:0 14px 30px rgba(44,54,68,.10);
  --shadow-h:0 18px 36px rgba(44,54,68,.16);
  --page:radial-gradient(120% 60% at 78% -6%,rgba(255,255,255,.95),transparent 60%),linear-gradient(180deg,#f8fbff 0%,#e8edf3 46%,#f4f7fa 100%);
  --hd:rgba(255,255,255,.62);
  --chrome:linear-gradient(150deg,#ffffff,#b7c0cb 55%,#778391);
  --chrome-soft:linear-gradient(150deg,#ffffff,#dce4ec 60%,#b7c0cb);
  --chip-on:linear-gradient(150deg,#4a5666,#232c38);
  --note-bg:rgba(255,255,255,.66);
  --field:#ffffff;
  /* 数字/展示字体。**只用本机自带的**，不许再引 Google Fonts：
     那是渲染阻塞的外部样式表，中国大陆打不开，每次翻页都要等超时；
     就算连上了字体也是后到的，用它的十几处元素会集体变宽变高，整页抖一下。
     Bahnschrift 是 Win10+ 自带，DIN Alternate 是 macOS 自带，都有紧凑好看的数字。 */
  --disp:"Bahnschrift","DIN Alternate","Segoe UI Variable Display","Segoe UI",
    "Helvetica Neue","PingFang SC","Microsoft YaHei",sans-serif;
}
html[data-theme="dark"]{
  --ink:#eef2f7; --ink2:#9aa7b5; --ink3:#7a8798;
  --line:rgba(255,255,255,.10); --line2:rgba(255,255,255,.16);
  --metal:linear-gradient(160deg,#333e4d 0%,#232c38 52%,#161d26 100%);
  --metal-soft:linear-gradient(160deg,#2d3745,#1c242e);
  --edge:0 1px 0 rgba(255,255,255,.10) inset;
  --shadow:0 14px 30px rgba(0,0,0,.45);
  --shadow-h:0 18px 36px rgba(0,0,0,.6);
  --page:radial-gradient(120% 60% at 78% -6%,rgba(72,90,112,.35),transparent 60%),linear-gradient(180deg,#141a22 0%,#0d1218 46%,#10151c 100%);
  --hd:rgba(13,18,24,.72);
  --chrome:linear-gradient(150deg,#4a5666,#232c38);
  --chrome-soft:linear-gradient(160deg,#333e4d,#1c242e);
  --note-bg:rgba(255,255,255,.05);
  --field:rgba(255,255,255,.06);
  --o:#ff8a3d; --green:#2fd39b; --red:#ff7a6b; --blue:#6fa8f5;
}

*{margin:0;padding:0;box-sizing:border-box}
/* 竖滚动条永远占住位置。
   不这么写的话：招聘、租房这种长页面有滚动条，商家黄页、顺风车这种条目少的短页面没有，
   点顶栏在两者之间切换时视口宽度差十几像素，居中的 .wrap 跟着左右挪 —— 看起来就是整页在跳。
   必须写在 html 上（文档的滚动容器是它），写在 body 上不生效。后台那边踩过同一个坑。 */
/* 2026-09-03 去掉 scroll-behavior:smooth：既然全站禁止页面自己滚动，
   留着它只会让浏览器自身那点滚动恢复「滑」得更显眼，用户看着就是页面在自己动。 */
html{-webkit-text-size-adjust:100%;scrollbar-gutter:stable}
@supports not (scrollbar-gutter: stable){
  html{overflow-y:scroll}       /* 老浏览器兜底：始终画出滚动条轨道 */
}
body{font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  background:var(--page);background-attachment:fixed;color:var(--ink);font-size:15px;line-height:1.65;min-height:100vh}
a{color:inherit;text-decoration:none}
button{font-family:inherit}
/* 2026-09-04 内容主列收窄到 1180，两侧空白留给将来的广告位。
   要整体放宽/收窄只改 --wrapw 这一个值，全站（页头、导航、正文、页脚）一起跟着变。 */
:root{--wrapw:1140px}
.wrap{max-width:var(--wrapw);margin:0 auto;padding:0 28px}
.num{font-family:var(--disp)}
/* 数字等宽：不等宽的话列表里 111 和 999 宽度不一样，滚动时数字列会左右抖 */
.num,.cidx,.cpay,.tnum,.livebar b,.page-head .meta b,.pitem .p,.cat .cnt,
.pay-card .v,.sim .n,.fc-i b{font-variant-numeric:tabular-nums}

.hide{display:none !important}

/* ───────── 顶部导航 ───────── */
.header{position:sticky;top:0;z-index:60;background:var(--hd);backdrop-filter:blur(14px) saturate(1.2);-webkit-backdrop-filter:blur(14px) saturate(1.2);border-bottom:1px solid var(--line2)}
.header .wrap{display:flex;align-items:center;gap:24px;height:66px}
.logo{display:flex;align-items:center;gap:11px;white-space:nowrap}
.logo .mark{width:38px;height:38px;border-radius:12px;background:var(--chrome);box-shadow:var(--edge),0 3px 8px rgba(44,54,68,.25);
  display:flex;align-items:center;justify-content:center;font-family:var(--disp);font-weight:900;font-size:13px;color:#2c3644;letter-spacing:-.5px}
html[data-theme="dark"] .logo .mark{color:#dfe6ee}
.logo .name{font-size:20px;font-weight:800;letter-spacing:.5px}
.logo .name b{color:var(--o)}
.hnav{display:flex;gap:2px;font-size:14.5px;color:var(--ink2)}
.hnav a{padding:8px 14px;border-radius:99px;font-weight:600;transition:background-color .15s ease,color .15s ease,box-shadow .15s ease}
.hnav a:hover{color:var(--ink)}
.hnav a.on{color:#fff;background:var(--chip-on);box-shadow:0 1px 0 rgba(255,255,255,.16) inset,0 6px 14px rgba(35,44,56,.28)}
.hnav .cnt{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;margin-left:5px;padding:0 5px;
  border-radius:99px;font-size:11px;font-weight:800;background:var(--orange);color:#fff}
.hright{margin-left:auto;display:flex;align-items:center;gap:12px}
.city-pick{font-size:13.5px;color:var(--ink2);cursor:pointer;padding:7px 13px;border-radius:99px;border:1px solid var(--line2);
  background:var(--metal-soft);box-shadow:var(--edge);transition:color .15s ease,border-color .15s ease}
.city-pick:hover{color:var(--ink)}
.theme-tgl{width:38px;height:38px;border-radius:50%;border:1px solid var(--line2);background:var(--metal-soft);box-shadow:var(--edge);
  cursor:pointer;font-size:16px;transition:border-color .15s ease}
.theme-tgl:hover{border-color:var(--o2)}
.btn-post{height:40px;padding:0 22px;border:none;border-radius:99px;background:var(--orange);color:#fff;font-size:14.5px;font-weight:800;
  cursor:pointer;box-shadow:0 1px 0 rgba(255,255,255,.4) inset,0 8px 18px rgba(228,81,11,.32);transition:box-shadow .15s ease;
  display:inline-flex;align-items:center}
.btn-post:hover{box-shadow:0 1px 0 rgba(255,255,255,.4) inset,0 10px 24px rgba(228,81,11,.45)}

/* ───────── 面包屑 / 页头 ───────── */
.crumb{padding:20px 0 0;font-size:13px;color:var(--ink3)}
.crumb a:hover{color:var(--o)}
.crumb b{color:var(--ink);font-weight:600}
.page-head{padding:18px 0 6px}
.page-head h1{font-size:clamp(24px,3.2vw,34px);font-weight:900;letter-spacing:.5px}
.page-head .meta{margin-top:8px;font-size:14px;color:var(--ink2)}
.page-head .meta b{color:var(--o);font-family:var(--disp)}

/* ───────── 区块头 ───────── */
.section{margin-top:44px}
.sec-head{display:flex;align-items:baseline;margin-bottom:18px;position:relative;padding-bottom:14px;flex-wrap:wrap;gap:8px}
.sec-head::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;border-radius:3px;background:linear-gradient(90deg,#b7c0cb,#ffffff 42%,#778391)}
html[data-theme="dark"] .sec-head::after{background:linear-gradient(90deg,#3a4552,#8a97a6 42%,#232c38)}
.sec-head h2{font-size:22px;font-weight:850;letter-spacing:.5px}
.sec-head .hint{margin-left:4px;font-size:13px;color:var(--ink3)}
.sec-head .more{margin-left:auto;font-size:13.5px;color:var(--o);font-weight:700;border-bottom:1.5px solid var(--o);padding-bottom:1px}

/* ───────── 通用金属面板 ───────── */
.panel{border-radius:20px;background:var(--metal);border:1px solid var(--line2);box-shadow:var(--edge),var(--shadow);overflow:hidden}
.panel+.panel{margin-top:16px}
.phead{display:flex;align-items:center;padding:15px 20px 2px}
.phead h3{font-size:16px;font-weight:800}
.phead .more{margin-left:auto;font-size:12.5px;color:var(--ink3)}
.phead .more:hover{color:var(--o)}
.plist{padding:10px 9px 13px}
.pitem{display:flex;gap:10px;align-items:center;padding:8.5px 12px;border-radius:12px;font-size:13.5px;transition:background-color .13s ease}
.pitem:hover{background:rgba(255,106,26,.07)}
.pitem .t{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ink2)}
.pitem:hover .t{color:var(--ink)}
.pitem .p{flex:none;font-family:var(--disp);font-size:13px;font-weight:800;color:var(--o)}

/* ───────── 筛选器（地区 × 类目 × 条件） ───────── */
.filters{border-radius:20px;background:var(--metal);border:1px solid var(--line2);box-shadow:var(--edge),var(--shadow);padding:6px 20px;margin-top:18px}
.frow{display:flex;gap:10px;padding:12px 0;border-bottom:1px solid var(--line);align-items:flex-start}
.frow:last-child{border-bottom:none}
.frow .lb{flex:none;width:58px;font-size:13.5px;color:var(--ink3);padding-top:6px;font-weight:600}
.frow .opts{flex:1;display:flex;gap:8px;flex-wrap:wrap}
.fopt{padding:5px 14px;border-radius:99px;font-size:13.5px;color:var(--ink2);background:transparent;border:1px solid transparent;
  cursor:pointer;transition:color .15s ease,background-color .15s ease,border-color .15s ease}
.fopt:hover{color:var(--ink);background:rgba(255,106,26,.08)}
.fopt.on{background:var(--orange);color:#fff;font-weight:700;border-color:transparent;box-shadow:0 1px 0 rgba(255,255,255,.35) inset,0 4px 10px rgba(228,81,11,.28)}
.fbar{display:flex;align-items:center;gap:12px;margin-top:16px;flex-wrap:wrap}
.fbar .cntinfo{font-size:13.5px;color:var(--ink2)}
.fbar .cntinfo b{color:var(--o);font-family:var(--disp);font-size:15px}
.sorts{margin-left:auto;display:flex;gap:6px}
.sorts button{padding:6px 15px;border-radius:99px;font-size:13.5px;border:1px solid var(--line2);background:var(--metal-soft);
  box-shadow:var(--edge);color:var(--ink2);cursor:pointer;transition:color .15s ease,background-color .15s ease,border-color .15s ease}
.sorts button.on{background:var(--chip-on);border-color:transparent;color:#fff;font-weight:700}
.sorts button:hover:not(.on){color:var(--ink)}

/* ───────── 搜索框 ───────── */
.searchbox{display:flex;gap:8px;padding:7px;border-radius:99px;background:var(--metal-soft);border:1px solid var(--line2);
  box-shadow:var(--edge),0 10px 24px rgba(44,54,68,.10);transition:box-shadow .18s ease,border-color .18s ease}
.searchbox:focus-within{border-color:rgba(255,106,26,.65);box-shadow:var(--edge),0 0 0 3px rgba(255,106,26,.16),0 10px 24px rgba(44,54,68,.10)}
.searchbox input{flex:1;border:none;outline:none;background:transparent;color:var(--ink);font-size:15.5px;padding:0 18px;min-width:0}
.searchbox input::placeholder{color:var(--ink3)}
.searchbox button{height:48px;padding:0 32px;border:none;border-radius:99px;background:var(--orange);color:#fff;font-size:15.5px;
  font-weight:800;cursor:pointer;box-shadow:0 1px 0 rgba(255,255,255,.4) inset,0 8px 18px rgba(228,81,11,.30)}

/* ───────── 信息卡列表（招聘/租房/二手通用） ───────── */
/* min-height 是防「点一下页面跳一下」的（2026-09-03 用户定的硬标准）：
   顶部那排筛选器是就地筛的，一筛剩两三条，页面高度骤缩，浏览器会把滚动位置往上顶，
   看着就是页面自己跳了一下。留住最小高度，页面高度不塌，位置就不会被顶。 */
/* 2026-09-11 用户要信息密度高一点：行距、内边距、序号牌、收藏圈全部收紧一档 */
.list{display:flex;flex-direction:column;gap:6px;min-height:62vh}
/* 锚点定位留出吸顶顶栏的高度，否则跳过来分类栏会被顶栏盖掉半截。
   顶栏两行（搜索行 + 导航行）约 118px，再留 14px 余量。 */
#cats{scroll-margin-top:132px}
@media (max-width:900px){#cats{scroll-margin-top:104px}}
.card{display:flex;align-items:center;gap:12px;padding:9px 14px;border-radius:12px;background:var(--metal);border:1px solid var(--line2);
  box-shadow:var(--edge),var(--shadow);cursor:pointer;transition:box-shadow .14s ease,border-color .14s ease}
.card:hover{border-color:rgba(255,106,26,.45);box-shadow:var(--edge),var(--shadow-h)}
.cidx{flex:none;width:32px;height:32px;border-radius:9px;display:grid;place-items:center;font-family:var(--disp);font-weight:800;
  font-size:12px;color:#3c4652;background:var(--chrome-soft);border:1px solid var(--line2);box-shadow:var(--edge)}
html[data-theme="dark"] .cidx{color:#dfe6ee}
.card.feature .cidx{color:#fff;background:var(--orange);border-color:transparent;box-shadow:0 1px 0 rgba(255,255,255,.35) inset,0 6px 14px rgba(228,81,11,.26)}
.cmain{flex:1;min-width:0}
.ctitle{font-size:15px;font-weight:750;display:flex;align-items:center;gap:8px;overflow:hidden}
.ctitle .txt{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.card:hover .ctitle .txt{color:var(--o)}
.badge{flex:none;font-size:10.5px;font-weight:800;letter-spacing:.5px;padding:2.5px 9px;border-radius:7px}
.badge.top{background:var(--orange);color:#fff;box-shadow:0 1px 0 rgba(255,255,255,.35) inset}
.badge.hot{background:rgba(255,106,26,.12);color:var(--o);border:1px solid rgba(255,106,26,.25)}
.badge.new{background:rgba(18,159,106,.12);color:var(--green);border:1px solid rgba(18,159,106,.3)}
.badge.vip{background:var(--chip-on);color:#fff}
/* 语言标（2026-09-03 双语硬标准）：当地语言的帖子标一下，中文帖不标。
   租房这种中西夹杂的频道，用户扫一眼就知道点进去是什么语言。 */
.badge.lang{background:rgba(90,110,140,.12);color:#5a6e8c;border:1px solid rgba(90,110,140,.25)}
html[data-theme="dark"] .badge.lang{color:#9fb2cc}
/* 用户投稿带的图片（2026-09-04）。点开看大图。 */
.dimgs{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.dimgs img{max-width:220px;max-height:220px;border-radius:12px;border:1px solid var(--line2);
  object-fit:cover;display:block}
.cmeta{margin-top:2px;font-size:12px;color:var(--ink3);display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.cmeta .dot{width:3px;height:3px;border-radius:50%;background:var(--line2)}
/* 时效标（2026-09-03 用户定）：从卡片左边的地区/类目那行挪到「电议」按钮左边。
   24 小时内显示「N 小时前」，比笼统的「今天」有用——分类信息讲的就是时效。
   新鲜的（3 小时内）加重颜色，一眼能挑出来。 */
.cage{flex:none;font-size:12px;color:var(--ink3);white-space:nowrap;font-variant-numeric:tabular-nums;
  min-width:52px;text-align:right}
.cage.fresh{color:var(--green);font-weight:700}
/* 2026-09-04：这里原来写死成半透明白色，卡片改成白底之后就是白底白字，多源的那几条「几天前」整个看不见，用户以为它们是另一种状态。跟普通卡片一样就行。 */
.card.feature .cage{color:var(--ink3)}
.cpay{flex:none;font-family:var(--disp);font-weight:800;font-size:13px;color:#fff;background:var(--orange);border-radius:99px;
  padding:5px 12px;box-shadow:0 1px 0 rgba(255,255,255,.35) inset,0 6px 14px rgba(228,81,11,.26);white-space:nowrap}
.cpay.muted{color:#3c4652;background:var(--chrome-soft);border:1px solid var(--line2);box-shadow:var(--edge)}
html[data-theme="dark"] .cpay.muted{color:#dfe6ee}
.cfav{flex:none;width:30px;height:30px;border-radius:50%;border:1.5px solid var(--line2);background:transparent;color:var(--ink2);
  font-size:14px;cursor:pointer;transition:border-color .15s ease,background-color .15s ease,color .15s ease}
.cfav:hover{border-color:var(--o2);color:var(--o)}
.cfav.is-on{border-color:var(--o2);background:rgba(255,106,26,.15);color:var(--o)}
.empty-tip{display:none;text-align:center;color:var(--ink3);font-size:14px;padding:44px 0}

/* ── 广告位占位（开关 site.ad_preview，验收用，上线前必须关）── */
.adph{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
  margin-top:14px;border:2px dashed #e11d48;border-radius:16px;background:rgba(225,29,72,.08);
  color:#e11d48;text-align:center;padding:12px 16px}
.adph b{font-size:15px;font-weight:800}
.adph span{font-size:12px;opacity:.8;font-family:var(--disp)}
/* 侧栏宽度自动吃满两边剩余的空白：能多宽就多宽，上限 300（标准 MPU 宽度），
   下限 160。原来写死分档，用户 1620 宽的窗口卡在 200 上不去（2026-09-04）。
   减 32 是给滚动条槽和外侧留的余量，不减会顶到窗口边。 */
.adrail{--railw:clamp(160px, calc((100vw - var(--wrapw) + 56px) / 2 - 32px), 360px);
  position:fixed;top:132px;width:var(--railw);z-index:30;pointer-events:none}
.adrail .adph{margin-top:0;margin-bottom:12px;padding:6px}
.adrail .adph b{font-size:13px}
/* 贴着卡片外沿量，不是贴 .wrap 外沿量：.wrap 自己有 28px 内边距，
   那 28px 是空的，白白浪费掉两边各 28px 的广告宽度。 */
.adrail.left{left:calc(50% - var(--wrapw) / 2 + 28px - var(--railw) - 16px)}
.adrail.right{left:auto;right:calc(50% - var(--wrapw) / 2 + 28px - var(--railw) - 16px)}
@media (max-width:1599px){.adrail .adph span{display:none}}
/* 1140 主列 + 两边各 176（160 竖条 + 16 间隙）= 1492，留 8px 余量。
   原来卡在 1559 太保守，1550 宽的窗口就整条不见了（2026-09-04 用户报）。 */
@media (max-width:1499px){.adrail{display:none}}

/* 列表里的信息流广告卡（广告位 list_feed）。长得跟普通卡一样，
   只把序号换成「广告」角标 —— 既不骗人，也不像块膏药贴在列表里。 */
.card.adcard .cidx.ad{font-size:11px;font-weight:800;letter-spacing:.5px;
  background:var(--metal-soft);color:var(--ink3);border:1px solid var(--line2);box-shadow:none}
.card.adcard{border-style:dashed}

/* ───────── 搜索结果页（search.html，脚本在 assets/app7.js）───────── */
/* 频道标签故意不放进 .frow：.frow 里的 .fopt 归 app.js 的条件筛选管，
   搜索页的标签归 app7.js 管，混在一起两边会互相覆盖。 */
.srtabs{display:flex;gap:8px;flex-wrap:wrap;padding:12px 0}
.srtabs .fopt{cursor:pointer;font-size:14px}
.srtabs .fopt em{font-style:normal;opacity:.72;font-variant-numeric:tabular-nums}
.srempty{display:none;text-align:center;padding:46px 20px}
.srempty .big{font-size:38px;line-height:1}
.srempty h3{margin-top:12px;font-size:19px;font-weight:800}
.srempty p{margin-top:8px;color:var(--ink2);font-size:14px}
.srempty .hots{margin-top:18px;display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.srempty .hots .fopt{cursor:pointer;border-color:var(--line2);background:var(--metal-soft)}

/* ───────── 分页 ───────── */
.pager{display:flex;justify-content:center;align-items:center;gap:7px;margin:28px 0 8px;flex-wrap:wrap}
.pager a,.pager span{min-width:38px;height:38px;padding:0 12px;border-radius:99px;display:inline-flex;align-items:center;justify-content:center;
  font-family:var(--disp);font-size:13.5px;font-weight:700;border:1px solid var(--line2);background:var(--metal-soft);box-shadow:var(--edge);
  color:var(--ink2);transition:color .15s ease,border-color .15s ease}
.pager a:hover{color:var(--o);border-color:rgba(255,106,26,.5)}
.pager .cur{background:var(--orange);border-color:transparent;color:#fff;box-shadow:0 1px 0 rgba(255,255,255,.35) inset,0 6px 14px rgba(228,81,11,.26)}
.pager .gap{border:none;background:none;box-shadow:none}

/* ───────── 类目九宫格（频道页） ───────── */
.cats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.cats.c5{grid-template-columns:repeat(5,1fr)}
.cats.c6{grid-template-columns:repeat(6,1fr)}
.cat{position:relative;padding:20px;border-radius:20px;background:var(--metal);border:1px solid var(--line2);box-shadow:var(--edge),var(--shadow);
  overflow:hidden;cursor:pointer;text-align:left;transition:box-shadow .16s ease,border-color .16s ease;display:block}
.cat:hover{box-shadow:var(--edge),var(--shadow-h);border-color:rgba(255,106,26,.4)}
.cat .ico{width:46px;height:46px;border-radius:13px;font-size:22px;display:flex;align-items:center;justify-content:center;
  background:var(--chrome-soft);border:1px solid var(--line2);box-shadow:var(--edge)}
.cat .t{margin-top:12px;font-size:16px;font-weight:800;color:var(--ink)}
.cat .n{font-size:12.5px;color:var(--ink3);margin-top:1px}
.cat .cnt{position:absolute;top:16px;right:16px;font-size:12px;font-family:var(--disp);font-weight:700;color:var(--ink2);padding:3px 11px;
  border-radius:99px;background:var(--metal-soft);border:1px solid var(--line2);box-shadow:var(--edge)}
.cat[data-hot]::after{content:"HOT";position:absolute;top:-1px;right:-1px;font-size:10px;font-weight:900;letter-spacing:.5px;color:#fff;
  background:var(--orange);padding:3px 10px;border-radius:0 20px 0 12px}
.cat.sm{padding:15px}
.cat.sm .ico{width:38px;height:38px;font-size:18px;border-radius:11px}
.cat.sm .t{font-size:14.5px;margin-top:9px}
.cat.sm .n{font-size:11.5px}
.cat.sm .cnt{display:none}

/* ───────── 频道入口条（首页） ───────── */
.channels{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.ch{position:relative;padding:22px 18px;border-radius:20px;background:var(--metal);border:1px solid var(--line2);box-shadow:var(--edge),var(--shadow);
  text-align:center;overflow:hidden;transition:box-shadow .16s ease,border-color .16s ease}
.ch:hover{box-shadow:var(--edge),var(--shadow-h);border-color:rgba(255,106,26,.4)}
.ch .ico{width:52px;height:52px;margin:0 auto;border-radius:15px;font-size:25px;display:flex;align-items:center;justify-content:center;
  background:var(--chrome-soft);border:1px solid var(--line2);box-shadow:var(--edge)}
.ch .t{margin-top:12px;font-size:16.5px;font-weight:800}
.ch .n{font-size:12px;color:var(--ink3);margin-top:2px}

/* ───────── 详情页 ───────── */
.detail-cols{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:22px;align-items:start;margin-top:16px}
.dmain{border-radius:22px;background:var(--metal);border:1px solid var(--line2);box-shadow:var(--edge),var(--shadow);padding:28px 30px}
.d-title{font-size:clamp(22px,2.8vw,30px);font-weight:900;line-height:1.3}
.d-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:15px}
.d-tag{padding:5px 14px;border-radius:99px;font-size:12.5px;font-weight:700;background:var(--metal-soft);border:1px solid var(--line2);
  box-shadow:var(--edge);color:var(--ink2)}
.d-tag.hl{color:var(--o);background:rgba(255,106,26,.10);border-color:rgba(255,106,26,.24)}
.d-top{display:flex;align-items:center;gap:14px;margin-top:14px;font-size:12.5px;color:var(--ink3);flex-wrap:wrap}
.copy-btn{border:1px solid var(--line2);background:var(--metal-soft);box-shadow:var(--edge);color:var(--ink2);border-radius:99px;
  padding:6px 14px;font-size:12px;cursor:pointer;transition:color .15s ease,border-color .15s ease}
.copy-btn:hover{color:var(--o);border-color:rgba(255,106,26,.5)}
.d-sec{margin-top:30px;position:relative}
.d-sec::before{content:"";display:block;height:3px;border-radius:3px;margin-bottom:16px;background:linear-gradient(90deg,#b7c0cb,#ffffff 42%,#778391)}
html[data-theme="dark"] .d-sec::before{background:linear-gradient(90deg,#3a4552,#8a97a6 42%,#232c38)}
.d-sec h2{font-size:19px;font-weight:850;margin-bottom:12px}
.d-sec p,.d-sec li{font-size:14.5px;line-height:1.95;color:var(--ink2)}
.d-sec ul{padding-left:20px}
.d-sec a{color:var(--o);border-bottom:1px solid rgba(228,81,11,.35);word-break:break-all}
.risk-strip{margin-top:20px;border-radius:14px;background:rgba(201,56,42,.08);border:1px solid rgba(201,56,42,.22);padding:12px 16px;
  font-size:13px;color:var(--red);line-height:1.75}
.warn-strip{margin-top:12px;border-radius:14px;background:rgba(255,180,26,.10);border:1px solid rgba(255,180,26,.28);padding:12px 16px;
  font-size:13px;color:#8a6516;line-height:1.75}
html[data-theme="dark"] .warn-strip{color:#e6c168}
.pay-card{border-radius:22px;background:var(--orange);color:#fff;padding:24px 26px;box-shadow:0 1px 0 rgba(255,255,255,.4) inset,0 14px 30px rgba(228,81,11,.32)}
.pay-card small{font-size:11px;font-weight:900;letter-spacing:.2em;color:rgba(255,255,255,.85)}
.pay-card .v{font-family:var(--disp);font-size:34px;font-weight:900;letter-spacing:-.02em;margin-top:6px}
.btn-ink{display:flex;align-items:center;justify-content:center;gap:9px;border:none;cursor:pointer;background:var(--graphite);color:#fff;
  border-radius:99px;padding:15px 0;font-size:15px;font-weight:800;width:100%;
  box-shadow:0 1px 0 rgba(255,255,255,.16) inset,0 10px 22px rgba(35,44,56,.3);transition:box-shadow .15s ease}
.btn-ink:hover{box-shadow:0 1px 0 rgba(255,255,255,.16) inset,0 14px 30px rgba(35,44,56,.45)}
.btn-line{display:flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;width:100%;border-radius:99px;padding:13px 0;
  font-size:14px;font-weight:700;background:var(--metal-soft);color:var(--ink2);border:1.5px solid var(--line2);box-shadow:var(--edge);
  transition:color .15s ease,border-color .15s ease}
.btn-line:hover{color:var(--o);border-color:rgba(255,106,26,.5)}
.btn-line.is-on{border-color:var(--o2);background:rgba(255,106,26,.14);color:var(--o)}
.meta-rows{padding:4px 20px 16px}
.meta-row{display:flex;justify-content:space-between;gap:12px;padding:11px 0;border-bottom:1px solid var(--line);font-size:13.5px}
.meta-row:last-child{border-bottom:none}
.meta-row span{color:var(--ink3);flex:none}
.meta-row b{font-weight:700;text-align:right;word-break:break-all}
.sim{display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:12px;transition:background-color .13s ease}
.sim:hover{background:rgba(255,106,26,.07)}
.sim .n{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;font-family:var(--disp);font-weight:800;font-size:12px;
  flex:none;background:var(--chrome-soft);border:1px solid var(--line2);box-shadow:var(--edge);color:#3c4652}
html[data-theme="dark"] .sim .n{color:#dfe6ee}
.sim .t{flex:1;min-width:0}
.sim b{display:block;font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sim small{color:var(--ink3);font-size:11.5px}

/* ───────── 表单（发布页） ───────── */
.form-cols{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:22px;align-items:start;margin-top:16px}
.fcard{border-radius:22px;background:var(--metal);border:1px solid var(--line2);box-shadow:var(--edge),var(--shadow);padding:26px 30px}
.fcard+.fcard{margin-top:16px}
.fcard h2{font-size:18px;font-weight:850;margin-bottom:4px}
.fcard .desc{font-size:13px;color:var(--ink3);margin-bottom:18px}
.fitem{margin-bottom:20px}
.fitem>label{display:block;font-size:14px;font-weight:700;margin-bottom:8px}
.fitem>label em{font-style:normal;color:var(--o);margin-left:3px}
.fitem .tip{font-size:12px;color:var(--ink3);margin-top:6px}
.inp,.sel,.txa{width:100%;border:1px solid var(--line2);background:var(--field);color:var(--ink);border-radius:14px;padding:12px 16px;
  font-size:14.5px;font-family:inherit;outline:none;box-shadow:var(--edge);transition:border-color .15s ease,box-shadow .15s ease}
.inp::placeholder,.txa::placeholder{color:var(--ink3)}
.inp:focus,.sel:focus,.txa:focus{border-color:rgba(255,106,26,.65);box-shadow:var(--edge),0 0 0 3px rgba(255,106,26,.15)}
.txa{min-height:150px;resize:vertical;line-height:1.8}
.sel{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--ink3) 50%),linear-gradient(135deg,var(--ink3) 50%,transparent 50%);
  background-position:calc(100% - 20px) 21px,calc(100% - 14px) 21px;background-size:6px 6px,6px 6px;background-repeat:no-repeat;padding-right:44px}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.f3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.pickers{display:flex;gap:8px;flex-wrap:wrap}
.pick{padding:8px 16px;border-radius:99px;font-size:13.5px;border:1px solid var(--line2);background:var(--metal-soft);box-shadow:var(--edge);
  color:var(--ink2);cursor:pointer;transition:color .15s ease,background-color .15s ease,border-color .15s ease}
.pick.on{background:var(--orange);border-color:transparent;color:#fff;font-weight:700;box-shadow:0 1px 0 rgba(255,255,255,.35) inset}
.pick:hover:not(.on){color:var(--ink)}
.upload{border:1.5px dashed var(--line2);border-radius:16px;padding:30px;text-align:center;background:var(--metal-soft);cursor:pointer;
  transition:border-color .15s ease,background-color .15s ease}
.upload:hover{border-color:var(--o2)}
.upload .ic{font-size:28px}
.upload .t{font-size:14px;font-weight:700;margin-top:8px}
.upload .s{font-size:12px;color:var(--ink3);margin-top:3px}
.fsubmit{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:8px}
.btn-primary{height:50px;padding:0 44px;border:none;border-radius:99px;background:var(--orange);color:#fff;font-size:16px;font-weight:800;
  cursor:pointer;box-shadow:0 1px 0 rgba(255,255,255,.4) inset,0 10px 24px rgba(228,81,11,.34);transition:box-shadow .15s ease}
.btn-primary:hover{box-shadow:0 1px 0 rgba(255,255,255,.4) inset,0 14px 32px rgba(228,81,11,.5)}
.btn-ghost{height:50px;padding:0 30px;border-radius:99px;border:1px solid var(--line2);background:var(--metal-soft);box-shadow:var(--edge);
  color:var(--ink2);font-size:15px;font-weight:700;cursor:pointer;transition:color .15s ease,border-color .15s ease}
.btn-ghost:hover{color:var(--ink)}

/* ───────── 黄页商家卡 ───────── */
.biz-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.bizc{border-radius:20px;background:var(--metal);border:1px solid var(--line2);box-shadow:var(--edge),var(--shadow);padding:20px 22px;
  transition:box-shadow .16s ease,border-color .16s ease;display:block}
.bizc:hover{box-shadow:var(--edge),var(--shadow-h);border-color:rgba(255,106,26,.4)}
.bizc .top{display:flex;align-items:center;gap:13px}
.bizc .av{width:48px;height:48px;border-radius:14px;flex:none;display:grid;place-items:center;font-size:22px;
  background:var(--chrome-soft);border:1px solid var(--line2);box-shadow:var(--edge)}
.bizc .nm{font-size:16px;font-weight:800}
.bizc .ct{font-size:12.5px;color:var(--ink3)}
.bizc .rows{margin-top:14px;display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--ink2)}
.bizc .rows i{font-style:normal;color:var(--ink3);margin-right:6px}
.bizc .tel{margin-top:14px;display:inline-flex;align-items:center;gap:7px;padding:8px 18px;border-radius:99px;background:var(--orange);
  color:#fff;font-family:var(--disp);font-weight:800;font-size:14px;box-shadow:0 1px 0 rgba(255,255,255,.35) inset,0 6px 14px rgba(228,81,11,.26)}
.stars{color:#f5a623;font-size:12.5px;letter-spacing:1px}

/* ───────── 用户中心 ───────── */
.tabs{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}
.tabs button{padding:9px 22px;border-radius:99px;font-size:14px;border:1px solid var(--line2);background:var(--metal-soft);box-shadow:var(--edge);
  color:var(--ink2);cursor:pointer;transition:color .15s ease,background-color .15s ease,border-color .15s ease}
.tabs button.on{background:var(--chip-on);border-color:transparent;color:#fff;font-weight:700;box-shadow:0 1px 0 rgba(255,255,255,.16) inset,0 6px 14px rgba(35,44,56,.28)}
.tabs button:hover:not(.on){color:var(--ink)}
.userbar{display:flex;align-items:center;gap:18px;border-radius:22px;background:var(--metal);border:1px solid var(--line2);
  box-shadow:var(--edge),var(--shadow);padding:24px 28px;margin-top:16px;flex-wrap:wrap}
.userbar .av{width:64px;height:64px;border-radius:20px;background:var(--chrome);box-shadow:var(--edge),0 4px 10px rgba(44,54,68,.2);
  display:grid;place-items:center;font-size:28px}
.userbar .nm{font-size:20px;font-weight:850}
.userbar .sub{font-size:13px;color:var(--ink3);margin-top:2px}
.userbar .st{margin-left:auto;display:flex;gap:26px;flex-wrap:wrap}
.userbar .st div{text-align:center}
.userbar .st b{display:block;font-family:var(--disp);font-size:24px;font-weight:900;color:var(--o)}
.userbar .st span{font-size:12px;color:var(--ink3)}
.status{flex:none;font-size:11px;font-weight:800;padding:3px 10px;border-radius:7px}
.status.ok{background:rgba(18,159,106,.12);color:var(--green);border:1px solid rgba(18,159,106,.3)}
.status.wait{background:rgba(255,180,26,.14);color:#8a6516;border:1px solid rgba(255,180,26,.3)}
html[data-theme="dark"] .status.wait{color:#e6c168}
.status.off{background:var(--metal-soft);color:var(--ink3);border:1px solid var(--line2)}

/* ───────── 侧栏 CTA / 信任条 ───────── */
.cta-side{position:relative;padding:24px 20px;text-align:center;background:var(--graphite);color:#f8fafc;overflow:hidden}
.cta-side::after{content:"";position:absolute;left:-30%;top:-120%;width:42%;height:340%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.14),transparent);transform:rotate(14deg);pointer-events:none}
.cta-side h4{font-size:16.5px;font-weight:800;position:relative;z-index:1}
.cta-side p{font-size:12.5px;color:#93a0ae;margin-top:5px;position:relative;z-index:1}
.cta-side .b{position:relative;z-index:1;display:block;margin-top:15px;padding:12px;border-radius:99px;background:var(--orange);color:#fff;
  font-size:14px;font-weight:800;box-shadow:0 1px 0 rgba(255,255,255,.4) inset,0 8px 18px rgba(228,81,11,.34);transition:box-shadow .15s ease}
.cta-side .b:hover{box-shadow:0 1px 0 rgba(255,255,255,.4) inset,0 10px 24px rgba(228,81,11,.5)}
.trustlist{padding:6px 20px 18px;display:flex;flex-direction:column;gap:11px}
.trustlist .t{display:flex;gap:10px;align-items:flex-start;font-size:13px;color:var(--ink2);line-height:1.55}
.trustlist .ic{flex:none;width:22px;height:22px;border-radius:50%;color:var(--o);background:rgba(255,106,26,.12);
  border:1px solid rgba(255,106,26,.2);display:grid;place-items:center;font-size:12px;margin-top:-1px}
.trustlist b{color:var(--ink)}

/* ───────── 底部大 CTA + 页脚 ───────── */
.bigcta{margin-top:52px;position:relative;border-radius:26px;overflow:hidden;border:1px solid rgba(255,255,255,.10);background:var(--graphite);
  box-shadow:0 1px 0 rgba(255,255,255,.14) inset,0 22px 44px rgba(13,18,24,.32)}
.bigcta::after{content:"";position:absolute;left:-20%;top:-120%;width:30%;height:340%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.14),transparent);transform:rotate(14deg);pointer-events:none}
.bigcta .in{padding:44px 30px;text-align:center;position:relative;z-index:1}
.bigcta h2{font-size:clamp(22px,3.4vw,32px);font-weight:900;color:#f8fafc}
.bigcta p{margin-top:8px;color:#93a0ae;font-size:14.5px}
.bigcta .btn{display:inline-block;margin-top:22px;padding:13px 42px;border-radius:99px;background:var(--orange);color:#fff;font-size:16px;
  font-weight:800;box-shadow:0 1px 0 rgba(255,255,255,.4) inset,0 10px 24px rgba(228,81,11,.4);transition:box-shadow .15s ease}
.bigcta .btn:hover{box-shadow:0 1px 0 rgba(255,255,255,.4) inset,0 12px 30px rgba(228,81,11,.55)}

footer{margin-top:52px;border-top:1px solid var(--line2);background:var(--note-bg)}
.fgrid{display:grid;grid-template-columns:1.4fr repeat(4,1fr);gap:26px;padding:36px 0 26px}
.fgrid .col h5{font-size:14px;font-weight:800;margin-bottom:12px}
.fgrid .col a{display:block;font-size:13px;color:var(--ink2);padding:4px 0}
.fgrid .col a:hover{color:var(--o)}
.fgrid .about .lg{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.fgrid .about p{font-size:12.5px;color:var(--ink3);line-height:1.8;max-width:300px}
.fbot{border-top:1px solid var(--line);padding:18px 0 26px;text-align:center;font-size:12px;color:var(--ink3);line-height:1.9}

/* ───────── 响应式 ───────── */
@media (max-width:1100px){
  .channels{grid-template-columns:repeat(3,1fr)}
  .biz-grid{grid-template-columns:repeat(2,1fr)}
  .cats.c5,.cats.c6{grid-template-columns:repeat(4,1fr)}
  .fgrid{grid-template-columns:1fr 1fr 1fr}
}
@media (max-width:960px){
  .hnav{display:none}
  .detail-cols,.form-cols{grid-template-columns:1fr}
  /* 列表页/首页/搜索页的「列表 + 330px 侧栏」写在内联 style 里，窄屏不改就把列表那列挤成 0 宽（2026-09-14） */
  [style*="1fr) 330px"]{grid-template-columns:minmax(0,1fr) !important}
  .cats,.cats.c5,.cats.c6{grid-template-columns:repeat(2,1fr)}
  .wrap{padding:0 18px}
}
@media (max-width:640px){
  .header .wrap{gap:10px}
  .city-pick{display:none}
  .btn-post{padding:0 15px;font-size:13.5px}
  .channels{grid-template-columns:repeat(2,1fr)}
  .biz-grid{grid-template-columns:1fr}
  .cats{gap:10px}
  .cat{padding:16px}
  .cat .cnt{display:none}
  .card{padding:13px 14px;gap:10px}
  .cidx{display:none}
  .cage{min-width:0;font-size:11.5px}
  .f2,.f3{grid-template-columns:1fr}
  .frow{flex-direction:column;gap:6px}
  .frow .lb{width:auto;padding-top:0}
  .dmain,.fcard{padding:20px 18px}
  .fgrid{grid-template-columns:1fr 1fr}
  .userbar .st{margin-left:0;width:100%;justify-content:space-between;gap:12px}
}

/* ═══════════ 二期：对齐大地360 补齐的组件 ═══════════ */

/* 登录/注册入口 */
.login-lnk{font-size:13.5px;color:var(--ink2);white-space:nowrap;padding:7px 12px;border-radius:99px;transition:color .15s ease,background-color .15s ease}
.login-lnk:hover{color:var(--o);background:rgba(255,106,26,.08)}

/* 英文输入助手 */
.en-pop{display:none;position:fixed;top:74px;right:28px;z-index:80;width:340px;border-radius:20px;background:var(--metal);
  border:1px solid var(--line2);box-shadow:var(--edge),var(--shadow-h);padding:18px 20px}
.en-pop.show{display:block}
.en-in b{font-size:15px;font-weight:800;display:block}
.en-in span{font-size:12.5px;color:var(--ink3);display:block;margin:3px 0 12px}
.en-res{margin-top:12px;display:flex;flex-direction:column;gap:6px;max-height:230px;overflow-y:auto}
.en-res .r{display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:11px;background:var(--metal-soft);
  border:1px solid var(--line);font-size:13.5px;cursor:pointer;transition:border-color .15s ease}
.en-res .r:hover{border-color:var(--o2)}
.en-res .r b{font-size:13.5px;flex:none;font-weight:700}
.en-res .r i{font-style:normal;flex:1;color:var(--ink2);font-family:var(--disp);font-size:13px}
.en-res .r em{font-style:normal;font-size:11px;color:var(--ink3)}
.en-res .none{font-size:13px;color:var(--ink3);padding:8px 2px}

/* 富文本编辑器 */
.editor{border:1px solid var(--line2);border-radius:16px;overflow:hidden;background:var(--field);box-shadow:var(--edge)}
.etool{display:flex;align-items:center;gap:5px;flex-wrap:wrap;padding:9px 12px;background:var(--metal-soft);
  border-bottom:1px solid var(--line);position:relative}
.eb{height:30px;min-width:30px;padding:0 10px;border-radius:9px;border:1px solid var(--line2);background:var(--metal);
  box-shadow:var(--edge);color:var(--ink2);font-size:13px;cursor:pointer;transition:color .15s ease,border-color .15s ease}
.eb:hover{color:var(--o);border-color:rgba(255,106,26,.5)}
.esel{height:30px;border-radius:9px;border:1px solid var(--line2);background:var(--metal);box-shadow:var(--edge);
  color:var(--ink2);font-size:12.5px;padding:0 8px;font-family:inherit;cursor:pointer}
.esep{width:1px;height:20px;background:var(--line2);margin:0 4px}
.editor .txa{border:none;border-radius:0;box-shadow:none;background:transparent}
.editor .txa:focus{box-shadow:none}
.ebar{display:flex;align-items:center;gap:12px;padding:10px 14px;border-top:1px solid var(--line);background:var(--metal-soft)}
.ebar .tip{flex:1;font-size:12px;color:var(--ink3)}
.btn-ghost.sm{height:34px;padding:0 18px;font-size:13px}
.emoji-pop{display:none;position:absolute;top:44px;right:12px;z-index:20;width:250px;padding:12px;border-radius:14px;
  background:var(--metal);border:1px solid var(--line2);box-shadow:var(--edge),var(--shadow-h);font-size:20px;line-height:1.9;
  word-spacing:6px;cursor:pointer}
.emoji-pop.show{display:block}
/* 表情拆成按钮后单击就能插入（2026-09-14） */
.emoji-pop .emo{border:none;background:transparent;font-size:20px;line-height:1;padding:5px;margin:1px;
  border-radius:8px;cursor:pointer;font-family:inherit}
.emoji-pop .emo:hover{background:var(--metal-soft)}
.preview-box{border-top:1px solid var(--line);background:var(--metal-soft)}
.pv-h{font-size:12px;font-weight:800;color:var(--ink3);padding:10px 16px 0;letter-spacing:.5px}
.pv-b{padding:12px 16px 18px;font-size:14.5px;line-height:1.9;color:var(--ink2);white-space:pre-wrap}
.pv-b b{color:var(--ink)}

/* 验证码 */
.captcha{display:flex;gap:14px;align-items:flex-start;flex-wrap:wrap;margin-bottom:16px}
.cap-img{flex:none;width:150px;height:52px;border-radius:12px;display:grid;place-items:center;
  background:linear-gradient(160deg,#e9eef4,#cfd8e3);border:1px solid var(--line2);box-shadow:var(--edge);
  font-family:var(--disp);font-size:23px;font-weight:900;letter-spacing:3px;color:#3c4652;
  text-shadow:1px 1px 0 rgba(255,255,255,.7);user-select:none;font-style:italic}
html[data-theme="dark"] .cap-img{background:linear-gradient(160deg,#3b4756,#232c38);color:#dfe6ee;text-shadow:none}
.cap-in{flex:1;min-width:200px}
.cap-new{margin-top:7px;background:none;border:none;color:var(--o);font-size:12.5px;cursor:pointer;
  border-bottom:1px solid rgba(228,81,11,.4);padding:0}
.agree{display:flex;gap:9px;align-items:flex-start;font-size:13px;color:var(--ink2);line-height:1.7;cursor:pointer}
.agree input{margin-top:4px;flex:none;accent-color:#e4510b;width:15px;height:15px}
.agree a{color:var(--o);border-bottom:1px solid rgba(228,81,11,.35)}

/* 详情页：话术 / 版权 / 频道跳转 */
.notice-line{margin-top:18px;text-align:center;font-size:13.5px;color:var(--ink2);padding:11px;border-radius:12px;
  background:rgba(255,106,26,.07);border:1px dashed rgba(255,106,26,.3)}
.notice-line b{color:var(--o)}
.copy-line{margin-top:9px;text-align:center;font-size:12px;color:var(--ink3);letter-spacing:.5px}
.jumpbar{display:flex;align-items:center;gap:12px;margin-top:18px;padding:16px 20px;border-radius:18px;
  background:var(--metal);border:1px solid var(--line2);box-shadow:var(--edge),var(--shadow);flex-wrap:wrap}
.jumpbar span{font-size:13.5px;color:var(--ink3);font-weight:600;flex:none}
.jumpbar .sel{flex:1;min-width:220px}

/* 举报弹窗 */
.report-pop{display:none;position:fixed;inset:0;z-index:200;background:rgba(13,18,24,.55);backdrop-filter:blur(4px);
  align-items:center;justify-content:center;padding:22px}
.report-pop.show{display:flex}
.rp-in{width:100%;max-width:540px;max-height:88vh;overflow-y:auto;border-radius:22px;background:var(--metal);
  border:1px solid var(--line2);box-shadow:var(--edge),0 30px 70px rgba(0,0,0,.4)}
.rp-h{display:flex;align-items:center;padding:20px 24px 6px;font-size:18px;font-weight:850}
.rp-x{margin-left:auto;width:32px;height:32px;border-radius:50%;border:1px solid var(--line2);background:var(--metal-soft);
  box-shadow:var(--edge);color:var(--ink2);cursor:pointer;font-size:14px}
.rp-x:hover{color:var(--o)}
.rp-b{padding:14px 24px 24px}

/* FAQ */
.faq{padding:18px 0;border-bottom:1px solid var(--line)}
.faq:last-child{border-bottom:none}
.faq .q{font-size:15.5px;font-weight:800;color:var(--ink)}
.faq .a{margin-top:7px;font-size:14px;line-height:1.9;color:var(--ink2)}

/* 登录页 */
/* 登录页整块居中。只写 max-width 不写左右 auto 的话，它会在 1400px 的 .wrap 里贴着左边挂，
   右边空一大片（2026-09-04 用户提的）。标题也要同宽同居中，否则标题和卡片左边缘对不齐。 */
.auth-wrap{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:22px;align-items:start;
  margin:16px auto 0;max-width:960px}
.auth-page .page-head{max-width:960px;margin-left:auto;margin-right:auto}
.auth-card{border-radius:22px;background:var(--metal);border:1px solid var(--line2);box-shadow:var(--edge),var(--shadow);padding:28px 30px}
.auth-alt{margin-top:14px;text-align:center;font-size:13px;color:var(--ink3);display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.auth-alt a{color:var(--o)}
.auth-or{margin:20px 0;text-align:center;position:relative}
.auth-or::before{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:var(--line2)}
.auth-or span{position:relative;background:var(--field);padding:0 14px;font-size:12.5px;color:var(--ink3)}
html[data-theme="dark"] .auth-or span{background:#232c38}
.auth-third{display:flex;flex-direction:column;gap:10px}

/* 法律声明块 */
.legal{padding:20px 0 4px;font-size:12px;line-height:1.9;color:var(--ink3);border-top:1px solid var(--line)}
.legal b{color:var(--ink2)}
.legal a{color:var(--o)}

@media (max-width:960px){
  .auth-wrap{grid-template-columns:1fr}
  .en-pop{right:14px;left:14px;width:auto}
}
@media (max-width:640px){
  .login-lnk{display:none}
  .captcha{flex-direction:column}
  .cap-img{width:100%}
}

/* ═══════════ 三期：对齐华人168 补齐的组件 ═══════════ */

.livebar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:10px 18px;border-radius:99px;
  background:var(--metal-soft);border:1px solid var(--line2);box-shadow:var(--edge);font-size:13px;color:var(--ink2)}
.livebar b{font-family:var(--disp);font-size:15px;color:var(--o);font-weight:900}
.lb-dot{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 8px var(--green);
  animation:pulse 1.8s infinite;flex:none}
.lb-t{color:var(--ink3);font-size:12px}
@keyframes pulse{50%{opacity:.35}}

.adslot{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:14px;padding:14px 20px;border-radius:16px;
  background:var(--metal);border:1px dashed var(--line2);box-shadow:var(--edge);transition:border-color .15s ease}
.adslot:hover{border-color:var(--o2)}
.ad-tag{flex:none;font-size:10.5px;font-weight:800;padding:3px 9px;border-radius:6px;background:var(--metal-soft);
  border:1px solid var(--line2);color:var(--ink3);letter-spacing:.5px}
.adslot b{font-size:15px;font-weight:800}
.ad-s{font-size:13px;color:var(--ink2)}
.ad-tel{font-family:var(--disp);font-weight:800;font-size:14px;color:#fff;background:var(--orange);border-radius:99px;
  padding:6px 14px;box-shadow:0 1px 0 rgba(255,255,255,.35) inset}
.ad-buy{margin-left:auto;font-size:12.5px;color:var(--o);font-weight:700;white-space:nowrap}

.badge.ok{background:rgba(18,159,106,.13);color:var(--green);border:1px solid rgba(18,159,106,.32)}

.regionbox{margin-top:14px;border-radius:20px;background:var(--metal);border:1px solid var(--line2);
  box-shadow:var(--edge),var(--shadow);overflow:hidden}
.rb-head{display:flex;align-items:center;gap:12px;padding:15px 20px;flex-wrap:wrap}
.rb-head b{font-size:15px;font-weight:800}
.rb-cur{font-size:13.5px;color:var(--o);font-weight:700;padding:4px 14px;border-radius:99px;
  background:rgba(255,106,26,.10);border:1px solid rgba(255,106,26,.25)}
.rb-tgl{margin-left:auto;font-size:13px;color:var(--ink2);background:var(--metal-soft);border:1px solid var(--line2);
  box-shadow:var(--edge);border-radius:99px;padding:6px 16px;cursor:pointer;transition:color .15s ease,border-color .15s ease}
.rb-tgl:hover{color:var(--o);border-color:rgba(255,106,26,.5)}
.rb-body{padding:0 20px 18px;border-top:1px solid var(--line)}
.zone{padding:14px 0;border-bottom:1px solid var(--line)}
.zone:last-of-type{border-bottom:none}
.zh{font-size:13.5px;font-weight:800;color:var(--ink);margin-bottom:9px;display:flex;align-items:center;gap:8px}
.zh span{font-size:11.5px;font-weight:600;color:var(--ink3);padding:2px 9px;border-radius:99px;
  background:var(--metal-soft);border:1px solid var(--line)}
.zs{display:flex;gap:7px;flex-wrap:wrap}
.st{padding:5px 14px;border-radius:99px;font-size:13px;color:var(--ink2);background:var(--metal-soft);
  border:1px solid var(--line2);box-shadow:var(--edge);cursor:pointer;transition:color .15s ease,background-color .15s ease,border-color .15s ease}
.st:hover{color:var(--ink);border-color:var(--ink3)}
.st.on{background:var(--orange);border-color:transparent;color:#fff;font-weight:700;box-shadow:0 1px 0 rgba(255,255,255,.35) inset}
.citywrap{margin-top:6px}
.cityset{display:flex;gap:7px;flex-wrap:wrap;padding:12px 14px;border-radius:14px;background:var(--metal-soft);
  border:1px solid var(--line);margin-top:8px}
.ct{padding:4px 13px;border-radius:99px;font-size:12.5px;color:var(--ink2);background:transparent;
  border:1px solid var(--line2);cursor:pointer;transition:color .15s ease,background-color .15s ease}
.ct:hover{color:var(--o);border-color:rgba(255,106,26,.5)}
.ct.on{background:var(--chip-on);border-color:transparent;color:#fff;font-weight:700}

.l3more{background:none;border:none;cursor:pointer;font-family:inherit}
.l3box{border-radius:20px;background:var(--metal);border:1px solid var(--line2);box-shadow:var(--edge),var(--shadow);
  padding:6px 20px;position:relative}
.l3box.collapsed{max-height:250px;overflow:hidden}
.l3box.collapsed::after{content:"";position:absolute;left:0;right:0;bottom:0;height:90px;pointer-events:none;
  background:linear-gradient(180deg,transparent,rgba(241,245,249,.96))}
html[data-theme="dark"] .l3box.collapsed::after{background:linear-gradient(180deg,transparent,rgba(30,38,48,.96))}
.l3row{display:flex;gap:14px;padding:13px 0;border-bottom:1px solid var(--line);align-items:flex-start}
.l3row:last-child{border-bottom:none}
.l3n{flex:none;width:104px;font-size:13.5px;font-weight:800;color:var(--ink);padding-top:4px}
.l3n span{display:block;font-size:11px;font-weight:500;color:var(--ink3);margin-top:1px}
.l3s{flex:1;display:flex;gap:7px;flex-wrap:wrap}
.l3c{padding:4px 12px;border-radius:99px;font-size:12.5px;color:var(--ink2);background:var(--metal-soft);
  border:1px solid var(--line);cursor:pointer;transition:color .15s ease,border-color .15s ease,background-color .15s ease}
.l3c:hover{color:var(--o);border-color:rgba(255,106,26,.5)}
.l3c.on{background:var(--orange);border-color:transparent;color:#fff;font-weight:700}

@media (max-width:640px){
  .l3row{flex-direction:column;gap:7px}
  .l3n{width:auto;padding-top:0}
  .ad-buy{margin-left:0;width:100%}
  .rb-head{gap:8px}
}

/* ═══════════ 顶部导航改版：双层结构 ═══════════ */

.header{position:sticky;top:0;z-index:60;background:var(--hd);backdrop-filter:blur(16px) saturate(1.3);
  -webkit-backdrop-filter:blur(16px) saturate(1.3);border-bottom:1px solid var(--line2);
  box-shadow:0 1px 0 rgba(255,255,255,.5) inset,0 6px 20px rgba(44,54,68,.06)}
html[data-theme="dark"] .header{box-shadow:0 1px 0 rgba(255,255,255,.06) inset,0 6px 20px rgba(0,0,0,.4)}

/* 第一层：Logo + 搜索 + 用户区 */
.hbar .wrap{display:flex;align-items:center;gap:20px;height:64px}
.hbar .logo{flex:none}
.hsearch{flex:1;max-width:520px;display:flex;align-items:center;gap:8px;height:40px;padding:0 6px 0 16px;
  border-radius:99px;background:var(--metal-soft);border:1px solid var(--line2);box-shadow:var(--edge);
  transition:border-color .16s ease,box-shadow .16s ease}
.hsearch:focus-within{border-color:rgba(255,106,26,.6);box-shadow:var(--edge),0 0 0 3px rgba(255,106,26,.14)}
.hs-ic{font-size:14px;color:var(--ink3);flex:none}
.hsearch input{flex:1;border:none;outline:none;background:transparent;color:var(--ink);font-size:14px;min-width:0}
.hsearch input::placeholder{color:var(--ink3)}
.hs-go{flex:none;height:30px;padding:0 18px;border:none;border-radius:99px;background:var(--orange);color:#fff;
  font-size:13px;font-weight:800;cursor:pointer;box-shadow:0 1px 0 rgba(255,255,255,.35) inset}

.hright{margin-left:auto;display:flex;align-items:center;gap:8px}
.hicon{height:36px;min-width:36px;padding:0 10px;border-radius:99px;border:1px solid var(--line2);
  background:var(--metal-soft);box-shadow:var(--edge);color:var(--ink2);font-size:15px;cursor:pointer;
  display:inline-flex;align-items:center;gap:5px;transition:color .15s ease,border-color .15s ease}
.hicon:hover{color:var(--o);border-color:rgba(255,106,26,.5)}
.hicon em{font-style:normal;font-size:13px;font-weight:600}
.hfav{height:36px;padding:0 13px;border-radius:99px;border:1px solid var(--line2);background:var(--metal-soft);
  box-shadow:var(--edge);color:var(--ink2);font-size:15px;display:inline-flex;align-items:center;gap:6px;
  transition:color .15s ease,border-color .15s ease}
.hfav:hover{color:var(--o);border-color:rgba(255,106,26,.5)}
.hfav .cnt{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;
  border-radius:99px;font-size:11px;font-weight:800;font-family:var(--disp);background:var(--orange);color:#fff}

/* 第二层：频道导航 */
.hnavbar{border-top:1px solid var(--line)}
.hnavbar .wrap{display:flex;align-items:center}
.hnav{display:flex;gap:2px;font-size:14.5px;color:var(--ink2);overflow-x:auto;scrollbar-width:none;
  -ms-overflow-style:none;padding:7px 0;width:100%}
.hnav::-webkit-scrollbar{display:none}
.hnav a{display:inline-flex;align-items:center;gap:6px;padding:8px 15px;border-radius:99px;font-weight:600;
  white-space:nowrap;flex:none;position:relative;
  transition:background-color .15s ease,color .15s ease,box-shadow .15s ease}
.hnav a i{font-style:normal;font-size:14px;line-height:1;opacity:.85}
.hnav a:hover{color:var(--ink);background:rgba(255,106,26,.08)}
.hnav a.on{color:#fff;background:var(--orange);font-weight:750;
  box-shadow:0 1px 0 rgba(255,255,255,.35) inset,0 5px 14px rgba(228,81,11,.3)}
.hnav a.on i{opacity:1}

.en-pop{top:112px}

/* 语言切换按钮（2026-09-09）。只在配了界面词表的国家出现（countries/xx.py 的 LOCAL_UI）。
   放在顶栏右侧、主题按钮旁边，一眼能找到；不做下拉，就两个语言，一键切。 */
.hsw{height:36px;padding:0 13px;border-radius:99px;border:1px solid var(--line2);
  background:var(--metal-soft);box-shadow:var(--edge);color:var(--ink2);font-size:13px;
  font-weight:700;display:inline-flex;align-items:center;gap:6px;white-space:nowrap;
  transition:color .15s ease,border-color .15s ease}
.hsw:hover{color:var(--o);border-color:rgba(255,106,26,.5)}
@media (max-width:1100px){.hsw{padding:0 10px;font-size:12.5px}}

@media (max-width:1100px){
  .hsearch{max-width:340px}
  .login-lnk{display:none}
}
@media (max-width:860px){
  .hbar .wrap{gap:12px;height:58px}
  .hsearch{display:none}
  .hicon#enInput{display:none}
  .en-pop{top:104px}
}
@media (max-width:640px){
  .hbar .wrap{gap:8px}
  .hicon#cityBtn em{display:none}
  .hfav{display:none}
  .btn-post{padding:0 14px;font-size:13.5px;height:36px}
  .hnav{font-size:13.5px;padding:6px 0}
  .hnav a{padding:7px 12px}
  .en-pop{top:96px}
  /* 手机顶栏不许撑破屏幕（2026-09-14，375px 原来被撑到 468/550px）：
     站名放不下就省略号，🌐 只留图标，城市按钮本来点了没反应先藏，发布按钮压窄。
     选择器多带一层 .hbar/.hright，压过皮肤文件里不分屏宽的 .btn-post / .logo .name */
  .hbar .logo{flex:0 1 auto;min-width:0;gap:8px}
  .hbar .logo .name{font-size:16px;min-width:0;overflow:hidden;text-overflow:ellipsis}
  .hright{flex:0 0 auto;min-width:0;gap:6px}
  .hright .hsw{width:36px;padding:0;gap:0;justify-content:center;font-size:0}
  .hright .hsw::before{content:"\1F310";font-size:16px;line-height:1}
  .hright .hicon#cityBtn{display:none}
  .hright .btn-post{height:36px;padding:0 12px;font-size:13px;white-space:nowrap}
}
@media (max-width:420px){
  .hright .btn-post{font-size:0}
  .hright .btn-post::before{content:"\FF0B  \53D1\5E03";font-size:13px}
  .hright .btn-post:lang(es)::before{content:"\FF0B  Publicar"}
}

/* 首页顶部不出搜索（用 Hero 大搜索），占位保持布局 */
.hsearch-ph{flex:1}

/* 分类卡选中态（接管筛选后） */
.cat.picked{border-color:var(--o2);box-shadow:var(--edge),0 0 0 2px rgba(255,106,26,.35),var(--shadow-h)}
.cat.picked .t{color:var(--o)}
.cat.picked .ico{background:var(--orange);border-color:transparent}

/* ═══════════ 数据驱动版新增组件 ═══════════ */

/* GEO 事实卡：结构化关键事实，AI 与用户都能一眼提取 */
.factcard{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:1px;margin-top:16px;
  border-radius:18px;overflow:hidden;background:var(--line2);border:1px solid var(--line2);box-shadow:var(--edge),var(--shadow)}
.fc-i{background:var(--metal);padding:13px 18px;display:flex;flex-direction:column;gap:2px}
.fc-i span{font-size:12px;color:var(--ink3)}
.fc-i b{font-size:14.5px;font-weight:750;color:var(--ink);word-break:break-word}
.fc-n{grid-column:1/-1;background:var(--metal-soft);padding:10px 18px;font-size:12px;color:var(--ink3)}

/* FAQ */
.faqbox{border-radius:20px;background:var(--metal);border:1px solid var(--line2);box-shadow:var(--edge),var(--shadow);padding:6px 22px}
.faq-i{border-bottom:1px solid var(--line);padding:4px 0}
.faq-i:last-child{border-bottom:none}
.faq-i summary{cursor:pointer;padding:14px 0;font-size:15.5px;font-weight:750;list-style:none;
  display:flex;align-items:center;gap:10px;transition:color .15s ease}
.faq-i summary::-webkit-details-marker{display:none}
.faq-i summary::before{content:"＋";flex:none;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;
  font-size:13px;color:var(--o);background:rgba(255,106,26,.12);border:1px solid rgba(255,106,26,.22)}
.faq-i[open] summary::before{content:"−"}
.faq-i summary:hover{color:var(--o)}
.faq-i>div{padding:0 0 16px 32px;font-size:14px;line-height:1.95;color:var(--ink2)}

/* 详情页来源列表 */
.srclist{margin:12px 0 0;padding-left:20px}
.srclist li{font-size:13.5px;line-height:2;color:var(--ink2)}
.srclist a{color:var(--o)}
.srcnote{margin-top:10px;font-size:12.5px;color:var(--ink3)}
.tel-link{color:var(--o);font-weight:700;border-bottom:1px solid rgba(228,81,11,.4);white-space:nowrap}

/* 列表页地区筛选做成真链接 */
a.fopt{text-decoration:none;display:inline-flex;align-items:center;gap:6px}
a.fopt em{font-style:normal;font-size:11px;font-family:var(--disp);color:var(--ink3);font-weight:700}
a.fopt.on em,.fopt.on em{color:rgba(255,255,255,.8)}

/* 网站地图页多列 */
.smgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:2px}

/* 详情页正文段落 */
.d-sec p+p{margin-top:10px}
.dmain h1.d-title{margin-bottom:2px}
.card .ctitle{font-size:15px;font-weight:750;margin:0}
aside{min-width:0}

@media (max-width:640px){
  .factcard{grid-template-columns:1fr 1fr}
  .faqbox{padding:4px 16px}
  .faq-i>div{padding-left:0}
}

/* 空频道状态 */
.emptybox{border-radius:22px;background:var(--metal);border:1px solid var(--line2);box-shadow:var(--edge),var(--shadow);
  padding:44px 30px;text-align:center}
.eb-ic{font-size:44px}
.eb-t{margin-top:12px;font-size:20px;font-weight:850}
.eb-s{margin-top:8px;font-size:14px;color:var(--ink2);max-width:520px;margin-left:auto;margin-right:auto;line-height:1.9}
.emptybox .channels{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}

/* 换分类/换地区/翻页的链接末尾带 #browse，落点就是这个锚。
   scroll-margin-top 要盖过吸顶导航（第一层 66px + 频道栏约 48px），
   不然筛选那两排会被导航压住。浏览器处理锚点在首次绘制之前，所以零闪动 ——
   别再改回用 JS 存滚动位置还原，那个一定会肉眼可见地跳一下（2026-09-03 撤过一次）。 */
.anchor{display:block;height:0;scroll-margin-top:124px}
/* 锚点要能顶到头，页面就得足够长。类目页只有 1~4 条时正文太短，浏览器滚不到位，
   筛选那两排就比长页面落得低 —— 在长页和短页之间来回点就是一跳一跳的。
   给「列表 + 右栏」这块一个最小高度（一屏减掉吸顶导航），任何页面锚点都能顶到同一个位置。 */
.listcols{min-height:calc(100vh - 124px)}
@media(max-width:900px){.anchor{scroll-margin-top:104px}}

/* 功能还没做的入口做成不可点的灰字。别写成指向空锚点的链接 —— 点了会把页面甩到页顶，
   就是「页面自己跳」那类问题，闸门 scripts/check_no_autoscroll.py 会拦。 */
.auth-alt .off{color:var(--ink3);cursor:default}