/* ============================================================================
 * ② 商家版 · 微信小程序 —— styles.css
 * ----------------------------------------------------------------------------
 * 零依赖原生 CSS。设计 token 复用 CONTRACT §10（状态色/字号/圆角），
 * 本端主色改用微信绿 #07C160；状态色一律走 --s-* 变量，不得自定义。
 * ==========================================================================*/

/* ---------- 设计 token（四端共用 + 本端扩展） ---------- */
:root{
  --c-bg:#F5F6F8; --c-card:#FFFFFF; --c-line:#EEEEEE;
  --c-primary-b:#1F6FEB;   /* 商家端主色(蓝) */
  --c-primary-c:#FF4D4F;   /* 抖音C端主色(红) */
  --c-primary-p:#722ED1;   /* 平台端主色(紫) */
  --fs-title:20px; --fs-h2:18px; --fs-h3:16px; --fs-body:14px; --fs-sm:12px;
  --radius:8px; --shadow:0 2px 8px rgba(0,0,0,.06); --row-h:48px;
  /* 状态色（CONTRACT §6，禁止改义） */
  --s-pending:#FAAD14; --s-confirmed:#1F6FEB; --s-arrived:#13C2C2; --s-verified:#52C41A;
  --s-partial:#FA8C16; --s-cancel:#8C8C8C; --s-noshow:#FF4D4F; --s-resched:#722ED1; --s-expired:#595959;
  /* 本端主色：微信绿 */
  --wx:#07C160; --wx-d:#06AD56; --wx-l:#E8F8EF;
  --tx-1:#1A1A1A; --tx-2:#666666; --tx-3:#999999; --tx-4:#BBBBBB;
  --radius-s:6px; --radius-l:14px;
  --tabbar-h:58px; --navbar-h:44px; --statusbar-h:44px;
  --safe-b:env(safe-area-inset-bottom, 0px);
}

