diff --git a/components/login-modal.html b/components/login-modal.html
index 69cafce8..8efd45a1 100644
--- a/components/login-modal.html
+++ b/components/login-modal.html
@@ -254,11 +254,11 @@
           <div data-nip46-handshake-panel class="space-y-3">
             <div class="flex flex-col gap-4 sm:flex-row sm:items-start">
               <div
-                class="flex h-48 w-48 items-center justify-center rounded-lg border border-border-strong bg-bg-muted"
+                class="flex aspect-square w-full max-w-xs items-center justify-center rounded-xl border border-border-strong bg-surface p-4 sm:max-w-sm sm:flex-none sm:p-6"
                 data-nip46-qr
                 aria-hidden="true"
               >
-                <div class="text-center text-xs text-text-muted">
+                <div class="w-full text-center text-sm text-text-muted">
                   Generating connect code…
                 </div>
               </div>
diff --git a/js/ui/loginModalController.js b/js/ui/loginModalController.js
index 97f6c634..ca3b9e63 100644
--- a/js/ui/loginModalController.js
+++ b/js/ui/loginModalController.js
@@ -933,8 +933,8 @@ export default class LoginModalController {
         if (uri) {
           try {
             qrInstance = renderQrCode(qrContainer, uri, {
-              width: 224,
-              height: 224,
+              width: 256,
+              height: 256,
             });
           } catch (error) {
             qrInstance = null;