pxengine 0.1.142 → 0.1.143

package/dist/index.mjs

@@ -16436,6 +16436,25 @@ var EditIcon = () => /* @__PURE__ */ jsxs109("svg", { width: "14", height: "14",
 ] });
 var ChevronUpIcon = () => /* @__PURE__ */ jsx151("svg", { width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx151("polyline", { points: "18 15 12 9 6 15" }) });
 var ChevronDownIcon = () => /* @__PURE__ */ jsx151("svg", { width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx151("polyline", { points: "6 9 12 15 18 9" }) });
+var PptxIcon = () => /* @__PURE__ */ jsxs109("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.8", strokeLinecap: "round", strokeLinejoin: "round", children: [
+  /* @__PURE__ */ jsx151("rect", { x: "3", y: "4", width: "18", height: "13", rx: "2" }),
+  /* @__PURE__ */ jsx151("path", { d: "M7 21h10M12 17v4" }),
+  /* @__PURE__ */ jsx151("path", { d: "M8 13v-2M12 13V9M16 13v-3" })
+] });
+var PdfIcon = () => /* @__PURE__ */ jsxs109("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.8", strokeLinecap: "round", strokeLinejoin: "round", children: [
+  /* @__PURE__ */ jsx151("path", { d: "M14 3H7a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8z" }),
+  /* @__PURE__ */ jsx151("path", { d: "M14 3v5h5" }),
+  /* @__PURE__ */ jsx151("path", { d: "M9 13h6M9 17h4" })
+] });
+var HtmlIcon = () => /* @__PURE__ */ jsxs109("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.8", strokeLinecap: "round", strokeLinejoin: "round", children: [
+  /* @__PURE__ */ jsx151("rect", { x: "3", y: "4", width: "18", height: "16", rx: "2" }),
+  /* @__PURE__ */ jsx151("path", { d: "M3 9h18" }),
+  /* @__PURE__ */ jsx151("path", { d: "M6.5 6.5h.01M9.5 6.5h.01" })
+] });
+var Spinner2 = () => /* @__PURE__ */ jsxs109("svg", { className: "animate-spin", width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true", children: [
+  /* @__PURE__ */ jsx151("circle", { cx: "12", cy: "12", r: "9", stroke: "currentColor", strokeOpacity: "0.25", strokeWidth: "3" }),
+  /* @__PURE__ */ jsx151("path", { d: "M21 12a9 9 0 0 0-9-9", stroke: "currentColor", strokeWidth: "3", strokeLinecap: "round" })
+] });
 
 // src/molecules/generic/PresentationJobCard/PresentationJobCard.tsx
 import { Fragment as Fragment5, jsx as jsx152, jsxs as jsxs110 } from "react/jsx-runtime";
