From afaecdaa2652c70ad05b2f7a401423440b5392da Mon Sep 17 00:00:00 2001
From: "google-labs-jules[bot]"
 <161369871+google-labs-jules[bot]@users.noreply.github.com>
Date: Wed, 26 Aug 2026 06:54:29 +0000
Subject: [PATCH] Extract WebAuthn Components & Deduplicate Assets

- Extracted `PasskeyTable` and `WebAuthnScript` into `ui/components/auth/`.
- Refactored `PasskeysPage.tsx` and `RegisterPage.tsx` to use the new components instead of inline scripts and HTML.
- Deleted the duplicate `ui/public/ui/utils/bip39_wordlist.ts` and `ui/public/ui/utils/bip39.ts`.
- Updated all import references to use `ui/utils/bip39_wordlist.ts` and `/public/utils/bip39.ts`.

Co-authored-by: mrteye <1945243+mrteye@users.noreply.github.com>
---
 ....arch.ui-decomposition-roadmap-2300.ph3.md |    0
 ui/components/PasskeysPage.tsx                |  274 +--
 ui/components/RecoveryPage.tsx                |    2 +-
 ui/components/RegisterPage.tsx                |   89 +-
 ui/components/auth/PasskeyTable.tsx           |  145 ++
 ui/components/auth/WebAuthnScript.tsx         |  235 ++
 ui/public/ui/utils/bip39.ts                   |   71 -
 ui/public/ui/utils/bip39_wordlist.ts          | 2050 -----------------
 8 files changed, 387 insertions(+), 2479 deletions(-)
 rename tasks/{new => complete}/2026-0825.01.jul.story.arch.ui-decomposition-roadmap-2300.ph3.md (100%)
 create mode 100644 ui/components/auth/PasskeyTable.tsx
 create mode 100644 ui/components/auth/WebAuthnScript.tsx
 delete mode 100644 ui/public/ui/utils/bip39.ts
 delete mode 100644 ui/public/ui/utils/bip39_wordlist.ts

diff --git a/tasks/new/2026-0825.01.jul.story.arch.ui-decomposition-roadmap-2300.ph3.md b/tasks/complete/2026-0825.01.jul.story.arch.ui-decomposition-roadmap-2300.ph3.md
similarity index 100%
rename from tasks/new/2026-0825.01.jul.story.arch.ui-decomposition-roadmap-2300.ph3.md
rename to tasks/complete/2026-0825.01.jul.story.arch.ui-decomposition-roadmap-2300.ph3.md
diff --git a/ui/components/PasskeysPage.tsx b/ui/components/PasskeysPage.tsx
index 404a07f..f11697c 100644
--- a/ui/components/PasskeysPage.tsx
+++ b/ui/components/PasskeysPage.tsx
@@ -1,4 +1,6 @@
 import { AuthenticatedLayout } from "./AuthenticatedLayout.tsx";
