/* ==========================================================================
   UI v2 设计升级层 —— 精致 / 高端 / 现代
   覆盖 design-tokens 之后的朴素样式；所有页面最后加载本文件（优先级最高）
   ========================================================================== */

/* ---------- 页面头：去边框、柔阴影 ---------- */
.page-head {
  height: 46px; line-height: 46px;
  border-bottom: 0;
  box-shadow: 0 1px 0 rgba(21, 24, 29, .04);
  font-size: 17px;
}

/* ---------- 底部导航：毛玻璃 + 顶部柔和分割 + 主色选中态 ---------- */
.hm_ft-nv {
  border-top: 0;
  box-shadow: 0 -1px 12px rgba(21, 24, 29, .05);
  background: rgba(255, 255, 255, .96);
  backdrop-filter: blur(10px);
}
.hm_ft-nv a.on, .hm_ft-nv a.active { color: var(--c-primary); font-weight: 600; }
.hm_ft-nv a.center i {
  background: linear-gradient(135deg, var(--c-primary-light), var(--c-primary-deep));
  box-shadow: 0 4px 12px rgba(11, 122, 82, .35);
}

/* ==========================================================================
   房源卡片 —— 白卡片 + 圆角 + 阴影 + 间距（替代整块白底分隔线）
   ========================================================================== */
.house_lists { background: transparent; }
.house_lists .mod_cont .pictext,
.hm_block .block_body .pictext {
  margin: 0 var(--page-pad) 10px;
  padding: 12px;
  background: var(--bg-white);
  border-radius: var(--r-md);
  box-shadow: var(--shadow-sm);
  border-bottom: 0;
  display: flex;
}
.house_lists .mod_cont .pictext:last-child { margin-bottom: 10px; }
.hm_block .block_body { padding: 0; }
.hm_block { background: transparent; }
.hm_block .block_body .pictext:last-child { border-bottom: 0; }

/* 缩略图圆角放大 */
.pictext .mod_media .media_main img,
.pictext .mod_media img { border-radius: var(--r-sm); }
.house_lists .mod_media,
.house_lists .mod_media .media_main,
.hm_block .block_body .mod_media,
.hm_block .block_body .mod_media .media_main { width: var(--thumb-w); }
.house_lists .mod_media .media_main,
.hm_block .block_body .mod_media .media_main { height: 87px; }

/* 标题与文字层次 */
.pictext .item_main { font-weight: 600; line-height: 21px; }
.pictext .item_other, .pictext .item_minor { line-height: 20px; }
.price_total { font-weight: 700; }
.price_total em { font-size: var(--fs-lg); }

/* 标签：浅色圆角底，更精致 */
.tag_box > .tag {
  background: var(--bg-body);
  color: var(--c-text-sub);
  border-radius: 6px;
  padding: 0 7px;
  line-height: 18px;
  font-size: 11px;
}
.tagitem { border-radius: 6px; height: 18px; line-height: 18px; font-weight: 600; }

/* ==========================================================================
   首页
   ========================================================================== */