*{ box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
html,body{ margin:0; padding:0; }
body{
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;
  color:var(--tx-1); background:#22262B;
  font-size:var(--fs-body);
  -webkit-font-smoothing:antialiased;
}
button{ font-family:inherit; cursor:pointer; border:none; background:none; color:inherit; padding:0; }
ul,ol,li{ list-style:none; margin:0; padding:0; }
img{ max-width:100%; }

/* ---------- 演示舞台 ---------- */
.stage{
  min-height:100vh; display:flex; flex-direction:column; align-items:center;
  gap:14px; padding:24px 16px 28px;
}
.stage-hint{ color:#C9CFD6; text-align:center; line-height:1.7; max-width:640px; }
.stage-hint b{ color:#fff; font-size:16px; }
.stage-hint span{ display:block; font-size:12px; color:#8B939C; }
.stage-hint-sub{ color:var(--wx)!important; }
.stage-foot{ color:#8B939C; font-size:12px; }
#syncBadge{ display:inline-flex; align-items:center; gap:6px; }
#syncBadge .dot{ width:7px; height:7px; border-radius:50%; background:var(--wx); display:inline-block; box-shadow:0 0 0 3px rgba(7,193,96,.18); }

/* ---------- 手机壳 ---------- */
.device{
  width:375px; height:812px; flex:none;
  background:var(--c-bg); border-radius:38px; position:relative; overflow:hidden;
  box-shadow:0 0 0 11px #0E0F11, 0 0 0 13px #2A2D31, 0 26px 60px rgba(0,0,0,.5);
  display:flex; flex-direction:column;
}
@media (max-height:900px){ .device{ transform:scale(.92); transform-origin:top center; } }

/* 状态栏（刘海条 + 胶囊按钮） */
.status-bar{
  height:var(--statusbar-h); flex:none; position:relative;
  display:flex; align-items:center; justify-content:space-between;
  padding:0 18px; font-size:var(--fs-sm); font-weight:600; color:#0B0B0B;
  background:var(--c-bg); z-index:20;
}
.sb-time{ letter-spacing:.3px; padding-top:8px; }
.sb-icons{ padding-top:8px; letter-spacing:1px; font-size:11px; }
.capsule{
  position:absolute; right:12px; top:11px; height:30px; width:78px;
  border:1px solid rgba(0,0,0,.09); border-radius:15px; background:rgba(255,255,255,.55);
  display:flex; align-items:center; justify-content:space-around; color:#0B0B0B;
  font-size:14px; font-weight:700;
}
.capsule .cap-div{ width:1px; height:16px; background:rgba(0,0,0,.12); }
.capsule .cap-dot{ font-size:15px; }

/* 导航栏 */
.nav-bar{
  height:var(--navbar-h); flex:none; display:flex; align-items:center; gap:8px;
  padding:0 14px; background:var(--c-bg); position:relative; z-index:10;
}
.nav-back{ font-size:26px; line-height:1; color:#0B0B0B; width:26px; margin-left:-4px; margin-top:-3px; }
.nav-title{ font-size:17px; font-weight:600; flex:1; text-align:center; margin:0; }
.nav-right{ min-width:26px; display:flex; justify-content:flex-end; }
.nav-bar.no-center .nav-title{ text-align:left; padding-left:2px; }
.role-chip{
  display:inline-flex; align-items:center; gap:4px; font-size:var(--fs-sm);
  color:var(--wx-d); background:var(--wx-l); border-radius:14px; padding:4px 10px; font-weight:600;
}
.role-chip .caret{ font-size:9px; }

/* 内容区 */
.screen{
  flex:1; overflow-y:auto; overflow-x:hidden; -webkit-overflow-scrolling:touch;
  padding:10px 12px 18px; position:relative;
}
.screen::-webkit-scrollbar{ width:0; }
.page-pad{ padding-bottom:6px; }

/* TabBar */
.tabbar{
  height:calc(var(--tabbar-h) + var(--safe-b)); flex:none;
  padding-bottom:var(--safe-b);
  display:flex; align-items:stretch; background:#FBFBFC;
  border-top:1px solid var(--c-line); z-index:20;
}
.tab-item{
  flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px;
  color:#7A8188; font-size:10.5px; position:relative; transition:color .15s;
}
.tab-item.active{ color:var(--wx); }
.tab-item .tab-ico{ font-size:20px; line-height:1; }
.tab-item .tab-badge{
  position:absolute; top:4px; left:calc(50% + 4px); min-width:16px; height:16px; padding:0 4px;
  background:var(--c-primary-c); color:#fff; border-radius:8px; font-size:10px; line-height:16px;
  text-align:center; font-weight:600; box-shadow:0 0 0 2px #FBFBFC;
}

/* ---------- 通用卡片 / 列表 ---------- */
.card{
  background:var(--c-card); border-radius:var(--radius-l); box-shadow:var(--shadow);
  padding:14px; margin-bottom:10px;
}
.card.tight{ padding:0; overflow:hidden; }
.sec-title{
  display:flex; align-items:center; justify-content:space-between;
  font-size:var(--fs-sm); color:var(--tx-2); font-weight:600; margin:14px 2px 8px;
}
.sec-title .more{ color:var(--wx-d); font-weight:500; font-size:var(--fs-sm); }
.sec-title .bar{ display:inline-block; width:3px; height:13px; background:var(--wx); border-radius:2px; margin-right:6px; vertical-align:-1px; }

/* 列表行（list-item.js） */
.li{ display:flex; gap:10px; padding:13px 14px; background:var(--c-card); position:relative; }
.li + .li{ border-top:1px solid var(--c-line); }
.li:active{ background:#F7F8FA; }
.li-avatar{
  width:40px; height:40px; border-radius:10px; flex:none; display:flex; align-items:center; justify-content:center;
  background:#F1F3F6; font-size:21px;
}
.li-body{ flex:1; min-width:0; }
.li-top{ display:flex; align-items:center; justify-content:space-between; gap:8px; }
.li-title{ font-size:var(--fs-body); font-weight:600; color:var(--tx-1); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.li-sub{ font-size:var(--fs-sm); color:var(--tx-2); margin-top:3px; line-height:1.5; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.li-sub.multi{ white-space:normal; }
.li-meta{ font-size:var(--fs-sm); color:var(--tx-3); margin-top:3px; }
.li-amount{ font-size:15px; font-weight:700; color:var(--tx-1); }
.li-right{ text-align:right; display:flex; flex-direction:column; align-items:flex-end; gap:6px; flex:none; }
.li-arrow{ color:var(--tx-4); font-size:16px; margin-top:2px; }

/* 状态胶囊（status-tag.js）—— 加粗放大，更醒目 */
.tag{
  display:inline-flex; align-items:center; gap:4px; font-size:12.5px; font-weight:700;
  padding:3px 10px; border-radius:11px; white-space:nowrap; line-height:1.5;
}
.tag .tag-dot{ width:6px; height:6px; border-radius:50%; background:currentColor; }
.tag-ok{ color:var(--s-verified); background:#EAF9E9; }
.tag-warn{ color:var(--s-pending); background:#FFF7E6; }
.tag-err{ color:var(--s-noshow); background:#FFF1F0; }

/* 按钮（做减法：主操作更大更好点） */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:6px;
  padding:11px 16px; border-radius:var(--radius); font-size:var(--fs-body); font-weight:600;
  background:#F2F3F5; color:var(--tx-1); transition:opacity .15s, background .15s;
}
.btn:active{ opacity:.72; }
.btn.primary{ background:var(--wx); color:#fff; }
.btn.danger{ background:#FFF1F0; color:var(--c-primary-c); }
.btn.ghost{ background:transparent; border:1px solid var(--c-line); }
.btn.block{ width:100%; }
.btn.lg{ padding:15px 18px; font-size:16px; font-weight:700; border-radius:var(--radius-l); }
.btn.sm{ padding:6px 12px; font-size:var(--fs-sm); border-radius:var(--radius-s); }
.btn[disabled]{ opacity:.45; pointer-events:none; }
.btn-row{ display:flex; gap:8px; }
.btn-row .btn{ flex:1; }
/* 竖排全宽按钮组（详情页主操作） */
.btn-col{ display:flex; flex-direction:column; gap:8px; }
.btn-col .btn{ width:100%; }

/* 四宫格指标（关键数字加大加粗 · 整卡可点击下钻） */
.grid4{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.stat{
  background:var(--c-card); border-radius:var(--radius-l); box-shadow:var(--shadow);
  padding:14px; position:relative; overflow:hidden; cursor:pointer;
}
.stat:active{ background:#F7F8FA; }
.stat .st-label{ font-size:var(--fs-sm); color:var(--tx-2); font-weight:600; }
.stat .st-value{ font-size:32px; font-weight:800; margin-top:6px; letter-spacing:-1px; line-height:1.1; }
.stat .st-ico{ position:absolute; right:10px; top:10px; font-size:22px; opacity:.2; }
.stat.warn .st-value{ color:var(--s-pending); }
.stat.ok .st-value{ color:var(--wx); }
.stat.danger .st-value{ color:var(--c-primary-c); }
.stat .st-foot{ font-size:11px; color:var(--tx-3); margin-top:6px; font-weight:600; }
.stat .st-foot .chev{ color:var(--wx-d); font-size:14px; }

/* 倒计时列表 */
.cd-item{
  display:flex; align-items:center; gap:12px; padding:12px 14px;
  border-bottom:1px solid var(--c-line);
}
.cd-item:last-child{ border-bottom:none; }
.cd-clock{
  flex:none; width:74px; text-align:center; font-variant-numeric:tabular-nums;
  font-size:24px; font-weight:800; color:var(--wx-d); letter-spacing:.5px;
}
.cd-clock.urgent{ color:var(--c-primary-c); animation:blink 1s steps(2,start) infinite; }
.cd-clock.zero{ color:var(--tx-3); }
@keyframes blink{ 50%{ opacity:.35; } }
.cd-body{ flex:1; min-width:0; }
.cd-body .t{ font-weight:600; }
.cd-body .s{ font-size:var(--fs-sm); color:var(--tx-2); margin-top:2px; }

/* 时间轴 */
.timeline{ position:relative; padding-left:16px; }
.timeline::before{ content:""; position:absolute; left:4px; top:6px; bottom:6px; width:2px; background:var(--c-line); }
.tl-item{ position:relative; padding:8px 0 8px 6px; display:flex; gap:10px; align-items:center; }
.tl-item::before{
  content:""; position:absolute; left:-16px; top:16px; width:10px; height:10px; border-radius:50%;
  background:#fff; border:2px solid var(--wx); box-sizing:border-box;
}
.tl-time{ font-size:12.5px; font-weight:700; color:var(--tx-1); width:96px; flex:none; font-variant-numeric:tabular-nums; }
.tl-main{ flex:1; min-width:0; }
.tl-main .n{ font-weight:600; }
.tl-main .d{ font-size:11px; color:var(--tx-3); margin-top:2px; }

/* 筛选栏 */
.filter-bar{ display:flex; gap:8px; overflow-x:auto; padding:2px 0 8px; }
.filter-bar::-webkit-scrollbar{ height:0; }
.chip{
  flex:none; padding:6px 13px; border-radius:15px; background:#fff; color:var(--tx-2);
  font-size:var(--fs-sm); border:1px solid var(--c-line); transition:all .15s;
}
.chip.active{ background:var(--wx); color:#fff; border-color:var(--wx); }

/* 分段控件 */
.seg{ display:flex; background:#EEF0F3; border-radius:9px; padding:3px; margin-bottom:10px; }
.seg-item{ flex:1; text-align:center; padding:7px 4px; font-size:var(--fs-sm); border-radius:7px; color:var(--tx-2); position:relative; }
.seg-item.active{ background:#fff; color:var(--wx-d); font-weight:600; box-shadow:0 1px 3px rgba(0,0,0,.08); }
.seg-item .seg-dot{
  position:absolute; top:3px; right:8px; min-width:15px; height:15px; padding:0 4px; border-radius:8px;
  background:var(--c-primary-c); color:#fff; font-size:9px; line-height:15px;
}

/* 底部弹层 sheet.js */
.sheet-mask{
  position:absolute; inset:0; background:rgba(0,0,0,.42); z-index:60;
  opacity:0; transition:opacity .2s; display:flex; align-items:flex-end;
}
.sheet-mask.show{ opacity:1; }
.sheet{
  width:100%; background:#fff; border-radius:16px 16px 0 0; max-height:82%;
  transform:translateY(100%); transition:transform .26s cubic-bezier(.2,.8,.2,1);
  display:flex; flex-direction:column; padding-bottom:var(--safe-b);
}
.sheet-mask.show .sheet{ transform:translateY(0); }
.sheet-head{
  padding:14px 16px; display:flex; align-items:center; justify-content:space-between;
  border-bottom:1px solid var(--c-line); flex:none;
}
.sheet-head h3{ margin:0; font-size:var(--fs-h3); }
.sheet-head .x{ color:var(--tx-3); font-size:22px; line-height:1; }
.sheet-body{ padding:14px 16px; overflow-y:auto; }
.sheet-foot{ padding:10px 16px 14px; border-top:1px solid var(--c-line); flex:none; }

/* Toast */
.toast{
  position:absolute; left:50%; top:42%; transform:translate(-50%,-50%) scale(.9);
  background:rgba(20,22,25,.9); color:#fff; padding:12px 18px; border-radius:10px;
  font-size:var(--fs-body); z-index:90; max-width:78%; text-align:center; line-height:1.5;
  opacity:0; transition:opacity .18s, transform .18s; pointer-events:none;
}
.toast.show{ opacity:1; transform:translate(-50%,-50%) scale(1); }
.toast.ok{ background:rgba(6,173,86,.94); }
.toast.err{ background:rgba(216,58,58,.94); }

/* 空态 empty.js */
.empty{ text-align:center; padding:40px 20px; color:var(--tx-3); }
.empty .em-ico{ font-size:44px; opacity:.6; }
.empty .em-txt{ margin-top:10px; font-size:var(--fs-sm); }

/* 券码数字键盘 */
.code-display{
  font-size:26px; font-weight:700; letter-spacing:3px; text-align:center; padding:14px;
  background:#F7F8FA; border-radius:var(--radius); font-variant-numeric:tabular-nums; min-height:60px;
  word-break:break-all; color:var(--tx-1);
}
.code-display .ph{ color:var(--tx-4); letter-spacing:2px; font-weight:500; font-size:16px; }
.keypad{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:12px; }
.key{
  padding:15px 0; background:#fff; border:1px solid var(--c-line); border-radius:10px;
  font-size:21px; font-weight:600; text-align:center; transition:background .12s;
}
.key:active{ background:#EDEFF2; }
.key.fn{ background:#F2F3F5; font-size:15px; color:var(--tx-2); }
.key.ok{ background:var(--wx); color:#fff; border-color:var(--wx); grid-row:span 2; display:flex; align-items:center; }

/* 核销结果 */
.result-hero{ text-align:center; padding:26px 16px 18px; }
.result-hero .rh-ico{ font-size:58px; }
.result-hero .rh-title{ font-size:var(--fs-h2); font-weight:700; margin-top:8px; }
.result-hero.ok .rh-title{ color:var(--wx-d); }
.result-hero.idem .rh-title{ color:var(--s-pending); }
.result-hero.fail .rh-title{ color:var(--c-primary-c); }
.result-hero .rh-sub{ color:var(--tx-2); font-size:var(--fs-sm); margin-top:6px; }
.kv{ display:flex; justify-content:space-between; padding:9px 0; border-bottom:1px dashed var(--c-line); font-size:var(--fs-sm); }
.kv:last-child{ border-bottom:none; }
.kv .k{ color:var(--tx-2); }
.kv .v{ color:var(--tx-1); font-weight:600; max-width:62%; text-align:right; word-break:break-all; }

/* 排班周视图 */
.week-head{ display:grid; grid-template-columns:48px repeat(7,1fr); gap:3px; margin-bottom:4px; }
.week-head .wh{ text-align:center; font-size:10px; color:var(--tx-3); padding:5px 0; border-radius:6px; }
.week-head .wh.today{ background:var(--wx-l); color:var(--wx-d); font-weight:700; }
.week-head .wh .wd{ display:block; font-weight:600; color:var(--tx-1); font-size:11px; }
.week-head .wh.today .wd{ color:var(--wx-d); }
.week-grid{ display:grid; grid-template-columns:48px repeat(7,1fr); gap:3px; }
.week-grid .slot-time{ font-size:9px; color:var(--tx-3); text-align:right; padding-right:4px; line-height:16px; }
.cell{ height:16px; border-radius:3px; background:#F1F3F6; transition:background .1s; }
.cell.on{ background:var(--wx); }
.cell.work{ background:var(--s-confirmed); opacity:.85; }
.cell:active{ filter:brightness(.9); }
.legend{ display:flex; gap:14px; font-size:11px; color:var(--tx-2); margin-top:14px; }
.legend i{ display:inline-block; width:11px; height:11px; border-radius:3px; margin-right:4px; vertical-align:-1px; }

/* 消息 */
.msg-item{ display:flex; gap:10px; padding:13px 14px; border-bottom:1px solid var(--c-line); position:relative; }
.msg-item:last-child{ border-bottom:none; }
.msg-item:active{ background:#F7F8FA; }
.msg-ico{ width:38px; height:38px; border-radius:10px; flex:none; display:flex; align-items:center; justify-content:center; font-size:19px; background:#F1F3F6; }
.msg-body{ flex:1; min-width:0; }
.msg-t{ font-weight:600; font-size:var(--fs-body); display:flex; align-items:center; gap:6px; }
.msg-unread{ width:8px; height:8px; border-radius:50%; background:var(--c-primary-c); flex:none; }
.msg-s{ font-size:var(--fs-sm); color:var(--tx-2); margin-top:3px; line-height:1.5; }
.msg-time{ font-size:11px; color:var(--tx-3); flex:none; }

/* 降级链可视化 */
.chain{ position:relative; padding-left:22px; }
.chain::before{ content:""; position:absolute; left:6px; top:10px; bottom:10px; width:2px; background:var(--c-line); }
.chain-node{ position:relative; padding:9px 0; }
.chain-node::before{
  content:""; position:absolute; left:-22px; top:13px; width:14px; height:14px; border-radius:50%;
  background:#fff; border:3px solid var(--tx-4); box-sizing:border-box;
}
.chain-node.sent::before{ border-color:var(--wx); }
.chain-node.degraded::before{ border-color:var(--s-pending); }
.chain-node.failed::before{ border-color:var(--c-primary-c); }
.chain-node .cn-t{ font-weight:600; font-size:var(--fs-body); display:flex; justify-content:space-between; gap:8px; }
.chain-node .cn-t .st{ font-size:11px; font-weight:600; }
.chain-node.sent .cn-t .st{ color:var(--wx-d); }
.chain-node.degraded .cn-t .st{ color:var(--s-pending); }
.chain-node.failed .cn-t .st{ color:var(--c-primary-c); }
.chain-node .cn-s{ font-size:var(--fs-sm); color:var(--tx-2); margin-top:3px; }

/* 我的 */
.profile-head{ display:flex; gap:14px; align-items:center; padding:6px 4px 16px; }
.profile-avatar{ width:58px; height:58px; border-radius:14px; background:var(--wx-l); display:flex; align-items:center; justify-content:center; font-size:28px; flex:none; }
.profile-info .pn{ font-size:var(--fs-h3); font-weight:700; }
.profile-info .pr{ font-size:var(--fs-sm); color:var(--tx-2); margin-top:4px; }
.profile-info .ps{ font-size:var(--fs-sm); color:var(--tx-3); margin-top:2px; }
.menu-row{ display:flex; align-items:center; gap:12px; padding:14px; }
.menu-row + .menu-row{ border-top:1px solid var(--c-line); }
.menu-row:active{ background:#F7F8FA; }
.menu-row .mr-ico{ width:26px; text-align:center; font-size:18px; flex:none; }
.menu-row .mr-t{ flex:1; }
.menu-row .mr-v{ font-size:var(--fs-sm); color:var(--tx-3); }
.menu-row .mr-arrow{ color:var(--tx-4); }

/* 业绩小卡 */
.perf{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.perf .p-item{ background:var(--c-card); border-radius:var(--radius-l); box-shadow:var(--shadow); padding:13px; text-align:center; }
.perf .p-v{ font-size:20px; font-weight:700; color:var(--wx-d); }
.perf .p-l{ font-size:11px; color:var(--tx-3); margin-top:4px; }

/* 通用工具 */
.row{ display:flex; align-items:center; gap:8px; }
.between{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
.wrap{ flex-wrap:wrap; }
.muted{ color:var(--tx-3); }
.small{ font-size:var(--fs-sm); }
.gap8{ gap:8px; } .gap12{ gap:12px; }
.mt8{ margin-top:8px; } .mt12{ margin-top:12px; } .mt16{ margin-top:16px; }
.mb0{ margin-bottom:0; } .mb8{ margin-bottom:8px; }
.tar{ text-align:right; } .tac{ text-align:center; }
.strong{ font-weight:700; }
.mono{ font-variant-numeric:tabular-nums; }
.divider{ height:1px; background:var(--c-line); margin:10px 0; }
.loading{ text-align:center; color:var(--tx-3); padding:26px; font-size:var(--fs-sm); }
.pull{ text-align:center; color:var(--tx-3); font-size:var(--fs-sm); padding:6px 0 2px; }
.badge-soft{ display:inline-block; background:var(--wx-l); color:var(--wx-d); border-radius:5px; padding:1px 6px; font-size:11px; margin-left:6px; }
.li-sub.strong{ font-weight:700; color:var(--tx-1); font-size:var(--fs-body); }
.li-op .li-body{ padding-right:2px; }
.hero-num{ font-size:20px; font-weight:800; letter-spacing:-.3px; }

/* ---------- 消息铃铛（工作台右上角，带未读红点） ---------- */
.bell{
  position:relative; width:30px; height:30px; margin-right:6px; border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center; font-size:17px; background:#F1F3F6;
}
.bell-dot{
  position:absolute; top:-3px; right:-4px; min-width:16px; height:16px; padding:0 4px;
  background:var(--c-primary-c); color:#fff; border-radius:8px; font-size:10px; line-height:16px;
  text-align:center; font-weight:700; box-shadow:0 0 0 2px var(--c-bg);
}

/* ---------- 会员充值：当前会员卡 + 平台卡项 ---------- */
.hero-card{
  background:linear-gradient(135deg,#07C160,#059E4D); color:#fff; border-radius:var(--radius-l);
  padding:16px; box-shadow:var(--shadow); margin-bottom:10px;
}
.hero-card.expiring{ background:linear-gradient(135deg,#FAAD14,#E09400); }
.hero-card.expired{ background:linear-gradient(135deg,#8C8C8C,#6B6B6B); }
.hero-card .hc-name{ font-size:17px; font-weight:800; }
.hero-card .hc-row{ display:flex; align-items:baseline; justify-content:space-between; margin-top:10px; }
.hero-card .hc-row > span{ font-size:var(--fs-sm); opacity:.92; }
.hero-card .hc-big{ font-size:26px; font-weight:800; letter-spacing:-.5px; }
.hero-card .hc-big.warn{ color:#FFF3D6; }
.hero-card .hc-big.danger{ color:#FFE1E1; }
.hero-card .hc-sub{ font-size:var(--fs-sm); opacity:.92; margin-top:8px; }
.live{ color:var(--wx-d); font-weight:700; font-size:11px; }
.plan-grid{ display:flex; flex-direction:column; gap:10px; }
.plan-card{
  background:var(--c-card); border-radius:var(--radius-l); box-shadow:var(--shadow); padding:14px;
  border:1px solid var(--c-line);
}
.plan-card.off{ opacity:.6; }
.plan-card .plan-name{ font-size:16px; font-weight:800; }
.plan-card .plan-price{ font-size:26px; font-weight:800; color:var(--c-primary-c); margin:6px 0 4px; letter-spacing:-.5px; }
.plan-card .plan-meta{ font-size:var(--fs-sm); color:var(--tx-2); margin-bottom:4px; }
.plan-card .plan-meta b{ color:var(--tx-1); }
/* 卡项权益清单（Rev5 R8：cardPlan.benefits[]） */
.plan-card .plan-benefits{ margin:6px 0 6px; padding-top:6px; border-top:1px dashed var(--c-line); }
.plan-card .plan-benefits .pb-t{ font-size:var(--fs-sm); color:var(--tx-3); margin-bottom:2px; }
.plan-card .plan-benefits .pb-i{ font-size:var(--fs-sm); color:var(--tx-2); line-height:1.6; }
.plan-card .plan-remark{ font-size:var(--fs-sm); color:var(--tx-3); margin-bottom:10px; min-height:18px; }

/* ---------- 技师资料：媒体列表 ---------- */
.media-item{ display:flex; gap:10px; padding:12px 14px; border-bottom:1px solid var(--c-line); align-items:flex-start; }
.media-item:last-child{ border-bottom:none; }
.media-thumb{
  width:46px; height:46px; border-radius:10px; flex:none; display:flex; align-items:center; justify-content:center;
  background:#F1F3F6; font-size:22px;
}
.media-info{ flex:1; min-width:0; }
.media-info .media-t{ display:flex; align-items:center; gap:6px; flex-wrap:wrap; font-size:var(--fs-body); }
.media-info .small{ margin-top:3px; }

/* ---------- Rev5：主账号代管提示 / 会员到期只读提示 ---------- */
.manage-banner{
  display:flex; align-items:center; justify-content:space-between; gap:8px; flex-wrap:wrap;
  margin:2px 0 10px; padding:10px 12px; border-radius:10px;
  background:#FFF7E6; border:1px solid #FFE0A3; color:#8A5A00; font-size:var(--fs-sm);
}
.member-warn{
  margin-top:8px; padding:8px 10px; border-radius:8px;
  background:#FFF1F0; border:1px solid #FFCCC7; color:var(--s-noshow); font-size:var(--fs-sm);
}

/* ---------- 项目来源色标（service.source） ---------- */
.src{
  display:inline-block; font-size:10.5px; font-weight:700; padding:1px 7px; border-radius:8px;
  margin-left:6px; vertical-align:1px; line-height:1.6;
}
.src-dy{ background:#1A1A1A; color:#fff; }
.src-mt{ background:#FFF3CD; color:#B78103; }
.src-both{ background:#EAF2FE; color:var(--s-confirmed); }
.src-self{ background:#E6FFFB; color:var(--s-arrived); }

/* ---------- 等级色标（techLevel） ---------- */
.lv{ display:inline-flex; align-items:center; gap:4px; font-size:var(--fs-sm); color:var(--tx-2); font-weight:600; }
.lv-dot{ display:inline-block; width:9px; height:9px; border-radius:50%; margin-right:4px; vertical-align:0; }

/* ---- v1.4.1 登录 / 入驻（手机号为准） ---- */
.login-wrap{ padding:28px 18px; }
.login-logo{ width:64px; height:64px; margin:6px auto 10px; border-radius:16px; background:var(--wx); display:flex; align-items:center; justify-content:center; font-size:32px; }
.login-brand{ text-align:center; font-size:19px; font-weight:700; }
.login-sub{ text-align:center; font-size:12px; color:var(--tx-3); margin:4px 0 18px; }
.f-field{ margin-bottom:12px; }
.f-field .f-label{ display:block; font-size:12px; color:var(--tx-3); margin-bottom:5px; }
.f-input{ width:100%; box-sizing:border-box; padding:12px 13px; border:1px solid var(--c-line); border-radius:var(--radius-l); font-size:15px; background:#fff; }
.f-input:focus{ outline:none; border-color:var(--wx); }
.link{ color:var(--wx); }
.ob-steps{ display:flex; gap:6px; margin:12px 0; }
.ob-step{ flex:1; text-align:center; font-size:11px; color:var(--tx-3); padding:6px 2px; border-radius:8px; background:#F5F6F7; }
.ob-step.on{ background:var(--wx); color:#fff; }
.ob-step.done{ background:#E8F7EE; color:var(--s-confirmed); }
.qual-row{ display:flex; align-items:center; gap:10px; padding:10px 0; border-bottom:1px solid var(--c-line); }
.qual-row img{ width:52px; height:52px; border-radius:8px; object-fit:cover; }