/* Mobile-first static homepage for WeChat H5 */
:root{
  --bg: #F6F7FB;
  --card: #FFFFFF;
  --text: #0F172A;
  --muted: #64748B;
  --line: rgba(15, 23, 42, .08);
  --primary: #0EA5E9;
  --primary2: #2563EB;
  --success: #16A34A;
  --warn: #F59E0B;
  --purple: #8B5CF6;
  --shadow: 0 10px 30px rgba(2, 6, 23, .08);
  --radius: 16px;
  --radius2: 22px;
}

*{ box-sizing: border-box; }
html, body{ height:100%; }
body{
  margin:0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", Arial, sans-serif;
  color: var(--text);
  background: var(--bg);
  font-size: 16px;
}
a{ color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; }
button, input{ font: inherit; }

.app{ min-height:100%; padding-bottom: 74px; }

/* sticky + backdrop-filter 与下方轮播 transform 同帧重绘时，部分 WebView 会偶发顶栏抖动；提高不透明度并固定合成层，减轻模糊重算 */
.topbar{
  position: sticky;
  top: 0;
  z-index: 20;
  background: rgba(246, 247, 251, 0.94);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--line);
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  isolation: isolate;
}
.topbar__safe{ height: env(safe-area-inset-top, 0px); }
.topbar__row{
  display:flex;
  align-items:center;
  justify-content: space-between;
  padding: 12px 16px 12px;
}

.brand{
  display:flex;
  align-items:center;
  flex: 1;
  min-width: 0;
}
.brand__img{
  height: 50px;
  width: auto;
  max-width: min(275px, calc(100vw - 120px));
  object-fit: contain;
  object-position: left center;
  display: block;
}