@@ -16494,31 +16513,34 @@ var FORMATS = [
     key: "pptx_url",
     label: "PowerPoint",
     ext: ".pptx",
-    emoji: "\u{1F4CA}",
+    Icon: PptxIcon,
     desc: "Editable slides \u2014 open in PowerPoint, Keynote, or Google Slides",
-    accent: { text: "text-orange-400", bg: "bg-orange-500/10 border-orange-500/20" }
+    // Hue lives on the icon tile only; the row itself stays neutral so three
+    // stacked formats don't read as three competing status colours.
+    accent: { icon: "text-orange-300", tile: "bg-orange-500/10 ring-orange-500/20" }
   },
   {
     key: "pdf_url",
     label: "PDF",
     ext: ".pdf",
-    emoji: "\u{1F4C4}",
+    Icon: PdfIcon,
     desc: "Print-ready, fixed layout \u2014 open in any PDF viewer",
-    accent: { text: "text-red-400", bg: "bg-red-500/10 border-red-500/20" }
+    accent: { icon: "text-red-300", tile: "bg-red-500/10 ring-red-500/20" }
   },
   {
     key: "html_url",
     label: "HTML",
     ext: ".html",
-    emoji: "\u{1F310}",
+    Icon: HtmlIcon,
     desc: "Interactive web presentation \u2014 download and open in browser",
-    accent: { text: "text-sky-400", bg: "bg-sky-500/10 border-sky-500/20" }
+    accent: { icon: "text-sky-300", tile: "bg-sky-500/10 ring-sky-500/20" }
   }
 ];
 var ExportModal = ({ formats, title, onClose }) => {
   const available = FORMATS.filter((f) => (formats ?? {})[f.key]);
   const filename = (title ?? "").replace(/[^a-z0-9]/gi, "-").toLowerCase();
   const [downloadingKey, setDownloadingKey] = useState11(null);
+  const panelRef = useRef10(null);
   const handleDownload = async (fmtKey, url, ext) => {
     if (downloadingKey) return;
     const downloadName = `${filename}${ext}`;
@@ -16536,55 +16558,120 @@ var ExportModal = ({ formats, title, onClose }) => {
       anchor.click();
       anchor.remove();
       window.URL.revokeObjectURL(objectUrl);
+      onClose();
     } catch {
-      window.open(href, "_blank", "noopener,noreferrer");
+      const popup = window.open(href, "_blank", "noopener,noreferrer");
+      if (popup) onClose();
     } finally {
       setDownloadingKey(null);
     }
   };
+  useEffect9(() => {
+    const onKey = (e) => {
+      if (e.key === "Escape") onClose();
+    };
+    document.addEventListener("keydown", onKey);
+    return () => document.removeEventListener("keydown", onKey);
+  }, [onClose]);
+  useEffect9(() => {
+    document.body.style.overflow = "hidden";
+    panelRef.current?.focus();
+    return () => {
+      document.body.style.overflow = "";
+    };
+  }, []);
   return createPortal(
-    /* @__PURE__ */ jsxs110("div", { className: "fixed inset-0 z-[100] flex items-center justify-center p-4", children: [
-      /* @__PURE__ */ jsx152("div", { className: "absolute inset-0 bg-black/70 backdrop-blur-sm", onClick: onClose }),
-      /* @__PURE__ */ jsxs110("div", { className: "relative z-10 bg-zinc-900 border border-zinc-800 rounded-2xl w-full max-w-sm p-6 shadow-2xl", children: [
-        /* @__PURE__ */ jsxs110("div", { className: "flex items-start justify-between mb-5", children: [
-          /* @__PURE__ */ jsxs110("div", { className: "min-w-0 pr-3", children: [
-            /* @__PURE__ */ jsx152("h3", { className: "text-sm font-semibold text-zinc-100", children: "Export Presentation" }),
-            /* @__PURE__ */ jsx152("p", { className: "text-xs text-zinc-500 mt-0.5 truncate", children: title })
-          ] }),
-          /* @__PURE__ */ jsx152("button", { onClick: onClose, className: "text-zinc-500 hover:text-zinc-200 transition-colors flex-shrink-0 mt-0.5", children: /* @__PURE__ */ jsx152(CloseIcon, {}) })
-        ] }),
-        /* @__PURE__ */ jsxs110("div", { className: "space-y-2.5", children: [
-          available.length === 0 && /* @__PURE__ */ jsx152("p", { className: "text-sm text-zinc-500 text-center py-6", children: "No formats available yet" }),
-          available.map((fmt) => {
-            const url = formats[fmt.key];
-            const isDownloading = downloadingKey === fmt.key;
-            return /* @__PURE__ */ jsxs110(
-              "button",
-              {
-                type: "button",
-                disabled: Boolean(downloadingKey),
-                onClick: () => handleDownload(fmt.key, url, fmt.ext),
-                className: cn(
-                  "flex w-full items-center gap-3.5 p-3.5 rounded-xl border transition-all text-left",
-                  "hover:brightness-110 disabled:opacity-60 disabled:cursor-not-allowed",
-                  fmt.accent.bg
-                ),
-                children: [
-                  /* @__PURE__ */ jsx152("span", { className: "text-xl flex-shrink-0", children: fmt.emoji }),
-                  /* @__PURE__ */ jsxs110("div", { className: "flex-1 min-w-0", children: [
-                    /* @__PURE__ */ jsx152("p", { className: cn("text-sm font-semibold", fmt.accent.text), children: isDownloading ? `Downloading ${fmt.label}...` : fmt.label }),
-                    /* @__PURE__ */ jsx152("p", { className: "text-xs text-zinc-500 mt-0.5 leading-relaxed", children: isDownloading ? "Please wait while the file is being prepared." : fmt.desc })
+    /* @__PURE__ */ jsxs110(
+      "div",
+      {
+        className: "fixed inset-0 z-[100] flex items-center justify-center p-4",
+        role: "dialog",
+        "aria-modal": "true",
+        "aria-labelledby": "pxe-export-title",
+        children: [
+          /* @__PURE__ */ jsx152("div", { className: "absolute inset-0 bg-black/70 backdrop-blur-sm", onClick: onClose }),
+          /* @__PURE__ */ jsxs110(
+            "div",
+            {
+              ref: panelRef,
+              tabIndex: -1,
+              className: "relative z-10 w-full max-w-md overflow-hidden rounded-2xl border border-zinc-800 bg-zinc-900 shadow-2xl outline-none",
+              children: [
+                /* @__PURE__ */ jsxs110("div", { className: "flex items-start gap-3 border-b border-zinc-800/80 px-5 py-4", children: [
+                  /* @__PURE__ */ jsx152("span", { className: "mt-0.5 flex h-8 w-8 flex-shrink-0 items-center justify-center rounded-lg bg-[#C0AE82]/10 text-[#DCC99B] ring-1 ring-[#C0AE82]/20", children: /* @__PURE__ */ jsx152(SlidesIcon, {}) }),
+                  /* @__PURE__ */ jsxs110("div", { className: "min-w-0 flex-1", children: [
+                    /* @__PURE__ */ jsx152("h3", { id: "pxe-export-title", className: "text-sm font-semibold text-zinc-100", children: "Export presentation" }),
+                    /* @__PURE__ */ jsx152("p", { className: "mt-0.5 truncate text-xs text-zinc-500", children: title })
                   ] }),
-                  /* @__PURE__ */ jsx152("span", { className: cn("flex-shrink-0", fmt.accent.text), children: /* @__PURE__ */ jsx152(DownloadIcon, {}) })
-                ]
-              },
-              fmt.key
-            );
-          })
-        ] }),
-        /* @__PURE__ */ jsx152("p", { className: "text-xs text-zinc-600 mt-4 text-center", children: "Download links expire in 90 days" })
-      ] })
-    ] }),
+                  /* @__PURE__ */ jsx152(
+                    "button",
+                    {
+                      onClick: onClose,
+                      "aria-label": "Close export dialog",
+                      className: "-mr-1 mt-0.5 flex h-7 w-7 flex-shrink-0 items-center justify-center rounded-lg text-zinc-500 transition-colors hover:bg-zinc-800 hover:text-zinc-200",
+                      children: /* @__PURE__ */ jsx152(CloseIcon, {})
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ jsx152("div", { className: "space-y-2 p-4", children: available.length === 0 ? /* @__PURE__ */ jsxs110("div", { className: "py-8 text-center", children: [
+                  /* @__PURE__ */ jsx152("p", { className: "text-sm text-zinc-400", children: "No formats available yet" }),
+                  /* @__PURE__ */ jsx152("p", { className: "mt-1 text-xs text-zinc-600", children: "Exports appear here once the deck finishes generating." })
+                ] }) : available.map((fmt) => {
+                  const url = formats[fmt.key];
+                  const isDownloading = downloadingKey === fmt.key;
+                  return /* @__PURE__ */ jsxs110(
+                    "button",
+                    {
+                      type: "button",
+                      disabled: Boolean(downloadingKey),
+                      onClick: () => handleDownload(fmt.key, url, fmt.ext),
+                      className: cn(
+                        "group flex w-full items-center gap-3 rounded-xl border border-zinc-800 bg-zinc-800/40 p-3 text-left transition-all",
+                        "hover:border-[#C0AE82]/40 hover:bg-zinc-800/70",
+                        "focus:outline-none focus-visible:ring-2 focus-visible:ring-[#C0AE82]/50",
+                        "disabled:cursor-not-allowed disabled:opacity-50 disabled:hover:border-zinc-800 disabled:hover:bg-zinc-800/40"
+                      ),
+                      children: [
+                        /* @__PURE__ */ jsx152(
+                          "span",
+                          {
+                            className: cn(
+                              "flex h-9 w-9 flex-shrink-0 items-center justify-center rounded-lg ring-1",
+                              fmt.accent.tile,
+                              fmt.accent.icon
+                            ),
+                            children: /* @__PURE__ */ jsx152(fmt.Icon, {})
+                          }
+                        ),
+                        /* @__PURE__ */ jsxs110("div", { className: "min-w-0 flex-1", children: [
+                          /* @__PURE__ */ jsxs110("div", { className: "flex items-center gap-2", children: [
+                            /* @__PURE__ */ jsx152("p", { className: "text-sm font-semibold text-zinc-100", children: fmt.label }),
+                            /* @__PURE__ */ jsx152("span", { className: "rounded bg-zinc-800 px-1.5 py-0.5 font-mono text-[10px] text-zinc-500 ring-1 ring-zinc-700/60", children: fmt.ext })
+                          ] }),
+                          /* @__PURE__ */ jsx152("p", { className: "mt-0.5 text-xs leading-relaxed text-zinc-500", children: isDownloading ? "Preparing your file\u2026" : fmt.desc })
+                        ] }),
+                        /* @__PURE__ */ jsx152(
+                          "span",
+                          {
+                            className: cn(
+                              "flex-shrink-0 transition-colors",
+                              isDownloading ? "text-[#DCC99B]" : "text-zinc-600 group-hover:text-[#DCC99B]"
+                            ),
+                            children: isDownloading ? /* @__PURE__ */ jsx152(Spinner2, {}) : /* @__PURE__ */ jsx152(DownloadIcon, {})
+                          }
+                        )
+                      ]
+                    },
+                    fmt.key
+                  );
+                }) }),
+                available.length > 0 && /* @__PURE__ */ jsx152("div", { className: "border-t border-zinc-800/80 px-5 py-3", children: /* @__PURE__ */ jsx152("p", { className: "text-center text-[11px] text-zinc-600", children: "Download links expire in 90 days" }) })
+              ]
+            }
+          )
+        ]
+      }
+    ),
     document.body
   );
 };
@@ -17738,6 +17825,7 @@ var PresentationJobCard = ({
 
 // src/molecules/generic/ResearchReportJobCard/ResearchReportJobCard.tsx
 import { useCallback as useCallback5, useEffect as useEffect10, useRef as useRef11, useState as useState12 } from "react";
+import { createPortal as createPortal2 } from "react-dom";
 import { Fragment as Fragment6, jsx as jsx153, jsxs as jsxs111 } from "react/jsx-runtime";
 var DEFAULT_THEME = {
   primary: "#C0AE82",
@@ -17824,17 +17912,19 @@ var REPORT_FORMATS = [
     key: "pdf",
     label: "PDF",
     ext: ".pdf",
-    emoji: "\u{1F4C4}",
+    Icon: PdfIcon,
     desc: "Print-ready, fixed layout \u2014 open in any PDF viewer",
-    accent: { text: "text-red-400", bg: "bg-red-500/10 border-red-500/20" }
+    // Hue lives on the icon tile only; the rows themselves stay neutral so
+    // stacked formats don't read as competing status colours.
+    accent: { icon: "text-red-300", tile: "bg-red-500/10 ring-red-500/20" }
   },
   {
     key: "html",
     label: "HTML",
     ext: ".html",
-    emoji: "\u{1F310}",
+    Icon: HtmlIcon,
     desc: "Interactive web page \u2014 download and open in a browser",
-    accent: { text: "text-sky-400", bg: "bg-sky-500/10 border-sky-500/20" }
+    accent: { icon: "text-sky-300", tile: "bg-sky-500/10 ring-sky-500/20" }
   }
 ];
 var ReportExportModal = ({ htmlUrl, pdfUrl, title, onClose }) => {
@@ -17842,6 +17932,7 @@ var ReportExportModal = ({ htmlUrl, pdfUrl, title, onClose }) => {
   const available = REPORT_FORMATS.filter((f) => urls[f.key]);
   const filename = (title ?? "").replace(/[^a-z0-9]/gi, "-").toLowerCase();
   const [downloadingKey, setDownloadingKey] = useState12(null);
+  const panelRef = useRef11(null);
   useEffect10(() => {
     const onKey = (e) => {
       if (e.key === "Escape") onClose();
@@ -17849,6 +17940,13 @@ var ReportExportModal = ({ htmlUrl, pdfUrl, title, onClose }) => {
     document.addEventListener("keydown", onKey);
     return () => document.removeEventListener("keydown", onKey);
   }, [onClose]);
+  useEffect10(() => {
+    document.body.style.overflow = "hidden";
+    panelRef.current?.focus();
+    return () => {
+      document.body.style.overflow = "";
+    };
+  }, []);
   const handleDownload = async (key, url, ext) => {
     if (downloadingKey) return;
     const downloadName = `${filename}${ext}`;
@@ -17866,53 +17964,107 @@ var ReportExportModal = ({ htmlUrl, pdfUrl, title, onClose }) => {
       anchor.click();
       anchor.remove();
       window.URL.revokeObjectURL(objectUrl);
+      onClose();
     } catch {
-      window.open(url, "_blank", "noopener,noreferrer");
+      const popup = window.open(url, "_blank", "noopener,noreferrer");
+      if (popup) onClose();
     } finally {
       setDownloadingKey(null);
     }
   };
-  return /* @__PURE__ */ jsxs111("div", { className: "fixed inset-0 z-50 flex items-center justify-center p-4", children: [
-    /* @__PURE__ */ jsx153("div", { className: "absolute inset-0 bg-black/70 backdrop-blur-sm", onClick: onClose }),
-    /* @__PURE__ */ jsxs111("div", { className: "relative z-10 bg-zinc-900 border border-zinc-800 rounded-2xl w-full max-w-sm p-6 shadow-2xl", children: [
-      /* @__PURE__ */ jsxs111("div", { className: "flex items-start justify-between mb-5", children: [
-        /* @__PURE__ */ jsxs111("div", { className: "min-w-0 pr-3", children: [
-          /* @__PURE__ */ jsx153("h3", { className: "text-sm font-semibold text-zinc-100", children: "Download report" }),
-          /* @__PURE__ */ jsx153("p", { className: "text-xs text-zinc-500 mt-0.5 truncate", children: title })
-        ] }),
-        /* @__PURE__ */ jsx153("button", { onClick: onClose, className: "text-zinc-500 hover:text-zinc-200 transition-colors flex-shrink-0 mt-0.5", children: /* @__PURE__ */ jsx153(CloseIcon, {}) })
-      ] }),
-      /* @__PURE__ */ jsxs111("div", { className: "space-y-2.5", children: [
-        available.length === 0 && /* @__PURE__ */ jsx153("p", { className: "text-sm text-zinc-500 text-center py-6", children: "No formats available yet" }),
-        available.map((fmt) => {
-          const url = urls[fmt.key];
-          const isDownloading = downloadingKey === fmt.key;
-          return /* @__PURE__ */ jsxs111(
-            "button",
+  return createPortal2(
+    /* @__PURE__ */ jsxs111(
+      "div",
+      {
+        className: "fixed inset-0 z-[100] flex items-center justify-center p-4",
+        role: "dialog",
+        "aria-modal": "true",
+        "aria-labelledby": "pxe-report-export-title",
+        children: [
+          /* @__PURE__ */ jsx153("div", { className: "absolute inset-0 bg-black/70 backdrop-blur-sm", onClick: onClose }),
+          /* @__PURE__ */ jsxs111(
+            "div",
             {
-              type: "button",
-              disabled: Boolean(downloadingKey),
-              onClick: () => handleDownload(fmt.key, url, fmt.ext),
-              className: cn(
-                "flex w-full items-center gap-3.5 p-3.5 rounded-xl border transition-all text-left",
-                "hover:brightness-110 disabled:opacity-60 disabled:cursor-not-allowed",
-                fmt.accent.bg
-              ),
+              ref: panelRef,
+              tabIndex: -1,
+              className: "relative z-10 w-full max-w-md overflow-hidden rounded-2xl border border-zinc-800 bg-zinc-900 shadow-2xl outline-none",
               children: [
-                /* @__PURE__ */ jsx153("span", { className: "text-xl flex-shrink-0", children: fmt.emoji }),
-                /* @__PURE__ */ jsxs111("div", { className: "flex-1 min-w-0", children: [
-                  /* @__PURE__ */ jsx153("p", { className: cn("text-sm font-semibold", fmt.accent.text), children: isDownloading ? `Downloading ${fmt.label}...` : fmt.label }),
-                  /* @__PURE__ */ jsx153("p", { className: "text-xs text-zinc-500 mt-0.5 leading-relaxed", children: isDownloading ? "Please wait while the file is being prepared." : fmt.desc })
+                /* @__PURE__ */ jsxs111("div", { className: "flex items-start gap-3 border-b border-zinc-800/80 px-5 py-4", children: [
+                  /* @__PURE__ */ jsx153("span", { className: "mt-0.5 flex h-8 w-8 flex-shrink-0 items-center justify-center rounded-lg bg-[#C0AE82]/10 text-[#DCC99B] ring-1 ring-[#C0AE82]/20", children: /* @__PURE__ */ jsx153(DocumentIcon, {}) }),
+                  /* @__PURE__ */ jsxs111("div", { className: "min-w-0 flex-1", children: [
+                    /* @__PURE__ */ jsx153("h3", { id: "pxe-report-export-title", className: "text-sm font-semibold text-zinc-100", children: "Download report" }),
+                    /* @__PURE__ */ jsx153("p", { className: "mt-0.5 truncate text-xs text-zinc-500", children: title })
+                  ] }),
+                  /* @__PURE__ */ jsx153(
+                    "button",
+                    {
+                      onClick: onClose,
+                      "aria-label": "Close download dialog",
+                      className: "-mr-1 mt-0.5 flex h-7 w-7 flex-shrink-0 items-center justify-center rounded-lg text-zinc-500 transition-colors hover:bg-zinc-800 hover:text-zinc-200",
+                      children: /* @__PURE__ */ jsx153(CloseIcon, {})
+                    }
+                  )
                 ] }),
-                /* @__PURE__ */ jsx153("span", { className: cn("flex-shrink-0", fmt.accent.text), children: /* @__PURE__ */ jsx153(DownloadIcon, {}) })
+                /* @__PURE__ */ jsx153("div", { className: "space-y-2 p-4", children: available.length === 0 ? /* @__PURE__ */ jsxs111("div", { className: "py-8 text-center", children: [
+                  /* @__PURE__ */ jsx153("p", { className: "text-sm text-zinc-400", children: "No formats available yet" }),
+                  /* @__PURE__ */ jsx153("p", { className: "mt-1 text-xs text-zinc-600", children: "Downloads appear here once the report finishes generating." })
+                ] }) : available.map((fmt) => {
+                  const url = urls[fmt.key];
+                  const isDownloading = downloadingKey === fmt.key;
+                  return /* @__PURE__ */ jsxs111(
+                    "button",
+                    {
+                      type: "button",
+                      disabled: Boolean(downloadingKey),
+                      onClick: () => handleDownload(fmt.key, url, fmt.ext),
+                      className: cn(
+                        "group flex w-full items-center gap-3 rounded-xl border border-zinc-800 bg-zinc-800/40 p-3 text-left transition-all",
+                        "hover:border-[#C0AE82]/40 hover:bg-zinc-800/70",
+                        "focus:outline-none focus-visible:ring-2 focus-visible:ring-[#C0AE82]/50",
+                        "disabled:cursor-not-allowed disabled:opacity-50 disabled:hover:border-zinc-800 disabled:hover:bg-zinc-800/40"
+                      ),
+                      children: [
+                        /* @__PURE__ */ jsx153(
+                          "span",
+                          {
+                            className: cn(
+                              "flex h-9 w-9 flex-shrink-0 items-center justify-center rounded-lg ring-1",
+                              fmt.accent.tile,
+                              fmt.accent.icon
+                            ),
+                            children: /* @__PURE__ */ jsx153(fmt.Icon, {})
+                          }
+                        ),
+                        /* @__PURE__ */ jsxs111("div", { className: "min-w-0 flex-1", children: [
+                          /* @__PURE__ */ jsxs111("div", { className: "flex items-center gap-2", children: [
+                            /* @__PURE__ */ jsx153("p", { className: "text-sm font-semibold text-zinc-100", children: fmt.label }),
+                            /* @__PURE__ */ jsx153("span", { className: "rounded bg-zinc-800 px-1.5 py-0.5 font-mono text-[10px] text-zinc-500 ring-1 ring-zinc-700/60", children: fmt.ext })
+                          ] }),
+                          /* @__PURE__ */ jsx153("p", { className: "mt-0.5 text-xs leading-relaxed text-zinc-500", children: isDownloading ? "Preparing your file\u2026" : fmt.desc })
+                        ] }),
+                        /* @__PURE__ */ jsx153(
+                          "span",
+                          {
+                            className: cn(
+                              "flex-shrink-0 transition-colors",
+                              isDownloading ? "text-[#DCC99B]" : "text-zinc-600 group-hover:text-[#DCC99B]"
+                            ),
+                            children: isDownloading ? /* @__PURE__ */ jsx153(Spinner2, {}) : /* @__PURE__ */ jsx153(DownloadIcon, {})
+                          }
+                        )
+                      ]
+                    },
+                    fmt.key
+                  );
+                }) })
               ]
-            },
-            fmt.key
-          );
-        })
-      ] })
-    ] })
-  ] });
+            }
+          )
+        ]
+      }
+    ),
+    document.body
+  );
 };
 function deriveJobStatusUrl2(newJobId, pollUrl, regenerateUrl) {
   const base = pollUrl?.replace(/\/api\/jobs\/[^/]+\/status.*$/, "") ?? regenerateUrl?.replace(/\/api\/reports\/[^/]+\/regenerate.*$/, "") ?? "";