*{box-sizing:border-box}
.phone{background:#f4f5f7}
.bar{height:48px;background:#17181d;color:#fff;display:flex;align-items:center;justify-content:center;position:relative}
.bar b{font-size:17px}
.back,.cs{position:absolute;top:0;height:48px;width:48px;display:grid;place-items:center;color:#fff;text-decoration:none;font-size:28px}
.back{left:0}
.cs{right:4px;font-size:18px}
.list{padding:12px}
.banner{display:block;position:relative;height:132px;border-radius:12px;margin-bottom:12px;overflow:hidden;text-decoration:none;color:#fff;padding:16px 18px;box-shadow:0 8px 18px #0002}
.banner strong{display:block;font-size:22px;line-height:1.2}
.banner small{display:block;margin-top:6px;opacity:.9}
.banner em{position:absolute;right:10px;bottom:8px;font-style:normal;font-size:11px;color:#ddd;background:#0006;border-radius:10px;padding:2px 8px}
.invite{background:linear-gradient(90deg,#3a1a6a,#6b3ad1 55%,#f0b4ff)}
.wallet{background:linear-gradient(120deg,#04261c,#0b3 40%,#123)}
.wallet strong{font-size:20px}
.vip{background:linear-gradient(90deg,#140c04,#6a4a12 45%,#c9a227);min-height:148px}
.vip .brand{display:block;font-size:12px;letter-spacing:2px;color:#f3d48a}
.vip strong{font-size:24px;margin-top:4px}
.vip b{display:block;font-size:34px;color:#ffe082;margin-top:4px}
.vip b em{font-size:16px;font-style:normal;margin-left:4px;color:#ffe082}
.rebate{background:linear-gradient(90deg,#3a1208,#8a3a12 50%,#1a0a08)}
.rebate b{display:block;font-size:26px;color:#ffd36a;margin-top:4px}