@decentnetwork/beagle 0.1.0

package/dist/desktop/app.js

@@ -0,0 +1,3379 @@
+window.__DK_UI_VERSION="0.1.0";
+const ICON_PATHS = {
+  // ---- tab bar (the four must feel like one set) ----
+  users: '<path d="M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="M22 21v-2a4 4 0 0 0-3-3.87"/><path d="M16 3.13a4 4 0 0 1 0 7.75"/>',
+  grid: '<rect x="3" y="3" width="7.5" height="7.5" rx="1.6"/><rect x="13.5" y="3" width="7.5" height="7.5" rx="1.6"/><rect x="13.5" y="13.5" width="7.5" height="7.5" rx="1.6"/><rect x="3" y="13.5" width="7.5" height="7.5" rx="1.6"/>',
+  wallet: '<path d="M19 7V6a2 2 0 0 0-2-2H6a3 3 0 0 0-3 3v10a3 3 0 0 0 3 3h12a2 2 0 0 0 2-2v-1"/><path d="M3 7a3 3 0 0 0 3 3h13a2 2 0 0 1 2 2v0a2 2 0 0 1-2 2h-3"/><circle cx="16.5" cy="14" r="1.15" fill="currentColor" stroke="none"/>',
+  userRound: '<circle cx="12" cy="8" r="4.5"/><path d="M20 21a8 8 0 0 0-16 0"/>',
+  // ---- actions / chrome ----
+  search: '<circle cx="11" cy="11" r="7.5"/><path d="m21 21-4.3-4.3"/>',
+  plus: '<path d="M5 12h14M12 5v14"/>',
+  chevronRight: '<path d="m9 18 6-6-6-6"/>',
+  chevronLeft: '<path d="m15 18-6-6 6-6"/>',
+  info: '<circle cx="12" cy="12" r="9.5"/><path d="M12 16.5v-5M12 7.6h.01"/>',
+  more: '<circle cx="5" cy="12" r="1.4" fill="currentColor" stroke="none"/><circle cx="12" cy="12" r="1.4" fill="currentColor" stroke="none"/><circle cx="19" cy="12" r="1.4" fill="currentColor" stroke="none"/>',
+  x: '<path d="M18 6 6 18M6 6l12 12"/>',
+  check: '<path d="M20 6 9 17l-5-5"/>',
+  checkCheck: '<path d="M18 6 7 17l-5-5"/><path d="m22 10-7.6 7.6L13 16"/>',
+  copy: '<rect x="9" y="9" width="12" height="12" rx="2.4"/><path d="M6 15H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v1"/>',
+  // Three linked nodes — an address is for passing ON to someone else, so it
+  // must not wear the same glyph as the userid's plain copy.
+  share: '<circle cx="18" cy="5" r="2.6"/><circle cx="6" cy="12" r="2.6"/><circle cx="18" cy="19" r="2.6"/><path d="M8.3 10.8l7.4-4.3M8.3 13.2l7.4 4.3"/>',
+  refresh: '<path d="M21 12a9 9 0 1 1-2.6-6.3"/><path d="M21 4v4.5h-4.5"/>',
+  clock: '<circle cx="12" cy="12" r="9.5"/><path d="M12 7.5V12l3 2"/>',
+  edit: '<path d="M11 4H6a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-5"/><path d="M18.5 2.5a2.12 2.12 0 0 1 3 3L12 15l-4 1 1-4Z"/>',
+  qr: '<rect x="3" y="3" width="7" height="7" rx="1.5"/><rect x="14" y="3" width="7" height="7" rx="1.5"/><rect x="3" y="14" width="7" height="7" rx="1.5"/><path d="M14 14h3v3M21 14v.01M14 21h.01M17 21h.01M21 17v4"/>',
+  // ---- app tiles ----
+  video: '<path d="m22 8.5-5.4 3.5 5.4 3.5V8.5Z"/><rect x="2" y="6" width="14.5" height="12" rx="3"/>',
+  monitor: '<rect x="2" y="3" width="20" height="14" rx="2"/><path d="M8 21h8M12 17v4"/>',
+  sparkles: '<path d="M12 3.5 13.6 9 19 10.5 13.6 12 12 17.5 10.4 12 5 10.5 10.4 9 12 3.5Z"/><path d="M19 3.5v3.2M20.6 5.1h-3.2"/><path d="M5 16v2.4M6.2 17.2H3.8"/>',
+  mic: '<rect x="9" y="2.5" width="6" height="11.5" rx="3"/><path d="M5.5 11a6.5 6.5 0 0 0 13 0"/><path d="M12 17.5v3.5"/>',
+  flask: '<path d="M9.5 3v6.2L4.8 17.4A2 2 0 0 0 6.5 20.5h11a2 2 0 0 0 1.7-3.1L14.5 9.2V3"/><path d="M8.5 3h7"/><path d="M7.3 15h9.4"/>',
+  headphones: '<path d="M3.5 14v-1.5a8.5 8.5 0 0 1 17 0V14"/><path d="M3.5 14.5a2.5 2.5 0 0 1 2.5-2.5h0a1.5 1.5 0 0 1 1.5 1.5v3.5a1.5 1.5 0 0 1-1.5 1.5h0a2.5 2.5 0 0 1-2.5-2.5Z"/><path d="M20.5 14.5a2.5 2.5 0 0 0-2.5-2.5h0a1.5 1.5 0 0 0-1.5 1.5v3.5a1.5 1.5 0 0 0 1.5 1.5h0a2.5 2.5 0 0 0 2.5-2.5Z"/>',
+  globe: '<circle cx="12" cy="12" r="9.5"/><path d="M2.5 12h19"/><path d="M12 2.5a14 14 0 0 1 0 19 14 14 0 0 1 0-19Z"/>',
+  store: '<path d="M4 9.5V19a1.5 1.5 0 0 0 1.5 1.5h13A1.5 1.5 0 0 0 20 19V9.5"/><path d="M3 6.5 4.5 3.5h15L21 6.5a2.5 2.5 0 0 1-4.5 1.5 2.5 2.5 0 0 1-4.5 0 2.5 2.5 0 0 1-4.5 0A2.5 2.5 0 0 1 3 6.5Z"/>',
+  // ---- chat composer ----
+  camera: '<path d="M14.5 4.5h-5L7.2 7.2H4.5A2.5 2.5 0 0 0 2 9.7V18a2.5 2.5 0 0 0 2.5 2.5h15A2.5 2.5 0 0 0 22 18V9.7a2.5 2.5 0 0 0-2.5-2.5h-2.7L14.5 4.5Z"/><circle cx="12" cy="13.5" r="3.2"/>',
+  phone: '<path d="M16.5 21a2 2 0 0 0 2-2.2 1.9 1.9 0 0 0-.6-1.2l-2-1.7a2 2 0 0 0-2.4-.1l-.9.6a14 14 0 0 1-5-5l.6-.9a2 2 0 0 0-.1-2.4l-1.7-2a1.9 1.9 0 0 0-1.2-.6A2 2 0 0 0 3 5.5 16 16 0 0 0 16.5 21Z"/>',
+  bolt: '<path d="M13 2 4 13h7l-1 9 9-11h-7l1-9Z"/>',
+  arrowUp: '<path d="M12 20V5M6 11l6-6 6 6"/>',
+  send: '<path d="M21.5 4.5 10.5 13.5"/><path d="M21.5 4.5 14.8 21.5 11 13l-8.5-3.8 19-4.7Z"/>',
+  // ---- account ----
+  shield: '<path d="M12 21.5s7.5-3.8 7.5-9.5V5.5L12 2.8 4.5 5.5V12c0 5.7 7.5 9.5 7.5 9.5Z"/>',
+  download: '<path d="M12 3.5v11M7.5 10l4.5 4.5 4.5-4.5"/><path d="M5 20.5h14"/>',
+  // Folder with a magnifier corner — "reveal / show in file manager".
+  folderOpen: '<path d="M3 7.5a2 2 0 0 1 2-2h4l2 2.5h8a2 2 0 0 1 2 2V17a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2Z"/><circle cx="12" cy="13" r="2.4"/><path d="M13.9 14.9 15.5 16.5"/>',
+  migrate: '<path d="M8 4 4 8l4 4"/><path d="M4 8h13a3 3 0 0 1 3 3v1"/><path d="m16 20 4-4-4-4"/><path d="M20 16H7a3 3 0 0 1-3-3v-1"/>',
+  starCoin: '<circle cx="12" cy="12" r="9"/><path d="m12 7.2 1.4 2.9 3.2.4-2.3 2.2.6 3.1-2.9-1.5-2.9 1.5.6-3.1L8.4 10.5l3.2-.4L12 7.2Z" fill="currentColor" stroke="none"/>',
+  link: '<path d="M10.5 13.5a4 4 0 0 0 5.7 0l2.3-2.3a4 4 0 0 0-5.7-5.7l-1 1"/><path d="M13.5 10.5a4 4 0 0 0-5.7 0l-2.3 2.3a4 4 0 0 0 5.7 5.7l1-1"/>',
+  trendingUp: '<path d="M22 7.5 13.5 16l-4.5-4.5L2 18.5"/><path d="M16.5 7.5H22v5.5"/>',
+  bell: '<path d="M18 8.5a6 6 0 0 0-12 0c0 6.5-2.5 8-2.5 8h17S18 15 18 8.5Z"/><path d="M13.7 20.5a2 2 0 0 1-3.4 0"/>',
+  bot: '<rect x="3.5" y="9" width="17" height="11" rx="3"/><path d="M12 4.5v4.5"/><circle cx="12" cy="3" r="1.4"/><path d="M8.5 14.5h.01M15.5 14.5h.01"/><path d="M2 13.5v3M22 13.5v3"/>',
+  scan: '<path d="M3 8V6a3 3 0 0 1 3-3h2"/><path d="M16 3h2a3 3 0 0 1 3 3v2"/><path d="M21 16v2a3 3 0 0 1-3 3h-2"/><path d="M8 21H6a3 3 0 0 1-3-3v-2"/><path d="M7 12h10"/>',
+  userPlus: '<path d="M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="M19 8v6M22 11h-6"/>',
+  at: '<circle cx="12" cy="12" r="4"/><path d="M16 8v5a3 3 0 0 0 6 0v-1a10 10 0 1 0-3.9 7.9"/>',
+  keyRound: '<circle cx="7.5" cy="15.5" r="5.5"/><path d="m21 2-9.6 9.6"/><path d="m15.5 7.5 3 3L22 7l-3-3"/>',
+  alert: '<path d="M10.3 3.9 1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0Z"/><path d="M12 9v4M12 17h.01"/>',
+  chevronDown: '<path d="m6 9 6 6 6-6"/>',
+  eye: '<path d="M2 12s3.5-7 10-7 10 7 10 7-3.5 7-10 7-10-7-10-7Z"/><circle cx="12" cy="12" r="3"/>',
+  book: '<path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20"/><path d="M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2Z"/>',
+  trash: '<path d="M3 6h18"/><path d="M8 6V4.5A1.5 1.5 0 0 1 9.5 3h5A1.5 1.5 0 0 1 16 4.5V6"/><path d="M18.5 6l-1 13.5a2 2 0 0 1-2 1.5h-7a2 2 0 0 1-2-1.5L5.5 6"/><path d="M10 10.5v6M14 10.5v6"/>',
+  arrowDown: '<path d="M12 4v15M6 13l6 6 6-6"/>',
+  shrink: '<path d="M4 14h6v6"/><path d="M20 10h-6V4"/><path d="m14 10 7-7"/><path d="m3 21 7-7"/>',
+  maximize: '<path d="M8 3H5a2 2 0 0 0-2 2v3"/><path d="M21 8V5a2 2 0 0 0-2-2h-3"/><path d="M3 16v3a2 2 0 0 0 2 2h3"/><path d="M16 21h3a2 2 0 0 0 2-2v-3"/>',
+  theater: '<rect x="2.5" y="6.5" width="19" height="11" rx="2"/>',
+  speaker: '<path d="M11 5 6 9H3v6h3l5 4V5Z"/><path d="M16 9a3 3 0 0 1 0 6"/><path d="M19 7a6 6 0 0 1 0 10"/>',
+  micFill: '<rect x="9" y="2.5" width="6" height="11.5" rx="3"/><path d="M5.5 11a6.5 6.5 0 0 0 13 0"/><path d="M12 17.5v3.5"/>'
+};
+function Icon({ name, size = 24, stroke = 1.75, color = "currentColor", fill = "none", style }) {
+  const d = ICON_PATHS[name];
+  if (!d)
+    return null;
+  return /* @__PURE__ */ React.createElement(
+    "svg",
+    {
+      width: size,
+      height: size,
+      viewBox: "0 0 24 24",
+      fill,
+      stroke: color,
+      strokeWidth: stroke,
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      style: { display: "block", flexShrink: 0, ...style },
+      dangerouslySetInnerHTML: { __html: d }
+    }
+  );
+}
+Object.assign(window, { Icon, ICON_PATHS });
+Object.assign(ICON_PATHS, {
+  message: '<path d="M21 12a8.5 8.5 0 0 1-12.2 7.7L3 21l1.3-5.8A8.5 8.5 0 1 1 21 12Z"/>',
+  network: '<circle cx="12" cy="5" r="2.4"/><circle cx="5" cy="19" r="2.4"/><circle cx="19" cy="19" r="2.4"/><path d="M10.6 6.9 6.4 16.7M13.4 6.9l4.2 9.8M7.4 19h9.2"/>',
+  route: '<circle cx="6.5" cy="18.5" r="2.4"/><circle cx="17.5" cy="5.5" r="2.4"/><path d="M9 18.5h5.5a3.5 3.5 0 0 0 0-7h-4a3.5 3.5 0 0 1 0-7H15"/>',
+  globe2: '<circle cx="12" cy="12" r="9"/><path d="M3 12h18"/><path d="M12 3a14 14 0 0 1 0 18 14 14 0 0 1 0-18Z"/>',
+  server: '<rect x="3" y="4" width="18" height="7" rx="2"/><rect x="3" y="13" width="18" height="7" rx="2"/><path d="M7 7.5h.01M7 16.5h.01"/>',
+  power: '<path d="M12 4v8"/><path d="M7.6 7.2a7 7 0 1 0 8.8 0"/>',
+  ban: '<circle cx="12" cy="12" r="9"/><path d="m5.6 5.6 12.8 12.8"/>',
+  terminal: '<path d="m4.5 17 6-6-6-6"/><path d="M12 18.5h7.5"/>',
+  signal: '<path d="M4.8 12.8a10 10 0 0 1 14.4 0"/><path d="M8.3 16.3a5 5 0 0 1 7.4 0"/><path d="M12 19.6h.01"/>',
+  paperclip: '<path d="m20.5 9-8.7 8.7a4.2 4.2 0 0 1-6-6l8.6-8.6a2.8 2.8 0 0 1 4 4l-8.6 8.6a1.4 1.4 0 0 1-2-2l7.9-7.9"/>',
+  file: '<path d="M14 3v5h5"/><path d="M14 3H7a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8l-5-5Z"/>',
+  fileText: '<path d="M14 3v5h5"/><path d="M14 3H7a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8l-5-5Z"/><path d="M8.5 13h7M8.5 16.5h5"/>',
+  image: '<rect x="3" y="4" width="18" height="16" rx="2"/><circle cx="8.5" cy="9.5" r="1.6"/><path d="m4 17 4.5-4.5a2 2 0 0 1 2.8 0L20 21"/>',
+  arrowRight: '<path d="M5 12h13M13 6l6 6-6 6"/>',
+  dotFill: '<circle cx="12" cy="12" r="4" fill="currentColor" stroke="none"/>',
+  hash: '<path d="M4 9h16M3.5 15h16M10 4 8 20M16 4l-2 16"/>',
+  sliders: '<path d="M4 6h11M4 12h7M4 18h13"/><circle cx="18" cy="6" r="2"/><circle cx="13.5" cy="12" r="2"/><circle cx="19" cy="18" r="2"/>',
+  unlink: '<path d="M9 15 5.5 18.5a3.5 3.5 0 0 1-5-5L4 10"/><path d="m15 9 3.5-3.5a3.5 3.5 0 0 1 5 5L20 14"/><path d="M8 8 4 4M16 16l4 4M3 11h2M11 3v2"/>',
+  zap: '<path d="M13 2 4 13h7l-1 9 9-11h-7l1-9Z"/>',
+  clock: '<circle cx="12" cy="12" r="9"/><path d="M12 7v5l3.5 2"/>',
+  plug: '<path d="M9 2v6M15 2v6"/><path d="M7 8h10v3a5 5 0 0 1-10 0V8Z"/><path d="M12 16v6"/>'
+});
+function dkHash(s) {
+  let h = 2166136261;
+  for (let i = 0; i < s.length; i++) {
+    h ^= s.charCodeAt(i);
+    h = Math.imul(h, 16777619);
+  }
+  return h >>> 0;
+}
+function dkRng(a) {
+  return function() {
+    a |= 0;
+    a = a + 1831565813 | 0;
+    let t = Math.imul(a ^ a >>> 15, 1 | a);
+    t = t + Math.imul(t ^ t >>> 7, 61 | t) ^ t;
+    return ((t ^ t >>> 14) >>> 0) / 4294967296;
+  };
+}
+function dkIdenticon(seed) {
+  const rnd = dkRng(dkHash(seed || "x"));
+  const hue = Math.floor(rnd() * 360);
+  const grid = [];
+  for (let y = 0; y < 5; y++) {
+    const row = [];
+    for (let x = 0; x < 3; x++)
+      row.push(rnd() > 0.5);
+    grid.push([row[0], row[1], row[2], row[1], row[0]]);
+  }
+  return { cells: grid, hue };
+}
+function dkClock(ts) {
+  if (!ts)
+    return "";
+  const d = new Date(ts);
+  return String(d.getHours()).padStart(2, "0") + ":" + String(d.getMinutes()).padStart(2, "0");
+}
+function dkFileSize(n) {
+  if (!n || n < 0)
+    return "0 B";
+  if (n < 1024)
+    return n + " B";
+  if (n < 1024 * 1024)
+    return (n / 1024).toFixed(1) + " KB";
+  if (n < 1024 * 1024 * 1024)
+    return (n / (1024 * 1024)).toFixed(1) + " MB";
+  return (n / (1024 * 1024 * 1024)).toFixed(2) + " GB";
+}
+function dkSpeed(kbps) {
+  if (kbps == null || !(kbps >= 0))
+    return "";
+  return kbps >= 1024 ? (kbps / 1024).toFixed(2) + " MB/s" : Math.round(kbps) + " KB/s";
+}
+function dkPct(p) {
+  return p == null ? "\u2026" : (p >= 100 ? "100" : p.toFixed(2)) + "%";
+}
+function dkFileUrl(name) {
+  return "/api/file-download?name=" + encodeURIComponent(name);
+}
+function dkFileDownloadUrl(name) {
+  return dkFileUrl(name) + "&dl=1";
+}
+function dkFileMediaKind(name) {
+  const ext = (String(name || "").split(".").pop() || "").toLowerCase();
+  if (["png", "jpg", "jpeg", "gif", "webp", "svg", "heic", "bmp"].includes(ext))
+    return "image";
+  if (["mp4", "mov", "webm", "m4v", "mkv", "avi"].includes(ext))
+    return "video";
+  if (["mp3", "m4a", "aac", "wav", "ogg", "flac", "opus"].includes(ext))
+    return "audio";
+  return "file";
+}
+function dkDayLabel(ts) {
+  if (!ts)
+    return "Today";
+  const d = new Date(ts), now = /* @__PURE__ */ new Date();
+  if (d.toDateString() === now.toDateString())
+    return "Today";
+  const y = new Date(now.getTime() - 864e5);
+  if (d.toDateString() === y.toDateString())
+    return "Yesterday";
+  return d.toLocaleDateString();
+}
+async function dkGet(path) {
+  const r = await fetch(path, { headers: { "cache-control": "no-cache" } });
+  return r.json();
+}
+async function dkPost(path, body) {
+  const ctrl = new AbortController();
+  const timer = setTimeout(() => ctrl.abort(), 15e3);
+  try {
+    const r = await fetch(path, {
+      method: "POST",
+      headers: { "content-type": "application/json" },
+      body: JSON.stringify(body || {}),
+      signal: ctrl.signal
+    });
+    try {
+      return await r.json();
+    } catch (e) {
+      return { ok: r.ok };
+    }
+  } catch (e) {
+    return { ok: false, error: e && e.name === "AbortError" ? "timed out" : e && e.message || "network error" };
+  } finally {
+    clearTimeout(timer);
+  }
+}
+function dkCopy(text) {
+  const s = text == null ? "" : String(text);
+  if (navigator.clipboard && window.isSecureContext) {
+    return navigator.clipboard.writeText(s).then(() => true).catch(() => dkCopyLegacy(s));
+  }
+  return Promise.resolve(dkCopyLegacy(s));
+}
+function dkCopyLegacy(s) {
+  try {
+    const ta = document.createElement("textarea");
+    ta.value = s;
+    ta.setAttribute("readonly", "");
+    ta.style.cssText = "position:fixed;top:-1000px;left:-1000px;opacity:0";
+    document.body.appendChild(ta);
+    ta.select();
+    ta.setSelectionRange(0, s.length);
+    const ok = document.execCommand("copy");
+    document.body.removeChild(ta);
+    return ok;
+  } catch (e) {
+    return false;
+  }
+}
+const dkApi = {
+  send: (userid, text) => dkPost("/api/chat-send", { userid, text }),
+  logLocal: (userid, dir, text) => dkPost("/api/chat-log-local", { userid, dir, text }),
+  add: (address) => dkPost("/api/add", { address }),
+  accept: (userid) => dkPost("/api/accept", { userid }),
+  reject: (userid) => dkPost("/api/reject", { userid }),
+  remove: (userid) => dkPost("/api/friend-remove", { userid }),
+  alias: (userid, alias) => dkPost("/api/friend-alias", { userid, alias }),
+  markRead: (userid) => dkPost("/api/chat-mark-read", { userid }),
+  delFiles: (userid, ids) => dkPost("/api/file-delete", { userid, ids }),
+  // Reveal a received file in the OS file manager (localhost-only on the daemon side).
+  revealFile: (name) => dkPost("/api/file-reveal", { name }),
+  cancelSend: (userid, ids) => dkPost("/api/file-cancel", { userid, ids }),
+  retrySend: (userid, ids) => dkPost("/api/file-retry", { userid, ids }),
+  setProfile: (name, description) => dkPost("/api/set-profile", { name, description }),
+  saveWebrtcFile: async (userid, name, blob) => {
+    try {
+      const r = await fetch(
+        "/api/webrtc-file-save?userid=" + encodeURIComponent(userid) + "&name=" + encodeURIComponent(name),
+        { method: "POST", body: blob }
+      );
+      const txt = await r.text();
+      try {
+        return JSON.parse(txt);
+      } catch {
+        return { ok: false, error: (txt || "HTTP " + r.status).slice(0, 120) };
+      }
+    } catch (e) {
+      return { ok: false, error: String(e) };
+    }
+  },
+  sendFile: async (userid, file) => {
+    try {
+      const r = await fetch(
+        "/api/file-send?userid=" + encodeURIComponent(userid) + "&name=" + encodeURIComponent(file.name),
+        { method: "POST", body: file }
+      );
+      const txt = await r.text();
+      try {
+        return JSON.parse(txt);
+      } catch {
+        if (r.status === 404)
+          return { ok: false, error: "file upload not supported \u2014 update & restart `agentnet ui`" };
+        return { ok: false, error: (txt || "HTTP " + r.status).slice(0, 120) };
+      }
+    } catch (e) {
+      return { ok: false, error: String(e) };
+    }
+  }
+};
+const DK_ME_FALLBACK = {
+  name: "\u2026",
+  handle: "@decentnetwork/peer",
+  userId: "",
+  carrier: "",
+  netKey: "",
+  ip: "",
+  online: false,
+  lanVer: "",
+  peerVer: "",
+  channel: "@next",
+  wire: "163"
+};
+function useDaemonData() {
+  const [snap, setSnap] = React.useState({
+    me: DK_ME_FALLBACK,
+    peers: [],
+    requests: [],
+    exits: [],
+    activeExit: null,
+    loaded: false
+  });
+  const [threads, setThreads] = React.useState({});
+  const refresh = React.useCallback(async () => {
+    var _a;
+    try {
+      const d = await dkGet("/api/desktop");
+      setSnap({
+        me: d.me || DK_ME_FALLBACK,
+        peers: d.peers || [],
+        requests: d.requests || [],
+        exits: d.exits || [],
+        activeExit: (_a = d.activeExit) != null ? _a : null,
+        loaded: true
+      });
+    } catch (e) {
+    }
+  }, []);
+  React.useEffect(() => {
+    refresh();
+    const t = setInterval(refresh, 2500);
+    return () => clearInterval(t);
+  }, [refresh]);
+  const loadThread = React.useCallback(async (peerId) => {
+    if (!peerId)
+      return;
+    try {
+      const d = await dkGet("/api/chat-history?peer=" + encodeURIComponent(peerId));
+      const arr = d.chats && d.chats[peerId] || [];
+      const msgs = arr.map((m) => ({
+        id: m.id,
+        from: m.dir === "out" ? "me" : "them",
+        time: dkClock(m.ts),
+        text: m.text,
+        file: m.file ? {
+          name: m.file.name,
+          size: dkFileSize(m.file.size),
+          dir: m.dir,
+          media: dkFileMediaKind(m.file.name),
+          status: m.file.status,
+          pct: m.file.status === "sending" && m.file.size ? Math.min(100, (m.file.sent || 0) / m.file.size * 100) : void 0,
+          kbps: m.file.kbps
+        } : void 0,
+        status: m.dir === "out" ? m.status === "queued" ? "queued" : "read" : void 0,
+        // Delivery path: "online" = live session, "offline" = express relay.
+        // Incoming messages carry this; the bubble colors them differently.
+        via: m.via
+      }));
+      const withDay = msgs.length ? [{ day: dkDayLabel(arr[0].ts) }].concat(msgs) : [];
+      setThreads((t) => Object.assign({}, t, { [peerId]: withDay }));
+    } catch (e) {
+    }
+  }, []);
+  return Object.assign({}, snap, { threads, refresh, loadThread });
+}
+Object.assign(window, {
+  dkHash,
+  dkIdenticon,
+  dkClock,
+  dkDayLabel,
+  dkApi,
+  useDaemonData,
+  DK_ME_FALLBACK,
+  dkCopy
+});
+function dkRtcParseEnvelope(data) {
+  const text = String(data || "").replace(/\0+$/u, "").trim();
+  if (!text)
+    return null;
+  try {
+    const obj = JSON.parse(text);
+    if (obj && obj.dkRtc === 1 && typeof obj.kind === "string")
+      return obj;
+  } catch (e) {
+  }
+  return null;
+}
+function dkRtcSignalBus() {
+  if (window.__dkRtcSignalBus)
+    return window.__dkRtcSignalBus;
+  const PW = window.PeerWebRTC;
+  const handlers = /* @__PURE__ */ new Map();
+  let started = false;
+  let stopped = false;
+  function emit(kind, userid, payload) {
+    const set = handlers.get(kind);
+    if (!set)
+      return;
+    for (const h of Array.from(set)) {
+      try {
+        h(userid, payload);
+      } catch (e) {
+        console.warn("[rtc] signal handler failed", e);
+      }
+    }
+  }
+  async function pollLoop() {
+    while (!stopped) {
+      let signals = [];
+      try {
+        const r = await fetch("/api/call-poll", { headers: { "cache-control": "no-cache" } });
+        const d = await r.json();
+        signals = d && d.signals || [];
+      } catch (e) {
+        await new Promise((res) => setTimeout(res, 1e3));
+        continue;
+      }
+      for (const s of signals) {
+        const env = dkRtcParseEnvelope(s.data);
+        if (env) {
+          emit(env.kind, s.userid, env);
+          continue;
+        }
+        if (PW) {
+          try {
+            emit("call", s.userid, PW.decodeSignal(s.data));
+          } catch (e) {
+          }
+        }
+      }
+    }
+  }
+  const bus = {
+    start() {
+      if (started)
+        return;
+      started = true;
+      stopped = false;
+      pollLoop();
+    },
+    on(kind, cb) {
+      if (!handlers.has(kind))
+        handlers.set(kind, /* @__PURE__ */ new Set());
+      handlers.get(kind).add(cb);
+      this.start();
+      return () => {
+        var _a;
+        return (_a = handlers.get(kind)) == null ? void 0 : _a.delete(cb);
+      };
+    },
+    async send(userid, data) {
+      const body = JSON.stringify({ userid, data: typeof data === "string" ? data : JSON.stringify(data) });
+      const r = await fetch("/api/call-signal", {
+        method: "POST",
+        headers: { "content-type": "application/json" },
+        body
+      });
+      const d = await r.json().catch(() => ({ ok: r.ok }));
+      if (!d.ok)
+        throw new Error(d.error || "call-signal send failed");
+    },
+    stop() {
+      stopped = true;
+    }
+  };
+  window.__dkRtcSignalBus = bus;
+  return bus;
+}
+function makeDaemonSignaling() {
+  const PW = window.PeerWebRTC;
+  const bus = dkRtcSignalBus();
+  let off = null;
+  return {
+    async send(peerId, signal) {
+      await bus.send(peerId, PW.encodeSignal(signal));
+    },
+    onSignal(cb) {
+      if (off)
+        off();
+      off = bus.on("call", cb);
+    },
+    stop() {
+      if (off) {
+        off();
+        off = null;
+      }
+    }
+  };
+}
+Object.assign(window, { dkRtcSignalBus, makeDaemonSignaling });
+function DkIdenticon({ seed, size = 30, radius = 7 }) {
+  const { cells, hue } = dkIdenticon(seed);
+  const cell = size / 5;
+  const fg = `oklch(0.62 0.15 ${hue})`;
+  const bg = `oklch(var(--ident-l) 0.05 ${hue})`;
+  return /* @__PURE__ */ React.createElement("svg", { width: size, height: size, viewBox: `0 0 ${size} ${size}`, style: { display: "block", borderRadius: radius } }, /* @__PURE__ */ React.createElement("rect", { width: size, height: size, fill: bg }), cells.map((row, y) => row.map((on, x) => on ? /* @__PURE__ */ React.createElement("rect", { key: `${x}-${y}`, x: x * cell, y: y * cell, width: cell + 0.4, height: cell + 0.4, fill: fg }) : null)));
+}
+function DkBot({ seed, size = 30, radius = 7 }) {
+  const hue = dkIdenticon(seed).hue;
+  return /* @__PURE__ */ React.createElement("div", { style: {
+    width: size,
+    height: size,
+    borderRadius: radius,
+    flexShrink: 0,
+    background: `linear-gradient(150deg, oklch(0.6 0.17 ${hue}), oklch(0.5 0.18 ${(hue + 30) % 360}))`,
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center"
+  } }, /* @__PURE__ */ React.createElement(Icon, { name: "bot", size: size * 0.56, color: "#fff", stroke: 1.9 }));
+}
+function DkAvatar({ peer, size = 30, radius = 7, dot = true }) {
+  const d = Math.max(8, size * 0.3);
+  return /* @__PURE__ */ React.createElement("div", { style: { position: "relative", width: size, height: size, flexShrink: 0 } }, peer.agent ? /* @__PURE__ */ React.createElement(DkBot, { seed: peer.id, size, radius }) : /* @__PURE__ */ React.createElement(DkIdenticon, { seed: peer.userId || peer.id, size, radius }), dot && /* @__PURE__ */ React.createElement("span", { style: {
+    position: "absolute",
+    right: -2,
+    bottom: -2,
+    width: d,
+    height: d,
+    borderRadius: 999,
+    background: peer.online ? "var(--online)" : "var(--off)",
+    border: "2px solid var(--panel)",
+    boxSizing: "border-box"
+  } }));
+}
+function StatusDot({ online, size = 8 }) {
+  return /* @__PURE__ */ React.createElement("span", { style: {
+    width: size,
+    height: size,
+    borderRadius: 999,
+    flexShrink: 0,
+    background: online ? "var(--online)" : "var(--off)",
+    boxShadow: online ? "0 0 0 3px color-mix(in oklab, var(--online), transparent 80%)" : "none"
+  } });
+}
+function Mono({ children, dim, size = 12.5, copy, title, icon = "copy" }) {
+  const [hit, setHit] = React.useState(false);
+  const onCopy = (e) => {
+    e.stopPropagation();
+    dkCopy(copy === true ? String(children) : copy);
+    setHit(true);
+    setTimeout(() => setHit(false), 900);
+  };
+  return /* @__PURE__ */ React.createElement("span", { title, onClick: copy ? onCopy : void 0, style: {
+    fontFamily: "var(--mono)",
+    fontSize: size,
+    letterSpacing: -0.2,
+    color: dim ? "var(--dim)" : "var(--text)",
+    cursor: copy ? "pointer" : "default",
+    display: "inline-flex",
+    alignItems: "center",
+    gap: 5,
+    whiteSpace: "nowrap"
+  } }, children, copy && /* @__PURE__ */ React.createElement(Icon, { name: hit ? "check" : icon, size: 12, stroke: 2, color: hit ? "var(--online)" : "var(--faint)" }));
+}
+function shortKey(s, head = 6, tail = 5) {
+  if (!s || s.length <= head + tail + 1)
+    return s;
+  return s.slice(0, head) + "\u2026" + s.slice(-tail);
+}
+function RouteTag({ peer }) {
+  if (!peer.online)
+    return /* @__PURE__ */ React.createElement(Tag, { tone: "off" }, "offline");
+  const relay = peer.via === "relay";
+  const via = peer.via || "online";
+  return /* @__PURE__ */ React.createElement(Tag, { tone: relay ? "warn" : "ok" }, peer.ping != null ? `${via} \xB7 ${peer.ping}ms` : via);
+}
+function Tag({ children, tone = "neutral", style, title }) {
+  const tones = {
+    neutral: { bg: "var(--chip)", fg: "var(--dim)", bd: "transparent" },
+    ok: { bg: "color-mix(in oklab, var(--online), transparent 86%)", fg: "var(--online)", bd: "transparent" },
+    warn: { bg: "color-mix(in oklab, var(--warn), transparent 86%)", fg: "var(--warn)", bd: "transparent" },
+    off: { bg: "var(--chip)", fg: "var(--faint)", bd: "transparent" },
+    accent: { bg: "color-mix(in oklab, var(--accent), transparent 86%)", fg: "var(--accent)", bd: "transparent" },
+    danger: { bg: "color-mix(in oklab, var(--danger), transparent 88%)", fg: "var(--danger)", bd: "transparent" }
+  };
+  const t = tones[tone] || tones.neutral;
+  return /* @__PURE__ */ React.createElement("span", { title, style: {
+    display: "inline-flex",
+    alignItems: "center",
+    gap: 4,
+    height: 18,
+    padding: "0 6px",
+    borderRadius: 4,
+    background: t.bg,
+    color: t.fg,
+    border: `1px solid ${t.bd}`,
+    fontFamily: "var(--mono)",
+    fontSize: 11,
+    fontWeight: 600,
+    letterSpacing: -0.1,
+    lineHeight: 1,
+    whiteSpace: "nowrap",
+    ...style
+  } }, children);
+}
+function Unread({ n }) {
+  if (!n)
+    return null;
+  return /* @__PURE__ */ React.createElement("span", { style: {
+    minWidth: 18,
+    height: 18,
+    padding: "0 5px",
+    borderRadius: 999,
+    flexShrink: 0,
+    background: "var(--accent)",
+    color: "#fff",
+    fontFamily: "var(--mono)",
+    fontSize: 11,
+    fontWeight: 700,
+    lineHeight: "18px",
+    textAlign: "center"
+  } }, n);
+}
+function Btn({ children, icon, tone = "ghost", onClick, size = "md", title, style }) {
+  const tones = {
+    ghost: { bg: "transparent", fg: "var(--text)", bd: "var(--line)" },
+    solid: { bg: "var(--accent)", fg: "#fff", bd: "transparent" },
+    soft: { bg: "var(--chip)", fg: "var(--text)", bd: "transparent" },
+    ok: { bg: "color-mix(in oklab, var(--online), transparent 84%)", fg: "var(--online)", bd: "transparent" },
+    danger: { bg: "transparent", fg: "var(--danger)", bd: "color-mix(in oklab, var(--danger), transparent 70%)" }
+  };
+  const t = tones[tone] || tones.ghost;
+  const h = size === "sm" ? 26 : size === "lg" ? 36 : 30;
+  return /* @__PURE__ */ React.createElement("button", { onClick, title, style: {
+    height: h,
+    padding: icon && !children ? 0 : "0 11px",
+    minWidth: icon && !children ? h : "auto",
+    borderRadius: 6,
+    cursor: "pointer",
+    fontFamily: "var(--mono)",
+    fontWeight: 600,
+    fontSize: size === "sm" ? 12 : 12.5,
+    letterSpacing: -0.1,
+    background: t.bg,
+    color: t.fg,
+    border: `1px solid ${t.bd}`,
+    display: "inline-flex",
+    alignItems: "center",
+    justifyContent: "center",
+    gap: 6,
+    whiteSpace: "nowrap",
+    ...style
+  } }, icon && /* @__PURE__ */ React.createElement(Icon, { name: icon, size: 15, stroke: 2 }), children);
+}
+function Section({ label, count, trailing, style }) {
+  return /* @__PURE__ */ React.createElement("div", { style: { display: "flex", alignItems: "center", gap: 8, padding: "0 2px", ...style } }, /* @__PURE__ */ React.createElement("span", { style: { fontFamily: "var(--mono)", fontSize: 11, fontWeight: 700, letterSpacing: 1, textTransform: "uppercase", color: "var(--faint)" } }, label), count != null && /* @__PURE__ */ React.createElement("span", { style: { fontFamily: "var(--mono)", fontSize: 11, fontWeight: 700, color: "var(--faint)" } }, count), /* @__PURE__ */ React.createElement("div", { style: { flex: 1, height: 1, background: "var(--line)" } }), trailing);
+}
+Object.assign(window, { DkIdenticon, DkBot, DkAvatar, StatusDot, Mono, shortKey, RouteTag, Tag, Unread, Btn, Section });
+const __TWEAKS_STYLE = `
+  .twk-panel{position:fixed;right:16px;bottom:16px;z-index:2147483646;width:280px;
+    max-height:calc(100vh - 32px);display:flex;flex-direction:column;
+    transform:scale(var(--dc-inv-zoom,1));transform-origin:bottom right;
+    background:rgba(250,249,247,.78);color:#29261b;
+    -webkit-backdrop-filter:blur(24px) saturate(160%);backdrop-filter:blur(24px) saturate(160%);
+    border:.5px solid rgba(255,255,255,.6);border-radius:14px;
+    box-shadow:0 1px 0 rgba(255,255,255,.5) inset,0 12px 40px rgba(0,0,0,.18);
+    font:11.5px/1.4 ui-sans-serif,system-ui,-apple-system,sans-serif;overflow:hidden}
+  .twk-hd{display:flex;align-items:center;justify-content:space-between;
+    padding:10px 8px 10px 14px;cursor:move;user-select:none}
+  .twk-hd b{font-size:12px;font-weight:600;letter-spacing:.01em}
+  .twk-x{appearance:none;border:0;background:transparent;color:rgba(41,38,27,.55);
+    width:22px;height:22px;border-radius:6px;cursor:default;font-size:13px;line-height:1}
+  .twk-x:hover{background:rgba(0,0,0,.06);color:#29261b}
+  .twk-body{padding:2px 14px 14px;display:flex;flex-direction:column;gap:10px;
+    overflow-y:auto;overflow-x:hidden;min-height:0;
+    scrollbar-width:thin;scrollbar-color:rgba(0,0,0,.15) transparent}
+  .twk-body::-webkit-scrollbar{width:8px}
+  .twk-body::-webkit-scrollbar-track{background:transparent;margin:2px}
+  .twk-body::-webkit-scrollbar-thumb{background:rgba(0,0,0,.15);border-radius:4px;
+    border:2px solid transparent;background-clip:content-box}
+  .twk-body::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,.25);
+    border:2px solid transparent;background-clip:content-box}
+  .twk-row{display:flex;flex-direction:column;gap:5px}
+  .twk-row-h{flex-direction:row;align-items:center;justify-content:space-between;gap:10px}
+  .twk-lbl{display:flex;justify-content:space-between;align-items:baseline;
+    color:rgba(41,38,27,.72)}
+  .twk-lbl>span:first-child{font-weight:500}
+  .twk-val{color:rgba(41,38,27,.5);font-variant-numeric:tabular-nums}
+
+  .twk-sect{font-size:10px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;
+    color:rgba(41,38,27,.45);padding:10px 0 0}
+  .twk-sect:first-child{padding-top:0}
+
+  .twk-field{appearance:none;box-sizing:border-box;width:100%;min-width:0;height:26px;padding:0 8px;
+    border:.5px solid rgba(0,0,0,.1);border-radius:7px;
+    background:rgba(255,255,255,.6);color:inherit;font:inherit;outline:none}
+  .twk-field:focus{border-color:rgba(0,0,0,.25);background:rgba(255,255,255,.85)}
+  select.twk-field{padding-right:22px;
+    background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'><path fill='rgba(0,0,0,.5)' d='M0 0h10L5 6z'/></svg>");
+    background-repeat:no-repeat;background-position:right 8px center}
+
+  .twk-slider{appearance:none;-webkit-appearance:none;width:100%;height:4px;margin:6px 0;
+    border-radius:999px;background:rgba(0,0,0,.12);outline:none}
+  .twk-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;
+    width:14px;height:14px;border-radius:50%;background:#fff;
+    border:.5px solid rgba(0,0,0,.12);box-shadow:0 1px 3px rgba(0,0,0,.2);cursor:default}
+  .twk-slider::-moz-range-thumb{width:14px;height:14px;border-radius:50%;
+    background:#fff;border:.5px solid rgba(0,0,0,.12);box-shadow:0 1px 3px rgba(0,0,0,.2);cursor:default}
+
+  .twk-seg{position:relative;display:flex;padding:2px;border-radius:8px;
+    background:rgba(0,0,0,.06);user-select:none}
+  .twk-seg-thumb{position:absolute;top:2px;bottom:2px;border-radius:6px;
+    background:rgba(255,255,255,.9);box-shadow:0 1px 2px rgba(0,0,0,.12);
+    transition:left .15s cubic-bezier(.3,.7,.4,1),width .15s}
+  .twk-seg.dragging .twk-seg-thumb{transition:none}
+  .twk-seg button{appearance:none;position:relative;z-index:1;flex:1;border:0;
+    background:transparent;color:inherit;font:inherit;font-weight:500;min-height:22px;
+    border-radius:6px;cursor:default;padding:4px 6px;line-height:1.2;
+    overflow-wrap:anywhere}
+
+  .twk-toggle{position:relative;width:32px;height:18px;border:0;border-radius:999px;
+    background:rgba(0,0,0,.15);transition:background .15s;cursor:default;padding:0}
+  .twk-toggle[data-on="1"]{background:#34c759}
+  .twk-toggle i{position:absolute;top:2px;left:2px;width:14px;height:14px;border-radius:50%;
+    background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.25);transition:transform .15s}
+  .twk-toggle[data-on="1"] i{transform:translateX(14px)}
+
+  .twk-num{display:flex;align-items:center;box-sizing:border-box;min-width:0;height:26px;padding:0 0 0 8px;
+    border:.5px solid rgba(0,0,0,.1);border-radius:7px;background:rgba(255,255,255,.6)}
+  .twk-num-lbl{font-weight:500;color:rgba(41,38,27,.6);cursor:ew-resize;
+    user-select:none;padding-right:8px}
+  .twk-num input{flex:1;min-width:0;height:100%;border:0;background:transparent;
+    font:inherit;font-variant-numeric:tabular-nums;text-align:right;padding:0 8px 0 0;
+    outline:none;color:inherit;-moz-appearance:textfield}
+  .twk-num input::-webkit-inner-spin-button,.twk-num input::-webkit-outer-spin-button{
+    -webkit-appearance:none;margin:0}
+  .twk-num-unit{padding-right:8px;color:rgba(41,38,27,.45)}
+
+  .twk-btn{appearance:none;height:26px;padding:0 12px;border:0;border-radius:7px;
+    background:rgba(0,0,0,.78);color:#fff;font:inherit;font-weight:500;cursor:default}
+  .twk-btn:hover{background:rgba(0,0,0,.88)}
+  .twk-btn.secondary{background:rgba(0,0,0,.06);color:inherit}
+  .twk-btn.secondary:hover{background:rgba(0,0,0,.1)}
+
+  .twk-swatch{appearance:none;-webkit-appearance:none;width:56px;height:22px;
+    border:.5px solid rgba(0,0,0,.1);border-radius:6px;padding:0;cursor:default;
+    background:transparent;flex-shrink:0}
+  .twk-swatch::-webkit-color-swatch-wrapper{padding:0}
+  .twk-swatch::-webkit-color-swatch{border:0;border-radius:5.5px}
+  .twk-swatch::-moz-color-swatch{border:0;border-radius:5.5px}
+
+  .twk-chips{display:flex;gap:6px}
+  .twk-chip{position:relative;appearance:none;flex:1;min-width:0;height:46px;
+    padding:0;border:0;border-radius:6px;overflow:hidden;cursor:default;
+    box-shadow:0 0 0 .5px rgba(0,0,0,.12),0 1px 2px rgba(0,0,0,.06);
+    transition:transform .12s cubic-bezier(.3,.7,.4,1),box-shadow .12s}
+  .twk-chip:hover{transform:translateY(-1px);
+    box-shadow:0 0 0 .5px rgba(0,0,0,.18),0 4px 10px rgba(0,0,0,.12)}
+  .twk-chip[data-on="1"]{box-shadow:0 0 0 1.5px rgba(0,0,0,.85),
+    0 2px 6px rgba(0,0,0,.15)}
+  .twk-chip>span{position:absolute;top:0;bottom:0;right:0;width:34%;
+    display:flex;flex-direction:column;box-shadow:-1px 0 0 rgba(0,0,0,.1)}
+  .twk-chip>span>i{flex:1;box-shadow:0 -1px 0 rgba(0,0,0,.1)}
+  .twk-chip>span>i:first-child{box-shadow:none}
+  .twk-chip svg{position:absolute;top:6px;left:6px;width:13px;height:13px;
+    filter:drop-shadow(0 1px 1px rgba(0,0,0,.3))}
+`;
+const TWEAKS_STORAGE_KEY = "decentlan.tweaks";
+function useTweaks(defaults) {
+  const [values, setValues] = React.useState(() => {
+    try {
+      const saved = JSON.parse(localStorage.getItem(TWEAKS_STORAGE_KEY) || "{}");
+      return { ...defaults, ...saved };
+    } catch (e) {
+      return defaults;
+    }
+  });
+  const setTweak = React.useCallback((keyOrEdits, val) => {
+    const edits = typeof keyOrEdits === "object" && keyOrEdits !== null ? keyOrEdits : { [keyOrEdits]: val };
+    setValues((prev) => {
+      const next = { ...prev, ...edits };
+      try {
+        localStorage.setItem(TWEAKS_STORAGE_KEY, JSON.stringify(next));
+      } catch (e) {
+      }
+      return next;
+    });
+    try {
+      window.dispatchEvent(new CustomEvent("tweakchange", { detail: edits }));
+    } catch (e) {
+    }
+  }, []);
+  return [values, setTweak];
+}
+function TweaksPanel({ title = "Tweaks", children }) {
+  const [open, setOpen] = React.useState(false);
+  const dragRef = React.useRef(null);
+  const offsetRef = React.useRef({ x: 16, y: 16 });
+  const PAD = 16;
+  const clampToViewport = React.useCallback(() => {
+    const panel = dragRef.current;
+    if (!panel)
+      return;
+    const w = panel.offsetWidth, h = panel.offsetHeight;
+    const maxRight = Math.max(PAD, window.innerWidth - w - PAD);
+    const maxBottom = Math.max(PAD, window.innerHeight - h - PAD);
+    offsetRef.current = {
+      x: Math.min(maxRight, Math.max(PAD, offsetRef.current.x)),
+      y: Math.min(maxBottom, Math.max(PAD, offsetRef.current.y))
+    };
+    panel.style.right = offsetRef.current.x + "px";
+    panel.style.bottom = offsetRef.current.y + "px";
+  }, []);
+  React.useEffect(() => {
+    if (!open)
+      return;
+    clampToViewport();
+    if (typeof ResizeObserver === "undefined") {
+      window.addEventListener("resize", clampToViewport);
+      return () => window.removeEventListener("resize", clampToViewport);
+    }
+    const ro = new ResizeObserver(clampToViewport);
+    ro.observe(document.documentElement);
+    return () => ro.disconnect();
+  }, [open, clampToViewport]);
+  React.useEffect(() => {
+    const onMsg = (e) => {
+      var _a;
+      const t = (_a = e == null ? void 0 : e.data) == null ? void 0 : _a.type;
+      if (t === "__activate_edit_mode")
+        setOpen(true);
+      else if (t === "__deactivate_edit_mode")
+        setOpen(false);
+    };
+    window.addEventListener("message", onMsg);
+    window.parent.postMessage({ type: "__edit_mode_available" }, "*");
+    return () => window.removeEventListener("message", onMsg);
+  }, []);
+  const dismiss = () => {
+    setOpen(false);
+    window.parent.postMessage({ type: "__edit_mode_dismissed" }, "*");
+  };
+  const onDragStart = (e) => {
+    const panel = dragRef.current;
+    if (!panel)
+      return;
+    const r = panel.getBoundingClientRect();
+    const sx = e.clientX, sy = e.clientY;
+    const startRight = window.innerWidth - r.right;
+    const startBottom = window.innerHeight - r.bottom;
+    const move = (ev) => {
+      offsetRef.current = {
+        x: startRight - (ev.clientX - sx),
+        y: startBottom - (ev.clientY - sy)
+      };
+      clampToViewport();
+    };
+    const up = () => {
+      window.removeEventListener("mousemove", move);
+      window.removeEventListener("mouseup", up);
+    };
+    window.addEventListener("mousemove", move);
+    window.addEventListener("mouseup", up);
+  };
+  if (!open)
+    return /* @__PURE__ */ React.createElement("button", { onClick: () => setOpen(true), title, "aria-label": title, style: {
+      position: "fixed",
+      right: 16,
+      bottom: 16,
+      zIndex: 2147483646,
+      width: 40,
+      height: 40,
+      borderRadius: 11,
+      cursor: "pointer",
+      background: "var(--panel-2)",
+      border: "1px solid var(--line)",
+      color: "var(--dim)",
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "center",
+      boxShadow: "0 6px 20px rgba(0,0,0,0.28)"
+    } }, /* @__PURE__ */ React.createElement(Icon, { name: "sliders", size: 18, stroke: 1.9 }));
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("style", null, __TWEAKS_STYLE), /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      ref: dragRef,
+      className: "twk-panel",
+      "data-omelette-chrome": "",
+      style: { right: offsetRef.current.x, bottom: offsetRef.current.y }
+    },
+    /* @__PURE__ */ React.createElement("div", { className: "twk-hd", onMouseDown: onDragStart }, /* @__PURE__ */ React.createElement("b", null, title), /* @__PURE__ */ React.createElement(
+      "button",
+      {
+        className: "twk-x",
+        "aria-label": "Close tweaks",
+        onMouseDown: (e) => e.stopPropagation(),
+        onClick: dismiss
+      },
+      "\u2715"
+    )),
+    /* @__PURE__ */ React.createElement("div", { className: "twk-body" }, children)
+  ));
+}
+function TweakSection({ label, children }) {
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("div", { className: "twk-sect" }, label), children);
+}
+function TweakRow({ label, value, children, inline = false }) {
+  return /* @__PURE__ */ React.createElement("div", { className: inline ? "twk-row twk-row-h" : "twk-row" }, /* @__PURE__ */ React.createElement("div", { className: "twk-lbl" }, /* @__PURE__ */ React.createElement("span", null, label), value != null && /* @__PURE__ */ React.createElement("span", { className: "twk-val" }, value)), children);
+}
+function TweakSlider({ label, value, min = 0, max = 100, step = 1, unit = "", onChange }) {
+  return /* @__PURE__ */ React.createElement(TweakRow, { label, value: `${value}${unit}` }, /* @__PURE__ */ React.createElement(
+    "input",
+    {
+      type: "range",
+      className: "twk-slider",
+      min,
+      max,
+      step,
+      value,
+      onChange: (e) => onChange(Number(e.target.value))
+    }
+  ));
+}
+function TweakToggle({ label, value, onChange }) {
+  return /* @__PURE__ */ React.createElement("div", { className: "twk-row twk-row-h" }, /* @__PURE__ */ React.createElement("div", { className: "twk-lbl" }, /* @__PURE__ */ React.createElement("span", null, label)), /* @__PURE__ */ React.createElement(
+    "button",
+    {
+      type: "button",
+      className: "twk-toggle",
+      "data-on": value ? "1" : "0",
+      role: "switch",
+      "aria-checked": !!value,
+      onClick: () => onChange(!value)
+    },
+    /* @__PURE__ */ React.createElement("i", null)
+  ));
+}
+function TweakRadio({ label, value, options, onChange }) {
+  var _a;
+  const trackRef = React.useRef(null);
+  const [dragging, setDragging] = React.useState(false);
+  const valueRef = React.useRef(value);
+  valueRef.current = value;
+  const labelLen = (o) => String(typeof o === "object" ? o.label : o).length;
+  const maxLen = options.reduce((m, o) => Math.max(m, labelLen(o)), 0);
+  const fitsAsSegments = maxLen <= ((_a = { 2: 16, 3: 10 }[options.length]) != null ? _a : 0);
+  if (!fitsAsSegments) {
+    const resolve = (s) => {
+      const m = options.find((o) => String(typeof o === "object" ? o.value : o) === s);
+      return m === void 0 ? s : typeof m === "object" ? m.value : m;
+    };
+    return /* @__PURE__ */ React.createElement(
+      TweakSelect,
+      {
+        label,
+        value,
+        options,
+        onChange: (s) => onChange(resolve(s))
+      }
+    );
+  }
+  const opts = options.map((o) => typeof o === "object" ? o : { value: o, label: o });
+  const idx = Math.max(0, opts.findIndex((o) => o.value === value));
+  const n = opts.length;
+  const segAt = (clientX) => {
+    const r = trackRef.current.getBoundingClientRect();
+    const inner = r.width - 4;
+    const i = Math.floor((clientX - r.left - 2) / inner * n);
+    return opts[Math.max(0, Math.min(n - 1, i))].value;
+  };
+  const onPointerDown = (e) => {
+    setDragging(true);
+    const v0 = segAt(e.clientX);
+    if (v0 !== valueRef.current)
+      onChange(v0);
+    const move = (ev) => {
+      if (!trackRef.current)
+        return;
+      const v = segAt(ev.clientX);
+      if (v !== valueRef.current)
+        onChange(v);
+    };
+    const up = () => {
+      setDragging(false);
+      window.removeEventListener("pointermove", move);
+      window.removeEventListener("pointerup", up);
+    };
+    window.addEventListener("pointermove", move);
+    window.addEventListener("pointerup", up);
+  };
+  return /* @__PURE__ */ React.createElement(TweakRow, { label }, /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      ref: trackRef,
+      role: "radiogroup",
+      onPointerDown,
+      className: dragging ? "twk-seg dragging" : "twk-seg"
+    },
+    /* @__PURE__ */ React.createElement(
+      "div",
+      {
+        className: "twk-seg-thumb",
+        style: {
+          left: `calc(2px + ${idx} * (100% - 4px) / ${n})`,
+          width: `calc((100% - 4px) / ${n})`
+        }
+      }
+    ),
+    opts.map((o) => /* @__PURE__ */ React.createElement("button", { key: o.value, type: "button", role: "radio", "aria-checked": o.value === value }, o.label))
+  ));
+}
+function TweakSelect({ label, value, options, onChange }) {
+  return /* @__PURE__ */ React.createElement(TweakRow, { label }, /* @__PURE__ */ React.createElement("select", { className: "twk-field", value, onChange: (e) => onChange(e.target.value) }, options.map((o) => {
+    const v = typeof o === "object" ? o.value : o;
+    const l = typeof o === "object" ? o.label : o;
+    return /* @__PURE__ */ React.createElement("option", { key: v, value: v }, l);
+  })));
+}
+function TweakText({ label, value, placeholder, onChange }) {
+  return /* @__PURE__ */ React.createElement(TweakRow, { label }, /* @__PURE__ */ React.createElement(
+    "input",
+    {
+      className: "twk-field",
+      type: "text",
+      value,
+      placeholder,
+      onChange: (e) => onChange(e.target.value)
+    }
+  ));
+}
+function TweakNumber({ label, value, min, max, step = 1, unit = "", onChange }) {
+  const clamp = (n) => {
+    if (min != null && n < min)
+      return min;
+    if (max != null && n > max)
+      return max;
+    return n;
+  };
+  const startRef = React.useRef({ x: 0, val: 0 });
+  const onScrubStart = (e) => {
+    e.preventDefault();
+    startRef.current = { x: e.clientX, val: value };
+    const decimals = (String(step).split(".")[1] || "").length;
+    const move = (ev) => {
+      const dx = ev.clientX - startRef.current.x;
+      const raw = startRef.current.val + dx * step;
+      const snapped = Math.round(raw / step) * step;
+      onChange(clamp(Number(snapped.toFixed(decimals))));
+    };
+    const up = () => {
+      window.removeEventListener("pointermove", move);
+      window.removeEventListener("pointerup", up);
+    };
+    window.addEventListener("pointermove", move);
+    window.addEventListener("pointerup", up);
+  };
+  return /* @__PURE__ */ React.createElement("div", { className: "twk-num" }, /* @__PURE__ */ React.createElement("span", { className: "twk-num-lbl", onPointerDown: onScrubStart }, label), /* @__PURE__ */ React.createElement(
+    "input",
+    {
+      type: "number",
+      value,
+      min,
+      max,
+      step,
+      onChange: (e) => onChange(clamp(Number(e.target.value)))
+    }
+  ), unit && /* @__PURE__ */ React.createElement("span", { className: "twk-num-unit" }, unit));
+}
+function __twkIsLight(hex) {
+  const h = String(hex).replace("#", "");
+  const x = h.length === 3 ? h.replace(/./g, (c) => c + c) : h.padEnd(6, "0");
+  const n = parseInt(x.slice(0, 6), 16);
+  if (Number.isNaN(n))
+    return true;
+  const r = n >> 16 & 255, g = n >> 8 & 255, b = n & 255;
+  return r * 299 + g * 587 + b * 114 > 148e3;
+}
+const __TwkCheck = ({ light }) => /* @__PURE__ */ React.createElement("svg", { viewBox: "0 0 14 14", "aria-hidden": "true" }, /* @__PURE__ */ React.createElement(
+  "path",
+  {
+    d: "M3 7.2 5.8 10 11 4.2",
+    fill: "none",
+    strokeWidth: "2.2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    stroke: light ? "rgba(0,0,0,.78)" : "#fff"
+  }
+));
+function TweakColor({ label, value, options, onChange }) {
+  if (!options || !options.length) {
+    return /* @__PURE__ */ React.createElement("div", { className: "twk-row twk-row-h" }, /* @__PURE__ */ React.createElement("div", { className: "twk-lbl" }, /* @__PURE__ */ React.createElement("span", null, label)), /* @__PURE__ */ React.createElement(
+      "input",
+      {
+        type: "color",
+        className: "twk-swatch",
+        value,
+        onChange: (e) => onChange(e.target.value)
+      }
+    ));
+  }
+  const key = (o) => String(JSON.stringify(o)).toLowerCase();
+  const cur = key(value);
+  return /* @__PURE__ */ React.createElement(TweakRow, { label }, /* @__PURE__ */ React.createElement("div", { className: "twk-chips", role: "radiogroup" }, options.map((o, i) => {
+    const colors = Array.isArray(o) ? o : [o];
+    const [hero, ...rest] = colors;
+    const sup = rest.slice(0, 4);
+    const on = key(o) === cur;
+    return /* @__PURE__ */ React.createElement(
+      "button",
+      {
+        key: i,
+        type: "button",
+        className: "twk-chip",
+        role: "radio",
+        "aria-checked": on,
+        "data-on": on ? "1" : "0",
+        "aria-label": colors.join(", "),
+        title: colors.join(" \xB7 "),
+        style: { background: hero },
+        onClick: () => onChange(o)
+      },
+      sup.length > 0 && /* @__PURE__ */ React.createElement("span", null, sup.map((c, j) => /* @__PURE__ */ React.createElement("i", { key: j, style: { background: c } }))),
+      on && /* @__PURE__ */ React.createElement(__TwkCheck, { light: __twkIsLight(hero) })
+    );
+  })));
+}
+function TweakButton({ label, onClick, secondary = false }) {
+  return /* @__PURE__ */ React.createElement(
+    "button",
+    {
+      type: "button",
+      className: secondary ? "twk-btn secondary" : "twk-btn",
+      onClick
+    },
+    label
+  );
+}
+Object.assign(window, {
+  useTweaks,
+  TweaksPanel,
+  TweakSection,
+  TweakRow,
+  TweakSlider,
+  TweakToggle,
+  TweakRadio,
+  TweakSelect,
+  TweakText,
+  TweakNumber,
+  TweakColor,
+  TweakButton
+});
+function RequestsBlock({ T, requests, onAct }) {
+  if (!requests.length)
+    return null;
+  return /* @__PURE__ */ React.createElement("div", { style: { padding: "4px 0 8px" } }, /* @__PURE__ */ React.createElement(Section, { label: T.requests, count: requests.length, style: { margin: "4px 4px 8px" } }), /* @__PURE__ */ React.createElement("div", { style: { display: "flex", flexDirection: "column", gap: 6 } }, requests.map((r) => /* @__PURE__ */ React.createElement("div", { key: r.id, style: {
+    padding: "9px 10px",
+    borderRadius: 8,
+    background: "var(--panel-2)",
+    border: "1px solid var(--line)",
+    display: "flex",
+    flexDirection: "column",
+    gap: 8
+  } }, /* @__PURE__ */ React.createElement("div", { style: { display: "flex", alignItems: "center", gap: 8 } }, /* @__PURE__ */ React.createElement(DkIdenticon, { seed: r.carrier, size: 26, radius: 6 }), /* @__PURE__ */ React.createElement("div", { style: { minWidth: 0, flex: 1 } }, /* @__PURE__ */ React.createElement(Mono, { size: 12, copy: r.carrier, title: r.carrier }, shortKey(r.carrier, 8, 6)), /* @__PURE__ */ React.createElement("div", { style: { fontFamily: "var(--mono)", fontSize: 10.5, color: "var(--faint)", marginTop: 2 } }, "via ", r.via, " \xB7 ", r.time))), /* @__PURE__ */ React.createElement("div", { style: { display: "flex", gap: 6 } }, /* @__PURE__ */ React.createElement(Btn, { tone: "ok", icon: "check", size: "sm", onClick: () => onAct(r.id, "accept"), style: { flex: 1 } }, T.accept), /* @__PURE__ */ React.createElement(Btn, { tone: "danger", icon: "x", size: "sm", onClick: () => onAct(r.id, "reject"), style: { flex: 1 } }, T.reject))))));
+}
+function PeerRow({ peer, T, active, onClick }) {
+  const name = peer.alias || peer.userId;
+  return /* @__PURE__ */ React.createElement("button", { onClick, style: {
+    display: "flex",
+    alignItems: "center",
+    gap: 10,
+    width: "100%",
+    textAlign: "left",
+    padding: "var(--row-pad)",
+    borderRadius: 8,
+    cursor: "pointer",
+    fontFamily: "inherit",
+    border: "1px solid " + (active ? "var(--line)" : "transparent"),
+    background: active ? "var(--panel-2)" : "transparent"
+  } }, /* @__PURE__ */ React.createElement(DkAvatar, { peer, size: 32, radius: 7 }), /* @__PURE__ */ React.createElement("div", { style: { flex: 1, minWidth: 0 } }, /* @__PURE__ */ React.createElement("div", { style: { display: "flex", alignItems: "center", gap: 6 } }, /* @__PURE__ */ React.createElement("span", { style: {
+    fontFamily: peer.alias ? "var(--ui)" : "var(--mono)",
+    fontSize: 13.5,
+    fontWeight: 600,
+    color: "var(--text)",
+    whiteSpace: "nowrap",
+    overflow: "hidden",
+    textOverflow: "ellipsis"
+  } }, peer.alias || shortKey(peer.userId, 8, 5)), peer.agent && /* @__PURE__ */ React.createElement(Icon, { name: "bot", size: 13, color: "var(--faint)", stroke: 2 }), peer.wire === "64" && /* @__PURE__ */ React.createElement(Tag, { tone: "off", style: { height: 15, fontSize: 9.5, padding: "0 4px" } }, "w64")), /* @__PURE__ */ React.createElement("div", { style: { display: "flex", alignItems: "center", gap: 6, marginTop: 2 } }, /* @__PURE__ */ React.createElement("span", { style: { fontFamily: "var(--mono)", fontSize: 11, color: "var(--faint)" } }, peer.ip), /* @__PURE__ */ React.createElement("span", { style: { color: "var(--line)", fontSize: 11 } }, "\xB7"), /* @__PURE__ */ React.createElement("span", { style: {
+    fontSize: 11,
+    color: "var(--dim)",
+    whiteSpace: "nowrap",
+    overflow: "hidden",
+    textOverflow: "ellipsis",
+    flex: 1,
+    minWidth: 0
+  } }, peer.lastMsg))), /* @__PURE__ */ React.createElement("div", { style: { display: "flex", flexDirection: "column", alignItems: "flex-end", gap: 4, flexShrink: 0 } }, /* @__PURE__ */ React.createElement("span", { style: { fontFamily: "var(--mono)", fontSize: 10.5, color: "var(--faint)" } }, peer.lastTime), peer.unread ? /* @__PURE__ */ React.createElement(Unread, { n: peer.unread }) : /* @__PURE__ */ React.createElement(StatusDot, { online: peer.online })));
+}
+function PeerSidebar({ T, peers, requests, activeId, onSelect, onAct, onAdd, prefillAddr, onPrefillConsumed }) {
+  const [q, setQ] = React.useState("");
+  const [addr, setAddr] = React.useState("");
+  const [addState, setAddState] = React.useState(null);
+  const [fromDeepLink, setFromDeepLink] = React.useState(false);
+  React.useEffect(() => {
+    if (prefillAddr) {
+      setAddr(prefillAddr);
+      setFromDeepLink(true);
+    }
+  }, [prefillAddr]);
+  const submitAddr = () => {
+    const v = addr.trim();
+    if (!v || addState && addState.kind === "sending")
+      return;
+    setAddState({ kind: "sending", msg: T.addSending });
+    Promise.resolve(onAdd(v)).then((r) => {
+      if (r && r.ok) {
+        setAddr("");
+        setFromDeepLink(false);
+        onPrefillConsumed && onPrefillConsumed();
+        setAddState({ kind: "ok", msg: T.addSent });
+      } else {
+        setAddState({ kind: "err", msg: r && r.error ? `${T.addFailed}: ${r.error}` : T.addFailed });
+      }
+    }).catch((e) => {
+      setAddState({ kind: "err", msg: `${T.addFailed}: ${e && e.message || e}` });
+    }).finally(() => {
+      setTimeout(() => setAddState((s) => s && s.kind !== "sending" ? null : s), 6e3);
+    });
+  };
+  const filtered = peers.filter((p) => {
+    if (!q)
+      return true;
+    const s = (p.alias || "") + " " + p.userId + " " + p.ip;
+    return s.toLowerCase().includes(q.toLowerCase());
+  });
+  const online = peers.filter((p) => p.online).length;
+  return /* @__PURE__ */ React.createElement("div", { style: { width: 320, flexShrink: 0, borderRight: "1px solid var(--line)", display: "flex", flexDirection: "column", background: "var(--panel)" } }, /* @__PURE__ */ React.createElement("div", { style: { padding: "12px 12px 10px", borderBottom: "1px solid var(--line)", display: "flex", flexDirection: "column", gap: 8 } }, fromDeepLink && /* @__PURE__ */ React.createElement("div", { style: {
+    fontFamily: "var(--ui)",
+    fontSize: 12,
+    lineHeight: 1.4,
+    color: "var(--text)",
+    background: "color-mix(in oklab, var(--accent), transparent 88%)",
+    border: "1px solid var(--accent)",
+    borderRadius: 8,
+    padding: "7px 10px"
+  } }, T.deepLinkConfirm || "\u901A\u8FC7\u94FE\u63A5\u6DFB\u52A0\u8FD9\u4F4D\u597D\u53CB? \u70B9\u300C\u6DFB\u52A0\u300D\u53D1\u9001\u597D\u53CB\u8BF7\u6C42 / Add this contact from the link? Tap Add to send a friend request."), /* @__PURE__ */ React.createElement("div", { style: { display: "flex", gap: 7 } }, /* @__PURE__ */ React.createElement(
+    "input",
+    {
+      value: addr,
+      onChange: (e) => {
+        setAddr(e.target.value);
+        if (fromDeepLink)
+          setFromDeepLink(false);
+      },
+      onKeyDown: (e) => {
+        if (e.key === "Enter")
+          submitAddr();
+      },
+      placeholder: T.addPlaceholder,
+      style: { ...inputStyle, ...fromDeepLink ? { borderColor: "var(--accent)" } : null }
+    }
+  ), /* @__PURE__ */ React.createElement(Btn, { tone: "solid", icon: "userPlus", onClick: submitAddr }, T.add)), addState && /* @__PURE__ */ React.createElement("div", { style: {
+    fontFamily: "var(--mono)",
+    fontSize: 11.5,
+    lineHeight: 1.35,
+    color: addState.kind === "err" ? "var(--bad, #e5484d)" : addState.kind === "ok" ? "var(--good, #46a758)" : "var(--faint)"
+  } }, addState.msg), /* @__PURE__ */ React.createElement("div", { style: { position: "relative", display: "flex", alignItems: "center" } }, /* @__PURE__ */ React.createElement(Icon, { name: "search", size: 15, color: "var(--faint)", stroke: 2, style: { position: "absolute", left: 9 } }), /* @__PURE__ */ React.createElement("input", { value: q, onChange: (e) => setQ(e.target.value), placeholder: T.search, style: { ...inputStyle, paddingLeft: 30 } }))), /* @__PURE__ */ React.createElement("div", { style: { flex: 1, overflow: "auto", padding: "10px 8px 16px" } }, /* @__PURE__ */ React.createElement(RequestsBlock, { T, requests, onAct }), /* @__PURE__ */ React.createElement(Section, { label: T.peers, count: `${online}/${peers.length}`, style: { margin: "6px 4px 8px" } }), /* @__PURE__ */ React.createElement("div", { style: { display: "flex", flexDirection: "column", gap: 2 } }, filtered.map((p) => /* @__PURE__ */ React.createElement(PeerRow, { key: p.id, peer: p, T, active: p.id === activeId, onClick: () => onSelect(p.id) })), !filtered.length && /* @__PURE__ */ React.createElement("div", { style: { padding: 16, textAlign: "center", fontFamily: "var(--mono)", fontSize: 12, color: "var(--faint)" } }, "no matches"))));
+}
+const inputStyle = {
+  flex: 1,
+  height: 32,
+  borderRadius: 7,
+  border: "1px solid var(--line)",
+  background: "var(--panel-2)",
+  color: "var(--text)",
+  fontFamily: "var(--mono)",
+  fontSize: 12.5,
+  padding: "0 10px",
+  outline: "none",
+  minWidth: 0
+};
+const mediaBtnStyle = {
+  width: 28,
+  height: 28,
+  borderRadius: 8,
+  border: "none",
+  background: "rgba(0,0,0,0.5)",
+  cursor: "pointer",
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "center",
+  lineHeight: 0
+};
+function dkRtcFileFromText(peerId, text) {
+  const m = /^received file via WebRTC: (.+) \(([^)]+)\)$/.exec(String(text || ""));
+  if (!m || !window.__dkRtcFiles)
+    return null;
+  const name = m[1];
+  for (const item of window.__dkRtcFiles.values()) {
+    if (item && item.peerId === peerId && item.name === name)
+      return item;
+  }
+  return null;
+}
+function dkCallFromText(text) {
+  const m = /^WebRTC (audio|video) call: (incoming|outgoing)$/.exec(String(text || ""));
+  return m ? { kind: m[1], direction: m[2] } : null;
+}
+function dkHtmlEscape(s) {
+  return String(s == null ? "" : s).replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#39;");
+}
+function dkSafeHref(s) {
+  const href = String(s || "").trim();
+  if (!href)
+    return "";
+  try {
+    const u = new URL(href, window.location.href);
+    if (u.protocol === "http:" || u.protocol === "https:" || u.protocol === "mailto:")
+      return u.href;
+  } catch (e) {
+  }
+  return "";
+}
+function dkInlineMarkdown(s) {
+  const text = String(s == null ? "" : s);
+  const tokenRe = /(`[^`\n]+`|\[[^\]\n]+\]\([^) \n]+(?: [^)]+)?\)|\*\*[^*\n]+?\*\*|\*[^*\n]+?\*)/g;
+  let out = "";
+  let last = 0;
+  let m;
+  while (m = tokenRe.exec(text)) {
+    out += dkHtmlEscape(text.slice(last, m.index));
+    const tok = m[0];
+    if (tok[0] === "`") {
+      out += "<code>" + dkHtmlEscape(tok.slice(1, -1)) + "</code>";
+    } else if (tok.startsWith("[")) {
+      const lm = /^\[([^\]\n]+)\]\(([^) \n]+)(?: [^)]+)?\)$/.exec(tok);
+      const href = lm && dkSafeHref(lm[2]);
+      out += href ? '<a href="' + dkHtmlEscape(href) + '" target="_blank" rel="noopener">' + dkHtmlEscape(lm[1]) + "</a>" : dkHtmlEscape(tok);
+    } else if (tok.startsWith("**")) {
+      out += "<strong>" + dkHtmlEscape(tok.slice(2, -2)) + "</strong>";
+    } else if (tok.startsWith("*")) {
+      out += "<em>" + dkHtmlEscape(tok.slice(1, -1)) + "</em>";
+    } else {
+      out += dkHtmlEscape(tok);
+    }
+    last = tokenRe.lastIndex;
+  }
+  out += dkHtmlEscape(text.slice(last));
+  return out;
+}
+function dkMarkdownHtml(src) {
+  const lines = String(src == null ? "" : src).replace(/\r\n?/g, "\n").split("\n");
+  let html = "";
+  let i = 0;
+  const isBlockStart = (line) => /^```/.test(line) || /^#{1,6}\s+/.test(line) || /^\s*[-*]\s+/.test(line) || /^\s*\d+\.\s+/.test(line);
+  while (i < lines.length) {
+    const line = lines[i];
+    if (!line.trim()) {
+      i += 1;
+      continue;
+    }
+    if (/^```/.test(line)) {
+      i += 1;
+      const code = [];
+      while (i < lines.length && !/^```/.test(lines[i])) {
+        code.push(lines[i]);
+        i += 1;
+      }
+      if (i < lines.length)
+        i += 1;
+      html += "<pre><code>" + dkHtmlEscape(code.join("\n")) + "</code></pre>";
+      continue;
+    }
+    const hm = /^(#{1,6})\s+(.+)$/.exec(line);
+    if (hm) {
+      const level = Math.min(6, hm[1].length);
+      html += "<h" + level + ">" + dkInlineMarkdown(hm[2]) + "</h" + level + ">";
+      i += 1;
+      continue;
+    }
+    if (/^\s*[-*]\s+/.test(line) || /^\s*\d+\.\s+/.test(line)) {
+      const ordered = /^\s*\d+\.\s+/.test(line);
+      html += ordered ? "<ol>" : "<ul>";
+      while (i < lines.length && (ordered ? /^\s*\d+\.\s+/.test(lines[i]) : /^\s*[-*]\s+/.test(lines[i]))) {
+        html += "<li>" + dkInlineMarkdown(lines[i].replace(ordered ? /^\s*\d+\.\s+/ : /^\s*[-*]\s+/, "")) + "</li>";
+        i += 1;
+      }
+      html += ordered ? "</ol>" : "</ul>";
+      continue;
+    }
+    const para = [line];
+    i += 1;
+    while (i < lines.length && lines[i].trim() && !isBlockStart(lines[i])) {
+      para.push(lines[i]);
+      i += 1;
+    }
+    html += "<p>" + para.map(dkInlineMarkdown).join("<br>") + "</p>";
+  }
+  return html || dkHtmlEscape(src);
+}
+function MarkdownText({ text }) {
+  return /* @__PURE__ */ React.createElement("div", { className: "dk-md", dangerouslySetInnerHTML: { __html: dkMarkdownHtml(text) } });
+}
+function Msg({ m, peer, T, onTheater, onDelete, onCancel, onRetry, onReveal, onCall, selMode, selected, onToggleSel, busy }) {
+  const mine = m.from === "me";
+  const rtcFile = !mine && !m.file ? dkRtcFileFromText(peer.userId || peer.id, m.text) : null;
+  const callRec = !m.file ? dkCallFromText(m.text) : null;
+  return /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      onClick: selMode ? () => onToggleSel(m.id) : void 0,
+      style: {
+        display: "flex",
+        justifyContent: mine ? "flex-end" : "flex-start",
+        alignItems: "flex-end",
+        gap: 8,
+        margin: "3px 0",
+        cursor: selMode ? "pointer" : "default",
+        borderRadius: 8,
+        background: selMode && selected ? "rgba(91,140,255,0.12)" : "transparent",
+        padding: selMode ? "2px 4px" : 0
+      }
+    },
+    selMode && /* @__PURE__ */ React.createElement("div", { style: {
+      alignSelf: "center",
+      width: 18,
+      height: 18,
+      borderRadius: 5,
+      flexShrink: 0,
+      border: "1.5px solid " + (selected ? "var(--accent)" : "var(--line)"),
+      background: selected ? "var(--accent)" : "transparent",
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "center"
+    } }, selected && /* @__PURE__ */ React.createElement(Icon, { name: "check", size: 12, stroke: 3, color: "#fff" })),
+    !mine && /* @__PURE__ */ React.createElement(DkAvatar, { peer, size: 24, radius: 6, dot: false }),
+    /* @__PURE__ */ React.createElement("div", { style: { maxWidth: m.file && (m.file.media === "image" || m.file.media === "video") || rtcFile && (rtcFile.media === "image" || rtcFile.media === "video") ? "min(680px, 88%)" : "64%", display: "flex", flexDirection: "column", alignItems: mine ? "flex-end" : "flex-start" } }, callRec ? /* @__PURE__ */ React.createElement(
+      "button",
+      {
+        onClick: () => onCall && onCall(peer.userId, callRec.kind === "video"),
+        style: { display: "flex", alignItems: "center", gap: 10, padding: "9px 12px", borderRadius: 12, border: "1px solid var(--line)", background: mine ? "var(--bub-me)" : "var(--bub-them)", color: mine ? "#fff" : "var(--text)", cursor: "pointer", fontFamily: "var(--mono)", fontSize: 12.5 }
+      },
+      /* @__PURE__ */ React.createElement(Icon, { name: callRec.kind === "video" ? "video" : "phone", size: 17, stroke: 2, color: mine ? "#fff" : "var(--accent)" }),
+      /* @__PURE__ */ React.createElement("span", null, callRec.direction === "incoming" ? "Incoming" : "Outgoing", " ", callRec.kind, " call"),
+      /* @__PURE__ */ React.createElement("span", { style: { color: mine ? "rgba(255,255,255,0.75)" : "var(--faint)" } }, "\xB7 redial")
+    ) : rtcFile ? /* @__PURE__ */ React.createElement("div", { style: {
+      display: "flex",
+      flexDirection: "column",
+      gap: 6,
+      maxWidth: rtcFile.media === "image" || rtcFile.media === "video" ? "100%" : 300,
+      width: rtcFile.media === "image" || rtcFile.media === "video" ? "100%" : void 0,
+      background: "var(--bub-them)",
+      border: "1px solid var(--line)",
+      borderRadius: 12,
+      padding: 6
+    } }, (rtcFile.media === "image" || rtcFile.media === "video") && /* @__PURE__ */ React.createElement("div", { "data-media": true, style: { position: "relative", lineHeight: 0 } }, rtcFile.media === "image" ? /* @__PURE__ */ React.createElement(
+      "img",
+      {
+        src: rtcFile.url,
+        alt: rtcFile.name,
+        style: { display: "block", width: "100%", maxHeight: "72vh", borderRadius: 8, objectFit: "contain" }
+      }
+    ) : /* @__PURE__ */ React.createElement(
+      "video",
+      {
+        src: rtcFile.url,
+        controls: true,
+        preload: "metadata",
+        style: { display: "block", width: "100%", maxHeight: "72vh", borderRadius: 8, objectFit: "contain", background: "#000" }
+      }
+    ), /* @__PURE__ */ React.createElement("div", { style: { position: "absolute", top: 8, right: 8, display: "flex", gap: 6 } }, /* @__PURE__ */ React.createElement(
+      "button",
+      {
+        onClick: () => onTheater({ kind: rtcFile.media, url: rtcFile.url, name: rtcFile.name }),
+        title: "theater / \u7F51\u9875\u5168\u5C4F",
+        style: mediaBtnStyle
+      },
+      /* @__PURE__ */ React.createElement(Icon, { name: "theater", size: 16, stroke: 2, color: "#fff" })
+    ), /* @__PURE__ */ React.createElement(
+      "button",
+      {
+        onClick: (e) => {
+          const w = e.currentTarget.closest("[data-media]");
+          const el = w && w.querySelector("video,img");
+          if (el && el.requestFullscreen)
+            el.requestFullscreen();
+        },
+        title: "fullscreen / \u5168\u5C4F",
+        style: mediaBtnStyle
+      },
+      /* @__PURE__ */ React.createElement(Icon, { name: "maximize", size: 16, stroke: 2, color: "#fff" })
+    ))), rtcFile.media === "audio" && /* @__PURE__ */ React.createElement("audio", { src: rtcFile.url, controls: true, style: { width: "100%" } }), /* @__PURE__ */ React.createElement("div", { style: { display: "flex", alignItems: "center", gap: 8, padding: "0 2px" } }, /* @__PURE__ */ React.createElement("span", { style: { flex: 1, minWidth: 0, fontFamily: "var(--mono)", fontSize: 11, color: "var(--faint)", whiteSpace: "nowrap", overflow: "hidden", textOverflow: "ellipsis" } }, rtcFile.name), /* @__PURE__ */ React.createElement("span", { style: { fontFamily: "var(--mono)", fontSize: 11, color: "var(--faint)", flexShrink: 0 } }, dkFileSize(rtcFile.size)), /* @__PURE__ */ React.createElement("a", { href: rtcFile.url, download: rtcFile.name, title: "download", style: { display: "inline-flex", flexShrink: 0 } }, /* @__PURE__ */ React.createElement(Icon, { name: "download", size: 15, stroke: 2, color: "var(--accent)" })))) : m.file ? (
+      // Inline preview/player. Received media: as soon as it's saved.
+      // Sent media: once it's fully delivered ('sent') — the daemon keeps a
+      // local copy so it plays on the sender's side too.
+      (m.file.media === "image" || m.file.media === "video" || m.file.media === "audio") && (mine ? m.file.status === "sent" : m.file.status !== "sending" && m.file.status !== "failed" && m.file.status !== "queued" && m.file.status !== "cancelled") ? (
+        // Received media → inline preview / player, with name, size, download.
+        /* @__PURE__ */ React.createElement("div", { style: {
+          display: "flex",
+          flexDirection: "column",
+          gap: 6,
+          maxWidth: m.file.media === "image" || m.file.media === "video" ? "100%" : 300,
+          width: m.file.media === "image" || m.file.media === "video" ? "100%" : void 0,
+          background: "var(--bub-them)",
+          border: "1px solid var(--line)",
+          borderRadius: 12,
+          padding: 6
+        } }, (m.file.media === "image" || m.file.media === "video") && /* @__PURE__ */ React.createElement("div", { "data-media": true, style: { position: "relative", lineHeight: 0 } }, m.file.media === "image" ? /* @__PURE__ */ React.createElement(
+          "img",
+          {
+            src: dkFileUrl(m.file.name),
+            alt: m.file.name,
+            style: { display: "block", width: "100%", maxHeight: "72vh", borderRadius: 8, objectFit: "contain" }
+          }
+        ) : /* @__PURE__ */ React.createElement(
+          "video",
+          {
+            src: dkFileUrl(m.file.name),
+            controls: true,
+            preload: "metadata",
+            style: { display: "block", width: "100%", maxHeight: "72vh", borderRadius: 8, objectFit: "contain", background: "#000" }
+          }
+        ), /* @__PURE__ */ React.createElement("div", { style: { position: "absolute", top: 8, right: 8, display: "flex", gap: 6 } }, /* @__PURE__ */ React.createElement(
+          "button",
+          {
+            onClick: () => onTheater({ kind: m.file.media, url: dkFileUrl(m.file.name), name: m.file.name }),
+            title: "theater / \u7F51\u9875\u5168\u5C4F",
+            style: mediaBtnStyle
+          },
+          /* @__PURE__ */ React.createElement(Icon, { name: "theater", size: 16, stroke: 2, color: "#fff" })
+        ), /* @__PURE__ */ React.createElement(
+          "button",
+          {
+            onClick: (e) => {
+              const w = e.currentTarget.closest("[data-media]");
+              const el = w && w.querySelector("video,img");
+              if (el && el.requestFullscreen)
+                el.requestFullscreen();
+            },
+            title: "fullscreen / \u5168\u5C4F",
+            style: mediaBtnStyle
+          },
+          /* @__PURE__ */ React.createElement(Icon, { name: "maximize", size: 16, stroke: 2, color: "#fff" })
+        ))), m.file.media === "audio" && /* @__PURE__ */ React.createElement("audio", { src: dkFileUrl(m.file.name), controls: true, style: { width: "100%" } }), /* @__PURE__ */ React.createElement("div", { style: { display: "flex", alignItems: "center", gap: 8, padding: "0 2px" } }, /* @__PURE__ */ React.createElement("span", { style: { flex: 1, minWidth: 0, fontFamily: "var(--mono)", fontSize: 11, color: "var(--faint)", whiteSpace: "nowrap", overflow: "hidden", textOverflow: "ellipsis" } }, m.file.name), /* @__PURE__ */ React.createElement("span", { style: { fontFamily: "var(--mono)", fontSize: 11, color: "var(--faint)", flexShrink: 0 } }, m.file.size), onReveal && /* @__PURE__ */ React.createElement(
+          "button",
+          {
+            title: T.revealInFinder || "\u5728\u6587\u4EF6\u7BA1\u7406\u5668\u4E2D\u663E\u793A / Show in file manager",
+            onClick: (e) => {
+              e.stopPropagation();
+              onReveal(m.file.name);
+            },
+            style: { background: "none", border: "none", cursor: "pointer", padding: 0, display: "inline-flex", flexShrink: 0 }
+          },
+          /* @__PURE__ */ React.createElement(Icon, { name: "folderOpen", size: 15, stroke: 2, color: "var(--accent)" })
+        ), /* @__PURE__ */ React.createElement("a", { href: dkFileDownloadUrl(m.file.name), download: m.file.name, title: "download", style: { display: "inline-flex", flexShrink: 0 } }, /* @__PURE__ */ React.createElement(Icon, { name: "download", size: 15, stroke: 2, color: "var(--accent)" }))))
+      ) : (() => {
+        const cardStyle = {
+          display: "flex",
+          alignItems: "center",
+          gap: 10,
+          padding: "10px 12px",
+          borderRadius: 10,
+          background: mine ? "var(--bub-me)" : "var(--bub-them)",
+          border: "1px solid " + (mine ? "transparent" : "var(--line)"),
+          minWidth: 200,
+          textDecoration: "none",
+          cursor: mine ? "default" : "pointer"
+        };
+        const icon = /* @__PURE__ */ React.createElement("div", { style: { width: 34, height: 34, borderRadius: 7, flexShrink: 0, background: mine ? "rgba(255,255,255,0.16)" : "var(--chip)", display: "flex", alignItems: "center", justifyContent: "center", color: mine ? "#fff" : "var(--accent)" } }, /* @__PURE__ */ React.createElement(Icon, { name: m.file.media === "image" ? "image" : m.file.media === "video" ? "video" : m.file.media === "audio" ? "play" : "file", size: 18, stroke: 1.9 }));
+        const meta = /* @__PURE__ */ React.createElement("div", { style: { minWidth: 0, flex: 1 } }, /* @__PURE__ */ React.createElement("div", { style: { fontFamily: "var(--mono)", fontSize: 12.5, fontWeight: 600, color: mine ? "#fff" : "var(--text)", whiteSpace: "nowrap", overflow: "hidden", textOverflow: "ellipsis" } }, m.file.name), /* @__PURE__ */ React.createElement("div", { style: { fontFamily: "var(--mono)", fontSize: 11, color: mine ? "rgba(255,255,255,0.7)" : "var(--faint)", marginTop: 1 } }, busy === "cancel" ? `${m.file.size} \xB7 ${T.cancelling || "Cancelling\u2026"}` : busy === "retry" ? `${m.file.size} \xB7 ${T.retrying || "Retrying\u2026"}` : m.file.status === "queued" ? `${m.file.size} \xB7 ${T.queued || "queued"}` : m.file.status === "sending" ? `${m.file.size} \xB7 ${dkPct(m.file.pct)}${m.file.kbps ? " \xB7 " + dkSpeed(m.file.kbps) : ""}` : m.file.status === "failed" ? `${m.file.size} \xB7 failed` : m.file.status === "cancelled" ? `${m.file.size} \xB7 ${T.cancelled || "cancelled"}` : mine ? `${m.file.size} \xB7 sent` : `${m.file.size} \xB7 ${T.open || "open"}`));
+        if (mine) {
+          const btnBusy = !!busy;
+          return /* @__PURE__ */ React.createElement("div", { style: { ...cardStyle, opacity: btnBusy ? 0.85 : 1 } }, icon, meta, busy === "cancel" || busy === "retry" ? /* @__PURE__ */ React.createElement(Icon, { name: "clock", size: 16, stroke: 2, color: "rgba(255,255,255,0.85)" }) : m.file.status === "queued" ? /* @__PURE__ */ React.createElement(Icon, { name: "clock", size: 16, stroke: 2, color: "rgba(255,255,255,0.85)" }) : m.file.status === "sending" ? /* @__PURE__ */ React.createElement("span", { style: { fontFamily: "var(--mono)", fontSize: 11, fontWeight: 700, color: "rgba(255,255,255,0.9)", whiteSpace: "nowrap" } }, dkPct(m.file.pct), m.file.kbps ? " \xB7 " + dkSpeed(m.file.kbps) : "") : m.file.status === "failed" || m.file.status === "cancelled" ? /* @__PURE__ */ React.createElement(Icon, { name: "x", size: 16, stroke: 2.4, color: "rgba(255,200,190,0.95)" }) : /* @__PURE__ */ React.createElement(Icon, { name: "checkCheck", size: 16, stroke: 2, color: "rgba(255,255,255,0.85)" }), (m.file.status === "sending" || m.file.status === "queued" || busy === "cancel") && m.id && /* @__PURE__ */ React.createElement(
+            "button",
+            {
+              title: T.cancel || "cancel",
+              disabled: btnBusy,
+              onClick: (e) => {
+                e.stopPropagation();
+                if (!btnBusy)
+                  onCancel(m.id);
+              },
+              style: { background: "rgba(255,255,255,0.16)", border: "none", borderRadius: 6, cursor: btnBusy ? "wait" : "pointer", padding: 3, marginLeft: 2, display: "inline-flex", flexShrink: 0, opacity: btnBusy ? 0.5 : 1 }
+            },
+            /* @__PURE__ */ React.createElement(Icon, { name: "x", size: 13, stroke: 2.4, color: "#fff" })
+          ), m.file.status !== "sent" && m.id && /* @__PURE__ */ React.createElement(
+            "button",
+            {
+              title: T.retry || "retry",
+              disabled: btnBusy,
+              onClick: (e) => {
+                e.stopPropagation();
+                if (!btnBusy)
+                  onRetry(m.id);
+              },
+              style: { background: "rgba(255,255,255,0.16)", border: "none", borderRadius: 6, cursor: btnBusy ? "wait" : "pointer", padding: 3, marginLeft: 2, display: "inline-flex", flexShrink: 0, opacity: btnBusy ? 0.5 : 1 }
+            },
+            /* @__PURE__ */ React.createElement(Icon, { name: "refresh", size: 13, stroke: 2.2, color: "#fff" })
+          ));
+        }
+        return /* @__PURE__ */ React.createElement(
+          "div",
+          {
+            style: cardStyle,
+            title: "open",
+            onClick: () => window.open(dkFileUrl(m.file.name), "_blank", "noopener")
+          },
+          icon,
+          meta,
+          onReveal && /* @__PURE__ */ React.createElement(
+            "button",
+            {
+              title: T.revealInFinder || "\u5728\u6587\u4EF6\u7BA1\u7406\u5668\u4E2D\u663E\u793A / Show in file manager",
+              onClick: (e) => {
+                e.stopPropagation();
+                onReveal(m.file.name);
+              },
+              style: { background: "none", border: "none", cursor: "pointer", padding: 0, display: "inline-flex", flexShrink: 0 }
+            },
+            /* @__PURE__ */ React.createElement(Icon, { name: "folderOpen", size: 16, stroke: 2, color: "var(--accent)" })
+          ),
+          /* @__PURE__ */ React.createElement(
+            "a",
+            {
+              href: dkFileDownloadUrl(m.file.name),
+              download: m.file.name,
+              title: "download",
+              onClick: (e) => e.stopPropagation(),
+              style: { display: "inline-flex", flexShrink: 0 }
+            },
+            /* @__PURE__ */ React.createElement(Icon, { name: "download", size: 16, stroke: 2, color: "var(--accent)" })
+          )
+        );
+      })()
+    ) : /* @__PURE__ */ React.createElement("div", { style: {
+      padding: "8px 12px",
+      borderRadius: 12,
+      borderBottomRightRadius: mine ? 4 : 12,
+      borderBottomLeftRadius: mine ? 12 : 4,
+      // Incoming messages are tinted by delivery path so the split is
+      // visible: amber = arrived via the express relay (offline), plain =
+      // live online session. Outgoing keep the accent bubble.
+      background: mine ? "var(--bub-me)" : m.via === "offline" ? "rgba(245,158,11,0.16)" : "var(--bub-them)",
+      color: mine ? "#fff" : "var(--text)",
+      border: "1px solid " + (mine ? "transparent" : m.via === "offline" ? "rgba(245,158,11,0.55)" : "var(--line)"),
+      fontFamily: "var(--ui)",
+      fontSize: 13.5,
+      lineHeight: 1.4,
+      letterSpacing: -0.1,
+      wordBreak: "break-word"
+    } }, /* @__PURE__ */ React.createElement(MarkdownText, { text: m.text })), /* @__PURE__ */ React.createElement("div", { style: { display: "flex", alignItems: "center", gap: 4, margin: "3px 3px 0" } }, /* @__PURE__ */ React.createElement("span", { style: { fontFamily: "var(--mono)", fontSize: 10, color: "var(--faint)" } }, m.time), !mine && m.via && /* @__PURE__ */ React.createElement(
+      "span",
+      {
+        title: m.via === "offline" ? "delivered via express relay (offline)" : "delivered over a live session (online)",
+        style: { fontFamily: "var(--mono)", fontSize: 9, color: m.via === "offline" ? "#f59e0b" : "var(--faint)" }
+      },
+      m.via === "offline" ? "\u79BB\u7EBF" : "\u5728\u7EBF"
+    ), !selMode && m.id && /* @__PURE__ */ React.createElement(
+      "button",
+      {
+        title: T.delete || "delete",
+        onClick: (e) => {
+          e.stopPropagation();
+          onDelete(m.id);
+        },
+        style: { background: "none", border: "none", cursor: "pointer", padding: 0, marginLeft: 2, display: "inline-flex", opacity: 0.55 }
+      },
+      /* @__PURE__ */ React.createElement(Icon, { name: "trash", size: 11, stroke: 2, color: "var(--faint)" })
+    ), mine && m.status === "queued" ? /* @__PURE__ */ React.createElement("span", { style: { display: "inline-flex", alignItems: "center", gap: 2 }, title: "waiting for peer \u2014 will send when they're online" }, /* @__PURE__ */ React.createElement(Icon, { name: "clock", size: 11, stroke: 2.2, color: "var(--faint)" }), /* @__PURE__ */ React.createElement("span", { style: { fontFamily: "var(--mono)", fontSize: 10, color: "var(--faint)" } }, T.queued || "queued")) : mine && m.status && /* @__PURE__ */ React.createElement(Icon, { name: "checkCheck", size: 12, stroke: 2.2, color: m.status === "read" ? "var(--accent)" : "var(--faint)" })))
+  );
+}
+function Conversation({ T, peer, lang, thread: threadProp, onSend, onSendFile, onSendRtcFile, onAlias, onRemove, onOpenNet, onCall, onReloadThread }) {
+  const scrollRef = React.useRef(null);
+  const followScrollRef = React.useRef(true);
+  const fileRef = React.useRef(null);
+  const rtcFileRef = React.useRef(null);
+  const [menu, setMenu] = React.useState(false);
+  const [selMode, setSelMode] = React.useState(false);
+  const [sel, setSel] = React.useState(() => /* @__PURE__ */ new Set());
+  const [hidden, setHidden] = React.useState(() => /* @__PURE__ */ new Set());
+  const [fileBusy, setFileBusy] = React.useState(() => ({}));
+  const [filePatch, setFilePatch] = React.useState(() => ({}));
+  const [flash, setFlash] = React.useState(null);
+  const flashTimer = React.useRef(null);
+  const showFlash = (kind, msg) => {
+    if (flashTimer.current)
+      clearTimeout(flashTimer.current);
+    setFlash({ kind, msg });
+    flashTimer.current = setTimeout(() => setFlash(null), 2500);
+  };
+  React.useEffect(() => () => {
+    if (flashTimer.current)
+      clearTimeout(flashTimer.current);
+  }, []);
+  React.useEffect(() => {
+    setSelMode(false);
+    setSel(/* @__PURE__ */ new Set());
+    setHidden(/* @__PURE__ */ new Set());
+    setFileBusy({});
+    setFilePatch({});
+    setFlash(null);
+    followScrollRef.current = true;
+  }, [peer.id]);
+  React.useEffect(() => {
+    setFilePatch((p) => {
+      let changed = false;
+      const next = { ...p };
+      for (const m of threadProp || []) {
+        if (!m || !m.id || !next[m.id] || !m.file)
+          continue;
+        if (m.file.status === next[m.id].status) {
+          delete next[m.id];
+          changed = true;
+        }
+      }
+      return changed ? next : p;
+    });
+  }, [threadProp]);
+  const baseThread = threadProp && threadProp.length ? threadProp : [{ day: "Today" }, { from: "them", time: "\u2014", text: lang === "zh" ? "\u6682\u65E0\u6D88\u606F\u8BB0\u5F55\uFF0C\u53D1\u4E2A\u6D88\u606F\u6253\u4E2A\u62DB\u547C\u5427\u3002" : "No messages yet. Say hi." }];
+  const thread = React.useMemo(() => {
+    if (!Object.keys(filePatch).length)
+      return baseThread;
+    return baseThread.map((m) => {
+      if (!m || !m.id || !m.file || !filePatch[m.id])
+        return m;
+      return { ...m, file: { ...m.file, ...filePatch[m.id] } };
+    });
+  }, [baseThread, filePatch]);
+  const scrollToBottom = () => {
+    const el = scrollRef.current;
+    if (el)
+      el.scrollTop = el.scrollHeight;
+  };
+  const updateFollowScroll = () => {
+    const el = scrollRef.current;
+    if (!el)
+      return;
+    followScrollRef.current = el.scrollHeight - el.scrollTop - el.clientHeight < 80;
+  };
+  React.useLayoutEffect(() => {
+    if (followScrollRef.current)
+      scrollToBottom();
+  }, [peer.id, thread]);
+  const toggleSel = (id) => setSel((s) => {
+    const n = new Set(s);
+    n.has(id) ? n.delete(id) : n.add(id);
+    return n;
+  });
+  const clearBusy = (id) => setFileBusy((b) => {
+    const n = { ...b };
+    delete n[id];
+    return n;
+  });
+  const doReveal = (name) => {
+    if (!name)
+      return;
+    dkApi.revealFile(name).then((r) => {
+      if (!r || r.ok === false) {
+        showFlash("err", (lang === "zh" ? "\u65E0\u6CD5\u5728\u6587\u4EF6\u7BA1\u7406\u5668\u4E2D\u663E\u793A: " : "Could not reveal file: ") + (r && r.error || ""));
+      }
+    });
+  };
+  const doCancel = (id) => {
+    if (!id || fileBusy[id])
+      return;
+    setFileBusy((b) => ({ ...b, [id]: "cancel" }));
+    showFlash("ok", T.cancelling || "Cancelling\u2026");
+    dkApi.cancelSend(peer.userId, [id]).then((r) => {
+      if (!r || r.ok === false) {
+        const msg = (T.cancelFailed || "Cancel failed") + ": " + (r && r.error || "daemon unavailable");
+        showFlash("err", msg);
+        window.alert(msg);
+      } else if (!r.cancelled) {
+        const msg = T.cancelMissing || "No active transfer was found. Refresh and try again.";
+        showFlash("err", msg);
+        window.alert(msg);
+      } else {
+        setFilePatch((p) => ({ ...p, [id]: { status: "cancelled", pct: void 0, kbps: void 0 } }));
+        showFlash("ok", T.cancelled || "Transfer cancelled");
+        if (onReloadThread)
+          onReloadThread();
+      }
+    }).catch((e) => {
+      const msg = (T.cancelFailed || "Cancel failed") + ": " + String(e);
+      showFlash("err", msg);
+      window.alert(msg);
+    }).finally(() => clearBusy(id));
+  };
+  const doRetry = (id) => {
+    if (!id || fileBusy[id])
+      return;
+    setFileBusy((b) => ({ ...b, [id]: "retry" }));
+    setFilePatch((p) => ({ ...p, [id]: { status: "sending", pct: 0, kbps: void 0 } }));
+    showFlash("ok", T.retrying || "Retrying\u2026");
+    dkApi.retrySend(peer.userId, [id]).then((r) => {
+      if (r && r.ok === false) {
+        setFilePatch((p) => {
+          const n = { ...p };
+          delete n[id];
+          return n;
+        });
+        const msg = (T.retryFailed || "Retry failed") + ": " + (r.error || "");
+        showFlash("err", msg);
+        window.alert(msg);
+      } else if (!r || !r.retried) {
+        setFilePatch((p) => {
+          const n = { ...p };
+          delete n[id];
+          return n;
+        });
+        const msg = T.retryMissing || "No retryable transfer or original file is unavailable.";
+        showFlash("err", msg);
+        window.alert(msg);
+      } else {
+        showFlash("ok", T.retried || "Transfer restarted");
+        if (onReloadThread)
+          onReloadThread();
+      }
+    }).catch((e) => {
+      setFilePatch((p) => {
+        const n = { ...p };
+        delete n[id];
+        return n;
+      });
+      const msg = (T.retryFailed || "Retry failed") + ": " + String(e);
+      showFlash("err", msg);
+      window.alert(msg);
+    }).finally(() => clearBusy(id));
+  };
+  const doDelete = (ids) => {
+    ids = ids.filter(Boolean);
+    if (!ids.length)
+      return;
+    if (!window.confirm(ids.length === 1 ? T.delete1 || "Delete this message and its file?" : (T.deleteN || "Delete {n} selected?").replace("{n}", ids.length)))
+      return;
+    setHidden((h) => {
+      const n = new Set(h);
+      ids.forEach((i) => n.add(i));
+      return n;
+    });
+    dkApi.delFiles(peer.userId, ids).catch(() => {
+    });
+    setSel(/* @__PURE__ */ new Set());
+    setSelMode(false);
+  };
+  const [draft, setDraft] = React.useState("");
+  const [dragOver, setDragOver] = React.useState(false);
+  const [sending, setSending] = React.useState(null);
+  const [theater, setTheater] = React.useState(null);
+  React.useEffect(() => {
+    setDraft("");
+  }, [peer.id]);
+  React.useEffect(() => {
+    setTheater(null);
+  }, [peer.id]);
+  React.useEffect(() => {
+    if (!theater)
+      return;
+    const onKey = (e) => {
+      if (e.key === "Escape")
+        setTheater(null);
+    };
+    window.addEventListener("keydown", onKey);
+    return () => window.removeEventListener("keydown", onKey);
+  }, [theater]);
+  const sendDraft = () => {
+    if (draft.trim()) {
+      followScrollRef.current = true;
+      onSend(draft);
+      setDraft("");
+      requestAnimationFrame(scrollToBottom);
+    }
+  };
+  const sendFiles = (files, mode) => {
+    const sender = mode === "webrtc" ? onSendRtcFile : onSendFile;
+    if (!files || !files.length || !sender)
+      return;
+    const file = files[0];
+    followScrollRef.current = true;
+    setSending({ name: file.name, via: mode, pct: 0, sent: 0, size: file.size });
+    const onProgress = (p) => setSending((s) => s && s.name === file.name ? {
+      ...s,
+      pct: p && p.pct,
+      sent: p && p.sent,
+      size: p && p.size || s.size,
+      kbps: p && p.kbps
+    } : s);
+    Promise.resolve(sender(file, onProgress)).then((r) => {
+      if (r && r.ok === false)
+        window.alert((lang === "zh" ? "\u53D1\u9001\u5931\u8D25: " : "Send failed: ") + (r.error || ""));
+      else
+        showFlash("ok", mode === "webrtc" ? lang === "zh" ? "WebRTC \u6587\u4EF6\u53D1\u9001\u5B8C\u6210" : "WebRTC file sent" : lang === "zh" ? "\u6587\u4EF6\u5DF2\u63D0\u4EA4\u53D1\u9001" : "File send started");
+    }).finally(() => {
+      setSending(null);
+      requestAnimationFrame(scrollToBottom);
+    });
+  };
+  const onDrop = (e) => {
+    e.preventDefault();
+    setDragOver(false);
+    sendFiles(e.dataTransfer.files);
+  };
+  return /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      style: { flex: 1, minWidth: 0, minHeight: 0, display: "flex", flexDirection: "column", background: "var(--bg)", position: "relative" },
+      onDragOver: (e) => {
+        e.preventDefault();
+        if (!dragOver)
+          setDragOver(true);
+      },
+      onDragLeave: (e) => {
+        if (e.currentTarget === e.target)
+          setDragOver(false);
+      },
+      onDrop
+    },
+    dragOver && /* @__PURE__ */ React.createElement("div", { style: { position: "absolute", inset: 0, zIndex: 30, background: "rgba(91,140,255,0.10)", border: "2px dashed var(--accent)", borderRadius: 12, display: "flex", alignItems: "center", justifyContent: "center", pointerEvents: "none", fontFamily: "var(--mono)", fontSize: 14, color: "var(--accent)" } }, lang === "zh" ? "\u677E\u5F00\u53D1\u9001\u6587\u4EF6" : "Drop to send file"),
+    /* @__PURE__ */ React.createElement("div", { style: { height: 60, flexShrink: 0, borderBottom: "1px solid var(--line)", display: "flex", alignItems: "center", gap: 12, padding: "0 16px", background: "var(--panel)" } }, /* @__PURE__ */ React.createElement(DkAvatar, { peer, size: 34, radius: 8 }), /* @__PURE__ */ React.createElement("div", { style: { minWidth: 0 } }, /* @__PURE__ */ React.createElement("div", { style: { display: "flex", alignItems: "center", gap: 8 } }, /* @__PURE__ */ React.createElement("span", { style: { fontFamily: peer.alias ? "var(--ui)" : "var(--mono)", fontSize: 15, fontWeight: 700, color: "var(--text)" } }, peer.alias || shortKey(peer.userId, 10, 6)), peer.agent && /* @__PURE__ */ React.createElement(Tag, { tone: "accent" }, "agent"), /* @__PURE__ */ React.createElement(RouteTag, { peer })), /* @__PURE__ */ React.createElement("div", { style: { display: "flex", alignItems: "center", gap: 8, marginTop: 2 } }, /* @__PURE__ */ React.createElement(Mono, { size: 11.5, dim: true, copy: peer.userId, title: peer.userId }, shortKey(peer.userId, 10, 6)), /* @__PURE__ */ React.createElement("span", { style: { color: "var(--line)" } }, "\xB7"), /* @__PURE__ */ React.createElement("button", { onClick: () => onOpenNet(peer), title: T && T.openNet || "Network view", style: { background: "none", border: "none", cursor: "pointer", padding: 0, color: "var(--accent)", display: "inline-flex", alignItems: "center" } }, /* @__PURE__ */ React.createElement(Icon, { name: "network", size: 12, stroke: 2 })), /* @__PURE__ */ React.createElement(Mono, { size: 11.5, dim: true, copy: peer.ip, title: peer.ip }, peer.ip), peer.address && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("span", { style: { color: "var(--line)" } }, "\xB7"), /* @__PURE__ */ React.createElement(
+      Mono,
+      {
+        size: 11.5,
+        dim: true,
+        icon: "share",
+        copy: peer.address,
+        title: `${T && T.copyAddr || "Copy address \u2014 share it so someone else can add this friend"}
+${peer.address}`
+      },
+      shortKey(peer.address, 8, 6)
+    )))), /* @__PURE__ */ React.createElement("div", { style: { flex: 1 } }), onCall && /* @__PURE__ */ React.createElement(Btn, { icon: "phone", title: T && T.audioCall || "Audio call", onClick: () => onCall(peer.userId, false) }), onCall && /* @__PURE__ */ React.createElement(Btn, { icon: "video", title: T && T.videoCall || "Video call", onClick: () => onCall(peer.userId, true) }), onSendRtcFile && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
+      "input",
+      {
+        ref: rtcFileRef,
+        type: "file",
+        style: { display: "none" },
+        onChange: (e) => {
+          sendFiles(e.target.files, "webrtc");
+          e.target.value = "";
+        }
+      }
+    ), /* @__PURE__ */ React.createElement(Btn, { icon: "file", title: T && T.sendWebrtcFile || "Send file via WebRTC", onClick: () => rtcFileRef.current && rtcFileRef.current.click() })), /* @__PURE__ */ React.createElement("div", { style: { position: "relative" } }, /* @__PURE__ */ React.createElement(Btn, { icon: "more", onClick: () => setMenu((v) => !v) }), menu && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("div", { onClick: () => setMenu(false), style: { position: "fixed", inset: 0, zIndex: 40 } }), /* @__PURE__ */ React.createElement("div", { style: { position: "absolute", right: 0, top: 36, zIndex: 50, width: 180, background: "var(--panel-2)", border: "1px solid var(--line)", borderRadius: 9, padding: 6, boxShadow: "0 14px 40px rgba(0,0,0,0.4)" } }, /* @__PURE__ */ React.createElement(MenuItem, { icon: "hash", label: T.alias, onClick: () => {
+      setMenu(false);
+      onAlias(peer);
+    } }), /* @__PURE__ */ React.createElement(MenuItem, { icon: "check", label: T.selectDelete || "Select & delete", onClick: () => {
+      setMenu(false);
+      setSelMode(true);
+    } }), /* @__PURE__ */ React.createElement("div", { style: { height: 1, background: "var(--line)", margin: "5px 4px" } }), /* @__PURE__ */ React.createElement(MenuItem, { icon: "trash", label: T.remove, danger: true, onClick: () => {
+      setMenu(false);
+      onRemove(peer);
+    } }))))),
+    /* @__PURE__ */ React.createElement("div", { ref: scrollRef, onScroll: updateFollowScroll, style: { flex: 1, overflow: "auto", padding: "18px 22px" } }, /* @__PURE__ */ React.createElement("div", { style: { maxWidth: 760, margin: "0 auto" } }, thread.filter((m) => m.day || !hidden.has(m.id)).map((m, i) => m.day ? /* @__PURE__ */ React.createElement("div", { key: i, style: { display: "flex", justifyContent: "center", margin: "14px 0" } }, /* @__PURE__ */ React.createElement("span", { style: { fontFamily: "var(--mono)", fontSize: 10.5, fontWeight: 600, color: "var(--faint)", background: "var(--chip)", padding: "3px 10px", borderRadius: 999 } }, m.day)) : /* @__PURE__ */ React.createElement(
+      Msg,
+      {
+        key: m.id || i,
+        m,
+        peer,
+        T,
+        onTheater: setTheater,
+        onDelete: (id) => doDelete([id]),
+        onCancel: doCancel,
+        onRetry: doRetry,
+        onReveal: doReveal,
+        onCall,
+        busy: m.id ? fileBusy[m.id] : void 0,
+        selMode,
+        selected: sel.has(m.id),
+        onToggleSel: toggleSel
+      }
+    )))),
+    selMode && /* @__PURE__ */ React.createElement("div", { style: { flexShrink: 0, borderTop: "1px solid var(--line)", padding: "10px 16px", background: "var(--panel)", display: "flex", alignItems: "center", gap: 10 } }, /* @__PURE__ */ React.createElement("span", { style: { fontFamily: "var(--mono)", fontSize: 12, color: "var(--faint)" } }, sel.size, " ", T.selected || "selected"), /* @__PURE__ */ React.createElement("div", { style: { flex: 1 } }), /* @__PURE__ */ React.createElement(Btn, { size: "sm", onClick: () => {
+      setSelMode(false);
+      setSel(/* @__PURE__ */ new Set());
+    } }, T.cancel || "Cancel"), /* @__PURE__ */ React.createElement(Btn, { size: "sm", tone: "danger", icon: "trash", onClick: () => doDelete([...sel]) }, T.delete || "Delete")),
+    /* @__PURE__ */ React.createElement("div", { style: { flexShrink: 0, borderTop: "1px solid var(--line)", padding: "12px 16px", background: "var(--panel)" } }, flash && /* @__PURE__ */ React.createElement("div", { style: {
+      maxWidth: 760,
+      margin: "0 auto 8px",
+      display: "flex",
+      alignItems: "center",
+      gap: 8,
+      fontFamily: "var(--mono)",
+      fontSize: 11.5,
+      color: flash.kind === "err" ? "var(--danger)" : "var(--accent)"
+    } }, /* @__PURE__ */ React.createElement(
+      Icon,
+      {
+        name: flash.kind === "err" ? "x" : "check",
+        size: 13,
+        stroke: 2.2,
+        color: flash.kind === "err" ? "var(--danger)" : "var(--accent)"
+      }
+    ), flash.msg), sending && /* @__PURE__ */ React.createElement("div", { style: { maxWidth: 760, margin: "0 auto 8px", display: "flex", alignItems: "center", gap: 8, fontFamily: "var(--mono)", fontSize: 11.5, color: "var(--faint)" } }, /* @__PURE__ */ React.createElement(Icon, { name: "paperclip", size: 13, stroke: 2, color: "var(--accent)" }), (lang === "zh" ? "\u53D1\u9001\u4E2D: " : "Sending: ") + (sending.via === "webrtc" ? "WebRTC \xB7 " : "") + sending.name + (sending.size ? " \xB7 " + dkFileSize(sending.sent || 0) + " / " + dkFileSize(sending.size) : "") + (sending.pct != null ? " \xB7 " + Math.min(100, Math.max(0, sending.pct)).toFixed(1) + "%" : "") + (sending.kbps != null ? " \xB7 " + dkSpeed(sending.kbps) : "")), /* @__PURE__ */ React.createElement("div", { style: { maxWidth: 760, margin: "0 auto", display: "flex", alignItems: "center", gap: 10 } }, /* @__PURE__ */ React.createElement(
+      "input",
+      {
+        ref: fileRef,
+        type: "file",
+        style: { display: "none" },
+        onChange: (e) => {
+          sendFiles(e.target.files);
+          e.target.value = "";
+        }
+      }
+    ), /* @__PURE__ */ React.createElement(Btn, { icon: "paperclip", title: T.sendFile, onClick: () => fileRef.current && fileRef.current.click() }), /* @__PURE__ */ React.createElement(
+      "input",
+      {
+        value: draft,
+        onChange: (e) => setDraft(e.target.value),
+        onKeyDown: (e) => {
+          if (e.key === "Enter" && !e.shiftKey) {
+            e.preventDefault();
+            sendDraft();
+          }
+        },
+        placeholder: `${T.message} ${peer.alias || shortKey(peer.userId, 6, 4)}\u2026`,
+        style: { flex: 1, height: 38, borderRadius: 9, border: "1px solid var(--line)", background: "var(--panel-2)", color: "var(--text)", fontFamily: "var(--ui)", fontSize: 13.5, padding: "0 14px", outline: "none", minWidth: 0 }
+      }
+    ), /* @__PURE__ */ React.createElement(Btn, { tone: "solid", icon: "arrowUp", title: T.send, onClick: sendDraft }))),
+    theater && /* @__PURE__ */ React.createElement("div", { onClick: () => setTheater(null), style: {
+      position: "absolute",
+      inset: 0,
+      zIndex: 60,
+      background: "rgba(0,0,0,0.86)",
+      display: "flex",
+      flexDirection: "column"
+    } }, /* @__PURE__ */ React.createElement("div", { onClick: (e) => e.stopPropagation(), style: { flexShrink: 0, height: 46, display: "flex", alignItems: "center", justifyContent: "space-between", gap: 10, padding: "0 14px" } }, /* @__PURE__ */ React.createElement("span", { style: { minWidth: 0, fontFamily: "var(--mono)", fontSize: 12, color: "rgba(255,255,255,0.72)", whiteSpace: "nowrap", overflow: "hidden", textOverflow: "ellipsis" } }, theater.name), /* @__PURE__ */ React.createElement("div", { style: { display: "flex", alignItems: "center", gap: 8, flexShrink: 0 } }, /* @__PURE__ */ React.createElement(
+      "button",
+      {
+        title: lang === "zh" ? "\u5168\u5C4F" : "fullscreen",
+        onClick: () => {
+          const el = document.getElementById("dk-theater-media");
+          if (el && el.requestFullscreen)
+            el.requestFullscreen();
+        },
+        style: { width: 34, height: 34, borderRadius: 8, border: "none", background: "rgba(255,255,255,0.14)", cursor: "pointer", display: "flex", alignItems: "center", justifyContent: "center" }
+      },
+      /* @__PURE__ */ React.createElement(Icon, { name: "maximize", size: 18, stroke: 2, color: "#fff" })
+    ), /* @__PURE__ */ React.createElement(
+      "button",
+      {
+        title: (lang === "zh" ? "\u5173\u95ED" : "close") + " \xB7 Esc",
+        onClick: () => setTheater(null),
+        style: { width: 34, height: 34, borderRadius: 8, border: "none", background: "rgba(255,255,255,0.14)", cursor: "pointer", display: "flex", alignItems: "center", justifyContent: "center" }
+      },
+      /* @__PURE__ */ React.createElement(Icon, { name: "x", size: 20, stroke: 2.2, color: "#fff" })
+    ))), /* @__PURE__ */ React.createElement("div", { onClick: () => setTheater(null), style: { flex: 1, minHeight: 0, display: "flex", alignItems: "center", justifyContent: "center", padding: "0 16px 16px" } }, theater.kind === "video" ? /* @__PURE__ */ React.createElement(
+      "video",
+      {
+        id: "dk-theater-media",
+        src: theater.url,
+        controls: true,
+        autoPlay: true,
+        onClick: (e) => e.stopPropagation(),
+        style: { maxWidth: "100%", maxHeight: "100%", objectFit: "contain", borderRadius: 6, background: "#000" }
+      }
+    ) : /* @__PURE__ */ React.createElement(
+      "img",
+      {
+        id: "dk-theater-media",
+        src: theater.url,
+        alt: theater.name,
+        onClick: (e) => e.stopPropagation(),
+        style: { maxWidth: "100%", maxHeight: "100%", objectFit: "contain", borderRadius: 6 }
+      }
+    )))
+  );
+}
+function MenuItem({ icon, label, onClick, danger }) {
+  return /* @__PURE__ */ React.createElement("button", { onClick, style: {
+    display: "flex",
+    alignItems: "center",
+    gap: 10,
+    width: "100%",
+    textAlign: "left",
+    padding: "8px 9px",
+    borderRadius: 6,
+    border: "none",
+    cursor: "pointer",
+    background: "transparent",
+    fontFamily: "var(--mono)",
+    fontSize: 12.5,
+    fontWeight: 600,
+    color: danger ? "var(--danger)" : "var(--text)"
+  } }, /* @__PURE__ */ React.createElement(Icon, { name: icon, size: 15, stroke: 2, color: danger ? "var(--danger)" : "var(--dim)" }), " ", label);
+}
+function ChatEmpty({ T }) {
+  return /* @__PURE__ */ React.createElement("div", { style: { flex: 1, display: "flex", flexDirection: "column", alignItems: "center", justifyContent: "center", gap: 12, color: "var(--faint)", background: "var(--bg)" } }, /* @__PURE__ */ React.createElement(Icon, { name: "message", size: 40, stroke: 1.4, color: "var(--line)" }), /* @__PURE__ */ React.createElement("div", { style: { fontFamily: "var(--mono)", fontSize: 13 } }, T.pickPeer));
+}
+function ChatTab({ T, lang, peers, requests, activeId, thread, onSelect, onAct, onAdd, onSend, onSendFile, onSendRtcFile, onAlias, onRemove, onOpenNet, onCall, onReloadThread, prefillAddr, onPrefillConsumed }) {
+  const peer = peers.find((p) => p.id === activeId);
+  return /* @__PURE__ */ React.createElement("div", { style: { flex: 1, display: "flex", minWidth: 0, minHeight: 0 } }, /* @__PURE__ */ React.createElement(PeerSidebar, { T, peers, requests, activeId, onSelect, onAct, onAdd, prefillAddr, onPrefillConsumed }), peer ? /* @__PURE__ */ React.createElement(Conversation, { T, peer, lang, thread, onSend, onSendFile, onSendRtcFile, onAlias, onRemove, onOpenNet, onCall, onReloadThread }) : /* @__PURE__ */ React.createElement(ChatEmpty, { T }));
+}
+Object.assign(window, { ChatTab });
+function StatTile({ label, value, sub, tone }) {
+  return /* @__PURE__ */ React.createElement("div", { style: { flex: 1, minWidth: 0, padding: "13px 15px", borderRadius: 10, background: "var(--panel)", border: "1px solid var(--line)" } }, /* @__PURE__ */ React.createElement("div", { style: { fontFamily: "var(--mono)", fontSize: 10.5, fontWeight: 700, letterSpacing: 1, textTransform: "uppercase", color: "var(--faint)" } }, label), /* @__PURE__ */ React.createElement("div", { style: { fontFamily: "var(--mono)", fontSize: 21, fontWeight: 700, letterSpacing: -0.5, marginTop: 5, color: tone || "var(--text)" } }, value), sub && /* @__PURE__ */ React.createElement("div", { style: { fontFamily: "var(--mono)", fontSize: 11, color: "var(--dim)", marginTop: 2 } }, sub));
+}
+function MyNode({ T, me, activeExit, peers, reqCount = 0 }) {
+  const online = peers.filter((p) => p.online).length;
+  const direct = peers.filter((p) => p.online && p.via === "direct").length;
+  return /* @__PURE__ */ React.createElement("div", { style: { display: "flex", flexDirection: "column", gap: 12 } }, /* @__PURE__ */ React.createElement("div", { style: { display: "flex", alignItems: "center", gap: 14, padding: "16px 18px", borderRadius: 12, background: "var(--panel)", border: "1px solid var(--line)" } }, /* @__PURE__ */ React.createElement("div", { style: { position: "relative" } }, /* @__PURE__ */ React.createElement(DkIdenticon, { seed: me.userId, size: 46, radius: 11 }), /* @__PURE__ */ React.createElement("span", { style: { position: "absolute", right: -3, bottom: -3, width: 14, height: 14, borderRadius: 999, background: "var(--online)", border: "2.5px solid var(--panel)" } })), /* @__PURE__ */ React.createElement("div", { style: { minWidth: 0 } }, /* @__PURE__ */ React.createElement("div", { style: { display: "flex", alignItems: "center", gap: 9 } }, /* @__PURE__ */ React.createElement("span", { style: { fontFamily: "var(--mono)", fontSize: 17, fontWeight: 700, color: "var(--text)" } }, me.name), /* @__PURE__ */ React.createElement(Tag, { tone: "ok" }, "online"), /* @__PURE__ */ React.createElement(Tag, { tone: "accent" }, me.channel), me.isExit && /* @__PURE__ */ React.createElement(Tag, { tone: "warn" }, "exit", me.exitRegion ? ` \xB7 ${me.exitRegion.toUpperCase()}` : "")), /* @__PURE__ */ React.createElement("div", { style: { display: "flex", alignItems: "center", gap: 8, marginTop: 5 } }, /* @__PURE__ */ React.createElement("span", { style: { fontFamily: "var(--mono)", fontSize: 11.5, color: "var(--faint)" } }, T.myIp), /* @__PURE__ */ React.createElement(Mono, { size: 13, copy: me.ip }, me.ip), /* @__PURE__ */ React.createElement("span", { style: { color: "var(--line)" } }, "\xB7"), /* @__PURE__ */ React.createElement("span", { style: { fontFamily: "var(--mono)", fontSize: 11.5, color: "var(--faint)" } }, "wire ", me.wire), /* @__PURE__ */ React.createElement("span", { style: { color: "var(--line)" } }, "\xB7"), /* @__PURE__ */ React.createElement("span", { style: { fontFamily: "var(--mono)", fontSize: 11.5, color: "var(--faint)" } }, "lan ", me.lanVer, " / peer ", me.peerVer))), /* @__PURE__ */ React.createElement("div", { style: { flex: 1 } }), /* @__PURE__ */ React.createElement(Btn, { icon: "copy", onClick: () => dkCopy(me.carrier) }, T.copyAddr)), /* @__PURE__ */ React.createElement("div", { style: { display: "flex", gap: 12 } }, /* @__PURE__ */ React.createElement(StatTile, { label: T.peersOnline, value: `${online}/${peers.length}`, sub: `${direct} ${T.direct}`, tone: "var(--online)" }), /* @__PURE__ */ React.createElement(StatTile, { label: T.activeEgress, value: activeExit ? activeExit : T.directEgress, sub: activeExit ? "china \xB7 cn-sh-01" : T.noProxy, tone: activeExit ? "var(--warn)" : "var(--text)" }), /* @__PURE__ */ React.createElement(StatTile, { label: T.wireLabel, value: me.wire, sub: `${me.channel} \xB7 ${T.lossless}` }), /* @__PURE__ */ React.createElement(StatTile, { label: T.reqs, value: String(reqCount), sub: T.pending, tone: reqCount ? "var(--accent)" : "var(--text)" })));
+}
+function PeerTable({ T, peers, onOpenChat }) {
+  return /* @__PURE__ */ React.createElement("div", { style: { borderRadius: 11, border: "1px solid var(--line)", overflow: "hidden", background: "var(--panel)" } }, /* @__PURE__ */ React.createElement("div", { style: { display: "grid", gridTemplateColumns: "1.4fr 1fr 1fr 0.8fr 90px", gap: 0, padding: "9px 16px", borderBottom: "1px solid var(--line)", background: "var(--panel-2)" } }, [T.colPeer, T.colVip, T.colPath, T.colWire, ""].map((h, i) => /* @__PURE__ */ React.createElement("span", { key: i, style: { fontFamily: "var(--mono)", fontSize: 10.5, fontWeight: 700, letterSpacing: 0.8, textTransform: "uppercase", color: "var(--faint)", textAlign: i === 4 ? "right" : "left" } }, h))), peers.map((p, i) => /* @__PURE__ */ React.createElement("div", { key: p.id, style: {
+    display: "grid",
+    gridTemplateColumns: "1.4fr 1fr 1fr 0.8fr 90px",
+    gap: 0,
+    alignItems: "center",
+    padding: "11px 16px",
+    borderBottom: i < peers.length - 1 ? "1px solid var(--line)" : "none"
+  } }, /* @__PURE__ */ React.createElement("div", { style: { display: "flex", alignItems: "center", gap: 10, minWidth: 0 } }, /* @__PURE__ */ React.createElement(DkAvatar, { peer: p, size: 26, radius: 6 }), /* @__PURE__ */ React.createElement("span", { style: { fontFamily: p.alias ? "var(--ui)" : "var(--mono)", fontSize: 13, fontWeight: 600, color: "var(--text)", whiteSpace: "nowrap", overflow: "hidden", textOverflow: "ellipsis" } }, p.alias || shortKey(p.userId, 8, 5)), p.agent && /* @__PURE__ */ React.createElement(Icon, { name: "bot", size: 12, color: "var(--faint)", stroke: 2 })), /* @__PURE__ */ React.createElement(Mono, { size: 12.5, dim: true, copy: p.ip }, p.ip), /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(RouteTag, { peer: p })), /* @__PURE__ */ React.createElement("span", { style: { fontFamily: "var(--mono)", fontSize: 11.5, color: p.wire === "64" ? "var(--warn)" : "var(--dim)" } }, p.wire === "64" ? "old\xB764" : "new\xB7163"), /* @__PURE__ */ React.createElement("div", { style: { display: "flex", justifyContent: "flex-end", gap: 6 } }, /* @__PURE__ */ React.createElement(Btn, { icon: "message", size: "sm", title: T.openChat, onClick: () => onOpenChat(p.id) }), /* @__PURE__ */ React.createElement(Btn, { icon: "signal", size: "sm", title: T.ping })))));
+}
+function ExitCard({ T, region, activeExit, onSetExit }) {
+  return /* @__PURE__ */ React.createElement("div", { style: { borderRadius: 11, border: "1px solid var(--line)", overflow: "hidden", background: "var(--panel)" } }, /* @__PURE__ */ React.createElement("div", { style: { display: "flex", alignItems: "center", gap: 10, padding: "11px 14px", borderBottom: "1px solid var(--line)", background: "var(--panel-2)" } }, /* @__PURE__ */ React.createElement("span", { style: { fontFamily: "var(--mono)", fontSize: 11, fontWeight: 700, letterSpacing: 0.5, padding: "2px 7px", borderRadius: 5, background: "var(--chip)", color: "var(--dim)" } }, region.flag), /* @__PURE__ */ React.createElement("span", { style: { fontFamily: "var(--ui)", fontSize: 13.5, fontWeight: 600, color: "var(--text)" } }, region.label), /* @__PURE__ */ React.createElement("div", { style: { flex: 1 } }), (() => {
+    const reach = region.nodes.filter((n) => n.reachable).length;
+    const down = region.nodes.length - reach;
+    return /* @__PURE__ */ React.createElement("span", { style: { fontFamily: "var(--mono)", fontSize: 11, color: down > 0 ? "var(--warn)" : "var(--faint)" } }, reach, "/", region.nodes.length, " ", T.up, down > 0 ? ` \xB7 ${down} down` : "");
+  })()), /* @__PURE__ */ React.createElement("div", null, region.nodes.map((n, i) => {
+    const active = n.ip === activeExit;
+    const stuck = n.online && !n.reachable;
+    return /* @__PURE__ */ React.createElement("div", { key: n.ip, style: { display: "flex", alignItems: "center", gap: 12, padding: "10px 14px", borderBottom: i < region.nodes.length - 1 ? "1px solid var(--line)" : "none", background: active ? "color-mix(in oklab, var(--accent), transparent 92%)" : "transparent" } }, /* @__PURE__ */ React.createElement(StatusDot, { online: n.reachable }), /* @__PURE__ */ React.createElement(Mono, { size: 13, copy: n.ip }, n.ip), /* @__PURE__ */ React.createElement("span", { style: { fontFamily: "var(--mono)", fontSize: 11, color: "var(--faint)" } }, n.host), /* @__PURE__ */ React.createElement("div", { style: { flex: 1 } }), n.reachable ? /* @__PURE__ */ React.createElement("span", { style: { fontFamily: "var(--mono)", fontSize: 11.5, color: n.ping > 200 ? "var(--warn)" : "var(--dim)" } }, n.ping, "ms") : stuck ? /* @__PURE__ */ React.createElement(Tag, { tone: "warn", title: "Announces online but IP won't pass \u2014 session desync or NAT-blocked" }, "online \xB7 no route") : /* @__PURE__ */ React.createElement(Tag, { tone: "off" }, "offline"), active ? /* @__PURE__ */ React.createElement(Btn, { tone: "ok", icon: "check", size: "sm", onClick: () => onSetExit(null) }, T.routing) : /* @__PURE__ */ React.createElement(Btn, { size: "sm", icon: "route", onClick: () => n.reachable && onSetExit(n.ip), style: { opacity: n.reachable ? 1 : 0.4 } }, T.routeThru));
+  })));
+}
+function NetworkTab({ T, me, peers, exits, activeExit, reqCount, onSetExit, onOpenChat }) {
+  return /* @__PURE__ */ React.createElement("div", { style: { flex: 1, overflow: "auto", background: "var(--bg)" } }, /* @__PURE__ */ React.createElement("div", { style: { maxWidth: 1040, margin: "0 auto", padding: "24px 28px 60px", display: "flex", flexDirection: "column", gap: 26 } }, /* @__PURE__ */ React.createElement(MyNode, { T, me, activeExit, peers, reqCount }), /* @__PURE__ */ React.createElement("div", { style: { display: "flex", flexDirection: "column", gap: 12 } }, /* @__PURE__ */ React.createElement(Section, { label: T.peerRouting, count: peers.length }), /* @__PURE__ */ React.createElement(PeerTable, { T, peers, onOpenChat })), /* @__PURE__ */ React.createElement("div", { style: { display: "flex", flexDirection: "column", gap: 12 } }, /* @__PURE__ */ React.createElement(Section, { label: T.exitNodes, trailing: /* @__PURE__ */ React.createElement("div", { style: { display: "flex", gap: 6 } }, /* @__PURE__ */ React.createElement(Btn, { icon: "plus", size: "sm" }, T.addExit)) }), activeExit && /* @__PURE__ */ React.createElement("div", { style: { display: "flex", alignItems: "center", gap: 10, padding: "11px 14px", borderRadius: 10, background: "color-mix(in oklab, var(--warn), transparent 90%)", border: "1px solid color-mix(in oklab, var(--warn), transparent 70%)" } }, /* @__PURE__ */ React.createElement(Icon, { name: "route", size: 17, color: "var(--warn)", stroke: 2 }), /* @__PURE__ */ React.createElement("span", { style: { fontFamily: "var(--mono)", fontSize: 12.5, color: "var(--text)" } }, T.egressVia), /* @__PURE__ */ React.createElement(Mono, { size: 13, copy: activeExit }, activeExit), /* @__PURE__ */ React.createElement("div", { style: { flex: 1 } }), /* @__PURE__ */ React.createElement(Btn, { tone: "danger", icon: "unlink", size: "sm", onClick: () => onSetExit(null) }, T.stopRouting)), /* @__PURE__ */ React.createElement("div", { style: { display: "grid", gridTemplateColumns: "1fr 1fr", gap: 12 } }, exits.map((r) => /* @__PURE__ */ React.createElement(ExitCard, { key: r.region, T, region: r, activeExit, onSetExit }))))));
+}
+Object.assign(window, { NetworkTab });
+function CopyBtn({ value, copiedText = "Copied", copyFailedText = "Copy failed", copyTitle = "Copy" }) {
+  const [status, setStatus] = React.useState(null);
+  const timer = React.useRef(null);
+  React.useEffect(() => () => {
+    if (timer.current)
+      clearTimeout(timer.current);
+  }, []);
+  const onCopy = async () => {
+    if (timer.current)
+      clearTimeout(timer.current);
+    setStatus("copied");
+    timer.current = setTimeout(() => setStatus(null), 1400);
+    const ok = await dkCopy(value);
+    if (!ok) {
+      setStatus("failed");
+      if (timer.current)
+        clearTimeout(timer.current);
+      timer.current = setTimeout(() => setStatus(null), 1400);
+    }
+  };
+  const message = status === "copied" ? copiedText : copyFailedText;
+  return /* @__PURE__ */ React.createElement("span", { "aria-live": "polite", style: { display: "inline-flex", flexShrink: 0 } }, /* @__PURE__ */ React.createElement(
+    Btn,
+    {
+      icon: status === "copied" ? "check" : status === "failed" ? "x" : "copy",
+      tone: status === "copied" ? "ok" : status === "failed" ? "danger" : "ghost",
+      size: "sm",
+      title: status ? message : copyTitle,
+      onClick: onCopy
+    }
+  ));
+}
+function FieldRow({ T, label, value, mono = true, copy, qr, onQr, last }) {
+  return /* @__PURE__ */ React.createElement("div", { style: { display: "flex", alignItems: "center", gap: 14, padding: "13px 16px", borderBottom: last ? "none" : "1px solid var(--line)" } }, /* @__PURE__ */ React.createElement("span", { style: { width: 130, flexShrink: 0, fontFamily: "var(--mono)", fontSize: 11.5, fontWeight: 600, color: "var(--faint)", textTransform: "uppercase", letterSpacing: 0.5 } }, label), /* @__PURE__ */ React.createElement("span", { style: { flex: 1, minWidth: 0, fontFamily: mono ? "var(--mono)" : "var(--ui)", fontSize: 13.5, color: "var(--text)", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, value), copy && /* @__PURE__ */ React.createElement(CopyBtn, { value, copiedText: T.copied, copyFailedText: T.copyFailed, copyTitle: T.copy }), qr && /* @__PURE__ */ React.createElement(Btn, { icon: "qr", size: "sm", onClick: () => onQr && onQr(value, label) }));
+}
+function DkQrModal({ T, value, label, onClose }) {
+  const qr = React.useMemo(() => {
+    if (typeof qrcode === "undefined")
+      return null;
+    try {
+      const q = qrcode(0, "M");
+      q.addData(value);
+      q.make();
+      return q;
+    } catch (e) {
+      return null;
+    }
+  }, [value]);
+  const count = qr ? qr.getModuleCount() : 0;
+  const quiet = 4;
+  const total = count + quiet * 2;
+  const px = 248;
+  return /* @__PURE__ */ React.createElement("div", { onClick: onClose, style: { position: "fixed", inset: 0, zIndex: 90, background: "color-mix(in oklab, #000, transparent 38%)", display: "flex", alignItems: "center", justifyContent: "center", padding: 24 } }, /* @__PURE__ */ React.createElement("div", { onClick: (e) => e.stopPropagation(), style: { background: "var(--panel)", border: "1px solid var(--line)", borderRadius: 16, padding: 22, display: "flex", flexDirection: "column", alignItems: "center", gap: 16, maxWidth: 340 } }, /* @__PURE__ */ React.createElement("div", { style: { display: "flex", alignItems: "center", gap: 10, alignSelf: "stretch" } }, /* @__PURE__ */ React.createElement("span", { style: { fontFamily: "var(--mono)", fontSize: 11.5, fontWeight: 700, letterSpacing: 0.5, textTransform: "uppercase", color: "var(--faint)" } }, label), /* @__PURE__ */ React.createElement("div", { style: { flex: 1 } }), /* @__PURE__ */ React.createElement(Btn, { icon: "x", size: "sm", onClick: onClose })), qr ? /* @__PURE__ */ React.createElement("svg", { width: px, height: px, viewBox: `0 0 ${total} ${total}`, shapeRendering: "crispEdges", style: { display: "block", borderRadius: 10, background: "#fff" } }, /* @__PURE__ */ React.createElement("rect", { width: total, height: total, fill: "#fff" }), Array.from({ length: count }).map(
+    (_, r) => Array.from({ length: count }).map(
+      (__, c) => qr.isDark(r, c) ? /* @__PURE__ */ React.createElement("rect", { key: `${r}-${c}`, x: c + quiet, y: r + quiet, width: 1.04, height: 1.04, fill: "#000" }) : null
+    )
+  )) : /* @__PURE__ */ React.createElement("div", { style: { fontFamily: "var(--mono)", fontSize: 12, color: "var(--faint)", padding: 48 } }, "QR unavailable"), /* @__PURE__ */ React.createElement("div", { style: { fontFamily: "var(--mono)", fontSize: 11, color: "var(--dim)", wordBreak: "break-all", textAlign: "center", maxWidth: 280, lineHeight: 1.5 } }, value), /* @__PURE__ */ React.createElement(CopyBtn, { value, copiedText: T.copied, copyFailedText: T.copyFailed, copyTitle: T.copy })));
+}
+function Card({ label, children, trailing }) {
+  return /* @__PURE__ */ React.createElement("div", { style: { display: "flex", flexDirection: "column", gap: 10 } }, /* @__PURE__ */ React.createElement(Section, { label, trailing }), /* @__PURE__ */ React.createElement("div", { style: { borderRadius: 11, border: "1px solid var(--line)", overflow: "hidden", background: "var(--panel)" } }, children));
+}
+function DkEditModal({ T, me, onClose, onSave }) {
+  const [name, setName] = React.useState(me.name || "");
+  const [desc, setDesc] = React.useState(me.description || "");
+  const save = () => {
+    const n = name.trim();
+    if (n)
+      onSave(n, desc);
+  };
+  const field = { height: 38, borderRadius: 9, border: "1px solid var(--line)", background: "var(--panel-2)", color: "var(--text)", fontFamily: "var(--ui)", fontSize: 13.5, padding: "0 12px", outline: "none" };
+  const lbl = { fontFamily: "var(--mono)", fontSize: 11.5, color: "var(--faint)", textTransform: "uppercase", letterSpacing: 0.5 };
+  const onKey = (e) => {
+    if (e.key === "Enter")
+      save();
+    if (e.key === "Escape")
+      onClose();
+  };
+  return /* @__PURE__ */ React.createElement("div", { onClick: onClose, style: { position: "fixed", inset: 0, zIndex: 90, background: "color-mix(in oklab, #000, transparent 38%)", display: "flex", alignItems: "center", justifyContent: "center", padding: 24 } }, /* @__PURE__ */ React.createElement("div", { onClick: (e) => e.stopPropagation(), style: { width: 440, maxWidth: "92vw", background: "var(--panel)", border: "1px solid var(--line)", borderRadius: 16, padding: 22, display: "flex", flexDirection: "column", gap: 14 } }, /* @__PURE__ */ React.createElement("div", { style: { display: "flex", alignItems: "center" } }, /* @__PURE__ */ React.createElement("span", { style: { fontFamily: "var(--mono)", fontSize: 13, fontWeight: 700, color: "var(--text)" } }, T.editProfile), /* @__PURE__ */ React.createElement("div", { style: { flex: 1 } }), /* @__PURE__ */ React.createElement(Btn, { icon: "x", size: "sm", onClick: onClose })), /* @__PURE__ */ React.createElement("label", { style: { display: "flex", flexDirection: "column", gap: 6 } }, /* @__PURE__ */ React.createElement("span", { style: lbl }, "display name"), /* @__PURE__ */ React.createElement("input", { value: name, onChange: (e) => setName(e.target.value), onKeyDown: onKey, autoFocus: true, maxLength: 48, style: field })), /* @__PURE__ */ React.createElement("label", { style: { display: "flex", flexDirection: "column", gap: 6 } }, /* @__PURE__ */ React.createElement("span", { style: lbl }, "status message"), /* @__PURE__ */ React.createElement("input", { value: desc, onChange: (e) => setDesc(e.target.value), onKeyDown: onKey, maxLength: 120, placeholder: "optional \u2014 a short bio friends will see", style: field })), /* @__PURE__ */ React.createElement("div", { style: { fontFamily: "var(--ui)", fontSize: 11.5, color: "var(--faint)" } }, "Your userid (the unique identity) can't change \u2014 only the display name + status."), /* @__PURE__ */ React.createElement("div", { style: { display: "flex", justifyContent: "flex-end", gap: 8, marginTop: 2 } }, /* @__PURE__ */ React.createElement(Btn, { size: "sm", onClick: onClose }, T.cancel || "cancel"), /* @__PURE__ */ React.createElement(Btn, { tone: "accent", size: "sm", onClick: save }, T.save || "save"))));
+}
+function ProfileTab({ T, me, onEdit }) {
+  const [qr, setQr] = React.useState(null);
+  const [editing, setEditing] = React.useState(false);
+  return /* @__PURE__ */ React.createElement("div", { style: { flex: 1, overflow: "auto", background: "var(--bg)" } }, /* @__PURE__ */ React.createElement("div", { style: { maxWidth: 760, margin: "0 auto", padding: "24px 28px 60px", display: "flex", flexDirection: "column", gap: 24 } }, /* @__PURE__ */ React.createElement("div", { style: { display: "flex", alignItems: "center", gap: 18, padding: "20px 22px", borderRadius: 14, background: "var(--panel)", border: "1px solid var(--line)" } }, /* @__PURE__ */ React.createElement("div", { style: { position: "relative" } }, /* @__PURE__ */ React.createElement(DkIdenticon, { seed: me.userId, size: 68, radius: 16 }), /* @__PURE__ */ React.createElement("span", { style: { position: "absolute", right: -3, bottom: -3, width: 18, height: 18, borderRadius: 999, background: "var(--online)", border: "3px solid var(--panel)" } })), /* @__PURE__ */ React.createElement("div", { style: { flex: 1, minWidth: 0 } }, /* @__PURE__ */ React.createElement("div", { style: { display: "flex", alignItems: "center", gap: 10 } }, /* @__PURE__ */ React.createElement("span", { style: { fontFamily: "var(--mono)", fontSize: 22, fontWeight: 700, letterSpacing: -0.5, color: "var(--text)" } }, me.name), /* @__PURE__ */ React.createElement(Tag, { tone: "ok" }, "online"), me.isExit && /* @__PURE__ */ React.createElement(Tag, { tone: "warn" }, "exit", me.exitRegion ? ` \xB7 ${me.exitRegion.toUpperCase()}` : "")), /* @__PURE__ */ React.createElement("div", { style: { fontFamily: "var(--mono)", fontSize: 13, color: "var(--dim)", marginTop: 4 } }, me.handle), me.description ? /* @__PURE__ */ React.createElement("div", { style: { fontFamily: "var(--ui)", fontSize: 12.5, color: "var(--faint)", marginTop: 3 } }, me.description) : null), /* @__PURE__ */ React.createElement(Btn, { icon: "edit", onClick: () => setEditing(true) }, T.editProfile)), /* @__PURE__ */ React.createElement(Card, { label: T.identity }, /* @__PURE__ */ React.createElement(FieldRow, { T, label: T.userId, value: me.userId, copy: true, qr: true, onQr: (v, l) => setQr({ value: v, label: l }) }), /* @__PURE__ */ React.createElement(FieldRow, { T, label: T.carrierAddr, value: me.carrier, copy: true, qr: true, onQr: (v, l) => setQr({ value: v, label: l }) }), /* @__PURE__ */ React.createElement(FieldRow, { T, label: T.netKey, value: me.netKey, copy: true, last: true })), /* @__PURE__ */ React.createElement(Card, { label: T.network }, /* @__PURE__ */ React.createElement(FieldRow, { T, label: T.virtualIp, value: me.ip, copy: true }), /* @__PURE__ */ React.createElement(FieldRow, { T, label: T.wireLabel, value: `${me.wire} \xB7 lossless`, mono: false }), /* @__PURE__ */ React.createElement(FieldRow, { T, label: T.version, value: `lan ${me.lanVer} \xB7 peer ${me.peerVer} \xB7 ${me.channel}`, last: true })), /* @__PURE__ */ React.createElement(Card, { label: T.dangerZone }, /* @__PURE__ */ React.createElement("div", { style: { display: "flex", alignItems: "center", gap: 13, padding: "14px 16px" } }, /* @__PURE__ */ React.createElement("div", { style: { width: 34, height: 34, borderRadius: 8, flexShrink: 0, background: "color-mix(in oklab, var(--danger), transparent 86%)", display: "flex", alignItems: "center", justifyContent: "center", color: "var(--danger)" } }, /* @__PURE__ */ React.createElement(Icon, { name: "trash", size: 17, stroke: 2 })), /* @__PURE__ */ React.createElement("div", { style: { flex: 1 } }, /* @__PURE__ */ React.createElement("div", { style: { fontFamily: "var(--mono)", fontSize: 13.5, fontWeight: 600, color: "var(--danger)" } }, T.deleteNode), /* @__PURE__ */ React.createElement("div", { style: { fontFamily: "var(--ui)", fontSize: 12, color: "var(--faint)", marginTop: 1 } }, T.deleteSub)), /* @__PURE__ */ React.createElement(Btn, { tone: "danger", size: "sm" }, T.delete)))), qr && /* @__PURE__ */ React.createElement(DkQrModal, { T, value: qr.value, label: qr.label, onClose: () => setQr(null) }), editing && /* @__PURE__ */ React.createElement(DkEditModal, { T, me, onClose: () => setEditing(false), onSave: (name, description) => {
+    if (onEdit)
+      onEdit(name, description);
+    setEditing(false);
+  } }));
+}
+Object.assign(window, { ProfileTab });
+const DK_FILE_RTC_KIND = "file";
+const DK_FILE_RTC_CHUNK = 16 * 1024;
+const DK_FILE_RTC_OPEN_TIMEOUT_MS = 2e4;
+const DK_FILE_RTC_SIGNAL_TTL_MS = 10 * 60 * 1e3;
+function dkFileRtcId() {
+  if (window.crypto && window.crypto.randomUUID)
+    return window.crypto.randomUUID();
+  return "frtc-" + Date.now().toString(36) + "-" + Math.random().toString(36).slice(2);
+}
+function dkFileRtcEnvelope(fileId, type, extra) {
+  return Object.assign({ dkRtc: 1, kind: DK_FILE_RTC_KIND, fileId, type, ts: Date.now() }, extra || {});
+}
+function dkRtcState(pc) {
+  if (!pc)
+    return "";
+  return "ice=" + pc.iceConnectionState + " conn=" + pc.connectionState + " gather=" + pc.iceGatheringState;
+}
+function dkWaitForOpen(dc, timeoutMs, describeState) {
+  if (dc.readyState === "open")
+    return Promise.resolve();
+  return new Promise((resolve, reject) => {
+    const timer = setTimeout(() => {
+      cleanup();
+      const s = describeState ? describeState() : "";
+      reject(new Error("WebRTC data channel open timed out" + (s ? " (" + s + ")" : "")));
+    }, timeoutMs);
+    const cleanup = () => {
+      clearTimeout(timer);
+      dc.removeEventListener("open", onOpen);
+      dc.removeEventListener("error", onError);
+      dc.removeEventListener("close", onClose);
+    };
+    const onOpen = () => {
+      cleanup();
+      resolve();
+    };
+    const onError = () => {
+      cleanup();
+      const s = describeState ? describeState() : "";
+      reject(new Error("WebRTC data channel failed" + (s ? " (" + s + ")" : "")));
+    };
+    const onClose = () => {
+      cleanup();
+      const s = describeState ? describeState() : "";
+      reject(new Error("WebRTC data channel closed before open" + (s ? " (" + s + ")" : "")));
+    };
+    dc.addEventListener("open", onOpen);
+    dc.addEventListener("error", onError);
+    dc.addEventListener("close", onClose);
+  });
+}
+function dkWaitBufferedLow(dc, highWater) {
+  if (dc.bufferedAmount < highWater)
+    return Promise.resolve();
+  return new Promise((resolve, reject) => {
+    const prev = dc.bufferedAmountLowThreshold;
+    dc.bufferedAmountLowThreshold = Math.floor(highWater / 2);
+    let poll = null;
+    let timer = null;
+    const done = () => {
+      cleanup();
+      resolve();
+    };
+    const cleanup = () => {
+      if (poll)
+        clearInterval(poll);
+      if (timer)
+        clearTimeout(timer);
+      dc.removeEventListener("bufferedamountlow", done);
+      dc.removeEventListener("close", onClose);
+      dc.removeEventListener("error", onError);
+      dc.bufferedAmountLowThreshold = prev;
+    };
+    const check = () => {
+      if (dc.readyState !== "open")
+        return onClose();
+      if (dc.bufferedAmount < highWater)
+        done();
+    };
+    const onClose = () => {
+      cleanup();
+      reject(new Error("WebRTC data channel closed while draining"));
+    };
+    const onError = () => {
+      cleanup();
+      reject(new Error("WebRTC data channel failed while draining"));
+    };
+    dc.addEventListener("bufferedamountlow", done);
+    dc.addEventListener("close", onClose);
+    dc.addEventListener("error", onError);
+    poll = setInterval(check, 250);
+    timer = setTimeout(() => {
+      cleanup();
+      reject(new Error("WebRTC data channel drain timed out buffered=" + dc.bufferedAmount));
+    }, 3e4);
+  });
+}
+function dkFileDownload(blob, name) {
+  const url = URL.createObjectURL(blob);
+  const a = document.createElement("a");
+  a.href = url;
+  a.download = name || "agentnet-file";
+  a.textContent = name || "agentnet-file";
+  return { url, name: a.download };
+}
+function dkRememberRtcFile(peerId, fileId, name, size, url) {
+  if (!window.__dkRtcFiles)
+    window.__dkRtcFiles = /* @__PURE__ */ new Map();
+  const item = { id: fileId, peerId, name, size, url, media: dkFileMediaKind(name) };
+  window.__dkRtcFiles.set(peerId + "|" + name + "|" + size, item);
+  return item;
+}
+function useRtcFileController(selfId, onReceivedFile) {
+  const [incoming, setIncoming] = React.useState([]);
+  const peersRef = React.useRef(/* @__PURE__ */ new Map());
+  const onReceivedFileRef = React.useRef(onReceivedFile);
+  React.useEffect(() => {
+    onReceivedFileRef.current = onReceivedFile;
+  }, [onReceivedFile]);
+  React.useEffect(() => {
+    if (!selfId || !window.RTCPeerConnection || !window.dkRtcSignalBus)
+      return;
+    const bus = dkRtcSignalBus();
+    const cleanup = (fileId) => {
+      const sess = peersRef.current.get(fileId);
+      if (!sess)
+        return;
+      try {
+        sess.dc && sess.dc.close();
+      } catch (e) {
+      }
+      try {
+        sess.pc && sess.pc.close();
+      } catch (e) {
+      }
+      peersRef.current.delete(fileId);
+    };
+    const sendSignal = (peerId, fileId, type, extra) => bus.send(peerId, dkFileRtcEnvelope(fileId, type, extra));
+    const handleDataChannel = (peerId, fileId, pc, dc, initialMeta) => {
+      dc.binaryType = "arraybuffer";
+      const prev = peersRef.current.get(fileId);
+      const sess = Object.assign(prev || {}, { pc, dc, peerId, meta: initialMeta || null, chunks: [], received: 0 });
+      peersRef.current.set(fileId, sess);
+      dc.onmessage = (ev) => {
+        if (typeof ev.data === "string") {
+          let msg = null;
+          try {
+            msg = JSON.parse(ev.data);
+          } catch (e) {
+          }
+          if (!msg)
+            return;
+          if (msg.type === "meta") {
+            sess.meta = msg;
+            sess.chunks = [];
+            sess.received = 0;
+          } else if (msg.type === "done") {
+            const meta = sess.meta || {};
+            const blob = new Blob(sess.chunks, { type: meta.mime || "application/octet-stream" });
+            const dl = dkFileDownload(blob, meta.name || "agentnet-file");
+            dkRememberRtcFile(peerId, fileId, dl.name, blob.size, dl.url);
+            setIncoming((arr) => [{ id: fileId, peerId, name: dl.name, size: blob.size, url: dl.url }].concat(arr).slice(0, 8));
+            if (onReceivedFileRef.current)
+              onReceivedFileRef.current(peerId, dl.name, blob);
+            cleanup(fileId);
+          } else if (msg.type === "cancel") {
+            cleanup(fileId);
+          }
+          return;
+        }
+        sess.chunks.push(ev.data);
+        sess.received += ev.data.byteLength || ev.data.size || 0;
+      };
+      dc.onclose = () => setTimeout(() => cleanup(fileId), 1e3);
+      dc.onerror = () => cleanup(fileId);
+    };
+    const off = bus.on(DK_FILE_RTC_KIND, async (peerId, env) => {
+      if (!env || !env.fileId || !env.type)
+        return;
+      if (Date.now() - (env.ts || Date.now()) > DK_FILE_RTC_SIGNAL_TTL_MS)
+        return;
+      const fileId = env.fileId;
+      let sess = peersRef.current.get(fileId);
+      try {
+        if (env.type === "offer") {
+          if (sess && sess.pc && sess.pc.signalingState !== "closed") {
+            console.warn("[file-rtc] duplicate offer ignored for " + fileId);
+            return;
+          }
+          const pc = new RTCPeerConnection({ iceServers: CALL_ICE_SERVERS });
+          pc.oniceconnectionstatechange = () => console.warn("[file-rtc] receiver ice=" + pc.iceConnectionState + " conn=" + pc.connectionState);
+          pc.onconnectionstatechange = () => console.warn("[file-rtc] receiver conn=" + pc.connectionState + " ice=" + pc.iceConnectionState);
+          pc.onicecandidate = (ev) => {
+            if (ev.candidate)
+              sendSignal(peerId, fileId, "candidate", { candidate: ev.candidate.toJSON() }).catch(() => {
+              });
+          };
+          pc.ondatachannel = (ev) => handleDataChannel(peerId, fileId, pc, ev.channel, env.meta || null);
+          peersRef.current.set(fileId, { pc, dc: null, peerId, chunks: [], meta: env.meta || null, pendingCandidates: [] });
+          await pc.setRemoteDescription({ type: "offer", sdp: env.sdp });
+          sess = peersRef.current.get(fileId);
+          if (sess && sess.pendingCandidates) {
+            for (const c of sess.pendingCandidates.splice(0)) {
+              try {
+                await pc.addIceCandidate(c);
+              } catch (e) {
+              }
+            }
+          }
+          const answer = await pc.createAnswer();
+          await pc.setLocalDescription(answer);
+          await sendSignal(peerId, fileId, "answer", { sdp: answer.sdp });
+        } else if (env.type === "answer" && sess) {
+          if (sess.pc.signalingState !== "have-local-offer") {
+            console.warn("[file-rtc] stale answer ignored for " + fileId + " state=" + sess.pc.signalingState);
+            return;
+          }
+          await sess.pc.setRemoteDescription({ type: "answer", sdp: env.sdp });
+          if (sess.pendingCandidates) {
+            for (const c of sess.pendingCandidates.splice(0)) {
+              try {
+                await sess.pc.addIceCandidate(c);
+              } catch (e) {
+              }
+            }
+          }
+        } else if (env.type === "candidate" && sess && env.candidate) {
+          if (sess.pc.remoteDescription) {
+            try {
+              await sess.pc.addIceCandidate(env.candidate);
+            } catch (e) {
+            }
+          } else {
+            if (!sess.pendingCandidates)
+              sess.pendingCandidates = [];
+            sess.pendingCandidates.push(env.candidate);
+          }
+        } else if (env.type === "bye") {
+          cleanup(fileId);
+        }
+      } catch (e) {
+        console.warn("[file-rtc] signal failed", e);
+        cleanup(fileId);
+      }
+    });
+    return () => {
+      off();
+      for (const id of Array.from(peersRef.current.keys()))
+        cleanup(id);
+    };
+  }, [selfId]);
+  const sendFile = React.useCallback(async (peerId, file, onProgress) => {
+    if (!peerId || !file || !window.RTCPeerConnection || !window.dkRtcSignalBus) {
+      return { ok: false, fallback: true, error: "WebRTC unavailable" };
+    }
+    const bus = dkRtcSignalBus();
+    const fileId = dkFileRtcId();
+    const pc = new RTCPeerConnection({ iceServers: CALL_ICE_SERVERS });
+    const dc = pc.createDataChannel("agentnet-file", { ordered: true });
+    const sess = { pc, dc, peerId, chunks: [], meta: null, pendingCandidates: [] };
+    peersRef.current.set(fileId, sess);
+    const cleanup = () => {
+      try {
+        dc.close();
+      } catch (e) {
+      }
+      try {
+        pc.close();
+      } catch (e) {
+      }
+      peersRef.current.delete(fileId);
+    };
+    const sendSignal = (type, extra) => bus.send(peerId, dkFileRtcEnvelope(fileId, type, extra));
+    try {
+      pc.oniceconnectionstatechange = () => console.warn("[file-rtc] sender ice=" + pc.iceConnectionState + " conn=" + pc.connectionState);
+      pc.onconnectionstatechange = () => console.warn("[file-rtc] sender conn=" + pc.connectionState + " ice=" + pc.iceConnectionState);
+      pc.onicecandidate = (ev) => {
+        if (ev.candidate)
+          sendSignal("candidate", { candidate: ev.candidate.toJSON() }).catch(() => {
+          });
+      };
+      const offer = await pc.createOffer();
+      await pc.setLocalDescription(offer);
+      await sendSignal("offer", {
+        sdp: offer.sdp,
+        meta: { name: file.name, size: file.size, mime: file.type || "application/octet-stream" }
+      });
+      await dkWaitForOpen(dc, DK_FILE_RTC_OPEN_TIMEOUT_MS, () => dkRtcState(pc));
+      dc.send(JSON.stringify({ type: "meta", name: file.name, size: file.size, mime: file.type || "application/octet-stream" }));
+      let sent = 0;
+      const startedAt = Date.now();
+      let lastProgressAt = 0;
+      const highWater = 4 * 1024 * 1024;
+      const reportProgress = (force) => {
+        if (!onProgress)
+          return;
+        const now = Date.now();
+        if (!force && now - lastProgressAt < 250 && sent < file.size)
+          return;
+        lastProgressAt = now;
+        const elapsedMs = Math.max(1, now - startedAt);
+        const kbps = sent / 1024 / (elapsedMs / 1e3);
+        onProgress({
+          sent,
+          size: file.size,
+          pct: file.size ? sent / file.size * 100 : 100,
+          kbps,
+          elapsedMs,
+          via: "webrtc"
+        });
+      };
+      reportProgress(true);
+      while (sent < file.size) {
+        if (dc.readyState !== "open")
+          throw new Error("WebRTC data channel closed");
+        const end = Math.min(file.size, sent + DK_FILE_RTC_CHUNK);
+        const buf = await file.slice(sent, end).arrayBuffer();
+        dc.send(buf);
+        sent = end;
+        reportProgress(false);
+        await dkWaitBufferedLow(dc, highWater);
+      }
+      reportProgress(true);
+      dc.send(JSON.stringify({ type: "done" }));
+      await sendSignal("bye", { reason: "done" }).catch(() => {
+      });
+      setTimeout(cleanup, 1500);
+      return { ok: true, via: "webrtc", fileId };
+    } catch (e) {
+      await sendSignal("bye", { reason: "fallback" }).catch(() => {
+      });
+      cleanup();
+      return { ok: false, fallback: true, error: e && e.message || String(e) };
+    }
+  }, []);
+  const dismissIncoming = React.useCallback((id) => {
+    setIncoming((arr) => {
+      const item = arr.find((x) => x.id === id);
+      if (item && item.url)
+        setTimeout(() => URL.revokeObjectURL(item.url), 1e3);
+      return arr.filter((x) => x.id !== id);
+    });
+  }, []);
+  return { incoming, sendFile, dismissIncoming };
+}
+function RtcFileInbox({ T, peers, ctl }) {
+  const items = ctl && ctl.incoming || [];
+  if (!items.length)
+    return null;
+  const closeLabel = T && T.receivedClose || "Close";
+  const downloadLabel = T && T.downloadFile || "Download";
+  return /* @__PURE__ */ React.createElement("div", { style: { position: "fixed", right: 72, bottom: 18, zIndex: 90, width: 360, maxWidth: "calc(100vw - 96px)", display: "flex", flexDirection: "column", gap: 10 } }, items.map((it) => {
+    const peer = (peers || []).find((p) => p.id === it.peerId || p.userId === it.peerId) || {};
+    const who = peer.alias || peer.name || shortKey(it.peerId, 8, 5);
+    return /* @__PURE__ */ React.createElement("div", { key: it.id, style: { border: "1px solid var(--line)", background: "var(--panel)", borderRadius: 12, padding: 12, boxShadow: "0 14px 40px rgba(0,0,0,0.35)" } }, /* @__PURE__ */ React.createElement("div", { style: { fontFamily: "var(--mono)", fontSize: 12, color: "var(--faint)", marginBottom: 6 } }, T && T.receivedFile || "Received file", " \xB7 ", who), /* @__PURE__ */ React.createElement("div", { style: { fontFamily: "var(--ui)", fontSize: 13, fontWeight: 700, color: "var(--text)", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, it.name), /* @__PURE__ */ React.createElement("div", { style: { fontFamily: "var(--mono)", fontSize: 11, color: "var(--faint)", marginTop: 3 } }, dkFileSize(it.size)), /* @__PURE__ */ React.createElement("div", { style: { display: "flex", justifyContent: "flex-end", gap: 8, marginTop: 10, paddingRight: 2 } }, /* @__PURE__ */ React.createElement("button", { onClick: () => ctl.dismissIncoming(it.id), style: { height: 30, minWidth: 58, borderRadius: 8, border: "1px solid var(--line)", background: "transparent", color: "var(--dim)", cursor: "pointer" } }, closeLabel), /* @__PURE__ */ React.createElement("a", { href: it.url, download: it.name, onClick: () => setTimeout(() => ctl.dismissIncoming(it.id), 500), style: { height: 30, minWidth: 76, textAlign: "center", borderRadius: 8, padding: "6px 10px", background: "var(--accent)", color: "#fff", textDecoration: "none", fontFamily: "var(--mono)", fontSize: 12 } }, downloadLabel)));
+  }));
+}
+Object.assign(window, { useRtcFileController, RtcFileInbox });
+const CALL_ICE_SERVERS = [
+  { urls: "stun:stun.l.google.com:19302" },
+  { urls: "turn:tokyo.fi.chat:3478", username: "allcom", credential: "allcompass" },
+  { urls: "turn:tokyo.fi.chat:3478?transport=tcp", username: "allcom", credential: "allcompass" }
+];
+const VIDEO_CODEC_KEEP = /^video\/(H264|VP8|rtx|red|ulpfec)$/i;
+const SDP_BUDGET = 8192;
+function trimVideoCodecs(pc) {
+  var _a, _b, _c, _d, _e, _f, _g;
+  const supported = (_c = (_b = (_a = window.RTCRtpSender) == null ? void 0 : _a.getCapabilities) == null ? void 0 : _b.call(_a, "video")) == null ? void 0 : _c.codecs;
+  if (!supported)
+    return;
+  const keep = supported.filter((c) => VIDEO_CODEC_KEEP.test(c.mimeType));
+  if (!keep.length || keep.length === supported.length)
+    return;
+  for (const t of pc.getTransceivers()) {
+    const kind = ((_e = (_d = t.receiver) == null ? void 0 : _d.track) == null ? void 0 : _e.kind) || ((_g = (_f = t.sender) == null ? void 0 : _f.track) == null ? void 0 : _g.kind);
+    if (kind !== "video" || !t.setCodecPreferences)
+      continue;
+    try {
+      t.setCodecPreferences(keep);
+    } catch (e) {
+      console.warn("[call] setCodecPreferences failed", e);
+    }
+  }
+}
+function createLeanPeerConnection(config) {
+  const pc = new RTCPeerConnection(config);
+  for (const method of ["createOffer", "createAnswer"]) {
+    const original = pc[method].bind(pc);
+    pc[method] = async (...args) => {
+      trimVideoCodecs(pc);
+      const desc = await original(...args);
+      const bytes = new TextEncoder().encode(desc.sdp || "").length;
+      console[bytes > SDP_BUDGET ? "warn" : "log"](
+        `[call] ${method} SDP ${bytes}B / ${SDP_BUDGET}B budget` + (bytes > SDP_BUDGET ? " \u2014 too large for the Carrier invite channel, falling back to the offline path" : "")
+      );
+      return desc;
+    };
+  }
+  return pc;
+}
+function useCallController(selfId, onCallLog) {
+  const [incoming, setIncoming] = React.useState(null);
+  const [active, setActive] = React.useState(null);
+  const [localStream, setLocalStream] = React.useState(null);
+  const [remoteStream, setRemoteStream] = React.useState(null);
+  const [sharing, setSharing] = React.useState(false);
+  const engineRef = React.useRef(null);
+  const onCallLogRef = React.useRef(onCallLog);
+  React.useEffect(() => {
+    onCallLogRef.current = onCallLog;
+  }, [onCallLog]);
+  React.useEffect(() => {
+    if (!selfId || engineRef.current)
+      return;
+    if (!window.PeerWebRTC || !window.RTCPeerConnection) {
+      console.warn("[call] WebRTC or peer-webrtc unavailable \u2014 calls disabled");
+      return;
+    }
+    const { CallEngine } = window.PeerWebRTC;
+    const signaling = makeDaemonSignaling();
+    const engine = new CallEngine({
+      selfId,
+      signaling,
+      createPeerConnection: (c) => createLeanPeerConnection(c),
+      getLocalMedia: (k) => navigator.mediaDevices.getUserMedia({ audio: k.audio, video: k.video }),
+      getDisplayMedia: (c) => navigator.mediaDevices.getDisplayMedia(c || { video: true, audio: false }),
+      iceServers: CALL_ICE_SERVERS,
+      logger: (m) => console.log(m)
+    });
+    engine.on("incomingCall", (info) => {
+      setIncoming(info);
+      if (onCallLogRef.current)
+        onCallLogRef.current(info.peerId, !!info.video, "incoming");
+    });
+    engine.on("stateChanged", (info, state) => setActive((a) => a && a.callId === info.callId ? { ...a, state } : a));
+    engine.on("localStream", (id, s) => {
+      setLocalStream(s);
+      try {
+        setSharing(engine.isSharingScreen(id));
+      } catch (e) {
+      }
+    });
+    engine.on("remoteStream", (id, s) => setRemoteStream(s));
+    engine.on("ended", (id) => {
+      setActive((a) => a && a.callId === id ? null : a);
+      setIncoming((i) => i && i.callId === id ? null : i);
+      setLocalStream(null);
+      setRemoteStream(null);
+    });
+    engineRef.current = engine;
+    return () => {
+      try {
+        signaling.stop();
+        engine.dispose();
+      } catch (e) {
+      }
+      engineRef.current = null;
+    };
+  }, [selfId]);
+  const start = React.useCallback((peerId, video) => {
+    const eng = engineRef.current;
+    if (!eng) {
+      alert("Calls unavailable (WebRTC not supported here)");
+      return;
+    }
+    setActive({ callId: null, peerId, video: !!video, direction: "outgoing", state: "ringing" });
+    if (onCallLogRef.current)
+      onCallLogRef.current(peerId, !!video, "outgoing");
+    eng.call(peerId, { audio: true, video: !!video }).then((callId) => setActive((a) => a && a.peerId === peerId && a.callId === null ? { ...a, callId } : a)).catch((e) => {
+      setActive((a) => a && a.peerId === peerId ? null : a);
+      alert("Could not start call: " + (e && e.message || e));
+    });
+  }, []);
+  const accept = React.useCallback(async () => {
+    const eng = engineRef.current;
+    setIncoming((inc) => {
+      if (eng && inc) {
+        setActive({ callId: inc.callId, peerId: inc.peerId, video: inc.video, direction: "incoming", state: "connecting" });
+        eng.accept(inc.callId).catch((e) => alert("Accept failed: " + (e && e.message || e)));
+      }
+      return null;
+    });
+  }, []);
+  const reject = React.useCallback(() => {
+    const eng = engineRef.current;
+    setIncoming((inc) => {
+      if (eng && inc)
+        eng.reject(inc.callId);
+      return null;
+    });
+  }, []);
+  const hangup = React.useCallback(() => {
+    const eng = engineRef.current;
+    setActive((a) => {
+      if (eng && a && a.callId)
+        eng.hangup(a.callId);
+      return null;
+    });
+    setLocalStream(null);
+    setRemoteStream(null);
+  }, []);
+  const setMuted = React.useCallback((m) => {
+    const eng = engineRef.current, a = active;
+    if (eng && a && a.callId)
+      eng.setLocalTrackEnabled(a.callId, "audio", !m);
+  }, [active]);
+  const toggleShare = React.useCallback(async () => {
+    const eng = engineRef.current, a = active;
+    if (!eng || !a || !a.callId)
+      return;
+    try {
+      if (eng.isSharingScreen(a.callId))
+        await eng.stopScreenShare(a.callId);
+      else
+        await eng.shareScreen(a.callId);
+    } catch (e) {
+      if (e && e.name !== "NotAllowedError")
+        alert("Screen share failed: " + (e && e.message || e));
+    }
+  }, [active]);
+  const setVideoOn = React.useCallback((v) => {
+    const eng = engineRef.current, a = active;
+    if (eng && a && a.callId)
+      eng.setLocalTrackEnabled(a.callId, "video", v);
+  }, [active]);
+  return { incoming, active, localStream, remoteStream, sharing, start, accept, reject, hangup, setMuted, setVideoOn, toggleShare };
+}
+function VideoSurface({ stream, muted, style }) {
+  const ref = React.useCallback((el) => {
+    if (el && el.srcObject !== (stream || null))
+      el.srcObject = stream || null;
+  }, [stream]);
+  return /* @__PURE__ */ React.createElement("video", { ref, autoPlay: true, playsInline: true, muted: !!muted, style });
+}
+function AudioSink({ stream }) {
+  const ref = React.useCallback((el) => {
+    if (el && el.srcObject !== (stream || null))
+      el.srcObject = stream || null;
+  }, [stream]);
+  return /* @__PURE__ */ React.createElement("audio", { ref, autoPlay: true });
+}
+function useRingtone(active) {
+  React.useEffect(() => {
+    if (!active)
+      return void 0;
+    let ctx;
+    try {
+      ctx = new (window.AudioContext || window.webkitAudioContext)();
+    } catch (e) {
+      return void 0;
+    }
+    if (ctx.state === "suspended") {
+      ctx.resume().catch(() => {
+      });
+    }
+    let stopped = false;
+    const timers = [];
+    const burst = () => {
+      if (stopped || ctx.state === "closed")
+        return;
+      [440, 480].forEach((f) => {
+        const o = ctx.createOscillator(), g = ctx.createGain();
+        o.type = "sine";
+        o.frequency.value = f;
+        o.connect(g);
+        g.connect(ctx.destination);
+        const t = ctx.currentTime;
+        g.gain.setValueAtTime(1e-4, t);
+        g.gain.exponentialRampToValueAtTime(0.12, t + 0.05);
+        g.gain.setValueAtTime(0.12, t + 0.9);
+        g.gain.exponentialRampToValueAtTime(1e-4, t + 1);
+        o.start(t);
+        o.stop(t + 1.05);
+      });
+      timers.push(setTimeout(burst, 3e3));
+    };
+    burst();
+    return () => {
+      stopped = true;
+      timers.forEach(clearTimeout);
+      try {
+        ctx.close();
+      } catch (e) {
+      }
+    };
+  }, [active]);
+}
+function IncomingCallModal({ T, ctl, peers }) {
+  const inc = ctl.incoming;
+  useRingtone(!!inc);
+  if (!inc)
+    return null;
+  const peer = (peers || []).find((p) => p.id === inc.peerId) || { id: inc.peerId };
+  const name = peer.alias || peer.name || shortKey(inc.peerId, 10, 6);
+  return /* @__PURE__ */ React.createElement("div", { style: { position: "fixed", inset: 0, zIndex: 80, background: "color-mix(in oklab, var(--bg), transparent 15%)", display: "flex", alignItems: "center", justifyContent: "center" } }, /* @__PURE__ */ React.createElement("div", { style: { width: 320, padding: 26, borderRadius: 18, background: "var(--panel)", border: "1px solid var(--line)", textAlign: "center", boxShadow: "0 20px 60px rgba(0,0,0,0.4)" } }, /* @__PURE__ */ React.createElement("div", { style: { position: "relative", display: "inline-flex", alignItems: "center", justifyContent: "center", marginBottom: 14 } }, /* @__PURE__ */ React.createElement("span", { style: { position: "absolute", width: 96, height: 96, borderRadius: 999, border: "2px solid var(--accent)", animation: "dkpulse 2s ease-out infinite" } }), /* @__PURE__ */ React.createElement(DkIdenticon, { seed: inc.peerId, size: 72, radius: 18 })), /* @__PURE__ */ React.createElement("div", { style: { fontFamily: "var(--mono)", fontSize: 17, fontWeight: 700, color: "var(--text)" } }, name), /* @__PURE__ */ React.createElement("div", { style: { fontFamily: "var(--mono)", fontSize: 12.5, color: "var(--faint)", marginTop: 4, display: "flex", gap: 6, alignItems: "center", justifyContent: "center" } }, /* @__PURE__ */ React.createElement(Icon, { name: inc.video ? "video" : "phone", size: 14, stroke: 2 }), T && (inc.video ? T.incomingVideo : T.incomingAudio) || "Incoming " + (inc.video ? "video" : "audio") + " call"), /* @__PURE__ */ React.createElement("div", { style: { display: "flex", gap: 14, justifyContent: "center", marginTop: 22 } }, /* @__PURE__ */ React.createElement(CallBtn, { icon: "phone", label: T && T.decline || "Decline", danger: true, onClick: ctl.reject }), /* @__PURE__ */ React.createElement(CallBtn, { icon: inc.video ? "video" : "phone", label: T && T.accept || "Accept", active: true, onClick: ctl.accept }))));
+}
+function CallBtn({ icon, label, onClick, active, danger, wide }) {
+  const bg = danger ? "var(--danger)" : active ? "var(--accent)" : "var(--chip)";
+  const fg = danger || active ? "#fff" : "var(--text)";
+  return /* @__PURE__ */ React.createElement("div", { style: { display: "flex", flexDirection: "column", alignItems: "center", gap: 8 } }, /* @__PURE__ */ React.createElement("button", { onClick, style: {
+    width: wide ? 76 : 56,
+    height: 56,
+    borderRadius: wide ? 18 : 999,
+    cursor: "pointer",
+    background: bg,
+    color: fg,
+    border: "1px solid " + (active || danger ? "transparent" : "var(--line)"),
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center"
+  } }, /* @__PURE__ */ React.createElement(Icon, { name: icon, size: 22, stroke: 2 })), /* @__PURE__ */ React.createElement("span", { style: { fontFamily: "var(--mono)", fontSize: 10.5, color: "var(--faint)" } }, label));
+}
+function CallOverlay({ T, ctl, peers }) {
+  const call = ctl.active;
+  const [secs, setSecs] = React.useState(0);
+  const [muted, setMuted] = React.useState(false);
+  const [featured, setFeatured] = React.useState("remote");
+  const connected = call && call.state === "connected";
+  React.useEffect(() => {
+    if (!connected)
+      return;
+    const id = setInterval(() => setSecs((s) => s + 1), 1e3);
+    return () => clearInterval(id);
+  }, [connected]);
+  React.useEffect(() => {
+    if (!call) {
+      setSecs(0);
+      setMuted(false);
+    }
+  }, [call]);
+  if (!call)
+    return null;
+  const peer = (peers || []).find((p) => p.id === call.peerId) || { id: call.peerId };
+  const name = peer.alias || peer.name || shortKey(call.peerId, 10, 6);
+  const streamHasVideo = (s) => !!(s && s.getVideoTracks && s.getVideoTracks().length > 0);
+  const video = call.video || ctl.sharing || streamHasVideo(ctl.remoteStream) || streamHasVideo(ctl.localStream);
+  const mm = String(Math.floor(secs / 60)).padStart(2, "0");
+  const ss = String(secs % 60).padStart(2, "0");
+  const stateLabel = connected ? mm + ":" + ss : call.state === "ringing" ? T && T.ringing || "ringing\u2026" : call.state === "connecting" ? T && T.connecting || "connecting\u2026" : call.state;
+  const toggleMute = () => {
+    const n = !muted;
+    setMuted(n);
+    ctl.setMuted(n);
+  };
+  const canShare = connected && typeof navigator !== "undefined" && navigator.mediaDevices && navigator.mediaDevices.getDisplayMedia;
+  const controls = /* @__PURE__ */ React.createElement("div", { style: { display: "flex", gap: 18, alignItems: "flex-start" } }, /* @__PURE__ */ React.createElement(CallBtn, { icon: muted ? "micFill" : "mic", label: muted ? T && T.unmute || "unmute" : T && T.mute || "mute", active: muted, onClick: toggleMute }), canShare && /* @__PURE__ */ React.createElement(CallBtn, { icon: "monitor", label: ctl.sharing ? T && T.stopShare || "stop share" : T && T.share || "share", active: ctl.sharing, onClick: ctl.toggleShare }), /* @__PURE__ */ React.createElement(CallBtn, { icon: "phone", label: T && T.endCall || "end", danger: true, wide: true, onClick: ctl.hangup }));
+  return /* @__PURE__ */ React.createElement("div", { style: { position: "fixed", inset: 0, zIndex: 70, background: "var(--bg)", display: "flex", flexDirection: "column" } }, ctl.remoteStream && /* @__PURE__ */ React.createElement(AudioSink, { stream: ctl.remoteStream }), /* @__PURE__ */ React.createElement("div", { style: { height: 52, flexShrink: 0, display: "flex", alignItems: "center", gap: 10, padding: "0 18px", borderBottom: "1px solid var(--line)" } }, /* @__PURE__ */ React.createElement(Icon, { name: video ? "video" : "phone", size: 16, color: "var(--accent)", stroke: 2 }), /* @__PURE__ */ React.createElement("span", { style: { fontFamily: "var(--mono)", fontSize: 13, fontWeight: 700, color: "var(--text)" } }, name), /* @__PURE__ */ React.createElement(Tag, { tone: connected ? "ok" : "warn" }, stateLabel), /* @__PURE__ */ React.createElement("div", { style: { flex: 1 } }), connected && /* @__PURE__ */ React.createElement("span", { style: { fontFamily: "var(--mono)", fontSize: 14, fontWeight: 700, color: "var(--text)", letterSpacing: 1 } }, mm, ":", ss)), video ? (() => {
+    const tiles = [
+      { key: "remote", stream: ctl.remoteStream, label: name, mirror: false },
+      { key: "local", stream: ctl.localStream, label: ctl.sharing ? T && T.yourScreen || "Your screen" : T && T.you || "You", mirror: !ctl.sharing }
+    ].filter((t) => streamHasVideo(t.stream));
+    const feat = tiles.find((t) => t.key === featured) || tiles[0] || { key: "remote", stream: ctl.remoteStream, label: name };
+    const others = tiles.filter((t) => t.key !== feat.key);
+    return (
+      // The thumbnail strip and the controls FLOAT over the video instead of
+      // stacking under it. A phone camera is 9:16, so the featured tile is
+      // height-limited — `object-fit: contain` already shows the whole frame,
+      // but every pixel of chrome below the video shrinks the only dimension
+      // that matters. Stacked, those two rows ate ~210px; in a 900px-tall
+      // window that is a third of the portrait image. Overlaying them is also
+      // what every other call app does.
+      /* @__PURE__ */ React.createElement("div", { style: { flex: 1, minHeight: 0, position: "relative", padding: 18 } }, /* @__PURE__ */ React.createElement("div", { style: { width: "100%", height: "100%", position: "relative", borderRadius: 14, overflow: "hidden", background: "#000", border: "1px solid var(--line)" } }, feat.stream ? /* @__PURE__ */ React.createElement(VideoSurface, { stream: feat.stream, muted: true, style: { width: "100%", height: "100%", objectFit: "contain", transform: feat.mirror ? "scaleX(-1)" : "none" } }) : /* @__PURE__ */ React.createElement("div", { style: { width: "100%", height: "100%", display: "flex", alignItems: "center", justifyContent: "center" } }, /* @__PURE__ */ React.createElement(DkIdenticon, { seed: call.peerId, size: 92, radius: 22 })), /* @__PURE__ */ React.createElement("div", { style: { position: "absolute", left: 14, top: 12, padding: "4px 10px", borderRadius: 8, background: "rgba(0,0,0,.55)", color: "#fff", fontFamily: "var(--mono)", fontSize: 12, fontWeight: 600 } }, feat.label), /* @__PURE__ */ React.createElement("div", { style: {
+        position: "absolute",
+        left: 0,
+        right: 0,
+        bottom: 0,
+        paddingTop: 60,
+        display: "flex",
+        flexDirection: "column",
+        alignItems: "center",
+        gap: 12,
+        background: "linear-gradient(to top, rgba(0,0,0,.65), rgba(0,0,0,0))",
+        pointerEvents: "none"
+      } }, others.length > 0 && /* @__PURE__ */ React.createElement("div", { style: { display: "flex", gap: 12, justifyContent: "center", flexWrap: "wrap", pointerEvents: "auto" } }, others.map((t) => /* @__PURE__ */ React.createElement(
+        "button",
+        {
+          key: t.key,
+          onClick: () => setFeatured(t.key),
+          title: `Show ${t.label}`,
+          style: {
+            position: "relative",
+            width: 150,
+            height: 96,
+            borderRadius: 10,
+            overflow: "hidden",
+            background: "#000",
+            cursor: "pointer",
+            padding: 0,
+            border: "1px solid var(--line)"
+          }
+        },
+        /* @__PURE__ */ React.createElement(VideoSurface, { stream: t.stream, muted: true, style: { width: "100%", height: "100%", objectFit: "contain", transform: t.mirror ? "scaleX(-1)" : "none" } }),
+        /* @__PURE__ */ React.createElement("span", { style: { position: "absolute", left: 6, bottom: 5, padding: "2px 6px", borderRadius: 6, background: "rgba(0,0,0,.6)", color: "#fff", fontSize: 10, fontFamily: "var(--mono)" } }, t.label)
+      ))), /* @__PURE__ */ React.createElement("div", { style: { display: "flex", justifyContent: "center", marginBottom: 16, pointerEvents: "auto" } }, /* @__PURE__ */ React.createElement("div", { style: { padding: "16px 26px", borderRadius: 20, background: "color-mix(in oklab, var(--panel), transparent 8%)", border: "1px solid var(--line)" } }, controls)))))
+    );
+  })() : /* @__PURE__ */ React.createElement("div", { style: { flex: 1, display: "flex", flexDirection: "column", alignItems: "center", justifyContent: "center", gap: 22 } }, /* @__PURE__ */ React.createElement("div", { style: { position: "relative", display: "flex", alignItems: "center", justifyContent: "center" } }, !connected && /* @__PURE__ */ React.createElement("span", { style: { position: "absolute", width: 150, height: 150, borderRadius: 999, border: "2px solid var(--accent)", animation: "dkpulse 2s ease-out infinite" } }), /* @__PURE__ */ React.createElement(DkIdenticon, { seed: call.peerId, size: 108, radius: 26 })), /* @__PURE__ */ React.createElement("div", { style: { textAlign: "center" } }, /* @__PURE__ */ React.createElement("div", { style: { fontFamily: "var(--mono)", fontSize: 22, fontWeight: 700, color: "var(--text)" } }, name), /* @__PURE__ */ React.createElement("div", { style: { marginTop: 8, fontFamily: "var(--mono)", fontSize: 12.5, color: "var(--faint)" } }, stateLabel)), /* @__PURE__ */ React.createElement("div", { style: { marginTop: 18 } }, controls)));
+}
+Object.assign(window, { useCallController, CallOverlay, IncomingCallModal });
+function dkParseDeepLinkAddress() {
+  try {
+    const h = window.location.hash || "";
+    const qi = h.indexOf("?");
+    if (qi >= 0) {
+      const a = new URLSearchParams(h.slice(qi + 1)).get("address");
+      if (a && a.trim())
+        return a.trim();
+    }
+    const a2 = new URLSearchParams(window.location.search || "").get("address");
+    if (a2 && a2.trim())
+      return a2.trim();
+  } catch (e) {
+  }
+  return "";
+}
+const DK_DEFAULTS = (
+  /*EDITMODE-BEGIN*/
+  {
+    "theme": "dark",
+    "accent": "#7B6CF6",
+    "density": "compact",
+    "lang": "en",
+    "startTab": "chat"
+  }
+);
+function dkTheme(theme, accent) {
+  const base = {
+    "--ui": "'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace",
+    "--mono": "'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace",
+    "--accent": accent
+  };
+  if (theme === "light")
+    return {
+      ...base,
+      "--ident-l": "0.92",
+      "--bg": "oklch(0.965 0.004 264)",
+      "--panel": "#ffffff",
+      "--panel-2": "oklch(0.975 0.004 264)",
+      "--line": "oklch(0.9 0.006 264)",
+      "--text": "oklch(0.26 0.013 264)",
+      "--dim": "oklch(0.5 0.013 264)",
+      "--faint": "oklch(0.62 0.011 264)",
+      "--chip": "oklch(0.945 0.006 264)",
+      "--online": "oklch(0.62 0.16 150)",
+      "--off": "oklch(0.8 0.01 264)",
+      "--warn": "oklch(0.66 0.15 60)",
+      "--danger": "oklch(0.58 0.21 25)",
+      "--bub-me": accent,
+      "--bub-them": "oklch(0.97 0.004 264)",
+      "--rail": "oklch(0.99 0.003 264)"
+    };
+  return {
+    ...base,
+    "--ident-l": "0.32",
+    "--bg": "oklch(0.165 0.012 264)",
+    "--panel": "oklch(0.205 0.013 264)",
+    "--panel-2": "oklch(0.235 0.014 264)",
+    "--line": "oklch(0.295 0.014 264)",
+    "--text": "oklch(0.93 0.008 264)",
+    "--dim": "oklch(0.68 0.012 264)",
+    "--faint": "oklch(0.52 0.013 264)",
+    "--chip": "oklch(0.27 0.014 264)",
+    "--online": "oklch(0.78 0.17 150)",
+    "--off": "oklch(0.42 0.01 264)",
+    "--warn": "oklch(0.78 0.15 70)",
+    "--danger": "oklch(0.68 0.2 22)",
+    "--bub-me": accent,
+    "--bub-them": "oklch(0.255 0.014 264)",
+    "--rail": "oklch(0.185 0.013 264)"
+  };
+}
+const STR = {
+  en: {
+    chat: "Chat",
+    network: "Network",
+    profile: "Profile",
+    addPlaceholder: "paste a friend's carrier address\u2026",
+    add: "Add",
+    search: "search peers / ip\u2026",
+    addSending: "sending friend-request\u2026",
+    addSent: "friend-request sent \u2014 delivered when they\u2019re online; appears here once they accept",
+    addFailed: "could not send",
+    requests: "Friend requests",
+    accept: "accept",
+    reject: "reject",
+    peers: "Peers",
+    call: "Voice call",
+    alias: "Set alias",
+    sendFile: "Send file",
+    sendWebrtcFile: "Send file via WebRTC",
+    block: "Block peer",
+    remove: "Remove friend",
+    receivedFile: "Received file",
+    receivedClose: "Close",
+    downloadFile: "Download",
+    attach: "Attach file",
+    message: "Message",
+    send: "Send",
+    pickPeer: "Select a peer to open the conversation",
+    queued: "queued",
+    open: "open",
+    retry: "Retry",
+    cancel: "Cancel",
+    cancelling: "Cancelling\u2026",
+    cancelled: "Transfer cancelled",
+    retrying: "Retrying\u2026",
+    retried: "Transfer restarted",
+    cancelFailed: "Cancel failed",
+    retryFailed: "Retry failed",
+    cancelMissing: "No active transfer was found. Refresh and try again.",
+    retryMissing: "No retryable transfer or original file is unavailable.",
+    myIp: "my ip",
+    copyAddr: "copy address",
+    peersOnline: "peers online",
+    direct: "direct (LAN)",
+    activeEgress: "active egress",
+    directEgress: "direct",
+    noProxy: "no proxy",
+    wireLabel: "wire",
+    lossless: "lossless",
+    reqs: "requests",
+    pending: "pending inbound",
+    peerRouting: "Peer routing",
+    colPeer: "peer",
+    colVip: "virtual ip",
+    colPath: "path",
+    colWire: "wire",
+    openChat: "Open chat",
+    ping: "Ping",
+    exitNodes: "Exit nodes",
+    addExit: "add exit",
+    up: "up",
+    routing: "routing",
+    routeThru: "route",
+    egressVia: "all egress routed via",
+    stopRouting: "stop",
+    identity: "Identity",
+    userId: "user id",
+    carrierAddr: "carrier address",
+    netKey: "network key",
+    virtualIp: "virtual ip",
+    version: "version",
+    editProfile: "edit",
+    copy: "Copy",
+    copied: "Copied",
+    copyFailed: "Copy failed",
+    dangerZone: "Danger zone",
+    deleteNode: "Delete this node",
+    deleteSub: "Permanently remove identity & keys from this device",
+    delete: "delete",
+    settings: "Settings",
+    call: "Call",
+    connected: "connected",
+    mute: "mute",
+    unmute: "unmute",
+    speaker: "speaker",
+    toVideo: "video",
+    audioOnly: "audio",
+    endCall: "end",
+    you: "you",
+    meeting: "Meeting",
+    meetingRooms: "Meeting rooms",
+    nextVersion: "next version",
+    createRoom: "New room",
+    meetingDesc: "Spin up audio & video rooms across servers and invite peers by virtual IP. Group calls, screen share, and shared exit routing land in the next release."
+  },
+  zh: {
+    chat: "\u804A\u5929",
+    network: "\u7F51\u7EDC",
+    profile: "\u6211\u7684",
+    addPlaceholder: "\u7C98\u8D34\u597D\u53CB\u7684 carrier \u5730\u5740\u2026",
+    add: "\u6DFB\u52A0",
+    search: "\u641C\u7D22\u597D\u53CB / IP\u2026",
+    addSending: "\u6B63\u5728\u53D1\u9001\u597D\u53CB\u8BF7\u6C42\u2026",
+    addSent: "\u597D\u53CB\u8BF7\u6C42\u5DF2\u53D1\u9001 \u2014 \u5BF9\u65B9\u4E0A\u7EBF\u540E\u9001\u8FBE\uFF0C\u63A5\u53D7\u540E\u51FA\u73B0\u5728\u5217\u8868",
+    addFailed: "\u53D1\u9001\u5931\u8D25",
+    requests: "\u597D\u53CB\u8BF7\u6C42",
+    accept: "\u63A5\u53D7",
+    reject: "\u62D2\u7EDD",
+    peers: "\u597D\u53CB",
+    call: "\u8BED\u97F3\u901A\u8BDD",
+    alias: "\u8BBE\u7F6E\u5907\u6CE8",
+    sendFile: "\u53D1\u9001\u6587\u4EF6",
+    sendWebrtcFile: "\u901A\u8FC7 WebRTC \u53D1\u9001\u6587\u4EF6",
+    block: "\u62C9\u9ED1",
+    remove: "\u5220\u9664\u597D\u53CB",
+    receivedFile: "\u6536\u5230\u6587\u4EF6",
+    receivedClose: "\u5173\u95ED",
+    downloadFile: "\u4E0B\u8F7D",
+    attach: "\u9644\u4EF6",
+    message: "\u6D88\u606F",
+    send: "\u53D1\u9001",
+    pickPeer: "\u9009\u62E9\u4E00\u4F4D\u597D\u53CB\u5F00\u59CB\u4F1A\u8BDD",
+    queued: "\u5F85\u53D1\u9001",
+    open: "\u6253\u5F00",
+    retry: "\u91CD\u8BD5",
+    cancel: "\u53D6\u6D88",
+    cancelling: "\u6B63\u5728\u53D6\u6D88\u2026",
+    cancelled: "\u5DF2\u53D6\u6D88\u4F20\u8F93",
+    retrying: "\u6B63\u5728\u91CD\u8BD5\u2026",
+    retried: "\u5DF2\u91CD\u65B0\u5F00\u59CB\u4F20\u8F93",
+    cancelFailed: "\u53D6\u6D88\u5931\u8D25",
+    retryFailed: "\u91CD\u8BD5\u5931\u8D25",
+    cancelMissing: "\u6CA1\u6709\u627E\u5230\u6B63\u5728\u8FDB\u884C\u7684\u4F20\u8F93\uFF1B\u8BF7\u5237\u65B0\u9875\u9762\u540E\u91CD\u8BD5\u3002",
+    retryMissing: "\u6CA1\u6709\u53EF\u91CD\u8BD5\u7684\u4F20\u8F93\uFF0C\u6216\u539F\u6587\u4EF6\u5DF2\u4E0D\u53EF\u7528\u3002",
+    myIp: "\u6211\u7684 IP",
+    copyAddr: "\u590D\u5236\u5730\u5740",
+    peersOnline: "\u5728\u7EBF\u597D\u53CB",
+    direct: "\u76F4\u8FDE (\u5C40\u57DF\u7F51)",
+    activeEgress: "\u5F53\u524D\u51FA\u53E3",
+    directEgress: "\u76F4\u8FDE",
+    noProxy: "\u65E0\u4EE3\u7406",
+    wireLabel: "\u534F\u8BAE",
+    lossless: "\u65E0\u635F",
+    reqs: "\u8BF7\u6C42",
+    pending: "\u5F85\u5904\u7406",
+    peerRouting: "\u8282\u70B9\u8DEF\u7531",
+    colPeer: "\u597D\u53CB",
+    colVip: "\u865A\u62DF IP",
+    colPath: "\u8DEF\u5F84",
+    colWire: "\u534F\u8BAE",
+    openChat: "\u6253\u5F00\u804A\u5929",
+    ping: "Ping",
+    exitNodes: "\u51FA\u53E3\u8282\u70B9",
+    addExit: "\u6DFB\u52A0\u51FA\u53E3",
+    up: "\u5728\u7EBF",
+    routing: "\u4F7F\u7528\u4E2D",
+    routeThru: "\u8DEF\u7531",
+    egressVia: "\u5168\u90E8\u51FA\u53E3\u6D41\u91CF\u7ECF\u7531",
+    stopRouting: "\u505C\u6B62",
+    identity: "\u8EAB\u4EFD",
+    userId: "\u7528\u6237 ID",
+    carrierAddr: "Carrier \u5730\u5740",
+    netKey: "\u7F51\u7EDC\u516C\u94A5",
+    virtualIp: "\u865A\u62DF IP",
+    version: "\u7248\u672C",
+    editProfile: "\u7F16\u8F91",
+    copy: "\u590D\u5236",
+    copied: "\u5DF2\u590D\u5236",
+    copyFailed: "\u590D\u5236\u5931\u8D25",
+    dangerZone: "\u5371\u9669\u64CD\u4F5C",
+    deleteNode: "\u5220\u9664\u6B64\u8282\u70B9",
+    deleteSub: "\u4ECE\u672C\u8BBE\u5907\u6C38\u4E45\u79FB\u9664\u8EAB\u4EFD\u4E0E\u5BC6\u94A5",
+    delete: "\u5220\u9664",
+    settings: "\u8BBE\u7F6E",
+    call: "\u901A\u8BDD",
+    connected: "\u5DF2\u8FDE\u63A5",
+    mute: "\u9759\u97F3",
+    unmute: "\u53D6\u6D88\u9759\u97F3",
+    speaker: "\u626C\u58F0\u5668",
+    toVideo: "\u89C6\u9891",
+    audioOnly: "\u8BED\u97F3",
+    endCall: "\u6302\u65AD",
+    you: "\u6211",
+    meeting: "\u4F1A\u8BAE",
+    meetingRooms: "\u4F1A\u8BAE\u623F\u95F4",
+    nextVersion: "\u4E0B\u4E2A\u7248\u672C",
+    createRoom: "\u65B0\u5EFA\u623F\u95F4",
+    meetingDesc: "\u8DE8\u670D\u52A1\u5668\u521B\u5EFA\u97F3\u89C6\u9891\u623F\u95F4\uFF0C\u901A\u8FC7\u865A\u62DF IP \u9080\u8BF7\u597D\u53CB\u3002\u7FA4\u7EC4\u901A\u8BDD\u3001\u5C4F\u5E55\u5171\u4EAB\u4E0E\u5171\u4EAB\u51FA\u53E3\u8DEF\u7531\u5C06\u5728\u4E0B\u4E2A\u7248\u672C\u4E0A\u7EBF\u3002"
+  }
+};
+function RailBtn({ icon, label, active, soon, onClick }) {
+  return /* @__PURE__ */ React.createElement("button", { onClick, title: label, style: {
+    width: 52,
+    height: 52,
+    borderRadius: 11,
+    cursor: "pointer",
+    fontFamily: "var(--mono)",
+    position: "relative",
+    border: "1px solid " + (active ? "var(--line)" : "transparent"),
+    background: active ? "var(--panel-2)" : "transparent",
+    display: "flex",
+    flexDirection: "column",
+    alignItems: "center",
+    justifyContent: "center",
+    gap: 3
+  } }, /* @__PURE__ */ React.createElement(Icon, { name: icon, size: 20, stroke: active ? 2.1 : 1.8, color: active ? "var(--accent)" : "var(--dim)" }), /* @__PURE__ */ React.createElement("span", { style: { fontSize: 9, fontWeight: 600, letterSpacing: 0.2, color: active ? "var(--accent)" : "var(--faint)" } }, label), soon && /* @__PURE__ */ React.createElement("span", { style: { position: "absolute", top: 5, right: 6, width: 6, height: 6, borderRadius: 999, background: "var(--warn)" } }));
+}
+function DkApp() {
+  const [t, setTweak] = useTweaks(DK_DEFAULTS);
+  const [tab, setTab] = React.useState(t.startTab || "chat");
+  const [activeId, setActiveId] = React.useState(null);
+  const data = useDaemonData();
+  const me = data.me;
+  React.useEffect(() => {
+    const mine = window.__DK_UI_VERSION;
+    const served = me && me.lanVer;
+    if (!mine || !served || mine === served)
+      return;
+    const key = "dk-reloaded-for-" + served;
+    if (sessionStorage.getItem(key))
+      return;
+    sessionStorage.setItem(key, "1");
+    window.location.reload();
+  }, [me && me.lanVer]);
+  const peers = data.peers;
+  const [pendingAddr, setPendingAddr] = React.useState(() => dkParseDeepLinkAddress());
+  React.useEffect(() => {
+    const onHash = () => {
+      const a = dkParseDeepLinkAddress();
+      if (a)
+        setPendingAddr(a);
+    };
+    window.addEventListener("hashchange", onHash);
+    return () => window.removeEventListener("hashchange", onHash);
+  }, []);
+  React.useEffect(() => {
+    if (!pendingAddr)
+      return;
+    setTab("chat");
+    if (!peers || !peers.length)
+      return;
+    const hit = peers.find((p) => p.address && p.address === pendingAddr);
+    if (hit) {
+      setActiveId(hit.id);
+      setPendingAddr("");
+      try {
+        window.history.replaceState(null, "", window.location.pathname);
+      } catch (e) {
+      }
+    } else {
+      try {
+        window.history.replaceState(null, "", window.location.pathname);
+      } catch (e) {
+      }
+    }
+  }, [pendingAddr, peers]);
+  const requests = data.requests;
+  const exits = data.exits;
+  const activeExit = data.activeExit;
+  const T = STR[t.lang] || STR.en;
+  const vars = dkTheme(t.theme, t.accent);
+  const rowPad = t.density === "comfortable" ? "11px 12px" : "7px 10px";
+  const callCtl = useCallController(me.userId, (peerId, video, direction) => {
+    const text = `WebRTC ${video ? "video" : "audio"} call: ${direction}`;
+    dkApi.logLocal(peerId, direction === "outgoing" ? "out" : "in", text).then(() => {
+      data.loadThread(peerId);
+      data.refresh();
+    });
+  });
+  const onCall = (peerId, video) => callCtl.start(peerId, !!video);
+  const rtcFileCtl = useRtcFileController(me.userId, (peerId, name, blob) => {
+    if (!blob)
+      return;
+    dkApi.saveWebrtcFile(peerId, name, blob).then((r) => {
+      if (!r || r.ok === false) {
+        return dkApi.logLocal(peerId, "in", "received file via WebRTC: " + name + " (" + dkFileSize(blob.size) + ")");
+      }
+    }).then(() => {
+      data.loadThread(peerId);
+      data.refresh();
+    });
+  });
+  React.useEffect(() => {
+    if (!activeId && peers.length)
+      setActiveId(peers[0].id);
+  }, [peers, activeId]);
+  React.useEffect(() => {
+    if (!activeId)
+      return;
+    data.loadThread(activeId);
+    dkApi.markRead(activeId).then(data.refresh);
+    const iv = setInterval(() => {
+      data.loadThread(activeId);
+      dkApi.markRead(activeId);
+    }, 2500);
+    return () => clearInterval(iv);
+  }, [activeId]);
+  const onSelect = (id) => setActiveId(id);
+  const onAct = (id, kind) => {
+    const r = requests.find((x) => x.id === id);
+    const uid = r && r.userid || id;
+    (kind === "accept" ? dkApi.accept(uid) : dkApi.reject(uid)).then(data.refresh);
+  };
+  const onRemove = (peer) => {
+    dkApi.remove(peer.id).then(data.refresh);
+    if (peer.id === activeId)
+      setActiveId(null);
+  };
+  const onAdd = (address) => {
+    if (!address || !address.trim())
+      return Promise.resolve({ ok: false, error: "empty address" });
+    return dkApi.add(address.trim()).then((r) => {
+      data.refresh();
+      return r;
+    });
+  };
+  const onSend = (text) => {
+    if (!activeId || !text || !text.trim())
+      return;
+    dkApi.send(activeId, text.trim()).then(() => data.loadThread(activeId)).then(data.refresh);
+  };
+  const onSendFile = (file) => {
+    if (!activeId || !file)
+      return Promise.resolve({ ok: false });
+    return dkApi.sendFile(activeId, file).then((r) => {
+      data.loadThread(activeId);
+      data.refresh();
+      return r;
+    });
+  };
+  const onSendRtcFile = (file, onProgress) => {
+    if (!activeId || !file)
+      return Promise.resolve({ ok: false, error: "no active peer or file" });
+    return rtcFileCtl.sendFile(activeId, file, onProgress).then((r) => {
+      if (r && r.ok && r.via === "webrtc") {
+        return dkApi.send(activeId, (t.lang === "zh" ? "\u5DF2\u901A\u8FC7 WebRTC \u53D1\u9001\u6587\u4EF6: " : "sent file via WebRTC: ") + file.name).then(() => ({ ok: true, via: "webrtc" }));
+      }
+      return { ok: false, error: r && r.error || "WebRTC file send failed" };
+    }).then((r) => {
+      data.loadThread(activeId);
+      data.refresh();
+      return r;
+    });
+  };
+  const onAlias = (peer) => {
+    const a = window.prompt("Set alias for this peer (empty to clear):", peer.alias || "");
+    if (a !== null)
+      dkApi.alias(peer.id, a).then(data.refresh);
+  };
+  const onEdit = (name, description) => dkApi.setProfile(name, description).then(data.refresh);
+  const onSetExit = () => {
+  };
+  const onOpenChat = (id) => {
+    setActiveId(id);
+    setTab("chat");
+  };
+  const onOpenNet = () => setTab("network");
+  const nav = [
+    { id: "chat", icon: "message", label: T.chat },
+    { id: "network", icon: "network", label: T.network },
+    { id: "profile", icon: "userRound", label: T.profile }
+  ];
+  return /* @__PURE__ */ React.createElement("div", { style: { ...vars, "--row-pad": rowPad, position: "fixed", inset: 0, display: "flex", background: "var(--bg)", color: "var(--text)", fontFamily: "var(--ui)" } }, /* @__PURE__ */ React.createElement("div", { style: { width: 68, flexShrink: 0, borderRight: "1px solid var(--line)", background: "var(--rail)", display: "flex", flexDirection: "column", alignItems: "center", padding: "14px 0", gap: 8 } }, /* @__PURE__ */ React.createElement("div", { style: { width: 38, height: 38, borderRadius: 10, background: "var(--accent)", display: "flex", alignItems: "center", justifyContent: "center", marginBottom: 8 } }, /* @__PURE__ */ React.createElement(Icon, { name: "terminal", size: 20, color: "#fff", stroke: 2.2 })), nav.map((n) => /* @__PURE__ */ React.createElement(RailBtn, { key: n.id, icon: n.icon, label: n.label, active: tab === n.id, soon: n.soon, onClick: () => setTab(n.id) })), /* @__PURE__ */ React.createElement("div", { style: { flex: 1 } }), /* @__PURE__ */ React.createElement("div", { style: { position: "relative" } }, /* @__PURE__ */ React.createElement(DkAvatar, { peer: { ...me, id: me.userId, agent: false }, size: 36, radius: 9 }))), /* @__PURE__ */ React.createElement("div", { style: { flex: 1, minWidth: 0, minHeight: 0, display: "flex", flexDirection: "column" } }, /* @__PURE__ */ React.createElement("div", { style: { height: 46, flexShrink: 0, borderBottom: "1px solid var(--line)", background: "var(--panel)", display: "flex", alignItems: "center", gap: 12, padding: "0 16px" } }, /* @__PURE__ */ React.createElement("svg", { width: 20, height: 20, viewBox: "0 0 24 24", fill: "none", stroke: "var(--accent)", strokeWidth: 2.2, strokeLinecap: "round", strokeLinejoin: "round", style: { display: "block", flexShrink: 0 } }, /* @__PURE__ */ React.createElement("path", { d: "m4.5 17 6-6-6-6" }), /* @__PURE__ */ React.createElement("path", { d: "M12 18.5h7.5" })), /* @__PURE__ */ React.createElement("span", { style: { fontFamily: "var(--mono)", fontSize: 14, fontWeight: 700, letterSpacing: -0.3, color: "var(--text)" } }, "beagle"), /* @__PURE__ */ React.createElement("span", { style: { fontFamily: "var(--mono)", fontSize: 12, color: "var(--faint)" } }, "\xB7 ", nav.find((n) => n.id === tab).label.toLowerCase()), /* @__PURE__ */ React.createElement("div", { style: { flex: 1 } }), /* @__PURE__ */ React.createElement(Tag, { tone: "accent" }, me.channel, " \xB7 lan ", me.lanVer), /* @__PURE__ */ React.createElement("div", { style: { display: "flex", alignItems: "center", gap: 7, padding: "0 4px" } }, /* @__PURE__ */ React.createElement(StatusDot, { online: me.online }), /* @__PURE__ */ React.createElement(Mono, { size: 12.5, copy: me.ip }, me.ip)), /* @__PURE__ */ React.createElement("span", { style: { width: 1, height: 22, background: "var(--line)" } }), /* @__PURE__ */ React.createElement("div", { style: { display: "flex", alignItems: "center", gap: 8 } }, /* @__PURE__ */ React.createElement(DkAvatar, { peer: { ...me, id: me.userId, agent: false }, size: 26, radius: 7 }), /* @__PURE__ */ React.createElement("span", { style: { fontFamily: "var(--mono)", fontSize: 12.5, fontWeight: 600, color: "var(--text)" } }, me.name))), tab === "chat" && /* @__PURE__ */ React.createElement(ChatTab, { T, lang: t.lang, peers, requests, activeId, thread: data.threads[activeId], onSelect, onAct, onAdd, onSend, onSendFile, onSendRtcFile, onAlias, onRemove, onOpenNet, onCall, onReloadThread: () => activeId && data.loadThread(activeId), prefillAddr: pendingAddr, onPrefillConsumed: () => setPendingAddr("") }), tab === "network" && /* @__PURE__ */ React.createElement(NetworkTab, { T, me, peers, exits, activeExit, reqCount: requests.length, onSetExit, onOpenChat }), tab === "profile" && /* @__PURE__ */ React.createElement(ProfileTab, { T, me, onEdit })), /* @__PURE__ */ React.createElement(TweaksPanel, null, /* @__PURE__ */ React.createElement(TweakSection, { label: t.lang === "zh" ? "\u5916\u89C2" : "Appearance" }), /* @__PURE__ */ React.createElement(
+    TweakRadio,
+    {
+      label: t.lang === "zh" ? "\u4E3B\u9898" : "Theme",
+      value: t.theme,
+      options: [{ value: "dark", label: t.lang === "zh" ? "\u6DF1\u8272" : "Dark" }, { value: "light", label: t.lang === "zh" ? "\u6D45\u8272" : "Light" }],
+      onChange: (v) => setTweak("theme", v)
+    }
+  ), /* @__PURE__ */ React.createElement(
+    TweakColor,
+    {
+      label: t.lang === "zh" ? "\u5F3A\u8C03\u8272" : "Accent",
+      value: t.accent,
+      options: ["#7B6CF6", "#3B82F6", "#10B981", "#F59E0B", "#EC4899", "#E0584B"],
+      onChange: (v) => setTweak("accent", v)
+    }
+  ), /* @__PURE__ */ React.createElement(TweakSection, { label: t.lang === "zh" ? "\u5E03\u5C40" : "Layout" }), /* @__PURE__ */ React.createElement(
+    TweakRadio,
+    {
+      label: t.lang === "zh" ? "\u5BC6\u5EA6" : "Density",
+      value: t.density,
+      options: [{ value: "compact", label: t.lang === "zh" ? "\u7D27\u51D1" : "Compact" }, { value: "comfortable", label: t.lang === "zh" ? "\u5BBD\u677E" : "Comfy" }],
+      onChange: (v) => setTweak("density", v)
+    }
+  ), /* @__PURE__ */ React.createElement(TweakSection, { label: t.lang === "zh" ? "\u8BED\u8A00" : "Language" }), /* @__PURE__ */ React.createElement(
+    TweakRadio,
+    {
+      label: t.lang === "zh" ? "\u754C\u9762\u8BED\u8A00" : "On-screen",
+      value: t.lang,
+      options: [{ value: "en", label: "EN" }, { value: "zh", label: "\u4E2D\u6587" }],
+      onChange: (v) => setTweak("lang", v)
+    }
+  ), /* @__PURE__ */ React.createElement(TweakSection, { label: t.lang === "zh" ? "\u8DF3\u8F6C" : "Jump to" }), /* @__PURE__ */ React.createElement("div", { style: { display: "flex", gap: 6, flexWrap: "wrap" } }, nav.map((n) => /* @__PURE__ */ React.createElement("button", { key: n.id, onClick: () => setTab(n.id), style: {
+    flex: "1 0 30%",
+    height: 32,
+    borderRadius: 8,
+    cursor: "pointer",
+    fontFamily: "var(--mono)",
+    border: "1px solid rgba(255,255,255,0.14)",
+    background: tab === n.id ? "rgba(255,255,255,0.18)" : "rgba(255,255,255,0.06)",
+    color: "#fff",
+    fontSize: 12,
+    fontWeight: 600
+  } }, n.label)))), /* @__PURE__ */ React.createElement(IncomingCallModal, { T, ctl: callCtl, peers }), /* @__PURE__ */ React.createElement(CallOverlay, { T, ctl: callCtl, peers }), /* @__PURE__ */ React.createElement(RtcFileInbox, { T, peers, ctl: rtcFileCtl }));
+}
+ReactDOM.createRoot(document.getElementById("root")).render(/* @__PURE__ */ React.createElement(DkApp, null));