/* ============================================================
   AYOU 会员中心共享样式  member.css
   依赖主站变量：--blue #1D5FD1 / --deep #0E2A5C / --orange #F26A2E
   模块：登录弹窗 / 注册向导 / 会员工作台 / 商品变更申请单 / 顶栏账户区
   ============================================================ */

/* ---------- 设计变量 ---------- */
:root{
  --m-blue:#1D5FD1; --m-blue-d:#164FB0; --m-deep:#0E2A5C;
  --m-orange:#F26A2E; --m-orange-d:#D9501E;
  --m-ink:#16233A; --m-body:#3D5170; --m-muted:#5A6B85; --m-faint:#8A97AC;
  --m-line:#D9E2F0; --m-line-soft:#E1E8F2; --m-bg:#F4F7FC;
  --m-blue-bg:#EAF1FB; --m-green:#1E9E5A; --m-green-bg:#E8F7EF;
  --m-red:#E5484D; --m-red-bg:#FCEBEC;
  --m-orange-bg:#FDEDF0; --m-orange-bg2:#FDEFDE;
  --m-r:10px; --m-r-lg:14px; --m-shadow:0 24px 48px -8px rgba(13,31,77,.28);
}

/* ============================================================
   顶栏账户区（auth.js 注入 .topbar .links）
   ============================================================ */
.topbar .acct{display:inline-flex;align-items:center;gap:8px;margin-left:10px;position:relative}
/* 主站有条旧规则 .topbar .links span{opacity:.32}（用于淡化分隔符），
   账户区内部全由 span 构成，这里统一恢复不透明，避免登录态发灰 */
.topbar .acct span{opacity:1!important}
.topbar .acct a{opacity:1!important}
.topbar .acct a{margin-left:0!important}
/* 主站页面里 .topbar .links span{color:#D3DCEA} 等低权重规则会盖过 .acct-name，
   这里用更高权重把账户区文字与徽标颜色定回来 */
