/* ========= 复现二维码弹窗（与登录弹窗样式隔离） ========= */
.modal{ position:fixed; inset:0; display:none; align-items:center; justify-content:center;
        background: radial-gradient(1200px 600px at 50% 10%, rgba(37,99,235,.12), rgba(15,23,42,.55));
        backdrop-filter: blur(2px); z-index:1000; }
.modal.show{ display:flex; animation:overlay-in .18s ease-out; }
.modal-card{ width:min(520px, 92vw); background:#fff; border:1px solid var(--line); border-radius:16px;
             box-shadow:0 16px 60px rgba(2,6,23,.28); overflow:hidden; transform:translateY(8px) scale(.98);
             animation:card-in .22s cubic-bezier(.2,.7,.3,1) forwards; display:flex; flex-direction:column; }
.modal-header{ padding:20px 22px 8px; text-align:center; }
.modal-title{ margin:0; font-weight:800; letter-spacing:.2px; color:var(--text); font-size:20px; line-height:1.35; }
.modal-subtitle{ margin:6px 0 0; font-size:13px; color:var(--muted); }
.modal-body{ padding:12px 22px 20px; display:grid; gap:12px; place-items:center; text-align:center; }
.qr-wrap{ padding:12px; border-radius:14px; background:linear-gradient(#f8fbff,#f3f6fa); border:1px solid var(--line); box-shadow: inset 0 1px 0 rgba(255,255,255,.6); }
.qr-code{ display:block; width:260px; max-width:64vw; height:auto; border-radius:10px; }
.modal-footer{ padding:14px 16px; background:#fafcff; border-top:1px solid var(--line); display:flex; gap:10px; }
   .btn{ appearance:none; -webkit-appearance:none; border:1px solid transparent; border-radius:10px; cursor:pointer; font-weight:700; height:44px; padding:0 16px; transition:transform .15s ease, background .15s ease, box-shadow .15s ease; }
    .btn:active{ transform:none }
.btn-primary{background:#0d47a1; border-color:#0d47a1;color:#fff;}

@keyframes overlay-in{ from{ opacity:0 } to{ opacity:1 } }
@keyframes card-in{ to{ transform:none } }

@media (max-width:480px){ .modal-card{ border-radius:14px; } .qr-code{ width:220px; max-width:70vw; } }