diff --git a/WebUI/components.json b/WebUI/components.json
new file mode 100644
index 00000000..dd363606
--- /dev/null
+++ b/WebUI/components.json
@@ -0,0 +1,17 @@
+{
+  "$schema": "https://shadcn-vue.com/schema.json",
+  "style": "new-york",
+  "typescript": true,
+  "tsConfigPath": "./tsconfig.json",
+  "tailwind": {
+    "config": "tailwind.config.cjs",
+    "css": "src/assets/css/index.css",
+    "baseColor": "slate",
+    "cssVariables": false
+  },
+  "framework": "vite",
+  "aliases": {
+    "components": "@/components",
+    "utils": "@/lib/utils"
+  }
+}
\ No newline at end of file
diff --git a/WebUI/electron/electron-env.d.ts b/WebUI/electron/electron-env.d.ts
index 0992544d..aa5a7a34 100644
--- a/WebUI/electron/electron-env.d.ts
+++ b/WebUI/electron/electron-env.d.ts
@@ -30,6 +30,8 @@ type KVObject = {
   [key: string]: any;
 };
 
+type Theme = 'dark' | 'lnl';
+
 type LocalSettings = {
   apiHost: string;
   settingPath: string;
@@ -38,6 +40,10 @@ type LocalSettings = {
   port:number;
 } & KVObject;
 
+type ThemeSettings = {
+  availableThemes: Theme[];
+};
+
 type ModelPaths = {
   llm: string,
   embedding: string,
@@ -64,4 +70,8 @@ type SetupData = {
   envType: string,
   isAdminExec:boolean,
   version:string,
+}
+
+type BackendStatus = {
+  status: 'starting' | 'running' | 'stopped',
 }
\ No newline at end of file
diff --git a/WebUI/electron/main.ts b/WebUI/electron/main.ts
index 01883c33..abe5097e 100644
--- a/WebUI/electron/main.ts
+++ b/WebUI/electron/main.ts
@@ -18,6 +18,7 @@ import { randomUUID } from "node:crypto";
 import koffi from 'koffi';
 import sudo from "sudo-prompt";
 import { PathsManager } from "./pathsManager";
+import getPort, { portNumbers } from "get-port";
 
 // }
 // The built directory structure
@@ -68,11 +69,31 @@ const settings: LocalSettings = {
   isAdminExec: false,
   debug: 0,
   envType: "ultra",
-  port: 59999
+  port: 59999,
+  availableThemes: ["dark", "lnl"],
 };
 
+const logger = {
+  info: (message: string, source: 'electron-backend' | 'ai-backend' = 'electron-backend') => {
+    console.info(`[${source}]: ${message}`);
+    try {
+      win?.webContents.send('debugLog', { level: 'info', source, message })
+    } catch (error) {
+      console.error('Could not send debug log to renderer process');
+    }
+  },
+  error: (message: string, source: 'electron-backend' | 'ai-backend' = 'electron-backend') => {
+    console.error(`[${source}]: ${message}`);
+    try {
+      win?.webContents.send('debugLog', { level: 'error', source, message })
+    } catch (error) {
+      console.error('Could not send debug log to renderer process');
+    }
+  }
+}
 
-function loadSettings() {
+
+async function loadSettings() {
   const settingPath = app.isPackaged
     ? path.join(process.resourcesPath, "settings.json")
     : path.join(__dirname, "../../external/settings-dev.json");
@@ -87,6 +108,7 @@ function loadSettings() {
       }
     });
   }
+  settings.port = await getPort({ port: portNumbers(59000, 59999) });
   settings.apiHost = `http://127.0.0.1:${settings.port}`;
 }
 
@@ -134,7 +156,7 @@ async function createWindow() {
         ...details.responseHeaders,
         "Access-Control-Allow-Origin": ["*"],
         "Access-Control-Allow-Methods": ["GET,POST"],
-        "Access-Control-Allow-Headers": ["x-requested-with,Content-Type"],
+        "Access-Control-Allow-Headers": ["x-requested-with,Content-Type,Authorization"],
       }
       callback(details);
     } else {
@@ -158,7 +180,7 @@ async function createWindow() {
 
   if (VITE_DEV_SERVER_URL) {
     win.loadURL(VITE_DEV_SERVER_URL);
-    console.log("load url:" + VITE_DEV_SERVER_URL);
+    logger.info("load url:" + VITE_DEV_SERVER_URL);
   } else {
     win.loadFile(path.join(process.env.DIST, "index.html"));
   }
@@ -174,7 +196,7 @@ function logMessage(message: string) {
   if (app.isPackaged) {
     fs.appendFileSync(path.join(externalRes, "debug.log"), message + "\r\n");
   } else {
-    console.log(message);
+    logger.info(message);
   }
 }
 
@@ -233,6 +255,12 @@ function initEventHandle() {
     }
   });
 
+  ipcMain.handle("getThemeSettings", async () => {
+    return {
+      availableThemes: settings.availableThemes,
+    };
+  });
+
   ipcMain.handle("getLocalSettings", async () => {
     return {
       apiHost: settings.apiHost,
@@ -324,13 +352,13 @@ function initEventHandle() {
           const arrayBuffer = await response.arrayBuffer();
           const buffer = Buffer.from(arrayBuffer);
           fs.writeFileSync(result.filePath, buffer);
-          console.log("File downloaded and saved:", result.filePath);
+          logger.info(`File downloaded and saved: ${result.filePath}`);
         } catch (error) {
-          console.error("Download and save error:", error);
+          logger.error(`Download and save error: ${JSON.stringify(error, Object.getOwnPropertyNames, 2)}`);
         }
       }
-    } catch (err) {
-      console.error(err);
+    } catch (error) {
+      logger.error(`${JSON.stringify(error, Object.getOwnPropertyNames, 2)}`);
     };
   });
 
@@ -358,13 +386,15 @@ function initEventHandle() {
     return fs.existsSync(path);
   });
 
