diff --git a/package-lock.json b/package-lock.json
index 8dbeca5..e731ba6 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -14,7 +14,6 @@
         "firebase": "^12.2.1",
         "marked": "^12.0.2",
         "semver-parser": "^4.1.4",
-        "svelte-splitpanes": "^8.0.9",
         "uuid": "^9.0.0",
         "ws": "^8.18.3",
         "zod": "^3.21.4"
@@ -2740,15 +2739,6 @@
       "integrity": "sha512-Epxrv+Nr/CaL4ZcFGPJIYLWFom+YeV1DqMLHJoEd9SYRxNbaFruBwfEX/kkHUJf55j2+TUbmDcmuilbP1TmXHA==",
       "license": "MIT"
     },
-    "node_modules/esm-env-robust": {
-      "version": "0.0.3",
-      "resolved": "https://registry.npmjs.org/esm-env-robust/-/esm-env-robust-0.0.3.tgz",
-      "integrity": "sha512-90Gnuw2DALOqlL1581VxP3GHPUNHX9U+fQ+8FNcTTFClhY5gEggAAnJ3q1b2Oq23knRsjv8YpNeMRPaMLUymOA==",
-      "license": "MIT",
-      "dependencies": {
-        "esm-env": "^1.0.0"
-      }
-    },
     "node_modules/espree": {
       "version": "9.6.1",
       "resolved": "https://registry.npmjs.org/espree/-/espree-9.6.1.tgz",
@@ -4371,18 +4361,6 @@
         }
       }
     },
-    "node_modules/svelte-splitpanes": {
-      "version": "8.0.9",
-      "resolved": "https://registry.npmjs.org/svelte-splitpanes/-/svelte-splitpanes-8.0.9.tgz",
-      "integrity": "sha512-L3oLXTC99M191FInTXJ/f/2i0welRql1QuVbPaU8iy6nvCR6X9VyjHCsCpLqKGWHwqkWo/AM9CQ1c0nzlb+MkA==",
-      "license": "MIT",
-      "dependencies": {
-        "esm-env-robust": "0.0.3"
-      },
-      "peerDependencies": {
-        "svelte": "^4.2.19 || ^5.1.0"
-      }
-    },
     "node_modules/svelte/node_modules/@types/estree": {
       "version": "1.0.9",
       "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.9.tgz",
diff --git a/package.json b/package.json
index cb083f8..d5f65d4 100644
--- a/package.json
+++ b/package.json
@@ -42,7 +42,6 @@
     "firebase": "^12.2.1",
     "marked": "^12.0.2",
     "semver-parser": "^4.1.4",
-    "svelte-splitpanes": "^8.0.9",
     "uuid": "^9.0.0",
     "ws": "^8.18.3",
     "zod": "^3.21.4"
diff --git a/src/routes/EditorLayout.svelte b/src/routes/EditorLayout.svelte
index b9f2293..005e503 100644
--- a/src/routes/EditorLayout.svelte
+++ b/src/routes/EditorLayout.svelte
@@ -39,9 +39,13 @@
   import { loginToProfileCloud } from "./user_account";
   import Filter from "./Filter.svelte";
   import ConfigCardDisplay from "./ConfigCardDisplay.svelte";
-  import { Pane, Splitpanes } from "svelte-splitpanes";
   import configuration from "../../Configuration.json";
-  import { MeltCheckbox, MoltenPushButton } from "@intechstudio/grid-uikit";
+  import {
+    GridPane,
+    GridSplitpanes,
+    MeltCheckbox,
+    MoltenPushButton,
+  } from "@intechstudio/grid-uikit";
   import { compatible_config_types } from "./EditorLayout";
   import { dragTarget } from "../lib/actions/drag.action";
   import {
@@ -745,17 +749,17 @@
   {/if}
 
   <div class="splitpanes-wrapper">
-    <Splitpanes horizontal={true} theme="modern-theme" pushOtherPanes={false}>
-      <Pane size={60}>
+    <GridSplitpanes horizontal={true} pushOtherPanes={false}>
+      <GridPane size={60}>
         <div class="tree-pane">
           <ConfigTree
             {configs}
             scrollToSelectionTrigger={scrollToSelectedConfigTrigger}
             on:create-copy={(e) => handleSyncConfig(e.detail, true)}
           />
-        </div></Pane
+        </div></GridPane
       >
-      <Pane size={40}>
+      <GridPane size={40}>
         <div class="detail-pane">
           <ConfigCardDisplay
             on:delete-config={handleDeleteConfig}
@@ -895,8 +899,8 @@
             </span>
           </ConfigCardDisplay>
         </div>
-      </Pane>
-    </Splitpanes>
+      </GridPane>
+    </GridSplitpanes>
   </div>
   <UserLogin {usernameInput} />
 </div>
diff --git a/vite.config.webcomponent.ts b/vite.config.webcomponent.ts
index 363b1c7..2e0bc5d 100644
--- a/vite.config.webcomponent.ts
+++ b/vite.config.webcomponent.ts
@@ -1,9 +1,32 @@
-import { defineConfig } from "vite";
+import { defineConfig, type Plugin } from "vite";
 import { svelte } from "@sveltejs/vite-plugin-svelte";
 import { sveltePreprocess } from "svelte-preprocess";
 import { notifyEditorAfterBuildPlugin } from "./vite.postbuild";
 import path from "path";
 
+// The host editor only loads components.js, so any CSS vite extracts into a
+// separate file (e.g. grid-uikit's splitpanes theme) never reaches the page.
+function injectCssIntoJsPlugin(): Plugin {
+  return {
+    name: "inject-css-into-js",
+    apply: "build",
+    enforce: "post",
+    generateBundle(_, bundle) {
+      const cssFiles = Object.keys(bundle).filter((k) => k.endsWith(".css"));
+      const css = cssFiles
+        .map((k) => (bundle[k] as { source: string }).source)
+        .join("\n");
+      if (!css) return;
+      for (const chunk of Object.values(bundle)) {
+        if (chunk.type === "chunk" && chunk.isEntry) {
+          chunk.code += `\n;(function(){try{var s=document.createElement("style");s.textContent=${JSON.stringify(css)};document.head.appendChild(s);}catch(e){}})();`;
+        }
+      }
+      cssFiles.forEach((k) => delete bundle[k]);
+    },
+  };
+}
+
 export default defineConfig({
   resolve: {
     alias: {
@@ -46,6 +69,7 @@ export default defineConfig({
       },
       emitCss: false,
     }),
+    injectCssIntoJsPlugin(),
     notifyEditorAfterBuildPlugin(),
   ],
   build: {