+import { PasskeyTable } from "./auth/PasskeyTable.tsx";
+import { WebAuthnScript } from "./auth/WebAuthnScript.tsx";
 
 export const PasskeysPage = ({
   passkeys,
@@ -84,145 +86,7 @@ export const PasskeysPage = ({
         </div>
       </div>
 
-      {/* Desktop Table View (≥ 768px) */}
-      <div class="card desktop-only" style="display: none;">
-        <div class="table-container">
-          <table>
-            <thead>
-              <tr>
-                <th>Credential ID</th>
-                <th>Sign Counter</th>
-                <th>AAGUID Vendor</th>
-                <th>Action</th>
-              </tr>
-            </thead>
-            <tbody>
-              {passkeys.length === 0
-                ? (
-                  <tr>
-                    <td
-                      colSpan={4}
-                      style="text-align: center; padding: 2rem; color: var(--text-muted);"
-                    >
-                      No passkeys registered.
-                    </td>
-                  </tr>
-                )
-                : (
-                  passkeys.map((passkey) => (
-                    <tr key={passkey.id}>
-                      <td>
-                        <code style="background: var(--surface-muted); padding: 0.2rem 0.5rem; border-radius: var(--radius-sm); font-family: monospace; font-size: 0.85rem;">
-                          {passkey.credential_id
-                            ? `${passkey.credential_id.substring(0, 16)}...`
-                            : passkey.id}
-                        </code>
-                      </td>
-                      <td style="color: var(--text-secondary);">
-                        {passkey.counter}
-                      </td>
-                      <td>
-                        <span class="badge badge-info">
-                          {passkey.aaguid
-                            ? passkey.aaguid.substring(0, 8)
-                            : "FIDO2 Key"}
-                        </span>
-                      </td>
-                      <td>
-                        <button
-                          type="button"
-                          class="btn-danger revoke-passkey-btn"
-                          data-passkey-id={passkey.id}
-                          disabled={passkeys.length <= 1}
-                          style={passkeys.length <= 1
-                            ? "opacity: 0.5; cursor: not-allowed;"
-                            : ""}
-                        >
-                          Remove
-                        </button>
-                      </td>
-                    </tr>
-                  ))
-                )}
-            </tbody>
-          </table>
-        </div>
-      </div>
-
-      {/* Mobile Adaptive Cards View (< 768px) */}
-      <div
-        class="mobile-only"
-        style="display: flex; flex-direction: column; gap: 1rem; margin-bottom: 2rem;"
-      >
-        {passkeys.length === 0
-          ? (
-            <div class="card" style="text-align: center; padding: 2rem;">
-              <p style="color: var(--text-muted); margin: 0;">
-                No passkeys registered.
-              </p>
-            </div>
-          )
-          : (
-            passkeys.map((passkey) => (
-              <div class="card" key={passkey.id} style="margin-bottom: 0;">
-                <div style="display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 0.75rem;">
-                  <div style="display: flex; align-items: center; gap: 0.65rem;">
-                    <div style="display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; background: var(--primary-light); color: var(--primary); border-radius: var(--radius-md);">
-                      <svg
-                        width="20"
-                        height="20"
-                        viewBox="0 0 24 24"
-                        fill="none"
-                        stroke="currentColor"
-                        stroke-width="2"
-                      >
-                        <circle cx="7.5" cy="15.5" r="5.5"></circle>
-                        <path d="m21 2-9.6 9.6"></path>
-                        <path d="m15.5 7.5 3 3L22 7l-3-3"></path>
-                      </svg>
-                    </div>
-                    <div>
-                      <div style="font-weight: 700; color: var(--text-primary);">
-                        Passkey Credential
-                      </div>
-                      <div style="font-size: 0.75rem; color: var(--text-muted); font-family: monospace;">
-                        {passkey.credential_id
-                          ? `${passkey.credential_id.substring(0, 14)}...`
-                          : passkey.id}
-                      </div>
-                    </div>
-                  </div>
-
-                  <span class="badge badge-info">
-                    {passkey.aaguid ? "Hardware/OS" : "FIDO2"}
-                  </span>
-                </div>
-
-                <div style="font-size: 0.8rem; color: var(--text-secondary); margin-bottom: 1rem;">
-                  <div>
-                    <strong>Counter:</strong> {passkey.counter} authentications
-                  </div>
-                </div>
-
-                <button
-                  type="button"
-                  class="btn-danger revoke-passkey-btn"
-                  data-passkey-id={passkey.id}
-                  disabled={passkeys.length <= 1}
-                  style={`width: 100%; min-height: 44px; ${
-                    passkeys.length <= 1
-                      ? "opacity: 0.5; cursor: not-allowed;"
-                      : ""
-                  }`}
-                >
-                  {passkeys.length <= 1
-                    ? "Cannot Remove Last Passkey"
-                    : "Remove Passkey"}
-                </button>
-              </div>
-            ))
-          )}
-      </div>
+      <PasskeyTable passkeys={passkeys} />
 
       {/* Emergency Recovery Backup Section */}
       <div class="card" style="border-left: 4px solid var(--warning);">
@@ -318,137 +182,7 @@ export const PasskeysPage = ({
         `}
       </style>
 
-      <script
-        type="module"
-        dangerouslySetInnerHTML={{
-          __html: `
-          import { entropyToMnemonic } from '/public/ui/utils/bip39.ts';
-
-          // Revoke Passkey Logic
-          document.querySelectorAll('.revoke-passkey-btn').forEach(btn => {
-            btn.addEventListener('click', async (e) => {
-              if (e.currentTarget.disabled) return;
-              if (!confirm('Are you sure you want to remove this passkey?')) return;
-
-              const passkeyId = e.currentTarget.getAttribute('data-passkey-id');
-              const originalText = e.currentTarget.textContent;
-              e.currentTarget.textContent = 'Removing...';
-              e.currentTarget.disabled = true;
-
-              try {
-                const res = await fetch(\`/api/passkeys/\${passkeyId}\`, {
-                  method: 'DELETE'
-                });
-
-                if (res.ok) {
-                  window.location.reload();
-                } else {
-                  const data = await res.json();
-                  alert(data.error || 'Failed to remove passkey');
-                  e.currentTarget.textContent = originalText;
-                  e.currentTarget.disabled = false;
-                }
-              } catch (err) {
-                alert('An error occurred');
-                e.currentTarget.textContent = originalText;
-                e.currentTarget.disabled = false;
-              }
-            });
-          });
-
-          // Add Passkey Logic
-          const addContainer = document.getElementById('addPasskeyContainer');
-          const addBtn = document.getElementById('addPasskeyBtn');
-          const cancelBtn = document.getElementById('cancelAddPasskeyBtn');
-          const confirmBtn = document.getElementById('confirmAddPasskeyBtn');
-          const statusDiv = document.getElementById('addPasskeyStatus');
-
-          addBtn?.addEventListener('click', () => {
-            addContainer.style.display = 'block';
-            addBtn.style.display = 'none';
-          });
-
-          cancelBtn?.addEventListener('click', () => {
-            addContainer.style.display = 'none';
-            addBtn.style.display = 'inline-flex';
-            statusDiv.textContent = '';
-          });
-
-          confirmBtn?.addEventListener('click', async () => {
-            confirmBtn.disabled = true;
-            statusDiv.textContent = 'Follow prompt on device...';
-            statusDiv.style.color = 'var(--primary)';
-
-            try {
-              const resp = await fetch("/api/passkeys/register/challenge", { method: "POST" });
-              const data = await resp.json();
-              if (!resp.ok) {
-                statusDiv.textContent = data.error || "Failed to get registration challenge";
-                statusDiv.style.color = 'var(--danger)';
-                confirmBtn.disabled = false;
-                return;
-              }
-
-              const { startRegistration } = SimpleWebAuthnBrowser;
-              const attResp = await startRegistration({ optionsJSON: data.options });
-
-              const verificationResp = await fetch("/api/passkeys/register/verify", {
-                method: "POST",
-                headers: { "Content-Type": "application/json" },
-                body: JSON.stringify({ response: attResp }),
-              });
-
-              const verificationJSON = await verificationResp.json();
-              if (verificationJSON.success) {
-                statusDiv.textContent = "Passkey registered successfully! Reloading...";
-                statusDiv.style.color = 'var(--success-text)';
-                setTimeout(() => window.location.reload(), 1000);
-              } else {
-                statusDiv.textContent = verificationJSON.error || "Registration verification failed";
-                statusDiv.style.color = 'var(--danger)';
-                confirmBtn.disabled = false;
-              }
-            } catch (err) {
-              statusDiv.textContent = err.message || 'An error occurred.';
-              statusDiv.style.color = 'var(--danger)';
-              confirmBtn.disabled = false;
-            }
-          });
-
-          // Re-generate Recovery Voucher
-          let backupMnemonic = "";
-          document.getElementById('regenVoucherBtn')?.addEventListener('click', async () => {
-            const entropy = new Uint8Array(16);
-            crypto.getRandomValues(entropy);
-            backupMnemonic = await entropyToMnemonic(entropy);
-
-            const grid = document.getElementById('generatedWordGrid');
-            grid.innerHTML = backupMnemonic.split(' ').map((w, idx) => \`
-              <div class="word-cell">
-                <span style="color: var(--text-muted); font-size: 0.75rem; width: 18px;">\${idx + 1}.</span>
-                <span style="color: var(--text-primary); font-weight: 600;">\${w}</span>
-              </div>
-            \`).join('');
-
-            document.getElementById('voucherModal').style.display = 'block';
-          });
-
-          document.getElementById('copyVoucherBtn')?.addEventListener('click', async () => {
-            if (!backupMnemonic) return;
-            try {
-              await navigator.clipboard.writeText(backupMnemonic);
-              const btn = document.getElementById('copyVoucherBtn');
-              const origHtml = btn.innerHTML;
-              btn.innerHTML = '<span>✓ Copied 12 Words to Clipboard!</span>';
-              setTimeout(() => { btn.innerHTML = origHtml; }, 2500);
-            } catch (_e) {
-              alert(backupMnemonic);
-            }
-          });
-        `,
-        }}
-      >
-      </script>
+      <WebAuthnScript isPasskeys />
     </AuthenticatedLayout>
   );
 };
diff --git a/ui/components/RecoveryPage.tsx b/ui/components/RecoveryPage.tsx
index 94820f9..6f53429 100644
--- a/ui/components/RecoveryPage.tsx
+++ b/ui/components/RecoveryPage.tsx
@@ -92,7 +92,7 @@ export const RecoveryPage = () => {
         dangerouslySetInnerHTML={{
           __html: `
         import init, { Share, reconstruct_secret } from '/public/wasm/sss_recovery_bg.wasm.js';
-        import { mnemonicToEntropy } from '/public/ui/utils/bip39.ts';
+        import { mnemonicToEntropy } from '/public/utils/bip39.ts';
 
         const methodSelect = document.getElementById('recovery-method');
         const voucherSection = document.getElementById('voucher-section');
diff --git a/ui/components/RegisterPage.tsx b/ui/components/RegisterPage.tsx
index 95bfae5..8d1c8f2 100644
--- a/ui/components/RegisterPage.tsx
+++ b/ui/components/RegisterPage.tsx
@@ -1,4 +1,5 @@
 import { Layout } from "./Layout.tsx";
+import { WebAuthnScript } from "./auth/WebAuthnScript.tsx";
 
 export const RegisterPage = (
   { initialCode = "" }: { initialCode?: string },
@@ -212,93 +213,7 @@ export const RegisterPage = (
         `}
       </style>
 
-      <script src="/public/auth-client.js?v=6"></script>
-      <script
-        type="module"
-        dangerouslySetInnerHTML={{
-          __html: `
-          import { entropyToMnemonic } from '/public/ui/utils/bip39.ts';
-
-          const urlParams = new URLSearchParams(window.location.search);
-          const codeParam = urlParams.get('code');
-          if (codeParam) {
-            const input = document.getElementById('inviteCode');
-            if (input) {
-              input.value = codeParam;
-              document.getElementById('username').focus();
-            }
-          }
-
-          let generatedMnemonic = "";
-
-          document.getElementById('registerBtn').addEventListener('click', async () => {
-            const username = document.getElementById('username').value.trim();
-            const inviteCode = document.getElementById('inviteCode').value.trim();
-
-            if (!username || !inviteCode) {
-              setStatus("Username and Invite Code are required.", true);
-              return;
-            }
-
-            const loader = document.getElementById('loadingIndicator');
-            const btn = document.getElementById('registerBtn');
-            loader.style.display = 'block';
-            btn.disabled = true;
-            setStatus('');
-
-            try {
-              const res = await startWebAuthnRegistration(username, inviteCode);
-              if (res && res.success) {
-                // Generate 16 bytes of entropy for 12 BIP-39 words
-                const entropy = new Uint8Array(16);
-                crypto.getRandomValues(entropy);
-                generatedMnemonic = await entropyToMnemonic(entropy);
-                
-                const words = generatedMnemonic.split(' ');
-                const grid = document.getElementById('wordGrid');
-                grid.innerHTML = words.map((w, idx) => \`
-                  <div class="word-cell">
-                    <span class="word-num">\${idx + 1}.</span>
-                    <span class="word-text">\${w}</span>
-                  </div>
-                \`).join('');
-
-                // Switch to Step 2
-                document.getElementById('step1Container').style.display = 'none';
-                document.getElementById('step2Container').style.display = 'block';
-                document.getElementById('registerTitle').textContent = "Recovery Voucher";
-                document.getElementById('registerSubtitle').textContent = "Save your 12-word backup key in a safe place.";
-              }
-            } catch (err) {
-              console.error(err);
-            } finally {
-              loader.style.display = 'none';
-              btn.disabled = false;
-            }
-          });
-
-          document.getElementById('copyWordsBtn').addEventListener('click', async () => {
-            if (!generatedMnemonic) return;
-            try {
-              await navigator.clipboard.writeText(generatedMnemonic);
-              const btn = document.getElementById('copyWordsBtn');
-              const origHtml = btn.innerHTML;
-              btn.innerHTML = '<span>✓ Copied to Clipboard!</span>';
-              btn.style.borderColor = 'var(--success)';
-              btn.style.color = 'var(--success-text)';
-              setTimeout(() => {
-                btn.innerHTML = origHtml;
-                btn.style.borderColor = '';
-                btn.style.color = '';
-              }, 2500);
-            } catch (_e) {
-              alert("Select and copy the words manually: " + generatedMnemonic);
-            }
-          });
-        `,
-        }}
-      >
-      </script>
+      <WebAuthnScript isRegister />
     </Layout>
   );
 };
diff --git a/ui/components/auth/PasskeyTable.tsx b/ui/components/auth/PasskeyTable.tsx
new file mode 100644
index 0000000..1d7f690
--- /dev/null
+++ b/ui/components/auth/PasskeyTable.tsx
@@ -0,0 +1,145 @@
+export const PasskeyTable = ({ passkeys }: { passkeys: any[] }) => {
+  return (
+    <>
+      {/* Desktop Table View (≥ 768px) */}
+      <div class="card desktop-only" style="display: none;">
+        <div class="table-container">
+          <table>
+            <thead>
+              <tr>
+                <th>Credential ID</th>
+                <th>Sign Counter</th>
+                <th>AAGUID Vendor</th>
+                <th>Action</th>
+              </tr>
+            </thead>
+            <tbody>
+              {passkeys.length === 0
+                ? (
+                  <tr>
+                    <td
+                      colSpan={4}
+                      style="text-align: center; padding: 2rem; color: var(--text-muted);"
+                    >
+                      No passkeys registered.
+                    </td>
+                  </tr>
+                )
+                : (
+                  passkeys.map((passkey) => (
+                    <tr key={passkey.id}>
+                      <td>
+                        <code style="background: var(--surface-muted); padding: 0.2rem 0.5rem; border-radius: var(--radius-sm); font-family: monospace; font-size: 0.85rem;">
+                          {passkey.credential_id
+                            ? `${passkey.credential_id.substring(0, 16)}...`
+                            : passkey.id}
+                        </code>
+                      </td>
+                      <td style="color: var(--text-secondary);">
+                        {passkey.counter}
+                      </td>
+                      <td>
+                        <span class="badge badge-info">
+                          {passkey.aaguid
+                            ? passkey.aaguid.substring(0, 8)
+                            : "FIDO2 Key"}
+                        </span>
+                      </td>
+                      <td>
+                        <button
+                          type="button"
+                          class="btn-danger revoke-passkey-btn"
+                          data-passkey-id={passkey.id}
+                          disabled={passkeys.length <= 1}
+                          style={passkeys.length <= 1
+                            ? "opacity: 0.5; cursor: not-allowed;"
+                            : ""}
+                        >
+                          Remove
+                        </button>
+                      </td>
+                    </tr>
+                  ))
+                )}
+            </tbody>
+          </table>
+        </div>
+      </div>
+
+      {/* Mobile Adaptive Cards View (< 768px) */}
+      <div
+        class="mobile-only"
+        style="display: flex; flex-direction: column; gap: 1rem; margin-bottom: 2rem;"
+      >
+        {passkeys.length === 0
+          ? (
+            <div class="card" style="text-align: center; padding: 2rem;">
+              <p style="color: var(--text-muted); margin: 0;">
+                No passkeys registered.
+              </p>
+            </div>
+          )
+          : (
+            passkeys.map((passkey) => (
+              <div class="card" key={passkey.id} style="margin-bottom: 0;">
+                <div style="display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 0.75rem;">
+                  <div style="display: flex; align-items: center; gap: 0.65rem;">
+                    <div style="display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; background: var(--primary-light); color: var(--primary); border-radius: var(--radius-md);">
+                      <svg
+                        width="20"
+                        height="20"
+                        viewBox="0 0 24 24"
+                        fill="none"
+                        stroke="currentColor"
+                        stroke-width="2"
+                      >
+                        <circle cx="7.5" cy="15.5" r="5.5"></circle>
+                        <path d="m21 2-9.6 9.6"></path>
+                        <path d="m15.5 7.5 3 3L22 7l-3-3"></path>
+                      </svg>
+                    </div>
+                    <div>
+                      <div style="font-weight: 700; color: var(--text-primary);">
+                        Passkey Credential
+                      </div>
+                      <div style="font-size: 0.75rem; color: var(--text-muted); font-family: monospace;">
+                        {passkey.credential_id
+                          ? `${passkey.credential_id.substring(0, 14)}...`
+                          : passkey.id}
+                      </div>
+                    </div>
+                  </div>
+
+                  <span class="badge badge-info">
+                    {passkey.aaguid ? "Hardware/OS" : "FIDO2"}
+                  </span>
+                </div>
+
+                <div style="font-size: 0.8rem; color: var(--text-secondary); margin-bottom: 1rem;">
+                  <div>
+                    <strong>Counter:</strong> {passkey.counter} authentications
+                  </div>
+                </div>
+
+                <button
+                  type="button"
+                  class="btn-danger revoke-passkey-btn"
+                  data-passkey-id={passkey.id}
+                  disabled={passkeys.length <= 1}
+                  style={`width: 100%; min-height: 44px; ${
+                    passkeys.length <= 1
+                      ? "opacity: 0.5; cursor: not-allowed;"
+                      : ""
+                  }`}
+                >
+                  {passkeys.length <= 1
+                    ? "Cannot Remove Last Passkey"
+                    : "Remove Passkey"}
+                </button>
+              </div>
+            ))
+          )}
+      </div>
+    </>
+  );
+};
diff --git a/ui/components/auth/WebAuthnScript.tsx b/ui/components/auth/WebAuthnScript.tsx
new file mode 100644
index 0000000..256d831
--- /dev/null
+++ b/ui/components/auth/WebAuthnScript.tsx
@@ -0,0 +1,235 @@
+export const WebAuthnScript = ({
+  isRegister = false,
+  isPasskeys = false,
+}: {
+  isRegister?: boolean;
+  isPasskeys?: boolean;
+}) => {
+  return (
+    <>
+      <script src="/public/auth-client.js?v=6"></script>
+      {isRegister && (
+        <script
+          type="module"
+          dangerouslySetInnerHTML={{
+            __html: `
+          import { entropyToMnemonic } from '/public/utils/bip39.ts';
+
+          const urlParams = new URLSearchParams(window.location.search);
+          const codeParam = urlParams.get('code');
+          if (codeParam) {
+            const input = document.getElementById('inviteCode');
+            if (input) {
+              input.value = codeParam;
+              document.getElementById('username').focus();
+            }
+          }
+
+          let generatedMnemonic = "";
+
+          document.getElementById('registerBtn').addEventListener('click', async () => {
+            const username = document.getElementById('username').value.trim();
+            const inviteCode = document.getElementById('inviteCode').value.trim();
+
+            if (!username || !inviteCode) {
+              setStatus("Username and Invite Code are required.", true);
+              return;
+            }
+
+            const loader = document.getElementById('loadingIndicator');
+            const btn = document.getElementById('registerBtn');
+            loader.style.display = 'block';
+            btn.disabled = true;
+            setStatus('');
+
+            try {
+              const res = await startWebAuthnRegistration(username, inviteCode);
+              if (res && res.success) {
+                // Generate 16 bytes of entropy for 12 BIP-39 words
+                const entropy = new Uint8Array(16);
+                crypto.getRandomValues(entropy);
+                generatedMnemonic = await entropyToMnemonic(entropy);
+
+                const words = generatedMnemonic.split(' ');
+                const grid = document.getElementById('wordGrid');
+                grid.innerHTML = words.map((w, idx) => \`
+                  <div class="word-cell">
+                    <span class="word-num">\${idx + 1}.</span>
+                    <span class="word-text">\${w}</span>
+                  </div>
+                \`).join('');
+
+                // Switch to Step 2
+                document.getElementById('step1Container').style.display = 'none';
+                document.getElementById('step2Container').style.display = 'block';
+                document.getElementById('registerTitle').textContent = "Recovery Voucher";
+                document.getElementById('registerSubtitle').textContent = "Save your 12-word backup key in a safe place.";
+              }
+            } catch (err) {
+              console.error(err);
+            } finally {
+              loader.style.display = 'none';
+              btn.disabled = false;
+            }
+          });
+
+          document.getElementById('copyWordsBtn').addEventListener('click', async () => {
+            if (!generatedMnemonic) return;
+            try {
+              await navigator.clipboard.writeText(generatedMnemonic);
+              const btn = document.getElementById('copyWordsBtn');
+              const origHtml = btn.innerHTML;
+              btn.innerHTML = '<span>✓ Copied to Clipboard!</span>';
+              btn.style.borderColor = 'var(--success)';
+              btn.style.color = 'var(--success-text)';
+              setTimeout(() => {
+                btn.innerHTML = origHtml;
+                btn.style.borderColor = '';
+                btn.style.color = '';
+              }, 2500);
+            } catch (_e) {
+              alert("Select and copy the words manually: " + generatedMnemonic);
+            }
+          });
+        `,
+          }}
+        >
+        </script>
+      )}
+
+      {isPasskeys && (
+        <script
+          type="module"
+          dangerouslySetInnerHTML={{
+            __html: `
+          import { entropyToMnemonic } from '/public/utils/bip39.ts';
+
+          // Revoke Passkey Logic
+          document.querySelectorAll('.revoke-passkey-btn').forEach(btn => {
+            btn.addEventListener('click', async (e) => {
+              if (e.currentTarget.disabled) return;
+              if (!confirm('Are you sure you want to remove this passkey?')) return;
+
+              const passkeyId = e.currentTarget.getAttribute('data-passkey-id');
+              const originalText = e.currentTarget.textContent;
+              e.currentTarget.textContent = 'Removing...';
+              e.currentTarget.disabled = true;
+
+              try {
+                const res = await fetch(\`/api/passkeys/\${passkeyId}\`, {
+                  method: 'DELETE'
+                });
+
+                if (res.ok) {
+                  window.location.reload();
+                } else {
+                  const data = await res.json();
+                  alert(data.error || 'Failed to remove passkey');
+                  e.currentTarget.textContent = originalText;
+                  e.currentTarget.disabled = false;
+                }
+              } catch (err) {
+                alert('An error occurred');
+                e.currentTarget.textContent = originalText;
+                e.currentTarget.disabled = false;
+              }
+            });
+          });
+
+          // Add Passkey Logic
+          const addContainer = document.getElementById('addPasskeyContainer');
+          const addBtn = document.getElementById('addPasskeyBtn');
+          const cancelBtn = document.getElementById('cancelAddPasskeyBtn');
+          const confirmBtn = document.getElementById('confirmAddPasskeyBtn');
+          const statusDiv = document.getElementById('addPasskeyStatus');
+
+          addBtn?.addEventListener('click', () => {
+            addContainer.style.display = 'block';
+            addBtn.style.display = 'none';
+          });
+
+          cancelBtn?.addEventListener('click', () => {
+            addContainer.style.display = 'none';
+            addBtn.style.display = 'inline-flex';
+            statusDiv.textContent = '';
+          });
+
+          confirmBtn?.addEventListener('click', async () => {
+            confirmBtn.disabled = true;
+            statusDiv.textContent = 'Follow prompt on device...';
+            statusDiv.style.color = 'var(--primary)';
+
+            try {
+              const resp = await fetch("/api/passkeys/register/challenge", { method: "POST" });
+              const data = await resp.json();
+              if (!resp.ok) {
+                statusDiv.textContent = data.error || "Failed to get registration challenge";
+                statusDiv.style.color = 'var(--danger)';
+                confirmBtn.disabled = false;
+                return;
+              }
+
+              const { startRegistration } = SimpleWebAuthnBrowser;
+              const attResp = await startRegistration({ optionsJSON: data.options });
+
+              const verificationResp = await fetch("/api/passkeys/register/verify", {
+                method: "POST",
+                headers: { "Content-Type": "application/json" },
+                body: JSON.stringify({ response: attResp }),
+              });
+
+              const verificationJSON = await verificationResp.json();
+              if (verificationJSON.success) {
+                statusDiv.textContent = "Passkey registered successfully! Reloading...";
+                statusDiv.style.color = 'var(--success-text)';
+                setTimeout(() => window.location.reload(), 1000);
+              } else {
+                statusDiv.textContent = verificationJSON.error || "Registration verification failed";
+                statusDiv.style.color = 'var(--danger)';
+                confirmBtn.disabled = false;
+              }
+            } catch (err) {
+              statusDiv.textContent = err.message || 'An error occurred.';
+              statusDiv.style.color = 'var(--danger)';
+              confirmBtn.disabled = false;
+            }
+          });
+
+          // Re-generate Recovery Voucher
+          let backupMnemonic = "";
+          document.getElementById('regenVoucherBtn')?.addEventListener('click', async () => {
+            const entropy = new Uint8Array(16);
+            crypto.getRandomValues(entropy);
+            backupMnemonic = await entropyToMnemonic(entropy);
+
+            const grid = document.getElementById('generatedWordGrid');
+            grid.innerHTML = backupMnemonic.split(' ').map((w, idx) => \`
+              <div class="word-cell">
+                <span style="color: var(--text-muted); font-size: 0.75rem; width: 18px;">\${idx + 1}.</span>
+                <span style="color: var(--text-primary); font-weight: 600;">\${w}</span>
+              </div>
+            \`).join('');
+
+            document.getElementById('voucherModal').style.display = 'block';
+          });
+
+          document.getElementById('copyVoucherBtn')?.addEventListener('click', async () => {
+            if (!backupMnemonic) return;
+            try {
+              await navigator.clipboard.writeText(backupMnemonic);
+              const btn = document.getElementById('copyVoucherBtn');
+              const origHtml = btn.innerHTML;
+              btn.innerHTML = '<span>✓ Copied 12 Words to Clipboard!</span>';
+              setTimeout(() => { btn.innerHTML = origHtml; }, 2500);
+            } catch (_e) {
+              alert(backupMnemonic);
+            }
+          });
+        `,
+          }}
+        >
+        </script>
+      )}
+    </>
+  );
+};
diff --git a/ui/public/ui/utils/bip39.ts b/ui/public/ui/utils/bip39.ts
deleted file mode 100644
index 9a7649c..0000000
--- a/ui/public/ui/utils/bip39.ts
+++ /dev/null
@@ -1,71 +0,0 @@
-import { WORDLIST } from "./bip39_wordlist.ts";
-
-export async function entropyToMnemonic(entropy: Uint8Array): Promise<string> {
-  if (entropy.length < 16 || entropy.length > 32 || entropy.length % 4 !== 0) {
-    throw new Error("Invalid entropy length");
-  }
-
-  const entropyBits = Array.from(entropy)
-    .map((b) => b.toString(2).padStart(8, "0"))
-    .join("");
-
-  const entropyBuffer = new Uint8Array(entropy.length);
-  entropyBuffer.set(entropy);
-  const hashBuffer = await crypto.subtle.digest("SHA-256", entropyBuffer);
-  const hashBits = Array.from(new Uint8Array(hashBuffer))
-    .map((b) => b.toString(2).padStart(8, "0"))
-    .join("");
-
-  const checksumLength = entropy.length / 4;
-  const checksum = hashBits.slice(0, checksumLength);
-
-  const bits = entropyBits + checksum;
-  const chunks = bits.match(/(.{1,11})/g) || [];
-
-  const mnemonic = chunks.map((binaryStr) => {
-    const index = parseInt(binaryStr, 2);
-    return WORDLIST[index];
-  });
-
-  return mnemonic.join(" ");
-}
-
-export async function mnemonicToEntropy(mnemonic: string): Promise<Uint8Array> {
-  const words = mnemonic.normalize("NFKD").trim().split(/\s+/);
-  if (words.length % 3 !== 0) {
-    throw new Error("Invalid mnemonic length");
-  }
-
-  const bits = words
-    .map((word) => {
-      const index = WORDLIST.indexOf(word);
-      if (index === -1) {
-        throw new Error(`Invalid word in mnemonic: ${word}`);
-      }
-      return index.toString(2).padStart(11, "0");
-    })
-    .join("");
-
-  const dividerIndex = Math.floor(bits.length / 33) * 32;
-  const entropyBits = bits.slice(0, dividerIndex);
-  const checksumBits = bits.slice(dividerIndex);
-
-  const entropy = new Uint8Array(entropyBits.length / 8);
-  for (let i = 0; i < entropy.length; i++) {
-    entropy[i] = parseInt(entropyBits.slice(i * 8, (i + 1) * 8), 2);
-  }
-
-  const hashBuffer = await crypto.subtle.digest("SHA-256", entropy);
-  const hashBits = Array.from(new Uint8Array(hashBuffer))
-    .map((b) => b.toString(2).padStart(8, "0"))
-    .join("");
-  const expectedChecksum = hashBits.slice(0, checksumBits.length);
-
-  if (expectedChecksum !== checksumBits) {
-    // Explicitly zeroize on failure
-    entropy.fill(0);
-    throw new Error("Invalid mnemonic checksum");
-  }
-
-  return entropy;
-}
diff --git a/ui/public/ui/utils/bip39_wordlist.ts b/ui/public/ui/utils/bip39_wordlist.ts
deleted file mode 100644
index 33a2e1e..0000000
--- a/ui/public/ui/utils/bip39_wordlist.ts
+++ /dev/null
@@ -1,2050 +0,0 @@
-export const WORDLIST = [
-  "abandon",
-  "ability",
-  "able",
-  "about",
-  "above",
-  "absent",
-  "absorb",
-  "abstract",
-  "absurd",
-  "abuse",
-  "access",
-  "accident",
-  "account",
-  "accuse",
-  "achieve",
-  "acid",
-  "acoustic",
-  "acquire",
-  "across",
-  "act",
-  "action",
-  "actor",
-  "actress",
-  "actual",
-  "adapt",
-  "add",
-  "addict",
-  "address",
-  "adjust",
-  "admit",
-  "adult",
-  "advance",
-  "advice",
-  "aerobic",
-  "affair",
-  "afford",
-  "afraid",
-  "again",
-  "age",
-  "agent",
-  "agree",
-  "ahead",
-  "aim",
-  "air",
-  "airport",
-  "aisle",
-  "alarm",
-  "album",
-  "alcohol",
-  "alert",
-  "alien",
-  "all",
-  "alley",
-  "allow",
-  "almost",
-  "alone",
-  "alpha",
-  "already",
-  "also",
-  "alter",
-  "always",
-  "amateur",
-  "amazing",
-  "among",
-  "amount",
-  "amused",
-  "analyst",
-  "anchor",
-  "ancient",
-  "anger",
-  "angle",
-  "angry",
-  "animal",
-  "ankle",
-  "announce",
-  "annual",
-  "another",
-  "answer",
-  "antenna",
-  "antique",
-  "anxiety",
-  "any",
-  "apart",
-  "apology",
-  "appear",
-  "apple",
-  "approve",
-  "april",
-  "arch",
-  "arctic",
-  "area",
-  "arena",
-  "argue",
-  "arm",
-  "armed",
-  "armor",
-  "army",
-  "around",
-  "arrange",
-  "arrest",
-  "arrive",
-  "arrow",
-  "art",
-  "artefact",
-  "artist",
-  "artwork",
-  "ask",
-  "aspect",
-  "assault",
-  "asset",
-  "assist",
-  "assume",
-  "asthma",
-  "athlete",
-  "atom",
-  "attack",
-  "attend",
-  "attitude",
-  "attract",
-  "auction",
-  "audit",
-  "august",
-  "aunt",
-  "author",
-  "auto",
-  "autumn",
-  "average",
-  "avocado",
-  "avoid",
-  "awake",
-  "aware",
-  "away",
-  "awesome",
-  "awful",
-  "awkward",
-  "axis",
-  "baby",
-  "bachelor",
-  "bacon",
-  "badge",
-  "bag",
-  "balance",
-  "balcony",
-  "ball",
-  "bamboo",
-  "banana",
-  "banner",
-  "bar",
-  "barely",
-  "bargain",
-  "barrel",
-  "base",
-  "basic",
-  "basket",
-  "battle",
-  "beach",
-  "bean",
-  "beauty",
-  "because",
-  "become",
-  "beef",
-  "before",
-  "begin",
-  "behave",
-  "behind",
-  "believe",
-  "below",
-  "belt",
-  "bench",
-  "benefit",
-  "best",
-  "betray",
-  "better",
-  "between",
-  "beyond",
-  "bicycle",
-  "bid",
-  "bike",
-  "bind",
-  "biology",
-  "bird",
-  "birth",
-  "bitter",
-  "black",
-  "blade",
-  "blame",
-  "blanket",
-  "blast",
-  "bleak",
-  "bless",
-  "blind",
-  "blood",
-  "blossom",
-  "blouse",
-  "blue",
-  "blur",
-  "blush",
-  "board",
-  "boat",
-  "body",
-  "boil",
-  "bomb",
-  "bone",
-  "bonus",
-  "book",
-  "boost",
-  "border",
-  "boring",
-  "borrow",
-  "boss",
-  "bottom",
-  "bounce",
-  "box",
-  "boy",
-  "bracket",
-  "brain",
-  "brand",
-  "brass",
-  "brave",
-  "bread",
-  "breeze",
-  "brick",
-  "bridge",
-  "brief",
-  "bright",
-  "bring",
-  "brisk",
-  "broccoli",
-  "broken",
-  "bronze",
-  "broom",
-  "brother",
-  "brown",
-  "brush",
-  "bubble",
-  "buddy",
-  "budget",
-  "buffalo",
-  "build",
-  "bulb",
-  "bulk",
-  "bullet",
-  "bundle",
-  "bunker",
-  "burden",
-  "burger",
-  "burst",
-  "bus",
-  "business",
-  "busy",
-  "butter",
-  "buyer",
-  "buzz",
-  "cabbage",
-  "cabin",
-  "cable",
-  "cactus",
-  "cage",
-  "cake",
-  "call",
-  "calm",
-  "camera",
-  "camp",
-  "can",
-  "canal",
-  "cancel",
-  "candy",
-  "cannon",
-  "canoe",
-  "canvas",
-  "canyon",
-  "capable",
-  "capital",
-  "captain",
-  "car",
-  "carbon",
-  "card",
-  "cargo",
-  "carpet",
-  "carry",
-  "cart",
-  "case",
-  "cash",
-  "casino",
-  "castle",
-  "casual",
-  "cat",
-  "catalog",
-  "catch",
-  "category",
-  "cattle",
-  "caught",
-  "cause",
-  "caution",
-  "cave",
-  "ceiling",
-  "celery",
-  "cement",
-  "census",
-  "century",
-  "cereal",
-  "certain",
-  "chair",
-  "chalk",
-  "champion",
-  "change",
-  "chaos",
-  "chapter",
-  "charge",
-  "chase",
-  "chat",
-  "cheap",
-  "check",
-  "cheese",
-  "chef",
-  "cherry",
-  "chest",
-  "chicken",
-  "chief",
-  "child",
-  "chimney",
-  "choice",
-  "choose",
-  "chronic",
-  "chuckle",
-  "chunk",
-  "churn",
-  "cigar",
-  "cinnamon",
-  "circle",
-  "citizen",
-  "city",
-  "civil",
-  "claim",
-  "clap",
-  "clarify",
-  "claw",
-  "clay",
-  "clean",
-  "clerk",
-  "clever",
-  "click",
-  "client",
-  "cliff",
-  "climb",
-  "clinic",
-  "clip",
-  "clock",
-  "clog",
-  "close",
-  "cloth",
-  "cloud",
-  "clown",
-  "club",
-  "clump",
-  "cluster",
-  "clutch",
-  "coach",
-  "coast",
-  "coconut",
-  "code",
-  "coffee",
-  "coil",
-  "coin",
-  "collect",
-  "color",
-  "column",
-  "combine",
-  "come",
-  "comfort",
-  "comic",
-  "common",
-  "company",
-  "concert",
-  "conduct",
-  "confirm",
-  "congress",
-  "connect",
-  "consider",
-  "control",
-  "convince",
-  "cook",
-  "cool",
-  "copper",
-  "copy",
-  "coral",
-  "core",
-  "corn",
-  "correct",
-  "cost",
-  "cotton",
-  "couch",
-  "country",
-  "couple",
-  "course",
-  "cousin",
-  "cover",
-  "coyote",
-  "crack",
-  "cradle",
-  "craft",
-  "cram",
-  "crane",
-  "crash",
-  "crater",
-  "crawl",
-  "crazy",
-  "cream",
-  "credit",
-  "creek",
-  "crew",
-  "cricket",
-  "crime",
-  "crisp",
-  "critic",
-  "crop",
-  "cross",
-  "crouch",
-  "crowd",
-  "crucial",
-  "cruel",
-  "cruise",
-  "crumble",
-  "crunch",
-  "crush",
-  "cry",
-  "crystal",
-  "cube",
-  "culture",
-  "cup",
-  "cupboard",
-  "curious",
-  "current",
-  "curtain",
-  "curve",
-  "cushion",
-  "custom",
-  "cute",
-  "cycle",
-  "dad",
-  "damage",
-  "damp",
-  "dance",
-  "danger",
-  "daring",
-  "dash",
-  "daughter",
-  "dawn",
-  "day",
-  "deal",
-  "debate",
-  "debris",
-  "decade",
-  "december",
-  "decide",
-  "decline",
-  "decorate",
-  "decrease",
-  "deer",
-  "defense",
-  "define",
-  "defy",
-  "degree",
-  "delay",
-  "deliver",
-  "demand",
-  "demise",
-  "denial",
-  "dentist",
-  "deny",
-  "depart",
-  "depend",
-  "deposit",
-  "depth",
-  "deputy",
-  "derive",
-  "describe",
-  "desert",
-  "design",
-  "desk",
-  "despair",
-  "destroy",
-  "detail",
-  "detect",
-  "develop",
-  "device",
-  "devote",
-  "diagram",
-  "dial",
-  "diamond",
-  "diary",
-  "dice",
-  "diesel",
-  "diet",
-  "differ",
-  "digital",
-  "dignity",
-  "dilemma",
-  "dinner",
-  "dinosaur",
-  "direct",
-  "dirt",
-  "disagree",
-  "discover",
-  "disease",
-  "dish",
-  "dismiss",
-  "disorder",
-  "display",
-  "distance",
-  "divert",
-  "divide",
-  "divorce",
-  "dizzy",
-  "doctor",
-  "document",
-  "dog",
-  "doll",
-  "dolphin",
-  "domain",
-  "donate",
-  "donkey",
-  "donor",
-  "door",
-  "dose",
-  "double",
-  "dove",
-  "draft",
-  "dragon",
-  "drama",
-  "drastic",
-  "draw",
-  "dream",
-  "dress",
-  "drift",
-  "drill",
-  "drink",
-  "drip",
-  "drive",
-  "drop",
-  "drum",
-  "dry",
-  "duck",
-  "dumb",
-  "dune",
-  "during",
-  "dust",
-  "dutch",
-  "duty",
-  "dwarf",
-  "dynamic",
-  "eager",
-  "eagle",
-  "early",
-  "earn",
-  "earth",
-  "easily",
-  "east",
-  "easy",
-  "echo",
-  "ecology",
-  "economy",
-  "edge",
-  "edit",
-  "educate",
-  "effort",
-  "egg",
-  "eight",
-  "either",
-  "elbow",
-  "elder",
-  "electric",
-  "elegant",
-  "element",
-  "elephant",
-  "elevator",
-  "elite",
-  "else",
-  "embark",
-  "embody",
-  "embrace",
-  "emerge",
-  "emotion",
-  "employ",
-  "empower",
-  "empty",
-  "enable",
-  "enact",
-  "end",
-  "endless",
-  "endorse",
-  "enemy",
-  "energy",
-  "enforce",
-  "engage",
-  "engine",
-  "enhance",
-  "enjoy",
-  "enlist",
-  "enough",
-  "enrich",
-  "enroll",
-  "ensure",
-  "enter",
-  "entire",
-  "entry",
-  "envelope",
-  "episode",
-  "equal",
-  "equip",
-  "era",
-  "erase",
-  "erode",
-  "erosion",
-  "error",
-  "erupt",
-  "escape",
-  "essay",
-  "essence",
-  "estate",
-  "eternal",
-  "ethics",
-  "evidence",
-  "evil",
-  "evoke",
-  "evolve",
-  "exact",
-  "example",
-  "excess",
-  "exchange",
-  "excite",
-  "exclude",
-  "excuse",
-  "execute",
-  "exercise",
-  "exhaust",
-  "exhibit",
-  "exile",
-  "exist",
-  "exit",
-  "exotic",
-  "expand",
-  "expect",
-  "expire",
-  "explain",
-  "expose",
-  "express",
-  "extend",
-  "extra",
-  "eye",
-  "eyebrow",
-  "fabric",
-  "face",
-  "faculty",
-  "fade",
-  "faint",
-  "faith",
-  "fall",
-  "false",
-  "fame",
-  "family",
-  "famous",
-  "fan",
-  "fancy",
-  "fantasy",
-  "farm",
-  "fashion",
-  "fat",
-  "fatal",
-  "father",
-  "fatigue",
-  "fault",
-  "favorite",
-  "feature",
-  "february",
-  "federal",
-  "fee",
-  "feed",
-  "feel",
-  "female",
-  "fence",
-  "festival",
-  "fetch",
-  "fever",
-  "few",
-  "fiber",
-  "fiction",
-  "field",
-  "figure",
-  "file",
-  "film",
-  "filter",
-  "final",
-  "find",
-  "fine",
-  "finger",
-  "finish",
-  "fire",
-  "firm",
-  "first",
-  "fiscal",
-  "fish",
-  "fit",
-  "fitness",
-  "fix",
-  "flag",
-  "flame",
-  "flash",
-  "flat",
-  "flavor",
-  "flee",
-  "flight",
-  "flip",
-  "float",
-  "flock",
-  "floor",
-  "flower",
-  "fluid",
-  "flush",
-  "fly",
-  "foam",
-  "focus",
-  "fog",
-  "foil",
-  "fold",
-  "follow",
-  "food",
-  "foot",
-  "force",
-  "forest",
-  "forget",
-  "fork",
-  "fortune",
-  "forum",
-  "forward",
-  "fossil",
-  "foster",
-  "found",
-  "fox",
-  "fragile",
-  "frame",
-  "frequent",
-  "fresh",
-  "friend",
-  "fringe",
-  "frog",
-  "front",
-  "frost",
-  "frown",
-  "frozen",
-  "fruit",
-  "fuel",
-  "fun",
-  "funny",
-  "furnace",
-  "fury",
-  "future",
-  "gadget",
-  "gain",
-  "galaxy",
-  "gallery",
-  "game",
-  "gap",
-  "garage",
-  "garbage",
-  "garden",
-  "garlic",
-  "garment",
-  "gas",
-  "gasp",
-  "gate",
-  "gather",
-  "gauge",
-  "gaze",
-  "general",
-  "genius",
-  "genre",
-  "gentle",
-  "genuine",
-  "gesture",
-  "ghost",
-  "giant",
-  "gift",
-  "giggle",
-  "ginger",
-  "giraffe",
-  "girl",
-  "give",
-  "glad",
-  "glance",
-  "glare",
-  "glass",
-  "glide",
-  "glimpse",
-  "globe",
-  "gloom",
-  "glory",
-  "glove",
-  "glow",
-  "glue",
-  "goat",
-  "goddess",
-  "gold",
-  "good",
-  "goose",
-  "gorilla",
-  "gospel",
-  "gossip",
-  "govern",
-  "gown",
-  "grab",
-  "grace",
-  "grain",
-  "grant",
-  "grape",
-  "grass",
-  "gravity",
-  "great",
-  "green",
-  "grid",
-  "grief",
-  "grit",
-  "grocery",
-  "group",
-  "grow",
-  "grunt",
-  "guard",
-  "guess",
-  "guide",
-  "guilt",
-  "guitar",
-  "gun",
-  "gym",
-  "habit",
-  "hair",
-  "half",
-  "hammer",
-  "hamster",
-  "hand",
-  "happy",
-  "harbor",
-  "hard",
-  "harsh",
-  "harvest",
-  "hat",
-  "have",
-  "hawk",
-  "hazard",
-  "head",
-  "health",
-  "heart",
-  "heavy",
-  "hedgehog",
-  "height",
-  "hello",
-  "helmet",
-  "help",
-  "hen",
-  "hero",
-  "hidden",
-  "high",
-  "hill",
-  "hint",
-  "hip",
-  "hire",
-  "history",
-  "hobby",
-  "hockey",
-  "hold",
-  "hole",
-  "holiday",
-  "hollow",
-  "home",
-  "honey",
-  "hood",
-  "hope",
-  "horn",
-  "horror",
-  "horse",
-  "hospital",
-  "host",
-  "hotel",
-  "hour",
-  "hover",
-  "hub",
-  "huge",
-  "human",
-  "humble",
-  "humor",
-  "hundred",
-  "hungry",
-  "hunt",
-  "hurdle",
-  "hurry",
-  "hurt",
-  "husband",
-  "hybrid",
-  "ice",
-  "icon",
-  "idea",
-  "identify",
-  "idle",
-  "ignore",
-  "ill",
-  "illegal",
-  "illness",
-  "image",
-  "imitate",
-  "immense",
-  "immune",
-  "impact",
-  "impose",
-  "improve",
-  "impulse",
-  "inch",
-  "include",
-  "income",
-  "increase",
-  "index",
-  "indicate",
-  "indoor",
-  "industry",
-  "infant",
-  "inflict",
-  "inform",
-  "inhale",
-  "inherit",
-  "initial",
-  "inject",
-  "injury",
-  "inmate",
-  "inner",
-  "innocent",
-  "input",
-  "inquiry",
-  "insane",
-  "insect",
-  "inside",
-  "inspire",
-  "install",
-  "intact",
-  "interest",
-  "into",
-  "invest",
-  "invite",
-  "involve",
-  "iron",
-  "island",
-  "isolate",
-  "issue",
-  "item",
-  "ivory",
-  "jacket",
-  "jaguar",
-  "jar",
-  "jazz",
-  "jealous",
-  "jeans",
-  "jelly",
-  "jewel",
-  "job",
-  "join",
-  "joke",
-  "journey",
-  "joy",
-  "judge",
-  "juice",
-  "jump",
-  "jungle",
-  "junior",
-  "junk",
-  "just",
-  "kangaroo",
-  "keen",
-  "keep",
-  "ketchup",
-  "key",
-  "kick",
-  "kid",
-  "kidney",
-  "kind",
-  "kingdom",
-  "kiss",
-  "kit",
-  "kitchen",
-  "kite",
-  "kitten",
-  "kiwi",
-  "knee",
-  "knife",
-  "knock",
-  "know",
-  "lab",
-  "label",
-  "labor",
-  "ladder",
-  "lady",
-  "lake",
-  "lamp",
-  "language",
-  "laptop",
-  "large",
-  "later",
-  "latin",
-  "laugh",
-  "laundry",
-  "lava",
-  "law",
-  "lawn",
-  "lawsuit",
-  "layer",
-  "lazy",
-  "leader",
-  "leaf",
-  "learn",
-  "leave",
-  "lecture",
-  "left",
-  "leg",
-  "legal",
-  "legend",
-  "leisure",
-  "lemon",
-  "lend",
-  "length",
-  "lens",
-  "leopard",
-  "lesson",
-  "letter",
-  "level",
-  "liar",
-  "liberty",
-  "library",
-  "license",
-  "life",
-  "lift",
-  "light",
-  "like",
-  "limb",
-  "limit",
-  "link",
-  "lion",
-  "liquid",
-  "list",
-  "little",
-  "live",
-  "lizard",
-  "load",
-  "loan",
-  "lobster",
-  "local",
-  "lock",
-  "logic",
-  "lonely",
-  "long",
-  "loop",
-  "lottery",
-  "loud",
-  "lounge",
-  "love",
-  "loyal",
-  "lucky",
-  "luggage",
-  "lumber",
-  "lunar",
-  "lunch",
-  "luxury",
-  "lyrics",
-  "machine",
-  "mad",
-  "magic",
-  "magnet",
-  "maid",
-  "mail",
-  "main",
-  "major",
-  "make",
-  "mammal",
-  "man",
-  "manage",
-  "mandate",
-  "mango",
-  "mansion",
-  "manual",
-  "maple",
-  "marble",
-  "march",
-  "margin",
-  "marine",
-  "market",
-  "marriage",
-  "mask",
-  "mass",
-  "master",
-  "match",
-  "material",
-  "math",
-  "matrix",
-  "matter",
-  "maximum",
-  "maze",
-  "meadow",
-  "mean",
-  "measure",
-  "meat",
-  "mechanic",
-  "medal",
-  "media",
-  "melody",
-  "melt",
-  "member",
-  "memory",
-  "mention",
-  "menu",
-  "mercy",
-  "merge",
-  "merit",
-  "merry",
-  "mesh",
-  "message",
-  "metal",
-  "method",
-  "middle",
-  "midnight",
-  "milk",
-  "million",
-  "mimic",
-  "mind",
-  "minimum",
-  "minor",
-  "minute",
-  "miracle",
-  "mirror",
-  "misery",
-  "miss",
-  "mistake",
-  "mix",
-  "mixed",
-  "mixture",
-  "mobile",
-  "model",
-  "modify",
-  "mom",
-  "moment",
-  "monitor",
-  "monkey",
-  "monster",
-  "month",
-  "moon",
-  "moral",
-  "more",
-  "morning",
-  "mosquito",
-  "mother",
-  "motion",
-  "motor",
-  "mountain",
-  "mouse",
-  "move",
-  "movie",
-  "much",
-  "muffin",
-  "mule",
-  "multiply",
-  "muscle",
-  "museum",
-  "mushroom",
-  "music",
-  "must",
-  "mutual",
-  "myself",
-  "mystery",
-  "myth",
-  "naive",
-  "name",
-  "napkin",
-  "narrow",
-  "nasty",
-  "nation",
-  "nature",
-  "near",
-  "neck",
-  "need",
-  "negative",
-  "neglect",
-  "neither",
-  "nephew",
-  "nerve",
-  "nest",
-  "net",
-  "network",
-  "neutral",
-  "never",
-  "news",
-  "next",
-  "nice",
-  "night",
-  "noble",
-  "noise",
-  "nominee",
-  "noodle",
-  "normal",
-  "north",
-  "nose",
-  "notable",
-  "note",
-  "nothing",
-  "notice",
-  "novel",
-  "now",
-  "nuclear",
-  "number",
-  "nurse",
-  "nut",
-  "oak",
-  "obey",
-  "object",
-  "oblige",
-  "obscure",
-  "observe",
-  "obtain",
-  "obvious",
-  "occur",
-  "ocean",
-  "october",
-  "odor",
-  "off",
-  "offer",
-  "office",
-  "often",
-  "oil",
-  "okay",
-  "old",
-  "olive",
-  "olympic",
-  "omit",
-  "once",
-  "one",
-  "onion",
-  "online",
-  "only",
-  "open",
-  "opera",
-  "opinion",
-  "oppose",
-  "option",
-  "orange",
-  "orbit",
-  "orchard",
-  "order",
-  "ordinary",
-  "organ",
-  "orient",
-  "original",
-  "orphan",
-  "ostrich",
-  "other",
-  "outdoor",
-  "outer",
-  "output",
-  "outside",
-  "oval",
-  "oven",
-  "over",
-  "own",
-  "owner",
-  "oxygen",
-  "oyster",
-  "ozone",
-  "pact",
-  "paddle",
-  "page",
-  "pair",
-  "palace",
-  "palm",
-  "panda",
-  "panel",
-  "panic",
-  "panther",
-  "paper",
-  "parade",
-  "parent",
-  "park",
-  "parrot",
-  "party",
-  "pass",
-  "patch",
-  "path",
-  "patient",
-  "patrol",
-  "pattern",
-  "pause",
-  "pave",
-  "payment",
-  "peace",
-  "peanut",
-  "pear",
-  "peasant",
-  "pelican",
-  "pen",
-  "penalty",
-  "pencil",
-  "people",
-  "pepper",
-  "perfect",
-  "permit",
-  "person",
-  "pet",
-  "phone",
-  "photo",
-  "phrase",
-  "physical",
-  "piano",
-  "picnic",
-  "picture",
-  "piece",
-  "pig",
-  "pigeon",
-  "pill",
-  "pilot",
-  "pink",
-  "pioneer",
-  "pipe",
-  "pistol",
-  "pitch",
-  "pizza",
-  "place",
-  "planet",
-  "plastic",
-  "plate",
-  "play",
-  "please",
-  "pledge",
-  "pluck",
-  "plug",
-  "plunge",
-  "poem",
-  "poet",
-  "point",
-  "polar",
-  "pole",
-  "police",
-  "pond",
-  "pony",
-  "pool",
-  "popular",
-  "portion",
-  "position",
-  "possible",
-  "post",
-  "potato",
-  "pottery",
-  "poverty",
-  "powder",
-  "power",
-  "practice",
-  "praise",
-  "predict",
-  "prefer",
-  "prepare",
-  "present",
-  "pretty",
-  "prevent",
-  "price",
-  "pride",
-  "primary",
-  "print",
-  "priority",
-  "prison",
-  "private",
-  "prize",
-  "problem",
-  "process",
-  "produce",
-  "profit",
-  "program",
-  "project",
-  "promote",
-  "proof",
-  "property",
-  "prosper",
-  "protect",
-  "proud",
-  "provide",
-  "public",
-  "pudding",
-  "pull",
-  "pulp",
-  "pulse",
-  "pumpkin",
-  "punch",
-  "pupil",
-  "puppy",
-  "purchase",
-  "purity",
-  "purpose",
-  "purse",
-  "push",
-  "put",
-  "puzzle",
-  "pyramid",
-  "quality",
-  "quantum",
-  "quarter",
-  "question",
-  "quick",
-  "quit",
-  "quiz",
-  "quote",
-  "rabbit",
-  "raccoon",
-  "race",
-  "rack",
-  "radar",
-  "radio",
-  "rail",
-  "rain",
-  "raise",
-  "rally",
-  "ramp",
-  "ranch",
-  "random",
-  "range",
-  "rapid",
-  "rare",
-  "rate",
-  "rather",
-  "raven",
-  "raw",
-  "razor",
-  "ready",
-  "real",
-  "reason",
-  "rebel",
-  "rebuild",
-  "recall",
-  "receive",
-  "recipe",
-  "record",
-  "recycle",
-  "reduce",
-  "reflect",
-  "reform",
-  "refuse",
-  "region",
-  "regret",
-  "regular",
-  "reject",
-  "relax",
-  "release",
-  "relief",
-  "rely",
-  "remain",
-  "remember",
-  "remind",
-  "remove",
-  "render",
-  "renew",
-  "rent",
-  "reopen",
-  "repair",
-  "repeat",
-  "replace",
-  "report",
-  "require",
-  "rescue",
-  "resemble",
-  "resist",
-  "resource",
-  "response",
-  "result",
-  "retire",
-  "retreat",
-  "return",
-  "reunion",
-  "reveal",
-  "review",
-  "reward",
-  "rhythm",
-  "rib",
-  "ribbon",
-  "rice",
-  "rich",
-  "ride",
-  "ridge",
-  "rifle",
-  "right",
-  "rigid",
-  "ring",
-  "riot",
-  "ripple",
-  "risk",
-  "ritual",
-  "rival",
-  "river",
-  "road",
-  "roast",
-  "robot",
-  "robust",
-  "rocket",
-  "romance",
-  "roof",
-  "rookie",
-  "room",
-  "rose",
-  "rotate",
-  "rough",
-  "round",
-  "route",
-  "royal",
-  "rubber",
-  "rude",
-  "rug",
-  "rule",
-  "run",
-  "runway",
-  "rural",
-  "sad",
-  "saddle",
-  "sadness",
-  "safe",
-  "sail",
-  "salad",
-  "salmon",
-  "salon",
-  "salt",
-  "salute",
-  "same",
-  "sample",
-  "sand",
-  "satisfy",
-  "satoshi",
-  "sauce",
-  "sausage",
-  "save",
-  "say",
-  "scale",
-  "scan",
-  "scare",
-  "scatter",
-  "scene",
-  "scheme",
-  "school",
-  "science",
-  "scissors",
-  "scorpion",
-  "scout",
-  "scrap",
-  "screen",
-  "script",
-  "scrub",
-  "sea",
-  "search",
-  "season",
-  "seat",
-  "second",
-  "secret",
-  "section",
-  "security",
-  "seed",
-  "seek",
-  "segment",
-  "select",
-  "sell",
-  "seminar",
-  "senior",
-  "sense",
-  "sentence",
-  "series",
-  "service",
-  "session",
-  "settle",
-  "setup",
-  "seven",
-  "shadow",
-  "shaft",
-  "shallow",
-  "share",
-  "shed",
-  "shell",
-  "sheriff",
-  "shield",
-  "shift",
-  "shine",
-  "ship",
-  "shiver",
-  "shock",
-  "shoe",
-  "shoot",
-  "shop",
-  "short",
-  "shoulder",
-  "shove",
-  "shrimp",
-  "shrug",
-  "shuffle",
-  "shy",
-  "sibling",
-  "sick",
-  "side",
-  "siege",
-  "sight",
-  "sign",
-  "silent",
-  "silk",
-  "silly",
-  "silver",
-  "similar",
-  "simple",
-  "since",
-  "sing",
-  "siren",
-  "sister",
-  "situate",
-  "six",
-  "size",
-  "skate",
-  "sketch",
-  "ski",
-  "skill",
-  "skin",
-  "skirt",
-  "skull",
-  "slab",
-  "slam",
-  "sleep",
-  "slender",
-  "slice",
-  "slide",
-  "slight",
-  "slim",
-  "slogan",
-  "slot",
-  "slow",
-  "slush",
-  "small",
-  "smart",
-  "smile",
-  "smoke",
-  "smooth",
-  "snack",
-  "snake",
-  "snap",
-  "sniff",
-  "snow",
-  "soap",
-  "soccer",
-  "social",
-  "sock",
-  "soda",
-  "soft",
-  "solar",
-  "soldier",
-  "solid",
-  "solution",
-  "solve",
-  "someone",
-  "song",
-  "soon",
-  "sorry",
-  "sort",
-  "soul",
-  "sound",
-  "soup",
-  "source",
-  "south",
-  "space",
-  "spare",
-  "spatial",
-  "spawn",
-  "speak",
-  "special",
-  "speed",
-  "spell",
-  "spend",
-  "sphere",
-  "spice",
-  "spider",
-  "spike",
-  "spin",
-  "spirit",
-  "split",
-  "spoil",
-  "sponsor",
-  "spoon",
-  "sport",
-  "spot",
-  "spray",
-  "spread",
-  "spring",
-  "spy",
-  "square",
-  "squeeze",
-  "squirrel",
-  "stable",
-  "stadium",
-  "staff",
-  "stage",
-  "stairs",
-  "stamp",
-  "stand",
-  "start",
-  "state",
-  "stay",
-  "steak",
-  "steel",
-  "stem",
-  "step",
-  "stereo",
-  "stick",
-  "still",
-  "sting",
-  "stock",
-  "stomach",
-  "stone",
-  "stool",
-  "story",
-  "stove",
-  "strategy",
-  "street",
-  "strike",
-  "strong",
-  "struggle",
-  "student",
-  "stuff",
-  "stumble",
-  "style",
-  "subject",
-  "submit",
-  "subway",
-  "success",
-  "such",
-  "sudden",
-  "suffer",
-  "sugar",
-  "suggest",
-  "suit",
-  "summer",
-  "sun",
-  "sunny",
-  "sunset",
-  "super",
-  "supply",
-  "supreme",
-  "sure",
-  "surface",
-  "surge",
-  "surprise",
-  "surround",
-  "survey",
-  "suspect",
-  "sustain",
-  "swallow",
-  "swamp",
-  "swap",
-  "swarm",
-  "swear",
-  "sweet",
-  "swift",
-  "swim",
-  "swing",
-  "switch",
-  "sword",
-  "symbol",
-  "symptom",
-  "syrup",
-  "system",
-  "table",
-  "tackle",
-  "tag",
-  "tail",
-  "talent",
-  "talk",
-  "tank",
-  "tape",
-  "target",
-  "task",
-  "taste",
-  "tattoo",
-  "taxi",
-  "teach",
-  "team",
-  "tell",
-  "ten",
-  "tenant",
-  "tennis",
-  "tent",
-  "term",
-  "test",
-  "text",
-  "thank",
-  "that",
-  "theme",
-  "then",
-  "theory",
-  "there",
-  "they",
-  "thing",
-  "this",
-  "thought",
-  "three",
-  "thrive",
-  "throw",
-  "thumb",
-  "thunder",
-  "ticket",
-  "tide",
-  "tiger",
-  "tilt",
-  "timber",
-  "time",
-  "tiny",
-  "tip",
-  "tired",
-  "tissue",
-  "title",
-  "toast",
-  "tobacco",
-  "today",
-  "toddler",
-  "toe",
-  "together",
-  "toilet",
-  "token",
-  "tomato",
-  "tomorrow",
-  "tone",
-  "tongue",
-  "tonight",
-  "tool",
-  "tooth",
-  "top",
-  "topic",
-  "topple",
-  "torch",
-  "tornado",
-  "tortoise",
-  "toss",
-  "total",
-  "tourist",
-  "toward",
-  "tower",
-  "town",
-  "toy",
-  "track",
-  "trade",
-  "traffic",
-  "tragic",
-  "train",
-  "transfer",
-  "trap",
-  "trash",
-  "travel",
-  "tray",
-  "treat",
-  "tree",
-  "trend",
-  "trial",
-  "tribe",
-  "trick",
-  "trigger",
-  "trim",
-  "trip",
-  "trophy",
-  "trouble",
-  "truck",
-  "true",
-  "truly",
-  "trumpet",
-  "trust",
-  "truth",
-  "try",
-  "tube",
-  "tuition",
-  "tumble",
-  "tuna",
-  "tunnel",
-  "turkey",
-  "turn",
-  "turtle",
-  "twelve",
-  "twenty",
-  "twice",
-  "twin",
-  "twist",
-  "two",
-  "type",
-  "typical",
-  "ugly",
-  "umbrella",
-  "unable",
-  "unaware",
-  "uncle",
-  "uncover",
-  "under",
-  "undo",
-  "unfair",
-  "unfold",
-  "unhappy",
-  "uniform",
-  "unique",
-  "unit",
-  "universe",
-  "unknown",
-  "unlock",
-  "until",
-  "unusual",
-  "unveil",
-  "update",
-  "upgrade",
-  "uphold",
-  "upon",
-  "upper",
-  "upset",
-  "urban",
-  "urge",
-  "usage",
-  "use",
-  "used",
-  "useful",
-  "useless",
-  "usual",
-  "utility",
-  "vacant",
-  "vacuum",
-  "vague",
-  "valid",
-  "valley",
-  "valve",
-  "van",
-  "vanish",
-  "vapor",
-  "various",
-  "vast",
-  "vault",
-  "vehicle",
-  "velvet",
-  "vendor",
-  "venture",
-  "venue",
-  "verb",
-  "verify",
-  "version",
-  "very",
-  "vessel",
-  "veteran",
-  "viable",
-  "vibrant",
-  "vicious",
-  "victory",
-  "video",
-  "view",
-  "village",
-  "vintage",
-  "violin",
-  "virtual",
-  "virus",
-  "visa",
-  "visit",
-  "visual",
-  "vital",
-  "vivid",
-  "vocal",
-  "voice",
-  "void",
-  "volcano",
-  "volume",
-  "vote",
-  "voyage",
-  "wage",
-  "wagon",
-  "wait",
-  "walk",
-  "wall",
-  "walnut",
-  "want",
-  "warfare",
-  "warm",
-  "warrior",
-  "wash",
-  "wasp",
-  "waste",
-  "water",
-  "wave",
-  "way",
-  "wealth",
-  "weapon",
-  "wear",
-  "weasel",
-  "weather",
-  "web",
-  "wedding",
-  "weekend",
-  "weird",
-  "welcome",
-  "west",
-  "wet",
-  "whale",
-  "what",
-  "wheat",
-  "wheel",
-  "when",
-  "where",
-  "whip",
-  "whisper",
-  "wide",
-  "width",
-  "wife",
-  "wild",
-  "will",
-  "win",
-  "window",
-  "wine",
-  "wing",
-  "wink",
-  "winner",
-  "winter",
-  "wire",
-  "wisdom",
-  "wise",
-  "wish",
-  "witness",
-  "wolf",
-  "woman",
-  "wonder",
-  "wood",
-  "wool",
-  "word",
-  "work",
-  "world",
-  "worry",
-  "worth",
-  "wrap",
-  "wreck",
-  "wrestle",
-  "wrist",
-  "write",
-  "wrong",
-  "yard",
-  "year",
-  "yellow",
-  "you",
-  "young",
-  "youth",
-  "zebra",
-  "zero",
-  "zone",
-  "zoo",
-];