/* 前程酱酒 · H5 商城  移动端样式（红金质感） */
:root{
  --red:#c0182b; --red-deep:#8e0f1d; --gold:#d4af37; --gold-soft:#e8c96a;
  --ink:#1f1414; --muted:#8a7a7a; --bg:#f7f3ee; --card:#ffffff; --line:#efe4d8;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
html,body{margin:0;padding:0;}
body{
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;
  background:var(--bg); color:var(--ink); max-width:480px; margin:0 auto;
  min-height:100vh; padding-bottom:64px;
}
.app-bar{
  position:sticky; top:0; z-index:20; background:linear-gradient(135deg,var(--red),var(--red-deep));
  color:#fff; padding:14px 16px; display:flex; align-items:center; justify-content:space-between;
}
.app-bar .brand{font-size:18px; font-weight:800; letter-spacing:1px;}
.app-bar .brand span{color:var(--gold-soft);}
.app-bar .me{font-size:13px; background:rgba(255,255,255,.18); padding:6px 12px; border-radius:20px;}
.app-actions{display:flex; align-items:center; gap:10px;}
.hamb{background:rgba(255,255,255,.18); border:none; color:#fff; font-size:18px; width:36px; height:32px; border-radius:10px; cursor:pointer; line-height:1;}
.hamb:active{background:rgba(255,255,255,.3);}
/* 侧边菜单 */
.menu-mask{justify-content:flex-end; align-items:stretch; padding:0;}
.side-menu{background:#fff; width:78%; max-width:300px; height:100%; padding:56px 18px 20px; display:flex; flex-direction:column; gap:8px; animation:slideIn .25s ease;}
@keyframes slideIn{from{transform:translateX(100%)}to{transform:translateX(0)}}
.sm-head{font-size:16px; font-weight:800; color:var(--red-deep); margin-bottom:4px;}
.sm-item{display:flex; align-items:center; gap:10px; padding:14px 12px; border-radius:12px; font-size:15px; color:var(--ink); text-decoration:none; background:var(--bg); cursor:pointer;}
.sm-item:active{background:#f0e6da;}
.hero{
  margin:14px; padding:22px 18px; border-radius:18px; color:#fff;
  background:linear-gradient(135deg,var(--red),var(--gold)); text-align:center;
}
.hero h1{margin:0 0 6px; font-size:22px;}
.hero p{margin:0; opacity:.95; font-size:20px; font-weight:600; letter-spacing:.5px;}
.section-title{margin:18px 16px 10px; font-size:16px; font-weight:800;}
.section-title small{color:var(--muted); font-weight:400; font-size:12px; margin-left:6px;}

.grid{display:grid; grid-template-columns:1fr 1fr; gap:12px; padding:0 14px;}
.card{
  background:var(--card); border:1px solid var(--line); border-radius:16px; overflow:hidden;
  display:flex; flex-direction:column; transition:transform .2s, box-shadow .2s;
}
.card:active{transform:scale(.98);}
.card{position:relative;}
.card .thumb{height:180px; background:#f0e6da center/cover no-repeat; display:flex; align-items:center; justify-content:center; font-size:40px;}
.badge-normal{position:absolute; top:8px; left:8px; z-index:2; background:linear-gradient(135deg,var(--gold),#b8902a); color:#fff; font-size:10px; font-weight:700; padding:3px 9px; border-radius:10px; box-shadow:0 2px 6px rgba(0,0,0,.18);}
.badge-agent{position:absolute; top:8px; left:8px; z-index:2; background:linear-gradient(135deg,#2a6f9e,#1c4f73); color:#fff; font-size:10px; font-weight:700; padding:3px 9px; border-radius:10px; box-shadow:0 2px 6px rgba(0,0,0,.18);}
/* 区域代理专区（醒目升级） */
.agent-title{color:var(--red-deep);}
.agent-recruit{margin:2px 16px 6px; padding:12px 14px; border-radius:14px; background:linear-gradient(135deg,#fff7e8,#fdeccb); border:1px dashed var(--gold); font-size:12.5px; color:#9a7415; line-height:1.6;}
.agent-recruit b{color:var(--red);}
.agent-grid{gap:14px;}
.card-agent{border:1.5px solid var(--gold); box-shadow:0 6px 18px rgba(212,175,55,.20); background:linear-gradient(180deg,#fffdf8,#fff);}
.card-agent .thumb{filter:saturate(1.05);}
.badge-agent.lv1{background:linear-gradient(135deg,#caa23a,#8a6a14); font-size:11px; padding:4px 10px; border-radius:12px;}
.badge-agent.lv2{background:linear-gradient(135deg,#2a6f9e,#1c4f73);}
.badge-agent.lv3{background:linear-gradient(135deg,#1f9e8a,#127567);}
.agent-tip{font-size:11.5px; color:#9a7415; background:#fcf3d8; border-radius:8px; padding:6px 8px; margin:2px 0 8px; line-height:1.5;}
.agent-buy{margin-top:2px;}
.card .body{padding:10px 12px; flex:1; display:flex; flex-direction:column;}
.card .name{font-size:14px; font-weight:700; line-height:1.3;}
.card .price{color:var(--red); font-weight:800; margin:6px 0; font-size:16px;}
.card .price small{color:var(--muted); font-weight:400; font-size:11px;}
.btn{
  border:none; border-radius:24px; padding:11px 16px; font-size:14px; font-weight:700;
  background:linear-gradient(135deg,var(--red),var(--red-deep)); color:#fff; cursor:pointer; width:100%;
  transition:opacity .2s;
}
.btn:active{opacity:.85;}
.btn.gold{background:linear-gradient(135deg,var(--gold),#b8902a);}
.btn.ghost{background:#fff; color:var(--red); border:1px solid var(--red);}
.btn:disabled{opacity:.5;}
.btn.sm{width:auto; padding:9px 16px; font-size:13px;}
/* 代理名额已被申请：卡片/按钮置灰 */
.card.sold-out .thumb, .card.sold-out .body{opacity:.5;}
.card.sold-out .name::after{content:'（已被申请）'; color:#c0182b; font-size:11px;}
select option:disabled{color:#bbb;}

/* 钱包 / 提现 */
.wallet-head{display:flex; justify-content:space-between; align-items:center; gap:10px;}
.wallet-amt{font-size:24px; font-weight:900; color:var(--red); margin-top:2px;}
.wallet-acts{display:flex; gap:8px; flex-shrink:0;}
.wallet-account{margin-top:12px; font-size:12px; color:var(--muted); border-top:1px dashed var(--line); padding-top:10px;}
.field label{display:block; font-size:12px; color:var(--muted); margin-bottom:5px;}

/* 会员中心 */
.panel{margin:14px; background:var(--card); border:1px solid var(--line); border-radius:16px; padding:16px;}
.panel h3{margin:0 0 12px; font-size:15px;}
.kv{display:flex; justify-content:space-between; padding:8px 0; border-bottom:1px dashed var(--line); font-size:13px;}
.kv:last-child{border-bottom:none;}
.kv .k{color:var(--muted);}
.kv .v{font-weight:700;}
.invite-box{background:linear-gradient(135deg,#fff7e8,#fdeccb); border:1px dashed var(--gold); border-radius:14px; padding:14px; text-align:center; margin-bottom:12px;}
.invite-box .code{font-size:26px; font-weight:900; color:var(--red); letter-spacing:3px;}
.invite-box .link{font-size:11px; color:var(--muted); word-break:break-all; margin-top:6px;}
.row2{display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:12px;}
.stat{background:var(--bg); border-radius:12px; padding:12px; text-align:center;}
.stat .n{font-size:20px; font-weight:900; color:var(--red);}
.stat .t{font-size:11px; color:var(--muted); margin-top:2px;}
.list-item{display:flex; justify-content:space-between; padding:10px 0; border-bottom:1px solid var(--line); font-size:13px;}
.list-item:last-child{border-bottom:none;}
.tag{font-size:10px; padding:2px 7px; border-radius:10px; background:#fbe7e9; color:var(--red);}
.tag.g{background:#fcf3d8; color:#9a7415;}

/* 模态 */
.mask{position:fixed; inset:0; background:rgba(0,0,0,.45); z-index:200; display:none; align-items:center; justify-content:center; padding:20px;}
.mask.show{display:flex;}
.modal{background:#fff; border-radius:18px; width:100%; max-width:340px; padding:20px;}
.modal h3{margin:0 0 14px; text-align:center; font-size:17px;}
.field{margin-bottom:12px;}
.field input{width:100%; padding:11px 12px; border:1px solid var(--line); border-radius:10px; font-size:14px;}
.field .hint{font-size:11px; color:var(--muted); margin-top:4px;}
/* 验证码行 */
.code-row{display:flex; gap:8px; align-items:flex-start; flex-wrap:wrap;}
.code-input{flex:1; min-width:130px;}
.code-input input{width:100%; padding:11px 12px; border:1px solid var(--line); border-radius:10px; font-size:14px; box-sizing:border-box;}
.code-btn{flex:0 0 auto; width:auto; padding:11px 14px; font-size:13px; white-space:nowrap;}
.code-btn:disabled{opacity:.55; cursor:not-allowed;}
.code-row .hint{width:100%;}
.tabs{display:flex; gap:8px; margin-bottom:14px;}
.tabs button{flex:1; padding:8px; border:1px solid var(--line); background:#fff; border-radius:10px; font-size:13px; color:var(--muted);}
.tabs button.on{background:var(--red); color:#fff; border-color:var(--red);}
.toast{position:fixed; left:50%; bottom:80px; transform:translateX(-50%); background:rgba(0,0,0,.85); color:#fff; padding:10px 18px; border-radius:22px; font-size:13px; z-index:999; opacity:0; transition:opacity .25s; pointer-events:none;}
.toast.show{opacity:1;}

/* 底部导航 */
.tabbar{position:fixed; bottom:0; left:50%; transform:translateX(-50%); width:100%; max-width:480px; display:flex; background:#fff; border-top:1px solid var(--line); z-index:30;}
.tabbar a{flex:1; text-align:center; padding:8px 0; font-size:12px; color:var(--muted); text-decoration:none;}
.tabbar a.on{color:var(--red); font-weight:700;}
.tabbar a .ic{font-size:18px; display:block;}
/* 尊享权益 tab 金色高亮 */
.tabbar a#tabBenefit{color:var(--gold); font-weight:700; position:relative;}
.tabbar a#tabBenefit .ic{filter:drop-shadow(0 0 3px rgba(212,175,55,.55));}
.tabbar a#tabBenefit::before{content:""; position:absolute; top:5px; left:50%; transform:translateX(-50%); width:26px; height:26px; background:radial-gradient(circle,rgba(212,175,55,.22),transparent 70%); border-radius:50%;}

.hidden{display:none !important;}
.admin-entry{text-align:center; font-size:12px; color:var(--muted); margin:18px 0 4px;}

/* 产品详情页 */
/* 图1 风格产品详情页 */
#view-product{position:fixed; inset:0; z-index:100; background:#f5f5f5; display:flex; flex-direction:column;}
#view-product.hidden{display:none;}
.pd-bar{position:fixed; top:0; left:0; right:0; z-index:20; background:#fff; color:#111; height:calc(48px + env(safe-area-inset-top)); padding:env(safe-area-inset-top) 14px 0; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line);}
.pd-bar .pd-close{width:32px; height:32px; display:flex; align-items:center; justify-content:center; cursor:pointer;}
.pd-bar .pd-close svg{width:22px; height:22px; color:#333;}
.pd-bar .pd-bar-t{position:absolute; left:50%; transform:translateX(-50%); font-size:16px; font-weight:700; max-width:50%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.pd-bar .pd-more{font-size:20px; cursor:pointer; line-height:1; padding:4px;}
.pd-scroll{flex:1; overflow-y:auto; -webkit-overflow-scrolling:touch; padding-top:calc(48px + env(safe-area-inset-top)); padding-bottom:calc(66px + env(safe-area-inset-bottom));}
.pd-hero{position:relative; width:100%; background:#fff; display:flex; align-items:center; justify-content:center; overflow:hidden; aspect-ratio:1 / 1;}
.pd-hero .pd-img{width:100%; height:100%; background:center/contain no-repeat #fff;}
.pd-dots{position:absolute; bottom:12px; left:50%; transform:translateX(-50%); display:flex; gap:6px; z-index:2;}
.pd-dots span{width:6px; height:6px; border-radius:50%; background:rgba(0,0,0,.25);}
.pd-dots span.on{background:rgba(0,0,0,.55);}
.pd-nav{position:absolute; top:50%; transform:translateY(-50%); width:32px; height:32px; border-radius:50%; background:rgba(0,0,0,.25); color:#fff; display:flex; align-items:center; justify-content:center; font-size:22px; cursor:pointer; z-index:2;}
.pd-nav.prev{left:10px;}
.pd-nav.next{right:10px;}
.pd-nav:active{background:rgba(0,0,0,.45);}
.pd-info{margin:10px 14px; background:#fff; border-radius:12px; padding:14px; box-shadow:0 1px 2px rgba(0,0,0,.03);}
.pd-info .pd-name{font-size:16px; font-weight:700; color:#111; line-height:1.35;}
.pd-info .pd-sub{font-size:12px; color:#999; margin-top:4px;}
.pd-info .pd-price{color:var(--red); font-weight:800; font-size:24px; margin:10px 0 6px;}
.pd-info .pd-price small{color:var(--muted); font-weight:400; font-size:12px; margin-left:4px;}
.pd-info .pd-desc{font-size:13px; color:#666; line-height:1.6; margin-top:8px;}
.pd-info .pd-tag{display:inline-block; font-size:11px; color:#fff; background:linear-gradient(135deg,var(--red),var(--red-deep)); padding:2px 8px; border-radius:8px; margin-bottom:8px;}
.pd-detail{margin:10px 14px; background:#fff; border-radius:12px; padding:14px; box-shadow:0 1px 2px rgba(0,0,0,.03);}
.pd-detail-title{font-size:14px; font-weight:700; color:#111; margin-bottom:10px;}
.pd-rich{font-size:14px; line-height:1.8; color:#333; word-break:break-word;}
.pd-bottombar{position:fixed; bottom:0; left:0; right:0; height:calc(56px + env(safe-area-inset-bottom)); padding:0 12px env(safe-area-inset-bottom); background:#fff; border-top:1px solid var(--line); display:flex; align-items:center; box-sizing:border-box; z-index:30;}
.pd-bot-icon{flex:none; width:40px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; color:#666; font-size:10px; cursor:pointer;}
.pd-bot-icon svg{width:20px; height:20px; color:#555;}
.pd-bot-icon span{font-size:10px;}
.pd-bottombar .pd-btn-cart{flex:1; height:38px; margin:0 8px; border:1px solid var(--red); background:#fff; color:var(--red); border-radius:20px; font-size:14px; font-weight:700; cursor:pointer;}
.pd-bottombar .pd-btn-buy{flex:1.2; height:38px; border:none; background:linear-gradient(135deg,var(--red),var(--red-deep)); color:#fff; border-radius:20px; font-size:14px; font-weight:700; cursor:pointer;}
.pd-bottombar .pd-btn-cart:disabled,.pd-bottombar .pd-btn-buy:disabled{opacity:.5; cursor:not-allowed;}

/* 小程序风格提交订单页 */
.order-mask{align-items:flex-end; justify-content:flex-end; padding:0; background:rgba(0,0,0,.55); z-index:200;}
.order-mask.show{display:flex;}
#addrMask{z-index:300;}
.order-sheet{position:relative; width:100%; max-width:480px; height:100%; background:#f5f5f5; display:flex; flex-direction:column;}
.order-header{height:48px; display:flex; align-items:center; justify-content:space-between; padding:0 12px; background:#fff; border-bottom:1px solid var(--line); flex:none;}
.order-back{font-size:26px; color:#333; width:32px; height:32px; display:flex; align-items:center; justify-content:center; cursor:pointer; line-height:1;}
.order-title{font-size:16px; font-weight:700; color:#111;}
.order-actions{display:flex; align-items:center; gap:14px; color:#333;}
.oa-more{font-size:18px; line-height:1; letter-spacing:2px; cursor:pointer;}
.oa-eye{font-size:22px; line-height:1; cursor:pointer;}
.order-scroll{flex:1; overflow-y:auto; -webkit-overflow-scrolling:touch;}
.addr-bar{background:#fff; display:flex; align-items:center; gap:10px; padding:14px 16px; cursor:pointer;}
.addr-icon{width:22px; height:22px; color:#111; flex:none; display:flex; align-items:center;}
.addr-icon svg{width:100%; height:100%;}
.addr-main{flex:1; min-width:0;}
.addr-empty{font-size:14px; color:#999;}
.addr-add{font-size:14px; color:#1677ff; font-weight:600;}
.addr-text{font-size:14px; color:#111; line-height:1.4;}
.addr-user{font-size:13px; color:#666; margin-top:3px;}
.addr-arrow{font-size:20px; color:#999; flex:none;}
/* 独立地址页顶部「新增收货地址」入口 */
.addr-add-card{display:flex; align-items:center; gap:8px; border:1px dashed #1677ff; color:#1677ff; background:#f0f7ff; border-radius:12px; padding:12px; margin-bottom:12px; font-size:15px; font-weight:600; cursor:pointer;}
/* 独立收货地址页（新增地址另起一页面） */
.addr-page{position:fixed; inset:0; background:#f5f5f5; z-index:400; display:none; flex-direction:column; padding-top:env(safe-area-inset-top);}
.addr-page.show{display:flex;}
.addr-page-bar{height:48px; display:flex; align-items:center; padding:0 12px; background:#fff; border-bottom:1px solid var(--line); flex:none;}
.ap-back{font-size:26px; color:#333; width:32px; height:32px; display:flex; align-items:center; justify-content:center; cursor:pointer; line-height:1;}
.ap-title{font-size:16px; font-weight:700; color:#111; margin-left:6px;}
.addr-page-scroll{flex:1; overflow-y:auto; -webkit-overflow-scrolling:touch; padding:12px 16px 16px;}
.addr-divider{height:1px; background:#eee; margin:16px 0;}
.addr-page-foot{padding:10px 16px calc(10px + env(safe-area-inset-bottom)); background:#fff; border-top:1px solid var(--line);}
.ap-add{width:100%; background:#1677ff; color:#fff; border:none; border-radius:22px; padding:12px; font-size:15px; font-weight:700; cursor:pointer;}
.order-stripe{height:4px; background:repeating-linear-gradient(135deg, #ff4d4f 0, #ff4d4f 5px, #1890ff 5px, #1890ff 10px, #ff4d4f 10px, #ff4d4f 15px);}
.order-form{background:#fff; padding:14px 16px; display:none;}
.order-card{background:#fff; border-radius:12px; margin:10px 14px; padding:12px 14px; box-shadow:0 1px 2px rgba(0,0,0,.03);}
.shop-name{font-size:14px; font-weight:700; color:#111; margin-bottom:12px; display:flex; align-items:center; gap:6px;}
.shop-name svg{width:16px; height:16px; color:#111;}
.prod-line{display:flex; gap:12px; margin-bottom:12px;}
.prod-thumb{width:72px; height:72px; border-radius:8px; object-fit:cover; background:#f5f5f5; flex:none;}
.prod-info{flex:1; min-width:0; display:flex; flex-direction:column; justify-content:space-between;}
.prod-name{font-size:14px; color:#111; font-weight:600; line-height:1.35; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;}
.prod-spec{font-size:12px; color:#999; margin-top:4px;}
.prod-bottom{display:flex; align-items:flex-end; justify-content:space-between; margin-top:6px;}
.prod-price{font-size:15px; font-weight:700; color:var(--red);}
.prod-qty{font-size:13px; color:#666;}
.order-lines .line-row{display:flex; align-items:center; justify-content:space-between; padding:12px 0; border-bottom:1px solid #f0f0f0; font-size:14px; color:#333;}
.order-lines .line-row:last-child{border-bottom:none;}
.line-val{display:flex; align-items:center; gap:8px; color:#666;}
.line-val.price{color:var(--red); font-weight:700;}
.subtotal-row{padding-top:14px !important;}
.subtotal-row .line-val{font-size:16px; font-weight:700; color:#111;}
.note-input{border:none; text-align:right; font-size:13px; color:#999; outline:none; flex:1; margin-left:12px; background:transparent;}
.note-input::placeholder{color:#bbb;}
.pay-row{cursor:pointer; padding:10px 0;}
.radio{width:18px; height:18px; border-radius:50%; border:2px solid #ccc; display:inline-flex; align-items:center; justify-content:center; flex:none; color:transparent; font-size:12px; font-weight:700;}
.radio.on{background:#1890ff; border-color:#1890ff; color:#fff;}
.radio.on::after{content:none;}
.order-footer{position:absolute; bottom:0; left:0; right:0; height:56px; background:#fff; border-top:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; padding:0 16px; box-sizing:border-box;}
.order-total{font-size:14px; color:#333;}
.order-total span{font-size:20px; font-weight:800; color:#1890ff;}
.order-submit{background:#1890ff; color:#fff; border:none; border-radius:22px; padding:10px 26px; font-size:15px; font-weight:700; cursor:pointer;}
.order-submit:disabled{opacity:.6; cursor:not-allowed;}
.ck-cart-sum{display:none;}
#rowPayMethod .line-row:first-child{padding-top:0;}
#rowPayMethod .line-row:nth-child(2){padding-bottom:0;}
/* 隐藏旧支付徽章文字，统一用 radio */
#payBadgeWechat, #payBadgeAlipay{box-sizing:border-box;}
#payLabelWechat, #payLabelAlipay{font-size:14px; color:#333;}
#addrListBox{display:none;}
.pd-rich img{max-width:100%; border-radius:10px; margin:6px 0;}
.pd-rich h1,.pd-rich h2,.pd-rich h3{color:var(--red); margin:14px 0 8px;}
.admin-entry a{color:var(--gold);}

/* ===== 会员中心：导航条菜单模式 ===== */
.m-head{display:flex; align-items:center; gap:12px; margin:12px; padding:14px; border-radius:16px;
  background:linear-gradient(135deg,var(--red),var(--red-deep)); color:#fff;
  box-shadow:0 6px 18px rgba(192,24,43,.18);}
.m-avatar{width:50px; height:50px; border-radius:50%; background:rgba(255,255,255,.18);
  display:flex; align-items:center; justify-content:center; font-size:26px; flex:0 0 auto;}
.m-info{flex:1 1 auto; min-width:0;}
.m-name{font-size:17px; font-weight:800; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.m-phone{font-size:12px; opacity:.85; margin:2px 0;}
.m-status{display:inline-block; font-size:11px; padding:2px 9px; border-radius:10px;
  background:rgba(255,255,255,.22); margin-top:2px;}
.m-inv{flex:0 0 auto; text-align:center; padding-left:10px; border-left:1px solid rgba(255,255,255,.3);}
.m-inv .n{font-size:20px; font-weight:800; color:var(--gold-soft);}
.m-inv .t{font-size:11px; opacity:.85;}

.m-nav{position:sticky; top:52px; z-index:15; display:grid; grid-template-columns:repeat(4,1fr); gap:10px;
  padding:12px; margin:0 0 4px; background:var(--bg);}
.m-nav-item{width:100%; border:none; cursor:pointer; font-size:15px; font-weight:700;
  color:var(--muted); background:var(--card); border:1px solid var(--line);
  padding:14px 8px; border-radius:14px; white-space:nowrap; text-align:center; transition:all .2s ease;}
.m-nav-item.on{color:#fff; background:linear-gradient(135deg,var(--red),var(--red-deep));
  border-color:transparent; box-shadow:0 3px 10px rgba(192,24,43,.25);}
.m-nav-item:active{transform:scale(.96);}

.m-sec{margin:0 12px 16px;}
.m-sec.hidden{display:none;}

/* ===== 全额返利（冻结中）解冻进度 ===== */
.fz-bar{height:10px; border-radius:999px; background:#f1e8d8; margin:12px 0 8px; overflow:hidden;}
.fz-bar-in{height:100%; width:0; border-radius:999px;
  background:linear-gradient(90deg,#e5c158,#c0182b); transition:width .5s ease;}
.fz-steps{display:flex; gap:8px; margin-bottom:8px;}
.fz-step{flex:1; text-align:center; font-size:11px; color:#a89c8e; background:#faf6ef;
  border-radius:8px; padding:5px 0; transition:all .3s;}
.fz-step b{font-weight:800; margin-right:2px;}
.fz-step.done{color:#fff; background:linear-gradient(135deg,#e5c158,#c0182b); font-weight:700;
  box-shadow:0 2px 6px rgba(192,24,43,.22);}