:root{--bg:#f5f7fa;--surface:#fff;--ink:#17212b;--muted:#6b7886;--line:#e1e7ec;--blue:#0a84ff;--blue-dark:#066fce;--green:#20bf6b;--red:#d74747;--amber:#bd7916;--indigo:#5856d6;--nav:#17212b;--radius:12px;--radius-lg:16px;--shadow:0 8px 28px rgba(25,45,65,.06);--content-width:980px}
*{box-sizing:border-box}html{font-size:16px}body{margin:0;background:var(--bg);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;letter-spacing:0}button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.55}a{color:inherit}.hidden{display:none!important}.eyebrow{margin:0 0 5px;color:var(--blue-dark);font-size:.75rem;font-weight:700;text-transform:uppercase}.button{min-height:42px;border:1px solid transparent;border-radius:var(--radius);padding:9px 16px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:700;white-space:nowrap}.button svg,.icon-button svg,.nav-item svg{width:18px;height:18px}.button.primary{background:var(--blue);color:#fff}.button.primary:hover{background:var(--blue-dark)}.button.secondary{background:#fff;border-color:var(--line);color:var(--ink)}.button.danger-outline{background:#fff;border-color:#efb9b9;color:var(--red)}.button.full{width:100%}.icon-button{width:40px;height:40px;border:0;background:transparent;color:inherit;display:grid;place-items:center;border-radius:50%}.icon-button:hover{background:rgba(100,120,140,.12)}.text-button,.text-link{border:0;background:none;color:var(--blue-dark);font-weight:700;text-decoration:none;padding:4px}.form-message{min-height:20px;margin:9px 0 0;color:var(--red);font-size:.85rem}.toast{position:fixed;left:50%;bottom:24px;z-index:1000;transform:translate(-50%,20px);background:#18212b;color:#fff;padding:11px 18px;border-radius:var(--radius);opacity:0;pointer-events:none;transition:.2s;box-shadow:var(--shadow)}.toast.show{opacity:1;transform:translate(-50%,0)}.toast[data-tone="error"]{background:var(--red)}

.auth-page{min-height:100vh;background:#eef3f6;display:grid;place-items:center;padding:24px}.auth-shell{width:min(840px,100%);display:grid;grid-template-columns:1fr 400px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);min-height:520px}.auth-brand{padding:64px 52px;background:#152b3a;color:#fff;display:flex;flex-direction:column;justify-content:center}.auth-brand h1{font-size:2rem;margin:22px 0 8px}.auth-brand p{margin:0;color:#b8c8d4}.brand-mark{width:72px;height:54px;display:grid;gap:6px;transform:skewX(-20deg)}.brand-mark span{background:var(--green);border-radius:20px}.brand-mark span:nth-child(2){background:#53b4e9;width:80%}.brand-mark span:nth-child(3){background:#b6dc4a;width:60%}.auth-panel{padding:54px 42px;display:flex;flex-direction:column;justify-content:center}.auth-panel h2{font-size:1.6rem;margin:0 0 28px}.auth-panel form{display:grid;gap:16px}.auth-panel label,.recharge-form label,.tool-form label{font-size:.82rem;color:var(--muted);font-weight:700;display:grid;gap:7px}.auth-panel input,.recharge-form input,.tool-form input,.tool-form select,.filter-bar input,.filter-bar select,.search-row input,.captcha-input{width:100%;height:46px;border:1px solid var(--line);border-radius:var(--radius);padding:0 13px;background:#fff;color:var(--ink);outline:none}.auth-panel input:focus,.recharge-form input:focus,.tool-form input:focus,.tool-form select:focus,.filter-bar input:focus,.filter-bar select:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(20,137,214,.12)}.auth-panel .text-link{margin-top:20px;text-align:center;font-size:.88rem}

.topbar{height:62px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 max(18px,calc((100vw - 1100px)/2));position:sticky;top:0;z-index:20}.brand{display:flex;gap:10px;align-items:center;text-decoration:none}.brand-dot{width:13px;height:13px;background:var(--green);border:4px solid #d8f5e6;border-radius:50%;box-sizing:content-box}.topbar-actions{display:flex;align-items:center;gap:8px}.user-name{font-size:.88rem;color:var(--muted)}.customer-main{max-width:1100px;margin:0 auto}.batch-band,.orders-band{padding:36px 22px}.section-heading,.page-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:20px}.section-heading h1,.section-heading h2,.page-heading h1{margin:0;font-size:1.55rem}.batch-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.batch-item{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:18px}.batch-item header{display:flex;justify-content:space-between;align-items:center;padding-bottom:14px;border-bottom:1px solid var(--line)}.batch-item header strong{font-size:.95rem}.batch-tag{font-size:.72rem;color:var(--blue-dark);background:#eaf6fd;padding:4px 8px;border-radius:3px}.face-progress{padding-top:14px}.face-progress+.face-progress{margin-top:12px;border-top:1px solid #edf0f2}.face-line{display:flex;justify-content:space-between;gap:10px}.face-line strong{font-size:1.05rem}.face-line span{font-size:.82rem;color:var(--muted)}.progress{height:7px;background:#edf1f4;margin:10px 0 8px;overflow:hidden;border-radius:4px}.progress span{display:block;height:100%;background:var(--green);border-radius:4px}.face-meta{display:flex;gap:16px;color:var(--muted);font-size:.76rem}.recharge-band{background:#fff;border-block:1px solid var(--line);padding:38px max(22px,calc((100vw - 1100px)/2))}.recharge-layout{display:grid;grid-template-columns:280px 1fr;gap:56px;align-items:start}.recharge-heading h2{font-size:1.65rem;margin:0 0 8px}.recharge-heading>p:last-child{color:var(--muted);font-size:.86rem}.recharge-form{display:grid;grid-template-columns:minmax(180px,1.3fr) minmax(150px,.8fr) auto;gap:14px;align-items:end}.input-with-icon{position:relative}.input-with-icon svg{position:absolute;width:18px;height:18px;left:13px;top:14px;color:var(--muted)}.input-with-icon input{padding-left:40px}.amount-input{display:flex;border:1px solid var(--line);border-radius:var(--radius);height:46px;align-items:center}.amount-input span{padding-left:12px;color:var(--muted)}.amount-input input{border:0;height:44px;padding-left:7px}.recharge-form .form-message{grid-column:1/-1}.order-list{background:#fff;border:1px solid var(--line);border-radius:var(--radius)}.order-row{display:grid;grid-template-columns:minmax(150px,1fr) 120px 130px 135px auto;gap:12px;align-items:center;padding:14px 16px;border-bottom:1px solid var(--line);font-size:.86rem}.order-row:last-child{border-bottom:0}.order-primary strong{display:block}.order-primary small{color:var(--muted)}.order-link{border:0;background:none;color:var(--blue-dark);font-weight:700;padding:0;text-align:left}.status{display:inline-flex;align-items:center;width:max-content;padding:4px 8px;border-radius:3px;font-size:.75rem;font-weight:700;background:#edf1f4;color:#52606d}.status.success{background:#e5f8ee;color:#117b42}.status.running,.status.queued,.status.waiting_captcha,.status.processing{background:#e8f4fc;color:#0c6ca8}.status.partial{background:#fff1dc;color:#995c08}.status.failed,.status.cancelled{background:#fbeaea;color:#a62f2f}.empty-state{padding:30px;text-align:center;color:var(--muted);background:#fff;border:1px dashed #cfd8df;border-radius:var(--radius)}.empty-state svg{width:30px;height:30px}.skeleton{background:linear-gradient(90deg,#edf1f4 25%,#f7f8f9 50%,#edf1f4 75%);background-size:200% 100%;animation:skeleton 1.2s infinite}.skeleton.block{height:140px}.skeleton.row{height:64px}@keyframes skeleton{to{background-position:-200% 0}}

.dialog-backdrop{position:fixed;inset:0;background:rgba(12,23,32,.58);display:grid;place-items:center;padding:18px;z-index:100}.dialog{background:#fff;border-radius:var(--radius);box-shadow:0 20px 60px rgba(0,0,0,.22);width:min(100%,480px);max-height:90vh;overflow:auto;padding:22px}.dialog.wide{width:min(900px,100%)}.dialog header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:18px}.dialog h2{margin:0;font-size:1.25rem}.dialog-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}.confirm-list{margin:0;background:#f6f8fa;padding:4px 16px}.confirm-list div{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--line)}.confirm-list div:last-child{border:0}.confirm-list dt{color:var(--muted)}.confirm-list dd{margin:0;font-weight:700}.search-row,.filter-bar{display:flex;gap:10px;align-items:center;margin-bottom:16px}.search-row svg{width:18px}.scroll-list{max-height:60vh;overflow:auto}.captcha-phone{text-align:center}.captcha-image-button{display:block;margin:16px auto 5px;border:1px solid var(--line);background:#fff;padding:8px;min-width:180px;min-height:72px}.captcha-image-button img{max-width:220px;display:block}.captcha-hint{text-align:center;color:var(--blue-dark);font-size:.82rem}.countdown{text-align:center;color:var(--muted);font-size:.8rem;margin:10px}.countdown span{font-weight:800;color:var(--ink)}.captcha-input{text-align:center;font-size:1.2rem;letter-spacing:0}.large-number{text-align:center;font-size:2rem;font-weight:800}.receipt{width:min(900px,100%);min-height:450px;background:#fff;position:relative;padding:72px 56px}.receipt-close{position:absolute;right:-12px;top:-12px;width:36px;height:36px;border-radius:50%;border:2px solid #fff;background:#747b80;color:#fff;display:grid;place-items:center}.receipt-content{display:grid;grid-template-columns:58px 1fr 230px;gap:20px;align-items:start}.success-icon{width:48px;height:48px;border-radius:50%;background:#1fbd68;color:#fff;display:grid;place-items:center}.success-icon svg{width:30px}.receipt-copy h2{color:#0aa4ef;margin:0 0 18px}.receipt-copy p{margin:10px 0}.receipt-copy strong{font-size:1.2rem}.receipt-note{color:#41484e}.receipt-home{margin-top:18px;width:225px;height:44px;border:0;border-radius:22px;background:#2b84ef;color:#fff;font-weight:700}.cmhk-wordmark{color:#0688d1;display:grid;grid-template-columns:60px 1fr;align-items:center}.cmhk-symbol{grid-row:1/3;width:52px;height:52px;border:6px double #1594cf;border-radius:50%;display:grid;place-items:center;color:#73ba42;font-weight:900;font-size:1.4rem}.cmhk-wordmark strong{font-size:1.7rem;white-space:nowrap}.cmhk-wordmark small{font-size:1.25rem}.dialog-open{overflow:hidden}

.admin-body{background:#f3f5f7}.sidebar{position:fixed;left:0;top:0;bottom:0;width:230px;background:var(--nav);color:#d9e1e7;display:flex;flex-direction:column;padding:18px 12px;z-index:50}.sidebar-brand{display:flex;align-items:center;gap:11px;padding:8px 10px 25px}.sidebar-brand div{display:grid}.sidebar-brand small{font-size:.72rem;color:#91a0ad;margin-top:2px}.sidebar nav{display:grid;gap:3px}.nav-item{height:42px;border:0;border-radius:5px;background:transparent;color:#b9c5ce;display:flex;align-items:center;gap:11px;padding:0 12px;text-align:left}.nav-item:hover,.nav-item.active{background:#253542;color:#fff}.nav-item.logout{margin-top:auto}.nav-badge{margin-left:auto;background:var(--red);color:#fff;border-radius:10px;padding:1px 6px;font-size:.68rem}.admin-main{margin-left:230px;padding:34px;max-width:1600px}.admin-view{display:none}.admin-view.active{display:block}.page-heading{align-items:center}.page-heading h1{font-size:1.75rem}.metrics{display:grid;grid-template-columns:repeat(4,minmax(140px,1fr));gap:12px;margin-bottom:22px}.metric{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:17px}.metric small{color:var(--muted)}.metric strong{display:block;font-size:1.65rem;margin-top:6px}.overview-grid,.settings-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:16px}.data-panel{background:#fff;border:1px solid var(--line);border-radius:var(--radius)}.data-panel>header{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;border-bottom:1px solid var(--line)}.data-panel h2{font-size:1rem;margin:0}.action-line,.stock-line,.setting-row{display:flex;justify-content:space-between;align-items:center;padding:13px 16px;border-bottom:1px solid var(--line);font-size:.86rem}.action-line:last-child,.stock-line:last-child,.setting-row:last-child{border-bottom:0}.alert-banner{display:flex;gap:12px;background:#fff3f3;border:1px solid #efb7b7;color:#8c2727;padding:14px;margin-bottom:18px;border-radius:var(--radius)}.alert-banner svg{flex:none}.alert-banner p{margin:3px 0 0}.table-wrap{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:auto}table{width:100%;border-collapse:collapse;font-size:.82rem}th{background:#f7f8f9;color:#66727e;text-align:left;font-weight:700;padding:11px 12px;white-space:nowrap}td{padding:12px;border-top:1px solid var(--line);vertical-align:middle}td .button{min-height:32px;padding:5px 10px;font-size:.75rem}.tool-form{background:#fff;border:1px solid var(--line);padding:18px;display:grid;grid-template-columns:1fr 1fr auto;gap:14px;align-items:end;border-radius:var(--radius)}.import-preview{background:#fff;border:1px solid var(--line);padding:18px;margin-top:16px}.preview-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:14px 0}.preview-metrics div{background:#f5f7f8;padding:12px}.preview-metrics strong{display:block;font-size:1.25rem}.filter-bar .input-with-icon{min-width:260px;flex:1}.filter-bar select{width:auto;min-width:140px;height:42px;border:1px solid var(--line);border-radius:var(--radius);padding:0 10px}.integrity-badge{font-size:.76rem;padding:5px 9px;border-radius:3px}.integrity-badge.ok{background:#e5f8ee;color:#117b42}.integrity-badge.bad{background:#fbeaea;color:#a62f2f}.admin-mobile-bar{display:none}

@media(max-width:760px){.auth-page{padding:0}.auth-shell{display:block;min-height:100vh}.auth-brand{padding:28px 24px}.brand-mark{width:48px;height:36px}.auth-brand h1{font-size:1.4rem;margin:12px 0 4px}.auth-panel{padding:32px 24px}.batch-grid{grid-template-columns:1fr}.recharge-layout{grid-template-columns:1fr;gap:18px}.recharge-form{grid-template-columns:1fr}.order-row{grid-template-columns:1fr auto}.order-row>*:nth-child(3),.order-row>*:nth-child(4){display:none}.receipt{padding:42px 24px;min-height:520px}.receipt-content{grid-template-columns:50px 1fr}.cmhk-wordmark{grid-column:1/-1;margin-top:28px;justify-self:center}.receipt-copy strong{font-size:1rem}.sidebar{transform:translateX(-100%);transition:.2s}.sidebar.open{transform:translateX(0)}.admin-main{margin-left:0;padding:20px 14px}.admin-mobile-bar{height:56px;background:#fff;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;padding:0 10px}.metrics{grid-template-columns:repeat(2,1fr)}.overview-grid,.settings-grid{grid-template-columns:1fr}.tool-form{grid-template-columns:1fr}.filter-bar{align-items:stretch;flex-direction:column}.filter-bar .input-with-icon{min-width:0}.filter-bar select{width:100%}.preview-metrics{grid-template-columns:repeat(2,1fr)}.dialog-actions{flex-direction:column-reverse}.dialog-actions .button{width:100%}.section-heading h1,.section-heading h2{font-size:1.3rem}.customer-topbar{padding:0 14px}.user-name{display:none}}
.number-confirm-warning{margin:14px 0 0;padding:10px 12px;border-radius:8px;background:#fff7e6;color:#8a5200;font-size:.82rem;line-height:1.5}

/* Unified responsive visual baseline shared by every application surface. */
button,input,select,textarea{font:inherit}
.button{border-radius:var(--radius);transition:background .18s,border-color .18s,transform .18s}
.button:active{transform:scale(.985)}
.toast{border-radius:999px}
.status,.batch-tag,.integrity-badge{border-radius:999px}
.topbar{background:rgba(255,255,255,.96);padding-left:max(18px,calc((100vw - var(--content-width))/2));padding-right:max(18px,calc((100vw - var(--content-width))/2));backdrop-filter:blur(16px)}
.customer-main{max-width:var(--content-width)}
.dialog-backdrop{background:rgba(12,23,32,.48);backdrop-filter:blur(3px)}
.dialog{border-radius:var(--radius-lg)}
.auth-page{background:#f1f5f8}
.auth-shell{width:min(820px,100%);grid-template-columns:1fr 390px;min-height:500px;border-radius:22px;overflow:hidden;box-shadow:0 18px 60px rgba(25,45,65,.1)}
.auth-brand{padding:58px 48px;background:linear-gradient(145deg,#143448,#102938)}
.auth-panel{padding:48px 38px}
.metric,.data-panel,.table-wrap,.tool-form,.import-preview{border-radius:var(--radius-lg);box-shadow:var(--shadow)}
.admin-main .eyebrow{display:none}

@media(max-width:760px){
  .auth-shell{border:0;border-radius:0;box-shadow:none}
  .auth-brand{padding:26px 24px}
  .auth-panel{padding:28px 22px}
  .dialog{border-radius:16px}
  .metric,.data-panel,.table-wrap,.tool-form,.import-preview{border-radius:14px;box-shadow:none}
}

/* Progressive responsive data table: semantic table on desktop, labeled record cards on touch widths. */
@media(max-width:760px){
  .responsive-table-wrap{overflow:visible!important;border:0!important;background:transparent!important;box-shadow:none!important}
  table.responsive-data-table{display:block;width:100%;min-width:0!important;table-layout:auto!important;border-collapse:separate}
  .responsive-data-table colgroup,.responsive-data-table thead{display:none}
  .responsive-data-table tbody{display:grid;gap:12px;width:100%}
  .responsive-data-table tbody tr{display:block;overflow:hidden;width:100%;border:1px solid var(--line);border-radius:14px;background:#fff;box-shadow:0 6px 18px rgb(25 45 65 / 5%)}
  .responsive-data-table tbody td{display:grid;grid-template-columns:92px minmax(0,1fr);align-items:start;gap:10px;width:100%;padding:10px 12px;border:0;border-bottom:1px solid #edf1f4;white-space:normal!important;text-align:left}
  .responsive-data-table tbody td:last-child{border-bottom:0}
  .responsive-data-table tbody td::before{content:attr(data-label);color:var(--muted);font-size:.75rem;font-weight:700;line-height:1.45}
  .responsive-data-table .cell-clip,.responsive-data-table .stacked-cell strong,.responsive-data-table .stacked-cell small{white-space:normal!important;overflow-wrap:anywhere}
  .responsive-data-table td[data-label="操作"] .button{width:100%}
  .responsive-data-table .responsive-empty-row td{display:block;padding:24px;text-align:center}
  .responsive-data-table .responsive-empty-row td::before{display:none}
}
.table-pagination{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:14px;color:var(--muted);font-size:.86rem}.table-pagination>div{display:flex;gap:8px}.table-pagination .button{min-width:82px}
@media(max-width:760px){.table-pagination{align-items:stretch;flex-direction:column}.table-pagination>div{display:grid;grid-template-columns:1fr 1fr}.table-pagination .button{width:100%}}
