/* 威软助手 H5 · 会员中心（暖金编辑风 · 分段切换） */
.mb{
  --mb-gold: oklch(76% 0.12 80);
  --mb-gold-deep: oklch(60% 0.13 68);
  --mb-gold-soft: oklch(95% 0.045 82);
  --mb-ink: oklch(28% 0.02 65);
  --mb-ink-2: oklch(48% 0.015 65);
  --mb-ink-3: oklch(64% 0.012 65);
  --mb-line: oklch(92% 0.012 78);
  --mb-bg: oklch(97% 0.008 80);
  --mb-card: #fff;
  --mb-ease: cubic-bezier(0.22,1,0.36,1);
  --mb-radius: 16px;
}
.mb :focus-visible{outline:2px solid var(--mb-gold-deep);outline-offset:2px;}

/* ── Hero 身份卡 ── */
.mb .mb-hero{position:relative;border-radius:20px;padding:18px 18px 16px;margin-bottom:14px;overflow:hidden;
  background:linear-gradient(135deg, oklch(34% 0.045 62), oklch(22% 0.03 52));
  color:#fff;box-shadow:0 10px 30px rgba(80,55,10,.18);}
.mb .mb-hero::after{content:"";position:absolute;right:-50px;top:-60px;width:180px;height:180px;border-radius:50%;
  background:radial-gradient(circle, var(--mb-gold) 0%, transparent 68%);opacity:.4;pointer-events:none;}
.mb .mb-hero-top{display:flex;align-items:center;gap:12px;position:relative;}
.mb .mb-hero-badge{width:54px;height:54px;border-radius:16px;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:26px;
  background:linear-gradient(135deg,var(--mb-gold),var(--mb-gold-deep));box-shadow:0 6px 16px rgba(0,0,0,.32);}
.mb .mb-hero-meta{flex:1;min-width:0;}
.mb .mb-hero-name{font-size:18px;font-weight:800;letter-spacing:.4px;display:flex;align-items:center;gap:6px;}
.mb .mb-hero-name .mb-exp{color:#ffd28a;font-size:12px;font-weight:700;}
.mb .mb-hero-sub{font-size:13px;color:oklch(86% 0.02 78);margin-top:3px;}
.mb .mb-hero-sub b{color:var(--mb-gold);font-size:15px;font-variant-numeric:tabular-nums;}
.mb .mb-hero-tag{margin-left:auto;font-size:11px;font-weight:800;color:#3a2a00;background:linear-gradient(135deg,var(--mb-gold),var(--mb-gold-deep));
  padding:4px 10px;border-radius:20px;white-space:nowrap;}
.mb .mb-hero-foot{margin-top:14px;font-size:12px;color:oklch(82% 0.02 78);display:flex;align-items:center;gap:6px;position:relative;}
.mb .mb-hero-foot b{color:#fff;font-weight:700;font-variant-numeric:tabular-nums;}
.mb .mb-hero-notice{margin-top:12px;font-size:12px;color:#ffe2b0;background:rgba(255,180,80,.14);border:1px solid rgba(255,190,90,.3);
  border-radius:10px;padding:8px 10px;position:relative;line-height:1.5;}

/* ── 分段切换 ── */
.mb .mb-tabs{position:relative;display:flex;background:var(--mb-bg);border:1px solid var(--mb-line);border-radius:13px;padding:4px;margin-bottom:14px;}
.mb .mb-tab{flex:1;border:none;background:transparent;padding:10px;font-size:14px;font-weight:700;color:var(--mb-ink-2);cursor:pointer;position:relative;z-index:1;border-radius:9px;transition:color .2s var(--mb-ease);}
.mb .mb-tab.active{color:var(--mb-ink);}
.mb .mb-tab-ink{position:absolute;top:4px;left:4px;height:calc(100% - 8px);width:calc(50% - 4px);background:#fff;border-radius:9px;box-shadow:0 2px 8px rgba(60,40,5,.1);transition:transform .28s var(--mb-ease);}
.mb .mb-tabs[data-active="pts"] .mb-tab-ink{transform:translateX(100%);}

/* ── 面板 ── */
.mb .mb-panel{animation:mbFade .3s var(--mb-ease);}
.mb .mb-panel[hidden]{display:none;}
@keyframes mbFade{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}

/* ── 档位卡 ── */
.mb .mb-tiers{display:flex;flex-direction:column;gap:12px;}
.mb .mb-tier{position:relative;background:var(--mb-card);border:1px solid var(--mb-line);border-radius:var(--mb-radius);padding:16px;overflow:hidden;
  animation:mbUp .42s var(--mb-ease) backwards;animation-delay:calc(var(--i,0)*60ms);}
.mb .mb-tier.flag{border-color:var(--mb-gold);box-shadow:0 10px 26px rgba(200,150,30,.16);}
.mb .mb-tier.flag::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(var(--mb-gold),var(--mb-gold-deep));}
.mb .mb-tier-flag{position:absolute;top:0;right:0;background:linear-gradient(135deg,var(--mb-gold),var(--mb-gold-deep));color:#3a2a00;font-size:11px;font-weight:800;padding:4px 11px;border-bottom-left-radius:13px;}
.mb .mb-tier-head{display:flex;align-items:center;gap:8px;}
.mb .mb-tier-icon{font-size:24px;line-height:1;}
.mb .mb-tier-name{font-size:17px;font-weight:800;color:var(--mb-ink);}
.mb .mb-tier-price{font-size:27px;font-weight:800;color:var(--mb-gold-deep);margin-top:7px;font-variant-numeric:tabular-nums;letter-spacing:-.5px;}
.mb .mb-tier-price small{font-size:13px;font-weight:600;color:var(--mb-ink-3);margin-left:3px;letter-spacing:0;}
.mb .mb-tier-pts{font-size:12px;color:var(--mb-gold-deep);margin-top:3px;font-weight:700;}
.mb .mb-tier-feats{list-style:none;padding:0;margin:13px 0 0;display:flex;flex-direction:row;flex-wrap:wrap;gap:8px 14px;}
.mb .mb-tier-feats li{font-size:12.5px;color:var(--mb-ink-2);display:flex;align-items:center;gap:6px;line-height:1.35;flex:1 1 42%;min-width:0;}
.mb .mb-tier-feats li::before{content:"✓";color:var(--mb-gold-deep);font-weight:800;font-size:13px;flex-shrink:0;}
.mb .mb-tier-btn{margin-top:15px;}
.mb .mb-tier-btn.is-loading{opacity:.65;pointer-events:none;}
.mb .mb-tier-btn .mb-spin{display:inline-block;width:14px;height:14px;border:2px solid rgba(255,255,255,.5);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite;vertical-align:-2px;margin-right:6px;}

/* ── 积分充值 ── */
.mb .mb-pts-intro{font-size:13px;color:var(--mb-ink-2);background:var(--mb-gold-soft);border:1px solid oklch(90% 0.04 82);border-radius:11px;padding:11px 13px;margin:0 0 14px;line-height:1.6;}
.mb .mb-pts-intro b{color:var(--mb-gold-deep);}
.mb .mb-reches{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;}
.mb .mb-rech{background:var(--mb-card);border:1px solid var(--mb-line);border-radius:14px;padding:14px 6px;display:flex;flex-direction:column;align-items:center;gap:3px;cursor:pointer;
  transition:transform .12s var(--mb-ease),border-color .15s,box-shadow .15s,background .15s;}
.mb .mb-rech:active{transform:scale(.96);}
.mb .mb-rech.sel{border-color:var(--mb-gold);box-shadow:0 6px 16px rgba(200,150,30,.14);background:var(--mb-gold-soft);}
.mb .mb-rech-pts{font-size:19px;font-weight:800;color:var(--mb-ink);font-variant-numeric:tabular-nums;}
.mb .mb-rech-price{font-size:12px;color:var(--mb-ink-3);}
.mb .mb-rech-val{font-size:11px;color:var(--mb-gold-deep);font-weight:700;}
.mb .mb-rech-custom{display:flex;gap:8px;margin-top:12px;}
.mb .mb-rech-custom .m-input{flex:1;}

/* ── 订单 ── */
.mb .mb-orders-block{margin-top:20px;}
.mb .mb-orders-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;}
.mb .mb-orders-head h3{font-size:15px;font-weight:800;color:var(--mb-ink);margin:0;letter-spacing:.3px;}
.mb .mb-orders-toggle{border:none;background:transparent;color:var(--mb-gold-deep);font-size:13px;font-weight:700;cursor:pointer;padding:4px 6px;}
.mb .mb-orders{display:flex;flex-direction:column;gap:8px;}
.mb .mb-order{display:flex;align-items:center;gap:10px;background:var(--mb-card);border:1px solid var(--mb-line);border-radius:13px;padding:12px 14px;}
.mb .mb-order-main{flex:1;min-width:0;}
.mb .mb-order-title{font-size:14px;font-weight:700;color:var(--mb-ink);}
.mb .mb-order-sub{font-size:12px;color:var(--mb-ink-3);margin-top:3px;}
.mb .mb-order-no{font-size:11px;color:var(--mb-ink-3);margin-top:4px;word-break:break-all;}
.mb .mb-order-time{font-size:11px;color:var(--mb-ink-2);margin-top:2px;}
.mb .mb-order-pay{padding:.45rem .9rem;font-size:13px;flex-shrink:0;}
.mb .mb-orders.collapsed .mb-order:nth-child(n+4){display:none;}
.mb .mb-empty{text-align:center;color:var(--mb-ink-3);padding:1.6rem 1rem;font-size:13px;}

@keyframes mbUp{from{opacity:0;transform:translateY(12px);}to{opacity:1;transform:none;}}
@media (prefers-reduced-motion:reduce){
.mb .mb-tier,.mb .mb-panel{animation:none;}
.mb .mb-tab-ink{transition:none;}
}