.icon-btn{
  width: 40px; height: 40px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.75);
  border-radius: 14px;
  display:flex; align-items:center; justify-content:center;
}
.icon-btn__dot{
  width: 10px; height: 10px; border-radius: 99px;
  background: linear-gradient(135deg, #22C55E, #0EA5E9);
  box-shadow: 0 10px 20px rgba(14, 165, 233, .28);
}
.icon-btn--home{
  color: #475569;
}
.icon-btn--home .icon-btn__svg{
  display: block;
  pointer-events: none;
}
.icon-btn:active{ transform: scale(.98); }

.main{ padding: 14px 16px 22px; }

.hero{
  position: relative;
  border-radius: var(--radius2);
  overflow: hidden;
  background: linear-gradient(135deg, rgba(14,165,233,.16), rgba(37,99,235,.10));
  border: 1px solid rgba(37,99,235,.10);
  box-shadow: var(--shadow);
}
.hero__bg{
  position:absolute; inset:0;
  background:
    radial-gradient(120px 120px at 18% 20%, rgba(14,165,233,.35), transparent 60%),
    radial-gradient(160px 160px at 80% 30%, rgba(139,92,246,.26), transparent 60%),
    radial-gradient(220px 220px at 30% 90%, rgba(34,197,94,.22), transparent 60%);
  opacity: .95;
}
.hero__content{ position: relative; padding: 18px 16px 16px; }
.hero__title{ font-size: 20px; font-weight: 900; }
.hero__desc{ margin-top: 8px; color: rgba(15,23,42,.75); line-height: 1.5; font-size: 14px; }
.chip{
  display:inline-block;
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(255,255,255,.75);
  border: 1px solid rgba(15,23,42,.08);
  font-weight: 700;
}

.hero__search{
  margin-top: 12px;
  display:flex;
  gap: 10px;
}
.input{
  flex: 1;
  height: 44px;
  border-radius: 14px;
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(255,255,255,.86);
  padding: 0 12px;
  outline: none;
}
.input:focus{ border-color: rgba(14,165,233,.55); box-shadow: 0 0 0 4px rgba(14,165,233,.14); }

.btn{
  height: 44px;
  border-radius: 14px;
  border: 1px solid transparent;
  padding: 0 14px;
  font-weight: 800;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.btn:active{ transform: scale(.99); }
.btn--primary{
  color:#fff;
  background: linear-gradient(135deg, var(--primary), var(--primary2));
  box-shadow: 0 12px 22px rgba(37, 99, 235, .22);
}
.btn--light{
  background: rgba(255,255,255,.84);
  border-color: rgba(15,23,42,.10);
}
.btn--sm{ height: 36px; border-radius: 12px; padding: 0 12px; font-size: 14px; }

.hero__badges{ margin-top: 12px; display:flex; flex-wrap: wrap; gap: 8px; }
.badge{
  display:inline-flex; align-items:center; gap: 6px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.72);
  border: 1px solid rgba(15,23,42,.08);
  color: rgba(15,23,42,.78);
  font-size: 13px;
}
.badge__dot{ width: 8px; height: 8px; border-radius: 99px; background: var(--primary); }
.badge--ok .badge__dot{ background: var(--success); }
.badge--warn .badge__dot{ background: var(--warn); }

.section{ margin-top: 16px; }
.section__head{
  display:flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}
.section__title{
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  font-size: 16px;
  font-weight: 900;
  line-height: 1.3;
  letter-spacing: 0.02em;
  color: #0f172a;
}
.section__title::before{
  content: "";
  flex-shrink: 0;
  width: 3px;
  height: 15px;
  border-radius: 2px;
  background: linear-gradient(180deg, #7dd3fc, #0ea5e9 50%, #2563eb);
}
.muted{ font-size: 13px; color: var(--muted); }
.link{ font-size: 14px; color: rgba(37,99,235,.95); font-weight: 800; }

.grid{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}
.tile{
  background: rgba(255,255,255,.86);
  border: 1px solid rgba(15,23,42,.08);
  border-radius: var(--radius);
  padding: 12px 10px;
  box-shadow: 0 10px 20px rgba(2,6,23,.06);
}
.tile:active{ transform: translateY(1px); }
.tile__icon{
  width: 40px; height: 40px;
  border-radius: 14px;
  display:flex; align-items:center; justify-content:center;
  color:#fff;
  font-weight: 900;
  margin-bottom: 10px;
}
.tile__icon--blue{ background: linear-gradient(135deg, #0EA5E9, #2563EB); }
.tile__icon--green{ background: linear-gradient(135deg, #22C55E, #16A34A); }
.tile__icon--purple{ background: linear-gradient(135deg, #A78BFA, #8B5CF6); }
.tile__icon--amber{ background: linear-gradient(135deg, #FBBF24, #F59E0B); }
.tile__name{ font-weight: 900; font-size: 13px; }
.tile__desc{ font-size: 12px; color: var(--muted); margin-top: 4px; }

.cards{ display:flex; flex-direction: column; gap: 12px; }
.card{
  display:flex;
  gap: 12px;
  padding: 12px;
  border-radius: var(--radius2);
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(15,23,42,.08);
  box-shadow: 0 18px 28px rgba(2,6,23,.07);
}
.card__thumb{ width: 92px; flex: 0 0 92px; }
.thumb{
  width: 92px; height: 92px;
  border-radius: 18px;
  background: #E2E8F0;
  position: relative;
  overflow: hidden;
}
.thumb::after{
  content:"";
  position:absolute; inset:-40%;
  background: conic-gradient(from 180deg, rgba(255,255,255,.0), rgba(255,255,255,.85), rgba(255,255,255,.0));
  transform: rotate(25deg);
  opacity: .6;
}
.thumb--1{ background: linear-gradient(135deg, rgba(14,165,233,.26), rgba(37,99,235,.22)); }
.thumb--2{ background: linear-gradient(135deg, rgba(34,197,94,.22), rgba(245,158,11,.20)); }
.card__title{ font-weight: 950; line-height: 1.25; font-size: 15px; }
.card__desc{ margin-top: 6px; color: rgba(15,23,42,.70); font-size: 13px; line-height: 1.5; }
.card__row{ margin-top: 10px; display:flex; align-items:center; gap: 8px; }
.spacer{ flex:1; }
.tag{
  display:inline-flex;
  align-items:center;
  height: 24px;
  padding: 0 9px;
  border-radius: 999px;
  background: rgba(14,165,233,.18);
  color: rgba(2,132,199,.98);
  font-size: 13px;
  font-weight: 800;
}
.tag--green{ background: rgba(34,197,94,.18); color: rgba(21,128,61,.98); }
.tag--ghost{
  background: rgba(15,23,42,.04);
  color: rgba(15,23,42,.65);
}

.notice{
  background: rgba(255,255,255,.86);
  border: 1px solid rgba(15,23,42,.08);
  border-radius: var(--radius2);
  padding: 10px 12px;
  box-shadow: 0 10px 22px rgba(2,6,23,.06);
}
.notice__item{
  padding: 8px 0;
  border-bottom: 1px dashed rgba(15,23,42,.10);
  color: rgba(15,23,42,.75);
  font-size: 14px;
  line-height: 1.5;
}
.notice__item:last-child{ border-bottom: none; }

.tabbar{
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 25;
  background: rgba(255,255,255,.86);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border-top: 1px solid var(--line);
}
.tabbar__safe{ height: env(safe-area-inset-bottom, 0px); }
.tabbar{
  display:flex;
  justify-content: space-around;
  padding: 8px 6px 0;
}
.tab{
  width: 25%;
  padding: 8px 0 10px;
  display:flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  color: rgba(15,23,42,.62);
}
.tab__icon-wrap{
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.tab__icon{ font-size: 20px; line-height: 1; }
.tab__text{ font-size: 12px; font-weight: 800; }
.tab.is-active{ color: rgba(2, 132, 199, .98); }
/* 底部购物车与「我的」订单入口共用数字角标（在 24px 基础上缩小 1/5 → 24×0.8≈19px；数字不加粗、flex 居中） */
.tab__badge{
  position: absolute;
  min-width: 19px;
  height: 19px;
  padding: 0 5px;
  border-radius: 99px;
  background: #ef4444;
  color: #fff;
  font-size: 11px;
  font-weight: 400;
  line-height: 1;
  box-sizing: border-box;
  border: 1px solid rgba(255,255,255,.95);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-variant-numeric: tabular-nums;
  pointer-events: none;
  z-index: 3;
}
.tab__badge--cart{
  top: -7px;
  right: -11px;
}
/* 与购物车角标同尺寸、同外飘；父级 .mine-group--order-tabs 需 overflow:visible 以免裁切 */
.tab__badge--mine-order{
  top: -7px;
  right: -11px;
}

/* z-index 高于 .modal(50)；履约合约弹窗打开时 bottom 由 app.js 按「按钮行上沿上方 30px」动态写入 */
.toast{
  position: fixed;
  left: 50%;
  bottom: calc(74px + env(safe-area-inset-bottom, 0px));
  transform: translateX(-50%);
  z-index: 200;
  background: rgba(15,23,42,.92);
  color: #fff;
  padding: 10px 12px;
  border-radius: 14px;
  font-size: 14px;
  max-width: calc(100vw - 32px);
  opacity: 0;
  pointer-events: none;
  transition: opacity .18s ease, transform .18s ease;
}
.toast.is-show{
  opacity: 1;
  transform: translateX(-50%) translateY(-6px);
}

.modal{
  position: fixed;
  inset: 0;
  z-index: 50;
  display: none;
}
.modal.is-show{ display:block; }
.modal__mask{
  position:absolute; inset:0;
  background: rgba(2,6,23,.50);
}
.modal__panel{
  position:absolute;
  left: 16px; right: 16px;
  top: 18%;
  border-radius: 20px;
  background: rgba(255,255,255,.96);
  border: 1px solid rgba(15,23,42,.10);
  box-shadow: 0 30px 60px rgba(2,6,23,.25);
  padding: 14px;
}
.modal__title{ font-weight: 950; font-size: 16px; }
.modal__content{ margin-top: 8px; color: rgba(15,23,42,.78); font-size: 14px; line-height: 1.55; }
.modal__actions{ display:flex; gap: 10px; margin-top: 14px; }
.modal__actions .btn{ flex:1; }

@media (max-width: 360px){
  .grid{ grid-template-columns: repeat(2, 1fr); }
}

/* 「我的」页：微信头像昵称（仅本页使用，不影响首页） */
.tab-page--hidden{ display: none !important; }
.mine-profile{
  padding: 14px;
  border-radius: var(--radius2);
  background: rgba(255,255,255,.9);
  border: 1px solid rgba(15,23,42,.08);
  box-shadow: 0 10px 22px rgba(2,6,23,.06);
}
.mine-profile__row{
  display: flex;
  align-items: center;
  gap: 12px;
}
.mine-profile__text{
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.mine-profile__badges{
  flex-shrink: 0;
  display: none;
  flex-direction: row;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  min-height: 0;
  padding-top: 0;
}
.mine-profile__badges.mine-profile__badges--on{
  display: flex;
}
.mine-profile__badge-slots{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
}
.mine-profile__badge{
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
  padding: 4px 9px;
  border-radius: 8px;
  white-space: nowrap;
  letter-spacing: 0.02em;
}
.mine-profile__badge--exp{
  color: #0369a1;
  background: linear-gradient(135deg, rgba(14,165,233,.22), rgba(37,99,235,.16));
  border: 1px solid rgba(14, 165, 233, 0.38);
}
.mine-profile__badge--principal{
  color: #92400e;
  background: rgba(245, 158, 11, 0.16);
  border: 1px solid rgba(245, 158, 11, 0.42);
}
.mine-profile .avatar{
  position: relative;
  z-index: 0;
  width: 52px;
  height: 52px;
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(14,165,233,.22), rgba(37,99,235,.16));
  border: 1px solid rgba(15,23,42,.08);
  background-size: cover;
  background-position: center;
  flex-shrink: 0;
  overflow: hidden;
  isolation: isolate;
}
.mine-profile__name{
  font-weight: 900;
  font-size: 17px;
  line-height: 1.3;
  word-break: break-all;
}
.mine-profile__hint{
  margin-top: 6px;
  font-size: 13px;
  color: rgba(15,23,42,.62);
  line-height: 1.45;
}
/* 资料已完善：姓名、手机号可点进修改资料（沿用 data-route 委托） */
.mine-profile__name-tap,
.mine-profile__hint-tap{
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.mine-profile__name-tap{
  display: inline;
  color: inherit;
}
.mine-profile__hint-tap{
  font-weight: 600;
  color: rgba(15,23,42,.78);
}


/* ── 我的页面 ── */
.mine-group{
  position: relative;
  z-index: 0;
  border-radius: var(--radius2);
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(15,23,42,.08);
  box-shadow: 0 10px 22px rgba(2,6,23,.06);
  overflow: hidden;
}
.mine-group--order-tabs{
  overflow: visible;
}
.mine-group__title{
  padding: 10px 14px 8px;
  font-size: 13px;
  font-weight: 900;
  color: var(--text);
  border-bottom: 1px solid var(--line);
}

/* 订单快捷入口 */
.mine-order-tabs{
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  align-items: flex-start;
  /* 略增左右留白：角标外飘时减少裁切/叠层伪影；推广订单第 5 项在窄屏下更稳 */
  padding: 14px 10px;
  width: 100%;
  box-sizing: border-box;
}
.mine-order-tab{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  flex: 1;
  min-width: 0;
}
.mine-order-tab:active{ opacity: .7; }
.mine-order-tab__icon-wrap{
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.mine-order-tab__icon{
  width: 40px; height: 40px;
  border-radius: 14px;
  position: relative;
  flex-shrink: 0;
  overflow: hidden;
  isolation: isolate;
}
/* 待付款 - 钱包形状 */
.mine-order-tab__icon--unpaid{
  background: rgba(245,158,11,.15);
}
.mine-order-tab__icon--unpaid::before{
  content: "";
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F59E0B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='5' width='20' height='14' rx='2'/%3E%3Cline x1='2' y1='10' x2='22' y2='10'/%3E%3C/svg%3E") center/22px no-repeat;
}
/* 待发货 - 箱子 */
.mine-order-tab__icon--unship{
  background: rgba(14,165,233,.15);
}
.mine-order-tab__icon--unship::before{
  content: "";
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230EA5E9' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z'/%3E%3C/svg%3E") center/22px no-repeat;
}
/* 待收货 - 车 */
.mine-order-tab__icon--unreceive{
  background: rgba(37,99,235,.15);
}
.mine-order-tab__icon--unreceive::before{
  content: "";
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232563EB' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='1' y='3' width='15' height='13' rx='1'/%3E%3Cpath d='M16 8h4l3 5v3h-7V8z'/%3E%3Ccircle cx='5.5' cy='18.5' r='2.5'/%3E%3Ccircle cx='18.5' cy='18.5' r='2.5'/%3E%3C/svg%3E") center/22px no-repeat;
}
/* 已完成 */
.mine-order-tab__icon--done{
  background: rgba(22,163,74,.15);
}
.mine-order-tab__icon--done::before{
  content: "";
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2316A34A' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/22px no-repeat;
}
/* 退款/售后 */
.mine-order-tab__icon--refund{
  background: rgba(239,68,68,.12);
}
.mine-order-tab__icon--refund::before{
  content: "退";
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  font-size: 15px; font-weight: 900;
  color: #EF4444;
}
/* 关闭：不用 SVG data URL（部分微信 X5 对伪元素内 SVG 背景缩放/解析异常会拉成大块）；用纯 CSS 叉号 */
.mine-order-tab__icon--closed{
  background: rgba(100,116,139,.12);
}
.mine-order-tab__icon--closed::before{
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 14px;
  height: 14px;
  margin: -7px 0 0 -7px;
  box-sizing: border-box;
  display: block;
  background:
    linear-gradient(45deg, transparent 47%, #64748b 47%, #64748b 53%, transparent 53%),
    linear-gradient(-45deg, transparent 47%, #64748b 47%, #64748b 53%, transparent 53%);
  background-repeat: no-repeat;
  background-size: 100% 100%, 100% 100%;
  background-position: center, center;
}
.mine-order-tab__text{
  font-size: 12px;
  color: rgba(15,23,42,.72);
  font-weight: 700;
  text-align: center;
  white-space: nowrap;
}

/* 服务菜单列表 */
.mine-menu{ display: flex; flex-direction: column; }
.mine-menu__item{
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 10px;
  padding: 13px 14px;
  border-bottom: 1px solid var(--line);
}
.mine-menu__item--last{ border-bottom: none; }
.mine-menu__item:active{ background: rgba(15,23,42,.03); }
.mine-menu__icon{
  width: 32px; height: 32px;
  border-radius: 10px;
  flex-shrink: 0;
  position: relative;
}
.mine-menu__icon--gift{ background: rgba(239,68,68,.12); }
.mine-menu__icon--gift::before{ content:"荐"; position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:900;color:#EF4444; }
.mine-menu__icon--team{ background: rgba(14,165,233,.12); }
.mine-menu__icon--team::before{ content:"员"; position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:900;color:#0EA5E9; }
.mine-menu__icon--chart{ background: rgba(37,99,235,.12); }
.mine-menu__icon--chart::before{ content:"绩"; position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:900;color:#2563EB; }
.mine-menu__icon--addr{ background: rgba(245,158,11,.12); }
.mine-menu__icon--addr::before{ content:"址"; position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:900;color:#F59E0B; }
.mine-menu__icon--invoice{ background: rgba(22,163,74,.12); }
.mine-menu__icon--invoice::before{ content:"票"; position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:900;color:#16A34A; }
.mine-menu__icon--feedback{ background: rgba(139,92,246,.12); }
.mine-menu__icon--feedback::before{ content:"诉"; position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:900;color:#8B5CF6; }
.mine-menu__icon--profile{ background: rgba(100,116,139,.12); }
.mine-menu__icon--profile::before{ content:"资"; position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:900;color:#64748B; }
.mine-menu__label{ font-size: 15px; font-weight: 700; flex: 1; }
.mine-menu__badge{
  font-size: 12px;
  color: var(--muted);
  background: rgba(15,23,42,.05);
  padding: 2px 8px;
  border-radius: 999px;
  white-space: nowrap;
}
.mine-menu__arrow{
  font-size: 18px;
  color: rgba(15,23,42,.28);
  margin-left: 2px;
}

.mine-profile__complete{
  display: inline-block;
  padding: 4px 14px;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--primary), var(--primary2));
  color: #fff;
  font-size: 13px;
  font-weight: 700;
}

/* 完善资料弹窗 · 现代简约 */
/* 微信内打开原生 select 时 vh / 视口会波动，避免 top:50%+transform 与 vh 限高导致整窗抖动 */
#profileModal.is-show,
#addressModal.is-show,
#invoiceModal.is-show,
#checkoutAddrModal.is-show,
#depositContractModal.is-show{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 20px;
  padding-bottom: max(20px, env(safe-area-inset-bottom, 0px));
  box-sizing: border-box;
  overscroll-behavior: contain;
}
#profileModal .modal__mask,
#addressModal .modal__mask,
#invoiceModal .modal__mask,
#checkoutAddrModal .modal__mask,
#depositContractModal .modal__mask{
  z-index: 0;
}
#profileModal .modal__panel--profile,
#addressModal .modal__panel--profile,
#invoiceModal .modal__panel--profile,
#checkoutAddrModal .modal__panel--profile,
#depositContractModal .modal__panel--profile{
  z-index: 1;
  position: relative;
  top: auto;
  left: auto;
  right: auto;
  width: 100%;
  max-width: 400px;
  margin: 0;
  transform: none;
  flex-shrink: 0;
  min-height: 0;
  max-height: min(520px, 85%);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 22px 22px 20px;
  border-radius: 14px;
  background: #fff;
  border: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow: 0 20px 50px rgba(2, 6, 23, 0.14);
}
#profileModal .modal__title,
#addressModal .modal__title,
#invoiceModal .modal__title{
  margin: 0;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(15, 23, 42, 0.06);
  font-size: 17px;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--text);
}
#profileModal .profile-form__intro,
#addressModal .profile-form__intro,
#invoiceModal .profile-form__intro{
  margin: 12px 0 0;
  font-size: 13px;
  line-height: 1.55;
  color: var(--muted);
}
#profileModal .profile-form,
#addressModal .profile-form,
#invoiceModal .profile-form{
  margin-top: 16px;
  display: flex;
  flex-direction: column;
  gap: 18px;
}
#profileModal .profile-form__item,
#addressModal .profile-form__item,
#invoiceModal .profile-form__item{
  display: flex;
  flex-direction: column;
  gap: 8px;
}
#profileModal .profile-form__label,
#addressModal .profile-form__label,
#invoiceModal .profile-form__label{
  font-size: 12px;
  font-weight: 600;
  color: #64748b;
  letter-spacing: 0.02em;
}
.profile-form__required{ color: #EF4444; font-weight: 600; }
#profileModal .profile-form__input.input,
#addressModal .profile-form__input.input,
#invoiceModal .profile-form__input.input,
#profileModal input.profile-form__input,
#addressModal input.profile-form__input,
#invoiceModal input.profile-form__input,
#profileModal select.profile-form__input,
#addressModal select.profile-form__input,
#invoiceModal select.profile-form__input{
  width: 100%;
  flex: none;
  height: 46px;
  border-radius: 10px;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  padding: 0 14px;
  /* ≥16px 减轻 iOS/微信 WebView 聚焦缩放带来的整页位移 */
  font-size: 16px;
  color: var(--text);
  transition: border-color 0.15s, background 0.15s, box-shadow 0.15s;
  box-sizing: border-box;
}
#profileModal select.profile-form__input,
#addressModal select.profile-form__input,
#invoiceModal select.profile-form__input{
  cursor: pointer;
  transition: none;
  -webkit-tap-highlight-color: transparent;
}
/* 性别下拉：简洁现代，箭头用伪元素避免与系统控件抢绘 */
#profileModal .profile-form__select-wrap,
#addressModal .profile-form__select-wrap,
#invoiceModal .profile-form__select-wrap{
  position: relative;
  width: 100%;
}
#profileModal .profile-form__select-wrap::after,
#addressModal .profile-form__select-wrap::after,
#invoiceModal .profile-form__select-wrap::after{
  content: "";
  position: absolute;
  right: 15px;
  top: 50%;
  width: 8px;
  height: 8px;
  margin-top: -6px;
  border-right: 2px solid #94a3b8;
  border-bottom: 2px solid #94a3b8;
  transform: rotate(45deg);
  pointer-events: none;
  opacity: 0.9;
}
#profileModal .profile-form__select-wrap select.profile-form__select,
#addressModal .profile-form__select-wrap select.profile-form__select,
#invoiceModal .profile-form__select-wrap select.profile-form__select{
  padding-left: 16px;
  padding-right: 46px;
  border-radius: 12px;
  border: 1px solid var(--line);
  background: #fff;
  color: var(--text);
  font-weight: 500;
  letter-spacing: 0.01em;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8) inset, 0 1px 2px rgba(15, 23, 42, 0.04);
  -webkit-appearance: none;
  appearance: none;
}
#profileModal .profile-form__select-wrap select.profile-form__select:invalid,
#addressModal .profile-form__select-wrap select.profile-form__select:invalid,
#invoiceModal .profile-form__select-wrap select.profile-form__select:invalid{
  color: #94a3b8;
}
#profileModal .profile-form__select-wrap select.profile-form__select option,
#addressModal .profile-form__select-wrap select.profile-form__select option,
#invoiceModal .profile-form__select-wrap select.profile-form__select option{
  color: var(--text);
  font-weight: 500;
}
#profileModal .profile-form__select-wrap select.profile-form__select:focus,
#addressModal .profile-form__select-wrap select.profile-form__select:focus,
#invoiceModal .profile-form__select-wrap select.profile-form__select:focus{
  border-color: rgba(14, 165, 233, 0.5);
  background: #fff;
}
#profileModal .profile-form__input::placeholder,
#addressModal .profile-form__input::placeholder,
#invoiceModal .profile-form__input::placeholder{
  color: #94a3b8;
}
#profileModal .profile-form__input:focus,
#addressModal .profile-form__input:focus,
#invoiceModal .profile-form__input:focus{
  outline: none;
  background: #fff;
  border-color: #0ea5e9;
  box-shadow: 0 0 0 3px rgba(14, 165, 233, 0.14);
}
/* 下拉框聚焦时不用外扩阴影，减少与系统选择器叠加时的闪动 */
#profileModal select.profile-form__input:focus,
#addressModal select.profile-form__input:focus,
#invoiceModal select.profile-form__input:focus{
  box-shadow: none;
}
#profileModal textarea.profile-form__input,
#addressModal textarea.profile-form__input,
#invoiceModal textarea.profile-form__input{
  min-height: 96px;
  height: auto;
  padding-top: 12px;
  padding-bottom: 12px;
  resize: vertical;
  line-height: 1.45;
}
#profileModal .profile-form__item--check,
#addressModal .profile-form__item--check,
#invoiceModal .profile-form__item--check{
  margin-top: -4px;
}
#profileModal .profile-form__check-label,
#addressModal .profile-form__check-label,
#invoiceModal .profile-form__check-label{
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 14px;
  font-weight: 600;
  color: var(--text);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
