/* 辛集房产信息网 */
:root{
  /* 默认值：必须写字面量，不能自引用（var(--bg) 之类会让颜色失效） */
  --bg:#f5f6f8; --card:#fff; --line:#e5e8ec; --text:#1f2328; --muted:#6b7480;
  --gold:#b8934a; --gold2:#d8b877; --dark:#232733; --green:#2e8b57; --red:#c0392b;
  --radius:12px; --wrap:1180px;
  /* 主题扩展变量（由 assets/theme.css 按 html[data-theme] 覆盖） */
  --muted2:#8b93a1; --gold3:#8a6d2f;
  /* V100：房贷计算器专用说明色。--muted2(#8b93a1) 在白底上对比度仅 3.1:1，
     低于 WCAG AA 的 4.5:1，小字号(11.5px)尤其看不清。
     V107 再加深一档：#4d5663 在白底是 7.4:1，但一旦开启背景图，
     页面空白处透出的是背景图（实测蒙版后 rgb(229,222,198) 甚至更深），
     对比度掉到 6.3:1 以下，11.5px 的免责声明就糊了。此色为 8.6:1。
     ⚠ 深色主题必须单独覆盖（见 theme.css）：这一档是给浅底用的深字，
       在 --card:#1e222a 上会变成「深字压深底」，几乎隐形。 */
  --loan-mu:#39414f;
  --topbar:#f0f2f5; --hero1:#2b3140; --hero2:#1d222c; --chip:#f0f2f5;
  --hdrbg:#fff; --hdrtext:#1f2328; --onbrand:#fff; --ondark:#fff;
  --tint1:#fffdf6; --tint2:#fdf6e6; --tintline:#f0e4c4;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:var(--bg);color:var(--text);
  font:15px/1.7 -apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;
  -webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 20px}
main.wrap{padding:20px 20px 46px;min-height:50vh}

/* ---------- Topbar ---------- */
.topbar{background:var(--topbar);border-bottom:1px solid var(--line);font-size:12.5px;color:var(--muted)}
.topbar-in{display:flex;align-items:center;justify-content:space-between;height:34px;gap:14px}
.topbar-r{display:flex;gap:14px}
.topbar-r a:hover{color:var(--gold)}

/* ---------- Header ---------- */
.site-header{background:var(--hdrbg);border-bottom:1px solid var(--line)}
.header-inner{display:flex;align-items:center;gap:24px;padding:16px 20px;flex-wrap:wrap}
.brand{display:flex;align-items:center;line-height:1.2}
.site-logo{max-width:100%;height:auto;object-fit:contain;display:block}
@media (max-width:680px){ .site-logo{max-height:32px !important} }
.brand-cn{font-size:21px;font-weight:800;color:var(--dark);letter-spacing:.5px}
.brand-sub{font-size:11px;color:var(--gold);letter-spacing:1.2px;margin-top:2px}
.hsearch{flex:1;min-width:220px;max-width:420px;display:flex}
.hsearch input{
  flex:1;width:100%;min-width:0;height:40px;padding:0 14px;border:2px solid var(--gold);border-right:0;border-radius:8px 0 0 8px;
  font-size:14px;outline:0;background:var(--card);color:var(--text)
}
.hsearch button{
  height:40px;padding:0 22px;border:0;border-radius:0 8px 8px 0;background:var(--gold);color:var(--onbrand);
  font-size:14px;font-weight:600;cursor:pointer
}
.hsearch button:hover{background:var(--gold3)}

/* V100 搜索框下拉（热搜 TOP10 + 拼音匹配） */
/* V102：必须自己也是 flex 容器。
   V100 为了放下拉框把 input 包进了 .hs-box，但 .hsearch input 的 flex:1
   是对 .hsearch 生效的——放进不是 flex 的 .hs-box 之后就失效了，
   input 退回浏览器默认宽度（约 232px）：
     · 宽屏：输入框右边空出一大截，和「搜索」按钮之间裂开一条缝
     · 窄屏：input 撑出 .hs-box，被后面的「搜索」按钮压掉一截（这就是"被遮挡"）
   让 .hs-box 也 flex，input 才会真正填满它。 */
.hs-box{position:relative;flex:1;min-width:0;display:flex}
.hs-drop{position:absolute;top:calc(100% + 5px);left:0;right:0;z-index:60;
  background:var(--card);border:1px solid var(--line);border-radius:10px;
  box-shadow:0 8px 24px rgba(0,0,0,.12);overflow:hidden;max-height:340px;overflow-y:auto}
.hs-drop-t{font-size:11.5px;color:var(--muted2);padding:9px 13px 6px;
  border-bottom:1px solid var(--line);background:var(--bg)}
