.official-account-modal{width:min(420px,calc(100vw - 32px));padding:32px 28px 28px!important;border:1px solid var(--line);border-radius:24px;max-height:calc(100dvh - 32px);overflow:auto;text-align:center;background:var(--panel);color:var(--text);box-shadow:0 24px 80px #22203c26}
.official-account-modal>h2{font-size:27px;font-weight:750;line-height:1.35;letter-spacing:-.5px;margin:5px 20px 9px}
.official-account-intro{color:var(--muted);font-size:12px;line-height:1.6;margin:0 0 24px}
.official-account-qr{box-sizing:border-box;width:216px;max-width:100%;margin:0 auto;padding:10px;border:1px solid #e7e4f4;border-radius:20px;background:#fff;box-shadow:0 8px 24px #6d5bce0c}
.official-account-qr img{display:block;width:100%;height:auto;border-radius:8px}
.official-account-scan{font-size:11px;line-height:1.6;color:var(--muted);margin:12px 0 22px}
.official-account-instructions{display:flex;align-items:center;justify-content:center;gap:10px;padding:15px 10px;border:1px solid var(--line);border-radius:14px;background:var(--soft);font-size:12px;line-height:1.5;color:var(--muted)}
.official-account-instructions strong{font-size:23px;font-weight:750;letter-spacing:1px;color:#6095f6}
.official-account-contact{font-size:12px;line-height:1.6;color:var(--muted);margin:0}
@media(max-width:480px){.official-account-modal{padding:28px 22px 22px!important}.official-account-modal>h2{font-size:25px}.official-account-intro{font-size:11px;margin-bottom:20px}.official-account-instructions{gap:8px}.official-account-instructions strong{font-size:22px}}
@media(max-height:640px){.official-account-modal{padding:22px!important}.official-account-qr{width:178px}.official-account-intro{margin-bottom:16px}.official-account-scan{margin:10px 0 16px}}

/* This QR dialog always uses the light palette, independently of site theme. */
.official-account-modal{color-scheme:light;--panel:#ffffff;--text:#252638;--muted:#858698;--line:#e9e7f2;--soft:#f2efff;--accent:#7160e8;background:#fff!important;color:#252638!important;border-color:#e9e7f2!important}
.official-account-modal>h2{color:#252638!important}
.official-account-modal .modal-close,.official-account-modal .close,.official-account-modal>button{background:#f8f8fc!important;color:#858698!important;border-color:#e9e7f2!important}

/* Compact, non-repeating instructions below the QR. */
.official-account-modal>h2{margin-bottom:22px}
.official-account-modal .official-account-instructions{display:block;text-align:left;padding:0;border:0;border-radius:0;background:transparent;font-size:12px;line-height:1.9;color:var(--muted);margin:0}
.official-account-modal .official-account-instructions strong{font-size:13px;font-weight:650;letter-spacing:0;color:#6095f6;padding:0;background:transparent}
.official-account-modal .official-account-scan{margin-bottom:16px}