/* 轮播图增高 + 圆角 */
.hm_banner .swiper-slide img { height: 200px; }
.hm_banner .swiper-pagination-bullet { width: 5px; height: 5px; border-radius: 3px; background: rgba(255,255,255,.6); }
.hm_banner .swiper-pagination-bullet-active { width: 16px; background: #fff; }

/* 搜索框：白卡 + 阴影 + 圆角 */
.hm_search { background: transparent; padding: 12px var(--page-pad) 4px; }
.hm_search .search_box {
  height: 44px;
  background: var(--bg-white);
  border-radius: 22px;
  box-shadow: var(--shadow-md);
  color: var(--c-text-weak);
}
.hm_search .search_box .map_btn { color: var(--c-primary); font-weight: 600; }

/* 指数栏：卡片化 */
.hm_zhishu {
  background: var(--bg-white);
  margin: 8px var(--page-pad) 0;
  border-radius: var(--r-md);
  box-shadow: var(--shadow-sm);
  border-bottom: 0;
  padding: 14px var(--page-pad);
}
.hm_zhishu li em { font-size: var(--fs-lg); }
.hm_zhishu li + li::before { background: var(--line); }

/* 宫格导航：渐变色块图标 */
.hm_m-nv { background: var(--bg-white); margin: 8px var(--page-pad) 0; border-radius: var(--r-md); box-shadow: var(--shadow-sm); padding: 18px 0 0; }
.hm_m-nv li i {
  border-radius: 14px;
  background-color: var(--c-primary-soft);
  box-shadow: inset 0 0 0 1px rgba(11, 122, 82, .05);
}
.hm_m-nv li span { color: var(--c-text-sub); }

/* 公告：卡片化 */
.hm_gonggao {
  margin: 8px var(--page-pad) 0;
  border-radius: var(--r-md);
  box-shadow: var(--shadow-sm);
  border-bottom: 0;
}
.hm_gonggao .gg_tag { color: var(--c-gold); }

/* 区块标题：更大更精致 */
.hm_block { margin-top: 10px; }
.hm_block .block_head { padding: 16px var(--page-pad) 8px; background: transparent; }
.hm_block .block_head h3 { font-size: 17px; font-weight: 700; padding-left: 12px; }
.hm_block .block_head h3::before {
  width: 4px; height: 16px;
  border-radius: 2px;
  background: linear-gradient(var(--c-primary-light), var(--c-primary-deep));
}

/* 查看全部按钮 */
.hm_block .block_all {
  margin: 6px var(--page-pad) 16px;
  border-radius: 20px;
  border-color: var(--c-primary-87);
  font-weight: 600;
}

/* 经纪人卡片 */
.hm_jjr { background: transparent; margin-top: 10px; }
.hm_jjr .swiper-slide {
  background: var(--bg-white);
  border-radius: var(--r-md);
  box-shadow: var(--shadow-sm);
}

/* 广告位 */
.hm_ad { background: transparent; padding: 8px var(--page-pad) 0; }
.hm_ad img { border-radius: var(--r-md); }

/* ==========================================================================
   筛选栏 & 搜索面板
   ========================================================================== */
.hm_filter2 { border-bottom: 0; box-shadow: 0 1px 0 rgba(21,24,29,.04); }
.hm_filter2 .tab li { padding: 11px 0; }
.hm_filter2 .tab li.on a { font-weight: 600; }
.hm_filter2 .tab li.on::after { width: 22px; height: 3px; border-radius: 2px; background: var(--c-primary); }

.filter-foot { padding: 12px var(--page-pad); box-shadow: 0 -4px 16px rgba(21,24,29,.06); }
.filter-foot a { border-radius: 22px; }
.filter-foot .btn-ok { background: linear-gradient(135deg, var(--c-primary-light), var(--c-primary-deep)); box-shadow: 0 4px 12px rgba(11,122,82,.25); }
.filter-foot .btn-reset { background: var(--bg-body); }

.filter-panel .inner_child a { border-radius: 8px; }
.filter-panel .inner_child a.on { background: var(--c-primary-soft); }
.filter-panel .inner_left li.on { color: var(--c-primary); }
.filter-panel .inner_left li.on::before { border-radius: 2px; }

/* 搜索面板主按钮 */
.searchstart { box-shadow: 0 -4px 16px rgba(21,24,29,.06); }
.searchstart a {
  height: 46px; line-height: 46px;
  border-radius: 23px;
  background: linear-gradient(135deg, var(--c-primary-light), var(--c-primary-deep));
  box-shadow: 0 6px 16px rgba(11,122,82,.28);
}
.xuanxiang-content > span { border-radius: 8px; }
.xuanxiang-content > span.on { background: var(--c-primary); }

/* ==========================================================================
   登录 / 注册页
   ========================================================================== */
.auth-wrap { padding: 24px var(--page-pad) 40px; }
.auth-logo .logo-badge {
  background: linear-gradient(135deg, var(--c-primary-light), var(--c-primary-deep));
  box-shadow: 0 6px 16px rgba(11,122,82,.28);
}
.auth-logo h1 { font-size: 22px; font-weight: 700; color: var(--c-title); }
.auth-tabs { background: #eceef1; }
.auth-tabs a.on { box-shadow: var(--shadow-sm); }
.auth-field {
  height: 52px;
  border-radius: var(--r-md);
  border-color: var(--line-card);
  box-shadow: var(--shadow-sm);
  transition: box-shadow .2s, border-color .2s;
}
.auth-field:focus-within { border-color: var(--c-primary); box-shadow: 0 0 0 3px var(--c-primary-soft); }
.auth-btn {
  height: 48px; line-height: 48px;
  border-radius: 24px;
  background: linear-gradient(135deg, var(--c-primary-light), var(--c-primary-deep));
  box-shadow: 0 6px 16px rgba(11,122,82,.28);
  font-size: 16px;
  font-weight: 700;
}
.sms-send { font-weight: 600; }

/* ==========================================================================
   详情页 / 新房 / 发布（pages.css 覆盖）
   ========================================================================== */
/* 区块卡片化 */
.house_sec {
  background: var(--bg-white);
  margin: 0 var(--page-pad) 10px;
  padding: 14px var(--page-pad);
  border-radius: var(--r-md);
  box-shadow: var(--shadow-sm);
}
.house_sec .sec_title {
  font-size: 16px; font-weight: 700; color: var(--c-title);
  padding-left: 12px; position: relative;
}
.house_sec .sec_title::before {
  content: ""; position: absolute; left: 0; top: 50%;
  transform: translateY(-50%);
  width: 4px; height: 15px; border-radius: 2px;
  background: linear-gradient(var(--c-primary-light), var(--c-primary-deep));
}

/* 详情价格区 */
.core_price { color: var(--c-price); font-weight: 700; }
.core_price em { font-size: 24px; }

/* 新房卡片 */
.xf_card { background: var(--bg-white); border-radius: var(--r-md); box-shadow: var(--shadow-sm); overflow: hidden; }
.xf_thumb img { border-radius: 0; }

/* 咨询/联系主按钮 */
.contact_btn, .fabu-btn, .detail_cta a {
  background: linear-gradient(135deg, var(--c-primary-light), var(--c-primary-deep));
  box-shadow: 0 6px 16px rgba(11,122,82,.28);
  border-radius: 22px;
}

/* ==========================================================================
   通用：主按钮渐变 + 阴影
   ========================================================================== */
.auth-btn, .searchstart a, .filter-foot .btn-ok, .fabu-submit {
  background: linear-gradient(135deg, var(--c-primary-light), var(--c-primary-deep));
}

/* ==========================================================================
   空结果占位（列表页无匹配房源时）
   ========================================================================== */
.empty-state {
  list-style: none; padding: 56px 24px 40px; text-align: center;
  background: var(--bg-white, #fff); border-radius: 12px;
}
.empty-state .empty-ico { font-size: 34px; line-height: 1; opacity: .55; }
.empty-state .empty-title {
  margin: 14px 0 6px; font-size: 15px; font-weight: 600; color: #333;
}
.empty-state .empty-sub {
  margin: 0 0 18px; font-size: 12px; color: #999; line-height: 1.6;
}
.empty-state .empty-btn {
  display: inline-block; height: 36px; line-height: 36px; padding: 0 22px;
  border-radius: 18px; font-size: 13px; font-weight: 600;
  color: #0b7a52; background: #eef7f2; text-decoration: none;
}
.empty-state .empty-btn:active { background: #dff0e7; }


/* ==========================================================================
   底部导航避让：列表/瀑布流最后一条不被固定导航与中央凸起按钮遮住
   ========================================================================== */
.house_lists,
.mod_cont,
.xf_list, .fx_list, .faxian_list { padding-bottom: calc(var(--nav-h, 54px) + 20px); }

/* ==========================================================================
   ============  UI/UE 升级第二轮（2026-10-18）  ============================
   Toast / 骨架屏 / 筛选遮罩与 chips / 卡片排版 / 协议勾选 / 安全区 / 可访问性
   ========================================================================== */

/* ---------- 1. Toast 轻提示 ---------- */
.ui-toast-box {
  position: fixed; left: 50%; bottom: calc(var(--nav-h, 54px) + env(safe-area-inset-bottom, 0px) + 24px);
  transform: translateX(-50%);
  z-index: 10000;
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  pointer-events: none;
  width: max-content; max-width: 80vw;
}
.ui-toast {
  max-width: 80vw;
  padding: 10px 18px;
  border-radius: 20px;
  background: rgba(23, 27, 32, .88);
  color: #fff; font-size: 13px; line-height: 1.5;
  box-shadow: 0 6px 24px rgba(0, 0, 0, .18);
  opacity: 0; transform: translateY(8px) scale(.96);
  transition: opacity .24s ease, transform .24s ease;
  backdrop-filter: blur(6px);
  word-break: break-word;
}
.ui-toast.in { opacity: 1; transform: translateY(0) scale(1); }
.ui-toast--success { background: rgba(11, 122, 82, .94); }
.ui-toast--error { background: rgba(196, 60, 48, .94); }

/* ---------- 2. 骨架屏 ---------- */
.sk-item {
  display: flex; gap: 12px;
  margin: 0 var(--page-pad) 10px; padding: 12px;
  background: var(--bg-white); border-radius: var(--r-md);
  box-shadow: var(--shadow-sm);
  list-style: none;
}
.sk-thumb {
  width: var(--thumb-w, 116px); height: 87px; flex-shrink: 0;
  border-radius: var(--r-sm);
  background: #eef1ef;
}
.sk-body { flex: 1; padding-top: 2px; }
.sk-line { height: 12px; border-radius: 6px; background: #eef1ef; }
.sk-line--title { width: 88%; height: 15px; }
.sk-line--sub { width: 64%; margin-top: 12px; }
.sk-line--meta { width: 42%; margin-top: 12px; }
/* 统一呼吸动画：用背景位移而非 opacity，避免整块闪烁刺眼 */
.sk-thumb, .sk-line {
  background-image: linear-gradient(90deg, #eef1ef 0%, #f7f9f8 40%, #eef1ef 80%);
  background-size: 400px 100%; background-repeat: no-repeat;
  animation: skShimmer 1.2s ease-in-out infinite;
}
@keyframes skShimmer {
  0% { background-position: -400px 0; }
  100% { background-position: 400px 0; }
}

/* ---------- 3. 首页宫格：11 项 → 4 列 × 3 行（消除孤行） ---------- */
.hm_m-nv li { width: 25%; }

/* ---------- 4. 房源卡片排版收敛 ---------- */
/* 标题固定两行高度 + 省略号，卡片高度自然对齐，不再出现「一行/两行」参差 */
.pictext .item_main,
.pictext .item_main.twoline {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 42px;
  word-break: break-all;
}
.pictext .mod_media .media_main img,
.pictext .mod_media img {
  height: 100%; object-fit: cover;
  /* 图片未加载时也占住位置，避免布局抖动（CLS） */
  background: #eef1ef;
}
.house_lists .mod_media .media_main,
.hm_block .block_body .mod_media .media_main { border-radius: var(--r-sm); overflow: hidden; }

/* ---------- 5. 筛选遮罩 + 面板动效 ---------- */
.filter-mask {
  position: fixed; inset: 0; z-index: 54;
  background: rgba(17, 24, 21, .38);
  backdrop-filter: blur(1px);
  opacity: 0; visibility: hidden;
  transition: opacity .2s ease, visibility .2s ease;
}
.filter-mask.show { opacity: 1; visibility: visible; }
.filter-panel.show { animation: panelIn .22s cubic-bezier(.22, .61, .36, 1); }
@keyframes panelIn {
  from { opacity: .4; transform: translateY(-8px); }
  to { opacity: 1; transform: translateY(0); }
}
.filter-foot { animation: footIn .22s ease; }
@keyframes footIn {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

/* ---------- 6. 已选条件 chips ---------- */
.filter-chips {
  display: none;
  gap: 8px; overflow-x: auto;
  padding: 10px var(--page-pad);
  background: var(--bg-white);
  scrollbar-width: none;
}
.filter-chips::-webkit-scrollbar { display: none; }
.filter-chips.show { display: flex; }
.filter-chips .chip {
  flex: 0 0 auto;
  display: inline-flex; align-items: center; gap: 6px;
  height: 28px; padding: 0 10px 0 12px;
  border-radius: 14px;
  background: var(--c-primary-soft, #e6f3ee);
  color: var(--c-primary, #0b7a52);
  font-size: 12px; font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
}
.filter-chips .chip b { font-weight: 600; }
.filter-chips .chip i {
  font-style: normal; font-size: 13px; line-height: 1;
  opacity: .6; padding: 0 1px;
}
.filter-chips .chip--clear {
  background: var(--bg-body, #f5f6f8);
  color: var(--c-text-sub, #6b7280);
  font-weight: 500;
  padding: 0 12px;
}

/* ---------- 7. 登录/注册：协议勾选 + 字段错误态 ---------- */
.auth-agree {
  display: flex; align-items: flex-start; gap: 8px;
  margin: 14px 0 4px;
  font-size: 12px; line-height: 18px; color: var(--c-text-sub, #6b7280);
}
.auth-agree .agree-box {
  flex: 0 0 auto;
  width: 16px; height: 16px; margin-top: 1px;
  border-radius: 50%;
  border: 1.5px solid #cfd6d2;
  background: #fff;
  position: relative;
  transition: background .15s, border-color .15s;
}
.auth-agree .agree-box::after {
  content: ""; position: absolute; left: 4.5px; top: 1.5px;
  width: 4px; height: 8px;
  border: solid #fff; border-width: 0 1.6px 1.6px 0;
  transform: rotate(45deg) scale(0);
  transition: transform .15s;
}
.auth-agree.on .agree-box { background: var(--c-primary, #0b7a52); border-color: var(--c-primary, #0b7a52); }
.auth-agree.on .agree-box::after { transform: rotate(45deg) scale(1); }
.auth-agree.shake { animation: agreeShake .4s; }
@keyframes agreeShake {
  0%, 100% { transform: translateX(0); }
  20% { transform: translateX(-6px); }
  40% { transform: translateX(5px); }
  60% { transform: translateX(-3px); }
  80% { transform: translateX(2px); }
}
.auth-agree a { color: var(--c-primary, #0b7a52); text-decoration: none; }

/* 字段错误：红边 + 抖动，错误原因写在字段下方，不再只在顶部一行 */
.auth-field.err input { border-color: #e05b4b !important; background: #fff7f6; }
.auth-field .field-err {
  display: none;
  padding: 4px 0 0 2px;
  font-size: 11px; color: #e05b4b;
}
.auth-field.err .field-err { display: block; }

/* ---------- 8. 详情页底部栏：收藏态 ---------- */
.detail_foot .foot_ico.on { color: var(--c-price, #e84c3d); }
.detail_foot .foot_ico.on i {
  border-color: var(--c-price, #e84c3d);
  background: var(--c-price, #e84c3d);
}
.detail_foot .foot_ico { transition: transform .12s, color .12s; }
.detail_foot .foot_ico:active { transform: scale(.92); }

/* ---------- 9. iPhone 安全区（刘海屏底部不留白/不被遮挡） ---------- */
.hm_ft-nv {
  height: calc(var(--nav-h, 57px) + env(safe-area-inset-bottom, 0px));
  padding-bottom: env(safe-area-inset-bottom, 0px);
}
.detail_foot {
  height: calc(var(--nav-h, 57px) + env(safe-area-inset-bottom, 0px));
  padding-bottom: env(safe-area-inset-bottom, 0px);
}
.house_lists, .mod_cont, .xf_list, .fx_list, .faxian_list {
  padding-bottom: calc(var(--nav-h, 54px) + env(safe-area-inset-bottom, 0px) + 20px);
}

/* ---------- 10. 可访问性：键盘焦点可见 + 尊重「减少动效」 ---------- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid var(--c-primary, #0b7a52);
  outline-offset: 2px;
  border-radius: 4px;
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
}

/* ---------- 11. 点击热区：图标类小控件补足 44px 最小可点区域 ---------- */
.page-head .back, .album_back { min-width: 44px; min-height: 44px; }

/* ---------- 12. 底部动作面板（举报原因等） ---------- */
.sheet-mask {
  position: fixed; inset: 0; z-index: 9000;
  background: rgba(17, 24, 21, .45);
  opacity: 0; transition: opacity .2s ease;
}
.sheet-mask.show { opacity: 1; }
.sheet-mask[hidden], .sheet[hidden] { display: none !important; }
.sheet {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 9001;
  max-width: 640px; margin: 0 auto;
  background: #fff;
  border-radius: 16px 16px 0 0;
  padding-bottom: env(safe-area-inset-bottom, 0px);
  transform: translateY(100%);
  transition: transform .26s cubic-bezier(.22, .61, .36, 1);
  box-shadow: 0 -8px 32px rgba(0, 0, 0, .16);
}
.sheet.show { transform: translateY(0); }
.sheet-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px var(--page-pad) 10px;
  font-size: 15px; color: var(--c-title);
}
.sheet-head .sheet-cancel { font-size: 13px; color: var(--c-text-sub); font-weight: 400; text-decoration: none; }
.sheet-list { list-style: none; margin: 0; padding: 0 0 8px; }
.sheet-list li {
  padding: 14px var(--page-pad);
  font-size: 15px; color: var(--c-text);
  border-top: 1px solid var(--line);
}
.sheet-list li:active { background: var(--bg-body); }

/* ---------- 13. 详情页底部图标：方框占位换成线性图标 ---------- */
.detail_foot .foot_ico i {
  border: 0;
  width: 22px; height: 22px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 22px 22px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 10.6 12 3l9 7.6'/%3E%3Cpath d='M5.6 9.6V20h12.8V9.6'/%3E%3C/svg%3E");
}
.detail_foot #favBtn i {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20.3S4.8 15.6 4.8 10.7A4.2 4.2 0 0 1 12 7.9a4.2 4.2 0 0 1 7.2 2.8c0 4.9-7.2 9.6-7.2 9.6z'/%3E%3C/svg%3E");
}
.detail_foot #favBtn.on i {
  background-color: transparent;
  border-color: transparent;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23e84c3d' stroke='%23e84c3d' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20.3S4.8 15.6 4.8 10.7A4.2 4.2 0 0 1 12 7.9a4.2 4.2 0 0 1 7.2 2.8c0 4.9-7.2 9.6-7.2 9.6z'/%3E%3C/svg%3E");
}

/* ==========================================================================
   14. 列表底部加载态（上拉加载 / 已显示全部）
   --------------------------------------------------------------------------
   原来底部只有一个空 div：滑到底既没有"正在加载"，也没有"到底了"，
   用户只能反复上滑试探。这一段把「加载中」和「已全部」都明确写出来。
   ========================================================================== */
.list-load {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  /* 底部导航是 fixed，留出导航高度，否则「已显示全部」被压在导航下面看不见 */
  padding: 16px var(--page-pad) calc(var(--nav-h) + 18px + env(safe-area-inset-bottom));
  font-size: var(--fs-xs);
  color: var(--c-text-weak);
  min-height: 22px;
}
.list-load .ll-text { white-space: nowrap; }
.list-load .ll-line {
  width: 28px; height: 1px;
  background: var(--line-card);
}
.list-load.is-loading .ll-text { color: var(--c-text-sub); }
.list-load.is-loading .ll-spin {
  width: 13px; height: 13px;
  border: 2px solid var(--c-primary-87);
  border-top-color: var(--c-primary);
  border-radius: 50%;
  animation: llSpin .7s linear infinite;
}
@keyframes llSpin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  .list-load.is-loading .ll-spin { animation: none; }
}

/* ==========================================================================
   15. 演示数据提示条（接口降级可见化）
   --------------------------------------------------------------------------
   「页面正常但全是假数据」是最危险的故障：老板看不出、客服看不出，
   用户打过去说"没这套房"才发现。所以降级时顶部必须有一条看得见的条。
   放在文档流内（不是 fixed），不会盖住固定头部。
   ========================================================================== */
.demo-bar {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px var(--page-pad);
  background: #fff4e5;
  color: #8a5a00;
  border-bottom: 1px solid #ffe0b2;
  font-size: var(--fs-xs);
  line-height: 1.45;
}
.demo-bar svg { flex: 0 0 auto; color: #c47f00; }
.demo-bar span { flex: 1 1 auto; }
.demo-bar b { font-weight: 700; }
.demo-bar .demo-retry {
  flex: 0 0 auto;
  padding: 3px 10px;
  border: 1px solid #e9b96e;
  border-radius: 999px;
  color: #8a5a00;
  text-decoration: none;
  background: #fff;
  font-size: var(--fs-xs);
}

/* ==========================================================================
   16. 页脚：运营主体 / 备案号 / 版权
   ========================================================================== */
.site-footer {
  padding: 18px var(--page-pad) calc(var(--nav-h) + 26px + env(safe-area-inset-bottom));
  text-align: center;
  font-size: var(--fs-xs);
  color: var(--c-text-hint);
  line-height: 1.7;
  background: var(--bg-body);
}
.site-footer .sf-line { margin: 2px 0; }
.site-footer .sf-beian a {
  /* 备案号要能看清才叫「明示」：弱化到 #9aa1ab 就属于形式挂链 */
  color: var(--c-text-sub);
  text-decoration: none;
}
.site-footer .sf-beian i { margin: 0 6px; font-style: normal; color: var(--c-text-hint); }
.site-footer .sf-copy { color: var(--c-text-weak); }
.site-footer .sf-tel a { color: var(--c-text-sub); text-decoration: none; }

/* ==========================================================================
   17. 图片上传组件（发布页）
   ========================================================================== */
.fb-uploader { margin-top: 2px; }
.up-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}
.up-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 7px 13px;
  border: 1px solid var(--c-primary-87);
  border-radius: 999px;
  background: var(--c-primary-soft);
  color: var(--c-primary);
  font-size: var(--fs-sm);
  text-decoration: none;
}
.up-btn:active { background: #d9ebe3; }
.up-count {
  margin-left: auto;
  font-size: var(--fs-xs);
  color: var(--c-text-weak);
}
.up-count b { font-size: var(--fs-sm); }
.up-count b.ok { color: var(--c-primary); }
.up-count b.no { color: var(--c-price); }

.up-grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}
.up-item {
  position: relative;
  padding-top: 100%;      /* 1:1 格子，图片不跳版 */
  border-radius: var(--r-md);
  overflow: hidden;
  background: var(--bg-panel);
  border: 1px solid var(--line-card);
  touch-action: manipulation;
}
.up-item.dragging {
  opacity: .75;
  transform: scale(1.04);
  box-shadow: var(--shadow-md);
  z-index: 5;
}
.up-item.is-cover { border-color: var(--c-primary); }
.up-thumb {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.up-ph {
  position: absolute; inset: 0;
  background: repeating-linear-gradient(45deg, #f2f3f5, #f2f3f5 6px, #eaecf0 6px, #eaecf0 12px);
}
.up-badge {
  position: absolute;
  left: 0; top: 0;
  padding: 2px 7px;
  font-size: 10px;
  color: #fff;
  background: var(--c-primary);
  border-bottom-right-radius: 8px;
  font-weight: 500;
}
.up-mask {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 6px;
  text-align: center;
  font-size: 11px;
  color: #fff;
  background: rgba(21, 24, 29, .45);
}
.up-mask--err { background: rgba(192, 57, 43, .82); line-height: 1.35; }
.up-del {
  position: absolute;
  right: 0; top: 0;
  width: 22px; height: 22px;
  display: flex; align-items: center; justify-content: center;
  font-size: 15px; font-style: normal;
  color: #fff;
  background: rgba(21, 24, 29, .5);
  border-bottom-left-radius: 8px;
  cursor: pointer;
}
.up-set {
  position: absolute;
  left: 0; bottom: 0;
  padding: 2px 6px;
  font-size: 10px;
  color: #fff;
  background: rgba(21, 24, 29, .55);
  border-top-right-radius: 8px;
  text-decoration: none;
}
.up-move {
  position: absolute;
  bottom: 0;
  width: 20px; height: 20px;
  display: flex; align-items: center; justify-content: center;
  color: #fff;
  background: rgba(21, 24, 29, .45);
  text-decoration: none;
  font-size: 13px;
}
.up-move[data-dir="left"] { right: 22px; }
.up-move[data-dir="right"] { right: 0; }
.up-tip {
  margin: 9px 0 0;
  font-size: var(--fs-xs);
  line-height: 1.6;
  color: var(--c-text-weak);
}
.up-tip b { color: var(--c-price); font-weight: 600; }
.fb-req {
  margin-left: 4px;
  padding: 1px 5px;
  font-size: 10px;
  font-style: normal;
  color: var(--c-price);
  background: rgba(232, 76, 61, .08);
  border-radius: 4px;
}

/* ==========================================================================
   18. 发布表单版式（原样式表里 .fb-* 整套缺失，导致字段挤成一行、按钮压住内容）
   --------------------------------------------------------------------------
   .auth-field 是为「登录页输入框」设计的：固定 50px 高、label 64px 定宽横排。
   发布表单里有 textarea、九宫格、三列联动，直接套用必然塌陷，
   所以这里补一套 block 变体与行内分栏，不动登录页既有样式。
   ========================================================================== */
.fb-form-head {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px var(--page-pad);
  border-bottom: 1px solid var(--line);
  background: var(--bg-white);
}
.fb-form-head a {
  font-size: var(--fs-sm);
  color: var(--c-text-sub);
  text-decoration: none;
}
.fb-form-head span {
  font-size: 16px;
  font-weight: 700;
  color: var(--c-title);
}
.fb-form-body { padding: 16px var(--page-pad) 4px; }

/* block 变体：label 独占一行，内容自适应高度 */
.auth-field.auth-field--block {
  display: block;
  height: auto;
  padding: 12px 14px;
  align-items: stretch;
}
.auth-field.auth-field--block > label {
  display: block;
  width: auto;
  margin-bottom: 8px;
  font-size: var(--fs-sm);
  color: var(--c-text-sub);
}
.auth-field.auth-field--block textarea {
  display: block;
  width: 100%;
  min-height: 84px;
  font-size: var(--fs-md);
  line-height: 1.6;
  color: var(--c-text);
  border: 0;
  outline: none;
  resize: vertical;
  background: transparent;
  font-family: inherit;
}

/* 价格/面积后面的单位 */
.fb-unit {
  flex: 0 0 auto;
  margin-left: 8px;
  font-size: var(--fs-sm);
  color: var(--c-text-weak);
}

/* 三列 / 两列分栏 */
.fb-row3, .fb-row2 { display: flex; gap: 10px; }
.fb-row3 > .auth-field { flex: 1 1 0; margin-bottom: 14px; padding: 0 10px; }
.fb-row2 > .auth-field { flex: 1 1 0; }
.fb-row3 > .auth-field label { width: 22px; }
.fb-row2 > .auth-field label { width: 44px; }
.fb-row3 > .auth-field input { text-align: center; }

/* 电梯勾选 */
.fb-check {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 40px;
  padding: 0 14px;
  margin-bottom: 14px;
  background: var(--bg-white);
  border: 1px solid var(--line-card);
  border-radius: var(--r-md);
  font-size: var(--fs-md);
  color: var(--c-text);
}
.fb-check input[type="checkbox"] {
  width: 18px; height: 18px;
  accent-color: var(--c-primary);
}
.fb-check label { font-size: var(--fs-md); color: var(--c-text); }

/* 提交按钮与错误提示在表单容器里留出底部安全距离 */
#fabuForm .auth-btn { margin: 8px var(--page-pad) 0; width: calc(100% - var(--page-pad) * 2); }
#fabuForm .auth-err { margin: 12px var(--page-pad) 24px; }
