diff --git a/src/pages/home/home.ts b/src/pages/home/home.ts
index 71b4f31..df13f02 100755
--- a/src/pages/home/home.ts
+++ b/src/pages/home/home.ts
@@ -558,22 +558,22 @@ async function handleMainPairing(): Promise<void> {
     if (mainStatus) {
       mainStatus.innerHTML = '<div class="spinner"></div><span>Authenticating with browser...</span>';
     }
-    
+
     // Import and trigger WebAuthn directly
     const { secureCredentialsService } = await import('../../services/secure-credentials.service');
-    
+
     // Check if we have existing credentials
     const hasCredentials = await secureCredentialsService.hasCredentials();
-    
+
     if (hasCredentials) {
       console.log('🔓 Existing credentials found, decrypting...');
       if (mainStatus) {
         mainStatus.innerHTML = '<div class="spinner"></div><span>Decrypting existing credentials...</span>';
       }
-      
+
       // This will trigger WebAuthn for decryption
       await secureCredentialsService.retrieveCredentials('');
-      
+
       if (mainStatus) {
         mainStatus.innerHTML = '<span style="color: var(--success-color)">✅ Credentials decrypted successfully</span>';
       }
@@ -582,15 +582,15 @@ async function handleMainPairing(): Promise<void> {
       if (mainStatus) {
         mainStatus.innerHTML = '<div class="spinner"></div><span>Creating new credentials...</span>';
       }
-      
+
       // This will trigger WebAuthn for creation
       await secureCredentialsService.generateSecureCredentials('');
-      
+
       if (mainStatus) {
         mainStatus.innerHTML = '<span style="color: var(--success-color)">✅ New credentials created successfully</span>';
       }
     }
-    
+
     // Now proceed with pairing process
     await prepareAndSendPairingTx();
 
diff --git a/src/router.ts b/src/router.ts
index 3ea751d..2316209 100755
--- a/src/router.ts
+++ b/src/router.ts
@@ -55,6 +55,16 @@ async function handleLocation(path: string) {
         'width: 100vw; height: 100vh; position: relative; grid-row: 2;'
       );
       if (container) container.appendChild(accountComponent);
+      
+      // Initialize the home page after component is added to DOM
+      console.log('🏠 Initializing home page...');
+      try {
+        const { initHomePage } = await import('./pages/home/home');
+        await initHomePage();
+        console.log('✅ Home page initialized successfully');
+      } catch (error) {
+        console.error('❌ Failed to initialize home page:', error);
+      }
     } else {
       const html = await fetch(routeHtml).then(data => data.text());
       content.innerHTML = html;