#profileModal .profile-form__check-label input,
#addressModal .profile-form__check-label input,
#invoiceModal .profile-form__check-label input{
  width: 18px;
  height: 18px;
  accent-color: #0ea5e9;
}
#profileModal .profile-form__err,
#addressModal .profile-form__err,
#invoiceModal .profile-form__err{
  font-size: 12px;
  color: #dc2626;
  min-height: 18px;
  line-height: 1.4;
}
#profileModal .modal__actions--profile,
#addressModal .modal__actions--profile,
#invoiceModal .modal__actions--profile{
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid rgba(15, 23, 42, 0.06);
  gap: 12px;
}
#profileModal .modal__actions--profile .btn,
#addressModal .modal__actions--profile .btn,
#invoiceModal .modal__actions--profile .btn{
  flex: 1;
  height: 46px;
  border-radius: 10px;
  font-size: 15px;
  font-weight: 600;
}
#profileModal .btn--ghost,
#addressModal .btn--ghost,
#invoiceModal .btn--ghost,
#checkoutAddrModal .btn--ghost,
#depositContractModal .btn--ghost{
  background: #fff;
  border: 1px solid #e2e8f0;
  color: #475569;
}
#profileModal .btn--ghost:active,
#addressModal .btn--ghost:active,
#invoiceModal .btn--ghost:active,
#checkoutAddrModal .btn--ghost:active,
#depositContractModal .btn--ghost:active{
  background: #f8fafc;
}
#profileModal .btn--solid,
#addressModal .btn--solid,
#invoiceModal .btn--solid,
#checkoutAddrModal .btn--solid,
#depositContractModal .btn--solid{
  color: #fff;
  background: #0ea5e9;
  border-color: #0ea5e9;
  box-shadow: none;
}
#profileModal .btn--solid:active,
#addressModal .btn--solid:active,
#invoiceModal .btn--solid:active,
#checkoutAddrModal .btn--solid:active,
#depositContractModal .btn--solid:active{
  filter: brightness(0.96);
}