.topbar .acct .acct-name{color:var(--m-ink)!important;font-weight:600}
.topbar .acct .acct-av{color:#fff!important}
.topbar .acct .acct-role{color:#fff!important}
.topbar .acct-sep{color:#D3DCEA}
.acct-chip{display:inline-flex;align-items:center;gap:7px;cursor:pointer;user-select:none;padding:2px 4px;border-radius:999px;transition:background .15s}
.acct-chip:hover{background:rgba(255,255,255,.55)}
.acct-av{width:24px;height:24px;border-radius:50%;background:var(--m-blue);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;flex-shrink:0}
.acct-av.sup{background:var(--m-orange)}
.acct-name{color:var(--ink);font-weight:500;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.acct-role{font-size:10px;padding:1px 8px;border-radius:999px;color:#fff;line-height:1.6}
.acct-role.buyer{background:var(--m-blue)}
.acct-role.supplier{background:var(--m-orange)}

/* 头像下拉菜单（严格按身份区分） */
.acct-menu{position:absolute;top:calc(100% + 10px);right:0;width:264px;background:#fff;border-radius:12px;box-shadow:0 16px 32px -8px rgba(13,31,77,.25);overflow:hidden;z-index:1300;display:none;text-align:left}
.acct-menu.open{display:block;animation:mFade .18s ease}
@keyframes mFade{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.acct-menu-head{display:flex;align-items:center;gap:10px;padding:14px 16px;background:var(--m-bg)}
.acct-menu-head .acct-av{width:38px;height:38px;font-size:15px}
.acct-menu-info{flex:1;min-width:0}
.acct-menu-info b{display:block;font-size:14px;color:var(--m-ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.acct-menu-info span{display:block;font-size:11px;color:var(--m-faint);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.acct-menu-cap{font-size:11px;color:var(--m-faint);padding:10px 16px 2px}
.acct-menu a.mi{display:flex;align-items:center;gap:10px;height:42px;padding:0 16px;font-size:13px;color:var(--m-ink);text-decoration:none}
.acct-menu a.mi:hover{background:var(--m-bg)}
.acct-menu a.mi .ico{width:26px;height:26px;border-radius:6px;background:var(--m-blue-bg);color:var(--m-blue);display:inline-flex;align-items:center;justify-content:center;font-size:11px;font-weight:600;flex-shrink:0}
.acct-menu a.mi .lbl{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.acct-menu a.mi .cnt{font-size:11px;font-weight:600;color:var(--m-blue)}
.acct-menu a.mi.hot{background:var(--m-orange-bg2)}
.acct-menu a.mi.hot .ico{background:var(--m-orange);color:#fff}
.acct-menu a.mi.hot .lbl{color:var(--m-orange-d);font-weight:600}
.acct-menu a.mi.hot .cnt{background:var(--m-orange);color:#fff;border-radius:999px;padding:1px 8px;font-size:10px}
.acct-menu a.mi.out{color:var(--m-red)}
.acct-menu a.mi.out .ico{background:var(--m-red-bg);color:var(--m-red)}
.acct-menu .mi-div{height:1px;background:var(--m-line-soft);margin:4px 0}

/* ============================================================
   登录弹窗（居中遮罩，不跳页）
   ============================================================ */
.m-modal-mask{position:fixed;inset:0;background:rgba(14,42,92,.62);z-index:2000;display:flex;align-items:center;justify-content:center;padding:20px;animation:mFade .2s ease}
.m-modal{width:440px;max-width:100%;max-height:92vh;overflow:auto;background:#fff;border-radius:16px;padding:36px 36px 30px;position:relative;box-shadow:var(--m-shadow)}
.m-modal .m-close{position:absolute;top:14px;right:14px;width:32px;height:32px;border:none;border-radius:8px;background:var(--m-bg);color:var(--m-muted);font-size:14px;cursor:pointer;line-height:1}
.m-modal .m-close:hover{background:var(--m-line-soft)}
.m-modal h3{font-size:24px;color:var(--m-ink);margin:0 0 6px;font-weight:700}
.m-modal .m-sub{font-size:13px;color:var(--m-muted);margin:0 0 20px}
.m-field{margin-bottom:14px}
.m-field label{display:block;font-size:13px;font-weight:500;color:var(--m-ink);margin-bottom:7px}
.m-input{width:100%;height:48px;padding:0 14px;border:1px solid var(--m-line);border-radius:var(--m-r);font-size:15px;color:var(--m-ink);background:#fff;box-sizing:border-box;outline:none;transition:border-color .15s,box-shadow .15s;font-family:inherit}
.m-input:focus{border-color:var(--m-blue);box-shadow:0 0 0 3px rgba(29,95,209,.12)}
.m-input.err{border-color:var(--m-red)}
.m-input::placeholder{color:var(--m-faint)}
.m-err{font-size:12px;color:var(--m-red);margin:-6px 0 10px;display:none}
.m-err.show{display:block}
.m-row-between{display:flex;align-items:center;justify-content:space-between;margin:2px 0 16px;font-size:13px}
.m-row-between a{color:var(--m-blue);text-decoration:none;font-weight:500}
.m-check{display:inline-flex;align-items:center;gap:8px;color:var(--m-muted);cursor:pointer}
.m-check input{width:15px;height:15px;accent-color:var(--m-blue)}
.m-btn{display:flex;align-items:center;justify-content:center;width:100%;height:48px;border:none;border-radius:var(--m-r);background:var(--m-blue);color:#fff;font-size:16px;font-weight:500;cursor:pointer;font-family:inherit;transition:background .15s}
.m-btn:hover{background:var(--m-blue-d)}
.m-btn.orange{background:var(--m-orange)}
.m-btn.orange:hover{background:var(--m-orange-d)}
.m-btn.ghost{background:#fff;color:var(--m-ink);border:1px solid var(--m-line)}
.m-btn.ghost:hover{border-color:var(--m-blue);color:var(--m-blue);background:#fff}
.m-btn[disabled]{opacity:.55;cursor:not-allowed}
.m-div{display:flex;align-items:center;gap:12px;margin:18px 0;color:var(--m-faint);font-size:12px}
.m-div::before,.m-div::after{content:'';flex:1;height:1px;background:var(--m-line-soft)}
.m-foot{margin-top:16px;text-align:center;font-size:13px;color:var(--m-muted)}
.m-foot a{color:var(--m-orange);font-weight:500;text-decoration:none}
.m-hint{margin-top:14px;padding:10px 14px;border-radius:var(--m-r);font-size:12px;line-height:1.6;display:none}
.m-hint.show{display:block}
.m-hint.ok{background:var(--m-green-bg);color:var(--m-green)}
.m-hint.bad{background:var(--m-red-bg);color:var(--m-red)}

/* 全局 toast */
.m-toast{position:fixed;left:50%;bottom:36px;transform:translateX(-50%);background:var(--m-ink);color:#fff;padding:11px 22px;border-radius:999px;font-size:13px;z-index:3000;box-shadow:0 10px 26px rgba(13,31,77,.35);animation:mToast .25s ease;max-width:86vw;text-align:center}
@keyframes mToast{from{opacity:0;transform:translate(-50%,10px)}to{opacity:1;transform:translate(-50%,0)}}
.m-toast.ok{background:var(--m-green)}
.m-toast.bad{background:var(--m-red)}

/* ============================================================
   注册页 register.html
   ============================================================ */
.reg-page{min-height:100vh;display:flex;background:var(--m-bg)}
.reg-brand{width:400px;flex-shrink:0;background:var(--m-deep);color:#fff;padding:48px 44px 40px;display:flex;flex-direction:column;gap:28px}
.reg-brand .rb-logo{font-size:26px;font-weight:700;letter-spacing:.04em}
.reg-brand .rb-logo-sub{font-size:12px;opacity:.65;margin-top:4px}
.reg-brand h2{font-size:30px;line-height:1.35;margin:6px 0 0;font-weight:700}
.reg-brand .rb-sub{font-size:13px;opacity:.8;line-height:1.7;margin:0}
.reg-brand ul{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:14px}
.reg-brand li{display:flex;gap:10px;font-size:13px;opacity:.85;line-height:1.6}
.reg-brand li::before{content:'';width:8px;height:8px;border-radius:50%;background:var(--m-orange);flex-shrink:0;margin-top:6px}
.reg-brand .rb-note{margin-top:auto;padding:16px 18px;border-radius:10px;background:rgba(255,255,255,.08);font-size:12px;line-height:1.7}
.reg-brand .rb-note b{display:block;margin-bottom:4px}
.reg-brand .rb-note span{opacity:.6}
.reg-main{flex:1;min-width:0;padding:48px 64px 28px;display:flex;flex-direction:column;gap:16px;overflow:auto}
.reg-step{display:flex;gap:8px;align-items:center;font-size:13px}
.reg-step b{color:var(--m-blue);font-weight:600}
.reg-step span{color:var(--m-muted)}
.reg-prog{display:flex;gap:6px;height:4px}
.reg-prog i{flex:1;border-radius:2px;background:var(--m-line)}
.reg-prog i.on{background:var(--m-blue)}
.reg-main h1{font-size:26px;color:var(--m-ink);margin:2px 0 0;font-weight:700}
.reg-main .reg-sub{font-size:13px;color:var(--m-muted);line-height:1.7;margin:-6px 0 0}
.reg-lock{display:flex;gap:8px;padding:10px 14px;border-radius:8px;background:var(--m-orange-bg2);font-size:12px;line-height:1.65;color:#B9531F;align-items:flex-start}
.reg-lock::before{content:'⚠';flex-shrink:0}
/* 身份卡片：按内容自适应高度，不再拉伸填满视口（否则高屏下留白巨大） */
.id-cards{display:flex;gap:20px;align-items:stretch}
.id-card{flex:1;background:#fff;border:1px solid var(--m-line);border-radius:var(--m-r-lg);padding:22px;display:flex;flex-direction:column;gap:10px;cursor:pointer;text-align:left;font-family:inherit;transition:all .15s;position:relative}
.id-card:hover{border-color:var(--m-blue);box-shadow:0 10px 24px -8px rgba(29,95,209,.2)}
.id-card.sel{border:2px solid var(--m-blue);background:#F5F9FF;box-shadow:0 12px 24px -6px rgba(29,95,209,.16)}
.id-card .id-head{display:flex;align-items:center;gap:13px}
.id-card .id-ico{width:46px;height:46px;border-radius:13px;display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:700}
.id-card.buyer .id-ico{background:var(--m-blue-bg);color:var(--m-blue)}
.id-card.supplier .id-ico{background:var(--m-orange-bg2);color:var(--m-orange)}
.id-card h3{font-size:17px;color:var(--m-ink);margin:0;font-weight:700}
.id-card .id-desc{font-size:13px;color:var(--m-muted);line-height:1.7;margin:0}
.id-card .id-feats{font-size:12px;color:var(--m-body);line-height:1.9;margin:0;padding-top:8px;border-top:1px dashed var(--m-line)}
.id-card .id-chip{position:absolute;top:16px;right:16px;display:none;align-items:center;gap:5px;background:var(--m-blue);color:#fff;font-size:11px;font-weight:600;padding:5px 13px;border-radius:999px}
.id-card.sel .id-chip{display:inline-flex}
.reg-foot{display:flex;align-items:center;justify-content:space-between;margin-top:22px;padding-top:10px}
.reg-foot .back{color:var(--m-blue);font-size:13px;font-weight:500;text-decoration:none;cursor:pointer;background:none;border:none;font-family:inherit}
.reg-foot .go{display:inline-flex;align-items:center;justify-content:center;min-width:170px;height:46px;padding:0 22px;border:none;border-radius:var(--m-r);background:var(--m-blue);color:#fff;font-size:14px;font-weight:500;cursor:pointer;font-family:inherit}
.reg-foot .go:hover{background:var(--m-blue-d)}
.reg-foot .go[disabled]{opacity:.5;cursor:not-allowed}
.reg-foot .has{font-size:13px;color:var(--m-blue);font-weight:500;text-decoration:none}
.reg-cols{display:flex;gap:16px}
.reg-cols>div{flex:1;min-width:0}
.reg-label{display:block;font-size:13px;font-weight:500;color:var(--m-ink);margin:0 0 7px}
.reg-label small{color:var(--m-faint);font-weight:400}
.chip-verified{display:inline-flex;align-items:center;gap:6px;background:var(--m-green-bg);color:var(--m-green);font-size:12px;font-weight:600;padding:7px 14px;border-radius:8px}
.chip-verified+button{background:none;border:none;color:var(--m-blue);font-size:12px;font-weight:500;cursor:pointer;margin-left:10px;font-family:inherit}
.pwd-meter{display:flex;align-items:center;gap:10px;margin-top:8px}
.pwd-meter i{width:40px;height:4px;border-radius:2px;background:var(--m-line)}
.pwd-meter i.on{background:var(--m-orange)}
.pwd-meter span{font-size:11px;color:var(--m-faint)}
.code-row{display:flex;gap:10px;margin-bottom:10px}
.code-row input{width:52px;height:56px;text-align:center;font-size:22px;font-weight:700;border:1px solid var(--m-line);border-radius:var(--m-r);color:var(--m-ink);outline:none;font-family:inherit}
.code-row input:focus{border-color:var(--m-blue);box-shadow:0 0 0 3px rgba(29,95,209,.12)}
.email-row{display:flex;align-items:center;gap:8px}
.email-row .m-input{flex:1}
.btn-resend{height:36px;padding:0 14px;border:none;border-radius:8px;background:var(--m-bg);color:var(--m-faint);font-size:12px;cursor:pointer;white-space:nowrap;font-family:inherit}
.btn-resend.ready{background:var(--m-blue-bg);color:var(--m-blue);font-weight:500}
.btn-resend[disabled]{cursor:not-allowed}
.rules-card{background:#fff;border:1px solid var(--m-line);border-radius:12px;padding:16px 18px}
.rules-card b{display:block;font-size:12px;color:var(--m-ink);margin-bottom:8px}
.rules-card p{font-size:12px;color:var(--m-muted);line-height:1.9;margin:0}
.audit-card{background:var(--m-orange-bg2);border-radius:var(--m-r);padding:14px 16px;font-size:12px;line-height:1.7;color:#B9531F}
.audit-card b{display:block;margin-bottom:4px}
.upload-box{display:flex;align-items:center;justify-content:center;gap:8px;height:64px;border:1px dashed var(--m-line);border-radius:var(--m-r);background:#fff;color:var(--m-faint);font-size:12px;cursor:pointer}
.upload-box b{color:var(--m-blue);font-size:16px;font-weight:400}
.agree-row{display:flex;flex-direction:column;gap:5px}
.agree-row .m-check{font-size:12px}
.agree-row .m-err{margin:0}

/* ============================================================
   会员工作台 member.html / change-request.html
   ============================================================ */
.dash{min-height:100vh;display:flex;flex-direction:column;background:var(--m-bg)}
.dash-topbar{height:60px;background:var(--m-deep);color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 32px;flex-shrink:0}
.dash-topbar .dt-logo{font-size:16px;font-weight:700;text-decoration:none;color:#fff}
.dash-topbar .dt-user{display:flex;align-items:center;gap:10px}
.dash-topbar .acct-av{width:32px;height:32px;font-size:13px}
.dash-topbar .dt-name{font-size:13px;font-weight:500}
.dash-topbar .acct-role{font-size:10px}
.dash-topbar a.dt-exit{color:rgba(255,255,255,.75);font-size:12px;text-decoration:none}
.dash-topbar a.dt-exit:hover{color:#fff}
.dash-body{flex:1;display:flex;min-height:0}
.dash-side{width:220px;flex-shrink:0;background:#fff;padding:20px 12px;display:flex;flex-direction:column;gap:6px}
.dash-side a.si{display:flex;align-items:center;gap:10px;height:44px;padding:0 14px;border-radius:var(--m-r);font-size:13px;color:var(--m-body);text-decoration:none}
.dash-side a.si:hover{background:var(--m-bg)}
.dash-side a.si.on{background:var(--m-blue-bg);color:var(--m-blue);font-weight:600}
.dash-side a.si.hot{background:var(--m-orange-bg2);color:var(--m-orange-d);font-weight:600}
.dash-side a.si.hot::before{content:'';width:8px;height:8px;border-radius:50%;background:var(--m-orange)}
.dash-side .sp{flex:1}
.dash-side a.si.dim{color:var(--m-faint)}
.dash-main{flex:1;min-width:0;padding:24px;display:flex;flex-direction:column;gap:18px;overflow:auto}
.dash-greet{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.dash-greet .dg-l{display:flex;align-items:center;gap:10px}
.dash-greet h1{font-size:22px;color:var(--m-ink);margin:0;font-weight:700}
.dash-greet .g-chip{font-size:10px;font-weight:600;padding:3px 10px;border-radius:999px}
.dash-greet .g-chip.buyer{background:var(--m-blue-bg);color:var(--m-blue)}
.dash-greet .g-chip.supplier{background:var(--m-orange-bg2);color:var(--m-orange)}
.dash-greet .dg-btn{display:inline-flex;align-items:center;height:40px;padding:0 18px;border:none;border-radius:var(--m-r);background:var(--m-orange);color:#fff;font-size:13px;font-weight:500;cursor:pointer;text-decoration:none;font-family:inherit}
.dash-greet .dg-btn:hover{background:var(--m-orange-d)}
.stat-row{display:flex;gap:16px;flex-wrap:wrap}
.stat{flex:1;min-width:150px;background:#fff;border-radius:12px;padding:18px;display:flex;flex-direction:column;gap:8px}
.stat small{font-size:12px;color:var(--m-faint)}
.stat b{font-size:26px;font-weight:700;color:var(--m-ink);line-height:1.1}
.stat b.green{color:var(--m-green)}
.stat b.orange{color:var(--m-orange)}
.stat b.blue{color:var(--m-blue)}
.panel{background:#fff;border-radius:12px;padding:20px;display:flex;flex-direction:column;gap:12px}
.panel-head{display:flex;align-items:center;justify-content:space-between}
.panel-head h3{font-size:15px;color:var(--m-ink);margin:0;font-weight:700}
.panel-head a{font-size:12px;color:var(--m-blue);font-weight:500;text-decoration:none}
.tbl{width:100%;border-collapse:collapse}
.tbl th{font-size:11px;font-weight:600;color:var(--m-faint);text-align:left;padding:8px 12px;background:var(--m-bg);white-space:nowrap}
.tbl td{font-size:12px;color:var(--m-body);padding:10px 12px;border:1px solid var(--m-bg);vertical-align:middle}
.tbl td.strong{color:var(--m-ink)}
.chip{display:inline-block;font-size:10px;font-weight:600;padding:3px 10px;border-radius:999px;white-space:nowrap}
.chip.green{background:var(--m-green-bg);color:var(--m-green)}
.chip.orange{background:var(--m-orange-bg2);color:var(--m-orange)}
.chip.blue{background:var(--m-blue-bg);color:var(--m-blue)}
.chip.gold{background:#FCF3E3;color:#B7791F}
.chip.red{background:var(--m-red-bg);color:var(--m-red)}
.perm-card{background:var(--m-orange-bg2);border-radius:12px;padding:16px 20px}
.perm-card b{display:block;font-size:13px;color:#B9531F;margin-bottom:6px}
.perm-card p{font-size:12px;color:#B9531F;line-height:1.7;margin:0}
.post-line{display:flex;align-items:center;gap:10px;font-size:12px}
.post-line .cat{color:var(--m-blue);font-size:10px;font-weight:600;flex-shrink:0}
.post-line .t{flex:1;color:var(--m-ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.post-line .meta{color:var(--m-faint);font-size:10px;flex-shrink:0}
.empty-tip{padding:28px;text-align:center;font-size:13px;color:var(--m-faint)}

/* 商品变更申请单 */
.cr-wrap{max-width:1120px;margin:0 auto;padding:40px 48px 32px;display:flex;flex-direction:column;gap:20px;width:100%}
.cr-head h1{font-size:24px;color:var(--m-ink);margin:0 0 6px;font-weight:700}
.cr-head p{font-size:13px;color:var(--m-muted);margin:0}
.cr-body{display:flex;gap:20px;align-items:flex-start}
.cr-form{flex:1;min-width:0;background:#fff;border-radius:var(--m-r-lg);padding:24px;display:flex;flex-direction:column;gap:14px}
.type-row{display:flex;gap:12px}
.type-opt{flex:1;height:56px;display:flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--m-line);border-radius:var(--m-r);background:#fff;font-size:14px;font-weight:500;color:var(--m-body);cursor:pointer;font-family:inherit}
.type-opt.sel{border:2px solid var(--m-blue);background:#F5F9FF;color:var(--m-blue);font-weight:700}
.type-opt.sel::after{content:'✓ 已选';font-size:10px;font-weight:600}
textarea.m-input{height:88px;padding:14px;resize:vertical;line-height:1.7}
.pic-row{display:flex;gap:12px}
.pic-slot{width:72px;height:72px;border:1px dashed var(--m-line);border-radius:var(--m-r);background:#fff;display:flex;align-items:center;justify-content:center;color:var(--m-blue);font-size:16px;cursor:pointer}
.cr-hist{width:340px;flex-shrink:0;background:#fff;border-radius:var(--m-r-lg);padding:20px;display:flex;flex-direction:column;gap:12px}
.cr-hist h3{font-size:15px;color:var(--m-ink);margin:0;font-weight:700}
.rec{background:var(--m-bg);border-radius:var(--m-r);padding:14px;display:flex;flex-direction:column;gap:7px}
.rec .rec-head{display:flex;justify-content:space-between;align-items:center}
.rec .rec-t{font-size:12px;color:var(--m-ink)}
.rec .rec-meta{font-size:11px;color:var(--m-faint)}
.rec .rec-reason{font-size:11px;color:var(--m-red);line-height:1.6}
.cr-note{font-size:11px;color:var(--m-faint);line-height:1.7}

/* 响应式 */
@media (max-width:1024px){
  .reg-brand{display:none}
  .reg-main{padding:32px 24px}
  .id-cards{flex-direction:column}
  .dash-side{display:none}
  .cr-body{flex-direction:column}
  .cr-hist{width:100%}
}
@media (max-width:640px){
  .m-modal{padding:26px 20px 22px}
  .reg-cols{flex-direction:column}
  .code-row input{width:44px;height:50px}
  .stat{min-width:calc(50% - 8px)}
}