local-operator-ui 0.8.0 → 0.9.0

package/out/renderer/assets/{fonts-DnoCbbVd.js → fonts-Bx8fKQfu.js}

@@ -15241,6 +15241,25 @@ const createLucideIcon = (iconName, iconNode) => {
   Component.displayName = toPascalCase(iconName);
   return Component;
 };
+/**
+ * @license lucide-react v0.507.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const __iconNode = [
+  ["line", { x1: "22", x2: "2", y1: "12", y2: "12", key: "1y58io" }],
+  [
+    "path",
+    {
+      d: "M5.45 5.11 2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.45-6.89A2 2 0 0 0 16.76 4H7.24a2 2 0 0 0-1.79 1.11z",
+      key: "oot6mr"
+    }
+  ],
+  ["line", { x1: "6", x2: "6.01", y1: "16", y2: "16", key: "sgf278" }],
+  ["line", { x1: "10", x2: "10.01", y1: "16", y2: "16", key: "1l4acy" }]
+];
+const HardDrive = createLucideIcon("hard-drive", __iconNode);
 /*!
  * Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com
  * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
@@ -29258,6 +29277,557 @@ const monokaiTheme = createTheme({
     }
   }
 });
+const neonTheme = createTheme({
+  breakpoints: {
+    values: {
+      xs: 0,
+      sm: 600,
+      md: 900,
+      lg: 1300,
+      xl: 1800
+    }
+  },
+  palette: {
+    mode: "dark",
+    primary: {
+      main: "#00EFFF",
+      // Bright Cyan
+      dark: "#00B8D9",
+      light: "#66F7FF",
+      contrastText: "#000000"
+    },
+    secondary: {
+      main: "#FF00A0",
+      // Cyberpunk Pink
+      dark: "#D90086",
+      // Darker Cyberpunk Pink
+      light: "#FF66C7",
+      // Lighter Cyberpunk Pink
+      contrastText: "#ffffff"
+    },
+    background: {
+      default: "#080C18",
+      // Dark Desaturated Blue
+      paper: "#0D1220"
+      // Slightly Lighter Dark Blue
+    },
+    text: {
+      primary: "#E0E0E0",
+      // Light Grey
+      secondary: "#A0A0B0"
+      // Medium Grey
+    },
+    caption: "rgba(224, 224, 224, 0.8)",
+    // Light Grey with Alpha
+    sidebar: {
+      background: "#080C18",
+      // Main navigation sidebar
+      secondaryBackground: "#0D1220",
+      // Secondary sidebars (chat/agents)
+      border: "rgba(0, 239, 255, 0.15)",
+      // Primary color with alpha
+      itemHover: "rgba(0, 239, 255, 0.1)",
+      itemActive: "rgba(255, 0, 160, 0.2)",
+      // Cyberpunk Pink with opacity
+      itemActiveHover: "rgba(255, 0, 160, 0.25)",
+      // Cyberpunk Pink with higher opacity for hover
+      itemText: "rgba(224, 224, 224, 0.85)",
+      itemActiveText: "#FF00A0",
+      // Cyberpunk Pink
+      toggleButton: {
+        background: "rgba(0, 239, 255, 0.08)",
+        border: "rgba(0, 239, 255, 0.2)",
+        hoverBackground: "rgba(0, 239, 255, 0.15)",
+        hoverBorder: "rgba(0, 239, 255, 0.4)"
+      }
+    },
+    tooltip: {
+      background: "#101828",
+      // Darker blue-grey
+      border: "rgba(0, 239, 255, 0.2)",
+      text: "#E0E0E0"
+    },
+    userMessage: {
+      background: "rgba(0, 239, 255, 0.1)",
+      // Primary color with alpha
+      border: "rgba(0, 239, 255, 0.3)",
+      shadow: "0 4px 12px rgba(0, 239, 255, 0.15)"
+    },
+    messagesView: {
+      background: "rgba(8, 12, 24, 0.5)"
+      // Dark background for messages view
+    },
+    inputField: {
+      background: "rgba(8, 12, 24, 0.9)",
+      hoverBackground: "rgba(13, 18, 32, 0.9)",
+      focusBackground: "#101828",
+      // Darker blue-grey
+      border: "rgba(0, 239, 255, 0.2)"
+    },
+    actionHighlight: {
+      done: {
+        background: "rgba(0, 239, 255, 0.1)",
+        // Primary color with opacity
+        border: "rgba(0, 239, 255, 0.4)"
+      },
+      ask: {
+        background: "rgba(255, 140, 0, 0.15)",
+        // Cyberpunk Orange with opacity
+        border: "rgba(255, 140, 0, 0.5)"
+        // Cyberpunk Orange for border
+      }
+    },
+    icon: {
+      background: "rgba(0, 239, 255, 0.15)",
+      // Primary color with opacity
+      text: "#00EFFF"
+      // Primary color
+    }
+  },
+  typography: {
+    fontFamily: "system-ui, Inter, -apple-system, BlinkMacSystemFont, sans-serif",
+    fontSize: 16,
+    h1: { fontWeight: 600, textShadow: "0 0 5px #00EFFF" },
+    h2: { fontWeight: 600, textShadow: "0 0 4px #00EFFF" },
+    h3: {
+      fontWeight: 600,
+      fontSize: "3rem",
+      textShadow: "0 0 3px #00EFFF",
+      "@media (max-width:600px)": {
+        fontSize: "2.7rem"
+      }
+    },
+    gradientTitle: {
+      fontSize: "1.4rem",
+      fontWeight: 400,
+      letterSpacing: "0.02em",
+      background: "linear-gradient(90deg, #00EFFF, #B0E0FF)",
+      // Cyan to light blue gradient
+      WebkitBackgroundClip: "text",
+      WebkitTextFillColor: "transparent",
+      textShadow: "0 0 10px rgba(0, 239, 255, 0.3)"
+    }
+  },
+  components: {
+    MuiAppBar: {
+      styleOverrides: {
+        root: {
+          top: 0,
+          background: "rgba(8, 12, 24, 0.85)",
+          // Dark blue with alpha
+          backdropFilter: "blur(12px)",
+          // Stronger blur
+          boxShadow: "0 2px 10px rgba(0, 239, 255, 0.2)"
+          // Neon glow shadow
+        }
+      }
+    },
+    MuiListItemButton: {
+      styleOverrides: {
+        root: ({ theme }) => ({
+          borderRadius: 8,
+          transition: "all 0.2s ease-in-out",
+          paddingTop: 12,
+          paddingBottom: 12,
+          border: "1px solid transparent",
+          "&:hover": {
+            background: "rgba(0, 239, 255, 0.08)",
+            borderColor: "rgba(0, 239, 255, 0.2)",
+            backdropFilter: "blur(4px)"
+          },
+          "&.Mui-selected": {
+            background: "rgba(0, 239, 255, 0.15)",
+            borderColor: "rgba(0, 239, 255, 0.4)",
+            boxShadow: `0 0 8px ${theme.palette.primary.main}33`
+          }
+        })
+      }
+    },
+    MuiIconButton: {
+      styleOverrides: {
+        root: {
+          color: "rgba(224, 224, 224, 0.9)",
+          marginRight: 8,
+          transition: "all 0.2s ease-in-out",
+          "&:hover": {
+            background: "rgba(0, 239, 255, 0.1)",
+            color: "#00EFFF",
+            // Primary color on hover
+            textShadow: "0 0 5px #00EFFF"
+          }
+        }
+      }
+    },
+    MuiButton: {
+      variants: [
+        {
+          props: { variant: "nav" },
+          style: ({ theme }) => ({
+            color: "rgba(224, 224, 224, 0.9)",
+            margin: "0 4px",
+            padding: "8px 16px",
+            borderRadius: 8,
+            border: "1px solid rgba(0, 239, 255, 0.2)",
+            transition: "all 0.2s ease-in-out",
+            "&:hover": {
+              background: "rgba(0, 239, 255, 0.1)",
+              borderColor: "rgba(0, 239, 255, 0.5)",
+              color: theme.palette.primary.main,
+              boxShadow: `0 0 8px ${theme.palette.primary.main}55`,
+              backdropFilter: "blur(4px)"
+            }
+          })
+        }
+      ],
+      styleOverrides: {
+        root: {
+          textTransform: "none",
+          borderRadius: 8,
+          padding: "8px 16px",
+          transition: "all 0.2s ease-in-out"
+        },
+        containedPrimary: ({ theme }) => ({
+          boxShadow: `0 0 10px ${theme.palette.primary.main}77`,
+          border: `1px solid ${theme.palette.primary.dark}`,
+          "&:hover": {
+            boxShadow: `0 0 15px ${theme.palette.primary.main}AA`,
+            backgroundColor: theme.palette.primary.dark
+          }
+        }),
+        containedSecondary: ({ theme }) => ({
+          boxShadow: `0 0 10px ${theme.palette.secondary.main}77`,
+          border: `1px solid ${theme.palette.secondary.dark}`,
+          "&:hover": {
+            boxShadow: `0 0 15px ${theme.palette.secondary.main}AA`,
+            backgroundColor: theme.palette.secondary.dark
+          }
+        }),
+        outlinedPrimary: ({ theme }) => ({
+          borderColor: theme.palette.primary.main,
+          color: theme.palette.primary.main,
+          "&:hover": {
+            backgroundColor: "rgba(0, 239, 255, 0.1)",
+            borderColor: theme.palette.primary.light,
+            boxShadow: `0 0 8px ${theme.palette.primary.main}55`
+          }
+        })
+      }
+    },
+    MuiCard: {
+      styleOverrides: {
+        root: () => ({
+          backgroundColor: "rgba(13, 18, 32, 0.85)",
+          // Slightly lighter dark blue with alpha
+          borderRadius: 12,
+          border: "1px solid rgba(0, 239, 255, 0.25)",
+          // Primary color border
+          backdropFilter: "blur(10px)",
+          boxShadow: "0 4px 15px rgba(0, 239, 255, 0.1)"
+          // Neon glow
+        })
+      }
+    },
+    MuiContainer: {
+      styleOverrides: {
+        maxWidthLg: {
+          maxWidth: "1300px",
+          "@media (min-width:1300px)": {
+            maxWidth: "1300px"
+          }
+        },
+        maxWidthXl: {
+          maxWidth: "1800px",
+          "@media (min-width:1800px)": {
+            maxWidth: "1800px"
+          }
+        }
+      }
+    }
+  }
+});
+const obsidianTheme = createTheme({
+  breakpoints: {
+    values: {
+      xs: 0,
+      sm: 600,
+      md: 900,
+      lg: 1300,
+      xl: 1800
+    }
+  },
+  palette: {
+    mode: "dark",
+    primary: {
+      // Accent color - typically white or light grey in monochrome
+      main: "#FAFAFA",
+      // Very light grey / off-white
+      dark: "#E0E0E0",
+      // Slightly darker for pressed states
+      light: "#FFFFFF",
+      // Pure white for hover states or highlights
+      contrastText: "#09090B"
+      // Text on primary elements
+    },
+    secondary: {
+      // Secondary accent - a mid-grey
+      main: "#A1A1AA",
+      // Shadcn zinc-500
+      dark: "#71717A",
+      // Shadcn zinc-600
+      light: "#D4D4D8",
+      // Shadcn zinc-400
+      contrastText: "#09090B"
+      // Text on secondary elements
+    },
+    background: {
+      default: "#09090B",
+      // Shadcn zinc-950 (very dark grey, near black)
+      paper: "#18181B"
+      // Shadcn zinc-900 (slightly lighter for cards/surfaces)
+    },
+    text: {
+      primary: "#FAFAFA",
+      // Shadcn zinc-50 (off-white)
+      secondary: "#A1A1AA"
+      // Shadcn zinc-500 (grey for secondary text)
+    },
+    caption: "rgba(250, 250, 250, 0.7)",
+    // Off-white with alpha
+    sidebar: {
+      background: "#09090B",
+      // Main navigation sidebar
+      secondaryBackground: "#18181B",
+      // Secondary sidebars (chat/agents)
+      border: "rgba(250, 250, 250, 0.12)",
+      // Light border (zinc-50 alpha)
+      itemHover: "rgba(250, 250, 250, 0.08)",
+      itemActive: "rgba(250, 250, 250, 0.15)",
+      // Active item background
+      itemActiveHover: "rgba(250, 250, 250, 0.2)",
+      itemText: "#A1A1AA",
+      // Grey for normal items
+      itemActiveText: "#FAFAFA",
+      // White for active items
+      toggleButton: {
+        background: "rgba(250, 250, 250, 0.05)",
+        border: "rgba(250, 250, 250, 0.15)",
+        hoverBackground: "rgba(250, 250, 250, 0.1)",
+        hoverBorder: "rgba(250, 250, 250, 0.3)"
+      }
+    },
+    tooltip: {
+      background: "#27272A",
+      // Shadcn zinc-800
+      border: "rgba(250, 250, 250, 0.15)",
+      text: "#FAFAFA"
+    },
+    userMessage: {
+      background: "rgba(250, 250, 250, 0.07)",
+      // Subtle light background
+      border: "rgba(250, 250, 250, 0.2)",
+      shadow: "0 2px 8px rgba(250, 250, 250, 0.05)"
+    },
+    messagesView: {
+      background: "#030711"
+      // Even darker for message view (near black)
+    },
+    inputField: {
+      background: "#18181B",
+      // zinc-900
+      hoverBackground: "#27272A",
+      // zinc-800
+      focusBackground: "#27272A",
+      // zinc-800
+      border: "rgba(250, 250, 250, 0.2)"
+      // zinc-500
+    },
+    actionHighlight: {
+      done: {
+        background: "rgba(250, 250, 250, 0.1)",
+        // Light grey highlight
+        border: "rgba(250, 250, 250, 0.3)"
+      },
+      ask: {
+        background: "rgba(161, 161, 170, 0.15)",
+        // Mid-grey highlight (secondary based)
+        border: "rgba(161, 161, 170, 0.4)"
+      }
+    },
+    icon: {
+      background: "rgba(250, 250, 250, 0.1)",
+      text: "#FAFAFA"
+    }
+  },
+  typography: {
+    fontFamily: "system-ui, Inter, -apple-system, BlinkMacSystemFont, sans-serif",
+    // Standard system/Inter font
+    fontSize: 16,
+    h1: { fontWeight: 700 },
+    h2: { fontWeight: 700 },
+    h3: {
+      fontWeight: 700,
+      fontSize: "3rem",
+      "@media (max-width:600px)": {
+        fontSize: "2.7rem"
+      }
+    },
+    gradientTitle: {
+      // Less emphasis on gradient for monochrome
+      fontSize: "1.4rem",
+      fontWeight: 600,
+      letterSpacing: "0.01em",
+      color: "#FAFAFA"
+      // Solid off-white
+    }
+  },
+  components: {
+    MuiAppBar: {
+      styleOverrides: {
+        root: {
+          top: 0,
+          background: "rgba(9, 9, 11, 0.85)",
+          // zinc-950 with alpha
+          backdropFilter: "blur(8px)",
+          boxShadow: "0 1px 0 rgba(250, 250, 250, 0.08)"
+          // Subtle bottom border
+        }
+      }
+    },
+    MuiListItemButton: {
+      styleOverrides: {
+        root: ({ theme }) => ({
+          borderRadius: 8,
+          transition: "background-color 0.2s ease-in-out, border-color 0.2s ease-in-out",
+          paddingTop: 12,
+          paddingBottom: 12,
+          border: "1px solid transparent",
+          "&:hover": {
+            background: "rgba(250, 250, 250, 0.05)",
+            // Subtle hover
+            borderColor: "rgba(250, 250, 250, 0.1)"
+          },
+          "&.Mui-selected": {
+            background: "rgba(250, 250, 250, 0.08)",
+            borderColor: "rgba(250, 250, 250, 0.2)",
+            color: theme.palette.text.primary
+            // Ensure text is primary on selected
+          }
+        })
+      }
+    },
+    MuiIconButton: {
+      styleOverrides: {
+        root: {
+          color: "#A1A1AA",
+          // zinc-500
+          marginRight: 8,
+          transition: "background-color 0.2s ease-in-out, color 0.2s ease-in-out",
+          "&:hover": {
+            background: "rgba(250, 250, 250, 0.08)",
+            color: "#FAFAFA"
+            // zinc-50
+          }
+        }
+      }
+    },
+    MuiButton: {
+      variants: [
+        {
+          props: { variant: "nav" },
+          style: ({ theme }) => ({
+            color: theme.palette.text.secondary,
+            // zinc-500
+            margin: "0 4px",
+            padding: "8px 16px",
+            borderRadius: 8,
+            border: "1px solid rgba(250, 250, 250, 0.15)",
+            // zinc-50 alpha
+            transition: "all 0.2s ease-in-out",
+            "&:hover": {
+              background: "rgba(250, 250, 250, 0.05)",
+              borderColor: "rgba(250, 250, 250, 0.3)",
+              color: theme.palette.text.primary
+              // zinc-50
+            }
+          })
+        }
+      ],
+      styleOverrides: {
+        root: {
+          textTransform: "none",
+          borderRadius: 6,
+          // Shadcn default
+          fontWeight: 500,
+          padding: "8px 16px",
+          transition: "all 0.2s ease-in-out"
+        },
+        containedPrimary: ({ theme }) => ({
+          backgroundColor: theme.palette.primary.main,
+          // off-white
+          color: theme.palette.primary.contrastText,
+          // black
+          boxShadow: "none",
+          "&:hover": {
+            backgroundColor: theme.palette.primary.dark,
+            // slightly darker off-white
+            boxShadow: "none"
+          }
+        }),
+        containedSecondary: ({ theme }) => ({
+          backgroundColor: theme.palette.secondary.main,
+          // mid-grey
+          color: theme.palette.secondary.contrastText,
+          // black
+          boxShadow: "none",
+          "&:hover": {
+            backgroundColor: theme.palette.secondary.dark,
+            // darker mid-grey
+            boxShadow: "none"
+          }
+        }),
+        outlinedPrimary: ({ theme }) => ({
+          borderColor: "rgba(250, 250, 250, 0.3)",
+          // Light border
+          color: theme.palette.text.primary,
+          "&:hover": {
+            backgroundColor: "rgba(250, 250, 250, 0.05)",
+            borderColor: "rgba(250, 250, 250, 0.5)"
+          }
+        })
+      }
+    },
+    MuiCard: {
+      styleOverrides: {
+        root: {
+          backgroundColor: "#18181B",
+          // zinc-900
+          borderRadius: 8,
+          // Shadcn often uses 0.5rem
+          border: "1px solid rgba(250, 250, 250, 0.12)",
+          // zinc-50 alpha border
+          boxShadow: "none"
+          // Shadcn cards usually don't have shadow by default
+        }
+      }
+    },
+    MuiContainer: {
+      styleOverrides: {
+        maxWidthLg: {
+          maxWidth: "1300px",
+          "@media (min-width:1300px)": {
+            maxWidth: "1300px"
+          }
+        },
+        maxWidthXl: {
+          maxWidth: "1800px",
+          "@media (min-width:1800px)": {
+            maxWidth: "1800px"
+          }
+        }
+      }
+    }
+  }
+});
 const radientTheme = createTheme({
   breakpoints: {
     values: {
@@ -29711,6 +30281,302 @@ const sageTheme = createTheme({
     }
   }
 });
+const synthTheme = createTheme({
+  breakpoints: {
+    values: {
+      xs: 0,
+      sm: 600,
+      md: 900,
+      lg: 1300,
+      xl: 1800
+    }
+  },
+  palette: {
+    mode: "dark",
+    primary: {
+      main: "#FF4081",
+      // Vibrant Pink
+      dark: "#F50057",
+      // Darker Pink
+      light: "#FF79B0",
+      // Lighter Pink
+      contrastText: "#FFFFFF"
+    },
+    secondary: {
+      main: "#00E5FF",
+      // Neon Blue
+      dark: "#00B8D4",
+      // Darker Neon Blue
+      light: "#69FFFF",
+      // Lighter Neon Blue
+      contrastText: "#000000"
+    },
+    background: {
+      default: "#120720",
+      // Even Darker Purple/Indigo
+      paper: "#1B0A2F"
+      // Even Slightly Lighter Darker Purple
+    },
+    text: {
+      primary: "#F9FAFB",
+      // from darkTheme
+      secondary: "#9CA3AF"
+      // from darkTheme
+    },
+    caption: "rgba(255, 255, 255, 0.8)",
+    // from darkTheme
+    sidebar: {
+      background: "#120720",
+      // Main navigation sidebar (Even Darker Purple)
+      secondaryBackground: "#1B0A2F",
+      // Secondary sidebars (Even Slightly Lighter Darker Purple)
+      border: "rgba(255, 64, 129, 0.2)",
+      // Primary color (Vibrant Pink) with alpha
+      itemHover: "rgba(255, 64, 129, 0.1)",
+      itemActive: "rgba(0, 229, 255, 0.2)",
+      // Neon Blue with opacity
+      itemActiveHover: "rgba(0, 229, 255, 0.25)",
+      // Neon Blue with higher opacity for hover
+      itemText: "rgba(255, 255, 255, 0.85)",
+      // from darkTheme
+      itemActiveText: "#00E5FF",
+      // Neon Blue
+      toggleButton: {
+        background: "rgba(255, 64, 129, 0.08)",
+        border: "rgba(255, 64, 129, 0.25)",
+        hoverBackground: "rgba(255, 64, 129, 0.15)",
+        hoverBorder: "rgba(255, 64, 129, 0.45)"
+      }
+    },
+    tooltip: {
+      background: "#2C1D43",
+      // Darker Purple
+      border: "rgba(255, 64, 129, 0.25)",
+      text: "#FFFFFF"
+      // from darkTheme
+    },
+    userMessage: {
+      background: "rgba(255, 64, 129, 0.1)",
+      // Primary color (Vibrant Pink) with alpha
+      border: "rgba(255, 64, 129, 0.35)",
+      shadow: "0 4px 12px rgba(255, 64, 129, 0.2)"
+    },
+    messagesView: {
+      background: "rgba(18, 7, 32, 0.6)"
+      // Even Darker Purple background for messages view
+    },
+    inputField: {
+      background: "rgba(18, 7, 32, 0.9)",
+      // Even Darker Purple
+      hoverBackground: "rgba(27, 10, 47, 0.9)",
+      // Even Darker Purple hover
+      focusBackground: "#2C1D43",
+      // Darker Purple
+      border: "rgba(0, 229, 255, 0.25)"
+      // Neon Blue border
+    },
+    actionHighlight: {
+      done: {
+        background: "rgba(0, 229, 255, 0.1)",
+        // Neon Blue with opacity
+        border: "rgba(0, 229, 255, 0.4)"
+      },
+      ask: {
+        background: "rgba(255, 165, 0, 0.15)",
+        // Bright Orange with opacity
+        border: "rgba(255, 165, 0, 0.5)"
+        // Bright Orange for border
+      }
+    },
+    icon: {
+      background: "rgba(255, 64, 129, 0.15)",
+      // Primary color (Vibrant Pink) with opacity
+      text: "#FF4081"
+      // Primary color (Vibrant Pink)
+    }
+  },
+  typography: {
+    fontFamily: "system-ui, Inter, -apple-system, BlinkMacSystemFont, sans-serif",
+    // from darkTheme
+    fontSize: 16,
+    // from darkTheme
+    h1: { fontWeight: 600 },
+    // from darkTheme
+    h2: { fontWeight: 600 },
+    // from darkTheme
+    h3: {
+      // from darkTheme (structure)
+      fontWeight: 600,
+      fontSize: "3rem",
+      textShadow: "0 0 5px #FF4081",
+      // Keep some pink shadow for vibrancy
+      "@media (max-width:600px)": {
+        fontSize: "2.7rem"
+      }
+    },
+    gradientTitle: {
+      // from darkTheme (structure), but with synth colors
+      fontSize: "1.4rem",
+      fontWeight: 400,
+      letterSpacing: "0.02em",
+      background: "linear-gradient(90deg, #FF4081, #FFA500, #00E5FF)",
+      // Pink to Orange to Blue gradient
+      WebkitBackgroundClip: "text",
+      WebkitTextFillColor: "transparent",
+      textShadow: "0 0 10px rgba(255, 64, 129, 0.3), 0 0 15px rgba(0, 229, 255, 0.2)"
+      // Adjusted synth shadow
+    }
+  },
+  components: {
+    MuiAppBar: {
+      styleOverrides: {
+        root: {
+          top: 0,
+          background: "rgba(18, 7, 32, 0.88)",
+          // Even Darker Purple with alpha
+          backdropFilter: "blur(10px)",
+          boxShadow: "0 2px 12px rgba(255, 64, 129, 0.25)"
+          // Pink glow shadow
+        }
+      }
+    },
+    MuiListItemButton: {
+      styleOverrides: {
+        root: ({ theme }) => ({
+          borderRadius: 6,
+          // Sharper edges
+          transition: "all 0.15s ease-in-out",
+          paddingTop: 10,
+          paddingBottom: 10,
+          border: "1px solid transparent",
+          "&:hover": {
+            background: "rgba(255, 64, 129, 0.1)",
+            // Pink hover
+            borderColor: "rgba(255, 64, 129, 0.25)",
+            backdropFilter: "blur(3px)"
+          },
+          "&.Mui-selected": {
+            background: "rgba(0, 229, 255, 0.18)",
+            // Blue selected
+            borderColor: "rgba(0, 229, 255, 0.45)",
+            boxShadow: `0 0 10px ${theme.palette.secondary.main}44`
+            // Blue glow
+          }
+        })
+      }
+    },
+    MuiIconButton: {
+      styleOverrides: {
+        root: {
+          color: "rgba(240, 244, 248, 0.9)",
+          marginRight: 6,
+          transition: "all 0.15s ease-in-out",
+          "&:hover": {
+            background: "rgba(255, 64, 129, 0.12)",
+            // Pink hover
+            color: "#FF4081",
+            // Pink color on hover
+            textShadow: "0 0 6px #FF4081"
+          }
+        }
+      }
+    },
+    MuiButton: {
+      variants: [
+        {
+          props: { variant: "nav" },
+          style: ({ theme }) => ({
+            color: "rgba(240, 244, 248, 0.9)",
+            margin: "0 3px",
+            padding: "7px 14px",
+            borderRadius: 6,
+            // Sharper edges
+            border: "1px solid rgba(0, 229, 255, 0.25)",
+            // Blue border
+            transition: "all 0.15s ease-in-out",
+            fontSize: "0.8rem",
+            "&:hover": {
+              background: "rgba(0, 229, 255, 0.12)",
+              // Blue hover
+              borderColor: "rgba(0, 229, 255, 0.55)",
+              color: theme.palette.secondary.main,
+              // Blue text
+              boxShadow: `0 0 10px ${theme.palette.secondary.main}66`,
+              backdropFilter: "blur(3px)"
+            }
+          })
+        }
+      ],
+      styleOverrides: {
+        root: {
+          textTransform: "uppercase",
+          // Uppercase for retro feel
+          borderRadius: 6,
+          // Sharper edges
+          padding: "7px 14px",
+          transition: "all 0.15s ease-in-out"
+        },
+        containedPrimary: ({ theme }) => ({
+          boxShadow: `0 0 12px ${theme.palette.primary.main}88`,
+          border: `1px solid ${theme.palette.primary.dark}`,
+          "&:hover": {
+            boxShadow: `0 0 18px ${theme.palette.primary.main}BB`,
+            backgroundColor: theme.palette.primary.dark
+          }
+        }),
+        containedSecondary: ({ theme }) => ({
+          boxShadow: `0 0 12px ${theme.palette.secondary.main}88`,
+          border: `1px solid ${theme.palette.secondary.dark}`,
+          "&:hover": {
+            boxShadow: `0 0 18px ${theme.palette.secondary.main}BB`,
+            backgroundColor: theme.palette.secondary.dark
+          }
+        }),
+        outlinedPrimary: ({ theme }) => ({
+          borderColor: theme.palette.primary.main,
+          color: theme.palette.primary.main,
+          "&:hover": {
+            backgroundColor: "rgba(255, 64, 129, 0.12)",
+            // Pink hover
+            borderColor: theme.palette.primary.light,
+            boxShadow: `0 0 10px ${theme.palette.primary.main}66`
+          }
+        })
+      }
+    },
+    MuiCard: {
+      styleOverrides: {
+        root: () => ({
+          backgroundColor: "rgba(27, 10, 47, 0.9)",
+          // Even Darker Purple with alpha
+          borderRadius: 10,
+          // Slightly less rounded
+          border: "1px solid rgba(255, 64, 129, 0.3)",
+          // Pink border
+          backdropFilter: "blur(8px)",
+          boxShadow: "0 5px 18px rgba(255, 64, 129, 0.15)"
+          // Pink glow
+        })
+      }
+    },
+    MuiContainer: {
+      styleOverrides: {
+        maxWidthLg: {
+          maxWidth: "1300px",
+          "@media (min-width:1300px)": {
+            maxWidth: "1300px"
+          }
+        },
+        maxWidthXl: {
+          maxWidth: "1800px",
+          "@media (min-width:1800px)": {
+            maxWidth: "1800px"
+          }
+        }
+      }
+    }
+  }
+});
 const tokyoNightTheme = createTheme({
   breakpoints: {
     values: {
@@ -29972,6 +30838,21 @@ const themes = {
     name: "Radient",
     id: "radient",
     theme: radientTheme
+  },
+  neon: {
+    name: "Neon",
+    id: "neon",
+    theme: neonTheme
+  },
+  obsidian: {
+    name: "Obsidian",
+    id: "obsidian",
+    theme: obsidianTheme
+  },
+  synth: {
+    name: "Synth",
+    id: "synth",
+    theme: synthTheme
   }
 };
 const DEFAULT_THEME = "localOperatorDark";
@@ -30139,170 +31020,179 @@ const ErrorBoundary2 = ({
   );
 };
 export {
-  clamp as $,
-  duration as A,
-  useTheme as B,
-  useTimeout as C,
-  useId as D,
-  ButtonBase as E,
-  alpha as F,
-  createSimplePaletteValueFilter as G,
-  CircularProgress as H,
-  darken as I,
-  lighten as J,
-  useEventCallback as K,
-  useEnhancedEffect as L,
-  useRtl as M,
-  globalCss as N,
-  formatMuiErrorMessage as O,
+  getPath as $,
+  capitalize$1 as A,
+  memoTheme as B,
+  _objectWithoutPropertiesLoose$1 as C,
+  TransitionGroupContext as D,
+  _extends as E,
+  duration as F,
+  useTheme as G,
+  useTimeout as H,
+  useId as I,
+  ButtonBase as J,
+  alpha as K,
+  createSimplePaletteValueFilter as L,
+  CircularProgress as M,
+  darken as N,
+  lighten as O,
   Paper as P,
-  rootShouldForwardProp as Q,
-  React as R,
-  Typography as S,
-  TransitionGroupContext as T,
-  css$1 as U,
-  keyframes as V,
-  getPath as W,
-  isFocusVisible as X,
-  typographyClasses as Y,
-  slotShouldForwardProp as Z,
+  useEventCallback as Q,
+  React$1 as R,
+  useRtl as S,
+  THEME_ID as T,
+  globalCss as U,
+  formatMuiErrorMessage as V,
+  rootShouldForwardProp as W,
+  Typography as X,
+  css$1 as Y,
+  keyframes as Z,
   _inheritsLoose as _,
-  reactExports as a,
-  faChevronUp as a$,
-  emphasize as a0,
-  Timeout as a1,
-  createLucideIcon as a2,
-  Button as a3,
-  Box as a4,
-  FontAwesomeIcon as a5,
-  faExclamationTriangle as a6,
-  DEFAULT_THEME as a7,
-  faChevronLeft as a8,
-  faChevronRight as a9,
-  faDownload as aA,
-  faFileAlt as aB,
-  faDesktop as aC,
-  faImage as aD,
-  faMusic as aE,
-  faVideo as aF,
-  faLaptop as aG,
-  faUsers as aH,
-  faDatabase as aI,
-  faBoxOpen as aJ,
-  faBook as aK,
-  faHdd as aL,
-  faBox as aM,
-  faArchive as aN,
-  faNetworkWired as aO,
-  faFolder as aP,
-  faFolderOpen as aQ,
-  faFolderTree as aR,
-  faChevronDown as aS,
-  faTools as aT,
-  _extends as aU,
-  faSliders as aV,
-  faTrash as aW,
-  faArrowDown as aX,
-  faPaperclip as aY,
-  faStop as aZ,
-  faPaperPlane as a_,
-  faRobot as aa,
-  faCheck as ab,
-  faTimes as ac,
-  faEraser as ad,
-  faPen as ae,
-  faFileImport as af,
-  faUpload as ag,
-  requireReact as ah,
-  faComment as ai,
-  faSave as aj,
-  faEdit as ak,
-  faTrashAlt as al,
-  faComments as am,
-  faInfoCircle as an,
-  faGear as ao,
-  faPlus as ap,
-  faServer as aq,
-  faStar as ar,
-  faTag as as,
-  faIdCard as at,
-  faCalendarAlt as au,
-  faCodeBranch as av,
-  faShieldAlt as aw,
-  faArrowLeft as ax,
-  faClock as ay,
-  faHome as az,
-  clsx as b,
-  faQuestion as b0,
-  faFile as b1,
-  faExclamationCircle as b2,
-  faLightbulb as b3,
-  faCode as b4,
-  faCommentDots as b5,
-  faShare as b6,
-  faPencilAlt as b7,
-  faUser as b8,
-  faCopy as b9,
-  faAdjust as bA,
-  faCreditCard as bB,
-  faPlusCircle as bC,
-  faChartLine as bD,
-  faShield as bE,
-  library$1 as bF,
-  icons as bG,
-  CssBaseline as bH,
-  ThemeProvider as bI,
-  getTheme as bJ,
-  ReactDOM as bK,
-  ErrorBoundary2 as bL,
-  isDevelopmentMode as ba,
-  faCommentSlash as bb,
-  faArrowRight as bc,
-  faBrain as bd,
-  faWandMagicSparkles as be,
-  faExternalLinkAlt as bf,
-  faKey as bg,
-  radientTheme as bh,
-  faGlobe as bi,
-  faSearch as bj,
-  commonjsGlobal as bk,
-  PropTypes as bl,
-  faLock as bm,
-  faSignOut as bn,
-  themes as bo,
-  faMoon as bp,
-  faSun as bq,
-  faHexagonNodes as br,
-  faSkull as bs,
-  faLeaf as bt,
-  faMountain as bu,
-  faFire as bv,
-  faIcicles as bw,
-  faEnvelope as bx,
-  faHistory as by,
-  faListAlt as bz,
+  useTheme$3 as a,
+  faPaperclip as a$,
+  isFocusVisible as a0,
+  typographyClasses as a1,
+  slotShouldForwardProp as a2,
+  clamp as a3,
+  emphasize as a4,
+  Timeout as a5,
+  createLucideIcon as a6,
+  Button as a7,
+  Box as a8,
+  FontAwesomeIcon as a9,
+  faShieldAlt as aA,
+  faArrowLeft as aB,
+  faClock as aC,
+  faHome as aD,
+  faDownload as aE,
+  faFileAlt as aF,
+  faDesktop as aG,
+  faImage as aH,
+  faMusic as aI,
+  faVideo as aJ,
+  faLaptop as aK,
+  faUsers as aL,
+  faDatabase as aM,
+  faBoxOpen as aN,
+  faBook as aO,
+  faHdd as aP,
+  faBox as aQ,
+  faArchive as aR,
+  faNetworkWired as aS,
+  faFolder as aT,
+  faFolderOpen as aU,
+  faFolderTree as aV,
+  faChevronDown as aW,
+  faTools as aX,
+  faSliders as aY,
+  faTrash as aZ,
+  faArrowDown as a_,
+  faExclamationTriangle as aa,
+  DEFAULT_THEME as ab,
+  faChevronLeft as ac,
+  faChevronRight as ad,
+  faRobot as ae,
+  faCheck as af,
+  faTimes as ag,
+  faEraser as ah,
+  faPen as ai,
+  faFileImport as aj,
+  faUpload as ak,
+  requireReact as al,
+  faComment as am,
+  faSave as an,
+  faEdit as ao,
+  faTrashAlt as ap,
+  faComments as aq,
+  faInfoCircle as ar,
+  faGear as as,
+  faPlus as at,
+  faServer as au,
+  faStar as av,
+  faTag as aw,
+  faIdCard as ax,
+  faCalendarAlt as ay,
+  faCodeBranch as az,
+  reactExports as b,
+  faStop as b0,
+  faPaperPlane as b1,
+  faChevronUp as b2,
+  faQuestion as b3,
+  faFile as b4,
+  faExclamationCircle as b5,
+  faLightbulb as b6,
+  faCode as b7,
+  faCommentDots as b8,
+  faShare as b9,
+  faLeaf as bA,
+  faMountain as bB,
+  faFire as bC,
+  faIcicles as bD,
+  faBolt as bE,
+  faAdjust as bF,
+  faWaveSquare as bG,
+  faEnvelope as bH,
+  faHistory as bI,
+  faListAlt as bJ,
+  faCreditCard as bK,
+  faPlusCircle as bL,
+  faChartLine as bM,
+  faShield as bN,
+  library$1 as bO,
+  icons as bP,
+  CssBaseline as bQ,
+  ThemeProvider as bR,
+  getTheme as bS,
+  ReactDOM as bT,
+  ErrorBoundary2 as bU,
+  faPencilAlt as ba,
+  faUser as bb,
+  faCopy as bc,
+  isDevelopmentMode as bd,
+  faCommentSlash as be,
+  faArrowRight as bf,
+  faBrain as bg,
+  faWandMagicSparkles as bh,
+  faExternalLinkAlt as bi,
+  faKey as bj,
+  radientTheme as bk,
+  faGlobe as bl,
+  faSearch as bm,
+  PropTypes as bn,
+  shouldForwardProp as bo,
+  TransitionGroup as bp,
+  commonjsGlobal as bq,
+  faLock as br,
+  faPuzzlePiece as bs,
+  HardDrive as bt,
+  faSignOut as bu,
+  themes as bv,
+  faMoon as bw,
+  faSun as bx,
+  faHexagonNodes as by,
+  faSkull as bz,
   createStyled2 as c,
-  useForkRef as d,
-  extendSxProp$1 as e,
-  resolveBreakpointValues as f,
-  createUnarySpacing as g,
+  useEnhancedEffect as d,
+  clsx as e,
+  useForkRef as f,
+  extendSxProp$1 as g,
   handleBreakpoints as h,
-  deepmerge as i,
+  resolveBreakpointValues as i,
   jsxRuntimeExports as j,
-  composeClasses as k,
-  generateUtilityClass as l,
+  createUnarySpacing as k,
+  deepmerge as l,
   mergeBreakpointsInOrder as m,
-  createTheme$1 as n,
-  getValue as o,
-  getDefaultExportFromCjs as p,
-  requireReactDom as q,
+  composeClasses as n,
+  generateUtilityClass as o,
+  createTheme$1 as p,
+  getValue as q,
   resolveProps as r,
-  React$1 as s,
-  generateUtilityClasses as t,
+  React as s,
+  getDefaultExportFromCjs as t,
   useTheme$2 as u,
-  useDefaultProps as v,
-  styled as w,
-  capitalize$1 as x,
-  memoTheme as y,
-  _objectWithoutPropertiesLoose$1 as z
+  requireReactDom as v,
+  defaultTheme$1 as w,
+  generateUtilityClasses as x,
+  useDefaultProps as y,
+  styled as z
 };