diff --git a/landing/siwe.css b/landing/siwe.css
--- a/landing/siwe.css
+++ b/landing/siwe.css
@@ -68,12 +68,3 @@
 body > div > :global(div.iekbcc0) > div > div > div > div {
   border: 0 !important;
 }
-
-:global(div#walletconnect-wrapper) {
-  word-break: initial;
-  color: initial;
-}
-:global(div.walletconnect-modal__footer) {
-  overflow: hidden;
-  justify-content: flex-start;
-}
diff --git a/landing/walletconnect-hooks.js b/landing/walletconnect-hooks.js
--- a/landing/walletconnect-hooks.js
+++ b/landing/walletconnect-hooks.js
@@ -3,6 +3,14 @@
 import invariant from 'invariant';
 import * as React from 'react';
 
+const walletConnectCSSOverride = `
+  div.wcm-overlay {
+    --wcm-background-border-radius: 0;
+    align-items: flex-start;
+    padding: 0;
+  }
+`;
+
 type WalletConnectModalUpdate =
   | { +state: 'closed' }
   | { +state: 'open', +height: number };
@@ -27,6 +35,10 @@
           // root", so instead we implement a second-layer MutationObserver once
           // we see the shadow root.
           setWCShadowRoot(shadowRoot);
+          // We want to customize the style of the WalletConnect modal
+          const styleOverride = document.createElement('style');
+          styleOverride.textContent = walletConnectCSSOverride;
+          shadowRoot.appendChild(styleOverride);
         }
       }
     }