@ai-matrx/vault 0.1.13 → 0.1.15

package/dist/index.js

@@ -871,9 +871,11 @@ function inView(item, view) {
   if (view.startsWith("tag:")) return item.tags.includes(view.slice(4));
   return true;
 }
+var AUTHENTICATOR_WORDS = ["authenticator", "2fa", "two-factor", "two factor", "totp", "one-time password", "verification code", "2-step"];
 function matchesQuery(item, query) {
   const q = query.trim().toLowerCase();
   if (!q) return true;
+  if (item.authenticator && AUTHENTICATOR_WORDS.some((w) => w === q || q.length >= 3 && w.startsWith(q))) return true;
   return [item.name, item.definitionLabel, ...item.tags, ...item.loginUrls, ...item.custom.map((c) => `${c.label} ${c.value}`)].some((h) => h.toLowerCase().includes(q));
 }
 var HIDDEN_ITEM_TAG = "matrx:hidden";
@@ -1499,9 +1501,23 @@ function HistoryRow({ item, port, page, entry, label, onRestored, onConflict, on
 // src/authenticator/AuthenticatorView.tsx
 import { useEffect as useEffect11, useState as useState13 } from "react";
 import { Button as Button9 } from "@ai-matrx/design-system/controls";
-import { cn as cn6, DropdownMenu as DropdownMenu2, DropdownMenuContent as DropdownMenuContent2, DropdownMenuItem as DropdownMenuItem2, DropdownMenuSeparator as DropdownMenuSeparator2, DropdownMenuTrigger as DropdownMenuTrigger2, TextInputDialog } from "@ai-matrx/design-system";
+import { cn as cn7, DropdownMenu as DropdownMenu2, DropdownMenuContent as DropdownMenuContent2, DropdownMenuItem as DropdownMenuItem2, DropdownMenuSeparator as DropdownMenuSeparator2, DropdownMenuTrigger as DropdownMenuTrigger2, TextInputDialog } from "@ai-matrx/design-system";
 import { CopyIcon as CopyIcon4 } from "@ai-matrx/design-system/icons";
 
+// src/ItemIcon.tsx
+import { cn as cn5 } from "@ai-matrx/design-system";
+import { jsx as jsx8 } from "react/jsx-runtime";
+function ItemIcon({ definitionKey, family, site, size = "md", inverted = false }) {
+  const box = size === "lg" ? "size-10 rounded-xl text-base" : size === "md" ? "size-8 rounded-lg text-sm" : "size-6 rounded-md text-xs";
+  const tone = inverted ? "bg-primary-foreground text-primary" : "bg-muted text-foreground";
+  const initial = siteDomainOf(site).charAt(0).toUpperCase();
+  if (initial && /[A-Z0-9]/.test(initial)) {
+    return /* @__PURE__ */ jsx8("span", { "aria-hidden": true, className: cn5("flex shrink-0 items-center justify-center font-semibold", box, tone), children: initial });
+  }
+  const Glyph = definitionGlyph(definitionKey, family);
+  return /* @__PURE__ */ jsx8("span", { "aria-hidden": true, className: cn5("flex shrink-0 items-center justify-center", box, tone), children: /* @__PURE__ */ jsx8(Glyph, { className: size === "lg" ? "size-5" : "size-4" }) });
+}
+
 // src/authenticator/AddOtpPanel.tsx
 import { useState as useState12 } from "react";
 import { Button as Button8, Field as Field4, Select as Select2 } from "@ai-matrx/design-system/controls";
@@ -1509,7 +1525,7 @@ import { Button as Button8, Field as Field4, Select as Select2 } from "@ai-matrx
 // src/authenticator/CodeParts.tsx
 import { useEffect as useEffect8, useRef as useRef6, useState as useState8 } from "react";
 import { Button as Button5 } from "@ai-matrx/design-system/controls";
-import { cn as cn5 } from "@ai-matrx/design-system";
+import { cn as cn6 } from "@ai-matrx/design-system";
 import { CopyIcon as CopyIcon3 } from "@ai-matrx/design-system/icons";
 import { groupCode as groupCode2 } from "@ai-matrx/kit/format";
 
@@ -1612,16 +1628,16 @@ function matchIssuerToSite(issuer, candidates, siteOf) {
 }
 
 // src/authenticator/CodeParts.tsx
-import { jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
 function CountdownRing({ remaining, period, loading = false, className }) {
   const r = 9.5;
   const c = 2 * Math.PI * r;
   const p = loading ? 0 : Math.max(0, Math.min(1, remaining / period));
   const urgent = !loading && remaining <= 5;
-  return /* @__PURE__ */ jsxs8("span", { className: cn5("relative inline-flex size-6 shrink-0 items-center justify-center", className), role: "img", "aria-label": loading ? "Getting code" : `${remaining} seconds left`, children: [
+  return /* @__PURE__ */ jsxs8("span", { className: cn6("relative inline-flex size-6 shrink-0 items-center justify-center", className), role: "img", "aria-label": loading ? "Getting code" : `${remaining} seconds left`, children: [
     /* @__PURE__ */ jsxs8("svg", { viewBox: "0 0 24 24", className: "absolute inset-0 size-full -rotate-90", "aria-hidden": true, children: [
-      /* @__PURE__ */ jsx8("circle", { cx: "12", cy: "12", r, fill: "none", stroke: "currentColor", strokeWidth: 2.5, className: "text-muted" }),
-      /* @__PURE__ */ jsx8(
+      /* @__PURE__ */ jsx9("circle", { cx: "12", cy: "12", r, fill: "none", stroke: "currentColor", strokeWidth: 2.5, className: "text-muted" }),
+      /* @__PURE__ */ jsx9(
         "circle",
         {
           cx: "12",
@@ -1638,7 +1654,7 @@ function CountdownRing({ remaining, period, loading = false, className }) {
         }
       )
     ] }),
-    /* @__PURE__ */ jsx8("span", { className: cn5("text-[10px] font-semibold leading-none tabular-nums", urgent ? "text-destructive" : "text-muted-foreground"), children: loading ? "" : remaining })
+    /* @__PURE__ */ jsx9("span", { className: cn6("text-[10px] font-semibold leading-none tabular-nums", urgent ? "text-destructive" : "text-muted-foreground"), children: loading ? "" : remaining })
   ] });
 }
 function useCopied() {
@@ -1668,17 +1684,17 @@ function CodeButton({ live, digits, size = "md", label }) {
       onClick: () => live.code && void copy(live.code),
       "aria-label": live.code ? `Copy ${label} code` : `Getting ${label} code`,
       title: live.code ? "Copy" : void 0,
-      className: cn5("group -mx-1.5 inline-flex max-w-full items-center gap-2.5 rounded-md px-1.5 py-1 text-left transition-colors hover:bg-accent focus-visible:bg-accent focus-visible:outline-none", size === "lg" && "gap-3"),
+      className: cn6("group -mx-1.5 inline-flex max-w-full items-center gap-2.5 rounded-md px-1.5 py-1 text-left transition-colors hover:bg-accent focus-visible:bg-accent focus-visible:outline-none", size === "lg" && "gap-3"),
       children: [
-        /* @__PURE__ */ jsx8("span", { className: cn5("whitespace-nowrap font-mono font-medium tabular-nums tracking-[0.08em]", size === "lg" ? "text-2xl" : "text-[1.0625rem]", live.code ? "text-foreground" : "text-disabled-foreground"), children: shown }),
-        copied ? /* @__PURE__ */ jsx8("span", { className: "inline-flex size-6 items-center justify-center text-success", role: "status", "aria-label": "Copied", children: /* @__PURE__ */ jsx8(CheckGlyph, { className: "size-4" }) }) : /* @__PURE__ */ jsx8(CountdownRing, { remaining: live.remaining, period: live.period, loading: !live.code })
+        /* @__PURE__ */ jsx9("span", { className: cn6("whitespace-nowrap font-mono font-medium tabular-nums tracking-[0.08em]", size === "lg" ? "text-2xl" : "text-[1.0625rem]", live.code ? "text-foreground" : "text-disabled-foreground"), children: shown }),
+        copied ? /* @__PURE__ */ jsx9("span", { className: "inline-flex size-6 items-center justify-center text-success", role: "status", "aria-label": "Copied", children: /* @__PURE__ */ jsx9(CheckGlyph, { className: "size-4" }) }) : /* @__PURE__ */ jsx9(CountdownRing, { remaining: live.remaining, period: live.period, loading: !live.code })
       ]
     }
   );
 }
 function CopyCodeButton({ live, label }) {
   const { copied, copy } = useCopied();
-  return /* @__PURE__ */ jsx8(Button5, { variant: "quiet", icon: copied ? /* @__PURE__ */ jsx8(CheckGlyph, {}) : /* @__PURE__ */ jsx8(CopyIcon3, {}), ...copied ? { glyphTone: "success" } : {}, "aria-label": `Copy ${label} code`, disabled: !live.code, onClick: () => live.code && void copy(live.code) });
+  return /* @__PURE__ */ jsx9(Button5, { variant: "quiet", icon: copied ? /* @__PURE__ */ jsx9(CheckGlyph, {}) : /* @__PURE__ */ jsx9(CopyIcon3, {}), ...copied ? { glyphTone: "success" } : {}, "aria-label": `Copy ${label} code`, disabled: !live.code, onClick: () => live.code && void copy(live.code) });
 }
 
 // src/authenticator/live-code.ts
@@ -1770,42 +1786,23 @@ import { useEffect as useEffect10, useRef as useRef8, useState as useState10 } f
 import { Button as Button6, Field as Field3 } from "@ai-matrx/design-system/controls";
 
 // src/authenticator/qr.ts
-function detectorCtor() {
-  const c = globalThis.BarcodeDetector;
-  return typeof c === "function" ? c : null;
-}
-var support = null;
+import { decodeQrFromElement, decodeQrFromImageFile } from "@ai-matrx/capture/qr";
 function canDecodeQrLocally() {
-  if (!support) {
-    const C = detectorCtor();
-    support = !C ? Promise.resolve(false) : C.getSupportedFormats ? C.getSupportedFormats().then((f) => f.includes("qr_code"), () => false) : Promise.resolve(true);
+  if (typeof document === "undefined") return Promise.resolve(false);
+  try {
+    return Promise.resolve(Boolean(document.createElement("canvas").getContext("2d")));
+  } catch {
+    return Promise.resolve(false);
   }
-  return support;
 }
 function hasCamera() {
   return typeof navigator !== "undefined" && typeof navigator.mediaDevices?.getUserMedia === "function";
 }
-var detector = null;
-function qrDetector() {
-  const C = detectorCtor();
-  if (!C) return null;
-  detector ??= new C({ formats: ["qr_code"] });
-  return detector;
-}
 async function decodeQr(source) {
-  const d = qrDetector();
-  if (!d) return null;
-  const found = await d.detect(source);
-  return found.find((b) => b.rawValue)?.rawValue ?? null;
+  return decodeQrFromElement(source);
 }
 async function decodeQrFile(file) {
-  if (!await canDecodeQrLocally()) return null;
-  const bitmap = await createImageBitmap(file);
-  try {
-    return await decodeQr(bitmap);
-  } finally {
-    bitmap.close();
-  }
+  return decodeQrFromImageFile(file);
 }
 function imageFrom(data) {
   if (!data) return null;
@@ -1820,7 +1817,7 @@ function imageFrom(data) {
 }
 
 // src/authenticator/Setup.tsx
-import { Fragment as Fragment5, jsx as jsx9, jsxs as jsxs9 } from "react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx10, jsxs as jsxs9 } from "react/jsx-runtime";
 function useCanScan() {
   const [ok, setOk] = useState10(false);
   useEffect10(() => {
@@ -1886,15 +1883,15 @@ function QrScanPanel({ open, onResult, onClose }) {
       stop();
     };
   }, [open]);
-  return /* @__PURE__ */ jsxs9(Panel, { title: "Scan QR code", open, onClose, size: "sm", footer: /* @__PURE__ */ jsx9(Button6, { variant: "quiet", onClick: onClose, children: "Cancel" }), children: [
+  return /* @__PURE__ */ jsxs9(Panel, { title: "Scan QR code", open, onClose, size: "sm", footer: /* @__PURE__ */ jsx10(Button6, { variant: "quiet", onClick: onClose, children: "Cancel" }), children: [
     /* @__PURE__ */ jsxs9("div", { className: "relative mx-auto aspect-square w-full max-w-sm overflow-hidden rounded-xl bg-muted", children: [
-      /* @__PURE__ */ jsx9("video", { ref: video, className: "size-full object-cover", playsInline: true, muted: true, "aria-label": "Camera" }),
-      error ? /* @__PURE__ */ jsx9("div", { className: "absolute inset-0 flex items-center justify-center p-6 text-center text-sm text-destructive", children: error }) : /* @__PURE__ */ jsx9("div", { className: "pointer-events-none absolute inset-[18%] rounded-lg border-2 border-primary", "aria-hidden": true })
+      /* @__PURE__ */ jsx10("video", { ref: video, className: "size-full object-cover", playsInline: true, muted: true, "aria-label": "Camera" }),
+      error ? /* @__PURE__ */ jsx10("div", { className: "absolute inset-0 flex items-center justify-center p-6 text-center text-sm text-destructive", children: error }) : /* @__PURE__ */ jsx10("div", { className: "pointer-events-none absolute inset-[18%] rounded-lg border-2 border-primary", "aria-hidden": true })
     ] }),
-    /* @__PURE__ */ jsx9("p", { className: "text-center text-xs text-muted-foreground", children: "Point at the site's QR code" })
+    /* @__PURE__ */ jsx10("p", { className: "text-center text-xs text-muted-foreground", children: "Point at the site's QR code" })
   ] });
 }
-function OtpSetupRow({ value, onChange, label = "One-time password", placeholder = "Setup key or otpauth link", disabled = false, autoFocus = false, onImage, onRecognized, status }) {
+function OtpSetupRow({ value, onChange, label = "Authenticator", placeholder = "Paste setup key or otpauth link", disabled = false, autoFocus = false, onImage, onRecognized, status }) {
   const file = useRef8(null);
   const canScan = useCanScan();
   const [scanning, setScanning] = useState10(false);
@@ -1927,9 +1924,9 @@ function OtpSetupRow({ value, onChange, label = "One-time password", placeholder
       setReading(false);
     }
   };
-  const end = status ? /* @__PURE__ */ jsx9("span", { className: "max-w-48 truncate text-xs text-muted-foreground", children: status }) : reading ? /* @__PURE__ */ jsx9("span", { className: "text-xs text-muted-foreground", children: "Reading\u2026" }) : imageError || error ? /* @__PURE__ */ jsx9("span", { className: "max-w-56 truncate text-xs text-destructive", title: imageError ?? error ?? void 0, role: "alert", children: imageError ?? error }) : parsed ? /* @__PURE__ */ jsxs9("span", { className: "flex max-w-56 items-center gap-1 text-xs text-success", children: [
-    /* @__PURE__ */ jsx9(CheckGlyph, { className: "size-3.5 shrink-0" }),
-    /* @__PURE__ */ jsx9("span", { className: "truncate", children: describeEnrollment(parsed) })
+  const end = status ? /* @__PURE__ */ jsx10("span", { className: "max-w-48 truncate text-xs text-muted-foreground", children: status }) : reading ? /* @__PURE__ */ jsx10("span", { className: "text-xs text-muted-foreground", children: "Reading\u2026" }) : imageError || error ? /* @__PURE__ */ jsx10("span", { className: "max-w-56 truncate text-xs text-destructive", title: imageError ?? error ?? void 0, role: "alert", children: imageError ?? error }) : parsed ? /* @__PURE__ */ jsxs9("span", { className: "flex max-w-56 items-center gap-1 text-xs text-success", children: [
+    /* @__PURE__ */ jsx10(CheckGlyph, { className: "size-3.5 shrink-0" }),
+    /* @__PURE__ */ jsx10("span", { className: "truncate", children: describeEnrollment(parsed) })
   ] }) : null;
   return /* @__PURE__ */ jsxs9(
     "div",
@@ -1954,11 +1951,11 @@ function OtpSetupRow({ value, onChange, label = "One-time password", placeholder
           {
             label,
             actions: /* @__PURE__ */ jsxs9(Fragment5, { children: [
-              /* @__PURE__ */ jsx9(Button6, { variant: "quiet", icon: /* @__PURE__ */ jsx9(QrGlyph, {}), "aria-label": "Choose QR image", title: "Choose or drop a QR image", disabled: disabled || reading, onClick: () => file.current?.click() }),
-              canScan ? /* @__PURE__ */ jsx9(Button6, { variant: "quiet", icon: /* @__PURE__ */ jsx9(CameraGlyph, {}), "aria-label": "Scan with camera", title: "Scan with camera", disabled, onClick: () => setScanning(true) }) : null
+              /* @__PURE__ */ jsx10(Button6, { variant: "quiet", icon: /* @__PURE__ */ jsx10(QrGlyph, {}), "aria-label": "Choose QR image", title: "Choose or drop a QR image", disabled: disabled || reading, onClick: () => file.current?.click() }),
+              canScan ? /* @__PURE__ */ jsx10(Button6, { variant: "quiet", icon: /* @__PURE__ */ jsx10(CameraGlyph, {}), "aria-label": "Scan QR code with camera", title: "Scan the site's QR code with the camera", disabled, onClick: () => setScanning(true), children: "Scan" }) : null
             ] }),
             children: [
-              /* @__PURE__ */ jsx9(
+              /* @__PURE__ */ jsx10(
                 Field3,
                 {
                   className: "w-full",
@@ -1981,7 +1978,7 @@ function OtpSetupRow({ value, onChange, label = "One-time password", placeholder
                   end
                 }
               ),
-              /* @__PURE__ */ jsx9(
+              /* @__PURE__ */ jsx10(
                 "input",
                 {
                   ref: file,
@@ -1998,7 +1995,7 @@ function OtpSetupRow({ value, onChange, label = "One-time password", placeholder
             ]
           }
         ),
-        canScan ? /* @__PURE__ */ jsx9(
+        canScan ? /* @__PURE__ */ jsx10(
           QrScanPanel,
           {
             open: scanning,
@@ -2029,7 +2026,7 @@ function mfaMethodOf(item) {
 }
 
 // src/authenticator/TotpRows.tsx
-import { Fragment as Fragment6, jsx as jsx10, jsxs as jsxs10 } from "react/jsx-runtime";
+import { Fragment as Fragment6, jsx as jsx11, jsxs as jsxs10 } from "react/jsx-runtime";
 function otpActionError(e, what) {
   const status = e?.status;
   if (status === 404) return "There is no one-time password here.";
@@ -2067,7 +2064,7 @@ function useOtpActions(port, item, onChanged) {
     }),
     remove: async () => {
       const ok = await confirm2({
-        title: `Remove the one-time password for ${item.name}?`,
+        title: `Remove the authenticator for ${item.name}?`,
         description: "Codes stop here. Two-factor stays on at the site, and your phone app and backup codes still work.",
         confirmLabel: "Remove",
         variant: "destructive"
@@ -2087,37 +2084,37 @@ function TotpRow({ port, item, onChanged }) {
   const canManage = item.capabilities.canManage || item.capabilities.canEdit;
   if (a.removed || !item.authenticator) return null;
   const menu = canManage ? /* @__PURE__ */ jsxs10(DropdownMenu, { children: [
-    /* @__PURE__ */ jsx10(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx10(Button7, { variant: "quiet", icon: /* @__PURE__ */ jsx10(MoreGlyph, {}), "aria-label": "One-time password options", disabled: a.busy }) }),
+    /* @__PURE__ */ jsx11(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx11(Button7, { variant: "quiet", icon: /* @__PURE__ */ jsx11(MoreGlyph, {}), "aria-label": "Authenticator options", disabled: a.busy }) }),
     /* @__PURE__ */ jsxs10(DropdownMenuContent, { align: "end", className: "min-w-44", children: [
       /* @__PURE__ */ jsxs10(DropdownMenuItem, { onSelect: () => void a.setEnabled(!a.enabled), children: [
-        /* @__PURE__ */ jsx10(PowerGlyph, { className: "size-4" }),
+        /* @__PURE__ */ jsx11(PowerGlyph, { className: "size-4" }),
         a.enabled ? "Turn off" : "Turn on"
       ] }),
-      /* @__PURE__ */ jsx10(DropdownMenuSeparator, {}),
+      /* @__PURE__ */ jsx11(DropdownMenuSeparator, {}),
       /* @__PURE__ */ jsxs10(DropdownMenuItem, { className: "text-destructive focus:text-destructive", onSelect: () => void a.remove(), children: [
-        /* @__PURE__ */ jsx10(TrashGlyph, { className: "size-4" }),
+        /* @__PURE__ */ jsx11(TrashGlyph, { className: "size-4" }),
         "Remove"
       ] })
     ] })
   ] }) : null;
-  return /* @__PURE__ */ jsx10(
+  return /* @__PURE__ */ jsx11(
     VaultRow,
     {
-      label: "One-time password",
+      label: "Authenticator",
       actions: /* @__PURE__ */ jsxs10(Fragment6, { children: [
-        a.enabled ? /* @__PURE__ */ jsx10(CopyCodeButton, { live, label: item.name }) : null,
+        a.enabled ? /* @__PURE__ */ jsx11(CopyCodeButton, { live, label: item.name }) : null,
         menu
       ] }),
       children: a.error ? /* @__PURE__ */ jsxs10("span", { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ jsx10("span", { className: "truncate text-sm text-destructive", role: "alert", children: a.error }),
-        /* @__PURE__ */ jsx10(Button7, { variant: "quiet", onClick: a.clearError, children: "Dismiss" })
+        /* @__PURE__ */ jsx11("span", { className: "truncate text-sm text-destructive", role: "alert", children: a.error }),
+        /* @__PURE__ */ jsx11(Button7, { variant: "quiet", onClick: a.clearError, children: "Dismiss" })
       ] }) : !a.enabled ? /* @__PURE__ */ jsxs10("span", { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ jsx10("span", { className: "text-sm text-disabled-foreground", children: "Off" }),
-        canManage ? /* @__PURE__ */ jsx10(Button7, { variant: "quiet", icon: /* @__PURE__ */ jsx10(PowerGlyph, {}), disabled: a.busy, onClick: () => void a.setEnabled(true), children: "Turn on" }) : null
+        /* @__PURE__ */ jsx11("span", { className: "text-sm text-disabled-foreground", children: "Off" }),
+        canManage ? /* @__PURE__ */ jsx11(Button7, { variant: "quiet", icon: /* @__PURE__ */ jsx11(PowerGlyph, {}), disabled: a.busy, onClick: () => void a.setEnabled(true), children: "Turn on" }) : null
       ] }) : live.error ? /* @__PURE__ */ jsxs10("span", { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ jsx10("span", { className: "truncate text-sm text-destructive", title: live.error, children: live.error }),
-        /* @__PURE__ */ jsx10(Button7, { variant: "quiet", onClick: live.retry, children: "Retry" })
-      ] }) : /* @__PURE__ */ jsx10(CodeButton, { live, digits: item.authenticator.digits, label: item.name })
+        /* @__PURE__ */ jsx11("span", { className: "truncate text-sm text-destructive", title: live.error, children: live.error }),
+        /* @__PURE__ */ jsx11(Button7, { variant: "quiet", onClick: live.retry, children: "Retry" })
+      ] }) : /* @__PURE__ */ jsx11(CodeButton, { live, digits: item.authenticator.digits, label: item.name })
     }
   );
 }
@@ -2135,7 +2132,7 @@ function TotpEditRow({ value, onChange, hasExisting, item, port, onEnrolled, onR
       setStatus(wasCancelled(e) ? null : otpActionError(e, "read that image"));
     }
   } : void 0;
-  return /* @__PURE__ */ jsx10(
+  return /* @__PURE__ */ jsx11(
     OtpSetupRow,
     {
       value,
@@ -2160,7 +2157,7 @@ function TwoFactorMethodRow({ port, item, onChanged }) {
   const [busy, setBusy] = useState11(false);
   const [error, setError] = useState11(null);
   const canEdit = item.capabilities.canEdit || item.capabilities.canManage;
-  return /* @__PURE__ */ jsx10(VaultRow, { label: "Two-factor", hint: error ? /* @__PURE__ */ jsx10("span", { className: "text-destructive", children: error }) : void 0, children: /* @__PURE__ */ jsx10(
+  return /* @__PURE__ */ jsx11(VaultRow, { label: "Two-factor", hint: error ? /* @__PURE__ */ jsx11("span", { className: "text-destructive", children: error }) : void 0, children: /* @__PURE__ */ jsx11(
     Select,
     {
       value: value ?? "none",
@@ -2187,7 +2184,7 @@ function TwoFactorMethodRow({ port, item, onChanged }) {
 }
 
 // src/authenticator/AddOtpPanel.tsx
-import { Fragment as Fragment7, jsx as jsx11, jsxs as jsxs11 } from "react/jsx-runtime";
+import { Fragment as Fragment7, jsx as jsx12, jsxs as jsxs11 } from "react/jsx-runtime";
 var NEW = "__new__";
 var LOGIN_KEYS = ["website_login", "username_password"];
 function normalizeWebsite(raw) {
@@ -2263,23 +2260,23 @@ function AddOtpPanel({ port, items, definitions, itemId = null, onClose, onChang
       setBusy(false);
     }
   };
-  if (saved) return /* @__PURE__ */ jsx11(AddedPanel, { port, item: saved, onClose, onDone: () => onDone(saved.id) });
+  if (saved) return /* @__PURE__ */ jsx12(AddedPanel, { port, item: saved, onClose, onDone: () => onDone(saved.id) });
   return /* @__PURE__ */ jsxs11(
     Panel,
     {
-      title: "Add one-time password",
+      title: "Add authenticator",
       size: "md",
       onClose,
       footer: /* @__PURE__ */ jsxs11(Fragment7, { children: [
-        /* @__PURE__ */ jsx11(Button8, { variant: "quiet", onClick: onClose, disabled: busy, children: "Cancel" }),
-        /* @__PURE__ */ jsx11(Button8, { variant: "primary", disabled: !ready, onClick: () => void save(), children: busy ? "Adding\u2026" : "Add" })
+        /* @__PURE__ */ jsx12(Button8, { variant: "quiet", onClick: onClose, disabled: busy, children: "Cancel" }),
+        /* @__PURE__ */ jsx12(Button8, { variant: "primary", disabled: !ready, onClick: () => void save(), children: busy ? "Adding\u2026" : "Add" })
       ] }),
       children: [
         /* @__PURE__ */ jsxs11(VaultSection, { children: [
-          /* @__PURE__ */ jsx11(
+          /* @__PURE__ */ jsx12(
             OtpSetupRow,
             {
-              label: "Setup code",
+              label: "Setup key",
               value: input,
               autoFocus: true,
               disabled: busy,
@@ -2297,7 +2294,7 @@ function AddOtpPanel({ port, items, definitions, itemId = null, onClose, onChang
               status: image ? `QR image ready \xB7 ${image.name}` : null
             }
           ),
-          /* @__PURE__ */ jsx11(VaultRow, { label: "Add to", children: /* @__PURE__ */ jsx11(
+          itemId ? null : /* @__PURE__ */ jsx12(VaultRow, { label: "Add to", children: /* @__PURE__ */ jsx12(
             Select2,
             {
               value: target,
@@ -2311,7 +2308,7 @@ function AddOtpPanel({ port, items, definitions, itemId = null, onClose, onChang
             }
           ) }),
           isNew ? /* @__PURE__ */ jsxs11(Fragment7, { children: [
-            /* @__PURE__ */ jsx11(VaultRow, { label: "Name", children: /* @__PURE__ */ jsx11(
+            /* @__PURE__ */ jsx12(VaultRow, { label: "Name", children: /* @__PURE__ */ jsx12(
               Field4,
               {
                 className: "w-full",
@@ -2325,24 +2322,27 @@ function AddOtpPanel({ port, items, definitions, itemId = null, onClose, onChang
                 "aria-label": "Name"
               }
             ) }),
-            /* @__PURE__ */ jsx11(VaultRow, { label: "Website", hint: websiteBad ? /* @__PURE__ */ jsx11("span", { className: "text-destructive", children: "Not a web address" }) : void 0, children: /* @__PURE__ */ jsx11(Field4, { className: "w-full", type: "url", value: website, disabled: busy || created !== null, onChange: (e) => setWebsite(e.target.value), placeholder: "example.com", "aria-label": "Website", "aria-invalid": websiteBad || void 0 }) })
+            /* @__PURE__ */ jsx12(VaultRow, { label: "Website", hint: websiteBad ? /* @__PURE__ */ jsx12("span", { className: "text-destructive", children: "Not a web address" }) : void 0, children: /* @__PURE__ */ jsx12(Field4, { className: "w-full", type: "url", value: website, disabled: busy || created !== null, onChange: (e) => setWebsite(e.target.value), placeholder: "example.com", "aria-label": "Website", "aria-invalid": websiteBad || void 0 }) })
           ] }) : null
         ] }),
-        error ? /* @__PURE__ */ jsx11("p", { className: "px-1 text-sm text-destructive", role: "alert", children: error }) : null
+        error ? /* @__PURE__ */ jsx12("p", { className: "px-1 text-sm text-destructive", role: "alert", children: error }) : null
       ]
     }
   );
 }
+function FirstCodePanel(props) {
+  return /* @__PURE__ */ jsx12(AddedPanel, { ...props });
+}
 function AddedPanel({ port, item, onClose, onDone }) {
   const live = useLiveCode(port, item, true);
-  return /* @__PURE__ */ jsx11(Panel, { title: item.name, size: "sm", onClose, footer: /* @__PURE__ */ jsx11(Button8, { variant: "primary", onClick: onDone, children: "Done" }), children: /* @__PURE__ */ jsxs11("div", { className: "flex flex-col items-center gap-2 py-4", children: [
-    live.error ? /* @__PURE__ */ jsx11("span", { className: "text-sm text-destructive", children: live.error }) : /* @__PURE__ */ jsx11(CodeButton, { live, digits: item.authenticator?.digits ?? 6, size: "lg", label: item.name }),
-    /* @__PURE__ */ jsx11("p", { className: "text-xs text-muted-foreground", children: "Enter this code on the site to finish." })
+  return /* @__PURE__ */ jsx12(Panel, { title: item.name, size: "sm", onClose, footer: /* @__PURE__ */ jsx12(Button8, { variant: "primary", onClick: onDone, children: "Done" }), children: /* @__PURE__ */ jsxs11("div", { className: "flex flex-col items-center gap-2 py-4", children: [
+    live.error ? /* @__PURE__ */ jsx12("span", { className: "text-sm text-destructive", children: live.error }) : /* @__PURE__ */ jsx12(CodeButton, { live, digits: item.authenticator?.digits ?? 6, size: "lg", label: item.name }),
+    /* @__PURE__ */ jsx12("p", { className: "text-xs text-muted-foreground", children: "Enter this code on the site to finish." })
   ] }) });
 }
 
 // src/authenticator/AuthenticatorView.tsx
-import { Fragment as Fragment8, jsx as jsx12, jsxs as jsxs12 } from "react/jsx-runtime";
+import { Fragment as Fragment8, jsx as jsx13, jsxs as jsxs12 } from "react/jsx-runtime";
 function matchesEntry(entry, q) {
   if (!entry || !q) return false;
   return [entry.issuer, entry.account].some((v) => v?.toLowerCase().includes(q));
@@ -2360,7 +2360,7 @@ function otpGroups(items, entries, query, hidden = /* @__PURE__ */ new Set()) {
   const rank = (k) => k === "me" ? 0 : k === "shared" ? 2 : 1;
   return [...groups.entries()].sort(([a, x], [b, y]) => rank(a) - rank(b) || x.label.localeCompare(y.label)).map(([key, g]) => ({ key, ...g }));
 }
-function AuthenticatorView({ port, items, definitions, query, onOpen, onChanged, header }) {
+function AuthenticatorView({ port, host, items, definitions, query, onOpen, onChanged, header }) {
   const [entries, setEntries] = useState13(/* @__PURE__ */ new Map());
   const [hidden, setHidden] = useState13(/* @__PURE__ */ new Set());
   const [adding, setAdding] = useState13(false);
@@ -2380,20 +2380,20 @@ function AuthenticatorView({ port, items, definitions, query, onOpen, onChanged,
   const groups = otpGroups(items, entries, query, hidden);
   const total = items.filter((i) => i.authenticator && !i.deletion && !hidden.has(i.id)).length;
   const familyOf2 = (key) => definitions.find((d) => d.key === key)?.family ?? "generic";
-  return /* @__PURE__ */ jsxs12("section", { "aria-label": "One-time passwords", className: "flex h-full min-h-0 flex-col bg-background", children: [
-    header ? /* @__PURE__ */ jsx12("div", { className: "mx-auto w-full max-w-3xl px-3 pt-3 sm:px-4", children: header }) : null,
+  return /* @__PURE__ */ jsxs12("section", { "aria-label": "Authenticator", className: "flex h-full min-h-0 flex-col bg-background", children: [
+    header ? /* @__PURE__ */ jsx13("div", { className: "mx-auto w-full max-w-3xl px-3 pt-3 sm:px-4", children: header }) : null,
     /* @__PURE__ */ jsxs12("div", { className: "flex min-h-12 items-center justify-between gap-2 px-4 pb-1 pt-3", children: [
       /* @__PURE__ */ jsxs12("div", { className: "flex min-w-0 items-baseline gap-2", children: [
-        /* @__PURE__ */ jsx12("h2", { className: "truncate text-sm font-semibold text-foreground", children: "One-time passwords" }),
-        total > 0 ? /* @__PURE__ */ jsx12("span", { className: "text-xs tabular-nums text-muted-foreground", children: total }) : null
+        /* @__PURE__ */ jsx13("h2", { className: "truncate text-sm font-semibold text-foreground", children: "Authenticator" }),
+        total > 0 ? /* @__PURE__ */ jsx13("span", { className: "text-xs tabular-nums text-muted-foreground", children: total }) : null
       ] }),
-      total > 0 ? /* @__PURE__ */ jsx12(Button9, { variant: "outline", icon: /* @__PURE__ */ jsx12(PlusGlyph, {}), onClick: () => setAdding(true), children: "Add" }) : null
+      total > 0 ? /* @__PURE__ */ jsx13(Button9, { variant: "outline", icon: /* @__PURE__ */ jsx13(PlusGlyph, {}), onClick: () => setAdding(true), children: "Add" }) : null
     ] }),
     total === 0 ? /* @__PURE__ */ jsxs12("div", { className: "flex flex-1 flex-col items-center justify-center gap-3 px-6 pb-12 text-center", children: [
-      /* @__PURE__ */ jsx12("span", { className: "flex size-12 items-center justify-center rounded-full bg-muted text-muted-foreground", children: /* @__PURE__ */ jsx12(ShieldGlyph, { className: "size-6" }) }),
-      /* @__PURE__ */ jsx12("p", { className: "text-sm font-medium text-foreground", children: "No one-time passwords yet" }),
-      /* @__PURE__ */ jsx12(Button9, { variant: "primary", icon: /* @__PURE__ */ jsx12(PlusGlyph, {}), onClick: () => setAdding(true), children: "Add one-time password" })
-    ] }) : groups.length === 0 ? /* @__PURE__ */ jsx12("div", { className: "px-4 py-10 text-center text-sm text-muted-foreground", children: "Nothing matches." }) : /* @__PURE__ */ jsx12("div", { className: "min-h-0 flex-1 overflow-y-auto px-3 pb-6 pt-1 sm:px-4", children: /* @__PURE__ */ jsx12("div", { className: "mx-auto flex w-full max-w-3xl flex-col gap-5", children: groups.map((g) => /* @__PURE__ */ jsx12(VaultSection, { title: g.label, className: "[&>div]:px-1", children: g.items.map((item) => /* @__PURE__ */ jsx12(
+      /* @__PURE__ */ jsx13("span", { className: "flex size-12 items-center justify-center rounded-full bg-muted text-muted-foreground", children: /* @__PURE__ */ jsx13(ShieldGlyph, { className: "size-6" }) }),
+      /* @__PURE__ */ jsx13("p", { className: "text-sm font-medium text-foreground", children: "No authenticator codes yet" }),
+      /* @__PURE__ */ jsx13(Button9, { variant: "primary", icon: /* @__PURE__ */ jsx13(PlusGlyph, {}), onClick: () => setAdding(true), children: "Add authenticator" })
+    ] }) : groups.length === 0 ? /* @__PURE__ */ jsx13("div", { className: "px-4 py-10 text-center text-sm text-muted-foreground", children: "Nothing matches." }) : /* @__PURE__ */ jsx13("div", { className: "min-h-0 flex-1 overflow-y-auto px-3 pb-6 pt-1 sm:px-4", children: /* @__PURE__ */ jsx13("div", { className: "mx-auto flex w-full max-w-3xl flex-col gap-5", children: groups.map((g) => /* @__PURE__ */ jsx13(VaultSection, { title: g.label, className: "[&>div]:px-1", children: g.items.map((item) => /* @__PURE__ */ jsx13(
       OtpListRow,
       {
         port,
@@ -2401,6 +2401,7 @@ function AuthenticatorView({ port, items, definitions, query, onOpen, onChanged,
         family: familyOf2(item.definitionKey),
         entry: entries.get(item.id),
         onOpen: () => onOpen(item.id),
+        ...host.openItemInNewTab ? { onOpenInNewTab: () => host.openItemInNewTab?.(item.id) } : {},
         onRename: () => {
           setRenameError(null);
           setRenaming(item);
@@ -2413,7 +2414,7 @@ function AuthenticatorView({ port, items, definitions, query, onOpen, onChanged,
       },
       item.id
     )) }, g.key)) }) }),
-    adding ? /* @__PURE__ */ jsx12(
+    adding ? /* @__PURE__ */ jsx13(
       AddOtpPanel,
       {
         port,
@@ -2427,7 +2428,7 @@ function AuthenticatorView({ port, items, definitions, query, onOpen, onChanged,
         }
       }
     ) : null,
-    /* @__PURE__ */ jsx12(
+    /* @__PURE__ */ jsx13(
       TextInputDialog,
       {
         open: renaming !== null,
@@ -2435,7 +2436,7 @@ function AuthenticatorView({ port, items, definitions, query, onOpen, onChanged,
           if (!o && !renameBusy) setRenaming(null);
         },
         title: "Rename login",
-        ...renameError ? { description: /* @__PURE__ */ jsx12("span", { className: "text-destructive", children: renameError }) } : {},
+        ...renameError ? { description: /* @__PURE__ */ jsx13("span", { className: "text-destructive", children: renameError }) } : {},
         placeholder: "Login name",
         defaultValue: renaming?.name ?? "",
         confirmLabel: "Rename",
@@ -2458,50 +2459,53 @@ function AuthenticatorView({ port, items, definitions, query, onOpen, onChanged,
     )
   ] });
 }
-function OtpListRow({ port, item, family, entry, onOpen, onRename, onChanged, onRemoved }) {
+function OtpListRow({ port, item, family, entry, onOpen, onOpenInNewTab, onRename, onChanged, onRemoved }) {
   const a = useOtpActions(port, item, (next) => next && next.authenticator === null ? onRemoved() : onChanged());
   const live = useLiveCode(port, item, a.enabled && !a.removed);
   const { copy } = useCopied();
-  const Icon = definitionGlyph(item.definitionKey, family);
   const canManage = item.capabilities.canManage || item.capabilities.canEdit;
   if (a.removed) return null;
   const sub = a.error ?? [entry?.account, loginSiteOf(item) || entry?.issuer].filter((v, i, all) => Boolean(v) && all.indexOf(v) === i).join(" \xB7 ");
   return /* @__PURE__ */ jsxs12("div", { className: "grid min-h-14 grid-cols-[2rem_minmax(0,1fr)_auto_auto] items-center gap-x-3 rounded-lg px-2 py-1.5 transition-colors hover:bg-accent/50", children: [
-    /* @__PURE__ */ jsx12("button", { type: "button", onClick: onOpen, "aria-label": `Open ${item.name}`, tabIndex: -1, className: cn6("flex size-8 items-center justify-center rounded-lg bg-muted", a.enabled ? "text-foreground" : "text-disabled-foreground"), children: /* @__PURE__ */ jsx12(Icon, { className: "size-4" }) }),
+    /* @__PURE__ */ jsx13("button", { type: "button", onClick: onOpen, "aria-label": `Open ${item.name}`, tabIndex: -1, className: "flex size-8 items-center justify-center rounded-lg", children: /* @__PURE__ */ jsx13(ItemIcon, { definitionKey: item.definitionKey, family, site: loginSiteOf(item) || (entry?.issuer ?? "") }) }),
     /* @__PURE__ */ jsxs12("button", { type: "button", onClick: onOpen, className: "flex min-w-0 flex-col items-start rounded-md text-left focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", children: [
-      /* @__PURE__ */ jsx12("span", { className: cn6("max-w-full truncate text-sm font-medium", a.enabled ? "text-foreground" : "text-muted-foreground"), children: item.name }),
-      sub ? /* @__PURE__ */ jsx12("span", { className: cn6("max-w-full truncate text-xs", a.error ? "text-destructive" : "text-muted-foreground"), title: sub, children: sub }) : null
+      /* @__PURE__ */ jsx13("span", { className: cn7("max-w-full truncate text-sm font-medium", a.enabled ? "text-foreground" : "text-muted-foreground"), children: item.name }),
+      sub ? /* @__PURE__ */ jsx13("span", { className: cn7("max-w-full truncate text-xs", a.error ? "text-destructive" : "text-muted-foreground"), title: sub, children: sub }) : null
     ] }),
-    /* @__PURE__ */ jsx12("div", { className: "flex min-w-0 justify-end", children: !a.enabled ? /* @__PURE__ */ jsxs12("span", { className: "flex items-center gap-1.5", children: [
-      /* @__PURE__ */ jsx12("span", { className: "text-sm text-disabled-foreground", children: "Off" }),
-      canManage ? /* @__PURE__ */ jsx12(Button9, { variant: "quiet", disabled: a.busy, onClick: () => void a.setEnabled(true), children: "Turn on" }) : null
+    /* @__PURE__ */ jsx13("div", { className: "flex min-w-0 justify-end", children: !a.enabled ? /* @__PURE__ */ jsxs12("span", { className: "flex items-center gap-1.5", children: [
+      /* @__PURE__ */ jsx13("span", { className: "text-sm text-disabled-foreground", children: "Off" }),
+      canManage ? /* @__PURE__ */ jsx13(Button9, { variant: "quiet", disabled: a.busy, onClick: () => void a.setEnabled(true), children: "Turn on" }) : null
     ] }) : live.error ? /* @__PURE__ */ jsxs12("span", { className: "flex items-center gap-1.5", children: [
-      /* @__PURE__ */ jsx12("span", { className: "max-w-40 truncate text-xs text-destructive", title: live.error, children: live.error }),
-      /* @__PURE__ */ jsx12(Button9, { variant: "quiet", onClick: live.retry, children: "Retry" })
-    ] }) : /* @__PURE__ */ jsx12(CodeButton, { live, digits: item.authenticator?.digits ?? 6, label: item.name }) }),
+      /* @__PURE__ */ jsx13("span", { className: "max-w-40 truncate text-xs text-destructive", title: live.error, children: live.error }),
+      /* @__PURE__ */ jsx13(Button9, { variant: "quiet", onClick: live.retry, children: "Retry" })
+    ] }) : /* @__PURE__ */ jsx13(CodeButton, { live, digits: item.authenticator?.digits ?? 6, label: item.name }) }),
     /* @__PURE__ */ jsxs12(DropdownMenu2, { children: [
-      /* @__PURE__ */ jsx12(DropdownMenuTrigger2, { asChild: true, children: /* @__PURE__ */ jsx12(Button9, { variant: "quiet", icon: /* @__PURE__ */ jsx12(MoreGlyph, {}), "aria-label": `${item.name} options`, disabled: a.busy }) }),
+      /* @__PURE__ */ jsx13(DropdownMenuTrigger2, { asChild: true, children: /* @__PURE__ */ jsx13(Button9, { variant: "quiet", icon: /* @__PURE__ */ jsx13(MoreGlyph, {}), "aria-label": `${item.name} options`, disabled: a.busy }) }),
       /* @__PURE__ */ jsxs12(DropdownMenuContent2, { align: "end", className: "min-w-44", children: [
         /* @__PURE__ */ jsxs12(DropdownMenuItem2, { onSelect: onOpen, children: [
-          /* @__PURE__ */ jsx12(ExternalGlyph, { className: "size-4" }),
+          /* @__PURE__ */ jsx13(ExternalGlyph, { className: "size-4" }),
           "Open login"
         ] }),
+        onOpenInNewTab ? /* @__PURE__ */ jsxs12(DropdownMenuItem2, { onSelect: onOpenInNewTab, children: [
+          /* @__PURE__ */ jsx13(ExternalGlyph, { className: "size-4" }),
+          "Open in new tab"
+        ] }) : null,
         live.code ? /* @__PURE__ */ jsxs12(DropdownMenuItem2, { onSelect: () => live.code && void copy(live.code), children: [
-          /* @__PURE__ */ jsx12(CopyIcon4, { className: "size-4" }),
+          /* @__PURE__ */ jsx13(CopyIcon4, { className: "size-4" }),
           "Copy code"
         ] }) : null,
         canManage ? /* @__PURE__ */ jsxs12(Fragment8, { children: [
           /* @__PURE__ */ jsxs12(DropdownMenuItem2, { onSelect: onRename, children: [
-            /* @__PURE__ */ jsx12(PencilGlyph, { className: "size-4" }),
+            /* @__PURE__ */ jsx13(PencilGlyph, { className: "size-4" }),
             "Rename"
           ] }),
           /* @__PURE__ */ jsxs12(DropdownMenuItem2, { onSelect: () => void a.setEnabled(!a.enabled), children: [
-            /* @__PURE__ */ jsx12(PowerGlyph, { className: "size-4" }),
+            /* @__PURE__ */ jsx13(PowerGlyph, { className: "size-4" }),
             a.enabled ? "Turn off" : "Turn on"
           ] }),
-          /* @__PURE__ */ jsx12(DropdownMenuSeparator2, {}),
+          /* @__PURE__ */ jsx13(DropdownMenuSeparator2, {}),
           /* @__PURE__ */ jsxs12(DropdownMenuItem2, { className: "text-destructive focus:text-destructive", onSelect: () => void a.remove(), children: [
-            /* @__PURE__ */ jsx12(TrashGlyph, { className: "size-4" }),
+            /* @__PURE__ */ jsx13(TrashGlyph, { className: "size-4" }),
             "Remove"
           ] })
         ] }) : null
@@ -2594,7 +2598,7 @@ function withoutCode(codes, index) {
 }
 
 // src/fields/SettingsPanels.tsx
-import { jsx as jsx13, jsxs as jsxs13 } from "react/jsx-runtime";
+import { jsx as jsx14, jsxs as jsxs13 } from "react/jsx-runtime";
 var say = (e, fallback) => e instanceof Error && e.message ? e.message : fallback;
 function useSaver(onChanged) {
   const [busy, setBusy] = useState14(null);
@@ -2616,14 +2620,14 @@ function useSaver(onChanged) {
   return { busy, error, setError, save };
 }
 function Problem({ children }) {
-  return /* @__PURE__ */ jsx13("p", { role: "alert", className: "px-1 text-sm text-destructive", children });
+  return /* @__PURE__ */ jsx14("p", { role: "alert", className: "px-1 text-sm text-destructive", children });
 }
-var quietHint = (text, tone = "muted") => /* @__PURE__ */ jsx13("span", { className: tone === "destructive" ? "text-destructive" : void 0, title: text, children: text });
+var quietHint = (text, tone = "muted") => /* @__PURE__ */ jsx14("span", { className: tone === "destructive" ? "text-destructive" : void 0, title: text, children: text });
 function FieldSettingsPanel(props) {
   const field = props.item.fields.find((f) => f.id === props.arg);
   if (!field)
-    return /* @__PURE__ */ jsx13(Panel, { title: "Field settings", size: "md", onClose: props.onClose, footer: /* @__PURE__ */ jsx13(Button10, { variant: "primary", onClick: props.onClose, children: "Done" }), children: /* @__PURE__ */ jsx13(Empty, { children: "This field is no longer on the item." }) });
-  return /* @__PURE__ */ jsx13(FieldSettings, { ...props, field }, field.id);
+    return /* @__PURE__ */ jsx14(Panel, { title: "Field settings", size: "md", onClose: props.onClose, footer: /* @__PURE__ */ jsx14(Button10, { variant: "primary", onClick: props.onClose, children: "Done" }), children: /* @__PURE__ */ jsx14(Empty, { children: "This field is no longer on the item." }) });
+  return /* @__PURE__ */ jsx14(FieldSettings, { ...props, field }, field.id);
 }
 function FieldSettings({ item, port, field, onClose, onChanged }) {
   const { busy, error, setError, save } = useSaver((next) => onChanged(next));
@@ -2662,9 +2666,9 @@ function FieldSettings({ item, port, field, onClose, onChanged }) {
   };
   const handling = HANDLING_WORDS[field.handling];
   const locked = !canEdit || busy !== null;
-  return /* @__PURE__ */ jsxs13(Panel, { title: `${field.label} settings`, size: "md", onClose, footer: /* @__PURE__ */ jsx13(Button10, { variant: "primary", onClick: onClose, children: "Done" }), children: [
-    !canEdit ? /* @__PURE__ */ jsx13("p", { className: "px-1 text-sm text-muted-foreground", children: "View only: you can\u2019t change these settings." }) : null,
-    /* @__PURE__ */ jsx13(VaultSection, { title: "Who can see it", children: /* @__PURE__ */ jsx13(VaultRow, { label: "Value", hint: quietHint(handling.hint), children: field.handling === "sealed" ? /* @__PURE__ */ jsx13(Badge3, { icon: /* @__PURE__ */ jsx13(LockGlyph, {}), children: "Sealed for good" }) : /* @__PURE__ */ jsx13(
+  return /* @__PURE__ */ jsxs13(Panel, { title: `${field.label} settings`, size: "md", onClose, footer: /* @__PURE__ */ jsx14(Button10, { variant: "primary", onClick: onClose, children: "Done" }), children: [
+    !canEdit ? /* @__PURE__ */ jsx14("p", { className: "px-1 text-sm text-muted-foreground", children: "View only: you can\u2019t change these settings." }) : null,
+    /* @__PURE__ */ jsx14(VaultSection, { title: "Who can see it", children: /* @__PURE__ */ jsx14(VaultRow, { label: "Value", hint: quietHint(handling.hint), children: field.handling === "sealed" ? /* @__PURE__ */ jsx14(Badge3, { icon: /* @__PURE__ */ jsx14(LockGlyph, {}), children: "Sealed for good" }) : /* @__PURE__ */ jsx14(
       SegmentedControl,
       {
         "aria-label": "Who can see it",
@@ -2674,7 +2678,7 @@ function FieldSettings({ item, port, field, onClose, onChanged }) {
       }
     ) }) }),
     /* @__PURE__ */ jsxs13(VaultSection, { title: "Automation", children: [
-      /* @__PURE__ */ jsx13(VaultRow, { label: "Env key", hint: envProblem ? quietHint(envProblem, "destructive") : quietHint("The name sandboxes and workflows use"), children: /* @__PURE__ */ jsx13(
+      /* @__PURE__ */ jsx14(VaultRow, { label: "Env key", hint: envProblem ? quietHint(envProblem, "destructive") : quietHint("The name sandboxes and workflows use"), children: /* @__PURE__ */ jsx14(
         Field5,
         {
           ref: envRef,
@@ -2694,10 +2698,10 @@ function FieldSettings({ item, port, field, onClose, onChanged }) {
           }
         }
       ) }),
-      /* @__PURE__ */ jsx13(VaultRow, { label: "Use in sandbox", hint: blocker && !field.injectIntoSandbox ? quietHint(blocker) : quietHint("Sandboxes get it as an env variable"), children: /* @__PURE__ */ jsx13(Switch, { "aria-label": "Use in sandbox", checked: field.injectIntoSandbox, disabled: locked, onCheckedChange: (v) => void setSandbox(v) }) })
+      /* @__PURE__ */ jsx14(VaultRow, { label: "Use in sandbox", hint: blocker && !field.injectIntoSandbox ? quietHint(blocker) : quietHint("Sandboxes get it as an env variable"), children: /* @__PURE__ */ jsx14(Switch, { "aria-label": "Use in sandbox", checked: field.injectIntoSandbox, disabled: locked, onCheckedChange: (v) => void setSandbox(v) }) })
     ] }),
     /* @__PURE__ */ jsxs13(VaultSection, { title: "Field", children: [
-      /* @__PURE__ */ jsx13(VaultRow, { label: "Description", children: /* @__PURE__ */ jsx13(
+      /* @__PURE__ */ jsx14(VaultRow, { label: "Description", children: /* @__PURE__ */ jsx14(
         Field5,
         {
           className: "w-full",
@@ -2713,10 +2717,10 @@ function FieldSettings({ item, port, field, onClose, onChanged }) {
           }
         }
       ) }),
-      /* @__PURE__ */ jsx13(VaultRow, { label: "Editable", hint: quietHint(field.editable ? "The value can be changed" : "The value is locked"), children: /* @__PURE__ */ jsx13(Switch, { "aria-label": "Editable", checked: field.editable, disabled: locked, onCheckedChange: (v) => void update("editable", { editable: v }) }) }),
-      /* @__PURE__ */ jsx13(VaultRow, { label: "Turned on", hint: quietHint(field.active ? "In use" : "Kept, but nothing uses it"), children: /* @__PURE__ */ jsx13(Switch, { "aria-label": "Turned on", checked: field.active, disabled: locked, onCheckedChange: (v) => void update("active", { active: v }) }) })
+      /* @__PURE__ */ jsx14(VaultRow, { label: "Editable", hint: quietHint(field.editable ? "The value can be changed" : "The value is locked"), children: /* @__PURE__ */ jsx14(Switch, { "aria-label": "Editable", checked: field.editable, disabled: locked, onCheckedChange: (v) => void update("editable", { editable: v }) }) }),
+      /* @__PURE__ */ jsx14(VaultRow, { label: "Turned on", hint: quietHint(field.active ? "In use" : "Kept, but nothing uses it"), children: /* @__PURE__ */ jsx14(Switch, { "aria-label": "Turned on", checked: field.active, disabled: locked, onCheckedChange: (v) => void update("active", { active: v }) }) })
     ] }),
-    error ? /* @__PURE__ */ jsx13(Problem, { children: error }) : null
+    error ? /* @__PURE__ */ jsx14(Problem, { children: error }) : null
   ] });
 }
 function ItemSettingsPanel({ item, port, onClose, onChanged, onPanel }) {
@@ -2743,10 +2747,10 @@ function ItemSettingsPanel({ item, port, onClose, onChanged, onPanel }) {
     });
   };
   const fillHint = !hasWebsite ? "Add a website first" : item.browserFillEnabled ? "Offered on matching pages" : "Never filled automatically";
-  return /* @__PURE__ */ jsxs13(Panel, { title: "Item settings", size: "md", onClose, footer: /* @__PURE__ */ jsx13(Button10, { variant: "primary", onClick: onClose, children: "Done" }), children: [
-    !canEdit ? /* @__PURE__ */ jsx13("p", { className: "px-1 text-sm text-muted-foreground", children: "View only: you can\u2019t change these settings." }) : null,
+  return /* @__PURE__ */ jsxs13(Panel, { title: "Item settings", size: "md", onClose, footer: /* @__PURE__ */ jsx14(Button10, { variant: "primary", onClick: onClose, children: "Done" }), children: [
+    !canEdit ? /* @__PURE__ */ jsx14("p", { className: "px-1 text-sm text-muted-foreground", children: "View only: you can\u2019t change these settings." }) : null,
     /* @__PURE__ */ jsxs13(VaultSection, { title: "In the browser", children: [
-      /* @__PURE__ */ jsx13(VaultRow, { label: "Website matching", hint: quietHint(MATCH_WORDS[item.uriMatchMode].hint), children: /* @__PURE__ */ jsx13(
+      /* @__PURE__ */ jsx14(VaultRow, { label: "Website matching", hint: quietHint(MATCH_WORDS[item.uriMatchMode].hint), children: /* @__PURE__ */ jsx14(
         Select3,
         {
           "aria-label": "Website matching",
@@ -2756,45 +2760,45 @@ function ItemSettingsPanel({ item, port, onClose, onChanged, onPanel }) {
           onValueChange: (m) => void save("match", () => port.fields.updateItem(item, { uriMatchMode: m }))
         }
       ) }),
-      /* @__PURE__ */ jsx13(VaultRow, { label: "Fill in browser", hint: quietHint(fillHint), children: /* @__PURE__ */ jsx13(Switch, { "aria-label": "Fill in browser", checked: hasWebsite && item.browserFillEnabled, disabled: locked || !hasWebsite, onCheckedChange: (v) => void save("fill", () => port.fields.updateItem(item, { browserFillEnabled: v })) }) }),
-      promotable.map((f) => /* @__PURE__ */ jsx13(
+      /* @__PURE__ */ jsx14(VaultRow, { label: "Fill in browser", hint: quietHint(fillHint), children: /* @__PURE__ */ jsx14(Switch, { "aria-label": "Fill in browser", checked: hasWebsite && item.browserFillEnabled, disabled: locked || !hasWebsite, onCheckedChange: (v) => void save("fill", () => port.fields.updateItem(item, { browserFillEnabled: v })) }) }),
+      promotable.map((f) => /* @__PURE__ */ jsx14(
         VaultRow,
         {
           label: f.label,
           hint: quietHint("Encrypted, so the browser can\u2019t match it"),
-          actions: /* @__PURE__ */ jsx13(Button10, { variant: "outline", icon: /* @__PURE__ */ jsx13(GlobeIcon2, {}), disabled: locked, onClick: () => void promote(f), children: "Use as website" }),
-          children: /* @__PURE__ */ jsx13("span", { className: "text-muted-foreground", children: "Not a website yet" })
+          actions: /* @__PURE__ */ jsx14(Button10, { variant: "outline", icon: /* @__PURE__ */ jsx14(GlobeIcon2, {}), disabled: locked, onClick: () => void promote(f), children: "Use as website" }),
+          children: /* @__PURE__ */ jsx14("span", { className: "text-muted-foreground", children: "Not a website yet" })
         },
         f.id
       ))
     ] }),
     /* @__PURE__ */ jsxs13("div", { className: "flex flex-col gap-1.5", children: [
-      /* @__PURE__ */ jsx13(DisclosureHeader, { open: advanced, title: "Advanced", meta: item.fields.length ? `${item.fields.length} fields` : void 0, onClick: () => setAdvanced((a) => !a) }),
-      advanced ? /* @__PURE__ */ jsx13(VaultSection, { children: item.fields.length === 0 ? /* @__PURE__ */ jsx13(Empty, { children: "No encrypted fields." }) : item.fields.map((f) => /* @__PURE__ */ jsx13(
+      /* @__PURE__ */ jsx14(DisclosureHeader, { open: advanced, title: "Advanced", meta: item.fields.length ? `${item.fields.length} fields` : void 0, onClick: () => setAdvanced((a) => !a) }),
+      advanced ? /* @__PURE__ */ jsx14(VaultSection, { children: item.fields.length === 0 ? /* @__PURE__ */ jsx14(Empty, { children: "No encrypted fields." }) : item.fields.map((f) => /* @__PURE__ */ jsx14(
         VaultRow,
         {
           label: f.label,
-          actions: /* @__PURE__ */ jsx13(Button10, { variant: "quiet", icon: /* @__PURE__ */ jsx13(SlidersGlyph, {}), "aria-label": `${f.label} settings`, onClick: () => onPanel(`field:${f.id}`) }),
+          actions: /* @__PURE__ */ jsx14(Button10, { variant: "quiet", icon: /* @__PURE__ */ jsx14(SlidersGlyph, {}), "aria-label": `${f.label} settings`, onClick: () => onPanel(`field:${f.id}`) }),
           children: /* @__PURE__ */ jsxs13("span", { className: "block truncate", children: [
-            /* @__PURE__ */ jsx13("span", { className: f.handling === "sealed" ? "text-foreground" : "text-muted-foreground", children: HANDLING_WORDS[f.handling].label }),
+            /* @__PURE__ */ jsx14("span", { className: f.handling === "sealed" ? "text-foreground" : "text-muted-foreground", children: HANDLING_WORDS[f.handling].label }),
             f.envKey ? /* @__PURE__ */ jsxs13("span", { className: "font-mono text-muted-foreground", children: [
               " \xB7 ",
               f.envKey
             ] }) : null,
-            f.injectIntoSandbox ? /* @__PURE__ */ jsx13("span", { className: "text-muted-foreground", children: " \xB7 Sandbox" }) : null,
-            !f.active ? /* @__PURE__ */ jsx13("span", { className: "text-warning", children: " \xB7 Turned off" }) : null
+            f.injectIntoSandbox ? /* @__PURE__ */ jsx14("span", { className: "text-muted-foreground", children: " \xB7 Sandbox" }) : null,
+            !f.active ? /* @__PURE__ */ jsx14("span", { className: "text-warning", children: " \xB7 Turned off" }) : null
           ] })
         },
         f.id
       )) }) : null
     ] }),
-    error ? /* @__PURE__ */ jsx13(Problem, { children: error }) : null
+    error ? /* @__PURE__ */ jsx14(Problem, { children: error }) : null
   ] });
 }
 
 // src/generator/PasswordGenerator.tsx
 import { createContext as createContext5, useContext as useContext5, useEffect as useEffect12, useRef as useRef10, useState as useState15 } from "react";
-import { Popover, PopoverContent, PopoverTrigger, cn as cn7 } from "@ai-matrx/design-system";
+import { Popover, PopoverContent, PopoverTrigger, cn as cn8 } from "@ai-matrx/design-system";
 import { Button as Button11, NumberStepper, SegmentedControl as SegmentedControl2, Select as Select4, Switch as Switch2 } from "@ai-matrx/design-system/controls";
 import { CopyIcon as CopyIcon5 } from "@ai-matrx/design-system/icons";
 
@@ -2854,10 +2858,10 @@ function strengthOf(bits) {
 }
 
 // src/generator/PasswordGenerator.tsx
-import { jsx as jsx14, jsxs as jsxs14 } from "react/jsx-runtime";
+import { jsx as jsx15, jsxs as jsxs14 } from "react/jsx-runtime";
 var LimitsCtx = createContext5(null);
 function GeneratorLimitsProvider({ resolve: resolve2, children }) {
-  return /* @__PURE__ */ jsx14(LimitsCtx.Provider, { value: resolve2 ?? null, children });
+  return /* @__PURE__ */ jsx15(LimitsCtx.Provider, { value: resolve2 ?? null, children });
 }
 function useGeneratorLimitsSource() {
   return useContext5(LimitsCtx);
@@ -2918,11 +2922,11 @@ function PasswordGenerator({ limits: source, onUse, useLabel = "Use" }) {
   useEffect12(() => () => {
     if (expiry.current) clearTimeout(expiry.current);
   }, []);
-  if (limits.state === "loading") return /* @__PURE__ */ jsx14("p", { className: "px-1 py-3 text-sm text-muted-foreground", "aria-live": "polite", children: "Reading limits\u2026" });
+  if (limits.state === "loading") return /* @__PURE__ */ jsx15("p", { className: "px-1 py-3 text-sm text-muted-foreground", "aria-live": "polite", children: "Reading limits\u2026" });
   if (limits.state === "unavailable")
     return /* @__PURE__ */ jsxs14("div", { className: "flex flex-col gap-2 px-1 py-2", children: [
-      /* @__PURE__ */ jsx14("p", { role: "alert", className: "text-sm text-destructive", children: limits.message }),
-      /* @__PURE__ */ jsx14(Button11, { variant: "outline", icon: /* @__PURE__ */ jsx14(RefreshGlyph, {}), onClick: () => setRound((n) => n + 1), children: "Try again" })
+      /* @__PURE__ */ jsx15("p", { role: "alert", className: "text-sm text-destructive", children: limits.message }),
+      /* @__PURE__ */ jsx15(Button11, { variant: "outline", icon: /* @__PURE__ */ jsx15(RefreshGlyph, {}), onClick: () => setRound((n) => n + 1), children: "Try again" })
     ] });
   const ceilings = limits.limits;
   const change = (next) => make(next, ceilings);
@@ -2940,7 +2944,7 @@ function PasswordGenerator({ limits: source, onUse, useLabel = "Use" }) {
     onUse(value);
   };
   return /* @__PURE__ */ jsxs14("div", { className: "flex w-full flex-col gap-3", "aria-label": "Password generator", children: [
-    /* @__PURE__ */ jsx14(
+    /* @__PURE__ */ jsx15(
       SegmentedControl2,
       {
         fill: true,
@@ -2952,13 +2956,13 @@ function PasswordGenerator({ limits: source, onUse, useLabel = "Use" }) {
     ),
     /* @__PURE__ */ jsxs14("div", { className: "flex flex-col gap-1 rounded-lg bg-muted px-3 py-2", children: [
       /* @__PURE__ */ jsxs14("div", { className: "flex min-h-7 items-start gap-1", children: [
-        /* @__PURE__ */ jsx14("code", { className: cn7("min-w-0 flex-1 break-all py-1 font-mono text-sm", candidate ? "text-foreground" : "text-muted-foreground"), "data-testid": "generated-value", children: candidate ? revealed ? candidate.value : MASK3 : "\u2014" }),
-        /* @__PURE__ */ jsx14(Button11, { variant: "quiet", icon: revealed ? /* @__PURE__ */ jsx14(EyeOffGlyph, {}) : /* @__PURE__ */ jsx14(EyeGlyph, {}), "aria-label": revealed ? "Hide" : "Reveal", disabled: !candidate, onClick: () => setRevealed((r) => !r) }),
-        /* @__PURE__ */ jsx14(Button11, { variant: "quiet", icon: /* @__PURE__ */ jsx14(CopyIcon5, {}), "aria-label": "Copy", disabled: !candidate, onClick: () => void copy() }),
-        /* @__PURE__ */ jsx14(Button11, { variant: "quiet", icon: /* @__PURE__ */ jsx14(RefreshGlyph, {}), "aria-label": "Generate another", onClick: () => change(settings) })
+        /* @__PURE__ */ jsx15("code", { className: cn8("min-w-0 flex-1 break-all py-1 font-mono text-sm", candidate ? "text-foreground" : "text-muted-foreground"), "data-testid": "generated-value", children: candidate ? revealed ? candidate.value : MASK3 : "\u2014" }),
+        /* @__PURE__ */ jsx15(Button11, { variant: "quiet", icon: revealed ? /* @__PURE__ */ jsx15(EyeOffGlyph, {}) : /* @__PURE__ */ jsx15(EyeGlyph, {}), "aria-label": revealed ? "Hide" : "Reveal", disabled: !candidate, onClick: () => setRevealed((r) => !r) }),
+        /* @__PURE__ */ jsx15(Button11, { variant: "quiet", icon: /* @__PURE__ */ jsx15(CopyIcon5, {}), "aria-label": "Copy", disabled: !candidate, onClick: () => void copy() }),
+        /* @__PURE__ */ jsx15(Button11, { variant: "quiet", icon: /* @__PURE__ */ jsx15(RefreshGlyph, {}), "aria-label": "Generate another", onClick: () => change(settings) })
       ] }),
       strength && candidate ? /* @__PURE__ */ jsxs14("p", { className: "text-xs", children: [
-        /* @__PURE__ */ jsx14("span", { className: cn7(strength.tone === "success" && "text-success", strength.tone === "primary" && "text-primary", strength.tone === "warning" && "text-warning"), children: strength.label }),
+        /* @__PURE__ */ jsx15("span", { className: cn8(strength.tone === "success" && "text-success", strength.tone === "primary" && "text-primary", strength.tone === "warning" && "text-warning"), children: strength.label }),
         /* @__PURE__ */ jsxs14("span", { className: "text-muted-foreground", children: [
           " \xB7 ",
           Math.floor(candidate.bits),
@@ -2967,7 +2971,7 @@ function PasswordGenerator({ limits: source, onUse, useLabel = "Use" }) {
       ] }) : null
     ] }),
     settings.kind === "password" ? /* @__PURE__ */ jsxs14("div", { className: "flex flex-col gap-0.5", children: [
-      /* @__PURE__ */ jsx14(OptionLine, { label: "Length", children: /* @__PURE__ */ jsx14(NumberStepper, { value: settings.password.length, min: minPasswordLength(settings.password), max: ceilings.maxPasswordLength, fallback: 24, onChange: (length) => setPassword({ length }) }) }),
+      /* @__PURE__ */ jsx15(OptionLine, { label: "Length", children: /* @__PURE__ */ jsx15(NumberStepper, { value: settings.password.length, min: minPasswordLength(settings.password), max: ceilings.maxPasswordLength, fallback: 24, onChange: (length) => setPassword({ length }) }) }),
       [
         ["lowercase", "Lowercase"],
         ["uppercase", "Uppercase"],
@@ -2976,26 +2980,26 @@ function PasswordGenerator({ limits: source, onUse, useLabel = "Use" }) {
       ].map(([key, label]) => {
         const on = settings.password[key];
         const last = on && minPasswordLength(settings.password) === 1;
-        return /* @__PURE__ */ jsx14(OptionLine, { label, children: /* @__PURE__ */ jsx14(Switch2, { "aria-label": label, checked: on, disabled: last, onCheckedChange: (v) => setPassword({ [key]: v }) }) }, key);
+        return /* @__PURE__ */ jsx15(OptionLine, { label, children: /* @__PURE__ */ jsx15(Switch2, { "aria-label": label, checked: on, disabled: last, onCheckedChange: (v) => setPassword({ [key]: v }) }) }, key);
       }),
-      /* @__PURE__ */ jsx14(OptionLine, { label: "Avoid look-alikes", hint: "No 0/O, 1/l/I", children: /* @__PURE__ */ jsx14(Switch2, { "aria-label": "Avoid look-alikes", checked: settings.password.excludeAmbiguous, onCheckedChange: (v) => setPassword({ excludeAmbiguous: v }) }) })
+      /* @__PURE__ */ jsx15(OptionLine, { label: "Avoid look-alikes", hint: "No 0/O, 1/l/I", children: /* @__PURE__ */ jsx15(Switch2, { "aria-label": "Avoid look-alikes", checked: settings.password.excludeAmbiguous, onCheckedChange: (v) => setPassword({ excludeAmbiguous: v }) }) })
     ] }) : /* @__PURE__ */ jsxs14("div", { className: "flex flex-col gap-0.5", children: [
-      /* @__PURE__ */ jsx14(OptionLine, { label: "Words", children: /* @__PURE__ */ jsx14(NumberStepper, { value: settings.passphrase.wordCount, min: MIN_PASSPHRASE_WORDS, max: ceilings.maxPassphraseWords, fallback: MIN_PASSPHRASE_WORDS, onChange: (wordCount) => change({ ...settings, passphrase: { ...settings.passphrase, wordCount } }) }) }),
-      /* @__PURE__ */ jsx14(OptionLine, { label: "Separator", children: /* @__PURE__ */ jsx14(Select4, { "aria-label": "Separator", variant: "inline", align: "end", value: settings.passphrase.separator, options: SEPARATORS, onValueChange: (separator) => change({ ...settings, passphrase: { ...settings.passphrase, separator } }) }) }),
-      /* @__PURE__ */ jsx14(OptionLine, { label: "Capitalize", children: /* @__PURE__ */ jsx14(Switch2, { "aria-label": "Capitalize", checked: settings.passphrase.capitalize, onCheckedChange: (capitalize) => change({ ...settings, passphrase: { ...settings.passphrase, capitalize } }) }) }),
-      /* @__PURE__ */ jsx14(OptionLine, { label: "Add a digit", children: /* @__PURE__ */ jsx14(Switch2, { "aria-label": "Add a digit", checked: settings.passphrase.appendDigit, onCheckedChange: (appendDigit) => change({ ...settings, passphrase: { ...settings.passphrase, appendDigit } }) }) })
+      /* @__PURE__ */ jsx15(OptionLine, { label: "Words", children: /* @__PURE__ */ jsx15(NumberStepper, { value: settings.passphrase.wordCount, min: MIN_PASSPHRASE_WORDS, max: ceilings.maxPassphraseWords, fallback: MIN_PASSPHRASE_WORDS, onChange: (wordCount) => change({ ...settings, passphrase: { ...settings.passphrase, wordCount } }) }) }),
+      /* @__PURE__ */ jsx15(OptionLine, { label: "Separator", children: /* @__PURE__ */ jsx15(Select4, { "aria-label": "Separator", variant: "inline", align: "end", value: settings.passphrase.separator, options: SEPARATORS, onValueChange: (separator) => change({ ...settings, passphrase: { ...settings.passphrase, separator } }) }) }),
+      /* @__PURE__ */ jsx15(OptionLine, { label: "Capitalize", children: /* @__PURE__ */ jsx15(Switch2, { "aria-label": "Capitalize", checked: settings.passphrase.capitalize, onCheckedChange: (capitalize) => change({ ...settings, passphrase: { ...settings.passphrase, capitalize } }) }) }),
+      /* @__PURE__ */ jsx15(OptionLine, { label: "Add a digit", children: /* @__PURE__ */ jsx15(Switch2, { "aria-label": "Add a digit", checked: settings.passphrase.appendDigit, onCheckedChange: (appendDigit) => change({ ...settings, passphrase: { ...settings.passphrase, appendDigit } }) }) })
     ] }),
-    note ? /* @__PURE__ */ jsx14("p", { "aria-live": "polite", className: cn7("text-xs", note.tone === "destructive" ? "text-destructive" : note.tone === "success" ? "text-success" : "text-muted-foreground"), children: note.text }) : null,
-    /* @__PURE__ */ jsx14(Button11, { variant: "primary", disabled: !candidate, onClick: use, children: useLabel })
+    note ? /* @__PURE__ */ jsx15("p", { "aria-live": "polite", className: cn8("text-xs", note.tone === "destructive" ? "text-destructive" : note.tone === "success" ? "text-success" : "text-muted-foreground"), children: note.text }) : null,
+    /* @__PURE__ */ jsx15(Button11, { variant: "primary", disabled: !candidate, onClick: use, children: useLabel })
   ] });
 }
 function OptionLine({ label, hint, children }) {
   return /* @__PURE__ */ jsxs14("div", { className: "flex min-h-9 items-center justify-between gap-3", children: [
     /* @__PURE__ */ jsxs14("div", { className: "flex min-w-0 flex-col", children: [
-      /* @__PURE__ */ jsx14("span", { className: "truncate text-sm text-foreground", children: label }),
-      hint ? /* @__PURE__ */ jsx14("span", { className: "truncate text-xs text-muted-foreground", children: hint }) : null
+      /* @__PURE__ */ jsx15("span", { className: "truncate text-sm text-foreground", children: label }),
+      hint ? /* @__PURE__ */ jsx15("span", { className: "truncate text-xs text-muted-foreground", children: hint }) : null
     ] }),
-    /* @__PURE__ */ jsx14("div", { className: "flex shrink-0 items-center", children })
+    /* @__PURE__ */ jsx15("div", { className: "flex shrink-0 items-center", children })
   ] });
 }
 function GenerateButton({ onUse, label, limits, disabled }) {
@@ -3005,8 +3009,8 @@ function GenerateButton({ onUse, label, limits, disabled }) {
   if (!source) return null;
   const name = label ?? "Generate password";
   return /* @__PURE__ */ jsxs14(Popover, { open, onOpenChange: setOpen, children: [
-    /* @__PURE__ */ jsx14(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx14(Button11, { variant: "quiet", icon: /* @__PURE__ */ jsx14(KeyGlyph, {}), "aria-label": name, title: name, disabled }) }),
-    /* @__PURE__ */ jsx14(PopoverContent, { sizing: "content", align: "end", children: open ? /* @__PURE__ */ jsx14(
+    /* @__PURE__ */ jsx15(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx15(Button11, { variant: "quiet", icon: /* @__PURE__ */ jsx15(KeyGlyph, {}), "aria-label": name, title: name, disabled }) }),
+    /* @__PURE__ */ jsx15(PopoverContent, { sizing: "content", align: "end", children: open ? /* @__PURE__ */ jsx15(
       PasswordGenerator,
       {
         limits: source,
@@ -3178,13 +3182,13 @@ function startNewRestoreRun(preview) {
 import { useState as useState16 } from "react";
 import { Checkbox } from "@ai-matrx/design-system";
 import { Badge as Badge4, Button as Button12, DisclosureHeader as DisclosureHeader2 } from "@ai-matrx/design-system/controls";
-import { Fragment as Fragment9, jsx as jsx15, jsxs as jsxs15 } from "react/jsx-runtime";
+import { Fragment as Fragment9, jsx as jsx16, jsxs as jsxs15 } from "react/jsx-runtime";
 function PickLine({ checked, onChange, disabled = false, title, detail, badge, tone }) {
   return /* @__PURE__ */ jsxs15("label", { className: "flex min-h-11 items-center gap-3 px-4 py-1", "data-clickable": disabled ? void 0 : "", children: [
-    /* @__PURE__ */ jsx15(Checkbox, { checked, disabled, onCheckedChange: (v) => onChange(v === true), "aria-label": title }),
-    /* @__PURE__ */ jsx15("span", { className: "min-w-0 flex-1 truncate text-sm text-foreground", children: title }),
-    detail ? /* @__PURE__ */ jsx15("span", { className: "hidden min-w-0 max-w-[45%] truncate text-xs text-muted-foreground sm:block", children: detail }) : null,
-    badge ? /* @__PURE__ */ jsx15(Badge4, { tone: tone ?? "neutral", children: badge }) : null
+    /* @__PURE__ */ jsx16(Checkbox, { checked, disabled, onCheckedChange: (v) => onChange(v === true), "aria-label": title }),
+    /* @__PURE__ */ jsx16("span", { className: "min-w-0 flex-1 truncate text-sm text-foreground", children: title }),
+    detail ? /* @__PURE__ */ jsx16("span", { className: "hidden min-w-0 max-w-[45%] truncate text-xs text-muted-foreground sm:block", children: detail }) : null,
+    badge ? /* @__PURE__ */ jsx16(Badge4, { tone: tone ?? "neutral", children: badge }) : null
   ] });
 }
 function Windowed({ items, size = 150, render }) {
@@ -3192,7 +3196,7 @@ function Windowed({ items, size = 150, render }) {
   const shown = all ? items : items.slice(0, size);
   return /* @__PURE__ */ jsxs15(Fragment9, { children: [
     shown.map(render),
-    items.length > shown.length ? /* @__PURE__ */ jsx15("div", { className: "px-4 py-2", children: /* @__PURE__ */ jsxs15(Button12, { variant: "quiet", onClick: () => setAll(true), children: [
+    items.length > shown.length ? /* @__PURE__ */ jsx16("div", { className: "px-4 py-2", children: /* @__PURE__ */ jsxs15(Button12, { variant: "quiet", onClick: () => setAll(true), children: [
       "Show all ",
       items.length
     ] }) }) : null
@@ -3201,17 +3205,17 @@ function Windowed({ items, size = 150, render }) {
 function More({ title = "More", children }) {
   const [open, setOpen] = useState16(false);
   return /* @__PURE__ */ jsxs15("div", { className: "flex flex-col gap-2", children: [
-    /* @__PURE__ */ jsx15(DisclosureHeader2, { open, title, onClick: () => setOpen((o) => !o) }),
+    /* @__PURE__ */ jsx16(DisclosureHeader2, { open, title, onClick: () => setOpen((o) => !o) }),
     open ? children : null
   ] });
 }
 function ErrorLine({ message: message2 }) {
-  return message2 ? /* @__PURE__ */ jsx15("p", { role: "alert", className: "px-1 text-sm text-destructive", children: message2 }) : null;
+  return message2 ? /* @__PURE__ */ jsx16("p", { role: "alert", className: "px-1 text-sm text-destructive", children: message2 }) : null;
 }
 var plural = (n, one, many = `${one}s`) => `${n} ${n === 1 ? one : many}`;
 
 // src/io/BackupPanel.tsx
-import { Fragment as Fragment10, jsx as jsx16, jsxs as jsxs16 } from "react/jsx-runtime";
+import { Fragment as Fragment10, jsx as jsx17, jsxs as jsxs16 } from "react/jsx-runtime";
 var RECORD_STATUS = {
   created: "Restored",
   replayed: "Already restored",
@@ -3224,16 +3228,16 @@ function omissionText(o) {
 }
 function Summary({ value }) {
   return /* @__PURE__ */ jsxs16(VaultSection, { children: [
-    /* @__PURE__ */ jsx16(VaultRow, { label: "Credentials", children: value.record_count }),
-    /* @__PURE__ */ jsx16(VaultRow, { label: "Protected fields", children: value.field_count }),
-    /* @__PURE__ */ jsx16(VaultRow, { label: "Files", children: value.attachment_count > 0 ? `${value.attachment_count} \xB7 ${formatFileSize(value.attachment_bytes)}` : "0" })
+    /* @__PURE__ */ jsx17(VaultRow, { label: "Credentials", children: value.record_count }),
+    /* @__PURE__ */ jsx17(VaultRow, { label: "Protected fields", children: value.field_count }),
+    /* @__PURE__ */ jsx17(VaultRow, { label: "Files", children: value.attachment_count > 0 ? `${value.attachment_count} \xB7 ${formatFileSize(value.attachment_bytes)}` : "0" })
   ] });
 }
 function Omissions({ omissions, accepted, onAccepted, verb }) {
   if (omissions.length === 0) return null;
   return /* @__PURE__ */ jsxs16(VaultSection, { title: "Left out", children: [
-    omissions.map((o, i) => /* @__PURE__ */ jsx16(VaultRow, { label: o.component.replaceAll("_", " "), children: /* @__PURE__ */ jsx16("span", { className: "block truncate text-muted-foreground", title: omissionText(o), children: omissionText(o) }) }, `${o.component}-${o.source_item_id ?? i}`)),
-    /* @__PURE__ */ jsx16(VaultRow, { label: "Accept", hint: `${verb} without these`, children: /* @__PURE__ */ jsx16(Switch3, { checked: accepted, onCheckedChange: onAccepted, "aria-label": `${verb} without these` }) })
+    omissions.map((o, i) => /* @__PURE__ */ jsx17(VaultRow, { label: o.component.replaceAll("_", " "), children: /* @__PURE__ */ jsx17("span", { className: "block truncate text-muted-foreground", title: omissionText(o), children: omissionText(o) }) }, `${o.component}-${o.source_item_id ?? i}`)),
+    /* @__PURE__ */ jsx17(VaultRow, { label: "Accept", hint: `${verb} without these`, children: /* @__PURE__ */ jsx17(Switch3, { checked: accepted, onCheckedChange: onAccepted, "aria-label": `${verb} without these` }) })
   ] });
 }
 function BackupPanel({ port, items, onClose, onChanged }) {
@@ -3340,20 +3344,20 @@ function BackupPanel({ port, items, onClose, onChanged }) {
   const mismatch = repeat !== "" && repeat !== passphrase;
   const names = new Map(restorePreview?.records.map((r) => [r.source_item_id, r.display_name]) ?? []);
   const footer = mode === "backup" ? /* @__PURE__ */ jsxs16(Fragment10, { children: [
-    /* @__PURE__ */ jsx16(Button13, { variant: "quiet", onClick: onClose, children: "Close" }),
-    backup ? /* @__PURE__ */ jsx16(Button13, { variant: "primary", disabled: busy || !passphrase || passphrase !== repeat || backup.omissions.length > 0 && !accepted, onClick: () => void downloadBackup(), children: "Encrypt and download" }) : /* @__PURE__ */ jsxs16(Button13, { variant: "primary", disabled: busy || selected.size === 0, onClick: () => void reviewBackup(), children: [
+    /* @__PURE__ */ jsx17(Button13, { variant: "quiet", onClick: onClose, children: "Close" }),
+    backup ? /* @__PURE__ */ jsx17(Button13, { variant: "primary", disabled: busy || !passphrase || passphrase !== repeat || backup.omissions.length > 0 && !accepted, onClick: () => void downloadBackup(), children: "Encrypt and download" }) : /* @__PURE__ */ jsxs16(Button13, { variant: "primary", disabled: busy || selected.size === 0, onClick: () => void reviewBackup(), children: [
       "Review ",
       selected.size
     ] })
   ] }) : /* @__PURE__ */ jsxs16(Fragment10, { children: [
-    /* @__PURE__ */ jsx16(Button13, { variant: "quiet", onClick: onClose, children: result && !retryable ? "Done" : "Close" }),
-    result ? retryable ? /* @__PURE__ */ jsx16(Button13, { variant: "primary", disabled: busy, onClick: () => void restore(), children: "Try again" }) : /* @__PURE__ */ jsx16(Button13, { variant: "outline", disabled: busy, onClick: () => void again(), children: "Restore again" }) : restorePreview ? /* @__PURE__ */ jsxs16(Button13, { variant: "primary", disabled: busy || restorePreview.omissions.length > 0 && !accepted, onClick: () => void restore(), children: [
+    /* @__PURE__ */ jsx17(Button13, { variant: "quiet", onClick: onClose, children: result && !retryable ? "Done" : "Close" }),
+    result ? retryable ? /* @__PURE__ */ jsx17(Button13, { variant: "primary", disabled: busy, onClick: () => void restore(), children: "Try again" }) : /* @__PURE__ */ jsx17(Button13, { variant: "outline", disabled: busy, onClick: () => void again(), children: "Restore again" }) : restorePreview ? /* @__PURE__ */ jsxs16(Button13, { variant: "primary", disabled: busy || restorePreview.omissions.length > 0 && !accepted, onClick: () => void restore(), children: [
       "Restore ",
       restorePreview.record_count
-    ] }) : /* @__PURE__ */ jsx16(Button13, { variant: "primary", disabled: busy || !file || !passphrase, onClick: () => void reviewRestore(), children: "Review" })
+    ] }) : /* @__PURE__ */ jsx17(Button13, { variant: "primary", disabled: busy || !file || !passphrase, onClick: () => void reviewRestore(), children: "Review" })
   ] });
   return /* @__PURE__ */ jsxs16(Panel, { title: "Backup", size: "lg", onClose, footer, children: [
-    /* @__PURE__ */ jsx16(
+    /* @__PURE__ */ jsx17(
       SegmentedControl3,
       {
         value: mode,
@@ -3367,35 +3371,35 @@ function BackupPanel({ port, items, onClose, onChanged }) {
       }
     ),
     mode === "backup" ? /* @__PURE__ */ jsxs16(Fragment10, { children: [
-      /* @__PURE__ */ jsx16(
+      /* @__PURE__ */ jsx17(
         VaultSection,
         {
           title: `${selected.size} of ${plural(items.length, "credential")}`,
           actions: /* @__PURE__ */ jsxs16(Fragment10, { children: [
-            /* @__PURE__ */ jsx16(Button13, { variant: "quiet", disabled: busy || items.length === 0, onClick: () => {
+            /* @__PURE__ */ jsx17(Button13, { variant: "quiet", disabled: busy || items.length === 0, onClick: () => {
               setBackup(null);
               setSelected(new Set(items.map((i) => i.id)));
             }, children: "All" }),
-            /* @__PURE__ */ jsx16(Button13, { variant: "quiet", disabled: busy || selected.size === 0, onClick: () => {
+            /* @__PURE__ */ jsx17(Button13, { variant: "quiet", disabled: busy || selected.size === 0, onClick: () => {
               setBackup(null);
               setSelected(/* @__PURE__ */ new Set());
             }, children: "None" })
           ] }),
-          children: items.length === 0 ? /* @__PURE__ */ jsx16(Empty, { children: "Nothing to back up yet." }) : /* @__PURE__ */ jsx16(Windowed, { items, render: (i) => /* @__PURE__ */ jsx16(PickLine, { title: i.name, detail: i.definitionLabel, checked: selected.has(i.id), disabled: busy, onChange: (on) => pick(i.id, on) }, i.id) })
+          children: items.length === 0 ? /* @__PURE__ */ jsx17(Empty, { children: "Nothing to back up yet." }) : /* @__PURE__ */ jsx17(Windowed, { items, render: (i) => /* @__PURE__ */ jsx17(PickLine, { title: i.name, detail: i.definitionLabel, checked: selected.has(i.id), disabled: busy, onChange: (on) => pick(i.id, on) }, i.id) })
         }
       ),
       backup ? /* @__PURE__ */ jsxs16(Fragment10, { children: [
-        /* @__PURE__ */ jsx16(Summary, { value: backup }),
-        /* @__PURE__ */ jsx16(Omissions, { omissions: backup.omissions, accepted, onAccepted: setAccepted, verb: "Back up" }),
+        /* @__PURE__ */ jsx17(Summary, { value: backup }),
+        /* @__PURE__ */ jsx17(Omissions, { omissions: backup.omissions, accepted, onAccepted: setAccepted, verb: "Back up" }),
         /* @__PURE__ */ jsxs16(VaultSection, { children: [
-          /* @__PURE__ */ jsx16(VaultRow, { label: "Passphrase", hint: "Not saved. It can't be recovered.", children: /* @__PURE__ */ jsx16(Field6, { type: "password", value: passphrase, autoComplete: "new-password", "aria-label": "Backup passphrase", onChange: (e) => setPassphrase(e.target.value) }) }),
-          /* @__PURE__ */ jsx16(VaultRow, { label: "Repeat", ...mismatch ? { hint: "Doesn't match" } : {}, children: /* @__PURE__ */ jsx16(Field6, { type: "password", value: repeat, autoComplete: "new-password", "aria-label": "Repeat the passphrase", onChange: (e) => setRepeat(e.target.value) }) })
+          /* @__PURE__ */ jsx17(VaultRow, { label: "Passphrase", hint: "Not saved. It can't be recovered.", children: /* @__PURE__ */ jsx17(Field6, { type: "password", value: passphrase, autoComplete: "new-password", "aria-label": "Backup passphrase", onChange: (e) => setPassphrase(e.target.value) }) }),
+          /* @__PURE__ */ jsx17(VaultRow, { label: "Repeat", ...mismatch ? { hint: "Doesn't match" } : {}, children: /* @__PURE__ */ jsx17(Field6, { type: "password", value: repeat, autoComplete: "new-password", "aria-label": "Repeat the passphrase", onChange: (e) => setRepeat(e.target.value) }) })
         ] })
       ] }) : null
-    ] }) : /* @__PURE__ */ jsx16(Fragment10, { children: !restorePreview ? /* @__PURE__ */ jsxs16(VaultSection, { children: [
+    ] }) : /* @__PURE__ */ jsx17(Fragment10, { children: !restorePreview ? /* @__PURE__ */ jsxs16(VaultSection, { children: [
       /* @__PURE__ */ jsxs16(VaultRow, { label: "File", ...file ? { hint: file.name } : {}, children: [
-        /* @__PURE__ */ jsx16(Button13, { variant: "outline", disabled: busy, onClick: () => fileInput.current?.click(), children: "Choose a backup" }),
-        /* @__PURE__ */ jsx16(
+        /* @__PURE__ */ jsx17(Button13, { variant: "outline", disabled: busy, onClick: () => fileInput.current?.click(), children: "Choose a backup" }),
+        /* @__PURE__ */ jsx17(
           "input",
           {
             ref: fileInput,
@@ -3409,16 +3413,16 @@ function BackupPanel({ port, items, onClose, onChanged }) {
           }
         )
       ] }),
-      /* @__PURE__ */ jsx16(VaultRow, { label: "Passphrase", children: /* @__PURE__ */ jsx16(Field6, { type: "password", value: passphrase, autoComplete: "current-password", "aria-label": "Backup passphrase", onChange: (e) => setPassphrase(e.target.value) }) })
+      /* @__PURE__ */ jsx17(VaultRow, { label: "Passphrase", children: /* @__PURE__ */ jsx17(Field6, { type: "password", value: passphrase, autoComplete: "current-password", "aria-label": "Backup passphrase", onChange: (e) => setPassphrase(e.target.value) }) })
     ] }) : /* @__PURE__ */ jsxs16(Fragment10, { children: [
-      /* @__PURE__ */ jsx16(Summary, { value: restorePreview }),
-      !result ? /* @__PURE__ */ jsx16(Omissions, { omissions: restorePreview.omissions, accepted, onAccepted: setAccepted, verb: "Restore" }) : null,
-      !result ? /* @__PURE__ */ jsx16("p", { className: "px-1 text-xs text-muted-foreground", children: "Restored items start disabled and restricted." }) : /* @__PURE__ */ jsx16(VaultSection, { title: `${result.created} restored \xB7 ${result.replayed} already \xB7 ${result.refused} refused \xB7 ${result.retryable_failure} to retry`, children: result.results.map((r) => /* @__PURE__ */ jsx16(VaultRow, { label: names.get(r.source_item_id) ?? "Credential", children: /* @__PURE__ */ jsxs16("span", { className: r.status === "refused" || r.status === "retryable_failure" ? "text-destructive" : "text-foreground", children: [
+      /* @__PURE__ */ jsx17(Summary, { value: restorePreview }),
+      !result ? /* @__PURE__ */ jsx17(Omissions, { omissions: restorePreview.omissions, accepted, onAccepted: setAccepted, verb: "Restore" }) : null,
+      !result ? /* @__PURE__ */ jsx17("p", { className: "px-1 text-xs text-muted-foreground", children: "Restored items start disabled and restricted." }) : /* @__PURE__ */ jsx17(VaultSection, { title: `${result.created} restored \xB7 ${result.replayed} already \xB7 ${result.refused} refused \xB7 ${result.retryable_failure} to retry`, children: result.results.map((r) => /* @__PURE__ */ jsx17(VaultRow, { label: names.get(r.source_item_id) ?? "Credential", children: /* @__PURE__ */ jsxs16("span", { className: r.status === "refused" || r.status === "retryable_failure" ? "text-destructive" : "text-foreground", children: [
         RECORD_STATUS[r.status],
         r.reason === "alias_conflict" ? " \xB7 name in use" : ""
       ] }) }, r.source_item_id)) })
     ] }) }),
-    /* @__PURE__ */ jsx16(ErrorLine, { message: error })
+    /* @__PURE__ */ jsx17(ErrorLine, { message: error })
   ] });
 }
 
@@ -3427,7 +3431,7 @@ import { useMemo, useState as useState18 } from "react";
 import { Button as Button14, Select as Select5 } from "@ai-matrx/design-system/controls";
 import { downloadFile as downloadFile2 } from "@ai-matrx/kit/download";
 import { confirm as confirm5 } from "@ai-matrx/kit/confirm-opener";
-import { Fragment as Fragment11, jsx as jsx17, jsxs as jsxs17 } from "react/jsx-runtime";
+import { Fragment as Fragment11, jsx as jsx18, jsxs as jsxs17 } from "react/jsx-runtime";
 var FORMATS = [
   { value: "matrx_login_csv_v1", label: "Matrx", hint: "Website logins, all common fields" },
   { value: "firefox_csv_v1", label: "Firefox", hint: "Address, username and password" },
@@ -3508,8 +3512,8 @@ function ExportPanel({ port, items, onClose }) {
       size: "lg",
       onClose,
       footer: /* @__PURE__ */ jsxs17(Fragment11, { children: [
-        /* @__PURE__ */ jsx17(Button14, { variant: "quiet", onClick: onClose, children: "Close" }),
-        preview ? /* @__PURE__ */ jsxs17(Button14, { variant: "primary", icon: /* @__PURE__ */ jsx17(ExportGlyph, { className: "size-4" }), disabled: busy || eligible === 0, onClick: () => void download(), children: [
+        /* @__PURE__ */ jsx18(Button14, { variant: "quiet", onClick: onClose, children: "Close" }),
+        preview ? /* @__PURE__ */ jsxs17(Button14, { variant: "primary", icon: /* @__PURE__ */ jsx18(ExportGlyph, { className: "size-4" }), disabled: busy || eligible === 0, onClick: () => void download(), children: [
           "Download ",
           eligible
         ] }) : /* @__PURE__ */ jsxs17(Button14, { variant: "primary", disabled: busy || selected.size === 0, onClick: () => void review(), children: [
@@ -3518,7 +3522,7 @@ function ExportPanel({ port, items, onClose }) {
         ] })
       ] }),
       children: [
-        /* @__PURE__ */ jsx17(VaultSection, { children: /* @__PURE__ */ jsx17(VaultRow, { label: "Format", hint: format?.hint, children: /* @__PURE__ */ jsx17(
+        /* @__PURE__ */ jsx18(VaultSection, { children: /* @__PURE__ */ jsx18(VaultRow, { label: "Format", hint: format?.hint, children: /* @__PURE__ */ jsx18(
           Select5,
           {
             value: profile,
@@ -3530,21 +3534,21 @@ function ExportPanel({ port, items, onClose }) {
             }
           }
         ) }) }),
-        /* @__PURE__ */ jsx17(
+        /* @__PURE__ */ jsx18(
           VaultSection,
           {
             title: `${selected.size} of ${plural(logins.length, "login")}`,
             actions: /* @__PURE__ */ jsxs17(Fragment11, { children: [
-              /* @__PURE__ */ jsx17(Button14, { variant: "quiet", disabled: busy || logins.length === 0, onClick: () => {
+              /* @__PURE__ */ jsx18(Button14, { variant: "quiet", disabled: busy || logins.length === 0, onClick: () => {
                 changed();
                 setSelected(new Set(logins.map((l) => l.id)));
               }, children: "All" }),
-              /* @__PURE__ */ jsx17(Button14, { variant: "quiet", disabled: busy || selected.size === 0, onClick: () => {
+              /* @__PURE__ */ jsx18(Button14, { variant: "quiet", disabled: busy || selected.size === 0, onClick: () => {
                 changed();
                 setSelected(/* @__PURE__ */ new Set());
               }, children: "None" })
             ] }),
-            children: logins.length === 0 ? /* @__PURE__ */ jsx17(Empty, { children: "No website logins to export." }) : /* @__PURE__ */ jsx17(
+            children: logins.length === 0 ? /* @__PURE__ */ jsx18(Empty, { children: "No website logins to export." }) : /* @__PURE__ */ jsx18(
               Windowed,
               {
                 items: logins,
@@ -3552,7 +3556,7 @@ function ExportPanel({ port, items, onClose }) {
                   const p = reasons.get(item.id);
                   const left = p && !p.eligible;
                   const omitted = p ? omissionText2(p.omissions) : "";
-                  return /* @__PURE__ */ jsx17(
+                  return /* @__PURE__ */ jsx18(
                     PickLine,
                     {
                       title: item.name,
@@ -3570,7 +3574,7 @@ function ExportPanel({ port, items, onClose }) {
             )
           }
         ),
-        /* @__PURE__ */ jsx17(ErrorLine, { message: error })
+        /* @__PURE__ */ jsx18(ErrorLine, { message: error })
       ]
     }
   );
@@ -4088,7 +4092,7 @@ import { BlobReader as BlobReader2, ZipReader as ZipReader2 } from "@zip.js/zip.
 var safe = (value) => Number.isSafeInteger(value) && value >= 0;
 var unsafeName = (name) => /[\\\0-\x1F\x7F-\x9F]/.test(name);
 function stopIfCancelled(signal) {
-  if (signal?.aborted) throw new Error("The archive import was cancelled.");
+  if (signal?.aborted) throw new Error("The archive import was canceled.");
 }
 function hasWarnings(reader, entry) {
   return Boolean(reader.warnings?.length || entry.warnings?.length);
@@ -4189,7 +4193,7 @@ async function openBoundedZip(file, limits, signal) {
     };
   } catch (error) {
     await reader.close();
-    if (signal?.aborted) throw new Error("The archive import was cancelled.");
+    if (signal?.aborted) throw new Error("The archive import was canceled.");
     throw error;
   }
 }
@@ -4228,7 +4232,7 @@ async function readDashlaneCsvArchive(file, limits, signal) {
     return { credentialsText, omittedCsvCount };
   } catch (error) {
     credentialsText = void 0;
-    if (signal?.aborted) throw new Error("The Dashlane import was cancelled.");
+    if (signal?.aborted) throw new Error("The Dashlane import was canceled.");
     throw error;
   } finally {
     credentialsText = void 0;
@@ -4363,7 +4367,7 @@ function hasValidStructuredImportFileNotices(value, maxCount) {
 }
 
 // src/io/parse-source.ts
-var cancelled = () => new Error("The import was cancelled.");
+var cancelled = () => new Error("The import was canceled.");
 function parseStructured(source, file, limits, signal) {
   const descriptor = structuredImportSource(source);
   if (!descriptor) return Promise.reject(new Error("This kind of file cannot be imported."));
@@ -4416,7 +4420,7 @@ async function parseImportFile(source, file, limits, signal) {
 }
 
 // src/io/ImportPanel.tsx
-import { Fragment as Fragment12, jsx as jsx18, jsxs as jsxs18 } from "react/jsx-runtime";
+import { Fragment as Fragment12, jsx as jsx19, jsxs as jsxs18 } from "react/jsx-runtime";
 var ROLE_OPTIONS = [
   { value: "keep", label: "Keep encrypted" },
   { value: "title", label: "Name" },
@@ -4592,25 +4596,25 @@ function ImportPanel({ port, host, items, organizations, onClose, onChanged, lim
   const stage = done ? "done" : draft ? "review" : "choose";
   const busy = running !== null || reading;
   const footer = stage === "choose" ? /* @__PURE__ */ jsxs18(Fragment12, { children: [
-    /* @__PURE__ */ jsx18(Button15, { variant: "quiet", onClick: onClose, children: "Close" }),
-    source === "env" ? /* @__PURE__ */ jsx18(Button15, { variant: "primary", icon: /* @__PURE__ */ jsx18(ImportGlyph, { className: "size-4" }), disabled: !envText.trim(), onClick: () => reviewEnv(envText), children: "Review" }) : null
+    /* @__PURE__ */ jsx19(Button15, { variant: "quiet", onClick: onClose, children: "Close" }),
+    source === "env" ? /* @__PURE__ */ jsx19(Button15, { variant: "primary", icon: /* @__PURE__ */ jsx19(ImportGlyph, { className: "size-4" }), disabled: !envText.trim(), onClick: () => reviewEnv(envText), children: "Review" }) : null
   ] }) : stage === "review" ? /* @__PURE__ */ jsxs18(Fragment12, { children: [
-    running ? /* @__PURE__ */ jsx18(Button15, { variant: "outline", onClick: () => stop.current = true, children: "Stop" }) : /* @__PURE__ */ jsx18(Button15, { variant: "quiet", onClick: reset, children: "Back" }),
-    /* @__PURE__ */ jsx18(Button15, { variant: "primary", icon: /* @__PURE__ */ jsx18(ImportGlyph, { className: "size-4" }), disabled: busy || chosen === 0 || ambiguous === true || needsApproval, onClick: start, children: running ? `Importing ${running.done} of ${running.total}` : `Import ${chosen}` })
+    running ? /* @__PURE__ */ jsx19(Button15, { variant: "outline", onClick: () => stop.current = true, children: "Stop" }) : /* @__PURE__ */ jsx19(Button15, { variant: "quiet", onClick: reset, children: "Back" }),
+    /* @__PURE__ */ jsx19(Button15, { variant: "primary", icon: /* @__PURE__ */ jsx19(ImportGlyph, { className: "size-4" }), disabled: busy || chosen === 0 || ambiguous === true || needsApproval, onClick: start, children: running ? `Importing ${running.done} of ${running.total}` : `Import ${chosen}` })
   ] }) : /* @__PURE__ */ jsxs18(Fragment12, { children: [
-    done && done.failed.length + done.untried.length > 0 ? /* @__PURE__ */ jsx18(Button15, { variant: "outline", disabled: busy, onClick: retry, children: running ? `Importing ${running.done} of ${running.total}` : `Try ${done.failed.length + done.untried.length} again` }) : null,
-    /* @__PURE__ */ jsx18(Button15, { variant: "primary", onClick: onClose, children: "Done" })
+    done && done.failed.length + done.untried.length > 0 ? /* @__PURE__ */ jsx19(Button15, { variant: "outline", disabled: busy, onClick: retry, children: running ? `Importing ${running.done} of ${running.total}` : `Try ${done.failed.length + done.untried.length} again` }) : null,
+    /* @__PURE__ */ jsx19(Button15, { variant: "primary", onClick: onClose, children: "Done" })
   ] });
   return /* @__PURE__ */ jsxs18(Panel, { title: "Import", size: "xl", onClose, footer, children: [
     stage === "choose" ? /* @__PURE__ */ jsxs18(VaultSection, { children: [
-      /* @__PURE__ */ jsx18(VaultRow, { label: "Source", actions: help && host.openUrl ? /* @__PURE__ */ jsx18(Button15, { variant: "quiet", onClick: () => host.openUrl?.(help), children: "How to export" }) : void 0, children: /* @__PURE__ */ jsx18(Select6, { value: source, options: SOURCE_OPTIONS, "aria-label": "Source", onValueChange: (s) => {
+      /* @__PURE__ */ jsx19(VaultRow, { label: "Source", actions: help && host.openUrl ? /* @__PURE__ */ jsx19(Button15, { variant: "quiet", onClick: () => host.openUrl?.(help), children: "How to export" }) : void 0, children: /* @__PURE__ */ jsx19(Select6, { value: source, options: SOURCE_OPTIONS, "aria-label": "Source", onValueChange: (s) => {
         setSource(s);
         setError(null);
       } }) }),
-      source === "env" ? /* @__PURE__ */ jsx18(VaultRow, { label: ".env text", hint: "Same key updates in place", top: true, children: /* @__PURE__ */ jsx18(Textarea2, { mono: true, rows: 7, value: envText, autoComplete: "off", spellCheck: false, "aria-label": ".env text", placeholder: "OPENAI_API_KEY=sk-...\nDATABASE_URL=postgres://...", onChange: (e) => setEnvText(e.target.value) }) }) : null,
+      source === "env" ? /* @__PURE__ */ jsx19(VaultRow, { label: ".env text", hint: "Same key updates in place", top: true, children: /* @__PURE__ */ jsx19(Textarea2, { mono: true, rows: 7, value: envText, autoComplete: "off", spellCheck: false, "aria-label": ".env text", placeholder: "OPENAI_API_KEY=sk-...\nDATABASE_URL=postgres://...", onChange: (e) => setEnvText(e.target.value) }) }) : null,
       /* @__PURE__ */ jsxs18(VaultRow, { label: "File", hint: fileName ?? void 0, children: [
-        /* @__PURE__ */ jsx18(Button15, { variant: "outline", disabled: reading, onClick: () => fileInput.current?.click(), children: reading ? "Reading\u2026" : source === "env" ? "Load a file" : "Choose a file" }),
-        /* @__PURE__ */ jsx18(
+        /* @__PURE__ */ jsx19(Button15, { variant: "outline", disabled: reading, onClick: () => fileInput.current?.click(), children: reading ? "Reading\u2026" : source === "env" ? "Load a file" : "Choose a file" }),
+        /* @__PURE__ */ jsx19(
           "input",
           {
             ref: fileInput,
@@ -4625,44 +4629,44 @@ function ImportPanel({ port, host, items, organizations, onClose, onChanged, lim
           }
         )
       ] }),
-      source === "env" ? /* @__PURE__ */ jsx18(VaultRow, { label: "Sandboxes", hint: "Pass these values to agent sandboxes", children: /* @__PURE__ */ jsx18(Switch4, { checked: injectSandbox, onCheckedChange: setInjectSandbox, "aria-label": "Use in sandboxes" }) }) : null
+      source === "env" ? /* @__PURE__ */ jsx19(VaultRow, { label: "Sandboxes", hint: "Pass these values to agent sandboxes", children: /* @__PURE__ */ jsx19(Switch4, { checked: injectSandbox, onCheckedChange: setInjectSandbox, "aria-label": "Use in sandboxes" }) }) : null
     ] }) : null,
     stage === "review" && draft ? /* @__PURE__ */ jsxs18(Fragment12, { children: [
-      organizations.length > 0 ? /* @__PURE__ */ jsx18(VaultSection, { children: /* @__PURE__ */ jsx18(VaultRow, { label: "Save to", children: /* @__PURE__ */ jsx18(Select6, { value: destination, options: destinationOptions, "aria-label": "Save to", onValueChange: (v) => draft.kind === "file" ? restart({ destination: v }) : setDestination(v) }) }) }) : null,
-      /* @__PURE__ */ jsx18(
+      organizations.length > 0 ? /* @__PURE__ */ jsx19(VaultSection, { children: /* @__PURE__ */ jsx19(VaultRow, { label: "Save to", children: /* @__PURE__ */ jsx19(Select6, { value: destination, options: destinationOptions, "aria-label": "Save to", onValueChange: (v) => draft.kind === "file" ? restart({ destination: v }) : setDestination(v) }) }) }) : null,
+      /* @__PURE__ */ jsx19(
         VaultSection,
         {
           title: draft.kind === "env" ? plural(envKeys.length, "value") : summary(counts, lines.length),
           actions: /* @__PURE__ */ jsxs18(Fragment12, { children: [
-            /* @__PURE__ */ jsx18(Button15, { variant: "quiet", disabled: busy, onClick: () => setSelected(draft.kind === "env" ? new Set(envKeys.map((e) => e.key + e.text)) : defaultSelection(lines)), children: "Reset" }),
-            /* @__PURE__ */ jsx18(Button15, { variant: "quiet", disabled: busy, onClick: () => setSelected(/* @__PURE__ */ new Set()), children: "None" })
+            /* @__PURE__ */ jsx19(Button15, { variant: "quiet", disabled: busy, onClick: () => setSelected(draft.kind === "env" ? new Set(envKeys.map((e) => e.key + e.text)) : defaultSelection(lines)), children: "Reset" }),
+            /* @__PURE__ */ jsx19(Button15, { variant: "quiet", disabled: busy, onClick: () => setSelected(/* @__PURE__ */ new Set()), children: "None" })
           ] }),
-          children: draft.kind === "env" ? /* @__PURE__ */ jsx18(
+          children: draft.kind === "env" ? /* @__PURE__ */ jsx19(
             Windowed,
             {
               items: envKeys,
               render: (e) => {
                 const id = e.key + e.text;
-                return /* @__PURE__ */ jsx18(PickLine, { title: e.key, detail: "Value hidden", checked: selected.has(id), disabled: busy, onChange: (on) => toggle(setSelected, id, on) }, id);
+                return /* @__PURE__ */ jsx19(PickLine, { title: e.key, detail: "Value hidden", checked: selected.has(id), disabled: busy, onChange: (on) => toggle(setSelected, id, on) }, id);
               }
             }
-          ) : lines.length === 0 ? /* @__PURE__ */ jsx18(Empty, { children: "Nothing to import in this file." }) : /* @__PURE__ */ jsx18(
+          ) : lines.length === 0 ? /* @__PURE__ */ jsx19(Empty, { children: "Nothing to import in this file." }) : /* @__PURE__ */ jsx19(
             Windowed,
             {
               items: lines,
               render: (l) => {
                 const badge = STATE_BADGE[l.state];
-                return /* @__PURE__ */ jsx18(PickLine, { title: l.title, detail: l.reason ?? l.detail, checked: selected.has(l.key), disabled: busy || !selectable(l), badge: badge?.text, tone: badge?.tone, onChange: (on) => toggle(setSelected, l.key, on) }, l.key);
+                return /* @__PURE__ */ jsx19(PickLine, { title: l.title, detail: l.reason ?? l.detail, checked: selected.has(l.key), disabled: busy || !selectable(l), badge: badge?.text, tone: badge?.tone, onChange: (on) => toggle(setSelected, l.key, on) }, l.key);
               }
             }
           )
         }
       ),
-      draft.kind === "file" && draft.parsed.kind === "structured" ? /* @__PURE__ */ jsx18(VaultSection, { children: /* @__PURE__ */ jsx18(VaultRow, { label: "Visible details", hint: "Approve saving websites and public keys in the clear", children: /* @__PURE__ */ jsx18(Switch4, { checked: approvedVisible, disabled: busy, onCheckedChange: setApprovedVisible, "aria-label": "Approve visible details" }) }) }) : null,
-      draft.kind === "file" ? /* @__PURE__ */ jsx18(Notices, { draft }) : null,
-      draft.kind === "file" ? /* @__PURE__ */ jsx18(More, { children: /* @__PURE__ */ jsxs18(VaultSection, { children: [
-        /* @__PURE__ */ jsx18(VaultRow, { label: "Browser fill", hint: "Needs username, password and an https address", children: /* @__PURE__ */ jsx18(Switch4, { checked: browserFill, disabled: busy, onCheckedChange: (on) => restart({ browserFill: on }), "aria-label": "Browser fill" }) }),
-        draft.parsed.kind === "csv" ? draft.parsed.preview.headers.map((header, index) => /* @__PURE__ */ jsx18(VaultRow, { label: header || `Column ${index + 1}`, children: /* @__PURE__ */ jsx18(
+      draft.kind === "file" && draft.parsed.kind === "structured" ? /* @__PURE__ */ jsx19(VaultSection, { children: /* @__PURE__ */ jsx19(VaultRow, { label: "Visible details", hint: "Approve saving websites and public keys in the clear", children: /* @__PURE__ */ jsx19(Switch4, { checked: approvedVisible, disabled: busy, onCheckedChange: setApprovedVisible, "aria-label": "Approve visible details" }) }) }) : null,
+      draft.kind === "file" ? /* @__PURE__ */ jsx19(Notices, { draft }) : null,
+      draft.kind === "file" ? /* @__PURE__ */ jsx19(More, { children: /* @__PURE__ */ jsxs18(VaultSection, { children: [
+        /* @__PURE__ */ jsx19(VaultRow, { label: "Browser fill", hint: "Needs username, password and an https address", children: /* @__PURE__ */ jsx19(Switch4, { checked: browserFill, disabled: busy, onCheckedChange: (on) => restart({ browserFill: on }), "aria-label": "Browser fill" }) }),
+        draft.parsed.kind === "csv" ? draft.parsed.preview.headers.map((header, index) => /* @__PURE__ */ jsx19(VaultRow, { label: header || `Column ${index + 1}`, children: /* @__PURE__ */ jsx19(
           Select6,
           {
             value: draft.mapping[index] ?? "keep",
@@ -4672,20 +4676,20 @@ function ImportPanel({ port, host, items, organizations, onClose, onChanged, lim
           }
         ) }, `${header}-${index}`)) : null
       ] }) }) : null,
-      ambiguous ? /* @__PURE__ */ jsx18(ErrorLine, { message: "Each of name, username, password, notes and one-time password can be used by one column." }) : null
+      ambiguous ? /* @__PURE__ */ jsx19(ErrorLine, { message: "Each of name, username, password, notes and one-time password can be used by one column." }) : null
     ] }) : null,
     stage === "done" && done ? /* @__PURE__ */ jsxs18(VaultSection, { title: "Result", children: [
-      /* @__PURE__ */ jsx18(VaultRow, { label: "Created", children: /* @__PURE__ */ jsx18("span", { className: "text-foreground", children: done.created.length }) }),
-      /* @__PURE__ */ jsx18(VaultRow, { label: "Skipped", children: /* @__PURE__ */ jsx18("span", { className: "text-foreground", children: done.skipped }) }),
-      /* @__PURE__ */ jsx18(VaultRow, { label: "Failed", children: /* @__PURE__ */ jsx18("span", { className: done.failed.length > 0 ? "text-destructive" : "text-foreground", children: done.failed.length }) }),
-      done.untried.length > 0 ? /* @__PURE__ */ jsx18(VaultRow, { label: "Not tried", children: /* @__PURE__ */ jsx18("span", { className: "text-foreground", children: done.untried.length }) }) : null,
-      done.withOtp > 0 ? /* @__PURE__ */ jsx18(VaultRow, { label: "Codes", children: /* @__PURE__ */ jsxs18("span", { className: "text-muted-foreground", children: [
+      /* @__PURE__ */ jsx19(VaultRow, { label: "Created", children: /* @__PURE__ */ jsx19("span", { className: "text-foreground", children: done.created.length }) }),
+      /* @__PURE__ */ jsx19(VaultRow, { label: "Skipped", children: /* @__PURE__ */ jsx19("span", { className: "text-foreground", children: done.skipped }) }),
+      /* @__PURE__ */ jsx19(VaultRow, { label: "Failed", children: /* @__PURE__ */ jsx19("span", { className: done.failed.length > 0 ? "text-destructive" : "text-foreground", children: done.failed.length }) }),
+      done.untried.length > 0 ? /* @__PURE__ */ jsx19(VaultRow, { label: "Not tried", children: /* @__PURE__ */ jsx19("span", { className: "text-foreground", children: done.untried.length }) }) : null,
+      done.withOtp > 0 ? /* @__PURE__ */ jsx19(VaultRow, { label: "Codes", children: /* @__PURE__ */ jsxs18("span", { className: "text-muted-foreground", children: [
         plural(done.withOtp, "login"),
         " still need the one-time password added."
       ] }) }) : null,
-      done.failed.map((f) => /* @__PURE__ */ jsx18(VaultRow, { label: f.title, children: /* @__PURE__ */ jsx18("span", { className: "block truncate text-destructive", title: f.reason, children: f.reason }) }, f.key))
+      done.failed.map((f) => /* @__PURE__ */ jsx19(VaultRow, { label: f.title, children: /* @__PURE__ */ jsx19("span", { className: "block truncate text-destructive", title: f.reason, children: f.reason }) }, f.key))
     ] }) : null,
-    /* @__PURE__ */ jsx18(ErrorLine, { message: error })
+    /* @__PURE__ */ jsx19(ErrorLine, { message: error })
   ] });
 }
 function toggle(set, key, on) {
@@ -4712,7 +4716,7 @@ function Notices({ draft }) {
     }
   }
   if (notes.length === 0) return null;
-  return /* @__PURE__ */ jsx18("div", { className: "flex flex-col gap-0.5 px-1 text-xs text-muted-foreground", children: notes.map((n) => /* @__PURE__ */ jsx18("span", { children: n }, n)) });
+  return /* @__PURE__ */ jsx19("div", { className: "flex flex-col gap-0.5 px-1 text-xs text-muted-foreground", children: notes.map((n) => /* @__PURE__ */ jsx19("span", { children: n }, n)) });
 }
 
 // src/ItemList.tsx
@@ -4721,20 +4725,6 @@ import { DropdownMenu as DropdownMenu4, DropdownMenuContent as DropdownMenuConte
 import { cn as cn13 } from "@ai-matrx/design-system";
 import { Button as Button22, SearchField } from "@ai-matrx/design-system/controls";
 
-// src/ItemIcon.tsx
-import { cn as cn8 } from "@ai-matrx/design-system";
-import { jsx as jsx19 } from "react/jsx-runtime";
-function ItemIcon({ definitionKey, family, site, size = "md", inverted = false }) {
-  const box = size === "lg" ? "size-10 rounded-xl text-base" : size === "md" ? "size-8 rounded-lg text-sm" : "size-6 rounded-md text-xs";
-  const tone = inverted ? "bg-primary-foreground text-primary" : "bg-muted text-foreground";
-  const initial = siteDomainOf(site).charAt(0).toUpperCase();
-  if (initial && /[A-Z0-9]/.test(initial)) {
-    return /* @__PURE__ */ jsx19("span", { "aria-hidden": true, className: cn8("flex shrink-0 items-center justify-center font-semibold", box, tone), children: initial });
-  }
-  const Glyph = definitionGlyph(definitionKey, family);
-  return /* @__PURE__ */ jsx19("span", { "aria-hidden": true, className: cn8("flex shrink-0 items-center justify-center", box, tone), children: /* @__PURE__ */ jsx19(Glyph, { className: size === "lg" ? "size-5" : "size-4" }) });
-}
-
 // src/ItemPane.tsx
 import { useEffect as useEffect16, useMemo as useMemo3, useRef as useRef14, useState as useState26 } from "react";
 import { DropdownMenu as DropdownMenu3, DropdownMenuContent as DropdownMenuContent3, DropdownMenuItem as DropdownMenuItem3, DropdownMenuSeparator as DropdownMenuSeparator3, DropdownMenuTrigger as DropdownMenuTrigger3 } from "@ai-matrx/design-system";
@@ -5657,6 +5647,8 @@ function ItemPane(props) {
   const [tagsText, setTagsText] = useState26(base.tags.join(", "));
   const [showTags, setShowTags] = useState26(false);
   const [showDescription, setShowDescription] = useState26(false);
+  const [showRecovery, setShowRecovery] = useState26(false);
+  const [settingUpOtp, setSettingUpOtp] = useState26(false);
   const [owner, setOwner] = useState26(defaultOwner ?? "me");
   const [recipient, setRecipient] = useState26("");
   const [generatePrivately, setGeneratePrivately] = useState26(false);
@@ -5685,6 +5677,7 @@ function ItemPane(props) {
     setLoaded({});
     setShowTags(false);
     setShowDescription(false);
+    setShowRecovery(false);
   }, [item?.id, mode]);
   useEffect16(() => onDirty(dirty), [dirty, onDirty]);
   const keepKey = draftKey(item?.id ?? null, definition?.key ?? item?.definitionKey ?? null);
@@ -5712,23 +5705,24 @@ function ItemPane(props) {
     setBusy(true);
     setError(null);
     const out = { ...draft, values: Object.fromEntries(changedValues(base, draft)) };
+    if (out.values[RECOVERY_CODES_KEY] !== void 0) out.values[RECOVERY_CODES_KEY] = parseRecoveryCodes(out.values[RECOVERY_CODES_KEY]).join("\n");
     const withOtp = async (saved, notice2) => {
       const setup = out.authenticator.trim();
-      if (!setup) return [saved, notice2];
+      if (!setup) return [saved, notice2, false];
       try {
         await confirmed(() => port.authenticator.enrol(saved, setup));
-        return [await port.get(saved), notice2];
+        return [await port.get(saved), notice2, true];
       } catch (e) {
         const why = wasCancelled(e) ? "it was not confirmed" : e instanceof Error ? e.message : "it was refused";
-        return [saved, `Saved, but the one-time password was not set up: ${why}. Add it with Edit.`];
+        return [saved, `Saved, but the authenticator was not set up: ${why}. Add it with Edit.`, false];
       }
     };
     try {
       if (item) {
         const r = await port.save(item, definition, out);
-        const [next, n] = await withOtp(r.item, r.notice);
+        const [next, n, enrolled] = await withOtp(r.item, r.notice);
         dropKeptDraft(keepKey);
-        onSaved(next, false, n);
+        onSaved(next, false, n, enrolled);
       } else if (definition && owner === "person") {
         const secretKey = declared.find((f) => f.storage === "encrypted" && f.kind === "secret")?.key ?? null;
         const r = await port.sharing.assign({ recipientEmail: recipient.trim(), definition, draft: out, generateFieldKey: generatePrivately ? secretKey : null });
@@ -5736,9 +5730,9 @@ function ItemPane(props) {
         onCancelNew();
       } else if (definition) {
         const r = await port.create(definition, owner === "me" ? null : owner, out);
-        const [next, n] = await withOtp(r.item, r.notice);
+        const [next, n, enrolled] = await withOtp(r.item, r.notice);
         dropKeptDraft(keepKey);
-        onSaved(next, true, n);
+        onSaved(next, true, n, enrolled);
       }
     } catch (e) {
       setError(e instanceof Error ? e.message : "Saving failed. Nothing was changed.");
@@ -5797,6 +5791,10 @@ function ItemPane(props) {
   const viewCustom = (item?.custom ?? []).filter((c) => !declaredKeys.has(c.key) && c.key !== MFA_METHOD_KEY && !isAuthenticatorStorage(c.key));
   const isLogin = (item?.definitionKey ?? definition?.key) === "website_login" || (item?.definitionKey ?? definition?.key) === "username_password";
   const typeLabel = definition?.label ?? item?.definitionLabel ?? "";
+  const recoveryDeclared = declaredKeys.has(RECOVERY_CODES_KEY);
+  const recoveryExtra = extraFields.some(isRecoveryCodesField);
+  const offerRecovery = isLogin || Boolean(item?.authenticator) || draft.authenticator.trim() !== "";
+  const recoveryEditing = !recoveryDeclared && !recoveryExtra && (showRecovery || (draft.values[RECOVERY_CODES_KEY] ?? "") !== "");
   const shownOwner = mode === "new" ? owner === "me" ? { label: "Personal", glyph: /* @__PURE__ */ jsx26(PersonGlyph, {}) } : owner === "person" ? { label: "Someone else", glyph: /* @__PURE__ */ jsx26(SendGlyph, {}) } : { label: organizations.find((o) => o.id === owner)?.name ?? "Organization", glyph: /* @__PURE__ */ jsx26(BuildingGlyph, {}) } : item ? { label: item.owner.label, glyph: item.owner.kind === "me" ? /* @__PURE__ */ jsx26(PersonGlyph, {}) : item.owner.kind === "organization" ? /* @__PURE__ */ jsx26(BuildingGlyph, {}) : /* @__PURE__ */ jsx26(UsersIcon2, {}) } : null;
   const sameNamed = (id) => {
     const name = organizations.find((o) => o.id === id)?.name.trim().toLowerCase();
@@ -5944,7 +5942,8 @@ function ItemPane(props) {
             label: f.label,
             value: draft.values[f.key] ?? "",
             placeholder: f.handling === "visible" || f.key in loaded ? "" : "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022",
-            secret: f.handling !== "visible",
+            secret: f.handling !== "visible" && !isRecoveryCodesField(f),
+            multiline: isRecoveryCodesField(f),
             onChange: (v) => setValue(f.key, v),
             onRemove: () => patch({ removed: [...draft.removed, f.id] }),
             removeLabel: `Delete ${f.label}`,
@@ -5981,7 +5980,27 @@ function ItemPane(props) {
         )),
         /* @__PURE__ */ jsx26(AddRow, { label: draft.loginUrls.length === 0 ? "Website" : "", onAdd: () => patch({ loginUrls: [...draft.loginUrls, ""] }), children: draft.loginUrls.length === 0 ? "Add website" : "Add another website" }),
         /* @__PURE__ */ jsx26(TotpEditRow, { value: draft.authenticator, onChange: (v) => patch({ authenticator: v }), hasExisting: Boolean(item?.authenticator || seedField), item, port, onEnrolled: onChanged }),
-        item && isLogin && !item.authenticator ? /* @__PURE__ */ jsx26(TwoFactorMethodRow, { port, item, onChanged }) : null
+        item && isLogin && !item.authenticator ? /* @__PURE__ */ jsx26(TwoFactorMethodRow, { port, item, onChanged }) : null,
+        recoveryEditing ? /* @__PURE__ */ jsx26(
+          EditRow,
+          {
+            label: "Recovery codes",
+            value: draft.values[RECOVERY_CODES_KEY] ?? "",
+            multiline: true,
+            autoFocus: showRecovery && (draft.values[RECOVERY_CODES_KEY] ?? "") === "",
+            placeholder: "Backup codes, one per line",
+            onChange: (v) => setValue(RECOVERY_CODES_KEY, v),
+            onRemove: () => {
+              setShowRecovery(false);
+              setDraft((d) => {
+                const values = { ...d.values };
+                delete values[RECOVERY_CODES_KEY];
+                return { ...d, values };
+              });
+            },
+            removeLabel: "Remove recovery codes"
+          }
+        ) : !recoveryDeclared && !recoveryExtra && offerRecovery ? /* @__PURE__ */ jsx26(AddRow, { label: "Recovery codes", onAdd: () => setShowRecovery(true), children: "Add backup codes" }) : null
       ] }),
       /* @__PURE__ */ jsx26(VaultSection, { children: /* @__PURE__ */ jsx26(EditRow, { label: "Notes", value: draft.notes, multiline: true, placeholder: "Anything worth remembering", onChange: (v) => patch({ notes: v }) }) }),
       /* @__PURE__ */ jsxs24(
@@ -5994,7 +6013,8 @@ function ItemPane(props) {
               /* @__PURE__ */ jsx26(DropdownMenuItem3, { onSelect: () => patch({ secrets: [...draft.secrets, { key: "", label: "", value: "" }] }), children: "Secret field" }),
               /* @__PURE__ */ jsx26(DropdownMenuItem3, { onSelect: () => patch({ custom: [...draft.custom, { key: `custom_${draft.custom.length + 1}_${Date.now() % 1e5}`, label: "", value: "" }] }), children: "Text field" }),
               !tagsVisible ? /* @__PURE__ */ jsx26(DropdownMenuItem3, { onSelect: () => setShowTags(true), children: "Tags" }) : null,
-              !descriptionVisible ? /* @__PURE__ */ jsx26(DropdownMenuItem3, { onSelect: () => setShowDescription(true), children: "Description" }) : null
+              !descriptionVisible ? /* @__PURE__ */ jsx26(DropdownMenuItem3, { onSelect: () => setShowDescription(true), children: "Description" }) : null,
+              !recoveryDeclared && !recoveryExtra && !recoveryEditing ? /* @__PURE__ */ jsx26(DropdownMenuItem3, { onSelect: () => setShowRecovery(true), children: "Recovery codes" }) : null
             ] })
           ] }),
           children: [
@@ -6034,8 +6054,9 @@ function ItemPane(props) {
         item.authenticator ? /* @__PURE__ */ jsx26(TotpRow, { port, item, onChanged }) : seedField && !seedField.active ? (
           // The secret is still there, only off: turning it on brings the codes back. Never "Set up",
           // which would invite replacing a working two-factor secret.
-          /* @__PURE__ */ jsx26(VaultRow, { label: "One-time password", actions: canTurnOn ? /* @__PURE__ */ jsx26(TurnOnButton, { label: "One-time password", onTurnOn: () => turnOn([seedField]) }) : null, children: /* @__PURE__ */ jsx26("span", { className: "text-muted-foreground", children: "Turned off" }) })
-        ) : /* @__PURE__ */ jsx26(AddRow, { label: "One-time password", onAdd: canEdit ? () => onMode("edit") : null, children: "Set up" }),
+          /* @__PURE__ */ jsx26(VaultRow, { label: "Authenticator", actions: canTurnOn ? /* @__PURE__ */ jsx26(TurnOnButton, { label: "Authenticator", onTurnOn: () => turnOn([seedField]) }) : null, children: /* @__PURE__ */ jsx26("span", { className: "text-muted-foreground", children: "Turned off" }) })
+        ) : /* @__PURE__ */ jsx26(AddRow, { label: "Authenticator", onAdd: canEdit ? () => setSettingUpOtp(true) : null, children: "Set up" }),
+        !recoveryDeclared && !recoveryExtra && offerRecovery ? /* @__PURE__ */ jsx26(RecoveryCodesRow, { item, field: null, port, onChanged }) : null,
         !item.authenticator && item.custom.some((c) => c.key === MFA_METHOD_KEY && c.value) ? /* @__PURE__ */ jsx26(TwoFactorMethodRow, { port, item, onChanged }) : null
       ] }),
       /* @__PURE__ */ jsx26(VaultSection, { children: item.notes ? /* @__PURE__ */ jsx26(PlainRow, { label: "Notes", value: item.notes, multiline: true }) : /* @__PURE__ */ jsx26(AddRow, { label: "Notes", onAdd: canEdit ? () => onMode("edit") : null, children: "Add notes" }) }),
@@ -6051,7 +6072,22 @@ function ItemPane(props) {
         " \xB7 Created ",
         formatAbsoluteDate3(item.createdAt, DAY_FORMAT, "")
       ] })
-    ] }) : null }) })
+    ] }) : null }) }),
+    settingUpOtp && item ? /* @__PURE__ */ jsx26(
+      AddOtpPanel,
+      {
+        port,
+        items: [item],
+        definitions: definition ? [definition] : [],
+        itemId: item.id,
+        onClose: () => setSettingUpOtp(false),
+        onChanged: () => onChanged(),
+        onDone: () => {
+          setSettingUpOtp(false);
+          onChanged();
+        }
+      }
+    ) : null
   ] }) });
 }
 
@@ -6989,7 +7025,7 @@ var plural2 = (n, one) => `${n} ${one}${n === 1 ? "" : "s"}`;
 function terminalMessage(s) {
   if (s.phase === "completed") return `Imported ${plural2(s.committed, "passkey")}.`;
   if (s.phase === "partial") return `${s.committed} imported; ${s.unsupported + s.failed + s.uncertain + s.not_attempted} need attention.`;
-  if (s.phase === "cancelled") return "Import cancelled. Nothing else will be imported.";
+  if (s.phase === "cancelled") return "Import canceled. Nothing else will be imported.";
   if (s.phase === "unavailable") return "Passkey import is unavailable here.";
   if (s.phase === "failed") return "The import did not finish. Recover it before using a new file.";
   return s.message;
@@ -7174,7 +7210,7 @@ function useNativeImport(bridge, stillAllowed, onImported) {
       present(g, { kind: "status", status: result, message: terminalMessage(result) });
       if (!done && ACTIVE_PHASES.has(result.phase)) schedulePoll(active.id);
     } catch (e) {
-      keepOperation(g, fail(e, "The import could not be cancelled."));
+      keepOperation(g, fail(e, "The import could not be canceled."));
     } finally {
       if (current(g)) setBusy(false);
     }
@@ -7660,6 +7696,7 @@ import { cn as cn15, useLook as useLook2 } from "@ai-matrx/design-system";
 import { Select as Select10 } from "@ai-matrx/design-system/controls";
 import { GlobeIcon as GlobeIcon5 } from "@ai-matrx/design-system/icons";
 import { jsx as jsx38, jsxs as jsxs36 } from "react/jsx-runtime";
+var AUTHENTICATOR_LABEL = "Authenticator";
 function vaultChoices(items, organizations, current) {
   const n = (f) => items.filter(f).length;
   const shared = n((i) => i.owner.kind === "shared");
@@ -7699,7 +7736,7 @@ function buildViews(items, definitions, favoriteIds2, recentIds2) {
 function viewLabel(view, views) {
   if (view === "favorites") return "Favorites";
   if (view === "recent") return "Recently opened";
-  if (view === "authenticator") return "One-time passwords";
+  if (view === "authenticator") return AUTHENTICATOR_LABEL;
   if (view === "trash") return "Trash";
   if (view === "page") return "This page";
   return [...views.categories, ...views.tags].find((v) => v.view === view)?.label ?? "All items";
@@ -7710,7 +7747,7 @@ function viewOptions(views, allCount, deletedCount, hasFavorites, hasRecents, ha
     { value: "all", label: "Every category", meta: String(allCount) },
     ...hasFavorites ? [{ value: "favorites", label: "Favorites", meta: views.favorites === void 0 ? "" : String(views.favorites) }] : [],
     ...hasRecents ? [{ value: "recent", label: "Recently opened", meta: views.recent === void 0 ? "" : String(views.recent) }] : [],
-    { value: "authenticator", label: "One-time passwords", meta: String(views.authenticator) },
+    { value: "authenticator", label: AUTHENTICATOR_LABEL, meta: String(views.authenticator) },
     ...views.categories.map((v) => ({ value: v.view, label: v.label, meta: String(v.count) })),
     ...views.tags.map((v) => ({ value: v.view, label: `#${v.label}`, meta: String(v.count) })),
     { value: "trash", label: "Trash", meta: String(deletedCount) }
@@ -7752,7 +7789,7 @@ function VaultSidebar({ vault, choices, onVault, view, allCount, deletedCount, v
         /* @__PURE__ */ jsx38(Entry, { on: view === "all", glyph: GridGlyph, label: "All items", count: allCount, onClick: () => onView("all") }),
         hasFavorites ? /* @__PURE__ */ jsx38(Entry, { on: view === "favorites", glyph: StarGlyph, label: "Favorites", count: views.favorites, onClick: () => onView("favorites") }) : null,
         hasRecents ? /* @__PURE__ */ jsx38(Entry, { on: view === "recent", glyph: ClockGlyph, label: "Recently opened", count: views.recent, onClick: () => onView("recent") }) : null,
-        /* @__PURE__ */ jsx38(Entry, { on: view === "authenticator", glyph: LockGlyph, label: "One-time passwords", count: views.authenticator, onClick: () => onView("authenticator") })
+        /* @__PURE__ */ jsx38(Entry, { on: view === "authenticator", glyph: LockGlyph, label: AUTHENTICATOR_LABEL, count: views.authenticator, onClick: () => onView("authenticator") })
       ] }),
       views.categories.length > 0 ? /* @__PURE__ */ jsx38(Group, { title: "Categories", children: views.categories.map((e) => /* @__PURE__ */ jsx38(Entry, { on: view === e.view, glyph: e.glyph, label: e.label, count: e.count, onClick: () => onView(e.view) }, e.view)) }) : null,
       views.tags.length > 0 ? /* @__PURE__ */ jsxs36("div", { className: "flex flex-col gap-0.5", children: [
@@ -7859,6 +7896,7 @@ function Workspace({ port, host = NO_HOST, layout = "auto", location, onLocation
   const loc = location ?? inner;
   const dirty = useRef19(false);
   const [notice, setNotice] = useState40(null);
+  const [firstCode, setFirstCode] = useState40(null);
   const move = useCallback5(
     (next, how) => {
       if (!location) setInner(next);
@@ -7998,9 +8036,21 @@ function Workspace({ port, host = NO_HOST, layout = "auto", location, onLocation
   }
   const hasFavorites = port.lists.favorites !== void 0;
   const title = loc.vault === "all" && loc.view === "all" ? "All items" : viewLabel(loc.view, views);
-  const compactHeader = mode === "full" ? void 0 : /* @__PURE__ */ jsxs37("div", { className: "grid grid-cols-[minmax(0,1fr)_minmax(0,1fr)_auto] gap-2", children: [
+  const compactHeader = mode === "full" ? void 0 : /* @__PURE__ */ jsxs37("div", { className: "grid grid-cols-[minmax(0,1fr)_minmax(0,1fr)_auto_auto] gap-2", children: [
     /* @__PURE__ */ jsx39(VaultSelect, { value: loc.vault, choices, onChange: (vault) => go({ vault, itemId: null, panel: null }) }),
     /* @__PURE__ */ jsx39(Select11, { value: loc.view, onValueChange: (view) => go({ view, itemId: null, panel: null }), options: viewOptions(views, inThisVault.length, deleted.length, hasFavorites, port.lists.recents !== void 0, host.page !== void 0), "aria-label": "Show" }),
+    /* @__PURE__ */ jsx39(
+      Button33,
+      {
+        variant: loc.view === "authenticator" ? "outline" : "quiet",
+        icon: /* @__PURE__ */ jsx39(LockGlyph, {}),
+        "aria-label": AUTHENTICATOR_LABEL,
+        "aria-pressed": loc.view === "authenticator",
+        title: AUTHENTICATOR_LABEL,
+        onClick: () => go({ view: loc.view === "authenticator" ? "all" : "authenticator", itemId: null, mode: "view", panel: null }),
+        children: mode === "split" ? AUTHENTICATOR_LABEL : null
+      }
+    ),
     /* @__PURE__ */ jsxs37(DropdownMenu6, { children: [
       /* @__PURE__ */ jsx39(DropdownMenuTrigger6, { asChild: true, children: /* @__PURE__ */ jsx39(Button33, { variant: "quiet", icon: /* @__PURE__ */ jsx39(MoreGlyph, {}), "aria-label": "Vault actions" }) }),
       /* @__PURE__ */ jsxs37(DropdownMenuContent6, { align: "end", children: [
@@ -8101,9 +8151,10 @@ function Workspace({ port, host = NO_HOST, layout = "auto", location, onLocation
         seed: { name: guess?.name ?? "", url: guess?.url ?? loc.url.trim() },
         onBack: () => go({ kind: null }),
         onMode: () => void 0,
-        onSaved: (item, _wasNew, n) => {
+        onSaved: (item, _wasNew, n, enrolled) => {
           replaceItem(item);
           dirty.current = false;
+          if (enrolled) setFirstCode(item);
           move({ ...loc, itemId: item.id, mode: "view", kind: null, url: "", panel: null }, "replace");
           setNotice(n);
           notify("Saved");
@@ -8132,9 +8183,10 @@ function Workspace({ port, host = NO_HOST, layout = "auto", location, onLocation
         onBack: back,
         onMode: (m) => go({ mode: m, panel: null }),
         notice,
-        onSaved: (item, _wasNew, n) => {
+        onSaved: (item, _wasNew, n, enrolled) => {
           replaceItem(item);
           dirty.current = false;
+          if (enrolled) setFirstCode(item);
           move({ ...loc, mode: "view" }, "replace");
           setNotice(n);
           notify("Saved");
@@ -8232,7 +8284,8 @@ function Workspace({ port, host = NO_HOST, layout = "auto", location, onLocation
       ) : null,
       shown.list ? /* @__PURE__ */ jsx39("div", { className: specialView && mode !== "stack" ? "col-span-2 min-h-0" : "min-h-0", children: list }) : null,
       shown.detail ? detail : null,
-      panel
+      panel,
+      firstCode ? /* @__PURE__ */ jsx39(FirstCodePanel, { port, item: firstCode, onClose: () => setFirstCode(null), onDone: () => setFirstCode(null) }) : null
     ] })
   ] });
 }
@@ -9003,7 +9056,9 @@ function createApiVaultPort(api, options = {}) {
           non_secret_fields: [...meta.map((f) => ({ key: f.key, label: f.label, value: draft.values[f.key] ?? "" })), ...draft.custom.filter((c) => c.label.trim() !== "").map((c) => ({ key: c.key || fieldKeyOf(c.label), label: c.label, value: c.value }))],
           fields: [
             ...encrypted.map((f) => ({ field_key: f.key, value: draft.values[f.key] ?? "", handling: f.handling })),
-            ...draft.secrets.filter((s) => s.label.trim() !== "" && s.value !== "").map((s) => ({ field_key: fieldKeyOf(s.label), value: s.value, handling: "revealable" }))
+            ...draft.secrets.filter((s) => s.label.trim() !== "" && s.value !== "").map((s) => ({ field_key: fieldKeyOf(s.label), value: s.value, handling: "revealable" })),
+            // Backup codes on a type that does not declare them (a website login): their own encrypted field.
+            ...!declared.some((f) => f.key === RECOVERY_CODES_KEY) && (draft.values[RECOVERY_CODES_KEY] ?? "").trim() !== "" ? [{ field_key: RECOVERY_CODES_KEY, value: parseRecoveryCodes(draft.values[RECOVERY_CODES_KEY] ?? "").join("\n"), handling: "revealable", description: "One-time account recovery codes" }] : []
           ]
         }
       }, organizationId ? { organizationId } : void 0);