@industry-theme/repository-composition-panels 0.2.42 → 0.2.43

package/dist/panels.bundle.js

@@ -2,10 +2,32 @@ var __defProp = Object.defineProperty;
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
 var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
 import require$$0, { jsxs, jsx, Fragment } from "react/jsx-runtime";
-import require$$1$1, { forwardRef, createElement, useCallback, useState, useRef, useEffect, useMemo } from "react";
+import React2, { createContext, useContext, forwardRef, createElement, useCallback, useState, useRef, useEffect, useMemo } from "react";
 import require$$2, { createPortal } from "react-dom";
-import require$$2$1, { useTheme } from "@principal-ade/industry-theme";
 import { GitStatusFileTree, calculateTelemetryCoverageStats, TelemetryCoverageFileTree } from "@principal-ade/dynamic-file-tree";
+var ThemeContext;
+var getThemeContext = () => {
+  if (typeof window !== "undefined") {
+    const globalWindow = window;
+    if (!globalWindow.__principlemd_theme_context__) {
+      globalWindow.__principlemd_theme_context__ = createContext(void 0);
+    }
+    return globalWindow.__principlemd_theme_context__;
+  } else {
+    if (!ThemeContext) {
+      ThemeContext = createContext(void 0);
+    }
+    return ThemeContext;
+  }
+};
+var ThemeContextSingleton = getThemeContext();
+var useTheme = () => {
+  const context = useContext(ThemeContextSingleton);
+  if (!context) {
+    throw new Error("useTheme must be used within a ThemeProvider");
+  }
+  return context;
+};
 class _ {
   static buildTreeFromPaths(j, k = "") {
     let q2 = k.endsWith("/") ? k.slice(0, -1) : k, E = /* @__PURE__ */ new Map(), J = [], O = [], X2 = /* @__PURE__ */ new Set();
@@ -788,7 +810,7 @@ const EMPTY_GIT_STATUS = {
   untracked: [],
   deleted: []
 };
-const ToggleButtons = require$$1$1.memo(({ showFullTree, onShowFullTree, onShowChanges, theme }) => /* @__PURE__ */ jsxs(
+const ToggleButtons = React2.memo(({ showFullTree, onShowFullTree, onShowChanges, theme }) => /* @__PURE__ */ jsxs(
   "div",
   {
     style: {
@@ -4885,7 +4907,7 @@ function requireUmd() {
   hasRequiredUmd = 1;
   (function(module, exports$1) {
     !(function(e, t) {
-      t(exports$1, require$$0, require$$1$1, require$$2);
+      t(exports$1, require$$0, React2, require$$2);
     })(umd, (function(e, t, n, o) {
       function r(e2) {
         if ("string" == typeof e2 || "number" == typeof e2) return "" + e2;
@@ -15437,6 +15459,2000 @@ const dist = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty
   validatePrivuConfig
 }, Symbol.toStringTag, { value: "Module" }));
 const require$$4 = /* @__PURE__ */ getAugmentedNamespace(dist);
+var cjs;
+var hasRequiredCjs;
+function requireCjs() {
+  if (hasRequiredCjs) return cjs;
+  hasRequiredCjs = 1;
+  var __create = Object.create;
+  var __getProtoOf = Object.getPrototypeOf;
+  var __defProp2 = Object.defineProperty;
+  var __getOwnPropNames = Object.getOwnPropertyNames;
+  var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+  var __hasOwnProp = Object.prototype.hasOwnProperty;
+  var __toESM = (mod, isNodeMode, target) => {
+    target = mod != null ? __create(__getProtoOf(mod)) : {};
+    const to2 = !mod || !mod.__esModule ? __defProp2(target, "default", { value: mod, enumerable: true }) : target;
+    for (let key of __getOwnPropNames(mod))
+      if (!__hasOwnProp.call(to2, key))
+        __defProp2(to2, key, {
+          get: () => mod[key],
+          enumerable: true
+        });
+    return to2;
+  };
+  var __moduleCache = /* @__PURE__ */ new WeakMap();
+  var __toCommonJS = (from) => {
+    var entry = __moduleCache.get(from), desc;
+    if (entry)
+      return entry;
+    entry = __defProp2({}, "__esModule", { value: true });
+    if (from && typeof from === "object" || typeof from === "function")
+      __getOwnPropNames(from).map((key) => !__hasOwnProp.call(entry, key) && __defProp2(entry, key, {
+        get: () => from[key],
+        enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+      }));
+    __moduleCache.set(from, entry);
+    return entry;
+  };
+  var __export = (target, all) => {
+    for (var name in all)
+      __defProp2(target, name, {
+        get: all[name],
+        enumerable: true,
+        configurable: true,
+        set: (newValue) => all[name] = () => newValue
+      });
+  };
+  var exports_src = {};
+  __export(exports_src, {
+    withTheme: () => withTheme,
+    useTheme: () => useTheme2,
+    theme: () => theme,
+    terminalTheme: () => terminalTheme,
+    sx: () => sx,
+    slateTheme: () => slateTheme,
+    scaleThemeFonts: () => scaleThemeFonts,
+    responsive: () => responsive,
+    resetFontScale: () => resetFontScale,
+    regalTheme: () => regalTheme,
+    overrideColors: () => overrideColors,
+    mergeThemes: () => mergeThemes,
+    matrixTheme: () => matrixTheme,
+    matrixMinimalTheme: () => matrixMinimalTheme,
+    makeTheme: () => makeTheme,
+    landingPageTheme: () => landingPageTheme,
+    landingPageLightTheme: () => landingPageLightTheme,
+    increaseFontScale: () => increaseFontScale,
+    glassmorphismTheme: () => glassmorphismTheme,
+    getZIndex: () => getZIndex,
+    getSpace: () => getSpace,
+    getShadow: () => getShadow,
+    getRadius: () => getRadius,
+    getMode: () => getMode,
+    getFontSize: () => getFontSize,
+    getColor: () => getColor,
+    defaultTerminalTheme: () => defaultTerminalTheme,
+    defaultMarkdownTheme: () => defaultMarkdownTheme,
+    defaultEditorTheme: () => defaultEditorTheme,
+    default: () => src_default,
+    decreaseFontScale: () => decreaseFontScale,
+    createStyle: () => createStyle,
+    addMode: () => addMode,
+    ThemeShowcase: () => ThemeShowcase,
+    ThemeProvider: () => ThemeProvider
+  });
+  cjs = __toCommonJS(exports_src);
+  var glassmorphismTheme = {
+    space: [0, 4, 8, 16, 32, 64, 128, 256, 512],
+    fonts: {
+      body: '"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
+      heading: '"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
+      monospace: '"Fira Code", "SF Mono", Monaco, Inconsolata, monospace'
+    },
+    fontSizes: [12, 14, 16, 18, 20, 24, 32, 48, 64, 96],
+    fontScale: 1,
+    fontWeights: {
+      body: 400,
+      heading: 600,
+      bold: 700,
+      light: 300,
+      medium: 500,
+      semibold: 600
+    },
+    lineHeights: {
+      body: 1.6,
+      heading: 1.3,
+      tight: 1.4,
+      relaxed: 1.8
+    },
+    breakpoints: ["640px", "768px", "1024px", "1280px"],
+    sizes: [16, 32, 64, 128, 256, 512, 768, 1024, 1536],
+    radii: [0, 8, 12, 16, 20, 24, 32, 40],
+    shadows: [
+      "none",
+      "0 8px 32px 0 rgba(31, 38, 135, 0.15)",
+      "0 12px 40px 0 rgba(31, 38, 135, 0.2)",
+      "0 16px 48px 0 rgba(31, 38, 135, 0.25)",
+      "0 20px 56px 0 rgba(31, 38, 135, 0.3)",
+      "0 24px 64px 0 rgba(31, 38, 135, 0.35)"
+    ],
+    zIndices: [0, 1, 10, 20, 30, 40, 50],
+    colors: {
+      text: "rgba(255, 255, 255, 0.95)",
+      background: "rgba(255, 255, 255, 0.1)",
+      primary: "rgba(99, 102, 241, 0.9)",
+      secondary: "rgba(139, 92, 246, 0.9)",
+      accent: "rgba(236, 72, 153, 0.9)",
+      highlight: "rgba(99, 102, 241, 0.2)",
+      muted: "rgba(255, 255, 255, 0.05)",
+      success: "rgba(34, 197, 94, 0.9)",
+      warning: "rgba(251, 146, 60, 0.9)",
+      error: "rgba(239, 68, 68, 0.9)",
+      info: "rgba(59, 130, 246, 0.9)",
+      border: "rgba(255, 255, 255, 0.18)",
+      backgroundSecondary: "rgba(255, 255, 255, 0.15)",
+      backgroundTertiary: "rgba(255, 255, 255, 0.2)",
+      backgroundLight: "rgba(255, 255, 255, 0.08)",
+      backgroundHover: "rgba(255, 255, 255, 0.25)",
+      surface: "rgba(255, 255, 255, 0.12)",
+      textSecondary: "rgba(255, 255, 255, 0.8)",
+      textTertiary: "rgba(255, 255, 255, 0.6)",
+      textMuted: "rgba(255, 255, 255, 0.5)",
+      highlightBg: "rgba(251, 191, 36, 0.3)",
+      highlightBorder: "rgba(251, 191, 36, 0.5)"
+    },
+    modes: {
+      dark: {
+        text: "rgba(255, 255, 255, 0.95)",
+        background: "rgba(0, 0, 0, 0.3)",
+        primary: "rgba(129, 140, 248, 0.9)",
+        secondary: "rgba(167, 139, 250, 0.9)",
+        accent: "rgba(244, 114, 182, 0.9)",
+        highlight: "rgba(129, 140, 248, 0.25)",
+        muted: "rgba(0, 0, 0, 0.15)",
+        success: "rgba(74, 222, 128, 0.9)",
+        warning: "rgba(251, 191, 36, 0.9)",
+        error: "rgba(248, 113, 113, 0.9)",
+        info: "rgba(96, 165, 250, 0.9)",
+        border: "rgba(255, 255, 255, 0.15)",
+        backgroundSecondary: "rgba(0, 0, 0, 0.4)",
+        backgroundTertiary: "rgba(0, 0, 0, 0.5)",
+        backgroundLight: "rgba(0, 0, 0, 0.2)",
+        backgroundHover: "rgba(255, 255, 255, 0.1)",
+        surface: "rgba(0, 0, 0, 0.35)",
+        textSecondary: "rgba(255, 255, 255, 0.8)",
+        textTertiary: "rgba(255, 255, 255, 0.6)",
+        textMuted: "rgba(255, 255, 255, 0.4)",
+        highlightBg: "rgba(251, 191, 36, 0.35)",
+        highlightBorder: "rgba(251, 191, 36, 0.6)"
+      },
+      frosted: {
+        text: "rgba(31, 41, 55, 0.95)",
+        background: "rgba(255, 255, 255, 0.3)",
+        primary: "rgba(79, 70, 229, 0.95)",
+        secondary: "rgba(124, 58, 237, 0.95)",
+        accent: "rgba(219, 39, 119, 0.95)",
+        highlight: "rgba(79, 70, 229, 0.15)",
+        muted: "rgba(255, 255, 255, 0.4)",
+        success: "rgba(16, 185, 129, 0.95)",
+        warning: "rgba(245, 158, 11, 0.95)",
+        error: "rgba(220, 38, 38, 0.95)",
+        info: "rgba(37, 99, 235, 0.95)",
+        border: "rgba(255, 255, 255, 0.5)",
+        backgroundSecondary: "rgba(255, 255, 255, 0.4)",
+        backgroundTertiary: "rgba(255, 255, 255, 0.5)",
+        backgroundLight: "rgba(255, 255, 255, 0.25)",
+        backgroundHover: "rgba(255, 255, 255, 0.6)",
+        surface: "rgba(255, 255, 255, 0.35)",
+        textSecondary: "rgba(31, 41, 55, 0.8)",
+        textTertiary: "rgba(31, 41, 55, 0.6)",
+        textMuted: "rgba(31, 41, 55, 0.5)",
+        highlightBg: "rgba(251, 191, 36, 0.4)",
+        highlightBorder: "rgba(251, 191, 36, 0.7)"
+      }
+    },
+    buttons: {
+      primary: {
+        color: "white",
+        bg: "primary",
+        borderWidth: 1,
+        borderStyle: "solid",
+        borderColor: "rgba(255, 255, 255, 0.2)",
+        "&:hover": {
+          bg: "secondary"
+        }
+      },
+      secondary: {
+        color: "text",
+        bg: "rgba(255, 255, 255, 0.1)",
+        borderWidth: 1,
+        borderStyle: "solid",
+        borderColor: "rgba(255, 255, 255, 0.2)",
+        "&:hover": {
+          bg: "rgba(255, 255, 255, 0.2)"
+        }
+      },
+      ghost: {
+        color: "text",
+        bg: "transparent",
+        borderWidth: 1,
+        borderStyle: "solid",
+        borderColor: "transparent",
+        "&:hover": {
+          borderColor: "rgba(255, 255, 255, 0.2)",
+          bg: "rgba(255, 255, 255, 0.05)"
+        }
+      }
+    },
+    text: {
+      heading: {
+        fontFamily: "heading",
+        fontWeight: "heading",
+        lineHeight: "heading"
+      },
+      body: {
+        fontFamily: "body",
+        fontWeight: "body",
+        lineHeight: "body"
+      },
+      caption: {
+        fontSize: 1,
+        color: "textSecondary"
+      }
+    },
+    cards: {
+      primary: {
+        bg: "surface",
+        border: "1px solid",
+        borderColor: "border",
+        borderRadius: 3
+      },
+      secondary: {
+        bg: "backgroundSecondary",
+        border: "1px solid",
+        borderColor: "border",
+        borderRadius: 3
+      }
+    }
+  };
+  var defaultMarkdownTheme = {
+    space: [0, 4, 8, 16, 32, 64, 128, 256, 512],
+    fonts: {
+      body: '"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
+      heading: '"Crimson Text", "Georgia", "Times New Roman", serif',
+      monospace: '"Fira Code", "SF Mono", Monaco, Inconsolata, monospace'
+    },
+    fontSizes: [12, 14, 16, 18, 20, 24, 32, 48, 64, 96],
+    fontScale: 1,
+    fontWeights: {
+      body: 400,
+      heading: 600,
+      bold: 700,
+      light: 300,
+      medium: 500,
+      semibold: 600
+    },
+    lineHeights: {
+      body: 1.6,
+      heading: 1.3,
+      tight: 1.25,
+      relaxed: 1.75
+    },
+    breakpoints: ["640px", "768px", "1024px", "1280px"],
+    sizes: [16, 32, 64, 128, 256, 512, 768, 1024, 1536],
+    radii: [0, 2, 4, 6, 8, 12, 16, 24],
+    shadows: [
+      "none",
+      "0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06)",
+      "0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)",
+      "0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)",
+      "0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04)",
+      "0 25px 50px -12px rgba(0, 0, 0, 0.25)"
+    ],
+    zIndices: [0, 1, 10, 20, 30, 40, 50],
+    colors: {
+      text: "#1a1a1a",
+      background: "#ffffff",
+      primary: "#007acc",
+      secondary: "#005a9e",
+      accent: "#1a1a1a",
+      highlight: "rgba(0, 122, 204, 0.1)",
+      muted: "#f0f0f0",
+      success: "#28a745",
+      warning: "#ffc107",
+      error: "#dc3545",
+      info: "#17a2b8",
+      border: "rgba(0, 0, 0, 0.1)",
+      backgroundSecondary: "#f8f9fa",
+      backgroundTertiary: "#e9ecef",
+      backgroundLight: "rgba(0, 0, 0, 0.03)",
+      backgroundHover: "rgba(0, 0, 0, 0.05)",
+      surface: "#ffffff",
+      textSecondary: "#555555",
+      textTertiary: "#888888",
+      textMuted: "#aaaaaa",
+      highlightBg: "rgba(255, 235, 59, 0.3)",
+      highlightBorder: "rgba(255, 235, 59, 0.6)"
+    },
+    buttons: {
+      primary: {
+        color: "white",
+        bg: "primary",
+        "&:hover": { bg: "secondary" }
+      },
+      secondary: {
+        color: "primary",
+        bg: "transparent",
+        borderWidth: 1,
+        borderStyle: "solid",
+        borderColor: "primary",
+        "&:hover": { bg: "highlight" }
+      },
+      ghost: {
+        color: "text",
+        bg: "transparent",
+        "&:hover": { bg: "backgroundHover" }
+      }
+    },
+    text: {
+      heading: {
+        fontFamily: "heading",
+        fontWeight: "heading",
+        lineHeight: "heading"
+      },
+      body: {
+        fontFamily: "body",
+        fontWeight: "body",
+        lineHeight: "body"
+      },
+      caption: {
+        fontSize: 1,
+        color: "textSecondary"
+      }
+    },
+    cards: {
+      primary: {
+        bg: "surface",
+        border: "1px solid",
+        borderColor: "border",
+        borderRadius: 2
+      },
+      secondary: {
+        bg: "backgroundSecondary",
+        border: "1px solid",
+        borderColor: "border",
+        borderRadius: 2
+      }
+    }
+  };
+  var defaultTerminalTheme = {
+    space: [0, 4, 8, 16, 32, 64, 128, 256, 512],
+    fonts: {
+      body: '"Courier New", Courier, monospace',
+      heading: '"Courier New", Courier, monospace',
+      monospace: '"Courier New", Courier, monospace'
+    },
+    fontSizes: [12, 14, 16, 18, 20, 24, 32, 48, 64, 96],
+    fontScale: 1,
+    fontWeights: {
+      body: 400,
+      heading: 500,
+      bold: 600,
+      light: 300,
+      medium: 500,
+      semibold: 600
+    },
+    lineHeights: {
+      body: 1.4,
+      heading: 1.2,
+      tight: 1.3,
+      relaxed: 1.6
+    },
+    breakpoints: ["640px", "768px", "1024px", "1280px"],
+    sizes: [16, 32, 64, 128, 256, 512, 768, 1024, 1536],
+    radii: [0, 2, 4, 6, 8, 12, 16, 24],
+    shadows: [
+      "none",
+      "0 0 5px rgba(255, 193, 7, 0.1)",
+      "0 0 10px rgba(255, 193, 7, 0.15)",
+      "0 0 15px rgba(255, 193, 7, 0.2)",
+      "0 0 20px rgba(255, 193, 7, 0.25)",
+      "0 0 30px rgba(255, 193, 7, 0.3)"
+    ],
+    zIndices: [0, 1, 10, 20, 30, 40, 50],
+    colors: {
+      text: "#ffc107",
+      background: "#000000",
+      primary: "#ffc107",
+      secondary: "#ffb300",
+      accent: "#ffffff",
+      highlight: "rgba(255, 193, 7, 0.1)",
+      muted: "#1a1a1a",
+      success: "#4caf50",
+      warning: "#ff9800",
+      error: "#f44336",
+      info: "#2196f3",
+      border: "rgba(255, 193, 7, 0.2)",
+      backgroundSecondary: "#0a0a0a",
+      backgroundTertiary: "#111111",
+      backgroundLight: "rgba(255, 193, 7, 0.03)",
+      backgroundHover: "rgba(255, 193, 7, 0.05)",
+      surface: "#050505",
+      textSecondary: "#e0e0e0",
+      textTertiary: "#b0b0b0",
+      textMuted: "#808080",
+      highlightBg: "rgba(255, 193, 7, 0.2)",
+      highlightBorder: "rgba(255, 193, 7, 0.4)"
+    },
+    buttons: {
+      primary: {
+        color: "black",
+        bg: "primary",
+        borderWidth: 0,
+        "&:hover": { bg: "secondary" }
+      },
+      secondary: {
+        color: "primary",
+        bg: "transparent",
+        borderWidth: 1,
+        borderStyle: "solid",
+        borderColor: "primary",
+        "&:hover": { bg: "highlight" }
+      },
+      ghost: {
+        color: "text",
+        bg: "transparent",
+        "&:hover": { bg: "backgroundHover" }
+      }
+    },
+    text: {
+      heading: {
+        fontFamily: "heading",
+        fontWeight: "heading",
+        lineHeight: "heading"
+      },
+      body: {
+        fontFamily: "body",
+        fontWeight: "body",
+        lineHeight: "body"
+      },
+      caption: {
+        fontSize: 1,
+        color: "textSecondary"
+      }
+    },
+    cards: {
+      primary: {
+        bg: "surface",
+        border: "1px solid",
+        borderColor: "border",
+        borderRadius: 0
+      },
+      secondary: {
+        bg: "backgroundSecondary",
+        border: "1px solid",
+        borderColor: "border",
+        borderRadius: 0
+      }
+    }
+  };
+  var defaultEditorTheme = {
+    space: [0, 4, 8, 16, 32, 64, 128, 256, 512],
+    fonts: {
+      body: '"Fira Code", "SF Mono", Monaco, Inconsolata, monospace',
+      heading: '"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
+      monospace: '"Fira Code", "SF Mono", Monaco, Inconsolata, monospace'
+    },
+    fontSizes: [12, 14, 16, 18, 20, 24, 32, 48, 64, 96],
+    fontScale: 1,
+    fontWeights: {
+      body: 400,
+      heading: 600,
+      bold: 700,
+      light: 300,
+      medium: 500,
+      semibold: 600
+    },
+    lineHeights: {
+      body: 1.5,
+      heading: 1.2,
+      tight: 1.3,
+      relaxed: 1.7
+    },
+    breakpoints: ["640px", "768px", "1024px", "1280px"],
+    sizes: [16, 32, 64, 128, 256, 512, 768, 1024, 1536],
+    radii: [0, 2, 4, 6, 8, 12, 16, 24],
+    shadows: [
+      "none",
+      "0 1px 2px rgba(0, 0, 0, 0.05)",
+      "0 2px 4px rgba(0, 0, 0, 0.1)",
+      "0 4px 8px rgba(0, 0, 0, 0.15)",
+      "0 8px 16px rgba(0, 0, 0, 0.2)",
+      "0 12px 24px rgba(0, 0, 0, 0.25)"
+    ],
+    zIndices: [0, 1, 10, 20, 30, 40, 50],
+    colors: {
+      text: "#d4d4d4",
+      background: "#1e1e1e",
+      primary: "#569cd6",
+      secondary: "#408ac9",
+      accent: "#c586c0",
+      highlight: "rgba(86, 156, 214, 0.1)",
+      muted: "#2a2a2a",
+      success: "#6a9955",
+      warning: "#d18616",
+      error: "#f44747",
+      info: "#569cd6",
+      border: "rgba(255, 255, 255, 0.1)",
+      backgroundSecondary: "#252526",
+      backgroundTertiary: "#333333",
+      backgroundLight: "rgba(255, 255, 255, 0.03)",
+      backgroundHover: "rgba(255, 255, 255, 0.05)",
+      surface: "#252526",
+      textSecondary: "#cccccc",
+      textTertiary: "#999999",
+      textMuted: "#666666",
+      highlightBg: "rgba(255, 235, 59, 0.2)",
+      highlightBorder: "rgba(255, 235, 59, 0.4)"
+    },
+    buttons: {
+      primary: {
+        color: "white",
+        bg: "primary",
+        "&:hover": { bg: "secondary" }
+      },
+      secondary: {
+        color: "primary",
+        bg: "transparent",
+        borderWidth: 1,
+        borderStyle: "solid",
+        borderColor: "primary",
+        "&:hover": { bg: "highlight" }
+      },
+      ghost: {
+        color: "text",
+        bg: "transparent",
+        "&:hover": { bg: "backgroundHover" }
+      }
+    },
+    text: {
+      heading: {
+        fontFamily: "heading",
+        fontWeight: "heading",
+        lineHeight: "heading"
+      },
+      body: {
+        fontFamily: "body",
+        fontWeight: "body",
+        lineHeight: "body"
+      },
+      caption: {
+        fontSize: 1,
+        color: "textSecondary"
+      }
+    },
+    cards: {
+      primary: {
+        bg: "surface",
+        border: "1px solid",
+        borderColor: "border",
+        borderRadius: 1
+      },
+      secondary: {
+        bg: "backgroundSecondary",
+        border: "1px solid",
+        borderColor: "border",
+        borderRadius: 1
+      }
+    }
+  };
+  var landingPageTheme = {
+    space: [0, 4, 8, 12, 16, 20, 24, 32, 40, 48, 64, 80, 100, 128],
+    fonts: {
+      body: 'Inter, "Geist Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif',
+      heading: '-apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif',
+      monospace: '"SF Mono", Monaco, Inconsolata, "Fira Code", monospace'
+    },
+    fontSizes: [12, 14, 16, 18, 20, 24, 32, 48, 64, 96],
+    fontScale: 1,
+    fontWeights: {
+      body: 400,
+      heading: 600,
+      bold: 700,
+      light: 300,
+      medium: 500,
+      semibold: 600
+    },
+    lineHeights: {
+      body: 1.6,
+      heading: 1.2,
+      tight: 1.05,
+      relaxed: 1.7
+    },
+    breakpoints: ["640px", "768px", "1024px", "1280px", "1400px"],
+    sizes: [16, 32, 64, 128, 200, 240, 256, 300, 512, 740, 768, 820, 900, 1024, 1200, 1400, 1536],
+    radii: [0, 2, 4, 6, 7, 8, 9, 10, 12, 14, 16, 24],
+    shadows: [
+      "none",
+      "0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06)",
+      "0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)",
+      "0 4px 12px rgba(0, 194, 255, 0.4)",
+      "0 6px 24px rgba(0, 194, 255, 0.1)",
+      "0 8px 32px rgba(0, 0, 0, 0.4)"
+    ],
+    zIndices: [0, 1, 10, 20, 30, 40, 50, 1e3],
+    colors: {
+      text: "#ffffff",
+      background: "#000000",
+      primary: "#00C2FF",
+      secondary: "#0098CC",
+      accent: "#0066FF",
+      highlight: "rgba(0, 194, 255, 0.15)",
+      muted: "#1a1a1a",
+      success: "#4caf50",
+      warning: "#ff9800",
+      error: "#f44336",
+      info: "#2196f3",
+      border: "rgba(0, 194, 255, 0.2)",
+      backgroundSecondary: "#0a1628",
+      backgroundTertiary: "#0f1c2e",
+      backgroundLight: "rgba(0, 194, 255, 0.04)",
+      backgroundHover: "rgba(0, 194, 255, 0.1)",
+      surface: "rgba(0, 0, 0, 0.4)",
+      textSecondary: "#d1d5db",
+      textTertiary: "#9ca3af",
+      textMuted: "#6b7280",
+      highlightBg: "rgba(255, 235, 59, 0.25)",
+      highlightBorder: "rgba(255, 235, 59, 0.5)"
+    },
+    buttons: {
+      primary: {
+        color: "#000000",
+        bg: "#00C2FF",
+        borderWidth: 0,
+        padding: "8px 20px",
+        fontSize: 14,
+        fontWeight: 600,
+        cursor: "pointer",
+        "&:hover": {
+          bg: "#00D9FF"
+        }
+      },
+      secondary: {
+        color: "#00C2FF",
+        bg: "transparent",
+        borderWidth: 1,
+        borderStyle: "solid",
+        borderColor: "rgba(0, 194, 255, 0.3)",
+        padding: "8px 16px",
+        fontSize: 14,
+        fontWeight: 600,
+        cursor: "pointer",
+        "&:hover": {
+          bg: "rgba(0, 194, 255, 0.1)",
+          borderColor: "#00C2FF"
+        }
+      },
+      ghost: {
+        color: "#00C2FF",
+        bg: "transparent",
+        borderWidth: 0,
+        padding: "8px 16px",
+        fontSize: 14,
+        fontWeight: 500,
+        cursor: "pointer",
+        "&:hover": {
+          color: "#00D9FF",
+          bg: "rgba(0, 194, 255, 0.1)"
+        }
+      }
+    },
+    text: {
+      heading: {
+        fontFamily: "heading",
+        fontWeight: "heading",
+        lineHeight: "heading",
+        color: "#ffffff"
+      },
+      body: {
+        fontFamily: "body",
+        fontWeight: "body",
+        lineHeight: "body",
+        color: "text"
+      },
+      caption: {
+        fontSize: 1,
+        color: "textSecondary"
+      }
+    },
+    cards: {
+      primary: {
+        bg: "surface",
+        border: "1px solid",
+        borderColor: "border",
+        borderRadius: 4
+      },
+      secondary: {
+        bg: "rgba(0, 194, 255, 0.05)",
+        border: "1px solid",
+        borderColor: "rgba(0, 194, 255, 0.2)",
+        borderRadius: 4
+      }
+    }
+  };
+  var landingPageLightTheme = {
+    ...landingPageTheme,
+    colors: {
+      text: "#1a1a1a",
+      background: "#ffffff",
+      primary: "#0098CC",
+      secondary: "#00C2FF",
+      accent: "#0066FF",
+      highlight: "rgba(0, 152, 204, 0.1)",
+      muted: "#f0f0f0",
+      success: "#4caf50",
+      warning: "#ff9800",
+      error: "#f44336",
+      info: "#2196f3",
+      border: "rgba(0, 152, 204, 0.2)",
+      backgroundSecondary: "#f8f9fa",
+      backgroundTertiary: "#e9ecef",
+      backgroundLight: "rgba(0, 152, 204, 0.03)",
+      backgroundHover: "rgba(0, 152, 204, 0.05)",
+      surface: "rgba(255, 255, 255, 0.95)",
+      textSecondary: "#555555",
+      textTertiary: "#888888",
+      textMuted: "#aaaaaa",
+      highlightBg: "rgba(255, 235, 59, 0.3)",
+      highlightBorder: "rgba(255, 235, 59, 0.6)"
+    },
+    buttons: {
+      primary: {
+        color: "#ffffff",
+        bg: "#0098CC",
+        borderWidth: 0,
+        padding: "8px 20px",
+        fontSize: 14,
+        fontWeight: 600,
+        cursor: "pointer",
+        "&:hover": {
+          bg: "#007aa8"
+        }
+      },
+      secondary: {
+        color: "#0098CC",
+        bg: "transparent",
+        borderWidth: 1,
+        borderStyle: "solid",
+        borderColor: "rgba(0, 152, 204, 0.3)",
+        padding: "8px 16px",
+        fontSize: 14,
+        fontWeight: 600,
+        cursor: "pointer",
+        "&:hover": {
+          bg: "rgba(0, 152, 204, 0.05)",
+          borderColor: "#0098CC"
+        }
+      },
+      ghost: {
+        color: "#0098CC",
+        bg: "transparent",
+        borderWidth: 0,
+        padding: "8px 16px",
+        fontSize: 14,
+        fontWeight: 500,
+        cursor: "pointer",
+        "&:hover": {
+          color: "#007aa8",
+          bg: "rgba(0, 152, 204, 0.05)"
+        }
+      }
+    }
+  };
+  var regalTheme = {
+    space: [0, 4, 8, 16, 32, 64, 128, 256, 512],
+    fonts: {
+      body: '"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
+      heading: '"Crimson Text", "Georgia", "Times New Roman", serif',
+      monospace: '"Fira Code", "SF Mono", Monaco, Inconsolata, monospace'
+    },
+    fontSizes: [12, 14, 16, 18, 20, 24, 32, 48, 64, 96],
+    fontScale: 1,
+    fontWeights: {
+      body: 400,
+      heading: 600,
+      bold: 700,
+      light: 300,
+      medium: 500,
+      semibold: 600
+    },
+    lineHeights: {
+      body: 1.5,
+      heading: 1.2,
+      tight: 1.25,
+      relaxed: 1.75
+    },
+    breakpoints: ["640px", "768px", "1024px", "1280px"],
+    sizes: [16, 32, 64, 128, 256, 512, 768, 1024, 1536],
+    radii: [0, 2, 4, 6, 8, 12, 16, 24],
+    shadows: [
+      "none",
+      "0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06)",
+      "0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)",
+      "0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)",
+      "0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04)",
+      "0 25px 50px -12px rgba(0, 0, 0, 0.25)"
+    ],
+    zIndices: [0, 1, 10, 20, 30, 40, 50],
+    colors: {
+      text: "#f1e8dc",
+      background: "#1a1f2e",
+      primary: "#d4a574",
+      secondary: "#e0b584",
+      accent: "#c9b8a3",
+      highlight: "rgba(212, 165, 116, 0.15)",
+      muted: "#8b7968",
+      success: "#5c8a72",
+      warning: "#d4a574",
+      error: "#a85751",
+      info: "#d4a574",
+      border: "rgba(212, 165, 116, 0.2)",
+      backgroundSecondary: "#212738",
+      backgroundTertiary: "#2d3446",
+      backgroundLight: "rgba(212, 165, 116, 0.08)",
+      backgroundHover: "rgba(212, 165, 116, 0.15)",
+      surface: "#212738",
+      textSecondary: "#c9b8a3",
+      textTertiary: "#8b7968",
+      textMuted: "#8b7968",
+      highlightBg: "rgba(255, 193, 7, 0.25)",
+      highlightBorder: "rgba(255, 193, 7, 0.5)"
+    },
+    buttons: {
+      primary: {
+        color: "background",
+        bg: "primary",
+        "&:hover": {
+          bg: "secondary"
+        }
+      },
+      secondary: {
+        color: "text",
+        bg: "muted",
+        "&:hover": {
+          bg: "backgroundSecondary"
+        }
+      },
+      ghost: {
+        color: "primary",
+        bg: "transparent",
+        "&:hover": {
+          bg: "muted"
+        }
+      }
+    },
+    text: {
+      heading: {
+        fontFamily: "heading",
+        fontWeight: "heading",
+        lineHeight: "heading"
+      },
+      body: {
+        fontFamily: "body",
+        fontWeight: "body",
+        lineHeight: "body"
+      },
+      caption: {
+        fontSize: 1,
+        color: "textSecondary"
+      }
+    },
+    cards: {
+      primary: {
+        bg: "background",
+        border: "1px solid",
+        borderColor: "border",
+        borderRadius: 2
+      },
+      secondary: {
+        bg: "backgroundSecondary",
+        border: "1px solid",
+        borderColor: "border",
+        borderRadius: 2
+      }
+    }
+  };
+  var terminalTheme = {
+    space: [0, 4, 8, 16, 32, 64, 128, 256, 512],
+    fonts: {
+      body: '"SF Mono", "Monaco", "Inconsolata", "Fira Code", monospace',
+      heading: '"SF Mono", "Monaco", "Inconsolata", "Fira Code", monospace',
+      monospace: '"SF Mono", "Monaco", "Inconsolata", "Fira Code", monospace'
+    },
+    fontSizes: [12, 14, 16, 18, 20, 24, 32, 48, 64, 96],
+    fontScale: 1,
+    fontWeights: {
+      body: 400,
+      heading: 500,
+      bold: 600,
+      light: 300,
+      medium: 500,
+      semibold: 600
+    },
+    lineHeights: {
+      body: 1.6,
+      heading: 1.3,
+      tight: 1.4,
+      relaxed: 1.8
+    },
+    breakpoints: ["640px", "768px", "1024px", "1280px"],
+    sizes: [16, 32, 64, 128, 256, 512, 768, 1024, 1536],
+    radii: [0, 2, 4, 6, 8, 12, 16, 24],
+    shadows: [
+      "none",
+      "0 1px 2px 0 rgba(0, 0, 0, 0.05)",
+      "0 2px 4px 0 rgba(0, 0, 0, 0.06)",
+      "0 4px 6px 0 rgba(0, 0, 0, 0.07)",
+      "0 8px 12px 0 rgba(0, 0, 0, 0.08)",
+      "0 16px 24px 0 rgba(0, 0, 0, 0.10)"
+    ],
+    zIndices: [0, 1, 10, 20, 30, 40, 50],
+    colors: {
+      text: "#e4e4e4",
+      background: "rgba(10, 10, 10, 0.85)",
+      primary: "#66b3ff",
+      secondary: "#80c4ff",
+      accent: "#66ff99",
+      highlight: "rgba(102, 179, 255, 0.15)",
+      muted: "rgba(26, 26, 26, 0.8)",
+      success: "#66ff99",
+      warning: "#ffcc66",
+      error: "#ff6666",
+      info: "#66b3ff",
+      border: "rgba(255, 255, 255, 0.1)",
+      backgroundSecondary: "rgba(15, 15, 15, 0.9)",
+      backgroundTertiary: "rgba(20, 20, 20, 0.9)",
+      backgroundLight: "rgba(255, 255, 255, 0.05)",
+      backgroundHover: "rgba(102, 179, 255, 0.08)",
+      surface: "rgba(15, 15, 15, 0.95)",
+      textSecondary: "rgba(255, 255, 255, 0.7)",
+      textTertiary: "rgba(255, 255, 255, 0.5)",
+      textMuted: "rgba(255, 255, 255, 0.4)",
+      highlightBg: "rgba(255, 235, 59, 0.25)",
+      highlightBorder: "rgba(255, 235, 59, 0.5)"
+    },
+    modes: {
+      light: {
+        text: "#1a1a1a",
+        background: "rgba(255, 255, 255, 0.9)",
+        primary: "#0066cc",
+        secondary: "#0052a3",
+        accent: "#00cc88",
+        highlight: "rgba(0, 102, 204, 0.08)",
+        muted: "rgba(245, 245, 245, 0.8)",
+        success: "#00cc88",
+        warning: "#ffaa00",
+        error: "#ff3333",
+        info: "#0066cc",
+        border: "rgba(0, 0, 0, 0.1)",
+        backgroundSecondary: "rgba(250, 250, 250, 0.9)",
+        backgroundTertiary: "rgba(245, 245, 245, 0.9)",
+        backgroundLight: "rgba(0, 0, 0, 0.02)",
+        backgroundHover: "rgba(0, 102, 204, 0.04)",
+        surface: "rgba(255, 255, 255, 0.95)",
+        textSecondary: "rgba(0, 0, 0, 0.6)",
+        textTertiary: "rgba(0, 0, 0, 0.4)",
+        textMuted: "rgba(0, 0, 0, 0.3)",
+        highlightBg: "rgba(255, 235, 59, 0.3)",
+        highlightBorder: "rgba(255, 235, 59, 0.6)"
+      }
+    },
+    buttons: {
+      primary: {
+        color: "white",
+        bg: "primary",
+        borderWidth: 0,
+        "&:hover": {
+          bg: "secondary"
+        }
+      },
+      secondary: {
+        color: "primary",
+        bg: "transparent",
+        borderWidth: 1,
+        borderStyle: "solid",
+        borderColor: "primary",
+        "&:hover": {
+          bg: "highlight"
+        }
+      },
+      ghost: {
+        color: "text",
+        bg: "transparent",
+        "&:hover": {
+          bg: "backgroundHover"
+        }
+      }
+    },
+    text: {
+      heading: {
+        fontFamily: "heading",
+        fontWeight: "heading",
+        lineHeight: "heading"
+      },
+      body: {
+        fontFamily: "body",
+        fontWeight: "body",
+        lineHeight: "body"
+      },
+      caption: {
+        fontSize: 1,
+        color: "textSecondary"
+      }
+    },
+    cards: {
+      primary: {
+        bg: "surface",
+        border: "1px solid",
+        borderColor: "border",
+        borderRadius: 1
+      },
+      secondary: {
+        bg: "backgroundSecondary",
+        border: "1px solid",
+        borderColor: "border",
+        borderRadius: 1
+      }
+    }
+  };
+  var matrixTheme = {
+    space: [0, 4, 8, 16, 32, 64, 128, 256, 512],
+    fonts: {
+      body: '"Courier New", "Courier", "Lucida Console", "Monaco", monospace',
+      heading: '"Courier New", "Courier", "Lucida Console", "Monaco", monospace',
+      monospace: '"Courier New", "Courier", "Lucida Console", "Monaco", monospace'
+    },
+    fontSizes: [12, 14, 16, 18, 20, 24, 32, 48, 64, 96],
+    fontScale: 1,
+    fontWeights: {
+      body: 400,
+      heading: 500,
+      bold: 600,
+      light: 300,
+      medium: 500,
+      semibold: 600
+    },
+    lineHeights: {
+      body: 1.5,
+      heading: 1.2,
+      tight: 1.3,
+      relaxed: 1.7
+    },
+    breakpoints: ["640px", "768px", "1024px", "1280px"],
+    sizes: [16, 32, 64, 128, 256, 512, 768, 1024, 1536],
+    radii: [0, 2, 4, 6, 8, 12, 16, 24],
+    shadows: [
+      "none",
+      "0 0 5px rgba(0, 216, 53, 0.15)",
+      "0 0 10px rgba(0, 216, 53, 0.2)",
+      "0 0 15px rgba(0, 216, 53, 0.25)",
+      "0 0 20px rgba(0, 216, 53, 0.3)",
+      "0 0 30px rgba(0, 216, 53, 0.4)"
+    ],
+    zIndices: [0, 1, 10, 20, 30, 40, 50],
+    colors: {
+      text: "#a8a8a8",
+      background: "#000000",
+      primary: "#00d835",
+      secondary: "#00a828",
+      accent: "#00d835",
+      highlight: "rgba(0, 216, 53, 0.15)",
+      muted: "#0a0a0a",
+      success: "#00d835",
+      warning: "#d4a000",
+      error: "#d63333",
+      info: "#00a8d6",
+      border: "rgba(0, 216, 53, 0.2)",
+      backgroundSecondary: "#0a0a0a",
+      backgroundTertiary: "#111111",
+      backgroundLight: "rgba(0, 216, 53, 0.03)",
+      backgroundHover: "rgba(0, 216, 53, 0.08)",
+      surface: "#050505",
+      textSecondary: "#808080",
+      textTertiary: "#606060",
+      textMuted: "#484848",
+      highlightBg: "rgba(0, 216, 53, 0.25)",
+      highlightBorder: "rgba(0, 216, 53, 0.5)"
+    },
+    buttons: {
+      primary: {
+        color: "black",
+        bg: "primary",
+        borderWidth: 0,
+        "&:hover": {
+          bg: "secondary"
+        }
+      },
+      secondary: {
+        color: "primary",
+        bg: "transparent",
+        borderWidth: 1,
+        borderStyle: "solid",
+        borderColor: "primary",
+        "&:hover": {
+          bg: "highlight"
+        }
+      },
+      ghost: {
+        color: "text",
+        bg: "transparent",
+        "&:hover": {
+          bg: "backgroundHover"
+        }
+      }
+    },
+    text: {
+      heading: {
+        fontFamily: "heading",
+        fontWeight: "heading",
+        lineHeight: "heading"
+      },
+      body: {
+        fontFamily: "body",
+        fontWeight: "body",
+        lineHeight: "body"
+      },
+      caption: {
+        fontSize: 1,
+        color: "textSecondary"
+      }
+    },
+    cards: {
+      primary: {
+        bg: "surface",
+        border: "1px solid",
+        borderColor: "border",
+        borderRadius: 0
+      },
+      secondary: {
+        bg: "backgroundSecondary",
+        border: "1px solid",
+        borderColor: "border",
+        borderRadius: 0
+      }
+    }
+  };
+  var matrixMinimalTheme = {
+    space: [0, 4, 8, 16, 32, 64, 128, 256, 512],
+    fonts: {
+      body: '"Courier New", "Courier", "Lucida Console", "Monaco", monospace',
+      heading: '"Courier New", "Courier", "Lucida Console", "Monaco", monospace',
+      monospace: '"Courier New", "Courier", "Lucida Console", "Monaco", monospace'
+    },
+    fontSizes: [12, 14, 16, 18, 20, 24, 32, 48, 64, 96],
+    fontScale: 1,
+    fontWeights: {
+      body: 400,
+      heading: 500,
+      bold: 600,
+      light: 300,
+      medium: 500,
+      semibold: 600
+    },
+    lineHeights: {
+      body: 1.5,
+      heading: 1.2,
+      tight: 1.3,
+      relaxed: 1.7
+    },
+    breakpoints: ["640px", "768px", "1024px", "1280px"],
+    sizes: [16, 32, 64, 128, 256, 512, 768, 1024, 1536],
+    radii: [0, 2, 4, 6, 8, 12, 16, 24],
+    shadows: [
+      "none",
+      "0 1px 2px rgba(0, 0, 0, 0.05)",
+      "0 2px 4px rgba(0, 0, 0, 0.1)",
+      "0 4px 8px rgba(0, 0, 0, 0.15)",
+      "0 8px 16px rgba(0, 0, 0, 0.2)",
+      "0 0 20px rgba(0, 216, 53, 0.1)"
+    ],
+    zIndices: [0, 1, 10, 20, 30, 40, 50],
+    colors: {
+      text: "#a8a8a8",
+      background: "#000000",
+      primary: "#b8b8b8",
+      secondary: "#909090",
+      accent: "#00d835",
+      highlight: "rgba(0, 216, 53, 0.1)",
+      muted: "#0a0a0a",
+      success: "#00d835",
+      warning: "#d4a000",
+      error: "#d63333",
+      info: "#00a8d6",
+      border: "rgba(184, 184, 184, 0.1)",
+      backgroundSecondary: "#0a0a0a",
+      backgroundTertiary: "#111111",
+      backgroundLight: "rgba(184, 184, 184, 0.02)",
+      backgroundHover: "rgba(0, 216, 53, 0.05)",
+      surface: "#050505",
+      textSecondary: "#808080",
+      textTertiary: "#606060",
+      textMuted: "#484848",
+      highlightBg: "rgba(0, 216, 53, 0.2)",
+      highlightBorder: "rgba(0, 216, 53, 0.4)"
+    },
+    buttons: {
+      primary: {
+        color: "black",
+        bg: "primary",
+        borderWidth: 0,
+        "&:hover": {
+          bg: "secondary"
+        }
+      },
+      secondary: {
+        color: "primary",
+        bg: "transparent",
+        borderWidth: 1,
+        borderStyle: "solid",
+        borderColor: "primary",
+        "&:hover": {
+          bg: "backgroundHover"
+        }
+      },
+      ghost: {
+        color: "text",
+        bg: "transparent",
+        "&:hover": {
+          bg: "backgroundHover"
+        }
+      }
+    },
+    text: {
+      heading: {
+        fontFamily: "heading",
+        fontWeight: "heading",
+        lineHeight: "heading"
+      },
+      body: {
+        fontFamily: "body",
+        fontWeight: "body",
+        lineHeight: "body"
+      },
+      caption: {
+        fontSize: 1,
+        color: "textSecondary"
+      }
+    },
+    cards: {
+      primary: {
+        bg: "surface",
+        border: "1px solid",
+        borderColor: "border",
+        borderRadius: 0
+      },
+      secondary: {
+        bg: "backgroundSecondary",
+        border: "1px solid",
+        borderColor: "border",
+        borderRadius: 0
+      }
+    }
+  };
+  var slateTheme = {
+    space: [0, 4, 8, 16, 32, 64, 128, 256, 512],
+    fonts: {
+      body: '"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
+      heading: '"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
+      monospace: '"Fira Code", "SF Mono", Monaco, Inconsolata, monospace'
+    },
+    fontSizes: [12, 14, 16, 18, 20, 24, 32, 48, 64, 96],
+    fontScale: 1,
+    fontWeights: {
+      body: 400,
+      heading: 600,
+      bold: 700,
+      light: 300,
+      medium: 500,
+      semibold: 600
+    },
+    lineHeights: {
+      body: 1.6,
+      heading: 1.3,
+      tight: 1.25,
+      relaxed: 1.75
+    },
+    breakpoints: ["640px", "768px", "1024px", "1280px"],
+    sizes: [16, 32, 64, 128, 256, 512, 768, 1024, 1536],
+    radii: [0, 2, 4, 6, 8, 12, 16, 24],
+    shadows: [
+      "none",
+      "0 1px 3px 0 rgba(0, 0, 0, 0.2)",
+      "0 4px 6px -1px rgba(0, 0, 0, 0.2)",
+      "0 10px 15px -3px rgba(0, 0, 0, 0.2)",
+      "0 20px 25px -5px rgba(0, 0, 0, 0.25)",
+      "0 25px 50px -12px rgba(0, 0, 0, 0.3)"
+    ],
+    zIndices: [0, 1, 10, 20, 30, 40, 50],
+    colors: {
+      text: "#9ca3af",
+      background: "#1a1c1e",
+      primary: "#d1d5db",
+      secondary: "#6b7280",
+      accent: "#f59e0b",
+      highlight: "rgba(209, 213, 219, 0.15)",
+      muted: "#2d3134",
+      success: "#10b981",
+      warning: "#f59e0b",
+      error: "#ef4444",
+      info: "#3b82f6",
+      border: "rgba(156, 163, 175, 0.15)",
+      backgroundSecondary: "#22252a",
+      backgroundTertiary: "#2d3134",
+      backgroundLight: "rgba(156, 163, 175, 0.05)",
+      backgroundHover: "rgba(156, 163, 175, 0.1)",
+      surface: "#1f2124",
+      textSecondary: "#e5e7eb",
+      textTertiary: "#6b7280",
+      textMuted: "#4b5563",
+      highlightBg: "rgba(245, 158, 11, 0.25)",
+      highlightBorder: "rgba(245, 158, 11, 0.5)"
+    },
+    buttons: {
+      primary: {
+        color: "#1a1c1e",
+        bg: "primary",
+        borderWidth: 0,
+        "&:hover": {
+          bg: "#9ca3af"
+        }
+      },
+      secondary: {
+        color: "#e5e7eb",
+        bg: "secondary",
+        borderWidth: 0,
+        "&:hover": {
+          bg: "#4b5563"
+        }
+      },
+      ghost: {
+        color: "textSecondary",
+        bg: "transparent",
+        "&:hover": {
+          bg: "backgroundHover"
+        }
+      }
+    },
+    text: {
+      heading: {
+        fontFamily: "heading",
+        fontWeight: "heading",
+        lineHeight: "heading",
+        color: "textSecondary"
+      },
+      body: {
+        fontFamily: "body",
+        fontWeight: "body",
+        lineHeight: "body"
+      },
+      caption: {
+        fontSize: 1,
+        color: "textTertiary"
+      }
+    },
+    cards: {
+      primary: {
+        bg: "surface",
+        border: "1px solid",
+        borderColor: "border",
+        borderRadius: 3
+      },
+      secondary: {
+        bg: "backgroundSecondary",
+        border: "1px solid",
+        borderColor: "border",
+        borderRadius: 3
+      }
+    }
+  };
+  var import_react2 = __toESM(React2);
+  function overrideColors(theme2, colors) {
+    return {
+      ...theme2,
+      colors: {
+        ...theme2.colors,
+        ...colors
+      }
+    };
+  }
+  function makeTheme(baseTheme, overrides) {
+    return {
+      ...baseTheme,
+      ...overrides,
+      colors: {
+        ...baseTheme.colors,
+        ...overrides.colors
+      },
+      fonts: {
+        ...baseTheme.fonts,
+        ...overrides.fonts
+      }
+    };
+  }
+  function addMode(theme2, modeName, colors, baseMode) {
+    let baseColors;
+    if (baseMode && theme2.modes && theme2.modes[baseMode]) {
+      baseColors = {
+        ...theme2.colors,
+        ...theme2.modes[baseMode]
+      };
+    } else {
+      baseColors = theme2.colors;
+    }
+    const newMode = {
+      ...baseColors,
+      ...colors
+    };
+    return {
+      ...theme2,
+      modes: {
+        ...theme2.modes,
+        [modeName]: newMode
+      }
+    };
+  }
+  function getMode(theme2, mode) {
+    if (!mode || !theme2.modes || !theme2.modes[mode]) {
+      return theme2.colors;
+    }
+    return {
+      ...theme2.colors,
+      ...theme2.modes[mode]
+    };
+  }
+  var ThemeContext2;
+  var getThemeContext2 = () => {
+    if (typeof window !== "undefined") {
+      const globalWindow = window;
+      if (!globalWindow.__principlemd_theme_context__) {
+        globalWindow.__principlemd_theme_context__ = import_react2.createContext(void 0);
+      }
+      return globalWindow.__principlemd_theme_context__;
+    } else {
+      if (!ThemeContext2) {
+        ThemeContext2 = import_react2.createContext(void 0);
+      }
+      return ThemeContext2;
+    }
+  };
+  var ThemeContextSingleton2 = getThemeContext2();
+  var useTheme2 = () => {
+    const context = import_react2.useContext(ThemeContextSingleton2);
+    if (!context) {
+      throw new Error("useTheme must be used within a ThemeProvider");
+    }
+    return context;
+  };
+  var ThemeProvider = ({
+    children,
+    theme: customTheme = theme,
+    initialMode
+  }) => {
+    const [mode, setMode] = import_react2.useState(initialMode);
+    const activeTheme = import_react2.default.useMemo(() => {
+      if (!mode || !customTheme.modes || !customTheme.modes[mode]) {
+        return customTheme;
+      }
+      return {
+        ...customTheme,
+        colors: getMode(customTheme, mode)
+      };
+    }, [customTheme, mode]);
+    import_react2.useEffect(() => {
+      if (!initialMode) {
+        const savedMode = localStorage.getItem("principlemd-theme-mode");
+        if (savedMode) {
+          setMode(savedMode);
+        }
+      }
+    }, [initialMode]);
+    import_react2.useEffect(() => {
+      if (mode) {
+        localStorage.setItem("principlemd-theme-mode", mode);
+      } else {
+        localStorage.removeItem("principlemd-theme-mode");
+      }
+    }, [mode]);
+    const value = {
+      theme: activeTheme,
+      mode,
+      setMode
+    };
+    return /* @__PURE__ */ import_react2.default.createElement(ThemeContextSingleton2.Provider, {
+      value
+    }, children);
+  };
+  var withTheme = (Component2) => {
+    return (props) => {
+      const { theme: theme2 } = useTheme2();
+      return /* @__PURE__ */ import_react2.default.createElement(Component2, {
+        ...props,
+        theme: theme2
+      });
+    };
+  };
+  var getColor = (theme2, colorKey) => {
+    const colors = theme2.colors;
+    const value = colors[colorKey];
+    return typeof value === "string" ? value : colorKey;
+  };
+  var getSpace = (theme2, index2) => {
+    return theme2.space[index2] || 0;
+  };
+  var getFontSize = (theme2, index2) => {
+    return theme2.fontSizes[index2] || theme2.fontSizes[2];
+  };
+  var getRadius = (theme2, index2) => {
+    return theme2.radii[index2] || 0;
+  };
+  var getShadow = (theme2, index2) => {
+    return theme2.shadows[index2] || "none";
+  };
+  var getZIndex = (theme2, index2) => {
+    return theme2.zIndices[index2] || 0;
+  };
+  var responsive = (values) => {
+    return values.reduce((acc, value, index2) => {
+      if (index2 === 0) {
+        return value;
+      }
+      return {
+        ...acc,
+        [`@media screen and (min-width: ${values[index2 - 1]})`]: value
+      };
+    }, {});
+  };
+  var sx = (styles) => styles;
+  var createStyle = (theme2, styleObj) => {
+    const processValue = (value) => {
+      if (typeof value === "string") {
+        if (value in theme2.colors) {
+          return getColor(theme2, value);
+        }
+        return value;
+      }
+      if (typeof value === "number") {
+        return value;
+      }
+      if (Array.isArray(value)) {
+        return value.map(processValue);
+      }
+      if (typeof value === "object" && value !== null) {
+        const processed2 = {};
+        for (const [key, val] of Object.entries(value)) {
+          processed2[key] = processValue(val);
+        }
+        return processed2;
+      }
+      return value;
+    };
+    const processed = {};
+    for (const [key, val] of Object.entries(styleObj)) {
+      processed[key] = processValue(val);
+    }
+    return processed;
+  };
+  var mergeThemes = (baseTheme, ...overrides) => {
+    return overrides.reduce((theme2, override) => ({
+      space: override.space || theme2.space,
+      fonts: { ...theme2.fonts, ...override.fonts || {} },
+      fontSizes: override.fontSizes || theme2.fontSizes,
+      fontWeights: { ...theme2.fontWeights, ...override.fontWeights || {} },
+      lineHeights: { ...theme2.lineHeights, ...override.lineHeights || {} },
+      breakpoints: override.breakpoints || theme2.breakpoints,
+      sizes: override.sizes || theme2.sizes,
+      radii: override.radii || theme2.radii,
+      shadows: override.shadows || theme2.shadows,
+      zIndices: override.zIndices || theme2.zIndices,
+      colors: {
+        ...theme2.colors,
+        ...override.colors || {}
+      },
+      buttons: { ...theme2.buttons, ...override.buttons || {} },
+      text: { ...theme2.text, ...override.text || {} },
+      cards: { ...theme2.cards, ...override.cards || {} }
+    }), baseTheme);
+  };
+  var import_react22 = __toESM(React2);
+  var ThemeShowcase = ({
+    theme: theme2,
+    title,
+    showValues = true,
+    sections = ["colors", "typography", "spacing", "shadows", "radii"]
+  }) => {
+    const containerStyle = {
+      fontFamily: theme2.fonts.body,
+      color: theme2.colors.text,
+      backgroundColor: theme2.colors.background,
+      padding: theme2.space[4],
+      minHeight: "100vh"
+    };
+    const sectionStyle = {
+      marginBottom: theme2.space[5],
+      padding: theme2.space[4],
+      backgroundColor: theme2.colors.surface || theme2.colors.backgroundSecondary,
+      borderRadius: theme2.radii[2],
+      border: `1px solid ${theme2.colors.border}`
+    };
+    const headingStyle = {
+      fontFamily: theme2.fonts.heading,
+      fontSize: theme2.fontSizes[5],
+      fontWeight: theme2.fontWeights.heading,
+      marginBottom: theme2.space[3],
+      color: theme2.colors.primary
+    };
+    const subheadingStyle = {
+      fontFamily: theme2.fonts.heading,
+      fontSize: theme2.fontSizes[3],
+      fontWeight: theme2.fontWeights.medium,
+      marginBottom: theme2.space[2],
+      marginTop: theme2.space[3],
+      color: theme2.colors.text
+    };
+    return /* @__PURE__ */ import_react22.default.createElement("div", {
+      style: containerStyle
+    }, title && /* @__PURE__ */ import_react22.default.createElement("h1", {
+      style: {
+        ...headingStyle,
+        fontSize: theme2.fontSizes[6],
+        marginBottom: theme2.space[4]
+      }
+    }, title), sections.includes("colors") && /* @__PURE__ */ import_react22.default.createElement("div", {
+      style: sectionStyle
+    }, /* @__PURE__ */ import_react22.default.createElement("h2", {
+      style: headingStyle
+    }, "Colors"), /* @__PURE__ */ import_react22.default.createElement("h3", {
+      style: subheadingStyle
+    }, "Primary Colors"), /* @__PURE__ */ import_react22.default.createElement("div", {
+      style: {
+        display: "grid",
+        gridTemplateColumns: "repeat(auto-fill, minmax(200px, 1fr))",
+        gap: theme2.space[3],
+        marginBottom: theme2.space[3]
+      }
+    }, ["text", "background", "primary", "secondary", "accent", "muted"].map((key) => {
+      const color = theme2.colors[key];
+      if (!color)
+        return null;
+      return /* @__PURE__ */ import_react22.default.createElement("div", {
+        key,
+        style: {
+          display: "flex",
+          alignItems: "center",
+          padding: theme2.space[2],
+          backgroundColor: theme2.colors.backgroundLight || theme2.colors.backgroundTertiary,
+          borderRadius: theme2.radii[1]
+        }
+      }, /* @__PURE__ */ import_react22.default.createElement("div", {
+        style: {
+          width: 40,
+          height: 40,
+          backgroundColor: color,
+          border: `1px solid ${theme2.colors.border}`,
+          borderRadius: theme2.radii[1],
+          marginRight: theme2.space[2]
+        }
+      }), /* @__PURE__ */ import_react22.default.createElement("div", null, /* @__PURE__ */ import_react22.default.createElement("div", {
+        style: {
+          fontFamily: theme2.fonts.monospace,
+          fontSize: theme2.fontSizes[1],
+          fontWeight: theme2.fontWeights.medium
+        }
+      }, key), showValues && /* @__PURE__ */ import_react22.default.createElement("div", {
+        style: {
+          fontFamily: theme2.fonts.monospace,
+          fontSize: theme2.fontSizes[0],
+          color: theme2.colors.textSecondary
+        }
+      }, color)));
+    })), /* @__PURE__ */ import_react22.default.createElement("h3", {
+      style: subheadingStyle
+    }, "Status Colors"), /* @__PURE__ */ import_react22.default.createElement("div", {
+      style: {
+        display: "grid",
+        gridTemplateColumns: "repeat(auto-fill, minmax(200px, 1fr))",
+        gap: theme2.space[3],
+        marginBottom: theme2.space[3]
+      }
+    }, ["success", "warning", "error", "info"].map((key) => {
+      const color = theme2.colors[key];
+      if (!color)
+        return null;
+      return /* @__PURE__ */ import_react22.default.createElement("div", {
+        key,
+        style: {
+          display: "flex",
+          alignItems: "center",
+          padding: theme2.space[2],
+          backgroundColor: theme2.colors.backgroundLight || theme2.colors.backgroundTertiary,
+          borderRadius: theme2.radii[1]
+        }
+      }, /* @__PURE__ */ import_react22.default.createElement("div", {
+        style: {
+          width: 40,
+          height: 40,
+          backgroundColor: color,
+          border: `1px solid ${theme2.colors.border}`,
+          borderRadius: theme2.radii[1],
+          marginRight: theme2.space[2]
+        }
+      }), /* @__PURE__ */ import_react22.default.createElement("div", null, /* @__PURE__ */ import_react22.default.createElement("div", {
+        style: {
+          fontFamily: theme2.fonts.monospace,
+          fontSize: theme2.fontSizes[1],
+          fontWeight: theme2.fontWeights.medium
+        }
+      }, key), showValues && /* @__PURE__ */ import_react22.default.createElement("div", {
+        style: {
+          fontFamily: theme2.fonts.monospace,
+          fontSize: theme2.fontSizes[0],
+          color: theme2.colors.textSecondary
+        }
+      }, color)));
+    })), /* @__PURE__ */ import_react22.default.createElement("h3", {
+      style: subheadingStyle
+    }, "Background Colors"), /* @__PURE__ */ import_react22.default.createElement("div", {
+      style: {
+        display: "grid",
+        gridTemplateColumns: "repeat(auto-fill, minmax(200px, 1fr))",
+        gap: theme2.space[3]
+      }
+    }, ["backgroundSecondary", "backgroundTertiary", "backgroundLight", "backgroundHover", "surface"].map((key) => {
+      const color = theme2.colors[key];
+      if (!color)
+        return null;
+      return /* @__PURE__ */ import_react22.default.createElement("div", {
+        key,
+        style: {
+          padding: theme2.space[3],
+          backgroundColor: color,
+          border: `1px solid ${theme2.colors.border}`,
+          borderRadius: theme2.radii[1]
+        }
+      }, /* @__PURE__ */ import_react22.default.createElement("div", {
+        style: {
+          fontFamily: theme2.fonts.monospace,
+          fontSize: theme2.fontSizes[1],
+          fontWeight: theme2.fontWeights.medium
+        }
+      }, key), showValues && /* @__PURE__ */ import_react22.default.createElement("div", {
+        style: {
+          fontFamily: theme2.fonts.monospace,
+          fontSize: theme2.fontSizes[0],
+          color: theme2.colors.textSecondary,
+          marginTop: theme2.space[1]
+        }
+      }, color));
+    }))), sections.includes("typography") && /* @__PURE__ */ import_react22.default.createElement("div", {
+      style: sectionStyle
+    }, /* @__PURE__ */ import_react22.default.createElement("h2", {
+      style: headingStyle
+    }, "Typography"), /* @__PURE__ */ import_react22.default.createElement("h3", {
+      style: subheadingStyle
+    }, "Font Families"), /* @__PURE__ */ import_react22.default.createElement("div", {
+      style: { marginBottom: theme2.space[4] }
+    }, /* @__PURE__ */ import_react22.default.createElement("div", {
+      style: {
+        fontFamily: theme2.fonts.heading,
+        fontSize: theme2.fontSizes[4],
+        marginBottom: theme2.space[2]
+      }
+    }, "Heading Font: ", showValues && /* @__PURE__ */ import_react22.default.createElement("span", {
+      style: {
+        fontFamily: theme2.fonts.monospace,
+        fontSize: theme2.fontSizes[1],
+        color: theme2.colors.textSecondary
+      }
+    }, " ", theme2.fonts.heading)), /* @__PURE__ */ import_react22.default.createElement("div", {
+      style: {
+        fontFamily: theme2.fonts.body,
+        fontSize: theme2.fontSizes[2],
+        marginBottom: theme2.space[2]
+      }
+    }, "Body Font: ", showValues && /* @__PURE__ */ import_react22.default.createElement("span", {
+      style: {
+        fontFamily: theme2.fonts.monospace,
+        fontSize: theme2.fontSizes[1],
+        color: theme2.colors.textSecondary
+      }
+    }, " ", theme2.fonts.body)), /* @__PURE__ */ import_react22.default.createElement("div", {
+      style: {
+        fontFamily: theme2.fonts.monospace,
+        fontSize: theme2.fontSizes[2]
+      }
+    }, "Monospace Font: ", showValues && /* @__PURE__ */ import_react22.default.createElement("span", {
+      style: {
+        fontSize: theme2.fontSizes[1],
+        color: theme2.colors.textSecondary
+      }
+    }, " ", theme2.fonts.monospace))), /* @__PURE__ */ import_react22.default.createElement("h3", {
+      style: subheadingStyle
+    }, "Font Sizes"), /* @__PURE__ */ import_react22.default.createElement("div", {
+      style: { marginBottom: theme2.space[4] }
+    }, theme2.fontSizes.map((size, index2) => /* @__PURE__ */ import_react22.default.createElement("div", {
+      key: index2,
+      style: {
+        fontSize: size,
+        lineHeight: theme2.lineHeights.body,
+        marginBottom: theme2.space[1]
+      }
+    }, "Size ", index2, ": Sample Text ", showValues && `(${size}px)`))), /* @__PURE__ */ import_react22.default.createElement("h3", {
+      style: subheadingStyle
+    }, "Font Weights"), /* @__PURE__ */ import_react22.default.createElement("div", {
+      style: {
+        display: "grid",
+        gridTemplateColumns: "repeat(auto-fit, minmax(150px, 1fr))",
+        gap: theme2.space[2]
+      }
+    }, Object.entries(theme2.fontWeights).map(([name, weight]) => /* @__PURE__ */ import_react22.default.createElement("div", {
+      key: name,
+      style: {
+        fontWeight: weight,
+        fontSize: theme2.fontSizes[2]
+      }
+    }, name, " ", showValues && `(${weight})`)))), sections.includes("spacing") && /* @__PURE__ */ import_react22.default.createElement("div", {
+      style: sectionStyle
+    }, /* @__PURE__ */ import_react22.default.createElement("h2", {
+      style: headingStyle
+    }, "Spacing"), /* @__PURE__ */ import_react22.default.createElement("div", {
+      style: { display: "flex", flexDirection: "column", gap: theme2.space[2] }
+    }, theme2.space.map((space, index2) => /* @__PURE__ */ import_react22.default.createElement("div", {
+      key: index2,
+      style: { display: "flex", alignItems: "center" }
+    }, /* @__PURE__ */ import_react22.default.createElement("div", {
+      style: {
+        width: 60,
+        fontFamily: theme2.fonts.monospace,
+        fontSize: theme2.fontSizes[1],
+        color: theme2.colors.textSecondary
+      }
+    }, "[", index2, "]"), /* @__PURE__ */ import_react22.default.createElement("div", {
+      style: {
+        height: 24,
+        width: space,
+        backgroundColor: theme2.colors.primary,
+        borderRadius: theme2.radii[1]
+      }
+    }), showValues && /* @__PURE__ */ import_react22.default.createElement("div", {
+      style: {
+        marginLeft: theme2.space[2],
+        fontFamily: theme2.fonts.monospace,
+        fontSize: theme2.fontSizes[1],
+        color: theme2.colors.textSecondary
+      }
+    }, space, "px"))))), sections.includes("radii") && /* @__PURE__ */ import_react22.default.createElement("div", {
+      style: sectionStyle
+    }, /* @__PURE__ */ import_react22.default.createElement("h2", {
+      style: headingStyle
+    }, "Border Radii"), /* @__PURE__ */ import_react22.default.createElement("div", {
+      style: {
+        display: "grid",
+        gridTemplateColumns: "repeat(auto-fill, minmax(100px, 1fr))",
+        gap: theme2.space[3]
+      }
+    }, theme2.radii.map((radius, index2) => /* @__PURE__ */ import_react22.default.createElement("div", {
+      key: index2,
+      style: { textAlign: "center" }
+    }, /* @__PURE__ */ import_react22.default.createElement("div", {
+      style: {
+        width: 80,
+        height: 80,
+        backgroundColor: theme2.colors.primary,
+        borderRadius: radius,
+        marginBottom: theme2.space[1],
+        margin: "0 auto"
+      }
+    }), /* @__PURE__ */ import_react22.default.createElement("div", {
+      style: {
+        fontFamily: theme2.fonts.monospace,
+        fontSize: theme2.fontSizes[0],
+        color: theme2.colors.textSecondary
+      }
+    }, "[", index2, "] ", showValues && `${radius}px`))))), sections.includes("shadows") && /* @__PURE__ */ import_react22.default.createElement("div", {
+      style: sectionStyle
+    }, /* @__PURE__ */ import_react22.default.createElement("h2", {
+      style: headingStyle
+    }, "Shadows"), /* @__PURE__ */ import_react22.default.createElement("div", {
+      style: {
+        display: "grid",
+        gridTemplateColumns: "repeat(auto-fill, minmax(150px, 1fr))",
+        gap: theme2.space[4]
+      }
+    }, theme2.shadows.map((shadow, index2) => /* @__PURE__ */ import_react22.default.createElement("div", {
+      key: index2,
+      style: { textAlign: "center" }
+    }, /* @__PURE__ */ import_react22.default.createElement("div", {
+      style: {
+        width: 100,
+        height: 100,
+        backgroundColor: theme2.colors.background,
+        boxShadow: shadow,
+        borderRadius: theme2.radii[2],
+        margin: "0 auto",
+        marginBottom: theme2.space[2],
+        border: `1px solid ${theme2.colors.border}`
+      }
+    }), /* @__PURE__ */ import_react22.default.createElement("div", {
+      style: {
+        fontFamily: theme2.fonts.monospace,
+        fontSize: theme2.fontSizes[0],
+        color: theme2.colors.textSecondary
+      }
+    }, "Shadow [", index2, "]"), showValues && /* @__PURE__ */ import_react22.default.createElement("div", {
+      style: {
+        fontFamily: theme2.fonts.monospace,
+        fontSize: theme2.fontSizes[0],
+        color: theme2.colors.textMuted,
+        marginTop: theme2.space[1]
+      }
+    }, shadow === "none" ? "none" : "..."))))), theme2.modes && Object.keys(theme2.modes).length > 0 && /* @__PURE__ */ import_react22.default.createElement("div", {
+      style: sectionStyle
+    }, /* @__PURE__ */ import_react22.default.createElement("h2", {
+      style: headingStyle
+    }, "Available Modes"), /* @__PURE__ */ import_react22.default.createElement("div", {
+      style: {
+        display: "flex",
+        gap: theme2.space[2],
+        flexWrap: "wrap"
+      }
+    }, /* @__PURE__ */ import_react22.default.createElement("div", {
+      style: {
+        padding: `${theme2.space[2]}px ${theme2.space[3]}px`,
+        backgroundColor: theme2.colors.primary,
+        color: "#ffffff",
+        borderRadius: theme2.radii[2],
+        fontFamily: theme2.fonts.body,
+        fontSize: theme2.fontSizes[1]
+      }
+    }, "default"), Object.keys(theme2.modes).map((modeName) => /* @__PURE__ */ import_react22.default.createElement("div", {
+      key: modeName,
+      style: {
+        padding: `${theme2.space[2]}px ${theme2.space[3]}px`,
+        backgroundColor: theme2.colors.secondary,
+        color: theme2.colors.text,
+        borderRadius: theme2.radii[2],
+        fontFamily: theme2.fonts.body,
+        fontSize: theme2.fontSizes[1]
+      }
+    }, modeName)))));
+  };
+  var theme = terminalTheme;
+  function scaleThemeFonts(theme2, scale) {
+    const currentScale = theme2.fontScale || 1;
+    const effectiveScale = scale / currentScale;
+    return {
+      ...theme2,
+      fontSizes: theme2.fontSizes.map((size) => Math.round(size * effectiveScale)),
+      fontScale: scale
+    };
+  }
+  function increaseFontScale(theme2) {
+    const currentScale = theme2.fontScale || 1;
+    const newScale = Math.min(currentScale * 1.1, 2);
+    return scaleThemeFonts(theme2, newScale);
+  }
+  function decreaseFontScale(theme2) {
+    const currentScale = theme2.fontScale || 1;
+    const newScale = Math.max(currentScale * 0.9, 0.5);
+    return scaleThemeFonts(theme2, newScale);
+  }
+  function resetFontScale(theme2) {
+    return scaleThemeFonts(theme2, 1);
+  }
+  var src_default = theme;
+  return cjs;
+}
 var CustomNode = {};
 var iconResolver = {};
 /**
@@ -49435,7 +51451,7 @@ function requireCustomEdge() {
   Object.defineProperty(CustomEdge, "__esModule", { value: true });
   CustomEdge.CustomEdge = void 0;
   const jsx_runtime_1 = require$$0;
-  const react_1 = require$$1$1;
+  const react_1 = React2;
   const react_2 = /* @__PURE__ */ requireUmd();
   const CustomEdge$1 = ({ id, sourceX, sourceY, targetX, targetY, sourcePosition, targetPosition, data, markerEnd, selected }) => {
     var _a, _b, _c, _d, _e2;
@@ -49862,7 +51878,7 @@ function requireEdgeInfoPanel() {
   Object.defineProperty(EdgeInfoPanel, "__esModule", { value: true });
   EdgeInfoPanel.EdgeInfoPanel = void 0;
   const jsx_runtime_1 = require$$0;
-  const industry_theme_1 = require$$2$1;
+  const industry_theme_1 = requireCjs();
   const SIDE_OPTIONS = ["top", "right", "bottom", "left"];
   const EdgeInfoPanel$1 = ({ edge, typeDefinition, sourceNodeId, targetNodeId, onClose, onDelete, onUpdateSides }) => {
     var _a, _b;
@@ -49980,8 +51996,8 @@ function requireNodeInfoPanel() {
   Object.defineProperty(NodeInfoPanel, "__esModule", { value: true });
   NodeInfoPanel.NodeInfoPanel = void 0;
   const jsx_runtime_1 = require$$0;
-  const react_1 = require$$1$1;
-  const industry_theme_1 = require$$2$1;
+  const react_1 = React2;
+  const industry_theme_1 = requireCjs();
   const iconResolver_1 = requireIconResolver();
   const COMMON_ICONS = [
     "Settings",
@@ -50253,8 +52269,8 @@ function requireSelectionSidebar() {
   Object.defineProperty(SelectionSidebar, "__esModule", { value: true });
   SelectionSidebar.SelectionSidebar = void 0;
   const jsx_runtime_1 = require$$0;
-  const react_1 = require$$1$1;
-  const industry_theme_1 = require$$2$1;
+  const react_1 = React2;
+  const industry_theme_1 = requireCjs();
   const iconResolver_1 = requireIconResolver();
   const SelectionSidebar$1 = ({ selectedNodeIds, nodes, nodeTypeDefinitions, onClose }) => {
     const { theme } = (0, industry_theme_1.useTheme)();
@@ -50429,10 +52445,10 @@ function requireGraphRenderer() {
     Object.defineProperty(exports$1, "__esModule", { value: true });
     exports$1.GraphRenderer = void 0;
     const jsx_runtime_1 = require$$0;
-    const react_1 = require$$1$1;
+    const react_1 = React2;
     const react_2 = /* @__PURE__ */ requireUmd();
     const principal_view_core_1 = require$$4;
-    const industry_theme_1 = require$$2$1;
+    const industry_theme_1 = requireCjs();
     const CustomNode_1 = requireCustomNode();
     const CustomEdge_1 = requireCustomEdge();
     const graphConverter_1 = requireGraphConverter();