+  ipcMain.handle("getPythonBackendStatus", () => apiService.status)
+
   let pathsManager = new PathsManager(path.join(externalRes, app.isPackaged ? "model_config.json" : "model_config.dev.json"));
 
   ipcMain.handle("getInitSetting", (event) => {
     const win = BrowserWindow.fromWebContents(event.sender);
     if (!win) { return; }
     return {
-      apiHost:settings.apiHost,
+      apiHost: settings.apiHost,
       modelLists: pathsManager.sacanAll(),
       modelPaths: pathsManager.modelPaths,
       envType: settings.envType,
@@ -395,6 +425,34 @@ function initEventHandle() {
     return pathsManager.scanLLMModles();
   });
 
+  ipcMain.handle("refreshEmbeddingModels", (event) => {
+    return pathsManager.scanEmbedding();
+  });
+
+  ipcMain.handle("getDownloadedDiffusionModels", (event) => {
+    return pathsManager.scanSDModleLists(false);
+  });
+
+  ipcMain.handle("getDownloadedInpaintModels", (event) => {
+    return pathsManager.scanInpaint(false);
+  });
+
+  ipcMain.handle("getDownloadedLoras", (event) => {
+    return pathsManager.scanLora(false);
+  });
+
+  ipcMain.handle("getDownloadedLLMs", (event) => {
+    return pathsManager.scanLLMModles(false);
+  });
+
+  ipcMain.handle("getDownloadedEmbeddingModels", (event) => {
+    return pathsManager.scanEmbedding(false);
+  });
+
+  ipcMain.on("openDevTools", () => {
+    win?.webContents.openDevTools({ mode: "detach", activate: true });
+  });
+
   ipcMain.on("openImageWithSystem", (event, url: string) => {
     // Assuming 'settings' and 'externalRes' are properly defined
     let imagePath = url.replace(settings.apiHost + "/", ""); // Remove the API host part
@@ -437,10 +495,14 @@ function initEventHandle() {
 }
 const apiService: {
   webProcess: ChildProcess | null,
-  normalExit: boolean
+  normalExit: boolean,
+  status: BackendStatus,
+  desiredState: 'running' | 'stopped'
 } = {
   webProcess: null,
-  normalExit: true
+  normalExit: true,
+  status: { status: "starting" },
+  desiredState: 'running'
 }
 
 function isProcessRunning(pid: number) {
@@ -455,30 +517,66 @@ function wakeupApiService() {
   const wordkDir = path.resolve(app.isPackaged ? path.join(process.resourcesPath, "service") : path.join(__dirname, "../../../service"));
   const baseDir = app.isPackaged ? process.resourcesPath : path.join(__dirname, "../../../");
   const pythonExe = path.resolve(path.join(baseDir, "env/python.exe"));
-  const newEnv = {
+  const additionalEnvVariables = {
     "SYCL_ENABLE_DEFAULT_CONTEXTS": "1",
     "SYCL_CACHE_PERSISTENT": "1",
     "PYTHONIOENCODING": "utf-8"
   };
 
-  if (settings.debug) {
-    apiService.webProcess = spawn("cmd.exe", ["/c", pythonExe, "web_api.py", "--port", settings.port.toString()], {
-      cwd: wordkDir,
-      detached: true,
-      windowsHide: false,
-      env: Object.assign(process.env, newEnv)
-    });
-  } else {
-    apiService.webProcess = spawn(pythonExe, ["web_api.py", "--port", settings.port.toString()], {
-      cwd: wordkDir,
-      windowsHide: true,
-      env: Object.assign(process.env, newEnv)
-    });
-  }
+  spawnAPI(pythonExe, wordkDir, additionalEnvVariables);
 }
 
+function spawnAPI(pythonExe: string, wordkDir: string, additionalEnvVariables: Record<string, string>, tries = 0) {
+  if (apiService.desiredState === 'stopped') return;
+  tries++;
+  let stderrData = '';
+  let maxTries = 2;
+  logger.info(`#${tries} try to start python API`)
+
+  const webProcess = spawn(pythonExe, ["web_api.py", "--port", settings.port.toString()], {
+    cwd: wordkDir,
+    windowsHide: true,
+    env: Object.assign(process.env, additionalEnvVariables)
+  });
+
+  apiService.webProcess = webProcess;
+
+  const handleFailure = (err: Error | null, code: number | null) => {
+    logger.error(`Error: ${err || `Process exited with code ${code}`}`);
+    if (tries < maxTries) {
+      spawnAPI(pythonExe, wordkDir, additionalEnvVariables, tries);
+    } else {
+      apiService.status = { status: "stopped" };
+      logger.error(`Maximum attempts reached. Giving up.`);
+      if (webProcess.stderr != null) {
+        // TODO: catch + retry
+        logger.info(`stderrData: ${stderrData}`);
+        win?.webContents.send('reportError', stderrData);
+        //throw new Error(`Backend could not start:\n ${stderrData}`) 
+      }
+    }
+  };
+
+  apiService.status = { status: "running" };
+
+  webProcess.on('error', (err) => handleFailure(err, null));
+  webProcess.on('exit', (code, signal) => handleFailure(null, code));
+  webProcess.stderr?.on('data', (data) => {
+    stderrData = data.toString();
+  });
+
+  webProcess.stdout.on('data', (message) => {
+    logger.info(`${message}`, 'ai-backend')
+  })
+  webProcess.stderr.on('data', (message) => {
+    logger.error(`${message}`, 'ai-backend')
+  })
+}
+
+
 function closeApiService() {
   apiService.normalExit = true;
+  apiService.desiredState = 'stopped';
   if (apiService.webProcess != null && apiService.webProcess.pid && isProcessRunning(apiService.webProcess.pid)) {
     apiService.webProcess.kill();
     apiService.webProcess = null;
@@ -521,8 +619,8 @@ ipcMain.on("openImageWin", (_: IpcMainEvent, url: string, title: string, width:
 ipcMain.handle('showSaveDialog', async (event, options: Electron.SaveDialogOptions) => {
   dialog.showSaveDialog(options).then(result => {
     return result;
-  }).catch(err => {
-    console.error(err);
+  }).catch(error => {
+    logger.error(`${JSON.stringify(error, Object.getOwnPropertyNames, 2)}`);
   });
 });
 
@@ -584,7 +682,7 @@ app.whenReady().then(async () => {
     });
     app.exit();
   } else {
-    loadSettings();
+    await loadSettings();
     initEventHandle();
     createWindow();
     wakeupApiService();
diff --git a/WebUI/electron/pathsManager.ts b/WebUI/electron/pathsManager.ts
index 40caa2f9..f1ab2e8d 100644
--- a/WebUI/electron/pathsManager.ts
+++ b/WebUI/electron/pathsManager.ts
@@ -58,11 +58,11 @@ export class PathsManager {
             throw ex;
         }
     }
-    scanSDModleLists() {
-        const models = [
+    scanSDModleLists(returnDefaults = true) {
+        const models = returnDefaults ? [
             "Lykon/dreamshaper-8",
             "RunDiffusion/Juggernaut-XL-v9",
-        ]
+        ] : [];
         const dir = this.modelPaths.stableDiffusion;
         if (fs.existsSync(dir)) {
 
@@ -94,10 +94,10 @@ export class PathsManager {
         }
         return models
     }
-    scanLLMModles() {
-        const models = [
+    scanLLMModles(returnDefaults = true) {
+        const models = returnDefaults ? [
             "microsoft/Phi-3-mini-4k-instruct",
-        ]
+        ] : [];
         const dir = this.modelPaths.llm;
         if (fs.existsSync(dir)) {
             const modelsSet = new Set(models);
@@ -119,12 +119,12 @@ export class PathsManager {
         }
         return models
     }
-    scanLora() {
-        const models = [
+    scanLora(returnDefaults = true) {
+        const models = returnDefaults ? [
             "None",
             "latent-consistency/lcm-lora-sdxl",
             "latent-consistency/lcm-lora-sdv1-5",
-        ]
+        ] : [];
         const loraDir = this.modelPaths.lora;
         if (fs.existsSync(loraDir)) {
             const modelsSet = new Set(models);
@@ -153,16 +153,16 @@ export class PathsManager {
         }
         return models
     }
-    scanEmbedding() {
-        return [
+    scanEmbedding(returnDefaults = true) {
+        return returnDefaults ? [
             "BAAI/bge-large-en-v1.5",
             "BAAI/bge-large-zh-v1.5"
-        ]
+        ] : [];
     }
-    scanInpaint() {
-        const models = [
+    scanInpaint(returnDefaults = true) {
+        const models = returnDefaults ? [
             "Lykon/dreamshaper-8-inpainting"
-        ]
+        ] : [];
         const dir = this.modelPaths.inpaint;
         if (fs.existsSync(dir)) {
             const modelsSet = new Set(models);
diff --git a/WebUI/electron/preload.ts b/WebUI/electron/preload.ts
index 66021092..bddd34da 100644
--- a/WebUI/electron/preload.ts
+++ b/WebUI/electron/preload.ts
@@ -101,9 +101,14 @@ import { contextBridge, ipcRenderer, dialog } from "electron";
 
 // domReady().then(appendLoading);
 
+contextBridge.exposeInMainWorld("envVars", {
+  platformTitle: import.meta.env.VITE_PLATFORM_TITLE,
+});
 contextBridge.exposeInMainWorld("electronAPI", {
+  openDevTools: () => ipcRenderer.send("openDevTools"),
   openUrl: (url: string) => ipcRenderer.send("openUrl", url),
   getLocalSettings: () => ipcRenderer.invoke("getLocalSettings"),
+  getThemeSettings: () => ipcRenderer.invoke("getThemeSettings"),
   getWinSize: () => ipcRenderer.invoke("getWinSize"),
   setWinSize: (width: number, height: number) =>
     ipcRenderer.invoke("setWinSize", width, height),
@@ -140,13 +145,22 @@ contextBridge.exposeInMainWorld("electronAPI", {
     ),
   existsPath: (path: string) => ipcRenderer.invoke("existsPath", path),
   getInitSetting: () => ipcRenderer.invoke("getInitSetting"),
+  getPythonBackendStatus: () => ipcRenderer.invoke("getPythonBackendStatus"),
   updateModelPaths: (modelPaths: ModelPaths) => ipcRenderer.invoke("updateModelPaths", modelPaths),
   restorePathsSettings :()=>ipcRenderer.invoke("restorePathsSettings"),
   refreshSDModles: () => ipcRenderer.invoke("refreshSDModles"),
   refreshInpaintModles: () => ipcRenderer.invoke("refreshInpaintModles"),
   refreshLLMModles: () => ipcRenderer.invoke("refreshLLMModles"),
   refreshLora: () => ipcRenderer.invoke("refreshLora"),
+  refreshEmbeddingModels: () => ipcRenderer.invoke("refreshEmbeddingModels"),
+  getDownloadedDiffusionModels: () => ipcRenderer.invoke("getDownloadedDiffusionModels"),
+  getDownloadedInpaintModels: () => ipcRenderer.invoke("getDownloadedInpaintModels"),
+  getDownloadedLoras: () => ipcRenderer.invoke("getDownloadedLoras"),
+  getDownloadedLLMs: () => ipcRenderer.invoke("getDownloadedLLMs"),
+  getDownloadedEmbeddingModels: () => ipcRenderer.invoke("getDownloadedEmbeddingModels"),
   openImageWithSystem: (url: string) => ipcRenderer.send("openImageWithSystem", url),
   selecteImage: (url: string) => ipcRenderer.send("selecteImage", url),
   setFullScreen: (enable: boolean) => ipcRenderer.send("setFullScreen", enable),
+  onReportError: (callback: (errorMessage: string) => void) => ipcRenderer.on('reportError', (_event, value) => callback(value)),
+  onDebugLog: (callback: (data: { level: string, source: string, message: string}) => void) => ipcRenderer.on('debugLog', (_event, value) => callback(value)),
 });
diff --git a/WebUI/external/settings-dev.json b/WebUI/external/settings-dev.json
index 38fcdcee..9981cda3 100644
--- a/WebUI/external/settings-dev.json
+++ b/WebUI/external/settings-dev.json
@@ -1,5 +1,6 @@
 {
     "envType": "arc",
     "debug":1,
-    "port":56789
+    "port":56789,
+    "availableThemes": ["dark","lnl"]
 }
\ No newline at end of file
diff --git a/WebUI/index.html b/WebUI/index.html
index 8f9292dd..35fcc628 100644
--- a/WebUI/index.html
+++ b/WebUI/index.html
@@ -7,7 +7,7 @@
     <title>AI Playground</title>
   </head>
   <body>
-    <div id="app"></div>
+    <div class="lnl-background" id="app"></div>
     <script type="module" src="/src/main.ts"></script>
   </body>
 </html>
diff --git a/WebUI/package-lock.json b/WebUI/package-lock.json
index e6312741..98619f81 100644
--- a/WebUI/package-lock.json
+++ b/WebUI/package-lock.json
@@ -8,13 +8,22 @@
       "name": "ai-playground",
       "version": "0.0.1",
       "dependencies": {
-        "autoprefixer": "^10.4.19",
+        "@radix-icons/vue": "^1.0.0",
+        "@vueuse/core": "^11.0.3",
+        "class-variance-authority": "^0.7.0",
+        "clsx": "^2.1.1",
+        "cross-env": "^7.0.3",
+        "get-port": "^7.1.0",
         "highlight.js": "^11.9.0",
         "koffi": "^2.8.8",
         "marked": "^12.0.2",
         "marked-highlight": "^2.1.1",
         "pinia": "^2.1.7",
+        "pinia-plugin-persistedstate": "^4.0.0",
+        "radix-vue": "^1.9.4",
         "sudo-prompt": "^9.2.1",
+        "tailwind-merge": "^2.5.2",
+        "tailwindcss-animate": "^1.0.7",
         "unplugin-auto-import": "^0.17.5",
         "vue": "^3.4.21"
       },
@@ -23,14 +32,15 @@
         "@types/node": "^20.8.10",
         "@vitejs/plugin-vue": "^5.0.4",
         "@vue/devtools": "^7.3.6",
+        "autoprefixer": "^10.4.20",
         "electron": "^31.2.1",
         "electron-builder": "^24.13.3",
         "electron-builder-squirrel-windows": "^24.13.3",
         "postcss": "^8.4.31",
         "postcss-import": "^15.1.0",
-        "tailwindcss": "^3.3.5",
+        "tailwindcss": "^3.4.10",
         "typescript": "^5.2.2",
-        "vite": "^5.2.0",
+        "vite": "^5.4.2",
         "vite-plugin-electron": "^0.28.7",
         "vite-plugin-electron-renderer": "^0.14.5",
         "vue-tsc": "^2.0.6"
@@ -40,7 +50,6 @@
       "version": "5.2.0",
       "resolved": "https://registry.npmjs.org/@alloc/quick-lru/-/quick-lru-5.2.0.tgz",
       "integrity": "sha512-UrcABB+4bUrFABwbluTIBErXwvbsU/V7TZWfmbgJfbkwiBuziS9gxdODUyuiecfdGQ85jglMW6juS3+z5TsKLw==",
-      "dev": true,
       "engines": {
         "node": ">=10"
       },
@@ -48,6 +57,18 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/@ampproject/remapping": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/@ampproject/remapping/-/remapping-2.3.0.tgz",
+      "integrity": "sha512-30iZtAPgz+LTIYoeivqYo853f02jBYSd5uGnGpkFV0M3xOt9aN73erkgYAmZU43x4VfqcnLxW9Kpg3R5LC4YYw==",
+      "dependencies": {
+        "@jridgewell/gen-mapping": "^0.3.5",
+        "@jridgewell/trace-mapping": "^0.3.24"
+      },
+      "engines": {
+        "node": ">=6.0.0"
+      }
+    },
     "node_modules/@antfu/utils": {
       "version": "0.7.10",
       "resolved": "https://registry.npmjs.org/@antfu/utils/-/utils-0.7.10.tgz",
@@ -56,10 +77,264 @@
         "url": "https://github.com/sponsors/antfu"
       }
     },
-    "node_modules/@babel/parser": {
+    "node_modules/@babel/code-frame": {
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.24.7.tgz",
+      "integrity": "sha512-BcYH1CVJBO9tvyIZ2jVeXgSIMvGZ2FDRvDdOIVQyuklNKSsx+eppDEBq/g47Ayw+RqNFE+URvOShmf+f/qwAlA==",
+      "dependencies": {
+        "@babel/highlight": "^7.24.7",
+        "picocolors": "^1.0.0"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/compat-data": {
+      "version": "7.25.4",
+      "resolved": "https://registry.npmjs.org/@babel/compat-data/-/compat-data-7.25.4.tgz",
+      "integrity": "sha512-+LGRog6RAsCJrrrg/IO6LGmpphNe5DiK30dGjCoxxeGv49B10/3XYGxPsAwrDlMFcFEvdAUavDT8r9k/hSyQqQ==",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/core": {
+      "version": "7.25.2",
+      "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.25.2.tgz",
+      "integrity": "sha512-BBt3opiCOxUr9euZ5/ro/Xv8/V7yJ5bjYMqG/C1YAo8MIKAnumZalCN+msbci3Pigy4lIQfPUpfMM27HMGaYEA==",
+      "dependencies": {
+        "@ampproject/remapping": "^2.2.0",
+        "@babel/code-frame": "^7.24.7",
+        "@babel/generator": "^7.25.0",
+        "@babel/helper-compilation-targets": "^7.25.2",
+        "@babel/helper-module-transforms": "^7.25.2",
+        "@babel/helpers": "^7.25.0",
+        "@babel/parser": "^7.25.0",
+        "@babel/template": "^7.25.0",
+        "@babel/traverse": "^7.25.2",
+        "@babel/types": "^7.25.2",
+        "convert-source-map": "^2.0.0",
+        "debug": "^4.1.0",
+        "gensync": "^1.0.0-beta.2",
+        "json5": "^2.2.3",
+        "semver": "^6.3.1"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/babel"
+      }
+    },
+    "node_modules/@babel/generator": {
+      "version": "7.25.6",
+      "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.25.6.tgz",
+      "integrity": "sha512-VPC82gr1seXOpkjAAKoLhP50vx4vGNlF4msF64dSFq1P8RfB+QAuJWGHPXXPc8QyfVWwwB/TNNU4+ayZmHNbZw==",
+      "dependencies": {
+        "@babel/types": "^7.25.6",
+        "@jridgewell/gen-mapping": "^0.3.5",
+        "@jridgewell/trace-mapping": "^0.3.25",
+        "jsesc": "^2.5.1"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helper-compilation-targets": {
+      "version": "7.25.2",
+      "resolved": "https://registry.npmjs.org/@babel/helper-compilation-targets/-/helper-compilation-targets-7.25.2.tgz",
+      "integrity": "sha512-U2U5LsSaZ7TAt3cfaymQ8WHh0pxvdHoEk6HVpaexxixjyEquMh0L0YNJNM6CTGKMXV1iksi0iZkGw4AcFkPaaw==",
+      "dependencies": {
+        "@babel/compat-data": "^7.25.2",
+        "@babel/helper-validator-option": "^7.24.8",
+        "browserslist": "^4.23.1",
+        "lru-cache": "^5.1.1",
+        "semver": "^6.3.1"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helper-compilation-targets/node_modules/lru-cache": {
+      "version": "5.1.1",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz",
+      "integrity": "sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==",
+      "dependencies": {
+        "yallist": "^3.0.2"
+      }
+    },
+    "node_modules/@babel/helper-compilation-targets/node_modules/yallist": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/yallist/-/yallist-3.1.1.tgz",
+      "integrity": "sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g=="
+    },
+    "node_modules/@babel/helper-module-imports": {
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.24.7.tgz",
+      "integrity": "sha512-8AyH3C+74cgCVVXow/myrynrAGv+nTVg5vKu2nZph9x7RcRwzmh0VFallJuFTZ9mx6u4eSdXZfcOzSqTUm0HCA==",
+      "dependencies": {
+        "@babel/traverse": "^7.24.7",
+        "@babel/types": "^7.24.7"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helper-module-transforms": {
+      "version": "7.25.2",
+      "resolved": "https://registry.npmjs.org/@babel/helper-module-transforms/-/helper-module-transforms-7.25.2.tgz",
+      "integrity": "sha512-BjyRAbix6j/wv83ftcVJmBt72QtHI56C7JXZoG2xATiLpmoC7dpd8WnkikExHDVPpi/3qCmO6WY1EaXOluiecQ==",
+      "dependencies": {
+        "@babel/helper-module-imports": "^7.24.7",
+        "@babel/helper-simple-access": "^7.24.7",
+        "@babel/helper-validator-identifier": "^7.24.7",
+        "@babel/traverse": "^7.25.2"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      },
+      "peerDependencies": {
+        "@babel/core": "^7.0.0"
+      }
+    },
+    "node_modules/@babel/helper-simple-access": {
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/helper-simple-access/-/helper-simple-access-7.24.7.tgz",
+      "integrity": "sha512-zBAIvbCMh5Ts+b86r/CjU+4XGYIs+R1j951gxI3KmmxBMhCg4oQMsv6ZXQ64XOm/cvzfU1FmoCyt6+owc5QMYg==",
+      "dependencies": {
+        "@babel/traverse": "^7.24.7",
+        "@babel/types": "^7.24.7"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helper-string-parser": {
+      "version": "7.24.8",
+      "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-7.24.8.tgz",
+      "integrity": "sha512-pO9KhhRcuUyGnJWwyEgnRJTSIZHiT+vMD0kPeD+so0l7mxkMT19g3pjY9GTnHySck/hDzq+dtW/4VgnMkippsQ==",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helper-validator-identifier": {
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.24.7.tgz",
+      "integrity": "sha512-rR+PBcQ1SMQDDyF6X0wxtG8QyLCgUB0eRAGguqRLfkCA87l7yAP7ehq8SNj96OOGTO8OBV70KhuFYcIkHXOg0w==",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helper-validator-option": {
       "version": "7.24.8",
-      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.24.8.tgz",
-      "integrity": "sha512-WzfbgXOkGzZiXXCqk43kKwZjzwx4oulxZi3nq2TYL9mOjQv6kYwul9mz6ID36njuL7Xkp6nJEfok848Zj10j/w==",
+      "resolved": "https://registry.npmjs.org/@babel/helper-validator-option/-/helper-validator-option-7.24.8.tgz",
+      "integrity": "sha512-xb8t9tD1MHLungh/AIoWYN+gVHaB9kwlu8gffXGSt3FFEIT7RjS+xWbc2vUD1UTZdIpKj/ab3rdqJ7ufngyi2Q==",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helpers": {
+      "version": "7.25.6",
+      "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.25.6.tgz",
+      "integrity": "sha512-Xg0tn4HcfTijTwfDwYlvVCl43V6h4KyVVX2aEm4qdO/PC6L2YvzLHFdmxhoeSA3eslcE6+ZVXHgWwopXYLNq4Q==",
+      "dependencies": {
+        "@babel/template": "^7.25.0",
+        "@babel/types": "^7.25.6"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/highlight": {
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/highlight/-/highlight-7.24.7.tgz",
+      "integrity": "sha512-EStJpq4OuY8xYfhGVXngigBJRWxftKX9ksiGDnmlY3o7B/V7KIAc9X4oiK87uPJSc/vs5L869bem5fhZa8caZw==",
+      "dependencies": {
+        "@babel/helper-validator-identifier": "^7.24.7",
+        "chalk": "^2.4.2",
+        "js-tokens": "^4.0.0",
+        "picocolors": "^1.0.0"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/highlight/node_modules/ansi-styles": {
+      "version": "3.2.1",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
+      "integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==",
+      "dependencies": {
+        "color-convert": "^1.9.0"
+      },
+      "engines": {
+        "node": ">=4"
+      }
+    },
+    "node_modules/@babel/highlight/node_modules/chalk": {
+      "version": "2.4.2",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
+      "integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==",
+      "dependencies": {
+        "ansi-styles": "^3.2.1",
+        "escape-string-regexp": "^1.0.5",
+        "supports-color": "^5.3.0"
+      },
+      "engines": {
+        "node": ">=4"
+      }
+    },
+    "node_modules/@babel/highlight/node_modules/color-convert": {
+      "version": "1.9.3",
+      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
+      "integrity": "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==",
+      "dependencies": {
+        "color-name": "1.1.3"
+      }
+    },
+    "node_modules/@babel/highlight/node_modules/color-name": {
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
+      "integrity": "sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw=="
+    },
+    "node_modules/@babel/highlight/node_modules/escape-string-regexp": {
+      "version": "1.0.5",
+      "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
+      "integrity": "sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg==",
+      "engines": {
+        "node": ">=0.8.0"
+      }
+    },
+    "node_modules/@babel/highlight/node_modules/has-flag": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
+      "integrity": "sha512-sKJf1+ceQBr4SMkvQnBDNDtf4TXpVhVGateu0t918bl30FnbE2m4vNLX+VWe/dpjlb+HugGYzW7uQXH98HPEYw==",
+      "engines": {
+        "node": ">=4"
+      }
+    },
+    "node_modules/@babel/highlight/node_modules/js-tokens": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
+      "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ=="
+    },
+    "node_modules/@babel/highlight/node_modules/supports-color": {
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
+      "integrity": "sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==",
+      "dependencies": {
+        "has-flag": "^3.0.0"
+      },
+      "engines": {
+        "node": ">=4"
+      }
+    },
+    "node_modules/@babel/parser": {
+      "version": "7.25.6",
+      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.25.6.tgz",
+      "integrity": "sha512-trGdfBdbD0l1ZPmcJ83eNxB9rbEax4ALFTF7fN386TMYbeCQbyme5cOEXQhbGXKebwGaB/J52w1mrklMcbgy6Q==",
+      "dependencies": {
+        "@babel/types": "^7.25.6"
+      },
       "bin": {
         "parser": "bin/babel-parser.js"
       },
@@ -67,6 +342,57 @@
         "node": ">=6.0.0"
       }
     },
+    "node_modules/@babel/standalone": {
+      "version": "7.25.6",
+      "resolved": "https://registry.npmjs.org/@babel/standalone/-/standalone-7.25.6.tgz",
+      "integrity": "sha512-Kf2ZcZVqsKbtYhlA7sP0z5A3q5hmCVYMKMWRWNK/5OVwHIve3JY1djVRmIVAx8FMueLIfZGKQDIILK2w8zO4mg==",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/template": {
+      "version": "7.25.0",
+      "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.25.0.tgz",
+      "integrity": "sha512-aOOgh1/5XzKvg1jvVz7AVrx2piJ2XBi227DHmbY6y+bM9H2FlN+IfecYu4Xl0cNiiVejlsCri89LUsbj8vJD9Q==",
+      "dependencies": {
+        "@babel/code-frame": "^7.24.7",
+        "@babel/parser": "^7.25.0",
+        "@babel/types": "^7.25.0"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/traverse": {
+      "version": "7.25.6",
+      "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.25.6.tgz",
+      "integrity": "sha512-9Vrcx5ZW6UwK5tvqsj0nGpp/XzqthkT0dqIc9g1AdtygFToNtTF67XzYS//dm+SAK9cp3B9R4ZO/46p63SCjlQ==",
+      "dependencies": {
+        "@babel/code-frame": "^7.24.7",
+        "@babel/generator": "^7.25.6",
+        "@babel/parser": "^7.25.6",
+        "@babel/template": "^7.25.0",
+        "@babel/types": "^7.25.6",
+        "debug": "^4.3.1",
+        "globals": "^11.1.0"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/types": {
+      "version": "7.25.6",
+      "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.25.6.tgz",
+      "integrity": "sha512-/l42B1qxpG6RdfYf343Uw1vmDjeNhneUXtzhojE7pDgfpEypmRhI6j1kr17XCVv4Cgl9HdAiQY2x0GwKm7rWCw==",
+      "dependencies": {
+        "@babel/helper-string-parser": "^7.24.8",
+        "@babel/helper-validator-identifier": "^7.24.7",
+        "to-fast-properties": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
     "node_modules/@develar/schema-utils": {
       "version": "2.6.5",
       "resolved": "https://registry.npmjs.org/@develar/schema-utils/-/schema-utils-2.6.5.tgz",
@@ -706,11 +1032,83 @@
         "node": ">=12"
       }
     },
+    "node_modules/@floating-ui/core": {
+      "version": "1.6.7",
+      "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.6.7.tgz",
+      "integrity": "sha512-yDzVT/Lm101nQ5TCVeK65LtdN7Tj4Qpr9RTXJ2vPFLqtLxwOrpoxAHAJI8J3yYWUc40J0BDBheaitK5SJmno2g==",
+      "dependencies": {
+        "@floating-ui/utils": "^0.2.7"
+      }
+    },
+    "node_modules/@floating-ui/dom": {
+      "version": "1.6.10",
+      "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.6.10.tgz",
+      "integrity": "sha512-fskgCFv8J8OamCmyun8MfjB1Olfn+uZKjOKZ0vhYF3gRmEUXcGOjxWL8bBr7i4kIuPZ2KD2S3EUIOxnjC8kl2A==",
+      "dependencies": {
+        "@floating-ui/core": "^1.6.0",
+        "@floating-ui/utils": "^0.2.7"
+      }
+    },
+    "node_modules/@floating-ui/utils": {
+      "version": "0.2.7",
+      "resolved": "https://registry.npmjs.org/@floating-ui/utils/-/utils-0.2.7.tgz",
+      "integrity": "sha512-X8R8Oj771YRl/w+c1HqAC1szL8zWQRwFvgDwT129k9ACdBoud/+/rX9V0qiMl6LWUdP9voC2nDVZYPMQQsb6eA=="
+    },
+    "node_modules/@floating-ui/vue": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/@floating-ui/vue/-/vue-1.1.4.tgz",
+      "integrity": "sha512-ammH7T3vyCx7pmm9OF19Wc42zrGnUw0QvLoidgypWsCLJMtGXEwY7paYIHO+K+oLC3mbWpzIHzeTVienYenlNg==",
+      "dependencies": {
+        "@floating-ui/dom": "^1.0.0",
+        "@floating-ui/utils": "^0.2.7",
+        "vue-demi": ">=0.13.0"
+      }
+    },
+    "node_modules/@floating-ui/vue/node_modules/vue-demi": {
+      "version": "0.14.10",
+      "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.10.tgz",
+      "integrity": "sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==",
+      "hasInstallScript": true,
+      "bin": {
+        "vue-demi-fix": "bin/vue-demi-fix.js",
+        "vue-demi-switch": "bin/vue-demi-switch.js"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      },
+      "peerDependencies": {
+        "@vue/composition-api": "^1.0.0-rc.1",
+        "vue": "^3.0.0-0 || ^2.6.0"
+      },
+      "peerDependenciesMeta": {
+        "@vue/composition-api": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@internationalized/date": {
+      "version": "3.5.5",
+      "resolved": "https://registry.npmjs.org/@internationalized/date/-/date-3.5.5.tgz",
+      "integrity": "sha512-H+CfYvOZ0LTJeeLOqm19E3uj/4YjrmOFtBufDHPfvtI80hFAMqtrp7oCACpe4Cil5l8S0Qu/9dYfZc/5lY8WQQ==",
+      "dependencies": {
+        "@swc/helpers": "^0.5.0"
+      }
+    },
+    "node_modules/@internationalized/number": {
+      "version": "3.5.3",
+      "resolved": "https://registry.npmjs.org/@internationalized/number/-/number-3.5.3.tgz",
+      "integrity": "sha512-rd1wA3ebzlp0Mehj5YTuTI50AQEx80gWFyHcQu+u91/5NgdwBecO8BH6ipPfE+lmQ9d63vpB3H9SHoIUiupllw==",
+      "dependencies": {
+        "@swc/helpers": "^0.5.0"
+      }
+    },
     "node_modules/@isaacs/cliui": {
       "version": "8.0.2",
       "resolved": "https://registry.npmjs.org/@isaacs/cliui/-/cliui-8.0.2.tgz",
       "integrity": "sha512-O8jcjabXaleOG9DQ0+ARXWZBTfnP4WNAqzuiJK7ll44AmxGKv/J2M4TPjxjY3znBCfvBXFzucm1twdyFybFqEA==",
-      "dev": true,
       "dependencies": {
         "string-width": "^5.1.2",
         "string-width-cjs": "npm:string-width@^4.2.0",
@@ -727,7 +1125,6 @@
       "version": "6.0.1",
       "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.0.1.tgz",
       "integrity": "sha512-n5M855fKb2SsfMIiFFoVrABHJC8QtHwVx+mHWP3QcEqBHYienj5dHSgjbxtC0WEZXYt4wcD6zrQElDPhFuZgfA==",
-      "dev": true,
       "engines": {
         "node": ">=12"
       },
@@ -739,7 +1136,6 @@
       "version": "6.2.1",
       "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-6.2.1.tgz",
       "integrity": "sha512-bN798gFfQX+viw3R7yrGWRqnrN2oRkEkUjjl4JNn4E8GxxbjtG3FbrEIIY3l8/hrwUwIeCZvi4QuOTP4MErVug==",
-      "dev": true,
       "engines": {
         "node": ">=12"
       },
@@ -750,14 +1146,12 @@
     "node_modules/@isaacs/cliui/node_modules/emoji-regex": {
       "version": "9.2.2",
       "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-9.2.2.tgz",
-      "integrity": "sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg==",
-      "dev": true
+      "integrity": "sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg=="
     },
     "node_modules/@isaacs/cliui/node_modules/string-width": {
       "version": "5.1.2",
       "resolved": "https://registry.npmjs.org/string-width/-/string-width-5.1.2.tgz",
       "integrity": "sha512-HnLOCR3vjcY8beoNLtcjZ5/nxn2afmME6lhrDrebokqMap+XbeW8n9TXpPDOqdGK5qcI3oT0GKTW6wC7EMiVqA==",
-      "dev": true,
       "dependencies": {
         "eastasianwidth": "^0.2.0",
         "emoji-regex": "^9.2.2",
@@ -774,7 +1168,6 @@
       "version": "7.1.0",
       "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-7.1.0.tgz",
       "integrity": "sha512-iq6eVVI64nQQTRYq2KtEg2d2uU7LElhTJwsH4YzIHZshxlgZms/wIc4VoDQTlG/IvVIrBKG06CrZnp0qv7hkcQ==",
-      "dev": true,
       "dependencies": {
         "ansi-regex": "^6.0.1"
       },
@@ -789,7 +1182,6 @@
       "version": "8.1.0",
       "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-8.1.0.tgz",
       "integrity": "sha512-si7QWI6zUMq56bESFvagtmzMdGOtoxfR+Sez11Mobfc7tm+VkUckk9bW2UeffTGVUbOksxmSw0AA2gs8g71NCQ==",
-      "dev": true,
       "dependencies": {
         "ansi-styles": "^6.1.0",
         "string-width": "^5.0.1",
@@ -806,7 +1198,6 @@
       "version": "0.3.5",
       "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.5.tgz",
       "integrity": "sha512-IzL8ZoEDIBRWEzlCcRhOaCupYyN5gdIK+Q6fbFdPDg6HqX6jpkItn7DFIpW9LQzXG6Df9sA7+OKnq0qlz/GaQg==",
-      "dev": true,
       "dependencies": {
         "@jridgewell/set-array": "^1.2.1",
         "@jridgewell/sourcemap-codec": "^1.4.10",
@@ -820,7 +1211,6 @@
       "version": "3.1.2",
       "resolved": "https://registry.npmjs.org/@jridgewell/resolve-uri/-/resolve-uri-3.1.2.tgz",
       "integrity": "sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==",
-      "dev": true,
       "engines": {
         "node": ">=6.0.0"
       }
@@ -829,7 +1219,6 @@
       "version": "1.2.1",
       "resolved": "https://registry.npmjs.org/@jridgewell/set-array/-/set-array-1.2.1.tgz",
       "integrity": "sha512-R8gLRTZeyp03ymzP/6Lil/28tGeGEzhx1q2k703KGWRAI1VdvPIXdG70VJc2pAMw3NA6JKL5hhFu1sJX0Mnn/A==",
-      "dev": true,
       "engines": {
         "node": ">=6.0.0"
       }
@@ -843,7 +1232,6 @@
       "version": "0.3.25",
       "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.25.tgz",
       "integrity": "sha512-vNk6aEwybGtawWmy/PzwnGDOjCkLWSD2wqvjGGAgOAwCGWySYXfYoxt00IJkTF+8Lb57DwOb3Aa0o9CApepiYQ==",
-      "dev": true,
       "dependencies": {
         "@jridgewell/resolve-uri": "^3.1.0",
         "@jridgewell/sourcemap-codec": "^1.4.14"
@@ -954,16 +1342,86 @@
         "node": ">= 8"
       }
     },
+    "node_modules/@nuxt/kit": {
+      "version": "3.13.1",
+      "resolved": "https://registry.npmjs.org/@nuxt/kit/-/kit-3.13.1.tgz",
+      "integrity": "sha512-FkUL349lp/3nVfTIyws4UDJ3d2jyv5Pk1DC1HQUCOkSloYYMdbRcQAUcb4fe2TCLNWvHM+FhU8jnzGTzjALZYA==",
+      "dependencies": {
+        "@nuxt/schema": "3.13.1",
+        "c12": "^1.11.2",
+        "consola": "^3.2.3",
+        "defu": "^6.1.4",
+        "destr": "^2.0.3",
+        "globby": "^14.0.2",
+        "hash-sum": "^2.0.0",
+        "ignore": "^5.3.2",
+        "jiti": "^1.21.6",
+        "klona": "^2.0.6",
+        "knitwork": "^1.1.0",
+        "mlly": "^1.7.1",
+        "pathe": "^1.1.2",
+        "pkg-types": "^1.2.0",
+        "scule": "^1.3.0",
+        "semver": "^7.6.3",
+        "ufo": "^1.5.4",
+        "unctx": "^2.3.1",
+        "unimport": "^3.11.1",
+        "untyped": "^1.4.2"
+      },
+      "engines": {
+        "node": "^14.18.0 || >=16.10.0"
+      }
+    },
+    "node_modules/@nuxt/kit/node_modules/semver": {
+      "version": "7.6.3",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
+      "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==",
+      "bin": {
+        "semver": "bin/semver.js"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@nuxt/schema": {
+      "version": "3.13.1",
+      "resolved": "https://registry.npmjs.org/@nuxt/schema/-/schema-3.13.1.tgz",
+      "integrity": "sha512-ishbhzVGspjshG9AG0hYnKYY6LWXzCtua7OXV7C/DQ2yA7rRcy1xHpzKZUDbIRyxCHHCAcBd8jfHEUmEuhEPrA==",
+      "dependencies": {
+        "compatx": "^0.1.8",
+        "consola": "^3.2.3",
+        "defu": "^6.1.4",
+        "hookable": "^5.5.3",
+        "pathe": "^1.1.2",
+        "pkg-types": "^1.2.0",
+        "scule": "^1.3.0",
+        "std-env": "^3.7.0",
+        "ufo": "^1.5.4",
+        "uncrypto": "^0.1.3",
+        "unimport": "^3.11.1",
+        "untyped": "^1.4.2"
+      },
+      "engines": {
+        "node": "^14.18.0 || >=16.10.0"
+      }
+    },
     "node_modules/@pkgjs/parseargs": {
       "version": "0.11.0",
       "resolved": "https://registry.npmjs.org/@pkgjs/parseargs/-/parseargs-0.11.0.tgz",
       "integrity": "sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg==",
-      "dev": true,
       "optional": true,
       "engines": {
         "node": ">=14"
       }
     },
+    "node_modules/@radix-icons/vue": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/@radix-icons/vue/-/vue-1.0.0.tgz",
+      "integrity": "sha512-gKWWk9tTK/laDRRNe5KLLR8A0qUwx4q4+DN8Fq48hJ904u78R82ayAO3TrxbNLgyn2D0h6rRiGdLzQWj7rPcvA==",
+      "peerDependencies": {
+        "vue": ">= 3"
+      }
+    },
     "node_modules/@rollup/pluginutils": {
       "version": "5.1.0",
       "resolved": "https://registry.npmjs.org/@rollup/pluginutils/-/pluginutils-5.1.0.tgz",
@@ -986,9 +1444,9 @@
       }
     },
     "node_modules/@rollup/rollup-android-arm-eabi": {
-      "version": "4.19.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.19.0.tgz",
-      "integrity": "sha512-JlPfZ/C7yn5S5p0yKk7uhHTTnFlvTgLetl2VxqE518QgyM7C9bSfFTYvB/Q/ftkq0RIPY4ySxTz+/wKJ/dXC0w==",
+      "version": "4.21.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.21.0.tgz",
+      "integrity": "sha512-WTWD8PfoSAJ+qL87lE7votj3syLavxunWhzCnx3XFxFiI/BA/r3X7MUM8dVrH8rb2r4AiO8jJsr3ZjdaftmnfA==",
       "cpu": [
         "arm"
       ],
@@ -999,9 +1457,9 @@
       ]
     },
     "node_modules/@rollup/rollup-android-arm64": {
-      "version": "4.19.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.19.0.tgz",
-      "integrity": "sha512-RDxUSY8D1tWYfn00DDi5myxKgOk6RvWPxhmWexcICt/MEC6yEMr4HNCu1sXXYLw8iAsg0D44NuU+qNq7zVWCrw==",
+      "version": "4.21.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.21.0.tgz",
+      "integrity": "sha512-a1sR2zSK1B4eYkiZu17ZUZhmUQcKjk2/j9Me2IDjk1GHW7LB5Z35LEzj9iJch6gtUfsnvZs1ZNyDW2oZSThrkA==",
       "cpu": [
         "arm64"
       ],
@@ -1012,9 +1470,9 @@
       ]
     },
     "node_modules/@rollup/rollup-darwin-arm64": {
-      "version": "4.19.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.19.0.tgz",
-      "integrity": "sha512-emvKHL4B15x6nlNTBMtIaC9tLPRpeA5jMvRLXVbl/W9Ie7HhkrE7KQjvgS9uxgatL1HmHWDXk5TTS4IaNJxbAA==",
+      "version": "4.21.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.21.0.tgz",
+      "integrity": "sha512-zOnKWLgDld/svhKO5PD9ozmL6roy5OQ5T4ThvdYZLpiOhEGY+dp2NwUmxK0Ld91LrbjrvtNAE0ERBwjqhZTRAA==",
       "cpu": [
         "arm64"
       ],
@@ -1025,9 +1483,9 @@
       ]
     },
     "node_modules/@rollup/rollup-darwin-x64": {
-      "version": "4.19.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.19.0.tgz",
-      "integrity": "sha512-fO28cWA1dC57qCd+D0rfLC4VPbh6EOJXrreBmFLWPGI9dpMlER2YwSPZzSGfq11XgcEpPukPTfEVFtw2q2nYJg==",
+      "version": "4.21.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.21.0.tgz",
+      "integrity": "sha512-7doS8br0xAkg48SKE2QNtMSFPFUlRdw9+votl27MvT46vo44ATBmdZdGysOevNELmZlfd+NEa0UYOA8f01WSrg==",
       "cpu": [
         "x64"
       ],
@@ -1038,9 +1496,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-arm-gnueabihf": {
-      "version": "4.19.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.19.0.tgz",
-      "integrity": "sha512-2Rn36Ubxdv32NUcfm0wB1tgKqkQuft00PtM23VqLuCUR4N5jcNWDoV5iBC9jeGdgS38WK66ElncprqgMUOyomw==",
+      "version": "4.21.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.21.0.tgz",
+      "integrity": "sha512-pWJsfQjNWNGsoCq53KjMtwdJDmh/6NubwQcz52aEwLEuvx08bzcy6tOUuawAOncPnxz/3siRtd8hiQ32G1y8VA==",
       "cpu": [
         "arm"
       ],
@@ -1051,9 +1509,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-arm-musleabihf": {
-      "version": "4.19.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.19.0.tgz",
-      "integrity": "sha512-gJuzIVdq/X1ZA2bHeCGCISe0VWqCoNT8BvkQ+BfsixXwTOndhtLUpOg0A1Fcx/+eA6ei6rMBzlOz4JzmiDw7JQ==",
+      "version": "4.21.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.21.0.tgz",
+      "integrity": "sha512-efRIANsz3UHZrnZXuEvxS9LoCOWMGD1rweciD6uJQIx2myN3a8Im1FafZBzh7zk1RJ6oKcR16dU3UPldaKd83w==",
       "cpu": [
         "arm"
       ],
@@ -1064,9 +1522,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-arm64-gnu": {
-      "version": "4.19.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.19.0.tgz",
-      "integrity": "sha512-0EkX2HYPkSADo9cfeGFoQ7R0/wTKb7q6DdwI4Yn/ULFE1wuRRCHybxpl2goQrx4c/yzK3I8OlgtBu4xvted0ug==",
+      "version": "4.21.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.21.0.tgz",
+      "integrity": "sha512-ZrPhydkTVhyeGTW94WJ8pnl1uroqVHM3j3hjdquwAcWnmivjAwOYjTEAuEDeJvGX7xv3Z9GAvrBkEzCgHq9U1w==",
       "cpu": [
         "arm64"
       ],
@@ -1077,9 +1535,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-arm64-musl": {
-      "version": "4.19.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.19.0.tgz",
-      "integrity": "sha512-GlIQRj9px52ISomIOEUq/IojLZqzkvRpdP3cLgIE1wUWaiU5Takwlzpz002q0Nxxr1y2ZgxC2obWxjr13lvxNQ==",
+      "version": "4.21.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.21.0.tgz",
+      "integrity": "sha512-cfaupqd+UEFeURmqNP2eEvXqgbSox/LHOyN9/d2pSdV8xTrjdg3NgOFJCtc1vQ/jEke1qD0IejbBfxleBPHnPw==",
       "cpu": [
         "arm64"
       ],
@@ -1090,9 +1548,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-powerpc64le-gnu": {
-      "version": "4.19.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-powerpc64le-gnu/-/rollup-linux-powerpc64le-gnu-4.19.0.tgz",
-      "integrity": "sha512-N6cFJzssruDLUOKfEKeovCKiHcdwVYOT1Hs6dovDQ61+Y9n3Ek4zXvtghPPelt6U0AH4aDGnDLb83uiJMkWYzQ==",
+      "version": "4.21.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-powerpc64le-gnu/-/rollup-linux-powerpc64le-gnu-4.21.0.tgz",
+      "integrity": "sha512-ZKPan1/RvAhrUylwBXC9t7B2hXdpb/ufeu22pG2psV7RN8roOfGurEghw1ySmX/CmDDHNTDDjY3lo9hRlgtaHg==",
       "cpu": [
         "ppc64"
       ],
@@ -1103,9 +1561,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-riscv64-gnu": {
-      "version": "4.19.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.19.0.tgz",
-      "integrity": "sha512-2DnD3mkS2uuam/alF+I7M84koGwvn3ZVD7uG+LEWpyzo/bq8+kKnus2EVCkcvh6PlNB8QPNFOz6fWd5N8o1CYg==",
+      "version": "4.21.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.21.0.tgz",
+      "integrity": "sha512-H1eRaCwd5E8eS8leiS+o/NqMdljkcb1d6r2h4fKSsCXQilLKArq6WS7XBLDu80Yz+nMqHVFDquwcVrQmGr28rg==",
       "cpu": [
         "riscv64"
       ],
@@ -1116,9 +1574,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-s390x-gnu": {
-      "version": "4.19.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.19.0.tgz",
-      "integrity": "sha512-D6pkaF7OpE7lzlTOFCB2m3Ngzu2ykw40Nka9WmKGUOTS3xcIieHe82slQlNq69sVB04ch73thKYIWz/Ian8DUA==",
+      "version": "4.21.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.21.0.tgz",
+      "integrity": "sha512-zJ4hA+3b5tu8u7L58CCSI0A9N1vkfwPhWd/puGXwtZlsB5bTkwDNW/+JCU84+3QYmKpLi+XvHdmrlwUwDA6kqw==",
       "cpu": [
         "s390x"
       ],
@@ -1129,9 +1587,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-x64-gnu": {
-      "version": "4.19.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.19.0.tgz",
-      "integrity": "sha512-HBndjQLP8OsdJNSxpNIN0einbDmRFg9+UQeZV1eiYupIRuZsDEoeGU43NQsS34Pp166DtwQOnpcbV/zQxM+rWA==",
+      "version": "4.21.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.21.0.tgz",
+      "integrity": "sha512-e2hrvElFIh6kW/UNBQK/kzqMNY5mO+67YtEh9OA65RM5IJXYTWiXjX6fjIiPaqOkBthYF1EqgiZ6OXKcQsM0hg==",
       "cpu": [
         "x64"
       ],
@@ -1142,9 +1600,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-x64-musl": {
-      "version": "4.19.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.19.0.tgz",
-      "integrity": "sha512-HxfbvfCKJe/RMYJJn0a12eiOI9OOtAUF4G6ozrFUK95BNyoJaSiBjIOHjZskTUffUrB84IPKkFG9H9nEvJGW6A==",
+      "version": "4.21.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.21.0.tgz",
+      "integrity": "sha512-1vvmgDdUSebVGXWX2lIcgRebqfQSff0hMEkLJyakQ9JQUbLDkEaMsPTLOmyccyC6IJ/l3FZuJbmrBw/u0A0uCQ==",
       "cpu": [
         "x64"
       ],
@@ -1155,9 +1613,9 @@
       ]
     },
     "node_modules/@rollup/rollup-win32-arm64-msvc": {
-      "version": "4.19.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.19.0.tgz",
-      "integrity": "sha512-HxDMKIhmcguGTiP5TsLNolwBUK3nGGUEoV/BO9ldUBoMLBssvh4J0X8pf11i1fTV7WShWItB1bKAKjX4RQeYmg==",
+      "version": "4.21.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.21.0.tgz",
+      "integrity": "sha512-s5oFkZ/hFcrlAyBTONFY1TWndfyre1wOMwU+6KCpm/iatybvrRgmZVM+vCFwxmC5ZhdlgfE0N4XorsDpi7/4XQ==",
       "cpu": [
         "arm64"
       ],
@@ -1168,9 +1626,9 @@
       ]
     },
     "node_modules/@rollup/rollup-win32-ia32-msvc": {
-      "version": "4.19.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.19.0.tgz",
-      "integrity": "sha512-xItlIAZZaiG/u0wooGzRsx11rokP4qyc/79LkAOdznGRAbOFc+SfEdfUOszG1odsHNgwippUJavag/+W/Etc6Q==",
+      "version": "4.21.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.21.0.tgz",
+      "integrity": "sha512-G9+TEqRnAA6nbpqyUqgTiopmnfgnMkR3kMukFBDsiyy23LZvUCpiUwjTRx6ezYCjJODXrh52rBR9oXvm+Fp5wg==",
       "cpu": [
         "ia32"
       ],
@@ -1181,9 +1639,9 @@
       ]
     },
     "node_modules/@rollup/rollup-win32-x64-msvc": {
-      "version": "4.19.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.19.0.tgz",
-      "integrity": "sha512-xNo5fV5ycvCCKqiZcpB65VMR11NJB+StnxHz20jdqRAktfdfzhgjTiJ2doTDQE/7dqGaV5I7ZGqKpgph6lCIag==",
+      "version": "4.21.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.21.0.tgz",
+      "integrity": "sha512-2jsCDZwtQvRhejHLfZ1JY6w6kEuEtfF9nzYsZxzSlNVKDX+DpsDJ+Rbjkm74nvg2rdx0gwBS+IMdvwJuq3S9pQ==",
       "cpu": [
         "x64"
       ],
@@ -1205,12 +1663,31 @@
         "url": "https://github.com/sindresorhus/is?sponsor=1"
       }
     },
+    "node_modules/@sindresorhus/merge-streams": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/@sindresorhus/merge-streams/-/merge-streams-2.3.0.tgz",
+      "integrity": "sha512-LtoMMhxAlorcGhmFYI+LhPgbPZCkgP6ra1YL604EeF6U98pLlQ3iWIGMdWSC+vWmPBWBNgmDBAhnAobLROJmwg==",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/@socket.io/component-emitter": {
       "version": "3.1.2",
       "resolved": "https://registry.npmjs.org/@socket.io/component-emitter/-/component-emitter-3.1.2.tgz",
       "integrity": "sha512-9BCxFwvbGg/RsZK9tjXd8s4UcwR0MWeFQ1XEKIQVVvAGJyINdrqKMcTRyLoK8Rse1GjzLV9cwjWV1olXRWEXVA==",
       "dev": true
     },
+    "node_modules/@swc/helpers": {
+      "version": "0.5.12",
+      "resolved": "https://registry.npmjs.org/@swc/helpers/-/helpers-0.5.12.tgz",
+      "integrity": "sha512-KMZNXiGibsW9kvZAO1Pam2JPTDBm+KSHMMHWdsyI/1DbIZjT2A6Gy3hblVXUMEDvUAKq+e0vL0X0o54owWji7g==",
+      "dependencies": {
+        "tslib": "^2.4.0"
+      }
+    },
     "node_modules/@szmarczak/http-timer": {
       "version": "4.0.6",
       "resolved": "https://registry.npmjs.org/@szmarczak/http-timer/-/http-timer-4.0.6.tgz",
@@ -1223,6 +1700,30 @@
         "node": ">=10"
       }
     },
+    "node_modules/@tanstack/virtual-core": {
+      "version": "3.9.0",
+      "resolved": "https://registry.npmjs.org/@tanstack/virtual-core/-/virtual-core-3.9.0.tgz",
+      "integrity": "sha512-Saga7/QRGej/IDCVP5BgJ1oDqlDT2d9rQyoflS3fgMS8ntJ8JGw/LBqK2GorHa06+VrNFc0tGz65XQHJQJetFQ==",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/tannerlinsley"
+      }
+    },
+    "node_modules/@tanstack/vue-virtual": {
+      "version": "3.9.0",
+      "resolved": "https://registry.npmjs.org/@tanstack/vue-virtual/-/vue-virtual-3.9.0.tgz",
+      "integrity": "sha512-MVJhQh57OR3wg2pWL/25IN1/nITFNnpFaz4gOvRCqnxhsH0WRePBBKvixOaFTgiyYfmrjFbb4d0nRMTvsjZZdQ==",
+      "dependencies": {
+        "@tanstack/virtual-core": "3.9.0"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/tannerlinsley"
+      },
+      "peerDependencies": {
+        "vue": "^2.7.0 || ^3.0.0"
+      }
+    },
     "node_modules/@tootallnate/once": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/@tootallnate/once/-/once-2.0.0.tgz",
@@ -1348,6 +1849,11 @@
       "dev": true,
       "optional": true
     },
+    "node_modules/@types/web-bluetooth": {
+      "version": "0.0.20",
+      "resolved": "https://registry.npmjs.org/@types/web-bluetooth/-/web-bluetooth-0.0.20.tgz",
+      "integrity": "sha512-g9gZnnXVq7gM7v3tJCWV/qw7w+KeOlSHAhgF9RytFyifW6AF61hdT2ucrYhPq9hLs5JIryeupHV3qGk95dH9ow=="
+    },
     "node_modules/@types/yauzl": {
       "version": "2.10.3",
       "resolved": "https://registry.npmjs.org/@types/yauzl/-/yauzl-2.10.3.tgz",
@@ -1632,6 +2138,100 @@
       "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.4.34.tgz",
       "integrity": "sha512-x5LmiRLpRsd9KTjAB8MPKf0CDPMcuItjP0gbNqFCIgL1I8iYp4zglhj9w9FPCdIbHG2M91RVeIbArFfFTz9I3A=="
     },
+    "node_modules/@vueuse/core": {
+      "version": "11.0.3",
+      "resolved": "https://registry.npmjs.org/@vueuse/core/-/core-11.0.3.tgz",
+      "integrity": "sha512-RENlh64+SYA9XMExmmH1a3TPqeIuJBNNB/63GT35MZI+zpru3oMRUA6cEFr9HmGqEgUisurwGwnIieF6qu3aXw==",
+      "dependencies": {
+        "@types/web-bluetooth": "^0.0.20",
+        "@vueuse/metadata": "11.0.3",
+        "@vueuse/shared": "11.0.3",
+        "vue-demi": ">=0.14.10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      }
+    },
+    "node_modules/@vueuse/core/node_modules/@vueuse/shared": {
+      "version": "11.0.3",
+      "resolved": "https://registry.npmjs.org/@vueuse/shared/-/shared-11.0.3.tgz",
+      "integrity": "sha512-0rY2m6HS5t27n/Vp5cTDsKTlNnimCqsbh/fmT2LgE+aaU42EMfXo8+bNX91W9I7DDmxfuACXMmrd7d79JxkqWA==",
+      "dependencies": {
+        "vue-demi": ">=0.14.10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      }
+    },
+    "node_modules/@vueuse/core/node_modules/vue-demi": {
+      "version": "0.14.10",
+      "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.10.tgz",
+      "integrity": "sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==",
+      "hasInstallScript": true,
+      "bin": {
+        "vue-demi-fix": "bin/vue-demi-fix.js",
+        "vue-demi-switch": "bin/vue-demi-switch.js"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      },
+      "peerDependencies": {
+        "@vue/composition-api": "^1.0.0-rc.1",
+        "vue": "^3.0.0-0 || ^2.6.0"
+      },
+      "peerDependenciesMeta": {
+        "@vue/composition-api": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@vueuse/metadata": {
+      "version": "11.0.3",
+      "resolved": "https://registry.npmjs.org/@vueuse/metadata/-/metadata-11.0.3.tgz",
+      "integrity": "sha512-+FtbO4SD5WpsOcQTcC0hAhNlOid6QNLzqedtquTtQ+CRNBoAt9GuV07c6KNHK1wCmlq8DFPwgiLF2rXwgSHX5Q==",
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      }
+    },
+    "node_modules/@vueuse/shared": {
+      "version": "10.11.1",
+      "resolved": "https://registry.npmjs.org/@vueuse/shared/-/shared-10.11.1.tgz",
+      "integrity": "sha512-LHpC8711VFZlDaYUXEBbFBCQ7GS3dVU9mjOhhMhXP6txTV4EhYQg/KGnQuvt/sPAtoUKq7VVUnL6mVtFoL42sA==",
+      "dependencies": {
+        "vue-demi": ">=0.14.8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      }
+    },
+    "node_modules/@vueuse/shared/node_modules/vue-demi": {
+      "version": "0.14.10",
+      "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.10.tgz",
+      "integrity": "sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==",
+      "hasInstallScript": true,
+      "bin": {
+        "vue-demi-fix": "bin/vue-demi-fix.js",
+        "vue-demi-switch": "bin/vue-demi-switch.js"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      },
+      "peerDependencies": {
+        "@vue/composition-api": "^1.0.0-rc.1",
+        "vue": "^3.0.0-0 || ^2.6.0"
+      },
+      "peerDependenciesMeta": {
+        "@vue/composition-api": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/@xmldom/xmldom": {
       "version": "0.8.10",
       "resolved": "https://registry.npmjs.org/@xmldom/xmldom/-/xmldom-0.8.10.tgz",
@@ -1712,7 +2312,6 @@
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
       "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
-      "dev": true,
       "engines": {
         "node": ">=8"
       }
@@ -1721,7 +2320,6 @@
       "version": "4.3.0",
       "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
       "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
-      "dev": true,
       "dependencies": {
         "color-convert": "^2.0.1"
       },
@@ -1735,8 +2333,7 @@
     "node_modules/any-promise": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/any-promise/-/any-promise-1.3.0.tgz",
-      "integrity": "sha512-7UvmKalWRt1wgjL1RrGxoSJW/0QZFIegpeGvZG9kjp8vrRu55XTHbwnqq2GpXm9uLbcuhxm3IqX9OB4MZR1b2A==",
-      "dev": true
+      "integrity": "sha512-7UvmKalWRt1wgjL1RrGxoSJW/0QZFIegpeGvZG9kjp8vrRu55XTHbwnqq2GpXm9uLbcuhxm3IqX9OB4MZR1b2A=="
     },
     "node_modules/anymatch": {
       "version": "3.1.3",
@@ -1917,8 +2514,7 @@
     "node_modules/arg": {
       "version": "5.0.2",
       "resolved": "https://registry.npmjs.org/arg/-/arg-5.0.2.tgz",
-      "integrity": "sha512-PYjyFOLKQ9y57JvQ6QLo8dAgNqswh8M1RMJYdQduT6xbWSgK36P/Z/v+p888pM69jMMfS8Xd8F6I1kQ/I9HUGg==",
-      "dev": true
+      "integrity": "sha512-PYjyFOLKQ9y57JvQ6QLo8dAgNqswh8M1RMJYdQduT6xbWSgK36P/Z/v+p888pM69jMMfS8Xd8F6I1kQ/I9HUGg=="
     },
     "node_modules/argparse": {
       "version": "2.0.1",
@@ -1926,6 +2522,17 @@
       "integrity": "sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==",
       "dev": true
     },
+    "node_modules/aria-hidden": {
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/aria-hidden/-/aria-hidden-1.2.4.tgz",
+      "integrity": "sha512-y+CcFFwelSXpLZk/7fMB2mUbGtX9lKycf1MWJ7CaTIERyitVlyQx6C+sxcROU2BAJ24OiZyK+8wj2i8AlBoS3A==",
+      "dependencies": {
+        "tslib": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
     "node_modules/assert-plus": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
@@ -1977,9 +2584,10 @@
       }
     },
     "node_modules/autoprefixer": {
-      "version": "10.4.19",
-      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.19.tgz",
-      "integrity": "sha512-BaENR2+zBZ8xXhM4pUaKUxlVdxZ0EZhjvbopwnXmxRUfqDmwSpC2lAi/QXvx7NRdPCo1WKEcEF6mV64si1z4Ew==",
+      "version": "10.4.20",
+      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.20.tgz",
+      "integrity": "sha512-XY25y5xSv/wEoqzDyXXME4AFfkZI0P23z6Fs3YgymDnKJkCGOnkL0iTxCa85UTqaSgfcqyf3UA6+c7wUvx/16g==",
+      "dev": true,
       "funding": [
         {
           "type": "opencollective",
@@ -1995,11 +2603,11 @@
         }
       ],
       "dependencies": {
-        "browserslist": "^4.23.0",
-        "caniuse-lite": "^1.0.30001599",
+        "browserslist": "^4.23.3",
+        "caniuse-lite": "^1.0.30001646",
         "fraction.js": "^4.3.7",
         "normalize-range": "^0.1.2",
-        "picocolors": "^1.0.0",
+        "picocolors": "^1.0.1",
         "postcss-value-parser": "^4.2.0"
       },
       "bin": {
@@ -2119,9 +2727,9 @@
       }
     },
     "node_modules/browserslist": {
-      "version": "4.23.2",
-      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.23.2.tgz",
-      "integrity": "sha512-qkqSyistMYdxAcw+CzbZwlBy8AGmS/eEWs+sEV5TnLRGDOL+C5M2EnH6tlZyg0YoAxGJAFKh61En9BR941GnHA==",
+      "version": "4.23.3",
+      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.23.3.tgz",
+      "integrity": "sha512-btwCFJVjI4YWDNfau8RhZ+B1Q/VLoUITrm3RlP6y1tYGWIOa+InuYiRGXUBXo8nA1qKmHMyLB/iVQg5TT4eFoA==",
       "funding": [
         {
           "type": "opencollective",
@@ -2137,9 +2745,9 @@
         }
       ],
       "dependencies": {
-        "caniuse-lite": "^1.0.30001640",
-        "electron-to-chromium": "^1.4.820",
-        "node-releases": "^2.0.14",
+        "caniuse-lite": "^1.0.30001646",
+        "electron-to-chromium": "^1.5.4",
+        "node-releases": "^2.0.18",
         "update-browserslist-db": "^1.1.0"
       },
       "bin": {
@@ -2272,6 +2880,44 @@
         "node": ">= 10.0.0"
       }
     },
+    "node_modules/c12": {
+      "version": "1.11.2",
+      "resolved": "https://registry.npmjs.org/c12/-/c12-1.11.2.tgz",
+      "integrity": "sha512-oBs8a4uvSDO9dm8b7OCFW7+dgtVrwmwnrVXYzLm43ta7ep2jCn/0MhoUFygIWtxhyy6+/MG7/agvpY0U1Iemew==",
+      "dependencies": {
+        "chokidar": "^3.6.0",
+        "confbox": "^0.1.7",
+        "defu": "^6.1.4",
+        "dotenv": "^16.4.5",
+        "giget": "^1.2.3",
+        "jiti": "^1.21.6",
+        "mlly": "^1.7.1",
+        "ohash": "^1.1.3",
+        "pathe": "^1.1.2",
+        "perfect-debounce": "^1.0.0",
+        "pkg-types": "^1.2.0",
+        "rc9": "^2.1.2"
+      },
+      "peerDependencies": {
+        "magicast": "^0.3.4"
+      },
+      "peerDependenciesMeta": {
+        "magicast": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/c12/node_modules/dotenv": {
+      "version": "16.4.5",
+      "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-16.4.5.tgz",
+      "integrity": "sha512-ZmdL2rui+eB2YwhsWzjInR8LldtZHGDoQ1ugH85ppHKwpUHL7j7rN0Ti9NCnGiQbhaZ11FpR+7ao1dNsmduNUg==",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://dotenvx.com"
+      }
+    },
     "node_modules/cacheable-lookup": {
       "version": "5.0.4",
       "resolved": "https://registry.npmjs.org/cacheable-lookup/-/cacheable-lookup-5.0.4.tgz",
@@ -2318,15 +2964,14 @@
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/camelcase-css/-/camelcase-css-2.0.1.tgz",
       "integrity": "sha512-QOSvevhslijgYwRx6Rv7zKdMF8lbRmx+uQGx2+vDc+KI/eBnsy9kit5aj23AgGu3pa4t9AgwbnXWqS+iOY+2aA==",
-      "dev": true,
       "engines": {
         "node": ">= 6"
       }
     },
     "node_modules/caniuse-lite": {
-      "version": "1.0.30001643",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001643.tgz",
-      "integrity": "sha512-ERgWGNleEilSrHM6iUz/zJNSQTP8Mr21wDWpdgvRwcTXGAq6jMtOUPP4dqFPTdKqZ2wKTdtB+uucZ3MRpAUSmg==",
+      "version": "1.0.30001651",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001651.tgz",
+      "integrity": "sha512-9Cf+Xv1jJNe1xPZLGuUXLNkE1BoDkqRqYyFJ9TDYSqhduqA4hu4oR9HluGoWYQC/aj8WHjsGVV+bwkh0+tegRg==",
       "funding": [
         {
           "type": "opencollective",
@@ -2396,7 +3041,6 @@
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/chownr/-/chownr-2.0.0.tgz",
       "integrity": "sha512-bIomtDF5KGpdogkLd9VspvFzk9KfpyyGlS8YFVZl7TGPBHL5snIOnxeshwVgPteQ9b4Eydl+pVbIyE1DcvCWgQ==",
-      "dev": true,
       "engines": {
         "node": ">=10"
       }
@@ -2422,6 +3066,33 @@
         "node": ">=8"
       }
     },
+    "node_modules/citty": {
+      "version": "0.1.6",
+      "resolved": "https://registry.npmjs.org/citty/-/citty-0.1.6.tgz",
+      "integrity": "sha512-tskPPKEs8D2KPafUypv2gxwJP8h/OaJmC82QQGGDQcHvXX43xF2VDACcJVmZ0EuSxkpO9Kc4MlrA3q0+FG58AQ==",
+      "dependencies": {
+        "consola": "^3.2.3"
+      }
+    },
+    "node_modules/class-variance-authority": {
+      "version": "0.7.0",
+      "resolved": "https://registry.npmjs.org/class-variance-authority/-/class-variance-authority-0.7.0.tgz",
+      "integrity": "sha512-jFI8IQw4hczaL4ALINxqLEXQbWcNjoSkloa4IaufXCJr6QawJyw7tuRysRsrE8w2p/4gGaxKIt/hX3qz/IbD1A==",
+      "dependencies": {
+        "clsx": "2.0.0"
+      },
+      "funding": {
+        "url": "https://joebell.co.uk"
+      }
+    },
+    "node_modules/class-variance-authority/node_modules/clsx": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/clsx/-/clsx-2.0.0.tgz",
+      "integrity": "sha512-rQ1+kcj+ttHG0MKVGBUXwayCCF1oh39BF5COIpRzuCEv8Mwjv0XucrI2ExNTOn9IlLifGClWQcU9BrZORvtw6Q==",
+      "engines": {
+        "node": ">=6"
+      }
+    },
     "node_modules/cli-truncate": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/cli-truncate/-/cli-truncate-2.1.0.tgz",
@@ -2465,11 +3136,18 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/clsx": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/clsx/-/clsx-2.1.1.tgz",
+      "integrity": "sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==",
+      "engines": {
+        "node": ">=6"
+      }
+    },
     "node_modules/color-convert": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
       "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
-      "dev": true,
       "dependencies": {
         "color-name": "~1.1.4"
       },
@@ -2480,8 +3158,7 @@
     "node_modules/color-name": {
       "version": "1.1.4",
       "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
-      "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
-      "dev": true
+      "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA=="
     },
     "node_modules/combined-stream": {
       "version": "1.0.8",
@@ -2513,6 +3190,11 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/compatx": {
+      "version": "0.1.8",
+      "resolved": "https://registry.npmjs.org/compatx/-/compatx-0.1.8.tgz",
+      "integrity": "sha512-jcbsEAR81Bt5s1qOFymBufmCbXCXbk0Ql+K5ouj6gCyx2yHlu6AgmGIi9HxfKixpUDO5bCFJUHQ5uM6ecbTebw=="
+    },
     "node_modules/compress-commons": {
       "version": "4.1.2",
       "resolved": "https://registry.npmjs.org/compress-commons/-/compress-commons-4.1.2.tgz",
@@ -2603,11 +3285,15 @@
       "version": "3.2.3",
       "resolved": "https://registry.npmjs.org/consola/-/consola-3.2.3.tgz",
       "integrity": "sha512-I5qxpzLv+sJhTVEoLYNcTW+bThDCPsit0vLNKShZx6rLtpilNpmmeTPaeqJb9ZE9dV3DGaeby6Vuhrw38WjeyQ==",
-      "dev": true,
       "engines": {
         "node": "^14.18.0 || >=16.10.0"
       }
     },
+    "node_modules/convert-source-map": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-2.0.0.tgz",
+      "integrity": "sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg=="
+    },
     "node_modules/cookie": {
       "version": "0.4.2",
       "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.4.2.tgz",
@@ -2692,11 +3378,27 @@
         "node": ">= 10"
       }
     },
+    "node_modules/cross-env": {
+      "version": "7.0.3",
+      "resolved": "https://registry.npmjs.org/cross-env/-/cross-env-7.0.3.tgz",
+      "integrity": "sha512-+/HKd6EgcQCJGh2PSjZuUitQBQynKor4wrFbRg4DtAgS1aWO+gU52xpH7M9ScGgXSYmAVS9bIJ8EzuaGw0oNAw==",
+      "dependencies": {
+        "cross-spawn": "^7.0.1"
+      },
+      "bin": {
+        "cross-env": "src/bin/cross-env.js",
+        "cross-env-shell": "src/bin/cross-env-shell.js"
+      },
+      "engines": {
+        "node": ">=10.14",
+        "npm": ">=6",
+        "yarn": ">=1"
+      }
+    },
     "node_modules/cross-spawn": {
       "version": "7.0.3",
       "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.3.tgz",
       "integrity": "sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==",
-      "dev": true,
       "dependencies": {
         "path-key": "^3.1.0",
         "shebang-command": "^2.0.0",
@@ -2724,7 +3426,6 @@
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz",
       "integrity": "sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==",
-      "dev": true,
       "bin": {
         "cssesc": "bin/cssesc"
       },
@@ -2747,7 +3448,6 @@
       "version": "4.3.5",
       "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.5.tgz",
       "integrity": "sha512-pt0bNEmneDIvdL1Xsd9oDQ/wrQRkXDT4AUWlNZNPKvW5x/jyO9VFXkJUP07vQ2upmw5PlaITaPKc31jK13V+jg==",
-      "dev": true,
       "dependencies": {
         "ms": "2.1.2"
       },
@@ -2787,6 +3487,11 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/deep-pick-omit": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/deep-pick-omit/-/deep-pick-omit-1.2.0.tgz",
+      "integrity": "sha512-2CGvfTM2c+IP/MhdRZMpaHhTc6zIlgz3tQXJ/VGAkc7mjMrjqSU28qiI63yEcy+fcYfd/K+NNJcGRzap4M4bqw=="
+    },
     "node_modules/defer-to-connect": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/defer-to-connect/-/defer-to-connect-2.0.1.tgz",
@@ -2835,8 +3540,7 @@
     "node_modules/defu": {
       "version": "6.1.4",
       "resolved": "https://registry.npmjs.org/defu/-/defu-6.1.4.tgz",
-      "integrity": "sha512-mEQCMmwJu317oSz8CwdIOdwf3xMif1ttiM8LTufzc3g6kR+9Pe236twL8j3IYT1F7GfRgGcW6MWxzZjLIkuHIg==",
-      "dev": true
+      "integrity": "sha512-mEQCMmwJu317oSz8CwdIOdwf3xMif1ttiM8LTufzc3g6kR+9Pe236twL8j3IYT1F7GfRgGcW6MWxzZjLIkuHIg=="
     },
     "node_modules/delayed-stream": {
       "version": "1.0.0",
@@ -2850,8 +3554,7 @@
     "node_modules/destr": {
       "version": "2.0.3",
       "resolved": "https://registry.npmjs.org/destr/-/destr-2.0.3.tgz",
-      "integrity": "sha512-2N3BOUU4gYMpTP24s5rF5iP7BDr7uNTCs4ozw3kf/eKfvWSIu93GEBi5m427YoyJoeOzQ5smuu4nNAPGb8idSQ==",
-      "dev": true
+      "integrity": "sha512-2N3BOUU4gYMpTP24s5rF5iP7BDr7uNTCs4ozw3kf/eKfvWSIu93GEBi5m427YoyJoeOzQ5smuu4nNAPGb8idSQ=="
     },
     "node_modules/detect-node": {
       "version": "2.1.0",
@@ -2863,8 +3566,7 @@
     "node_modules/didyoumean": {
       "version": "1.2.2",
       "resolved": "https://registry.npmjs.org/didyoumean/-/didyoumean-1.2.2.tgz",
-      "integrity": "sha512-gxtyfqMg7GKyhQmb056K7M3xszy/myH8w+B4RT+QXBQsvAOdc3XymqDDPHx1BgPgsdAA5SIifona89YtRATDzw==",
-      "dev": true
+      "integrity": "sha512-gxtyfqMg7GKyhQmb056K7M3xszy/myH8w+B4RT+QXBQsvAOdc3XymqDDPHx1BgPgsdAA5SIifona89YtRATDzw=="
     },
     "node_modules/dir-compare": {
       "version": "3.3.0",
@@ -2901,8 +3603,7 @@
     "node_modules/dlv": {
       "version": "1.1.3",
       "resolved": "https://registry.npmjs.org/dlv/-/dlv-1.1.3.tgz",
-      "integrity": "sha512-+HlytyjlPKnIG8XuRG8WvmBP8xs8P71y+SKKS6ZXWoEgLuePxtDoUEiH7WkdePWrQ5JBpE6aoVqfZfJUQkjXwA==",
-      "dev": true
+      "integrity": "sha512-+HlytyjlPKnIG8XuRG8WvmBP8xs8P71y+SKKS6ZXWoEgLuePxtDoUEiH7WkdePWrQ5JBpE6aoVqfZfJUQkjXwA=="
     },
     "node_modules/dmg-builder": {
       "version": "24.13.3",
@@ -3000,8 +3701,7 @@
     "node_modules/eastasianwidth": {
       "version": "0.2.0",
       "resolved": "https://registry.npmjs.org/eastasianwidth/-/eastasianwidth-0.2.0.tgz",
-      "integrity": "sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA==",
-      "dev": true
+      "integrity": "sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA=="
     },
     "node_modules/ejs": {
       "version": "3.1.10",
@@ -3195,15 +3895,14 @@
       }
     },
     "node_modules/electron-to-chromium": {
-      "version": "1.5.1",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.1.tgz",
-      "integrity": "sha512-FKbOCOQ5QRB3VlIbl1LZQefWIYwszlBloaXcY2rbfpu9ioJnNh3TK03YtIDKDo3WKBi8u+YV4+Fn2CkEozgf4w=="
+      "version": "1.5.11",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.11.tgz",
+      "integrity": "sha512-R1CccCDYqndR25CaXFd6hp/u9RaaMcftMkphmvuepXr5b1vfLkRml6aWVeBhXJ7rbevHkKEMJtz8XqPf7ffmew=="
     },
     "node_modules/emoji-regex": {
       "version": "8.0.0",
       "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
-      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
-      "dev": true
+      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A=="
     },
     "node_modules/end-of-stream": {
       "version": "1.4.4",
@@ -3381,7 +4080,6 @@
       "version": "8.0.1",
       "resolved": "https://registry.npmjs.org/execa/-/execa-8.0.1.tgz",
       "integrity": "sha512-VyhnebXciFV2DESc+p6B+y0LjSm0krU4OgJN44qFAhBY0TJ+1V61tYD2+wHusZ6F9n5K+vl8k0sTy7PEfV4qpg==",
-      "dev": true,
       "dependencies": {
         "cross-spawn": "^7.0.3",
         "get-stream": "^8.0.1",
@@ -3448,8 +4146,7 @@
     "node_modules/fast-deep-equal": {
       "version": "3.1.3",
       "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
-      "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==",
-      "dev": true
+      "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q=="
     },
     "node_modules/fast-glob": {
       "version": "3.3.2",
@@ -3524,7 +4221,6 @@
       "version": "3.2.1",
       "resolved": "https://registry.npmjs.org/foreground-child/-/foreground-child-3.2.1.tgz",
       "integrity": "sha512-PXUUyLqrR2XCWICfv6ukppP96sdFwWbNEnfEMt7jNsISjMsvaLNinAHNDYyvkyU+SZG2BTSbT5NjG+vZslfGTA==",
-      "dev": true,
       "dependencies": {
         "cross-spawn": "^7.0.0",
         "signal-exit": "^4.0.1"
@@ -3554,6 +4250,7 @@
       "version": "4.3.7",
       "resolved": "https://registry.npmjs.org/fraction.js/-/fraction.js-4.3.7.tgz",
       "integrity": "sha512-ZsDfxO51wGAXREY55a7la9LScWpwv9RxIrYABrlvOFBlH/ShPnrtsXeuUIfXKKOVicNxQ+o8JTbJvjS4M89yew==",
+      "dev": true,
       "engines": {
         "node": "*"
       },
@@ -3586,7 +4283,6 @@
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/fs-minipass/-/fs-minipass-2.1.0.tgz",
       "integrity": "sha512-V/JgOLFCS+R6Vcq0slCuaeWEdNC3ouDlJMNIsacH2VtALiu9mV4LPrHc5cDl8k5aw6J8jwgWWpiTo5RYhmIzvg==",
-      "dev": true,
       "dependencies": {
         "minipass": "^3.0.0"
       },
@@ -3598,7 +4294,6 @@
       "version": "3.3.6",
       "resolved": "https://registry.npmjs.org/minipass/-/minipass-3.3.6.tgz",
       "integrity": "sha512-DxiNidxSEK+tHG6zOIklvNOwm3hvCrbUrdtzY74U6HKTJxvIDfOUL5W5P2Ghd3DTkhhKPYGqeNUIh5qcM4YBfw==",
-      "dev": true,
       "dependencies": {
         "yallist": "^4.0.0"
       },
@@ -3629,11 +4324,18 @@
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz",
       "integrity": "sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==",
-      "dev": true,
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/gensync": {
+      "version": "1.0.0-beta.2",
+      "resolved": "https://registry.npmjs.org/gensync/-/gensync-1.0.0-beta.2.tgz",
+      "integrity": "sha512-3hN7NaskYvMDLQY55gnW3NQ+mesEAepTqlg+VEbj7zzqEMBVNhzcGYYeqFo/TlYz6eQiFcp1HcsCZO+nGgS8zg==",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
     "node_modules/get-caller-file": {
       "version": "2.0.5",
       "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-2.0.5.tgz",
@@ -3663,11 +4365,21 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/get-port": {
+      "version": "7.1.0",
+      "resolved": "https://registry.npmjs.org/get-port/-/get-port-7.1.0.tgz",
+      "integrity": "sha512-QB9NKEeDg3xxVwCCwJQ9+xycaz6pBB6iQ76wiWMl1927n0Kir6alPiP+yuiICLLU4jpMe08dXfpebuQppFA2zw==",
+      "engines": {
+        "node": ">=16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/get-stream": {
       "version": "8.0.1",
       "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-8.0.1.tgz",
       "integrity": "sha512-VaUJspBffn/LMCJVoMvSAdmscJyS1auj5Zulnn5UoYcY531UWmdwhRWkcGKnGU93m5HSXP9LP2usOryrBtQowA==",
-      "dev": true,
       "engines": {
         "node": ">=16"
       },
@@ -3675,6 +4387,24 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/giget": {
+      "version": "1.2.3",
+      "resolved": "https://registry.npmjs.org/giget/-/giget-1.2.3.tgz",
+      "integrity": "sha512-8EHPljDvs7qKykr6uw8b+lqLiUc/vUg+KVTI0uND4s63TdsZM2Xus3mflvF0DDG9SiM4RlCkFGL+7aAjRmV7KA==",
+      "dependencies": {
+        "citty": "^0.1.6",
+        "consola": "^3.2.3",
+        "defu": "^6.1.4",
+        "node-fetch-native": "^1.6.3",
+        "nypm": "^0.3.8",
+        "ohash": "^1.1.3",
+        "pathe": "^1.1.2",
+        "tar": "^6.2.0"
+      },
+      "bin": {
+        "giget": "dist/cli.mjs"
+      }
+    },
     "node_modules/glob": {
       "version": "7.2.3",
       "resolved": "https://registry.npmjs.org/glob/-/glob-7.2.3.tgz",
@@ -3700,7 +4430,6 @@
       "version": "6.0.2",
       "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-6.0.2.tgz",
       "integrity": "sha512-XxwI8EOhVQgWp6iDL+3b0r86f4d6AX6zSU55HfB4ydCEuXLXc5FcYeOu+nnGftS4TEju/11rt4KJPTMgbfmv4A==",
-      "dev": true,
       "dependencies": {
         "is-glob": "^4.0.3"
       },
@@ -3758,7 +4487,15 @@
         "semver": "bin/semver.js"
       },
       "engines": {
-        "node": ">=10"
+        "node": ">=10"
+      }
+    },
+    "node_modules/globals": {
+      "version": "11.12.0",
+      "resolved": "https://registry.npmjs.org/globals/-/globals-11.12.0.tgz",
+      "integrity": "sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA==",
+      "engines": {
+        "node": ">=4"
       }
     },
     "node_modules/globalthis": {
@@ -3778,6 +4515,25 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/globby": {
+      "version": "14.0.2",
+      "resolved": "https://registry.npmjs.org/globby/-/globby-14.0.2.tgz",
+      "integrity": "sha512-s3Fq41ZVh7vbbe2PN3nrW7yC7U7MFVc5c98/iTl9c2GawNMKx/J648KQRW6WKkuU8GIbbh2IXfIRQjOZnXcTnw==",
+      "dependencies": {
+        "@sindresorhus/merge-streams": "^2.1.0",
+        "fast-glob": "^3.3.2",
+        "ignore": "^5.2.4",
+        "path-type": "^5.0.0",
+        "slash": "^5.1.0",
+        "unicorn-magic": "^0.1.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/gopd": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/gopd/-/gopd-1.0.1.tgz",
@@ -3888,11 +4644,15 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/hash-sum": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/hash-sum/-/hash-sum-2.0.0.tgz",
+      "integrity": "sha512-WdZTbAByD+pHfl/g9QSsBIIwy8IT+EsPiKDs0KNX+zSHhdDLFKdZu0BQHljvO+0QI/BasbMSUa8wYNCZTvhslg=="
+    },
     "node_modules/hasown": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.2.tgz",
       "integrity": "sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==",
-      "dev": true,
       "dependencies": {
         "function-bind": "^1.1.2"
       },
@@ -3920,8 +4680,7 @@
     "node_modules/hookable": {
       "version": "5.5.3",
       "resolved": "https://registry.npmjs.org/hookable/-/hookable-5.5.3.tgz",
-      "integrity": "sha512-Yc+BQe8SvoXH1643Qez1zqLRmbA5rCL+sSmk6TVos0LWVfNIB7PGncdlId77WzLGSIB5KaWgTaNTs2lNVEI6VQ==",
-      "dev": true
+      "integrity": "sha512-Yc+BQe8SvoXH1643Qez1zqLRmbA5rCL+sSmk6TVos0LWVfNIB7PGncdlId77WzLGSIB5KaWgTaNTs2lNVEI6VQ=="
     },
     "node_modules/hosted-git-info": {
       "version": "4.1.0",
@@ -3985,7 +4744,6 @@
       "version": "5.0.0",
       "resolved": "https://registry.npmjs.org/human-signals/-/human-signals-5.0.0.tgz",
       "integrity": "sha512-AXcZb6vzzrFAUE61HnN4mpLqd/cSIwNQjtNWR0euPm6y0iqx3G4gOXaIDdtdDwZmhwe82LA6+zinmW4UBWVePQ==",
-      "dev": true,
       "engines": {
         "node": ">=16.17.0"
       }
@@ -4039,6 +4797,14 @@
         }
       ]
     },
+    "node_modules/ignore": {
+      "version": "5.3.2",
+      "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.2.tgz",
+      "integrity": "sha512-hsBTNUqQTDwkWtcdYI2i06Y/nUBEsNEDJKjWdigLvegy8kDuJAS8uRlpkkcQpyEXL0Z/pjDy5HBmMjRCJ2gq+g==",
+      "engines": {
+        "node": ">= 4"
+      }
+    },
     "node_modules/inflight": {
       "version": "1.0.6",
       "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
@@ -4098,7 +4864,6 @@
       "version": "2.15.0",
       "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.15.0.tgz",
       "integrity": "sha512-Dd+Lb2/zvk9SKy1TGCt1wFJFo/MWBPMX5x7KcvLajWTGuomczdQX61PvY5yK6SVACwpoexWo81IfFyoKY2QnTA==",
-      "dev": true,
       "dependencies": {
         "hasown": "^2.0.2"
       },
@@ -4121,7 +4886,6 @@
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
       "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
-      "dev": true,
       "engines": {
         "node": ">=8"
       }
@@ -4149,7 +4913,6 @@
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-3.0.0.tgz",
       "integrity": "sha512-LnQR4bZ9IADDRSkvpqMGvt/tEJWclzklNgSw48V5EAaAeDd6qGvN8ei6k5p0tvxSR171VmGyHuTiAOfxAbr8kA==",
-      "dev": true,
       "engines": {
         "node": "^12.20.0 || ^14.13.1 || >=16.0.0"
       },
@@ -4190,14 +4953,12 @@
     "node_modules/isexe": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
-      "integrity": "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==",
-      "dev": true
+      "integrity": "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw=="
     },
     "node_modules/jackspeak": {
       "version": "3.4.3",
       "resolved": "https://registry.npmjs.org/jackspeak/-/jackspeak-3.4.3.tgz",
       "integrity": "sha512-OGlZQpz2yfahA/Rd1Y8Cd9SIEsqvXkLVoSw/cgwhnhFMDbsQFeZYoJJ7bIZBS9BcamUW96asq/npPWugM+RQBw==",
-      "dev": true,
       "dependencies": {
         "@isaacs/cliui": "^8.0.2"
       },
@@ -4252,7 +5013,6 @@
       "version": "1.21.6",
       "resolved": "https://registry.npmjs.org/jiti/-/jiti-1.21.6.tgz",
       "integrity": "sha512-2yTgeWTWzMWkHu6Jp9NKgePDaYHbntiwvYuuJLbbN9vl7DC9DvXKOB2BC3ZZ92D3cvV/aflH0osDfwpHepQ53w==",
-      "dev": true,
       "bin": {
         "jiti": "bin/jiti.js"
       }
@@ -4274,6 +5034,17 @@
         "js-yaml": "bin/js-yaml.js"
       }
     },
+    "node_modules/jsesc": {
+      "version": "2.5.2",
+      "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-2.5.2.tgz",
+      "integrity": "sha512-OYu7XEzjkCQ3C5Ps3QIZsQfNpqoJyZZA99wd9aWd05NCtC5pWOkShK2mkL6HXQR6/Cy2lbNdPlZBpuQHXE63gA==",
+      "bin": {
+        "jsesc": "bin/jsesc"
+      },
+      "engines": {
+        "node": ">=4"
+      }
+    },
     "node_modules/json-buffer": {
       "version": "3.0.1",
       "resolved": "https://registry.npmjs.org/json-buffer/-/json-buffer-3.0.1.tgz",
@@ -4297,7 +5068,6 @@
       "version": "2.2.3",
       "resolved": "https://registry.npmjs.org/json5/-/json5-2.2.3.tgz",
       "integrity": "sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg==",
-      "dev": true,
       "bin": {
         "json5": "lib/cli.js"
       },
@@ -4323,6 +5093,19 @@
         "json-buffer": "3.0.1"
       }
     },
+    "node_modules/klona": {
+      "version": "2.0.6",
+      "resolved": "https://registry.npmjs.org/klona/-/klona-2.0.6.tgz",
+      "integrity": "sha512-dhG34DXATL5hSxJbIexCft8FChFXtmskoZYnoPWjXQuebWYCNkVeV3KkGegCK9CP1oswI/vQibS2GY7Em/sJJA==",
+      "engines": {
+        "node": ">= 8"
+      }
+    },
+    "node_modules/knitwork": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/knitwork/-/knitwork-1.1.0.tgz",
+      "integrity": "sha512-oHnmiBUVHz1V+URE77PNot2lv3QiYU2zQf1JjOVkMt3YDKGbu8NAFr+c4mcNOhdsGrB/VpVbRwPwhiXrPhxQbw=="
+    },
     "node_modules/koffi": {
       "version": "2.9.0",
       "resolved": "https://registry.npmjs.org/koffi/-/koffi-2.9.0.tgz",
@@ -4381,7 +5164,6 @@
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/lilconfig/-/lilconfig-2.1.0.tgz",
       "integrity": "sha512-utWOt/GHzuUxnLKxB6dk81RoOeoNeHgbrXiuGk4yyF5qlRz+iIVWu56E2fqGHFrXz0QNUhLB/8nKqvRH66JKGQ==",
-      "dev": true,
       "engines": {
         "node": ">=10"
       }
@@ -4389,8 +5171,7 @@
     "node_modules/lines-and-columns": {
       "version": "1.2.4",
       "resolved": "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-1.2.4.tgz",
-      "integrity": "sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==",
-      "dev": true
+      "integrity": "sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg=="
     },
     "node_modules/local-pkg": {
       "version": "0.5.0",
@@ -4465,11 +5246,11 @@
       }
     },
     "node_modules/magic-string": {
-      "version": "0.30.10",
-      "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.10.tgz",
-      "integrity": "sha512-iIRwTIf0QKV3UAnYK4PU8uiEc4SRh5jX0mwpIwETPpHdhVM4f53RSwS/vXvN1JhGX+Cs7B8qIq3d6AH49O5fAQ==",
+      "version": "0.30.11",
+      "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.11.tgz",
+      "integrity": "sha512-+Wri9p0QHMy+545hKww7YAu5NyzF8iomPL/RQazugQ9+Ez4Ic3mERMd8ZTX5rfK944j+560ZJi8iAwgak1Ac7A==",
       "dependencies": {
-        "@jridgewell/sourcemap-codec": "^1.4.15"
+        "@jridgewell/sourcemap-codec": "^1.5.0"
       }
     },
     "node_modules/marked": {
@@ -4507,8 +5288,7 @@
     "node_modules/merge-stream": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/merge-stream/-/merge-stream-2.0.0.tgz",
-      "integrity": "sha512-abv/qOcuPfk3URPfDzmZU1LKmuw8kT+0nIHvKrKgFrwifol/doWcdA4ZqsWQ8ENrFKkd67Mfpo/LovbIUsbt3w==",
-      "dev": true
+      "integrity": "sha512-abv/qOcuPfk3URPfDzmZU1LKmuw8kT+0nIHvKrKgFrwifol/doWcdA4ZqsWQ8ENrFKkd67Mfpo/LovbIUsbt3w=="
     },
     "node_modules/merge2": {
       "version": "1.4.1",
@@ -4567,7 +5347,6 @@
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/mimic-fn/-/mimic-fn-4.0.0.tgz",
       "integrity": "sha512-vqiC06CuhBTUdZH+RYl8sFrL096vA45Ok5ISO6sE/Mr1jRbGH4Csnhi8f3wKVl7x8mO4Au7Ir9D3Oyv1VYMFJw==",
-      "dev": true,
       "engines": {
         "node": ">=12"
       },
@@ -4609,7 +5388,6 @@
       "version": "5.0.0",
       "resolved": "https://registry.npmjs.org/minipass/-/minipass-5.0.0.tgz",
       "integrity": "sha512-3FnjYuehv9k6ovOEbyOswadCDPX1piCfhV8ncmYtHOjuPwylVWsghTLo7rabjC3Rx5xD4HDx8Wm1xnMF7S5qFQ==",
-      "dev": true,
       "engines": {
         "node": ">=8"
       }
@@ -4618,7 +5396,6 @@
       "version": "2.1.2",
       "resolved": "https://registry.npmjs.org/minizlib/-/minizlib-2.1.2.tgz",
       "integrity": "sha512-bAxsR8BVfj60DWXHE3u30oHzfl4G7khkSuPW+qvpd7jFRHm7dLxOjUk1EHACJ/hxLY8phGJ0YhYHZo7jil7Qdg==",
-      "dev": true,
       "dependencies": {
         "minipass": "^3.0.0",
         "yallist": "^4.0.0"
@@ -4631,7 +5408,6 @@
       "version": "3.3.6",
       "resolved": "https://registry.npmjs.org/minipass/-/minipass-3.3.6.tgz",
       "integrity": "sha512-DxiNidxSEK+tHG6zOIklvNOwm3hvCrbUrdtzY74U6HKTJxvIDfOUL5W5P2Ghd3DTkhhKPYGqeNUIh5qcM4YBfw==",
-      "dev": true,
       "dependencies": {
         "yallist": "^4.0.0"
       },
@@ -4649,7 +5425,6 @@
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-1.0.4.tgz",
       "integrity": "sha512-vVqVZQyf3WLx2Shd0qJ9xuvqgAyKPLAiqITEtqW0oIUjzo3PePDd6fW9iFz30ef7Ysp/oiWqbhszeGWW2T6Gzw==",
-      "dev": true,
       "bin": {
         "mkdirp": "bin/cmd.js"
       },
@@ -4668,11 +5443,18 @@
         "ufo": "^1.5.3"
       }
     },
+    "node_modules/mri": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/mri/-/mri-1.2.0.tgz",
+      "integrity": "sha512-tzzskb3bG8LvYGFF/mDTpq3jpI6Q9wc3LEmBaghu+DdCssd1FakN7Bc0hVNmEyGq1bq3RgfkCb3cmQLpNPOroA==",
+      "engines": {
+        "node": ">=4"
+      }
+    },
     "node_modules/ms": {
       "version": "2.1.2",
       "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
-      "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==",
-      "dev": true
+      "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
     },
     "node_modules/muggle-string": {
       "version": "0.4.1",
@@ -4684,7 +5466,6 @@
       "version": "2.7.0",
       "resolved": "https://registry.npmjs.org/mz/-/mz-2.7.0.tgz",
       "integrity": "sha512-z81GNO7nnYMEhrGh9LeymoE4+Yr0Wn5McHIZMK5cfQCl+NDX08sCZgUc9/6MHni9IWuFLm1Z3HTCXu2z9fN62Q==",
-      "dev": true,
       "dependencies": {
         "any-promise": "^1.0.0",
         "object-assign": "^4.0.1",
@@ -4727,8 +5508,7 @@
     "node_modules/node-fetch-native": {
       "version": "1.6.4",
       "resolved": "https://registry.npmjs.org/node-fetch-native/-/node-fetch-native-1.6.4.tgz",
-      "integrity": "sha512-IhOigYzAKHd244OC0JIMIUrjzctirCmPkaIfhDeGcEETWof5zKYUW7e7MYvChGWh/4CJeXEgsRyGzuF334rOOQ==",
-      "dev": true
+      "integrity": "sha512-IhOigYzAKHd244OC0JIMIUrjzctirCmPkaIfhDeGcEETWof5zKYUW7e7MYvChGWh/4CJeXEgsRyGzuF334rOOQ=="
     },
     "node_modules/node-releases": {
       "version": "2.0.18",
@@ -4747,6 +5527,7 @@
       "version": "0.1.2",
       "resolved": "https://registry.npmjs.org/normalize-range/-/normalize-range-0.1.2.tgz",
       "integrity": "sha512-bdok/XvKII3nUpklnV6P2hxtMNrCboOjAcyBuQnWEhO665FwrSNRxU+AqpsyvO6LgGYPspN+lu5CLtw4jPRKNA==",
+      "dev": true,
       "engines": {
         "node": ">=0.10.0"
       }
@@ -4767,7 +5548,6 @@
       "version": "5.3.0",
       "resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-5.3.0.tgz",
       "integrity": "sha512-ppwTtiJZq0O/ai0z7yfudtBpWIoxM8yE6nHi1X47eFR2EWORqfbu6CnPlNsjeN683eT0qG6H/Pyf9fCcvjnnnQ==",
-      "dev": true,
       "dependencies": {
         "path-key": "^4.0.0"
       },
@@ -4782,7 +5562,6 @@
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/path-key/-/path-key-4.0.0.tgz",
       "integrity": "sha512-haREypq7xkM7ErfgIyA0z+Bj4AGKlMSdlQE2jvJo6huWD1EdkKYV+G/T4nq0YEF2vgTT8kqMFKo1uHn950r4SQ==",
-      "dev": true,
       "engines": {
         "node": ">=12"
       },
@@ -4790,11 +5569,29 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/nypm": {
+      "version": "0.3.11",
+      "resolved": "https://registry.npmjs.org/nypm/-/nypm-0.3.11.tgz",
+      "integrity": "sha512-E5GqaAYSnbb6n1qZyik2wjPDZON43FqOJO59+3OkWrnmQtjggrMOVnsyzfjxp/tS6nlYJBA4zRA5jSM2YaadMg==",
+      "dependencies": {
+        "citty": "^0.1.6",
+        "consola": "^3.2.3",
+        "execa": "^8.0.1",
+        "pathe": "^1.1.2",
+        "pkg-types": "^1.2.0",
+        "ufo": "^1.5.4"
+      },
+      "bin": {
+        "nypm": "dist/cli.mjs"
+      },
+      "engines": {
+        "node": "^14.16.0 || >=16.10.0"
+      }
+    },
     "node_modules/object-assign": {
       "version": "4.1.1",
       "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
       "integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==",
-      "dev": true,
       "engines": {
         "node": ">=0.10.0"
       }
@@ -4803,7 +5600,6 @@
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/object-hash/-/object-hash-3.0.0.tgz",
       "integrity": "sha512-RSn9F68PjH9HqtltsSnqYC1XXoWe9Bju5+213R98cNGttag9q9yAOTzdbsqvIa7aNm5WffBZFpWYr2aWrklWAw==",
-      "dev": true,
       "engines": {
         "node": ">= 6"
       }
@@ -4821,8 +5617,7 @@
     "node_modules/ohash": {
       "version": "1.1.3",
       "resolved": "https://registry.npmjs.org/ohash/-/ohash-1.1.3.tgz",
-      "integrity": "sha512-zuHHiGTYTA1sYJ/wZN+t5HKZaH23i4yI1HMwbuXm24Nid7Dv0KcuRlKoNKS9UNfAVSBlnGLcuQrnOKWOZoEGaw==",
-      "dev": true
+      "integrity": "sha512-zuHHiGTYTA1sYJ/wZN+t5HKZaH23i4yI1HMwbuXm24Nid7Dv0KcuRlKoNKS9UNfAVSBlnGLcuQrnOKWOZoEGaw=="
     },
     "node_modules/once": {
       "version": "1.4.0",
@@ -4837,7 +5632,6 @@
       "version": "6.0.0",
       "resolved": "https://registry.npmjs.org/onetime/-/onetime-6.0.0.tgz",
       "integrity": "sha512-1FlR+gjXK7X+AsAHso35MnyN5KqGwJRi/31ft6x0M194ht7S+rWAvd7PHss9xSKMzE0asv1pyIHaJYq+BbacAQ==",
-      "dev": true,
       "dependencies": {
         "mimic-fn": "^4.0.0"
       },
@@ -4860,8 +5654,7 @@
     "node_modules/package-json-from-dist": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/package-json-from-dist/-/package-json-from-dist-1.0.0.tgz",
-      "integrity": "sha512-dATvCeZN/8wQsGywez1mzHtTlP22H8OEfPrVMLNr4/eGa+ijtLn/6M5f0dY8UKNrC2O9UCU6SSoG3qRKnt7STw==",
-      "dev": true
+      "integrity": "sha512-dATvCeZN/8wQsGywez1mzHtTlP22H8OEfPrVMLNr4/eGa+ijtLn/6M5f0dY8UKNrC2O9UCU6SSoG3qRKnt7STw=="
     },
     "node_modules/path-browserify": {
       "version": "1.0.1",
@@ -4882,7 +5675,6 @@
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/path-key/-/path-key-3.1.1.tgz",
       "integrity": "sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==",
-      "dev": true,
       "engines": {
         "node": ">=8"
       }
@@ -4890,14 +5682,12 @@
     "node_modules/path-parse": {
       "version": "1.0.7",
       "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.7.tgz",
-      "integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==",
-      "dev": true
+      "integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw=="
     },
     "node_modules/path-scurry": {
       "version": "1.11.1",
       "resolved": "https://registry.npmjs.org/path-scurry/-/path-scurry-1.11.1.tgz",
       "integrity": "sha512-Xa4Nw17FS9ApQFJ9umLiJS4orGjm7ZzwUrwamcGQuHSzDyth9boKDaycYdDcZDuqYATXw4HFXgaqWTctW/v1HA==",
-      "dev": true,
       "dependencies": {
         "lru-cache": "^10.2.0",
         "minipass": "^5.0.0 || ^6.0.2 || ^7.0.0"
@@ -4912,8 +5702,18 @@
     "node_modules/path-scurry/node_modules/lru-cache": {
       "version": "10.4.3",
       "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-10.4.3.tgz",
-      "integrity": "sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ==",
-      "dev": true
+      "integrity": "sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ=="
+    },
+    "node_modules/path-type": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/path-type/-/path-type-5.0.0.tgz",
+      "integrity": "sha512-5HviZNaZcfqP95rwpv+1HDgUamezbqdSYTyzjTvwtJSnIH+3vnbmWsItli8OFEndS984VT55M3jduxZbX351gg==",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
     },
     "node_modules/pathe": {
       "version": "1.1.2",
@@ -4929,8 +5729,7 @@
     "node_modules/perfect-debounce": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/perfect-debounce/-/perfect-debounce-1.0.0.tgz",
-      "integrity": "sha512-xCy9V055GLEqoFaHoC1SoLIaLmWctgCUaBaWxDZ7/Zx4CTyX7cJQLJOok/orfjZAh9kEYpjJa4d0KcJmCbctZA==",
-      "dev": true
+      "integrity": "sha512-xCy9V055GLEqoFaHoC1SoLIaLmWctgCUaBaWxDZ7/Zx4CTyX7cJQLJOok/orfjZAh9kEYpjJa4d0KcJmCbctZA=="
     },
     "node_modules/picocolors": {
       "version": "1.0.1",
@@ -4952,7 +5751,6 @@
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
       "integrity": "sha512-udgsAY+fTnvv7kI7aaxbqwWNb0AHiB0qBO89PZKPkoTmGOgdbrHDKD+0B2X4uTfJ/FT1R09r9gTsjUjNJotuog==",
-      "dev": true,
       "engines": {
         "node": ">=0.10.0"
       }
@@ -4982,6 +5780,29 @@
         }
       }
     },
+    "node_modules/pinia-plugin-persistedstate": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/pinia-plugin-persistedstate/-/pinia-plugin-persistedstate-4.0.0.tgz",
+      "integrity": "sha512-yTly/5XMwgd4hQmZOTAdeK3Kfz89h9TMS2/d0VzVJEL9v2LanZdjhckpwnE+jelL+vsT7DnRLmSOtkzSJjO6Ng==",
+      "dependencies": {
+        "@nuxt/kit": "^3.13.0",
+        "deep-pick-omit": "^1.2.0",
+        "defu": "^6.1.4",
+        "destr": "^2.0.3"
+      },
+      "peerDependencies": {
+        "@pinia/nuxt": ">=0.5.0",
+        "pinia": ">=2.0.0"
+      },
+      "peerDependenciesMeta": {
+        "@pinia/nuxt": {
+          "optional": true
+        },
+        "pinia": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/pinia/node_modules/vue-demi": {
       "version": "0.14.10",
       "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.10.tgz",
@@ -5011,15 +5832,14 @@
       "version": "4.0.6",
       "resolved": "https://registry.npmjs.org/pirates/-/pirates-4.0.6.tgz",
       "integrity": "sha512-saLsH7WeYYPiD25LDuLRRY/i+6HaPYr6G1OUlN39otzkSTxKnubR9RTxS3/Kk50s1g2JTgFwWQDQyplC5/SHZg==",
-      "dev": true,
       "engines": {
         "node": ">= 6"
       }
     },
     "node_modules/pkg-types": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/pkg-types/-/pkg-types-1.1.3.tgz",
-      "integrity": "sha512-+JrgthZG6m3ckicaOB74TwQ+tBWsFl3qVQg7mN8ulwSOElJ7gBhKzj2VkCPnZ4NlF6kEquYU+RIYNVAvzd54UA==",
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/pkg-types/-/pkg-types-1.2.0.tgz",
+      "integrity": "sha512-+ifYuSSqOQ8CqP4MbZA5hDpb97n3E8SVWdJe+Wms9kj745lmd3b7EZJiqvmLwAlmRfjrI7Hi5z3kdBJ93lFNPA==",
       "dependencies": {
         "confbox": "^0.1.7",
         "mlly": "^1.7.1",
@@ -5041,9 +5861,9 @@
       }
     },
     "node_modules/postcss": {
-      "version": "8.4.40",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.40.tgz",
-      "integrity": "sha512-YF2kKIUzAofPMpfH6hOi2cGnv/HrUlfucspc7pDyvv7kGdqXrfj8SCl/t8owkEgKEuu8ZcRjSOxFxVLqwChZ2Q==",
+      "version": "8.4.41",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.41.tgz",
+      "integrity": "sha512-TesUflQ0WKZqAvg52PWL6kHgLKP6xB6heTOdoYM0Wt2UHyxNa4K25EZZMgKns3BH1RLVbZCREPpLY0rhnNoHVQ==",
       "funding": [
         {
           "type": "opencollective",
@@ -5071,7 +5891,6 @@
       "version": "15.1.0",
       "resolved": "https://registry.npmjs.org/postcss-import/-/postcss-import-15.1.0.tgz",
       "integrity": "sha512-hpr+J05B2FVYUAXHeK1YyI267J/dDDhMU6B6civm8hSY1jYJnBXxzKDKDswzJmtLHryrjhnDjqqp/49t8FALew==",
-      "dev": true,
       "dependencies": {
         "postcss-value-parser": "^4.0.0",
         "read-cache": "^1.0.0",
@@ -5088,7 +5907,6 @@
       "version": "4.0.1",
       "resolved": "https://registry.npmjs.org/postcss-js/-/postcss-js-4.0.1.tgz",
       "integrity": "sha512-dDLF8pEO191hJMtlHFPRa8xsizHaM82MLfNkUHdUtVEV3tgTp5oj+8qbEqYM57SLfc74KSbw//4SeJma2LRVIw==",
-      "dev": true,
       "dependencies": {
         "camelcase-css": "^2.0.1"
       },
@@ -5107,7 +5925,6 @@
       "version": "4.0.2",
       "resolved": "https://registry.npmjs.org/postcss-load-config/-/postcss-load-config-4.0.2.tgz",
       "integrity": "sha512-bSVhyJGL00wMVoPUzAVAnbEoWyqRxkjv64tUl427SKnPrENtq6hJwUojroMz2VB+Q1edmi4IfrAPpami5VVgMQ==",
-      "dev": true,
       "funding": [
         {
           "type": "opencollective",
@@ -5142,7 +5959,6 @@
       "version": "3.1.2",
       "resolved": "https://registry.npmjs.org/lilconfig/-/lilconfig-3.1.2.tgz",
       "integrity": "sha512-eop+wDAvpItUys0FWkHIKeC9ybYrTGbU41U5K7+bttZZeohvnY7M9dZ5kB21GNWiFT2q1OoPTvncPCgSOVO5ow==",
-      "dev": true,
       "engines": {
         "node": ">=14"
       },
@@ -5154,7 +5970,6 @@
       "version": "6.2.0",
       "resolved": "https://registry.npmjs.org/postcss-nested/-/postcss-nested-6.2.0.tgz",
       "integrity": "sha512-HQbt28KulC5AJzG+cZtj9kvKB93CFCdLvog1WFLf1D+xmMvPGlBstkpTEZfK5+AN9hfJocyBFCNiqyS48bpgzQ==",
-      "dev": true,
       "funding": [
         {
           "type": "opencollective",
@@ -5179,7 +5994,6 @@
       "version": "6.1.1",
       "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.1.1.tgz",
       "integrity": "sha512-b4dlw/9V8A71rLIDsSwVmak9z2DuBUB7CA1/wSdelNEzqsjoSPeADTWNO09lpH49Diy3/JIZ2bSPB1dI3LJCHg==",
-      "dev": true,
       "dependencies": {
         "cssesc": "^3.0.0",
         "util-deprecate": "^1.0.2"
@@ -5271,17 +6085,110 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/radix-vue": {
+      "version": "1.9.4",
+      "resolved": "https://registry.npmjs.org/radix-vue/-/radix-vue-1.9.4.tgz",
+      "integrity": "sha512-d950wxB+MVVU6L9h39OsNzAdk2BiGDDfhXJiHsksPAIK5pCR8W4U0RB0WLQEdjmmL9p1aXOYm4FBDq0oIo2G/w==",
+      "dependencies": {
+        "@floating-ui/dom": "^1.6.7",
+        "@floating-ui/vue": "^1.1.0",
+        "@internationalized/date": "^3.5.4",
+        "@internationalized/number": "^3.5.3",
+        "@tanstack/vue-virtual": "^3.8.1",
+        "@vueuse/core": "^10.11.0",
+        "@vueuse/shared": "^10.11.0",
+        "aria-hidden": "^1.2.4",
+        "defu": "^6.1.4",
+        "fast-deep-equal": "^3.1.3",
+        "nanoid": "^5.0.7"
+      },
+      "peerDependencies": {
+        "vue": ">= 3.2.0"
+      }
+    },
+    "node_modules/radix-vue/node_modules/@vueuse/core": {
+      "version": "10.11.1",
+      "resolved": "https://registry.npmjs.org/@vueuse/core/-/core-10.11.1.tgz",
+      "integrity": "sha512-guoy26JQktXPcz+0n3GukWIy/JDNKti9v6VEMu6kV2sYBsWuGiTU8OWdg+ADfUbHg3/3DlqySDe7JmdHrktiww==",
+      "dependencies": {
+        "@types/web-bluetooth": "^0.0.20",
+        "@vueuse/metadata": "10.11.1",
+        "@vueuse/shared": "10.11.1",
+        "vue-demi": ">=0.14.8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      }
+    },
+    "node_modules/radix-vue/node_modules/@vueuse/core/node_modules/vue-demi": {
+      "version": "0.14.10",
+      "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.10.tgz",
+      "integrity": "sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==",
+      "hasInstallScript": true,
+      "bin": {
+        "vue-demi-fix": "bin/vue-demi-fix.js",
+        "vue-demi-switch": "bin/vue-demi-switch.js"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      },
+      "peerDependencies": {
+        "@vue/composition-api": "^1.0.0-rc.1",
+        "vue": "^3.0.0-0 || ^2.6.0"
+      },
+      "peerDependenciesMeta": {
+        "@vue/composition-api": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/radix-vue/node_modules/@vueuse/metadata": {
+      "version": "10.11.1",
+      "resolved": "https://registry.npmjs.org/@vueuse/metadata/-/metadata-10.11.1.tgz",
+      "integrity": "sha512-IGa5FXd003Ug1qAZmyE8wF3sJ81xGLSqTqtQ6jaVfkeZ4i5kS2mwQF61yhVqojRnenVew5PldLyRgvdl4YYuSw==",
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      }
+    },
+    "node_modules/radix-vue/node_modules/nanoid": {
+      "version": "5.0.7",
+      "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-5.0.7.tgz",
+      "integrity": "sha512-oLxFY2gd2IqnjcYyOXD8XGCftpGtZP2AbHbOkthDkvRywH5ayNtPVy9YlOPcHckXzbLTCHpkb7FB+yuxKV13pQ==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "bin": {
+        "nanoid": "bin/nanoid.js"
+      },
+      "engines": {
+        "node": "^18 || >=20"
+      }
+    },
     "node_modules/radix3": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/radix3/-/radix3-1.1.2.tgz",
       "integrity": "sha512-b484I/7b8rDEdSDKckSSBA8knMpcdsXudlE/LNL639wFoHKwLbEkQFZHWEYwDC0wa0FKUcCY+GAF73Z7wxNVFA==",
       "dev": true
     },
+    "node_modules/rc9": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/rc9/-/rc9-2.1.2.tgz",
+      "integrity": "sha512-btXCnMmRIBINM2LDZoEmOogIZU7Qe7zn4BpomSKZ/ykbLObuBdvG+mFq11DL6fjH1DRwHhrlgtYWG96bJiC7Cg==",
+      "dependencies": {
+        "defu": "^6.1.4",
+        "destr": "^2.0.3"
+      }
+    },
     "node_modules/read-cache": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz",
       "integrity": "sha512-Owdv/Ft7IjOgm/i0xvNDZ1LrRANRfew4b2prF3OWMQLxLfu3bS8FVhCsrSCMK4lR56Y9ya+AThoTpDCTxCmpRA==",
-      "dev": true,
       "dependencies": {
         "pify": "^2.3.0"
       }
@@ -5350,7 +6257,6 @@
       "version": "1.22.8",
       "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.8.tgz",
       "integrity": "sha512-oKWePCxqpd6FlLvGV1VU0x7bkPmmCNolxzjMf4NczoDnQcIWrAF+cPtZn5i6n+RfD2d9i0tzpKnG6Yk168yIyw==",
-      "dev": true,
       "dependencies": {
         "is-core-module": "^2.13.0",
         "path-parse": "^1.0.7",
@@ -5424,9 +6330,9 @@
       }
     },
     "node_modules/rollup": {
-      "version": "4.19.0",
-      "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.19.0.tgz",
-      "integrity": "sha512-5r7EYSQIowHsK4eTZ0Y81qpZuJz+MUuYeqmmYmRMl1nwhdmbiYqt5jwzf6u7wyOzJgYqtCRMtVRKOtHANBz7rA==",
+      "version": "4.21.0",
+      "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.21.0.tgz",
+      "integrity": "sha512-vo+S/lfA2lMS7rZ2Qoubi6I5hwZwzXeUIctILZLbHI+laNtvhhOIon2S1JksA5UEDQ7l3vberd0fxK44lTYjbQ==",
       "devOptional": true,
       "dependencies": {
         "@types/estree": "1.0.5"
@@ -5439,22 +6345,22 @@
         "npm": ">=8.0.0"
       },
       "optionalDependencies": {
-        "@rollup/rollup-android-arm-eabi": "4.19.0",
-        "@rollup/rollup-android-arm64": "4.19.0",
-        "@rollup/rollup-darwin-arm64": "4.19.0",
-        "@rollup/rollup-darwin-x64": "4.19.0",
-        "@rollup/rollup-linux-arm-gnueabihf": "4.19.0",
-        "@rollup/rollup-linux-arm-musleabihf": "4.19.0",
-        "@rollup/rollup-linux-arm64-gnu": "4.19.0",
-        "@rollup/rollup-linux-arm64-musl": "4.19.0",
-        "@rollup/rollup-linux-powerpc64le-gnu": "4.19.0",
-        "@rollup/rollup-linux-riscv64-gnu": "4.19.0",
-        "@rollup/rollup-linux-s390x-gnu": "4.19.0",
-        "@rollup/rollup-linux-x64-gnu": "4.19.0",
-        "@rollup/rollup-linux-x64-musl": "4.19.0",
-        "@rollup/rollup-win32-arm64-msvc": "4.19.0",
-        "@rollup/rollup-win32-ia32-msvc": "4.19.0",
-        "@rollup/rollup-win32-x64-msvc": "4.19.0",
+        "@rollup/rollup-android-arm-eabi": "4.21.0",
+        "@rollup/rollup-android-arm64": "4.21.0",
+        "@rollup/rollup-darwin-arm64": "4.21.0",
+        "@rollup/rollup-darwin-x64": "4.21.0",
+        "@rollup/rollup-linux-arm-gnueabihf": "4.21.0",
+        "@rollup/rollup-linux-arm-musleabihf": "4.21.0",
+        "@rollup/rollup-linux-arm64-gnu": "4.21.0",
+        "@rollup/rollup-linux-arm64-musl": "4.21.0",
+        "@rollup/rollup-linux-powerpc64le-gnu": "4.21.0",
+        "@rollup/rollup-linux-riscv64-gnu": "4.21.0",
+        "@rollup/rollup-linux-s390x-gnu": "4.21.0",
+        "@rollup/rollup-linux-x64-gnu": "4.21.0",
+        "@rollup/rollup-linux-x64-musl": "4.21.0",
+        "@rollup/rollup-win32-arm64-msvc": "4.21.0",
+        "@rollup/rollup-win32-ia32-msvc": "4.21.0",
+        "@rollup/rollup-win32-x64-msvc": "4.21.0",
         "fsevents": "~2.3.2"
       }
     },
@@ -5530,7 +6436,6 @@
       "version": "6.3.1",
       "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
       "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
-      "dev": true,
       "bin": {
         "semver": "bin/semver.js"
       }
@@ -5562,7 +6467,6 @@
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz",
       "integrity": "sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA==",
-      "dev": true,
       "dependencies": {
         "shebang-regex": "^3.0.0"
       },
@@ -5574,7 +6478,6 @@
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/shebang-regex/-/shebang-regex-3.0.0.tgz",
       "integrity": "sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==",
-      "dev": true,
       "engines": {
         "node": ">=8"
       }
@@ -5583,7 +6486,6 @@
       "version": "4.1.0",
       "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-4.1.0.tgz",
       "integrity": "sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==",
-      "dev": true,
       "engines": {
         "node": ">=14"
       },
@@ -5615,6 +6517,17 @@
         "node": ">=10"
       }
     },
+    "node_modules/slash": {
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/slash/-/slash-5.1.0.tgz",
+      "integrity": "sha512-ZA6oR3T/pEyuqwMgAKT0/hAv8oAXckzbkmR0UkUosQ+Mc4RxGoJkRmwHgHufaenlyAgE1Mxgpdcrf75y6XcnDg==",
+      "engines": {
+        "node": ">=14.16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/slice-ansi": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/slice-ansi/-/slice-ansi-3.0.0.tgz",
@@ -5749,6 +6662,11 @@
         "node": ">= 6"
       }
     },
+    "node_modules/std-env": {
+      "version": "3.7.0",
+      "resolved": "https://registry.npmjs.org/std-env/-/std-env-3.7.0.tgz",
+      "integrity": "sha512-JPbdCEQLj1w5GilpiHAx3qJvFndqybBysA3qUOnznweH4QbNYUsW/ea8QzSrnh0vNsezMMw5bcVool8lM0gwzg=="
+    },
     "node_modules/string_decoder": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.3.0.tgz",
@@ -5762,7 +6680,6 @@
       "version": "4.2.3",
       "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
       "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
-      "dev": true,
       "dependencies": {
         "emoji-regex": "^8.0.0",
         "is-fullwidth-code-point": "^3.0.0",
@@ -5777,7 +6694,6 @@
       "version": "4.2.3",
       "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
       "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
-      "dev": true,
       "dependencies": {
         "emoji-regex": "^8.0.0",
         "is-fullwidth-code-point": "^3.0.0",
@@ -5791,7 +6707,6 @@
       "version": "6.0.1",
       "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
       "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
-      "dev": true,
       "dependencies": {
         "ansi-regex": "^5.0.1"
       },
@@ -5804,7 +6719,6 @@
       "version": "6.0.1",
       "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
       "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
-      "dev": true,
       "dependencies": {
         "ansi-regex": "^5.0.1"
       },
@@ -5816,7 +6730,6 @@
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/strip-final-newline/-/strip-final-newline-3.0.0.tgz",
       "integrity": "sha512-dOESqjYr96iWYylGObzd39EuNTa5VJxyvVAEm5Jnh7KGo75V43Hk1odPQkNDyXNmUR6k+gEiDVXnjB8HJ3crXw==",
-      "dev": true,
       "engines": {
         "node": ">=12"
       },
@@ -5839,7 +6752,6 @@
       "version": "3.35.0",
       "resolved": "https://registry.npmjs.org/sucrase/-/sucrase-3.35.0.tgz",
       "integrity": "sha512-8EbVDiu9iN/nESwxeSxDKe0dunta1GOlHufmSSXxMD2z2/tMZpDMpvXQGsc+ajGo8y2uYUmixaSRUc/QPoQ0GA==",
-      "dev": true,
       "dependencies": {
         "@jridgewell/gen-mapping": "^0.3.2",
         "commander": "^4.0.0",
@@ -5861,7 +6773,6 @@
       "version": "4.1.1",
       "resolved": "https://registry.npmjs.org/commander/-/commander-4.1.1.tgz",
       "integrity": "sha512-NOKm8xhkzAjzFx8B2v5OAHT+u5pRQc2UCa2Vq9jYL/31o2wi9mxBA7LIFs3sV5VSC49z6pEhfbMULvShKj26WA==",
-      "dev": true,
       "engines": {
         "node": ">= 6"
       }
@@ -5870,7 +6781,6 @@
       "version": "10.4.5",
       "resolved": "https://registry.npmjs.org/glob/-/glob-10.4.5.tgz",
       "integrity": "sha512-7Bv8RF0k6xjo7d4A/PxYLbUCfb6c+Vpd2/mB2yRDlew7Jb5hEXiCD9ibfO7wpk8i4sevK6DFny9h7EYbM3/sHg==",
-      "dev": true,
       "dependencies": {
         "foreground-child": "^3.1.0",
         "jackspeak": "^3.1.2",
@@ -5890,7 +6800,6 @@
       "version": "9.0.5",
       "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz",
       "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==",
-      "dev": true,
       "dependencies": {
         "brace-expansion": "^2.0.1"
       },
@@ -5905,7 +6814,6 @@
       "version": "7.1.2",
       "resolved": "https://registry.npmjs.org/minipass/-/minipass-7.1.2.tgz",
       "integrity": "sha512-qOOzS1cBTWYF4BH8fVePDBOO9iptMnGUEZwNc/cMWnTV2nVLZ7VoNWEPHkYczZA0pdoA7dl6e7FL659nX9S2aw==",
-      "dev": true,
       "engines": {
         "node": ">=16 || 14 >=14.17"
       }
@@ -5955,7 +6863,6 @@
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz",
       "integrity": "sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==",
-      "dev": true,
       "engines": {
         "node": ">= 0.4"
       },
@@ -5963,11 +6870,19 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/tailwind-merge": {
+      "version": "2.5.2",
+      "resolved": "https://registry.npmjs.org/tailwind-merge/-/tailwind-merge-2.5.2.tgz",
+      "integrity": "sha512-kjEBm+pvD+6eAwzJL2Bi+02/9LFLal1Gs61+QB7HvTfQQ0aXwC5LGT8PEt1gS0CWKktKe6ysPTAy3cBC5MeiIg==",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/dcastil"
+      }
+    },
     "node_modules/tailwindcss": {
-      "version": "3.4.7",
-      "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.4.7.tgz",
-      "integrity": "sha512-rxWZbe87YJb4OcSopb7up2Ba4U82BoiSGUdoDr3Ydrg9ckxFS/YWsvhN323GMcddgU65QRy7JndC7ahhInhvlQ==",
-      "dev": true,
+      "version": "3.4.10",
+      "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.4.10.tgz",
+      "integrity": "sha512-KWZkVPm7yJRhdu4SRSl9d4AK2wM3a50UsvgHZO7xY77NQr2V+fIrEuoDGQcbvswWvFGbS2f6e+jC/6WJm1Dl0w==",
       "dependencies": {
         "@alloc/quick-lru": "^5.2.0",
         "arg": "^5.0.2",
@@ -6000,11 +6915,18 @@
         "node": ">=14.0.0"
       }
     },
+    "node_modules/tailwindcss-animate": {
+      "version": "1.0.7",
+      "resolved": "https://registry.npmjs.org/tailwindcss-animate/-/tailwindcss-animate-1.0.7.tgz",
+      "integrity": "sha512-bl6mpH3T7I3UFxuvDEXLxy/VuFxBk5bbzplh7tXI68mwMokNYd1t9qPBHlnyTwfa4JGC4zP516I1hYYtQ/vspA==",
+      "peerDependencies": {
+        "tailwindcss": ">=3.0.0 || insiders"
+      }
+    },
     "node_modules/tar": {
       "version": "6.2.1",
       "resolved": "https://registry.npmjs.org/tar/-/tar-6.2.1.tgz",
       "integrity": "sha512-DZ4yORTwrbTj/7MZYq2w+/ZFdI6OZ/f9SFHR+71gIVUZhOQPHzVCLpvRnPgyaMpfWxxk/4ONva3GQSyNIKRv6A==",
-      "dev": true,
       "dependencies": {
         "chownr": "^2.0.0",
         "fs-minipass": "^2.0.0",
@@ -6082,7 +7004,6 @@
       "version": "3.3.1",
       "resolved": "https://registry.npmjs.org/thenify/-/thenify-3.3.1.tgz",
       "integrity": "sha512-RVZSIV5IG10Hk3enotrhvz0T9em6cyHBLkH/YAZuKqd8hRkKhSfCGIcP2KUY0EPxndzANBmNllzWPwak+bheSw==",
-      "dev": true,
       "dependencies": {
         "any-promise": "^1.0.0"
       }
@@ -6091,7 +7012,6 @@
       "version": "1.6.0",
       "resolved": "https://registry.npmjs.org/thenify-all/-/thenify-all-1.6.0.tgz",
       "integrity": "sha512-RNxQH/qI8/t3thXJDwcstUO4zeqo64+Uy/+sNVRBx4Xn2OX+OZ9oP+iJnNFqplFra2ZUVeKCSa2oVWi3T4uVmA==",
-      "dev": true,
       "dependencies": {
         "thenify": ">= 3.1.0 < 4"
       },
@@ -6117,6 +7037,14 @@
         "tmp": "^0.2.0"
       }
     },
+    "node_modules/to-fast-properties": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-2.0.0.tgz",
+      "integrity": "sha512-/OaKK0xYrs3DmxRYqL/yDc+FxFUVYhDlXMhRmv3z915w2HF1tnN1omB354j8VUGO/hbRzyD6Y3sA7v7GS/ceog==",
+      "engines": {
+        "node": ">=4"
+      }
+    },
     "node_modules/to-regex-range": {
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz",
@@ -6140,8 +7068,12 @@
     "node_modules/ts-interface-checker": {
       "version": "0.1.13",
       "resolved": "https://registry.npmjs.org/ts-interface-checker/-/ts-interface-checker-0.1.13.tgz",
-      "integrity": "sha512-Y/arvbn+rrz3JCKl9C4kVNfTfSm2/mEp5FSz5EsZSANGPSlQrpRI5M4PKF+mJnE52jOO90PnPSc3Ur3bTQw0gA==",
-      "dev": true
+      "integrity": "sha512-Y/arvbn+rrz3JCKl9C4kVNfTfSm2/mEp5FSz5EsZSANGPSlQrpRI5M4PKF+mJnE52jOO90PnPSc3Ur3bTQw0gA=="
+    },
+    "node_modules/tslib": {
+      "version": "2.6.3",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.3.tgz",
+      "integrity": "sha512-xNvxJEOUiWPGhUuUdQgAJPKOOJfGnIyKySOc09XkKsgdUV/3E2zvwZYdejjmRgPCgcym1juLH3226yA7sEFJKQ=="
     },
     "node_modules/type-fest": {
       "version": "0.13.1",
@@ -6177,8 +7109,26 @@
     "node_modules/uncrypto": {
       "version": "0.1.3",
       "resolved": "https://registry.npmjs.org/uncrypto/-/uncrypto-0.1.3.tgz",
-      "integrity": "sha512-Ql87qFHB3s/De2ClA9e0gsnS6zXG27SkTiSJwjCc9MebbfapQfuPzumMIUMi38ezPZVNFcHI9sUIepeQfw8J8Q==",
-      "dev": true
+      "integrity": "sha512-Ql87qFHB3s/De2ClA9e0gsnS6zXG27SkTiSJwjCc9MebbfapQfuPzumMIUMi38ezPZVNFcHI9sUIepeQfw8J8Q=="
+    },
+    "node_modules/unctx": {
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/unctx/-/unctx-2.3.1.tgz",
+      "integrity": "sha512-PhKke8ZYauiqh3FEMVNm7ljvzQiph0Mt3GBRve03IJm7ukfaON2OBK795tLwhbyfzknuRRkW0+Ze+CQUmzOZ+A==",
+      "dependencies": {
+        "acorn": "^8.8.2",
+        "estree-walker": "^3.0.3",
+        "magic-string": "^0.30.0",
+        "unplugin": "^1.3.1"
+      }
+    },
+    "node_modules/unctx/node_modules/estree-walker": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-3.0.3.tgz",
+      "integrity": "sha512-7RUKfXgSMMkzt6ZuXmqapOurLGPPfgj6l9uRZ7lRGolvk0y2yocc35LdcxKC5PQZdn2DMqioAQ2NoWcrTKmm6g==",
+      "dependencies": {
+        "@types/estree": "^1.0.0"
+      }
     },
     "node_modules/undici-types": {
       "version": "5.26.5",
@@ -6211,10 +7161,21 @@
         "node": ">=10.0.0"
       }
     },
+    "node_modules/unicorn-magic": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/unicorn-magic/-/unicorn-magic-0.1.0.tgz",
+      "integrity": "sha512-lRfVq8fE8gz6QMBuDM6a+LO3IAzTi05H6gCVaUpir2E1Rwpo4ZUog45KpNXKC/Mn3Yb9UDuHumeFTo9iV/D9FQ==",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/unimport": {
-      "version": "3.9.0",
-      "resolved": "https://registry.npmjs.org/unimport/-/unimport-3.9.0.tgz",
-      "integrity": "sha512-H2ftTISja1BonUVdOKRos6HC6dqYDR40dQTZY3zIDJ/5/z4ihncuL0LqLvtxYqUDMib41eAtunQUhXIWTCZ8rA==",
+      "version": "3.11.1",
+      "resolved": "https://registry.npmjs.org/unimport/-/unimport-3.11.1.tgz",
+      "integrity": "sha512-DuB1Uoq01LrrXTScxnwOoMSlTXxyKcULguFxbLrMDFcE/CO0ZWHpEiyhovN0mycPt7K6luAHe8laqvwvuoeUPg==",
       "dependencies": {
         "@rollup/pluginutils": "^5.1.0",
         "acorn": "^8.12.1",
@@ -6222,13 +7183,13 @@
         "estree-walker": "^3.0.3",
         "fast-glob": "^3.3.2",
         "local-pkg": "^0.5.0",
-        "magic-string": "^0.30.10",
+        "magic-string": "^0.30.11",
         "mlly": "^1.7.1",
         "pathe": "^1.1.2",
-        "pkg-types": "^1.1.3",
+        "pkg-types": "^1.2.0",
         "scule": "^1.3.0",
         "strip-literal": "^2.1.0",
-        "unplugin": "^1.11.0"
+        "unplugin": "^1.12.2"
       }
     },
     "node_modules/unimport/node_modules/escape-string-regexp": {
@@ -6260,17 +7221,23 @@
       }
     },
     "node_modules/unplugin": {
-      "version": "1.12.0",
-      "resolved": "https://registry.npmjs.org/unplugin/-/unplugin-1.12.0.tgz",
-      "integrity": "sha512-KeczzHl2sATPQUx1gzo+EnUkmN4VmGBYRRVOZSGvGITE9rGHRDGqft6ONceP3vgXcyJ2XjX5axG5jMWUwNCYLw==",
+      "version": "1.13.1",
+      "resolved": "https://registry.npmjs.org/unplugin/-/unplugin-1.13.1.tgz",
+      "integrity": "sha512-6Kq1iSSwg7KyjcThRUks9LuqDAKvtnioxbL9iEtB9ctTyBA5OmrB8gZd/d225VJu1w3UpUsKV7eGrvf59J7+VA==",
       "dependencies": {
         "acorn": "^8.12.1",
-        "chokidar": "^3.6.0",
-        "webpack-sources": "^3.2.3",
         "webpack-virtual-modules": "^0.6.2"
       },
       "engines": {
         "node": ">=14.0.0"
+      },
+      "peerDependencies": {
+        "webpack-sources": "^3"
+      },
+      "peerDependenciesMeta": {
+        "webpack-sources": {
+          "optional": true
+        }
       }
     },
     "node_modules/unplugin-auto-import": {
@@ -6320,6 +7287,23 @@
         "url": "https://github.com/sponsors/isaacs"
       }
     },
+    "node_modules/untyped": {
+      "version": "1.4.2",
+      "resolved": "https://registry.npmjs.org/untyped/-/untyped-1.4.2.tgz",
+      "integrity": "sha512-nC5q0DnPEPVURPhfPQLahhSTnemVtPzdx7ofiRxXpOB2SYnb3MfdU3DVGyJdS8Lx+tBWeAePO8BfU/3EgksM7Q==",
+      "dependencies": {
+        "@babel/core": "^7.23.7",
+        "@babel/standalone": "^7.23.8",
+        "@babel/types": "^7.23.6",
+        "defu": "^6.1.4",
+        "jiti": "^1.21.0",
+        "mri": "^1.2.0",
+        "scule": "^1.2.0"
+      },
+      "bin": {
+        "untyped": "dist/cli.mjs"
+      }
+    },
     "node_modules/update-browserslist-db": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.1.0.tgz",
@@ -6367,8 +7351,7 @@
     "node_modules/util-deprecate": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
-      "integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==",
-      "dev": true
+      "integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw=="
     },
     "node_modules/vary": {
       "version": "1.1.2",
@@ -6395,14 +7378,14 @@
       }
     },
     "node_modules/vite": {
-      "version": "5.3.5",
-      "resolved": "https://registry.npmjs.org/vite/-/vite-5.3.5.tgz",
-      "integrity": "sha512-MdjglKR6AQXQb9JGiS7Rc2wC6uMjcm7Go/NHNO63EwiJXfuk9PgqiP/n5IDJCziMkfw9n4Ubp7lttNwz+8ZVKA==",
+      "version": "5.4.2",
+      "resolved": "https://registry.npmjs.org/vite/-/vite-5.4.2.tgz",
+      "integrity": "sha512-dDrQTRHp5C1fTFzcSaMxjk6vdpKvT+2/mIdE07Gw2ykehT49O0z/VHS3zZ8iV/Gh8BJJKHWOe5RjaNrW5xf/GA==",
       "dev": true,
       "dependencies": {
         "esbuild": "^0.21.3",
-        "postcss": "^8.4.39",
-        "rollup": "^4.13.0"
+        "postcss": "^8.4.41",
+        "rollup": "^4.20.0"
       },
       "bin": {
         "vite": "bin/vite.js"
@@ -6421,6 +7404,7 @@
         "less": "*",
         "lightningcss": "^1.21.0",
         "sass": "*",
+        "sass-embedded": "*",
         "stylus": "*",
         "sugarss": "*",
         "terser": "^5.4.0"
@@ -6438,6 +7422,9 @@
         "sass": {
           "optional": true
         },
+        "sass-embedded": {
+          "optional": true
+        },
         "stylus": {
           "optional": true
         },
@@ -6540,6 +7527,8 @@
       "version": "3.2.3",
       "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-3.2.3.tgz",
       "integrity": "sha512-/DyMEOrDgLKKIG0fmvtz+4dUX/3Ghozwgm6iPp8KRhvn+eQf9+Q7GWxVNMk3+uCPWfdXYC4ExGBckIXdFEfH1w==",
+      "optional": true,
+      "peer": true,
       "engines": {
         "node": ">=10.13.0"
       }
@@ -6553,7 +7542,6 @@
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz",
       "integrity": "sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==",
-      "dev": true,
       "dependencies": {
         "isexe": "^2.0.0"
       },
@@ -6586,7 +7574,6 @@
       "version": "7.0.0",
       "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
       "integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
-      "dev": true,
       "dependencies": {
         "ansi-styles": "^4.0.0",
         "string-width": "^4.1.0",
@@ -6656,14 +7643,12 @@
     "node_modules/yallist": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
-      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
-      "dev": true
+      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A=="
     },
     "node_modules/yaml": {
       "version": "2.5.0",
       "resolved": "https://registry.npmjs.org/yaml/-/yaml-2.5.0.tgz",
       "integrity": "sha512-2wWLbGbYDiSqqIKoPjar3MPgB94ErzCtrNE1FdqGuaO0pi2JGjmE8aW8TDZwzU7vuxcGRdL/4gPQwQ7hD5AMSw==",
-      "dev": true,
       "bin": {
         "yaml": "bin.mjs"
       },
diff --git a/WebUI/package.json b/WebUI/package.json
index fcaefcf7..11b422f8 100644
--- a/WebUI/package.json
+++ b/WebUI/package.json
@@ -3,21 +3,30 @@
   "private": true,
   "version": "0.0.1",
   "scripts": {
-    "dev": "vite",
-    "build": "vue-tsc && vite build && call build\\before_build.bat&& electron-builder --config build\\ultra-build.json&&call build\\after_build.bat",
-    "build:ultra": "call build\\ultra_before_build.bat&&vue-tsc && vite build && electron-builder --config build\\ultra-build.json&&call build\\after_build.bat",
+    "dev": "cross-env VITE_PLATFORM_TITLE=\"for Local® Dev™ Mode\" vite",
+    "build": "vue-tsc && env && vite build && call build\\before_build.bat&& electron-builder --config build\\ultra-build.json&&call build\\after_build.bat",
+    "build:ultra": "cross-env-shell VITE_PLATFORM_TITLE=\"for Intel® Core™ Ultra Series 2\" \"call build\\ultra_before_build.bat&&vue-tsc && vite build && electron-builder --config build\\ultra-build.json&&call build\\after_build.bat\"",
     "dir:ultra": "call build\\ultra_before_build.bat&&vue-tsc && vite build && electron-builder --dir --config build\\ultra-build.json&&call build\\after_build.bat",
-    "build:arc": "vue-tsc && vite build && call build\\arc_before_build.bat&& electron-builder --config build\\arc-build.json&&call build\\after_build.bat",
+    "build:arc": "cross-env-shell VITE_PLATFORM_TITLE=\"for Intel® Arc™\" \"vue-tsc && vite build && call build\\arc_before_build.bat&& electron-builder --config build\\arc-build.json&&call build\\after_build.bat\"",
     "preview": "vite preview"
   },
   "dependencies": {
-    "autoprefixer": "^10.4.19",
+    "@radix-icons/vue": "^1.0.0",
+    "@vueuse/core": "^11.0.3",
+    "class-variance-authority": "^0.7.0",
+    "clsx": "^2.1.1",
+    "cross-env": "^7.0.3",
+    "get-port": "^7.1.0",
     "highlight.js": "^11.9.0",
     "koffi": "^2.8.8",
     "marked": "^12.0.2",
     "marked-highlight": "^2.1.1",
     "pinia": "^2.1.7",
+    "pinia-plugin-persistedstate": "^4.0.0",
+    "radix-vue": "^1.9.4",
     "sudo-prompt": "^9.2.1",
+    "tailwind-merge": "^2.5.2",
+    "tailwindcss-animate": "^1.0.7",
     "unplugin-auto-import": "^0.17.5",
     "vue": "^3.4.21"
   },
@@ -26,14 +35,15 @@
     "@types/node": "^20.8.10",
     "@vitejs/plugin-vue": "^5.0.4",
     "@vue/devtools": "^7.3.6",
+    "autoprefixer": "^10.4.20",
     "electron": "^31.2.1",
     "electron-builder": "^24.13.3",
     "electron-builder-squirrel-windows": "^24.13.3",
     "postcss": "^8.4.31",
     "postcss-import": "^15.1.0",
-    "tailwindcss": "^3.3.5",
+    "tailwindcss": "^3.4.10",
     "typescript": "^5.2.2",
-    "vite": "^5.2.0",
+    "vite": "^5.4.2",
     "vite-plugin-electron": "^0.28.7",
     "vite-plugin-electron-renderer": "^0.14.5",
     "vue-tsc": "^2.0.6"
diff --git a/WebUI/src/App.vue b/WebUI/src/App.vue
index 0a8178ca..8dcea68d 100644
--- a/WebUI/src/App.vue
+++ b/WebUI/src/App.vue
@@ -1,8 +1,15 @@
 <template>
+  <div v-if="theme.active === 'lnl'" class="lnl-grid lnl-top-grid" :class="{ [`pos-${activeTabIdx}`]: true }"></div>
+  <div v-if="theme.active === 'lnl'" class="lnl-grid lnl-bottom-grid" :class="{ [`pos-${activeTabIdx}`]: true }"></div>
+  <div v-if="theme.active === 'lnl'" class="lnl-gradient"></div>
   <header
-    class="main-title text-2xl font-bold flex justify-between items-csssenter px-4 border-b border-color-spilter text-white">
-    <div class="flex gap-5 items-center">
-      <h1 class="select-none flex gap-2"><span style="color:#00c4fa">AI</span><span>PLAYGROUND</span></h1>
+    class="main-title text-2xl font-bold flex justify-between items-csssenter px-4 border-b border-white/20 text-white bg-black bg-opacity-20">
+    <div class="flex items-center">
+      <h1 class="select-none flex gap-3 items-baseline">
+        <span style="color:#00c4fa">AI</span>
+        <span>PLAYGROUND</span>
+        <span v-if="platformTitle" class="text-sm font-normal">{{ platformTitle }}</span>
+      </h1>
     </div>
     <div class="flex justify-between items-center gap-5">
       <button :title="languages.COM_SETTINGS" class="svg-icon i-setup w-6 h-6" @click="showAppSettings"
@@ -13,9 +20,34 @@
       <button :title="languages.COM_CLOSE" @click="closeWindow" class="svg-icon i-close w-6 h-6"></button>
     </div>
   </header>
-  <main v-if="loading" class="flex-auto flex items-center justify-center">
+  <main v-if="globalSetup.loadingState === 'loading'" class="flex-auto flex items-center justify-center">
     <loading-bar :text="'AI Playground Loading'" class="w-3/5" style="word-spacing: 8px;"></loading-bar>
   </main>
+  <main v-else-if="globalSetup.loadingState === 'failed'" class="flex-auto flex items-start mt-[10vh] justify-center">
+    <div class="dialog-container z-10 text-white w-[60vw] align-top bg-black bg-opacity-50 p-4 rounded-lg border border-gray-400">
+        <Collapsible v-model:open="isOpen" class=" space-y-2">
+          <div class="flex items-center justify-between gap-2">
+            <div class="flex flex-col gap-4">
+              <h2 class="text-xl font-semibold">{{ languages.ERROR_PYTHON_BACKEND_INIT}}</h2>
+              <p>{{ languages.ERROR_PYTHON_BACKEND_INIT_DETAILS_TEXT }}</p>
+            </div>
+            <CollapsibleTrigger>
+              <button variant="default" size="sm" class="bg-gray-100 hover:bg-gray-200 text-gray-800 font-semibold py-1 px-2 border border-gray-400 rounded">
+                <i class="fas fa-chevron-down" /> 
+                {{ languages.ERROR_PYTHON_BACKEND_INIT_DETAILS }}
+              </button>
+            </CollapsibleTrigger>
+              <button @click="openDevTools" variant="default" size="sm" class="bg-gray-100 hover:bg-gray-200 text-gray-800 font-semibold py-1 px-2 border border-gray-400 rounded">
+                <i class="fas fa-chevron-down" /> 
+                {{ languages.ERROR_PYTHON_BACKEND_INIT_OPEN_LOG }}
+              </button>
+          </div>
+          <CollapsibleContent class="max-h-[50vh] overflow-scroll px-4 py-2">
+            <pre class="whitespace-pre-wrap">{{ globalSetup.errorMessage }}</pre>
+          </CollapsibleContent>
+        </Collapsible>
+    </div>
+  </main>
   <main v-else class="flex-auto flex flex-col relative">
     <div class="main-tabs flex-none pt-2 px-3 flex items-end justify-start gap-1 text-gray-400">
       <button class="tab" :class="{ 'active': activeTabIdx == 0 }" @click="switchTab(0)">{{ languages.TAB_CREATE
@@ -26,8 +58,9 @@
         }}</button>
       <button class="tab" :class="{ 'active': activeTabIdx == 3 }" @click="switchTab(3)">{{ languages.TAB_LEARN_MORE
         }}</button>
+      <span class="main-tab-glider tab absolute" :class="{ [`pos-${activeTabIdx}`]: true }"></span>
     </div>
-    <div class="main-content flex-auto rounded-t-lg border-t relative">
+    <div class="main-content flex-auto rounded-t-lg relative">
       <create v-show="activeTabIdx == 0" @postImageToEnhance="postImageToEnhance"
         @show-download-model-confirm="showDownloadModelConfirm"></create>
       <enhance v-show="activeTabIdx == 1" ref="enhanceCompt" @show-download-model-confirm="showDownloadModelConfirm">
@@ -38,7 +71,7 @@
     </div>
     <download-dialog v-show="showDowloadDlg" ref="downloadDigCompt" @close="showDowloadDlg = false"></download-dialog>
   </main>
-  <footer class="flex-none mx-4 border-t border-color-spilter flex justify-between items-center select-none">
+  <footer class="flex-none px-4 flex justify-between items-center select-none" :class="{'bg-black bg-opacity-50': theme.active === 'lnl', 'border-t border-color-spilter': theme.active === 'dark'}">
     <div>
       <p>Al Playground from Intel Corporation <a href="https://github.com/intel/ai-playground" target="_blank"
           class="text-blue-500">https://github.com/intel/ai-playground</a></p>
@@ -54,7 +87,12 @@
       
       </p>
     </div>
-    <img src="@/assets/svg/intel.svg" />
+    <div v-if="theme.active==='lnl'" class="flex gap-2 items-center">
+      <p class="text-gray-300 text-lg mr-2">Powered by</p>
+      <img class="size-20" src="@/assets/image/core_ultra_badge.png" />
+      <img class="size-20" src="@/assets/image/arc_graphics_badge.png" />
+    </div>
+    <img v-else-if="theme.active==='dark'" src="@/assets/svg/intel.svg" />
   </footer>
 
 </template>
@@ -70,11 +108,16 @@ import AppSettings from "./views/AppSettings.vue";
 import "./assets/css/index.css";
 import { useGlobalSetup } from "./assets/js/store/globalSetup";
 import DownloadDialog from '@/components/DownloadDialog.vue';
+import { Collapsible, CollapsibleContent, CollapsibleTrigger } from '@/components/ui/collapsible'
+import { useTheme } from "./assets/js/store/theme.ts";
+
 
-const loading = ref(true);
+const isOpen = ref(false);
 
 const i18n = useI18N();
 
+const theme = useTheme();
+
 const activeTabIdx = ref(0);
 
 const showSetting = ref(false);
@@ -89,9 +132,21 @@ const downloadDigCompt = ref<InstanceType<typeof DownloadDialog>>();
 
 const fullscreen = ref(false);
 
+const platformTitle = window.envVars.platformTitle;
+
+const globalSetup = useGlobalSetup();
+
 onBeforeMount(async () => {
-  
-  await useGlobalSetup().initSetup();
+  window.electronAPI.onDebugLog(({ level, source, message}) => {
+    if (level == "error") {
+      console.error(`[${source}] ${message}`);
+    }
+    if (level == "info") {
+      console.log(`[${source}] ${message}`);
+    }
+  })
+  await globalSetup.initSetup();
+
   document.body.addEventListener("mousedown", autoHideAppSettings);
   document.body.addEventListener("keydown", (e) => {
     if (e.key == "F11") {
@@ -99,9 +154,9 @@ onBeforeMount(async () => {
       e.preventDefault();
     }
   })
-  loading.value = false;
 })
 
+
 function showAppSettings() {
   if (showSetting.value === false) {
     showSetting.value = true;
@@ -114,11 +169,15 @@ function showAppSettings() {
 function hideAppSettings() {
   showSetting.value = false;
 }
+
 function autoHideAppSettings(e: MouseEvent) {
   if (showSetting.value && e.target != showSettingBtn.value && !e.composedPath().find((item)=>{ return item instanceof HTMLElement && item.classList.contains("v-drop-select-list")})) {
     const appSettingsPanel = document.getElementById("app-settings-panel");
 
     if (appSettingsPanel != null) {
+      if (e.target instanceof HTMLElement && e.target.closest("#app-settings-panel") != null) {
+        return;
+      }
       const rect = appSettingsPanel.getBoundingClientRect();
       if (e.clientX < rect.left || e.clientX > rect.right || e.clientY < rect.top || e.clientY > rect.bottom) {
         hideAppSettings();
@@ -144,6 +203,10 @@ function closeWindow() {
   window.electronAPI.exitApp();
 }
 
+function openDevTools() {
+  window.electronAPI.openDevTools();
+}
+
 function postImageToEnhance(imageUrl: string) {
   enhanceCompt.value?.receiveImage(imageUrl);
   activeTabIdx.value = 1;
diff --git a/WebUI/src/assets/css/compontents.css b/WebUI/src/assets/css/compontents.css
index d8983c0d..8ea79a02 100644
--- a/WebUI/src/assets/css/compontents.css
+++ b/WebUI/src/assets/css/compontents.css
@@ -173,7 +173,7 @@
     align-items: flex-start;
     gap: 10px;
     border-radius: 5px;
-    background: #05010f;
+    background: #05010fa8;
     overflow: hidden;
     position: relative;
 
diff --git a/WebUI/src/assets/css/index.css b/WebUI/src/assets/css/index.css
index 596bcffe..c70f0c64 100644
--- a/WebUI/src/assets/css/index.css
+++ b/WebUI/src/assets/css/index.css
@@ -5,4 +5,82 @@
 @import "./main.css";
 @import "./pc.css";
 @import "./compontents.css";
-@import "./svg.css";
\ No newline at end of file
+@import "./svg.css";
+ 
+@layer base {
+  :root {
+    --background: 0 0% 100%;
+    --foreground: 0 0% 3.9%;
+ 
+    --muted: 0 0% 96.1%;
+    --muted-foreground: 0 0% 45.1%;
+ 
+    --popover: 0 0% 100%;
+    --popover-foreground: 0 0% 3.9%;
+ 
+    --card: 0 0% 100%;
+    --card-foreground: 0 0% 3.9%;
+ 
+    --border: 0 0% 89.8%;
+    --input: 0 0% 89.8%;
+ 
+    --primary: 0 0% 9%;
+    --primary-foreground: 0 0% 98%;
+ 
+    --secondary: 0 0% 96.1%;
+    --secondary-foreground: 0 0% 9%;
+ 
+    --accent: 0 0% 96.1%;
+    --accent-foreground: 0 0% 9%;
+ 
+    --destructive: 0 84.2% 60.2%;
+    --destructive-foreground: 0 0% 98%;
+ 
+    --ring: 0 0% 3.9%;
+ 
+    --radius: 0.5rem;
+  }
+ 
+  .dark {
+    --background: 0 0% 3.9%;
+    --foreground: 0 0% 98%;
+ 
+    --muted: 0 0% 14.9%;
+    --muted-foreground: 0 0% 63.9%;
+ 
+    --popover: 0 0% 3.9%;
+    --popover-foreground: 0 0% 98%;
+ 
+    --card: 0 0% 3.9%;
+    --card-foreground: 0 0% 98%;
+ 
+    --border: 0 0% 14.9%;
+    --input: 0 0% 14.9%;
+ 
+    --primary: 0 0% 98%;
+    --primary-foreground: 0 0% 9%;
+ 
+    --secondary: 0 0% 14.9%;
+    --secondary-foreground: 0 0% 98%;
+ 
+    --accent: 0 0% 14.9%;
+    --accent-foreground: 0 0% 98%;
+ 
+    --destructive: 0 62.8% 30.6%;
+    --destructive-foreground: 0 0% 98%;
+ 
+    --ring: 0 0% 83.1%;
+  }
+}
+ 
+@layer base {
+  * {
+    @apply border-border;
+  }
+  body {
+    @apply bg-background text-foreground;
+  }
+  code {
+    @apply break-words whitespace-pre-wrap;
+  }
+}
\ No newline at end of file
diff --git a/WebUI/src/assets/css/main.css b/WebUI/src/assets/css/main.css
index dff711dc..40867a9e 100644
--- a/WebUI/src/assets/css/main.css
+++ b/WebUI/src/assets/css/main.css
@@ -9,7 +9,7 @@ textarea {
   -webkit-app-region: none;
 }
 #app {
-  background: rgba(24, 21, 36, 1);
+  background: rgba(30, 26, 43, 1);
   height: 100vh;
   display: flex;
   flex-direction: column;
@@ -47,7 +47,6 @@ textarea {
 
     &.active {
       color: #fff;
-      background: url("@/assets/svg/tab-active.svg") 0px 0px no-repeat;
       z-index: 10;
     }
   }
@@ -153,7 +152,8 @@ textarea {
   flex-direction: column;
   padding: 8px;
   gap: 14px;
-  background-color: #110f17;
+  background-color: var(--color-image-bg);
+  border: 1px solid rgba(255, 255, 255, 0.2);
 
   .image-preview-item {
     border-radius: 4px;
diff --git a/WebUI/src/assets/css/svg.css b/WebUI/src/assets/css/svg.css
index 8080451e..20a86d2b 100644
--- a/WebUI/src/assets/css/svg.css
+++ b/WebUI/src/assets/css/svg.css
@@ -36,6 +36,10 @@
   --svg: url("@/assets/svg/history.svg");
 }
 
+.i-hide-history {
+  --svg: url("@/assets/svg/hide-history.svg");
+}
+
 .i-copy {
   --svg: url("@/assets/svg/copy.svg");
 }
@@ -131,10 +135,15 @@
 .i-transfer {
   --svg: url("@/assets/svg/transfer.svg");
 }
+
 .i-zoom-in {
   --svg: url("@/assets/svg/zoom-in.svg");
 }
 
+.i-zoom-out {
+  --svg: url("@/assets/svg/zoom-out.svg");
+}
+
 .i-clear {
   --svg: url("@/assets/svg/clear.svg");
 }
diff --git a/WebUI/src/assets/css/theme.css b/WebUI/src/assets/css/theme.css
index f098f40e..9cdd561d 100644
--- a/WebUI/src/assets/css/theme.css
+++ b/WebUI/src/assets/css/theme.css
@@ -1,7 +1,7 @@
 :root {
   --color-bg-main: rgba(24, 21, 36, 1);
   --color-spilter: #525252;
-  --color-panel-focus: #05010f;
+  --color-panel-focus: #05010fb4;
   --color-gray-666: #666666;
   --color-uploader-bg: #201c31;
   --color-text-main: #ffffff;
@@ -12,7 +12,7 @@
   --main-gradient: linear-gradient(75deg, #2da9ff, #aa05ff);
   --textbox-bg: #38383d;
   --compontents-main: #fff;
-  --color-image-bg: #110f17;
+  --color-image-bg: #110f1779;
   --textbox-gradient-border: linear-gradient(
       var(--textbox-bg),
       var(--textbox-bg)
@@ -128,3 +128,74 @@ textarea {
     transform: scale(1);
   }
 }
+
+.lnl-background {
+  width: 100%;
+  position: relative;
+  perspective: 80vh;
+}
+
+.lnl-bottom-grid {
+  transform: translateX(calc(-50% + calc(5% * calc(var(--position-index) - 1)))) translateY(-25%) rotateX(78deg) skewX(-5deg);
+}
+
+.lnl-top-grid {
+  transform: translateX(calc(-50% + calc(5% * calc(var(--position-index) - 1)))) translateY(-75%) rotateX(102deg) skewX(-5deg);
+}
+
+.pos-0 {
+--position-index: 0
+}
+
+.pos-1 {
+--position-index: 1
+}
+
+.pos-2 {
+--position-index: 2
+}
+
+.pos-3 {
+--position-index: 3
+}
+
+.lnl-gradient {
+  position: absolute;
+  background: linear-gradient( rgba(0, 25, 138, 0.2) 0%, rgb(0, 25, 138) 35%,  rgb(0, 25, 138) 65%, rgba(0, 25, 138, 0.2) 100%);
+  width: 100%;
+  height: 100%;
+  z-index: -5;
+}
+
+.lnl-grid {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  width: 200%;
+  height: 200%;
+  display: grid;
+  grid-template-columns: repeat(20, 1fr);
+  grid-template-rows: repeat(20, 1fr);
+  z-index: -10;
+  transition: all 0.8s ease-in-out;
+}
+
+.main-tab-glider {
+transform: translateX(calc(calc(168px + 0.25rem) * var(--position-index)));
+transition: all 0.3s ease-in-out;
+background: url("@/assets/svg/tab-active.svg") 0px 0px no-repeat;
+z-index: -5;
+position: absolute;
+}
+
+.lnl-grid::before {
+  content: '';
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 65 65" xmlns="http://www.w3.org/2000/svg"><rect x="0" y="0" width="14" height="14" style="fill: hsl(209, 58%, 70%);"/></svg>');
+  background-size: 40px 40px;
+  opacity: 0.3;
+}
\ No newline at end of file
diff --git a/WebUI/src/assets/i18n/en_US.json b/WebUI/src/assets/i18n/en_US.json
index a43155ed..b67762e1 100644
--- a/WebUI/src/assets/i18n/en_US.json
+++ b/WebUI/src/assets/i18n/en_US.json
@@ -35,9 +35,12 @@
   "COM_HIGH": "high",
   "COM_FULLSCREEN": "FullScreen",
   "COM_FULLSCREEN_EXIT": "FullScreen Exit",
+  "COM_DO_NOT_SHOW_AGAIN": "Do not show again",
+  "SETTINGS_MODEL_IMAGE_RESOLUTION_HD_CONFIRM": "HD Mode can result in slower than normal performance on systems with less than 12 GB of VRAM or 24GB of system memory for Intel Core Ultra PCs",
   "SETTINGS_TAB_BASIC": "Basic Settings",
   "SETTINGS_TAB_MODEL": "Models",
   "SETTINGS_INFERENCE_DEVICE": "Inference Device",
+  "SETTINGS_MODEL_IMAGE_SIZE": "Image Size",
   "SETTINGS_MODEL_IMAGE_RESOLUTION": "Image Resolution",
   "SETTINGS_MODEL_IMAGE_RESOLUTION_STRANDARD": "Standard",
   "SETTINGS_MODEL_IMAGE_RESOLUTION_HD": "HD",
@@ -68,6 +71,9 @@
   "SETTINGS_BASIC_LANGUAGE_ZH": "Chinese",
   "SETTINGS_BASIC_PATHS": "Paths",
   "SETTINGS_BASIC_LLM_CHECKPOINTS": "LLM Model Path",
+  "SETTINGS_MODEL_HUGGINGFACE": "Hugging Face",
+  "SETTINGS_MODEL_HUGGINGFACE_API_TOKEN": "API Token",
+  "SETTINGS_MODEL_HUGGINGFACE_INVALID_TOKEN_TEXT": "Please enter a valid token (hf_***).",
   "SETTINGS_MODEL_SD_CHECKPOINTS": "Image Model Path",
   "SETTINGS_MODEL_SD_INPAINT_CHECKPOINTS": "Image Inpaint Model Path",
   "SETTINGS_MODEL_SD_VAE": "Vae Path",
@@ -115,12 +121,18 @@
   "ANSWER_AI_NAME": "Playground",
   "ANSWER_ERROR_NOT_PROMPT": "Please input prompt",
   "ANSWER_ERROR_CLEAR_SESSION":"Clear Chat History",
+  "INCREASE_FONT_SIZE": "Enlarge Text",
+  "DECREASE_FONT_SIZE": "Shrink Text",
   "ANSWER_RAG_ENABLE":"Enable File Query",
   "ANSWER_RAG_OPEN_DIALOG":"Open File Uploader",
   "DOWNLOADER_CONFRIM_TIP":"You are missing one or more models needed to run. Would you like to download the model(s) listed below?",
   "DOWNLOADER_MODEL":"Model",
   "DOWNLOADER_INFO":"Info",
   "DOWNLOADER_FILE_SIZE":"Size",
+  "DOWNLOADER_GATED":"Gated",
+  "DOWNLOADER_GATED_INFO":"Some of the models you are trying to download are gated.",
+  "DOWNLOADER_GATED_TOKEN":"Please add your huggingface.co API token in the settings.",
+  "DOWNLOADER_GATED_ACCEPT":"Please make sure to visit the model info page and request access. If you have not been granted access to a gated model, the download will fail.",
   "DOWNLOADER_REASON":"Reason",
   "DOWNLOADER_TERMS":"Visit",
   "DOWNLOADER_CONFLICT":"Another download task is currently in progress, and a new task cannot be started. You can cancel the current download task and start a new download task",
@@ -150,5 +162,9 @@
   "ERROR_GENERATE_UNKONW_EXCEPTION": "An unknown error occurred. failed to generate from model",
   "ERROR_FOLDER_NOT_EXISTS": "The specified directory does not exist",
   "ERROR_ENHANCE_IMAGE_NOT_SET": "Please configure the input image to be generated",
-  "ERROR_UNFOUND_GRAPHICS": "If the necessary hardware for program execution is not detected on the computer device, the program will terminate upon clicking OK."
+  "ERROR_UNFOUND_GRAPHICS": "If the necessary hardware for program execution is not detected on the computer device, the program will terminate upon clicking OK.",
+  "ERROR_PYTHON_BACKEND_INIT": "Backend initialization failed",
+  "ERROR_PYTHON_BACKEND_INIT_DETAILS_TEXT": "The AI inference backend failed to initialize. Please try restarting the application. If the problem persists, you can check the Details for additional information about the error.",
+  "ERROR_PYTHON_BACKEND_INIT_DETAILS": "Details",
+  "ERROR_PYTHON_BACKEND_INIT_OPEN_LOG": "Open Log"
 }
diff --git a/WebUI/src/assets/i18n/zh_CN.json b/WebUI/src/assets/i18n/zh_CN.json
index f2dfbf74..fa456e74 100644
--- a/WebUI/src/assets/i18n/zh_CN.json
+++ b/WebUI/src/assets/i18n/zh_CN.json
@@ -35,9 +35,12 @@
   "COM_HIGH": "高",
   "COM_FULLSCREEN": "全屏",
   "COM_FULLSCREEN_EXIT": "退出全屏",
+  "COM_DO_NOT_SHOW_AGAIN": "不再显示",
+  "SETTINGS_MODEL_IMAGE_RESOLUTION_HD_CONFIRM": "高清模式可能导致性能下降，特别是在显存小于12GB或系统内存小于24GB的Intel Core Ultra PC上。",
   "SETTINGS_TAB_BASIC": "基本设置",
   "SETTINGS_TAB_MODEL": "模型",
   "SETTINGS_INFERENCE_DEVICE": "推理设备",
+  "SETTINGS_MODEL_IMAGE_SIZE": "图片大小",
   "SETTINGS_MODEL_IMAGE_RESOLUTION": "图片分辨率",
   "SETTINGS_MODEL_IMAGE_RESOLUTION_STRANDARD": "标准",
   "SETTINGS_MODEL_IMAGE_RESOLUTION_HD": "高清",
@@ -68,6 +71,9 @@
   "SETTINGS_BASIC_LANGUAGE_ZH": "中文",
   "SETTINGS_BASIC_PATHS": "路径",
   "SETTINGS_BASIC_LLM_CHECKPOINTS": "大语言模型路径",
+  "SETTINGS_MODEL_HUGGINGFACE": "Hugging Face",
+  "SETTINGS_MODEL_HUGGINGFACE_API_TOKEN": "API 令牌",
+  "SETTINGS_MODEL_HUGGINGFACE_INVALID_TOKEN_TEXT": "请输入有效的令牌 (hf_***)",
   "SETTINGS_MODEL_SD_CHECKPOINTS": "生图模型路径",
   "SETTINGS_MODEL_SD_INPAINT_CHECKPOINTS": "重绘模型路径",
   "SETTINGS_MODEL_SD_VAE": "Vae模型路径",
@@ -115,12 +121,18 @@
   "ANSWER_AI_NAME": "Playground",
   "ANSWER_ERROR_NOT_PROMPT": "请输入您的问题",
   "ANSWER_ERROR_CLEAR_SESSION":"清空聊天记录",
+  "INCREASE_FONT_SIZE": "增大字体",
+  "DECRESAE_FONT_SIZE": "减小字体",
   "ANSWER_RAG_ENABLE":"启用文件检索增强(RAG)",
   "ANSWER_RAG_OPEN_DIALOG":"上传文件",
   "DOWNLOADER_CONFRIM_TIP":"您缺少运行所需的一个或多个模型。您想下载以下模型吗？",
   "DOWNLOADER_MODEL":"模型",
   "DOWNLOADER_INFO":"信息",
   "DOWNLOADER_FILE_SIZE":"文件大小",
+  "DOWNLOADER_GATED":"受限",
+  "DOWNLOADER_GATED_INFO": "您尝试下载的一些模型是受限的。",
+  "DOWNLOADER_GATED_TOKEN": "请在设置中添加您的huggingface.co API令牌。",
+  "DOWNLOADER_GATED_ACCEPT":"请确保访问模型信息页面并请求访问权限。如果您未被授予受限模型的访问权限，下载将会失败。",
   "DOWNLOADER_REASON":"用途",
   "DOWNLOADER_TERMS":"跳转",
   "DOWNLOADER_CONFLICT":"当前有另一个下载任务正在进行，无法启动新任务。您可以取消当前下载任务并启动新下载任务。",
@@ -150,5 +162,9 @@
   "ERROR_GENERATE_UNKONW_EXCEPTION": "发生未知错误。模型生成失败。",
   "ERROR_FOLDER_NOT_EXISTS": "指定的文件夹不存在",
   "ERROR_ENHANCE_IMAGE_NOT_SET": "请设置输入图片",
-  "ERROR_UNFOUND_GRAPHICS": "如果未检测到运行此程序所需的硬件，点击确定后程序将终止。"
+  "ERROR_UNFOUND_GRAPHICS": "如果未检测到运行此程序所需的硬件，点击确定后程序将终止。",
+  "ERROR_PYTHON_BACKEND_INIT": "后端初始化失败",
+  "ERROR_PYTHON_BACKEND_INIT_DETAILS_TEXT": "AI 后端初始化失败。请尝试重新启动应用程序。如果问题仍然存在，您可以查看详细信息以获取有关错误的更多信息。",
+  "ERROR_PYTHON_BACKEND_INIT_DETAILS": "详细信息",
+  "ERROR_PYTHON_BACKEND_INIT_OPEN_LOG": "打开日志"
 }
diff --git a/WebUI/src/assets/image/arc_graphics_badge.png b/WebUI/src/assets/image/arc_graphics_badge.png
new file mode 100644
index 00000000..d412fa07
Binary files /dev/null and b/WebUI/src/assets/image/arc_graphics_badge.png differ
diff --git a/WebUI/src/assets/image/core_ultra_badge.png b/WebUI/src/assets/image/core_ultra_badge.png
new file mode 100644
index 00000000..c7e9ea01
Binary files /dev/null and b/WebUI/src/assets/image/core_ultra_badge.png differ
diff --git a/WebUI/src/assets/image/nsfw_result_detected.png b/WebUI/src/assets/image/nsfw_result_detected.png
new file mode 100644
index 00000000..df66d4d2
Binary files /dev/null and b/WebUI/src/assets/image/nsfw_result_detected.png differ
diff --git a/WebUI/src/assets/js/markdownParser.ts b/WebUI/src/assets/js/markdownParser.ts
index a2f80668..3818aa9f 100644
--- a/WebUI/src/assets/js/markdownParser.ts
+++ b/WebUI/src/assets/js/markdownParser.ts
@@ -23,7 +23,7 @@ export class MarkdownParser {
             renderer: new Renderer(),
             pedantic: false,
             gfm: true,
-            breaks: false,
+            breaks: true,
         });
     }
 
@@ -46,7 +46,7 @@ export class MarkdownParser {
                             <span class="text-sm">${this.copyText}</span>
                         </button>
                     </div>
-                    <div class="p-4 code-content">${this.marked.parse(matches[0])}</div>
+                    <div class="p-4 code-content overflow-auto">${this.marked.parse(matches[0])}</div>
                 </div>`;
             lastIndex = index + matches[0].length;
         }
diff --git a/WebUI/src/assets/js/store/conversations.ts b/WebUI/src/assets/js/store/conversations.ts
new file mode 100644
index 00000000..396d8713
--- /dev/null
+++ b/WebUI/src/assets/js/store/conversations.ts
@@ -0,0 +1,56 @@
+import { defineStore } from "pinia";
+
+export const useConversations = defineStore("conversations", () => {
+    const conversationList = ref<Record<string, ChatItem[]>>({});
+    const activeKey = ref('');
+    const activeConversation = computed(() => conversationList.value[activeKey.value]);
+
+    const addToActiveConversation = (item: ChatItem) => {
+        const list = conversationList.value[activeKey.value];
+        list.push(item);
+        addNewConversationIfLatestIsNotEmpty(conversationList.value);
+    }
+
+    function deleteConversation(conversationKey: string) {
+        delete conversationList.value[conversationKey];
+    }
+
+    function clearConversation(conversationKey: string) {
+        conversationList.value[conversationKey] = [];
+    }
+
+    function deleteItemFromConversation(conversationKey: string, index: number) {
+        conversationList.value[conversationKey].splice(index, 1);
+    }
+
+    const isNewConversation = (key: string) => conversationList.value[key].length === 0;
+
+    watchEffect(() => {
+        if (Object.keys(conversationList.value).includes(activeKey.value)) return;
+        const latestConversationKey = Object.keys(conversationList.value).at(-1);
+        if (!latestConversationKey) return;
+        activeKey.value = latestConversationKey;
+    })
+
+    return {
+        conversationList,
+        activeKey,
+        activeConversation,
+        addToActiveConversation,
+        deleteConversation,
+        clearConversation,
+        deleteItemFromConversation,
+        isNewConversation
+    };
+}, {
+    persist: {
+        pick: ['conversationList'],
+        afterHydrate: (ctx) => addNewConversationIfLatestIsNotEmpty(ctx.store.$state.conversationList)
+    }
+});
+
+function addNewConversationIfLatestIsNotEmpty(list: Record<string, ChatItem[]>) {
+    if (Object.values(list).at(-1)?.length !== 0) {
+        list[new Date().getTime().toString()] = [];
+    }
+}
\ No newline at end of file
diff --git a/WebUI/src/assets/js/store/globalSetup.ts b/WebUI/src/assets/js/store/globalSetup.ts
index e9330b52..08776a3d 100644
--- a/WebUI/src/assets/js/store/globalSetup.ts
+++ b/WebUI/src/assets/js/store/globalSetup.ts
@@ -64,6 +64,21 @@ export const useGlobalSetup = defineStore("globalSetup", () => {
 
     let envType = "";
 
+    const loadingState = ref("loading");
+
+    const errorMessage = ref("");
+
+    const hdPersistentConfirmation = ref(localStorage.getItem("HdPersistentConfirmation") === "true");
+
+    watchEffect(() => {
+        localStorage.setItem("HdPersistentConfirmation", hdPersistentConfirmation.value.toString());
+    });
+
+    window.electronAPI.onReportError((value) => {
+        loadingState.value = "failed";
+        errorMessage.value = value;
+    })
+
     async function initSetup() {
         const setupData = await window.electronAPI.getInitSetting();
         envType = setupData.envType;
@@ -75,22 +90,33 @@ export const useGlobalSetup = defineStore("globalSetup", () => {
         apiHost.value = setupData.apiHost;
         loadPresetModelSettings();
         const postJson = JSON.stringify(toRaw(paths.value));
+        const delay = 2000;
+
         while (true) {
             try {
                 models.value.scheduler.push(...await initWebSettings(postJson));
                 models.value.scheduler.unshift("None");
                 break;
-            } catch {
-                await util.delay(500);
+            } catch (error) {
+                const backendStatus = (await window.electronAPI.getPythonBackendStatus()).status;
+                if (backendStatus === "stopped") {
+                    return;
+                }
+                if (backendStatus === "running" && !(error instanceof TypeError)) {
+                    loadingState.value = "failed";
+                    errorMessage.value = (error as Error).message;
+                    return;
+                }
+                await util.delay(delay);
             }
         }
         await reloadGraphics();
         if (graphicsList.value.length == 0) {
             await window.electronAPI.showMessageBoxSync({ message: useI18N().state.ERROR_UNFOUND_GRAPHICS, title: "error", icon: "error" });
             window.electronAPI.exitApp();
-            return;
         }
         await loadUserSettings();
+        loadingState.value = "running";
     }
 
     async function reloadGraphics() {
@@ -128,6 +154,9 @@ export const useGlobalSetup = defineStore("globalSetup", () => {
             method: "post",
             body: postJson,
         });
+        if (response.status !== 200) {
+            throw new Error(`Received error response from AI inference backend:\n\n ${await response.status}:${await response.text()}`)
+        }
         return await response.json() as string[];
     }
 
@@ -282,6 +311,9 @@ export const useGlobalSetup = defineStore("globalSetup", () => {
         paths,
         apiHost,
         graphicsList,
+        loadingState,
+        errorMessage,
+        hdPersistentConfirmation,
         initSetup,
         applyPathsSettings,
         applyModelSettings,
diff --git a/WebUI/src/assets/js/store/models.ts b/WebUI/src/assets/js/store/models.ts
new file mode 100644
index 00000000..2bada7ea
--- /dev/null
+++ b/WebUI/src/assets/js/store/models.ts
@@ -0,0 +1,60 @@
+import { defineStore } from "pinia";
+
+type ModelType = "llm" | "embedding" | "stableDiffusion" | "inpaint" | "lora" | "vae";
+
+export type Model = {
+    name: string;
+    downloaded: boolean;
+    type: ModelType;
+}
+
+const predefinedModels: Model[] = [
+    { name: 'Qwen/Qwen2-1.5B-Instruct', type: 'llm', downloaded: false },
+    { name: 'microsoft/Phi-3-mini-4k-instruct', type: 'llm', downloaded: false },
+    { name: 'meta-llama/Meta-Llama-3.1-8B-Instruct', type: 'llm', downloaded: false },
+    { name: 'mistralai/Mistral-7B-Instruct-v0.3', type: 'llm', downloaded: false },
+    { name: 'google/gemma-7b', type: 'llm', downloaded: false },
+    { name: 'THUDM/chatglm3-6b', type: 'llm', downloaded: false },
+]    
+
+export const useModels = defineStore("models", () => {
+
+    const hfToken = ref<string | undefined>(undefined);
+    const models = ref(predefinedModels);
+    const llms = computed(() => models.value.filter(m => m.type === 'llm'));
+
+    async function refreshModels() {
+        const sdModels = await window.electronAPI.getDownloadedDiffusionModels();
+        const llmModels = await window.electronAPI.getDownloadedLLMs();
+        const loraModels = await window.electronAPI.getDownloadedLoras();
+        const inpaintModels = await window.electronAPI.getDownloadedInpaintModels();
+        const embeddingModels = await window.electronAPI.getDownloadedEmbeddingModels();
+        
+        const downloadedModels = [
+            ...sdModels.map<Model>(name => ({ name, type: 'stableDiffusion', downloaded: true })),
+            ...llmModels.map<Model>(name => ({ name, type: 'llm', downloaded: true })),
+            ...loraModels.map<Model>(name => ({ name, type: 'lora', downloaded: true })),
+            ...inpaintModels.map<Model>(name => ({ name, type: 'inpaint', downloaded: true })),
+            ...embeddingModels.map<Model>(name => ({ name, type: 'embedding', downloaded: true })),
+        ];
+        const notYetDownloaded = (model: Model) => !downloadedModels.map(m => m.name).includes(model.name);
+
+        models.value = [...downloadedModels, ...predefinedModels.filter(notYetDownloaded)];
+        console.log(models);
+
+        }
+
+    refreshModels()
+
+    return {
+        models,
+        llms,
+        hfToken,
+        hfTokenIsValid: computed(() => hfToken.value?.startsWith('hf_')),
+        refreshModels,
+    }
+}, {
+    persist: {
+        pick: ['hfToken'],
+    }
+});
diff --git a/WebUI/src/assets/js/store/theme.ts b/WebUI/src/assets/js/store/theme.ts
new file mode 100644
index 00000000..cb36fffc
--- /dev/null
+++ b/WebUI/src/assets/js/store/theme.ts
@@ -0,0 +1,23 @@
+import { defineStore } from "pinia";
+
+const knownThemes: Theme[] = ['dark', 'lnl'];
+export const useTheme = defineStore("theme", () => {
+
+    const selected = ref<Theme | null>(null);
+    const availableThemes = ref<Theme[]>([...knownThemes]);
+
+    window.electronAPI.getThemeSettings().then((themeSettings) => {
+        const themesFromSettings = themeSettings.availableThemes.filter(t => knownThemes.includes(t));
+        if (themesFromSettings.length > 0) availableThemes.value = themesFromSettings;
+    });
+
+    return {
+        selected,
+        availableThemes,
+        active: computed(() => selected.value && availableThemes.value.includes(selected.value) ? selected.value : availableThemes.value[0]),
+    }
+}, {
+    persist: {
+        pick: ['selected'],
+    }
+});
diff --git a/WebUI/src/assets/svg/collapse.svg b/WebUI/src/assets/svg/collapse.svg
new file mode 100644
index 00000000..870a2115
--- /dev/null
+++ b/WebUI/src/assets/svg/collapse.svg
@@ -0,0 +1,4 @@
+<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <circle cx="13" cy="13" r="13" fill="#585561"/>
+  <path d="M15 8L10 13L15 18" stroke="#E0E0E0" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
diff --git a/WebUI/src/assets/svg/expand.svg b/WebUI/src/assets/svg/expand.svg
new file mode 100644
index 00000000..33c1d57b
--- /dev/null
+++ b/WebUI/src/assets/svg/expand.svg
@@ -0,0 +1,4 @@
+<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <circle cx="13" cy="13" r="13" fill="#585561"/>
+  <path d="M11 8L16 13L11 18" stroke="#E0E0E0" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
\ No newline at end of file
diff --git a/WebUI/src/assets/svg/hide-history.svg b/WebUI/src/assets/svg/hide-history.svg
new file mode 100644
index 00000000..444cade4
--- /dev/null
+++ b/WebUI/src/assets/svg/hide-history.svg
@@ -0,0 +1,5 @@
+<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <circle cx="13" cy="13" r="13" fill="#585561"/>
+  <path d="M7.59086 10.1665C7.68324 9.98344 7.80462 9.75087 7.89449 9.60731C8.99612 7.84767 10.9295 6.68061 13.1305 6.68061C16.5576 6.68061 19.3358 9.50992 19.3358 13.0001C19.3358 16.4902 16.5576 19.3195 13.1305 19.3195C10.9023 19.3195 8.94832 18.1234 7.85399 16.3272C7.70457 16.082 7.65399 15.9606 7.65399 15.9606C7.54205 15.7377 7.27163 15.6363 7.04507 15.731C6.81692 15.8265 6.72214 16.0821 6.82984 16.3034C6.82984 16.3034 6.90149 16.4692 7.0603 16.7362C8.303 18.8258 10.5566 20.2223 13.1305 20.2223C17.0472 20.2223 20.2222 16.9888 20.2222 13.0001C20.2222 9.01133 17.0472 5.77783 13.1305 5.77783C10.593 5.77783 8.36676 7.13511 7.11358 9.1757C7.05018 9.27894 6.97222 9.42346 6.89775 9.56749L6.65826 8.0276C6.62032 7.78364 6.39526 7.61722 6.15179 7.65649C5.91002 7.69549 5.74543 7.92908 5.78315 8.17161L6.13017 10.4029C6.20669 10.8949 6.65689 11.2311 7.14343 11.1527L9.33443 10.7993C9.57548 10.7604 9.74012 10.531 9.70156 10.283C9.66327 10.0368 9.4348 9.86903 9.19849 9.90715L7.59086 10.1665ZM13.1305 8.93548C13.1305 8.68733 12.9338 8.48617 12.6873 8.48617C12.4425 8.48617 12.2441 8.69189 12.2441 8.93867V12.9962C12.2441 13.4969 12.6438 13.9028 13.1343 13.9028H17.1185C17.3639 13.9028 17.5628 13.7025 17.5628 13.4514C17.5628 13.2021 17.3609 13.0001 17.1216 13.0001H13.5717C13.3281 13.0001 13.1305 12.7944 13.1305 12.5507V8.93548Z" fill="#E0E0E0"/>
+  <line x1="5" y1="5" x2="21" y2="21" stroke="#E0E0E0" stroke-width="2"/>
+</svg>
\ No newline at end of file
diff --git a/WebUI/src/assets/svg/tab-active-first.svg b/WebUI/src/assets/svg/tab-active-first.svg
index 1b74e231..46a6efa2 100644
--- a/WebUI/src/assets/svg/tab-active-first.svg
+++ b/WebUI/src/assets/svg/tab-active-first.svg
@@ -6,7 +6,7 @@
 <mask id="path-2-inside-1_288_1975" fill="white">
 <path fill-rule="evenodd" clip-rule="evenodd" d="M152 8C152 3.58172 148.418 0 144 0H8C3.58172 0 0 3.58172 0 8V36V175C0 179.418 3.58171 183 7.99998 183H1125C1129.42 183 1133 179.418 1133 175V44C1133 39.5817 1129.42 36 1125 36H160C155.582 36 152 32.4183 152 28V8Z"/>
 </mask>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M152 8C152 3.58172 148.418 0 144 0H8C3.58172 0 0 3.58172 0 8V36V175C0 179.418 3.58171 183 7.99998 183H1125C1129.42 183 1133 179.418 1133 175V44C1133 39.5817 1129.42 36 1125 36H160C155.582 36 152 32.4183 152 28V8Z" fill="#05010F"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M152 8C152 3.58172 148.418 0 144 0H8C3.58172 0 0 3.58172 0 8V36V175C0 179.418 3.58171 183 7.99998 183H1125C1129.42 183 1133 179.418 1133 175V44C1133 39.5817 1129.42 36 1125 36H160C155.582 36 152 32.4183 152 28V8Z" fill="#05010F" opacity="0.3"/>
 <path d="M8 1H144V-1H8V1ZM1 36V8H-1V36H1ZM1 175V36H-1V175H1ZM1125 182H7.99998V184H1125V182ZM1132 44V175H1134V44H1132ZM160 37H1125V35H160V37ZM151 8V28H153V8H151ZM160 35C156.134 35 153 31.866 153 28H151C151 32.9706 155.029 37 160 37V35ZM1125 184C1129.97 184 1134 179.971 1134 175H1132C1132 178.866 1128.87 182 1125 182V184ZM-1 175C-1 179.971 3.02942 184 7.99998 184V182C4.13399 182 1 178.866 1 175H-1ZM144 1C147.866 1 151 4.13401 151 8H153C153 3.02944 148.971 -1 144 -1V1ZM1134 44C1134 39.0294 1129.97 35 1125 35V37C1128.87 37 1132 40.134 1132 44H1134ZM8 -1C3.02944 -1 -1 3.02944 -1 8H1C1 4.13401 4.13401 1 8 1V-1Z" fill="url(#paint1_linear_288_1975)" mask="url(#path-2-inside-1_288_1975)"/>
 </g>
 <defs>
diff --git a/WebUI/src/assets/svg/tab-active.svg b/WebUI/src/assets/svg/tab-active.svg
index e158b599..2212e3e2 100644
--- a/WebUI/src/assets/svg/tab-active.svg
+++ b/WebUI/src/assets/svg/tab-active.svg
@@ -1,9 +1,9 @@
-<svg width="168" height="41" viewBox="0 0 168 41" fill="none" xmlns="http://www.w3.org/2000/svg">
-<mask id="mask0_156_1869" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="168" height="41">
-<rect width="168" height="41" fill="#D9D9D9"/>
+<svg width="168" height="40" viewBox="0 0 168 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<mask id="mask0_156_1869" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="168" height="40">
+<rect width="168" height="40" fill="#D9D9D9"/>
 </mask>
 <g mask="url(#mask0_156_1869)">
-<path d="M152 0.5C156.142 0.5 159.5 3.85786 159.5 8V32C159.5 36.6944 163.306 40.5 168 40.5H1178C1182.14 40.5 1185.5 43.8579 1185.5 48V988.5H-7.5V48C-7.5 43.8579 -4.14213 40.5 0 40.5C4.69442 40.5 8.5 36.6944 8.5 32V8C8.5 3.85786 11.8579 0.5 16 0.5H152Z" fill="#05010F" stroke="url(#paint0_linear_156_1869)"/>
+<path d="M152 0.5C156.142 0.5 159.5 3.85786 159.5 8V32C159.5 36.6944 163.306 40.5 168 40.5H1178C1182.14 40.5 1185.5 43.8579 1185.5 48V988.5H-7.5V48C-7.5 43.8579 -4.14213 40.5 0 40.5C4.69442 40.5 8.5 36.6944 8.5 32V8C8.5 3.85786 11.8579 0.5 16 0.5H152Z" fill="#05010F" opacity="0.7" />
 </g>
 <defs>
 <linearGradient id="paint0_linear_156_1869" x1="589" y1="0" x2="589" y2="894" gradientUnits="userSpaceOnUse">
diff --git a/WebUI/src/assets/svg/zoom-out.svg b/WebUI/src/assets/svg/zoom-out.svg
new file mode 100644
index 00000000..ca7eac99
--- /dev/null
+++ b/WebUI/src/assets/svg/zoom-out.svg
@@ -0,0 +1,4 @@
+<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M11.25 8.01562H5.625C5.47582 8.01562 5.33274 8.07489 5.22725 8.18038C5.12176 8.28587 5.0625 8.42894 5.0625 8.57812C5.0625 8.72731 5.12176 8.87038 5.22725 8.97587C5.33274 9.08136 5.47582 9.14062 5.625 9.14062H11.25C11.3992 9.14062 11.5423 9.08136 11.6477 8.97587C11.7532 8.87038 11.8125 8.72731 11.8125 8.57812C11.8125 8.42894 11.7532 8.28587 11.6477 8.18038C11.5423 8.07489 11.3992 8.01562 11.25 8.01562Z" fill="currentColor"/>
+  <path d="M16.1589 15.9255L13.7171 13.4837C14.9732 12.1697 15.75 10.3944 15.75 8.4375C15.75 4.4055 12.4695 1.125 8.4375 1.125C4.4055 1.125 1.125 4.4055 1.125 8.4375C1.125 12.4695 4.4055 15.75 8.4375 15.75C10.1076 15.75 11.6443 15.1807 12.8767 14.2346L15.363 16.7209C15.4151 16.7733 15.4771 16.8149 15.5453 16.8433C15.6136 16.8717 15.6868 16.8863 15.7607 16.8863C15.8346 16.8863 15.9078 16.8717 15.976 16.8433C16.0443 16.8149 16.1063 16.7733 16.1584 16.7209C16.2639 16.6155 16.3232 16.4725 16.3233 16.3233C16.3235 16.1741 16.2643 16.0311 16.1589 15.9255ZM2.25 8.4375C2.25 5.02594 5.02594 2.25 8.4375 2.25C11.8491 2.25 14.625 5.02594 14.625 8.4375C14.625 11.8491 11.8491 14.625 8.4375 14.625C5.02594 14.625 2.25 11.8491 2.25 8.4375Z" fill="currentColor"/>
+</svg>
\ No newline at end of file
diff --git a/WebUI/src/components/DownloadDialog.vue b/WebUI/src/components/DownloadDialog.vue
index f9fb5d5a..7488bcf5 100644
--- a/WebUI/src/components/DownloadDialog.vue
+++ b/WebUI/src/components/DownloadDialog.vue
@@ -10,6 +10,7 @@
                             <tr class=" text-gray-300 font-bold">
                                 <td>{{ languages.DOWNLOADER_MODEL }}</td>
                                 <td>{{ languages.DOWNLOADER_FILE_SIZE }}</td>
+                                <td>{{ languages.DOWNLOADER_GATED }}</td>
                                 <td>{{ languages.DOWNLOADER_INFO }}</td>
                                 <td>{{ languages.DOWNLOADER_REASON }}</td>
                             </tr>
@@ -21,6 +22,15 @@
                                     <span v-if="sizeRequesting" class="svg-icon i-loading w-4 h-4"></span>
                                     <span v-else>{{ item.size }}</span>
                                 </td>
+                                <td>
+                                    <span v-if="sizeRequesting" class="svg-icon i-loading w-4 h-4"></span>
+                                    <svg v-if="item.gated" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1" stroke="currentColor" class="size-6 ml-2">
+                                        <path stroke-linecap="round" stroke-linejoin="round" d="M16.5 10.5V6.75a4.5 4.5 0 1 0-9 0v3.75m-.75 11.25h10.5a2.25 2.25 0 0 0 2.25-2.25v-6.75a2.25 2.25 0 0 0-2.25-2.25H6.75a2.25 2.25 0 0 0-2.25 2.25v6.75a2.25 2.25 0 0 0 2.25 2.25Z" />
+                                    </svg>
+                                    <svg v-else xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1" stroke="currentColor" class="size-6 ml-2">
+                                        <path stroke-linecap="round" stroke-linejoin="round" d="M13.5 10.5V6.75a4.5 4.5 0 1 1 9 0v3.75M3.75 21.75h10.5a2.25 2.25 0 0 0 2.25-2.25v-6.75a2.25 2.25 0 0 0-2.25-2.25H3.75a2.25 2.25 0 0 0-2.25 2.25v6.75a2.25 2.25 0 0 0 2.25 2.25Z" />
+                                    </svg>
+                                </td>
                                 <td>
                                     <a :href="getInfoUrl(item.repo_id, item.type)" target="_blank"
                                         class="text-blue-500 text-sm">
@@ -33,6 +43,13 @@
                             </tr>
                         </tbody>
                     </table>
+                    <div v-if="downloadList.some((i) => i.gated)" class="flex flex-col items-center gap-2 p-4 border border-red-600 bg-red-600/10 rounded-lg">
+                        <span class="font-bold mx-4">{{ languages.DOWNLOADER_GATED_INFO }}</span>
+                        <ul>
+                            <li v-if="!models.hfTokenIsValid" class="text-left">{{ languages.DOWNLOADER_GATED_TOKEN }}</li>
+                            <li class="text-left">{{ languages.DOWNLOADER_GATED_ACCEPT }}</li>
+                        </ul>
+                    </div>
                     <div class="flex items-center gap-2">
                         <button class="v-checkbox-control flex-none w-5 h-5"
                             :class="{ 'v-checkbox-checked': readTerms }" @click="readTerms = !readTerms">
@@ -70,9 +87,11 @@ import { SSEProcessor } from '@/assets/js/sseProcessor';
 import { util } from '@/assets/js/util';
 import { Const } from '@/assets/js/const';
 import { toast } from '@/assets/js/toast';
+import { useModels } from '@/assets/js/store/models';
 
 const i18nState = useI18N().state;
 const globalSetup = useGlobalSetup();
+const models = useModels();
 let downloding = false;
 const curDownloadTip = ref("");
 const allDownloadTip = ref("");
@@ -117,6 +136,11 @@ function dataProcess(line: string) {
                 percent.value = 100;
                 allDownloadTip.value = `${i18nState.DOWNLOADER_DONWLOAD_TASK_PROGRESS} ${completeCount.value}/${allTaskCount}`;
             }
+            models.refreshModels();
+            break;
+        case "allComplete":
+            downloding = false;
+            emits("close");
             break;
         case "error":
             hashError.value = true;
@@ -126,6 +150,7 @@ function dataProcess(line: string) {
                     break;
                 case "download_exception":
                     errorText.value = i18nState.ERR_DOWNLOAD_FAILED;
+                    toast.error(i18nState.ERR_DOWNLOAD_FAILED);
                     break;
                 case "runtime_error":
                     errorText.value = i18nState.ERROR_RUNTIME_ERROR;
@@ -159,16 +184,25 @@ async function showConfirm(downList: DownloadModelParam[], success?: () => void,
     downloadResolve = success;
     downloadReject = fail;
     try {
-        const response = await fetch(`${globalSetup.apiHost}/api/getModelSize`, {
+        const sizeResponse = await fetch(`${globalSetup.apiHost}/api/getModelSize`, {
+            method: "POST",
+            body: JSON.stringify(downList),
+            headers: {
+                "Content-Type": "application/json"
+            }
+        });
+        const gatedResponse = await fetch(`${globalSetup.apiHost}/api/isModelGated`, {
             method: "POST",
             body: JSON.stringify(downList),
             headers: {
                 "Content-Type": "application/json"
             }
         });
-        const data = (await response.json()) as ApiResponse & { sizeList: StringKV };
+        const sizeData = (await sizeResponse.json()) as ApiResponse & { sizeList: StringKV };
+        const gatedData = (await gatedResponse.json()) as ApiResponse & { gatedList: Record<string, boolean> };
         for (const item of downloadList.value) {
-            item.size = data.sizeList[`${item.repo_id}_${item.type}`] || "";
+            item.size = sizeData.sizeList[`${item.repo_id}_${item.type}`] || "";
+            item.gated = gatedData.gatedList[item.repo_id] || false;
         }
         downloadList.value = downloadList.value;
         sizeRequesting.value = false;
@@ -233,7 +267,8 @@ function download() {
         method: "POST",
         body: JSON.stringify(toRaw(downloadList.value)),
         headers: {
-            "Content-Type": "application/json"
+            "Content-Type": "application/json",
+            ...(models.hfTokenIsValid ? { Authorization: `Bearer ${models.hfToken}` } : {})
         },
         signal: abortController.signal
     }).then((response) => {
diff --git a/WebUI/src/components/ModelDropDownItem.vue b/WebUI/src/components/ModelDropDownItem.vue
new file mode 100644
index 00000000..f3cba92d
--- /dev/null
+++ b/WebUI/src/components/ModelDropDownItem.vue
@@ -0,0 +1,20 @@
+<template>
+    <div class="flex gap-2 items-center overflow-hidden text-ellipsis">
+        <span class="rounded-full w-2 h-2 flex-shrink-0"  :class="{ 'bg-green-500': model.downloaded, 'bg-gray-500': !model.downloaded }" ></span>
+        <span class="h-7 overflow-hidden">{{ model.name }}</span>
+    </div>
+</template>
+<script setup lang="ts">
+import { type Model } from "../assets/js/store/models";
+
+const props = withDefaults(defineProps<{
+    model: Model
+}>(), {
+    model: () => ({
+        name: "model not found",
+        type: "llm",
+        downloaded: false
+    })
+});
+
+</script>
\ No newline at end of file
diff --git a/WebUI/src/components/ui/collapsible/Collapsible.vue b/WebUI/src/components/ui/collapsible/Collapsible.vue
new file mode 100644
index 00000000..52bff5f2
--- /dev/null
+++ b/WebUI/src/components/ui/collapsible/Collapsible.vue
@@ -0,0 +1,15 @@
+<script setup lang="ts">
+import { CollapsibleRoot, useForwardPropsEmits } from 'radix-vue'
+import type { CollapsibleRootEmits, CollapsibleRootProps } from 'radix-vue'
+
+const props = defineProps<CollapsibleRootProps>()
+const emits = defineEmits<CollapsibleRootEmits>()
+
+const forwarded = useForwardPropsEmits(props, emits)
+</script>
+
+<template>
+  <CollapsibleRoot v-slot="{ open }" v-bind="forwarded">
+    <slot :open="open" />
+  </CollapsibleRoot>
+</template>
diff --git a/WebUI/src/components/ui/collapsible/CollapsibleContent.vue b/WebUI/src/components/ui/collapsible/CollapsibleContent.vue
new file mode 100644
index 00000000..9f30898b
--- /dev/null
+++ b/WebUI/src/components/ui/collapsible/CollapsibleContent.vue
@@ -0,0 +1,11 @@
+<script setup lang="ts">
+import { CollapsibleContent, type CollapsibleContentProps } from 'radix-vue'
+
+const props = defineProps<CollapsibleContentProps>()
+</script>
+
+<template>
+  <CollapsibleContent v-bind="props" class="overflow-hidden transition-all data-[state=closed]:animate-collapsible-up data-[state=open]:animate-collapsible-down">
+    <slot />
+  </CollapsibleContent>
+</template>
diff --git a/WebUI/src/components/ui/collapsible/CollapsibleTrigger.vue b/WebUI/src/components/ui/collapsible/CollapsibleTrigger.vue
new file mode 100644
index 00000000..4a434639
--- /dev/null
+++ b/WebUI/src/components/ui/collapsible/CollapsibleTrigger.vue
@@ -0,0 +1,11 @@
+<script setup lang="ts">
+import { CollapsibleTrigger, type CollapsibleTriggerProps } from 'radix-vue'
+
+const props = defineProps<CollapsibleTriggerProps>()
+</script>
+
+<template>
+  <CollapsibleTrigger v-bind="props">
+    <slot />
+  </CollapsibleTrigger>
+</template>
diff --git a/WebUI/src/components/ui/collapsible/index.ts b/WebUI/src/components/ui/collapsible/index.ts
new file mode 100644
index 00000000..4930f4c6
--- /dev/null
+++ b/WebUI/src/components/ui/collapsible/index.ts
@@ -0,0 +1,3 @@
+export { default as Collapsible } from './Collapsible.vue'
+export { default as CollapsibleTrigger } from './CollapsibleTrigger.vue'
+export { default as CollapsibleContent } from './CollapsibleContent.vue'
diff --git a/WebUI/src/components/ui/input/Input.vue b/WebUI/src/components/ui/input/Input.vue
new file mode 100644
index 00000000..a7d9ed70
--- /dev/null
+++ b/WebUI/src/components/ui/input/Input.vue
@@ -0,0 +1,24 @@
+<script setup lang="ts">
+import type { HTMLAttributes } from 'vue'
+import { useVModel } from '@vueuse/core'
+import { cn } from '@/lib/utils'
+
+const props = defineProps<{
+  defaultValue?: string | number
+  modelValue?: string | number
+  class?: HTMLAttributes['class']
+}>()
+
+const emits = defineEmits<{
+  (e: 'update:modelValue', payload: string | number): void
+}>()
+
+const modelValue = useVModel(props, 'modelValue', emits, {
+  passive: true,
+  defaultValue: props.defaultValue,
+})
+</script>
+
+<template>
+  <input type="password" v-model="modelValue" :class="cn('flex h-9 w-full rounded-md border bg-[var(--textbox-bg)] px-3 py-1 text-sm shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-slate-500 focus-visible:outline-none focus-visible:border-[var(--color-active)] disabled:cursor-not-allowed disabled:opacity-50 ', props.class)">
+</template>
diff --git a/WebUI/src/components/ui/input/index.ts b/WebUI/src/components/ui/input/index.ts
new file mode 100644
index 00000000..a691dd6c
--- /dev/null
+++ b/WebUI/src/components/ui/input/index.ts
@@ -0,0 +1 @@
+export { default as Input } from './Input.vue'
diff --git a/WebUI/src/components/ui/slider/ResolutionPicker.vue b/WebUI/src/components/ui/slider/ResolutionPicker.vue
new file mode 100644
index 00000000..9174a4bb
--- /dev/null
+++ b/WebUI/src/components/ui/slider/ResolutionPicker.vue
@@ -0,0 +1,149 @@
+<script setup lang="ts">
+import { type HTMLAttributes, computed } from 'vue'
+import type { SliderRootEmits, SliderRootProps } from 'radix-vue'
+import { SliderRange, SliderRoot, SliderThumb, SliderTrack } from 'radix-vue'
+import { cn } from '@/lib/utils'
+import { clsx } from 'clsx'
+import { useGlobalSetup } from '@/assets/js/store/globalSetup'
+
+const props = defineProps<SliderRootProps & { class?: HTMLAttributes['class'] }>()
+const emits = defineEmits<SliderRootEmits>()
+
+const globalSetup = useGlobalSetup();
+
+const resolutionsSDXL = [{
+  width: 1536,
+  height: 640,
+  aspectRatio: '12/5'
+}, {
+  width: 1344,
+  height: 768,
+  aspectRatio: '16/9'
+}, {
+  width: 1248,
+  height: 832,
+  aspectRatio: '3/2'
+}, {
+  width: 1152,
+  height: 864,
+  aspectRatio: '4/3'
+}, {
+  width: 1024,
+  height: 1024,
+  aspectRatio: '1/1'
+}, {
+  width: 864,
+  height: 1152,
+  aspectRatio: '3/4'
+}, {
+  width: 832,
+  height: 1248,
+  aspectRatio: '2/3'
+}, {
+  width: 768,
+  height: 1344,
+  aspectRatio: '9/16'
+}, {
+  width: 640,
+  height: 1536,
+  aspectRatio: '5/12'
+}]
+
+const resolutionsSD15 = [{
+  width: 768,
+  height: 320,
+  aspectRatio: '12/5'
+}, {
+  width: 672,
+  height: 384,
+  aspectRatio: '16/9'
+}, {
+  width: 624,
+  height: 416,
+  aspectRatio: '3/2'
+}, {
+  width: 576,
+  height: 432,
+  aspectRatio: '4/3'
+}, {
+  width: 512,
+  height: 512,
+  aspectRatio: '1/1'
+}, {
+  width: 432,
+  height: 576,
+  aspectRatio: '3/4'
+}, {
+  width: 416,
+  height: 624,
+  aspectRatio: '2/3'
+}, {
+  width: 384,
+  height: 672,
+  aspectRatio: '9/16'
+}, {
+  width: 320,
+  height: 768,
+  aspectRatio: '5/12'
+}]
+
+const isSDXL = computed(() => globalSetup.modelSettings.resolution === 1)
+
+const resolutions = computed(() => {
+  if (isSDXL.value) return resolutionsSDXL
+  return resolutionsSD15
+})
+
+const resolutionIndexFromModelSettings = computed(() => {
+  const fromModelSettings = resolutions.value.findIndex(r => r.width === globalSetup.modelSettings.width && r.height === globalSetup.modelSettings.height)
+  if (fromModelSettings !== -1) return fromModelSettings
+  return resolutions.value.findIndex(r => r.aspectRatio === '1/1')
+})
+
+const model = ref([resolutionIndexFromModelSettings.value])
+
+watchEffect(() => {
+  model.value = [resolutionIndexFromModelSettings.value]
+})
+watchEffect(() => {
+  if (props.disabled) return;
+  globalSetup.applyModelSettings(resolutions.value[model.value[0]])
+})
+</script>
+
+<template>
+  <div class="flex flex-col px-10">
+    <div class="flex flex-row justify-between">
+      <div class="w-10 h-10 mb-2 -mr-4 -ml-4 flex flex-row items-center justify-center" v-for="res, i in resolutions">
+        <div @click="() => { if (!props.disabled) model[0] = i }" v-if="i % 2 === 0"
+          :className="clsx({ 'cursor-pointer': !props.disabled }, 'bg-[var(--color-control-bg)] border', { 'border-gray-500': model[0] !== i || disabled, 'border-white': model[0] === i && !disabled })"
+          :style="{ height: `${(res.height / (isSDXL ? 40 : 25) ).toFixed(0)}px`, width: `${(res.width / (isSDXL ? 40 : 25)).toFixed(0)}px` }">
+        </div>
+      </div>
+    </div>
+    <SliderRoot :class="cn(
+      'relative flex w-full touch-none select-none items-center',
+      props.class,
+    )" v-model="model" :min="0" :max="resolutions.length - 1" :step="1" :disabled="disabled">
+      <SliderTrack class="relative h-1.5 w-full grow overflow-hidden rounded-full bg-[#28282b]">
+        <SliderRange :className="clsx('absolute h-full', {'bg-gradient': !disabled})"/>
+      </SliderTrack>
+      <SliderThumb v-if="!disabled" v-for="(_, key) in model" :key="key"
+        :className="clsx('block h-3 w-3 rounded-full border border-[#4e80ff] bg-white transition-colors', { 'cursor-pointer': !disabled })" />
+
+    </SliderRoot>
+    <div className='mt-1.5 flex flex-row justify-between -mr-4 -ml-4'>
+      <span v-for="i in Array.from({ length: resolutions.length }).map((_, i) => i)" :key="`asdf-${i}`"
+        :className="clsx('text-center w-10 h-10 text-sm text-10 select-none', { 'cursor-pointer': !disabled }, { 'font-light opacity-60': model[0] !== i || disabled })"
+        role='presentation' @click="() => { if (!disabled) model[0] = i }">
+        {{ i % 1 === 0 ? resolutions[i].aspectRatio : '|' }}
+      </span>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.bg-gradient {
+  background: var(--main-gradient);
+}
+</style>
\ No newline at end of file
diff --git a/WebUI/src/components/ui/slider/index.ts b/WebUI/src/components/ui/slider/index.ts
new file mode 100644
index 00000000..59242fa1
--- /dev/null
+++ b/WebUI/src/components/ui/slider/index.ts
@@ -0,0 +1 @@
+export { default as ResolutionPicker } from './ResolutionPicker.vue'
diff --git a/WebUI/src/env.d.ts b/WebUI/src/env.d.ts
index 086d35e0..89b83dbf 100644
--- a/WebUI/src/env.d.ts
+++ b/WebUI/src/env.d.ts
@@ -1,9 +1,19 @@
 declare interface Window {
     chrome: Chrome;
     electronAPI: electronAPI;
+    envVars: { platformTitle: string };
+}
+
+interface ImportMetaEnv {
+  readonly VITE_PLATFORM_TITLE: string
+}
+
+interface ImportMeta {
+  readonly env: ImportMetaEnv
 }
 
 type electronAPI = {
+    openDevTools(): void
     openUrl(url: string): void
     changeWindowMessageFilter(): void;
     getWinSize(): Promise<{
@@ -12,6 +22,7 @@ type electronAPI = {
         maxChatContentHeight: number;
     }>;
     getLocalSettings(): Promise<LocalSettings>;
+    getThemeSettings(): Promise<ThemeSettings>;
     setWinSize(width: number, height: number): Promise<void>;
     showSaveDialog(options: Electron.SaveDialogOptions): Promise<Electron.SaveDialogReturnValue>
     showMessageBox(options: Electron.MessageBoxOptions): Promise<number>
@@ -30,17 +41,30 @@ type electronAPI = {
     webServiceExit(callback: (serviceName: string, normalExit: string) => void): void;
     existsPath(path: string): Promise<boolean>;
     getInitSetting(): Promise<SetupData>
+    getPythonBackendStatus(): Promise<BackendStatus>
     updateModelPaths(modelPaths: ModelPaths): Promise<ModelLists>,
     restorePathsSettings():Promise<void>,
     refreshSDModles(): Promise<string[]>,
     refreshLLMModles(): Promise<string[]>,
     refreshLora(): Promise<string[]>,
+    refreshEmbeddingModels(): Promise<string[]>,
     refreshInpaintModles(): Promise<string[]>,
+    getDownloadedDiffusionModels(): Promise<string[]>,
+    getDownloadedInpaintModels(): Promise<string[]>,
+    getDownloadedLoras(): Promise<string[]>,
+    getDownloadedLLMs(): Promise<string[]>,
+    getDownloadedEmbeddingModels(): Promise<string[]>,
     openImageWithSystem(url: string): void,
     selecteImage(url: string): void,
-    setFullScreen(enable: boolean): void
+    setFullScreen(enable: boolean): void,
+    onReportError(callback: (errorMessage: string) => void): void,
+    onDebugLog(callback: (data: { level: 'error' | 'info', source: 'ai-backend', message: string}) => void): void,
 };
 
+type PythonBackendStatus = {
+    status: "running" | "stopped"
+}
+
 type Chrome = {
     webview: WebView;
 };
@@ -125,6 +149,7 @@ type DropListItem = {
 type ChatItem = {
     question: string,
     answer: string,
+    title?: string,
 }
 
 type ChatRequestParams = {
@@ -140,7 +165,7 @@ type RagFileItem = {
 }
 
 
-type LLMOutCallback = LoadModelCallback | LLMOutTextCallback | DownloadModelProgressCallback | DownloadModelCompleted | ErrorOutCallback | NotEnoughDiskSpaceExceptionCallback;
+type LLMOutCallback = LoadModelCallback | LoadModelAllComplete | LLMOutTextCallback | DownloadModelProgressCallback | DownloadModelCompleted | ErrorOutCallback | NotEnoughDiskSpaceExceptionCallback;
 
 type LLMOutTextCallback = {
     type: "text_out",
@@ -150,6 +175,10 @@ type LLMOutTextCallback = {
 
 type SDOutCallback = LoadModelCallback | LoadModelcomponentsCallback | SDOutImagelCallback | SDStepEndCallback | ErrorOutCallback | NotEnoughDiskSpaceExceptionCallback;
 
+type LoadModelAllComplete = {
+    type: "allComplete"
+}
+
 type LoadModelCallback = {
     type: "load_model",
     event: "start" | "finish"
@@ -164,6 +193,7 @@ type SDOutImagelCallback = {
     type: "image_out",
     index: number,
     image: string,
+    safe_check_pass: boolean,
     params: KVObject,
 }
 
@@ -261,7 +291,7 @@ type CheckModelExistParam = {
 
 type DownloadModelParam = CheckModelExistParam
 
-type DownloadModelRender = { size: string } & CheckModelExistParam
+type DownloadModelRender = { size: string, gated?: boolean } & CheckModelExistParam
 
 type CheckModelExistResult = {
     exist: boolean
diff --git a/WebUI/src/lib/utils.ts b/WebUI/src/lib/utils.ts
new file mode 100644
index 00000000..d32b0fe6
--- /dev/null
+++ b/WebUI/src/lib/utils.ts
@@ -0,0 +1,6 @@
+import { type ClassValue, clsx } from 'clsx'
+import { twMerge } from 'tailwind-merge'
+
+export function cn(...inputs: ClassValue[]) {
+  return twMerge(clsx(inputs))
+}
diff --git a/WebUI/src/main.ts b/WebUI/src/main.ts
index 8ff72509..f9424519 100644
--- a/WebUI/src/main.ts
+++ b/WebUI/src/main.ts
@@ -1,10 +1,14 @@
 import { createApp } from 'vue';
 import App from './App.vue';
 import { createPinia } from "pinia";
+import piniaPluginPersistedstate from 'pinia-plugin-persistedstate'
 import { useI18N } from './assets/js/store/i18n';
 
 const app = createApp(App);
 app.use(createPinia());
+const pinia = createPinia();
+pinia.use(piniaPluginPersistedstate)
+app.use(pinia);
 const i18n = useI18N();
 i18n.init().then(() => {
     const languages = i18n.state;
diff --git a/WebUI/src/views/Answer.vue b/WebUI/src/views/Answer.vue
index 865bfdae..7c24cfd1 100644
--- a/WebUI/src/views/Answer.vue
+++ b/WebUI/src/views/Answer.vue
@@ -1,85 +1,130 @@
 <template>
-    <div id="answerPanel" class="h-full flex flex-col p-4 relative">
-        <div id="chatPanel" class="chat-panel flex-auto flex flex-col h-0 gap-6 m-4 overflow-y-auto text-white text-sm">
-            <template v-for="chat, i in chatHistories">
-                <div class="flex items-start gap-3">
-                    <img src="@/assets/svg/user-icon.svg" />
-                    <div class="flex flex-col gap-3 max-w-3/4">
-                        <p>{{ languages.ANSWER_USER_NAME }}</p>
-                        <div class="chat-content" v-html="util.processHTMLTag(chat.question)"></div>
+    <div id="answerPanel" class="h-full flex flex-col pr-4 pb-4 relative bg-origin-padding ">
+        <div class="flex flex-row flex-auto overflow-y-auto">
+            <div id="chatHistoryPanel" :class="{ 'w-12': !isHistoryVisible, 'w-56': isHistoryVisible }"
+                class="flex flex-shrink-0 flex-col justify-between overflow-y-auto bg-gradient-to-r from-[#05010fb4]/20 to-[#05010fb4]/70 transition-all">
+                <div class="flex flex-col-reverse">
+                    <div v-if="isHistoryVisible" v-for="(conversation, conversationKey) in conversations.conversationList" :key="conversationKey"
+                        @click="() => conversations.activeKey = conversationKey" :title="conversation?.[0]?.title ?? 'New Conversation'"
+                        class="flex justify-between items-center h-12 cursor-pointer text-gray-300 p-4 hover:bg-[#00c4fa]/50"
+                        :class="conversations.activeKey === conversationKey ? 'bg-[#00c4fa]/50' : ''">
+                        <span class="w-40 whitespace-nowrap overflow-x-auto text-ellipsis">{{ conversation?.[0]?.title ?? 'New Conversation' }}</span>
+                        <span v-if="!conversations.isNewConversation(conversationKey)" @click="() => conversations.deleteConversation(conversationKey)" class="svg-icon i-delete w-5 h-5"></span>
                     </div>
-                </div>
-                <div class="flex items-start gap-3">
-                    <img src="@/assets/svg/ai-icon.svg" />
-                    <div class="flex flex-col gap-3 bg-gray-600 rounded-md px-4 py-3 max-w-3/4 text-wrap break-words">
-                        <p>{{ languages.ANSWER_AI_NAME }}</p>
-                        <div class="ai-answer chat-content" v-html="markdownParser.parseMarkdown(chat.answer)"></div>
-                        <div class="answer-tools flex gap-3 items-center text-gray-300">
-                            <button class="flex items-end" :title="languages.COM_COPY" @click="copyText">
-                                <span class="svg-icon i-copy w-4 h-4"></span>
-                                <span class="text-xs ml-1">{{ languages.COM_COPY }}</span>
-                            </button>
-                            <button class="flex items-end" :title="languages.COM_REGENERATE"
-                                @click="regenerate(chat, i)" v-if="i + 1 == chatHistories.length">
-                                <span class="svg-icon i-refresh w-4 h-4"></span>
-                                <span class="text-xs ml-1">{{ languages.COM_REGENERATE }}</span>
-                            </button>
-                            <button class="flex items-end" :title="languages.COM_DELETE" @click="deleteChat(i)">
-                                <span class="svg-icon i-delete w-4 h-4"></span>
-                                <span class="text-xs ml-1">{{ languages.COM_DELETE }}</span>
-                            </button>
-                        </div>
+                    <div v-else v-for="(conversation, conversationKey) in conversations.conversationList" :inVisibleKey="conversationKey"
+                        @click="() => conversations.activeKey = conversationKey" :title="conversation?.[0]?.title ?? 'New Conversation'"
+                        class="flex justify-between items-center h-12 py-2 cursor-pointer hover:bg-[#00c4fa]/50"
+                        :class="conversations.activeKey === conversationKey ? 'bg-[#00c4fa]/50' : ''">
+                        <svg v-if="conversations.isNewConversation(conversationKey)" class="m-auto h-8 w-8 text-gray-300"  fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                            <path stroke-linecap="round" stroke-linejoin="round" d="M12 9v6m3-3H9m12 0a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
+                        </svg>
+                        <svg v-else class="m-auto h-8 w-8 text-gray-300" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="1" d="M17 8h2a2 2 0 012 2v6a2 2 0 01-2 2h-2v4l-4-4H9a1.994 1.994 0 01-1.414-.586m0 0L11 14h4a2 2 0 002-2V6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2v4l.586-.586z"/>
+                        </svg>
+
                     </div>
                 </div>
-            </template>
-            <div class="flex items-start gap-3" v-show="processing">
-                <img src="@/assets/svg/user-icon.svg" />
-                <div class="flex flex-col gap-3 max-w-3/4">
-                    <p>{{ languages.ANSWER_USER_NAME }}</p>
-                    <p v-html="textIn"></p>
+                <div class="flex justify-end">
+                    <button @click="isHistoryVisible = !isHistoryVisible" class="m-2 flex text-white">
+                        <img v-if="!isHistoryVisible" :class="iconSizeClass" src="@/assets/svg/expand.svg" class="w-8 h-8" />
+                        <img v-else :class="iconSizeClass" src="@/assets/svg/collapse.svg" class="w-8 h-8" />
+                    </button>
                 </div>
             </div>
-            <div class="flex items-start gap-3" v-show="processing">
-                <img src="@/assets/svg/ai-icon.svg" />
-                <div class="flex flex-col gap-3 bg-gray-600 rounded-md px-4 py-3 max-w-3/4  text-wrap break-words">
-                    <p>{{ languages.ANSWER_AI_NAME }}</p>
-                    <div v-if="!downloadModel.downloading && !loadingModel" class="ai-answer cursor-block break-all"
-                        v-html="textOut">
+            <div id="chatPanel" class="p-4 chat-panel flex-auto flex flex-col gap-6 m-4 text-white overflow-y-scroll"
+                :class="fontSizeClass">
+                <template v-for="chat, i in conversations.activeConversation">
+                    <div class="flex items-start gap-3">
+                        <img :class="iconSizeClass" src="@/assets/svg/user-icon.svg" />
+                        <div class="flex flex-col gap-3 max-w-3/4">
+                            <p class="text-gray-300" :class="nameSizeClass">{{ languages.ANSWER_USER_NAME }}</p>
+                            <div class="chat-content" v-html="util.processHTMLTag(chat.question)"></div>
+                        </div>
+                    </div>
+                    <div class="flex items-start gap-3">
+                        <img :class="iconSizeClass" src="@/assets/svg/ai-icon.svg" />
+                        <div
+                            class="flex flex-col gap-3 bg-gray-600 rounded-md px-4 py-3 max-w-3/4 text-wrap break-words">
+                            <p class="text-gray-300" :class="nameSizeClass">{{ languages.ANSWER_AI_NAME }}</p>
+                            <div class="ai-answer chat-content" v-html="markdownParser.parseMarkdown(chat.answer)">
+                            </div>
+                            <div class="answer-tools flex gap-3 items-center text-gray-300">
+                                <button class="flex items-end" :title="languages.COM_COPY" @click="copyText">
+                                    <span class="svg-icon i-copy w-4 h-4"></span>
+                                    <span class="text-xs ml-1">{{ languages.COM_COPY }}</span>
+                                </button>
+                                <button class="flex items-end" :title="languages.COM_REGENERATE"
+                                    @click="() => regenerateLastResponse(conversations.activeKey)"
+                                    v-if="i + 1 == conversations.activeConversation.length">
+                                    <span class="svg-icon i-refresh w-4 h-4"></span>
+                                    <span class="text-xs ml-1">{{ languages.COM_REGENERATE }}</span>
+                                </button>
+                                <button class="flex items-end" :title="languages.COM_DELETE" @click="() => conversations.deleteItemFromConversation(conversations.activeKey, i)">
+                                    <span class="svg-icon i-delete w-4 h-4"></span>
+                                    <span class="text-xs ml-1">{{ languages.COM_DELETE }}</span>
+                                </button>
+                            </div>
+                        </div>
+                    </div>
+                </template>
+                <div class="flex items-start gap-3" v-show="processing">
+                    <img :class="iconSizeClass" src="@/assets/svg/user-icon.svg" />
+                    <div class="flex flex-col gap-3 max-w-3/4">
+                        <p class="text-gray-300" :class="nameSizeClass">{{ languages.ANSWER_USER_NAME }}</p>
+                        <p v-html="textIn"></p>
                     </div>
-                    <div v-else class="px-20 h-24 w-768px flex items-center justify-center">
-                        <progress-bar v-if="downloadModel.downloading" :text="downloadModel.text"
-                            :percent="downloadModel.percent" class="w-512px"></progress-bar>
-                        <loading-bar v-else-if="loadingModel" :text="languages.COM_LOADING_MODEL"
-                            class="w-512px"></loading-bar>
+                </div>
+                <div class="flex items-start gap-3" v-show="processing">
+                    <img :class="iconSizeClass" src="@/assets/svg/ai-icon.svg" />
+                    <div class="flex flex-col gap-3 bg-gray-600 rounded-md px-4 py-3 max-w-3/4  text-wrap break-words">
+                        <p class="text-gray-300" :class="nameSizeClass">{{ languages.ANSWER_AI_NAME }}</p>
+                        <div v-if="!downloadModel.downloading && !loadingModel" class="ai-answer cursor-block break-all"
+                            v-html="textOut">
+                        </div>
+                        <div v-else class="px-20 h-24 w-768px flex items-center justify-center">
+                            <progress-bar v-if="downloadModel.downloading" :text="downloadModel.text"
+                                :percent="downloadModel.percent" class="w-512px"></progress-bar>
+                            <loading-bar v-else-if="loadingModel" :text="languages.COM_LOADING_MODEL"
+                                class="w-512px"></loading-bar>
+                        </div>
                     </div>
                 </div>
             </div>
         </div>
-        <div class="h-48 gap-3 flex-none flex items-center justify-center relative border-t border-color-spilter pt-4">
+        <div class="pl-4 h-48 gap-3 flex-none flex items-center justify-center relative border-t border-color-spilter pt-4">
             <div class="flex flex-col gap-2 flex-auto h-full">
                 <div class="flex items-center justify-between gap-5 text-white px-2">
                     <div class="flex items-center">
-                        <drop-selector :array="globalSetup.models.llm" @change="changeLLMModel" class="w-96">
+                        <drop-selector :array="models.llms" @change="changeLLMModel" class="w-96">
                             <template #selected>
-                                <div class="flex gap-2 items-center overflow-hidden text-ellipsis">
-                                    <span class="rounded-full bg-green-500 w-2 h-2"></span>
-                                    <span>{{ globalSetup.modelSettings.llm_model }}</span>
-                                </div>
+                                <model-drop-down-item
+                                    :model="models.llms.find((m) => m.name === globalSetup.modelSettings.llm_model)"></model-drop-down-item>
                             </template>
                             <template #list="slotItem">
-                                <div class="flex gap-2 items-center text-ellipsis" :title="slotItem.item">
-                                    <span class="rounded-full bg-green-500 w-2 h-2"></span>
-                                    <span class="h-7 overflow-hidden">{{ slotItem.item }}</span>
-                                </div>
+                                <model-drop-down-item :model="slotItem.item"></model-drop-down-item>
                             </template>
                         </drop-selector>
                         <button class="svg-icon i-refresh w-5 h-5 text-purple-500 flex-none ml-1"
                             @animationend="removeRonate360" @click="refreshLLMModles"></button>
-                        <button
+                        <!-- <button
                             class="flex items-center flex-none justify-center gap-2 border border-white rounded-md text-sm px-4 py-1 ml-6"
-                            @click="clearSession">
+                            @click="() => conversations.clearConversation(conversations.activeKey)">
                             <span class="svg-icon i-clear w-4 h-4"></span>
                             <span>{{ languages.ANSWER_ERROR_CLEAR_SESSION }}</span>
+                        </button> -->
+                        <button
+                            class="flex items-center flex-none justify-center gap-2 border border-white rounded-md text-sm px-4 py-1 ml-2"
+                            @click="increaseFontSize" :disabled="isMaxSize"
+                            :class="{ 'opacity-50 cursor-not-allowed': isMaxSize }">
+                            <span class="svg-icon i-zoom-in w-4 h-4"></span>
+                            <span>{{ languages.INCREASE_FONT_SIZE }}</span>
+                        </button>
+                        <button
+                            class="flex items-center flex-none justify-center gap-2 border border-white rounded-md text-sm px-4 py-1 ml-2"
+                            @click="decreaseFontSize" :disabled="isMinSize"
+                            :class="{ 'opacity-50 cursor-not-allowed': isMinSize }">
+                            <span class="svg-icon i-zoom-out w-4 h-4"></span>
+                            <span>{{ languages.DECREASE_FONT_SIZE }}</span>
                         </button>
                     </div>
                     <div class="flex justify-center items-center gap-2">
@@ -142,21 +187,25 @@ import ProgressBar from "../components/ProgressBar.vue";
 import LoadingBar from "../components/LoadingBar.vue";
 import DropSelector from "@/components/DropSelector.vue";
 import DownloadDialog from "@/components/DownloadDialog.vue";
+import ModelDropDownItem from "@/components/ModelDropDownItem.vue";
 import { useI18N } from '@/assets/js/store/i18n';
 import { toast } from '@/assets/js/toast';
 import { util } from '@/assets/js/util';
 import { SSEProcessor } from "@/assets/js/sseProcessor";
 import { useGlobalSetup } from "@/assets/js/store/globalSetup";
+import { Model, useModels } from "@/assets/js/store/models";
 import { MarkdownParser } from "@/assets/js/markdownParser";
 import "highlight.js/styles/github-dark.min.css";
 import { Const } from "@/assets/js/const";
+import { useConversations } from "@/assets/js/store/conversations";
 
+const conversations = useConversations();
+const models = useModels();
 const globalSetup = useGlobalSetup();
 const i18nState = useI18N().state
 const question = ref("");
 const processing = ref(false);
 let textOutFinish = false;
-const chatHistories = ref<ChatItem[]>([]);
 let abortController = new AbortController();
 const textOutQueue = new Array<string>();
 const textIn = ref("");
@@ -185,6 +234,29 @@ const emits = defineEmits<{
 }>();
 let abortContooler: AbortController | null;
 const stopping = ref(false);
+const fontSizeIndex = ref(1); // sets default to text-sm
+
+const fontSizes = ['text-xs', 'text-sm', 'text-base', 'text-lg', 'text-xl', 'text-2xl', 'text-3xl', 'text-4xl', 'text-5xl', 'text-6xl', 'text-7xl', 'text-8xl', 'text-9xl'];
+const iconSizes = ['size-[40px]', 'size-[42px]', 'size-[44px]', 'size-[46px]', 'size-[48px]', 'size-[50px]', 'size-[52px]', 'size-[54px]', 'size-[56px]', 'size-[58px]', 'size-[60px]', 'size-[62px]', 'size-[64px]'];
+const fontSizeClass = computed(() => fontSizes[fontSizeIndex.value]);
+const nameSizeClass = computed(() => fontSizes[Math.max(fontSizeIndex.value - 2, 0)]);
+const iconSizeClass = computed(() => iconSizes[fontSizeIndex.value]);
+const isMaxSize = computed(() => fontSizeIndex.value >= fontSizes.length - 1);
+const isMinSize = computed(() => fontSizeIndex.value <= 0);
+const isHistoryVisible = ref(false);
+
+const increaseFontSize = () => {
+    if (!isMaxSize.value) {
+        fontSizeIndex.value++;
+    }
+};
+
+const decreaseFontSize = () => {
+    if (!isMinSize.value) {
+        fontSizeIndex.value--;
+    }
+};
+
 
 onMounted(async () => {
     chatPanel = document.getElementById("chatPanel")!;
@@ -196,12 +268,13 @@ function finishGenerate() {
 
 function dataProcess(line: string) {
     console.log(`[${util.dateFormat(new Date(), "hh:mm:ss:fff")}] LLM data: ${line}`);
+
     const dataJson = line.slice(5);
     const data = JSON.parse(dataJson) as LLMOutCallback;
     switch (data.type) {
         case "text_out":
             if (data.dtype == 1) {
-                const text = (firstOutput ? data.value : data.value).replace(/<[^>]+>/g, "");
+                const text = (firstOutput ? data.value : data.value) //.replace(/<[^>]+>/g, "");
                 textOutQueue.push(text);
                 if (firstOutput) {
                     firstOutput = false;
@@ -248,6 +321,38 @@ function scrollToBottom(smooth = true) {
     }
 }
 
+async function updateTitle(conversation: ChatItem[]) {
+    const instruction = `Create me a short descriptive title for the following conversation in a maximum of 20 characters. Don't use unnecessary words like 'Conversation about': `;
+    const prompt = `${instruction}\n\n\`\`\`${JSON.stringify(conversation.slice(0, 3).map((item) => ({ question: item.question, answer: item.answer })))}\`\`\``;
+    console.log("prompt", prompt);
+    const chatContext = [{ question: prompt , answer: "" }];
+    const requestParams = {
+        device: globalSetup.modelSettings.graphics,
+        prompt: chatContext,
+        enable_rag: false,
+        model_repo_id: globalSetup.modelSettings.llm_model
+    };
+    const response = await fetch(`${ globalSetup.apiHost }/api/llm/chat`, {
+        method: "POST",
+        headers: {
+            "Content-Type": "application/json"
+        },
+        body: JSON.stringify(requestParams),
+        signal: abortController.signal
+    });
+    const reader = response.body!.getReader();
+    const responses: LLMOutCallback[] = []
+    const getResponse = (line: string) => {
+        responses.push(JSON.parse(line.slice(5)))
+    }
+
+    await new SSEProcessor(reader, getResponse, finishGenerate).start(); // is finishGenerate needed here? Cannot use it because of void input
+
+    const isTextCallback = (item: LLMOutCallback): item is LLMOutTextCallback => item.type == "text_out" && item.dtype == 1;
+    const newTitle = responses.filter(isTextCallback).reduce((acc, item) => acc + item.value, "").replace(/"/g, '');
+    conversation[0].title = newTitle;
+}
+
 async function simulatedInput() {
     while (textOutQueue.length > 0) {
         const newText = textOutQueue.shift()!;
@@ -261,10 +366,14 @@ async function simulatedInput() {
         await util.delay(20);
         await simulatedInput();
     } else {
-        chatHistories.value.push({
+        conversations.addToActiveConversation({
             question: textIn.value,
             answer: ragData.enable && source.value != "" ? `${receiveOut}\r\n\r\n${i18nState.RAG_SOURCE}${source.value}` : receiveOut,
         });
+        if (conversations.activeConversation.length <= 3) {
+            console.log('Conversations is less than 4 items long, generating new title');
+            updateTitle(conversations.activeConversation);
+        }
         processing.value = false;
         textIn.value = "";
         textOut.value = "";
@@ -299,7 +408,7 @@ async function newPromptGenerate() {
     }
     try {
         await checkModel();
-        const chatContext = [...toRaw(chatHistories.value)];
+        const chatContext = JSON.parse(JSON.stringify(conversations.activeConversation));
         chatContext.push({ question: newPrompt, answer: "" });
         generate(chatContext);
         question.value = "";
@@ -386,32 +495,25 @@ function removeRonate360(ev: AnimationEvent) {
     target.classList.remove("animate-ronate360");
 }
 
-function changeLLMModel(item: any, _: number) {
-    globalSetup.applyModelSettings({ llm_model: item as string });
+function changeLLMModel(model: Model, _: number) {
+    globalSetup.applyModelSettings({ llm_model: model.name });
 }
 
 async function refreshLLMModles(e: Event) {
     const button = e.target as HTMLElement;
     button.classList.add("animate-ronate360");
-    await globalSetup.refreshLLMModles();
-}
-
-async function clearSession() {
-    chatHistories.value.splice(0, chatHistories.value.length);
+    await models.refreshModels();
 }
 
-function regenerate(item: ChatItem, index: number) {
+function regenerateLastResponse(conversationKey: string) {
+    const item = conversations.conversationList[conversationKey].pop();
+    if (!item) return;
     const prompt = item.question;
-    chatHistories.value.splice(index, 1);
-    const chatContext = [...toRaw(chatHistories.value)];
+    const chatContext = [...toRaw(conversations.conversationList[conversationKey])];
     chatContext.push({ question: prompt, answer: "" });
     generate(chatContext);
 }
 
-function deleteChat(index: number) {
-    chatHistories.value.splice(index, 1);
-}
-
 function copyCode(e: MouseEvent) {
     let target: HTMLElement | null = e.target as HTMLElement;
     while (target && target != chatPanel) {
diff --git a/WebUI/src/views/AppSettings.vue b/WebUI/src/views/AppSettings.vue
index 5195c45b..c9bebf49 100644
--- a/WebUI/src/views/AppSettings.vue
+++ b/WebUI/src/views/AppSettings.vue
@@ -1,6 +1,29 @@
 <template>
     <div id="app-settings-panel"
         class="settings-panel absolute right-0 top-0 h-full bg-color-bg-main text-sm text-white py-4">
+         <dialog ref="hdConfirmationDialog" class="bg-gray-600 max-w-md p-7 items-center justify-center rounded-lg shadow-lg  text-white">
+            <form method="dialog" class="items-center justify-center">
+            <p class="mb-4">
+                {{ languages.SETTINGS_MODEL_IMAGE_RESOLUTION_HD_CONFIRM }}
+            </p>
+            <div class="flex justify-between space-x-4 items-center">
+                <button class="bg-slate-700 py-1 px-4 rounded">
+                    {{ languages.COM_CANCEL }}
+                </button>
+                <div class="flex-end space-x-4">
+                    <button @click="() => changeResolution(1, true)" class="bg-color-active py-1 px-4 rounded">
+                        {{ languages.COM_CONFIRM }}
+                    </button>
+                    <button @click="() => { 
+                        globalSetup.hdPersistentConfirmation = true; 
+                        changeResolution(1, true) 
+                        }" class="bg-blue-500 py-1 px-4 rounded">
+                        {{ languages.COM_DO_NOT_SHOW_AGAIN }}
+                    </button>
+                </div>
+            </div>
+            </form>
+        </dialog>
         <div class="flex justify-between items-center px-3">
             <div class="flex items-center gap-2">
                 <button class="panel-tab" :class="{ 'active': tabIndex == 0 }" @click="tabIndex = 0">
@@ -26,6 +49,13 @@
                             @click="() => { i18n.switchLanguage('zh_CN') }"></radio-bolck>
                     </div>
                 </div>
+                <div v-if="theme.availableThemes.length > 1" class="flex flex-col gap-2">
+                    <p>Theme</p>
+                    <div class="grid grid-cols-2 gap-2">
+                        <radio-bolck class="uppercase" v-for="themeName in theme.availableThemes" :checked="theme.active === themeName" :text="themeName"
+                            @click="() => theme.selected = themeName"></radio-bolck>
+                    </div>
+                </div>
                 <div class="flex flex-col gap-2">
                     <p>{{ languages.SETTINGS_INFERENCE_DEVICE }}</p>
                     <div class="flex items-center gap-2 flex-wrap">
@@ -82,28 +112,12 @@
             <div class="overflow-y-auto">
                 <div class="border-t border-color-spilter flex-auto justify-center pt-3 grid grid-cols-1 gap-5 mx-3">
                     <h2 class="text-center font-bold">{{ languages.SETTINGS_MODEL_ADJUSTABLE_OPTIONS }}</h2>
-                    <!-- 
-                    <div class="flex flex-col gap-2">
-                        <p>Fast Resolution</p>
-                        <drop-selector :array="sizePreset" @change="changeSize">
-                            <template #selected>
-                                <span>{{ sizeChoose }}</span>
-                            </template>
-<template #list="slotItem">
-                                <span>{{ `${slotItem.item.width} x ${slotItem.item.height}` }}</span>
-                            </template>
-</drop-selector>
-</div>
--->
                     <div class="flex flex-col gap-2">
-                        <p>{{ languages.SETTINGS_MODEL_IMAGE_WIDTH }}</p>
-                        <slide-bar v-model:current="modelSettings.width" :min="widthRange.min" :max="widthRange.max"
-                            :step="8" @update:current="applyModelSettings"></slide-bar>
-                    </div>
-                    <div class="flex flex-col gap-2">
-                        <p>{{ languages.SETTINGS_MODEL_IMAGE_HEIGHT }}</p>
-                        <slide-bar v-model:current="modelSettings.height" :min="heightRange.min" :max="heightRange.max"
-                            :step="8" @update:current="applyModelSettings"></slide-bar>
+                        <div class="flex flex-row justify-between">
+                            <span>{{ languages.SETTINGS_MODEL_IMAGE_SIZE }}</span>
+                            <span class="rounded-sm border border-[#666] py-0.5 px-2 bg-[var(--color-control-bg)]">{{ globalSetup.modelSettings.width }} x {{ globalSetup.modelSettings.height }}</span>
+                        </div>
+                        <ResolutionPicker :disabled="modelSettings.resolution === 3" />
                     </div>
                     <div class="flex flex-col gap-2">
                         <p>{{ languages.SETTINGS_MODEL_IMAGE_STEPS }}</p>
@@ -178,6 +192,20 @@
                                 @click="refreshInpaintModles"></button>
                         </div>
                     </div>
+                    <div class="flex flex-col gap-2">
+                        <p>{{ languages.SETTINGS_MODEL_IMAGE_WIDTH }}</p>
+                        <slide-bar v-model:current="modelSettings.width" :min="widthRange.min" :max="widthRange.max"
+                            :step="8" @update:current="applyModelSettings"
+                            :disabled="modelSettings.resolution != 3"
+                            ></slide-bar>
+                    </div>
+                    <div class="flex flex-col gap-2">
+                        <p>{{ languages.SETTINGS_MODEL_IMAGE_HEIGHT }}</p>
+                        <slide-bar v-model:current="modelSettings.height" :min="heightRange.min" :max="heightRange.max"
+                            :step="8" @update:current="applyModelSettings"
+                            :disabled="modelSettings.resolution != 3"
+                            ></slide-bar>
+                    </div>
                     <div class="flex flex-col gap-2">
                         <p>{{ languages.SETTINGS_MODEL_SCHEDULER }}</p>
                         <drop-selector :array="globalSetup.models.scheduler" @change="changeScheduler"
@@ -214,6 +242,16 @@
         </div>
         <!--Model-->
         <div v-show="tabIndex == 1" class="px-3 flex flex-col overflow-y-auto">
+            <div class="border-b border-color-spilter flex flex-col gap-5 py-4">
+                <h2 class="text-center font-bold">{{ languages.SETTINGS_MODEL_HUGGINGFACE }}</h2>
+                <div class="flex flex-col gap-3">
+                    <p>{{ languages.SETTINGS_MODEL_HUGGINGFACE_API_TOKEN }}</p>
+                    <div class="flex flex-col items-start gap-1">
+                        <Input v-model="models.hfToken" :class="{ 'border-red-500': models.hfToken && !models.hfTokenIsValid }"/>
+                        <div class="text-xs text-red-500 select-none" :class="{'opacity-0': !(models.hfToken && !models.hfTokenIsValid)}">{{ languages.SETTINGS_MODEL_HUGGINGFACE_INVALID_TOKEN_TEXT }}</div>
+                    </div>
+                </div>
+            </div>
             <div class="border-b border-color-spilter flex flex-col gap-5 py-4">
                 <h2 class="text-center font-bold">{{ languages.SETTINGS_MODEL_SD_PRESET_MODEL }}</h2>
                 <div class="flex flex-col gap-3">
@@ -450,13 +488,19 @@ import SlideBar from "../components/SlideBar.vue";
 import RadioBolck from "../components/RadioBlock.vue";
 import RandomNumber from "../components/RandomNumber.vue";
 import FolderSelector from "../components/FolderSelector.vue";
+import { Input } from '@/components/ui/input'
+import { ResolutionPicker } from "../components/ui/slider";
 import { useGlobalSetup } from "@/assets/js/store/globalSetup";
 import { useI18N } from "@/assets/js/store/i18n";
 import { toast } from "@/assets/js/toast";
 import { Const } from "@/assets/js/const";
+import { useModels } from "@/assets/js/store/models";
+import { useTheme } from "@/assets/js/store/theme";
 
 const i18n = useI18N();
 const globalSetup = useGlobalSetup();
+const models = useModels();
+const theme = useTheme();
 const tabIndex = ref(0);
 const modelSettings = reactive<KVObject>(Object.assign({}, toRaw(globalSetup.modelSettings)));
 const paths = reactive<ModelPaths>(Object.assign({}, toRaw(globalSetup.paths)));
@@ -470,6 +514,8 @@ const widthRange = ref<NumberRange>({
     max: 768,
 });
 
+const hdConfirmationDialog = ref<HTMLDialogElement>();
+
 const heightRange = ref<NumberRange>({
     min: 256,
     max: 768,
@@ -626,7 +672,11 @@ function applyModelSettings() {
     modelSettingsChange.value = false;
 }
 
-function changeResolution(value: number) {
+function changeResolution(value: number, dialogConfirmation = false) {
+    if (value === 1 && !globalSetup.hdPersistentConfirmation && !dialogConfirmation) {
+        hdConfirmationDialog.value?.showModal();
+        return;
+    }
     modelSettings.resolution = value;
     setModelOptionByPreset();
 }
@@ -675,8 +725,8 @@ function setModelOptionByPreset() {
     } else if (resolution == 1) {
         modelSettings.sd_model = globalSetup.presetModel.SDHD;
         modelSettings.inpaint_model = globalSetup.presetModel.SDHDInpaint;
-        modelSettings.width = 1080;
-        modelSettings.height = 1080;
+        modelSettings.width = 1024;
+        modelSettings.height = 1024;
         if (quality == 0) {
             modelSettings.guidanceScale = 7;
             modelSettings.inferenceSteps = 20;
diff --git a/WebUI/src/views/Create.vue b/WebUI/src/views/Create.vue
index ce8e2c83..c77d475c 100644
--- a/WebUI/src/views/Create.vue
+++ b/WebUI/src/views/Create.vue
@@ -1,8 +1,8 @@
 <template>
     <div id="createPanel" class="h-full flex flex-col p-4">
         <div class="image-panel flex-auto flex p-4">
-            <div v-if="destImg.length > 0" class="image-preview-panel flex-none">
-                <div v-for="image, i in destImg" class="image-preview-item flex items-center justify-center"
+            <div v-if="imageUrls.length > 0" class="image-preview-panel flex-none">
+                <div v-for="image, i in imageUrls" class="image-preview-item flex items-center justify-center"
                     :class="{ 'active': previewIdx == i }" @click="swithPreview(i)">
                     <div class="image-preview-item-bg">
                         <img :src="image" class="image-thumb" />
@@ -10,8 +10,8 @@
                 </div>
             </div>
             <div class="flex-auto relative flex items-center justify-center">
-                <div class="flex justify-center items-center w-768px h-512px relative bg-color-image-bg rounded-lg">
-                    <img v-for="image, i in destImg" :src="image" class="max-w-768px max-h-512px"
+                <div class="flex justify-center items-center w-768px h-512px relative bg-color-image-bg rounded-lg border border-white/30">
+                    <img v-for="image, i in imageUrls" :src="image" class="p-1 max-w-768px max-h-512px"
                         v-show="previewIdx == i" />
                     <div v-show="generateIdx == previewIdx && processing"
                         class="absolute left-0 top-0 w-full h-full bg-black/50 flex justify-center items-center">
@@ -90,7 +90,7 @@ const globalSetup = useGlobalSetup();
 const currentState = ref<SDGenerateState>("no_start");
 const previewIdx = ref(0);
 const generateIdx = ref(-999);
-const destImg = ref<string[]>([]);
+const imageUrls = ref<string[]>([]);
 const prompt = ref("")
 const processing = ref(false);
 const stepText = ref("");
@@ -115,22 +115,25 @@ function finishGenerate() {
     processing.value = false;
 }
 
-function updateDestImage(index: number, image: string) {
-    if (index + 1 > destImg.value.length) {
-        destImg.value.push(image);
+async function updateDestImage(index: number, image: string) {
+    if (index + 1 > imageUrls.value.length) {
+        imageUrls.value.push(image);
     } else {
-        destImg.value.splice(index, 1, image);
+        imageUrls.value.splice(index, 1, image);
     }
 }
 
-function dataProcess(line: string) {
+async function dataProcess(line: string) {
     util.log(`SD data: ${line}`);
     const dataJson = line.slice(5);
     const data = JSON.parse(dataJson) as SDOutCallback;
     switch (data.type) {
         case "image_out":
             currentState.value = "image_out";
-            updateDestImage(data.index, data.image);
+            if (!data.safe_check_pass) {
+                data.image = '/src/assets/image/nsfw_result_detected.png'
+            }
+            await updateDestImage(data.index, data.image);
             generateParams.push(data.params);
             generateIdx.value++;
             break;
@@ -138,7 +141,7 @@ function dataProcess(line: string) {
             currentState.value = "generating";
             stepText.value = `${i18nState.COM_GENERATING} ${data.step}/${data.total_step}`;
             if (data.image) {
-                updateDestImage(data.index, data.image);
+                await updateDestImage(data.index, data.image);
             }
             if (data.step == 0) {
                 previewIdx.value = data.index;
@@ -267,29 +270,29 @@ async function stopGenerate() {
 }
 
 function postImageToEnhance() {
-    emits("postImageToEnhance", destImg.value[previewIdx.value]);
+    emits("postImageToEnhance", imageUrls.value[previewIdx.value]);
 }
 
 function openImage() {
-    const path = destImg.value[previewIdx.value];
+    const path = imageUrls.value[previewIdx.value];
     window.electronAPI.openImageWithSystem(path);
 
 }
 
 function selecteImage() {
-    window.electronAPI.selecteImage(destImg.value[previewIdx.value]);
+    window.electronAPI.selecteImage(imageUrls.value[previewIdx.value]);
 }
 
 
 function copyImage() {
-    util.copyImage(destImg.value[previewIdx.value]);
+    util.copyImage(imageUrls.value[previewIdx.value]);
     toast.success(i18nState.COM_COPY_SUCCESS_TIP);
 }
 
 function reset() {
     currentState.value = "no_start";
     generateParams.splice(0, generateParams.length);
-    destImg.value.splice(0, destImg.value.length);
+    imageUrls.value.splice(0, imageUrls.value.length);
     generateIdx.value = -999;
     previewIdx.value = -1;
     downloadModel.downloading = false;
diff --git a/WebUI/src/views/Enhance.vue b/WebUI/src/views/Enhance.vue
index a862c00c..3723c7ab 100644
--- a/WebUI/src/views/Enhance.vue
+++ b/WebUI/src/views/Enhance.vue
@@ -18,7 +18,7 @@
                 </div>
             </div>
             <div class="flex-auto relative flex items-center justify-center">
-                <div class="flex justify-center items-center bg-color-image-bg rounded-lg relative"
+                <div class="flex justify-center items-center bg-color-image-bg rounded-lg relative border border-white/20"
                     style="width: 768px; height: 400px;">
                     <!--inpaint mask-->
                     <div class="relative">
@@ -107,7 +107,7 @@
                         </button>
                     </div>
                     <img v-for=" image, i in destImg " :src="image" v-show="previewIdx == i"
-                        class="max-w-768px max-h-400px" />
+                        class="p-1 max-w-768px max-h-400px" />
                     <div v-show="processing && generateIdx == previewIdx"
                         class="absolute left-0 top-0 w-full h-full bg-black/50 flex justify-center items-center">
                         <loading-bar v-if="['load_model', 'load_model_components'].includes(generateState)"
diff --git a/WebUI/tailwind.config.cjs b/WebUI/tailwind.config.cjs
index c337aee1..e2d4d37d 100644
--- a/WebUI/tailwind.config.cjs
+++ b/WebUI/tailwind.config.cjs
@@ -1,18 +1,26 @@
-// const plugin = require("tailwindcss/plugin");
-// const {
-//     iconsPlugin,
-//     getIconCollections,
-// } = require("@egoist/tailwindcss-icons");
+const animate = require("tailwindcss-animate")
+
 /** @type {import('tailwindcss').Config} */
 module.exports = {
-  content: ["./index.html", "./src/**/*.{vue,js,ts,jsx,tsx}"],
-  plugins: [
-    // iconsPlugin({
-    //     // Select the icon collections you want to use
-    //     collections: getIconCollections(["mdi"]),
-    // }),
-  ],
+  darkMode: ["class"],
+  safelist: ["dark"],
+  prefix: "",
+  
+  content: [
+    './pages/**/*.{ts,tsx,vue}',
+    './components/**/*.{ts,tsx,vue}',
+    './app/**/*.{ts,tsx,vue}',
+    './src/**/*.{ts,tsx,vue}',
+	],
+  
   theme: {
+    container: {
+      center: true,
+      padding: "2rem",
+      screens: {
+        "2xl": "1400px",
+      },
+    },
     extend: {
       colors: {
         "color-bg-main": "var(--color-bg-main)",
@@ -24,7 +32,40 @@ module.exports = {
         "color-image-tool-button": "var(--color-image-tool-button)",
         "color-image-bg":"var(--color-image-bg)",
         "color-active":"var(--color-active)",
-        "color-control-bg":"var(--color-control-bg)"
+        "color-control-bg":"var(--color-control-bg)",
+        border: "hsl(var(--border))",
+        input: "hsl(var(--input))",
+        ring: "hsl(var(--ring))",
+        background: "hsl(var(--background))",
+        foreground: "hsl(var(--foreground))",
+        primary: {
+          DEFAULT: "hsl(var(--primary))",
+          foreground: "hsl(var(--primary-foreground))",
+        },
+        secondary: {
+          DEFAULT: "hsl(var(--secondary))",
+          foreground: "hsl(var(--secondary-foreground))",
+        },
+        destructive: {
+          DEFAULT: "hsl(var(--destructive))",
+          foreground: "hsl(var(--destructive-foreground))",
+        },
+        muted: {
+          DEFAULT: "hsl(var(--muted))",
+          foreground: "hsl(var(--muted-foreground))",
+        },
+        accent: {
+          DEFAULT: "hsl(var(--accent))",
+          foreground: "hsl(var(--accent-foreground))",
+        },
+        popover: {
+          DEFAULT: "hsl(var(--popover))",
+          foreground: "hsl(var(--popover-foreground))",
+        },
+        card: {
+          DEFAULT: "hsl(var(--card))",
+          foreground: "hsl(var(--card-foreground))",
+        },
       },
       width: {
         "400px": "400px",
@@ -54,6 +95,37 @@ module.exports = {
         "768px": "768px",
         "1024px": "1024px",
       },
+      borderRadius: {
+      	xl: "calc(var(--radius) + 4px)",
+        lg: "var(--radius)",
+        md: "calc(var(--radius) - 2px)",
+        sm: "calc(var(--radius) - 4px)",
+      },
+      keyframes: {
+        "accordion-down": {
+          from: { height: 0 },
+          to: { height: "var(--radix-accordion-content-height)" },
+        },
+        "accordion-up": {
+          from: { height: "var(--radix-accordion-content-height)" },
+          to: { height: 0 },
+        },
+        "collapsible-down": {
+          from: { height: 0 },
+          to: { height: 'var(--radix-collapsible-content-height)' },
+        },
+        "collapsible-up": {
+          from: { height: 'var(--radix-collapsible-content-height)' },
+          to: { height: 0 },
+        },
+      },
+      animation: {
+        "accordion-down": "accordion-down 0.2s ease-out",
+        "accordion-up": "accordion-up 0.2s ease-out",
+        "collapsible-down": "collapsible-down 0.2s ease-in-out",
+        "collapsible-up": "collapsible-up 0.2s ease-in-out",
+      },
     },
   },
-};
+  plugins: [animate],
+}
\ No newline at end of file
diff --git a/WebUI/vite.config.ts b/WebUI/vite.config.ts
index 85ffd95d..3de00962 100644
--- a/WebUI/vite.config.ts
+++ b/WebUI/vite.config.ts
@@ -4,6 +4,8 @@ import vue from '@vitejs/plugin-vue'
 import AutoImport from 'unplugin-auto-import/vite';
 import electron from "vite-plugin-electron";
 import pkg from "./package.json";
+import tailwind from 'tailwindcss';
+import autoprefixer from 'autoprefixer';
 
 const assetParrentArray = [
   { parttern: /.(jpe?g|a?png)$/, folder: "image" },
@@ -31,7 +33,13 @@ export default defineConfig(({ command }) => {
   const isServe = command === "serve";
   const isBuild = command === "build";
   const sourcemap = isServe || !!process.env.VSCODE_DEBUG;
+  const dependenciesToBeTranspiled = ['get-port'];
   return {
+    css: {
+      postcss: {
+        plugins: [tailwind(), autoprefixer()],
+      },
+    },
     plugins: [
       vue(),
       AutoImport({
@@ -59,7 +67,7 @@ export default defineConfig(({ command }) => {
               rollupOptions: {
                 external: Object.keys(
                   "dependencies" in pkg ? pkg.dependencies : {}
-                ),
+                ).filter((d) => !dependenciesToBeTranspiled.includes(d)),
               },
             },
           },
diff --git a/service/model_download_adpater.py b/service/model_download_adpater.py
index 0258faf8..6ec2000f 100644
--- a/service/model_download_adpater.py
+++ b/service/model_download_adpater.py
@@ -19,7 +19,7 @@ class Model_Downloader_Adapter:
     has_error: bool
     user_stop:bool
 
-    def __init__(self):
+    def __init__(self, hf_token=None):
         self.msg_queue = Queue(-1)
         self.finish = False
         self.user_stop = False
@@ -31,7 +31,7 @@ def __init__(self):
         self.file_downloader.on_download_completed = (
             self.download_model_completed_callback
         )
-        self.hf_downloader = HFPlaygroundDownloader()
+        self.hf_downloader = HFPlaygroundDownloader(hf_token)
         self.hf_downloader.on_download_progress = self.download_model_progress_callback
         self.hf_downloader.on_download_completed = (
             self.download_model_completed_callback
diff --git a/service/model_downloader.py b/service/model_downloader.py
index 417dd2d1..90296bb3 100644
--- a/service/model_downloader.py
+++ b/service/model_downloader.py
@@ -1,4 +1,4 @@
-from huggingface_hub import HfFileSystem, hf_hub_url
+from huggingface_hub import HfFileSystem, hf_hub_url, model_info
 from typing import Any, Callable, Dict, List
 from os import path, makedirs, rename
 import requests
@@ -74,12 +74,22 @@ class HFPlaygroundDownloader:
     save_path: str
     save_path_tmp: str
     error: Exception
+    hf_token: str | None
 
-    def __init__(self) -> None:
+    def __init__(self, hf_token=None) -> None:
         self.fs = HfFileSystem()
         self.total_size = 0
         self.download_size = 0
         self.thread_lock = Lock()
+        self.hf_token = hf_token
+
+    def is_gated(self, repo_id: str):
+        try:
+            info = model_info(repo_id)
+            return info.gated != False
+        except Exception as ex:
+            print(f"Error while trying to determine whether {repo_id} is gated: {ex}")
+            return False
 
     def download(self, repo_id: str, model_type: int, thread_count: int = 4):
         self.repo_id = repo_id
@@ -269,17 +279,22 @@ def report_download_progress(self):
     def init_download(self, file: HFDonloadItem):
         makedirs(path.dirname(file.save_filename), exist_ok=True)
 
+        headers={}
+        if (self.hf_token is not None):
+            headers["Authorization"] = f"Bearer {self.hf_token}"
+
         if file.disk_file_size > 0:
             # download skip exists part
+            headers["Range"] = f"bytes={file.disk_file_size}-"
             response = requests.get(
                 file.url,
                 stream=True,
                 verify=False,
-                headers={"Range": f"bytes={file.disk_file_size}-"},
+                headers=headers,
             )
             fw = open(file.save_filename, "ab")
         else:
-            response = requests.get(file.url, stream=True, verify=False)
+            response = requests.get(file.url, stream=True, verify=False, headers=headers)
             fw = open(file.save_filename, "wb")
 
         return response, fw
@@ -292,6 +307,9 @@ def download_model_file(self):
                 while True:
                     try:
                         response, fw = self.init_download(file)
+                        if (response.status_code != 200):
+                            download_retry += 2 # we only want to retry once in case of non network errors
+                            raise DownloadException(file.url)
                         # start download file
                         with response:
                             with fw:
diff --git a/service/paint_biz.py b/service/paint_biz.py
index 0c2a6752..86e949c4 100644
--- a/service/paint_biz.py
+++ b/service/paint_biz.py
@@ -778,14 +778,20 @@ def outpaint(params: OutpaintParams):
             _generate_idx += 1
 
 
+def is_image_completely_black(image: Image):
+    pixels = image.getdata()
+    return all(pixel == (0, 0, 0) for pixel in pixels)
+
+
 def output_image(
     pipe: StableDiffusionPipeline | StableDiffusionXLPipeline,
     image: Image.Image,
     params: TextImageParams,
 ):
     global image_out_callback, _safety_checker, _generate_idx
+    passed_safety_check = not is_image_completely_black(image)
     if image_out_callback is not None:
-        image_out_callback(_generate_idx, image, params, True)
+        image_out_callback(_generate_idx, image, params, passed_safety_check)
 
 
 def generate(params: TextImageParams):
diff --git a/service/utils.py b/service/utils.py
index bee386ee..eb932b4c 100644
--- a/service/utils.py
+++ b/service/utils.py
@@ -15,7 +15,6 @@ def image_to_base64(image: Image.Image):
         base64.b64encode(buffered.getvalue()).decode("utf-8")
     )
 
-
 def generate_mask_image(mask_flag_bytes: bytes, width: int, height: int):
     from PIL import Image
     import numpy as np
diff --git a/service/web_api.py b/service/web_api.py
index 54be719b..729920c2 100644
--- a/service/web_api.py
+++ b/service/web_api.py
@@ -152,6 +152,20 @@ def check_model_exist():
 lock = threading.Lock()
 
 
+@app.route("/api/isModelGated", methods=["POST"])
+def is_model_gated():
+    list = request.get_json()
+    downloader = HFPlaygroundDownloader()
+    gated = { item["repo_id"]: downloader.is_gated(item["repo_id"]) for item in list }
+    
+    return jsonify(
+        {
+            "code": 0,
+            "message": "success",
+            "gatedList": gated,
+        }
+    )
+
 @app.route("/api/getModelSize", methods=["POST"])
 def get_model_size():
     import concurrent.futures
@@ -215,6 +229,11 @@ def disable_rag():
         rag.dispose()
     return jsonify({"code": 0, "message": "success"})
 
+def get_bearer_token(request):
+    auth_header = request.headers.get('Authorization')
+    if auth_header and auth_header.startswith('Bearer '):
+        return auth_header.split(' ')[1]
+    return None
 
 @app.route("/api/downloadModel", methods=["POST"])
 def download_model():
@@ -223,7 +242,7 @@ def download_model():
         model_download_adpater._adapter.stop_download()
     try:
         model_download_adpater._adapter = (
-            model_download_adpater.Model_Downloader_Adapter()
+            model_download_adpater.Model_Downloader_Adapter(hf_token=get_bearer_token(request))
         )
         iterator = model_download_adpater._adapter.download(list)
         return Response(stream_with_context(iterator), content_type="text/event-stream")