/* 宝措卤阳(R) 官方商城 · 会员中心样式 ------------------------------------------------------------ 沿用品牌视觉：曜石黑 / 象牙白 / 砂金 / 青灰，忌正红（火）、翠绿（木）。 只服务 member.asp 一页，故所有类名统一 mb- 前缀，避免与 shop.css 打架。 方向：左侧深色礼仪面板 + 右侧象牙白表单；登录后切换为「侧栏 + 面板」结构。 ------------------------------------------------------------ */ /* 页头「会员登录」入口的样式在 assets/shop.css 里（它是全站页头的一部分， 不能只挂在会员页的样式表上）。本文件只管 member.asp 版心内的东西。 */ /* ============================ 通用壳 ============================ */ .mb-wrap{max-width:1180px;margin:0 auto;padding:42px 20px 76px} .mb-crumbs{font-size:12px;letter-spacing:1px;color:var(--sub);margin-bottom:22px} .mb-crumbs a:hover{color:var(--gold-d)} .mb-crumbs i{font-style:normal;margin:0 8px;color:var(--line)} .mb-hide{display:none !important} /* 按钮（比 shop.css 的 .btn 更紧凑，用于面板内部） */ .mb-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px; padding:11px 26px;background:var(--ink);color:#fff;border:1px solid var(--ink);cursor:pointer; font-family:var(--sans);font-size:13px;letter-spacing:2px;transition:all .28s;line-height:1} .mb-btn:hover{background:var(--gold);border-color:var(--gold)} .mb-btn-g{background:transparent;color:var(--ink)} .mb-btn-g:hover{background:var(--ink);color:#fff;border-color:var(--ink)} .mb-btn:disabled{opacity:.42;pointer-events:none} .mb-btn-sm{padding:7px 16px;font-size:12px;letter-spacing:1px} .mb-btn-lk{background:none;border:none;color:var(--gold-d);cursor:pointer;font-size:12px; letter-spacing:1px;padding:2px 0;font-family:var(--sans)} .mb-btn-lk:hover{color:var(--ink);text-decoration:underline} /* ============================ 未登录：登录 / 注册 ============================ */ .mb-auth{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr); border:1px solid var(--line);background:#fff;box-shadow:0 22px 60px rgba(27,24,19,.07);overflow:hidden} .mb-auth-v{position:relative;padding:54px 48px 46px;color:#f4efe4;overflow:hidden; background:linear-gradient(158deg,#1b1813 0%,#2a241b 52%,#3b3226 100%);display:flex;flex-direction:column} .mb-auth-v::before{content:"";position:absolute;width:420px;height:420px;right:-170px;top:-160px;border-radius:50%; background:radial-gradient(circle,rgba(168,131,79,.34),transparent 66%)} .mb-auth-v::after{content:"";position:absolute;left:48px;right:48px;bottom:0;height:1px; background:linear-gradient(90deg,transparent,rgba(168,131,79,.55),transparent)} .mb-auth-v>*{position:relative;z-index:1} .mb-v-en{font-family:var(--serif);font-size:10px;letter-spacing:5px;color:#c6a877;text-transform:uppercase} .mb-v-logo{font-family:var(--serif);font-size:25px;letter-spacing:5px;margin:14px 0 6px} .mb-v-slo{font-size:12px;letter-spacing:3px;color:#a99f8c} .mb-v-h{font-family:var(--serif);font-size:19px;letter-spacing:3px;margin:34px 0 20px;color:#f0e7d7} .mb-v-list{list-style:none;display:grid;gap:15px} .mb-v-list li{display:flex;gap:12px;align-items:flex-start;font-size:12.5px;line-height:1.65;color:#cfc6b4} .mb-v-list b{color:#f2e9d9;font-weight:600;letter-spacing:.5px} .mb-v-ic{flex:0 0 auto;width:30px;height:30px;border:1px solid rgba(168,131,79,.5);border-radius:50%; display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-size:12px;color:#cbaa76} .mb-v-lv{margin-top:32px;border-top:1px solid rgba(255,255,255,.09);padding-top:20px} .mb-v-lv-t{font-size:10.5px;letter-spacing:4px;color:#8f8674;text-transform:uppercase;margin-bottom:12px} .mb-v-lv-r{display:flex;gap:7px;flex-wrap:wrap} .mb-v-lv-r span{font-size:11px;letter-spacing:1px;padding:5px 11px;border:1px solid rgba(255,255,255,.14); border-radius:2px;color:#c4baa6} .mb-v-lv-r span.on{border-color:#a8834f;color:#e8d7b4;background:rgba(168,131,79,.13)} .mb-auth-b{padding:52px 52px 46px;display:flex;flex-direction:column} .mb-tabs{display:flex;gap:30px;border-bottom:1px solid var(--line);margin-bottom:32px} .mb-tab{background:none;border:none;cursor:pointer;font-family:var(--serif);font-size:16px;letter-spacing:3px; color:var(--sub);padding:0 0 14px;position:relative;transition:color .25s} .mb-tab.on{color:var(--ink)} .mb-tab::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--gold); transform:scaleX(0);transition:transform .3s} .mb-tab.on::after{transform:scaleX(1)} .mb-sex-t{font-size:11px;letter-spacing:2px;color:var(--gold-d);margin-bottom:6px} /* 表单 */ .mb-f{margin-bottom:17px} .mb-f>label{display:block;font-size:12px;letter-spacing:1.5px;color:var(--sub);margin-bottom:7px} .mb-f .mb-req{color:var(--gold-d);margin-left:3px} .mb-ipt{width:100%;padding:11px 14px;border:1px solid var(--line);background:#fdfcfa;font-family:var(--sans); font-size:13.5px;color:var(--ink);transition:border-color .25s,box-shadow .25s;outline:none} .mb-ipt:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(168,131,79,.10)} .mb-ipt::placeholder{color:#b6ad9e} select.mb-ipt{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--sub) 50%), linear-gradient(135deg,var(--sub) 50%,transparent 50%); background-position:calc(100% - 17px) 50%,calc(100% - 12px) 50%;background-size:5px 5px,5px 5px; background-repeat:no-repeat} .mb-r2{display:grid;grid-template-columns:1fr 1fr;gap:14px} .mb-r3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px} .mb-cap{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center} .mb-cap-q{font-family:var(--serif);font-size:15px;letter-spacing:2px;background:var(--cream); border:1px solid var(--line);padding:11px 16px;color:var(--gold-d);white-space:nowrap} .mb-tip{font-size:11.5px;color:var(--sub);line-height:1.7;margin-top:-6px;margin-bottom:16px} .mb-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0} .mb-acts{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:8px;flex-wrap:wrap} .mb-lk{font-size:12.5px;color:var(--gold-d);letter-spacing:1px;cursor:pointer;background:none;border:none; font-family:var(--sans);padding:0} .mb-lk:hover{color:var(--ink);text-decoration:underline} .mb-err{background:#fbf3f2;border-left:2px solid #a8624f;color:#8a4a3a;font-size:12.5px;line-height:1.7; padding:10px 14px;margin-bottom:16px} .mb-err:empty{display:none} .mb-lglaw{margin-top:auto;padding-top:26px;font-size:11px;color:#a09889;line-height:1.8} /* ============================ 已登录：侧栏 + 面板 ============================ */ .mb-app{display:grid;grid-template-columns:288px minmax(0,1fr);gap:26px;align-items:start} .mb-side{position:sticky;top:88px;display:grid;gap:16px} .mb-card{position:relative;padding:30px 26px 24px;color:#f2ece0;overflow:hidden; background:linear-gradient(160deg,#1b1813,#2b251c 60%,#3a3126)} .mb-card::before{content:"";position:absolute;width:280px;height:280px;right:-120px;bottom:-150px;border-radius:50%; background:radial-gradient(circle,rgba(168,131,79,.30),transparent 68%)} .mb-card>*{position:relative;z-index:1} .mb-card-t{font-family:var(--serif);font-size:9.5px;letter-spacing:4.5px;color:#a08e6c;text-transform:uppercase} .mb-card-n{font-family:var(--serif);font-size:21px;letter-spacing:2px;margin:12px 0 4px; overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .mb-card-no{font-size:11px;letter-spacing:2.5px;color:#948a76} .mb-badge{display:inline-flex;align-items:center;gap:7px;margin-top:16px;padding:5px 13px; border:1px solid rgba(255,255,255,.2);border-radius:2px;font-size:11.5px;letter-spacing:1.5px} .mb-badge i{width:6px;height:6px;border-radius:50%;display:inline-block} .mb-prog{margin-top:20px;padding-top:18px;border-top:1px solid rgba(255,255,255,.1)} .mb-prog-t{display:flex;justify-content:space-between;font-size:11px;color:#a79d89;letter-spacing:1px;margin-bottom:9px} .mb-prog-b{height:3px;background:rgba(255,255,255,.13);overflow:hidden} .mb-prog-b i{display:block;height:100%;background:linear-gradient(90deg,#8a6a3b,#d9bc86);transition:width .8s ease} .mb-prog-f{font-size:11px;color:#948a76;margin-top:9px;letter-spacing:1px} .mb-nav{border:1px solid var(--line);background:#fff} .mb-nav button{display:flex;align-items:center;justify-content:space-between;width:100%;padding:14px 20px; background:none;border:none;border-bottom:1px solid var(--line);cursor:pointer;font-family:var(--sans); font-size:13px;letter-spacing:2px;color:var(--sub);text-align:left;transition:all .22s} .mb-nav button:last-child{border-bottom:none} .mb-nav button:hover{color:var(--ink);background:#fbf9f5} .mb-nav button.on{color:var(--ink);background:var(--cream);box-shadow:inset 2px 0 0 var(--gold)} .mb-nav button span.mb-nv-n{font-size:11px;color:var(--gold-d);letter-spacing:1px} .mb-side-out{width:100%;padding:12px;background:none;border:1px solid var(--line);cursor:pointer; font-family:var(--sans);font-size:12.5px;letter-spacing:3px;color:var(--sub);transition:all .25s;background:#fff} .mb-side-out:hover{color:#8a4a3a;border-color:#dcc8c2;background:#fdf8f7} .mb-main{border:1px solid var(--line);background:#fff;min-height:520px} .mb-pane{padding:34px 36px 40px} .mb-ph{margin-bottom:28px;padding-bottom:20px;border-bottom:1px solid var(--line);display:flex; align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap} .mb-ph .en{font-size:10px;letter-spacing:4.5px;color:var(--gold-d);text-transform:uppercase} .mb-ph h2{font-family:var(--serif);font-size:20px;letter-spacing:4px;margin-top:8px} .mb-ph p{font-size:12px;color:var(--sub);margin-top:8px;letter-spacing:.5px} /* 数据卡 */ .mb-kpi{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1px;background:var(--line); border:1px solid var(--line);margin-bottom:30px} .mb-kpi>div{background:#fff;padding:22px 20px} .mb-kpi .k{font-size:11px;letter-spacing:2px;color:var(--sub)} .mb-kpi .v{font-family:var(--serif);font-size:25px;letter-spacing:1px;margin:9px 0 2px;color:var(--ink)} .mb-kpi .v em{font-style:normal;font-size:13px;color:var(--sub);margin-left:3px;letter-spacing:0} .mb-kpi .s{font-size:11px;color:#a79d89} .mb-blk{margin-bottom:30px} .mb-blk-t{font-size:11px;letter-spacing:3.5px;color:var(--gold-d);text-transform:uppercase; margin-bottom:14px;padding-bottom:10px;border-bottom:1px solid var(--line)} .mb-perk{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px} .mb-perk>div{border:1px solid var(--line);padding:18px 18px 16px;background:#fdfcfa} .mb-perk .t{font-size:13px;letter-spacing:1.5px;margin-bottom:7px} .mb-perk .d{font-size:11.5px;color:var(--sub);line-height:1.75} .mb-perk .n{font-family:var(--serif);font-size:11px;color:var(--gold);letter-spacing:2px;margin-bottom:9px} /* 列表 / 表 */ .mb-lst{border-top:1px solid var(--line)} .mb-row{display:grid;gap:14px;padding:16px 4px;border-bottom:1px solid var(--line);align-items:center} .mb-row:hover{background:#fdfcfa} .mb-ord{grid-template-columns:minmax(0,1fr) 108px 100px auto} .mb-ord .no{font-family:var(--serif);font-size:13.5px;letter-spacing:1px} .mb-ord .it{font-size:11.5px;color:var(--sub);margin-top:5px;line-height:1.6; overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .mb-ord .amt{font-family:var(--serif);font-size:15px;text-align:right} .mb-ord .amt s{display:block;font-size:11px;color:#a79d89;text-decoration:none;margin-top:3px;letter-spacing:.5px} .mb-tg{display:inline-block;font-size:11px;letter-spacing:1.2px;padding:3px 10px;border:1px solid var(--line); color:var(--sub);background:#fbf9f5;border-radius:2px;white-space:nowrap} .mb-tg-w{border-color:#e3d3b6;color:#8a6a3b;background:#fdf9f1} .mb-tg-d{border-color:#cdd7ce;color:#4f6752;background:#f6faf6} .mb-tg-x{border-color:#ded7d3;color:#8a7d76;background:#faf8f7} .mb-tg.g{background:var(--cream);border-color:#dfd3bb} .mb-empty{text-align:center;padding:64px 20px;color:var(--sub)} .mb-empty .i{font-family:var(--serif);font-size:34px;color:var(--line);margin-bottom:16px} .mb-empty p{font-size:13px;letter-spacing:1px} .mb-empty .mb-btn{margin-top:22px} .mb-chips{display:flex;gap:9px;flex-wrap:wrap;margin-bottom:20px} .mb-chips button{background:#fff;border:1px solid var(--line);padding:7px 16px;font-size:12px;letter-spacing:1.5px; color:var(--sub);cursor:pointer;font-family:var(--sans);transition:all .22s} .mb-chips button:hover{border-color:var(--gold);color:var(--gold-d)} .mb-chips button.on{background:var(--ink);border-color:var(--ink);color:#fff} .mb-pg{display:flex;justify-content:center;align-items:center;gap:18px;margin-top:26px;font-size:12px;color:var(--sub)} .mb-pg button{background:#fff;border:1px solid var(--line);min-width:38px;height:34px;cursor:pointer;color:var(--ink); letter-spacing:1px;font-size:12px;font-family:var(--sans);padding:0 12px} .mb-pg button:disabled{opacity:.35;cursor:default} .mb-pg button:not(:disabled):hover{border-color:var(--gold)} /* 签到 */ .mb-sign-hero{border:1px solid var(--line);background:linear-gradient(180deg,#fdfbf7,#fff);padding:32px; text-align:center;margin-bottom:26px} .mb-sign-big{display:inline-flex;flex-direction:column;align-items:center;justify-content:center; width:148px;height:148px;border-radius:50%;border:1px solid var(--gold);background:#fff;cursor:pointer; transition:all .35s;font-family:var(--serif);color:var(--ink)} .mb-sign-big:hover{background:var(--cream);transform:translateY(-2px);box-shadow:0 14px 34px rgba(168,131,79,.16)} .mb-sign-big.done{border-color:var(--line);color:var(--sub);cursor:default;background:#fbfaf7;box-shadow:none;transform:none} .mb-sign-big .d1{font-size:19px;letter-spacing:3px} .mb-sign-big .d2{font-size:11px;letter-spacing:2px;margin-top:7px;color:var(--gold-d)} .mb-sign-big.done .d2{color:var(--sub)} .mb-sign-st{display:flex;justify-content:center;gap:44px;margin-top:26px;flex-wrap:wrap} .mb-sign-st div{text-align:center} .mb-sign-st .v{font-family:var(--serif);font-size:22px} .mb-sign-st .k{font-size:11px;letter-spacing:2px;color:var(--sub);margin-top:5px} .mb-cal{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;margin-top:6px} .mb-cal .hd{font-size:11px;letter-spacing:1px;color:var(--sub);text-align:center;padding-bottom:8px} .mb-cal .dy{aspect-ratio:1/1;border:1px solid var(--line);display:flex;flex-direction:column;align-items:center; justify-content:center;font-size:12.5px;color:var(--ink);background:#fff} .mb-cal .dy.gap{border:none;background:none} .mb-cal .dy.on{background:var(--cream);border-color:#e0d2b7;color:var(--gold-d)} .mb-cal .dy.on .p{font-size:9.5px;margin-top:3px;letter-spacing:.5px} .mb-cal .dy.today{box-shadow:inset 0 0 0 1px var(--gold)} .mb-cal .dy.f{background:#fbfaf7;color:#c9c1b3;border-color:#f0ebe2} /* 积分 */ .mb-pts{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:18px;margin-bottom:26px} .mb-pts .b{border:1px solid var(--line);padding:20px} .mb-pts .b .v{font-family:var(--serif);font-size:26px} .mb-pts .b .k{font-size:11px;letter-spacing:2px;color:var(--sub);margin-top:6px} .mb-prow{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:16px;padding:14px 4px; border-bottom:1px solid var(--line);align-items:center} .mb-prow .r{font-size:13px} .mb-prow .r small{display:block;font-size:11px;color:#a79d89;margin-top:4px;letter-spacing:.5px} .mb-prow .p{font-family:var(--serif);font-size:15px;color:var(--ok);min-width:62px;text-align:right} .mb-prow .p.m{color:#8a4a3a} .mb-prow .b{font-size:11px;color:var(--sub);min-width:74px;text-align:right;letter-spacing:.5px} /* 表单区（资料 / 地址） */ .mb-form{max-width:560px} .mb-fsec{margin-bottom:36px} .mb-fsec>h3{font-family:var(--serif);font-size:15px;letter-spacing:3px;margin-bottom:18px;padding-bottom:12px; border-bottom:1px solid var(--line)} .mb-seg{display:flex;border:1px solid var(--line)} .mb-seg button{flex:1;padding:10px;background:#fff;border:none;cursor:pointer;font-family:var(--sans);font-size:12.5px; letter-spacing:1.5px;color:var(--sub);transition:all .22s} .mb-seg button+button{border-left:1px solid var(--line)} .mb-seg button.on{background:var(--ink);color:#fff} .mb-adr{display:grid;grid-template-columns:repeat(auto-fit,minmax(268px,1fr));gap:16px;margin-bottom:26px} .mb-adr-c{border:1px solid var(--line);padding:20px;background:#fdfcfa;position:relative} .mb-adr-c.def{border-color:#dfd3bb;background:#fdf9f1} .mb-adr-c .n{font-size:13.5px;letter-spacing:1px} .mb-adr-c .n span{font-size:12px;color:var(--sub);margin-left:10px;letter-spacing:.5px} .mb-adr-c .a{font-size:12px;color:var(--sub);line-height:1.8;margin:11px 0 14px;min-height:44px} .mb-adr-c .o{display:flex;gap:16px;align-items:center;border-top:1px solid var(--line);padding-top:12px} .mb-adr-c .df{position:absolute;top:14px;right:14px;font-size:10.5px;letter-spacing:1.5px;color:var(--gold-d); border:1px solid #e3d3b6;background:#fff;padding:2px 8px;border-radius:2px} /* 订单详情抽屉 */ .mb-drawer{position:fixed;inset:0;z-index:80;display:flex;justify-content:flex-end} .mb-drawer-bg{position:absolute;inset:0;background:rgba(27,24,19,.42);backdrop-filter:blur(2px); animation:mbFade .3s ease} .mb-drawer-p{position:relative;width:min(620px,94vw);height:100%;background:var(--paper);overflow-y:auto; box-shadow:-24px 0 60px rgba(27,24,19,.2);animation:mbSlide .38s cubic-bezier(.22,.7,.3,1)} @keyframes mbFade{from{opacity:0}to{opacity:1}} @keyframes mbSlide{from{transform:translateX(40px);opacity:.3}to{transform:none;opacity:1}} .mb-dr-h{position:sticky;top:0;background:rgba(250,248,244,.96);backdrop-filter:blur(8px); border-bottom:1px solid var(--line);padding:20px 28px;display:flex;align-items:center;justify-content:space-between;z-index:2} .mb-dr-h .no{font-family:var(--serif);font-size:15px;letter-spacing:1.5px} .mb-dr-h .no small{display:block;font-family:var(--sans);font-size:11px;color:var(--sub);letter-spacing:1px;margin-top:4px} .mb-x{background:none;border:none;font-size:22px;line-height:1;color:var(--sub);cursor:pointer;padding:4px 8px} .mb-x:hover{color:var(--ink)} .mb-dr-b{padding:26px 28px 40px} .mb-dsec{margin-bottom:26px} .mb-dsec>h4{font-size:11px;letter-spacing:3.5px;color:var(--gold-d);text-transform:uppercase;margin-bottom:13px} .mb-dl{display:grid;grid-template-columns:88px minmax(0,1fr);gap:9px 14px;font-size:12.5px;line-height:1.8} .mb-dl dt{color:var(--sub);letter-spacing:1px} .mb-dl dd{color:var(--ink);word-break:break-word} .mb-tl{position:relative;padding-left:22px;margin-top:6px} .mb-tl::before{content:"";position:absolute;left:4px;top:6px;bottom:8px;width:1px;background:var(--line)} .mb-tl li{list-style:none;position:relative;padding-bottom:18px;font-size:12.5px} .mb-tl li:last-child{padding-bottom:0} .mb-tl li::before{content:"";position:absolute;left:-22px;top:6px;width:9px;height:9px;border-radius:50%; background:#fff;border:1px solid var(--line);margin-left:0} .mb-tl li.on::before{background:var(--gold);border-color:var(--gold)} .mb-tl li .t{color:var(--sub);font-size:11px;letter-spacing:1px;margin-top:3px} .mb-itm{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:14px;padding:12px 0; border-bottom:1px solid var(--line);font-size:12.5px;align-items:center} .mb-itm:last-child{border-bottom:none} .mb-itm .s{font-size:11px;color:#a79d89;margin-top:3px} .mb-itm .q{color:var(--sub)} .mb-itm .p{font-family:var(--serif);text-align:right;min-width:70px} .mb-sum{margin-top:16px;border-top:1px solid var(--line);padding-top:14px;font-size:12.5px} .mb-sum div{display:flex;justify-content:space-between;padding:5px 0;color:var(--sub)} .mb-sum div.g{color:#8a6a3b} .mb-sum div.t{border-top:1px solid var(--line);margin-top:10px;padding-top:12px;color:var(--ink);font-size:14px} .mb-sum div.t b{font-family:var(--serif);font-size:20px;font-weight:400} .mb-track{display:inline-flex;align-items:center;gap:8px;margin-top:12px;font-size:12.5px;letter-spacing:1px; color:var(--gold-d);border-bottom:1px solid #e3d3b6;padding-bottom:3px} .mb-track:hover{color:var(--ink);border-color:var(--ink)} /* 轻提示 */ .mb-toast{position:fixed;left:50%;bottom:44px;transform:translate(-50%,14px);z-index:120;padding:12px 26px; background:rgba(27,24,19,.94);color:#f2ece0;font-size:13px;letter-spacing:1.2px;box-shadow:0 12px 30px rgba(0,0,0,.22); opacity:0;transition:opacity .28s,transform .28s;pointer-events:none;max-width:80vw;text-align:center} .mb-toast.on{opacity:1;transform:translate(-50%,0)} .mb-toast.bad{background:rgba(122,58,45,.95)} /* 加载遮罩 */ .mb-load{position:fixed;inset:0;z-index:110;background:rgba(250,248,244,.66);display:flex;align-items:center; justify-content:center;backdrop-filter:blur(1px)} .mb-load i{width:30px;height:30px;border:2px solid var(--line);border-top-color:var(--gold);border-radius:50%; animation:mbSpin .8s linear infinite;display:block} @keyframes mbSpin{to{transform:rotate(360deg)}} /* ============================ 响应式 ============================ */ @media(max-width:980px){ .mb-auth{grid-template-columns:1fr} .mb-auth-v{padding:38px 30px 32px} .mb-auth-b{padding:34px 30px 32px} .mb-app{grid-template-columns:1fr} .mb-side{position:static} .mb-card{padding:24px 22px 20px} .mb-nav{display:grid;grid-template-columns:1fr 1fr} .mb-nav button{border-bottom:1px solid var(--line)} .mb-nav button:nth-child(odd){border-right:1px solid var(--line)} .mb-pane{padding:26px 22px 32px} } @media(max-width:640px){ .mb-wrap{padding:26px 14px 56px} .mb-r2,.mb-r3{grid-template-columns:1fr} .mb-ord{grid-template-columns:minmax(0,1fr) auto;gap:8px} .mb-ord .amt{text-align:left} .mb-kpi{grid-template-columns:1fr 1fr} .mb-sign-st{gap:26px} .mb-dl{grid-template-columns:76px minmax(0,1fr)} } /* ============================================================ 跨站会员身份（bclshop 商城 <=> bcl 官网） xmb:cross-site 写在文件末尾，不动既有规则；选择器一律 mb-x / mb-card-x 前缀。 ============================================================ */ .mb-card-x{font-family:var(--sans);font-size:10.5px;letter-spacing:1.8px;color:rgba(244,233,218,.66); margin-top:10px;line-height:1.6;} .mb-xhead{font-family:var(--sans);font-size:10.5px;letter-spacing:2.2px;color:var(--gold,#a8834f); margin:2px 0 12px;} .mb-xlist{list-style:none;margin:0;padding:0;display:grid;gap:0;counter-reset:xmb;} .mb-xlist li{counter-increment:xmb;position:relative;padding:12px 0 12px 42px; border-top:1px solid rgba(141,133,121,.18);font-size:13.5px;line-height:1.85;color:inherit;} .mb-xlist li:first-child{border-top:0;} .mb-xlist li::before{content:counter(xmb,decimal-leading-zero);position:absolute;inset-inline-start:0;top:12px; font-family:var(--sans);font-size:11px;letter-spacing:1px;color:var(--gold,#a8834f);} .mb-xnote{margin-top:16px;padding-top:14px;border-top:1px solid rgba(141,133,121,.18); font-family:var(--sans);font-size:11px;letter-spacing:1.4px;color:#8d8579;} .mb-xgo{display:inline-block;margin-top:14px;font-family:var(--sans);font-size:12px;letter-spacing:1.6px; padding:9px 20px;border:1px solid #a8834f;border-radius:4px;color:#8a6b45;text-decoration:none; transition:background .25s,color .25s;} .mb-xgo:hover{background:#a8834f;color:#fff;} html.ls-tight .mb-xhead,html.ls-tight .mb-xnote,html.ls-tight .mb-xgo, html.ls-tight .mb-card-x{letter-spacing:.04em;} html.ls-tight .mb-xlist li{font-size:14px;} /* ---- 打印订单详情：只保留抽屉内容 ---- */ /* 【2026-10-18 修】改用 display:none 彻底移除非抽屉内容。 旧版用 visibility:hidden —— 它只隐藏、不释放布局空间， 整页会员中心的高度照样占纸，打印预览会先出 1~2 张空白页。 */ @media print{ body{background:#fff} body > *:not(main){display:none!important} main > *:not(#mbDrawer){display:none!important} .mb-drawer{position:static!important;display:block!important} .mb-drawer-p{width:100%!important;max-width:none!important;height:auto!important; overflow:visible!important;box-shadow:none!important;transform:none!important} .mb-drawer-bg,.mb-no-print{display:none!important} } /* ---- 法务备注：屏幕隐藏，仅打印显示 ---- */ .mb-legal{display:none} @media print{ .mb-legal{display:block;margin-top:10mm;padding-top:4mm;border-top:1px dashed #999; font-size:9.5px;line-height:1.6;color:#333} .mb-legal h5{font-size:10.5px;letter-spacing:1px;margin-bottom:2mm;font-weight:700} .mb-legal ol{padding-left:5mm;list-style:decimal} .mb-legal li{margin-bottom:1mm} .mb-legal-foot{margin-top:2mm;font-size:8.5px;color:#666} } /* ---- 电子章：仅打印显示，居中圆形章 ---- */ .mb-legal-seal{display:none} @media print{ .mb-legal-seal{display:flex;flex-direction:column;align-items:center;justify-content:center; width:30mm;height:30mm;margin:4mm auto 2mm;border:2.5px solid #a63a2f;border-radius:50%; color:#a63a2f;transform:rotate(-6deg);opacity:.88;text-align:center;padding:3mm} .mb-legal-seal span{font-size:8.5px;line-height:1.35;letter-spacing:.5px;font-weight:700} .mb-legal-seal em{font-style:normal;font-size:8px;margin-top:1mm;letter-spacing:1px; border-top:1px solid #a63a2f;padding-top:1mm} } /* ---- 退款收款码（个人资料页） ---- */ .mb-qr-row{display:flex;gap:16px;align-items:flex-start;flex-wrap:wrap;margin-top:10px} .mb-qr-box{width:132px;height:132px;border:1px solid rgba(128,128,128,.35); display:flex;align-items:center;justify-content:center;background:rgba(128,128,128,.06);flex:0 0 auto} .mb-qr-box img{width:120px;height:120px;object-fit:contain;background:#fff;padding:4px} .mb-qr-none{font-size:11px;color:var(--sub, #8a8578);text-align:center;padding:0 10px} .mb-qr-side{flex:1;min-width:220px} .mb-qr-tip{font-size:12px;margin:0 0 8px} .mb-qr-law{font-size:11px;line-height:1.6;color:#a63a2f;margin:0 0 10px; border:1px solid rgba(166,58,47,.35);padding:8px 10px;background:rgba(166,58,47,.05)} .mb-qr-file{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none} /* 原生 file 控件在手机上又小又难看，改成「按钮 + 隐藏 input」： 点