/* ==========================================================================
   小马社区服务商 · 页面级样式
   ========================================================================== */

/* ---------------------------------------------------------------- 首页 Hero */
.hero { padding: 52px 0 8px; }
.hero-badge {
  display: inline-flex; align-items: center; gap: 7px; padding: 5px 12px 5px 8px;
  border-radius: 99px; background: #fff; border: 1px solid var(--line);
  font-size: 12.5px; color: var(--ink-2); box-shadow: var(--shadow-sm);
}
.hero-badge b { color: var(--accent); font-weight: 600; }
.hero h1 {
  font-size: clamp(30px, 4.6vw, 46px); font-weight: 700; line-height: 1.22;
  letter-spacing: -1.2px; margin: 18px 0 12px; max-width: 620px;
}
.hero h1 .hl { position: relative; color: var(--brand); white-space: nowrap; }
.hero h1 .hl::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: 4px; height: 10px;
  background: linear-gradient(90deg, #CFEBDD, #EAF6F0); z-index: -1; border-radius: 3px;
}
.hero p.sub { color: var(--ink-2); font-size: 15.5px; max-width: 520px; }

/* 一句下单输入框 */
.order-box {
  margin-top: 26px; background: #fff; border-radius: var(--r-xl);
  box-shadow: 0 12px 40px rgba(22, 33, 28, .09), 0 1px 0 rgba(22, 33, 28, .03);
  border: 1px solid var(--line); padding: 10px; max-width: 720px;
  transition: box-shadow .2s, border-color .2s;
}
.order-box:focus-within { border-color: #BFE3D2; box-shadow: 0 14px 46px rgba(31, 122, 86, .14); }
.order-box .ob-main { display: flex; align-items: center; gap: 8px; }
.order-box .ob-main input {
  flex: 1; min-width: 0; height: 50px; border: 0; outline: 0; background: transparent;
  font-size: 15.5px; padding: 0 6px 0 12px;
}
.order-box .ob-main input::placeholder { color: #AEB6B0; }
.order-box .ob-main .go {
  height: 46px; padding: 0 22px; border-radius: 16px; background: var(--brand); color: #fff;
  font-size: 15px; font-weight: 500; display: flex; align-items: center; gap: 6px;
  box-shadow: 0 6px 16px rgba(31, 122, 86, .26); transition: transform .12s, background .18s;
}
.order-box .ob-main .go:hover { background: var(--brand-deep); }
.order-box .ob-main .go:active { transform: scale(.97); }
.ob-tags { display: flex; flex-wrap: wrap; gap: 7px; padding: 10px 10px 6px; }
.ob-tags .lbl { font-size: 12px; color: var(--ink-3); padding: 5px 6px 5px 2px; }
.svc-tag {
  display: inline-flex; align-items: center; gap: 5px; height: 31px; padding: 0 12px;
  border-radius: 99px; background: #F5F7F4; font-size: 13px; color: var(--ink-2);
  transition: all .16s; cursor: pointer; border: 1px solid transparent;
}
.svc-tag i { font-size: 13px; }
.svc-tag:hover { background: var(--brand-soft); color: var(--brand); transform: translateY(-1px); }
.svc-tag.hot::after { content: ''; width: 5px; height: 5px; border-radius: 50%; background: var(--accent); margin-left: 1px; }
.ob-foot { display: flex; align-items: center; gap: 16px; padding: 8px 12px 6px; border-top: 1px dashed var(--line); margin-top: 6px; font-size: 12px; color: var(--ink-3); }
.ob-foot span { display: flex; align-items: center; gap: 4px; }

/* 搜索联想 */
.suggest {
  position: absolute; left: 0; right: 0; top: calc(100% + 8px); background: #fff;
  border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--shadow-lg);
  z-index: 30; overflow: hidden; max-height: 340px; overflow-y: auto;
}
.order-box { position: relative; }
.suggest a { display: flex; align-items: center; gap: 10px; padding: 10px 14px; font-size: 14px; }
.suggest a:hover { background: #F7F9F6; }
.suggest .st { font-size: 11px; color: var(--ink-3); margin-left: auto; }

/* ---------------------------------------------------------------- 服务网格 */
.svc-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; }
.svc-cell {
  background: #fff; border: 1px solid var(--line); border-radius: var(--r);
  padding: 16px 14px; display: flex; flex-direction: column; gap: 6px;
  transition: all .18s; position: relative; overflow: hidden;
}
.svc-cell:hover { transform: translateY(-2px); box-shadow: var(--shadow); border-color: #DCE6DF; }
.svc-cell .ic {
  width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center;
  font-size: 20px; margin-bottom: 2px;
}
.svc-cell .nm { font-size: 15px; font-weight: 600; }
.svc-cell .tg { font-size: 11.5px; color: var(--ink-3); line-height: 1.45; }
.svc-cell .pr { font-size: 11.5px; color: var(--ink-2); margin-top: auto; padding-top: 6px; }
.svc-cell .pr b { font-family: var(--num); color: var(--ink); font-size: 14px; }
.svc-cell .hot-tag {
  position: absolute; top: 10px; right: 10px; font-size: 10px; padding: 1px 6px;
  border-radius: 4px; background: var(--accent-soft); color: #C2471B;
}

/* ---------------------------------------------------------------- 横幅 */
.banner-row { display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: 12px; }
.banner {
  border-radius: var(--r-lg); padding: 22px 22px 20px; color: #fff; min-height: 132px;
  display: flex; flex-direction: column; justify-content: space-between; position: relative;
  overflow: hidden; cursor: pointer; transition: transform .2s;
}
.banner:hover { transform: translateY(-2px); }
.banner::after {
  content: ''; position: absolute; right: -30px; bottom: -50px; width: 170px; height: 170px;
  border-radius: 50%; background: rgba(255, 255, 255, .1);
}
.banner b { font-size: 17px; font-weight: 600; position: relative; z-index: 1; }
.banner p { font-size: 12.5px; opacity: .88; margin-top: 5px; position: relative; z-index: 1; }
.banner span.cta { font-size: 12px; margin-top: 10px; opacity: .95; display: inline-flex; align-items: center; gap: 4px; position: relative; z-index: 1; }

/* ---------------------------------------------------------------- 商家卡片 */
.merchant-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.mcard { background: #fff; border: 1px solid var(--line); border-radius: var(--r); overflow: hidden; transition: all .2s; }
.mcard:hover { box-shadow: var(--shadow); transform: translateY(-2px); }
.mcard .mcover {
  height: 92px; display: grid; place-items: center; font-size: 38px;
  background: linear-gradient(135deg, #F4F8F4, #EAF2EC);
}
.mcard .mbody { padding: 12px 14px 14px; }
.mcard .mname { font-size: 14.5px; font-weight: 600; }
.mcard .mmeta { display: flex; align-items: center; gap: 6px; font-size: 11.5px; color: var(--ink-3); margin-top: 3px; }
.mcard .mdishes { display: flex; gap: 6px; margin-top: 10px; }
.mcard .mdishes span {
  flex: 1; background: #F7F9F6; border-radius: 6px; padding: 5px 4px; text-align: center;
  font-size: 10.5px; color: var(--ink-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* ---------------------------------------------------------------- 信任条 */
.trust-bar {
  display: flex; align-items: center; gap: 28px; flex-wrap: wrap;
  padding: 16px 22px; border-radius: var(--r); background: #fff; border: 1px solid var(--line);
  font-size: 12.5px; color: var(--ink-2);
}
.trust-bar div { display: flex; align-items: center; gap: 7px; }
.trust-bar b { font-family: var(--num); font-size: 17px; color: var(--ink); font-weight: 650; }

/* ---------------------------------------------------------------- 下单页 */
.order-layout { display: grid; grid-template-columns: 1fr 380px; gap: 22px; align-items: start; padding-top: 24px; }
.stepper { display: flex; align-items: center; gap: 6px; margin-bottom: 18px; font-size: 12.5px; color: var(--ink-3); }
.stepper .s { display: flex; align-items: center; gap: 6px; }
.stepper .n {
  width: 20px; height: 20px; border-radius: 50%; background: #EDF0EC; display: grid; place-items: center;
  font-size: 11px; font-weight: 600; color: var(--ink-3);
}
.stepper .s.on .n { background: var(--brand); color: #fff; }
.stepper .s.on { color: var(--ink); }
.stepper .arrow { color: #D5DAD4; }
.svc-pick { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; }
.svc-pick .it {
  border: 1px solid var(--line); border-radius: 12px; padding: 10px 6px; text-align: center;
  cursor: pointer; background: #fff; transition: all .16s;
}
.svc-pick .it i { font-size: 20px; display: block; margin-bottom: 2px; }
.svc-pick .it span { font-size: 12px; color: var(--ink-2); }
.svc-pick .it:hover { border-color: #CDE4D7; }
.svc-pick .it.on { border-color: var(--brand); background: var(--brand-soft); box-shadow: 0 0 0 3px rgba(47, 156, 107, .1); }
.svc-pick .it.on span { color: var(--brand); font-weight: 600; }

.summary { position: sticky; top: 80px; }
.sum-row { display: flex; align-items: center; justify-content: space-between; font-size: 13.5px; padding: 8px 0; }
.sum-row.total { border-top: 1px dashed var(--line); margin-top: 6px; padding-top: 14px; }
.coupon-chip {
  display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 8px;
  border: 1px dashed #F0C7A8; background: #FFF8F3; font-size: 12.5px; color: #B4522A;
}
.birthday-strip {
  display: flex; align-items: center; gap: 10px; padding: 11px 13px; border-radius: 10px;
  background: linear-gradient(100deg, #FFF3E8, #FFF9F4); border: 1px solid #FBE1CB;
  font-size: 12.5px; color: #A8521F;
}

/* ---------------------------------------------------------------- 订单卡 */
.order-tabs { display: flex; gap: 6px; overflow-x: auto; padding: 4px 0 14px; scrollbar-width: none; }
.order-tabs::-webkit-scrollbar { display: none; }
.ocard {
  background: #fff; border: 1px solid var(--line); border-radius: var(--r); padding: 16px 18px;
  margin-bottom: 10px; transition: box-shadow .18s;
}
.ocard:hover { box-shadow: var(--shadow-sm); }
.ocard .otop { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--ink-3); }
.ocard .otitle { font-size: 15.5px; font-weight: 600; margin: 8px 0 4px; }
.ocard .ostat { font-size: 12.5px; font-weight: 500; }
.osteps { display: flex; align-items: center; gap: 0; margin-top: 14px; }
.osteps .st { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 4px; font-size: 10.5px; color: var(--ink-3); position: relative; }
.osteps .st::before {
  content: ''; position: absolute; top: 7px; left: -50%; width: 100%; height: 2px; background: #EEF1ED;
}
.osteps .st:first-child::before { display: none; }
.osteps .sd { width: 16px; height: 16px; border-radius: 50%; background: #EEF1ED; display: grid; place-items: center; font-size: 8px; color: #fff; position: relative; z-index: 1; }
.osteps .st.done .sd { background: var(--brand); }
.osteps .st.done::before { background: var(--brand); }
.osteps .st.done { color: var(--ink); }
.osteps .st.cur .sd { box-shadow: 0 0 0 4px rgba(47, 156, 107, .16); }

/* ---------------------------------------------------------------- 会员 */
.member-hero {
  border-radius: var(--r-xl); padding: 28px 30px; color: #fff; position: relative; overflow: hidden;
  background: linear-gradient(125deg, #1B3A2D 0%, #22543F 45%, #2F7B5A 100%);
}
.member-hero::after {
  content: ''; position: absolute; right: -60px; top: -80px; width: 300px; height: 300px;
  border-radius: 50%; border: 50px solid rgba(255, 255, 255, .05);
}
.mh-card {
  position: absolute; right: 30px; bottom: 24px; width: 210px; height: 128px; border-radius: 16px;
  background: linear-gradient(135deg, #E9C87B, #B98E3F); padding: 14px 16px; color: #3A2A0C;
  box-shadow: 0 14px 30px rgba(0, 0, 0, .24); display: flex; flex-direction: column; justify-content: space-between;
}
.mh-card .tier { font-size: 13px; font-weight: 700; letter-spacing: 3px; }
.mh-card .no { font-size: 11px; opacity: .7; letter-spacing: 1.5px; font-family: var(--num); }
.mh-card .nm { font-size: 12.5px; }
.progress-bar { height: 6px; border-radius: 99px; background: rgba(255, 255, 255, .16); overflow: hidden; }
.progress-bar i { display: block; height: 100%; border-radius: 99px; background: linear-gradient(90deg, #7FE0B2, #FFE0A3); }

.lv-track { display: flex; gap: 0; margin: 16px 0 6px; }
.lv-track .lv { flex: 1; text-align: center; position: relative; font-size: 11.5px; color: var(--ink-3); }
.lv-track .lv::before {
  content: ''; position: absolute; top: 9px; left: -50%; width: 100%; height: 3px; background: #EDF0EC;
}
.lv-track .lv:first-child::before { display: none; }
.lv-track .lv i {
  width: 21px; height: 21px; border-radius: 50%; background: #EDF0EC; display: inline-grid; place-items: center;
  font-size: 10px; position: relative; z-index: 1; margin-bottom: 5px; color: #fff;
}
.lv-track .lv.on i { background: var(--brand); }
.lv-track .lv.on::before { background: var(--brand); }
.lv-track .lv.on { color: var(--ink); font-weight: 600; }

.benefit-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.benefit {
  border: 1px solid var(--line); border-radius: var(--r); padding: 15px; background: #fff;
  display: flex; gap: 11px; align-items: flex-start; position: relative;
}
.benefit.locked { opacity: .5; }
.benefit .bi {
  width: 38px; height: 38px; border-radius: 10px; background: #FFF5EC; display: grid; place-items: center;
  font-size: 19px; flex: 0 0 auto;
}
.benefit .bt { font-size: 13.5px; font-weight: 600; }
.benefit .bd { font-size: 11.5px; color: var(--ink-3); margin-top: 2px; line-height: 1.5; }
.birthday-card {
  border-radius: var(--r-lg); padding: 22px; position: relative; overflow: hidden;
  background: linear-gradient(115deg, #FFF1DF, #FFE4E9 60%, #F1E6FF);
  border: 1px solid #FADECB;
}
.flow-list { display: flex; gap: 0; margin-top: 14px; }
.flow-list .fl { flex: 1; position: relative; padding-right: 14px; }
.flow-list .fl .n {
  width: 22px; height: 22px; border-radius: 50%; background: #fff; border: 1px solid #F2C9A8;
  color: #C2601F; display: grid; place-items: center; font-size: 11px; font-weight: 600; margin-bottom: 6px;
}
.flow-list .fl b { font-size: 12.5px; display: block; }
.flow-list .fl span { font-size: 11px; color: #97603A; line-height: 1.5; display: block; margin-top: 2px; }

/* ---------------------------------------------------------------- 商家列表 / 详情 */
.merchant-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.mapp { background: #fff; border: 1px solid var(--line); border-radius: var(--r); overflow: hidden; transition: all .2s; }
.mapp:hover { box-shadow: var(--shadow); transform: translateY(-2px); }
.mapp .top { height: 110px; display: flex; align-items: center; justify-content: center; font-size: 44px; position: relative; background: linear-gradient(135deg, #F2F8F3, #E7F0EA); }
.mapp .top .runnable { position: absolute; right: 10px; top: 10px; background: rgba(255, 255, 255, .92); font-size: 10.5px; padding: 2px 8px; border-radius: 99px; color: var(--brand); font-weight: 500; }
.mapp .info { padding: 14px 16px 16px; }
.mapp .dname { font-size: 13px; color: var(--ink-2); }
.mapp .dprice { font-family: var(--num); font-weight: 650; color: var(--accent); font-size: 15px; }
.hscroll { display: flex; gap: 10px; overflow-x: auto; padding-bottom: 6px; scrollbar-width: none; }
.hscroll::-webkit-scrollbar { display: none; }
.dish-tile {
  flex: 0 0 152px; border: 1px solid var(--line); border-radius: var(--r); overflow: hidden;
  background: #fff; cursor: pointer; transition: all .18s;
}
.dish-tile:hover { border-color: #CFE4D8; box-shadow: var(--shadow-sm); }
.dish-tile .dc { height: 96px; display: grid; place-items: center; font-size: 40px; background: #F6F8F5; }
.dish-tile .db { padding: 9px 10px 11px; }
.cat-tabs { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 10px; scrollbar-width: none; }
.cat-tabs::-webkit-scrollbar { display: none; }
.dish-card { display: flex; gap: 12px; padding: 12px 0; border-bottom: 1px solid #F2F4F1; }
.dish-card:last-child { border-bottom: 0; }
.dish-card .dimg { width: 76px; height: 76px; border-radius: 10px; background: #F6F8F5; display: grid; place-items: center; font-size: 32px; flex: 0 0 auto; }
.qty { display: flex; align-items: center; gap: 8px; }
.qty button { width: 24px; height: 24px; border-radius: 50%; border: 1px solid var(--line); display: grid; place-items: center; font-size: 14px; line-height: 1; background: #fff; }
.qty button.plus { background: var(--brand); border-color: var(--brand); color: #fff; }
.qty span { min-width: 16px; text-align: center; font-size: 13px; font-family: var(--num); }

/* ---------------------------------------------------------------- 师傅端 */
.mshell { display: grid; grid-template-columns: 232px 1fr; gap: 20px; padding-top: 22px; align-items: start; }
.mside { background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg); padding: 18px; position: sticky; top: 80px; }
.mside .mnav { display: flex; flex-direction: column; gap: 2px; margin-top: 14px; }
.mside .mnav a, .mside .mnav button {
  display: flex; align-items: center; gap: 9px; padding: 9px 11px; border-radius: 9px;
  font-size: 13.5px; color: var(--ink-2); text-align: left; width: 100%;
}
.mside .mnav .on { background: var(--brand-soft); color: var(--brand); font-weight: 500; }
.mside .mnav a:hover, .mside .mnav button:hover { background: #F5F7F4; }

.kpi-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.kpi {
  background: #fff; border: 1px solid var(--line); border-radius: var(--r); padding: 15px 16px;
}
.kpi .k { font-size: 11.5px; color: var(--ink-3); }
.kpi .v { font-family: var(--num); font-size: 25px; font-weight: 650; margin-top: 4px; letter-spacing: -.6px; }
.kpi .v small { font-size: 12px; font-weight: 500; color: var(--ink-3); margin-left: 3px; font-family: var(--font); }
.kpi .d { font-size: 11px; margin-top: 2px; color: var(--ink-3); }

.hall-card {
  background: #fff; border: 1px solid var(--line); border-radius: var(--r); padding: 15px 16px;
  display: flex; gap: 14px; align-items: center; transition: all .18s;
}
.hall-card:hover { border-color: #CFE4D8; box-shadow: var(--shadow-sm); }
.hall-card .si {
  width: 46px; height: 46px; border-radius: 12px; display: grid; place-items: center; font-size: 22px; flex: 0 0 auto;
}
.claim {
  padding: 6px 14px; border-radius: 99px; background: var(--brand); color: #fff; font-size: 13px;
  font-weight: 500; box-shadow: 0 4px 12px rgba(31, 122, 86, .2);
}
.claim:hover { background: var(--brand-deep); }
.cert-item {
  display: flex; gap: 10px; padding: 12px; border: 1px solid var(--line); border-radius: 10px;
  align-items: center; background: #FCFDFB;
}
.cert-item .ci { width: 34px; height: 34px; border-radius: 9px; background: #EAF6EF; color: var(--brand); display: grid; place-items: center; font-size: 16px; }
.bar-chart { display: flex; align-items: flex-end; gap: 8px; height: 120px; padding-top: 10px; }
.bar-chart .b { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 5px; font-size: 10px; color: var(--ink-3); }
.bar-chart .b i { width: 100%; max-width: 26px; border-radius: 5px 5px 2px 2px; background: linear-gradient(180deg, #5FC79A, #2F9C6B); min-height: 3px; }

/* ---------------------------------------------------------------- 商家入驻 / 师傅入驻 */
.join-hero {
  border-radius: var(--r-xl); padding: 36px 34px; color: #fff; position: relative; overflow: hidden;
  background: radial-gradient(800px 300px at 20% 0%, rgba(255, 255, 255, .16), transparent), linear-gradient(125deg, #2B2416, #4A3A22);
}
.join-hero.blue { background: radial-gradient(800px 300px at 20% 0%, rgba(255, 255, 255, .18), transparent), linear-gradient(125deg, #1B2A4A, #2B4470); }
.join-hero .pillars { display: flex; gap: 28px; margin-top: 22px; flex-wrap: wrap; }
.join-hero .pillars div { font-size: 12px; opacity: .86; }
.join-hero .pillars b { display: block; font-size: 21px; font-family: var(--num); font-weight: 650; opacity: 1; margin-bottom: 2px; }
.form-2col { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }

/* ---------------------------------------------------------------- 客服 */
.cs-widget {
  position: fixed; right: 24px; bottom: 24px; width: 372px; height: 540px; z-index: 800;
  background: #fff; border-radius: var(--r-lg); box-shadow: var(--shadow-lg); border: 1px solid var(--line);
  display: flex; flex-direction: column; overflow: hidden; animation: pop .24s cubic-bezier(.2, .9, .3, 1.1);
}
.cs-head { background: linear-gradient(120deg, var(--brand-deep), var(--brand-2)); color: #fff; padding: 14px 16px; display: flex; align-items: center; gap: 10px; }
.cs-body { flex: 1; overflow-y: auto; padding: 14px; background: #FAFBF9; display: flex; flex-direction: column; gap: 10px; }
.msg { display: flex; gap: 8px; max-width: 88%; }
.msg .b { padding: 9px 12px; border-radius: 12px; font-size: 13.5px; line-height: 1.55; background: #fff; border: 1px solid var(--line); }
.msg.me { margin-left: auto; flex-direction: row-reverse; }
.msg.me .b { background: var(--brand); color: #fff; border-color: var(--brand); }
.msg .a { width: 26px; height: 26px; border-radius: 50%; background: #EAF6EF; display: grid; place-items: center; font-size: 13px; flex: 0 0 auto; }
.cs-foot { padding: 10px; border-top: 1px solid var(--line); display: flex; gap: 8px; }
.cs-quick { display: flex; gap: 6px; padding: 8px 10px 0; flex-wrap: wrap; }
.cs-quick button { font-size: 11.5px; padding: 4px 9px; border-radius: 99px; background: #F4F7F3; color: var(--ink-2); }
.cs-quick button:hover { background: var(--brand-soft); color: var(--brand); }
@media (max-width: 860px) {
  .cs-widget { right: 8px; left: 8px; bottom: 8px; width: auto; height: 78vh; }
}

/* ---------------------------------------------------------------- 响应式 */
@media (max-width: 1080px) {
  .svc-grid { grid-template-columns: repeat(5, 1fr); }
  .merchant-row { grid-template-columns: repeat(2, 1fr); }
  .merchant-grid { grid-template-columns: repeat(2, 1fr); }
  .order-layout { grid-template-columns: 1fr; }
  .summary { position: static; }
  .banner-row { grid-template-columns: 1fr 1fr; }
  .banner-row .banner:first-child { grid-column: span 2; }
  .benefit-grid { grid-template-columns: repeat(2, 1fr); }
  .mshell { grid-template-columns: 1fr; }
  .mside { position: static; }
  .kpi-row { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .hero { padding: 26px 0 0; }
  .hero h1 { font-size: 28px; letter-spacing: -.6px; }
  .hero p.sub { font-size: 13.5px; }
  .svc-grid { grid-template-columns: repeat(4, 1fr); gap: 8px; }
  .svc-cell { padding: 11px 10px; }
  .svc-cell .ic { width: 34px; height: 34px; font-size: 17px; border-radius: 10px; }
  .svc-cell .nm { font-size: 13px; }
  .svc-cell .tg { display: none; }
  .svc-cell .pr { font-size: 10.5px; }
  .svc-pick { grid-template-columns: repeat(5, 1fr); }
  .svc-pick .it i { font-size: 17px; }
  .banner-row { grid-template-columns: 1fr; }
  .banner-row .banner:first-child { grid-column: auto; }
  .merchant-row, .merchant-grid { grid-template-columns: 1fr 1fr; }
  .benefit-grid { grid-template-columns: 1fr; }
  .order-box .ob-main input { font-size: 14px; height: 46px; }
  .order-box .ob-main .go { padding: 0 16px; font-size: 14px; }
  .trust-bar { gap: 14px; font-size: 11px; }
  .trust-bar b { font-size: 14px; }
  .mh-card { display: none; }
  .member-hero { padding: 22px; }
  .flow-list .fl span { display: none; }
  .form-2col { grid-template-columns: 1fr; }
  .modal { max-width: 100%; }
  .cs-widget { border-radius: 16px 16px 0 0; }
  .osteps .st { font-size: 9.5px; }
}
/* ---------------- 商品池 / 选品相关 ---------------- */
.pick-row { display: flex; align-items: center; gap: 9px; padding: 8px 10px; border-radius: 8px; cursor: pointer; }
.pick-row:hover { background: #F7F9F7; }
.pick-row input[type="checkbox"], .check-inline input[type="checkbox"] { width: 15px; height: 15px; accent-color: #2F9C6B; cursor: pointer; }
.check-inline { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; color: var(--ink-2); cursor: pointer; }
.link-b { color: #2F9C6B; font-weight: 600; cursor: pointer; border-bottom: 1px dashed rgba(47, 156, 107, .5); }
.link-b:hover { color: #1F7A56; }
.btn[disabled] { opacity: .45; cursor: not-allowed; }

/* ---------------- 商家选品中心 ---------------- */
.pool-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(196px, 1fr)); gap: 12px; }
.pool-card { border: 1px solid var(--line); border-radius: 12px; padding: 12px; background: #fff; position: relative; transition: box-shadow .2s, border-color .2s; }
.pool-card:hover { box-shadow: 0 6px 18px rgba(20, 40, 30, .07); }
.pool-card.on { border-color: #2F9C6B; background: #FBFEFC; }
.pool-card .pc-top { display: flex; gap: 10px; align-items: flex-start; }
.pool-card .pc-ico { width: 40px; height: 40px; border-radius: 10px; background: #FFF6E9; display: grid; place-items: center; font-size: 22px; flex: 0 0 auto; }
.pool-card .pc-nm { font-size: 13.5px; font-weight: 600; line-height: 1.35; }
.pool-card .pc-meta { font-size: 11.5px; color: var(--ink-3); margin-top: 2px; }
.pool-card .pc-price { display: flex; align-items: baseline; gap: 6px; margin-top: 10px; }
.pool-card .pc-price b { font-family: var(--num); font-size: 17px; color: #C2471B; }
.pool-card .pc-price s { font-size: 11.5px; color: var(--ink-3); }
.pool-card .pc-bar { display: flex; align-items: center; justify-content: space-between; margin-top: 8px; font-size: 11.5px; color: var(--ink-3); }
.pool-card .pc-pick { position: absolute; top: 10px; right: 10px; }
.pool-card .pc-pick input { width: 18px; height: 18px; accent-color: #2F9C6B; cursor: pointer; }
.pool-card .pc-done { position: absolute; top: 9px; right: 9px; font-size: 11px; background: #E8F5EC; color: #1F7A56; padding: 2px 7px; border-radius: 6px; font-weight: 600; }
.pool-bar { position: sticky; bottom: 0; margin-top: 12px; background: rgba(255, 255, 255, .96); backdrop-filter: blur(8px);
  border: 1px solid var(--line); border-radius: 12px; padding: 10px 14px; display: flex; align-items: center; gap: 12px;
  box-shadow: 0 -4px 16px rgba(20, 40, 30, .06); }
.pool-bar .pb-n { font-size: 13px; }
.pool-bar .pb-n b { font-family: var(--num); color: #C2471B; font-size: 16px; }

/* ---------------- 工作台表格 / 芯片 / 分段控件（与后台共用风格） ---------------- */
.tb { width: 100%; border-collapse: collapse; font-size: 13px; }
.tb th { text-align: left; font-weight: 500; color: var(--ink-3); font-size: 11.5px; padding: 9px 10px; background: #FAFBF9; white-space: nowrap; }
.tb th:first-child { border-radius: 8px 0 0 8px; } .tb th:last-child { border-radius: 0 8px 8px 0; }
.tb td { padding: 11px 10px; border-bottom: 1px solid #F2F4F1; vertical-align: middle; }
.tb tr:last-child td { border-bottom: 0; }
.tb tbody tr:hover { background: #FCFDFB; }
.tb .nm { font-weight: 500; }
.tb-wrap { overflow-x: auto; margin: 0 -6px; }
.avs { display: flex; align-items: center; gap: 8px; }
.avs .avatar { width: 30px; height: 30px; font-size: 14px; }
.chip { display: inline-flex; align-items: center; gap: 3px; padding: 1px 8px; border-radius: 5px;
  font-size: 11px; font-weight: 500; background: #F2F4F1; color: var(--ink-2); white-space: nowrap; }
.chip.g { background: #E8F5EC; color: #1F7A56; }
.chip.o { background: #FFF1E6; color: #C2601F; }
.chip.b { background: #EAF0FE; color: #3B5BCC; }
.chip.r { background: #FDECEA; color: #C0392B; }
.seg { display: flex; gap: 4px; background: #F2F4F1; padding: 3px; border-radius: 9px; }
.seg button { padding: 5px 12px; border-radius: 7px; font-size: 12.5px; color: var(--ink-2); border: 0; background: transparent; cursor: pointer; }
.seg button.on { background: #fff; color: var(--ink); box-shadow: var(--shadow-sm, 0 1px 3px rgba(0,0,0,.06)); font-weight: 500; }
.btn[disabled] { opacity: .45; cursor: not-allowed; }
.check-inline { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; color: var(--ink-2); cursor: pointer; }
.pick-row { display: flex; align-items: center; gap: 9px; padding: 8px 10px; border-radius: 8px; cursor: pointer; }
.pick-row:hover { background: #F7F9F7; }

/* ==========================================================================
   商家分类落地页
   ========================================================================== */
.biz-loading { display: grid; gap: 14px; margin-top: 22px; }
.sk-hero, .sk-row { background: linear-gradient(90deg, #F2F4F1 25%, #F8FAF8 37%, #F2F4F1 63%);
  background-size: 400% 100%; animation: skf 1.4s ease infinite; border-radius: 16px; }
.sk-hero { height: 220px; }
.sk-row { height: 120px; }
@keyframes skf { 0% { background-position: 100% 50%; } 100% { background-position: 0 50%; } }

.biz-hero { border-radius: 20px; overflow: hidden; background: #fff; border: 1px solid var(--line); }

/* 分类页广告条 */
.cat-banner-row { margin-top: 16px; display: grid; gap: 10px; }
.cat-banner { display: flex; align-items: center; justify-content: space-between; gap: 12px;
  border-radius: 14px; padding: 14px 18px; color: #fff; text-decoration: none;
  box-shadow: 0 4px 14px rgba(0,0,0,.08); transition: transform .15s ease, box-shadow .15s ease; }
.cat-banner:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0,0,0,.12); }
.cat-banner .cb-txt b { font-size: 15px; font-weight: 600; display: block; text-shadow: 0 1px 2px rgba(0,0,0,.2); }
.cat-banner .cb-txt span { font-size: 12.5px; opacity: .9; margin-top: 3px; display: block; }
.cat-banner .cb-arrow { font-style: normal; font-size: 18px; opacity: .9; flex: none; }

.bh-inner { display: grid; grid-template-columns: 1fr 320px; gap: 0; }
.bh-left { padding: 26px 28px; position: relative;
  background: linear-gradient(150deg, color-mix(in srgb, var(--biz) 10%, #fff), #fff 62%); }
.bh-crumb { font-size: 12px; color: var(--ink-3); margin-bottom: 14px; }
.bh-crumb a { color: var(--ink-3); } .bh-crumb a:hover { color: var(--biz); }
.bh-title { display: flex; gap: 14px; align-items: center; }
.bh-icon { width: 56px; height: 56px; border-radius: 16px; display: grid; place-items: center; font-size: 30px;
  background: color-mix(in srgb, var(--biz) 14%, #fff); }
.bh-title h1 { font-size: 28px; letter-spacing: -.6px; margin: 0; }
.bh-title p { font-size: 13px; color: var(--ink-3); margin-top: 4px; }
.bh-banner { margin-top: 16px; display: inline-block; padding: 7px 14px; border-radius: 9px; font-size: 13px;
  color: color-mix(in srgb, var(--biz) 78%, #000); background: color-mix(in srgb, var(--biz) 10%, #fff);
  border: 1px solid color-mix(in srgb, var(--biz) 22%, #fff); }
.bh-kpi { display: flex; gap: 34px; margin-top: 20px; }
.bh-kpi div { display: flex; flex-direction: column; }
.bh-kpi b { font-family: var(--num); font-size: 22px; color: var(--biz); letter-spacing: -.5px; }
.bh-kpi span { font-size: 11.5px; color: var(--ink-3); margin-top: 2px; }

.bh-side { padding: 22px 24px; background: #FCFDFB; border-left: 1px solid var(--line); }
.bh-panel .bhp-h { font-size: 14.5px; font-weight: 650; margin-bottom: 8px; }
.bh-panel p { font-size: 12.5px; color: var(--ink-3); line-height: 1.75; margin-bottom: 14px; }
.bhp-line { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; padding: 7px 0;
  border-top: 1px dashed var(--line); font-size: 12px; }
.bhp-line span { color: var(--ink-3); flex: 0 0 auto; }
.bhp-line b { font-weight: 550; text-align: right; color: var(--ink-2); }
.bh-panel .btn { margin-top: 14px; }

/* 分类商家卡 */
.biz-grid { display: grid; gap: 12px; }
.biz-card { display: flex; gap: 14px; padding: 16px 18px; border-radius: 14px; background: #fff;
  border: 1px solid var(--line); transition: box-shadow .2s, transform .2s, border-color .2s; }
.biz-card:hover { box-shadow: 0 8px 24px rgba(20, 40, 30, .08); transform: translateY(-1px); border-color: #D6E4DA; }
.bc-logo { width: 46px; height: 46px; border-radius: 13px; display: grid; place-items: center; font-size: 24px;
  background: #F5F7F5; flex: 0 0 auto; }
.bc-nm { font-size: 15px; max-width: 300px; }
.bc-sub { font-size: 12px; color: var(--ink-3); margin-top: 4px; }
.bc-facts { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 9px; font-size: 11.5px; color: var(--ink-2); }
.bc-note { margin-top: 9px; font-size: 11.5px; color: #C2601F; background: #FFF8F0; padding: 6px 10px;
  border-radius: 7px; display: inline-block; }
.bc-dishes { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.dish-chip { font-size: 11px; padding: 2px 8px; border-radius: 6px; background: #F6F8F6; color: var(--ink-2); }
.bc-kv { display: flex; gap: 26px; margin-top: 11px; }
.bc-kv div { display: flex; flex-direction: column; }
.bc-kv b { font-family: var(--num); font-size: 15px; color: var(--ink); letter-spacing: -.3px; }
.bc-kv span { font-size: 10.5px; color: var(--ink-3); margin-top: 1px; }

.chip-accent { background: #FFF1E6; color: #C2601F; }
.chip-blue { background: #EAF2FB; color: #2F7EC4; }
.chip-green { background: #E8F5EC; color: #1F7A56; }
.chip-warm { background: #F7F1E6; color: #7A5A2E; }
.chip-purple { background: #F3EDFD; color: #7048C7; }

/* 其他分类 */
.biz-mini { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 12px; }
.biz-mini-card { display: flex; align-items: center; gap: 11px; padding: 14px 16px; border-radius: 13px;
  background: #fff; border: 1px solid var(--line); transition: .2s; }
.biz-mini-card:hover { border-color: color-mix(in srgb, var(--biz) 40%, #fff);
  background: color-mix(in srgb, var(--biz) 4%, #fff); }
.bm-ico { width: 38px; height: 38px; border-radius: 11px; display: grid; place-items: center; font-size: 20px;
  background: color-mix(in srgb, var(--biz) 12%, #fff); flex: 0 0 auto; }
.biz-mini-card b { font-size: 13.5px; display: block; }
.biz-mini-card i { font-style: normal; font-size: 11px; color: var(--ink-3); }
.bm-arrow { margin-left: auto; color: var(--ink-3); font-size: 13px; }

.biz-rules { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.biz-rules b { font-size: 14.5px; }
.biz-rules p { font-size: 12.5px; color: var(--ink-3); margin-top: 6px; line-height: 1.75; max-width: 720px; }

@media (max-width: 860px) {
  .bh-inner { grid-template-columns: 1fr; }
  .bh-side { border-left: 0; border-top: 1px solid var(--line); }
  .bc-nm { max-width: 150px; }
}

/* ---------------- 入驻分类选择 ---------------- */
.cat-pick { display: grid; grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)); gap: 8px; }
.cp { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; padding: 11px 12px;
  border-radius: 12px; border: 1.5px solid var(--line); background: #fff; cursor: pointer; transition: .18s; text-align: left; }
.cp:hover { border-color: color-mix(in srgb, var(--biz) 45%, #fff); }
.cp.on { border-color: var(--biz); background: color-mix(in srgb, var(--biz) 6%, #fff);
  box-shadow: 0 2px 10px color-mix(in srgb, var(--biz) 16%, transparent); }
.cp-ico { font-size: 21px; }
.cp b { font-size: 12.5px; color: var(--ink); }
.cp i { font-style: normal; font-size: 10.5px; color: var(--ink-3); }
.cp.on b { color: var(--biz); }

/* 所属社区选择：横向小卡，一排能放 2-3 个 */
.comm-pick { display: grid; grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)); gap: 8px; }
.cp-comm { display: flex; align-items: center; gap: 7px; padding: 8px 10px; border-radius: 10px;
  border: 1.5px solid var(--line); background: #fff; cursor: pointer; transition: .18s; text-align: left; min-width: 0; }
.cp-comm:hover { border-color: #7FCFAE; }
.cp-comm.on { border-color: var(--primary); background: #F2FBF6; box-shadow: 0 2px 10px rgba(47, 156, 107, .12); }
.cp-comm span { font-size: 17px; flex: 0 0 auto; }
.cp-comm b { font-size: 12.5px; font-weight: 600; color: var(--ink); white-space: nowrap; overflow: hidden;
  text-overflow: ellipsis; }
.cp-comm i { font-style: normal; font-size: 10px; color: var(--ink-3); white-space: nowrap; overflow: hidden;
  text-overflow: ellipsis; }
.cp-comm.on b { color: var(--primary-d, #1F7A56); }
@media (max-width: 560px) { .comm-pick { grid-template-columns: repeat(2, 1fr); } }
.extra-head { font-size: 13px; font-weight: 650; padding: 9px 12px; background: #F7F9F7; border-radius: 9px;
  margin-bottom: 12px; }
.xsw { width: 16px; height: 16px; accent-color: #2F9C6B; }

/* 商家详情 · 分类经营信息 */
.extra-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 10px 18px; }
.extra-grid .xd { display: flex; flex-direction: column; }
.extra-grid .xd span { font-size: 11px; color: var(--ink-3); }
.extra-grid .xd b { font-size: 12.5px; margin-top: 2px; font-weight: 600; }

/* 首页分类速览条 */
.biz-strip-row { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 4px; margin-bottom: 14px; }
.biz-strip { display: inline-flex; align-items: center; gap: 7px; padding: 8px 14px 8px 9px; border-radius: 11px;
  background: #fff; border: 1px solid var(--line); font-size: 13px; font-weight: 550; white-space: nowrap;
  transition: .18s; }
.biz-strip:hover { border-color: color-mix(in srgb, var(--biz) 45%, #fff); background: color-mix(in srgb, var(--biz) 5%, #fff); }
.biz-strip .bs-ico { width: 26px; height: 26px; border-radius: 8px; display: grid; place-items: center; font-size: 15px;
  background: color-mix(in srgb, var(--biz) 12%, #fff); }
.biz-strip i { font-style: normal; font-size: 11px; color: var(--ink-3); font-weight: 400; }

/* ==========================================================================
   社区定位门禁
   ========================================================================== */
.gate { position: fixed; inset: 0; z-index: 900; display: grid; place-items: center; padding: 24px;
  background: radial-gradient(1200px 600px at 50% -10%, #EAF4EE 0%, #F6F8F5 45%, #F2F4F1 100%);
  animation: gateIn .32s ease; overflow-y: auto; }
.gate.closing { animation: gateOut .24s ease forwards; }
@keyframes gateIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes gateOut { to { opacity: 0; } }

.gate-box { width: 100%; max-width: 560px; background: #fff; border-radius: 22px; padding: 26px 28px 20px;
  box-shadow: 0 24px 70px rgba(20, 50, 35, .14), 0 2px 8px rgba(0, 0, 0, .04); border: 1px solid #EDF1EC; }
.gate-brand { display: flex; align-items: center; gap: 10px; }
.gb-mark { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; font-size: 18px;
  background: linear-gradient(140deg, #2F9C6B, #1F7A56); }
.gate-brand b { font-size: 14px; display: block; }
.gate-brand i { font-style: normal; font-size: 11px; color: var(--ink-3); }

.gate-hero { text-align: center; padding: 26px 0 18px; }
.gh-pin { font-size: 40px; margin-bottom: 8px; animation: pinBob 2.2s ease-in-out infinite; }
@keyframes pinBob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
.gate-hero h2 { font-size: 22px; letter-spacing: -.4px; }
.gate-hero p { font-size: 12.5px; color: var(--ink-3); line-height: 1.85; margin-top: 8px; }

.gate-actions { display: grid; gap: 9px; }
.gate-actions .btn-lg { height: 46px; }
.g-arrow { margin-left: 4px; }
.gate-tip { font-size: 11.5px; color: var(--ink-3); text-align: center; margin-top: 8px; min-height: 16px; line-height: 1.6; }
.gate-tip.err { color: #C0392B; }
.gate-tip.ok { color: #1F7A56; }

.gate-manual { display: none; margin-top: 16px; border-top: 1px solid var(--line); padding-top: 16px; }
.gate.show-manual .gate-manual { display: block; }
.gate.show-manual .gate-actions { opacity: .55; }
.gm-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.gm-head b { font-size: 13.5px; }
.gm-search .input { height: 32px; font-size: 12.5px; width: 190px; }
.gm-list { max-height: 300px; overflow-y: auto; display: grid; gap: 6px; padding-right: 2px; }
.gm-item { display: flex; align-items: center; gap: 11px; width: 100%; padding: 11px 13px; border-radius: 11px;
  border: 1.5px solid var(--line); background: #fff; cursor: pointer; transition: .16s; }
.gm-item:hover { border-color: #9FD3B8; background: #FAFDFB; }
.gm-item.on { border-color: var(--brand); background: #F5FBF7; }
.gm-item.off { opacity: .55; }
.gm-ico { width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; font-size: 19px;
  background: #F2F5F2; flex: 0 0 auto; }
.gm-nm { font-size: 13.5px; font-weight: 600; display: flex; align-items: center; gap: 6px; }
.gm-hot { font-style: normal; font-size: 10px; padding: 1px 6px; border-radius: 5px; background: #FFF1E6; color: #C2601F; }
.gm-soon { font-style: normal; font-size: 10px; padding: 1px 6px; border-radius: 5px; background: #F2F4F1; color: var(--ink-3); }
.gm-addr { display: block; font-size: 11px; color: var(--ink-3); margin-top: 2px; }
.gm-side { display: flex; flex-direction: column; align-items: flex-end; flex: 0 0 auto; }
.gm-side b { font-family: var(--num); font-size: 15px; color: var(--brand); }
.gm-side i { font-style: normal; font-size: 10px; color: var(--ink-3); }
.gm-empty { text-align: center; font-size: 12px; color: var(--ink-3); padding: 24px 0; }

.gm-result { margin-top: 4px; }
.gr-card { display: flex; gap: 13px; padding: 15px 16px; border-radius: 14px; background: #F5FBF7;
  border: 1.5px solid #CBEBDA; }
.gr-logo { width: 46px; height: 46px; border-radius: 13px; display: grid; place-items: center; font-size: 24px;
  background: #fff; flex: 0 0 auto; }
.gr-kpi { display: flex; gap: 16px; margin-top: 9px; font-size: 11.5px; color: var(--ink-3); }
.gr-kpi b { font-family: var(--num); color: var(--ink); }
.gr-actions { display: flex; gap: 8px; margin-top: 12px; }
.gr-actions .btn-primary { flex: 1; background: #C2471B; border-color: #C2471B; }

.gate-foot { display: flex; justify-content: space-between; align-items: center; margin-top: 16px;
  padding-top: 12px; border-top: 1px solid var(--line); font-size: 10.5px; color: var(--ink-3); }
.gate-foot a { color: var(--brand); }

/* 顶栏社区胶囊 */
.cc-chip { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px 5px 6px; border-radius: 999px;
  background: #F4F7F4; border: 1px solid var(--line); cursor: pointer; transition: .16s; max-width: 190px; }
.cc-chip:hover { background: #EBF3EE; border-color: #CFE5D8; }
.cc-ico { width: 22px; height: 22px; border-radius: 7px; display: grid; place-items: center; font-size: 12px; background: #fff; }
.cc-nm { font-size: 12.5px; font-weight: 550; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cc-ar { font-size: 9px; color: var(--ink-3); }

@media (max-width: 640px) {
  .gate { padding: 0; align-items: stretch; }
  .gate-box { border-radius: 0; min-height: 100%; box-shadow: none; }
  .gm-search .input { width: 130px; }
  .cc-chip { max-width: 130px; }
}

/* ==========================================================================
   邀请有奖（/invite）
   ========================================================================== */
.inv-wrap { max-width: var(--max); margin: 0 auto; padding: 22px 20px 56px; }

/* --- Hero --- */
.inv-hero { position: relative; border-radius: var(--r-xl); overflow: hidden; color: #fff;
  background: linear-gradient(135deg, #14523A 0%, #1F7A56 46%, #3AA97A 100%);
  box-shadow: 0 18px 44px rgba(20, 82, 58, .22); }
.ih-glow { position: absolute; border-radius: 50%; filter: blur(2px); pointer-events: none; }
.ih-glow.a { width: 320px; height: 320px; right: -90px; top: -140px;
  background: radial-gradient(circle, rgba(255, 214, 130, .38), transparent 68%); }
.ih-glow.b { width: 260px; height: 260px; left: -80px; bottom: -130px;
  background: radial-gradient(circle, rgba(120, 230, 190, .34), transparent 70%); }
.ih-inner { position: relative; z-index: 2; padding: 26px 28px 24px; }
.ih-top { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.ih-badge { display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px; border-radius: 999px;
  font-size: 12.5px; font-weight: 600; background: rgba(255, 255, 255, .16);
  border: 1px solid rgba(255, 255, 255, .22); backdrop-filter: blur(6px); }
.ih-sub { font-size: 12px; opacity: .8; }
.ih-title { font-size: 30px; line-height: 1.28; font-weight: 700; margin: 14px 0 18px; letter-spacing: -.5px; }
.ih-title span { color: #FFD782; }

.ih-code-box { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; padding: 13px 16px;
  border-radius: 16px; background: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .18); }
.ih-code-l { display: flex; flex-direction: column; gap: 3px; }
.ih-code-l .xs { font-size: 11px; opacity: .72; }
.ih-code { font-family: var(--num); font-size: 24px; letter-spacing: 4px; font-weight: 700; color: #FFE3A8; }
.ih-code-r { display: flex; gap: 9px; margin-left: auto; }
.ih-btn { height: 36px; padding: 0 16px; border-radius: 10px; border: 0; cursor: pointer;
  font-family: var(--font); font-size: 13px; font-weight: 600; color: #14523A; background: #fff;
  transition: .16s; white-space: nowrap; }
.ih-btn:hover { transform: translateY(-1px); box-shadow: 0 6px 16px rgba(0, 0, 0, .16); }
.ih-btn.ghost { background: rgba(255, 255, 255, .18); color: #fff; border: 1px solid rgba(255, 255, 255, .38); }
.ih-btn.full { width: 100%; height: 44px; font-size: 15px; }

.ih-kpi { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 16px; }
.ih-kpi .ik { padding: 11px 14px; border-radius: 13px; background: rgba(255, 255, 255, .1);
  border: 1px solid rgba(255, 255, 255, .14); }
.ih-kpi .ik b { display: block; font-family: var(--num); font-size: 25px; line-height: 1.15; }
.ih-kpi .ik span { font-size: 11px; opacity: .78; }

/* --- 区块 --- */
.inv-sec { margin-top: 26px; }
.inv-sec-head { display: flex; align-items: center; gap: 12px; margin-bottom: 11px; flex-wrap: wrap; }
.inv-sec-head h2 { font-size: 16.5px; font-weight: 650; margin: 0; }
.inv-sec-head h2 small { font-size: 12px; font-weight: 400; color: var(--ink-3); margin-left: 7px; }
.inv-next { margin-left: auto; font-size: 12px; color: var(--brand); background: var(--brand-soft);
  padding: 4px 11px; border-radius: 999px; }

.inv-track-card { padding: 20px 20px 16px; }
.inv-bar { height: 7px; border-radius: 999px; background: #EDF2EE; overflow: hidden; margin-bottom: 18px; }
.inv-bar i { display: block; height: 100%; border-radius: 999px;
  background: linear-gradient(90deg, #2F9C6B, #7DD3AE); transition: width .5s cubic-bezier(.2, .8, .3, 1); }

.inv-track { display: flex; gap: 10px; overflow-x: auto; padding-bottom: 4px; scrollbar-width: thin; }
.inv-node { position: relative; flex: 1 0 132px; min-width: 132px; text-align: center;
  padding: 14px 10px 12px; border-radius: 14px; background: #FAFBF9; border: 1.5px solid #EDF0EC; }
.inv-node.done { background: #F1FAF4; border-color: #BFE6D2; }
.inv-node.ready { background: #FFF8EE; border-color: #FBD9AE; }
.in-dot { width: 40px; height: 40px; border-radius: 50%; margin: 0 auto 8px; display: grid; place-items: center;
  font-size: 19px; background: #fff; border: 1.5px solid #E7ECE7; }
.inv-node.done .in-dot { background: #2F9C6B; border-color: #2F9C6B; color: #fff; font-size: 18px; }
.inv-node.ready .in-dot { border-color: #F5B971; box-shadow: 0 0 0 4px #FDF0DF; }
.in-th { font-family: var(--num); font-size: 13px; color: var(--ink-3); }
.inv-node.done .in-th, .inv-node.ready .in-th { color: var(--ink); font-weight: 600; }
.in-gift { font-size: 13px; font-weight: 650; margin-top: 3px; }
.in-nm { font-size: 11px; color: var(--ink-3); margin-top: 2px; }
.in-tag { display: inline-block; margin-top: 7px; font-size: 10.5px; padding: 2px 8px; border-radius: 999px; }
.in-tag.ok { background: #2F9C6B; color: #fff; }
.in-tag.now { background: #F5733A; color: #fff; }

/* --- 我的奖品 --- */
.inv-tabs { margin-left: auto; display: flex; gap: 4px; background: #F1F4F0; padding: 3px; border-radius: 10px; }
.inv-tabs button { border: 0; background: transparent; cursor: pointer; font-family: var(--font);
  font-size: 12.5px; color: var(--ink-2); padding: 5px 13px; border-radius: 8px; transition: .15s; }
.inv-tabs button.on { background: #fff; color: var(--brand); font-weight: 600; box-shadow: var(--shadow-sm); }

.rw-item { display: flex; gap: 13px; padding: 13px 0; border-bottom: 1px solid #F2F4F1; }
.rw-item:last-child { border-bottom: 0; }
.rw-ico { width: 46px; height: 46px; border-radius: 13px; display: grid; place-items: center;
  font-size: 22px; flex: 0 0 auto; background: var(--brand-soft); }
.rw-ico.g { background: #FFF3E6; }
.rw-st { font-size: 12px; font-weight: 600; }
.rw-ship { margin-top: 5px; font-size: 11.5px; color: var(--info); background: #F0F4FF;
  padding: 4px 9px; border-radius: 7px; display: inline-flex; align-items: center; gap: 7px; }
.rw-cp { border: 0; background: #fff; color: var(--info); cursor: pointer; font-size: 11px;
  padding: 1px 7px; border-radius: 5px; font-family: var(--font); }

/* --- 邀请记录 --- */
.inv-row { display: flex; gap: 12px; align-items: center; padding: 11px 0; border-bottom: 1px solid #F2F4F1; }
.inv-row:last-child { border-bottom: 0; }
.ir-av { width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center;
  font-size: 19px; background: #F4F7F4; flex: 0 0 auto; }
.ir-st { font-size: 11.5px; font-weight: 600; }

.inv-empty { text-align: center; color: var(--ink-3); font-size: 12.5px; padding: 26px 0; }

/* --- 规则折叠 --- */
.inv-rules { padding: 0 !important; overflow: hidden; }
.inv-rules-head { display: flex; align-items: center; justify-content: space-between; cursor: pointer;
  padding: 15px 20px; font-size: 14px; }
.inv-rules-head .ar { color: var(--ink-3); transition: .2s; font-style: normal; }
.inv-rules.open .inv-rules-head .ar { transform: rotate(180deg); }
.inv-rules-body { display: none; padding: 0 20px 16px; }
.inv-rules.open .inv-rules-body { display: block; }
.rule-line { display: flex; gap: 9px; align-items: flex-start; padding: 6px 0; font-size: 12.5px;
  color: var(--ink-2); line-height: 1.6; }
.rule-line i { width: 17px; height: 17px; border-radius: 50%; background: var(--brand-soft); color: var(--brand);
  font-style: normal; font-size: 10.5px; display: grid; place-items: center; flex: 0 0 auto; margin-top: 2px; }

.inv-foot { text-align: center; margin-top: 26px; font-size: 11px; line-height: 1.7; }

/* --- 会员页入口卡 --- */
.inv-entry { display: flex; align-items: center; gap: 14px; padding: 16px 18px; border-radius: var(--r);
  background: linear-gradient(120deg, #14523A, #2F9C6B 60%, #48BC8B); color: #fff;
  text-decoration: none; box-shadow: 0 10px 26px rgba(20, 82, 58, .18); transition: .18s; }
.inv-entry:hover { transform: translateY(-2px); box-shadow: 0 14px 32px rgba(20, 82, 58, .24); }
.ie-ico { width: 46px; height: 46px; border-radius: 14px; display: grid; place-items: center; font-size: 24px;
  background: rgba(255, 255, 255, .18); flex: 0 0 auto; }
.ie-txt { flex: 1 1 auto; min-width: 0; }
.ie-txt b { font-size: 15.5px; display: block; }
.ie-txt i { font-style: normal; font-size: 11.5px; opacity: .82; display: block; margin-top: 2px; }
.ie-meta { display: flex; gap: 14px; margin-top: 7px; font-size: 11.5px; opacity: .9; flex-wrap: wrap; }
.ie-meta b { font-family: var(--num); font-size: 13px; display: inline; }
.ie-dot { background: #FFD782; color: #6B4A00; padding: 1px 8px; border-radius: 999px; font-weight: 600; }
.ie-right { text-align: right; flex: 0 0 auto; }
.ie-code { display: block; font-family: var(--num); font-size: 15px; letter-spacing: 2px; color: #FFE3A8; }
.ie-go { display: block; font-size: 11.5px; opacity: .85; margin-top: 3px; }

/* --- 落地预览层 --- */
.inv-land { position: fixed; inset: 0; z-index: 900; display: grid; place-items: center;
  background: rgba(12, 28, 21, .55); backdrop-filter: blur(4px); padding: 20px; }
.inv-land[hidden] { display: none; }   /* 防止 display:grid 覆盖 hidden 导致透明层拦截全页点击 */
.il-card { width: 100%; max-width: 380px; background: #fff; border-radius: 22px; padding: 26px 24px 20px;
  text-align: center; box-shadow: var(--shadow-lg); animation: ilUp .32s cubic-bezier(.2, .9, .3, 1); }
@keyframes ilUp { from { opacity: 0; transform: translateY(18px) scale(.97); } }
.il-av { width: 58px; height: 58px; border-radius: 18px; margin: 0 auto 12px; display: grid; place-items: center;
  font-size: 30px; background: var(--brand-soft); }
.il-card h3 { font-size: 17px; margin: 0 0 6px; }
.il-card p { margin: 0; line-height: 1.6; }
.il-gifts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 16px 0 18px; }
.il-g { padding: 10px 4px; border-radius: 12px; background: #FAFBF9; border: 1px solid #EDF0EC;
  font-size: 20px; display: flex; flex-direction: column; align-items: center; gap: 3px; }
.il-g span { font-size: 10.5px; color: var(--ink-3); }
.il-skip { margin-top: 10px; border: 0; background: transparent; color: var(--ink-3);
  font-size: 12px; cursor: pointer; font-family: var(--font); }

@media (max-width: 860px) {
  .inv-wrap { padding: 16px 14px 40px; }
  .ih-title { font-size: 25px; }
  .ih-inner { padding: 22px 20px 20px; }
  .inv-node { flex: 0 0 118px; min-width: 118px; }
}

@media (max-width: 640px) {
  .ih-title { font-size: 22px; margin: 12px 0 15px; }
  .ih-code { font-size: 21px; letter-spacing: 3px; }
  .ih-code-box { padding: 12px 13px; gap: 10px; }
  .ih-code-r { width: 100%; margin-left: 0; }
  .ih-code-r .ih-btn { flex: 1; }
  .ih-kpi .ik { padding: 9px 10px; }
  .ih-kpi .ik b { font-size: 21px; }
  .ih-kpi .ik span { font-size: 10px; line-height: 1.35; display: block; }
  .inv-sec-head { gap: 8px; }
  .inv-next { margin-left: 0; width: 100%; text-align: center; }
  .inv-sec-head h2 small { display: block; margin: 3px 0 0; }
  .inv-tabs { margin-left: 0; width: 100%; }
  .inv-tabs button { flex: 1; }
  .inv-track-card { padding: 16px 14px 12px; }
  .inv-node { flex: 0 0 108px; min-width: 108px; padding: 12px 8px 10px; }
  .in-gift { font-size: 12.5px; }
  .inv-entry { padding: 14px 15px; gap: 11px; }
  .ie-right { display: none; }
  .ie-meta { gap: 10px; }
}

/* ==========================================================================
   物业费账户 /property
   ========================================================================== */
.pf-wrap { max-width: var(--max); margin: 0 auto; padding: 24px 24px 56px; }

.pf-hero { position: relative; overflow: hidden; border-radius: var(--r-xl);
  background: linear-gradient(135deg, #14523A 0%, #1F7A56 46%, #2F9C6B 100%);
  box-shadow: var(--shadow-lg); }
.pf-glow { position: absolute; border-radius: 50%; filter: blur(60px); pointer-events: none; }
.pf-glow.a { width: 340px; height: 340px; background: rgba(255, 214, 102, .26); top: -140px; right: -80px; }
.pf-glow.b { width: 260px; height: 260px; background: rgba(120, 255, 200, .18); bottom: -120px; left: -60px; }
.pf-inner { position: relative; padding: 26px 28px 24px; color: #fff; }

.pf-top { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.pf-badge { font-size: 12px; font-weight: 600; padding: 5px 12px; border-radius: 999px;
  background: rgba(255, 255, 255, .16); backdrop-filter: blur(6px); }
.pf-sub { font-size: 12.5px; color: rgba(255, 255, 255, .78); }
.pf-sub b { color: #FFD666; }

.pf-bal { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin: 20px 0 4px; }
.pf-bal-l .xs { color: rgba(255, 255, 255, .72); font-size: 12.5px; }
.pf-num { display: flex; align-items: baseline; gap: 4px; margin-top: 6px; }
.pf-num i { font-style: normal; font-size: 22px; font-weight: 600; opacity: .85; }
.pf-num b { font-family: var(--num); font-size: 46px; font-weight: 700; letter-spacing: -.5px; line-height: 1; }

.pf-chip { display: inline-flex; align-items: center; gap: 5px; font-size: 12.5px; font-weight: 600;
  padding: 6px 13px; border-radius: 999px; background: rgba(255, 255, 255, .18); white-space: nowrap; }
.pf-chip.ok { background: #FFD666; color: #4A3200; }

.pf-prog { margin-top: 18px; }
.pf-bar { height: 9px; border-radius: 999px; background: rgba(255, 255, 255, .18); overflow: hidden; }
.pf-bar i { display: block; height: 100%; border-radius: 999px;
  background: linear-gradient(90deg, #FFD666, #FFB020); transition: width .5s ease; }
.pf-prog-tip { margin-top: 8px; font-size: 12.5px; color: rgba(255, 255, 255, .82); }
.pf-prog-tip b { color: #FFD666; }

.pf-kpi { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin-top: 20px;
  background: rgba(255, 255, 255, .14); border-radius: var(--r); overflow: hidden; }
.pf-kpi .ik { padding: 13px 14px; background: rgba(255, 255, 255, .07); text-align: center; }
.pf-kpi .ik b { display: block; font-family: var(--num); font-size: 19px; font-weight: 700; }
.pf-kpi .ik span { font-size: 11.5px; color: rgba(255, 255, 255, .7); }

.pf-sec { margin-top: 26px; }
.pf-sec-head { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.pf-sec-head h2 { font-size: 16.5px; font-weight: 650; letter-spacing: -.2px; }
.pf-sec-head h2 small { font-size: 12px; font-weight: 400; color: var(--ink-3); margin-left: 8px; }
.pf-lock, .pf-more { margin-left: auto; font-size: 12.5px; }
.pf-more { color: var(--brand); text-decoration: none; }
.pf-lock .pf-chip { background: var(--bg); color: var(--ink-2); }
.pf-lock .pf-chip.ok { background: var(--brand-soft); color: var(--brand); }

.pf-rate { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 16px; }
.pf-rate .tag b { font-family: var(--num); }

.pf-plans { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.pf-plan { position: relative; padding: 15px 14px 13px; border-radius: var(--r); cursor: pointer;
  border: 1.5px solid var(--line); background: var(--bg-2); transition: all .18s ease; }
.pf-plan:hover { border-color: var(--brand-2); transform: translateY(-2px); box-shadow: var(--shadow); }
.pf-plan.on { border-color: var(--brand); background: var(--brand-soft); box-shadow: 0 0 0 3px rgba(31, 122, 86, .1); }
.pf-plan.dis { opacity: .52; }
.pf-plan-h { display: flex; align-items: center; gap: 6px; }
.pf-plan-h b { font-size: 13.5px; font-weight: 600; }
.pf-tag { font-style: normal; font-size: 10px; font-weight: 600; padding: 2px 7px; border-radius: 999px;
  background: var(--accent); color: #fff; }
.pf-tag.soft { background: var(--accent-soft); color: var(--accent); }
.pf-plan-a { font-family: var(--num); font-size: 24px; font-weight: 700; margin: 9px 0 3px; letter-spacing: -.3px; }
.pf-plan.on .pf-plan-a { color: var(--brand); }
.pf-plan-s { font-size: 11.5px; color: var(--ink-3); }

.pf-paybar { display: flex; align-items: center; justify-content: space-between; gap: 16px;
  margin-top: 18px; padding-top: 16px; border-top: 1px dashed var(--line); }
.pf-paybar-l .money { font-size: 22px; font-weight: 700; color: var(--brand); font-family: var(--num); }
.pf-paybar .btn { min-width: 140px; }
.pf-paybar .btn[disabled] { opacity: .5; cursor: not-allowed; }
.pf-note { margin-top: 10px; font-size: 12px; color: var(--ink-3); }

.pf-tabs { margin-left: auto; display: flex; gap: 4px; background: var(--bg); padding: 3px; border-radius: 999px; }
.pf-tabs button { border: 0; background: none; font-size: 12.5px; color: var(--ink-2); padding: 6px 14px;
  border-radius: 999px; cursor: pointer; font-family: var(--font); }
.pf-tabs button.on { background: var(--bg-2); color: var(--brand); font-weight: 600; box-shadow: var(--shadow-sm); }

.pf-list { display: flex; flex-direction: column; }
.pf-row { display: flex; align-items: center; gap: 12px; padding: 12px 2px; border-bottom: 1px solid var(--line); }
.pf-row:last-child { border-bottom: 0; }
.pf-ic { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center;
  font-size: 15px; font-weight: 700; flex: 0 0 34px; }
.pf-ic.in { background: var(--brand-soft); color: var(--brand); }
.pf-ic.out { background: var(--accent-soft); color: var(--accent); }
.pf-row-t { font-size: 13.5px; font-weight: 550; display: flex; align-items: center; gap: 7px; }
.pf-no { font-size: 10.5px; font-weight: 400; color: var(--ink-3); background: var(--bg);
  padding: 1px 6px; border-radius: 4px; font-family: var(--num); }
.pf-row-r { text-align: right; }
.pf-row-r b { font-family: var(--num); font-size: 15px; display: block; }
.pf-row-r b.in, .pf-ord-r b.in { color: var(--brand); }
.pf-row-r b.out { color: var(--accent); }

.pf-orders { display: flex; flex-direction: column; }
.pf-ord { display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 11px 2px; border-bottom: 1px solid var(--line); }
.pf-ord:last-child { border-bottom: 0; }
.pf-ord-l { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.pf-ord-l b { font-size: 13.5px; font-weight: 550; }
.pf-ord-r { text-align: right; display: flex; flex-direction: column; gap: 2px; flex: 0 0 auto; }
.pf-ord-r b { font-family: var(--num); font-size: 15px; }

.pf-tip h3 { font-size: 14px; font-weight: 600; margin-bottom: 9px; }
.pf-tip ul { margin: 0; padding-left: 18px; }
.pf-tip li { font-size: 12.5px; color: var(--ink-2); line-height: 1.85; }
.pf-tip li b { color: var(--brand); }

.empty-sm { text-align: center; color: var(--ink-3); font-size: 12.5px; padding: 22px 0; }

.cfbox { padding: 4px 2px 2px; }
.cfbox-t { font-size: 13px; color: var(--ink-3); margin-bottom: 6px; }
.cfbox-x { font-size: 14.5px; line-height: 1.7; color: var(--ink); }

@media (max-width: 860px) {
  .pf-wrap { padding: 16px 14px 40px; }
  .pf-inner { padding: 22px 20px 20px; }
  .pf-num b { font-size: 38px; }
  .pf-plans { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 640px) {
  .pf-inner { padding: 20px 17px 18px; }
  .pf-num b { font-size: 34px; }
  .pf-bal { flex-direction: column; align-items: flex-start; gap: 10px; }
  .pf-kpi .ik { padding: 10px 8px; }
  .pf-kpi .ik b { font-size: 15px; }
  .pf-kpi .ik span { font-size: 10.5px; }
  .pf-plans { gap: 9px; }
  .pf-plan { padding: 12px 11px 11px; }
  .pf-plan-a { font-size: 20px; }
  .pf-paybar { flex-direction: column; align-items: stretch; gap: 11px; }
  .pf-paybar .btn { width: 100%; }
  .pf-sec-head { flex-wrap: wrap; gap: 8px; }
  .pf-sec-head h2 small { display: block; margin: 3px 0 0; }
  .pf-tabs { margin-left: 0; width: 100%; }
  .pf-tabs button { flex: 1; }
  .pf-lock { margin-left: 0; }
}

/* 会员中心：物业费入口卡 */
.pf-entry { display: flex; align-items: center; gap: 14px; padding: 16px 18px; border-radius: var(--r-lg);
  background: linear-gradient(120deg, #FFFFFF 0%, #F4FAF7 100%);
  border: 1px solid var(--line); box-shadow: var(--shadow-sm); text-decoration: none;
  transition: all .2s ease; }
.pf-entry:hover { box-shadow: var(--shadow); transform: translateY(-2px); border-color: var(--brand-2); }
.pf-entry.reached { background: linear-gradient(120deg, #FFFDF3 0%, #F4FAF7 100%); border-color: #F0DCA0; }
.pe-ico { width: 46px; height: 46px; flex: 0 0 46px; border-radius: 14px; display: grid; place-items: center;
  font-size: 22px; background: var(--brand-soft); }
.pe-txt { flex: 1; min-width: 0; }
.pe-txt b { font-size: 14.5px; font-weight: 650; color: var(--ink); display: flex; align-items: center; gap: 7px; }
.pe-txt b em { font-style: normal; font-size: 10.5px; font-weight: 600; padding: 2px 7px; border-radius: 999px;
  background: var(--brand); color: #fff; }
.pf-entry.reached .pe-txt b em { background: var(--accent); }
.pe-txt i { display: block; font-style: normal; font-size: 12px; color: var(--ink-3); margin-top: 3px; }
.pe-bar { height: 5px; border-radius: 999px; background: var(--line); overflow: hidden; margin: 8px 0 6px; }
.pe-bar span { display: block; height: 100%; border-radius: 999px;
  background: linear-gradient(90deg, var(--brand-2), var(--brand)); }
.pe-meta { display: flex; gap: 14px; font-size: 11.5px; color: var(--ink-3); flex-wrap: wrap; }
.pe-meta b { color: var(--ink-2); font-family: var(--num); }
.pe-right { text-align: right; flex: 0 0 auto; }
.pe-bal { font-family: var(--num); font-size: 20px; font-weight: 700; color: var(--brand); }
.pe-go { font-size: 11.5px; color: var(--brand); }

@media (max-width: 640px) {
  .pf-entry { padding: 14px 14px; gap: 11px; }
  .pe-ico { width: 40px; height: 40px; flex: 0 0 40px; font-size: 19px; border-radius: 12px; }
  .pe-bal { font-size: 17px; }
  .pe-go { display: none; }
  .pe-txt b { font-size: 13.5px; }
}

/* ==========================================================================
   师傅端 · 接单资格卡与订阅
   ========================================================================== */
.sub-card { display: flex; align-items: center; justify-content: space-between; gap: 10px;
  margin-top: 13px; padding: 11px 13px; border-radius: var(--r); text-decoration: none;
  border: 1px solid var(--line); transition: all .18s ease; }
.sub-card:hover { box-shadow: var(--shadow-sm); transform: translateY(-1px); }
.sub-card .sc-l { display: flex; align-items: center; gap: 9px; min-width: 0; }
.sub-card .sc-ic { width: 28px; height: 28px; flex: 0 0 28px; border-radius: 9px; display: grid; place-items: center;
  font-size: 13px; font-weight: 700; }
.sub-card b { font-size: 13px; font-weight: 600; display: block; }
.sub-card i { font-style: normal; font-size: 11px; color: var(--ink-3); display: block; margin-top: 1px; }
.sub-card .sc-go { font-size: 11.5px; font-weight: 600; flex: 0 0 auto; }
.sub-card.ok { background: var(--brand-soft); border-color: #CBE5D6; }
.sub-card.ok .sc-ic { background: var(--brand); color: #fff; }
.sub-card.ok .sc-go { color: var(--brand); }
.sub-card.warn { background: #FFF8EC; border-color: #F0DCA0; }
.sub-card.warn .sc-ic { background: var(--warn); color: #fff; }
.sub-card.warn .sc-go { color: var(--warn); }
.sub-card.off { background: #FDF3F0; border-color: #F2CFC5; }
.sub-card.off .sc-ic { background: var(--accent); color: #fff; }
.sub-card.off .sc-go { color: var(--accent); }

.hall-warn { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: 12.5px;
  padding: 10px 14px; border-radius: var(--r); background: #FFF8EC; border: 1px solid #F0DCA0;
  color: #8A5B00; margin-bottom: 12px; }
.hall-warn a { color: var(--warn); font-weight: 600; }

.sub-state { display: flex; align-items: center; justify-content: space-between; gap: 14px;
  padding: 16px 18px; border-radius: var(--r-lg); color: #fff; }
.sub-state.ok { background: linear-gradient(120deg, #14523A, #2F9C6B); }
.sub-state.off { background: linear-gradient(120deg, #8A4A3A, #C07040); }
.sub-state .ss-l { display: flex; align-items: center; gap: 12px; }
.sub-state .ss-ic { width: 38px; height: 38px; flex: 0 0 38px; border-radius: 12px; display: grid; place-items: center;
  font-size: 18px; font-weight: 700; background: rgba(255, 255, 255, .18); }
.sub-state b { font-size: 15.5px; font-weight: 650; display: block; }
.sub-state i { font-style: normal; font-size: 12px; color: rgba(255, 255, 255, .8); display: block; margin-top: 2px; }
.sub-state .ss-r { text-align: right; }
.sub-state .ss-days { font-family: var(--num); font-size: 30px; font-weight: 700; line-height: 1; }
.sub-state .ss-days small { font-size: 12px; font-weight: 500; margin-left: 2px; }
.sub-state .ss-r .xs { color: rgba(255, 255, 255, .7); }

.sub-curnow { margin-top: 10px; font-size: 12.5px; color: var(--ink-2); padding: 10px 14px;
  border-radius: var(--r); background: var(--brand-soft); }
.sub-curnow b { color: var(--brand); }

.sub-plans { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; margin-top: 14px; }
.sub-plan { position: relative; padding: 18px 13px 14px; border-radius: var(--r); text-align: center;
  border: 1.5px solid var(--line); background: var(--bg-2); transition: all .18s ease; }
.sub-plan:hover { border-color: var(--brand-2); transform: translateY(-2px); box-shadow: var(--shadow); }
.sub-plan.hot { border-color: var(--brand); box-shadow: 0 0 0 3px rgba(31, 122, 86, .08); }
.sp-badge { position: absolute; top: -9px; left: 50%; transform: translateX(-50%); font-style: normal;
  font-size: 10px; font-weight: 600; padding: 2px 9px; border-radius: 999px; background: var(--accent); color: #fff; white-space: nowrap; }
.sp-name { font-size: 13px; font-weight: 600; }
.sp-price { font-family: var(--num); font-size: 25px; font-weight: 700; margin: 9px 0 2px; letter-spacing: -.3px; }
.sub-plan.hot .sp-price { color: var(--brand); }
.sp-origin { font-size: 11px; color: var(--ink-3); text-decoration: line-through; min-height: 15px; }
.sp-tag { display: inline-block; font-size: 10px; font-weight: 600; padding: 2px 8px; border-radius: 999px;
  background: var(--accent-soft); color: var(--accent); margin-top: 6px; }
.sp-descr { font-size: 11px; color: var(--ink-3); margin: 8px 0 11px; min-height: 30px; line-height: 1.5; }
.sp-btn { width: 100%; padding: 8px 0; font-size: 12.5px; }

.sub-his { display: flex; align-items: center; gap: 11px; padding: 10px 2px; border-bottom: 1px solid var(--line); }
.sub-his:last-child { border-bottom: 0; }
.sh-ic { font-size: 12px; flex: 0 0 auto; }

@media (max-width: 960px) {
  .sub-plans { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 640px) {
  .sub-plans { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .sub-state { flex-direction: row; padding: 15px 16px; }
  .sub-state .ss-days { font-size: 24px; }
  .sp-descr { min-height: 0; }
}

/* ==========================================================================
   在线客服 /service
   ========================================================================== */
.svc-wrap { max-width: var(--max); margin: 0 auto; padding: 24px; display: grid;
  grid-template-columns: 300px 1fr; gap: 16px; height: calc(100vh - 130px); min-height: 480px; }
.svc-side { display: flex; flex-direction: column; overflow: hidden; }
.svc-side-h { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px;
  border-bottom: 1px solid var(--line); }
.svc-side-h b { font-size: 14.5px; }
.svc-sessions { flex: 1; overflow-y: auto; padding: 6px; }
.svc-s { display: flex; align-items: center; gap: 8px; padding: 11px 12px; border-radius: var(--r-sm);
  cursor: pointer; transition: background .15s; }
.svc-s:hover { background: var(--bg); }
.svc-s.on { background: var(--brand-soft); }
.svc-s b { font-size: 13px; display: block; }
.svc-s i { font-style: normal; }
.svc-unread { font-style: normal; font-size: 10.5px; background: var(--accent); color: #fff;
  min-width: 17px; height: 17px; border-radius: 999px; display: grid; place-items: center; padding: 0 4px; }
.svc-st { font-size: 10.5px; color: var(--brand); flex: 0 0 auto; }
.svc-st.w { color: var(--warn); }

.svc-main { display: flex; flex-direction: column; overflow: hidden; }
.svc-head { display: flex; align-items: center; gap: 10px; padding: 13px 18px; border-bottom: 1px solid var(--line); }
.svc-head b { font-size: 14.5px; }
.svc-body { flex: 1; overflow-y: auto; padding: 18px; display: flex; flex-direction: column; gap: 12px; background: var(--bg); }
.svc-msg { display: flex; }
.svc-msg.me { justify-content: flex-end; }
.svc-bubble { max-width: 72%; padding: 10px 14px; border-radius: 14px; font-size: 13.5px; line-height: 1.7;
  background: var(--bg-2); box-shadow: var(--shadow-sm); border: 1px solid var(--line); word-break: break-word; }
.svc-msg.me .svc-bubble { background: var(--brand); color: #fff; border-color: var(--brand); border-bottom-right-radius: 4px; }
.svc-msg.bot .svc-bubble { border-bottom-left-radius: 4px; }
.svc-dotting { letter-spacing: 3px; color: var(--ink-3); animation: svcblink 1s infinite; }
@keyframes svcblink { 50% { opacity: .4; } }
.svc-quick { display: flex; gap: 8px; padding: 10px 14px; border-top: 1px solid var(--line); flex-wrap: wrap; }
.svc-quick button { font-size: 12px; padding: 5px 12px; border-radius: 999px; border: 1px solid var(--line);
  background: var(--bg); cursor: pointer; font-family: var(--font); color: var(--ink-2); }
.svc-quick button:hover { border-color: var(--brand); color: var(--brand); }
.svc-foot { display: flex; gap: 10px; padding: 12px 14px 14px; border-top: 1px solid var(--line); }
.svc-foot .input { flex: 1; }

@media (max-width: 860px) {
  .svc-wrap { grid-template-columns: 1fr; padding: 14px; height: calc(100vh - 120px); }
  .svc-side { max-height: 180px; }
  .svc-bubble { max-width: 86%; }
}

/* ==================== 客服消息：昵称/角色/已读 ==================== */
.svc-meta {
  font-size: 11px; color: var(--muted, #999);
  margin: 0 4px 3px;
}
.svc-msg.me .svc-meta { text-align: right; }
.svc-read {
  display: block; font-size: 10px; margin: 3px 4px 0;
  color: var(--muted, #999); text-align: right;
}
.svc-read.on { color: var(--brand, #2E9E5B); }

/* ==================== 支付方式选择 ==================== */
.pay-opt { position: relative; cursor: pointer; border: 1.5px solid var(--line, #E5E8E2); border-radius: 10px; transition: .15s; }
.pay-opt.on { border-color: var(--brand, #2E9E5B); background: #F4FAF6; }
.pay-opt.off { opacity: .55; cursor: not-allowed; }
.pay-opt .pdot { width: 16px; height: 16px; border-radius: 50%; border: 1.5px solid #CBD4CC; flex: 0 0 auto; }
.pay-opt.on .pdot { border-color: var(--brand, #2E9E5B); background: radial-gradient(circle, var(--brand) 0 5px, #fff 5.5px); }

/* 客服实时状态徽标 + 状态条 */
.svc-live {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 10.5px; padding: 1px 7px; border-radius: 9px; margin-left: 6px;
  background: #F2F4F1; color: var(--ink-3); vertical-align: middle;
  transition: background .2s, color .2s;
}
.svc-live.g { background: #E8F6ED; color: #1F7A56; }
.svc-live.g::before {
  content: ''; width: 5px; height: 5px; border-radius: 50%; background: #2FA36B;
  animation: svcPulse 1.6s ease-in-out infinite;
}
.svc-live.w { background: #FFF4E2; color: #A9701A; }
@keyframes svcPulse { 0%, 100% { opacity: 1; } 50% { opacity: .25; } }

.svc-statusbar {
  padding: 7px 18px; font-size: 12px; color: #8A6116;
  background: #FFFBF0; border-bottom: 1px solid var(--line);
}

/* ============================ 结算页优惠券选择 ============================ */
.cpick {
  display: flex; align-items: center; gap: 8px; cursor: pointer;
  padding: 8px 11px; border-radius: 9px; font-size: 12.5px;
  border: 1px solid var(--line); background: #FCFCFB; transition: .16s;
}
.cpick:hover { border-color: #CFE6D9; background: #FAFDFA; }
.cpick.on { border-color: var(--brand); background: #F5FBF7; box-shadow: 0 0 0 1px rgba(47, 156, 107, .12); }
.cpick input { accent-color: var(--brand); margin: 0; flex: 0 0 auto; }
.cpick span { flex: 1; line-height: 1.5; }
.cpick b { font-weight: 600; }
.cpick em {
  font-style: normal; font-weight: 600; color: #C2471B; font-size: 13px;
  display: flex; flex-direction: column; align-items: flex-end; line-height: 1.3;
}
.cpick em i { font-style: normal; font-size: 10px; color: var(--muted); font-weight: 400; }

/* ---------------------------------------------------------------- 生日申领：身份证上传 */
.bnotice { margin-top: 12px; padding: 9px 12px; border-radius: 10px; font-size: 12.5px; line-height: 1.75; }
.bnotice.wait { background: #FFF6ED; color: #8A5A3A; border: 1px solid #F6DCC0; }
.bnotice.bad { background: #FDEEEE; color: #A8382F; border: 1px solid #F3CECA; }
.bnotice.ok { background: #F1F8F4; color: #1F7A56; border: 1px solid #CFE7D9; }

.bap-hero { display: flex; gap: 12px; align-items: flex-start; padding: 12px 14px; border-radius: 12px;
  background: linear-gradient(115deg, #FFF6ED, #F4FAF6); border: 1px solid #F0E2D2; margin-bottom: 14px; }
.bap-ico { font-size: 26px; line-height: 1.2; }
.bap-hero b { font-size: 14px; }

.field label .req { color: #C2471B; font-style: normal; margin-left: 2px; }

.up-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
@media (max-width: 560px) { .up-grid { grid-template-columns: 1fr; } }
.up-box { position: relative; border: 1.5px dashed #D7DEDA; border-radius: 12px; background: #FAFBFA;
  min-height: 116px; display: grid; place-items: center; cursor: pointer; overflow: hidden;
  transition: border-color .18s, background .18s; }
.up-box:hover, .up-box.drag { border-color: var(--brand); background: var(--brand-soft); }
.up-box.has { border-style: solid; border-color: #CFE7D9; background: #fff; }
.up-ph { text-align: center; padding: 14px 8px; }
.up-ph span { font-size: 24px; display: block; margin-bottom: 4px; }
.up-ph b { display: block; font-size: 12.5px; font-weight: 600; color: var(--ink-2); }
.up-ph i { display: block; font-style: normal; font-size: 11px; color: var(--ink-3); margin-top: 3px; }
.up-box.has .up-ph { display: none; }
.ushot { width: 100%; height: 100%; position: absolute; inset: 0; }
.ushot img { width: 100%; height: 100%; object-fit: cover; display: block; }
.udel { position: absolute; top: 6px; right: 6px; width: 22px; height: 22px; border-radius: 50%;
  background: rgba(0,0,0,.55); color: #fff; display: grid; place-items: center; font-size: 14px;
  cursor: pointer; line-height: 1; }
.udel:hover { background: #D9534F; }

.bap-agree { display: flex; gap: 8px; align-items: flex-start; font-size: 12px; color: var(--ink-2);
  line-height: 1.7; margin-top: 4px; cursor: pointer; }
.bap-agree input { width: 15px; height: 15px; margin-top: 2px; accent-color: var(--brand); flex: 0 0 auto; }

/* ==========================================================================
   分类字段渲染（fieldx.js）：分组信息块 / 指标卡 / 芯片 / 标签输入
   ========================================================================== */
.fx-block { border-top: 1px dashed var(--line); padding: 14px 0 4px; }
.fx-block:first-child { border-top: 0; padding-top: 4px; }
.fx-block-h {
  font-size: 12px; font-weight: 700; color: var(--ink-2); letter-spacing: .3px;
  display: flex; align-items: center; gap: 6px; margin-bottom: 10px;
}
.fx-block-h::before {
  content: ''; width: 3px; height: 12px; border-radius: 2px;
  background: var(--brand, #1F7A56); opacity: .85;
}

/* 指标卡：把关键数字放大，一眼抓重点 */
.fx-metrics { display: grid; grid-template-columns: repeat(auto-fit, minmax(88px, 1fr)); gap: 8px; margin-bottom: 10px; }
.fx-metric {
  background: #F7F9F7; border-radius: 10px; padding: 9px 11px; min-width: 0;
  display: flex; flex-direction: column; gap: 2px;
}
.fx-metric b { font-size: 17px; font-weight: 700; color: var(--ink); letter-spacing: -.3px; line-height: 1.25; }
.fx-metric b i { font-size: 10.5px; font-style: normal; font-weight: 500; color: var(--ink-3); margin-left: 2px; }
.fx-metric span { font-size: 10.5px; color: var(--ink-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* 行式键值 */
.fx-rows { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 7px 18px; }
.fx-row { display: flex; align-items: baseline; gap: 8px; min-width: 0; }
.fx-k { font-size: 11.5px; color: var(--ink-3); flex: 0 0 auto; }
.fx-v { font-size: 12.5px; font-weight: 600; color: var(--ink); min-width: 0; word-break: break-word; }

/* 芯片组（多值字段） */
.fx-chip {
  display: inline-block; font-size: 11px; font-weight: 500; padding: 1px 7px; border-radius: 6px;
  background: var(--brand-soft, #EAF4EF); color: var(--brand, #1F7A56); margin: 0 4px 3px 0; white-space: nowrap;
}

/* ---- 表单 ---- */
.fx-form-group { margin-bottom: 14px; }
.fx-form-h {
  font-size: 12px; font-weight: 700; color: var(--ink-2); margin-bottom: 8px;
  display: flex; align-items: center; gap: 6px;
}
.fx-form-h::before { content: ''; width: 3px; height: 12px; border-radius: 2px; background: var(--brand, #1F7A56); }
.fx-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 12px; }
@media (max-width: 560px) { .fx-form-grid { grid-template-columns: 1fr; } }
.fx-form-grid .field { margin-bottom: 10px; }
.fx-input-wrap { position: relative; display: flex; align-items: center; }
.fx-input-wrap .input { flex: 1; }
.fx-unit {
  position: absolute; right: 11px; font-size: 11.5px; color: var(--ink-3);
  background: #fff; padding-left: 4px; pointer-events: none;
}
.fx-hint { font-size: 10.5px; color: var(--ink-3); margin-top: 3px; }

/* 开关 */
.fx-sw { display: flex; align-items: center; padding-top: 22px; }
.fx-sw-l { display: flex; align-items: center; gap: 8px; cursor: pointer; margin: 0; }
.fx-sw-l input { accent-color: var(--brand, #1F7A56); width: 16px; height: 16px; }
.fx-sw-t { font-size: 12.5px; color: var(--ink-2); }

/* 标签输入 */
.fx-taginput {
  display: flex; flex-wrap: wrap; gap: 5px; align-items: center;
  border: 1px solid var(--line); border-radius: 9px; padding: 6px 8px; background: #fff; min-height: 38px;
}
.fx-taginput:focus-within { border-color: var(--brand, #1F7A56); }
.fx-taginput .input { border: 0; padding: 2px 0; flex: 1; min-width: 80px; outline: none; box-shadow: none; }
.fx-taglist { display: contents; }
.fx-tag {
  display: inline-flex; align-items: center; gap: 3px; font-size: 11.5px;
  background: var(--brand-soft, #EAF4EF); color: var(--brand, #1F7A56);
  padding: 2px 4px 2px 7px; border-radius: 6px;
}
.fx-tag i { font-style: normal; cursor: pointer; opacity: .55; padding: 0 2px; }
.fx-tag i:hover { opacity: 1; }

/* ---- 分类页/详情页的业务色彩区分 ---- */
.fx-hero-errand { --fxc: #E07A2F; }
.fx-hero-moving { --fxc: #B45309; }

/* ==========================================================================
   分类商家卡：按业务区分的视觉重点
   ========================================================================== */
.bc-logo-orange { background: #FDF1E6; }
.bc-logo-brown { background: #F8EEE1; }

/* 右上角价格牌：跑腿/搬家用它替代「标签」，一眼看到钱 */
.bc-price-tag {
  flex: 0 0 auto; display: inline-flex; align-items: baseline; gap: 2px;
  background: #FDF1E6; color: #C2601F; font-weight: 700; font-size: 15px;
  padding: 3px 9px; border-radius: 8px; letter-spacing: -.3px;
}
.bc-price-tag i { font-style: normal; font-size: 10px; font-weight: 500; opacity: .75; margin-right: 1px; }
.bc-price-brown { background: #F8EEE1; color: #9A5B0E; }

/* 三栏指标（跑腿/搬家/家政/中介共用） */
.bc-metrics {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px; margin-top: 10px;
}
.bc-metrics > div {
  background: #F7F9F7; border-radius: 9px; padding: 7px 9px; min-width: 0;
  display: flex; flex-direction: column; gap: 1px;
}
.bc-metrics b { font-size: 14px; font-weight: 700; color: var(--ink); letter-spacing: -.2px; white-space: nowrap; }
.bc-metrics b i { font-style: normal; font-size: 9.5px; font-weight: 500; color: var(--ink-3); margin-left: 1px; }
.bc-metrics span { font-size: 10px; color: var(--ink-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.bc-tags { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 9px; }
.bc-time { font-size: 11px; color: var(--ink-3); margin-top: 8px; }

/* 搬家的车型条 */
.bc-truck {
  display: flex; align-items: center; gap: 8px; margin-top: 9px;
  background: #FBF6EE; border-radius: 8px; padding: 6px 10px;
}
.bc-truck-t { font-size: 12px; font-weight: 700; color: #9A5B0E; flex: 0 0 auto; }
.bc-truck-l { font-size: 11px; color: var(--ink-2); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* 租赁的租金条 */
.bc-rent { display: flex; align-items: baseline; gap: 6px; margin-top: 9px; flex-wrap: wrap; }
.bc-rent b { font-size: 19px; font-weight: 700; color: #C2601F; letter-spacing: -.5px; }
.bc-rent > i { font-style: normal; font-size: 10.5px; color: var(--ink-3); }
.bc-paymode {
  font-size: 10.5px; background: #F7F1E6; color: #9A5B0E; padding: 2px 7px; border-radius: 5px; margin-left: 4px;
}
.bc-trust { font-size: 10.5px; background: #E8F5EC; color: #1F7A56; padding: 2px 7px; border-radius: 5px; }

/* 移动端：卡片内边距收紧 */
@media (max-width: 560px) {
  .biz-card { padding: 14px 14px; gap: 11px; }
  .bc-nm { font-size: 14.5px; max-width: 180px; }
  .bc-metrics b { font-size: 13px; }
  .bc-price-tag { font-size: 13.5px; padding: 2px 7px; }
}

/* ==========================================================================
   商家详情页：分类专属首屏（跑腿/搬家/租赁/餐饮…各一套版式）
   ========================================================================== */
.dcover { position: relative; height: 132px; display: grid; place-items: center;
  background: linear-gradient(135deg, #F2F8F3, #E5F0E9); overflow: hidden; }
.dcover::after { content: ''; position: absolute; right: -40px; top: -40px; width: 150px; height: 150px;
  border-radius: 50%; background: var(--biz, #2F9C6B); opacity: .07; }
.dcover-ico { font-size: 52px; position: relative; z-index: 1; }
.dcover-cat { position: absolute; left: 14px; bottom: 12px; font-size: 11.5px; font-weight: 650;
  color: #fff; background: var(--biz, #2F9C6B); padding: 4px 10px; border-radius: 20px; z-index: 2;
  text-decoration: none; }
.dnotice { display: flex; gap: 8px; align-items: baseline; padding: 10px 13px; margin-top: 14px;
  background: #FBFCFA; border-radius: 10px; font-size: 12px; }
.dnotice span { color: var(--ink-3); flex: 0 0 auto; }
.dnotice b { font-weight: 500; color: var(--ink-2); }

/* ---------- 首屏通用 ---------- */
.dhero { margin-top: 14px; padding: 14px 15px 12px; border-radius: 14px;
  border: 1px solid var(--line); background: linear-gradient(180deg, #FCFDFB, #F8FAF8); }
.dhero-main { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.dhero-tag { font-size: 11px; font-weight: 650; color: var(--brand, #1F7A56);
  background: rgba(31, 122, 86, .1); padding: 3px 8px; border-radius: 6px; }
.dhero-num { font-size: 28px; font-weight: 750; letter-spacing: -.8px; color: var(--accent, #C2471B);
  line-height: 1; }
.dhero-sub { font-size: 11.5px; color: var(--ink-3); }
.dhero-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 10px; }
.dhero-grid.wide { grid-template-columns: repeat(auto-fit, minmax(76px, 1fr)); }
.dhero-grid > div { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.dhero-grid b { font-size: 15px; font-weight: 700; color: var(--ink); letter-spacing: -.2px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dhero-grid b.sm { font-size: 12.5px; }
.dhero-grid b i { font-size: 10px; font-style: normal; font-weight: 500; color: var(--ink-3); margin-left: 1px; }
.dhero-grid span { font-size: 10.5px; color: var(--ink-3); white-space: nowrap; overflow: hidden;
  text-overflow: ellipsis; }
.dhero-tags { display: flex; flex-wrap: wrap; gap: 5px; align-items: center; margin-bottom: 10px; }
.dhero-foot { display: flex; flex-wrap: wrap; gap: 6px 12px; padding-top: 10px;
  border-top: 1px dashed var(--line); font-size: 11.5px; color: var(--ink-2); }
.dsw { display: inline-flex; align-items: center; gap: 3px; font-size: 11px; font-weight: 600;
  color: var(--brand, #1F7A56); background: rgba(31, 122, 86, .09); padding: 2px 7px; border-radius: 5px; }

/* ---------- 跑腿 ---------- */
.dhero-errand { --accent: #E07A2F; --brand: #E07A2F; }
.dhero-errand .dhero-num { font-size: 32px; }
.dhero-errand .dhero-grid > div { padding-left: 10px; border-left: 2px solid rgba(224, 122, 47, .18); }
.dhero-errand .dhero-grid > div:first-child { padding-left: 0; border-left: 0; }
.fx-chip-accent { background: rgba(224, 122, 47, .1) !important; color: #B85F1D !important;
  border-color: rgba(224, 122, 47, .2) !important; }

/* ---------- 搬家 ---------- */
.dhero-moving { --accent: #B45309; --brand: #B45309; }
.dtruck { display: flex; align-items: center; gap: 12px; padding: 11px 13px; border-radius: 11px;
  background: #fff; border: 1px solid rgba(180, 83, 9, .16); margin-bottom: 12px; }
.dtruck-ico { font-size: 26px; flex: 0 0 auto; }
.dtruck .grow b { display: block; font-size: 14px; font-weight: 700; color: var(--ink); }
.dtruck .grow span { font-size: 11px; color: var(--ink-3); }
.dtruck-n { text-align: right; flex: 0 0 auto; }
.dtruck-n b { display: block; font-size: 18px; font-weight: 750; color: #B45309; line-height: 1.1; }
.dtruck-n span { font-size: 10px; color: var(--ink-3); }
.dfee { border-radius: 11px; background: #fff; border: 1px solid var(--line); overflow: hidden;
  margin-bottom: 10px; }
.dfee-h { font-size: 11px; font-weight: 700; color: var(--ink-3); padding: 8px 12px;
  background: #FAFAF8; border-bottom: 1px solid var(--line); }
.dfee-row { display: flex; align-items: baseline; gap: 8px; padding: 8px 12px;
  border-bottom: 1px dashed var(--line); }
.dfee-row:last-child { border-bottom: 0; }
.dfee-row > span { font-size: 12px; color: var(--ink-2); flex: 0 0 auto; width: 62px; }
.dfee-row > b { font-size: 13.5px; font-weight: 700; color: #B45309; flex: 0 0 auto; }
.dfee-row > b i { font-size: 10px; font-style: normal; font-weight: 500; color: var(--ink-3); }
.dfee-row > em { font-size: 10.5px; font-style: normal; color: var(--ink-3); margin-left: auto; }

/* ---------- 租赁 ---------- */
.dhero-rental { --accent: #B07A1E; --brand: #B07A1E; }
.drent { display: flex; align-items: flex-end; gap: 14px; padding-bottom: 12px;
  border-bottom: 1px dashed var(--line); margin-bottom: 12px; }
.drent-num { display: block; font-size: 27px; font-weight: 750; color: #B07A1E;
  letter-spacing: -.8px; line-height: 1.15; margin-top: 5px; }
.drent-num i { font-size: 13px; font-style: normal; font-weight: 600; color: var(--ink-3); }
.drent-sub { font-size: 10.5px; color: var(--ink-3); }
.drent-pay { text-align: right; flex: 0 0 auto; }
.drent-pay b { display: block; font-size: 14px; font-weight: 700; color: var(--ink); }
.drent-pay span { font-size: 10.5px; color: var(--ink-3); }

/* ---------- 餐饮 ---------- */
.dhero-food { --accent: #C2471B; --brand: #C2471B; }
.dhero-food .dhero-grid > div { text-align: center; padding: 9px 4px; background: #fff;
  border-radius: 10px; border: 1px solid rgba(194, 71, 27, .12); }

/* ---------- 生鲜 ---------- */
.dhero-grocery { --accent: #2F9C6B; --brand: #2F9C6B; }
.dhero-grocery .dhero-grid > div { text-align: center; padding: 9px 4px; background: #fff;
  border-radius: 10px; border: 1px solid rgba(47, 156, 107, .14); }
.dhero-grocery .fx-chip-accent { background: rgba(47, 156, 107, .1) !important; color: #1F7A56 !important;
  border-color: rgba(47, 156, 107, .2) !important; }

/* ---------- 医药 ---------- */
.dhero-medicine { --accent: #2F7EC4; --brand: #2F7EC4; }
.dmed { display: flex; align-items: center; gap: 11px; padding: 11px 13px; border-radius: 11px;
  background: #fff; border: 1px solid rgba(47, 126, 196, .16); margin-bottom: 12px; }
.dmed-av { width: 38px; height: 38px; border-radius: 10px; display: grid; place-items: center;
  font-size: 20px; background: rgba(47, 126, 196, .1); flex: 0 0 auto; }
.dmed .grow b { display: block; font-size: 14px; font-weight: 700; color: var(--ink); }
.dmed .grow span { font-size: 11px; color: var(--ink-3); }
.dhero-medicine .fx-chip-accent { background: rgba(47, 126, 196, .1) !important; color: #2F7EC4 !important; }
.dhero-medicine .dsw { color: #2F7EC4; background: rgba(47, 126, 196, .09); }

/* ---------- 家政 ---------- */
.dhero-service { --accent: #7048C7; --brand: #7048C7; }
.dhero-service .dhero-num { color: #7048C7; }
.dhero-service .dhero-grid > div { padding-left: 10px; border-left: 2px solid rgba(112, 72, 199, .18); }
.dhero-service .dhero-grid > div:first-child { padding-left: 0; border-left: 0; }
.dhero-service .fx-chip-accent { background: rgba(112, 72, 199, .1) !important; color: #5F3AAF !important; }
.dhero-service .dsw { color: #7048C7; background: rgba(112, 72, 199, .09); }

/* ---------- 中介 ---------- */
.dhero-estate { --accent: #7A5A2E; --brand: #7A5A2E; }
.dhero-estate .dhero-grid > div { text-align: center; padding: 9px 4px; background: #fff;
  border-radius: 10px; border: 1px solid rgba(122, 90, 46, .14); }
.dhero-estate .fx-chip-accent { background: rgba(122, 90, 46, .1) !important; color: #6B4E26 !important; }
.dhero-estate .dsw { color: #7A5A2E; background: rgba(122, 90, 46, .09); }

/* ---------- 折叠：完整经营信息 ---------- */
.dmore { margin-top: 12px; border-top: 1px dashed var(--line); padding-top: 10px; }
.dmore summary { font-size: 11.5px; color: var(--ink-3); cursor: pointer; list-style: none;
  display: flex; align-items: center; gap: 5px; user-select: none; }
.dmore summary::-webkit-details-marker { display: none; }
.dmore summary::before { content: '▸'; font-size: 9px; transition: transform .2s; }
.dmore[open] summary::before { transform: rotate(90deg); }
.dmore-body { padding-top: 4px; }
.dmore-body .fx-rows { grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); }

@media (max-width: 560px) {
  .dhero-grid { grid-template-columns: repeat(3, 1fr); gap: 6px; }
  .dhero-num { font-size: 25px; }
  .dhero-errand .dhero-num { font-size: 28px; }
  .drent-num { font-size: 23px; }
  .dfee-row > span { width: 54px; }
  .dhero-foot { gap: 6px 10px; }
}

/* ==========================================================================
   社区商家页：分类小图标横向滚动条（省空间，把首屏留给商家卡片）
   ========================================================================== */
.bzn-bar {
  display: flex; align-items: stretch; gap: 6px; overflow-x: auto; overscroll-behavior-x: contain;
  padding: 8px 0 10px; margin: 12px 0 14px; border-bottom: 1px solid var(--line);
  scrollbar-width: none; -webkit-overflow-scrolling: touch;
}
.bzn-bar::-webkit-scrollbar { display: none; }
.bzn-div { flex: 0 0 auto; width: 1px; background: var(--line); margin: 4px 2px; }

.bzn-item {
  flex: 0 0 auto; display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 3px; position: relative; min-width: 54px; padding: 6px 8px 7px; border-radius: 11px;
  border: 1px solid transparent; background: transparent; cursor: pointer; transition: .18s;
  font-family: inherit;
}
.bzn-item:hover { background: color-mix(in srgb, var(--biz, #2F9C6B) 6%, #fff);
  border-color: color-mix(in srgb, var(--biz, #2F9C6B) 22%, #fff); }
.bzn-item.on { background: color-mix(in srgb, var(--biz, #2F9C6B) 10%, #fff);
  border-color: color-mix(in srgb, var(--biz, #2F9C6B) 34%, #fff); }
.bzn-ico {
  width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; font-size: 16px;
  background: color-mix(in srgb, var(--biz, #2F9C6B) 11%, #fff); line-height: 1;
}
.bzn-item.on .bzn-ico { background: color-mix(in srgb, var(--biz, #2F9C6B) 20%, #fff); }
.bzn-item b { font-size: 11px; font-weight: 600; color: var(--ink-2); white-space: nowrap; line-height: 1.2; }
.bzn-item.on b { color: var(--biz, #1F7A56); }
.bzn-item i {
  font-style: normal; font-size: 9px; line-height: 1; color: var(--ink-3);
  background: #F3F5F3; padding: 1px 5px; border-radius: 99px; min-width: 15px; text-align: center;
}
.bzn-item.on i { background: color-mix(in srgb, var(--biz, #2F9C6B) 16%, #fff);
  color: color-mix(in srgb, var(--biz, #2F9C6B) 88%, #000); }
.bzn-all { --biz: #1F7A56; }

@media (max-width: 560px) {
  .bzn-bar { gap: 2px; padding: 6px 0 8px; margin: 8px 0 12px; }
  .bzn-item { min-width: 48px; padding: 5px 6px 6px; }
  .bzn-ico { width: 27px; height: 27px; font-size: 15px; border-radius: 8px; }
  .bzn-item b { font-size: 10px; }
}

/* ==========================================================================
   商家工作台 · 打印机设置
   ========================================================================== */
.pr-sec { font-size: 12.5px; font-weight: 700; color: var(--ink-2); margin-bottom: 10px;
  display: flex; align-items: center; gap: 6px; }
.pr-sec::before { content: ''; width: 3px; height: 13px; border-radius: 2px; background: var(--brand); }

.pr-brands { display: grid; grid-template-columns: repeat(auto-fill, minmax(124px, 1fr)); gap: 8px; }
.pr-brand { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: 11px 12px;
  border: 1.5px solid var(--line); border-radius: 12px; background: #fff; cursor: pointer;
  transition: .16s; text-align: left; font-family: inherit; }
.pr-brand:hover { border-color: var(--brand); background: #F8FCFA; }
.pr-brand.on { border-color: var(--brand); background: color-mix(in srgb, var(--brand) 6%, #fff);
  box-shadow: 0 3px 12px color-mix(in srgb, var(--brand) 14%, transparent); }
.prb-ico { font-size: 21px; line-height: 1.2; }
.pr-brand b { font-size: 12.5px; color: var(--ink); font-weight: 650; }
.pr-brand i { font-style: normal; font-size: 10px; color: var(--ink-3); }
.pr-brand.on b { color: var(--brand); }

.pr-tip { margin-top: 12px; padding: 9px 12px; border-radius: 9px; background: #F8FAF8;
  border: 1px dashed var(--line); font-size: 11.5px; color: var(--ink-2); line-height: 1.7; }
.pr-tip code { font-size: 10.5px; background: #EEF2EE; padding: 1px 5px; border-radius: 4px; }

.pr-fields { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 0 12px; }

.pr-switches { display: flex; flex-direction: column; gap: 2px; margin-top: 6px;
  border-top: 1px dashed var(--line); padding-top: 10px; }
.pr-sw { display: flex; align-items: flex-start; gap: 9px; padding: 7px 4px; cursor: pointer;
  border-radius: 8px; transition: background .15s; }
.pr-sw:hover { background: #FAFCFA; }
.pr-sw input { width: 16px; height: 16px; margin-top: 2px; accent-color: var(--brand); flex: 0 0 auto; }
.pr-sw span { font-size: 12.5px; color: var(--ink); font-weight: 550; display: flex;
  flex-direction: column; gap: 1px; }
.pr-sw span em { font-style: normal; font-size: 10.5px; color: var(--ink-3); font-weight: 400; }

/* 小票纸张预览 */
.pr-paper { font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; font-size: 11.5px;
  line-height: 1.55; white-space: pre-wrap; word-break: break-all; background: #FBFAF4;
  border: 1px solid #E8E4D6; border-radius: 8px; padding: 16px 18px; max-height: 440px;
  overflow: auto; color: #2A2A26; box-shadow: inset 0 0 0 1px #fff; }

@media (max-width: 560px) {
  .pr-brands { grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)); }
  .pr-fields { grid-template-columns: 1fr; }
}

/* ---------------------------------------------------------------- 师傅端 v2
   目标：把纵向空间还给订单列表。
   侧栏收起后只有 64px（图标 + 关键数字），展开 208px；
   原先侧栏里的订阅卡、社区卡、接单状态全部收进顶部一条 44px 的信息带。
   ------------------------------------------------------------------------ */
.mshell2 {
  display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 14px;
  padding: 18px 0 40px; align-items: start; transition: grid-template-columns .2s ease;
}
.mshell2:has(.mside2:not(.mini)) { grid-template-columns: 208px minmax(0, 1fr); }

/* ---- 侧栏 ---- */
.mside2 {
  position: sticky; top: 76px; background: #fff; border: 1px solid var(--line);
  border-radius: 14px; padding: 10px 8px 12px; overflow: hidden;
}
.ms2-tg {
  display: block; width: 100%; height: 20px; border-radius: 6px; color: var(--ink-3);
  font-size: 12px; line-height: 1; background: #F7F9F6; margin-bottom: 8px;
}
.ms2-tg:hover { background: var(--brand-soft); color: var(--brand); }
.ms2-who { display: flex; align-items: center; gap: 8px; padding: 2px 2px 8px; }
.ms2-who .avatar { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center;
  font-size: 15px; flex: 0 0 34px; }
.ms2-wt { min-width: 0; }
.ms2-wt b { display: block; font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ms2-wt i { font-style: normal; font-size: 10.5px; color: var(--ink-3); white-space: nowrap; }
.ms2-kpi { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-bottom: 8px; }
.ms2-kpi div { background: #F7F9F6; border-radius: 8px; padding: 5px 6px; min-width: 0; }
.ms2-kpi i { font-style: normal; display: block; font-size: 10px; color: var(--ink-3); }
.ms2-kpi b { font-family: var(--num); font-size: 14px; }
.mside2.mini .ms2-wt, .mside2.mini .ms2-kpi { display: none; }
.mside2.mini .ms2-who { justify-content: center; padding-bottom: 6px; }

.mnav2 { display: flex; flex-direction: column; gap: 2px; }
.mnav2 button {
  display: flex; align-items: center; gap: 9px; padding: 8px 9px; border-radius: 9px;
  font-size: 13px; color: var(--ink-2); text-align: left; width: 100%; white-space: nowrap;
}
.mnav2 button span { font-size: 15px; line-height: 1; flex: 0 0 18px; text-align: center; }
.mnav2 button em { font-style: normal; }
.mnav2 button:hover { background: #F5F7F4; }
.mnav2 button.on { background: var(--brand-soft); color: var(--brand); font-weight: 600; }
.mside2.mini .mnav2 button { justify-content: center; padding: 9px 0; }
.mside2.mini .mnav2 button em { display: none; }

.ms2-foot { margin-top: 10px; text-align: center; font-size: 11px; font-weight: 700; border-radius: 8px; padding: 5px 0; }
.ms2-foot.ok { background: var(--brand-soft); color: var(--brand); }
.ms2-foot.warn { background: #FFF4E2; color: #9A6412; }
.ms2-foot.off { background: #FDF0EF; color: #C0453C; }

/* ---- 主区 ---- */
.mwrap { display: flex; flex-direction: column; gap: 10px; }
.mtop { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.mtop-l { display: flex; align-items: baseline; gap: 10px; min-width: 0; }
.mtop-l h2 { font-size: 18px; letter-spacing: -.3px; }
.mtop-scope { font-size: 11.5px; color: var(--ink-3); background: #F5F8F5; border: 1px solid var(--line);
  border-radius: 99px; padding: 2px 9px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 340px; }
.mtop-r { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.mtop-hide { font-size: 11.5px; color: #9A6412; background: #FFF6E5; border: 1px solid #F4E2BE;
  border-radius: 99px; padding: 4px 10px; }
.mtop-st { display: flex; background: #F2F5F1; border-radius: 99px; padding: 2px; }
.mtop-st button { font-size: 12px; padding: 4px 11px; border-radius: 99px; color: var(--ink-3); }
.mtop-st button.on { background: #fff; color: var(--brand); font-weight: 600; box-shadow: 0 1px 3px rgba(0,0,0,.07); }
.mtop-sub { font-size: 12px; padding: 5px 11px; border-radius: 99px; font-weight: 600; }
.mtop-sub.ok { background: var(--brand-soft); color: var(--brand); }
.mtop-sub.warn { background: #FFF4E2; color: #9A6412; }
.mtop-sub.off { background: #FDF0EF; color: #C0453C; }

.mline { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 11.5px; color: var(--ink-3);
  background: #FBFCFA; border: 1px solid var(--line); border-radius: 9px; padding: 6px 11px; }
.mline-div { width: 1px; height: 11px; background: var(--line); }
.mline-warn { color: #9A6412; font-weight: 600; }
.mline-warn:hover { text-decoration: underline; }

.mhint { font-size: 12px; color: #7A5A2E; background: #FFFBF0; border: 1px dashed #E8D9B4;
  border-radius: 9px; padding: 7px 11px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }

/* ---- 订单卡：一行放得下标题/元信息/金额/按钮 ---- */
.oclist { display: flex; flex-direction: column; gap: 8px; }
.ocard {
  display: flex; align-items: center; gap: 12px; background: #fff; border: 1px solid var(--line);
  border-radius: 11px; padding: 11px 13px; transition: border-color .16s, box-shadow .16s;
}
.ocard:hover { border-color: #CFE4D8; box-shadow: var(--shadow-sm); }
.ocard.done { opacity: .92; }
.oc-ic { width: 38px; height: 38px; flex: 0 0 38px; border-radius: 10px; background: var(--brand-soft);
  display: grid; place-items: center; font-size: 18px; }
.oc-main { flex: 1 1 auto; min-width: 0; }
.oc-hd { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.oc-hd b { font-size: 14px; font-weight: 600; }
.oc-svc, .oc-lv, .oc-tag {
  font-size: 10.5px; padding: 1px 6px; border-radius: 5px; background: #F2F5F1; color: var(--ink-3);
  font-weight: 400; white-space: nowrap;
}
.oc-tag.g { background: #EAF6EF; color: var(--brand); }
.oc-tag.wa { background: #FFF4E2; color: #9A6412; }
.oc-tag.no { background: #FDF0EF; color: #C0453C; }
.oc-meta { font-size: 11.5px; color: var(--ink-3); margin-top: 2px; white-space: nowrap;
  overflow: hidden; text-overflow: ellipsis; }
.oc-lock { color: #C0453C; }
.oc-from { color: #597EF7; }
.oc-money { text-align: right; flex: 0 0 auto; }
.oc-money b { font-family: var(--num); font-size: 16px; display: block; line-height: 1.1; }
.oc-money i { font-style: normal; font-size: 10px; color: var(--brand); }
.oc-act { flex: 0 0 auto; display: flex; gap: 6px; align-items: center; }
.oc-btn { font-size: 12.5px; padding: 6px 13px; border-radius: 99px; background: #F2F5F1;
  color: var(--ink-2); white-space: nowrap; }
.oc-btn:hover { background: #E8EEE7; }
.oc-btn.go { background: var(--brand); color: #fff; box-shadow: 0 3px 10px rgba(31,122,86,.18); }
.oc-btn.go:hover { background: var(--brand-deep); }
.oc-btn.go:disabled { background: #D8DEDA; box-shadow: none; color: #fff; }
.oc-btn.ghost { background: #fff; border: 1px solid var(--line); }

/* ---- 完单凭证弹窗 ---- */
.fin-hd { margin-bottom: 14px; }
.fin-hd b { font-size: 15px; display: block; }
.fin-hd span { display: block; margin-top: 3px; }
.fin-code { display: flex; align-items: center; justify-content: space-between; gap: 12px;
  background: #F7FBF8; border: 1px solid #D9EDE2; border-radius: 10px; padding: 10px 12px; margin-bottom: 12px; }
.fin-code .fc-l b { font-size: 13px; display: block; }
.fin-code .fc-l .xs { margin-top: 2px; }
.fc-n { display: flex; gap: 3px; flex: 0 0 auto; }
.fc-n i { font-style: normal; width: 22px; height: 28px; border-radius: 5px; background: #fff;
  border: 1px solid #DDE9E2; font-family: var(--num); font-size: 15px; font-weight: 700;
  display: grid; place-items: center; color: #B7C4BD; }
.fin-input { font-family: var(--num); font-size: 20px; letter-spacing: 8px; text-align: center; }
.fin-or { display: flex; align-items: center; gap: 10px; margin: 6px 0 12px; color: var(--ink-3); font-size: 11.5px; }
.fin-or::before, .fin-or::after { content: ''; flex: 1; height: 1px; background: var(--line); }
.fin-drop { border: 1.5px dashed var(--line); border-radius: 10px; padding: 16px; text-align: center;
  cursor: pointer; background: #FAFBF9; transition: border-color .16s; }
.fin-drop:hover { border-color: #9CD3B8; }
.fin-prev { display: flex; gap: 8px; margin-top: 8px; flex-wrap: wrap; }
.fin-prev .fp { position: relative; }
.fin-prev .fp img { width: 62px; height: 62px; object-fit: cover; border-radius: 8px; border: 1px solid var(--line); }
.fin-prev .fp span { position: absolute; top: -6px; right: -6px; width: 18px; height: 18px; border-radius: 50%;
  background: #D9534F; color: #fff; font-size: 11px; display: grid; place-items: center; cursor: pointer; }

/* ---- 转单弹窗 ---- */
.tr-hd { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.tr-hd b { font-size: 15px; }
.tr-list { display: flex; flex-direction: column; gap: 7px; max-height: 280px; overflow: auto; }
.tr-item { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border: 1px solid var(--line);
  border-radius: 10px; background: #FCFDFB; cursor: pointer; }
.tr-item:hover { border-color: #CFE4D8; }
.tr-item.off { opacity: .5; cursor: not-allowed; }
.tr-item .ci { width: 32px; height: 32px; flex: 0 0 32px; border-radius: 9px; background: #EAF6EF;
  display: grid; place-items: center; font-size: 15px; }
.tr-row { display: flex; align-items: center; gap: 10px; padding: 9px 0; border-bottom: 1px solid var(--line); }
.tr-row:last-child { border-bottom: 0; }
.tr-dir { font-size: 10.5px; padding: 2px 7px; border-radius: 5px; flex: 0 0 auto; }
.tr-dir.out { background: #FFF4E2; color: #9A6412; }
.tr-dir.in { background: #EAF0FE; color: #3B5BDB; }

/* ---- 更多弹窗 ---- */
.mm-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.mm-chips .chip i { font-style: normal; margin-left: 4px; }
.mm-chips .chip i.ok { color: var(--brand); }
.mm-chips .chip i.wa { color: #9A6412; }
.mm-chips .chip i.no { color: #C0453C; }
.mm-links { display: flex; gap: 10px; margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--line); }
.mm-links a { font-size: 12.5px; color: var(--brand); }

@media (max-width: 900px) {
  .mshell2, .mshell2:has(.mside2:not(.mini)) { grid-template-columns: 1fr; }
  .mside2 { position: static; }
  .mside2.mini .ms2-wt, .mside2.mini .ms2-kpi { display: block; }
  .mside2.mini .mnav2 { flex-direction: row; overflow-x: auto; gap: 4px; }
  .mside2.mini .mnav2 button { justify-content: center; padding: 8px 10px; }
  .mside2.mini .mnav2 button em { display: inline; }
  .ms2-tg { display: none; }
  .ocard { flex-wrap: wrap; }
  .oc-money { text-align: left; }
  .oc-act { width: 100%; justify-content: flex-end; }
}