@servantcdh/ez-planet-cosmos 0.2.0 → 0.2.1

package/dist/index.js

@@ -1,22 +1,22 @@
-import { jsxs as p, jsx as t, Fragment as St } from "react/jsx-runtime";
-import { memo as Q, useRef as E, useMemo as D, useState as R, useCallback as v, useEffect as It } from "react";
-import { Handle as q, Position as V, getBezierPath as wt, BaseEdge as Z, ReactFlowProvider as xt, useReactFlow as kt, useNodesState as Bt, useEdgesState as Tt, ReactFlow as $t, Background as zt, BackgroundVariant as Ft, Controls as Lt, MiniMap as Dt } from "@xyflow/react";
-import { motion as N, AnimatePresence as M } from "framer-motion";
-import { Canvas as Mt, useFrame as Y } from "@react-three/fiber";
-import { Points as tt, PointMaterial as et } from "@react-three/drei";
-function Wt({ data: e }) {
-  const { label: m, subtitle: d, color: l, status: n, isSelected: s } = e, u = s ? 35 : n === "running" ? 30 : n === "error" ? 20 : 15, o = n === "running" ? [1, 1.08, 1] : [1, 1.02, 1], P = s ? 110 : 100;
+import { jsxs as p, jsx as t, Fragment as Bt } from "react/jsx-runtime";
+import { memo as ot, useRef as K, useMemo as R, useState as _, useCallback as v, useEffect as at } from "react";
+import { Handle as tt, Position as et, getBezierPath as zt, BaseEdge as it, ReactFlowProvider as $t, useReactFlow as Lt, useNodesState as Mt, useEdgesState as Ft, ReactFlow as Dt, Background as Tt, BackgroundVariant as Wt, Controls as At, MiniMap as Rt } from "@xyflow/react";
+import { motion as w, AnimatePresence as E } from "framer-motion";
+import { Canvas as Et, useFrame as nt } from "@react-three/fiber";
+import { Points as rt, PointMaterial as lt } from "@react-three/drei";
+function Ot({ data: e }) {
+  const { label: h, subtitle: u, color: l, status: o, isSelected: n } = e, c = n ? 35 : o === "running" ? 30 : o === "error" ? 20 : 15, d = o === "running" ? [1, 1.08, 1] : [1, 1.02, 1], y = n ? 110 : 100;
   return /* @__PURE__ */ p("div", { style: { position: "relative", cursor: "pointer" }, children: [
     /* @__PURE__ */ t(
-      q,
+      tt,
       {
         type: "target",
-        position: V.Left,
+        position: et.Left,
         style: { background: l, border: "none", width: 8, height: 8, opacity: 0.6 }
       }
     ),
-    s && /* @__PURE__ */ t(
-      N.div,
+    n && /* @__PURE__ */ t(
+      w.div,
       {
         initial: { scale: 0.8, opacity: 0 },
         animate: { scale: 1, opacity: 1, rotate: 360 },
@@ -28,8 +28,8 @@ function Wt({ data: e }) {
           position: "absolute",
           top: -12,
           left: -12,
-          width: P + 24,
-          height: P + 24,
+          width: y + 24,
+          height: y + 24,
           borderRadius: "50%",
           border: `1.5px dashed ${l}88`,
           pointerEvents: "none"
@@ -37,24 +37,24 @@ function Wt({ data: e }) {
       }
     ),
     /* @__PURE__ */ p(
-      N.div,
+      w.div,
       {
-        animate: { scale: o },
+        animate: { scale: d },
         transition: { duration: 3, repeat: 1 / 0, ease: "easeInOut" },
         whileHover: {
-          boxShadow: `0 0 ${u + 15}px ${l}aa, inset 0 0 25px rgba(255,255,255,0.15)`
+          boxShadow: `0 0 ${c + 15}px ${l}aa, inset 0 0 25px rgba(255,255,255,0.15)`
         },
         style: {
-          width: P,
-          height: P,
+          width: y,
+          height: y,
           borderRadius: "50%",
           background: `radial-gradient(circle at 35% 35%, ${l}cc, ${l}44)`,
-          boxShadow: `0 0 ${u}px ${l}88, inset 0 0 20px rgba(255,255,255,0.1)`,
+          boxShadow: `0 0 ${c}px ${l}88, inset 0 0 20px rgba(255,255,255,0.1)`,
           display: "flex",
           flexDirection: "column",
           alignItems: "center",
           justifyContent: "center",
-          border: `2px solid ${s ? `${l}aa` : `${l}66`}`,
+          border: `2px solid ${n ? `${l}aa` : `${l}66`}`,
           transition: "width 0.3s, height 0.3s, border-color 0.3s"
         },
         children: [
@@ -68,15 +68,15 @@ function Wt({ data: e }) {
                 letterSpacing: 1,
                 textShadow: "0 1px 4px rgba(0,0,0,0.8)"
               },
-              children: m
+              children: h
             }
           ),
-          /* @__PURE__ */ t("span", { style: { color: "rgba(255,255,255,0.7)", fontSize: 10, marginTop: 2 }, children: d })
+          /* @__PURE__ */ t("span", { style: { color: "rgba(255,255,255,0.7)", fontSize: 10, marginTop: 2 }, children: u })
         ]
       }
     ),
-    n !== "idle" && n !== "disabled" && /* @__PURE__ */ t(
-      N.div,
+    o !== "idle" && o !== "disabled" && /* @__PURE__ */ t(
+      w.div,
       {
         animate: { opacity: [0.5, 1, 0.5] },
         transition: { duration: 1.5, repeat: 1 / 0 },
@@ -87,13 +87,13 @@ function Wt({ data: e }) {
           width: 14,
           height: 14,
           borderRadius: "50%",
-          background: n === "running" ? "#2ecc71" : n === "error" ? "#e74c3c" : "#27ae60",
+          background: o === "running" ? "#2ecc71" : o === "error" ? "#e74c3c" : "#27ae60",
           border: "2px solid rgba(0,0,0,0.4)"
         }
       }
     ),
-    s && /* @__PURE__ */ t(
-      N.div,
+    n && /* @__PURE__ */ t(
+      w.div,
       {
         initial: { opacity: 0, y: 8 },
         animate: { opacity: 0.5, y: 0 },
@@ -112,65 +112,65 @@ function Wt({ data: e }) {
       }
     ),
     /* @__PURE__ */ t(
-      q,
+      tt,
       {
         type: "source",
-        position: V.Right,
+        position: et.Right,
         style: { background: l, border: "none", width: 8, height: 8, opacity: 0.6 }
       }
     )
   ] });
 }
-const At = Q(Wt);
-function Rt({
+const _t = ot(Ot);
+function Gt({
   id: e,
-  sourceX: m,
-  sourceY: d,
+  sourceX: h,
+  sourceY: u,
   targetX: l,
-  targetY: n,
-  sourcePosition: s,
-  targetPosition: u,
-  data: o,
-  style: P = {}
+  targetY: o,
+  sourcePosition: n,
+  targetPosition: c,
+  data: d,
+  style: y = {}
 }) {
-  const [r] = wt({
-    sourceX: m,
-    sourceY: d,
-    sourcePosition: s,
+  const [m] = zt({
+    sourceX: h,
+    sourceY: u,
+    sourcePosition: n,
     targetX: l,
-    targetY: n,
-    targetPosition: u
-  }), h = (o == null ? void 0 : o.isActive) ?? !1, f = (o == null ? void 0 : o.isDimmed) ?? !1, k = h ? "rgba(46, 204, 113, 0.25)" : "rgba(100, 149, 237, 0.15)", w = h ? "rgba(46, 204, 113, 0.7)" : f ? "rgba(100, 149, 237, 0.12)" : "rgba(100, 149, 237, 0.4)", a = h ? 3 : 2, $ = h ? "12 4" : "8 4";
-  return /* @__PURE__ */ p(St, { children: [
+    targetY: o,
+    targetPosition: c
+  }), b = (d == null ? void 0 : d.isActive) ?? !1, C = (d == null ? void 0 : d.isDimmed) ?? !1, M = b ? "rgba(46, 204, 113, 0.25)" : "rgba(100, 149, 237, 0.15)", $ = b ? "rgba(46, 204, 113, 0.7)" : C ? "rgba(100, 149, 237, 0.12)" : "rgba(100, 149, 237, 0.4)", r = b ? 3 : 2, I = b ? "12 4" : "8 4";
+  return /* @__PURE__ */ p(Bt, { children: [
     /* @__PURE__ */ t(
-      Z,
+      it,
       {
         id: `${e}-glow`,
-        path: r,
+        path: m,
         style: {
-          stroke: k,
-          strokeWidth: h ? 10 : 6,
-          filter: `blur(${h ? 5 : 3}px)`,
+          stroke: M,
+          strokeWidth: b ? 10 : 6,
+          filter: `blur(${b ? 5 : 3}px)`,
           transition: "stroke 0.6s, stroke-width 0.6s",
-          ...P
+          ...y
         }
       }
     ),
     /* @__PURE__ */ t(
-      Z,
+      it,
       {
         id: e,
-        path: r,
+        path: m,
         style: {
-          stroke: w,
-          strokeWidth: a,
-          strokeDasharray: $,
+          stroke: $,
+          strokeWidth: r,
+          strokeDasharray: I,
           transition: "stroke 0.6s, stroke-width 0.6s",
-          ...P
+          ...y
         }
       }
     ),
-    (o == null ? void 0 : o.label) && /* @__PURE__ */ t("text", { children: /* @__PURE__ */ t(
+    (d == null ? void 0 : d.label) && /* @__PURE__ */ t("text", { children: /* @__PURE__ */ t(
       "textPath",
       {
         href: `#${e}`,
@@ -181,23 +181,23 @@ function Rt({
           fill: "rgba(255, 255, 255, 0.4)",
           fontFamily: "monospace"
         },
-        children: o.label
+        children: d.label
       }
     ) })
   ] });
 }
-const Ot = Q(Rt);
-function Et({ config: e }) {
-  const m = E(null), d = e.starCount ?? 2e3, l = e.rotationSpeed ?? 0.02, n = D(() => {
-    const s = new Float32Array(d * 3);
-    for (let u = 0; u < d; u++)
-      s[u * 3] = (Math.random() - 0.5) * 50, s[u * 3 + 1] = (Math.random() - 0.5) * 50, s[u * 3 + 2] = (Math.random() - 0.5) * 50;
-    return s;
-  }, [d]);
-  return Y((s, u) => {
-    m.current && (m.current.rotation.x -= u * l, m.current.rotation.y -= u * (l * 0.5));
-  }), /* @__PURE__ */ t(tt, { ref: m, positions: n, stride: 3, frustumCulled: !1, children: /* @__PURE__ */ t(
-    et,
+const Ht = ot(Gt);
+function Jt({ config: e }) {
+  const h = K(null), u = e.starCount ?? 2e3, l = e.rotationSpeed ?? 0.02, o = R(() => {
+    const n = new Float32Array(u * 3);
+    for (let c = 0; c < u; c++)
+      n[c * 3] = (Math.random() - 0.5) * 50, n[c * 3 + 1] = (Math.random() - 0.5) * 50, n[c * 3 + 2] = (Math.random() - 0.5) * 50;
+    return n;
+  }, [u]);
+  return nt((n, c) => {
+    h.current && (h.current.rotation.x -= c * l, h.current.rotation.y -= c * (l * 0.5));
+  }), /* @__PURE__ */ t(rt, { ref: h, positions: o, stride: 3, frustumCulled: !1, children: /* @__PURE__ */ t(
+    lt,
     {
       transparent: !0,
       color: e.starColor ?? "#6495ed",
@@ -208,19 +208,19 @@ function Et({ config: e }) {
     }
   ) });
 }
-function Gt({ config: e }) {
-  const m = E(null), d = e.nebulaCount ?? 500, l = D(() => {
-    const n = new Float32Array(d * 3);
-    for (let s = 0; s < d; s++) {
-      const u = Math.random() * Math.PI * 2, o = Math.random() * 8 + 5;
-      n[s * 3] = Math.cos(u) * o + (Math.random() - 0.5) * 3, n[s * 3 + 1] = (Math.random() - 0.5) * 4, n[s * 3 + 2] = Math.sin(u) * o + (Math.random() - 0.5) * 3 - 15;
+function Kt({ config: e }) {
+  const h = K(null), u = e.nebulaCount ?? 500, l = R(() => {
+    const o = new Float32Array(u * 3);
+    for (let n = 0; n < u; n++) {
+      const c = Math.random() * Math.PI * 2, d = Math.random() * 8 + 5;
+      o[n * 3] = Math.cos(c) * d + (Math.random() - 0.5) * 3, o[n * 3 + 1] = (Math.random() - 0.5) * 4, o[n * 3 + 2] = Math.sin(c) * d + (Math.random() - 0.5) * 3 - 15;
     }
-    return n;
-  }, [d]);
-  return Y((n, s) => {
-    m.current && (m.current.rotation.y += s * 5e-3);
-  }), /* @__PURE__ */ t(tt, { ref: m, positions: l, stride: 3, frustumCulled: !1, children: /* @__PURE__ */ t(
-    et,
+    return o;
+  }, [u]);
+  return nt((o, n) => {
+    h.current && (h.current.rotation.y += n * 5e-3);
+  }), /* @__PURE__ */ t(rt, { ref: h, positions: l, stride: 3, frustumCulled: !1, children: /* @__PURE__ */ t(
+    lt,
     {
       transparent: !0,
       color: e.nebulaColor ?? "#9b59b6",
@@ -231,81 +231,80 @@ function Gt({ config: e }) {
     }
   ) });
 }
-function Jt({ config: e = {}, background: m }) {
+function Ut({ config: e = {}, background: h }) {
   return /* @__PURE__ */ p(
-    Mt,
+    Et,
     {
       camera: { position: [0, 0, 15], fov: 60 },
-      style: { background: m ?? "radial-gradient(ellipse at center, #0a0a2e 0%, #000008 100%)", pointerEvents: "none" },
+      style: { background: h ?? "radial-gradient(ellipse at center, #0a0a2e 0%, #000008 100%)", pointerEvents: "none" },
       events: () => ({ enabled: !1, priority: 0, compute: () => {
       } }),
       children: [
         /* @__PURE__ */ t("ambientLight", { intensity: 0.1 }),
-        /* @__PURE__ */ t(Et, { config: e }),
-        /* @__PURE__ */ t(Gt, { config: e })
+        /* @__PURE__ */ t(Jt, { config: e }),
+        /* @__PURE__ */ t(Kt, { config: e })
       ]
     }
   );
 }
-const Ut = "cc-root-eSR-1", jt = "cc-layerStarField-jOb4M", Ht = "cc-layerReactFlow-CeHI9", Xt = "cc-sidePanel-PzU72", _t = "cc-sidePanelHeader-cWPCq", Kt = "cc-sidePanelTitle-Yfh5N", qt = "cc-sidePanelPlanetIcon-aRuLt", Vt = "cc-sidePanelName-TFFeE", Zt = "cc-sidePanelSubtitle-8fp2Y", Qt = "cc-sidePanelClose-Sdg-J", Yt = "cc-sidePanelContent-QIEEQ", te = "cc-sidePanelFooter-DVOHi", ee = "cc-satelliteList--vkXn", ie = "cc-satelliteItem-JGdmG", oe = "cc-satelliteIcon-arUe3", ae = "cc-satelliteInfo-NaKLd", ne = "cc-satelliteName-zfOPN", re = "cc-satelliteSummary-XARVm", le = "cc-enterButton-5Vnri", se = "cc-zoomTransition-Wcju8", ce = "cc-zoomPlanetLabel-3SJT2", de = "cc-planetInterior-GlnW1", ue = "cc-interiorBackButton-qJAiZ", me = "cc-interiorCenter-xdKsX", pe = "cc-interiorPlanet--XIzf", ye = "cc-interiorPlanetLabel-e7yxq", be = "cc-interiorPlanetSubtitle-e2vON", he = "cc-orbitRing-hbvmD", fe = "cc-satelliteNode-01STS", ge = "cc-satelliteNodeIcon-Xq45f", ve = "cc-satelliteNodeLabel-LLOJ5", Ne = "cc-satelliteNodeBadge-HsUFp", Pe = "cc-tutorialOverlay-3GHo7", Ce = "cc-tutorialWelcome-21KDP", Se = "cc-tutorialWelcomeTitle-7GwS9", Ie = "cc-tutorialWelcomeDesc--pznv", we = "cc-tutorialActions-szJ0-", xe = "cc-tutorialButton-wL9-p", ke = "cc-tutorialCard-LGIkK", Be = "cc-tutorialChip-bUoEb", Te = "cc-tutorialCardTitle-r2Y1I", $e = "cc-tutorialCardDesc-nOS-M", ze = "cc-tutorialProgress-wIAT9", Fe = "cc-tutorialProgressBar-PFBdE", Le = "cc-tutorialCardFooter-bSdyM", De = "cc-tutorialStepCounter-i7c5G", Me = "cc-tutorialDots-8M0QU", We = "cc-tutorialDot-518t4", Ae = "cc-topBarSlot-EJGvM", i = {
-  root: Ut,
+const Vt = "cc-root-eSR-1", jt = "cc-layerStarField-jOb4M", Xt = "cc-layerReactFlow-CeHI9", qt = "cc-sidePanel-PzU72", Zt = "cc-sidePanelHeader-cWPCq", Qt = "cc-sidePanelTitle-Yfh5N", Yt = "cc-sidePanelPlanetIcon-aRuLt", te = "cc-sidePanelName-TFFeE", ee = "cc-sidePanelSubtitle-8fp2Y", ie = "cc-sidePanelClose-Sdg-J", oe = "cc-sidePanelContent-QIEEQ", ae = "cc-sidePanelFooter-DVOHi", ne = "cc-satelliteList--vkXn", re = "cc-satelliteItem-JGdmG", le = "cc-satelliteIcon-arUe3", se = "cc-satelliteInfo-NaKLd", ce = "cc-satelliteName-zfOPN", de = "cc-satelliteSummary-XARVm", ue = "cc-enterButton-5Vnri", me = "cc-zoomTransition-Wcju8", pe = "cc-zoomPlanetLabel-3SJT2", he = "cc-planetInterior-GlnW1", ye = "cc-interiorBackButton-qJAiZ", be = "cc-interiorCenter-xdKsX", ge = "cc-interiorPlanet--XIzf", fe = "cc-interiorPlanetLabel-e7yxq", ve = "cc-interiorPlanetSubtitle-e2vON", Ne = "cc-orbitRing-hbvmD", Pe = "cc-satelliteNode-01STS", we = "cc-satelliteNodeIcon-Xq45f", xe = "cc-satelliteNodeLabel-LLOJ5", Ce = "cc-satelliteNodeBadge-HsUFp", Ie = "cc-tutorialOverlay-3GHo7", ke = "cc-tutorialWelcome-21KDP", Se = "cc-tutorialWelcomeTitle-7GwS9", Be = "cc-tutorialWelcomeDesc--pznv", ze = "cc-tutorialActions-szJ0-", $e = "cc-tutorialButton-wL9-p", Le = "cc-tutorialCard-LGIkK", Me = "cc-tutorialChip-bUoEb", Fe = "cc-tutorialCardTitle-r2Y1I", De = "cc-tutorialCardDesc-nOS-M", Te = "cc-tutorialProgress-wIAT9", We = "cc-tutorialProgressBar-PFBdE", Ae = "cc-tutorialCardFooter-bSdyM", Re = "cc-tutorialDots-8M0QU", Ee = "cc-tutorialDot-518t4", Oe = "cc-topBarSlot-EJGvM", i = {
+  root: Vt,
   layerStarField: jt,
-  layerReactFlow: Ht,
-  sidePanel: Xt,
-  sidePanelHeader: _t,
-  sidePanelTitle: Kt,
-  sidePanelPlanetIcon: qt,
-  sidePanelName: Vt,
-  sidePanelSubtitle: Zt,
-  sidePanelClose: Qt,
-  sidePanelContent: Yt,
-  sidePanelFooter: te,
-  satelliteList: ee,
-  satelliteItem: ie,
-  satelliteIcon: oe,
-  satelliteInfo: ae,
-  satelliteName: ne,
-  satelliteSummary: re,
-  enterButton: le,
-  zoomTransition: se,
-  zoomPlanetLabel: ce,
-  planetInterior: de,
-  interiorBackButton: ue,
-  interiorCenter: me,
-  interiorPlanet: pe,
-  interiorPlanetLabel: ye,
-  interiorPlanetSubtitle: be,
-  orbitRing: he,
-  satelliteNode: fe,
-  satelliteNodeIcon: ge,
-  satelliteNodeLabel: ve,
-  satelliteNodeBadge: Ne,
-  tutorialOverlay: Pe,
-  tutorialWelcome: Ce,
+  layerReactFlow: Xt,
+  sidePanel: qt,
+  sidePanelHeader: Zt,
+  sidePanelTitle: Qt,
+  sidePanelPlanetIcon: Yt,
+  sidePanelName: te,
+  sidePanelSubtitle: ee,
+  sidePanelClose: ie,
+  sidePanelContent: oe,
+  sidePanelFooter: ae,
+  satelliteList: ne,
+  satelliteItem: re,
+  satelliteIcon: le,
+  satelliteInfo: se,
+  satelliteName: ce,
+  satelliteSummary: de,
+  enterButton: ue,
+  zoomTransition: me,
+  zoomPlanetLabel: pe,
+  planetInterior: he,
+  interiorBackButton: ye,
+  interiorCenter: be,
+  interiorPlanet: ge,
+  interiorPlanetLabel: fe,
+  interiorPlanetSubtitle: ve,
+  orbitRing: Ne,
+  satelliteNode: Pe,
+  satelliteNodeIcon: we,
+  satelliteNodeLabel: xe,
+  satelliteNodeBadge: Ce,
+  tutorialOverlay: Ie,
+  tutorialWelcome: ke,
   tutorialWelcomeTitle: Se,
-  tutorialWelcomeDesc: Ie,
-  tutorialActions: we,
-  tutorialButton: xe,
-  tutorialCard: ke,
-  tutorialChip: Be,
-  tutorialCardTitle: Te,
-  tutorialCardDesc: $e,
-  tutorialProgress: ze,
-  tutorialProgressBar: Fe,
-  tutorialCardFooter: Le,
-  tutorialStepCounter: De,
-  tutorialDots: Me,
-  tutorialDot: We,
-  topBarSlot: Ae
+  tutorialWelcomeDesc: Be,
+  tutorialActions: ze,
+  tutorialButton: $e,
+  tutorialCard: Le,
+  tutorialChip: Me,
+  tutorialCardTitle: Fe,
+  tutorialCardDesc: De,
+  tutorialProgress: Te,
+  tutorialProgressBar: We,
+  tutorialCardFooter: Ae,
+  tutorialDots: Re,
+  tutorialDot: Ee,
+  topBarSlot: Oe
 };
-function Re({
+function _e({
   planet: e,
-  onClose: m,
-  onEnterPlanet: d,
+  onClose: h,
+  onEnterPlanet: u,
   onSatelliteClick: l
 }) {
   return /* @__PURE__ */ p(
-    N.div,
+    w.div,
     {
       className: i.sidePanel,
       initial: { x: 340 },
@@ -334,37 +333,37 @@ function Re({
               /* @__PURE__ */ t("div", { className: i.sidePanelSubtitle, children: e.subtitle })
             ] })
           ] }),
-          /* @__PURE__ */ t("button", { className: i.sidePanelClose, onClick: m, children: "✕" })
+          /* @__PURE__ */ t("button", { className: i.sidePanelClose, onClick: h, children: "✕" })
         ] }),
-        /* @__PURE__ */ t("div", { className: i.sidePanelContent, children: /* @__PURE__ */ t("div", { className: i.satelliteList, children: e.satellites.map((n) => /* @__PURE__ */ p(
+        /* @__PURE__ */ t("div", { className: i.sidePanelContent, children: /* @__PURE__ */ t("div", { className: i.satelliteList, children: e.satellites.map((o) => /* @__PURE__ */ p(
           "div",
           {
             className: i.satelliteItem,
             onClick: () => l == null ? void 0 : l({
               planetId: e.id,
-              satelliteId: n.id,
-              satellite: n
+              satelliteId: o.id,
+              satellite: o
             }),
             children: [
-              /* @__PURE__ */ t("div", { className: i.satelliteIcon, children: n.icon ?? "●" }),
+              /* @__PURE__ */ t("div", { className: i.satelliteIcon, children: o.icon ?? "●" }),
               /* @__PURE__ */ p("div", { className: i.satelliteInfo, children: [
-                /* @__PURE__ */ t("div", { className: i.satelliteName, children: n.label }),
-                n.summary && /* @__PURE__ */ p("div", { className: i.satelliteSummary, children: [
-                  n.summary.total != null && `${n.summary.total} total`,
-                  n.summary.running != null && ` · ${n.summary.running} running`,
-                  n.summary.failed != null && n.summary.failed > 0 && ` · ${n.summary.failed} failed`
+                /* @__PURE__ */ t("div", { className: i.satelliteName, children: o.label }),
+                o.summary && /* @__PURE__ */ p("div", { className: i.satelliteSummary, children: [
+                  o.summary.total != null && `${o.summary.total} total`,
+                  o.summary.running != null && ` · ${o.summary.running} running`,
+                  o.summary.failed != null && o.summary.failed > 0 && ` · ${o.summary.failed} failed`
                 ] })
               ] })
             ]
           },
-          n.id
+          o.id
         )) }) }),
         /* @__PURE__ */ t("div", { className: i.sidePanelFooter, children: /* @__PURE__ */ p(
           "button",
           {
             className: i.enterButton,
             style: { borderColor: `${e.color}44` },
-            onClick: d,
+            onClick: u,
             children: [
               "Enter ",
               e.label
@@ -375,39 +374,39 @@ function Re({
     }
   );
 }
-function Oe({
+function Ge({
   planet: e,
-  onExit: m,
-  onSatelliteClick: d,
+  onExit: h,
+  onSatelliteClick: u,
   renderCustom: l
 }) {
-  const [n, s] = R(null);
+  const [o, n] = _(null);
   if (l)
     return /* @__PURE__ */ t(
-      N.div,
+      w.div,
       {
         className: i.planetInterior,
         initial: { opacity: 0 },
         animate: { opacity: 1 },
         exit: { opacity: 0 },
         transition: { duration: 0.4 },
-        children: l(e, m)
+        children: l(e, h)
       }
     );
-  const u = e.satellites, o = Math.max(180, u.length * 35), P = v(
-    (r) => {
-      s(r);
-      const h = u.find((f) => f.id === r);
-      d == null || d({
+  const c = e.satellites, d = Math.max(180, c.length * 35), y = v(
+    (m) => {
+      n(m);
+      const b = c.find((C) => C.id === m);
+      u == null || u({
         planetId: e.id,
-        satelliteId: r,
-        satellite: h
+        satelliteId: m,
+        satellite: b
       });
     },
-    [e.id, u, d]
+    [e.id, c, u]
   );
   return /* @__PURE__ */ p(
-    N.div,
+    w.div,
     {
       className: i.planetInterior,
       initial: { opacity: 0 },
@@ -415,20 +414,20 @@ function Oe({
       exit: { opacity: 0 },
       transition: { duration: 0.4 },
       children: [
-        /* @__PURE__ */ t("button", { className: i.interiorBackButton, onClick: m, children: "← Back to Universe" }),
+        /* @__PURE__ */ t("button", { className: i.interiorBackButton, onClick: h, children: "← Back to Universe" }),
         /* @__PURE__ */ p("div", { className: i.interiorCenter, children: [
-          [1, 2, 3].map((r) => /* @__PURE__ */ t(
+          [1, 2, 3].map((m) => /* @__PURE__ */ t(
             "div",
             {
               className: i.orbitRing,
               style: {
-                width: o * r * 0.7,
-                height: o * r * 0.7,
-                top: `calc(50% - ${o * r * 0.7 / 2}px)`,
-                left: `calc(50% - ${o * r * 0.7 / 2}px)`
+                width: d * m * 0.7,
+                height: d * m * 0.7,
+                top: `calc(50% - ${d * m * 0.7 / 2}px)`,
+                left: `calc(50% - ${d * m * 0.7 / 2}px)`
               }
             },
-            r
+            m
           )),
           /* @__PURE__ */ p(
             "div",
@@ -444,11 +443,11 @@ function Oe({
               ]
             }
           ),
-          /* @__PURE__ */ t(M, { children: u.map((r, h) => {
-            var a;
-            const f = h / u.length * Math.PI * 2 - Math.PI / 2, k = Math.cos(f) * o, w = Math.sin(f) * o;
+          /* @__PURE__ */ t(E, { children: c.map((m, b) => {
+            var r;
+            const C = b / c.length * Math.PI * 2 - Math.PI / 2, M = Math.cos(C) * d, $ = Math.sin(C) * d;
             return /* @__PURE__ */ p(
-              N.div,
+              w.div,
               {
                 className: i.satelliteNode,
                 initial: { scale: 0, opacity: 0 },
@@ -457,32 +456,32 @@ function Oe({
                   type: "spring",
                   damping: 15,
                   stiffness: 200,
-                  delay: h * 0.08
+                  delay: b * 0.08
                 },
                 style: {
-                  left: `calc(50% + ${k}px - 32px)`,
-                  top: `calc(50% + ${w}px - 40px)`
+                  left: `calc(50% + ${M}px - 32px)`,
+                  top: `calc(50% + ${$}px - 40px)`
                 },
-                onClick: () => P(r.id),
+                onClick: () => y(m.id),
                 children: [
                   /* @__PURE__ */ p(
                     "div",
                     {
                       className: i.satelliteNodeIcon,
                       style: {
-                        borderColor: n === r.id ? `${e.color}88` : "rgba(255,255,255,0.15)",
-                        boxShadow: n === r.id ? `0 0 20px ${e.color}44` : "none"
+                        borderColor: o === m.id ? `${e.color}88` : "rgba(255,255,255,0.15)",
+                        boxShadow: o === m.id ? `0 0 20px ${e.color}44` : "none"
                       },
                       children: [
-                        r.icon ?? "●",
-                        ((a = r.summary) == null ? void 0 : a.running) != null && r.summary.running > 0 && /* @__PURE__ */ t("span", { className: i.satelliteNodeBadge, children: r.summary.running })
+                        m.icon ?? "●",
+                        ((r = m.summary) == null ? void 0 : r.running) != null && m.summary.running > 0 && /* @__PURE__ */ t("span", { className: i.satelliteNodeBadge, children: m.summary.running })
                       ]
                     }
                   ),
-                  /* @__PURE__ */ t("span", { className: i.satelliteNodeLabel, children: r.label })
+                  /* @__PURE__ */ t("span", { className: i.satelliteNodeLabel, children: m.label })
                 ]
               },
-              r.id
+              m.id
             );
           }) })
         ] })
@@ -490,9 +489,9 @@ function Oe({
     }
   );
 }
-function Ee({ planet: e }) {
+function He({ planet: e }) {
   return /* @__PURE__ */ t(
-    N.div,
+    w.div,
     {
       className: i.zoomTransition,
       initial: { opacity: 0 },
@@ -500,7 +499,7 @@ function Ee({ planet: e }) {
       exit: { opacity: 0 },
       transition: { duration: 0.9, ease: "easeInOut" },
       children: /* @__PURE__ */ t(
-        N.span,
+        w.span,
         {
           className: i.zoomPlanetLabel,
           initial: { scale: 0.5, opacity: 0 },
@@ -517,41 +516,46 @@ function Ee({ planet: e }) {
     }
   );
 }
-function Ge({
+function Je({
   steps: e,
-  onHighlightPlanet: m,
-  onStepChange: d,
-  onFinish: l,
+  planets: h,
+  onHighlightPlanet: u,
+  onStepChange: l,
+  onFinish: o,
   flyTo: n
 }) {
-  const [s, u] = R("welcome"), [o, P] = R(0), r = v(
-    (C) => {
-      if (C < 0 || C >= e.length) return;
-      P(C), d(C);
-      const g = e[C];
-      g.planetId && m(g.planetId);
+  const [c, d] = _("welcome"), [y, m] = _(0), b = v(
+    (S) => {
+      if (S < 0 || S >= e.length) return;
+      m(S), l(S);
+      const P = e[S];
+      if (P.planetId) {
+        u(P.planetId);
+        const O = h.find((N) => N.id === P.planetId);
+        O && n && n(O.x + 50, O.y + 50, 1.5, 800);
+      }
     },
-    [e, d, m]
-  ), h = v(() => {
-    u("stepping"), r(0);
-  }, [r]), f = v(() => {
-    o < e.length - 1 ? r(o + 1) : (u("complete"), d(-1), m(null), setTimeout(() => l(), 1500));
-  }, [o, e.length, r, d, m, l]), k = v(() => {
-    o > 0 && r(o - 1);
-  }, [o, r]), w = v(() => {
-    d(-1), m(null), l();
-  }, [d, m, l]);
-  It(() => {
-    if (s !== "stepping") return;
-    const C = (g) => {
-      g.key === "ArrowRight" || g.key === "Enter" ? f() : g.key === "ArrowLeft" ? k() : g.key === "Escape" && w();
+    [e, h, l, u, n]
+  ), C = v(() => {
+    d("stepping"), b(0);
+  }, [b]), M = v(() => {
+    y < e.length - 1 ? b(y + 1) : (d("complete"), l(-1), u(null), n == null || n(800, 400, 0.8, 600), setTimeout(() => o(), 1500));
+  }, [y, e.length, b, l, u, o, n]), $ = v(() => {
+    y > 0 && b(y - 1);
+  }, [y, b]), r = v(() => {
+    l(-1), u(null), n == null || n(800, 400, 0.8, 600), o();
+  }, [l, u, o, n]);
+  at(() => {
+    if (c !== "stepping") return;
+    const S = (P) => {
+      P.key === "ArrowRight" || P.key === "Enter" ? M() : P.key === "ArrowLeft" ? $() : P.key === "Escape" && r();
     };
-    return window.addEventListener("keydown", C), () => window.removeEventListener("keydown", C);
-  }, [s, f, k, w]);
-  const a = e[o], $ = e.length > 0 ? (o + 1) / e.length * 100 : 0;
-  return /* @__PURE__ */ p(M, { mode: "wait", children: [
-    s === "welcome" && /* @__PURE__ */ t(
-      N.div,
+    return window.addEventListener("keydown", S), () => window.removeEventListener("keydown", S);
+  }, [c, M, $, r]);
+  const I = e[y], G = e.length > 0 ? (y + 1) / e.length * 100 : 0;
+  return /* @__PURE__ */ p(E, { mode: "wait", children: [
+    c === "welcome" && /* @__PURE__ */ t(
+      w.div,
       {
         className: i.tutorialOverlay,
         initial: { opacity: 0 },
@@ -559,7 +563,7 @@ function Ge({
         exit: { opacity: 0 },
         children: /* @__PURE__ */ p("div", { className: i.tutorialWelcome, children: [
           /* @__PURE__ */ t(
-            N.div,
+            w.div,
             {
               initial: { scale: 0.8 },
               animate: { scale: 1 },
@@ -576,7 +580,7 @@ function Ge({
               {
                 className: i.tutorialButton,
                 "data-variant": "ghost",
-                onClick: w,
+                onClick: r,
                 children: "SKIP"
               }
             ),
@@ -585,7 +589,7 @@ function Ge({
               {
                 className: i.tutorialButton,
                 "data-variant": "primary",
-                onClick: h,
+                onClick: C,
                 children: "LET'S GO"
               }
             )
@@ -594,8 +598,8 @@ function Ge({
       },
       "welcome"
     ),
-    s === "stepping" && a && /* @__PURE__ */ p(
-      N.div,
+    c === "stepping" && I && /* @__PURE__ */ p(
+      w.div,
       {
         className: i.tutorialCard,
         initial: { opacity: 0, y: 20 },
@@ -603,50 +607,55 @@ function Ge({
         exit: { opacity: 0, y: -10 },
         transition: { duration: 0.25 },
         children: [
-          a.chipText && /* @__PURE__ */ t(
+          I.chipText && /* @__PURE__ */ t(
             "span",
             {
               className: i.tutorialChip,
               style: {
-                background: `${a.chipColor ?? "#3b82f6"}22`,
-                color: a.chipColor ?? "#3b82f6"
+                background: `${I.chipColor ?? "#3b82f6"}22`,
+                color: I.chipColor ?? "#3b82f6"
               },
-              children: a.chipText
+              children: I.chipText
             }
           ),
-          /* @__PURE__ */ t("h3", { className: i.tutorialCardTitle, children: a.title }),
-          /* @__PURE__ */ t("p", { className: i.tutorialCardDesc, children: a.description }),
+          /* @__PURE__ */ t("h3", { className: i.tutorialCardTitle, children: I.title }),
+          /* @__PURE__ */ t("p", { className: i.tutorialCardDesc, children: I.description }),
           /* @__PURE__ */ t("div", { className: i.tutorialProgress, children: /* @__PURE__ */ t(
             "div",
             {
               className: i.tutorialProgressBar,
-              style: { width: `${$}%` }
+              style: { width: `${G}%` }
             }
           ) }),
           /* @__PURE__ */ p("div", { className: i.tutorialCardFooter, children: [
-            /* @__PURE__ */ p("span", { className: i.tutorialStepCounter, children: [
-              o + 1,
-              " / ",
-              e.length
-            ] }),
-            /* @__PURE__ */ t("div", { className: i.tutorialDots, children: e.map((C, g) => /* @__PURE__ */ t(
+            /* @__PURE__ */ t(
+              "button",
+              {
+                className: i.tutorialButton,
+                "data-variant": "ghost",
+                style: { padding: "0.375rem 0.75rem", fontSize: "0.6875rem" },
+                onClick: r,
+                children: "SKIP"
+              }
+            ),
+            /* @__PURE__ */ t("div", { className: i.tutorialDots, children: e.map((S, P) => /* @__PURE__ */ t(
               "div",
               {
                 className: i.tutorialDot,
-                "data-active": g === o || void 0,
-                "data-done": g < o || void 0,
-                onClick: () => r(g)
+                "data-active": P === y || void 0,
+                "data-done": P < y || void 0,
+                onClick: () => b(P)
               },
-              g
+              P
             )) }),
             /* @__PURE__ */ p("div", { style: { display: "flex", gap: "0.5rem" }, children: [
-              o > 0 && /* @__PURE__ */ t(
+              y > 0 && /* @__PURE__ */ t(
                 "button",
                 {
                   className: i.tutorialButton,
                   "data-variant": "ghost",
                   style: { padding: "0.375rem 0.75rem", fontSize: "0.75rem" },
-                  onClick: k,
+                  onClick: $,
                   children: "←"
                 }
               ),
@@ -656,18 +665,18 @@ function Ge({
                   className: i.tutorialButton,
                   "data-variant": "primary",
                   style: { padding: "0.375rem 0.75rem", fontSize: "0.75rem" },
-                  onClick: f,
-                  children: o === e.length - 1 ? "Finish" : "→"
+                  onClick: M,
+                  children: y === e.length - 1 ? "Finish" : "→"
                 }
               )
             ] })
           ] })
         ]
       },
-      `step-${o}`
+      `step-${y}`
     ),
-    s === "complete" && /* @__PURE__ */ t(
-      N.div,
+    c === "complete" && /* @__PURE__ */ t(
+      w.div,
       {
         className: i.tutorialOverlay,
         initial: { opacity: 0 },
@@ -675,7 +684,7 @@ function Ge({
         exit: { opacity: 0 },
         transition: { duration: 1 },
         children: /* @__PURE__ */ t(
-          N.h1,
+          w.h1,
           {
             className: i.tutorialWelcomeTitle,
             initial: { scale: 0.8 },
@@ -689,176 +698,211 @@ function Ge({
     )
   ] });
 }
-const Je = { planet: At }, Ue = { orbit: Ot };
-function je({
+const Ke = { planet: _t }, Ue = { orbit: Ht };
+function Ve({
   planets: e,
-  orbits: m,
-  onPlanetClick: d,
+  orbits: h,
+  onPlanetClick: u,
   onPlanetEnter: l,
-  onPlanetExit: n,
-  onSatelliteClick: s,
-  onPlanetDrag: u,
-  tutorialSteps: o,
-  showTutorial: P,
-  onTutorialComplete: r,
-  initialView: h,
-  onViewChange: f,
-  renderPlanetInterior: k,
-  topBar: w,
-  theme: a,
-  starField: $ = !0,
-  nodeTypes: C,
-  edgeTypes: g,
-  className: it,
-  style: ot
+  onPlanetExit: o,
+  onSatelliteClick: n,
+  onPlanetDrag: c,
+  tutorialSteps: d,
+  showTutorial: y,
+  onTutorialComplete: m,
+  initialView: b,
+  onViewChange: C,
+  renderPlanetInterior: M,
+  topBar: $,
+  theme: r,
+  starField: I = !0,
+  nodeTypes: G,
+  edgeTypes: S,
+  className: P,
+  style: O
 }) {
-  const [S, at] = R(h ?? { mode: "universe" }), [H, nt] = R(P ?? !1), X = E(0), _ = E(""), { setCenter: O } = kt(), I = v(
-    (c) => {
-      at(c), f == null || f(c);
+  const [N, st] = _(b ?? { mode: "universe" }), [H, ct] = _(y ?? !1), Z = K(0), Q = K(""), { setCenter: x, fitView: J } = Lt(), k = v(
+    (a) => {
+      st(a), C == null || C(a);
     },
-    [f]
-  ), G = v(
-    (c) => e.find((y) => y.id === c),
+    [C]
+  ), U = v(
+    (a) => e.find((s) => s.id === a),
     [e]
-  ), rt = D(
-    () => e.map((c) => ({
-      id: c.id,
+  ), dt = R(
+    () => e.map((a) => ({
+      id: a.id,
       type: "planet",
-      position: { x: c.x, y: c.y },
+      position: { x: a.x, y: a.y },
       data: {
-        label: c.label,
-        subtitle: c.subtitle,
-        color: c.color,
-        status: c.status ?? "idle",
+        label: a.label,
+        subtitle: a.subtitle,
+        color: a.color,
+        status: a.status ?? "idle",
         isSelected: !1
       }
     })),
     [e]
-  ), lt = D(
-    () => m.map((c, y) => ({
-      id: `orbit-${y}`,
-      source: c.source,
-      target: c.target,
+  ), ut = R(
+    () => h.map((a, s) => ({
+      id: `orbit-${s}`,
+      source: a.source,
+      target: a.target,
       type: "orbit",
-      data: { label: c.label },
+      data: { label: a.label },
       animated: !0
     })),
-    [m]
-  ), [st, W, ct] = Bt(rt), [dt, J, ut] = Tt(lt), B = v(
-    (c) => {
-      W(
-        (y) => y.map((x) => ({
-          ...x,
-          data: { ...x.data, isSelected: x.id === c }
+    [h]
+  ), [V, F, mt] = Mt(dt), [pt, j, ht] = Ft(ut), B = v(
+    (a) => {
+      F(
+        (s) => s.map((g) => ({
+          ...g,
+          data: { ...g.data, isSelected: g.id === a }
         }))
       );
     },
-    [W]
-  ), mt = v(
-    (c) => {
-      var L;
-      if (!o) return;
-      if (c < 0) {
-        W(
-          (T) => T.map((b) => ({
-            ...b,
-            data: { ...b.data, status: "idle", isSelected: !1 }
+    [F]
+  ), yt = v(() => {
+    F(
+      (a) => a.map((s) => {
+        const g = e.find((L) => L.id === s.id);
+        return g ? { ...s, position: { x: g.x, y: g.y } } : s;
+      })
+    ), setTimeout(() => J({ duration: 600, padding: 0.2 }), 50);
+  }, [e, F, J]), bt = v(() => {
+    const a = V.length;
+    if (a === 0) return;
+    const s = 800, g = 400, L = Math.max(200, a * 40);
+    F(
+      (D) => D.map((z, f) => {
+        const T = 2 * Math.PI * f / a - Math.PI / 2;
+        return {
+          ...z,
+          position: {
+            x: s + L * Math.cos(T),
+            y: g + L * Math.sin(T)
+          }
+        };
+      })
+    ), setTimeout(() => J({ duration: 600, padding: 0.2 }), 50);
+  }, [V.length, F, J]), gt = v(
+    (a) => {
+      var D;
+      if (!d) return;
+      if (a < 0) {
+        F(
+          (z) => z.map((f) => ({
+            ...f,
+            data: { ...f.data, status: "idle", isSelected: !1 }
           }))
-        ), J(
-          (T) => T.map((b) => ({
-            ...b,
+        ), j(
+          (z) => z.map((f) => ({
+            ...f,
             animated: !0,
-            data: { ...b.data, isActive: !1, isDimmed: !1 }
+            data: { ...f.data, isActive: !1, isDimmed: !1 }
           }))
         );
         return;
       }
-      const y = new Set(o.slice(0, c).map((T) => T.planetId)), x = (L = o[c]) == null ? void 0 : L.planetId;
-      W(
-        (T) => T.map((b) => {
-          let A = "idle";
-          return b.id === x ? A = "running" : y.has(b.id) && (A = "success"), {
-            ...b,
-            data: { ...b.data, status: A, isSelected: b.id === x }
+      const s = new Set(d.slice(0, a).map((z) => z.planetId)), g = (D = d[a]) == null ? void 0 : D.planetId;
+      F(
+        (z) => z.map((f) => {
+          let T = "idle";
+          return f.id === g ? T = "running" : s.has(f.id) && (T = "success"), {
+            ...f,
+            data: { ...f.data, status: T, isSelected: f.id === g }
           };
         })
       );
-      const U = /* @__PURE__ */ new Set([...y, x]);
-      J(
-        (T) => T.map((b) => {
-          const A = y.has(b.source), Ct = U.has(b.target), j = A && Ct;
+      const L = /* @__PURE__ */ new Set([...s, g]);
+      j(
+        (z) => z.map((f) => {
+          const T = s.has(f.source), St = L.has(f.target), q = T && St;
           return {
-            ...b,
-            animated: j,
-            data: { ...b.data, isActive: j, isDimmed: !j }
+            ...f,
+            animated: q,
+            data: { ...f.data, isActive: q, isDimmed: !q }
           };
         })
       );
     },
-    [o, W, J]
-  ), pt = v(
-    (c, y) => {
-      const x = Date.now(), U = x - X.current < 300 && _.current === y.id;
-      X.current = x, _.current = y.id;
-      const L = G(y.id);
-      U && L ? K(L) : S.mode === "inspecting" && S.planetId === y.id ? (I({ mode: "universe" }), B(null)) : (I({ mode: "inspecting", planetId: y.id }), B(y.id), L && (d == null || d(L)));
+    [d, F, j]
+  ), ft = v(
+    (a, s) => {
+      const g = Date.now(), L = g - Z.current < 300 && Q.current === s.id;
+      Z.current = g, Q.current = s.id;
+      const D = U(s.id);
+      L && D ? Y(D) : N.mode === "inspecting" && N.planetId === s.id ? (k({ mode: "universe" }), B(null), x(800, 400, { zoom: 0.8, duration: 600 })) : (k({ mode: "inspecting", planetId: s.id }), B(s.id), x(s.position.x + 50, s.position.y + 50, { zoom: 1.5, duration: 600 }), D && (u == null || u(D)));
     },
-    [S, B, G, I, d]
-  ), K = v(
-    (c) => {
-      I({ mode: "entering", planetId: c.id }), B(null), l == null || l(c), O(c.x + 50, c.y + 50, { zoom: 6, duration: 800 }), setTimeout(() => {
-        I({ mode: "planet", planetId: c.id });
+    [N, B, U, k, u, x]
+  ), Y = v(
+    (a) => {
+      k({ mode: "entering", planetId: a.id }), B(null), l == null || l(a), x(a.x + 50, a.y + 50, { zoom: 6, duration: 800 }), setTimeout(() => {
+        k({ mode: "planet", planetId: a.id });
       }, 900);
     },
-    [O, B, I, l]
-  ), yt = v(() => {
-    I({ mode: "universe" }), n == null || n(), setTimeout(() => {
-      O(800, 400, { zoom: 0.8, duration: 600 });
+    [x, B, k, l]
+  ), X = v(() => {
+    k({ mode: "universe" }), o == null || o(), setTimeout(() => {
+      x(800, 400, { zoom: 0.8, duration: 600 });
     }, 100);
-  }, [O, I, n]), bt = v(
-    (c, y) => {
-      u == null || u(y.id, { x: y.position.x, y: y.position.y });
+  }, [x, k, o]), vt = v(
+    (a, s) => {
+      c == null || c(s.id, { x: s.position.x, y: s.position.y });
     },
-    [u]
-  ), ht = v(() => {
-    S.mode === "inspecting" && (I({ mode: "universe" }), B(null));
-  }, [S, B, I]), z = S.mode !== "universe" ? G(S.planetId) : void 0, ft = S.mode !== "planet", gt = D(
-    () => ({ ...Je, ...C }),
-    [C]
-  ), vt = D(
-    () => ({ ...Ue, ...g }),
-    [g]
-  ), Nt = $ !== !1, Pt = typeof $ == "object" ? $ : {}, F = {};
-  return a != null && a.background && (F["--cc-bg"] = a.background), a != null && a.textColor && (F["--cc-text"] = a.textColor), a != null && a.panelBackground && (F["--cc-panel-bg"] = a.panelBackground), a != null && a.panelBorder && (F["--cc-panel-border"] = a.panelBorder), a != null && a.controlsBackground && (F["--cc-controls-bg"] = a.controlsBackground), a != null && a.fontFamily && (F["--cc-font-family"] = a.fontFamily), /* @__PURE__ */ p(
+    [c]
+  ), Nt = v(() => {
+    N.mode === "inspecting" && (k({ mode: "universe" }), B(null), x(800, 400, { zoom: 0.8, duration: 600 }));
+  }, [N, B, k, x]), Pt = v(
+    (a, s, g, L) => {
+      x(a, s, { zoom: g, duration: L });
+    },
+    [x]
+  );
+  at(() => {
+    const a = (s) => {
+      s.key === "Escape" && (H || (N.mode === "inspecting" ? (k({ mode: "universe" }), B(null), x(800, 400, { zoom: 0.8, duration: 600 })) : N.mode === "planet" && X()));
+    };
+    return window.addEventListener("keydown", a), () => window.removeEventListener("keydown", a);
+  }, [N, H, k, B, x, X]);
+  const W = N.mode !== "universe" ? U(N.planetId) : void 0, wt = N.mode !== "planet", xt = R(
+    () => ({ ...Ke, ...G }),
+    [G]
+  ), Ct = R(
+    () => ({ ...Ue, ...S }),
+    [S]
+  ), It = I !== !1, kt = typeof I == "object" ? I : {}, A = {};
+  return r != null && r.background && (A["--cc-bg"] = r.background), r != null && r.textColor && (A["--cc-text"] = r.textColor), r != null && r.panelBackground && (A["--cc-panel-bg"] = r.panelBackground), r != null && r.panelBorder && (A["--cc-panel-border"] = r.panelBorder), r != null && r.controlsBackground && (A["--cc-controls-bg"] = r.controlsBackground), r != null && r.fontFamily && (A["--cc-font-family"] = r.fontFamily), /* @__PURE__ */ p(
     "div",
     {
-      className: `${i.root} ${it ?? ""}`,
-      style: { ...F, ...ot },
+      className: `${i.root} ${P ?? ""}`,
+      style: { ...A, ...O },
       children: [
-        Nt && /* @__PURE__ */ t("div", { className: i.layerStarField, children: /* @__PURE__ */ t(
-          Jt,
+        It && /* @__PURE__ */ t("div", { className: i.layerStarField, children: /* @__PURE__ */ t(
+          Ut,
           {
-            config: Pt,
-            background: a == null ? void 0 : a.background
+            config: kt,
+            background: r == null ? void 0 : r.background
           }
         ) }),
         /* @__PURE__ */ t(
           "div",
           {
             className: i.layerReactFlow,
-            "data-hidden": !ft || void 0,
+            "data-hidden": !wt || void 0,
             children: /* @__PURE__ */ p(
-              $t,
+              Dt,
               {
-                nodes: st,
-                edges: dt,
-                onNodesChange: ct,
-                onEdgesChange: ut,
-                onNodeClick: pt,
-                onNodeDragStop: bt,
-                onPaneClick: ht,
-                nodeTypes: gt,
-                edgeTypes: vt,
+                nodes: V,
+                edges: pt,
+                onNodesChange: mt,
+                onEdgesChange: ht,
+                onNodeClick: ft,
+                onNodeDragStop: vt,
+                onPaneClick: Nt,
+                nodeTypes: xt,
+                edgeTypes: Ct,
                 nodesDraggable: !0,
                 nodeDragThreshold: 5,
                 fitView: !0,
@@ -868,36 +912,59 @@ function je({
                 maxZoom: 8,
                 children: [
                   /* @__PURE__ */ t(
-                    zt,
+                    Tt,
                     {
-                      variant: Ft.Dots,
+                      variant: Wt.Dots,
                       gap: 50,
                       size: 1,
                       color: "rgba(255, 255, 255, 0.05)"
                     }
                   ),
-                  /* @__PURE__ */ t(
-                    Lt,
+                  /* @__PURE__ */ p(
+                    At,
                     {
-                      style: {
-                        top: 60,
-                        background: (a == null ? void 0 : a.controlsBackground) ?? "rgba(20, 20, 40, 0.8)",
-                        borderColor: "rgba(255, 255, 255, 0.1)"
-                      }
+                      style: { top: 60 },
+                      showInteractive: !1,
+                      children: [
+                        /* @__PURE__ */ t(
+                          "button",
+                          {
+                            className: "react-flow__controls-button",
+                            onClick: yt,
+                            title: "Reset layout",
+                            children: /* @__PURE__ */ t("svg", { viewBox: "0 0 24 24", width: "16", height: "16", fill: "currentColor", children: /* @__PURE__ */ t("path", { d: "M12 5V1L7 6l5 5V7c3.31 0 6 2.69 6 6s-2.69 6-6 6-6-2.69-6-6H4c0 4.42 3.58 8 8 8s8-3.58 8-8-3.58-8-8-8z" }) })
+                          }
+                        ),
+                        /* @__PURE__ */ t(
+                          "button",
+                          {
+                            className: "react-flow__controls-button",
+                            onClick: bt,
+                            title: "Auto layout",
+                            children: /* @__PURE__ */ p("svg", { viewBox: "0 0 24 24", width: "16", height: "16", fill: "currentColor", children: [
+                              /* @__PURE__ */ t("circle", { cx: "12", cy: "3", r: "2" }),
+                              /* @__PURE__ */ t("circle", { cx: "19.8", cy: "8", r: "2" }),
+                              /* @__PURE__ */ t("circle", { cx: "17.6", cy: "17", r: "2" }),
+                              /* @__PURE__ */ t("circle", { cx: "6.4", cy: "17", r: "2" }),
+                              /* @__PURE__ */ t("circle", { cx: "4.2", cy: "8", r: "2" }),
+                              /* @__PURE__ */ t("path", { d: "M12 5a7 7 0 1 1 0 14 7 7 0 0 1 0-14", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeDasharray: "3 2" })
+                            ] })
+                          }
+                        )
+                      ]
                     }
                   ),
                   /* @__PURE__ */ t(
-                    Dt,
+                    Rt,
                     {
-                      style: {
-                        background: "rgba(10, 10, 26, 0.9)",
-                        border: "1px solid rgba(255, 255, 255, 0.1)"
-                      },
-                      nodeColor: (c) => {
-                        var y;
-                        return ((y = c.data) == null ? void 0 : y.color) || "#666";
+                      nodeColor: (a) => {
+                        var s;
+                        return ((s = a.data) == null ? void 0 : s.color) || "#666";
                       },
-                      maskColor: "rgba(10, 10, 26, 0.7)"
+                      maskColor: "rgba(10, 10, 26, 0.7)",
+                      style: {
+                        background: "rgba(10, 10, 26, 0.9)"
+                      }
                     }
                   )
                 ]
@@ -905,53 +972,55 @@ function je({
             )
           }
         ),
-        /* @__PURE__ */ t(M, { children: S.mode === "entering" && z && /* @__PURE__ */ t(Ee, { planet: z }) }),
-        /* @__PURE__ */ t(M, { children: S.mode === "planet" && z && /* @__PURE__ */ t(
-          Oe,
+        /* @__PURE__ */ t(E, { children: N.mode === "entering" && W && /* @__PURE__ */ t(He, { planet: W }) }),
+        /* @__PURE__ */ t(E, { children: N.mode === "planet" && W && /* @__PURE__ */ t(
+          Ge,
           {
-            planet: z,
-            onExit: yt,
-            onSatelliteClick: s,
-            renderCustom: k
+            planet: W,
+            onExit: X,
+            onSatelliteClick: n,
+            renderCustom: M
           }
         ) }),
-        /* @__PURE__ */ t(M, { children: S.mode === "inspecting" && z && /* @__PURE__ */ t(
-          Re,
+        /* @__PURE__ */ t(E, { children: N.mode === "inspecting" && W && /* @__PURE__ */ t(
+          _e,
           {
-            planet: z,
+            planet: W,
             onClose: () => {
-              I({ mode: "universe" }), B(null);
+              k({ mode: "universe" }), B(null), x(800, 400, { zoom: 0.8, duration: 600 });
             },
-            onEnterPlanet: () => K(z),
-            onSatelliteClick: s
+            onEnterPlanet: () => Y(W),
+            onSatelliteClick: n
           }
         ) }),
-        w && !H && /* @__PURE__ */ t("div", { className: i.topBarSlot, children: w }),
-        /* @__PURE__ */ t(M, { children: H && o && o.length > 0 && /* @__PURE__ */ t(
-          Ge,
+        $ && !H && /* @__PURE__ */ t("div", { className: i.topBarSlot, children: $ }),
+        /* @__PURE__ */ t(E, { children: H && d && d.length > 0 && /* @__PURE__ */ t(
+          Je,
           {
-            steps: o,
+            steps: d,
+            planets: e,
             onHighlightPlanet: B,
-            onStepChange: mt,
+            onStepChange: gt,
             onFinish: () => {
-              nt(!1), r == null || r();
-            }
+              ct(!1), m == null || m();
+            },
+            flyTo: Pt
           }
         ) })
       ]
     }
   );
 }
-function Ze(e) {
-  return /* @__PURE__ */ t(xt, { children: /* @__PURE__ */ t(je, { ...e }) });
+function ti(e) {
+  return /* @__PURE__ */ t($t, { children: /* @__PURE__ */ t(Ve, { ...e }) });
 }
 export {
-  Ze as CosmosCanvas,
-  Ge as CosmosTutorial,
-  Ot as OrbitEdge,
-  Oe as PlanetInterior,
-  At as PlanetNode,
-  Re as SidePanel,
-  Jt as StarField,
-  Ee as ZoomTransition
+  ti as CosmosCanvas,
+  Je as CosmosTutorial,
+  Ht as OrbitEdge,
+  Ge as PlanetInterior,
+  _t as PlanetNode,
+  _e as SidePanel,
+  Ut as StarField,
+  He as ZoomTransition
 };