.live-preview-card{padding:22px;margin:8px 0 28px;border:1px solid #d5e2ff;border-radius:7px;background:linear-gradient(145deg,#f3f7ff,#fff 70%)}.live-preview-heading{display:flex;align-items:center;gap:12px}.preview-spark{display:grid;place-items:center;flex:none;width:36px;height:36px;border-radius:9px;color:#0051ed;background:#e6efff;font-size:25px}.live-preview-heading h2{font-size:17px;margin:0 0 4px;color:#163962;font-weight:500;letter-spacing:-.3px}.live-preview-heading p{font-size:11px;color:#0051ed;margin:0}.live-preview-copy{font-size:11px;line-height:1.8;color:#8290a4;margin:15px 0}.preview-wallet{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 0;border-top:1px solid #e5ecf7;font-size:11px;color:#6a7c96}.preview-wallet strong{font-size:15px;margin-left:8px;color:#0051ed}.preview-wallet button{color:#0051ed;background:transparent;padding:5px 0 5px 10px;font-size:11px}.preview-small{font-size:10px!important;line-height:1.8;color:#8d9bb0;margin:12px 0 0}.preview-feedback{font-size:11px;line-height:1.8;color:#3d6498;margin:12px 0 0}.preview-feedback:empty{display:none}.preview-history:empty{display:none}.preview-history>p{font-size:10px;color:#6c829f;margin:17px 0 8px}.preview-history>div{display:flex;overflow-x:auto;gap:7px}.preview-history button{padding:2px;background:white;border:1px solid #dee7f5;border-radius:5px;flex:0 0 57px}.preview-history img{display:block;width:51px;height:65px;object-fit:cover;border-radius:3px}.preview-history button[aria-pressed=true]{border-color:#0051ed}.preview-clear{font-size:10px;background:transparent;color:#0051ed;padding:10px 0 0}.preview-topup-dialog{width:min(480px,calc(100% - 30px));max-height:90dvh;border:1px solid #dce7fc;border-radius:14px;padding:27px;background:#fff;color:#17355a;box-shadow:0 25px 90px #123b6633}.preview-topup-dialog::backdrop{background:#0c245a80;backdrop-filter:blur(4px)}.topup-dialog-top{display:flex;justify-content:space-between;gap:15px;align-items:center}.topup-dialog-top .custom-eyebrow{font-size:9px}.topup-dialog-top button{width:28px;height:28px;border-radius:50%;color:#6682a8;background:#f1f5fc;font-size:20px}.preview-topup-dialog h2{font-size:27px;letter-spacing:-.7px;margin:20px 0 10px}.topup-lead{font-size:25px;color:#0051ed;margin:0 0 25px}.topup-lead span{font-size:12px;color:#8194b0}.topup-not-ready{padding:25px;background:#f4f7fd;border:1px dashed #c8d7f0;border-radius:6px;text-align:center}.topup-not-ready>span{font-size:32px;color:#0051ed}.topup-not-ready h3{font-size:17px;font-weight:500}.topup-not-ready p{font-size:12px;color:#7b8fa9;line-height:1.8}.topup-qr{border:1px solid #e1e8f5;border-radius:8px;padding:18px;text-align:center}.topup-qr img{max-width:230px;width:100%;max-height:300px;object-fit:contain}.topup-qr p{font-size:10px;color:#7a8fad;margin:10px 0 0}.topup-bank{display:flex;flex-direction:column;gap:6px;padding:17px 0}.topup-bank strong{font-size:13px}.topup-bank>span{font-size:20px;color:#0051ed;letter-spacing:1px}.topup-bank small{font-size:11px;color:#778ba8}.topup-steps{margin:4px 0 18px;padding-left:17px;font-size:11px;line-height:1.9;color:#6f85a2}.topup-steps li{padding-left:4px;margin:7px 0}.preview-topup-dialog form{margin-top:20px}.preview-topup-dialog form>label{display:flex;flex-direction:column;gap:8px;font-size:12px;margin-bottom:16px}.preview-topup-dialog input{border:1px solid #dbe5f3;border-radius:4px;padding:11px;background:white;font-size:12px;color:#28476c;width:100%;min-width:0}.preview-topup-dialog input[type=file]{font-size:10px;line-height:1.7;border-style:dashed;background:#f8faff}.preview-topup-dialog .custom-primary{margin-top:18px}.preview-topup-dialog #topup-history h3{font-size:12px;font-weight:500;margin:25px 0 8px}.topup-history-row{display:flex;align-items:center;justify-content:space-between;gap:10px;border-top:1px solid #e4ebf7;padding:12px 0}.topup-history-row strong{font-size:12px;font-weight:500}.topup-history-row strong>span{font-size:10px;color:#8293aa;font-weight:400}.topup-history-row small{display:block;font-size:9px;color:#8293aa;line-height:1.8;margin-top:4px}.topup-state{font-size:9px;padding:5px 7px;border-radius:15px;background:#fff3d7;color:#967324;white-space:nowrap}.topup-state.approved{background:#e6f7ef;color:#28734c}.topup-state.rejected{background:#fff0f1;color:#b55462}
@media(max-width:649px){.live-preview-card{padding:18px}.preview-topup-dialog{padding:22px}.preview-topup-dialog h2{font-size:25px}}