From 5176efbbe44f4cdef3dfd35a5e70bae16150a748 Mon Sep 17 00:00:00 2001
From: drewstone <drewstone329@gmail.com>
Date: Thu, 7 May 2026 00:17:09 +0200
Subject: [PATCH] feat(tangle-cloud): sandboxed iframe blueprint apps (#3175)

---
 apps/tangle-cloud/netlify.toml                |  25 ++
 .../components/BlueprintAppFrame.tsx          |  72 +++++
 .../components/BlueprintAppFrameHost.tsx      |  40 +++
 .../components/BlueprintAppLandingPage.tsx    |  21 +-
 .../components/IframeAppApprovalModal.tsx     | 212 ++++++++++++
 .../src/blueprintApps/iframe/manifest.spec.ts |  78 +++++
 .../src/blueprintApps/iframe/manifest.ts      | 135 ++++++++
 .../src/blueprintApps/iframe/origin.spec.ts   |  80 +++++
 .../src/blueprintApps/iframe/origin.ts        |  39 +++
 .../src/blueprintApps/iframe/policy.spec.ts   | 124 +++++++
 .../src/blueprintApps/iframe/policy.ts        | 142 ++++++++
 .../src/blueprintApps/iframe/protocol.spec.ts | 126 ++++++++
 .../src/blueprintApps/iframe/protocol.ts      | 214 ++++++++++++
 .../src/blueprintApps/iframe/types.ts         |  35 ++
 .../blueprintApps/iframe/useIframeBridge.ts   | 304 ++++++++++++++++++
 .../src/blueprintApps/manifest.ts             | 138 +++++---
 apps/tangle-cloud/src/blueprintApps/policy.ts |  51 +++
 17 files changed, 1796 insertions(+), 40 deletions(-)
 create mode 100644 apps/tangle-cloud/src/blueprintApps/components/BlueprintAppFrame.tsx
 create mode 100644 apps/tangle-cloud/src/blueprintApps/components/BlueprintAppFrameHost.tsx
 create mode 100644 apps/tangle-cloud/src/blueprintApps/components/IframeAppApprovalModal.tsx
 create mode 100644 apps/tangle-cloud/src/blueprintApps/iframe/manifest.spec.ts
 create mode 100644 apps/tangle-cloud/src/blueprintApps/iframe/manifest.ts
 create mode 100644 apps/tangle-cloud/src/blueprintApps/iframe/origin.spec.ts
 create mode 100644 apps/tangle-cloud/src/blueprintApps/iframe/origin.ts
 create mode 100644 apps/tangle-cloud/src/blueprintApps/iframe/policy.spec.ts
 create mode 100644 apps/tangle-cloud/src/blueprintApps/iframe/policy.ts
 create mode 100644 apps/tangle-cloud/src/blueprintApps/iframe/protocol.spec.ts
 create mode 100644 apps/tangle-cloud/src/blueprintApps/iframe/protocol.ts
 create mode 100644 apps/tangle-cloud/src/blueprintApps/iframe/types.ts
 create mode 100644 apps/tangle-cloud/src/blueprintApps/iframe/useIframeBridge.ts

diff --git a/apps/tangle-cloud/netlify.toml b/apps/tangle-cloud/netlify.toml
index c5e872ce7e..ed9c687ef4 100644
--- a/apps/tangle-cloud/netlify.toml
+++ b/apps/tangle-cloud/netlify.toml
@@ -7,3 +7,28 @@
   # If the CHANGELOG.md file has changed, continue the build process,
   # Otherwise, stop the build process
   ignore = "[ \"$BRANCH\" != \"master\" ] && exit 1 || git diff --quiet $CACHED_COMMIT_REF $COMMIT_REF -- apps/tangle-cloud/CHANGELOG.md && exit 0 || exit 1"
+
+# ─── Security headers ───────────────────────────────────────────────────
+#
+# Scope is intentionally narrow: we set ONLY the headers needed to harden
+# the iframe blueprint-apps surface. We do NOT set default-src / script-src
+# / connect-src here because the dapp's wallet, RPC, and IPFS connections
+# require a permissive baseline that would be brittle to enumerate.
+#
+# - frame-src: allowlists which origins are permitted to be loaded as
+#   iframe sources by the dapp. Belt-and-braces with the in-app gating in
+#   policy.ts. Update both in tandem when adding a new iframe-eligible host.
+# - frame-ancestors 'self': prevents the dapp itself from being framed by
+#   an attacker page (clickjacking).
+# - Permissions-Policy: denies sensitive Web APIs by default for the dapp
+#   and any nested iframes. Each iframe element ALSO sets allow="" for
+#   defence-in-depth.
+# - X-Frame-Options: redundant with frame-ancestors on modern browsers but
+#   still required by some legacy mobile webviews.
+[[headers]]
+  for = "/*"
+  [headers.values]
+    Content-Security-Policy = "frame-src 'self' https://cloud.tangle.tools https://app.tangle.tools https://apps.tangle.tools https://*.blueprint.tangle.tools https://*.blueprint.tangle.sh; frame-ancestors 'self'"
+    Permissions-Policy = "camera=(), microphone=(), geolocation=(), payment=(), usb=(), bluetooth=(), accelerometer=(), gyroscope=(), magnetometer=(), midi=(), serial=()"
+    X-Frame-Options = "SAMEORIGIN"
+    Referrer-Policy = "strict-origin-when-cross-origin"
diff --git a/apps/tangle-cloud/src/blueprintApps/components/BlueprintAppFrame.tsx b/apps/tangle-cloud/src/blueprintApps/components/BlueprintAppFrame.tsx
new file mode 100644
index 0000000000..f83ab2d123
--- /dev/null
+++ b/apps/tangle-cloud/src/blueprintApps/components/BlueprintAppFrame.tsx
@@ -0,0 +1,72 @@
+import {
+  forwardRef,
+  type CSSProperties,
+  type ForwardedRef,
+  type IframeHTMLAttributes,
+} from 'react';
+import type { BlueprintIframeConfig } from '../iframe/types';
+
+type Props = {
+  config: BlueprintIframeConfig;
+  title: string;
+  className?: string;
+  style?: CSSProperties;
+  // Tests / non-DOM environments may want to render with a stub.
+  iframeProps?: Pick<IframeHTMLAttributes<HTMLIFrameElement>, 'name'>;
+};
+
+// Hardened iframe sandbox. We deliberately omit:
+//  - allow-same-origin: forces opaque origin so the iframe can't reach
+//    parent.localStorage / parent.cookies / window.parent.ethereum.
+//  - allow-top-navigation: blocks the iframe from navigating the parent
+//    window away to a phishing page.
+//  - allow-modals / allow-pointer-lock: not needed; reduces UX-hijack surface.
+//
+// We allow:
+//  - allow-scripts: required for the embedded app to function at all.
+//  - allow-forms: required for normal form interactions inside the iframe.
+//  - allow-popups[-to-escape-sandbox]: gated on the manifest's allowPopups
+//    flag because they widen attack surface (oauth flows commonly need them).
+const buildSandbox = (config: BlueprintIframeConfig): string => {
+  const tokens = ['allow-scripts', 'allow-forms'];
+  if (config.allowPopups) {
+    tokens.push('allow-popups', 'allow-popups-to-escape-sandbox');
+  }
+  return tokens.join(' ');
+};
+
+// `allow=""` — an empty Permissions-Policy attribute on the iframe blocks
+// every powerful API regardless of what the parent's response header says.
+// Belt-and-braces: the parent ALSO sets a deny-everything Permissions-Policy
+// header. If either layer is misconfigured the other still blocks.
+const PERMISSIONS_POLICY_DENY_ALL = '';
+
+const BlueprintAppFrameInner = (
+  { config, title, className, style, iframeProps }: Props,
+  ref: ForwardedRef<HTMLIFrameElement>,
+) => (
+  <iframe
+    ref={ref}
+    title={title}
+    src={config.url}
+    sandbox={buildSandbox(config)}
+    allow={PERMISSIONS_POLICY_DENY_ALL}
+    referrerPolicy="no-referrer"
+    loading="lazy"
+    className={className}
+    style={{
+      // Default to a sensible aspect; consumer can override.
+      width: '100%',
+      minHeight: '720px',
+      border: '0',
+      borderRadius: '16px',
+      ...style,
+    }}
+    {...iframeProps}
+  />
+);
+
+const BlueprintAppFrame = forwardRef(BlueprintAppFrameInner);
+BlueprintAppFrame.displayName = 'BlueprintAppFrame';
+
+export default BlueprintAppFrame;
diff --git a/apps/tangle-cloud/src/blueprintApps/components/BlueprintAppFrameHost.tsx b/apps/tangle-cloud/src/blueprintApps/components/BlueprintAppFrameHost.tsx
new file mode 100644
index 0000000000..7386319d51
--- /dev/null
+++ b/apps/tangle-cloud/src/blueprintApps/components/BlueprintAppFrameHost.tsx
@@ -0,0 +1,40 @@
+import { type FC, useRef } from 'react';
+import BlueprintAppFrame from './BlueprintAppFrame';
+import IframeAppApprovalModal from './IframeAppApprovalModal';
+import { useIframeBridge } from '../iframe/useIframeBridge';
+import type { BlueprintIframeConfig } from '../iframe/types';
+
+type Props = {
+  config: BlueprintIframeConfig;
+  appDisplayName: string;
+};
+
+// Composes the hardened iframe element, the parent-side message bridge, and
+// the approval modal into a single drop-in block. Use this from any page
+// that wants to render a trusted iframe-mode blueprint app.
+const BlueprintAppFrameHost: FC<Props> = ({ config, appDisplayName }) => {
+  const iframeRef = useRef<HTMLIFrameElement | null>(null);
+  const { pendingApproval, approve, reject } = useIframeBridge({
+    config,
+    iframeRef,
+  });
+
+  return (
+    <>
+      <BlueprintAppFrame
+        ref={iframeRef}
+        config={config}
+        title={`${appDisplayName} (sandboxed)`}
+      />
+      <IframeAppApprovalModal
+        pending={pendingApproval}
+        config={config}
+        appDisplayName={appDisplayName}
+        onApprove={approve}
+        onReject={reject}
+      />
+    </>
+  );
+};
+
+export default BlueprintAppFrameHost;
diff --git a/apps/tangle-cloud/src/blueprintApps/components/BlueprintAppLandingPage.tsx b/apps/tangle-cloud/src/blueprintApps/components/BlueprintAppLandingPage.tsx
index c7efee2531..6ffa90baca 100644
--- a/apps/tangle-cloud/src/blueprintApps/components/BlueprintAppLandingPage.tsx
+++ b/apps/tangle-cloud/src/blueprintApps/components/BlueprintAppLandingPage.tsx
@@ -8,13 +8,21 @@ import type { FC } from 'react';
 import { Link } from 'react-router';
 import { resolveBlueprintAppView } from '../resolver';
 import type { BlueprintAppEntry } from '../types';
+import type { TangleBlueprintAppEntry } from '../manifest';
+import BlueprintAppFrameHost from './BlueprintAppFrameHost';
 
 type Props = {
-  entry: BlueprintAppEntry;
+  entry: BlueprintAppEntry | TangleBlueprintAppEntry;
 };
 
 const BlueprintAppLandingPage: FC<Props> = ({ entry }) => {
   const view = resolveBlueprintAppView(entry);
+  const iframeConfig =
+    'iframe' in entry &&
+    view.manifest.externalApp?.mode === 'iframe' &&
+    view.manifest.externalApp?.trust === 'trusted'
+      ? entry.iframe
+      : undefined;
   const provisionPath =
     view.blueprintId !== undefined
       ? `/blueprints/${view.blueprintId.toString()}/deploy`
@@ -79,6 +87,17 @@ const BlueprintAppLandingPage: FC<Props> = ({ entry }) => {
         </CardContent>
       </Card>
 
+      {iframeConfig && (
+        <Card variant="sandbox" className="overflow-hidden rounded-3xl">
+          <CardContent className="p-0">
+            <BlueprintAppFrameHost
+              config={iframeConfig}
+              appDisplayName={view.manifest.displayName}
+            />
+          </CardContent>
+        </Card>
+      )}
+
       <div className="grid gap-5 md:grid-cols-3">
         <SummaryCard
           title="Cloud service"
diff --git a/apps/tangle-cloud/src/blueprintApps/components/IframeAppApprovalModal.tsx b/apps/tangle-cloud/src/blueprintApps/components/IframeAppApprovalModal.tsx
new file mode 100644
index 0000000000..e5b8c2b707
--- /dev/null
+++ b/apps/tangle-cloud/src/blueprintApps/components/IframeAppApprovalModal.tsx
@@ -0,0 +1,212 @@
+import { type FC, useCallback, useState } from 'react';
+import {
+  useChainId,
+  useSendTransaction,
+  useSignMessage,
+  useSwitchChain,
+} from 'wagmi';
+import type { Hex } from 'viem';
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from '@tangle-network/sandbox-ui/primitives';
+import { Button } from '../../components/sandbox/SandboxUi';
+import type {
+  ApprovalResult,
+  PendingApproval,
+} from '../iframe/useIframeBridge';
+import type { BlueprintIframeConfig } from '../iframe/types';
+
+type Props = {
+  pending: PendingApproval | null;
+  config: BlueprintIframeConfig;
+  appDisplayName: string;
+  onApprove: (result: ApprovalResult) => void;
+  onReject: (reason: string) => void;
+};
+
+const RequestSummary: FC<{ pending: PendingApproval }> = ({ pending }) => {
+  switch (pending.kind) {
+    case 'tangle.app.signTransaction': {
+      const r = pending.request;
+      return (
+        <div className="space-y-2 text-sm">
+          <Row label="Action" value="Send transaction" />
+          <Row label="Chain" value={String(r.chainId)} />
+          <Row label="To" value={r.to} mono />
+          {r.value && r.value !== '0' && (
+            <Row label="Value (wei)" value={r.value} mono />
+          )}
+          <Row
+            label="Calldata"
+            value={`${r.data.slice(0, 10)}… (${(r.data.length - 2) / 2} bytes)`}
+            mono
+          />
+        </div>
+      );
+    }
+    case 'tangle.app.signMessage': {
+      const r = pending.request;
+      return (
+        <div className="space-y-2 text-sm">
+          <Row label="Action" value="Sign message" />
+          <Row label="Chain" value={String(r.chainId)} />
+          <div>
+            <p className="text-xs text-muted-foreground mb-1">Message</p>
+            <pre className="rounded-md border border-border bg-muted/40 p-3 text-xs whitespace-pre-wrap break-all max-h-48 overflow-auto">
+              {r.message}
+            </pre>
+          </div>
+        </div>
+      );
+    }
+    case 'tangle.app.switchChain': {
+      const r = pending.request;
+      return (
+        <div className="space-y-2 text-sm">
+          <Row label="Action" value="Switch network" />
+          <Row label="Target chain" value={String(r.chainId)} />
+        </div>
+      );
+    }
+  }
+};
+
+const Row: FC<{ label: string; value: string; mono?: boolean }> = ({
+  label,
+  value,
+  mono,
+}) => (
+  <div className="flex flex-col gap-0.5">
+    <span className="text-xs text-muted-foreground">{label}</span>
+    <span
+      className={mono ? 'font-mono text-xs break-all' : 'text-sm'}
+      title={value}
+    >
+      {value}
+    </span>
+  </div>
+);
+
+const IframeAppApprovalModal: FC<Props> = ({
+  pending,
+  config,
+  appDisplayName,
+  onApprove,
+  onReject,
+}) => {
+  const [submitting, setSubmitting] = useState(false);
+  const { sendTransactionAsync } = useSendTransaction();
+  const { signMessageAsync } = useSignMessage();
+  const { switchChainAsync } = useSwitchChain();
+  const chainId = useChainId();
+
+  const handleApprove = useCallback(async () => {
+    if (!pending) return;
+    setSubmitting(true);
+    try {
+      switch (pending.kind) {
+        case 'tangle.app.signTransaction': {
+          const r = pending.request;
+          if (chainId !== r.chainId) {
+            onReject(
+              `Active chain ${chainId} doesn't match the request's chain ${r.chainId}. Switch network first.`,
+            );
+            return;
+          }
+          const txHash = await sendTransactionAsync({
+            to: r.to,
+            data: r.data,
+            value: r.value !== undefined ? BigInt(r.value) : undefined,
+            chainId: r.chainId,
+          });
+          onApprove({ ok: true, data: { txHash: txHash as Hex } });
+          return;
+        }
+        case 'tangle.app.signMessage': {
+          const r = pending.request;
+          const signature = await signMessageAsync({ message: r.message });
+          onApprove({ ok: true, data: { signature: signature as Hex } });
+          return;
+        }
+        case 'tangle.app.switchChain': {
+          const r = pending.request;
+          await switchChainAsync({ chainId: r.chainId });
+          onApprove({ ok: true, data: { chainId: r.chainId } });
+          return;
+        }
+      }
+    } catch (err) {
+      const message = err instanceof Error ? err.message : 'Approval failed.';
+      onReject(message);
+    } finally {
+      setSubmitting(false);
+    }
+  }, [
+    chainId,
+    onApprove,
+    onReject,
+    pending,
+    sendTransactionAsync,
+    signMessageAsync,
+    switchChainAsync,
+  ]);
+
+  const handleReject = useCallback(() => {
+    onReject('User rejected the request.');
+  }, [onReject]);
+
+  return (
+    <Dialog
+      open={pending !== null}
+      onOpenChange={(open) => {
+        if (!open && !submitting) handleReject();
+      }}
+    >
+      <DialogContent className="max-w-lg">
+        <DialogHeader>
+          <DialogTitle>
+            Approve {pending?.kind.replace('tangle.app.', '')}
+          </DialogTitle>
+          <DialogDescription>
+            <span className="font-semibold">{appDisplayName}</span> at{' '}
+            <span className="font-mono text-xs">{config.origin}</span> is
+            requesting your wallet to perform an action. Review the details
+            carefully — this app cannot read your wallet directly; it can only
+            ask you to approve specific operations declared in its manifest.
+          </DialogDescription>
+        </DialogHeader>
+
+        {pending && (
+          <div className="rounded-lg border border-border bg-muted/30 p-4">
+            <RequestSummary pending={pending} />
+          </div>
+        )}
+
+        <DialogFooter>
+          <Button
+            variant="secondary"
+            onClick={handleReject}
+            isDisabled={submitting}
+          >
+            Reject
+          </Button>
+          <Button
+            onClick={() => {
+              void handleApprove();
+            }}
+            isLoading={submitting}
+          >
+            Approve
+          </Button>
+        </DialogFooter>
+      </DialogContent>
+    </Dialog>
+  );
+};
+
+export default IframeAppApprovalModal;
diff --git a/apps/tangle-cloud/src/blueprintApps/iframe/manifest.spec.ts b/apps/tangle-cloud/src/blueprintApps/iframe/manifest.spec.ts
new file mode 100644
index 0000000000..da2192fdee
--- /dev/null
+++ b/apps/tangle-cloud/src/blueprintApps/iframe/manifest.spec.ts
@@ -0,0 +1,78 @@
+import { describe, expect, it } from 'vitest';
+import { parseIframePolicy } from './manifest';
+
+describe('iframe manifest parser', () => {
+  const ADDR = '0x' + 'a'.repeat(40);
+
+  it('returns undefined when url is missing', () => {
+    expect(parseIframePolicy({})).toBeUndefined();
+  });
+
+  it('parses a minimal iframe block with no contract grants', () => {
+    const result = parseIframePolicy({
+      url: 'https://trading.blueprint.tangle.tools/',
+    });
+    expect(result?.origin).toBe('https://trading.blueprint.tangle.tools');
+    expect(result?.contracts).toEqual([]);
+    expect(result?.allowReadAccount).toBe(false);
+  });
+
+  it('parses contract grants with selectors', () => {
+    const result = parseIframePolicy({
+      url: 'https://x.blueprint.tangle.tools/',
+      iframe: {
+        appId: 'demo',
+        allowedChainIds: [1],
+        contracts: [
+          {
+            chainId: 1,
+            address: ADDR,
+            selectors: ['0xa9059cbb', '0x095ea7b3'],
+          },
+        ],
+        allowReadAccount: true,
+      },
+    });
+    expect(result?.contracts).toHaveLength(1);
+    expect(result?.contracts[0].selectors).toEqual([
+      '0xa9059cbb',
+      '0x095ea7b3',
+    ]);
+    expect(result?.allowReadAccount).toBe(true);
+  });
+
+  it('drops malformed contract grants', () => {
+    const result = parseIframePolicy({
+      url: 'https://x.blueprint.tangle.tools/',
+      iframe: {
+        contracts: [
+          { chainId: 1, address: '0xnope' },
+          { chainId: 'abc', address: ADDR },
+          { chainId: 1, address: ADDR },
+        ],
+      },
+    });
+    expect(result?.contracts).toHaveLength(1);
+  });
+
+  it('drops malformed selectors', () => {
+    const result = parseIframePolicy({
+      url: 'https://x.blueprint.tangle.tools/',
+      iframe: {
+        contracts: [
+          {
+            chainId: 1,
+            address: ADDR,
+            selectors: [
+              '0xa9059cbb',
+              'not-hex',
+              '0xtoolong000000000000',
+              '0xa9059cb', // too short
+            ],
+          },
+        ],
+      },
+    });
+    expect(result?.contracts[0].selectors).toEqual(['0xa9059cbb']);
+  });
+});
diff --git a/apps/tangle-cloud/src/blueprintApps/iframe/manifest.ts b/apps/tangle-cloud/src/blueprintApps/iframe/manifest.ts
new file mode 100644
index 0000000000..0d4b5a143b
--- /dev/null
+++ b/apps/tangle-cloud/src/blueprintApps/iframe/manifest.ts
@@ -0,0 +1,135 @@
+import type { Address, Hex } from 'viem';
+import { isAddress, isHex } from 'viem';
+import type {
+  BlueprintIframeConfig,
+  IframeContractGrant,
+  IframeMessageGrant,
+} from './types';
+
+const isRecord = (value: unknown): value is Record<string, unknown> =>
+  typeof value === 'object' && value !== null && !Array.isArray(value);
+
+const readString = (value: unknown): string | null =>
+  typeof value === 'string' && value.trim().length > 0 ? value.trim() : null;
+
+const readBool = (value: unknown): boolean =>
+  typeof value === 'boolean' ? value : false;
+
+const readChainId = (value: unknown): number | null => {
+  if (typeof value === 'number' && Number.isInteger(value) && value > 0) {
+    return value;
+  }
+  if (typeof value === 'string') {
+    const parsed = Number(value);
+    return Number.isInteger(parsed) && parsed > 0 ? parsed : null;
+  }
+  return null;
+};
+
+const readSelector = (value: unknown): Hex | null => {
+  const s = readString(value)?.toLowerCase();
+  if (!s) return null;
+  if (!isHex(s)) return null;
+  // 0x + 8 hex chars = 4-byte selector
+  return s.length === 10 ? (s as Hex) : null;
+};
+
+const parseContracts = (value: unknown): IframeContractGrant[] => {
+  if (!Array.isArray(value)) return [];
+
+  const grants: IframeContractGrant[] = [];
+  for (const entry of value) {
+    if (!isRecord(entry)) continue;
+    const chainId = readChainId(entry.chainId);
+    const addressRaw = readString(entry.address);
+    if (!chainId || !addressRaw || !isAddress(addressRaw)) continue;
+
+    const grant: IframeContractGrant = {
+      chainId,
+      address: addressRaw as Address,
+    };
+
+    if (Array.isArray(entry.selectors)) {
+      const selectors = entry.selectors
+        .map(readSelector)
+        .filter((s): s is Hex => s !== null);
+      if (selectors.length > 0) grant.selectors = selectors;
+    }
+
+    grants.push(grant);
+  }
+  return grants;
+};
+
+const parseMessages = (value: unknown): IframeMessageGrant[] => {
+  if (!Array.isArray(value)) return [];
+
+  const grants: IframeMessageGrant[] = [];
+  for (const entry of value) {
+    if (!isRecord(entry)) continue;
+    const chainId = readChainId(entry.chainId);
+    if (!chainId) continue;
+
+    const grant: IframeMessageGrant = { chainId };
+    if (Array.isArray(entry.prefixes)) {
+      const prefixes = entry.prefixes
+        .map(readString)
+        .filter((p): p is string => p !== null && p.length <= 256);
+      if (prefixes.length > 0) grant.prefixes = prefixes;
+    }
+    grants.push(grant);
+  }
+  return grants;
+};
+
+// Parses the iframe-specific safety policy out of a blueprint manifest's
+// externalApp record. Caller has already verified policy gating (eligible
+// publisher, allowed host, etc.) — this only extracts what the manifest
+// declares the iframe is allowed to ask the wallet to do.
+export function parseIframePolicy(
+  externalAppRecord: Record<string, unknown>,
+): BlueprintIframeConfig | undefined {
+  const url = readString(externalAppRecord.url);
+  if (!url) return undefined;
+
+  let origin: string;
+  try {
+    origin = new URL(url).origin;
+  } catch {
+    return undefined;
+  }
+
+  const iframeRecord = isRecord(externalAppRecord.iframe)
+    ? (externalAppRecord.iframe as Record<string, unknown>)
+    : {};
+
+  const appId =
+    readString(iframeRecord.appId) ??
+    readString(externalAppRecord.label) ??
+    origin;
+
+  const allowedChainIds = Array.isArray(iframeRecord.allowedChainIds)
+    ? (iframeRecord.allowedChainIds
+        .map(readChainId)
+        .filter((c): c is number => c !== null) as number[])
+    : [];
+
+  const contracts = parseContracts(iframeRecord.contracts);
+  const messages = parseMessages(iframeRecord.messages);
+
+  // Apps that don't declare any signing surface can still render — they just
+  // can't ask for txs. We require either an allowedChainIds list OR contract
+  // grants to consider the iframe "operationally meaningful," but rendering
+  // works even with neither.
+  return {
+    url,
+    origin,
+    appId,
+    allowedChainIds,
+    contracts,
+    messages,
+    allowReadAccount: readBool(iframeRecord.allowReadAccount),
+    allowChainSwitch: readBool(iframeRecord.allowChainSwitch),
+    allowPopups: readBool(iframeRecord.allowPopups),
+  };
+}
diff --git a/apps/tangle-cloud/src/blueprintApps/iframe/origin.spec.ts b/apps/tangle-cloud/src/blueprintApps/iframe/origin.spec.ts
new file mode 100644
index 0000000000..15ff2ee370
--- /dev/null
+++ b/apps/tangle-cloud/src/blueprintApps/iframe/origin.spec.ts
@@ -0,0 +1,80 @@
+import { describe, expect, it } from 'vitest';
+import { isMessageFromIframe } from './origin';
+
+describe('iframe origin validation', () => {
+  it('rejects messages where source is not the iframe contentWindow', () => {
+    const fakeWindow = {} as WindowProxy;
+    const realWindow = {} as WindowProxy;
+    const event = {
+      origin: 'https://x.blueprint.tangle.tools',
+      source: fakeWindow,
+    } as unknown as MessageEvent;
+
+    expect(
+      isMessageFromIframe(event, {
+        expectedOrigin: 'https://x.blueprint.tangle.tools',
+        expectedSource: realWindow,
+      }),
+    ).toBe(false);
+  });
+
+  it('rejects messages with mismatched origin', () => {
+    const win = {} as WindowProxy;
+    const event = {
+      origin: 'https://evil.example.com',
+      source: win,
+    } as unknown as MessageEvent;
+
+    expect(
+      isMessageFromIframe(event, {
+        expectedOrigin: 'https://x.blueprint.tangle.tools',
+        expectedSource: win,
+      }),
+    ).toBe(false);
+  });
+
+  it('rejects when expectedSource is null (iframe not yet mounted)', () => {
+    const win = {} as WindowProxy;
+    const event = {
+      origin: 'https://x.blueprint.tangle.tools',
+      source: win,
+    } as unknown as MessageEvent;
+
+    expect(
+      isMessageFromIframe(event, {
+        expectedOrigin: 'https://x.blueprint.tangle.tools',
+        expectedSource: null,
+      }),
+    ).toBe(false);
+  });
+
+  it('accepts when origin and source both match', () => {
+    const win = {} as WindowProxy;
+    const event = {
+      origin: 'https://x.blueprint.tangle.tools',
+      source: win,
+    } as unknown as MessageEvent;
+
+    expect(
+      isMessageFromIframe(event, {
+        expectedOrigin: 'https://x.blueprint.tangle.tools',
+        expectedSource: win,
+      }),
+    ).toBe(true);
+  });
+
+  it('does not match similar but distinct origins (lookalike)', () => {
+    const win = {} as WindowProxy;
+    const event = {
+      origin: 'https://x.blueprint.tangle.tools.evil.com',
+      source: win,
+    } as unknown as MessageEvent;
+
+    expect(
+      isMessageFromIframe(event, {
+        expectedOrigin: 'https://x.blueprint.tangle.tools',
+        expectedSource: win,
+      }),
+    ).toBe(false);
+  });
+});
diff --git a/apps/tangle-cloud/src/blueprintApps/iframe/origin.ts b/apps/tangle-cloud/src/blueprintApps/iframe/origin.ts
new file mode 100644
index 0000000000..cf1b85acb7
--- /dev/null
+++ b/apps/tangle-cloud/src/blueprintApps/iframe/origin.ts
@@ -0,0 +1,39 @@
+// Origin/source validation for iframe ↔ parent postMessage exchanges.
+//
+// The single most important security property of the iframe protocol is that
+// the parent only acts on messages from the exact iframe it rendered — not
+// from an attacker page that opened a popup with a whitelisted origin.
+//
+// `event.origin` proves the *origin* of the sender; `event.source` proves the
+// *window object* of the sender. Both must match: origin guards against
+// spoofed `kind` values, source guards against confused-deputy attacks where
+// an unrelated trusted-origin tab posts at us.
+
+import type { BlueprintIframeConfig } from './types';
+
+export type IframeMessageContext = {
+  expectedOrigin: string;
+  expectedSource: WindowProxy | null;
+};
+
+export const buildIframeMessageContext = (
+  config: BlueprintIframeConfig,
+  iframeEl: HTMLIFrameElement | null,
+): IframeMessageContext => ({
+  expectedOrigin: config.origin,
+  expectedSource: iframeEl?.contentWindow ?? null,
+});
+
+export const isMessageFromIframe = (
+  event: MessageEvent,
+  context: IframeMessageContext,
+): boolean => {
+  // Strict origin equality. Never use endsWith / startsWith / regex here —
+  // origin spoofing via lookalike domains is a known footgun.
+  if (event.origin !== context.expectedOrigin) return false;
+  if (context.expectedSource === null) return false;
+  // Same-window check. event.source is a WindowProxy; reference equality
+  // against the iframe's contentWindow is the canonical pattern.
+  if (event.source !== context.expectedSource) return false;
+  return true;
+};
diff --git a/apps/tangle-cloud/src/blueprintApps/iframe/policy.spec.ts b/apps/tangle-cloud/src/blueprintApps/iframe/policy.spec.ts
new file mode 100644
index 0000000000..658972b0ed
--- /dev/null
+++ b/apps/tangle-cloud/src/blueprintApps/iframe/policy.spec.ts
@@ -0,0 +1,124 @@
+import { describe, expect, it } from 'vitest';
+import { checkRequestAllowed } from './policy';
+import type { BlueprintIframeConfig } from './types';
+
+const baseConfig: BlueprintIframeConfig = {
+  url: 'https://trading.blueprint.tangle.tools/',
+  origin: 'https://trading.blueprint.tangle.tools',
+  appId: 'trading-arena',
+  allowedChainIds: [1],
+  contracts: [
+    {
+      chainId: 1,
+      address: '0x' + 'a'.repeat(40),
+    },
+  ],
+  messages: [],
+  allowReadAccount: true,
+  allowChainSwitch: false,
+  allowPopups: false,
+};
+
+const ADDR_ALLOWED = '0x' + 'a'.repeat(40);
+const ADDR_DENIED = '0x' + 'b'.repeat(40);
+
+describe('iframe semantic policy', () => {
+  it('rejects signTransaction on a chain not in the allowlist', () => {
+    const verdict = checkRequestAllowed(
+      {
+        kind: 'tangle.app.signTransaction',
+        correlationId: 'a',
+        chainId: 137,
+        to: ADDR_ALLOWED,
+        data: '0xa9059cbb',
+      },
+      baseConfig,
+    );
+    expect(verdict.ok).toBe(false);
+  });
+
+  it('rejects signTransaction on a contract not in the allowlist', () => {
+    const verdict = checkRequestAllowed(
+      {
+        kind: 'tangle.app.signTransaction',
+        correlationId: 'a',
+        chainId: 1,
+        to: ADDR_DENIED,
+        data: '0xa9059cbb',
+      },
+      baseConfig,
+    );
+    expect(verdict.ok).toBe(false);
+  });
+
+  it('accepts signTransaction on whitelisted contract', () => {
+    const verdict = checkRequestAllowed(
+      {
+        kind: 'tangle.app.signTransaction',
+        correlationId: 'a',
+        chainId: 1,
+        to: ADDR_ALLOWED,
+        data: '0xa9059cbb',
+      },
+      baseConfig,
+    );
+    expect(verdict.ok).toBe(true);
+  });
+
+  it('rejects selectors outside a per-contract selector allowlist', () => {
+    const config: BlueprintIframeConfig = {
+      ...baseConfig,
+      contracts: [
+        {
+          chainId: 1,
+          address: ADDR_ALLOWED as `0x${string}`,
+          selectors: ['0xa9059cbb'],
+        },
+      ],
+    };
+
+    const denied = checkRequestAllowed(
+      {
+        kind: 'tangle.app.signTransaction',
+        correlationId: 'a',
+        chainId: 1,
+        to: ADDR_ALLOWED,
+        data: '0xdeadbeef',
+      },
+      config,
+    );
+    expect(denied.ok).toBe(false);
+
+    const accepted = checkRequestAllowed(
+      {
+        kind: 'tangle.app.signTransaction',
+        correlationId: 'b',
+        chainId: 1,
+        to: ADDR_ALLOWED,
+        data: '0xa9059cbb',
+      },
+      config,
+    );
+    expect(accepted.ok).toBe(true);
+  });
+
+  it('rejects switchChain when the manifest does not opt in', () => {
+    const verdict = checkRequestAllowed(
+      {
+        kind: 'tangle.app.switchChain',
+        correlationId: 'a',
+        chainId: 1,
+      },
+      baseConfig,
+    );
+    expect(verdict.ok).toBe(false);
+  });
+
+  it('rejects readAccount when the manifest does not opt in', () => {
+    const verdict = checkRequestAllowed(
+      { kind: 'tangle.app.readAccount', correlationId: 'a' },
+      { ...baseConfig, allowReadAccount: false },
+    );
+    expect(verdict.ok).toBe(false);
+  });
+});
diff --git a/apps/tangle-cloud/src/blueprintApps/iframe/policy.ts b/apps/tangle-cloud/src/blueprintApps/iframe/policy.ts
new file mode 100644
index 0000000000..c23b0acf9e
--- /dev/null
+++ b/apps/tangle-cloud/src/blueprintApps/iframe/policy.ts
@@ -0,0 +1,142 @@
+import type { Hex } from 'viem';
+import type {
+  IframeRequest,
+  IframeRequestSignTransaction,
+  IframeRequestSignMessage,
+  IframeRequestSwitchChain,
+  IframeRequestReadAccount,
+} from './protocol';
+import type { BlueprintIframeConfig } from './types';
+
+// Result of semantic policy checks against the manifest's iframe config.
+// On reject, `reason` is a human-readable string suitable for surfacing in
+// both the dapp's approval modal (so the user sees why a request was denied)
+// and the iframe's error response (so the publisher can debug).
+export type IframePolicyVerdict = { ok: true } | { ok: false; reason: string };
+
+const accept = (): IframePolicyVerdict => ({ ok: true });
+const reject = (reason: string): IframePolicyVerdict => ({ ok: false, reason });
+
+const extractSelector = (data: Hex): Hex | null => {
+  // 0x + 8 hex chars; anything shorter has no selector
+  if (data.length < 10) return null;
+  return data.slice(0, 10).toLowerCase() as Hex;
+};
+
+export function checkSignTransactionAllowed(
+  request: IframeRequestSignTransaction,
+  config: BlueprintIframeConfig,
+): IframePolicyVerdict {
+  if (
+    config.allowedChainIds.length > 0 &&
+    !config.allowedChainIds.includes(request.chainId)
+  ) {
+    return reject(
+      `Chain ${request.chainId} is not in this app's allowedChainIds list.`,
+    );
+  }
+
+  if (config.contracts.length === 0) {
+    return reject(
+      'This app has no contract grants in its manifest; signing is disabled.',
+    );
+  }
+
+  const target = request.to.toLowerCase();
+  const grant = config.contracts.find(
+    (g) => g.chainId === request.chainId && g.address.toLowerCase() === target,
+  );
+
+  if (!grant) {
+    return reject(
+      `Contract ${request.to} on chain ${request.chainId} is not in this app's contract allowlist.`,
+    );
+  }
+
+  if (grant.selectors && grant.selectors.length > 0) {
+    const selector = extractSelector(request.data);
+    if (!selector) {
+      return reject(
+        'Calldata is too short to contain a function selector but the contract has a selector allowlist.',
+      );
+    }
+    if (!grant.selectors.map((s) => s.toLowerCase()).includes(selector)) {
+      return reject(
+        `Selector ${selector} is not in this contract's selector allowlist.`,
+      );
+    }
+  }
+
+  return accept();
+}
+
+export function checkSignMessageAllowed(
+  request: IframeRequestSignMessage,
+  config: BlueprintIframeConfig,
+): IframePolicyVerdict {
+  const grant = config.messages.find((g) => g.chainId === request.chainId);
+  if (!grant) {
+    return reject(
+      `Chain ${request.chainId} is not in this app's signMessage allowlist.`,
+    );
+  }
+  if (grant.prefixes && grant.prefixes.length > 0) {
+    const matches = grant.prefixes.some((p) => request.message.startsWith(p));
+    if (!matches) {
+      return reject(
+        'Message does not start with any of the allowed prefixes for this app.',
+      );
+    }
+  }
+  return accept();
+}
+
+export function checkSwitchChainAllowed(
+  request: IframeRequestSwitchChain,
+  config: BlueprintIframeConfig,
+): IframePolicyVerdict {
+  if (!config.allowChainSwitch) {
+    return reject('This app is not permitted to request network switches.');
+  }
+  if (
+    config.allowedChainIds.length > 0 &&
+    !config.allowedChainIds.includes(request.chainId)
+  ) {
+    return reject(
+      `Chain ${request.chainId} is not in this app's allowedChainIds list.`,
+    );
+  }
+  return accept();
+}
+
+export function checkReadAccountAllowed(
+  _request: IframeRequestReadAccount,
+  config: BlueprintIframeConfig,
+): IframePolicyVerdict {
+  if (!config.allowReadAccount) {
+    return reject('This app is not permitted to read the connected account.');
+  }
+  return accept();
+}
+
+// Top-level semantic gate. Returns ok/reason for any request kind. Called
+// by the bridge before surfacing an approval modal to the user. Even when
+// `ok: true` is returned, the user still has to confirm in the parent UI —
+// this is just a fail-fast check that the manifest declared the capability.
+export function checkRequestAllowed(
+  request: IframeRequest,
+  config: BlueprintIframeConfig,
+): IframePolicyVerdict {
+  switch (request.kind) {
+    case 'tangle.app.handshake':
+      return accept();
+    case 'tangle.app.readAccount':
+      return checkReadAccountAllowed(request, config);
+    case 'tangle.app.switchChain':
+      return checkSwitchChainAllowed(request, config);
+    case 'tangle.app.signMessage':
+      return checkSignMessageAllowed(request, config);
+    case 'tangle.app.signTransaction':
+      return checkSignTransactionAllowed(request, config);
+  }
+}
diff --git a/apps/tangle-cloud/src/blueprintApps/iframe/protocol.spec.ts b/apps/tangle-cloud/src/blueprintApps/iframe/protocol.spec.ts
new file mode 100644
index 0000000000..82aa9dac7e
--- /dev/null
+++ b/apps/tangle-cloud/src/blueprintApps/iframe/protocol.spec.ts
@@ -0,0 +1,126 @@
+import { describe, expect, it } from 'vitest';
+import { validateIframeRequest, IFRAME_PROTOCOL_VERSION } from './protocol';
+
+const ADDR = '0x' + 'a'.repeat(40);
+
+describe('iframe protocol validation', () => {
+  it('rejects messages without the tangle.app prefix', () => {
+    expect(validateIframeRequest({ kind: 'evil.handshake', appId: 'x' })).toBe(
+      null,
+    );
+  });
+
+  it('rejects messages with non-object payloads', () => {
+    expect(validateIframeRequest(null)).toBe(null);
+    expect(validateIframeRequest(undefined)).toBe(null);
+    expect(validateIframeRequest('tangle.app.handshake')).toBe(null);
+    expect(validateIframeRequest([1, 2, 3])).toBe(null);
+  });
+
+  it('accepts a well-formed handshake', () => {
+    const result = validateIframeRequest({
+      kind: 'tangle.app.handshake',
+      appId: 'trading-arena',
+      version: IFRAME_PROTOCOL_VERSION,
+    });
+    expect(result?.kind).toBe('tangle.app.handshake');
+  });
+
+  it('rejects handshake from a future protocol version', () => {
+    expect(
+      validateIframeRequest({
+        kind: 'tangle.app.handshake',
+        appId: 'x',
+        version: '99',
+      }),
+    ).toBe(null);
+  });
+
+  it('rejects signTransaction with unbounded calldata', () => {
+    const longData = '0x' + 'ab'.repeat(200_000);
+    expect(
+      validateIframeRequest({
+        kind: 'tangle.app.signTransaction',
+        correlationId: 'abc',
+        chainId: 1,
+        to: ADDR,
+        data: longData,
+      }),
+    ).toBe(null);
+  });
+
+  it('rejects signTransaction with invalid address', () => {
+    expect(
+      validateIframeRequest({
+        kind: 'tangle.app.signTransaction',
+        correlationId: 'abc',
+        chainId: 1,
+        to: '0xnope',
+        data: '0x',
+      }),
+    ).toBe(null);
+  });
+
+  it('rejects signTransaction with negative or non-numeric value', () => {
+    expect(
+      validateIframeRequest({
+        kind: 'tangle.app.signTransaction',
+        correlationId: 'abc',
+        chainId: 1,
+        to: ADDR,
+        data: '0x',
+        value: '-1',
+      }),
+    ).toBe(null);
+
+    expect(
+      validateIframeRequest({
+        kind: 'tangle.app.signTransaction',
+        correlationId: 'abc',
+        chainId: 1,
+        to: ADDR,
+        data: '0x',
+        value: '1e18',
+      }),
+    ).toBe(null);
+  });
+
+  it('rejects correlationIds that are too long or non-printable', () => {
+    expect(
+      validateIframeRequest({
+        kind: 'tangle.app.readAccount',
+        correlationId: 'a'.repeat(200),
+      }),
+    ).toBe(null);
+
+    expect(
+      validateIframeRequest({
+        kind: 'tangle.app.readAccount',
+        correlationId: 'has spaces',
+      }),
+    ).toBe(null);
+  });
+
+  it('rejects signMessage above the size cap', () => {
+    expect(
+      validateIframeRequest({
+        kind: 'tangle.app.signMessage',
+        correlationId: 'abc',
+        chainId: 1,
+        message: 'x'.repeat(10_000),
+      }),
+    ).toBe(null);
+  });
+
+  it('accepts well-formed signTransaction', () => {
+    const result = validateIframeRequest({
+      kind: 'tangle.app.signTransaction',
+      correlationId: 'abc',
+      chainId: 1,
+      to: ADDR,
+      data: '0xa9059cbb',
+      value: '0',
+    });
+    expect(result?.kind).toBe('tangle.app.signTransaction');
+  });
+});
diff --git a/apps/tangle-cloud/src/blueprintApps/iframe/protocol.ts b/apps/tangle-cloud/src/blueprintApps/iframe/protocol.ts
new file mode 100644
index 0000000000..32ef60a3d0
--- /dev/null
+++ b/apps/tangle-cloud/src/blueprintApps/iframe/protocol.ts
@@ -0,0 +1,214 @@
+import { isAddress, isHex } from 'viem';
+import type { Address, Hex } from 'viem';
+
+// Versioned protocol — bump on any breaking change so old iframes can detect
+// drift via the handshake response.
+export const IFRAME_PROTOCOL_VERSION = '1' as const;
+
+// Discriminator prefix on every message in either direction. A message
+// without `kind` starting with this string is rejected before any parsing,
+// so generic wallet-extension postMessage chatter never reaches our handlers.
+export const IFRAME_PROTOCOL_PREFIX = 'tangle.app.' as const;
+
+// ─── Iframe → Parent ────────────────────────────────────────────────────
+
+export type IframeRequestHandshake = {
+  kind: 'tangle.app.handshake';
+  appId: string;
+  version: typeof IFRAME_PROTOCOL_VERSION;
+};
+
+export type IframeRequestReadAccount = {
+  kind: 'tangle.app.readAccount';
+  correlationId: string;
+};
+
+export type IframeRequestSwitchChain = {
+  kind: 'tangle.app.switchChain';
+  correlationId: string;
+  chainId: number;
+};
+
+export type IframeRequestSignMessage = {
+  kind: 'tangle.app.signMessage';
+  correlationId: string;
+  chainId: number;
+  message: string;
+};
+
+export type IframeRequestSignTransaction = {
+  kind: 'tangle.app.signTransaction';
+  correlationId: string;
+  chainId: number;
+  to: Address;
+  data: Hex;
+  value?: string;
+};
+
+export type IframeRequest =
+  | IframeRequestHandshake
+  | IframeRequestReadAccount
+  | IframeRequestSwitchChain
+  | IframeRequestSignMessage
+  | IframeRequestSignTransaction;
+
+// ─── Parent → Iframe ───────────────────────────────────────────────────
+
+export type ParentResponseHandshakeAck = {
+  kind: 'tangle.app.handshakeAck';
+  appId: string;
+  protocolVersion: typeof IFRAME_PROTOCOL_VERSION;
+};
+
+export type ParentResponseResultBase<T> = {
+  correlationId: string;
+} & ({ ok: true; data: T } | { ok: false; error: string });
+
+export type ParentResponseReadAccountResult = {
+  kind: 'tangle.app.readAccountResult';
+} & ParentResponseResultBase<{ account: Address; chainId: number }>;
+
+export type ParentResponseSwitchChainResult = {
+  kind: 'tangle.app.switchChainResult';
+} & ParentResponseResultBase<{ chainId: number }>;
+
+export type ParentResponseSignMessageResult = {
+  kind: 'tangle.app.signMessageResult';
+} & ParentResponseResultBase<{ signature: Hex }>;
+
+export type ParentResponseSignTransactionResult = {
+  kind: 'tangle.app.signTransactionResult';
+} & ParentResponseResultBase<{ txHash: Hex }>;
+
+// Unsolicited broadcasts from parent to iframe (e.g. user changes account)
+export type ParentEventAccountChanged = {
+  kind: 'tangle.app.accountChanged';
+  account: Address | null;
+};
+
+export type ParentEventChainChanged = {
+  kind: 'tangle.app.chainChanged';
+  chainId: number;
+};
+
+export type ParentMessage =
+  | ParentResponseHandshakeAck
+  | ParentResponseReadAccountResult
+  | ParentResponseSwitchChainResult
+  | ParentResponseSignMessageResult
+  | ParentResponseSignTransactionResult
+  | ParentEventAccountChanged
+  | ParentEventChainChanged;
+
+// ─── Validation ──────────────────────────────────────────────────────────
+
+const isString = (value: unknown): value is string => typeof value === 'string';
+const isFiniteNumber = (value: unknown): value is number =>
+  typeof value === 'number' && Number.isFinite(value);
+
+// Correlation IDs must be strings of bounded length and ASCII-printable so a
+// malicious iframe can't ship a 100MB payload as a "correlation id" to OOM
+// the parent's bookkeeping.
+const isValidCorrelationId = (value: unknown): value is string =>
+  isString(value) &&
+  value.length > 0 &&
+  value.length <= 128 &&
+  /^[\w.\-:]+$/.test(value);
+
+// Bound on signMessage to keep signing modal sane and prevent DoS.
+const MAX_MESSAGE_LENGTH = 4_096;
+
+// Bound on calldata. 128KB covers realistic txs without inviting huge blobs.
+const MAX_CALLDATA_BYTES = 128 * 1024;
+
+const isHexString = (value: unknown): value is Hex =>
+  isString(value) && isHex(value);
+
+// Conservative integer-string validator for value (wei). We use string
+// transport rather than bigint to survive structuredClone across some
+// older browsers and to avoid surprises when the iframe's JS env doesn't
+// share the parent's bigint quirks. Validate before BigInt() so we catch
+// negative or non-integer inputs explicitly.
+const isValidWeiString = (value: unknown): value is string => {
+  if (!isString(value)) return false;
+  if (value.length === 0 || value.length > 78) return false;
+  if (!/^[0-9]+$/.test(value)) return false;
+  return true;
+};
+
+export function validateIframeRequest(value: unknown): IframeRequest | null {
+  if (typeof value !== 'object' || value === null || Array.isArray(value)) {
+    return null;
+  }
+  const record = value as Record<string, unknown>;
+  const kind = record.kind;
+  if (!isString(kind) || !kind.startsWith(IFRAME_PROTOCOL_PREFIX)) return null;
+
+  switch (kind) {
+    case 'tangle.app.handshake': {
+      if (!isString(record.appId) || record.appId.length > 128) return null;
+      if (record.version !== IFRAME_PROTOCOL_VERSION) return null;
+      return {
+        kind: 'tangle.app.handshake',
+        appId: record.appId,
+        version: IFRAME_PROTOCOL_VERSION,
+      };
+    }
+    case 'tangle.app.readAccount': {
+      if (!isValidCorrelationId(record.correlationId)) return null;
+      return {
+        kind: 'tangle.app.readAccount',
+        correlationId: record.correlationId,
+      };
+    }
+    case 'tangle.app.switchChain': {
+      if (!isValidCorrelationId(record.correlationId)) return null;
+      if (!isFiniteNumber(record.chainId) || record.chainId <= 0) return null;
+      return {
+        kind: 'tangle.app.switchChain',
+        correlationId: record.correlationId,
+        chainId: record.chainId,
+      };
+    }
+    case 'tangle.app.signMessage': {
+      if (!isValidCorrelationId(record.correlationId)) return null;
+      if (!isFiniteNumber(record.chainId) || record.chainId <= 0) return null;
+      if (!isString(record.message)) return null;
+      if (
+        record.message.length === 0 ||
+        record.message.length > MAX_MESSAGE_LENGTH
+      ) {
+        return null;
+      }
+      return {
+        kind: 'tangle.app.signMessage',
+        correlationId: record.correlationId,
+        chainId: record.chainId,
+        message: record.message,
+      };
+    }
+    case 'tangle.app.signTransaction': {
+      if (!isValidCorrelationId(record.correlationId)) return null;
+      if (!isFiniteNumber(record.chainId) || record.chainId <= 0) return null;
+      if (!isString(record.to) || !isAddress(record.to)) return null;
+      if (!isHexString(record.data)) return null;
+      // Hex string is "0x" + 2 chars per byte
+      if ((record.data.length - 2) / 2 > MAX_CALLDATA_BYTES) return null;
+      let value: string | undefined;
+      if (record.value !== undefined) {
+        if (!isValidWeiString(record.value)) return null;
+        value = record.value;
+      }
+      return {
+        kind: 'tangle.app.signTransaction',
+        correlationId: record.correlationId,
+        chainId: record.chainId,
+        to: record.to as Address,
+        data: record.data,
+        ...(value !== undefined ? { value } : {}),
+      };
+    }
+    default:
+      return null;
+  }
+}
diff --git a/apps/tangle-cloud/src/blueprintApps/iframe/types.ts b/apps/tangle-cloud/src/blueprintApps/iframe/types.ts
new file mode 100644
index 0000000000..732cd58fb0
--- /dev/null
+++ b/apps/tangle-cloud/src/blueprintApps/iframe/types.ts
@@ -0,0 +1,35 @@
+import type { Address, Hex } from 'viem';
+
+export type IframeContractGrant = {
+  chainId: number;
+  address: Address;
+  // Optional 4-byte selector allowlist. When present, the parent rejects sign
+  // requests targeting this contract whose calldata starts with a different
+  // selector. When omitted (legacy / fully-trusted apps) any selector on the
+  // contract is allowed.
+  selectors?: Hex[];
+};
+
+export type IframeMessageGrant = {
+  chainId: number;
+  // Optional EIP-191 prefix substring allowlist. The iframe is asking the
+  // user to sign an arbitrary string; we let manifests narrow what kinds of
+  // strings are acceptable (e.g. only login challenges with a specific
+  // prefix). Omit to allow any message.
+  prefixes?: string[];
+};
+
+// Fully-resolved iframe safety policy attached to a blueprint app entry.
+// Built only when the manifest-level iframe gate passes.
+export type BlueprintIframeConfig = {
+  url: string;
+  origin: string;
+  appId: string;
+  allowedChainIds: number[];
+  contracts: IframeContractGrant[];
+  messages: IframeMessageGrant[];
+  // Capability flags. All default to false; manifests must opt in.
+  allowReadAccount: boolean;
+  allowChainSwitch: boolean;
+  allowPopups: boolean;
+};
diff --git a/apps/tangle-cloud/src/blueprintApps/iframe/useIframeBridge.ts b/apps/tangle-cloud/src/blueprintApps/iframe/useIframeBridge.ts
new file mode 100644
index 0000000000..6aec06f392
--- /dev/null
+++ b/apps/tangle-cloud/src/blueprintApps/iframe/useIframeBridge.ts
@@ -0,0 +1,304 @@
+import { useCallback, useEffect, useRef, useState } from 'react';
+import { useAccount, useChainId } from 'wagmi';
+import type { Address, Hex } from 'viem';
+import {
+  validateIframeRequest,
+  type IframeRequest,
+  type ParentMessage,
+  IFRAME_PROTOCOL_VERSION,
+} from './protocol';
+import { isMessageFromIframe, buildIframeMessageContext } from './origin';
+import { checkRequestAllowed, type IframePolicyVerdict } from './policy';
+import type { BlueprintIframeConfig } from './types';
+
+// Pending operator-approved request that the bridge is waiting on the user
+// to confirm via the dapp's approval modal. Surfaced through the hook's
+// return so the consumer can render the modal.
+export type PendingApproval =
+  | {
+      kind: 'tangle.app.signTransaction';
+      request: Extract<IframeRequest, { kind: 'tangle.app.signTransaction' }>;
+    }
+  | {
+      kind: 'tangle.app.signMessage';
+      request: Extract<IframeRequest, { kind: 'tangle.app.signMessage' }>;
+    }
+  | {
+      kind: 'tangle.app.switchChain';
+      request: Extract<IframeRequest, { kind: 'tangle.app.switchChain' }>;
+    };
+
+// Outcome the consumer reports back via approve/reject. The bridge turns
+// this into a postMessage response the iframe receives keyed on correlationId.
+export type ApprovalResult =
+  | { ok: true; data: { txHash: Hex } }
+  | { ok: true; data: { signature: Hex } }
+  | { ok: true; data: { chainId: number } }
+  | { ok: false; reason: string };
+
+type Options = {
+  config: BlueprintIframeConfig;
+  iframeRef: React.RefObject<HTMLIFrameElement | null>;
+  // Caller decides if the bridge is allowed to surface modals. When the page
+  // is hidden / the iframe wasn't mounted, set this to false to no-op.
+  enabled?: boolean;
+  onPolicyDeny?: (
+    request: IframeRequest,
+    verdict: IframePolicyVerdict & { ok: false },
+  ) => void;
+};
+
+export function useIframeBridge({
+  config,
+  iframeRef,
+  enabled = true,
+  onPolicyDeny,
+}: Options) {
+  const { address } = useAccount();
+  const chainId = useChainId();
+  const [pendingApproval, setPendingApproval] =
+    useState<PendingApproval | null>(null);
+  const pendingRef = useRef(pendingApproval);
+  pendingRef.current = pendingApproval;
+
+  const post = useCallback(
+    (message: ParentMessage) => {
+      const target = iframeRef.current?.contentWindow;
+      if (!target) return;
+      // Always pin targetOrigin to the manifest-declared origin. Never use '*'.
+      target.postMessage(message, config.origin);
+    },
+    [config.origin, iframeRef],
+  );
+
+  const respond = useCallback(
+    (
+      correlationId: string,
+      result: ApprovalResult,
+      kind: PendingApproval['kind'],
+    ) => {
+      switch (kind) {
+        case 'tangle.app.signTransaction': {
+          const data =
+            result.ok && 'txHash' in result.data ? result.data : null;
+          post(
+            data
+              ? {
+                  kind: 'tangle.app.signTransactionResult',
+                  correlationId,
+                  ok: true,
+                  data,
+                }
+              : {
+                  kind: 'tangle.app.signTransactionResult',
+                  correlationId,
+                  ok: false,
+                  error: result.ok ? 'wrong-result-shape' : result.reason,
+                },
+          );
+          return;
+        }
+        case 'tangle.app.signMessage': {
+          const data =
+            result.ok && 'signature' in result.data ? result.data : null;
+          post(
+            data
+              ? {
+                  kind: 'tangle.app.signMessageResult',
+                  correlationId,
+                  ok: true,
+                  data,
+                }
+              : {
+                  kind: 'tangle.app.signMessageResult',
+                  correlationId,
+                  ok: false,
+                  error: result.ok ? 'wrong-result-shape' : result.reason,
+                },
+          );
+          return;
+        }
+        case 'tangle.app.switchChain': {
+          const data =
+            result.ok && 'chainId' in result.data ? result.data : null;
+          post(
+            data
+              ? {
+                  kind: 'tangle.app.switchChainResult',
+                  correlationId,
+                  ok: true,
+                  data,
+                }
+              : {
+                  kind: 'tangle.app.switchChainResult',
+                  correlationId,
+                  ok: false,
+                  error: result.ok ? 'wrong-result-shape' : result.reason,
+                },
+          );
+          return;
+        }
+      }
+    },
+    [post],
+  );
+
+  const approve = useCallback(
+    (result: ApprovalResult) => {
+      const pending = pendingRef.current;
+      if (!pending) return;
+      respond(pending.request.correlationId, result, pending.kind);
+      setPendingApproval(null);
+    },
+    [respond],
+  );
+
+  const reject = useCallback(
+    (reason: string) => {
+      const pending = pendingRef.current;
+      if (!pending) return;
+      respond(
+        pending.request.correlationId,
+        { ok: false, reason },
+        pending.kind,
+      );
+      setPendingApproval(null);
+    },
+    [respond],
+  );
+
+  // Re-broadcast wallet state changes to the iframe. The iframe never
+  // touches the wallet directly — these events let it stay in sync without
+  // having to poll readAccount.
+  useEffect(() => {
+    if (!enabled) return;
+    post({
+      kind: 'tangle.app.accountChanged',
+      account: (address ?? null) as Address | null,
+    });
+  }, [address, enabled, post]);
+
+  useEffect(() => {
+    if (!enabled) return;
+    if (typeof chainId === 'number') {
+      post({ kind: 'tangle.app.chainChanged', chainId });
+    }
+  }, [chainId, enabled, post]);
+
+  useEffect(() => {
+    if (!enabled) return;
+
+    const context = buildIframeMessageContext(config, iframeRef.current);
+
+    const handler = (event: MessageEvent) => {
+      // Hard origin/source gate before any parsing. event.data may be huge,
+      // structuredClone'd, untyped — never touch it before this passes.
+      if (!isMessageFromIframe(event, context)) return;
+
+      const request = validateIframeRequest(event.data);
+      if (!request) return;
+
+      // Handshake is the one request that doesn't need policy review.
+      if (request.kind === 'tangle.app.handshake') {
+        post({
+          kind: 'tangle.app.handshakeAck',
+          appId: config.appId,
+          protocolVersion: IFRAME_PROTOCOL_VERSION,
+        });
+        return;
+      }
+
+      // Semantic policy gate. If the manifest didn't declare this capability
+      // we reject without ever surfacing a modal so users don't get
+      // approval-fatigue prompts for things the publisher isn't allowed to
+      // do anyway.
+      const verdict = checkRequestAllowed(request, config);
+      if (!verdict.ok) {
+        onPolicyDeny?.(request, verdict);
+        if (request.kind === 'tangle.app.readAccount') {
+          post({
+            kind: 'tangle.app.readAccountResult',
+            correlationId: request.correlationId,
+            ok: false,
+            error: verdict.reason,
+          });
+        } else if (request.kind === 'tangle.app.signMessage') {
+          post({
+            kind: 'tangle.app.signMessageResult',
+            correlationId: request.correlationId,
+            ok: false,
+            error: verdict.reason,
+          });
+        } else if (request.kind === 'tangle.app.signTransaction') {
+          post({
+            kind: 'tangle.app.signTransactionResult',
+            correlationId: request.correlationId,
+            ok: false,
+            error: verdict.reason,
+          });
+        } else if (request.kind === 'tangle.app.switchChain') {
+          post({
+            kind: 'tangle.app.switchChainResult',
+            correlationId: request.correlationId,
+            ok: false,
+            error: verdict.reason,
+          });
+        }
+        return;
+      }
+
+      // readAccount is a manifest-gated capability that doesn't need user
+      // approval each time once the user has loaded the iframe — they
+      // already gave broad consent by visiting the app.
+      if (request.kind === 'tangle.app.readAccount') {
+        post({
+          kind: 'tangle.app.readAccountResult',
+          correlationId: request.correlationId,
+          ok: true,
+          data: {
+            account: (address ??
+              '0x0000000000000000000000000000000000000000') as Address,
+            chainId: chainId ?? 0,
+          },
+        });
+        return;
+      }
+
+      // Everything else needs the approval modal. If a previous approval is
+      // still pending we reject the new request — the iframe is expected to
+      // wait for the previous correlationId before issuing another.
+      if (pendingRef.current) {
+        const correlationId = (request as { correlationId?: string })
+          .correlationId;
+        if (typeof correlationId === 'string') {
+          respond(
+            correlationId,
+            { ok: false, reason: 'Another approval is already pending.' },
+            request.kind as PendingApproval['kind'],
+          );
+        }
+        return;
+      }
+
+      setPendingApproval({ kind: request.kind, request } as PendingApproval);
+    };
+
+    window.addEventListener('message', handler);
+    return () => window.removeEventListener('message', handler);
+  }, [
+    address,
+    chainId,
+    config,
+    enabled,
+    iframeRef,
+    onPolicyDeny,
+    post,
+    respond,
+  ]);
+
+  return {
+    pendingApproval,
+    approve,
+    reject,
+  };
+}
diff --git a/apps/tangle-cloud/src/blueprintApps/manifest.ts b/apps/tangle-cloud/src/blueprintApps/manifest.ts
index 31700bae87..28aaf5ae53 100644
--- a/apps/tangle-cloud/src/blueprintApps/manifest.ts
+++ b/apps/tangle-cloud/src/blueprintApps/manifest.ts
@@ -18,7 +18,14 @@ import {
   isTrustedExternalAppHost,
   sanitizeBlueprintSlugPart,
 } from './resolver';
-import { getPublisherVerificationForNamespace } from './policy';
+import {
+  getPublisherVerificationForNamespace,
+  isIframeAllowedHost,
+  isIframeAppsEnabled,
+  isIframeEligiblePublisher,
+} from './policy';
+import type { BlueprintIframeConfig } from './iframe/types';
+import { parseIframePolicy } from './iframe/manifest';
 
 const SURFACE_VALUES = new Set<BlueprintUiSurface>([
   'generic-overview',
@@ -165,13 +172,17 @@ function parsePermissions(
 function parseExternalApp(
   value: unknown,
   options: {
+    publisherNamespace?: string;
     publisherVerified: boolean;
     metadataVerified: boolean;
   },
-): BlueprintExternalAppConfig | undefined {
+): {
+  externalApp: BlueprintExternalAppConfig | undefined;
+  iframe: BlueprintIframeConfig | undefined;
+} {
   const record = readRecord(value);
   if (!record) {
-    return undefined;
+    return { externalApp: undefined, iframe: undefined };
   }
 
   const url = readString(record.url);
@@ -183,66 +194,104 @@ function parseExternalApp(
     !EXTERNAL_APP_MODE_VALUES.has(mode) ||
     !/^https:\/\//.test(url)
   ) {
-    return undefined;
+    return { externalApp: undefined, iframe: undefined };
   }
 
   let host: string;
   try {
     host = new URL(url).hostname;
   } catch {
-    return undefined;
+    return { externalApp: undefined, iframe: undefined };
   }
 
-  const trust = isTrustedExternalAppHost(host) ? 'trusted' : 'restricted';
   const requestedMode = mode as BlueprintExternalAppConfig['mode'];
-  const reasons: string[] = [];
+  const linkTrusted =
+    isTrustedExternalAppHost(host) &&
+    options.publisherVerified &&
+    options.metadataVerified;
+
+  const iframeAllowed =
+    isIframeAppsEnabled &&
+    requestedMode === 'iframe' &&
+    options.metadataVerified &&
+    options.publisherVerified &&
+    isIframeEligiblePublisher(options.publisherNamespace) &&
+    isIframeAllowedHost(host);
 
-  if (requestedMode === 'iframe') {
-    reasons.push(
-      'Iframe embedding is disabled by policy; verified apps must open in a new tab.',
-    );
+  const reasons: string[] = [];
+  if (requestedMode === 'iframe' && !iframeAllowed) {
+    if (!isIframeAppsEnabled) {
+      reasons.push(
+        'Iframe embedding is currently disabled by ops kill switch.',
+      );
+    } else if (!isIframeEligiblePublisher(options.publisherNamespace)) {
+      reasons.push(
+        'Publisher is not on the iframe-eligible allowlist; embedded mode is restricted to first-party Tangle apps.',
+      );
+    } else if (!isIframeAllowedHost(host)) {
+      reasons.push(
+        'Host is not on the iframe-allowed suffix list; embedded mode is restricted to *.blueprint.tangle.tools / *.blueprint.tangle.sh.',
+      );
+    } else {
+      reasons.push(
+        'Iframe embedding is disabled by policy; verified apps must open in a new tab.',
+      );
+    }
   }
-
   if (!options.publisherVerified) {
     reasons.push(
       'Publisher is not verified for advanced external app handoff.',
     );
   }
-
   if (!options.metadataVerified) {
     reasons.push(
       'Metadata provenance was not verified against the onchain blueprint owner.',
     );
   }
 
+  // Parse iframe-specific safety policy (contract + chain allowlist) only
+  // when we are actually going to render iframe mode. The parser still runs
+  // when iframeAllowed=false so callers can introspect what would have been
+  // approved, but we never expose it on the manifest in that case.
+  const iframePolicy = iframeAllowed ? parseIframePolicy(record) : undefined;
+  const iframeRenderable =
+    iframeAllowed && iframePolicy !== undefined ? iframePolicy : undefined;
+
+  const effectiveMode: BlueprintExternalAppConfig['mode'] = iframeRenderable
+    ? 'iframe'
+    : 'link';
+  const effectiveTrust: BlueprintExternalAppConfig['trust'] =
+    iframeRenderable || linkTrusted ? 'trusted' : 'restricted';
+
   return {
-    url,
-    mode: 'link',
-    label: readString(record.label) ?? undefined,
-    host,
-    trust:
-      trust === 'trusted' &&
-      options.publisherVerified &&
-      options.metadataVerified
-        ? 'trusted'
-        : 'restricted',
-    ...(trust === 'restricted' ||
-    !options.publisherVerified ||
-    !options.metadataVerified ||
-    requestedMode === 'iframe'
-      ? {
-          reason:
-            reasons[0] ??
-            'External app host is not on the trusted Tangle allowlist yet.',
-        }
-      : {}),
+    externalApp: {
+      url,
+      mode: effectiveMode,
+      label: readString(record.label) ?? undefined,
+      host,
+      trust: effectiveTrust,
+      ...(effectiveTrust === 'restricted' || reasons.length > 0
+        ? {
+            reason:
+              reasons[0] ??
+              'External app host is not on the trusted Tangle allowlist yet.',
+          }
+        : {}),
+    },
+    iframe: iframeRenderable,
   };
 }
 
+// Local extension. Upstream BlueprintAppEntry lives in @tangle-network/blueprint-ui
+// and we don't want to widen its public surface for an iframe-only field.
+export type TangleBlueprintAppEntry = BlueprintAppEntry & {
+  iframe?: BlueprintIframeConfig;
+};
+
 export function buildBlueprintManifestFromMetadata(
   blueprint: BlueprintWithMetadata,
 ): {
-  entry: BlueprintAppEntry;
+  entry: TangleBlueprintAppEntry;
   source: 'generic' | 'metadata';
 } {
   const baseSurfaces: BlueprintUiSurface[] = [
@@ -311,12 +360,15 @@ export function buildBlueprintManifestFromMetadata(
       baseManifest.resources,
     ),
     permissions: parsePermissions(manifestRoot?.permissions),
-    externalApp: parseExternalApp(manifestRoot?.externalApp, {
-      publisherVerified,
-      metadataVerified,
-    }),
   };
 
+  const externalAppParsed = parseExternalApp(manifestRoot?.externalApp, {
+    publisherNamespace: publisherNamespace || undefined,
+    publisherVerified,
+    metadataVerified,
+  });
+  manifest.externalApp = externalAppParsed.externalApp;
+
   const allowDeclarativeTier =
     manifestRoot !== null &&
     blueprint.metadataVerification?.productionReady === true;
@@ -325,7 +377,14 @@ export function buildBlueprintManifestFromMetadata(
       ? manifest.externalApp
       : undefined;
 
-  const entry: BlueprintAppEntry = {
+  // Iframe config is exposed only when the externalApp survived gating with
+  // mode='iframe'. parseExternalApp already enforces that.
+  const iframeConfig =
+    trustedExternalApp?.mode === 'iframe'
+      ? externalAppParsed.iframe
+      : undefined;
+
+  const entry: TangleBlueprintAppEntry = {
     slug: normalizedRequestedSlug,
     canonicalSlug: normalizedRequestedSlug,
     blueprintId: blueprint.blueprintId,
@@ -346,6 +405,7 @@ export function buildBlueprintManifestFromMetadata(
           description:
             blueprint.metadataVerification?.reason ?? baseManifest.description,
         },
+    ...(iframeConfig ? { iframe: iframeConfig } : {}),
   };
 
   entry.canonicalSlug = buildCanonicalBlueprintSlug(entry);
diff --git a/apps/tangle-cloud/src/blueprintApps/policy.ts b/apps/tangle-cloud/src/blueprintApps/policy.ts
index 50c343f5b6..26bf123cb1 100644
--- a/apps/tangle-cloud/src/blueprintApps/policy.ts
+++ b/apps/tangle-cloud/src/blueprintApps/policy.ts
@@ -13,6 +13,20 @@ const DEFAULT_TRUSTED_EXTERNAL_APP_HOSTS = [
   'apps.tangle.tools',
 ];
 const DEFAULT_VERIFIED_PUBLISHERS = ['tangle', 'tangle-labs'];
+// Distinct from verified publishers — promoting a publisher to iframe-eligible
+// is a governance call, not auto-derived from verification.
+const DEFAULT_IFRAME_ELIGIBLE_PUBLISHERS = ['tangle', 'tangle-labs'];
+
+// Wildcard suffixes for hosts that may serve iframe-mode blueprint apps.
+// Any host whose registrable suffix matches one of these is treated as a
+// trusted-host entry without requiring the operator to enumerate every
+// per-blueprint subdomain in the env var. Each iframe app still has to be
+// explicitly enabled via its publisher namespace + the manifest's contract
+// allowlist; this is just the host-shape gate.
+const DEFAULT_IFRAME_HOST_SUFFIXES = [
+  '.blueprint.tangle.tools',
+  '.blueprint.tangle.sh',
+];
 
 export const reservedBlueprintSlugs = new Set([
   ...DEFAULT_RESERVED_SLUGS,
@@ -26,11 +40,34 @@ export const trustedExternalAppHosts = [
   ]),
 ];
 
+export const trustedIframeHostSuffixes = [
+  ...new Set([
+    ...DEFAULT_IFRAME_HOST_SUFFIXES,
+    ...splitEnvList(import.meta.env.VITE_BLUEPRINT_IFRAME_HOST_SUFFIXES).map(
+      (suffix) => (suffix.startsWith('.') ? suffix : `.${suffix}`),
+    ),
+  ]),
+];
+
 export const verifiedPublisherNamespaces = new Set([
   ...DEFAULT_VERIFIED_PUBLISHERS,
   ...splitEnvList(import.meta.env.VITE_BLUEPRINT_VERIFIED_PUBLISHERS),
 ]);
 
+export const iframeEligiblePublisherNamespaces = new Set([
+  ...DEFAULT_IFRAME_ELIGIBLE_PUBLISHERS,
+  ...splitEnvList(import.meta.env.VITE_BLUEPRINT_IFRAME_PUBLISHERS),
+]);
+
+// Same-day kill switch. When false the manifest parser refuses to emit
+// mode='iframe' regardless of any other gate — single env flip and every
+// iframe app falls back to link-out without a contract or manifest change.
+export const isIframeAppsEnabled = (() => {
+  const raw = import.meta.env.VITE_BLUEPRINT_IFRAME_ENABLED;
+  if (typeof raw !== 'string') return false;
+  return raw.trim().toLowerCase() === 'true';
+})();
+
 export const getPublisherVerificationForNamespace = (
   namespace?: string,
 ): BlueprintPublisherVerification => {
@@ -42,3 +79,17 @@ export const getPublisherVerificationForNamespace = (
     ? 'verified'
     : 'unverified';
 };
+
+export const isIframeEligiblePublisher = (namespace?: string): boolean => {
+  if (!namespace) return false;
+  return iframeEligiblePublisherNamespaces.has(namespace.trim().toLowerCase());
+};
+
+export const isIframeAllowedHost = (host: string): boolean => {
+  const normalized = host.trim().toLowerCase();
+  if (!normalized) return false;
+  if (trustedExternalAppHosts.includes(normalized)) return true;
+  return trustedIframeHostSuffixes.some((suffix) =>
+    normalized.endsWith(suffix),
+  );
+};