*{margin:0;padding:0;box-sizing:border-box;}
body{font-family:"Microsoft YaHei",PingFang SC,Helvetica,Arial,sans-serif;background:#f0f3f7;color:#333;}
.wrap{max-width:480px;margin:0 auto;padding:16px 14px 40px;}
.header{text-align:center;padding:18px 0 10px;}
.header h1{font-size:20px;color:#1f2329;}
.steps{display:flex;justify-content:space-between;margin:14px 0 18px;position:relative;}
.steps::before{content:"";position:absolute;top:15px;left:12%;right:12%;height:2px;background:#d9dee5;}
.step{position:relative;z-index:1;width:25%;text-align:center;}
.step .dot{width:30px;height:30px;line-height:30px;border-radius:50%;background:#fff;border:2px solid #d9dee5;color:#98a1ad;font-size:13px;margin:0 auto 6px;}
.step .txt{font-size:12px;color:#98a1ad;}
.step.active .dot{background:#1677ff;border-color:#1677ff;color:#fff;}
.step.active .txt{color:#1677ff;font-weight:bold;}
.step.done .dot{background:#1677ff;border-color:#1677ff;color:#fff;}
.step.done .txt{color:#1677ff;}
.card{background:#fff;border-radius:10px;padding:20px 18px;box-shadow:0 1px 4px rgba(0,0,0,.06);}
.card-title{font-size:16px;font-weight:bold;margin-bottom:14px;}
.form-item{margin-bottom:16px;}
.form-item label{display:block;font-size:13px;color:#666;margin-bottom:6px;}
.form-item input[type=text]{width:100%;height:42px;border:1px solid #d9dee5;border-radius:6px;padding:0 12px;font-size:15px;outline:none;}
.form-item input[type=text]:focus{border-color:#1677ff;}
.tip{font-size:12px;color:#98a1ad;line-height:1.7;margin-top:10px;}
.error{background:#fff2f0;border:1px solid #ffccc7;color:#cf1322;border-radius:6px;padding:10px 12px;font-size:13px;margin-bottom:14px;}
.btn{display:block;width:100%;height:44px;line-height:44px;text-align:center;background:#1677ff;color:#fff;font-size:16px;border:0;border-radius:6px;cursor:pointer;text-decoration:none;}
.btn:disabled{background:#a8c9f5;cursor:not-allowed;}
.btn.gray{background:#eef1f5;color:#666;}
.footer{text-align:center;color:#98a1ad;font-size:12px;margin-top:16px;}
.order-box{background:#f7f9fc;border-radius:8px;padding:14px;margin-bottom:16px;}
.order-line{display:flex;justify-content:space-between;font-size:14px;padding:4px 0;}
.order-line .k{color:#666;}
.order-line .v{color:#1f2329;font-weight:bold;word-break:break-all;}
.order-line .amount{color:#e64545;font-size:20px;}
.channel-item{display:flex;align-items:center;border:1px solid #e5e8ee;border-radius:8px;padding:12px;margin-bottom:10px;cursor:pointer;}
.channel-item.sel{border-color:#1677ff;background:#f0f7ff;}
.channel-item input{margin-right:10px;width:18px;height:18px;}
.channel-item .cname{font-size:15px;color:#1f2329;}
.panel{display:none;background:#f7f9fc;border-radius:8px;padding:16px;margin-top:14px;text-align:center;}
.panel.show{display:block;}
.panel img{max-width:220px;width:100%;border-radius:6px;}
.panel .addr{background:#fff;border:1px dashed #d9dee5;border-radius:6px;padding:12px;font-size:13px;word-break:break-all;margin:10px 0;text-align:left;}
.panel .net{display:inline-block;background:#1677ff;color:#fff;font-size:12px;border-radius:4px;padding:2px 8px;margin:6px 0;}
.upload-box{border:2px dashed #d9dee5;border-radius:8px;padding:28px 16px;text-align:center;cursor:pointer;margin-bottom:14px;}
.upload-box.on{border-color:#1677ff;background:#f0f7ff;}
.upload-box .icon{font-size:30px;color:#98a1ad;}
.upload-box .t{font-size:14px;color:#666;margin-top:8px;}
.preview{display:none;margin-bottom:14px;text-align:center;}
.preview img{max-width:100%;border-radius:6px;}
.status-icon{font-size:46px;margin-bottom:10px;text-align:center;}
.status-title{font-size:18px;font-weight:bold;margin-bottom:8px;text-align:center;}
.status-sub{font-size:13px;color:#98a1ad;line-height:1.7;margin-bottom:16px;text-align:center;}
.info-box{background:#f7f9fc;border-radius:8px;padding:14px;text-align:left;margin-bottom:16px;}
.info-line{display:flex;justify-content:space-between;font-size:14px;padding:4px 0;}
.info-line .k{color:#666;}
.info-line .v{color:#1f2329;word-break:break-all;}
.reason{background:#fff2f0;border:1px solid #ffccc7;color:#cf1322;border-radius:8px;padding:12px;text-align:left;font-size:14px;margin-bottom:16px;}
/* 横版支付方式 */
.pay-channels{display:grid;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:10px;margin-bottom:16px;}
.pay-card{border:1.5px solid #e5e8ee;border-radius:10px;padding:16px 8px;text-align:center;cursor:pointer;transition:all .15s;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:84px;}
.pay-card.sel{border-color:#1677ff;background:#f0f7ff;box-shadow:0 0 0 1px rgba(22,119,255,.08);}
.pay-icon{width:36px;height:36px;line-height:36px;border-radius:50%;margin-bottom:8px;}
.pay-icon svg{display:block;width:100%;height:100%;}
.pay-name{font-size:13px;color:#1f2329;font-weight:500;}
.pay-panels{margin-top:10px;}