diff --git a/packages/ord-connect/package.json b/packages/ord-connect/package.json
index 0e98eeee..557279b9 100644
--- a/packages/ord-connect/package.json
+++ b/packages/ord-connect/package.json
@@ -60,7 +60,7 @@
     ]
   },
   "peerDependencies": {
-    "@ordzaar/ordit-sdk": "^2.2.0",
+    "@ordzaar/ordit-sdk": "^2.2.1",
     "react": "^18.3.1",
     "react-dom": "^18.3.1"
   }
diff --git a/packages/ord-connect/src/SampleApp.tsx b/packages/ord-connect/src/SampleApp.tsx
index 4884b9e3..f87489b2 100644
--- a/packages/ord-connect/src/SampleApp.tsx
+++ b/packages/ord-connect/src/SampleApp.tsx
@@ -75,8 +75,8 @@ function TestControls() {
   };
 
   return (
-    <div className="controls">
-      <div>
+    <div className="test-container">
+      <div className="controls">
         <button type="button" onClick={handleCheckBalance}>
           Check balance
         </button>
@@ -90,7 +90,7 @@ function TestControls() {
           Sign message
         </button>
       </div>
-      <div>
+      <div className="details">
         {wallet ? <p>Wallet: {wallet}</p> : null}
         {address?.ordinals ? (
           <p>Connected Address: {address.ordinals ?? ""}</p>
diff --git a/packages/ord-connect/src/components/SelectWalletModal/WalletButton.tsx b/packages/ord-connect/src/components/SelectWalletModal/WalletButton.tsx
index 31768b08..12996fd8 100644
--- a/packages/ord-connect/src/components/SelectWalletModal/WalletButton.tsx
+++ b/packages/ord-connect/src/components/SelectWalletModal/WalletButton.tsx
@@ -17,7 +17,6 @@ const WALLET_TO_NAME: Record<Wallet, string> = {
 
 export interface WalletButtonProps {
   wallet: Wallet;
-  subtitle: string;
   onConnect: () => Promise<boolean>;
   icon: string;
   renderAvatar?: (address: string, size: "large" | "small") => ReactNode;
@@ -26,7 +25,6 @@ export interface WalletButtonProps {
 
 export function WalletButton({
   wallet,
-  subtitle,
   onConnect,
   icon,
   renderAvatar,
@@ -61,13 +59,10 @@ export function WalletButton({
       <div className="option-wrapper">
         <img className="wallet-icon" src={icon} alt="" />
         <div className="wallet-option">
-          <span className="wallet-option-label">{walletName}</span>
-          <span
-            className="wallet-option-subtitle"
-            style={{ display: isMobile ? "block" : "none" }}
-          >
-            {subtitle}
-          </span>
+          <p className="wallet-option-label">{walletName}</p>
+          <p className="wallet-option-subtitle">
+            {isMobile ? "Available on app" : ""}
+          </p>
         </div>
         {connectedWallet === wallet && connectedAddress.ordinals ? (
           <div className="wallet-option-connected-address">
@@ -75,7 +70,7 @@ export function WalletButton({
               renderAvatar(connectedAddress.ordinals, "small")
             ) : (
               <Avatar
-                size={16}
+                size={isMobile ? 12 : 16}
                 variant="beam"
                 name={connectedAddress.ordinals}
                 colors={["#1C2DCB", "#F226B8"]}
@@ -94,16 +89,16 @@ export function WalletButton({
         {loading ? (
           <img
             src={LoadingIcon}
-            width={24}
-            height={24}
+            width={isMobile ? 20 : 24}
+            height={isMobile ? 20 : 24}
             alt={`${walletName} extension is loading`}
           />
         ) : (
           <img
             src={ChevronRightIcon}
             alt=""
-            width={24}
-            height={24}
+            width={isMobile ? 20 : 24}
+            height={isMobile ? 20 : 24}
             className="chevron-btn"
           />
         )}
diff --git a/packages/ord-connect/src/components/SelectWalletModal/index.tsx b/packages/ord-connect/src/components/SelectWalletModal/index.tsx
index b973ec1d..45e8fa64 100644
--- a/packages/ord-connect/src/components/SelectWalletModal/index.tsx
+++ b/packages/ord-connect/src/components/SelectWalletModal/index.tsx
@@ -59,7 +59,6 @@ export function SelectWalletModal({
     const ALL_WALLETS: WalletListItemProps[] = [
       {
         wallet: Wallet.OKX,
-        subtitle: "Available on OKX app",
         onConnect: () => connectWallet(Wallet.OKX),
         icon: OKXWalletIcon,
         hidden: isMobile && network !== Network.MAINNET,
@@ -68,7 +67,6 @@ export function SelectWalletModal({
       },
       {
         wallet: Wallet.UNISAT,
-        subtitle: "Coming soon on mobile browsing",
         onConnect: () => connectWallet(Wallet.UNISAT),
         icon: UnisatWalletIcon,
         hidden: isMobile,
@@ -77,7 +75,6 @@ export function SelectWalletModal({
       },
       {
         wallet: Wallet.XVERSE,
-        subtitle: "Available on Xverse app",
         onConnect: () => connectWallet(Wallet.XVERSE),
         icon: XverseWalletIcon,
         order: 22,
@@ -85,16 +82,13 @@ export function SelectWalletModal({
       },
       {
         wallet: Wallet.MAGICEDEN,
-        subtitle: "Coming soon on mobile browsing",
         onConnect: () => connectWallet(Wallet.MAGICEDEN),
         icon: MagicEdenWalletIcon,
-        hidden: isMobile,
         order: 23,
         chains: [Chain.BITCOIN],
       },
       {
         wallet: Wallet.LEATHER,
-        subtitle: "Coming soon on mobile browsing",
         onConnect: () => connectWallet(Wallet.LEATHER),
         icon: LeatherWalletIcon,
         hidden: isMobile,
@@ -103,8 +97,8 @@ export function SelectWalletModal({
       },
     ];
 
-    const walletList = ALL_WALLETS.filter((walletItem) =>
-      walletItem.chains.includes(chain),
+    const walletList = ALL_WALLETS.filter(
+      (walletItem) => walletItem.chains.includes(chain) && !walletItem.hidden,
     );
 
     if (!walletsOrder) {
@@ -171,16 +165,11 @@ export function SelectWalletModal({
                 <section className="panel-content-container">
                   <section className="panel-content-inner-container">
                     {orderedWalletList.map((walletItem, index) => {
-                      if (walletItem.hidden) {
-                        return null;
-                      }
-
                       const isLastItem = index === orderedWalletList.length - 1;
                       return (
                         <Fragment key={walletItem.wallet}>
                           <WalletButton
                             wallet={walletItem.wallet}
-                            subtitle={walletItem.subtitle}
                             onConnect={async () => {
                               setErrorMessage("");
                               // catch clause not required
diff --git a/packages/ord-connect/src/components/SelectWalletModal/style.css b/packages/ord-connect/src/components/SelectWalletModal/style.css
index 3390768c..bf6d597b 100644
--- a/packages/ord-connect/src/components/SelectWalletModal/style.css
+++ b/packages/ord-connect/src/components/SelectWalletModal/style.css
@@ -19,17 +19,6 @@
   height: 100%;
 }
 
-@media screen and (min-width: 768px) {
-  .ord-connect-wallet-modal .outer-container {
-    top: 50%;
-    left: 50%;
-    transform: translate(-50%, -50%);
-    width: 500px;
-    height: auto;
-    border-radius: 20px;
-  }
-}
-
 .ord-connect-wallet-modal .inner-container {
   display: flex;
   align-items: center;
@@ -46,13 +35,6 @@
   height: 100%;
 }
 
-@media screen and (min-width: 768px) {
-  .ord-connect-wallet-modal .panel {
-    border: 1px solid rgba(51, 51, 51, 0.5);
-    border-radius: 20px;
-  }
-}
-
 .ord-connect-wallet-modal .panel-title-container {
   display: flex;
   justify-content: space-between;
@@ -60,18 +42,6 @@
   align-items: center;
 }
 
-@media screen and (min-width: 768px) {
-  .ord-connect-wallet-modal .panel-title-container {
-    padding: 24px 32px 0px 32px;
-    border-bottom: 0px;
-  }
-
-  .ord-connect-wallet-modal .unsupported-browser-message {
-    font-size: 16px;
-    padding-left: 24px;
-  }
-}
-
 .ord-connect-wallet-modal .panel-title {
   color: #fff;
   font-size: 24px;
@@ -81,16 +51,6 @@
   margin: 0px;
 }
 
-@media screen and (min-width: 768px) {
-  .ord-connect-wallet-modal .panel-title {
-    font-size: 20px;
-    font-style: normal;
-    font-weight: 600;
-    line-height: 28px;
-    letter-spacing: 0.2px;
-  }
-}
-
 .ord-connect-wallet-modal .unsupported-browser-message {
   color: #fff;
 }
@@ -106,18 +66,6 @@
   margin: 32px 24px 0px;
 }
 
-@media screen and (min-width: 768px) {
-  .ord-connect-wallet-modal .panel-content-container {
-    margin: 48px 32px 32px 32px;
-  }
-}
-
-@media screen and (min-width: 1080px) {
-  .ord-connect-wallet-modal .panel-content-container {
-    margin: 48px 32px 32px 32px;
-  }
-}
-
 .ord-connect-wallet-modal .panel-content-inner-container {
   border-radius: 20px;
   border: 1px solid rgba(255, 255, 255, 0.1);
@@ -129,9 +77,9 @@
   background: transparent;
   border: 0px;
   color: #fff;
-  font-size: 18px;
+  font-size: 16px;
   font-weight: 600;
-  line-height: 24px;
+  line-height: 20px;
   width: 100%;
   cursor: pointer;
 }
@@ -163,16 +111,10 @@
   display: flex;
   align-items: center;
   justify-content: space-between;
-  padding: 16px 12px;
+  padding: 16px 4px;
   width: 100%;
 }
 
-@media screen and (min-width: 1080px) {
-  .ord-connect-wallet-modal .option-wrapper {
-    padding: 16px;
-  }
-}
-
 .ord-connect-wallet-modal .wallet-option-button {
   padding: 8px 16px;
 }
@@ -193,15 +135,6 @@
   border-radius: 20px 20px 0px 0px;
 }
 
-@media screen and (min-width: 1080px) {
-  .ord-connect-wallet-modal .wallet-option-button:first-child {
-    padding: 16px 16px 8px 16px;
-    border: 0px;
-    margin-bottom: 0px;
-    border-radius: 20px 20px 0px 0px;
-  }
-}
-
 .ord-connect-wallet-modal .wallet-option-button:last-child {
   padding: 8px 16px 16px 16px;
   border: 0px;
@@ -218,26 +151,21 @@
 
 .ord-connect-wallet-modal .wallet-icon {
   width: 32px;
-}
-
-@media (min-width: 768px) {
-  .ord-connect-wallet-modal .wallet-icon {
-    width: 40px;
-  }
+  height: 32px;
 }
 
 .ord-connect-wallet-modal .wallet-option {
   flex-grow: 1;
-  margin-left: 16px;
+  margin-left: 12px;
   text-align: left;
 }
 
 .ord-connect-wallet-modal .wallet-option-connected-address {
   display: flex;
-  padding: 4px 12px 4px 8px;
+  padding: 4px 8px;
   align-items: center;
-  margin-left: 16px;
-  margin-right: 16px;
+  margin-left: 4px;
+  margin-right: 8px;
   text-align: left;
   background-color: rgba(0, 0, 0, 0.5);
   border-radius: 20px;
@@ -246,22 +174,16 @@
 
 .ord-connect-wallet-modal .wallet-option-connected-address .label {
   margin-left: 4px;
-  font-size: 16px;
+  font-size: 12px;
   font-weight: 400;
+  color: rgba(255, 255, 255, 0.7);
 }
 
 .ord-connect-wallet-modal .wallet-option-label {
   font-size: 16px;
   font-weight: 600;
   line-height: 20px;
-}
-
-@media screen and (min-width: 1079px) {
-  .ord-connect-wallet-modal .wallet-option-label {
-    font-size: 18px;
-    font-weight: 600;
-    line-height: 24px;
-  }
+  margin: 0;
 }
 
 .ord-connect-wallet-modal .wallet-option-subtitle {
@@ -269,6 +191,7 @@
   font-weight: 400;
   line-height: 16px;
   color: #8c8c8c;
+  margin: 0;
 }
 
 .ord-connect-wallet-modal .horizontal-separator {
@@ -285,12 +208,98 @@
 }
 
 .ord-connect-wallet-modal .preferred-label {
-  padding: 4px 12px 4px 12px;
+  padding: 4px 12px;
   color: #000000b2;
   background-color: #ffbf18;
   font-size: 12px;
-  line-height: 14px;
+  line-height: 16px;
   font-weight: 400;
-  border-radius: 100px;
-  margin-right: 10px;
+  border-radius: 20px;
+  margin-left: 4px;
+  margin-right: 8px;
+}
+
+@media screen and (min-width: 768px) {
+  .ord-connect-wallet-modal .outer-container {
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    width: 500px;
+    height: auto;
+    border-radius: 20px;
+  }
+
+  .ord-connect-wallet-modal .panel {
+    border: 1px solid rgba(51, 51, 51, 0.5);
+    border-radius: 20px;
+  }
+
+  .ord-connect-wallet-modal .panel-title-container {
+    padding: 24px 32px 0px 32px;
+    border-bottom: 0px;
+  }
+
+  .ord-connect-wallet-modal .unsupported-browser-message {
+    font-size: 16px;
+    padding-left: 24px;
+  }
+
+  .ord-connect-wallet-modal .panel-title {
+    font-size: 20px;
+    font-style: normal;
+    font-weight: 600;
+    line-height: 28px;
+    letter-spacing: 0.2px;
+  }
+
+  .ord-connect-wallet-modal .panel-content-container {
+    margin: 48px 32px 32px 32px;
+  }
+
+  .ord-connect-wallet-modal .wallet-option {
+    margin-left: 16px;
+  }
+}
+
+@media screen and (min-width: 1080px) {
+  .ord-connect-wallet-modal .panel-content-container {
+    margin: 48px 32px 32px 32px;
+  }
+
+  .ord-connect-wallet-modal .option-wrapper {
+    padding: 16px;
+  }
+
+  .ord-connect-wallet-modal .wallet-option-button {
+    font-size: 18px;
+    font-weight: 600;
+    line-height: 24px;
+  }
+
+  .ord-connect-wallet-modal .wallet-option-button:first-child {
+    padding: 16px 16px 8px 16px;
+    border: 0px;
+    margin-bottom: 0px;
+    border-radius: 20px 20px 0px 0px;
+  }
+
+  .ord-connect-wallet-modal .wallet-icon {
+    width: 40px;
+    height: 40px;
+  }
+
+  .ord-connect-wallet-modal .wallet-option-label {
+    font-size: 18px;
+    font-weight: 600;
+    line-height: 24px;
+  }
+
+  .ord-connect-wallet-modal .wallet-option-connected-address {
+    margin-left: 16px;
+    margin-right: 16px;
+  }
+
+  .ord-connect-wallet-modal .wallet-option-connected-address .label {
+    font-size: 16px;
+  }
 }
diff --git a/packages/ord-connect/src/style.css b/packages/ord-connect/src/style.css
index ee461395..ec2aa789 100644
--- a/packages/ord-connect/src/style.css
+++ b/packages/ord-connect/src/style.css
@@ -11,8 +11,17 @@ body {
   margin: 8px;
 }
 
-.controls {
+.test-container {
   align-self: flex-start;
   display: flex;
   flex-direction: column;
+  margin-top: 16px;
+}
+
+.controls {
+  display: flex;
+}
+
+.details {
+  word-break: break-word;
 }
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index c9368bd8..7e3595db 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -27,8 +27,8 @@ importers:
         specifier: ^1.7.19
         version: 1.7.19(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
       '@ordzaar/ordit-sdk':
-        specifier: ^2.2.0
-        version: 2.2.0(typescript@5.5.4)(valibot@0.33.2)
+        specifier: ^2.2.1
+        version: 2.2.1(typescript@5.5.4)(valibot@0.33.2)
       bignumber.js:
         specifier: ^9.1.2
         version: 9.1.2
@@ -398,8 +398,8 @@ packages:
     resolution: {integrity: sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==}
     engines: {node: '>= 8'}
 
-  '@ordzaar/ordit-sdk@2.2.0':
-    resolution: {integrity: sha512-5G0F18tSNM0/3IdkN1Qi7ssU4EjBxqkFqMthnjf/J1w4xH3anyBsiFeTD88wkGldXhKtHSIVVIb1cW5UntQLbw==}
+  '@ordzaar/ordit-sdk@2.2.1':
+    resolution: {integrity: sha512-iAvx0pcrstrLeuxx0owKvvY+JwfWAX3jQK5WuW+XmUn4SFjcgGxZrGpVZWyfU6tGccpqOZSliUkk5WOT2eaVVw==}
 
   '@ordzaar/standard-prettier@1.8.10':
     resolution: {integrity: sha512-6LZ2g7SG45fwLZQcpDVAS4OL5CFVYg/q1V7h6ExFFMWQBb+G29a/WDaTL5SUlsmQcdFMaL+0aKOT/b/r55oLhA==}
@@ -3112,7 +3112,7 @@ snapshots:
       '@nodelib/fs.scandir': 2.1.5
       fastq: 1.17.1
 
-  '@ordzaar/ordit-sdk@2.2.0(typescript@5.5.4)(valibot@0.33.2)':
+  '@ordzaar/ordit-sdk@2.2.1(typescript@5.5.4)(valibot@0.33.2)':
     dependencies:
       '@bitcoinerlab/secp256k1': 1.1.1
       '@wallet-standard/core': 1.0.3