@nice2dev/ui-video 1.0.30 → 1.1.5

package/dist/index.mjs

@@ -1,3879 +1,6 @@
-import { jsxs as a, jsx as e, Fragment as le } from "react/jsx-runtime";
-import { forwardRef as He, useContext as ye, createContext as $, memo as Te, useState as w, useEffect as re, useRef as L, useCallback as me } from "react";
-const he = He(
-  ({
-    menubar: d,
-    toolbar: f,
-    sidebar: l,
-    sidebarWidth: C = 220,
-    rightSidebar: H,
-    rightSidebarWidth: I = 280,
-    children: p,
-    bottomPanel: n,
-    bottomPanelHeight: R,
-    statusBar: b,
-    height: D = "100%",
-    flush: y = !1,
-    className: x,
-    style: S,
-    id: A,
-    "data-testid": _
-  }, O) => {
-    const F = `nice-app-shell__sidebar${y ? " nice-app-shell__sidebar--flush" : ""}`;
-    return /* @__PURE__ */ a(
-      "div",
-      {
-        ref: O,
-        id: A,
-        "data-testid": _,
-        className: `nice-app-shell${x ? ` ${x}` : ""}`,
-        style: { height: D, ...S },
-        children: [
-          d != null && /* @__PURE__ */ e(
-            "div",
-            {
-              className: `nice-app-shell__menubar${y ? " nice-app-shell__chrome--flush" : ""}`,
-              children: d
-            }
-          ),
-          f != null && /* @__PURE__ */ e(
-            "div",
-            {
-              className: `nice-app-shell__toolbar${y ? " nice-app-shell__chrome--flush" : ""}`,
-              children: f
-            }
-          ),
-          /* @__PURE__ */ a("div", { className: "nice-app-shell__body", children: [
-            l != null && /* @__PURE__ */ e("aside", { className: F, style: y ? void 0 : { width: C }, children: l }),
-            /* @__PURE__ */ e("main", { className: "nice-app-shell__content", children: p }),
-            H != null && /* @__PURE__ */ e(
-              "aside",
-              {
-                className: `${F} nice-app-shell__sidebar--right`,
-                style: y ? void 0 : { width: I },
-                children: H
-              }
-            )
-          ] }),
-          n != null && /* @__PURE__ */ e(
-            "div",
-            {
-              className: `nice-app-shell__bottom${y ? " nice-app-shell__bottom--flush" : ""}`,
-              style: R != null ? { height: R } : void 0,
-              children: n
-            }
-          ),
-          b != null && /* @__PURE__ */ e("div", { className: "nice-app-shell__status", children: b })
-        ]
-      }
-    );
-  }
-);
-he.displayName = "NiceAppShell";
-const Ie = (d, f) => f, _e = $(Ie);
-function Re() {
-  return { t: ye(_e) };
-}
-$({
-  dir: "ltr",
-  isRTL: !1,
-  flip: (d) => d,
-  value: (d) => d.ltr
-});
-$(null);
-$(null);
-const Me = {
-  radius: "md",
-  shadow: "md",
-  fill: "solid",
-  buttonStyle: "flat",
-  inputStyle: "bordered",
-  cardStyle: "elevated",
-  badgeStyle: "solid",
-  tabStyle: "underline",
-  toggleStyle: "default",
-  tooltipStyle: "dark",
-  modalStyle: "default",
-  tableStyle: "default",
-  menuStyle: "default",
-  animation: "normal",
-  density: "normal"
-};
-$({
-  displayStyle: "default",
-  variantConfig: Me,
-  setDisplayStyle: () => {
-  }
-});
-$({});
-$({
-  direction: "ltr",
-  isRTL: !1,
-  flip: (d) => d,
-  flipStyle: (d, f) => ({ [d]: f })
-});
-$({
-  permissions: {},
-  getAccessMode: () => "full"
-});
-$(null);
-const $e = process.env.NODE_ENV === "development";
-let be = {
-  enabled: $e,
-  slowRenderThreshold: 16
-};
-const ve = [], pe = /* @__PURE__ */ new Map(), ge = /* @__PURE__ */ new Map();
-function De() {
-  ve.length = 0, pe.clear(), ge.clear();
-}
-function Ae(d) {
-  const f = be.slowRenderThreshold;
-  return ve.filter((l) => l.actualDuration > f);
-}
-function X(d) {
-  return d < 1 ? `${(d * 1e3).toFixed(0)}μs` : d < 1e3 ? `${d.toFixed(2)}ms` : `${(d / 1e3).toFixed(2)}s`;
-}
-function Ee() {
-  const d = Array.from(pe.values()), f = Ae(), l = d.reduce((I, p) => I + p.renderCount, 0), C = d.length > 0 ? d.reduce((I, p) => I + p.avgRenderTime, 0) / d.length : 0, H = Array.from(ge.values());
-  return { stats: d, slowRenders: f, totalRenders: l, avgRenderTime: C, marks: H };
-}
-function ze() {
-  const d = Ee();
-  console.group(
-    "%c[Nice2Dev Performance Report]",
-    "color: var(--nice-info, #6366f1); font-weight: bold; font-size: 14px"
-  ), console.log(`Total renders: ${d.totalRenders}`), console.log(`Average render time: ${X(d.avgRenderTime)}`), console.log(`Slow renders: ${d.slowRenders.length}`), console.group("Component Stats"), console.table(
-    d.stats.sort((f, l) => l.totalRenderTime - f.totalRenderTime).map((f) => ({
-      Name: f.componentName,
-      Renders: f.renderCount,
-      "Avg Time": X(f.avgRenderTime),
-      "Max Time": X(f.maxRenderTime),
-      "Total Time": X(f.totalRenderTime),
-      "Slow Renders": f.slowRenderCount
-    }))
-  ), console.groupEnd(), d.slowRenders.length > 0 && (console.group("Slow Renders (last 10)"), console.table(
-    d.slowRenders.slice(-10).map((f) => ({
-      Component: f.componentName,
-      Phase: f.phase,
-      Duration: X(f.actualDuration),
-      Time: new Date(f.timestamp).toLocaleTimeString()
-    }))
-  ), console.groupEnd()), d.marks.length > 0 && (console.group("Custom Marks"), console.table(
-    d.marks.filter((f) => f.duration).map((f) => ({
-      Name: f.name,
-      Duration: X(f.duration)
-    }))
-  ), console.groupEnd()), console.groupEnd();
-}
-const Pe = Te(
-  ({ position: d = "bottom-right", defaultCollapsed: f = !0 }) => {
-    const [l, C] = w(f), [H, I] = w([]), [p, n] = w({ used: 0, total: 0 });
-    if (re(() => {
-      const b = () => {
-        const y = Array.from(pe.values());
-        I(y.sort((S, A) => A.totalRenderTime - S.totalRenderTime).slice(0, 10));
-        const x = window.performance;
-        x.memory && n({
-          used: x.memory.usedJSHeapSize / 1024 / 1024,
-          total: x.memory.totalJSHeapSize / 1024 / 1024
-        });
-      };
-      b();
-      const D = setInterval(b, 2e3);
-      return () => clearInterval(D);
-    }, []), !be.enabled)
-      return null;
-    const R = {
-      position: "fixed",
-      zIndex: 99999,
-      ...d.includes("top") ? { top: 8 } : { bottom: 8 },
-      ...d.includes("left") ? { left: 8 } : { right: 8 }
-    };
-    return /* @__PURE__ */ a(
-      "div",
-      {
-        style: {
-          ...R,
-          background: "var(--nice-overlay-85, rgba(0, 0, 0, 0.85))",
-          color: "var(--bg-primary, #fff)",
-          borderRadius: 8,
-          fontSize: 11,
-          fontFamily: "Monaco, Consolas, monospace",
-          padding: l ? "4px 8px" : 8,
-          maxWidth: l ? "auto" : 300,
-          maxHeight: l ? "auto" : 400,
-          overflow: "auto"
-        },
-        children: [
-          /* @__PURE__ */ a(
-            "div",
-            {
-              style: { cursor: "pointer", display: "flex", alignItems: "center", gap: 8 },
-              onClick: () => C((b) => !b),
-              children: [
-                /* @__PURE__ */ e("span", { style: { color: "var(--color-success, #22c55e)" }, children: "●" }),
-                /* @__PURE__ */ e("span", { children: "Profiler" }),
-                p.used > 0 && /* @__PURE__ */ a(
-                  "span",
-                  {
-                    style: {
-                      color: p.used > 100 ? "var(--color-warning, #f59e0b)" : "var(--text-muted, #64748b)"
-                    },
-                    children: [
-                      p.used.toFixed(0),
-                      "MB"
-                    ]
-                  }
-                ),
-                /* @__PURE__ */ e("span", { style: { marginLeft: "auto", opacity: 0.5 }, children: l ? "▼" : "▲" })
-              ]
-            }
-          ),
-          !l && /* @__PURE__ */ a("div", { style: { marginTop: 8 }, children: [
-            /* @__PURE__ */ e(
-              "div",
-              {
-                style: {
-                  borderBottom: "1px solid var(--border-color, #333)",
-                  paddingBottom: 4,
-                  marginBottom: 8
-                },
-                children: /* @__PURE__ */ e("strong", { children: "Top Components" })
-              }
-            ),
-            H.map((b) => /* @__PURE__ */ a("div", { style: { marginBottom: 4, display: "flex", gap: 8 }, children: [
-              /* @__PURE__ */ e("span", { style: { flex: 1, overflow: "hidden", textOverflow: "ellipsis" }, children: b.componentName }),
-              /* @__PURE__ */ e(
-                "span",
-                {
-                  style: {
-                    color: b.avgRenderTime > 16 ? "var(--color-warning, #f59e0b)" : "var(--color-success, #22c55e)"
-                  },
-                  children: X(b.avgRenderTime)
-                }
-              ),
-              /* @__PURE__ */ a(
-                "span",
-                {
-                  style: { color: "var(--text-muted, #64748b)", minWidth: 30, textAlign: "right" },
-                  children: [
-                    "x",
-                    b.renderCount
-                  ]
-                }
-              )
-            ] }, b.componentName)),
-            /* @__PURE__ */ a("div", { style: { marginTop: 8, display: "flex", gap: 8 }, children: [
-              /* @__PURE__ */ e(
-                "button",
-                {
-                  onClick: ze,
-                  style: {
-                    flex: 1,
-                    padding: "4px 8px",
-                    background: "var(--bg-tertiary, #333)",
-                    border: "none",
-                    borderRadius: 4,
-                    color: "var(--bg-primary, #fff)",
-                    cursor: "pointer",
-                    fontSize: 10
-                  },
-                  children: "Print Report"
-                }
-              ),
-              /* @__PURE__ */ e(
-                "button",
-                {
-                  onClick: De,
-                  style: {
-                    flex: 1,
-                    padding: "4px 8px",
-                    background: "var(--bg-tertiary, #333)",
-                    border: "none",
-                    borderRadius: 4,
-                    color: "var(--bg-primary, #fff)",
-                    cursor: "pointer",
-                    fontSize: 10
-                  },
-                  children: "Clear"
-                }
-              )
-            ] })
-          ] })
-        ]
-      }
-    );
-  }
-);
-Pe.displayName = "ProfilerOverlay";
-process.env.NODE_ENV;
-$(null);
-const Ue = $({
-  enabled: !0,
-  active: !1,
-  run: () => {
-  }
-});
-function Fe() {
-  return ye(Ue);
-}
-function Le(d, f) {
-  if (!d)
-    return null;
-  if (d === !0)
-    return f && f.length > 0 ? f : null;
-  if (Array.isArray(d))
-    return d.length > 0 ? d : null;
-  const l = d.steps ?? f;
-  return l && l.length > 0 ? l : null;
-}
-function Ve(d, f) {
-  return d.map((l) => ({
-    target: l.target,
-    title: l.titleKey ? f(l.titleKey, l.title ?? "") : l.title ?? "",
-    content: l.contentKey ? f(l.contentKey, l.content ?? "") : l.content ?? "",
-    placement: l.placement,
-    highlightPadding: l.highlightPadding,
-    showArrow: l.showArrow,
-    scrollIntoView: l.scrollIntoView,
-    disableInteraction: l.disableInteraction
-  }));
-}
-const Oe = ({
-  steps: d,
-  autoStart: f,
-  label: l,
-  size: C = "md",
-  className: H,
-  style: I,
-  "data-testid": p
-}) => {
-  const { enabled: n, run: R } = Fe(), { t: b } = Re();
-  if (!n || !d || d.length === 0)
-    return null;
-  const D = l ?? b("tutorial.startAria", "Start tutorial");
-  return /* @__PURE__ */ e(
-    "button",
-    {
-      type: "button",
-      className: `nice-tutorial-button nice-tutorial-button--${C}` + (H ? ` ${H}` : ""),
-      style: I,
-      "data-testid": p,
-      "aria-label": D,
-      title: D,
-      onClick: () => R(Ve(d, b), { autoStart: f }),
-      children: "?"
-    }
-  );
-}, ue = "nice-tutorial-button-styles";
-if (typeof document < "u" && !document.getElementById(ue)) {
-  const d = document.createElement("style");
-  d.id = ue, d.textContent = `
-    .nice-tutorial-button {
-      display: inline-flex;
-      align-items: center;
-      justify-content: center;
-      border: 1px solid var(--nice-border, #cbd5e1);
-      background: var(--nice-bg, #fff);
-      color: var(--nice-text-secondary, #475569);
-      border-radius: var(--nice-radius-full, 9999px);
-      cursor: help;
-      font-weight: 700;
-      line-height: 1;
-      padding: 0;
-      transition: background var(--nice-transition, 200ms ease), color var(--nice-transition, 200ms ease), border-color var(--nice-transition, 200ms ease);
-    }
-    .nice-tutorial-button:hover {
-      background: var(--nice-primary, #2563eb);
-      border-color: var(--nice-primary, #2563eb);
-      color: var(--nice-text-inverse, #fff);
-    }
-    .nice-tutorial-button:focus-visible {
-      outline: none;
-      box-shadow: 0 0 0 2px var(--nice-bg, #fff), 0 0 0 4px var(--nice-primary, #2563eb);
-    }
-    .nice-tutorial-button--sm { width: 16px; height: 16px; font-size: 11px; }
-    .nice-tutorial-button--md { width: 20px; height: 20px; font-size: 12px; }
-  `, document.head.appendChild(d);
-}
-$(null);
-$(null);
-$(null);
-const we = {
-  space1: "4px",
-  space2: "8px",
-  space3: "12px",
-  space4: "16px",
-  space5: "20px",
-  space6: "24px",
-  space8: "32px"
-}, Ne = {
-  fontFamily: "'Inter', system-ui, -apple-system, sans-serif",
-  fontSizeXs: "0.75rem",
-  fontSizeSm: "0.8125rem",
-  fontSizeMd: "0.875rem",
-  fontSizeLg: "1rem",
-  fontSizeXl: "1.125rem",
-  fontWeightNormal: 400,
-  fontWeightMedium: 500,
-  fontWeightSemibold: 600,
-  fontWeightBold: 700,
-  lineHeight: 1.5
-}, ke = { fast: "120ms ease", normal: "200ms ease", slow: "300ms ease" }, xe = (d) => ({
-  color: d,
-  radiusSm: "4px",
-  radiusMd: "6px",
-  radiusLg: "8px",
-  radiusXl: "12px",
-  radiusFull: "9999px"
-}), Be = {
-  sm: "0 1px 2px rgba(0,0,0,0.05)",
-  md: "0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -2px rgba(0,0,0,0.1)",
-  lg: "0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -4px rgba(0,0,0,0.1)",
-  xl: "0 20px 25px -5px rgba(0,0,0,0.1), 0 8px 10px -6px rgba(0,0,0,0.1)"
-}, We = {
-  sm: "0 1px 2px rgba(0,0,0,0.3)",
-  md: "0 4px 6px -1px rgba(0,0,0,0.4)",
-  lg: "0 10px 15px -3px rgba(0,0,0,0.4)",
-  xl: "0 20px 25px -5px rgba(0,0,0,0.4)"
-};
-function c(d, f, l, C, H) {
-  return {
-    name: d,
-    darkMode: "light",
-    colors: {
-      ...f,
-      surface: f.surface ?? l.primary,
-      surfaceHover: f.surfaceHover ?? l.secondary
-    },
-    backgrounds: {
-      ...l,
-      elevated: l.elevated ?? l.primary,
-      inset: l.inset ?? l.tertiary,
-      canvas: l.canvas ?? l.primary
-    },
-    text: { ...C, inverse: C.inverse ?? "#ffffff" },
-    borders: xe(H),
-    shadows: Be,
-    spacing: we,
-    typography: Ne,
-    transitions: ke
-  };
-}
-function T(d, f, l, C, H) {
-  return {
-    name: d,
-    darkMode: "dark",
-    colors: {
-      ...f,
-      surface: f.surface ?? l.secondary,
-      surfaceHover: f.surfaceHover ?? l.tertiary
-    },
-    backgrounds: {
-      ...l,
-      elevated: l.elevated ?? l.secondary,
-      inset: l.inset ?? l.primary,
-      canvas: l.canvas ?? l.primary
-    },
-    text: { ...C, inverse: C.inverse ?? "#0f172a" },
-    borders: xe(H),
-    shadows: We,
-    spacing: we,
-    typography: Ne,
-    transitions: ke
-  };
-}
-c(
-  "Slate",
-  {
-    primary: "#64748b",
-    primaryHover: "#475569",
-    success: "#10b981",
-    warning: "#f59e0b",
-    error: "#ef4444",
-    info: "#06b6d4"
-  },
-  { primary: "#f8fafc", secondary: "#f1f5f9", tertiary: "#e2e8f0", hover: "#e2e8f0" },
-  { primary: "#1e293b", secondary: "#475569", muted: "#94a3b8" },
-  "#cbd5e1"
-);
-c(
-  "Zinc",
-  {
-    primary: "#71717a",
-    primaryHover: "#52525b",
-    success: "#22c55e",
-    warning: "#eab308",
-    error: "#ef4444",
-    info: "#06b6d4"
-  },
-  { primary: "#fafafa", secondary: "#f4f4f5", tertiary: "#e4e4e7", hover: "#e4e4e7" },
-  { primary: "#18181b", secondary: "#3f3f46", muted: "#a1a1aa" },
-  "#d4d4d8"
-);
-c(
-  "Stone",
-  {
-    primary: "#78716c",
-    primaryHover: "#57534e",
-    success: "#16a34a",
-    warning: "#ca8a04",
-    error: "#dc2626",
-    info: "#0891b2"
-  },
-  { primary: "#fafaf9", secondary: "#f5f5f4", tertiary: "#e7e5e4", hover: "#e7e5e4" },
-  { primary: "#1c1917", secondary: "#44403c", muted: "#a8a29e" },
-  "#d6d3d1"
-);
-c(
-  "Cool Gray",
-  {
-    primary: "#6b7280",
-    primaryHover: "#4b5563",
-    success: "#10b981",
-    warning: "#f59e0b",
-    error: "#ef4444",
-    info: "#3b82f6"
-  },
-  { primary: "#f9fafb", secondary: "#f3f4f6", tertiary: "#e5e7eb", hover: "#e5e7eb" },
-  { primary: "#111827", secondary: "#374151", muted: "#9ca3af" },
-  "#d1d5db"
-);
-c(
-  "Warm Gray",
-  {
-    primary: "#7c7568",
-    primaryHover: "#5c564c",
-    success: "#4d7c0f",
-    warning: "#a16207",
-    error: "#b91c1c",
-    info: "#0e7490"
-  },
-  { primary: "#faf9f7", secondary: "#f5f4f0", tertiary: "#e8e6e1", hover: "#e8e6e1" },
-  { primary: "#1f1d19", secondary: "#4a463d", muted: "#a09888" },
-  "#d4d0c8"
-);
-c(
-  "Silver",
-  {
-    primary: "#94a3b8",
-    primaryHover: "#64748b",
-    success: "#10b981",
-    warning: "#f59e0b",
-    error: "#ef4444",
-    info: "#38bdf8"
-  },
-  { primary: "#f8fafc", secondary: "#f1f5f9", tertiary: "#e2e8f0", hover: "#e2e8f0" },
-  { primary: "#334155", secondary: "#64748b", muted: "#94a3b8" },
-  "#cbd5e1"
-);
-c(
-  "Charcoal",
-  {
-    primary: "#374151",
-    primaryHover: "#1f2937",
-    success: "#059669",
-    warning: "#d97706",
-    error: "#dc2626",
-    info: "#0284c7"
-  },
-  { primary: "#f9fafb", secondary: "#f3f4f6", tertiary: "#e5e7eb", hover: "#e5e7eb" },
-  { primary: "#111827", secondary: "#374151", muted: "#6b7280" },
-  "#d1d5db"
-);
-c(
-  "Ivory",
-  {
-    primary: "#92876d",
-    primaryHover: "#7a6f55",
-    success: "#4d7c0f",
-    warning: "#a16207",
-    error: "#b91c1c",
-    info: "#0e7490"
-  },
-  { primary: "#fffef7", secondary: "#faf6eb", tertiary: "#f0ead6", hover: "#f0ead6" },
-  { primary: "#2b2517", secondary: "#5c5340", muted: "#9c9280" },
-  "#ddd8c4"
-);
-c(
-  "Rose",
-  {
-    primary: "#e11d48",
-    primaryHover: "#be123c",
-    success: "#16a34a",
-    warning: "#ea580c",
-    error: "#dc2626",
-    info: "#0891b2"
-  },
-  { primary: "#fff1f2", secondary: "#ffe4e6", tertiary: "#fecdd3", hover: "#ffe4e6" },
-  { primary: "#4c0519", secondary: "#881337", muted: "#f43f5e" },
-  "#fda4af"
-);
-c(
-  "Emerald",
-  {
-    primary: "#059669",
-    primaryHover: "#047857",
-    success: "#16a34a",
-    warning: "#d97706",
-    error: "#dc2626",
-    info: "#0891b2"
-  },
-  { primary: "#ecfdf5", secondary: "#d1fae5", tertiary: "#a7f3d0", hover: "#d1fae5" },
-  { primary: "#064e3b", secondary: "#065f46", muted: "#34d399" },
-  "#6ee7b7"
-);
-c(
-  "Amber",
-  {
-    primary: "#d97706",
-    primaryHover: "#b45309",
-    success: "#16a34a",
-    warning: "#ca8a04",
-    error: "#dc2626",
-    info: "#0284c7"
-  },
-  { primary: "#fffbeb", secondary: "#fef3c7", tertiary: "#fde68a", hover: "#fef3c7" },
-  { primary: "#451a03", secondary: "#78350f", muted: "#f59e0b" },
-  "#fcd34d"
-);
-c(
-  "Violet",
-  {
-    primary: "#7c3aed",
-    primaryHover: "#6d28d9",
-    success: "#10b981",
-    warning: "#f59e0b",
-    error: "#ef4444",
-    info: "#06b6d4"
-  },
-  { primary: "#f5f3ff", secondary: "#ede9fe", tertiary: "#ddd6fe", hover: "#ede9fe" },
-  { primary: "#2e1065", secondary: "#4c1d95", muted: "#a78bfa" },
-  "#c4b5fd"
-);
-c(
-  "Teal",
-  {
-    primary: "#0d9488",
-    primaryHover: "#0f766e",
-    success: "#16a34a",
-    warning: "#d97706",
-    error: "#dc2626",
-    info: "#0284c7"
-  },
-  { primary: "#f0fdfa", secondary: "#ccfbf1", tertiary: "#99f6e4", hover: "#ccfbf1" },
-  { primary: "#134e4a", secondary: "#115e59", muted: "#2dd4bf" },
-  "#5eead4"
-);
-c(
-  "Indigo",
-  {
-    primary: "#4f46e5",
-    primaryHover: "#4338ca",
-    success: "#10b981",
-    warning: "#f59e0b",
-    error: "#ef4444",
-    info: "#06b6d4"
-  },
-  { primary: "#eef2ff", secondary: "#e0e7ff", tertiary: "#c7d2fe", hover: "#e0e7ff" },
-  { primary: "#1e1b4b", secondary: "#312e81", muted: "#818cf8" },
-  "#a5b4fc"
-);
-c(
-  "Cyan",
-  {
-    primary: "#0891b2",
-    primaryHover: "#0e7490",
-    success: "#10b981",
-    warning: "#f59e0b",
-    error: "#ef4444",
-    info: "#0284c7"
-  },
-  { primary: "#ecfeff", secondary: "#cffafe", tertiary: "#a5f3fc", hover: "#cffafe" },
-  { primary: "#164e63", secondary: "#155e75", muted: "#22d3ee" },
-  "#67e8f9"
-);
-c(
-  "Lime",
-  {
-    primary: "#65a30d",
-    primaryHover: "#4d7c0f",
-    success: "#16a34a",
-    warning: "#ca8a04",
-    error: "#dc2626",
-    info: "#0891b2"
-  },
-  { primary: "#f7fee7", secondary: "#ecfccb", tertiary: "#d9f99d", hover: "#ecfccb" },
-  { primary: "#1a2e05", secondary: "#365314", muted: "#84cc16" },
-  "#bef264"
-);
-c(
-  "Pink",
-  {
-    primary: "#db2777",
-    primaryHover: "#be185d",
-    success: "#10b981",
-    warning: "#f59e0b",
-    error: "#dc2626",
-    info: "#06b6d4"
-  },
-  { primary: "#fdf2f8", secondary: "#fce7f3", tertiary: "#fbcfe8", hover: "#fce7f3" },
-  { primary: "#500724", secondary: "#831843", muted: "#f472b6" },
-  "#f9a8d4"
-);
-c(
-  "Orange",
-  {
-    primary: "#ea580c",
-    primaryHover: "#c2410c",
-    success: "#16a34a",
-    warning: "#ca8a04",
-    error: "#dc2626",
-    info: "#0891b2"
-  },
-  { primary: "#fff7ed", secondary: "#ffedd5", tertiary: "#fed7aa", hover: "#ffedd5" },
-  { primary: "#431407", secondary: "#7c2d12", muted: "#fb923c" },
-  "#fdba74"
-);
-c(
-  "Fuchsia",
-  {
-    primary: "#c026d3",
-    primaryHover: "#a21caf",
-    success: "#10b981",
-    warning: "#eab308",
-    error: "#ef4444",
-    info: "#06b6d4"
-  },
-  { primary: "#fdf4ff", secondary: "#fae8ff", tertiary: "#f5d0fe", hover: "#fae8ff" },
-  { primary: "#4a044e", secondary: "#701a75", muted: "#d946ef" },
-  "#e879f9"
-);
-c(
-  "Sky",
-  {
-    primary: "#0284c7",
-    primaryHover: "#0369a1",
-    success: "#10b981",
-    warning: "#f59e0b",
-    error: "#ef4444",
-    info: "#06b6d4"
-  },
-  { primary: "#f0f9ff", secondary: "#e0f2fe", tertiary: "#bae6fd", hover: "#e0f2fe" },
-  { primary: "#0c4a6e", secondary: "#075985", muted: "#38bdf8" },
-  "#7dd3fc"
-);
-c(
-  "Ruby",
-  {
-    primary: "#be123c",
-    primaryHover: "#9f1239",
-    success: "#059669",
-    warning: "#d97706",
-    error: "#dc2626",
-    info: "#0284c7"
-  },
-  { primary: "#fff1f2", secondary: "#ffe4e6", tertiary: "#fecdd3", hover: "#ffe4e6" },
-  { primary: "#4c0519", secondary: "#881337", muted: "#fb7185" },
-  "#fda4af"
-);
-c(
-  "Coral",
-  {
-    primary: "#f97316",
-    primaryHover: "#ea580c",
-    success: "#10b981",
-    warning: "#eab308",
-    error: "#ef4444",
-    info: "#06b6d4"
-  },
-  { primary: "#fff7ed", secondary: "#ffedd5", tertiary: "#fed7aa", hover: "#ffedd5" },
-  { primary: "#431407", secondary: "#9a3412", muted: "#fb923c" },
-  "#fdba74"
-);
-T(
-  "Midnight",
-  {
-    primary: "#818cf8",
-    primaryHover: "#6366f1",
-    success: "#34d399",
-    warning: "#fbbf24",
-    error: "#f87171",
-    info: "#22d3ee"
-  },
-  { primary: "#020617", secondary: "#0f172a", tertiary: "#1e293b", hover: "#1e293b" },
-  { primary: "#f1f5f9", secondary: "#94a3b8", muted: "#475569" },
-  "#1e293b"
-);
-T(
-  "Obsidian",
-  {
-    primary: "#a78bfa",
-    primaryHover: "#8b5cf6",
-    success: "#4ade80",
-    warning: "#facc15",
-    error: "#fb7185",
-    info: "#38bdf8"
-  },
-  { primary: "#09090b", secondary: "#18181b", tertiary: "#27272a", hover: "#27272a" },
-  { primary: "#fafafa", secondary: "#a1a1aa", muted: "#52525b" },
-  "#3f3f46"
-);
-T(
-  "Eclipse",
-  {
-    primary: "#c084fc",
-    primaryHover: "#a855f7",
-    success: "#34d399",
-    warning: "#fbbf24",
-    error: "#f87171",
-    info: "#67e8f9"
-  },
-  { primary: "#0c0a1d", secondary: "#1a1533", tertiary: "#2a2248", hover: "#2a2248" },
-  { primary: "#f5f3ff", secondary: "#a78bfa", muted: "#6d5eac" },
-  "#3b3266"
-);
-T(
-  "Onyx",
-  {
-    primary: "#60a5fa",
-    primaryHover: "#3b82f6",
-    success: "#4ade80",
-    warning: "#fbbf24",
-    error: "#f87171",
-    info: "#22d3ee"
-  },
-  { primary: "#000000", secondary: "#0a0a0a", tertiary: "#171717", hover: "#171717" },
-  { primary: "#ffffff", secondary: "#a3a3a3", muted: "#525252" },
-  "#262626"
-);
-T(
-  "Carbon",
-  {
-    primary: "#38bdf8",
-    primaryHover: "#0ea5e9",
-    success: "#4ade80",
-    warning: "#facc15",
-    error: "#f87171",
-    info: "#67e8f9"
-  },
-  { primary: "#161616", secondary: "#262626", tertiary: "#393939", hover: "#393939" },
-  { primary: "#f4f4f4", secondary: "#c6c6c6", muted: "#6f6f6f" },
-  "#525252"
-);
-T(
-  "Cosmos",
-  {
-    primary: "#6366f1",
-    primaryHover: "#4f46e5",
-    success: "#34d399",
-    warning: "#fbbf24",
-    error: "#f87171",
-    info: "#22d3ee"
-  },
-  { primary: "#030712", secondary: "#111827", tertiary: "#1f2937", hover: "#1f2937" },
-  { primary: "#e5e7eb", secondary: "#9ca3af", muted: "#4b5563" },
-  "#374151"
-);
-T(
-  "Nebula",
-  {
-    primary: "#e879f9",
-    primaryHover: "#d946ef",
-    success: "#4ade80",
-    warning: "#fbbf24",
-    error: "#fb7185",
-    info: "#67e8f9"
-  },
-  { primary: "#0d0117", secondary: "#1a0533", tertiary: "#2d0a52", hover: "#2d0a52" },
-  { primary: "#fae8ff", secondary: "#d8b4fe", muted: "#7c3aed" },
-  "#581c87"
-);
-T(
-  "Abyss",
-  {
-    primary: "#22d3ee",
-    primaryHover: "#06b6d4",
-    success: "#34d399",
-    warning: "#fbbf24",
-    error: "#f87171",
-    info: "#38bdf8"
-  },
-  { primary: "#001219", secondary: "#002a3a", tertiary: "#003e54", hover: "#003e54" },
-  { primary: "#e0f2fe", secondary: "#7dd3fc", muted: "#0369a1" },
-  "#075985"
-);
-T(
-  "Shadow",
-  {
-    primary: "#a3a3a3",
-    primaryHover: "#737373",
-    success: "#4ade80",
-    warning: "#facc15",
-    error: "#f87171",
-    info: "#38bdf8"
-  },
-  { primary: "#171717", secondary: "#1f1f1f", tertiary: "#2a2a2a", hover: "#2a2a2a" },
-  { primary: "#e5e5e5", secondary: "#a3a3a3", muted: "#525252" },
-  "#404040"
-);
-T(
-  "Emerald Dark",
-  {
-    primary: "#34d399",
-    primaryHover: "#10b981",
-    success: "#4ade80",
-    warning: "#fbbf24",
-    error: "#f87171",
-    info: "#22d3ee"
-  },
-  { primary: "#022c22", secondary: "#064e3b", tertiary: "#065f46", hover: "#065f46" },
-  { primary: "#ecfdf5", secondary: "#6ee7b7", muted: "#047857" },
-  "#047857"
-);
-c(
-  "Forest",
-  {
-    primary: "#166534",
-    primaryHover: "#14532d",
-    success: "#22c55e",
-    warning: "#ca8a04",
-    error: "#dc2626",
-    info: "#0891b2"
-  },
-  { primary: "#f0fdf4", secondary: "#dcfce7", tertiary: "#bbf7d0", hover: "#dcfce7" },
-  { primary: "#052e16", secondary: "#166534", muted: "#4ade80" },
-  "#86efac"
-);
-c(
-  "Ocean",
-  {
-    primary: "#0369a1",
-    primaryHover: "#075985",
-    success: "#059669",
-    warning: "#d97706",
-    error: "#dc2626",
-    info: "#0284c7"
-  },
-  { primary: "#f0f9ff", secondary: "#e0f2fe", tertiary: "#bae6fd", hover: "#e0f2fe" },
-  { primary: "#0c4a6e", secondary: "#0369a1", muted: "#38bdf8" },
-  "#7dd3fc"
-);
-c(
-  "Desert",
-  {
-    primary: "#b45309",
-    primaryHover: "#92400e",
-    success: "#4d7c0f",
-    warning: "#a16207",
-    error: "#b91c1c",
-    info: "#0e7490"
-  },
-  { primary: "#fefce8", secondary: "#fef9c3", tertiary: "#fef08a", hover: "#fef9c3" },
-  { primary: "#422006", secondary: "#713f12", muted: "#ca8a04" },
-  "#fde047"
-);
-c(
-  "Sunset",
-  {
-    primary: "#ea580c",
-    primaryHover: "#c2410c",
-    success: "#16a34a",
-    warning: "#d97706",
-    error: "#dc2626",
-    info: "#0891b2"
-  },
-  { primary: "#fff7ed", secondary: "#ffedd5", tertiary: "#fed7aa", hover: "#ffedd5" },
-  { primary: "#431407", secondary: "#9a3412", muted: "#f97316" },
-  "#fdba74"
-);
-c(
-  "Aurora",
-  {
-    primary: "#0d9488",
-    primaryHover: "#0f766e",
-    success: "#22c55e",
-    warning: "#eab308",
-    error: "#ef4444",
-    info: "#06b6d4"
-  },
-  { primary: "#f0fdfa", secondary: "#ccfbf1", tertiary: "#99f6e4", hover: "#ccfbf1" },
-  { primary: "#134e4a", secondary: "#115e59", muted: "#2dd4bf" },
-  "#5eead4"
-);
-c(
-  "Lavender",
-  {
-    primary: "#7e22ce",
-    primaryHover: "#6b21a8",
-    success: "#16a34a",
-    warning: "#d97706",
-    error: "#dc2626",
-    info: "#0891b2"
-  },
-  { primary: "#faf5ff", secondary: "#f3e8ff", tertiary: "#e9d5ff", hover: "#f3e8ff" },
-  { primary: "#3b0764", secondary: "#581c87", muted: "#a855f7" },
-  "#d8b4fe"
-);
-c(
-  "Autumn",
-  {
-    primary: "#c2410c",
-    primaryHover: "#9a3412",
-    success: "#4d7c0f",
-    warning: "#a16207",
-    error: "#b91c1c",
-    info: "#0e7490"
-  },
-  { primary: "#fef2f2", secondary: "#fee2e2", tertiary: "#fecaca", hover: "#fee2e2" },
-  { primary: "#450a0a", secondary: "#7f1d1d", muted: "#f87171" },
-  "#fca5a5"
-);
-c(
-  "Spring",
-  {
-    primary: "#16a34a",
-    primaryHover: "#15803d",
-    success: "#22c55e",
-    warning: "#eab308",
-    error: "#ef4444",
-    info: "#06b6d4"
-  },
-  { primary: "#f0fdf4", secondary: "#dcfce7", tertiary: "#bbf7d0", hover: "#dcfce7" },
-  { primary: "#14532d", secondary: "#166534", muted: "#4ade80" },
-  "#86efac"
-);
-c(
-  "Arctic",
-  {
-    primary: "#0ea5e9",
-    primaryHover: "#0284c7",
-    success: "#10b981",
-    warning: "#f59e0b",
-    error: "#ef4444",
-    info: "#06b6d4"
-  },
-  { primary: "#f0f9ff", secondary: "#e0f2fe", tertiary: "#bae6fd", hover: "#e0f2fe" },
-  { primary: "#0c4a6e", secondary: "#0369a1", muted: "#7dd3fc" },
-  "#bae6fd"
-);
-c(
-  "Tropical",
-  {
-    primary: "#0d9488",
-    primaryHover: "#0f766e",
-    success: "#16a34a",
-    warning: "#f59e0b",
-    error: "#ef4444",
-    info: "#06b6d4"
-  },
-  { primary: "#ecfdf5", secondary: "#d1fae5", tertiary: "#a7f3d0", hover: "#d1fae5" },
-  { primary: "#064e3b", secondary: "#065f46", muted: "#6ee7b7" },
-  "#a7f3d0"
-);
-c(
-  "Pastel Rose",
-  {
-    primary: "#f472b6",
-    primaryHover: "#ec4899",
-    success: "#4ade80",
-    warning: "#fcd34d",
-    error: "#fb7185",
-    info: "#67e8f9"
-  },
-  { primary: "#fdf2f8", secondary: "#fce7f3", tertiary: "#fbcfe8", hover: "#fce7f3" },
-  { primary: "#831843", secondary: "#9d174d", muted: "#f9a8d4" },
-  "#f9a8d4"
-);
-c(
-  "Pastel Sky",
-  {
-    primary: "#38bdf8",
-    primaryHover: "#0ea5e9",
-    success: "#4ade80",
-    warning: "#fcd34d",
-    error: "#fb7185",
-    info: "#67e8f9"
-  },
-  { primary: "#f0f9ff", secondary: "#e0f2fe", tertiary: "#bae6fd", hover: "#e0f2fe" },
-  { primary: "#075985", secondary: "#0369a1", muted: "#7dd3fc" },
-  "#bae6fd"
-);
-c(
-  "Pastel Mint",
-  {
-    primary: "#34d399",
-    primaryHover: "#10b981",
-    success: "#4ade80",
-    warning: "#fcd34d",
-    error: "#fb7185",
-    info: "#67e8f9"
-  },
-  { primary: "#ecfdf5", secondary: "#d1fae5", tertiary: "#a7f3d0", hover: "#d1fae5" },
-  { primary: "#065f46", secondary: "#047857", muted: "#6ee7b7" },
-  "#a7f3d0"
-);
-c(
-  "Pastel Peach",
-  {
-    primary: "#fb923c",
-    primaryHover: "#f97316",
-    success: "#4ade80",
-    warning: "#fcd34d",
-    error: "#fb7185",
-    info: "#67e8f9"
-  },
-  { primary: "#fff7ed", secondary: "#ffedd5", tertiary: "#fed7aa", hover: "#ffedd5" },
-  { primary: "#7c2d12", secondary: "#9a3412", muted: "#fdba74" },
-  "#fed7aa"
-);
-c(
-  "Pastel Lavender",
-  {
-    primary: "#a78bfa",
-    primaryHover: "#8b5cf6",
-    success: "#4ade80",
-    warning: "#fcd34d",
-    error: "#fb7185",
-    info: "#67e8f9"
-  },
-  { primary: "#f5f3ff", secondary: "#ede9fe", tertiary: "#ddd6fe", hover: "#ede9fe" },
-  { primary: "#4c1d95", secondary: "#5b21b6", muted: "#c4b5fd" },
-  "#ddd6fe"
-);
-c(
-  "Pastel Lemon",
-  {
-    primary: "#facc15",
-    primaryHover: "#eab308",
-    success: "#4ade80",
-    warning: "#fcd34d",
-    error: "#fb7185",
-    info: "#67e8f9"
-  },
-  { primary: "#fefce8", secondary: "#fef9c3", tertiary: "#fef08a", hover: "#fef9c3" },
-  { primary: "#713f12", secondary: "#854d0e", muted: "#fde047" },
-  "#fef08a"
-);
-c(
-  "Pastel Sage",
-  {
-    primary: "#86efac",
-    primaryHover: "#4ade80",
-    success: "#22c55e",
-    warning: "#fcd34d",
-    error: "#fb7185",
-    info: "#67e8f9"
-  },
-  { primary: "#f0fdf4", secondary: "#dcfce7", tertiary: "#bbf7d0", hover: "#dcfce7" },
-  { primary: "#166534", secondary: "#15803d", muted: "#86efac" },
-  "#bbf7d0"
-);
-c(
-  "Pastel Coral",
-  {
-    primary: "#fb7185",
-    primaryHover: "#f43f5e",
-    success: "#4ade80",
-    warning: "#fcd34d",
-    error: "#ef4444",
-    info: "#67e8f9"
-  },
-  { primary: "#fff1f2", secondary: "#ffe4e6", tertiary: "#fecdd3", hover: "#ffe4e6" },
-  { primary: "#881337", secondary: "#9f1239", muted: "#fda4af" },
-  "#fecdd3"
-);
-c(
-  "Banking",
-  {
-    primary: "#1e3a5f",
-    primaryHover: "#152c4a",
-    success: "#059669",
-    warning: "#d97706",
-    error: "#dc2626",
-    info: "#0891b2"
-  },
-  { primary: "#f8fafc", secondary: "#f1f5f9", tertiary: "#e2e8f0", hover: "#e2e8f0" },
-  { primary: "#0f172a", secondary: "#334155", muted: "#94a3b8" },
-  "#cbd5e1"
-);
-c(
-  "Healthcare",
-  {
-    primary: "#0891b2",
-    primaryHover: "#0e7490",
-    success: "#059669",
-    warning: "#d97706",
-    error: "#dc2626",
-    info: "#0284c7"
-  },
-  { primary: "#f0fdfa", secondary: "#e0f7fa", tertiary: "#b2ebf2", hover: "#e0f7fa" },
-  { primary: "#134e4a", secondary: "#1a6b6a", muted: "#80cbc4" },
-  "#b2dfdb"
-);
-c(
-  "Legal",
-  {
-    primary: "#1e293b",
-    primaryHover: "#0f172a",
-    success: "#059669",
-    warning: "#d97706",
-    error: "#dc2626",
-    info: "#0284c7"
-  },
-  { primary: "#fafaf9", secondary: "#f5f5f4", tertiary: "#e7e5e4", hover: "#e7e5e4" },
-  { primary: "#0f172a", secondary: "#44403c", muted: "#a8a29e" },
-  "#d6d3d1"
-);
-c(
-  "Tech Startup",
-  {
-    primary: "#7c3aed",
-    primaryHover: "#6d28d9",
-    success: "#10b981",
-    warning: "#f59e0b",
-    error: "#ef4444",
-    info: "#06b6d4"
-  },
-  { primary: "#faf5ff", secondary: "#f3e8ff", tertiary: "#e9d5ff", hover: "#f3e8ff" },
-  { primary: "#1e1b4b", secondary: "#4c1d95", muted: "#a78bfa" },
-  "#c4b5fd"
-);
-c(
-  "Enterprise",
-  {
-    primary: "#1e40af",
-    primaryHover: "#1e3a8a",
-    success: "#059669",
-    warning: "#d97706",
-    error: "#dc2626",
-    info: "#0891b2"
-  },
-  { primary: "#eff6ff", secondary: "#dbeafe", tertiary: "#bfdbfe", hover: "#dbeafe" },
-  { primary: "#1e3a5f", secondary: "#1e40af", muted: "#60a5fa" },
-  "#93c5fd"
-);
-c(
-  "Government",
-  {
-    primary: "#1d4ed8",
-    primaryHover: "#1e40af",
-    success: "#059669",
-    warning: "#d97706",
-    error: "#dc2626",
-    info: "#0891b2"
-  },
-  { primary: "#f8fafc", secondary: "#f1f5f9", tertiary: "#e2e8f0", hover: "#e2e8f0" },
-  { primary: "#0f172a", secondary: "#1e293b", muted: "#64748b" },
-  "#cbd5e1"
-);
-c(
-  "Education",
-  {
-    primary: "#059669",
-    primaryHover: "#047857",
-    success: "#16a34a",
-    warning: "#f59e0b",
-    error: "#ef4444",
-    info: "#0891b2"
-  },
-  { primary: "#f0fdf9", secondary: "#d1fae5", tertiary: "#a7f3d0", hover: "#d1fae5" },
-  { primary: "#064e3b", secondary: "#065f46", muted: "#6ee7b7" },
-  "#a7f3d0"
-);
-c(
-  "Real Estate",
-  {
-    primary: "#92400e",
-    primaryHover: "#78350f",
-    success: "#059669",
-    warning: "#b45309",
-    error: "#dc2626",
-    info: "#0891b2"
-  },
-  { primary: "#fffbeb", secondary: "#fef3c7", tertiary: "#fde68a", hover: "#fef3c7" },
-  { primary: "#422006", secondary: "#713f12", muted: "#d97706" },
-  "#fcd34d"
-);
-c(
-  "Nord",
-  {
-    primary: "#5e81ac",
-    primaryHover: "#4c6b90",
-    success: "#a3be8c",
-    warning: "#ebcb8b",
-    error: "#bf616a",
-    info: "#88c0d0"
-  },
-  { primary: "#eceff4", secondary: "#e5e9f0", tertiary: "#d8dee9", hover: "#d8dee9" },
-  { primary: "#2e3440", secondary: "#3b4252", muted: "#4c566a" },
-  "#d8dee9"
-);
-T(
-  "Dracula",
-  {
-    primary: "#bd93f9",
-    primaryHover: "#9d79d9",
-    success: "#50fa7b",
-    warning: "#f1fa8c",
-    error: "#ff5555",
-    info: "#8be9fd"
-  },
-  { primary: "#282a36", secondary: "#343746", tertiary: "#44475a", hover: "#44475a" },
-  { primary: "#f8f8f2", secondary: "#c0c0c0", muted: "#6272a4" },
-  "#44475a"
-);
-c(
-  "Solarized Light",
-  {
-    primary: "#268bd2",
-    primaryHover: "#1a6da0",
-    success: "#859900",
-    warning: "#b58900",
-    error: "#dc322f",
-    info: "#2aa198"
-  },
-  { primary: "#fdf6e3", secondary: "#eee8d5", tertiary: "#e0dbc7", hover: "#eee8d5" },
-  { primary: "#073642", secondary: "#586e75", muted: "#93a1a1" },
-  "#eee8d5"
-);
-T(
-  "Solarized Dark",
-  {
-    primary: "#268bd2",
-    primaryHover: "#3d98db",
-    success: "#859900",
-    warning: "#b58900",
-    error: "#dc322f",
-    info: "#2aa198"
-  },
-  { primary: "#002b36", secondary: "#073642", tertiary: "#0a4858", hover: "#073642" },
-  { primary: "#eee8d5", secondary: "#93a1a1", muted: "#586e75" },
-  "#073642"
-);
-T(
-  "Monokai",
-  {
-    primary: "#66d9ef",
-    primaryHover: "#45c0d6",
-    success: "#a6e22e",
-    warning: "#e6db74",
-    error: "#f92672",
-    info: "#66d9ef"
-  },
-  { primary: "#272822", secondary: "#34352e", tertiary: "#3e3d32", hover: "#3e3d32" },
-  { primary: "#f8f8f2", secondary: "#cfcfc2", muted: "#75715e" },
-  "#3e3d32"
-);
-T(
-  "One Dark",
-  {
-    primary: "#61afef",
-    primaryHover: "#4b9ee0",
-    success: "#98c379",
-    warning: "#e5c07b",
-    error: "#e06c75",
-    info: "#56b6c2"
-  },
-  { primary: "#282c34", secondary: "#2c313a", tertiary: "#353b45", hover: "#353b45" },
-  { primary: "#abb2bf", secondary: "#828997", muted: "#545862" },
-  "#3e4452"
-);
-T(
-  "Synthwave",
-  {
-    primary: "#ff7edb",
-    primaryHover: "#e660c2",
-    success: "#72f1b8",
-    warning: "#fede5d",
-    error: "#fe4450",
-    info: "#36f9f6"
-  },
-  { primary: "#241b2f", secondary: "#2d2140", tertiary: "#362a50", hover: "#362a50" },
-  { primary: "#f0e4fc", secondary: "#b4a0cc", muted: "#6c5c84" },
-  "#4a3866"
-);
-c(
-  "Vaporwave",
-  {
-    primary: "#ff71ce",
-    primaryHover: "#e655b5",
-    success: "#78dcca",
-    warning: "#ffb86c",
-    error: "#ff5555",
-    info: "#76e8fc"
-  },
-  { primary: "#fce4f7", secondary: "#e8d0f4", tertiary: "#d4bcf0", hover: "#e8d0f4" },
-  { primary: "#4a1a4e", secondary: "#7b3f7d", muted: "#c080c0" },
-  "#d8a8e8"
-);
-T(
-  "Terminal Green",
-  {
-    primary: "#00ff41",
-    primaryHover: "#00cc34",
-    success: "#00ff41",
-    warning: "#ffff00",
-    error: "#ff0000",
-    info: "#00ffff"
-  },
-  { primary: "#0a0a0a", secondary: "#0d1a0d", tertiary: "#1a2e1a", hover: "#1a2e1a" },
-  { primary: "#00ff41", secondary: "#00cc33", muted: "#008822" },
-  "#003300"
-);
-c(
-  "Sepia",
-  {
-    primary: "#8b6914",
-    primaryHover: "#704f10",
-    success: "#6b8e23",
-    warning: "#cd853f",
-    error: "#b22222",
-    info: "#5f9ea0"
-  },
-  { primary: "#faf0e6", secondary: "#f5e6d3", tertiary: "#eddcc7", hover: "#f5e6d3" },
-  { primary: "#3e2723", secondary: "#5d4037", muted: "#a1887f" },
-  "#d7ccc8"
-);
-c(
-  "Vintage",
-  {
-    primary: "#8d6e63",
-    primaryHover: "#6d4c41",
-    success: "#66bb6a",
-    warning: "#ffb300",
-    error: "#e53935",
-    info: "#29b6f6"
-  },
-  { primary: "#efebe9", secondary: "#d7ccc8", tertiary: "#bcaaa4", hover: "#d7ccc8" },
-  { primary: "#3e2723", secondary: "#5d4037", muted: "#a1887f" },
-  "#bcaaa4"
-);
-T(
-  "Cyberpunk",
-  {
-    primary: "#00f0ff",
-    primaryHover: "#00c8d4",
-    success: "#39ff14",
-    warning: "#ffff00",
-    error: "#ff003c",
-    info: "#bf00ff"
-  },
-  { primary: "#0a0e17", secondary: "#131824", tertiary: "#1c2333", hover: "#1c2333" },
-  { primary: "#e0fbfc", secondary: "#80d4dd", muted: "#3a6b72" },
-  "#1c3a44"
-);
-T(
-  "Neon",
-  {
-    primary: "#ff00ff",
-    primaryHover: "#cc00cc",
-    success: "#00ff00",
-    warning: "#ffff00",
-    error: "#ff0000",
-    info: "#00ffff"
-  },
-  { primary: "#0d0d0d", secondary: "#1a1a1a", tertiary: "#262626", hover: "#262626" },
-  { primary: "#ffffff", secondary: "#cccccc", muted: "#666666" },
-  "#333333"
-);
-T(
-  "Retrowave",
-  {
-    primary: "#f77fbe",
-    primaryHover: "#e462a3",
-    success: "#72f1b8",
-    warning: "#ffe261",
-    error: "#ff4444",
-    info: "#79e8fb"
-  },
-  { primary: "#1b0a2e", secondary: "#261440", tertiary: "#321e52", hover: "#321e52" },
-  { primary: "#ffe6f7", secondary: "#c9a0c9", muted: "#6b4c7a" },
-  "#4a2d66"
-);
-c(
-  "Christmas",
-  {
-    primary: "#c41e3a",
-    primaryHover: "#a01830",
-    success: "#228b22",
-    warning: "#ffd700",
-    error: "#dc2626",
-    info: "#0891b2"
-  },
-  { primary: "#fef2f2", secondary: "#fde8e8", tertiary: "#f8d0d0", hover: "#fde8e8" },
-  { primary: "#3b0a0a", secondary: "#7f1d1d", muted: "#dc6868" },
-  "#e8a0a0"
-);
-T(
-  "Halloween",
-  {
-    primary: "#ff6600",
-    primaryHover: "#e05500",
-    success: "#4ade80",
-    warning: "#fbbf24",
-    error: "#ff0000",
-    info: "#9333ea"
-  },
-  { primary: "#1a0a00", secondary: "#2d1500", tertiary: "#402000", hover: "#402000" },
-  { primary: "#ffedd5", secondary: "#fdba74", muted: "#9a5c28" },
-  "#5c3400"
-);
-c(
-  "Valentine",
-  {
-    primary: "#e11d48",
-    primaryHover: "#be123c",
-    success: "#10b981",
-    warning: "#f59e0b",
-    error: "#dc2626",
-    info: "#ec4899"
-  },
-  { primary: "#fff1f2", secondary: "#ffe4e6", tertiary: "#fecdd3", hover: "#ffe4e6" },
-  { primary: "#4c0519", secondary: "#881337", muted: "#f9a8d4" },
-  "#fda4af"
-);
-c(
-  "Easter",
-  {
-    primary: "#a78bfa",
-    primaryHover: "#8b5cf6",
-    success: "#4ade80",
-    warning: "#fcd34d",
-    error: "#fb7185",
-    info: "#67e8f9"
-  },
-  { primary: "#fef9ff", secondary: "#f3e8ff", tertiary: "#e8d5ff", hover: "#f3e8ff" },
-  { primary: "#581c87", secondary: "#6d28d9", muted: "#c4b5fd" },
-  "#ddd6fe"
-);
-c(
-  "Summer Beach",
-  {
-    primary: "#0ea5e9",
-    primaryHover: "#0284c7",
-    success: "#10b981",
-    warning: "#f59e0b",
-    error: "#ef4444",
-    info: "#06b6d4"
-  },
-  { primary: "#fffbeb", secondary: "#fef3c7", tertiary: "#fde68a", hover: "#fef3c7" },
-  { primary: "#0c4a6e", secondary: "#0369a1", muted: "#7dd3fc" },
-  "#fcd34d"
-);
-c(
-  "Winter Frost",
-  {
-    primary: "#3b82f6",
-    primaryHover: "#2563eb",
-    success: "#10b981",
-    warning: "#f59e0b",
-    error: "#ef4444",
-    info: "#06b6d4"
-  },
-  { primary: "#f0f9ff", secondary: "#e0f2fe", tertiary: "#bae6fd", hover: "#e0f2fe" },
-  { primary: "#1e3a5f", secondary: "#1e40af", muted: "#93c5fd" },
-  "#bfdbfe"
-);
-c(
-  "Cherry Blossom",
-  {
-    primary: "#ec4899",
-    primaryHover: "#db2777",
-    success: "#10b981",
-    warning: "#f59e0b",
-    error: "#ef4444",
-    info: "#06b6d4"
-  },
-  { primary: "#fdf2f8", secondary: "#fce7f3", tertiary: "#fbcfe8", hover: "#fce7f3" },
-  { primary: "#831843", secondary: "#9d174d", muted: "#f9a8d4" },
-  "#fbcfe8"
-);
-c(
-  "Harvest",
-  {
-    primary: "#b45309",
-    primaryHover: "#92400e",
-    success: "#4d7c0f",
-    warning: "#a16207",
-    error: "#b91c1c",
-    info: "#0e7490"
-  },
-  { primary: "#fffbeb", secondary: "#fef3c7", tertiary: "#fde68a", hover: "#fef3c7" },
-  { primary: "#451a03", secondary: "#78350f", muted: "#d97706" },
-  "#fcd34d"
-);
-c(
-  "Japanese Zen",
-  {
-    primary: "#6b7280",
-    primaryHover: "#4b5563",
-    success: "#6b8e23",
-    warning: "#d4a017",
-    error: "#c0392b",
-    info: "#5f9ea0"
-  },
-  { primary: "#faf9f6", secondary: "#f0ece3", tertiary: "#e6e0d4", hover: "#f0ece3" },
-  { primary: "#2c2c2c", secondary: "#5c5c5c", muted: "#a0998a" },
-  "#d5cec0"
-);
-c(
-  "Moroccan",
-  {
-    primary: "#c2410c",
-    primaryHover: "#9a3412",
-    success: "#15803d",
-    warning: "#ca8a04",
-    error: "#b91c1c",
-    info: "#0e7490"
-  },
-  { primary: "#fffbf0", secondary: "#fef3e0", tertiary: "#fde6c4", hover: "#fef3e0" },
-  { primary: "#3a1a00", secondary: "#7c2d12", muted: "#d97706" },
-  "#f5d0a0"
-);
-c(
-  "Scandinavian",
-  {
-    primary: "#4b5563",
-    primaryHover: "#374151",
-    success: "#059669",
-    warning: "#d97706",
-    error: "#dc2626",
-    info: "#0891b2"
-  },
-  { primary: "#ffffff", secondary: "#f9fafb", tertiary: "#f3f4f6", hover: "#f3f4f6" },
-  { primary: "#111827", secondary: "#374151", muted: "#9ca3af" },
-  "#e5e7eb"
-);
-c(
-  "Mediterranean",
-  {
-    primary: "#1e40af",
-    primaryHover: "#1e3a8a",
-    success: "#059669",
-    warning: "#d97706",
-    error: "#dc2626",
-    info: "#0891b2"
-  },
-  { primary: "#eff6ff", secondary: "#dbeafe", tertiary: "#bfdbfe", hover: "#dbeafe" },
-  { primary: "#1e3a5f", secondary: "#2563eb", muted: "#93c5fd" },
-  "#bfdbfe"
-);
-c(
-  "Chinese New Year",
-  {
-    primary: "#dc2626",
-    primaryHover: "#b91c1c",
-    success: "#16a34a",
-    warning: "#d4a017",
-    error: "#ef4444",
-    info: "#0891b2"
-  },
-  { primary: "#fef2f2", secondary: "#fee2e2", tertiary: "#fecaca", hover: "#fee2e2" },
-  { primary: "#450a0a", secondary: "#991b1b", muted: "#f87171" },
-  "#fca5a5"
-);
-c(
-  "Indian Festive",
-  {
-    primary: "#d97706",
-    primaryHover: "#b45309",
-    success: "#16a34a",
-    warning: "#ca8a04",
-    error: "#dc2626",
-    info: "#7c3aed"
-  },
-  { primary: "#fffbeb", secondary: "#fef3c7", tertiary: "#fde68a", hover: "#fef3c7" },
-  { primary: "#451a03", secondary: "#92400e", muted: "#f59e0b" },
-  "#fcd34d"
-);
-c(
-  "Brazilian Carnival",
-  {
-    primary: "#16a34a",
-    primaryHover: "#15803d",
-    success: "#22c55e",
-    warning: "#facc15",
-    error: "#ef4444",
-    info: "#0ea5e9"
-  },
-  { primary: "#f0fdf4", secondary: "#dcfce7", tertiary: "#bbf7d0", hover: "#dcfce7" },
-  { primary: "#052e16", secondary: "#166534", muted: "#4ade80" },
-  "#86efac"
-);
-c(
-  "African Earth",
-  {
-    primary: "#92400e",
-    primaryHover: "#78350f",
-    success: "#4d7c0f",
-    warning: "#a16207",
-    error: "#b91c1c",
-    info: "#0e7490"
-  },
-  { primary: "#faf5f0", secondary: "#f0e6d6", tertiary: "#e6d5bb", hover: "#f0e6d6" },
-  { primary: "#2b1a0e", secondary: "#5c3d1e", muted: "#a08060" },
-  "#d4b896"
-);
-T(
-  "High Contrast Dark",
-  {
-    primary: "#ffff00",
-    primaryHover: "#cccc00",
-    success: "#00ff00",
-    warning: "#ff8c00",
-    error: "#ff0000",
-    info: "#00ffff"
-  },
-  { primary: "#000000", secondary: "#1a1a1a", tertiary: "#333333", hover: "#333333" },
-  { primary: "#ffffff", secondary: "#ffffff", muted: "#cccccc" },
-  "#ffffff"
-);
-c(
-  "Monochrome",
-  {
-    primary: "#404040",
-    primaryHover: "#262626",
-    success: "#4d7c0f",
-    warning: "#a16207",
-    error: "#b91c1c",
-    info: "#0e7490"
-  },
-  { primary: "#fafafa", secondary: "#f0f0f0", tertiary: "#e0e0e0", hover: "#e0e0e0" },
-  { primary: "#1a1a1a", secondary: "#404040", muted: "#808080" },
-  "#c0c0c0"
-);
-c(
-  "Enhanced Contrast",
-  {
-    primary: "#0050b3",
-    primaryHover: "#003d8c",
-    success: "#006400",
-    warning: "#cc7000",
-    error: "#cc0000",
-    info: "#006680"
-  },
-  { primary: "#ffffff", secondary: "#f5f5f5", tertiary: "#ebebeb", hover: "#ebebeb" },
-  { primary: "#000000", secondary: "#1a1a1a", muted: "#595959" },
-  "#8c8c8c"
-);
-c(
-  "Minimalist",
-  {
-    primary: "#18181b",
-    primaryHover: "#27272a",
-    success: "#22c55e",
-    warning: "#eab308",
-    error: "#ef4444",
-    info: "#3b82f6"
-  },
-  { primary: "#ffffff", secondary: "#fafafa", tertiary: "#f5f5f5", hover: "#f5f5f5" },
-  { primary: "#0a0a0a", secondary: "#404040", muted: "#a3a3a3" },
-  "#e5e5e5"
-);
-T(
-  "Warm Dark",
-  {
-    primary: "#f59e0b",
-    primaryHover: "#d97706",
-    success: "#10b981",
-    warning: "#fbbf24",
-    error: "#f87171",
-    info: "#38bdf8"
-  },
-  { primary: "#1c1917", secondary: "#292524", tertiary: "#44403c", hover: "#44403c" },
-  { primary: "#fafaf9", secondary: "#d6d3d1", muted: "#78716c" },
-  "#57534e"
-);
-T(
-  "Soft Dark",
-  {
-    primary: "#a78bfa",
-    primaryHover: "#8b5cf6",
-    success: "#34d399",
-    warning: "#fcd34d",
-    error: "#fb7185",
-    info: "#67e8f9"
-  },
-  { primary: "#1e1e2e", secondary: "#262637", tertiary: "#313147", hover: "#313147" },
-  { primary: "#e8e8f0", secondary: "#a0a0b8", muted: "#5c5c74" },
-  "#3e3e58"
-);
-c(
-  "Coffee",
-  {
-    primary: "#6f4e37",
-    primaryHover: "#5c3d28",
-    success: "#4d7c0f",
-    warning: "#a16207",
-    error: "#b91c1c",
-    info: "#0e7490"
-  },
-  { primary: "#faf6f1", secondary: "#f0e8dc", tertiary: "#e6d8c6", hover: "#f0e8dc" },
-  { primary: "#2c1a0e", secondary: "#5c3d28", muted: "#a08868" },
-  "#d4c4a8"
-);
-c(
-  "Wine",
-  {
-    primary: "#7f1d1d",
-    primaryHover: "#641717",
-    success: "#059669",
-    warning: "#d97706",
-    error: "#dc2626",
-    info: "#0891b2"
-  },
-  { primary: "#fef2f2", secondary: "#fde8e8", tertiary: "#f8d0d0", hover: "#fde8e8" },
-  { primary: "#3b0a0a", secondary: "#7f1d1d", muted: "#dc6868" },
-  "#e8a0a0"
-);
-$(null);
-$(null);
-const Ke = {
-  id: crypto.randomUUID(),
-  name: "Untitled Project",
-  resolution: { width: 1920, height: 1080, label: "1080p" },
-  frameRate: 30,
-  duration: 0,
-  tracks: [
-    {
-      id: "1",
-      type: "video",
-      name: "Video 1",
-      items: [],
-      muted: !1,
-      locked: !1,
-      visible: !0
-    },
-    {
-      id: "2",
-      type: "audio",
-      name: "Audio 1",
-      items: [],
-      muted: !1,
-      locked: !1,
-      visible: !0
-    }
-  ],
-  assets: [],
-  settings: {
-    backgroundColor: "var(--nice-text, #000000)",
-    audio: { sampleRate: 48e3, channels: 2, bitrate: 320 },
-    video: { codec: "h264", bitrate: 8e3, profile: "high" }
-  }
-}, Ge = [
-  { type: "blur", name: "Blur", icon: "🔵" },
-  { type: "brightness", name: "Brightness", icon: "☀️" },
-  { type: "contrast", name: "Contrast", icon: "◐" },
-  { type: "saturation", name: "Saturation", icon: "🎨" },
-  { type: "grayscale", name: "Grayscale", icon: "⬛" },
-  { type: "sepia", name: "Sepia", icon: "🟤" },
-  { type: "chromaKey", name: "Chroma Key", icon: "🟢" },
-  { type: "crop", name: "Crop", icon: "✂️" },
-  { type: "zoom", name: "Zoom", icon: "🔍" }
-], je = [
-  { type: "fade", name: "Fade" },
-  { type: "dissolve", name: "Dissolve" },
-  { type: "wipe", name: "Wipe" },
-  { type: "slide", name: "Slide" },
-  { type: "zoom", name: "Zoom" },
-  { type: "push", name: "Push" }
-], Ze = [
-  {
-    target: ".nice-video-editor",
-    titleKey: "tutorial.videoEditorPro.intro.title",
-    title: "Video editor",
-    contentKey: "tutorial.videoEditorPro.intro.content",
-    content: "Add media to the timeline, arrange and trim clips, apply effects and transitions, then configure and run the export.",
-    placement: "auto"
-  }
-], Xe = ({
-  project: d,
-  onProjectChange: f,
-  onExport: l,
-  onAssetUpload: C,
-  className: H = "",
-  tutorial: I
-}) => {
-  const [p, n] = w(d || Ke), [R, b] = w(
-    "timeline"
-  ), [D, y] = w(null), [x, S] = w(null), [A, _] = w(0), [O, F] = w(!1), [M, Z] = w(1), [K, P] = w(!0), [U, B] = w(null), ie = L(null), te = L(null), z = L(null);
-  re(() => {
-    d && n(d);
-  }, [d]), re(() => () => {
-    z.current && clearInterval(z.current);
-  }, []);
-  const k = me(
-    (t) => {
-      const o = { ...p, ...t };
-      n(o), f == null || f(o);
-    },
-    [p, f]
-  ), N = async (t) => {
-    const o = [];
-    for (const i of Array.from(t)) {
-      const u = i.type.startsWith("video/") ? "video" : i.type.startsWith("audio/") ? "audio" : "image";
-      let h;
-      C ? h = await C(i) : h = {
-        id: crypto.randomUUID(),
-        type: u,
-        name: i.name,
-        url: URL.createObjectURL(i),
-        size: i.size
-      }, o.push(h);
-    }
-    k({ assets: [...p.assets, ...o] });
-  }, W = (t) => {
-    const o = {
-      id: crypto.randomUUID(),
-      type: t,
-      name: `${t.charAt(0).toUpperCase() + t.slice(1)} ${p.tracks.filter((i) => i.type === t).length + 1}`,
-      items: [],
-      muted: !1,
-      locked: !1,
-      visible: !0
-    };
-    k({ tracks: [...p.tracks, o] });
-  }, q = (t) => {
-    k({ tracks: p.tracks.filter((o) => o.id !== t) }), D === t && y(null);
-  }, G = (t) => {
-    k({
-      tracks: p.tracks.map((o) => o.id === t ? { ...o, muted: !o.muted } : o)
-    });
-  }, ee = (t) => {
-    k({
-      tracks: p.tracks.map((o) => o.id === t ? { ...o, locked: !o.locked } : o)
-    });
-  }, E = (t, o) => {
-    const i = p.tracks.find((g) => g.id === t);
-    if (!i || i.locked)
-      return;
-    const u = i.items[i.items.length - 1], h = u ? u.startTime + u.duration : 0, v = {
-      id: crypto.randomUUID(),
-      assetId: o.id,
-      type: o.type,
-      startTime: h,
-      duration: o.duration || 5,
-      offset: 0,
-      properties: {
-        x: 0,
-        y: 0,
-        opacity: 1,
-        scale: 1,
-        volume: 1
-      },
-      effects: [],
-      transitions: []
-    };
-    k({
-      tracks: p.tracks.map(
-        (g) => g.id === t ? { ...g, items: [...g.items, v] } : g
-      )
-    });
-  }, Y = (t, o, i) => {
-    const u = {
-      id: crypto.randomUUID(),
-      type: i,
-      name: i.charAt(0).toUpperCase() + i.slice(1),
-      parameters: ne(i)
-    };
-    k({
-      tracks: p.tracks.map(
-        (h) => h.id === t ? {
-          ...h,
-          items: h.items.map(
-            (v) => v.id === o ? { ...v, effects: [...v.effects, u] } : v
-          )
-        } : h
-      )
-    });
-  }, V = (t, o, i, u) => {
-    const h = {
-      id: crypto.randomUUID(),
-      type: i,
-      duration: 0.5,
-      position: u
-    };
-    k({
-      tracks: p.tracks.map(
-        (v) => v.id === t ? {
-          ...v,
-          items: v.items.map(
-            (g) => g.id === o ? { ...g, transitions: [...g.transitions, h] } : g
-          )
-        } : v
-      )
-    });
-  }, ne = (t) => {
-    switch (t) {
-      case "blur":
-        return { radius: 5 };
-      case "brightness":
-        return { value: 100 };
-      case "contrast":
-        return { value: 100 };
-      case "saturation":
-        return { value: 100 };
-      case "grayscale":
-        return { amount: 100 };
-      case "sepia":
-        return { amount: 100 };
-      case "chromaKey":
-        return { color: "var(--nice-success, #00ff00)", threshold: 40 };
-      case "crop":
-        return { top: 0, right: 0, bottom: 0, left: 0 };
-      case "zoom":
-        return { scale: 1, x: 0, y: 0 };
-      default:
-        return {};
-    }
-  }, se = () => {
-    O ? (z.current && clearInterval(z.current), F(!1)) : (z.current = setInterval(() => {
-      _((t) => {
-        const o = Math.max(
-          ...p.tracks.flatMap((i) => i.items.map((u) => u.startTime + u.duration)),
-          0
-        );
-        return t >= o ? (clearInterval(z.current), F(!1), 0) : t + 1 / p.frameRate;
-      });
-    }, 1e3 / p.frameRate), F(!0));
-  }, J = (t) => {
-    _(Math.max(0, t));
-  }, Q = async () => {
-    if (l) {
-      B(0);
-      try {
-        const t = setInterval(() => {
-          B((o) => o !== null && o < 90 ? o + Math.random() * 10 : o);
-        }, 500);
-        await l(p, p.settings.video.codec), clearInterval(t), B(100), setTimeout(() => B(null), 2e3);
-      } catch (t) {
-        B(null), console.error("Export failed:", t);
-      }
-    }
-  }, ae = (t) => {
-    const o = Math.floor(t / 60), i = Math.floor(t % 60), u = Math.floor(t % 1 * p.frameRate);
-    return `${o.toString().padStart(2, "0")}:${i.toString().padStart(2, "0")}:${u.toString().padStart(2, "0")}`;
-  }, j = () => {
-    for (const t of p.tracks) {
-      const o = t.items.find((i) => i.id === x);
-      if (o)
-        return { track: t, item: o };
-    }
-    return null;
-  }, oe = /* @__PURE__ */ a("header", { className: "video-editor__header", children: [
-    /* @__PURE__ */ a("div", { className: "header__project-info", children: [
-      /* @__PURE__ */ e(
-        "input",
-        {
-          type: "text",
-          value: p.name,
-          onChange: (t) => k({ name: t.target.value }),
-          className: "project-name-input"
-        }
-      ),
-      /* @__PURE__ */ a("span", { className: "project-settings", children: [
-        p.resolution.width,
-        "x",
-        p.resolution.height,
-        " • ",
-        p.frameRate,
-        "fps"
-      ] })
-    ] }),
-    /* @__PURE__ */ e("div", { className: "header__tabs", children: ["timeline", "effects", "transitions", "export"].map((t) => /* @__PURE__ */ e(
-      "button",
-      {
-        className: `tab-button ${R === t ? "tab-button--active" : ""}`,
-        onClick: () => b(t),
-        children: t.charAt(0).toUpperCase() + t.slice(1)
-      },
-      t
-    )) }),
-    /* @__PURE__ */ e("div", { className: "header__actions", children: /* @__PURE__ */ e(
-      "button",
-      {
-        className: "action-button action-button--primary",
-        onClick: Q,
-        disabled: U !== null,
-        children: U !== null ? `Exporting ${Math.round(U)}%` : "Export"
-      }
-    ) })
-  ] }), ce = x && R !== "export" ? (() => {
-    const t = j();
-    if (!t)
-      return null;
-    const { track: o, item: i } = t;
-    return /* @__PURE__ */ a("div", { className: "item-inspector", children: [
-      /* @__PURE__ */ e("h4", { children: "Item Properties" }),
-      /* @__PURE__ */ a("div", { className: "inspector-section", children: [
-        /* @__PURE__ */ a("label", { children: [
-          "Start Time",
-          /* @__PURE__ */ e(
-            "input",
-            {
-              type: "number",
-              step: "0.1",
-              value: i.startTime,
-              onChange: (u) => {
-                const h = parseFloat(u.target.value);
-                k({
-                  tracks: p.tracks.map(
-                    (v) => v.id === o.id ? {
-                      ...v,
-                      items: v.items.map(
-                        (g) => g.id === i.id ? { ...g, startTime: h } : g
-                      )
-                    } : v
-                  )
-                });
-              }
-            }
-          )
-        ] }),
-        /* @__PURE__ */ a("label", { children: [
-          "Duration",
-          /* @__PURE__ */ e(
-            "input",
-            {
-              type: "number",
-              step: "0.1",
-              value: i.duration,
-              onChange: (u) => {
-                const h = parseFloat(u.target.value);
-                k({
-                  tracks: p.tracks.map(
-                    (v) => v.id === o.id ? {
-                      ...v,
-                      items: v.items.map(
-                        (g) => g.id === i.id ? { ...g, duration: h } : g
-                      )
-                    } : v
-                  )
-                });
-              }
-            }
-          )
-        ] }),
-        /* @__PURE__ */ a("label", { children: [
-          "Opacity",
-          /* @__PURE__ */ e(
-            "input",
-            {
-              type: "range",
-              min: "0",
-              max: "1",
-              step: "0.1",
-              value: i.properties.opacity ?? 1,
-              onChange: (u) => {
-                const h = parseFloat(u.target.value);
-                k({
-                  tracks: p.tracks.map(
-                    (v) => v.id === o.id ? {
-                      ...v,
-                      items: v.items.map(
-                        (g) => g.id === i.id ? {
-                          ...g,
-                          properties: { ...g.properties, opacity: h }
-                        } : g
-                      )
-                    } : v
-                  )
-                });
-              }
-            }
-          )
-        ] })
-      ] }),
-      /* @__PURE__ */ a("h4", { children: [
-        "Effects (",
-        i.effects.length,
-        ")"
-      ] }),
-      /* @__PURE__ */ e("div", { className: "effects-list", children: i.effects.map((u) => /* @__PURE__ */ e("div", { className: "effect-badge", children: u.name }, u.id)) })
-    ] });
-  })() : null, r = K ? /* @__PURE__ */ a("aside", { className: "video-editor__asset-library", children: [
-    /* @__PURE__ */ a("div", { className: "asset-library__header", children: [
-      /* @__PURE__ */ e("h3", { children: "Assets" }),
-      /* @__PURE__ */ e("button", { className: "close-button", onClick: () => P(!1), children: "×" })
-    ] }),
-    /* @__PURE__ */ e("div", { className: "asset-library__upload", children: /* @__PURE__ */ a("label", { className: "upload-zone", children: [
-      /* @__PURE__ */ e(
-        "input",
-        {
-          type: "file",
-          multiple: !0,
-          accept: "video/*,audio/*,image/*",
-          onChange: (t) => t.target.files && N(t.target.files),
-          hidden: !0
-        }
-      ),
-      /* @__PURE__ */ e("span", { className: "upload-icon", children: "+" }),
-      /* @__PURE__ */ e("span", { children: "Drop files or click to upload" })
-    ] }) }),
-    /* @__PURE__ */ e("div", { className: "asset-library__list", children: p.assets.map((t) => /* @__PURE__ */ a(
-      "div",
-      {
-        className: "asset-item",
-        draggable: !0,
-        onDragStart: (o) => o.dataTransfer.setData("assetId", t.id),
-        children: [
-          /* @__PURE__ */ e("div", { className: "asset-thumbnail", children: t.thumbnail ? /* @__PURE__ */ e("img", { src: t.thumbnail, alt: t.name }) : /* @__PURE__ */ e("span", { className: "asset-type-icon", children: t.type === "video" ? "🎬" : t.type === "audio" ? "🎵" : "🖼️" }) }),
-          /* @__PURE__ */ a("div", { className: "asset-info", children: [
-            /* @__PURE__ */ e("span", { className: "asset-name", children: t.name }),
-            /* @__PURE__ */ a("span", { className: "asset-meta", children: [
-              (t.size / 1024 / 1024).toFixed(1),
-              "MB"
-            ] })
-          ] })
-        ]
-      },
-      t.id
-    )) })
-  ] }) : void 0, s = /* @__PURE__ */ e("div", { className: "video-editor__preview-area", children: /* @__PURE__ */ a("div", { className: "preview-container", children: [
-    /* @__PURE__ */ a(
-      "div",
-      {
-        className: "preview-canvas",
-        style: { aspectRatio: `${p.resolution.width}/${p.resolution.height}` },
-        children: [
-          /* @__PURE__ */ e("video", { ref: te, className: "preview-video" }),
-          /* @__PURE__ */ e("div", { className: "preview-overlay", children: !K && /* @__PURE__ */ e("button", { className: "toggle-library-button", onClick: () => P(!0), children: "📁" }) })
-        ]
-      }
-    ),
-    /* @__PURE__ */ a("div", { className: "playback-controls", children: [
-      /* @__PURE__ */ e("button", { onClick: () => J(0), children: "⏮️" }),
-      /* @__PURE__ */ e("button", { onClick: () => J(A - 1 / p.frameRate), children: "⏪" }),
-      /* @__PURE__ */ e("button", { onClick: se, className: "play-button", children: O ? "⏸️" : "▶️" }),
-      /* @__PURE__ */ e("button", { onClick: () => J(A + 1 / p.frameRate), children: "⏩" }),
-      /* @__PURE__ */ e("span", { className: "time-display", children: ae(A) })
-    ] })
-  ] }) }), m = /* @__PURE__ */ a("div", { className: "video-editor__panel", children: [
-    R === "timeline" && /* @__PURE__ */ a("div", { className: "timeline-panel", children: [
-      /* @__PURE__ */ a("div", { className: "timeline-toolbar", children: [
-        /* @__PURE__ */ a("div", { className: "track-buttons", children: [
-          /* @__PURE__ */ e("button", { onClick: () => W("video"), children: "+ Video Track" }),
-          /* @__PURE__ */ e("button", { onClick: () => W("audio"), children: "+ Audio Track" }),
-          /* @__PURE__ */ e("button", { onClick: () => W("text"), children: "+ Text Track" })
-        ] }),
-        /* @__PURE__ */ a("div", { className: "zoom-controls", children: [
-          /* @__PURE__ */ e("button", { onClick: () => Z(Math.max(0.25, M - 0.25)), children: "-" }),
-          /* @__PURE__ */ a("span", { children: [
-            Math.round(M * 100),
-            "%"
-          ] }),
-          /* @__PURE__ */ e("button", { onClick: () => Z(Math.min(4, M + 0.25)), children: "+" })
-        ] })
-      ] }),
-      /* @__PURE__ */ a("div", { className: "timeline-container", ref: ie, children: [
-        /* @__PURE__ */ e("div", { className: "timeline-ruler", children: Array.from({ length: Math.ceil(30 / M) }).map((t, o) => /* @__PURE__ */ e("div", { className: "ruler-mark", style: { left: `${o * 50 * M}px` }, children: ae(o) }, o)) }),
-        /* @__PURE__ */ e("div", { className: "timeline-playhead", style: { left: `${A * 50 * M}px` } }),
-        /* @__PURE__ */ e("div", { className: "timeline-tracks", children: p.tracks.map((t) => /* @__PURE__ */ a(
-          "div",
-          {
-            className: `timeline-track ${D === t.id ? "timeline-track--selected" : ""} ${t.locked ? "timeline-track--locked" : ""}`,
-            onClick: () => y(t.id),
-            onDrop: (o) => {
-              o.preventDefault();
-              const i = o.dataTransfer.getData("assetId"), u = p.assets.find((h) => h.id === i);
-              u && E(t.id, u);
-            },
-            onDragOver: (o) => o.preventDefault(),
-            children: [
-              /* @__PURE__ */ a("div", { className: "track-header", children: [
-                /* @__PURE__ */ e("span", { className: "track-name", children: t.name }),
-                /* @__PURE__ */ a("div", { className: "track-controls", children: [
-                  /* @__PURE__ */ e(
-                    "button",
-                    {
-                      className: t.muted ? "active" : "",
-                      onClick: (o) => {
-                        o.stopPropagation(), G(t.id);
-                      },
-                      children: t.muted ? "🔇" : "🔊"
-                    }
-                  ),
-                  /* @__PURE__ */ e(
-                    "button",
-                    {
-                      className: t.locked ? "active" : "",
-                      onClick: (o) => {
-                        o.stopPropagation(), ee(t.id);
-                      },
-                      children: t.locked ? "🔒" : "🔓"
-                    }
-                  ),
-                  /* @__PURE__ */ e(
-                    "button",
-                    {
-                      onClick: (o) => {
-                        o.stopPropagation(), q(t.id);
-                      },
-                      children: "🗑️"
-                    }
-                  )
-                ] })
-              ] }),
-              /* @__PURE__ */ e("div", { className: "track-items", children: t.items.map((o) => {
-                const i = p.assets.find((u) => u.id === o.assetId);
-                return /* @__PURE__ */ a(
-                  "div",
-                  {
-                    className: `track-item track-item--${o.type} ${x === o.id ? "track-item--selected" : ""}`,
-                    style: {
-                      left: `${o.startTime * 50 * M}px`,
-                      width: `${o.duration * 50 * M}px`
-                    },
-                    onClick: (u) => {
-                      u.stopPropagation(), S(o.id);
-                    },
-                    children: [
-                      /* @__PURE__ */ e("span", { className: "item-name", children: (i == null ? void 0 : i.name) || "Untitled" }),
-                      o.transitions.length > 0 && /* @__PURE__ */ e("span", { className: "item-transitions", children: "✨" }),
-                      o.effects.length > 0 && /* @__PURE__ */ e("span", { className: "item-effects", children: "🎨" })
-                    ]
-                  },
-                  o.id
-                );
-              }) })
-            ]
-          },
-          t.id
-        )) })
-      ] })
-    ] }),
-    R === "effects" && /* @__PURE__ */ a("div", { className: "effects-panel", children: [
-      /* @__PURE__ */ e("h3", { children: "Video Effects" }),
-      /* @__PURE__ */ e("p", { className: "panel-hint", children: "Select a clip to apply effects" }),
-      /* @__PURE__ */ e("div", { className: "effects-grid", children: Ge.map((t) => /* @__PURE__ */ a(
-        "button",
-        {
-          className: "effect-preset",
-          disabled: !x,
-          onClick: () => {
-            const o = j();
-            o && Y(o.track.id, o.item.id, t.type);
-          },
-          children: [
-            /* @__PURE__ */ e("span", { className: "effect-icon", children: t.icon }),
-            /* @__PURE__ */ e("span", { className: "effect-name", children: t.name })
-          ]
-        },
-        t.type
-      )) })
-    ] }),
-    R === "transitions" && /* @__PURE__ */ a("div", { className: "transitions-panel", children: [
-      /* @__PURE__ */ e("h3", { children: "Transitions" }),
-      /* @__PURE__ */ e("p", { className: "panel-hint", children: "Select a clip and add transitions between clips" }),
-      /* @__PURE__ */ e("div", { className: "transitions-grid", children: je.map((t) => /* @__PURE__ */ a("div", { className: "transition-preset", children: [
-        /* @__PURE__ */ e("span", { className: "transition-name", children: t.name }),
-        /* @__PURE__ */ a("div", { className: "transition-buttons", children: [
-          /* @__PURE__ */ e(
-            "button",
-            {
-              disabled: !x,
-              onClick: () => {
-                const o = j();
-                o && V(o.track.id, o.item.id, t.type, "start");
-              },
-              children: "In"
-            }
-          ),
-          /* @__PURE__ */ e(
-            "button",
-            {
-              disabled: !x,
-              onClick: () => {
-                const o = j();
-                o && V(o.track.id, o.item.id, t.type, "end");
-              },
-              children: "Out"
-            }
-          )
-        ] })
-      ] }, t.type)) })
-    ] }),
-    R === "export" && /* @__PURE__ */ a("div", { className: "export-panel", children: [
-      /* @__PURE__ */ e("h3", { children: "Export Settings" }),
-      /* @__PURE__ */ a("div", { className: "export-settings", children: [
-        /* @__PURE__ */ a("div", { className: "setting-group", children: [
-          /* @__PURE__ */ e("label", { children: "Resolution" }),
-          /* @__PURE__ */ a(
-            "select",
-            {
-              value: `${p.resolution.width}x${p.resolution.height}`,
-              onChange: (t) => {
-                const [o, i] = t.target.value.split("x").map(Number);
-                k({ resolution: { width: o, height: i } });
-              },
-              children: [
-                /* @__PURE__ */ e("option", { value: "1920x1080", children: "1080p (1920x1080)" }),
-                /* @__PURE__ */ e("option", { value: "2560x1440", children: "1440p (2560x1440)" }),
-                /* @__PURE__ */ e("option", { value: "3840x2160", children: "4K (3840x2160)" }),
-                /* @__PURE__ */ e("option", { value: "1280x720", children: "720p (1280x720)" })
-              ]
-            }
-          )
-        ] }),
-        /* @__PURE__ */ a("div", { className: "setting-group", children: [
-          /* @__PURE__ */ e("label", { children: "Frame Rate" }),
-          /* @__PURE__ */ a(
-            "select",
-            {
-              value: p.frameRate,
-              onChange: (t) => k({ frameRate: parseInt(t.target.value) }),
-              children: [
-                /* @__PURE__ */ e("option", { value: "24", children: "24 fps" }),
-                /* @__PURE__ */ e("option", { value: "30", children: "30 fps" }),
-                /* @__PURE__ */ e("option", { value: "60", children: "60 fps" }),
-                /* @__PURE__ */ e("option", { value: "120", children: "120 fps" })
-              ]
-            }
-          )
-        ] }),
-        /* @__PURE__ */ a("div", { className: "setting-group", children: [
-          /* @__PURE__ */ e("label", { children: "Video Codec" }),
-          /* @__PURE__ */ a(
-            "select",
-            {
-              value: p.settings.video.codec,
-              onChange: (t) => k({
-                settings: {
-                  ...p.settings,
-                  video: {
-                    ...p.settings.video,
-                    codec: t.target.value
-                  }
-                }
-              }),
-              children: [
-                /* @__PURE__ */ e("option", { value: "h264", children: "H.264 (Best Compatibility)" }),
-                /* @__PURE__ */ e("option", { value: "h265", children: "H.265/HEVC (Smaller Size)" }),
-                /* @__PURE__ */ e("option", { value: "vp9", children: "VP9 (Web Optimized)" }),
-                /* @__PURE__ */ e("option", { value: "av1", children: "AV1 (Future Standard)" })
-              ]
-            }
-          )
-        ] }),
-        /* @__PURE__ */ a("div", { className: "setting-group", children: [
-          /* @__PURE__ */ e("label", { children: "Video Bitrate (Mbps)" }),
-          /* @__PURE__ */ e(
-            "input",
-            {
-              type: "number",
-              value: p.settings.video.bitrate / 1e3,
-              onChange: (t) => k({
-                settings: {
-                  ...p.settings,
-                  video: {
-                    ...p.settings.video,
-                    bitrate: parseFloat(t.target.value) * 1e3
-                  }
-                }
-              }),
-              min: "1",
-              max: "100"
-            }
-          )
-        ] })
-      ] }),
-      /* @__PURE__ */ e(
-        "button",
-        {
-          className: "export-button",
-          onClick: Q,
-          disabled: U !== null,
-          children: U !== null ? `Exporting... ${Math.round(U)}%` : "Export Video"
-        }
-      ),
-      U !== null && /* @__PURE__ */ e("div", { className: "export-progress", children: /* @__PURE__ */ e("div", { className: "export-progress-bar", style: { width: `${U}%` } }) })
-    ] })
-  ] });
-  return /* @__PURE__ */ a(
-    he,
-    {
-      flush: !0,
-      className: `nice-video-editor ${H}`,
-      height: "100%",
-      style: { position: "relative", minHeight: 600 },
-      toolbar: oe,
-      sidebar: r,
-      rightSidebar: ce ?? void 0,
-      bottomPanel: m,
-      children: [
-        /* @__PURE__ */ e("span", { style: { position: "absolute", top: 6, right: 6, zIndex: 30 }, children: /* @__PURE__ */ e(Oe, { steps: Le(I, Ze) }) }),
-        s
-      ]
-    }
-  );
-}, qe = {
-  video: {
-    source: "screen",
-    showCursor: !0,
-    frameRate: 30,
-    resolution: { width: 1920, height: 1080 }
-  },
-  audio: {
-    enabled: !0,
-    source: "both",
-    echoCancellation: !0,
-    noiseSuppression: !0
-  },
-  output: {
-    format: "webm",
-    quality: "high"
-  }
-}, ea = ({
-  options: d,
-  onRecordingStart: f,
-  onRecordingStop: l,
-  onRecordingPause: C,
-  onRecordingResume: H,
-  onError: I,
-  className: p = ""
-}) => {
-  var t, o;
-  const [n, R] = w({
-    ...qe,
-    ...d
-  }), [b, D] = w(null), [y, x] = w("idle"), [S, A] = w([]), [_, O] = w(null), [F, M] = w(null), [Z, K] = w(!1), [P, U] = w(!1), [B, ie] = w(
-    "pen"
-  ), [te, z] = w("var(--nice-danger, #ff0000)"), k = L(null), N = L([]), W = L(null), q = L(null), G = L(null), ee = L(0);
-  re(() => () => {
-    _ && _.getTracks().forEach((i) => i.stop()), G.current && clearInterval(G.current);
-  }, [_]);
-  const E = (i) => {
-    R((u) => ({
-      ...u,
-      ...i,
-      video: { ...u.video, ...i.video },
-      audio: { ...u.audio, ...i.audio },
-      output: { ...u.output, ...i.output }
-    }));
-  }, Y = async () => {
-    try {
-      x("preparing");
-      const i = {
-        video: {
-          cursor: n.video.showCursor ? "always" : "never",
-          frameRate: n.video.frameRate
-        },
-        audio: n.audio.source === "system" || n.audio.source === "both"
-      }, u = await navigator.mediaDevices.getDisplayMedia(i);
-      if (n.audio.enabled && (n.audio.source === "microphone" || n.audio.source === "both"))
-        try {
-          (await navigator.mediaDevices.getUserMedia({
-            audio: {
-              echoCancellation: n.audio.echoCancellation,
-              noiseSuppression: n.audio.noiseSuppression
-            }
-          })).getAudioTracks().forEach((v) => u.addTrack(v));
-        } catch (h) {
-          console.warn("Could not access microphone:", h);
-        }
-      O(u), W.current && (W.current.srcObject = u, W.current.play()), x("idle");
-    } catch (i) {
-      x("error"), I == null || I(i instanceof Error ? i : new Error("Failed to start preview"));
-    }
-  }, V = async () => {
-    _ || await Y();
-    for (let i = 3; i > 0; i--)
-      M(i), await new Promise((u) => setTimeout(u, 1e3));
-    M(null);
-    try {
-      const i = _ || await ne();
-      if (!i)
-        throw new Error("No stream available");
-      const u = oe(n.output.format), h = new MediaRecorder(i, {
-        mimeType: u,
-        videoBitsPerSecond: ce(n.output.quality)
-      });
-      N.current = [], h.ondataavailable = (g) => {
-        g.data.size > 0 && N.current.push(g.data);
-      }, h.onstop = () => {
-        const g = new Blob(N.current, { type: u });
-        b && (l == null || l({ ...b, status: "stopped" }, g));
-      }, k.current = h, h.start(1e3), ee.current = Date.now();
-      const v = {
-        id: crypto.randomUUID(),
-        status: "recording",
-        startTime: /* @__PURE__ */ new Date(),
-        duration: 0,
-        size: 0,
-        options: n,
-        chunks: []
-      };
-      D(v), x("recording"), f == null || f(v), G.current = setInterval(() => {
-        D(
-          (g) => g ? {
-            ...g,
-            duration: (Date.now() - ee.current) / 1e3,
-            size: N.current.reduce((Ce, Se) => Ce + Se.size, 0)
-          } : null
-        );
-      }, 100);
-    } catch (i) {
-      x("error"), I == null || I(i instanceof Error ? i : new Error("Failed to start recording"));
-    }
-  }, ne = async () => (await Y(), _), se = () => {
-    k.current && y === "recording" && (k.current.pause(), x("paused"), C == null || C());
-  }, J = () => {
-    k.current && y === "paused" && (k.current.resume(), x("recording"), H == null || H());
-  }, Q = () => {
-    G.current && clearInterval(G.current), k.current && (y === "recording" || y === "paused") && (k.current.stop(), x("stopped")), _ && (_.getTracks().forEach((i) => i.stop()), O(null));
-  }, ae = me(
-    (i) => {
-      if (y !== "recording")
-        return;
-      const u = {
-        id: crypto.randomUUID(),
-        time: (b == null ? void 0 : b.duration) || 0,
-        label: i || `Marker ${S.length + 1}`,
-        color: r()
-      };
-      A((h) => [...h, u]);
-    },
-    [y, b == null ? void 0 : b.duration, S.length]
-  ), j = (i) => {
-    A((u) => u.filter((h) => h.id !== i));
-  }, oe = (i) => {
-    switch (i) {
-      case "mp4":
-        return "video/mp4";
-      case "mkv":
-        return "video/x-matroska";
-      default:
-        return "video/webm;codecs=vp9";
-    }
-  }, ce = (i) => {
-    switch (i) {
-      case "low":
-        return 25e5;
-      case "medium":
-        return 5e6;
-      case "lossless":
-        return 2e7;
-      default:
-        return 8e6;
-    }
-  }, r = () => {
-    const i = ["var(--nice-danger, #ff4444)", "#44ff44", "#4444ff", "#ffff44", "#ff44ff", "#44ffff"];
-    return i[Math.floor(Math.random() * i.length)];
-  }, s = (i) => {
-    const u = Math.floor(i / 3600), h = Math.floor(i % 3600 / 60), v = Math.floor(i % 60), g = Math.floor(i % 1 * 100);
-    return u > 0 ? `${u}:${h.toString().padStart(2, "0")}:${v.toString().padStart(2, "0")}` : `${h.toString().padStart(2, "0")}:${v.toString().padStart(2, "0")}.${g.toString().padStart(2, "0")}`;
-  }, m = (i) => i < 1024 ? `${i} B` : i < 1024 * 1024 ? `${(i / 1024).toFixed(1)} KB` : `${(i / 1024 / 1024).toFixed(1)} MB`;
-  return /* @__PURE__ */ a("div", { className: `nice-screen-recorder ${p}`, children: [
-    /* @__PURE__ */ a("div", { className: "recorder__preview", children: [
-      F !== null && /* @__PURE__ */ e("div", { className: "countdown-overlay", children: /* @__PURE__ */ e("span", { className: "countdown-number", children: F }) }),
-      /* @__PURE__ */ e("video", { ref: W, className: "preview-video", muted: !0, playsInline: !0 }),
-      P && /* @__PURE__ */ e("canvas", { ref: q, className: "annotation-canvas" }),
-      !_ && y === "idle" && /* @__PURE__ */ e("div", { className: "preview-placeholder", children: /* @__PURE__ */ a("button", { className: "start-preview-button", onClick: Y, children: [
-        /* @__PURE__ */ e("span", { className: "icon", children: "🖥️" }),
-        /* @__PURE__ */ e("span", { children: "Select Screen to Record" })
-      ] }) }),
-      y === "recording" && /* @__PURE__ */ a("div", { className: "recording-indicator", children: [
-        /* @__PURE__ */ e("span", { className: "recording-dot" }),
-        /* @__PURE__ */ e("span", { children: "REC" })
-      ] })
-    ] }),
-    /* @__PURE__ */ a("div", { className: "recorder__controls", children: [
-      /* @__PURE__ */ a("div", { className: "controls__main", children: [
-        y === "idle" && /* @__PURE__ */ a(
-          "button",
-          {
-            className: "control-button control-button--record",
-            onClick: V,
-            disabled: !!F,
-            children: [
-              /* @__PURE__ */ e("span", { className: "icon", children: "⏺️" }),
-              /* @__PURE__ */ e("span", { children: "Start Recording" })
-            ]
-          }
-        ),
-        y === "recording" && /* @__PURE__ */ a(le, { children: [
-          /* @__PURE__ */ a("button", { className: "control-button control-button--pause", onClick: se, children: [
-            /* @__PURE__ */ e("span", { className: "icon", children: "⏸️" }),
-            /* @__PURE__ */ e("span", { children: "Pause" })
-          ] }),
-          /* @__PURE__ */ a("button", { className: "control-button control-button--stop", onClick: Q, children: [
-            /* @__PURE__ */ e("span", { className: "icon", children: "⏹️" }),
-            /* @__PURE__ */ e("span", { children: "Stop" })
-          ] })
-        ] }),
-        y === "paused" && /* @__PURE__ */ a(le, { children: [
-          /* @__PURE__ */ a("button", { className: "control-button control-button--resume", onClick: J, children: [
-            /* @__PURE__ */ e("span", { className: "icon", children: "▶️" }),
-            /* @__PURE__ */ e("span", { children: "Resume" })
-          ] }),
-          /* @__PURE__ */ a("button", { className: "control-button control-button--stop", onClick: Q, children: [
-            /* @__PURE__ */ e("span", { className: "icon", children: "⏹️" }),
-            /* @__PURE__ */ e("span", { children: "Stop" })
-          ] })
-        ] }),
-        y === "stopped" && /* @__PURE__ */ a(
-          "button",
-          {
-            className: "control-button control-button--new",
-            onClick: () => {
-              x("idle"), D(null), A([]);
-            },
-            children: [
-              /* @__PURE__ */ e("span", { className: "icon", children: "🔄" }),
-              /* @__PURE__ */ e("span", { children: "New Recording" })
-            ]
-          }
-        )
-      ] }),
-      /* @__PURE__ */ a("div", { className: "controls__secondary", children: [
-        (y === "recording" || y === "paused") && /* @__PURE__ */ a("button", { className: "control-button control-button--marker", onClick: () => ae(), children: [
-          /* @__PURE__ */ e("span", { className: "icon", children: "🚩" }),
-          /* @__PURE__ */ e("span", { children: "Add Marker" })
-        ] }),
-        /* @__PURE__ */ a(
-          "button",
-          {
-            className: `control-button ${P ? "control-button--active" : ""}`,
-            onClick: () => U(!P),
-            disabled: y !== "recording",
-            children: [
-              /* @__PURE__ */ e("span", { className: "icon", children: "✏️" }),
-              /* @__PURE__ */ e("span", { children: "Annotate" })
-            ]
-          }
-        ),
-        /* @__PURE__ */ e(
-          "button",
-          {
-            className: "control-button control-button--settings",
-            onClick: () => K(!Z),
-            disabled: y === "recording",
-            children: /* @__PURE__ */ e("span", { className: "icon", children: "⚙️" })
-          }
-        )
-      ] })
-    ] }),
-    /* @__PURE__ */ a("div", { className: "recorder__status", children: [
-      /* @__PURE__ */ a("div", { className: "status__info", children: [
-        /* @__PURE__ */ a("span", { className: "status-item", children: [
-          /* @__PURE__ */ e("strong", { children: "Duration:" }),
-          " ",
-          s((b == null ? void 0 : b.duration) || 0)
-        ] }),
-        /* @__PURE__ */ a("span", { className: "status-item", children: [
-          /* @__PURE__ */ e("strong", { children: "Size:" }),
-          " ",
-          m((b == null ? void 0 : b.size) || 0)
-        ] }),
-        /* @__PURE__ */ a("span", { className: "status-item", children: [
-          /* @__PURE__ */ e("strong", { children: "Markers:" }),
-          " ",
-          S.length
-        ] })
-      ] }),
-      /* @__PURE__ */ a("div", { className: "status__quality", children: [
-        n.video.resolution && /* @__PURE__ */ a("span", { children: [
-          n.video.resolution.width,
-          "x",
-          n.video.resolution.height
-        ] }),
-        /* @__PURE__ */ a("span", { children: [
-          n.video.frameRate,
-          "fps"
-        ] }),
-        /* @__PURE__ */ e("span", { className: n.audio.enabled ? "audio-on" : "audio-off", children: n.audio.enabled ? "🔊" : "🔇" })
-      ] })
-    ] }),
-    P && y === "recording" && /* @__PURE__ */ a("div", { className: "recorder__annotation-tools", children: [
-      /* @__PURE__ */ e("div", { className: "tool-group", children: ["pen", "arrow", "rectangle", "text"].map((i) => /* @__PURE__ */ a(
-        "button",
-        {
-          className: `tool-button ${B === i ? "tool-button--active" : ""}`,
-          onClick: () => ie(i),
-          children: [
-            i === "pen" && "✏️",
-            i === "arrow" && "➡️",
-            i === "rectangle" && "⬜",
-            i === "text" && "T"
-          ]
-        },
-        i
-      )) }),
-      /* @__PURE__ */ e("div", { className: "color-group", children: ["var(--nice-danger, #ff0000)", "var(--nice-success, #00ff00)", "var(--nice-primary, #0000ff)", "var(--nice-warning, #ffff00)", "var(--nice-bg, #fff)", "var(--nice-text, #000000)"].map((i) => /* @__PURE__ */ e(
-        "button",
-        {
-          className: `color-button ${te === i ? "color-button--active" : ""}`,
-          style: { backgroundColor: i },
-          onClick: () => z(i)
-        },
-        i
-      )) })
-    ] }),
-    S.length > 0 && /* @__PURE__ */ a("div", { className: "recorder__markers", children: [
-      /* @__PURE__ */ e("h4", { children: "Markers" }),
-      /* @__PURE__ */ e("div", { className: "markers-list", children: S.map((i) => /* @__PURE__ */ a(
-        "div",
-        {
-          className: "marker-item",
-          style: { borderLeftColor: i.color },
-          children: [
-            /* @__PURE__ */ e("span", { className: "marker-time", children: s(i.time) }),
-            /* @__PURE__ */ e(
-              "input",
-              {
-                type: "text",
-                value: i.label,
-                onChange: (u) => {
-                  A(
-                    (h) => h.map((v) => v.id === i.id ? { ...v, label: u.target.value } : v)
-                  );
-                },
-                className: "marker-label"
-              }
-            ),
-            /* @__PURE__ */ e("button", { className: "marker-remove", onClick: () => j(i.id), children: "×" })
-          ]
-        },
-        i.id
-      )) })
-    ] }),
-    Z && /* @__PURE__ */ a("div", { className: "recorder__settings", children: [
-      /* @__PURE__ */ a("div", { className: "settings-header", children: [
-        /* @__PURE__ */ e("h3", { children: "Recording Settings" }),
-        /* @__PURE__ */ e("button", { className: "close-button", onClick: () => K(!1), children: "×" })
-      ] }),
-      /* @__PURE__ */ a("div", { className: "settings-section", children: [
-        /* @__PURE__ */ e("h4", { children: "Video" }),
-        /* @__PURE__ */ a("label", { children: [
-          "Source",
-          /* @__PURE__ */ a(
-            "select",
-            {
-              value: n.video.source,
-              onChange: (i) => E({
-                video: {
-                  ...n.video,
-                  source: i.target.value
-                }
-              }),
-              children: [
-                /* @__PURE__ */ e("option", { value: "screen", children: "Entire Screen" }),
-                /* @__PURE__ */ e("option", { value: "window", children: "Application Window" }),
-                /* @__PURE__ */ e("option", { value: "tab", children: "Browser Tab" }),
-                /* @__PURE__ */ e("option", { value: "camera", children: "Camera" })
-              ]
-            }
-          )
-        ] }),
-        /* @__PURE__ */ a("label", { children: [
-          "Resolution",
-          /* @__PURE__ */ a(
-            "select",
-            {
-              value: `${(t = n.video.resolution) == null ? void 0 : t.width}x${(o = n.video.resolution) == null ? void 0 : o.height}`,
-              onChange: (i) => {
-                const [u, h] = i.target.value.split("x").map(Number);
-                E({
-                  video: { ...n.video, resolution: { width: u, height: h } }
-                });
-              },
-              children: [
-                /* @__PURE__ */ e("option", { value: "1920x1080", children: "1080p (1920x1080)" }),
-                /* @__PURE__ */ e("option", { value: "2560x1440", children: "1440p (2560x1440)" }),
-                /* @__PURE__ */ e("option", { value: "3840x2160", children: "4K (3840x2160)" }),
-                /* @__PURE__ */ e("option", { value: "1280x720", children: "720p (1280x720)" })
-              ]
-            }
-          )
-        ] }),
-        /* @__PURE__ */ a("label", { children: [
-          "Frame Rate",
-          /* @__PURE__ */ a(
-            "select",
-            {
-              value: n.video.frameRate,
-              onChange: (i) => E({
-                video: { ...n.video, frameRate: parseInt(i.target.value) }
-              }),
-              children: [
-                /* @__PURE__ */ e("option", { value: "15", children: "15 fps" }),
-                /* @__PURE__ */ e("option", { value: "24", children: "24 fps" }),
-                /* @__PURE__ */ e("option", { value: "30", children: "30 fps" }),
-                /* @__PURE__ */ e("option", { value: "60", children: "60 fps" })
-              ]
-            }
-          )
-        ] }),
-        /* @__PURE__ */ a("label", { className: "checkbox-label", children: [
-          /* @__PURE__ */ e(
-            "input",
-            {
-              type: "checkbox",
-              checked: n.video.showCursor,
-              onChange: (i) => E({
-                video: { ...n.video, showCursor: i.target.checked }
-              })
-            }
-          ),
-          "Show Cursor"
-        ] })
-      ] }),
-      /* @__PURE__ */ a("div", { className: "settings-section", children: [
-        /* @__PURE__ */ e("h4", { children: "Audio" }),
-        /* @__PURE__ */ a("label", { className: "checkbox-label", children: [
-          /* @__PURE__ */ e(
-            "input",
-            {
-              type: "checkbox",
-              checked: n.audio.enabled,
-              onChange: (i) => E({
-                audio: { ...n.audio, enabled: i.target.checked }
-              })
-            }
-          ),
-          "Enable Audio"
-        ] }),
-        n.audio.enabled && /* @__PURE__ */ a(le, { children: [
-          /* @__PURE__ */ a("label", { children: [
-            "Source",
-            /* @__PURE__ */ a(
-              "select",
-              {
-                value: n.audio.source,
-                onChange: (i) => E({
-                  audio: {
-                    ...n.audio,
-                    source: i.target.value
-                  }
-                }),
-                children: [
-                  /* @__PURE__ */ e("option", { value: "system", children: "System Audio" }),
-                  /* @__PURE__ */ e("option", { value: "microphone", children: "Microphone" }),
-                  /* @__PURE__ */ e("option", { value: "both", children: "Both" })
-                ]
-              }
-            )
-          ] }),
-          /* @__PURE__ */ a("label", { className: "checkbox-label", children: [
-            /* @__PURE__ */ e(
-              "input",
-              {
-                type: "checkbox",
-                checked: n.audio.echoCancellation,
-                onChange: (i) => E({
-                  audio: { ...n.audio, echoCancellation: i.target.checked }
-                })
-              }
-            ),
-            "Echo Cancellation"
-          ] }),
-          /* @__PURE__ */ a("label", { className: "checkbox-label", children: [
-            /* @__PURE__ */ e(
-              "input",
-              {
-                type: "checkbox",
-                checked: n.audio.noiseSuppression,
-                onChange: (i) => E({
-                  audio: { ...n.audio, noiseSuppression: i.target.checked }
-                })
-              }
-            ),
-            "Noise Suppression"
-          ] })
-        ] })
-      ] }),
-      /* @__PURE__ */ a("div", { className: "settings-section", children: [
-        /* @__PURE__ */ e("h4", { children: "Output" }),
-        /* @__PURE__ */ a("label", { children: [
-          "Format",
-          /* @__PURE__ */ a(
-            "select",
-            {
-              value: n.output.format,
-              onChange: (i) => E({
-                output: { ...n.output, format: i.target.value }
-              }),
-              children: [
-                /* @__PURE__ */ e("option", { value: "webm", children: "WebM (Best Web)" }),
-                /* @__PURE__ */ e("option", { value: "mp4", children: "MP4 (Most Compatible)" }),
-                /* @__PURE__ */ e("option", { value: "mkv", children: "MKV (Lossless)" })
-              ]
-            }
-          )
-        ] }),
-        /* @__PURE__ */ a("label", { children: [
-          "Quality",
-          /* @__PURE__ */ a(
-            "select",
-            {
-              value: n.output.quality,
-              onChange: (i) => E({
-                output: {
-                  ...n.output,
-                  quality: i.target.value
-                }
-              }),
-              children: [
-                /* @__PURE__ */ e("option", { value: "low", children: "Low (Smaller file)" }),
-                /* @__PURE__ */ e("option", { value: "medium", children: "Medium" }),
-                /* @__PURE__ */ e("option", { value: "high", children: "High (Recommended)" }),
-                /* @__PURE__ */ e("option", { value: "lossless", children: "Lossless (Largest file)" })
-              ]
-            }
-          )
-        ] })
-      ] })
-    ] })
-  ] });
-}, Ye = {
-  id: crypto.randomUUID(),
-  name: "My Stream",
-  protocol: "rtmp",
-  destinations: [],
-  sources: [],
-  layout: {
-    name: "Default",
-    canvas: { width: 1920, height: 1080, backgroundColor: "var(--nice-text, #000000)" },
-    layers: []
-  },
-  settings: {
-    video: {
-      resolution: { width: 1920, height: 1080 },
-      frameRate: 30,
-      codec: "h264",
-      bitrate: 6e3,
-      keyframe: 2,
-      profile: "high"
-    },
-    audio: {
-      sampleRate: 48e3,
-      bitrate: 160,
-      channels: 2,
-      codec: "aac"
-    }
-  }
-}, fe = [
-  {
-    platform: "youtube",
-    name: "YouTube",
-    icon: "📺",
-    defaultUrl: "rtmp://a.rtmp.youtube.com/live2"
-  },
-  { platform: "twitch", name: "Twitch", icon: "🎮", defaultUrl: "rtmp://live.twitch.tv/app" },
-  {
-    platform: "facebook",
-    name: "Facebook",
-    icon: "📘",
-    defaultUrl: "rtmps://live-api-s.facebook.com:443/rtmp"
-  },
-  { platform: "custom-rtmp", name: "Custom RTMP", icon: "🔗", defaultUrl: "" },
-  { platform: "custom-srt", name: "Custom SRT", icon: "🔒", defaultUrl: "" }
-], de = [
-  { type: "camera", name: "Camera", icon: "📷" },
-  { type: "screen", name: "Screen Capture", icon: "🖥️" },
-  { type: "window", name: "Window Capture", icon: "🪟" },
-  { type: "browser", name: "Browser Source", icon: "🌐" },
-  { type: "image", name: "Image", icon: "🖼️" },
-  { type: "video", name: "Video", icon: "🎬" },
-  { type: "microphone", name: "Microphone", icon: "🎤" },
-  { type: "system-audio", name: "System Audio", icon: "🔊" }
-], aa = ({
-  config: d,
-  onConfigChange: f,
-  onStreamStart: l,
-  onStreamStop: C,
-  onStatsUpdate: H,
-  onError: I,
-  className: p = ""
-}) => {
-  const [n, R] = w(d || Ye), [b, D] = w(
-    "sources"
-  ), [y, x] = w(!1), [S, A] = w({
-    duration: 0,
-    viewers: 0,
-    peakViewers: 0,
-    bitrate: 0,
-    fps: 0,
-    droppedFrames: 0,
-    cpuUsage: 0,
-    memoryUsage: 0
-  }), [_, O] = w(null), [F, M] = w(!1), [Z, K] = w(!1), [P, U] = w([n.layout]), [B, ie] = w(0), te = L(null), z = L(null), k = L(0);
-  re(() => {
-    d && R(d);
-  }, [d]), re(() => () => {
-    z.current && clearInterval(z.current);
-  }, []);
-  const N = me(
-    (r) => {
-      const s = { ...n, ...r };
-      R(s), f == null || f(s);
-    },
-    [n, f]
-  ), W = (r) => {
-    const s = fe.find((t) => t.platform === r), m = {
-      id: crypto.randomUUID(),
-      name: (s == null ? void 0 : s.name) || "Custom",
-      platform: r,
-      url: (s == null ? void 0 : s.defaultUrl) || "",
-      streamKey: "",
-      enabled: !0,
-      status: "idle"
-    };
-    N({ destinations: [...n.destinations, m] }), K(!1);
-  }, q = (r, s) => {
-    N({
-      destinations: n.destinations.map((m) => m.id === r ? { ...m, ...s } : m)
-    });
-  }, G = (r) => {
-    N({ destinations: n.destinations.filter((s) => s.id !== r) });
-  }, ee = async (r) => {
-    const s = de.find((o) => o.type === r), m = {
-      id: crypto.randomUUID(),
-      type: r,
-      name: `${(s == null ? void 0 : s.name) || r} ${n.sources.filter((o) => o.type === r).length + 1}`,
-      settings: {},
-      volume: 1,
-      muted: !1
-    };
-    try {
-      if (r === "camera" || r === "microphone") {
-        const o = r === "camera" ? { video: !0 } : { audio: !0 }, u = (await navigator.mediaDevices.enumerateDevices()).filter(
-          (h) => r === "camera" ? h.kind === "videoinput" : h.kind === "audioinput"
-        );
-        u.length > 0 && (m.settings.deviceId = u[0].deviceId);
-      } else (r === "screen" || r === "window") && await navigator.mediaDevices.getDisplayMedia({ video: !0 });
-    } catch (o) {
-      console.warn(`Could not access ${r}:`, o);
-    }
-    N({ sources: [...n.sources, m] });
-    const t = {
-      id: crypto.randomUUID(),
-      sourceId: m.id,
-      position: { x: 0, y: 0 },
-      size: { width: n.layout.canvas.width, height: n.layout.canvas.height },
-      visible: !0,
-      opacity: 1,
-      zIndex: n.layout.layers.length
-    };
-    N({
-      layout: {
-        ...n.layout,
-        layers: [...n.layout.layers, t]
-      }
-    }), M(!1);
-  }, E = (r, s) => {
-    N({
-      sources: n.sources.map((m) => m.id === r ? { ...m, ...s } : m)
-    });
-  }, Y = (r) => {
-    N({
-      sources: n.sources.filter((s) => s.id !== r),
-      layout: {
-        ...n.layout,
-        layers: n.layout.layers.filter((s) => s.sourceId !== r)
-      }
-    });
-  }, V = (r, s) => {
-    N({
-      layout: {
-        ...n.layout,
-        layers: n.layout.layers.map((m) => m.id === r ? { ...m, ...s } : m)
-      }
-    });
-  }, ne = (r) => {
-    const s = n.layout.layers.findIndex((m) => m.id === r);
-    if (s < n.layout.layers.length - 1) {
-      const m = [...n.layout.layers];
-      [m[s], m[s + 1]] = [m[s + 1], m[s]], m.forEach((t, o) => {
-        t.zIndex = o;
-      }), N({ layout: { ...n.layout, layers: m } });
-    }
-  }, se = (r) => {
-    const s = n.layout.layers.findIndex((m) => m.id === r);
-    if (s > 0) {
-      const m = [...n.layout.layers];
-      [m[s], m[s - 1]] = [m[s - 1], m[s]], m.forEach((t, o) => {
-        t.zIndex = o;
-      }), N({ layout: { ...n.layout, layers: m } });
-    }
-  }, J = () => {
-    const r = {
-      name: `Scene ${P.length + 1}`,
-      canvas: { ...n.layout.canvas },
-      layers: []
-    };
-    U([...P, r]);
-  }, Q = (r) => {
-    const s = [...P];
-    s[B] = n.layout, U(s), ie(r), N({ layout: P[r] });
-  }, ae = async () => {
-    try {
-      N({
-        destinations: n.destinations.map(
-          (r) => r.enabled ? { ...r, status: "connecting" } : r
-        )
-      }), await new Promise((r) => setTimeout(r, 2e3)), N({
-        destinations: n.destinations.map(
-          (r) => r.enabled ? { ...r, status: "live" } : r
-        )
-      }), x(!0), k.current = Date.now(), l == null || l(), z.current = setInterval(() => {
-        const r = {
-          duration: (Date.now() - k.current) / 1e3,
-          viewers: Math.floor(Math.random() * 100) + S.viewers,
-          peakViewers: Math.max(S.peakViewers, S.viewers),
-          bitrate: n.settings.video.bitrate + Math.floor(Math.random() * 500 - 250),
-          fps: n.settings.video.frameRate - Math.random() * 2,
-          droppedFrames: S.droppedFrames + (Math.random() > 0.95 ? 1 : 0),
-          cpuUsage: 15 + Math.random() * 30,
-          memoryUsage: 40 + Math.random() * 20
-        };
-        A(r), H == null || H(r);
-      }, 1e3);
-    } catch (r) {
-      I == null || I(r instanceof Error ? r : new Error("Failed to start stream")), N({
-        destinations: n.destinations.map((s) => ({
-          ...s,
-          status: "error"
-        }))
-      });
-    }
-  }, j = () => {
-    z.current && clearInterval(z.current), N({
-      destinations: n.destinations.map((r) => ({ ...r, status: "idle" }))
-    }), x(!1), C == null || C();
-  }, oe = (r) => {
-    const s = Math.floor(r / 3600), m = Math.floor(r % 3600 / 60), t = Math.floor(r % 60);
-    return `${s.toString().padStart(2, "0")}:${m.toString().padStart(2, "0")}:${t.toString().padStart(2, "0")}`;
-  }, ce = (r) => {
-    switch (r) {
-      case "live":
-        return "var(--nice-success, #00ff00)";
-      case "connecting":
-        return "var(--nice-warning, #ffff00)";
-      case "error":
-        return "var(--nice-danger, #ff0000)";
-      default:
-        return "var(--nice-text-secondary, #888888)";
-    }
-  };
-  return /* @__PURE__ */ a("div", { className: `nice-live-streaming ${p}`, children: [
-    /* @__PURE__ */ a("header", { className: "streaming__header", children: [
-      /* @__PURE__ */ a("div", { className: "header__title", children: [
-        /* @__PURE__ */ e(
-          "input",
-          {
-            type: "text",
-            value: n.name,
-            onChange: (r) => N({ name: r.target.value }),
-            className: "stream-name-input"
-          }
-        ),
-        y && /* @__PURE__ */ a("span", { className: "live-badge", children: [
-          /* @__PURE__ */ e("span", { className: "live-dot" }),
-          " LIVE"
-        ] })
-      ] }),
-      /* @__PURE__ */ e("div", { className: "header__stats", children: y && /* @__PURE__ */ a(le, { children: [
-        /* @__PURE__ */ a("span", { className: "stat-item", children: [
-          "⏱️ ",
-          oe(S.duration)
-        ] }),
-        /* @__PURE__ */ a("span", { className: "stat-item", children: [
-          "👥 ",
-          S.viewers
-        ] }),
-        /* @__PURE__ */ a("span", { className: "stat-item", children: [
-          "📊 ",
-          Math.round(S.bitrate),
-          " kbps"
-        ] }),
-        /* @__PURE__ */ a("span", { className: "stat-item", children: [
-          "🎬 ",
-          S.fps.toFixed(1),
-          " fps"
-        ] })
-      ] }) }),
-      /* @__PURE__ */ e("div", { className: "header__actions", children: y ? /* @__PURE__ */ e("button", { className: "action-button action-button--stop", onClick: j, children: "End Stream" }) : /* @__PURE__ */ e(
-        "button",
-        {
-          className: "action-button action-button--go-live",
-          onClick: ae,
-          disabled: n.destinations.filter((r) => r.enabled).length === 0,
-          children: "Go Live"
-        }
-      ) })
-    ] }),
-    /* @__PURE__ */ a("div", { className: "streaming__main", children: [
-      /* @__PURE__ */ a("div", { className: "streaming__preview", children: [
-        /* @__PURE__ */ a("div", { className: "scenes-bar", children: [
-          P.map((r, s) => /* @__PURE__ */ e(
-            "button",
-            {
-              className: `scene-button ${B === s ? "scene-button--active" : ""}`,
-              onClick: () => Q(s),
-              children: r.name
-            },
-            s
-          )),
-          /* @__PURE__ */ e("button", { className: "scene-button scene-button--add", onClick: J, children: "+" })
-        ] }),
-        /* @__PURE__ */ e(
-          "div",
-          {
-            ref: te,
-            className: "preview-canvas",
-            style: {
-              aspectRatio: `${n.layout.canvas.width}/${n.layout.canvas.height}`,
-              backgroundColor: n.layout.canvas.backgroundColor
-            },
-            children: n.layout.layers.sort((r, s) => r.zIndex - s.zIndex).map((r) => {
-              var m;
-              const s = n.sources.find((t) => t.id === r.sourceId);
-              return !r.visible || !s ? null : /* @__PURE__ */ e(
-                "div",
-                {
-                  className: `canvas-layer ${_ === r.id ? "canvas-layer--selected" : ""}`,
-                  style: {
-                    left: `${r.position.x / n.layout.canvas.width * 100}%`,
-                    top: `${r.position.y / n.layout.canvas.height * 100}%`,
-                    width: `${r.size.width / n.layout.canvas.width * 100}%`,
-                    height: `${r.size.height / n.layout.canvas.height * 100}%`,
-                    opacity: r.opacity,
-                    zIndex: r.zIndex
-                  },
-                  onClick: () => O(r.id),
-                  children: /* @__PURE__ */ a("div", { className: "layer-content", children: [
-                    /* @__PURE__ */ e("span", { className: "layer-icon", children: ((m = de.find((t) => t.type === s.type)) == null ? void 0 : m.icon) || "📦" }),
-                    /* @__PURE__ */ e("span", { className: "layer-name", children: s.name })
-                  ] })
-                },
-                r.id
-              );
-            })
-          }
-        )
-      ] }),
-      /* @__PURE__ */ a("aside", { className: "streaming__panel", children: [
-        /* @__PURE__ */ e("div", { className: "panel-tabs", children: ["sources", "audio", "destinations", "settings"].map((r) => /* @__PURE__ */ e(
-          "button",
-          {
-            className: `panel-tab ${b === r ? "panel-tab--active" : ""}`,
-            onClick: () => D(r),
-            children: r.charAt(0).toUpperCase() + r.slice(1)
-          },
-          r
-        )) }),
-        /* @__PURE__ */ a("div", { className: "panel-content", children: [
-          b === "sources" && /* @__PURE__ */ a("div", { className: "sources-panel", children: [
-            /* @__PURE__ */ a("div", { className: "panel-header", children: [
-              /* @__PURE__ */ e("h3", { children: "Sources" }),
-              /* @__PURE__ */ e(
-                "button",
-                {
-                  className: "add-button",
-                  onClick: () => M(!0),
-                  disabled: y,
-                  children: "+ Add"
-                }
-              )
-            ] }),
-            /* @__PURE__ */ e("div", { className: "sources-list", children: n.sources.filter((r) => r.type !== "microphone" && r.type !== "system-audio").map((r) => {
-              var m;
-              const s = n.layout.layers.find((t) => t.sourceId === r.id);
-              return /* @__PURE__ */ a(
-                "div",
-                {
-                  className: `source-item ${_ === (s == null ? void 0 : s.id) ? "source-item--selected" : ""}`,
-                  onClick: () => s && O(s.id),
-                  children: [
-                    /* @__PURE__ */ e("span", { className: "source-icon", children: (m = de.find((t) => t.type === r.type)) == null ? void 0 : m.icon }),
-                    /* @__PURE__ */ e("span", { className: "source-name", children: r.name }),
-                    /* @__PURE__ */ a("div", { className: "source-controls", children: [
-                      /* @__PURE__ */ e(
-                        "button",
-                        {
-                          className: s != null && s.visible ? "" : "inactive",
-                          onClick: (t) => {
-                            t.stopPropagation(), s && V(s.id, { visible: !s.visible });
-                          },
-                          children: s != null && s.visible ? "👁️" : "👁️‍🗨️"
-                        }
-                      ),
-                      /* @__PURE__ */ e(
-                        "button",
-                        {
-                          onClick: (t) => {
-                            t.stopPropagation(), s && ne(s.id);
-                          },
-                          children: "⬆️"
-                        }
-                      ),
-                      /* @__PURE__ */ e(
-                        "button",
-                        {
-                          onClick: (t) => {
-                            t.stopPropagation(), s && se(s.id);
-                          },
-                          children: "⬇️"
-                        }
-                      ),
-                      /* @__PURE__ */ e(
-                        "button",
-                        {
-                          onClick: (t) => {
-                            t.stopPropagation(), Y(r.id);
-                          },
-                          disabled: y,
-                          children: "🗑️"
-                        }
-                      )
-                    ] })
-                  ]
-                },
-                r.id
-              );
-            }) }),
-            _ && /* @__PURE__ */ a("div", { className: "layer-properties", children: [
-              /* @__PURE__ */ e("h4", { children: "Properties" }),
-              (() => {
-                const r = n.layout.layers.find((s) => s.id === _);
-                return r ? /* @__PURE__ */ a(le, { children: [
-                  /* @__PURE__ */ a("label", { children: [
-                    "X Position",
-                    /* @__PURE__ */ e(
-                      "input",
-                      {
-                        type: "number",
-                        value: r.position.x,
-                        onChange: (s) => V(r.id, {
-                          position: { ...r.position, x: parseInt(s.target.value) || 0 }
-                        })
-                      }
-                    )
-                  ] }),
-                  /* @__PURE__ */ a("label", { children: [
-                    "Y Position",
-                    /* @__PURE__ */ e(
-                      "input",
-                      {
-                        type: "number",
-                        value: r.position.y,
-                        onChange: (s) => V(r.id, {
-                          position: { ...r.position, y: parseInt(s.target.value) || 0 }
-                        })
-                      }
-                    )
-                  ] }),
-                  /* @__PURE__ */ a("label", { children: [
-                    "Width",
-                    /* @__PURE__ */ e(
-                      "input",
-                      {
-                        type: "number",
-                        value: r.size.width,
-                        onChange: (s) => V(r.id, {
-                          size: { ...r.size, width: parseInt(s.target.value) || 100 }
-                        })
-                      }
-                    )
-                  ] }),
-                  /* @__PURE__ */ a("label", { children: [
-                    "Height",
-                    /* @__PURE__ */ e(
-                      "input",
-                      {
-                        type: "number",
-                        value: r.size.height,
-                        onChange: (s) => V(r.id, {
-                          size: { ...r.size, height: parseInt(s.target.value) || 100 }
-                        })
-                      }
-                    )
-                  ] }),
-                  /* @__PURE__ */ a("label", { children: [
-                    "Opacity",
-                    /* @__PURE__ */ e(
-                      "input",
-                      {
-                        type: "range",
-                        min: "0",
-                        max: "1",
-                        step: "0.1",
-                        value: r.opacity,
-                        onChange: (s) => V(r.id, {
-                          opacity: parseFloat(s.target.value)
-                        })
-                      }
-                    )
-                  ] })
-                ] }) : null;
-              })()
-            ] })
-          ] }),
-          b === "audio" && /* @__PURE__ */ a("div", { className: "audio-panel", children: [
-            /* @__PURE__ */ a("div", { className: "panel-header", children: [
-              /* @__PURE__ */ e("h3", { children: "Audio Mixer" }),
-              /* @__PURE__ */ e(
-                "button",
-                {
-                  className: "add-button",
-                  onClick: () => {
-                    M(!0);
-                  },
-                  disabled: y,
-                  children: "+ Add"
-                }
-              )
-            ] }),
-            /* @__PURE__ */ a("div", { className: "audio-sources", children: [
-              n.sources.filter(
-                (r) => r.type === "microphone" || r.type === "system-audio" || r.type === "video"
-              ).map((r) => {
-                var s;
-                return /* @__PURE__ */ a("div", { className: "audio-source", children: [
-                  /* @__PURE__ */ a("div", { className: "audio-header", children: [
-                    /* @__PURE__ */ e("span", { className: "audio-icon", children: (s = de.find((m) => m.type === r.type)) == null ? void 0 : s.icon }),
-                    /* @__PURE__ */ e("span", { className: "audio-name", children: r.name }),
-                    /* @__PURE__ */ e(
-                      "button",
-                      {
-                        className: r.muted ? "muted" : "",
-                        onClick: () => E(r.id, { muted: !r.muted }),
-                        children: r.muted ? "🔇" : "🔊"
-                      }
-                    )
-                  ] }),
-                  /* @__PURE__ */ a("div", { className: "audio-slider", children: [
-                    /* @__PURE__ */ e(
-                      "input",
-                      {
-                        type: "range",
-                        min: "0",
-                        max: "1",
-                        step: "0.01",
-                        value: r.volume ?? 1,
-                        onChange: (m) => E(r.id, { volume: parseFloat(m.target.value) }),
-                        disabled: r.muted
-                      }
-                    ),
-                    /* @__PURE__ */ a("span", { className: "volume-value", children: [
-                      Math.round((r.volume ?? 1) * 100),
-                      "%"
-                    ] })
-                  ] }),
-                  /* @__PURE__ */ e("div", { className: "audio-meter", children: /* @__PURE__ */ e(
-                    "div",
-                    {
-                      className: "meter-fill",
-                      style: { width: `${(r.volume ?? 1) * 70 + Math.random() * 30}%` }
-                    }
-                  ) })
-                ] }, r.id);
-              }),
-              n.sources.filter(
-                (r) => r.type === "microphone" || r.type === "system-audio"
-              ).length === 0 && /* @__PURE__ */ e("p", { className: "empty-message", children: "No audio sources added" })
-            ] })
-          ] }),
-          b === "destinations" && /* @__PURE__ */ a("div", { className: "destinations-panel", children: [
-            /* @__PURE__ */ a("div", { className: "panel-header", children: [
-              /* @__PURE__ */ e("h3", { children: "Destinations" }),
-              /* @__PURE__ */ e(
-                "button",
-                {
-                  className: "add-button",
-                  onClick: () => K(!0),
-                  disabled: y,
-                  children: "+ Add"
-                }
-              )
-            ] }),
-            /* @__PURE__ */ a("div", { className: "destinations-list", children: [
-              n.destinations.map((r) => {
-                var s;
-                return /* @__PURE__ */ a("div", { className: "destination-item", children: [
-                  /* @__PURE__ */ a("div", { className: "destination-header", children: [
-                    /* @__PURE__ */ e(
-                      "span",
-                      {
-                        className: "status-indicator",
-                        style: { backgroundColor: ce(r.status) }
-                      }
-                    ),
-                    /* @__PURE__ */ e("span", { className: "destination-icon", children: (s = fe.find((m) => m.platform === r.platform)) == null ? void 0 : s.icon }),
-                    /* @__PURE__ */ e("span", { className: "destination-name", children: r.name }),
-                    /* @__PURE__ */ a("label", { className: "toggle", children: [
-                      /* @__PURE__ */ e(
-                        "input",
-                        {
-                          type: "checkbox",
-                          checked: r.enabled,
-                          onChange: (m) => q(r.id, { enabled: m.target.checked }),
-                          disabled: y
-                        }
-                      ),
-                      /* @__PURE__ */ e("span", { className: "toggle-slider" })
-                    ] })
-                  ] }),
-                  /* @__PURE__ */ a("div", { className: "destination-config", children: [
-                    /* @__PURE__ */ a("label", { children: [
-                      "Server URL",
-                      /* @__PURE__ */ e(
-                        "input",
-                        {
-                          type: "text",
-                          value: r.url,
-                          onChange: (m) => q(r.id, { url: m.target.value }),
-                          placeholder: "rtmp://...",
-                          disabled: y
-                        }
-                      )
-                    ] }),
-                    /* @__PURE__ */ a("label", { children: [
-                      "Stream Key",
-                      /* @__PURE__ */ e(
-                        "input",
-                        {
-                          type: "password",
-                          value: r.streamKey || "",
-                          onChange: (m) => q(r.id, { streamKey: m.target.value }),
-                          placeholder: "Enter stream key",
-                          disabled: y
-                        }
-                      )
-                    ] })
-                  ] }),
-                  /* @__PURE__ */ e(
-                    "button",
-                    {
-                      className: "remove-button",
-                      onClick: () => G(r.id),
-                      disabled: y,
-                      children: "Remove"
-                    }
-                  )
-                ] }, r.id);
-              }),
-              n.destinations.length === 0 && /* @__PURE__ */ e("p", { className: "empty-message", children: "No destinations configured" })
-            ] })
-          ] }),
-          b === "settings" && /* @__PURE__ */ a("div", { className: "settings-panel", children: [
-            /* @__PURE__ */ a("div", { className: "setting-section", children: [
-              /* @__PURE__ */ e("h4", { children: "Video" }),
-              /* @__PURE__ */ a("label", { children: [
-                "Resolution",
-                /* @__PURE__ */ a(
-                  "select",
-                  {
-                    value: `${n.settings.video.resolution.width}x${n.settings.video.resolution.height}`,
-                    onChange: (r) => {
-                      const [s, m] = r.target.value.split("x").map(Number);
-                      N({
-                        settings: {
-                          ...n.settings,
-                          video: { ...n.settings.video, resolution: { width: s, height: m } }
-                        },
-                        layout: {
-                          ...n.layout,
-                          canvas: { ...n.layout.canvas, width: s, height: m }
-                        }
-                      });
-                    },
-                    disabled: y,
-                    children: [
-                      /* @__PURE__ */ e("option", { value: "1920x1080", children: "1080p (1920x1080)" }),
-                      /* @__PURE__ */ e("option", { value: "1280x720", children: "720p (1280x720)" }),
-                      /* @__PURE__ */ e("option", { value: "2560x1440", children: "1440p (2560x1440)" })
-                    ]
-                  }
-                )
-              ] }),
-              /* @__PURE__ */ a("label", { children: [
-                "Frame Rate",
-                /* @__PURE__ */ a(
-                  "select",
-                  {
-                    value: n.settings.video.frameRate,
-                    onChange: (r) => N({
-                      settings: {
-                        ...n.settings,
-                        video: {
-                          ...n.settings.video,
-                          frameRate: parseInt(r.target.value)
-                        }
-                      }
-                    }),
-                    disabled: y,
-                    children: [
-                      /* @__PURE__ */ e("option", { value: "24", children: "24 fps" }),
-                      /* @__PURE__ */ e("option", { value: "30", children: "30 fps" }),
-                      /* @__PURE__ */ e("option", { value: "60", children: "60 fps" })
-                    ]
-                  }
-                )
-              ] }),
-              /* @__PURE__ */ a("label", { children: [
-                "Bitrate (kbps)",
-                /* @__PURE__ */ e(
-                  "input",
-                  {
-                    type: "number",
-                    value: n.settings.video.bitrate,
-                    onChange: (r) => N({
-                      settings: {
-                        ...n.settings,
-                        video: {
-                          ...n.settings.video,
-                          bitrate: parseInt(r.target.value) || 6e3
-                        }
-                      }
-                    }),
-                    min: "1000",
-                    max: "50000",
-                    disabled: y
-                  }
-                )
-              ] }),
-              /* @__PURE__ */ a("label", { children: [
-                "Keyframe Interval (sec)",
-                /* @__PURE__ */ e(
-                  "input",
-                  {
-                    type: "number",
-                    value: n.settings.video.keyframe,
-                    onChange: (r) => N({
-                      settings: {
-                        ...n.settings,
-                        video: {
-                          ...n.settings.video,
-                          keyframe: parseInt(r.target.value) || 2
-                        }
-                      }
-                    }),
-                    min: "1",
-                    max: "10",
-                    disabled: y
-                  }
-                )
-              ] })
-            ] }),
-            /* @__PURE__ */ a("div", { className: "setting-section", children: [
-              /* @__PURE__ */ e("h4", { children: "Audio" }),
-              /* @__PURE__ */ a("label", { children: [
-                "Sample Rate",
-                /* @__PURE__ */ a(
-                  "select",
-                  {
-                    value: n.settings.audio.sampleRate,
-                    onChange: (r) => N({
-                      settings: {
-                        ...n.settings,
-                        audio: {
-                          ...n.settings.audio,
-                          sampleRate: parseInt(r.target.value)
-                        }
-                      }
-                    }),
-                    disabled: y,
-                    children: [
-                      /* @__PURE__ */ e("option", { value: "44100", children: "44.1 kHz" }),
-                      /* @__PURE__ */ e("option", { value: "48000", children: "48 kHz" })
-                    ]
-                  }
-                )
-              ] }),
-              /* @__PURE__ */ a("label", { children: [
-                "Audio Bitrate (kbps)",
-                /* @__PURE__ */ a(
-                  "select",
-                  {
-                    value: n.settings.audio.bitrate,
-                    onChange: (r) => N({
-                      settings: {
-                        ...n.settings,
-                        audio: { ...n.settings.audio, bitrate: parseInt(r.target.value) }
-                      }
-                    }),
-                    disabled: y,
-                    children: [
-                      /* @__PURE__ */ e("option", { value: "96", children: "96 kbps" }),
-                      /* @__PURE__ */ e("option", { value: "128", children: "128 kbps" }),
-                      /* @__PURE__ */ e("option", { value: "160", children: "160 kbps" }),
-                      /* @__PURE__ */ e("option", { value: "320", children: "320 kbps" })
-                    ]
-                  }
-                )
-              ] })
-            ] })
-          ] })
-        ] })
-      ] })
-    ] }),
-    y && /* @__PURE__ */ e("footer", { className: "streaming__footer", children: /* @__PURE__ */ a("div", { className: "footer-stats", children: [
-      /* @__PURE__ */ a("span", { className: "stat", children: [
-        /* @__PURE__ */ e("label", { children: "CPU" }),
-        /* @__PURE__ */ a("span", { className: "value", children: [
-          S.cpuUsage.toFixed(1),
-          "%"
-        ] })
-      ] }),
-      /* @__PURE__ */ a("span", { className: "stat", children: [
-        /* @__PURE__ */ e("label", { children: "Memory" }),
-        /* @__PURE__ */ a("span", { className: "value", children: [
-          S.memoryUsage.toFixed(1),
-          "%"
-        ] })
-      ] }),
-      /* @__PURE__ */ a("span", { className: "stat", children: [
-        /* @__PURE__ */ e("label", { children: "Dropped" }),
-        /* @__PURE__ */ e("span", { className: "value", children: S.droppedFrames })
-      ] }),
-      /* @__PURE__ */ a("span", { className: "stat", children: [
-        /* @__PURE__ */ e("label", { children: "Peak Viewers" }),
-        /* @__PURE__ */ e("span", { className: "value", children: S.peakViewers })
-      ] })
-    ] }) }),
-    F && /* @__PURE__ */ e("div", { className: "modal-overlay", children: /* @__PURE__ */ a("div", { className: "modal", children: [
-      /* @__PURE__ */ a("div", { className: "modal-header", children: [
-        /* @__PURE__ */ e("h3", { children: "Add Source" }),
-        /* @__PURE__ */ e("button", { className: "close-button", onClick: () => M(!1), children: "×" })
-      ] }),
-      /* @__PURE__ */ e("div", { className: "modal-content", children: /* @__PURE__ */ e("div", { className: "source-type-grid", children: de.map((r) => /* @__PURE__ */ a(
-        "button",
-        {
-          className: "source-type-button",
-          onClick: () => ee(r.type),
-          children: [
-            /* @__PURE__ */ e("span", { className: "icon", children: r.icon }),
-            /* @__PURE__ */ e("span", { className: "name", children: r.name })
-          ]
-        },
-        r.type
-      )) }) })
-    ] }) }),
-    Z && /* @__PURE__ */ e("div", { className: "modal-overlay", children: /* @__PURE__ */ a("div", { className: "modal", children: [
-      /* @__PURE__ */ a("div", { className: "modal-header", children: [
-        /* @__PURE__ */ e("h3", { children: "Add Destination" }),
-        /* @__PURE__ */ e("button", { className: "close-button", onClick: () => K(!1), children: "×" })
-      ] }),
-      /* @__PURE__ */ e("div", { className: "modal-content", children: /* @__PURE__ */ e("div", { className: "platform-grid", children: fe.map((r) => /* @__PURE__ */ a(
-        "button",
-        {
-          className: "platform-button",
-          onClick: () => W(r.platform),
-          children: [
-            /* @__PURE__ */ e("span", { className: "icon", children: r.icon }),
-            /* @__PURE__ */ e("span", { className: "name", children: r.name })
-          ]
-        },
-        r.platform
-      )) }) })
-    ] }) })
-  ] });
-};
+import { N as r, a, b as c } from "./index-BL4FE2ge.js";
 export {
-  aa as NiceLiveStreaming,
-  ea as NiceScreenRecorder,
-  Xe as NiceVideoEditor
+  r as NiceLiveStreaming,
+  a as NiceScreenRecorder,
+  c as NiceVideoEditor
 };