.hs-drop-i{display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:9px 13px;font-size:13.5px;color:var(--text);border-bottom:1px solid var(--topbar)}
.hs-drop-i:last-child{border-bottom:0}
.hs-drop-i:hover,.hs-drop-i.on{background:var(--chip)}
.hs-drop-i.on{color:var(--gold);font-weight:600}
.hs-drop-n{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hs-drop-c{flex:0 0 auto;font-size:11.5px;color:var(--muted2)}
@media(max-width:640px){.hs-drop{max-height:280px}}
.header-right{display:flex;align-items:center;gap:16px}
.btn-gold{padding:9px 20px;border-radius:8px;font-size:14px;font-weight:600;
  background:linear-gradient(135deg,var(--gold2),var(--gold));color:#241d10;white-space:nowrap}
.btn-gold:hover{filter:brightness(1.06)}
.hstat{font-size:12.5px;color:var(--muted);white-space:nowrap}
.hstat b{color:var(--gold);font-size:14px}

/* ---------- Nav ---------- */
.mainnav{background:var(--dark)}
.nav-in{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none}
.nav-in::-webkit-scrollbar{display:none}
.nav-in a{padding:12px 16px;font-size:14.5px;color:#c3cad6;white-space:nowrap}
.nav-in a:hover{color:var(--ondark);background:rgba(255,255,255,.08)}
.nav-in a.on{color:var(--gold2);font-weight:600;box-shadow:inset 0 -3px 0 var(--gold)}

/* ---------- 首页 ---------- */
.hero{background:linear-gradient(120deg,#2b3140,#1d222c);border-radius:14px;padding:24px 28px;color:var(--ondark);
  display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:18px}
.hero h1{margin:0 0 6px;font-size:23px;font-weight:800}
.hero p{margin:0;font-size:13.5px;color:var(--muted2)}
.hero-r{display:flex;gap:22px}
.hero-r div{text-align:center}
.hero-r b{display:block;font-size:21px;color:var(--gold2)}
.hero-r span{font-size:12px;color:var(--muted2)}

/* flex 均分：不管后台有几个分类，都自动排成一行（分类增删不用改代码） */
.quick{display:flex;gap:12px;margin-bottom:20px}
.quick a{flex:1 1 0;min-width:0;background:var(--card);border:1px solid var(--line);border-radius:12px;
  padding:16px 10px;text-align:center;transition:.2s;
  display:flex;flex-direction:column;align-items:center;justify-content:center}
.quick a:hover{border-color:var(--gold);transform:translateY(-2px)}
.quick .qi{font-size:22px;color:var(--gold);display:block;line-height:1.2}
.quick .qt{font-size:14px;font-weight:600;margin-top:6px;display:block;line-height:1.3;
  max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.quick .qs{font-size:11.5px;color:var(--muted);display:block;line-height:1.4;white-space:nowrap}


/* ===== 小区聚合页 ===== */
.cm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px;margin-bottom:18px}
.cm-card{display:block;padding:14px 16px;background:#fff;border:1px solid var(--line);border-radius:10px;
  text-decoration:none;color:inherit;transition:.15s}
.cm-card:hover{border-color:var(--gold);box-shadow:0 2px 10px rgba(0,0,0,.06)}
.cm-card b{display:block;font-size:15px;margin-bottom:5px}
.cm-card span{display:block;font-size:12.5px;color:var(--muted)}
.cm-card i{display:block;font-style:normal;font-size:12.5px;color:var(--gold);margin-top:3px}

/* V100 小区房价：汇总条 / 搜索 / 「其他」卡片 */
.cm-sum{display:flex;align-items:center;gap:26px;flex-wrap:wrap;background:var(--card);
  border:1px solid var(--line);border-radius:10px;padding:14px 18px;margin-bottom:14px}
.cm-sum-i{display:flex;flex-direction:column;gap:3px}
.cm-sum-i b{font-size:21px;font-weight:800;color:var(--gold);line-height:1.1}
.cm-sum-i span{font-size:12.5px;color:var(--muted)}
.cm-sum-upd{margin-left:auto;font-size:12px;color:var(--muted);text-align:right;line-height:1.6}
.cm-sum-upd i{font-style:normal;color:var(--muted2)}
@media(max-width:640px){.cm-sum{gap:16px;padding:12px 14px}
  .cm-sum-upd{margin-left:0;text-align:left;width:100%}}

.cm-search{display:flex;align-items:center;gap:8px;margin-bottom:14px;flex-wrap:wrap}
.cm-search .inp{flex:1;min-width:180px;max-width:340px}
.cm-search-clear{font-size:12.5px;color:var(--muted)}
.cm-search-clear:hover{color:var(--gold)}
.cm-kwnote{font-size:12.5px;color:var(--muted);margin:0 0 12px}

.cm-card-other{background:var(--bg);border-style:dashed}
.cm-card-other b{color:var(--muted)}
.cm-card-other em{display:block;font-style:normal;font-size:11.5px;color:var(--muted2);margin-top:5px}

.pg-cur{padding:6px 13px;font-size:13.5px;color:var(--muted);align-self:center}
.cm-stat{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:16px}
.cm-stat-i{flex:1 1 130px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:12px 14px;text-align:center}
.cm-stat-i b{display:block;font-size:20px;color:var(--gold);line-height:1.3}
.cm-stat-i b i{font-style:normal;font-size:12px;margin-left:2px}
.cm-stat-i span{display:block;font-size:12px;color:var(--muted);margin-top:3px}
.cm-tip{margin-top:16px;padding:12px 14px;background:#fafbfc;border:1px solid var(--line);
  border-radius:8px;font-size:12.5px;color:var(--muted);line-height:1.7}
.list-h1{font-size:20px}
@media(max-width:680px){
  .cm-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:9px}
  .cm-stat-i{flex:1 1 100px;padding:10px}
  .cm-stat-i b{font-size:17px}
  .list-h1{font-size:17px}
}
/* ---------- 面包屑 ---------- */
.crumb{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:12.5px;color:var(--muted2);margin-bottom:12px}
.crumb a{color:var(--muted2)}
.crumb a:hover{color:var(--gold)}
.crumb .cur{color:var(--muted);max-width:340px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ---------- 详情页联系方式 ---------- */
.d-tel{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.d-tel b{font-size:20px;color:var(--gold3);letter-spacing:.5px}
.btn-tel,.btn-copy{display:inline-block;padding:6px 14px;border-radius:8px;font-size:12.5px;
  text-decoration:none;cursor:pointer;border:1px solid var(--gold);background:var(--gold);color:#241d10;font-weight:600}
.btn-copy{background:var(--tint1);color:var(--gold3);border-color:var(--tintline)}
.btn-tel:hover{background:var(--gold2)}
.btn-copy:hover{background:#fdf8ec}
/* V127：详情页「查看 TA 的全部房源」—— 从一套房源跳到该登记手机号的全部房源 */
.d-all-link{display:inline-block;margin-left:10px;font-size:12.5px;color:var(--gold3);
  border-bottom:1px dashed var(--tintline);text-decoration:none;vertical-align:middle}
.d-all-link:hover{color:var(--gold);border-bottom-style:solid}

/* ---------- 上一条 / 下一条 ---------- */
.dnav{display:flex;justify-content:space-between;gap:12px;margin-top:18px;padding-top:14px;
  border-top:1px solid var(--line);font-size:13px;flex-wrap:wrap}
.dnav a{color:#4a5261;max-width:46%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dnav a:hover{color:var(--gold)}
.dnav .r{text-align:right;margin-left:auto}
.dnav .dis{color:#b6bcc7;max-width:46%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ---------- 筛选快捷区间 ---------- */
.frange{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.frange input{width:74px;padding:6px 8px;border:1px solid var(--line);border-radius:7px;font-size:12.5px}
.frange button{padding:6px 14px;border:0;border-radius:7px;background:var(--gold);color:#241d10;
  font-size:12.5px;font-weight:600;cursor:pointer}

/* ---------- 首页 Tab（房源 / 资讯）---------- */
.htab,.ntab{display:flex;gap:6px;margin-bottom:12px;flex-wrap:wrap}
.htab button,.ntab button{border:1px solid var(--line);background:var(--card);color:var(--muted);
  border-radius:16px;padding:5px 15px;font-size:13px;cursor:pointer;transition:.18s}
.htab button:hover,.ntab button:hover{border-color:var(--gold);color:#a6772c}
.htab button.on,.ntab button.on{background:var(--gold);border-color:var(--gold);color:#241d10;font-weight:600}
.ntab{margin-bottom:8px}
.ntab button{padding:4px 12px;font-size:12.5px;border-radius:14px}

/* ---------- 中介紧凑横条 ---------- */
.agbar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.agi{display:flex;align-items:center;justify-content:space-between;gap:10px;
  background:var(--card);border:1px solid var(--line);border-radius:10px;padding:11px 13px;text-decoration:none;transition:.18s}
.agi:hover{border-color:var(--gold)}
.agi b{font-size:13.5px;color:#2f3742;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.agi .t{font-size:13px;color:#a6772c;white-space:nowrap;flex-shrink:0}

/* ---------- 找房委托卡 ---------- */
.find-box{background:linear-gradient(160deg,var(--tint1),var(--tint2));border:1px solid var(--tintline)}
.find-box h4{color:var(--gold3)}
.find-tip{font-size:11.5px;color:#b0a077;text-align:center;margin-top:8px}

@media (max-width:680px){ .agbar{grid-template-columns:1fr} }

.sec{margin-bottom:22px}
.sec-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;gap:12px}
.sec-head h2{font-size:18px;margin:0;font-weight:700;display:flex;align-items:center;gap:9px}
.sec-head h2:before{content:"";width:4px;height:17px;border-radius:2px;background:var(--gold)}
.sec-head .more{font-size:13px;color:var(--muted)}
.sec-head .more:hover{color:var(--gold)}

.layout{display:grid;grid-template-columns:1fr 300px;gap:20px;align-items:start}

/* ---------- 房源列表 ---------- */
.hlist{background:var(--card);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.hrow{display:flex;gap:14px;padding:14px 16px;border-bottom:1px solid var(--topbar);transition:.15s}
.hrow:last-child{border-bottom:0}
.hrow:hover{background:#fafbfc}
/* V86：房源编号加边框，做成小徽章。
   原来是 flex:0 0 62px 的裸文字，跟旁边的元信息混成一片看不出是编号；
   加边框后一眼能认出，也方便客户报编号给我查房。
   用 fit-content 高度：加边框后若仍占满整行高，边框会拉成一条竖长条。 */
.hrow .no{
  flex:0 0 auto;align-self:flex-start;
  min-width:54px;text-align:center;
  font-size:11.5px;line-height:1.5;
  color:#8b93a1;font-family:ui-monospace,Menlo,Consolas,monospace;
  padding:2px 6px;margin-top:1px;
  border:1px solid #dde3ec;border-radius:5px;background:#fafbfd;
  white-space:nowrap;
}
.hrow .main{flex:1;min-width:0}
.hrow .tt{font-size:15.5px;font-weight:600;line-height:1.5;display:block;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hrow .tt:hover{color:var(--gold)}
.hrow .meta{font-size:12.5px;color:var(--muted2);margin-top:4px;display:flex;gap:12px;flex-wrap:wrap}
.hrow .meta .cm{color:var(--gold)}
.hrow .px{flex:0 0 120px;text-align:right}
.hrow .px b{display:block;font-size:16px;color:var(--red);font-weight:700}
.hrow .px span{font-size:12px;color:var(--muted2)}
/* V146：单价小字 —— 比总价弱一档，但要比元信息显眼（它是决策依据） */
.hrow .px .up{display:block;font-style:normal;font-size:12px;color:var(--gold);margin-top:2px;white-space:nowrap}
/* V146：列表浏览量 */
.hrow .meta .hs{color:var(--muted2);font-size:12px}
.hrow .tm{flex:0 0 96px;text-align:right;font-size:12px;color:#9aa3b2;padding-top:2px}

.tag{display:inline-block;padding:1px 7px;border-radius:5px;font-size:11px;margin-right:5px;font-weight:600;vertical-align:1px}
.tag.top{background:#fdecec;color:var(--red)}
.tag.good{background:#fdf3e0;color:#a6772c}
.tag.p{background:#eef8f1;color:var(--green)}
.tag.a{background:#eef2f8;color:#4a6fa5}
.tag.cointop{background:linear-gradient(135deg,var(--gold),var(--gold2,#c9a961));color:#fff}

/* ---------- 筛选条 ---------- */
.filter{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px 16px;margin-bottom:16px}
.filter-line{display:flex;gap:10px;flex-wrap:wrap;align-items:center;font-size:13px}
.filter-line + .filter-line{margin-top:10px;padding-top:10px;border-top:1px dashed #eef0f3}
.f-lb{color:var(--muted);font-weight:600;flex:0 0 auto}
.f-opt{padding:4px 12px;border-radius:6px;color:var(--muted);background:var(--bg);white-space:nowrap}
.f-opt:hover{background:#eef0f3}
.f-opt.on{background:var(--gold);color:var(--onbrand);font-weight:600}
.filter input.inp{width:88px;padding:5px 9px;border:1px solid var(--line);border-radius:6px;font-size:13px;outline:0}
.filter input.inp:focus{border-color:var(--gold)}

/* ---------- 房源详情 ---------- */
.detail{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:22px 24px;margin-bottom:16px}
.detail h1{font-size:21px;margin:0 0 12px;line-height:1.5;font-weight:700}
.detail .dmeta{font-size:12.5px;color:var(--muted2);display:flex;gap:14px;flex-wrap:wrap;padding-bottom:14px;border-bottom:1px solid var(--topbar)}
/* V86：详情页房源编号 —— 与列表页一致的小徽章，方便客户报号查房 */
.detail .dmeta .hno{
  display:inline-block;font-weight:600;font-style:normal;
  font-family:ui-monospace,Menlo,Consolas,monospace;
  padding:1px 6px;margin-left:2px;
  border:1px solid #dde3ec;border-radius:5px;background:#fafbfd;color:#8b93a1;
}
.pricebox{display:flex;gap:28px;padding:16px 0;border-bottom:1px solid var(--topbar);flex-wrap:wrap}
.pricebox .pi b{display:block;font-size:24px;color:var(--red);font-weight:800}
.pricebox .pi span{font-size:12px;color:var(--muted)}
.dinfo{display:grid;grid-template-columns:repeat(2,1fr);gap:10px 24px;padding:16px 0;border-bottom:1px solid var(--topbar);font-size:14px}
.dinfo div span{color:var(--muted);display:inline-block;width:76px}
.dcontent{padding:16px 0 6px;font-size:14.5px;line-height:1.95;color:#2c3138;word-break:break-word}
.dcontent img{border-radius:8px;margin:8px 0;max-width:100%}
.dcontent blockquote{margin:10px 0;padding:10px 14px;background:#f7f8fa;border-left:3px solid var(--gold2);color:var(--muted)}
.dcontact{background:#fdf6e9;border:1px solid #f0e2c2;border-radius:10px;padding:14px 16px;margin-top:14px;font-size:14px}
.dcontact b{color:var(--gold3);font-size:16px}
.dimgs{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:14px}
.dimgs img{width:100%;height:110px;object-fit:cover;border-radius:8px;cursor:pointer}

/* ---------- 中介卡 ---------- */
.agents{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.agent{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px;transition:.2s}
.agent:hover{border-color:var(--gold);transform:translateY(-2px)}
.agent h3{margin:0 0 6px;font-size:15.5px;font-weight:700}
.agent .shop{font-size:12.5px;color:var(--muted);margin-bottom:8px}
.agent .tel{font-size:16px;color:var(--red);font-weight:700}
.agent .intro{font-size:12.5px;color:var(--muted2);margin-top:8px;line-height:1.6}

/* ---------- 侧栏 ---------- */
.side .box{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px 18px;margin-bottom:16px}
.side .box h4{margin:0 0 12px;font-size:14.5px;display:flex;align-items:center;gap:8px}
.side .box h4:before{content:"";width:3px;height:14px;background:var(--gold);border-radius:2px}
.side ul{list-style:none;margin:0;padding:0}
.side li{font-size:13px;padding:7px 0;border-bottom:1px dashed #eef0f3;color:var(--muted);line-height:1.6}
.side li:last-child{border-bottom:0}
.side li a:hover{color:var(--gold)}
.side li b{color:var(--gold);margin-right:5px}
.side .tel-big{font-size:19px;color:var(--red);font-weight:800}

/* ---------- 表单 ---------- */
.form-box{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:22px}
.form-row{margin-bottom:16px}
.form-row label{display:block;font-size:13px;color:var(--muted);margin-bottom:7px;font-weight:600}
.form-row label .req{color:var(--red)}
.inp,select.inp,textarea.inp{width:100%;padding:10px 13px;border-radius:10px;border:1px solid var(--line);
  background:var(--card);color:var(--text);font-size:14px;font-family:inherit;outline:0;transition:.15s}
.inp:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(184,147,74,.12)}
textarea.inp{min-height:140px;line-height:1.8}
select.inp{height:42px}
.form-row .hint{font-size:12px;color:var(--muted2);margin-top:6px;line-height:1.7}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}
.form-actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.btn{padding:10px 24px;border-radius:10px;border:0;font-size:14px;font-weight:600;cursor:pointer;
  background:linear-gradient(135deg,var(--gold2),var(--gold));color:#241d10}
.btn:hover{filter:brightness(1.06)}
.btn.gray{background:#eef0f3;color:var(--muted)}
.btn.sm{padding:6px 14px;font-size:12.5px;border-radius:8px}

.btn.sm.gold{background:linear-gradient(135deg,var(--gold),var(--gold2,#c9a961));color:#fff;border:0}
.btn.sm.gold:hover{filter:brightness(1.06)}

/* V100 房币：说明条 / 流水 / 天数选择 */
.coin-tip{background:var(--bg);border:1px dashed var(--gold);border-radius:10px;
  padding:13px 15px;margin-bottom:14px}
.coin-tip-t{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap;margin-bottom:7px}
.coin-tip-t b{font-size:18px;color:var(--gold);font-weight:800}
.coin-tip-t span{font-size:12.5px;color:var(--muted)}
.coin-tip-b{font-size:12.5px;color:var(--text);line-height:1.85}
.coin-tip-b strong{color:var(--gold)}
.coin-tip-ct{color:var(--gold);font-weight:700}
.coin-log{margin-top:10px;border-top:1px solid var(--line);padding-top:9px}
.coin-log-i{display:flex;align-items:center;gap:10px;font-size:12px;padding:4px 0;color:var(--muted)}
.coin-log-t{flex:0 0 auto;color:var(--muted2);font-variant-numeric:tabular-nums}
.coin-log-n{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.coin-log-a{flex:0 0 auto;font-weight:700}
.coin-log-a.plus{color:var(--green)}
.coin-log-a.minus{color:var(--red)}
.coin-days{font-size:12px;padding:5px 6px;border:1px solid var(--line);border-radius:7px;
  background:var(--card);color:var(--text);font-family:inherit;vertical-align:middle}
@media(max-width:640px){.coin-tip-t b{font-size:16px}.coin-tip{padding:11px 12px}}.btn.block{display:block;width:100%;text-align:center}

/* ---------- 空 / 提示 / 分页 ---------- */
.empty{padding:52px 20px;text-align:center;color:var(--muted);background:var(--card);border:1px dashed var(--line);border-radius:12px}
.alert{padding:11px 15px;border-radius:10px;font-size:13.5px;margin-bottom:16px}
.alert.ok{background:#eef8f1;color:var(--green);border:1px solid #cdebda}
.alert.err{background:#fdeeee;color:#b3372f;border:1px solid #f6d5d3}
.alert.info{background:#fdf6e9;color:var(--gold3);border:1px solid #f0e2c2}
.pager{display:flex;justify-content:center;gap:7px;margin:22px 0 0;flex-wrap:wrap}
.pg{padding:6px 13px;border-radius:8px;background:var(--card);border:1px solid var(--line);font-size:13.5px;color:var(--muted)}
.pg:hover{color:var(--gold);border-color:var(--gold)}
.pg.active{background:var(--gold);color:var(--onbrand);border-color:var(--gold);font-weight:600}
.pg.dots{border:0;background:none}
/* V111：深分页上限提示（分页条截断后说明为什么只到 100 页） */
.pager-note{text-align:center;font-size:12.5px;color:var(--muted2);line-height:1.7;
  margin:8px 0 0}

/* ---------- 页脚 ---------- */
.site-footer{background:var(--dark);color:var(--muted2);padding:36px 0 0;margin-top:8px}
.footer-inner{display:grid;grid-template-columns:1.8fr 1fr 1fr 1fr;gap:28px;padding-bottom:26px}
.fcol h4{margin:0 0 12px;font-size:14px;color:var(--ondark)}
.fcol ul{list-style:none;margin:0;padding:0}
.fcol li{margin-bottom:8px;font-size:13px}
.fcol a:hover{color:var(--gold2)}
.fdesc{margin:12px 0 14px;font-size:13px;line-height:1.8;max-width:340px}
.fstat{display:flex;gap:18px;font-size:12.5px}
.fstat b{color:var(--gold2);font-size:15px}
.flink{padding:14px 20px;border-top:1px solid rgba(255,255,255,.08);font-size:12.5px;display:flex;flex-wrap:wrap;gap:12px}
.flink-t{color:#7b8493}
.flink a{color:var(--muted2)}
.flink a:hover{color:var(--gold2)}
.footer-bottom{border-top:1px solid rgba(255,255,255,.08);padding:14px 20px;display:flex;
  justify-content:space-between;gap:14px;font-size:12px;color:#7b8493;flex-wrap:wrap}

/* ---------- 响应式 ---------- */
@media (max-width:1000px){
  .layout{grid-template-columns:1fr}
  .quick{flex-wrap:wrap}
  .quick a{flex:1 1 calc(33.333% - 8px)}
  .agents{grid-template-columns:repeat(2,1fr)}
  .hrow .tm{display:none}
  .footer-inner{grid-template-columns:1fr 1fr}
}
@media (max-width:680px){
  .topbar-in{font-size:12px}
  .header-inner{padding:14px 20px;gap:14px}
  .hsearch{order:3;max-width:none}
  .hstat{display:none}
  .hrow{flex-wrap:wrap}
  .hrow .no{flex:0 0 auto}
  .hrow .px{flex:1;text-align:right}
  .dinfo{grid-template-columns:1fr}
  .dimgs{grid-template-columns:repeat(2,1fr)}
  .form-grid{grid-template-columns:1fr}
  .quick a{flex:1 1 calc(50% - 6px)}
  .agents{grid-template-columns:1fr}
  .footer-inner{grid-template-columns:1fr;gap:20px}
}

/* ============ 侧栏账号保存卡（注册成功后引导保存，紧凑版） ============ */
.acct-side{border:1px solid var(--gold);border-radius:12px;
  background:linear-gradient(180deg,#fffaf0 0,#fff 55%);
  padding:14px 15px;margin-bottom:16px;box-shadow:0 2px 10px rgba(184,147,74,.10)}
.acct-side-hd{display:flex;gap:10px;align-items:center;margin-bottom:12px}
.acct-side-ico{width:34px;height:34px;border-radius:10px;background:var(--gold);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:17px;flex:0 0 auto;
  box-shadow:0 2px 6px rgba(184,147,74,.28)}
.acct-side-hd-t{display:flex;flex-direction:column;line-height:1.35;min-width:0}
.acct-side-hd-t b{font-size:14px;color:#2a2f39}
.acct-side-hd-t span{font-size:11.5px;color:#9a8a6a;margin-top:1px}

.acct-side-row{display:flex;align-items:center;gap:8px;padding:7px 0}
.acct-side-k{flex:0 0 32px;font-size:12px;color:var(--muted)}
.acct-side-v{flex:1;min-width:0;font-size:13.5px;color:#2a2f39;font-weight:600;word-break:break-all}
.acct-side-v.mono{font-family:ui-monospace,Menlo,Consolas,monospace;letter-spacing:.5px;font-weight:500}

.acct-side-act{display:flex;align-items:center;gap:8px;margin:2px 0 12px;flex-wrap:wrap}
.acct-mini{border:1px solid var(--line);background:#fff;color:#6b7480;font-size:11.5px;
  padding:3px 10px;border-radius:20px;cursor:pointer;transition:.15s}
.acct-mini:hover{border-color:var(--gold);color:var(--gold)}
.acct-side-extra{font-size:11.5px;color:var(--muted)}

.acct-side-btns{display:flex;flex-direction:column;gap:7px}
.acct-btn{display:block;text-align:center;padding:9px 12px;border-radius:9px;font-size:13px;
  border:1px solid var(--line);background:#fff;color:#4a5261;cursor:pointer;
  text-decoration:none;transition:.15s;width:100%}
.acct-btn:hover{border-color:var(--gold);color:var(--gold);background:#fffdf7}
.acct-btn.primary{background:linear-gradient(180deg,#c9a15c,#b8934a);border-color:#b8934a;
  color:#fff;font-weight:600}
.acct-btn.primary:hover{background:linear-gradient(180deg,#d0aa68,#bf9a52);color:#fff}

.acct-side-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;
  margin-top:11px;padding-top:10px;border-top:1px dashed #f0e4cd;flex-wrap:wrap}
.acct-side-foot a{font-size:11.5px;color:var(--muted);text-decoration:none}
.acct-side-foot a:hover{color:var(--gold)}
.acct-side-hide{border:none;background:none;font-size:11.5px;color:var(--muted);
  cursor:pointer;padding:0}
.acct-side-hide:hover{color:var(--gold)}

/* ============ 列表缩略图 ============ */
.hrow{display:flex;align-items:center;gap:12px}
.hrow .pic{flex:0 0 auto;width:96px;height:72px;border-radius:8px;overflow:hidden;
  background:#f2f4f7;border:1px solid var(--line)}
.hrow .pic img{width:100%;height:100%;object-fit:cover;display:block}

/* ============ 下架页 ============ */
.gone-box{background:#fff;border:1px solid var(--line);border-radius:14px;
  padding:40px 28px;text-align:center;margin-top:8px}
.gone-ico{font-size:44px;line-height:1;margin-bottom:14px;opacity:.75}
.gone-t{margin:0 0 10px;font-size:20px;font-weight:700;color:#2a2f39}
.gone-why{margin:0 auto 14px;color:var(--muted);font-size:14px;line-height:1.8;max-width:520px}
.gone-title{margin:0 auto 20px;padding:10px 14px;background:#f7f8fa;border-radius:9px;
  font-size:13.5px;color:#6b7480;max-width:560px;word-break:break-all}
.gone-btns{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}

/* ============ 标题智能识别提示条 ============ */
.tfbox{display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  margin-top:9px;padding:9px 13px;border-radius:9px;
  background:#f4f9ff;border:1px solid #cfe3f7;color:#3a5266;font-size:13px}
.tfbox.ok{background:#f2faf4;border-color:#c6e6cf;color:#2f6b41}
.tf-ico{font-size:15px;line-height:1;flex:0 0 auto}
.tf-txt{flex:1;min-width:0;line-height:1.6}
.tf-txt b{color:#1d4e73;font-weight:700}
.tfbox.ok .tf-txt b{color:#2f6b41}
.tf-btn{flex:0 0 auto;border:1px solid #4d90c4;background:#4d90c4;color:#fff;
  font-size:12.5px;padding:5px 14px;border-radius:7px;cursor:pointer;transition:.15s}
.tf-btn:hover{background:#3f7fb0;border-color:#3f7fb0}
.tf-btn:active{transform:translateY(1px)}

/* ============ 上传区（点击 / 拖拽） ============ */
.imgup{margin-bottom:16px}
.imgup-hd{display:flex;align-items:baseline;gap:8px;margin-bottom:9px}
.imgup-lbl{font-size:14px;font-weight:700;color:#2a2f39}
.imgup-tip{font-size:12px;color:var(--muted)}

.imgup-drop{display:block;border:2px dashed #d2d8e0;border-radius:12px;background:#fafbfc;
  padding:26px 16px;text-align:center;cursor:pointer;transition:.18s;position:relative}
.imgup-drop:hover,.imgup-drop.over{border-color:var(--gold);background:#fffdf7}
.imgup-drop input[type=file]{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}
.imgup-ico{display:block;font-size:30px;line-height:1;margin-bottom:8px;opacity:.75}
.imgup-t{display:block;font-size:14px;color:#4a5261;font-weight:600}
.imgup-s{display:block;font-size:12px;color:var(--muted);margin-top:4px}

.imgup-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:9px;margin-top:11px}
.imgup-grid:empty{display:none}
.imgup-cell{position:relative;width:100%;padding-top:75%;border-radius:9px;overflow:hidden;
  background:#f0f2f5;border:1px solid var(--line)}
.imgup-cell img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.imgup-del{position:absolute;top:3px;right:3px;width:20px;height:20px;line-height:18px;
  text-align:center;border:none;border-radius:50%;background:rgba(0,0,0,.55);color:#fff;
  font-size:14px;cursor:pointer;padding:0;transition:.15s}
.imgup-del:hover{background:rgba(200,50,50,.88)}
.imgup-badge{position:absolute;left:0;bottom:0;background:var(--gold);color:#fff;
  font-size:10.5px;padding:2px 7px;border-radius:0 6px 0 0}

.imgup-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;
  margin-top:9px;font-size:12px;color:var(--muted);flex-wrap:wrap}
.imgup-bar span:first-child{color:#4a5261;font-weight:600}
.imgup-err{margin-top:9px;padding:8px 12px;background:#fff4f4;border:1px solid #f3c9c9;
  border-radius:8px;color:#b3403f;font-size:12.5px}

/* ============ 详情页图片轮播 ============ */
.dimgs-gal{margin-bottom:16px}
.gal-hd{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:11px}
.gal-t{font-size:15px;font-weight:700;color:#2a2f39}
.gal-n{font-size:12px;color:var(--muted)}

/* 主舞台：只显示当前那张，其余 display:none */
.gal-stage{position:relative;width:100%;padding-top:62%;background:#f2f4f7;
  border:1px solid var(--line);border-radius:12px;overflow:hidden;cursor:zoom-in}
.gal-slide{position:absolute;inset:0;display:none}
.gal-slide.on{display:block}
.gal-slide img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  background:#f2f4f7}

.gal-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:3;
  width:36px;height:36px;line-height:32px;text-align:center;font-size:22px;
  border:none;border-radius:50%;background:rgba(0,0,0,.42);color:#fff;
  cursor:pointer;padding:0;transition:.15s}
.gal-arrow:hover{background:rgba(0,0,0,.66)}
.gal-arrow.prev{left:10px}
.gal-arrow.next{right:10px}
.gal-count{position:absolute;right:12px;bottom:12px;z-index:3;
  background:rgba(0,0,0,.5);color:#fff;font-size:12px;padding:3px 11px;border-radius:20px}

/* 小图条 */
.gal-thumbs{display:flex;gap:8px;margin-top:9px;overflow-x:auto;padding-bottom:3px;
  scrollbar-width:thin}
.gal-thumbs::-webkit-scrollbar{height:5px}
.gal-thumbs::-webkit-scrollbar-thumb{background:#d5dae1;border-radius:3px}
.gal-thumb{flex:0 0 auto;width:78px;height:58px;padding:0;border:2px solid transparent;
  border-radius:8px;overflow:hidden;background:#f0f2f5;cursor:pointer;transition:.15s}
.gal-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.gal-thumb.on{border-color:var(--gold)}
.gal-thumb:hover{opacity:.85}

/* 全屏放大层 */
.gal-mask{position:fixed;inset:0;z-index:9999;background:rgba(0,0,0,.9);
  display:flex;align-items:center;justify-content:center}
.gal-mask .gal-big{max-width:92vw;max-height:86vh;object-fit:contain}
.gal-close{position:absolute;top:16px;right:18px;width:40px;height:40px;font-size:26px;
  border:none;border-radius:50%;background:rgba(255,255,255,.14);color:#fff;cursor:pointer}
.gal-prev,.gal-next{position:absolute;top:50%;transform:translateY(-50%);
  width:46px;height:46px;font-size:28px;border:none;border-radius:50%;
  background:rgba(255,255,255,.14);color:#fff;cursor:pointer}
.gal-prev{left:18px} .gal-next{right:18px}
.gal-idx{position:absolute;bottom:26px;left:0;right:0;text-align:center;
  color:#fff;font-size:14px;opacity:.9}

/* ============ 上传区（点击 / 拖拽） ============ */
.imgup{margin-bottom:16px}
.imgup-hd{display:flex;align-items:baseline;gap:8px;margin-bottom:9px}
.imgup-lbl{font-size:14px;font-weight:700;color:#2a2f39}
.imgup-tip{font-size:12px;color:var(--muted)}

.imgup-drop{display:block;border:2px dashed #d2d8e0;border-radius:12px;background:#fafbfc;
  padding:26px 16px;text-align:center;cursor:pointer;transition:.18s;position:relative}
.imgup-drop:hover,.imgup-drop.over{border-color:var(--gold);background:#fffdf7}
.imgup-drop input[type=file]{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}
.imgup-ico{display:block;font-size:30px;line-height:1;margin-bottom:8px;opacity:.75}
.imgup-t{display:block;font-size:14px;color:#4a5261;font-weight:600}
.imgup-s{display:block;font-size:12px;color:var(--muted);margin-top:4px}

.imgup-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:9px;margin-top:11px}
.imgup-grid:empty{display:none}
.imgup-cell{position:relative;width:100%;padding-top:75%;border-radius:9px;overflow:hidden;
  background:#f0f2f5;border:1px solid var(--line)}
.imgup-cell img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.imgup-del{position:absolute;top:3px;right:3px;width:20px;height:20px;line-height:18px;
  text-align:center;border:none;border-radius:50%;background:rgba(0,0,0,.55);color:#fff;
  font-size:14px;cursor:pointer;padding:0;transition:.15s}
.imgup-del:hover{background:rgba(200,50,50,.88)}
.imgup-badge{position:absolute;left:0;bottom:0;background:var(--gold);color:#fff;
  font-size:10.5px;padding:2px 7px;border-radius:0 6px 0 0}

.imgup-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;
  margin-top:9px;font-size:12px;color:var(--muted);flex-wrap:wrap}
.imgup-bar span:first-child{color:#4a5261;font-weight:600}
.imgup-err{margin-top:9px;padding:8px 12px;background:#fff4f4;border:1px solid #f3c9c9;
  border-radius:8px;color:#b3403f;font-size:12.5px}

/* ============ 详情页画廊 ============ */
.dimgs-gal{margin:18px 0}
.gal-hd{display:flex;align-items:baseline;gap:10px;margin-bottom:11px}
.gal-t{font-size:15px;font-weight:700;color:#2a2f39}
.gal-n{font-size:12.5px;color:var(--muted)}
.gal-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}
.gal-item{display:block;border-radius:10px;overflow:hidden;background:#f2f4f7;
  border:1px solid var(--line);aspect-ratio:4/3}
.gal-item img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .25s}
.gal-item:hover img{transform:scale(1.04)}

/* 放大层 */
.gal-mask{position:fixed;inset:0;z-index:9999;background:rgba(0,0,0,.9);
  display:flex;align-items:center;justify-content:center}
.gal-big{max-width:92vw;max-height:88vh;object-fit:contain;border-radius:6px}
.gal-close,.gal-prev,.gal-next{position:absolute;background:rgba(255,255,255,.13);border:none;
  color:#fff;cursor:pointer;border-radius:50%;font-size:26px;line-height:1}
.gal-close{top:16px;right:18px;width:40px;height:40px}
.gal-prev,.gal-next{top:50%;transform:translateY(-50%);width:46px;height:46px;font-size:32px}
.gal-prev{left:14px} .gal-next{right:14px}
.gal-close:hover,.gal-prev:hover,.gal-next:hover{background:rgba(255,255,255,.28)}
.gal-idx{position:absolute;bottom:18px;left:0;right:0;text-align:center;color:#fff;
  font-size:13px;opacity:.8}

@media (max-width:680px){
  .hrow .pic{width:78px;height:58px}
  .gal-grid{grid-template-columns:repeat(2,1fr)}
  .gone-box{padding:32px 18px}
}

/* ===== 回到顶部按钮（V40） =====
   前台不加载 admin.css，所以这里单独一份，配色跟前台主题一致。 */
.to-top{
  /* V45：移到左下角。
     原来放右下角会被在线客服气泡 .chat-fab 压住（之前是靠上移 96px 勉强避让），
     现在左右分开，彻底不冲突，也不用再算避让距离。 */
  position:fixed;left:22px;bottom:26px;z-index:9997;
  width:46px;height:46px;border:0;border-radius:50%;cursor:pointer;
  background:linear-gradient(135deg,var(--gold2,#e8c26a),var(--gold,#c99a30));
  color:#241d10;
  box-shadow:0 4px 14px rgba(201,154,48,.36);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;
  opacity:0;visibility:hidden;transform:translateY(12px);
  transition:opacity .2s,transform .2s,visibility .2s,filter .15s;
  font-family:inherit;
}
.to-top.show{opacity:1;visibility:visible;transform:translateY(0)}
.to-top:hover{filter:brightness(1.07)}
.to-top-ar{font-size:16px;line-height:1;font-weight:700}
.to-top-t{font-size:9.5px;line-height:1;font-weight:600}
@media (max-width:760px){
  /* 移动端客服按钮 52px、bottom:20px → 上移到其上方 */
  .to-top{left:16px;bottom:calc(70px + env(safe-area-inset-bottom));width:42px;height:42px}
}

/* V44：备案号链接（工信部备案系统） */
.icp-link{color:inherit;text-decoration:none;border-bottom:1px dotted currentColor;opacity:.85;transition:opacity .15s}
.icp-link:hover{opacity:1;text-decoration:none}

/* ===== V46：房源日期徽章 =====
   原来只有一个细灰的「3天前」，夹在标题旁根本看不见，
   导致用户把 5 年前的信息当成今年的。现在按新鲜度分档配色。 */
.dbadge{display:inline-flex;align-items:center;gap:4px;
  padding:2px 8px;border-radius:11px;font-size:11.5px;font-weight:600;
  line-height:1.7;white-space:nowrap;border:1px solid transparent;vertical-align:middle}
.dbadge i{font-style:normal;font-size:11px;line-height:1}

/* d0 24小时内：绿 */
.dbadge.d0{background:#e8f6ed;color:#1a7f42;border-color:#b7e2c6}
/* d1 7天内：浅绿 */
.dbadge.d1{background:#f0f8f2;color:#2b7a4b;border-color:#cfe6d7}
/* d2 1年内：橙色，提醒偏旧 */
.dbadge.d2{background:#fff5e6;color:#a86411;border-color:#f2d9a8}
/* d3 超过1年：红色警告 —— 这是最关键的档位 */
.dbadge.d3{background:#fdecec;color:#c0392b;border-color:#f5c6c6;font-weight:700}

/* 列表卡片里原来的 .tm 是纯灰字，现在里面放徽章，去掉多余样式干扰 */
.tm .dbadge{font-size:11px}

/* ===== V47：管理员预览提示条 =====
   待审核房源在管理员预览时会显示这条黄条，
   明确告诉管理员「访客看不到」，避免误以为已经上线。 */
.adm-preview-bar{background:#fff8e1;border-bottom:2px solid #f0c36d;
  padding:10px 0;margin-bottom:14px}
.adm-preview-bar .apb-in{max-width:1200px;margin:0 auto;padding:0 16px;
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  font-size:13px;color:#7a5a12;line-height:1.7}
.adm-preview-bar b{color:#8a5a00}
.adm-preview-bar .apb-btn{padding:5px 12px;border-radius:6px;
  background:#c9a227;color:#fff;text-decoration:none;font-size:12.5px;font-weight:600;white-space:nowrap}
.adm-preview-bar .apb-btn:hover{background:#b8931f}
.adm-preview-bar .apb-btn.ghost{background:#fff;color:#8a5a00;border:1px solid #d9bc7a}

/* ===== V54 分享弹层（PC + 手机版共用） ===== */
.xj-share-mask{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:100000;
  display:flex;align-items:center;justify-content:center;padding:20px}
.xj-share-box{background:#fff;border-radius:14px;padding:18px;max-width:420px;width:100%;
  box-shadow:0 12px 40px rgba(0,0,0,.28)}
.xj-share-h{font-size:15.5px;font-weight:700;color:#1e222d;margin-bottom:12px}
.xj-share-ta{width:100%;height:120px;box-sizing:border-box;border:1px solid #dfe3e8;
  border-radius:8px;padding:10px;font-size:13px;line-height:1.7;resize:none;
  color:#333;background:#fafbfc;-webkit-user-select:text;user-select:text}
.xj-share-tip{margin-top:10px;font-size:12.5px;color:#8a8f99;line-height:1.75}
.xj-share-tip b{color:#c9a227}
.xj-share-close{margin-top:14px;width:100%;padding:10px;border:none;border-radius:8px;
  background:#1e222d;color:#fff;font-size:14px;font-weight:600;cursor:pointer}
.xj-share-close:hover{background:#2c313f}

/* 微信引导遮罩 */
.xj-wxmask{position:fixed;inset:0;background:rgba(0,0,0,.62);z-index:100000;
  display:flex;justify-content:flex-end;align-items:flex-start}
.xj-wxguide{margin:60px 18px 0 0;max-width:250px;background:#fff;border-radius:12px;
  padding:16px 18px;position:relative;box-shadow:0 8px 28px rgba(0,0,0,.3)}
.xj-wxguide::after{content:'';position:absolute;top:-9px;right:26px;
  border-left:9px solid transparent;border-right:9px solid transparent;border-bottom:9px solid #fff}
.xj-wxguide-t{font-size:15px;font-weight:700;color:#1e222d;margin-bottom:8px}
.xj-wxguide-b{font-size:13.5px;color:#6b7280;line-height:1.85}
.xj-wxguide-b b{color:#1aad19;font-size:16px}

/* PC 详情页分享条 */
.d-share{margin-top:14px;padding:12px 14px;background:#fafbfc;border:1px solid #eceef1;
  border-radius:10px;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.d-share .d-share-t{font-size:12.5px;color:#8a8f99;margin-right:2px}
.d-share .btn-share{padding:7px 14px;border:1px solid #dfe3e8;background:#fff;border-radius:7px;
  font-size:13px;color:#333;cursor:pointer;transition:.15s}
.d-share .btn-share:hover{border-color:#c9a227;color:#a8842a}
.d-share .d-share-tip{width:100%;font-size:12.5px;color:#2e9e5b;margin-top:2px}


/* ============================================================
 * V59 房贷计算器
 * ========================================================== */
/* V107：整块内容加 --card 底衬。
   之前 .loan-wrap 是透明的，只有卡片自己有底色 —— 于是标题、副标题、
   免责声明这些非卡片文字直接压在 body 上。开了背景图后（图挂在 body），
   这些字就压在图上，明暗随站长上传的图而变，根本不可控。
   给整块加 var(--card) 后，文字底衬稳定，对比度不再依赖图片。
   用 var(--card) 而不是写死 #fff：深色主题下 --card 是 #1e222a，
   写死白底会在夜间模式变成一块刺眼的白板。 */
.loan-wrap{max-width:1000px;margin:0 auto;padding:18px 20px 26px;
  background:var(--card);border:1px solid var(--line);border-radius:14px}
.loan-head{margin:0 0 18px}
.loan-h1{font-size:23px;font-weight:800;margin:0 0 7px;color:var(--text);letter-spacing:.3px}
.loan-sub{font-size:13.5px;color:var(--loan-mu);margin:0;line-height:1.7}

/* V119：同样改 minmax(0,1fr)。窄屏单列时左右卡片曾被内容撑到 325px
   （可用宽度只有 300px），整页出现横向滚动条。 */
.loan-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;align-items:start}
@media(max-width:860px){.loan-grid{grid-template-columns:minmax(0,1fr)}}

.loan-form{padding:18px 18px 20px}
.loan-row{margin-bottom:15px}
.loan-lb{display:block;font-size:13px;color:var(--loan-mu);margin-bottom:7px;font-weight:600}
.loan-inp{display:flex;align-items:center;border:1px solid var(--line);border-radius:9px;
  background:var(--bg);overflow:hidden;transition:border-color .15s}
.loan-inp:focus-within{border-color:var(--gold)}
.loan-inp input,.loan-inp select{flex:1;min-width:0;border:0;background:transparent;
  padding:10px 13px;font-size:15px;color:var(--text);outline:0;font-family:inherit}
.loan-inp select{padding:10px 10px;cursor:pointer}
.loan-unit{flex:0 0 auto;padding:0 13px;font-size:13px;color:var(--loan-mu);
  border-left:1px solid var(--line);line-height:38px}
.loan-quick{display:flex;gap:7px;margin-top:8px;flex-wrap:wrap}
.loan-quick button{border:1px solid var(--line);background:var(--chip);color:var(--loan-mu);
  border-radius:7px;padding:5px 12px;font-size:12.5px;cursor:pointer;font-family:inherit;
  transition:all .15s}
.loan-quick button:hover{border-color:var(--gold);color:var(--gold)}
.loan-hint{font-size:11.5px;color:var(--loan-mu);margin-top:6px}
.loan-note{font-size:12.5px;color:var(--loan-mu);margin:-6px 0 15px;padding-left:2px}
.loan-note b{color:var(--gold);font-weight:700}

.loan-seg{display:flex;gap:0;border:1px solid var(--line);border-radius:9px;overflow:hidden}
.loan-seg button{flex:1;border:0;background:var(--bg);padding:10px 8px;font-size:13.5px;
  color:var(--loan-mu);cursor:pointer;font-family:inherit;transition:all .15s}
.loan-seg button+button{border-left:1px solid var(--line)}
.loan-seg button.on{background:var(--gold);color:var(--onbrand);font-weight:700}
.loan-seg button:not(.on):hover{color:var(--gold)}

.loan-divider{display:flex;align-items:center;gap:10px;margin:20px 0 14px;
  font-size:12.5px;color:var(--loan-mu)}
.loan-divider:before,.loan-divider:after{content:"";flex:1;height:1px;background:var(--line)}

.loan-btn{width:100%;margin-top:6px;padding:12px;border:0;border-radius:9px;
  background:var(--gold);color:var(--onbrand);font-size:15px;font-weight:700;
  cursor:pointer;font-family:inherit;transition:filter .15s}
.loan-btn:hover{filter:brightness(1.07)}
.loan-btn.ghost{background:transparent;color:var(--loan-mu);border:1px solid var(--line);
  margin-top:9px;font-weight:500}
.loan-btn.ghost:hover{border-color:var(--gold);color:var(--gold);filter:none}

.loan-result{display:flex;flex-direction:column;gap:12px}
.loan-main{padding:20px 20px 18px;text-align:center;
  background:linear-gradient(155deg,var(--gold) 0%,var(--gold2,#c9a961) 100%)}
.loan-main-lb{font-size:13px;color:var(--onbrand);opacity:.9;margin-bottom:6px}
.loan-main-v{font-size:40px;font-weight:800;color:var(--onbrand);line-height:1.1;
  letter-spacing:-.5px}
.loan-main-v i{font-size:16px;font-style:normal;font-weight:600;margin-left:4px;opacity:.9}
.loan-main-sub{font-size:12px;color:var(--onbrand);opacity:.85;margin-top:8px}

.loan-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:11px}
.loan-c{padding:13px 14px;text-align:center}
.loan-c-lb{font-size:12px;color:var(--loan-mu);margin-bottom:6px}
.loan-c-v{font-size:19px;font-weight:700;color:var(--text)}
.loan-c-v i{font-size:12px;font-style:normal;color:var(--loan-mu);margin-left:2px;font-weight:500}

.loan-split{padding:13px 15px}
.loan-split-t{font-size:12.5px;color:var(--loan-mu);margin-bottom:9px}
/* V119：加 flex-wrap。原来在窄卡片里「商业贷款 / 公积金」两项硬挤一行，
   放不下时会被撑出卡片外；允许换行后各自占一行，不会溢出。 */
.loan-split-b{display:flex;gap:22px;font-size:13.5px;color:var(--loan-mu);flex-wrap:wrap}
.loan-split-b b{color:var(--gold);font-size:16px;font-weight:700;margin:0 3px}

.loan-extra{padding:14px 15px}
.loan-tip-t{font-size:13px;font-weight:700;color:var(--text);margin-bottom:9px}
.loan-ul{margin:0;padding-left:18px;font-size:12.5px;color:var(--loan-mu);line-height:1.95}
.loan-ul b{color:var(--gold)}

.loan-disclaimer{font-size:11.5px;color:var(--loan-mu);line-height:1.8;padding:0 2px}

.loan-hot{margin-top:26px}
.loan-hot-t{font-size:15px;font-weight:700;color:var(--text);margin-bottom:12px;
  display:flex;align-items:center;gap:8px}
.loan-hot-t:before{content:"";width:3px;height:15px;border-radius:2px;background:var(--gold)}
/* V119：列宽改 minmax(0,1fr)。
   原来写 repeat(3,1fr)，而 1fr 的「最小值」默认是 auto(=min-content)。
   .loan-hot-n 带 white-space:nowrap，它的 min-content 就是整行标题的宽度，
   于是每一列都被本列最长的标题撑开：实测三列实际宽度是 303/325/329px
   （本应各 312px），窄屏下三列总和超过容器 → 整页出现横向滚动条。
   minmax(0,1fr) 允许列收缩到 0，超长标题才走 text-overflow:ellipsis。
   .loan-hot-item 同时补 min-width:0：它是 grid item，默认 min-width:auto
   同样会按内容撑开，只改列宽不够。 */
.loan-hot-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
@media(max-width:860px){.loan-hot-list{grid-template-columns:minmax(0,1fr)}}
.loan-hot-item{display:flex;align-items:center;justify-content:space-between;gap:10px;
  min-width:0;overflow:hidden;
  background:var(--card);border:1px solid var(--line);border-radius:10px;padding:11px 13px}
.loan-hot-item:hover{border-color:var(--gold)}
/* min-width:0 + flex:1 1 auto：标题吃掉剩余空间，剩余不足时才省略号。
   缺 min-width:0 时 flex item 的最小尺寸仍等于内容宽，省略号不会生效。 */
.loan-hot-n{font-size:13px;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  min-width:0;flex:1 1 auto}
.loan-hot-p{font-size:13px;color:var(--gold);font-weight:700;flex:0 0 auto}
/* V119：极窄屏（≤380px）标题几乎没地方显示，改成上下两行：
   标题一行省略号 + 价格独占一行，不再和标题抢空间。 */
@media(max-width:380px){
  .loan-hot-item{flex-direction:column;align-items:flex-start;gap:4px}
  .loan-hot-n{width:100%}
}

.goto-loan{display:flex;align-items:center;gap:9px;margin-top:11px;padding:11px 14px;
  background:var(--bg);border:1px dashed var(--gold);border-radius:10px;
  font-size:13.5px;color:var(--gold);font-weight:600;transition:background .15s}
.goto-loan:hover{background:var(--chip)}
.goto-loan-i{font-size:16px;font-weight:800}
.goto-loan-t{flex:1;min-width:0}
.goto-loan-a{font-size:16px;opacity:.7}

.dact{display:flex;align-items:center;gap:10px;margin-top:11px;flex-wrap:wrap}
.fav-btn{display:inline-flex;align-items:center;gap:6px;padding:9px 16px;border-radius:9px;
  border:1px solid var(--line);background:var(--bg);color:var(--muted);
  font-size:13.5px;cursor:pointer;font-family:inherit;transition:all .15s;min-height:40px}
.fav-btn:hover{border-color:var(--gold);color:var(--gold)}
.fav-btn.on{background:var(--gold);border-color:var(--gold);color:var(--onbrand);font-weight:600}
.fav-i{font-size:15px;line-height:1}
.fav-link{font-size:12.5px;color:var(--muted2);padding:4px 2px}
.fav-link:hover{color:var(--gold)}

.fav-toast{position:fixed;left:50%;bottom:96px;transform:translate(-50%,14px);
  background:rgba(30,34,45,.94);color:#fff;padding:10px 20px;border-radius:9px;
  font-size:13.5px;z-index:9999;opacity:0;pointer-events:none;transition:all .22s;
  box-shadow:0 6px 22px rgba(0,0,0,.22)}
.fav-toast.show{opacity:1;transform:translate(-50%,0)}

.uc-nav{display:flex;gap:8px;margin-bottom:16px;flex-wrap:wrap}
.uc-n{display:inline-flex;align-items:center;gap:6px;padding:9px 16px;border-radius:9px;
  border:1px solid var(--line);background:var(--card);color:var(--muted);
  font-size:13.5px;transition:all .15s;min-height:40px}
.uc-n:hover{border-color:var(--gold);color:var(--gold)}
.uc-n.on{background:var(--gold);border-color:var(--gold);color:var(--onbrand);font-weight:600}
.uc-n-b{display:inline-block;min-width:19px;padding:1px 6px;border-radius:9px;
  background:var(--chip);color:var(--muted2);font-size:11.5px;font-weight:700;text-align:center}
.uc-n.on .uc-n-b{background:rgba(255,255,255,.24);color:var(--onbrand)}
.uc-tip{font-size:12.5px;color:var(--muted2)}
.uc-time{font-size:12.5px;color:var(--muted2);white-space:nowrap}


/* ================= 会员中心 · 收藏 / 足迹卡片（V60） =================
   原来是纯表格：一列行文字，看不出是哪套房，手机上更是挤成一团。
   改成「小图 + 标题 + 价格 + 状态 + 时间 + 操作」的卡片，
   一眼能认出房源，也能直接看出哪套已经下架/删除了。 */

.tk-list{display:flex;flex-direction:column;gap:10px}
.tk-item{
  display:flex;gap:14px;align-items:stretch;
  background:var(--card);border:1px solid var(--line);border-radius:12px;
  padding:12px 14px;transition:box-shadow .16s,border-color .16s,transform .16s;
}
.tk-item:hover{border-color:rgba(201,150,47,.42);box-shadow:0 6px 18px rgba(20,25,40,.07);transform:translateY(-1px)}
/* 房源已删除：整卡淡出，避免和正常房源混淆 */
.tk-item.is-gone{background:#fafbfc;border-style:dashed;opacity:.82}
.tk-item.is-gone:hover{transform:none;box-shadow:none;border-color:var(--line)}

.tk-img{
  flex:0 0 116px;width:116px;height:88px;border-radius:9px;overflow:hidden;
  background:var(--chip);position:relative;display:block;
}
.tk-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .3s}
.tk-item:hover .tk-img img{transform:scale(1.05)}
/* 无图占位：斜纹底 + 文字，避免出现破图图标 */
.tk-nopic{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-size:12px;color:#a8b0bd;text-align:center;line-height:1.5;
  background:repeating-linear-gradient(45deg,#f2f4f7 0 8px,#eaedf2 8px 16px);
}
.tk-img-none{
  flex:0 0 116px;width:116px;height:88px;border-radius:9px;
  display:flex;align-items:center;justify-content:center;
  background:repeating-linear-gradient(45deg,#f4f5f7 0 8px,#eceef1 8px 16px);
  color:#aab2bf;font-size:12.5px;text-align:center;line-height:1.5;
}

.tk-b{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px}
.tk-t{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.tk-title{font-size:15px;font-weight:600;line-height:1.45;color:var(--text);
  display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.tk-title:hover{color:var(--gold)}
.tk-title.muted{color:var(--muted2);font-weight:500}
.tk-tag{
  flex:0 0 auto;font-size:11.5px;padding:2px 8px;border-radius:20px;
  font-weight:600;line-height:1.6;
}
.tk-tag.wait{background:#fff5e0;color:#a9761a;border:1px solid #f2ddb0}
.tk-tag.off {background:#fdecec;color:#b4453c;border:1px solid #f6d2cf}
.tk-tag.gone{background:#eef0f3;color:#78808d;border:1px solid #dfe3e9}
.tk-times{font-size:11.5px;color:#a0a7b3;background:#f4f6f9;padding:2px 8px;border-radius:20px}

.tk-m{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;font-size:12.5px;color:var(--muted2)}
.tk-price{font-size:16px;color:var(--red);font-weight:700}
.tk-cm{color:var(--gold)}
.tk-hint{font-size:12.5px;color:var(--muted2)}

.tk-f{margin-top:auto;padding-top:2px;display:flex;align-items:center;gap:10px}
.tk-time{font-size:12px;color:#9aa3b2}
.tk-act{margin-left:auto;margin-bottom:0}
.tk-act .btn{padding:5px 12px;font-size:12.5px}

@media (max-width:640px){
  .tk-item{gap:10px;padding:10px}
  .tk-img,.tk-img-none{flex:0 0 92px;width:92px;height:72px}
  .tk-title{font-size:14px}
  .tk-price{font-size:15px}
  .tk-f{flex-wrap:wrap}
  .tk-act{margin-left:0;width:100%}
  .tk-act .btn{width:100%}
}

/* 收藏 / 足迹只有一栏内容，但 .layout 是 1fr 300px 两栏 ——
   右侧会空出 320px 一大片。单栏页用 .layout.one 撑满。 */
.layout.one{grid-template-columns:1fr}

/* ===== 群广告位（V74） =====
   侧栏卡片：QQ 群 / 微信群 各一块，二维码居中，按钮在下方。 */
.grp-ad{background:#fff;border:1px solid #e6ebf3;border-radius:10px;padding:14px 15px;
        box-shadow:0 1px 4px rgba(20,30,50,.05)}
.grp-ad-t{margin:0 0 12px;font-size:14.5px;font-weight:700;color:#1f2733;
          padding-left:10px;border-left:4px solid #b8912f}
.grp-ad-i{padding:12px 0;border-top:1px dashed #e6ebf3;text-align:center}
.grp-ad-i:first-of-type{border-top:0;padding-top:0}
.grp-ad-hd{display:flex;align-items:center;justify-content:center;gap:7px;margin-bottom:10px}
.grp-ico{display:inline-flex;align-items:center;justify-content:center;
         width:22px;height:22px;border-radius:5px;font-size:11px;font-weight:700;color:#fff;flex:none}
.grp-ico.qq{background:#12b7f5}
.grp-ico.wx{background:#2dc100}
.grp-ad-nm{font-size:13.5px;font-weight:600;color:#2c3543}
.grp-qr{display:block;max-width:150px;width:100%;height:auto;margin:0 auto 10px;
        border:1px solid #eef1f6;border-radius:8px;background:#fff}
.grp-btn{margin-top:2px}
.grp-tip{margin:8px 0 0;font-size:12px;color:#8b93a1;line-height:1.6}
.grp-desc{margin:0 0 8px;font-size:12.5px;color:#5d6572;line-height:1.7;text-align:left}
.grp-note{margin:10px 0 0;padding-top:10px;border-top:1px dashed #e6ebf3;
          font-size:12px;color:#8b93a1;line-height:1.7;text-align:left}
/* 详情页正文下方横排：两个群并排，二维码小一点 */
.grp-ad-inline{display:flex;flex-wrap:wrap;gap:18px;justify-content:center}
.grp-ad-inline .grp-ad-i{border-top:0;padding:0;flex:1 1 200px;max-width:240px}
.grp-ad-inline .grp-qr{max-width:120px}
@media (max-width:640px){
  .grp-ad{padding:12px 13px}
  .grp-ad-inline{flex-direction:column;align-items:center;gap:14px}
  .grp-ad-inline .grp-ad-i{max-width:100%;width:100%}
}
/* V75 委托房源入口：挂在广告位底部，是广告位里唯一能直接收到电话的入口 */
.grp-ent{margin-top:12px;padding-top:12px;border-top:1px dashed #e6ebf3;text-align:center}
.grp-ent-t{margin:0 0 10px;font-size:13px;color:#5d6572;line-height:1.7;text-align:left}
.grp-ent-btn{background:linear-gradient(135deg,#c9a227,#b8912f);border-color:#b8912f;color:#fff;
             font-weight:600}
.grp-ent-btn:hover{background:linear-gradient(135deg,#d4af37,#c9a227)}
.grp-ent-more{margin:8px 0 0;font-size:12px;color:#8b93a1}
.grp-ent-more a{color:var(--gold);text-decoration:none}
.grp-ent-more a:hover{text-decoration:underline}
/* V75 列表页横条：整条横向排布，不占太多竖向空间 */
.grp-ad-bar{display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin:14px 0}
.grp-ad-bar .grp-ad-t{margin:0;border-left:0;padding-left:0;flex:none;width:100%}
.grp-ad-bar .grp-ad-i{flex:0 0 auto;border-top:1px dashed #e6ebf3;padding:10px 0;text-align:center}
.grp-ad-bar .grp-ad-i:first-of-type{border-top:1px dashed #e6ebf3}
.grp-ad-bar .grp-qr{max-width:96px;margin-bottom:6px}
.grp-ad-bar .grp-ent{flex:1 1 260px;min-width:220px;margin-top:0;padding-top:0;border-top:0;text-align:left}
.grp-ad-bar .grp-ent-btn{display:inline-block;width:auto;padding:8px 20px}
@media (max-width:640px){
  .grp-ad-bar{flex-direction:column;align-items:stretch;gap:10px}
  .grp-ad-bar .grp-ad-i{width:100%}
  .grp-ad-bar .grp-ent{text-align:center}
}

/* ---------- 委托需求表单（V74） ---------- */
.ent-kind{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:20px}
.ent-kind-i{position:relative;cursor:pointer}
.ent-kind-i input{position:absolute;opacity:0;width:0;height:0}
.ent-kind-i span{display:block;text-align:center;padding:11px 6px;border-radius:10px;
  border:1px solid var(--line);background:var(--card);color:var(--muted);
  font-size:13.5px;font-weight:600;transition:.15s}
.ent-kind-i:hover span{border-color:var(--gold2)}
.ent-kind-i input:checked + span{border-color:var(--gold);background:linear-gradient(135deg,var(--gold2),var(--gold));
  color:#241d10;box-shadow:0 2px 8px rgba(184,147,74,.25)}
.ent-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}
.ent-row{margin-bottom:14px}
.ent-row label{display:block;font-size:13px;color:var(--muted);margin-bottom:7px;font-weight:600}
.ent-range{display:flex;align-items:center;gap:8px}
.ent-range .inp{flex:1;min-width:0}
.ent-range span{color:var(--muted2);flex:0 0 auto}
.ent-hint{font-size:12px;color:var(--muted2);margin-top:6px;line-height:1.7}
.ent-sep{margin:20px 0 14px;padding-top:16px;border-top:1px solid var(--line);
  font-size:13.5px;font-weight:700;color:var(--text)}
.ent-actions{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-top:18px}
.ent-tip{font-size:12.5px;color:var(--muted2)}
@media (max-width:640px){
  .ent-kind{grid-template-columns:repeat(2,1fr)}
  .ent-grid{grid-template-columns:1fr}
}

/* ============================================================
   会员权益页（vip.php）· V75
   这一页的类此前完全没有样式，页面渲染出来是裸 HTML ——
   表格无边框、卡片无底色、金色标识块挤成一团，看着像坏了。
   ============================================================ */
.vip-wrap{max-width:900px;margin:0 auto;padding:0 0 30px}
.vip-head{text-align:center;padding:8px 0 22px}
.vip-h1{margin:0 0 8px;font-size:26px;font-weight:800;letter-spacing:-.3px}
.vip-sub{margin:0 auto;max-width:640px;font-size:14px;color:var(--muted);line-height:1.8}
.vip-sub b{color:var(--gold3);font-weight:600}

/* 当前账号条 */
.vip-me{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:14px 18px;margin-bottom:22px}
.vip-me-l{display:flex;align-items:center;gap:12px;min-width:0}
.vip-me-av{width:40px;height:40px;flex:0 0 40px;border-radius:50%;background:var(--gold);color:var(--onbrand);
  display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:700}
.vip-me-t{font-size:12.5px;color:var(--muted2);margin-top:2px}
.vip-me-r{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.vip-bad{font-size:12.5px;padding:4px 10px;border-radius:999px;font-weight:600}
.vip-bad.ok{background:rgba(46,139,87,.1);color:var(--green)}
.vip-bad.no{background:rgba(192,57,43,.1);color:var(--red)}

/* 两张身份卡 */
.vip-cards{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:26px}
.vip-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:20px 18px;display:flex;flex-direction:column;position:relative;overflow:hidden}
.vip-card:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px}
.vip-card.per:before{background:var(--green)}
.vip-card.agt:before{background:var(--gold)}
.vip-card-h{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.vip-card-h h2{margin:0;font-size:17px;font-weight:700}
.vip-ico{width:30px;height:30px;flex:0 0 30px;border-radius:8px;display:flex;align-items:center;
  justify-content:center;font-size:15px;font-weight:700;color:#fff}
.vip-ico.per{background:var(--green)}
.vip-ico.agt{background:var(--gold)}
.vip-card-d{margin:0 0 12px;font-size:13.5px;color:var(--muted);line-height:1.75}
.vip-ul{margin:0 0 16px;padding:0;list-style:none;font-size:13.5px;line-height:1.9;flex:1}
.vip-ul li{padding-left:16px;position:relative;color:var(--text)}
.vip-ul li:before{content:"";position:absolute;left:2px;top:10px;width:5px;height:5px;border-radius:50%;background:var(--gold2)}
.vip-ul b{color:var(--gold3)}

/* 对比表 */
.vip-table-wrap{margin-bottom:26px}
.vip-h2{font-size:17px;font-weight:700;margin:0 0 12px;padding-left:10px;border-left:3px solid var(--gold)}
.vip-table{width:100%;border-collapse:collapse;background:var(--card);
  border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;font-size:13.5px}
.vip-table th,.vip-table td{padding:11px 14px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
.vip-table thead th{background:var(--tint1);font-size:13px;color:var(--muted);font-weight:600}
.vip-table tbody tr:last-child th,.vip-table tbody tr:last-child td{border-bottom:0}
.vip-table tbody tr:hover{background:var(--tint1)}
.vip-th-k{width:150px;font-weight:600;color:var(--text);background:var(--tint1)}

/* 常见问题 */
.vip-faq{margin-bottom:26px}
.vip-q{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:14px 18px;margin-bottom:10px}
.vip-q h3{margin:0 0 6px;font-size:14.5px;font-weight:700;color:var(--text)}
.vip-q p{margin:0;font-size:13.5px;color:var(--muted);line-height:1.8}
.vip-q b{color:var(--gold3)}

/* 底部 CTA */
.vip-cta{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
  background:var(--tint1);border:1px solid var(--tintline);border-radius:var(--radius);padding:16px 20px}
.vip-cta b{display:block;font-size:15px}
.vip-cta span{font-size:13px;color:var(--muted)}
.vip-cta-r{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.vip-tel{font-size:19px;font-weight:800;color:var(--gold3);letter-spacing:.5px}

@media (max-width:720px){
  .vip-cards{grid-template-columns:1fr}
  .vip-h1{font-size:22px}
  .vip-table{font-size:12.5px}
  .vip-th-k{width:110px}
  .vip-table th,.vip-table td{padding:9px 10px}
}

/* V75 房贷计算器简化：利率设置折叠区 */
.loan-adv{margin-top:18px;border:1px solid var(--line);border-radius:9px;background:var(--tint1);overflow:hidden}
.loan-adv summary{cursor:pointer;list-style:none;padding:11px 14px;display:flex;align-items:center;
  justify-content:space-between;gap:10px;font-size:13px;font-weight:600;color:var(--text)}
.loan-adv summary::-webkit-details-marker{display:none}
.loan-adv summary:after{content:"▾";flex:0 0 auto;font-size:11px;color:var(--muted2);transition:transform .15s}
.loan-adv[open] summary:after{transform:rotate(180deg)}
.loan-adv-sum{font-size:12px;font-weight:500;color:var(--muted2);flex:1;text-align:right}
.loan-adv-b{padding:2px 14px 14px;border-top:1px solid var(--line)}
.loan-adv-b .loan-row:last-child{margin-bottom:0}

/* ============================================================
 * V126 中介入驻申请（会员中心）
 * ========================================================== */

/* V126：.pill 此前只定义在 admin.css 里 —— 前台会员中心用的
   「VIP 会员」「发布权限：已开通」等标记一直是没有任何样式的裸文字，
   看着像普通句子而不是状态标识。这里补齐前台版本（手机版同样加载 style.css）。 */
.pill{display:inline-block;padding:2px 8px;border-radius:999px;font-size:12px;
  font-weight:600;line-height:1.7;white-space:nowrap;vertical-align:middle}
.pill.gold{background:#fdf3e0;color:#a6772c}
.pill.red{background:#fdeeee;color:#b3372f}
.pill.green{background:#eaf6ee;color:#2e8b57}
.pill.blue{background:#eef2f8;color:#4a6fa5}
.pill.gray{background:#f2f3f5;color:#8b93a1}

/* 会员中心入口卡：个人用户进来第一眼要能看到「可以升级成中介」 */
.join-agent{display:flex;gap:14px;align-items:center;justify-content:space-between;
  flex-wrap:wrap;margin-bottom:16px;padding:14px 16px;border-radius:10px;
  border:1px solid var(--tintline,#f0e4c4);
  background:linear-gradient(135deg,var(--tint2,#fdf6e6),var(--card,#fff))}
.join-agent-l{min-width:0;flex:1 1 260px}
.join-agent-t{font-size:15px;font-weight:800;color:var(--text)}
.join-agent.is-on .join-agent-t{color:var(--gold3,#8a6d2f)}
.join-agent-d{font-size:12.5px;color:var(--muted);line-height:1.8;margin-top:5px}
.join-agent-d a{color:var(--gold);text-decoration:none}
.join-agent-d a:hover{text-decoration:underline}

/* 已是中介：门店卡 */
.join-shop{border:1px solid var(--line);border-radius:10px;background:var(--card);
  padding:16px;margin-bottom:14px}
.join-shop-h{display:flex;gap:12px;align-items:center}
.join-shop-av{width:46px;height:46px;border-radius:50%;flex:0 0 auto;display:flex;
  align-items:center;justify-content:center;font-size:20px;font-weight:800;color:#fff;
  background:linear-gradient(135deg,var(--gold),var(--gold2,#c9a961))}
.join-shop-n{font-size:16px;font-weight:800;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.join-shop-s{font-size:12.5px;color:var(--muted);margin-top:5px}
.join-shop-tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.join-shop-tag{font-size:12px;padding:3px 9px;border-radius:999px;background:var(--tint1,#fffdf6);
  border:1px solid var(--tintline,#f0e4c4);color:var(--gold3,#8a6d2f)}
.join-shop-vip{display:flex;gap:8px;flex-wrap:wrap;align-items:baseline;margin-top:14px;
  padding:11px 13px;border-radius:9px;background:var(--tint1,#fffdf6);
  border:1px dashed var(--tintline,#f0e4c4);font-size:12.5px;color:var(--muted);line-height:1.8}
.join-shop-vip b{color:var(--gold3,#8a6d2f);font-size:13px}

/* 权益四宫格 */
.join-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.join-cell{border:1px solid var(--line);border-radius:9px;padding:12px;background:var(--tint1,#fffdf6)}
.join-cell-t{font-size:13.5px;font-weight:700}
.join-cell-d{font-size:12.5px;color:var(--muted);line-height:1.7;margin-top:4px}
@media (max-width:560px){
  .join-grid{grid-template-columns:1fr}
  .join-agent{flex-direction:column;align-items:stretch}
  .join-agent .btn{width:100%}
}