{update && onOpenWhatsNew && onDismissUpdate ? (
diff --git a/src/chrome/TitleBar.tsx b/src/chrome/TitleBar.tsx
index a978a591..0f1583a7 100644
--- a/src/chrome/TitleBar.tsx
+++ b/src/chrome/TitleBar.tsx
@@ -31,7 +31,7 @@ import { HarnessIcon } from "./HarnessIcon";
import { getCurrentWindow } from "@tauri-apps/api/window";
import { TerminalSpinner } from "./TerminalSpinner";
import { WindowControls } from "./WindowControls";
-import { IS_MAC, MOD } from "../lib/platform";
+import { IS_MAC, IS_MACOS, MOD } from "../lib/platform";
import type { RecentProject } from "../lib/recents";
export type Tab = {
@@ -670,7 +670,7 @@ function TitleBarComponent({
title bar takes over the traffic lights and the rail toggle. */}
{projectless && railClosed ? (
<>
-
+ {IS_MACOS ?
: null}
+ {title}
+
+ );
+}
+
+export function Row({
+ label,
+ description,
+ children,
+}: {
+ label: ReactNode;
+ description?: string;
+ children?: ReactNode;
+}) {
+ return (
+
+
+
{label}
+ {description ? (
+
+ {description}
+
+ ) : null}
+
+
+ {children}
+
+
+
+ {companionStatusLabel(linkStatus)}
+
+
+
+
+ {hostLine}
+
+
+ {saved?.altHost ? (
+
+ switchCompanionRoute()}>
+ Use other route
+
+
+ ) : null}
+
+ {connected ? (
+ Disconnect
+ ) : (
+
+ Reconnect
+
+ )}
+
+
+
+ Unpair
+
+
+
+
+ Sign in with Google so this device can reach the Mac from anywhere.
+ Nothing to install.
+
+ void onCopy(key, value)}
+ loggingOut={loggingOut}
+ onLogout={() => {
+ setLoggingOut(true);
+ void logout().finally(() => setLoggingOut(false));
+ }}
+ />
+
+ );
+}
+
+/**
+ * Host-side pairing screen (desktop Settings > Companion). Shows how to
+ * reach this machine from the iPad over LAN or Tailscale, plus the token.
+ * Rendered as read-only pairing details on a connected companion instead —
+ * a companion never serves its own link.
+ */
+export function CompanionPage() {
+ const linkStatus = useCompanionStatus();
+ const [remote, setRemote] = useState(isRemote());
+ const [status, setStatus] = useState(null);
+ const [pairing, setPairing] = useState(null);
+ const [tailnet, setTailnet] = useState(null);
+ const [embed, setEmbed] = useState(null);
+ const [peers, setPeers] = useState(null);
+ const [pairCode, setPairCode] = useState(null);
+ const [busy, setBusy] = useState(false);
+ const [error, setError] = useState(null);
+ const [copied, setCopied] = useState(null);
+ const [loggingOut, setLoggingOut] = useState(false);
+
+ useEffect(
+ () =>
+ onCompanionStatusChange(() => {
+ setRemote(isRemote());
+ }),
+ [],
+ );
+
+ const refresh = useCallback(async () => {
+ setError(null);
+ try {
+ const [nextStatus, nextPairing, nextTailnet] = await Promise.all([
+ invoke("remote_status"),
+ invoke("remote_pairing"),
+ invoke("remote_tailnet"),
+ ]);
+ setStatus(nextStatus);
+ setPairing(nextPairing);
+ setTailnet(nextTailnet);
+ try {
+ setEmbed(await invoke("remote_embed_status"));
+ } catch {
+ // Mobile shells have no embedded node; the card renders offline.
+ setEmbed(null);
+ }
+ } catch (err) {
+ setError(err instanceof Error ? err.message : String(err));
+ }
+ }, []);
+
+ useEffect(() => {
+ if (!remote) void refresh();
+ }, [refresh, remote]);
+
+ // Live status: the node moves through starting → login → online on its
+ // own, and companions come and go — poll lightly while the link is up.
+ useEffect(() => {
+ if (remote || !status?.enabled) return;
+ let stopped = false;
+ const poll = async () => {
+ try {
+ const [nextEmbed, nextPeers] = await Promise.all([
+ invoke("remote_embed_status"),
+ invoke("remote_peers"),
+ ]);
+ if (!stopped) {
+ setEmbed(nextEmbed);
+ setPeers(nextPeers);
+ }
+ } catch {
+ // Link went away mid-poll; the next refresh recovers.
+ }
+ };
+ const timer = window.setInterval(() => void poll(), 4000);
+ void poll();
+ return () => {
+ stopped = true;
+ window.clearInterval(timer);
+ };
+ }, [remote, status?.enabled]);
+
+ const onToggle = useCallback(
+ async (route: "tailscale" | "lan") => {
+ setBusy(true);
+ setError(null);
+ try {
+ const on = route === "lan" ? lanOn(status) : tailscaleOn(status);
+ await invoke