.tab__icon--svg{ display: flex; align-items: center; justify-content: center; height: 20px; }

/* ── 购物车页 ── */
.cart-empty{
  display: flex; flex-direction: column; align-items: center;
  padding: 48px 0 32px;
  gap: 14px;
}
.cart-empty__text{ font-size: 14px; color: var(--muted); }
.cart-empty__btn{ height: 40px; padding: 0 28px; font-size: 14px; display: inline-flex; align-items: center; justify-content: center; }

.cart-list{ display: flex; flex-direction: column; gap: 12px; }
.cart-item{
  display: flex; align-items: center; gap: 10px;
  padding: 12px;
  border-radius: var(--radius2);
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(15,23,42,.08);
  box-shadow: 0 6px 16px rgba(2,6,23,.05);
}
.cart-item__check{
  width: 18px; height: 18px; flex-shrink: 0;
  accent-color: var(--primary); cursor: pointer;
}
.cart-item__thumb{
  width: 72px; height: 72px; flex-shrink: 0;
  border-radius: 14px;
  background: #E2E8F0;
  position: relative;
  overflow: hidden;
}
.cart-item__thumb-img{
  width: 72px;
  height: 72px;
  object-fit: cover;
  display: block;
}
.cart-item__thumb--placeholder{
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, rgba(14,165,233,.28), rgba(37,99,235,.22));
}
.cart-item__thumb--placeholder.alt{
  background: linear-gradient(135deg, rgba(34,197,94,.24), rgba(245,158,11,.18));
}
.cart-item__body{ flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.cart-item__name{ font-size: 14px; font-weight: 700; line-height: 1.4; }
.cart-item__spec{ font-size: 13px; color: var(--muted); }
.cart-item__row{ display: flex; align-items: center; justify-content: space-between; margin-top: 4px; }
.cart-item__price{ font-size: 15px; font-weight: 900; color: #EF4444; }
.cart-item__qty{ display: flex; align-items: center; gap: 8px; }
.qty-btn{
  width: 26px; height: 26px;
  border-radius: 8px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.9);
  font-size: 16px; line-height: 1;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
}
.qty-btn:active{ background: var(--bg); }
.qty-num{ font-size: 14px; font-weight: 700; min-width: 20px; text-align: center; }

/* 结算栏 */
.cart-bar{
  position: fixed;
  left: 0; right: 0;
  bottom: 58px;
  z-index: 24;
  background: rgba(255,255,255,.96);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-top: 1px solid var(--line);
  display: flex;
  align-items: center;
  padding: 10px 16px;
  gap: 12px;
}
.cart-bar__all{
  display: flex; align-items: center; gap: 6px;
  font-size: 13px; font-weight: 700; cursor: pointer; flex-shrink: 0;
}
.cart-bar__all input{ width: 16px; height: 16px; accent-color: var(--primary); cursor: pointer; }
.cart-bar__subtotal{ flex: 1; font-size: 14px; color: var(--muted); }
.cart-bar__price{ font-size: 16px; font-weight: 900; color: #EF4444; }
.cart-bar__checkout{ height: 38px; padding: 0 20px; font-size: 14px; flex-shrink: 0; }

/* ── 亿家生活页 ── */
.life-article{
  padding: 14px;
  border-radius: var(--radius2);
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(15,23,42,.08);
  box-shadow: 0 10px 22px rgba(2,6,23,.06);
  margin-bottom: 12px;
}
.life-article__title{ font-size: 16px; font-weight: 900; line-height: 1.4; }
.life-article__meta{ font-size: 13px; color: var(--muted); margin-top: 4px; }
.life-article__desc{ font-size: 14px; color: rgba(15,23,42,.72); line-height: 1.5; margin-top: 8px; }
.life-article__row{ display: flex; align-items: center; gap: 8px; margin-top: 10px; }

.life-video{
  display: flex; gap: 12px; align-items: center;
  padding: 12px;
  border-radius: var(--radius2);
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(15,23,42,.08);
  box-shadow: 0 10px 22px rgba(2,6,23,.06);
  margin-bottom: 12px;
}
.life-video__thumb{
  width: 88px; height: 66px; flex-shrink: 0;
  border-radius: 12px;
  position: relative; overflow: hidden;
}
.life-video__play{
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  background: rgba(0,0,0,.28);
}
.life-video__duration{
  position: absolute; bottom: 4px; right: 6px;
  font-size: 11px; color: #fff; font-weight: 700;
  background: rgba(0,0,0,.45); padding: 1px 5px; border-radius: 4px;
}
.life-video__body{ flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.life-video__title{ font-size: 15px; font-weight: 800; line-height: 1.3; }
.life-video__meta{ font-size: 13px; color: var(--muted); }
.life-video__row{ display: flex; align-items: center; gap: 8px; margin-top: 4px; }
.tag--video{ background: rgba(139,92,246,.16); color: rgba(109,40,217,.95); }

/* ── 详情/播放全屏页 ── */
.detail-page{
  position: fixed;
  inset: 0;
  z-index: 40;
  background: var(--bg);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.detail-page__bar{
  position: sticky; top: 0;
  z-index: 5;
  display: flex; align-items: center; gap: 10px;
  padding: 12px 16px;
  background: rgba(246,247,251,.92);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--line);
}
.detail-back{
  width: 36px; height: 36px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.8);
  border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; cursor: pointer;
}
.detail-back:active{ transform: scale(.96); }
.detail-page__title{ font-size: 16px; font-weight: 900; }
.detail-page__body{ padding: 16px 16px 40px; }

/* 图文详情 */
.detail-article__title{ font-size: 18px; font-weight: 900; line-height: 1.35; }
.detail-article__meta{ font-size: 13px; color: var(--muted); margin-top: 6px; }
.detail-article__content{
  margin-top: 14px;
  font-size: 14px;
  line-height: 1.75;
  color: rgba(15,23,42,.82);
}
.detail-article__content img{ max-width: 100%; height: auto; border-radius: 8px; }
.detail-article__content video{
  max-width: 100%;
  max-height: 55vh;
  border-radius: 8px;
  background: #0f172a;
}
.detail-article__content h4{ font-size: 15px; font-weight: 900; margin: 16px 0 6px; }
.detail-article__content p{ margin: 0 0 10px; }

/* 视频播放 */
.video-player{ margin-bottom: 14px; }
.video-player__screen{
  width: 100%; height: 210px;
  border-radius: var(--radius2);
  position: relative; overflow: hidden;
}
.video-player__play{
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  background: rgba(0,0,0,.32);
  cursor: pointer;
}
.video-player__play:active{ background: rgba(0,0,0,.45); }
.video-player__duration{
  position: absolute; bottom: 8px; right: 10px;
  font-size: 12px; color: #fff; font-weight: 700;
  background: rgba(0,0,0,.5); padding: 2px 7px; border-radius: 6px;
}
.video-info__title{ font-size: 17px; font-weight: 900; line-height: 1.3; }
.video-info__meta{ font-size: 13px; color: var(--muted); margin-top: 6px; }
.video-info__desc{ font-size: 14px; color: rgba(15,23,42,.75); line-height: 1.7; margin-top: 12px; }

/* ── 首页科普资讯列表 ── */
.news-list{
  border-radius: var(--radius2);
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(15,23,42,.08);
  box-shadow: 0 10px 22px rgba(2,6,23,.06);
  overflow: hidden;
}
.news-item{
  display: flex; align-items: center; gap: 10px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--line);
}
.news-item:last-child{ border-bottom: none; }
.news-item:active{ background: rgba(15,23,42,.03); }
.news-item__dot{
  width: 8px; height: 8px; border-radius: 99px;
  background: var(--primary); flex-shrink: 0;
}
.news-item__dot--purple{ background: var(--purple); }
.news-item__dot--orange{ background: #f59e0b; }
.news-item__body{ flex: 1; min-width: 0; }
.news-item__title{ font-size: 16px; font-weight: 700; line-height: 1.4; }
.news-item__meta{ font-size: 13px; color: var(--muted); margin-top: 3px; }
.news-item__arrow{ font-size: 18px; color: rgba(15,23,42,.25); flex-shrink: 0; }

/* ── 亿家数智（首页商品单列卡片） ── */
.product-grid{
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}
/* 单列时封面略扁，避免整屏过长 */
.product-grid .product-card__cover{
  aspect-ratio: 16 / 10;
}
.product-card{
  border-radius: var(--radius2);
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(15,23,42,.08);
  box-shadow: 0 10px 22px rgba(2,6,23,.06);
  overflow: hidden;
}
.product-card__cover{
  width: 100%;
  aspect-ratio: 3/4;
  position: relative;
  overflow: hidden;
}
.product-card__badge{
  position: absolute; top: 8px; left: 8px;
  background: var(--primary);
  color: #fff;
  font-size: 12px; font-weight: 800;
  padding: 3px 8px; border-radius: 999px;
  z-index: 2;
}
.product-card__badge--green{ background: var(--success); }
.product-card__overlay{
  position: absolute; bottom: 0; left: 0; right: 0;
  z-index: 1;
  padding: 24px 10px 10px;
  background: linear-gradient(to top, rgba(0,0,0,.55), transparent);
}
.product-card__cover-title{
  color: #fff;
  font-size: 14px; font-weight: 900;
  line-height: 1.3;
  text-shadow: 0 1px 4px rgba(0,0,0,.4);
}
.product-card__body{
  padding: 10px 10px 12px;
  display: flex; flex-direction: column; gap: 5px;
}
.product-card__title{
  font-size: 15px; font-weight: 700;
  line-height: 1.4;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.product-card__meta{ font-size: 12px; color: var(--muted); }
.product-card__btn{
  height: 36px; border-radius: 10px;
  font-size: 13px; margin-top: 4px;
  width: 100%;
}

/* 商品卡片价格行扩展 */
.product-card__tag-row{
  display: flex; align-items: center; gap: 6px; margin-bottom: 2px;
}
.product-card__store{
  font-size: 11px; font-weight: 800;
  color: #fff;
  background: var(--success);
  padding: 1px 5px; border-radius: 4px;
}
.product-card__sold{ font-size: 12px; color: var(--muted); }
.product-card__price-row{
  display: flex; align-items: center; gap: 4px; margin-top: 4px;
}
.product-card__price{
  font-size: 15px; font-weight: 900; color: #EF4444;
}
.product-card__origin{
  font-size: 12px; color: var(--muted);
  text-decoration: line-through; flex: 1;
}
.product-card__add{
  width: 28px; height: 28px;
  border-radius: 999px;
  border: none;
  background: var(--success);
  color: #fff;
  font-size: 18px; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; flex-shrink: 0;
}
.product-card__add:active{ transform: scale(.92); }

.product-card--clickable{ cursor: pointer; }
.product-card--clickable:active{ transform: scale(.992); }
.product-card__cover-img{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  z-index: 0;
}

/* 商品详情页：简约现代 + 底部固定加购（避免长图文遮挡按钮） */
.detail-page.detail-page--product{
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: #f8fafc;
}
.detail-page.detail-page--product .detail-page__bar--product{
  flex-shrink: 0;
  background: rgba(255, 255, 255, 0.88);
  border-bottom: 1px solid rgba(148, 163, 184, 0.2);
}
.detail-page.detail-page--product .detail-page__title{
  font-weight: 700;
  font-size: 16px;
  letter-spacing: -0.02em;
  color: #0f172a;
}
.product-detail-page{
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  padding: 0;
}
.product-detail__scroll{
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 0 0 8px;
}
.product-detail__hero{
  margin: 0;
  width: 100%;
  max-height: min(72vw, 320px);
  background: #e2e8f0;
  overflow: hidden;
  border-radius: 0 0 16px 16px;
}
.product-detail__hero img{
  width: 100%;
  display: block;
  max-height: min(72vw, 320px);
  object-fit: cover;
}
.product-detail__card{
  margin: 14px 16px 0;
  padding: 16px 16px 14px;
  border-radius: 16px;
  background: #fff;
  border: 1px solid rgba(148, 163, 184, 0.18);
  box-shadow: 0 4px 20px rgba(15, 23, 42, 0.04);
}
.product-detail__head-row{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin: 0 0 6px;
}
.product-detail__head-text{
  flex: 1;
  min-width: 0;
}
.product-detail__head-row .product-detail__title{
  font-size: 19px;
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: -0.02em;
  color: #0f172a;
  margin: 0;
}
.product-detail__head-price{
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 2px;
  max-width: 42%;
  text-align: right;
}
.product-detail__head-price .product-detail__price{
  font-size: 20px;
  line-height: 1.25;
}
.product-detail__head-price .product-detail__origin{
  font-size: 13px;
}
.product-detail__sub{
  font-size: 14px;
  color: rgba(15, 23, 42, 0.55);
  line-height: 1.5;
  margin: 0 0 12px;
}
.product-detail__pricebar{
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px 12px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid rgba(241, 245, 249, 0.95);
}
.product-detail__price{
  font-size: 24px;
  font-weight: 800;
  letter-spacing: -0.03em;
  color: #0ea5e9;
}
.product-detail__origin{
  font-size: 14px;
  color: var(--muted);
  text-decoration: line-through;
}
.product-detail__origin:empty{ display: none; }
.product-detail__html{
  margin: 14px 16px 24px;
  padding: 14px 16px 18px;
  border-radius: 14px;
  background: #fff;
  border: 1px solid rgba(148, 163, 184, 0.14);
  font-size: 14px;
  line-height: 1.7;
  color: rgba(15, 23, 42, 0.82);
}
.product-detail__html img{ max-width: 100%; height: auto; border-radius: 10px; }
.product-detail__cta-bar{
  flex-shrink: 0;
  padding: 10px 16px max(12px, env(safe-area-inset-bottom, 0px));
  background: rgba(255, 255, 255, 0.92);
  border-top: 1px solid rgba(226, 232, 240, 0.95);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.product-detail__cta-btn{
  width: 100%;
  min-height: 48px;
  border-radius: 14px;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.02em;
  box-shadow: 0 8px 24px rgba(14, 165, 233, 0.28);
}
.product-detail__cta-btn:active{
  transform: scale(0.99);
}

/* ── Banner 轮播 ── */
.banner-swiper{
  position: relative;
  overflow: hidden;
  border-radius: var(--radius2);
  margin-bottom: 0;
  -webkit-touch-callout: none;
  transform: translateZ(0);
  isolation: isolate;
  contain: paint;
}
.banner-track{
  display: flex;
  transition: transform 0.4s ease;
  will-change: transform;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.banner-slide{
  min-width: 100%;
  height: 160px;
  position: relative;
  flex-shrink: 0;
}
.banner-slide--1{
  background: linear-gradient(135deg, rgba(14,165,233,.9), rgba(37,99,235,.85));
}
.banner-slide--2{
  background: linear-gradient(135deg, rgba(139,92,246,.9), rgba(37,99,235,.85));
}
.banner-slide--3{
  background: linear-gradient(135deg, rgba(34,197,94,.85), rgba(14,165,233,.85));
}
.banner-slide__img{
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  pointer-events: none;
}
.banner-slide__shade{
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(to top, rgba(0,0,0,.5), rgba(0,0,0,.12) 45%, transparent 72%);
}
/* 全屏热区：置于文案之上；内层 span 避免「空 a」在部分 WebView 中无点击区域 */
.banner-slide__hit{
  position: absolute;
  inset: 0;
  z-index: 4;
  overflow: hidden;
  cursor: pointer;
  -webkit-tap-highlight-color: rgba(0,0,0,.06);
  touch-action: manipulation;
}
.banner-slide__hit-inner{
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0;
}
.banner-slide__content{
  position: absolute;
  bottom: 24px; left: 20px;
  z-index: 3;
  pointer-events: none;
  color: #fff;
}
.banner-slide__title{
  font-size: 24px; font-weight: 900;
  text-shadow: 0 2px 8px rgba(0,0,0,.2);
}
.banner-slide__desc{
  font-size: 14px; opacity: .9; margin-top: 4px;
}
.banner-dots{
  position: absolute;
  bottom: 10px; left: 50%;
  transform: translateX(-50%);
  display: flex; gap: 6px;
  z-index: 5;
  pointer-events: none;
}
.banner-dot{
  width: 6px; height: 6px; border-radius: 99px;
  background: rgba(255,255,255,.5);
  transition: width .3s, background .3s;
  pointer-events: auto;
  cursor: pointer;
}
.banner-dot.active{
  width: 18px;
  background: #fff;
}

/* 首页服务包：去掉 home-service-packages--hidden 即可恢复 */
.home-service-packages--hidden{
  display: none !important;
}

/* 我的 — 自购订单列表 / 详情 */
.mine-order-page{
  padding-bottom: calc(24px + env(safe-area-inset-bottom, 0px));
}
.mine-order-page__hint{
  font-size: 13px;
  line-height: 1.55;
  padding: 12px 4px 4px;
  margin: 0;
}
.mine-order-page__content{
  min-height: 120px;
}
.mine-order-list{
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding-top: 8px;
}
.mine-order-card{
  background: var(--card);
  border-radius: var(--radius2);
  box-shadow: var(--shadow);
  padding: 14px 16px;
  border: 1px solid var(--line);
}
.mine-order-card__title{
  font-weight: 700;
  font-size: 15px;
  color: var(--text);
  line-height: 1.35;
}
.mine-order-card__meta{
  font-size: 12px;
  color: var(--muted);
  margin-top: 6px;
}
.mine-order-card__row{
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 10px;
  gap: 8px;
}
.mine-order-card__no{
  font-size: 12px;
  color: var(--muted);
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mine-order-card__amt{
  font-weight: 800;
  font-size: 17px;
  color: var(--primary2);
  flex-shrink: 0;
}
.mine-order-card__actions{
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 12px;
  flex-wrap: wrap;
}
.btn--sm{
  padding: 6px 12px;
  font-size: 13px;
  border-radius: 10px;
}
.mine-order-detail__head{
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
  margin-bottom: 12px;
}
.mine-order-detail__head-top{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.mine-order-detail__head-left{
  flex: 1;
  min-width: 0;
}
.mine-order-detail__head-right{
  flex-shrink: 0;
  max-width: 45%;
  text-align: right;
}
.mine-order-detail__head-right .mine-order-detail__status{
  max-width: 100%;
  word-break: break-word;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1.2;
  min-height: 32px;
  height: auto;
  padding: 0 10px;
  box-sizing: border-box;
}
.mine-order-detail__amount{
  font-size: 26px;
  font-weight: 900;
  color: var(--primary2);
  line-height: 1.15;
}
.mine-order-detail__meta{
  font-size: 12px;
  margin-top: 6px;
  line-height: 1.35;
}
.mine-order-detail__paid{
  font-size: 12px;
  margin-top: 6px;
}
.mine-order-detail__ship{
  font-size: 12px;
  margin-top: 6px;
  line-height: 1.5;
  white-space: pre-wrap;
  word-break: break-word;
}
.mine-order-detail__status{
  margin-top: 0;
  /* 与 .tag 合并使用时勿用 inline-block，否则覆盖 flex 导致徽标内文字不垂直居中 */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1.2;
  box-sizing: border-box;
  vertical-align: middle;
}
.mine-order-detail__lines{
  list-style: none;
  margin: 0;
  padding: 0;
}
.mine-order-detail__lines > li{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
  font-size: 14px;
}
.mine-order-detail__lines > li.mine-order-line__spec{
  display: flex;
  align-items: center;
  min-height: 48px;
  padding: 0 0;
  margin-top: 0;
  font-size: 12px;
  line-height: 1.5;
  border-bottom: 1px solid var(--line);
  box-sizing: border-box;
}
.mine-order-line__name{
  flex: 1;
  min-width: 0;
}
.mine-order-line__qty{
  color: var(--muted);
  font-size: 13px;
  flex-shrink: 0;
}
.mine-order-line__amt{
  font-weight: 700;
  flex-shrink: 0;
}
.mine-order-detail__foot{
  margin-top: 20px;
  padding-top: 4px;
}
.mine-order-detail__foot--split{
  display: flex;
  gap: 10px;
}
.mine-order-detail__foot--split .btn{
  flex: 1;
  min-width: 0;
  width: auto;
}
.mine-order-detail__pay{
  width: 100%;
}
.mine-order-detail__foot--split .mine-order-detail__pay{
  width: auto;
}
.mine-order-detail__confirm{
  width: 100%;
}
.mine-order-detail__refund{
  width: 100%;
}

/* 我的 — 收货地址 / 发票 / 反馈（静态子页） */
.mine-subpage{
  padding-bottom: calc(28px + env(safe-area-inset-bottom, 0px));
  max-width: 560px;
  margin: 0 auto;
}
.mine-subpage__hint{
  font-size: 13px;
  line-height: 1.55;
  margin: 0 0 16px;
}
.mine-subpage__divider{
  height: 1px;
  background: var(--line);
  margin: 20px 0 16px;
}
.mine-subpage__section-title{
  font-size: 15px;
  font-weight: 800;
  color: var(--text);
  margin: 0 0 12px;
}
.mine-subpage__submit{
  width: 100%;
  margin-top: 16px;
}
.mine-addr-list{
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.mine-addr-card{
  background: var(--card);
  border-radius: var(--radius2);
  border: 1px solid var(--line);
  padding: 14px 16px;
  box-shadow: var(--shadow);
}
.mine-addr-card--default{
  border-color: rgba(14, 165, 233, 0.35);
}
.mine-addr-card__top{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 12px;
}
.mine-addr-card__name{
  font-weight: 800;
  font-size: 16px;
}
.mine-addr-card__phone{
  font-size: 14px;
  color: var(--muted);
}
.mine-addr-card__tag{
  margin-left: auto;
}
.mine-addr-card__addr{
  font-size: 13px;
  line-height: 1.5;
  color: var(--text);
  margin-top: 10px;
}
.mine-addr-card__actions{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
  justify-content: flex-end;
}
.mine-form-stack{
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.mine-form-stack__label{
  font-size: 13px;
  font-weight: 600;
  color: var(--muted);
  margin-top: 8px;
}
.mine-form-stack__label:first-child{
  margin-top: 0;
}
.mine-form-stack__req{
  color: #EF4444;
}
.mine-form-stack__input{
  width: 100%;
  flex: none;
  height: 44px;
}
.mine-form-stack__textarea{
  width: 100%;
  flex: none;
  height: auto;
  min-height: 88px;
  padding: 10px 12px;
  resize: vertical;
  line-height: 1.45;
}

/* 投诉与反馈 — 多图上传（风格参考后台资讯封面区，适配 H5） */
.fb-upload__lead{
  font-size: 12px;
  line-height: 1.5;
  margin: 0 0 10px;
}
.fb-upload{
  position: relative;
}
.fb-upload__file{
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.fb-upload__grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 10px;
}
@media (min-width: 400px){
  .fb-upload__grid{
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
.fb-upload__thumb{
  position: relative;
  aspect-ratio: 1;
  border-radius: 12px;
  overflow: hidden;
  background: rgba(248, 250, 252, 0.95);
  border: 1px solid rgba(148, 163, 184, 0.35);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8) inset;
}
.fb-upload__thumb--busy::after{
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.35);
  pointer-events: none;
}
.fb-upload__img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  vertical-align: top;
}
.fb-upload__spinner{
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  font-size: 11px;
  font-weight: 700;
  color: #fff;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
  pointer-events: none;
  white-space: nowrap;
}
.fb-upload__del{
  position: absolute;
  top: 4px;
  right: 4px;
  width: 22px;
  height: 22px;
  border: none;
  border-radius: 999px;
  padding: 0;
  line-height: 1;
  font-size: 16px;
  font-weight: 700;
  color: #fff;
  background: rgba(15, 23, 42, 0.55);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  -webkit-tap-highlight-color: transparent;
  z-index: 2;
}
.fb-upload__del:active{
  background: rgba(220, 38, 38, 0.85);
}
.fb-upload__add{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  width: 100%;
  min-height: 52px;
  margin-bottom: 6px;
  border-radius: 12px;
  border: 1px dashed rgba(59, 130, 246, 0.45);
  background: rgba(239, 246, 255, 0.65);
  color: #1d4ed8;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: border-color 0.15s ease, background 0.15s ease;
}
.fb-upload__add:hover,
.fb-upload__add:focus-visible{
  border-color: rgba(37, 99, 235, 0.75);
  background: rgba(219, 234, 254, 0.9);
  outline: none;
}
.fb-upload--full .fb-upload__add{
  display: none;
}
.fb-upload__add-plus{
  font-size: 22px;
  font-weight: 300;
  line-height: 1;
  opacity: 0.88;
}
.fb-upload__add-txt{
  letter-spacing: 0.04em;
}
.fb-upload__cap{
  font-size: 11px;
  margin: 0;
  text-align: right;
}
.mine-form-stack__check{
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  margin-top: 10px;
  cursor: pointer;
}
.mine-form-stack__check input{
  width: 18px;
  height: 18px;
}
.mine-form-stack__counter{
  font-size: 12px;
  text-align: right;
  margin-top: 2px;
}
.mine-invoice-list{
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.mine-invoice-card{
  background: var(--card);
  border-radius: var(--radius2);
  border: 1px solid var(--line);
  padding: 14px 16px;
  box-shadow: var(--shadow);
}
.mine-invoice-card--default{
  border-color: rgba(14, 165, 233, 0.35);
}
.mine-invoice-card__type{
  font-size: 12px;
  color: var(--primary2);
  font-weight: 700;
  margin-bottom: 6px;
}
.mine-invoice-card__top{
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 8px 12px;
}
.mine-invoice-card__top .mine-invoice-card__title{
  flex: 1;
  min-width: 0;
  font-size: 16px;
  font-weight: 800;
  line-height: 1.35;
}
.mine-invoice-card__default{
  margin-left: auto;
  flex-shrink: 0;
}
.mine-invoice-card__meta{
  font-size: 12px;
  margin-top: 8px;
}
.mine-invoice-card__actions{
  margin-top: 12px;
  display: flex;
  justify-content: flex-end;
}

/* 推荐码页 */
.mine-referral .mine-referral__qr-wrap{
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 14px 12px;
  margin: 0 0 6px;
  background: #fff;
  border-radius: var(--radius2);
  border: 1px solid var(--line);
  min-height: 120px;
}
.mine-referral .mine-referral__qr-wrap canvas,
.mine-referral .mine-referral__qr-wrap img{
  display: block;
  max-width: 220px;
  height: auto;
}

/* 履约保证金合约弹窗 */
.deposit-contract .modal__title{
  font-size: 14px;
  line-height: 1.45;
  font-weight: 700;
  padding-right: 6px;
}
.deposit-contract .deposit-contract__scroll{
  max-height: min(52vh, 420px);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  margin-top: 8px;
  padding: 4px 2px 8px;
  font-size: 13px;
  line-height: 1.6;
  color: rgba(15, 23, 42, 0.82);
}
.deposit-contract .deposit-contract__scroll p{
  margin: 0 0 10px;
}
.deposit-contract .deposit-contract__scroll h3{
  margin: 14px 0 8px;
  font-size: 13px;
  font-weight: 800;
  color: #0f172a;
}
.deposit-contract .deposit-contract__scroll h3:first-of-type{
  margin-top: 4px;
}
.deposit-contract .deposit-contract__scroll ul{
  margin: 0 0 10px;
  padding-left: 1.15em;
}
.deposit-contract .deposit-contract__scroll li{
  margin-bottom: 6px;
}
.deposit-contract .deposit-contract__scroll .deposit-contract__lead{
  font-weight: 600;
  color: #0f172a;
}
.deposit-contract #depositContractErr{
  margin-top: 0;
}

/* 商品详情：数量 + 服务包 */
.product-detail__qty-row{
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 12px;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(248, 250, 252, 0.95);
  border: 1px solid rgba(148, 163, 184, 0.25);
}
.product-detail__qty-label{
  font-size: 14px;
  font-weight: 700;
  color: var(--text);
}
.product-detail__qty-ctrl{
  display: flex;
  align-items: center;
  gap: 10px;
}
.product-detail__qty-ctrl .qty-btn{
  width: 34px;
  height: 34px;
  border-radius: 10px;
  border: 1px solid rgba(148, 163, 184, 0.45);
  background: #fff;
  font-size: 18px;
  line-height: 1;
  font-weight: 700;
  color: var(--text);
}
.product-detail__service{
  margin-top: 12px;
  padding: 12px;
  border-radius: 12px;
  border: 1px solid rgba(59, 130, 246, 0.22);
  background: rgba(239, 246, 255, 0.55);
}
.product-detail__service-title{
  font-size: 13px;
  font-weight: 800;
  color: #1e40af;
  margin: 0 0 8px;
}
.product-detail__service-hint{
  font-size: 12px;
  color: rgba(15, 23, 42, 0.65);
  margin: 0 0 10px;
  line-height: 1.45;
}
.product-detail__sp-pick-count{
  font-size: 12px;
  font-weight: 600;
  color: #475569;
  margin: -4px 0 10px;
}
.product-detail__sp-radio{
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.product-detail__sp-radio label{
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  cursor: pointer;
}
/* 商品详情：服务包标签（选中右上角绿圈对勾） */
.product-detail__sp-slot{
  margin-bottom: 14px;
}
.product-detail__sp-slot:last-child{
  margin-bottom: 0;
}
.product-detail__sp-slot-label{
  display: block;
  font-size: 12px;
  font-weight: 700;
  color: #64748b;
  margin: 0 0 8px;
  letter-spacing: 0.02em;
}
.product-detail__sp-tags{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.product-detail__sp-tag{
  position: relative;
  appearance: none;
  -webkit-appearance: none;
  border: 1.5px solid rgba(148, 163, 184, 0.52);
  background: #fff;
  border-radius: 999px;
  padding: 9px 30px 9px 14px;
  font-size: 13px;
  line-height: 1.35;
  color: #0f172a;
  cursor: pointer;
  text-align: left;
  transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease, color 0.15s ease;
  max-width: 100%;
}
.product-detail__sp-tag:active{
  transform: scale(0.98);
}
.product-detail__sp-tag__text{
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 70vw;
}
.product-detail__sp-tag__mark{
  position: absolute;
  top: -5px;
  right: -4px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #22c55e;
  box-shadow: 0 2px 6px rgba(15, 23, 42, 0.16);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transform: scale(0.65);
  transition: opacity 0.18s ease, transform 0.2s cubic-bezier(0.34, 1.45, 0.64, 1);
  pointer-events: none;
}
.product-detail__sp-tag.is-selected .product-detail__sp-tag__mark{
  opacity: 1;
  transform: scale(1);
}
.product-detail__sp-tag.is-selected{
  border-color: rgba(14, 165, 233, 0.7);
  background: rgba(14, 165, 233, 0.1);
  box-shadow: 0 0 0 1px rgba(14, 165, 233, 0.15);
  color: #0369a1;
}
.product-detail__sp-tag.product-detail__sp-tag--disabled{
  opacity: 0.4;
  cursor: not-allowed;
  pointer-events: none;
}
.product-detail__sp-tag__tick{
  display: block;
}

/* 结算选地址 */
.checkout-addr-list{
  max-height: 46vh;
  overflow-y: auto;
  margin-top: 4px;
}
.checkout-addr-item{
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px 10px;
  border-radius: 12px;
  border: 1px solid rgba(148, 163, 184, 0.28);
  margin-bottom: 8px;
  cursor: pointer;
  background: #fff;
}
.checkout-addr-item.is-selected{
  border-color: rgba(14, 165, 233, 0.55);
  background: rgba(239, 246, 255, 0.65);
}
.checkout-addr-item__main{
  flex: 1;
  min-width: 0;
  font-size: 13px;
  line-height: 1.45;
}
.checkout-addr-item__tag{
  font-size: 11px;
  font-weight: 800;
  color: #0369a1;
  margin-top: 4px;
}

/* 市场成员（表格） */
.market-member-table-scroll{
  margin: 8px 0 16px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border-radius: 12px;
  border: 1px solid rgba(148, 163, 184, 0.28);
  background: #fff;
}
.market-member-table{
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
  min-width: 280px;
}
.market-member-table thead th{
  text-align: left;
  padding: 10px 12px;
  background: rgba(241, 245, 249, 0.9);
  color: #475569;
  font-weight: 700;
  font-size: 12px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.28);
  white-space: nowrap;
}
.market-member-table__th-act,
.market-member-table__act{
  text-align: center;
  width: 90px;
  min-width: 90px;
}
.market-member-table tbody td{
  padding: 12px;
  border-bottom: 1px solid rgba(226, 232, 240, 0.9);
  vertical-align: middle;
  color: #0f172a;
}
.market-member-table tbody tr:last-child td{
  border-bottom: none;
}
tr.market-member-row{
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
tr.market-member-row:active{
  background: rgba(239, 246, 255, 0.85);
}
tr.market-member-row:focus{
  outline: 2px solid rgba(14, 165, 233, 0.45);
  outline-offset: -2px;
}
.market-member-row__go{
  pointer-events: none;
  white-space: nowrap;
  min-width: 0;
  box-sizing: border-box;
}

/* 我的 — 我的业绩 */
.mine-perf__month-row{
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 4px;
}
.mine-perf__month-label{
  font-size: 12px;
  font-weight: 800;
  color: var(--muted);
  white-space: nowrap;
}
.mine-perf__select{
  flex: 1;
  min-width: 0;
  height: 44px;
  border-radius: 12px;
  border: 1px solid var(--line);
  padding: 0 12px;
  font-size: 15px;
  font-weight: 700;
  background-color: var(--card);
  color: var(--text);
  box-shadow: var(--shadow);
  -webkit-appearance: none;
  appearance: none;
  background-image: linear-gradient(45deg, transparent 50%, #64748b 50%),
    linear-gradient(135deg, #64748b 50%, transparent 50%);
  background-position: calc(100% - 18px) calc(50% + 3px), calc(100% - 13px) calc(50% + 3px);
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
}
.mine-perf__select:focus{
  outline: none;
  border-color: rgba(14, 165, 233, 0.55);
  box-shadow: 0 0 0 3px rgba(14, 165, 233, 0.18);
}
.mine-perf__period{
  font-size: 12px;
  font-weight: 600;
  margin: 0 0 16px;
  color: #64748b;
}
.mine-perf__stat-grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 8px;
}
@media (max-width: 360px){
  .mine-perf__stat-grid{
    grid-template-columns: 1fr;
  }
}
.mine-perf__stat-card{
  background: var(--card);
  border: 1px solid rgba(148, 163, 184, 0.2);
  border-radius: 16px;
  padding: 14px 12px;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.05);
  text-align: center;
}
.mine-perf__stat-card--accent{
  border-color: rgba(14, 165, 233, 0.35);
  background: linear-gradient(180deg, rgba(240, 249, 255, 0.9), #fff 48%);
  box-shadow: 0 8px 24px rgba(2, 132, 199, 0.08);
}
.mine-perf__stat-lab{
  font-size: 12px;
  font-weight: 800;
  color: #64748b;
  margin-bottom: 6px;
  letter-spacing: -0.01em;
}
.mine-perf__stat-val{
  font-size: 20px;
  font-weight: 900;
  color: #0f172a;
  letter-spacing: -0.03em;
  line-height: 1.15;
}
.mine-perf__section{
  margin-top: 20px;
}
.mine-perf__block-title{
  font-size: 15px;
  font-weight: 900;
  color: #0f172a;
  margin: 0 0 2px;
  letter-spacing: -0.02em;
}
.mine-perf__block-title--legacy{
  margin-bottom: 8px;
}

/* 推广奖励：新表格样式 */
.mine-perf__table-wrap--rewards{
  border-radius: 16px;
  border: 1px solid rgba(148, 163, 184, 0.22);
  background: #fff;
  box-shadow: 0 4px 18px rgba(15, 23, 42, 0.04);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.mine-perf__table--rewards{
  width: 100%;
  min-width: 260px;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 12px;
}
.mine-perf__table--rewards thead th{
  position: sticky;
  top: 0;
  z-index: 1;
  text-align: left;
  padding: 11px 10px;
  background: #f8fafc;
  color: #475569;
  font-size: 11px;
  font-weight: 800;
  text-transform: none;
  border-bottom: 1px solid rgba(226, 232, 240, 0.9);
  white-space: nowrap;
}
.mine-perf__table--rewards tbody td{
  padding: 11px 10px;
  border-bottom: 1px solid rgba(241, 245, 249, 0.9);
  vertical-align: top;
  color: #0f172a;
  font-size: 12px;
}
.mine-perf__table--rewards tbody tr:last-child td{
  border-bottom: none;
}
.mine-perf__table--rewards tbody td:nth-child(2),
.mine-perf__table--rewards thead th:nth-child(2){
  white-space: nowrap;
}
/* 销售佣金（明细）：原样保留 */
.mine-perf__section--sales .mine-perf__table-wrap{
  overflow-x: auto;
  border-radius: var(--radius2);
  border: 1px solid var(--line);
  background: var(--card);
  box-shadow: var(--shadow);
}
.mine-perf__section--sales .mine-perf__table{
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}
.mine-perf__section--sales .mine-perf__table thead th{
  text-align: left;
  padding: 10px 10px;
  background: rgba(241, 245, 249, 0.95);
  color: #475569;
  font-weight: 800;
  white-space: nowrap;
  border-bottom: 1px solid rgba(148, 163, 184, 0.25);
}
.mine-perf__section--sales .mine-perf__table tbody td{
  padding: 10px;
  border-bottom: 1px solid rgba(226, 232, 240, 0.95);
  color: var(--text);
  vertical-align: middle;
}
.mine-perf__section--sales .mine-perf__table tbody tr:last-child td{
  border-bottom: none;
}
.mine-perf__empty{
  text-align: center;
  color: var(--muted);
  padding: 16px 10px !important;
}
.mine-perf__tag{
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 999px;
  background: #f1f5f9;
  color: #64748b;
}
.mine-perf__tag--ok{
  background: rgba(16, 185, 129, 0.12);
  color: #047857;
}
.mine-perf__tag--pend{
  background: rgba(245, 158, 11, 0.15);
  color: #b45309;
}
