diff --git a/package-lock.json b/package-lock.json
index a306611..d594d9f 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "java-runner-client",
-  "version": "2.2.1",
+  "version": "2.2.2",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "java-runner-client",
-      "version": "2.2.1",
+      "version": "2.2.2",
       "dependencies": {
         "electron-store": "^8.1.0",
         "framer-motion": "^12.38.0",
@@ -25,7 +25,7 @@
         "@vitejs/plugin-react": "^6.0.1",
         "autoprefixer": "^10.4.0",
         "concurrently": "^8.2.0",
-        "electron": "^35.7.5",
+        "electron": "^41.1.1",
         "electron-builder": "^26.8.1",
         "eslint": "^10.1.0",
         "postcss": "^8.4.0",
@@ -3149,14 +3149,15 @@
       }
     },
     "node_modules/electron": {
-      "version": "35.7.5",
-      "resolved": "https://registry.npmjs.org/electron/-/electron-35.7.5.tgz",
-      "integrity": "sha512-dnL+JvLraKZl7iusXTVTGYs10TKfzUi30uEDTqsmTm0guN9V2tbOjTzyIZbh9n3ygUjgEYyo+igAwMRXIi3IPw==",
+      "version": "41.1.1",
+      "resolved": "https://registry.npmjs.org/electron/-/electron-41.1.1.tgz",
+      "integrity": "sha512-8bgvDhBjli+3Z2YCKgzzoBPh6391pr7Xv2h/tTJG4ETgvPvUxZomObbZLs31mUzYb6VrlcDDd9cyWyNKtPm3tA==",
       "dev": true,
       "hasInstallScript": true,
+      "license": "MIT",
       "dependencies": {
         "@electron/get": "^2.0.0",
-        "@types/node": "^22.7.7",
+        "@types/node": "^24.9.0",
         "extract-zip": "^2.0.1"
       },
       "bin": {
@@ -3339,14 +3340,22 @@
       }
     },
     "node_modules/electron/node_modules/@types/node": {
-      "version": "22.19.15",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-22.19.15.tgz",
-      "integrity": "sha512-F0R/h2+dsy5wJAUe3tAU6oqa2qbWY5TpNfL/RGmo1y38hiyO1w3x2jPtt76wmuaJI4DQnOBu21cNXQ2STIUUWg==",
+      "version": "24.12.2",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-24.12.2.tgz",
+      "integrity": "sha512-A1sre26ke7HDIuY/M23nd9gfB+nrmhtYyMINbjI1zHJxYteKR6qSMX56FsmjMcDb3SMcjJg5BiRRgOCC/yBD0g==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "undici-types": "~6.21.0"
+        "undici-types": "~7.16.0"
       }
     },
+    "node_modules/electron/node_modules/undici-types": {
+      "version": "7.16.0",
+      "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-7.16.0.tgz",
+      "integrity": "sha512-Zz+aZWSj8LE6zoxD+xrjh4VfkIG8Ya6LvYkZqtUQGJPZjYl53ypCaUwWqo7eI0x66KBGeRo+mlBEkMSeSZ38Nw==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/emoji-regex": {
       "version": "8.0.0",
       "dev": true,
diff --git a/package.json b/package.json
index d6b319e..c726137 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "java-runner-client",
-  "version": "2.2.2",
+  "version": "2.2.3",
   "description": "Run and manage Java processes with profiles, console I/O, and system tray support",
   "main": "dist/main/main.js",
   "scripts": {
@@ -34,7 +34,7 @@
     "@vitejs/plugin-react": "^6.0.1",
     "autoprefixer": "^10.4.0",
     "concurrently": "^8.2.0",
-    "electron": "^35.7.5",
+    "electron": "^41.1.1",
     "electron-builder": "^26.8.1",
     "eslint": "^10.1.0",
     "postcss": "^8.4.0",
diff --git a/src/main/api/Base.routes.ts b/src/main/api/Base.routes.ts
index 190ef66..33538b0 100644
--- a/src/main/api/Base.routes.ts
+++ b/src/main/api/Base.routes.ts
@@ -3,7 +3,7 @@ import { ok } from '../core/RestAPI';
 import { getAllProfiles, getSettings, saveSettings } from '../core/Store';
 import { processManager } from '../core/process/ProcessManager';
 import { AppSettings } from '../shared/config/Settings.config';
-import { defineRoute, RouteMap } from '../shared/types/RestAPI.types';
+import { defineRoute, RouteMap } from '../shared/types/API.types';
 
 export const BaseRoutes: RouteMap = {
   status: defineRoute('status', ({ res }) =>
diff --git a/src/main/api/Log.routes.ts b/src/main/api/Log.routes.ts
index 46804f5..5d80881 100644
--- a/src/main/api/Log.routes.ts
+++ b/src/main/api/Log.routes.ts
@@ -1,6 +1,6 @@
 import { deleteLogFile, getLogFiles, readLogFile } from '../core/process/FileLogger';
 import { err, ok } from '../core/RestAPI';
-import { defineRoute, RouteMap } from '../shared/types/RestAPI.types';
+import { defineRoute, RouteMap } from '../shared/types/API.types';
 
 export const LogRoutes: RouteMap = {
   logs_list: defineRoute('logs_list', ({ res, params }) => {
diff --git a/src/main/api/Process.routes.ts b/src/main/api/Process.routes.ts
index 091ade3..2fa3e46 100644
--- a/src/main/api/Process.routes.ts
+++ b/src/main/api/Process.routes.ts
@@ -1,7 +1,7 @@
 import { processManager } from '../core/process/ProcessManager';
 import { err, ok } from '../core/RestAPI';
 import { getAllProfiles } from '../core/Store';
-import { defineRoute, RouteMap } from '../shared/types/RestAPI.types';
+import { defineRoute, RouteMap } from '../shared/types/API.types';
 
 export const ProcessRoutes: RouteMap = {
   processes_list: defineRoute('processes_list', ({ res }) => ok(res, processManager.getStates())),
diff --git a/src/main/api/Profile.routes.ts b/src/main/api/Profile.routes.ts
index c153388..3edd0dc 100644
--- a/src/main/api/Profile.routes.ts
+++ b/src/main/api/Profile.routes.ts
@@ -2,8 +2,8 @@ import { v4 as uuidv4 } from 'uuid';
 import { processManager } from '../core/process/ProcessManager';
 import { err, ok } from '../core/RestAPI';
 import { deleteProfile, getAllProfiles, saveProfile } from '../core/Store';
+import { defineRoute, RouteMap } from '../shared/types/API.types';
 import { Profile } from '../shared/types/Profile.types';
-import { defineRoute, RouteMap } from '../shared/types/RestAPI.types';
 
 export const ProfileRoutes: RouteMap = {
   profiles_list: defineRoute('profiles_list', ({ res }) => ok(res, getAllProfiles())),
diff --git a/src/main/api/_index.ts b/src/main/api/_index.ts
index 780f128..c5a216f 100644
--- a/src/main/api/_index.ts
+++ b/src/main/api/_index.ts
@@ -1,5 +1,5 @@
 import { RouteKey } from '../shared/config/API.config';
-import { BuiltRoute, RouteMap } from '../shared/types/RestAPI.types';
+import { BuiltRoute, RouteMap } from '../shared/types/API.types';
 
 import { BaseRoutes } from './Base.routes';
 import { LogRoutes } from './Log.routes';
diff --git a/src/main/core/IPCController.ts b/src/main/core/IPCController.ts
index c0dd394..6bc6061 100644
--- a/src/main/core/IPCController.ts
+++ b/src/main/core/IPCController.ts
@@ -3,13 +3,13 @@
  *
  * Defining a route here automatically:
  *   1. Registers it on ipcMain (in main.ts via `registerIPC`)
- *   2. Exposes it on window.api (in preload.ts via `buildPreloadAPI`)
- *   3. Types window.api (via the InferAPI utility below)
+ *   2. Exposes it on jrc.api (in preload.ts via `buildPreloadAPI`)
+ *   3. Types jrc.api (via the InferAPI utility below)
  *
  * Route shapes:
- *   invoke  → renderer calls window.api.foo(...args) → Promise<T>
- *   send    → renderer calls window.api.foo(...args) → void  (fire & forget)
- *   on      → renderer calls window.api.onFoo(cb) → unsubscribe fn
+ *   invoke  → renderer calls jrc.api.foo(...args) → Promise<T>
+ *   send    → renderer calls jrc.api.foo(...args) → void  (fire & forget)
+ *   on      → renderer calls jrc.api.onFoo(cb) → unsubscribe fn
  *             main pushes via webContents.send(channel, ...args)
  */
 
@@ -33,7 +33,7 @@ type SendRoute = {
 type OnRoute = {
   type: 'on';
   channel: string;
-  /** Cast a function signature here to type the callback args on window.api.onFoo.
+  /** Cast a function signature here to type the callback args on jrc.api.onFoo.
    *  e.g. `args: {} as (profileId: string, line: ConsoleLine) => void`
    *  Never called at runtime — purely a compile-time phantom. */
   args?: (...args: any[]) => void;
@@ -43,7 +43,7 @@ type Route = InvokeRoute | SendRoute | OnRoute;
 
 export type RouteMap = Record<string, Route>;
 
-// ─── Type inference: RouteMap → window.api shape ──────────────────────────────
+// ─── Type inference: RouteMap → jrc.api shape ─────────────────────────────────
 
 type InvokeAPI<R extends InvokeRoute> = R['handler'] extends (
   _e: any,
@@ -60,7 +60,7 @@ type OnAPI<K extends string, R extends OnRoute> = R extends { args: (...args: in
   ? { [key in `on${Capitalize<K>}`]: (cb: (...args: A) => void) => () => void }
   : { [key in `on${Capitalize<K>}`]: (cb: (...args: any[]) => void) => () => void };
 
-/** Derives the full window.api type from a RouteMap. */
+/** Derives the full jrc.api type from a RouteMap. */
 export type InferAPI<M extends RouteMap> = {
   [K in keyof M as M[K]['type'] extends 'on' ? never : K]: M[K] extends InvokeRoute
     ? InvokeAPI<M[K]>
@@ -89,7 +89,7 @@ export function registerIPC(routes: RouteMap[]): void {
   }
 }
 
-// ─── Preload: build the window.api object ────────────────────────────────────
+// ─── Preload: build the jrc.api object ───────────────────────────────────────
 
 export function buildPreloadAPI(routes: RouteMap[]): Record<string, unknown> {
   const api: Record<string, unknown> = {};
diff --git a/src/main/core/JRCEnvironment.ts b/src/main/core/JRCEnvironment.ts
index e475cd6..b0ec635 100644
--- a/src/main/core/JRCEnvironment.ts
+++ b/src/main/core/JRCEnvironment.ts
@@ -7,7 +7,7 @@ let env: JRCEnvironment = {
   isReady: false,
   devMode: null as unknown as JRCEnvironment['devMode'],
   type: null as unknown as JRCEnvironment['type'],
-  startUpSource: null as unknown as JRCEnvironment['startUpSource'],
+  launchContext: null as unknown as JRCEnvironment['launchContext'],
 };
 
 export function loadEnvironment() {
@@ -15,7 +15,7 @@ export function loadEnvironment() {
     isReady: true,
     devMode: getSettings().devModeEnabled,
     type: app.isPackaged ? 'prod' : 'dev',
-    startUpSource: detectStartupSource(),
+    launchContext: detectLaunchContext(),
   };
 
   broadcast();
@@ -33,7 +33,7 @@ function broadcast(channel: string = EnvironmentIPC.change.channel) {
   BrowserWindow.getAllWindows().forEach((w) => w.webContents.send(channel, env));
 }
 
-function detectStartupSource(): JRCEnvironment['startUpSource'] {
+function detectLaunchContext(): JRCEnvironment['launchContext'] {
   if (!app.isPackaged) return 'development';
 
   const login = app.getLoginItemSettings();
diff --git a/src/main/core/RestAPI.ts b/src/main/core/RestAPI.ts
index ef7fe9d..2690864 100644
--- a/src/main/core/RestAPI.ts
+++ b/src/main/core/RestAPI.ts
@@ -1,7 +1,7 @@
 import http from 'http';
 import { routes } from '../api/_index';
 import { REST_API_CONFIG } from '../shared/config/API.config';
-import { CompiledRoute, Params } from '../shared/types/RestAPI.types';
+import { CompiledRoute, Params } from '../shared/types/API.types';
 
 // ─── Helpers ──────────────────────────────────────────────────────────────────
 
diff --git a/src/main/core/Store.ts b/src/main/core/Store.ts
index fb6b701..cbd74b3 100644
--- a/src/main/core/Store.ts
+++ b/src/main/core/Store.ts
@@ -1,7 +1,6 @@
 import { app } from 'electron';
 import Store from 'electron-store';
-import { DEFAULT_SETTINGS } from '../shared/config/Settings.config';
-import { AppSettings } from '../shared/config/Settings.config';
+import { AppSettings, DEFAULT_SETTINGS } from '../shared/config/Settings.config';
 import { Profile } from '../shared/types/Profile.types';
 
 interface StoreSchema {
diff --git a/src/main/core/WindowManager.ts b/src/main/core/WindowManager.ts
index 57e7e0c..e18d66b 100644
--- a/src/main/core/WindowManager.ts
+++ b/src/main/core/WindowManager.ts
@@ -15,7 +15,7 @@ export function createWindow(onClose: (e: Electron.Event) => void): BrowserWindo
     backgroundColor: (ALL_THEMES.find((t) => t.id === getSettings().themeId) ?? BUILTIN_THEME)
       .colors['base-950'],
     icon: getIconImage(),
-    show: getEnvironment().startUpSource !== 'withSystem',
+    show: getEnvironment().launchContext !== 'withSystem',
     webPreferences: {
       preload: path.join(__dirname, '../preload.js'),
       contextIsolation: true,
diff --git a/src/main/core/process/ProcessManager.ts b/src/main/core/process/ProcessManager.ts
index a3d90ea..8225ef1 100644
--- a/src/main/core/process/ProcessManager.ts
+++ b/src/main/core/process/ProcessManager.ts
@@ -3,7 +3,6 @@ import { BrowserWindow } from 'electron';
 import path from 'path';
 import { v4 as uuidv4 } from 'uuid';
 import { ProcessIPC } from '../../ipc/Process.ipc';
-import { DEFAULT_JAR_RESOLUTION } from '../../shared/config/JarResolution.config';
 import { PROTECTED_PROCESS_NAMES } from '../../shared/config/Scanner.config';
 import {
   ConsoleLine,
@@ -17,10 +16,15 @@ import { startLogSession, stopLogSession, writeLogLine } from './FileLogger';
 import { gracefulStop } from './GracefulStop';
 
 import fs from 'fs';
-import { patternToRegex } from '../../shared/config/JarResolution.config';
-
 const SELF_PROCESS_NAME = 'Java Client Runner';
 
+function patternToRegex(pattern: string): RegExp {
+  const escaped = pattern.replace(/[.+^${}()|[\]\\]/g, (c) =>
+    c === '{' || c === '}' ? c : `\\${c}`
+  );
+  return new RegExp(`^${escaped.replace(/\{version\}/g, '(.+)')}$`, 'i');
+}
+
 type SystemMessageType =
   | 'start'
   | 'stopping'
@@ -61,7 +65,13 @@ function compareVersionArrays(a: number[], b: number[]): number {
 }
 
 function resolveJarPath(profile: Profile): { jarPath: string; error?: string } {
-  const res = profile.jarResolution ?? DEFAULT_JAR_RESOLUTION;
+  const res = profile.jarResolution ?? {
+    enabled: false,
+    baseDir: '',
+    pattern: 'app-{version}.jar',
+    strategy: 'highest-version' as const,
+    regexOverride: '',
+  };
 
   if (!res.enabled) {
     return { jarPath: profile.jarPath };
diff --git a/src/main/ipc/Dev.ipc.ts b/src/main/ipc/Dev.ipc.ts
index 95b9489..0857978 100644
--- a/src/main/ipc/Dev.ipc.ts
+++ b/src/main/ipc/Dev.ipc.ts
@@ -1,4 +1,6 @@
-import { BrowserWindow } from 'electron';
+import { app, BrowserWindow, shell } from 'electron';
+import { readFileSync } from 'fs';
+import { join } from 'path';
 import type { RouteMap } from '../core/IPCController';
 import { getAllProfiles } from '../core/Store';
 import { DEFAULT_SETTINGS } from '../shared/config/Settings.config';
@@ -37,4 +39,26 @@ export const DevIPC = {
       store.set('settings', DEFAULT_SETTINGS);
     },
   },
+
+  getStoreJson: {
+    type: 'invoke',
+    channel: 'dev:getStoreJson',
+    handler: () => {
+      const storePath = join(app.getPath('userData'), 'java-runner-config.json');
+      try {
+        return readFileSync(storePath, 'utf-8');
+      } catch {
+        return '{}';
+      }
+    },
+  },
+
+  openStoreFile: {
+    type: 'invoke',
+    channel: 'dev:openStoreFile',
+    handler: () => {
+      const storePath = join(app.getPath('userData'), 'java-runner-config.json');
+      shell.showItemInFolder(storePath);
+    },
+  },
 } satisfies RouteMap;
diff --git a/src/main/ipc/JarResolution.ipc.ts b/src/main/ipc/JarResolution.ipc.ts
index fb19cf2..1381fcc 100644
--- a/src/main/ipc/JarResolution.ipc.ts
+++ b/src/main/ipc/JarResolution.ipc.ts
@@ -1,8 +1,14 @@
 import fs from 'fs';
 import path from 'path';
 import type { RouteMap } from '../core/IPCController';
-import { patternToRegex } from '../shared/config/JarResolution.config';
-import type { JarResolutionConfig, JarResolutionResult } from '../shared/types/JarResolution.types';
+import type { JarResolutionConfig, JarResolutionResult } from '../shared/types/Profile.types';
+
+function patternToRegex(pattern: string): RegExp {
+  const escaped = pattern.replace(/[.+^${}()|[\]\\]/g, (c) =>
+    c === '{' || c === '}' ? c : `\\${c}`
+  );
+  return new RegExp(`^${escaped.replace(/\{version\}/g, '(.+)')}$`, 'i');
+}
 
 function parseVersion(str: string): number[] {
   return str
diff --git a/src/main/main.ts b/src/main/main.ts
index 3955c4d..9856910 100644
--- a/src/main/main.ts
+++ b/src/main/main.ts
@@ -31,7 +31,8 @@ const gotLock = app.requestSingleInstanceLock();
 if (!gotLock) {
   app.quit();
 } else {
-  app.on('second-instance', () => {
+  app.on('second-instance', (_event, argv) => {
+    if (argv.includes('--autostart')) return;
     if (mainWindow) {
       if (mainWindow.isMinimized()) mainWindow.restore();
       mainWindow.show();
diff --git a/src/main/preload.ts b/src/main/preload.ts
index da04c88..abdaa7e 100644
--- a/src/main/preload.ts
+++ b/src/main/preload.ts
@@ -3,6 +3,7 @@ import { buildPreloadAPI } from './core/IPCController';
 import { allRoutes } from './ipc/_index';
 import { EnvironmentIPC } from './ipc/Environment.ipc';
 
-contextBridge.exposeInMainWorld('api', buildPreloadAPI([...allRoutes]));
+const api = buildPreloadAPI([...allRoutes]);
+const env = buildPreloadAPI([EnvironmentIPC]);
 
-contextBridge.exposeInMainWorld('env', buildPreloadAPI([EnvironmentIPC]));
+contextBridge.exposeInMainWorld('jrc', { api, env });
diff --git a/src/main/shared/config/API.config.ts b/src/main/shared/config/API.config.ts
index 5313810..1ea74fd 100644
--- a/src/main/shared/config/API.config.ts
+++ b/src/main/shared/config/API.config.ts
@@ -1,10 +1,65 @@
-import { RouteDefinition } from '../types/RestAPI.types';
+import { BodyParams, BodySchemaFor, RouteDefinition } from '../types/API.types';
+import type { Profile } from '../types/Profile.types';
+import type { AppSettings } from './Settings.config';
 
 export const REST_API_CONFIG = {
   defaultPort: 4444,
   host: '127.0.0.1',
 } as const;
 
+type ProfileServerKeys = 'id' | 'createdAt' | 'updatedAt' | 'order';
+
+const PROFILE_BODY = {
+  name: { type: 'string', placeholder: 'My Server' },
+  jarPath: { type: 'string', placeholder: '/path/to/app.jar' },
+  workingDir: {
+    type: 'string',
+    placeholder: '/path/to/workdir',
+    hint: 'Defaults to JAR directory',
+  },
+  javaPath: { type: 'string', placeholder: 'java', hint: 'Leave empty to use system PATH' },
+  jvmArgs: { type: 'json', hint: 'Array of { value, enabled }' },
+  systemProperties: { type: 'json', hint: 'Array of { key, value, enabled }' },
+  programArgs: { type: 'json', hint: 'Array of { value, enabled }' },
+  envVars: { type: 'json', hint: 'Array of { key, value, enabled }' },
+  autoStart: { type: 'boolean', hint: 'Start automatically on app launch' },
+  autoRestart: { type: 'boolean', hint: 'Restart automatically on crash' },
+  autoRestartInterval: {
+    type: 'number',
+    placeholder: '10',
+    hint: 'Seconds to wait before restarting',
+  },
+  color: { type: 'string', placeholder: '#4ade80', hint: 'Profile accent color (hex)' },
+  fileLogging: { type: 'boolean', hint: 'Save session logs to file' },
+  jarResolution: { type: 'json', hint: 'Jar resolution config object' },
+} as const satisfies BodySchemaFor<Profile, ProfileServerKeys>;
+
+const SETTINGS_BODY = {
+  launchOnStartup: { type: 'boolean', hint: 'Launch on Windows startup' },
+  startMinimized: { type: 'boolean', hint: 'Start minimized to tray' },
+  minimizeToTray: { type: 'boolean', hint: 'Minimize to tray on close' },
+  consoleFontSize: { type: 'number', placeholder: '13', hint: 'Console font size in px' },
+  consoleMaxLines: { type: 'number', placeholder: '5000', hint: 'Max lines in buffer' },
+  consoleWordWrap: { type: 'boolean', hint: 'Wrap long lines' },
+  consoleLineNumbers: { type: 'boolean', hint: 'Show line numbers' },
+  consoleTimestamps: { type: 'boolean', hint: 'Show timestamps' },
+  consoleHistorySize: { type: 'number', placeholder: '100', hint: 'Command history size' },
+  themeId: { type: 'string', placeholder: 'dark-default', hint: 'Theme ID' },
+  languageId: { type: 'string', placeholder: 'en', hint: 'Language ID (e.g. en, de)' },
+  restApiEnabled: { type: 'boolean', hint: 'Enable REST API' },
+  restApiPort: { type: 'number', placeholder: '4444', hint: 'REST API port (restart required)' },
+  devModeEnabled: { type: 'boolean', hint: 'Enable developer mode' },
+} as const satisfies BodySchemaFor<AppSettings>;
+
+function bodyFrom<T extends BodyParams>(model: T, required?: (keyof T)[]): BodyParams {
+  const requiredSet = new Set<string>(required as string[]);
+  const out: BodyParams = {};
+  for (const [k, def] of Object.entries(model)) {
+    out[k] = { ...def, required: requiredSet.has(k) };
+  }
+  return out;
+}
+
 export const routeConfig = {
   status: {
     method: 'GET',
@@ -26,49 +81,13 @@ export const routeConfig = {
     method: 'POST',
     path: '/api/profiles',
     description: 'Create profile',
-    bodyParams: {
-      name: { type: 'string', required: true, placeholder: 'My Server' },
-      jarPath: { type: 'string', placeholder: '/path/to/app.jar' },
-      workingDir: {
-        type: 'string',
-        placeholder: '/path/to/workdir',
-        hint: 'Defaults to JAR directory',
-      },
-      javaPath: { type: 'string', placeholder: 'java', hint: 'Leave empty to use system PATH' },
-      autoStart: { type: 'boolean', hint: 'Start automatically on app launch' },
-      autoRestart: { type: 'boolean', hint: 'Restart automatically on crash' },
-      autoRestartInterval: {
-        type: 'number',
-        placeholder: '10',
-        hint: 'Seconds to wait before restarting',
-      },
-      color: { type: 'string', placeholder: '#4ade80', hint: 'Profile accent color (hex)' },
-      fileLogging: { type: 'boolean', hint: 'Save session logs to file' },
-    },
+    bodyParams: bodyFrom(PROFILE_BODY, ['name']),
   },
   profiles_update: {
     method: 'PUT',
     path: '/api/profiles/:id',
     description: 'Update profile',
-    bodyParams: {
-      name: { type: 'string', placeholder: 'My Server' },
-      jarPath: { type: 'string', placeholder: '/path/to/app.jar' },
-      workingDir: {
-        type: 'string',
-        placeholder: '/path/to/workdir',
-        hint: 'Defaults to JAR directory',
-      },
-      javaPath: { type: 'string', placeholder: 'java', hint: 'Leave empty to use system PATH' },
-      autoStart: { type: 'boolean', hint: 'Start automatically on app launch' },
-      autoRestart: { type: 'boolean', hint: 'Restart automatically on crash' },
-      autoRestartInterval: {
-        type: 'number',
-        placeholder: '10',
-        hint: 'Seconds to wait before restarting',
-      },
-      color: { type: 'string', placeholder: '#4ade80', hint: 'Profile accent color (hex)' },
-      fileLogging: { type: 'boolean', hint: 'Save session logs to file' },
-    },
+    bodyParams: bodyFrom(PROFILE_BODY),
   },
   profiles_delete: {
     method: 'DELETE',
@@ -132,26 +151,7 @@ export const routeConfig = {
     method: 'PUT',
     path: '/api/settings',
     description: 'Update settings',
-    bodyParams: {
-      launchOnStartup: { type: 'boolean', hint: 'Launch on Windows startup' },
-      startMinimized: { type: 'boolean', hint: 'Start minimized to tray' },
-      minimizeToTray: { type: 'boolean', hint: 'Minimize to tray on close' },
-      consoleFontSize: { type: 'number', placeholder: '13', hint: 'Console font size in px' },
-      consoleMaxLines: { type: 'number', placeholder: '5000', hint: 'Max lines in buffer' },
-      consoleWordWrap: { type: 'boolean', hint: 'Wrap long lines' },
-      consoleLineNumbers: { type: 'boolean', hint: 'Show line numbers' },
-      consoleTimestamps: { type: 'boolean', hint: 'Show timestamps' },
-      consoleHistorySize: { type: 'number', placeholder: '100', hint: 'Command history size' },
-      themeId: { type: 'string', placeholder: 'dark-default', hint: 'Theme ID' },
-      languageId: { type: 'string', placeholder: 'en', hint: 'Language ID (e.g. en, de)' },
-      restApiEnabled: { type: 'boolean', hint: 'Enable REST API' },
-      restApiPort: {
-        type: 'number',
-        placeholder: '4444',
-        hint: 'REST API port (restart required)',
-      },
-      devModeEnabled: { type: 'boolean', hint: 'Enable developer mode' },
-    },
+    bodyParams: bodyFrom(SETTINGS_BODY),
   },
 } as const satisfies Record<string, RouteDefinition>;
 
diff --git a/src/main/shared/config/App.config.ts b/src/main/shared/config/App.config.ts
new file mode 100644
index 0000000..ed9452f
--- /dev/null
+++ b/src/main/shared/config/App.config.ts
@@ -0,0 +1,32 @@
+/**
+ * Single source of truth for Content-Security-Policy origins.
+ * The Vite build reads this to inject the CSP meta tag into index.html.
+ *
+ * To allow a new external resource, add it here — no other file needs updating.
+ */
+export const ALLOWED_ORIGINS = {
+  /** Image sources (CSP img-src) */
+  img: ['https://flagcdn.com', 'https://avatars.githubusercontent.com'],
+
+  /** Stylesheet sources (CSP style-src) */
+  style: ['https://fonts.googleapis.com'],
+
+  /** Font file sources (CSP font-src) */
+  font: ['https://fonts.gstatic.com'],
+
+  /** Network requests (CSP connect-src) */
+  connect: ['http://127.0.0.1:*', 'http://localhost:*', 'https://fonts.googleapis.com'],
+} as const;
+
+/** Builds the full CSP string from ALLOWED_ORIGINS. */
+export function buildCSP(): string {
+  const directives = [
+    `default-src 'self'`,
+    `script-src 'self'`,
+    `style-src 'self' 'unsafe-inline' ${ALLOWED_ORIGINS.style.join(' ')}`,
+    `img-src 'self' data: ${ALLOWED_ORIGINS.img.join(' ')}`,
+    `font-src 'self' ${ALLOWED_ORIGINS.font.join(' ')}`,
+    `connect-src 'self' ${ALLOWED_ORIGINS.connect.join(' ')}`,
+  ];
+  return directives.join('; ');
+}
diff --git a/src/main/shared/config/JarResolution.config.ts b/src/main/shared/config/JarResolution.config.ts
deleted file mode 100644
index 07e13a5..0000000
--- a/src/main/shared/config/JarResolution.config.ts
+++ /dev/null
@@ -1,36 +0,0 @@
-import type { JarResolutionConfig } from '../types/JarResolution.types';
-
-export const JAR_RESOLUTION_STRATEGIES = [
-  {
-    id: 'highest-version' as const,
-    label: 'Highest Version',
-    hint: 'Picks the JAR with the highest semantic or numeric version extracted from the filename.',
-  },
-  {
-    id: 'latest-modified' as const,
-    label: 'Latest Modified',
-    hint: 'Picks the most recently modified JAR in the directory matching the pattern.',
-  },
-  {
-    id: 'regex' as const,
-    label: 'Regex Match',
-    hint: 'Picks the first JAR whose filename matches the custom regular expression.',
-  },
-] as const;
-
-export const DEFAULT_JAR_RESOLUTION: JarResolutionConfig = {
-  enabled: false,
-  baseDir: '',
-  pattern: 'app-{version}.jar',
-  strategy: 'highest-version',
-  regexOverride: '',
-};
-
-/** Converts a user-facing pattern like "app-{version}.jar" into a RegExp. */
-export function patternToRegex(pattern: string): RegExp {
-  const escaped = pattern.replace(/[.+^${}()|[\]\\]/g, (c) =>
-    c === '{' || c === '}' ? c : `\\${c}`
-  );
-  const src = escaped.replace(/\{version\}/g, '(.+)');
-  return new RegExp(`^${src}$`, 'i');
-}
diff --git a/src/main/shared/config/Settings.config.ts b/src/main/shared/config/Settings.config.ts
index e1cfae3..2adc1e8 100644
--- a/src/main/shared/config/Settings.config.ts
+++ b/src/main/shared/config/Settings.config.ts
@@ -1,4 +1,3 @@
-import { REST_API_CONFIG } from './API.config';
 import {
   AnyFieldDef,
   extractDefaults,
@@ -10,9 +9,7 @@ import {
   TextDef,
   ToggleDef,
 } from '../types/Settings.types';
-
-// ─── Section registry ──────────────────────────────────────────────────────
-// Add a new entry here when adding a new settings section.
+import { REST_API_CONFIG } from './API.config';
 
 export type SettingSection = 'general' | 'console' | 'appearance' | 'advanced' | 'about';
 
@@ -24,10 +21,7 @@ export const SETTINGS_TOPICS: SettingSidebarTopic<SettingSection>[] = [
   { id: 'about', label: 'About' },
 ];
 
-// ─── Schema ────────────────────────────────────────────────────────────────
-
 export const SETTINGS_SCHEMA = {
-  // ── General › Startup ────────────────────────────────────────────────────
   launchOnStartup: {
     type: 'toggle',
     default: false,
@@ -57,7 +51,6 @@ export const SETTINGS_SCHEMA = {
     hint: 'settings.minimizeToTrayHint',
   } as ToggleDef,
 
-  // ── Console ───────────────────────────────────────────────────────────────
   consoleFontSize: {
     type: 'range',
     default: 13,
@@ -122,7 +115,6 @@ export const SETTINGS_SCHEMA = {
     step: 10,
   } as NumberDef,
 
-  // ── Appearance (managed by ThemeProvider / I18nProvider) ──────────────────
   themeId: {
     type: 'text',
     default: 'dark-default',
@@ -139,7 +131,6 @@ export const SETTINGS_SCHEMA = {
     label: 'settings.language',
   } as TextDef,
 
-  // ── Advanced › Dev Mode ───────────────────────────────────────────────────
   devModeEnabled: {
     type: 'toggle',
     default: false,
@@ -149,7 +140,6 @@ export const SETTINGS_SCHEMA = {
     hint: 'settings.devModeHint',
   } as ToggleDef,
 
-  // ── Advanced › REST API ───────────────────────────────────────────────────
   restApiEnabled: {
     type: 'toggle',
     default: false,
diff --git a/src/main/shared/config/languages/de.lang.ts b/src/main/shared/config/languages/de.lang.ts
index f6782ce..1a06824 100644
--- a/src/main/shared/config/languages/de.lang.ts
+++ b/src/main/shared/config/languages/de.lang.ts
@@ -3,6 +3,7 @@ import type { LanguageDefinition } from '../../types/Language.types';
 export const GERMAN: LanguageDefinition = {
   id: 'de',
   name: 'Deutsch',
+  countryCode: 'de',
   strings: {
     'general.save': 'Speichern',
     'general.saved': 'Gespeichert',
diff --git a/src/main/shared/config/languages/en.lang.ts b/src/main/shared/config/languages/en.lang.ts
index a379949..6a3f128 100644
--- a/src/main/shared/config/languages/en.lang.ts
+++ b/src/main/shared/config/languages/en.lang.ts
@@ -383,6 +383,7 @@ const ENGLISH_STRINGS = {
 export const ENGLISH: LanguageDefinition = {
   id: 'en',
   name: 'English',
+  countryCode: 'gb',
   strings: ENGLISH_STRINGS,
 };
 
diff --git a/src/main/shared/types/RestAPI.types.ts b/src/main/shared/types/API.types.ts
similarity index 77%
rename from src/main/shared/types/RestAPI.types.ts
rename to src/main/shared/types/API.types.ts
index 5df6a5e..787262a 100644
--- a/src/main/shared/types/RestAPI.types.ts
+++ b/src/main/shared/types/API.types.ts
@@ -5,7 +5,7 @@ export type Params = Record<string, string>;
 
 type RouteMethod = 'GET' | 'POST' | 'PUT' | 'DELETE';
 
-export type BodyParamType = 'string' | 'number' | 'boolean';
+export type BodyParamType = 'string' | 'number' | 'boolean' | 'json';
 
 export type BodyParamDef = {
   type: BodyParamType;
@@ -16,6 +16,14 @@ export type BodyParamDef = {
 
 export type BodyParams = Record<string, BodyParamDef>;
 
+/**
+ * Enforces that a body schema covers every key in `T` except those in `Excluded`.
+ * If a field is added to the source type and not to the schema, TypeScript will error.
+ */
+export type BodySchemaFor<T, Excluded extends keyof T = never> = {
+  [K in Exclude<keyof T, Excluded>]: BodyParamDef;
+};
+
 export type RouteDefinition = {
   method: RouteMethod;
   path: string;
diff --git a/src/main/shared/types/App.types.ts b/src/main/shared/types/App.types.ts
index 5522d08..f745722 100644
--- a/src/main/shared/types/App.types.ts
+++ b/src/main/shared/types/App.types.ts
@@ -2,5 +2,5 @@ export interface JRCEnvironment {
   isReady: boolean;
   devMode: boolean;
   type: 'dev' | 'prod';
-  startUpSource: 'userRequest' | 'withSystem' | 'development';
+  launchContext: 'userRequest' | 'withSystem' | 'development';
 }
diff --git a/src/main/shared/types/JarResolution.types.ts b/src/main/shared/types/JarResolution.types.ts
deleted file mode 100644
index 69da177..0000000
--- a/src/main/shared/types/JarResolution.types.ts
+++ /dev/null
@@ -1,16 +0,0 @@
-export type JarResolutionStrategy = 'highest-version' | 'latest-modified' | 'regex';
-
-export interface JarResolutionConfig {
-  enabled: boolean;
-  baseDir: string;
-  pattern: string; // filename pattern, e.g. "myapp-{version}.jar" or a raw regex
-  strategy: JarResolutionStrategy;
-  regexOverride?: string; // only used when strategy === 'regex'
-}
-
-export interface JarResolutionResult {
-  ok: boolean;
-  resolvedPath?: string;
-  candidates?: string[];
-  error?: string;
-}
diff --git a/src/main/shared/types/Language.types.ts b/src/main/shared/types/Language.types.ts
index 433eaf5..4cb4d7a 100644
--- a/src/main/shared/types/Language.types.ts
+++ b/src/main/shared/types/Language.types.ts
@@ -1,5 +1,7 @@
 export interface LanguageDefinition {
   id: string;
   name: string;
+  /** ISO 3166-1 alpha-2 country code for the flag image (e.g. 'gb', 'de') */
+  countryCode?: string;
   strings: Record<string, string>;
 }
diff --git a/src/main/shared/types/Profile.types.ts b/src/main/shared/types/Profile.types.ts
index 836a429..7cd1971 100644
--- a/src/main/shared/types/Profile.types.ts
+++ b/src/main/shared/types/Profile.types.ts
@@ -1,4 +1,23 @@
-import type { JarResolutionConfig } from './JarResolution.types';
+// ─── Jar Resolution ─────────────────────────────────────────────────────────
+
+export type JarResolutionStrategy = 'highest-version' | 'latest-modified' | 'regex';
+
+export interface JarResolutionConfig {
+  enabled: boolean;
+  baseDir: string;
+  pattern: string; // filename pattern, e.g. "myapp-{version}.jar" or a raw regex
+  strategy: JarResolutionStrategy;
+  regexOverride?: string; // only used when strategy === 'regex'
+}
+
+export interface JarResolutionResult {
+  ok: boolean;
+  resolvedPath?: string;
+  candidates?: string[];
+  error?: string;
+}
+
+// ─── Profile ────────────────────────────────────────────────────────────────
 
 export interface SystemProperty {
   key: string;
diff --git a/src/renderer/App.tsx b/src/renderer/App.tsx
index 6c3e435..3319768 100644
--- a/src/renderer/App.tsx
+++ b/src/renderer/App.tsx
@@ -1,7 +1,7 @@
 import { HashRouter, Navigate, Route, Routes } from 'react-router-dom';
 import { AppProvider } from './AppProvider';
+import { TitleBar } from './components/common/layout/shell';
 import { DevModeGate } from './components/developer/DevModeGate';
-import { TitleBar } from './components/layout/shell';
 import { MainLayout } from './components/MainLayout';
 import { ThemeProvider } from './hooks/ThemeProvider';
 import { I18nProvider } from './i18n/I18nProvider';
@@ -19,14 +19,14 @@ function Fallback() {
         Make sure you launch the app in the official Java Runner Client environment.
       </p>
       <div className="mt-8 p-4 bg-gray-800 rounded-lg text-sm text-red-400 font-mono">
-        window.api is undefined
+        jrc.api is undefined
       </div>
     </div>
   );
 }
 
 export default function App() {
-  if (!window.api) return <Fallback />;
+  if (!jrc.api) return <Fallback />;
 
   return (
     <ThemeProvider>
diff --git a/src/renderer/AppProvider.tsx b/src/renderer/AppProvider.tsx
index d3f003c..96d1ab3 100644
--- a/src/renderer/AppProvider.tsx
+++ b/src/renderer/AppProvider.tsx
@@ -145,12 +145,12 @@ export function AppProvider({ children }: { children: ReactNode }) {
   const [state, dispatch] = useReducer(reducer, INITIAL_STATE);
 
   useEffect(() => {
-    if (!window.api) return;
+    if (!jrc.api) return;
     async function init() {
       const [profiles, settings, states] = await Promise.all([
-        window.api.getProfiles(),
-        window.api.getSettings(),
-        window.api.getStates(),
+        jrc.api.getProfiles(),
+        jrc.api.getSettings(),
+        jrc.api.getStates(),
       ]);
       dispatch({ type: 'INIT', profiles, settings, states });
       const max = settings?.consoleMaxLines ?? 5000;
@@ -163,35 +163,35 @@ export function AppProvider({ children }: { children: ReactNode }) {
   }, []);
 
   useEffect(() => {
-    if (!window.api) return;
+    if (!jrc.api) return;
     const max = state.settings?.consoleMaxLines ?? 5000;
-    return window.api.onConsoleLine((profileId: string, line: unknown) => {
+    return jrc.api.onConsoleLine((profileId: string, line: unknown) => {
       dispatch({ type: 'APPEND_LOG', profileId, line: line as ConsoleLine, maxLines: max });
     });
   }, [state.settings?.consoleMaxLines]);
 
   useEffect(() => {
-    if (!window.api) return;
-    return window.api.onConsoleClear((profileId) => dispatch({ type: 'CLEAR_LOG', profileId }));
+    if (!jrc.api) return;
+    return jrc.api.onConsoleClear((profileId) => dispatch({ type: 'CLEAR_LOG', profileId }));
   }, []);
 
   useEffect(() => {
-    if (!window.api) return;
-    return window.api.onStatesUpdate((states) => dispatch({ type: 'SET_STATES', states }));
+    if (!jrc.api) return;
+    return jrc.api.onStatesUpdate((states) => dispatch({ type: 'SET_STATES', states }));
   }, []);
 
   const setActiveProfile = useCallback((id: string) => dispatch({ type: 'SET_ACTIVE', id }), []);
 
   const saveProfile = useCallback(async (p: Profile) => {
-    await window.api.saveProfile(p);
-    dispatch({ type: 'SET_PROFILES', profiles: await window.api.getProfiles() });
+    await jrc.api.saveProfile(p);
+    dispatch({ type: 'SET_PROFILES', profiles: await jrc.api.getProfiles() });
   }, []);
 
   const deleteProfile = useCallback(
     async (id: string) => {
       clearLogs(id);
-      await window.api.deleteProfile(id);
-      const profiles = await window.api.getProfiles();
+      await jrc.api.deleteProfile(id);
+      const profiles = await jrc.api.getProfiles();
       dispatch({ type: 'SET_PROFILES', profiles });
       if (state.activeProfileId === id) dispatch({ type: 'SET_ACTIVE', id: profiles[0]?.id ?? '' });
     },
@@ -220,22 +220,22 @@ export function AppProvider({ children }: { children: ReactNode }) {
       };
       dispatch({ type: 'SET_PROFILES', profiles: [...state.profiles, p] });
       dispatch({ type: 'SET_ACTIVE', id: p.id });
-      window.api.saveProfile(p);
+      jrc.api.saveProfile(p);
     },
     [state.profiles]
   );
 
   const reorderProfiles = useCallback(async (profiles: Profile[]) => {
     dispatch({ type: 'SET_PROFILES', profiles });
-    await window.api.reorderProfiles(profiles.map((p) => p.id));
+    await jrc.api.reorderProfiles(profiles.map((p) => p.id));
   }, []);
 
-  const startProcess = useCallback((p: Profile) => window.api.startProcess(p), []);
-  const stopProcess = useCallback((id: string) => window.api.stopProcess(id), []);
-  const forceStopProcess = useCallback((id: string) => window.api.forceStopProcess(id), []);
+  const startProcess = useCallback((p: Profile) => jrc.api.startProcess(p), []);
+  const stopProcess = useCallback((id: string) => jrc.api.stopProcess(id), []);
+  const forceStopProcess = useCallback((id: string) => jrc.api.forceStopProcess(id), []);
 
   const sendInput = useCallback(async (profileId: string, input: string) => {
-    await window.api.sendInput(profileId, input);
+    await jrc.api.sendInput(profileId, input);
   }, []);
 
   const clearConsole = useCallback(
@@ -244,7 +244,7 @@ export function AppProvider({ children }: { children: ReactNode }) {
   );
 
   const saveSettings = useCallback(async (s: AppSettings) => {
-    await window.api.saveSettings(s);
+    await jrc.api.saveSettings(s);
     dispatch({ type: 'SET_SETTINGS', settings: s });
   }, []);
 
diff --git a/src/renderer/components/MainLayout.tsx b/src/renderer/components/MainLayout.tsx
index b54200c..571d6d4 100644
--- a/src/renderer/components/MainLayout.tsx
+++ b/src/renderer/components/MainLayout.tsx
@@ -1,4 +1,4 @@
-import React, { useEffect } from 'react';
+import React, { useEffect, useMemo } from 'react';
 import { LuList, LuScrollText } from 'react-icons/lu';
 import { VscAccount, VscTerminal } from 'react-icons/vsc';
 import { Navigate, Route, Routes, useLocation, useNavigate } from 'react-router-dom';
@@ -7,10 +7,10 @@ import { useDevMode } from '../hooks/useDevMode';
 import { useTranslation } from '../i18n/I18nProvider';
 import type { TranslationKey } from '../i18n/TranslationKeys';
 import { StatusDot } from './common/display';
+import { PanelHeader, TabBar } from './common/layout/navigation';
 import { ConsoleTab } from './console/ConsoleTab';
 import { DeveloperTab } from './developer/DeveloperTab';
 import { FaqPanel } from './faq/FaqPanel';
-import { PanelHeader } from './layout/navigation';
 import { ConfigTab } from './profiles/ConfigTab';
 import { LogsTab } from './profiles/LogsTab';
 import { ProfileSidebar } from './profiles/ProfileSidebar';
@@ -54,6 +54,17 @@ export function MainLayout() {
   const color = activeProfile?.color ?? '#4ade80';
   const running = activeProfile ? isRunning(activeProfile.id) : false;
 
+  const profileTabs = useMemo(
+    () =>
+      PROFILE_TABS.map((tab) => ({
+        id: tab.path,
+        label: t(tab.labelKey),
+        Icon: tab.Icon,
+        badge: tab.path === 'console' && running ? <StatusDot color={color} pulse /> : undefined,
+      })),
+    [t, running, color]
+  );
+
   useEffect(() => {
     if (!devMode && activePanel === 'developer') {
       navigate('/console', { replace: true });
@@ -88,34 +99,19 @@ export function MainLayout() {
           </>
         ) : (
           <>
-            <div className="flex items-center px-4 border-b border-surface-border bg-base-900 shrink-0">
-              {PROFILE_TABS.map((tab) => {
-                const isActive = activeTab === tab.path;
-                return (
-                  <button
-                    key={tab.path}
-                    onClick={() => navigate(`/${tab.path}`)}
-                    className={[
-                      'flex items-center gap-1.5 px-3 py-2 text-xs border-b-2 -mb-px transition-all duration-150',
-                      isActive
-                        ? 'font-medium'
-                        : 'text-text-muted border-transparent hover:text-text-primary',
-                    ].join(' ')}
-                    style={isActive ? { borderBottomColor: color, color } : {}}
-                  >
-                    <tab.Icon size={13} />
-                    {t(tab.labelKey)}
-                    {tab.path === 'console' && running && <StatusDot color={color} pulse />}
-                  </button>
-                );
-              })}
-              <div className="flex-1" />
-              {activeProfile && (
-                <span className="text-xs text-text-muted font-mono truncate max-w-[160px] mr-1">
-                  {activeProfile.name}
-                </span>
-              )}
-            </div>
+            <TabBar
+              tabs={profileTabs}
+              active={activeTab}
+              onChange={(id) => navigate(`/${id}`)}
+              accentColor={color}
+              trailing={
+                activeProfile && (
+                  <span className="text-xs text-text-muted font-mono truncate max-w-[160px]">
+                    {activeProfile.name}
+                  </span>
+                )
+              }
+            />
 
             <div className="flex-1 min-h-0 overflow-hidden animate-fade-in">
               <Routes>
diff --git a/src/renderer/components/common/index.ts b/src/renderer/components/common/index.ts
index 24bf0dc..6cb32f6 100644
--- a/src/renderer/components/common/index.ts
+++ b/src/renderer/components/common/index.ts
@@ -1,4 +1,5 @@
 export * from './display';
 export * from './inputs';
+export * from './layout';
 export * from './lists';
 export * from './overlays';
diff --git a/src/renderer/components/layout/containers/Card.tsx b/src/renderer/components/common/layout/containers/Card.tsx
similarity index 100%
rename from src/renderer/components/layout/containers/Card.tsx
rename to src/renderer/components/common/layout/containers/Card.tsx
diff --git a/src/renderer/components/layout/containers/DataRow.tsx b/src/renderer/components/common/layout/containers/DataRow.tsx
similarity index 100%
rename from src/renderer/components/layout/containers/DataRow.tsx
rename to src/renderer/components/common/layout/containers/DataRow.tsx
diff --git a/src/renderer/components/layout/containers/ScrollContent.tsx b/src/renderer/components/common/layout/containers/ScrollContent.tsx
similarity index 100%
rename from src/renderer/components/layout/containers/ScrollContent.tsx
rename to src/renderer/components/common/layout/containers/ScrollContent.tsx
diff --git a/src/renderer/components/layout/containers/Section.tsx b/src/renderer/components/common/layout/containers/Section.tsx
similarity index 100%
rename from src/renderer/components/layout/containers/Section.tsx
rename to src/renderer/components/common/layout/containers/Section.tsx
diff --git a/src/renderer/components/layout/containers/index.ts b/src/renderer/components/common/layout/containers/index.ts
similarity index 100%
rename from src/renderer/components/layout/containers/index.ts
rename to src/renderer/components/common/layout/containers/index.ts
diff --git a/src/renderer/components/layout/index.ts b/src/renderer/components/common/layout/index.ts
similarity index 100%
rename from src/renderer/components/layout/index.ts
rename to src/renderer/components/common/layout/index.ts
diff --git a/src/renderer/components/layout/navigation/PanelHeader.tsx b/src/renderer/components/common/layout/navigation/PanelHeader.tsx
similarity index 91%
rename from src/renderer/components/layout/navigation/PanelHeader.tsx
rename to src/renderer/components/common/layout/navigation/PanelHeader.tsx
index a31e796..75afc75 100644
--- a/src/renderer/components/layout/navigation/PanelHeader.tsx
+++ b/src/renderer/components/common/layout/navigation/PanelHeader.tsx
@@ -1,5 +1,5 @@
 import { useNavigate } from 'react-router-dom';
-import { useTranslation } from '../../../i18n/I18nProvider';
+import { useTranslation } from '../../../../i18n/I18nProvider';
 
 interface Props {
   title: string;
@@ -30,7 +30,7 @@ export function PanelHeader({ title, backTo = '/console' }: Props) {
           {t('general.back')}
         </button>
         <div className="w-px h-4 bg-surface-border" />
-        <span className="text-xs font-medium text-text-secondary">{title}</span>
+        <span className="text-xs font-medium text-text-secondary truncate min-w-0">{title}</span>
       </div>
     </div>
   );
diff --git a/src/renderer/components/layout/navigation/SidebarLayout.tsx b/src/renderer/components/common/layout/navigation/SidebarLayout.tsx
similarity index 100%
rename from src/renderer/components/layout/navigation/SidebarLayout.tsx
rename to src/renderer/components/common/layout/navigation/SidebarLayout.tsx
diff --git a/src/renderer/components/common/layout/navigation/TabBar.tsx b/src/renderer/components/common/layout/navigation/TabBar.tsx
new file mode 100644
index 0000000..02d3c91
--- /dev/null
+++ b/src/renderer/components/common/layout/navigation/TabBar.tsx
@@ -0,0 +1,113 @@
+import React, { useCallback, useEffect, useRef, useState } from 'react';
+import { VscChevronLeft, VscChevronRight } from 'react-icons/vsc';
+
+export interface Tab {
+  id: string;
+  label: string;
+  icon?: React.ReactNode;
+  badge?: React.ReactNode;
+  Icon?: React.ElementType;
+}
+
+interface TabBarProps {
+  tabs: Tab[];
+  active: string;
+  onChange: (id: string) => void;
+  accentColor?: string;
+  className?: string;
+  dotTab?: string;
+  /** Content rendered after the tabs, pushed to the right edge */
+  trailing?: React.ReactNode;
+}
+
+export function TabBar({
+  tabs,
+  active,
+  onChange,
+  accentColor = 'var(--tw-theme-accent, #4ade80)',
+  className = '',
+  dotTab,
+  trailing,
+}: TabBarProps) {
+  const scrollRef = useRef<HTMLDivElement>(null);
+  const [canScrollLeft, setCanScrollLeft] = useState(false);
+  const [canScrollRight, setCanScrollRight] = useState(false);
+
+  const updateOverflow = useCallback(() => {
+    const el = scrollRef.current;
+    if (!el) return;
+    setCanScrollLeft(el.scrollLeft > 1);
+    setCanScrollRight(el.scrollLeft + el.clientWidth < el.scrollWidth - 1);
+  }, []);
+
+  useEffect(() => {
+    const el = scrollRef.current;
+    if (!el) return;
+    updateOverflow();
+    const ro = new ResizeObserver(updateOverflow);
+    ro.observe(el);
+    return () => ro.disconnect();
+  }, [updateOverflow, tabs.length]);
+
+  const scroll = (dir: -1 | 1) => {
+    scrollRef.current?.scrollBy({ left: dir * 120, behavior: 'smooth' });
+  };
+
+  return (
+    <div
+      className={[
+        'relative flex items-center border-b border-surface-border bg-base-900 shrink-0',
+        className,
+      ].join(' ')}
+    >
+      {canScrollLeft && (
+        <button
+          onClick={() => scroll(-1)}
+          className="absolute left-0 z-10 h-full px-1 bg-gradient-to-r from-base-900 via-base-900/90 to-transparent text-text-muted hover:text-text-primary transition-colors"
+        >
+          <VscChevronLeft size={14} />
+        </button>
+      )}
+
+      <div
+        ref={scrollRef}
+        onScroll={updateOverflow}
+        className="flex items-center px-4 overflow-x-auto scrollbar-none"
+      >
+        {tabs.map((tab) => {
+          const isActive = tab.id === active;
+          return (
+            <button
+              key={tab.id}
+              onClick={() => onChange(tab.id)}
+              className={[
+                'flex items-center gap-1.5 px-3 py-2 text-xs font-medium whitespace-nowrap border-b-2 -mb-px transition-colors duration-150 shrink-0',
+                isActive ? '' : 'text-text-muted border-transparent hover:text-text-primary',
+              ].join(' ')}
+              style={isActive ? { borderBottomColor: accentColor, color: accentColor } : {}}
+            >
+              {tab.icon}
+              {tab.Icon && <tab.Icon size={13} />}
+              {tab.label}
+              {tab.badge}
+              {dotTab === tab.id && (
+                <span className="ml-1 inline-block w-1.5 h-1.5 rounded-full bg-console-warn align-middle" />
+              )}
+            </button>
+          );
+        })}
+      </div>
+
+      {trailing && <div className="flex items-center shrink-0 ml-auto pr-4">{trailing}</div>}
+
+      {canScrollRight && (
+        <button
+          onClick={() => scroll(1)}
+          className="absolute right-0 z-10 h-full px-1 bg-gradient-to-l from-base-900 via-base-900/90 to-transparent text-text-muted hover:text-text-primary transition-colors"
+        >
+          <VscChevronRight size={14} />
+        </button>
+      )}
+    </div>
+  );
+}
diff --git a/src/renderer/components/layout/navigation/index.ts b/src/renderer/components/common/layout/navigation/index.ts
similarity index 100%
rename from src/renderer/components/layout/navigation/index.ts
rename to src/renderer/components/common/layout/navigation/index.ts
diff --git a/src/renderer/components/layout/shell/TitleBar.tsx b/src/renderer/components/common/layout/shell/TitleBar.tsx
similarity index 90%
rename from src/renderer/components/layout/shell/TitleBar.tsx
rename to src/renderer/components/common/layout/shell/TitleBar.tsx
index bc2d1f0..dd45fed 100644
--- a/src/renderer/components/layout/shell/TitleBar.tsx
+++ b/src/renderer/components/common/layout/shell/TitleBar.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import { VscChromeClose, VscChromeMinimize } from 'react-icons/vsc';
-import { useApp } from '../../../AppProvider';
-import { StatusDot } from '../../common/display/StatusDot';
+import { useApp } from '../../../../AppProvider';
+import { StatusDot } from '../../display/StatusDot';
 
 export function TitleBar() {
   const { state } = useApp();
@@ -41,7 +41,7 @@ export function TitleBar() {
             opacity="0.5"
           />
         </svg>
-        <span className="text-xs font-mono text-text-secondary tracking-widest uppercase">
+        <span className="text-xs font-mono text-text-secondary tracking-widest uppercase truncate min-w-0">
           Java Runner Client
         </span>
         {runningCount > 0 && (
@@ -59,14 +59,14 @@ export function TitleBar() {
         style={{ WebkitAppRegion: 'no-drag' } as React.CSSProperties}
       >
         <button
-          onClick={() => window.api.minimizeWindow()}
+          onClick={() => jrc.api.minimizeWindow()}
           className="w-7 h-7 flex items-center justify-center rounded text-text-muted hover:text-text-primary hover:bg-surface-raised transition-colors"
           title="Minimize"
         >
           <VscChromeMinimize size={12} />
         </button>
         <button
-          onClick={() => window.api.closeWindow()}
+          onClick={() => jrc.api.closeWindow()}
           className="w-7 h-7 flex items-center justify-center rounded text-text-muted hover:text-red-400 hover:bg-red-400/10 transition-colors"
           title="Close"
         >
diff --git a/src/renderer/components/layout/shell/Toolbar.tsx b/src/renderer/components/common/layout/shell/Toolbar.tsx
similarity index 86%
rename from src/renderer/components/layout/shell/Toolbar.tsx
rename to src/renderer/components/common/layout/shell/Toolbar.tsx
index 0ea2c7f..da2c594 100644
--- a/src/renderer/components/layout/shell/Toolbar.tsx
+++ b/src/renderer/components/common/layout/shell/Toolbar.tsx
@@ -9,7 +9,7 @@ export function Toolbar({ children, className }: ToolbarProps) {
   return (
     <div
       className={[
-        'flex items-center gap-2 px-4 py-2.5 border-b border-surface-border bg-base-900 shrink-0',
+        'flex items-center gap-2 px-4 py-2.5 border-b border-surface-border bg-base-900 shrink-0 min-w-0 overflow-hidden',
         className,
       ]
         .filter(Boolean)
diff --git a/src/renderer/components/layout/shell/index.ts b/src/renderer/components/common/layout/shell/index.ts
similarity index 100%
rename from src/renderer/components/layout/shell/index.ts
rename to src/renderer/components/common/layout/shell/index.ts
diff --git a/src/renderer/components/console/ConsoleTab.tsx b/src/renderer/components/console/ConsoleTab.tsx
index 5c3c531..f23db84 100644
--- a/src/renderer/components/console/ConsoleTab.tsx
+++ b/src/renderer/components/console/ConsoleTab.tsx
@@ -136,7 +136,7 @@ export function ConsoleTab() {
   }, [profileId, forceStopProcess]);
 
   const handleOpenWorkDir = useCallback(async () => {
-    if (profileId) await window.api.openWorkingDir(profileId);
+    if (profileId) await jrc.api.openWorkingDir(profileId);
   }, [profileId]);
 
   const handleSendInput = useCallback(
diff --git a/src/renderer/components/developer/DevApiExplorer.tsx b/src/renderer/components/developer/DevApiExplorer.tsx
index 5b9e687..2598cae 100644
--- a/src/renderer/components/developer/DevApiExplorer.tsx
+++ b/src/renderer/components/developer/DevApiExplorer.tsx
@@ -1,7 +1,7 @@
 import { REST_API_CONFIG, routeConfig } from '@shared/config/API.config';
 import { JSON_TOKEN_COLORS } from '@shared/config/Dev.config';
+import { BodyParamDef, BodyParams, RouteDefinition } from '@shared/types/API.types';
 import { JsonToken } from '@shared/types/Dev.types';
-import { BodyParamDef, BodyParams, RouteDefinition } from '@shared/types/RestAPI.types';
 import React, { useCallback, useMemo, useState } from 'react';
 import { VscCheck, VscCode, VscCopy, VscEdit, VscPlay } from 'react-icons/vsc';
 import { useApp } from '../../AppProvider';
@@ -74,6 +74,14 @@ function buildBodyFromForm(bodyParams: BodyParams, values: FormValues): string {
         const n = Number(val);
         if (!isNaN(n)) obj[k] = n;
       }
+    } else if (def.type === 'json') {
+      if (val !== '') {
+        try {
+          obj[k] = JSON.parse(val as string);
+        } catch {
+          /* skip invalid json */
+        }
+      }
     } else {
       if (val !== '') obj[k] = String(val);
     }
@@ -91,6 +99,8 @@ function parseFormFromJson(bodyParams: BodyParams, json: string): FormValues {
         vals[k] = def.type === 'boolean' ? false : '';
       } else if (def.type === 'boolean') {
         vals[k] = Boolean(v);
+      } else if (def.type === 'json') {
+        vals[k] = typeof v === 'object' ? JSON.stringify(v, null, 2) : String(v);
       } else {
         vals[k] = String(v);
       }
@@ -214,6 +224,16 @@ function BodyFormField({
       <div className="flex-1 flex items-center min-w-0">
         {def.type === 'boolean' ? (
           <Toggle checked={value as boolean} onChange={onChange} />
+        ) : def.type === 'json' ? (
+          <textarea
+            value={value as string}
+            onChange={(e) => onChange(e.target.value)}
+            onContextMenu={onContextMenu as any}
+            placeholder={def.placeholder ?? '[]'}
+            spellCheck={false}
+            rows={3}
+            className="w-full bg-base-950 border border-surface-border rounded px-2 py-1 text-xs font-mono text-text-primary placeholder:text-text-muted/50 focus:outline-none focus:border-accent/40 transition-colors resize-y min-h-[2rem]"
+          />
         ) : (
           <input
             type={def.type === 'number' ? 'number' : 'text'}
diff --git a/src/renderer/components/developer/DevAssets.tsx b/src/renderer/components/developer/DevAssets.tsx
index 56f42ca..251135b 100644
--- a/src/renderer/components/developer/DevAssets.tsx
+++ b/src/renderer/components/developer/DevAssets.tsx
@@ -7,7 +7,7 @@ import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { VscCheck, VscCopy, VscGlobe, VscRefresh, VscSymbolColor } from 'react-icons/vsc';
 import { useTheme } from '../../hooks/ThemeProvider';
 import { useTranslation } from '../../i18n/I18nProvider';
-import { Card, ScrollContent, Section } from '../layout/containers';
+import { Card, ScrollContent, Section } from '../common/layout/containers';
 
 export function DevAssets() {
   const { theme, setTheme } = useTheme();
diff --git a/src/renderer/components/developer/DevDashboard.tsx b/src/renderer/components/developer/DevDashboard.tsx
index 161991b..4789dd5 100644
--- a/src/renderer/components/developer/DevDashboard.tsx
+++ b/src/renderer/components/developer/DevDashboard.tsx
@@ -3,7 +3,7 @@ import { useEffect, useState } from 'react';
 import { VscCircle, VscCircleFilled } from 'react-icons/vsc';
 import { useApp } from '../../AppProvider';
 import { Badge, StatusDot } from '../common/display';
-import { Card, ScrollContent, Section } from '../layout/containers';
+import { Card, DataRow, ScrollContent, Section } from '../common/layout/containers';
 
 declare const __APP_VERSION__: string;
 
@@ -18,56 +18,107 @@ interface SysInfo {
   memoryUsageMB: number;
 }
 
+// ─── Feature flag registry ────────────────────────────────────────────────────
+// Add new flags here — they'll appear automatically in the dashboard.
+
+interface FeatureFlag {
+  label: string;
+  enabled: () => boolean;
+}
+
+function useFeatureFlags(): FeatureFlag[] {
+  const { state } = useApp();
+  const s = state.settings;
+
+  return [
+    { label: 'REST API', enabled: () => s?.restApiEnabled ?? false },
+    { label: 'Launch on Startup', enabled: () => s?.launchOnStartup ?? false },
+    { label: 'Start Minimized', enabled: () => s?.startMinimized ?? false },
+    { label: 'Minimize to Tray', enabled: () => s?.minimizeToTray ?? false },
+    { label: 'Dev Mode', enabled: () => s?.devModeEnabled ?? false },
+    { label: 'Word Wrap', enabled: () => s?.consoleWordWrap ?? false },
+    { label: 'Line Numbers', enabled: () => s?.consoleLineNumbers ?? false },
+    { label: 'Timestamps', enabled: () => s?.consoleTimestamps ?? false },
+  ];
+}
+
+// ─── Component ────────────────────────────────────────────────────────────────
+
 export function DevDashboard() {
   const { state } = useApp();
   const [sysInfo, setSysInfo] = useState<SysInfo | null>(null);
   const [env, setEnv] = useState<JRCEnvironment>();
+  const flags = useFeatureFlags();
 
   useEffect(() => {
-    const load = () => window.api.getSysInfo().then(setSysInfo);
+    const load = () => jrc.api.getSysInfo().then(setSysInfo);
     load();
-    const id = setInterval(load, 3000);
+    const id = setInterval(load, 5000);
     return () => clearInterval(id);
   }, []);
 
   useEffect(() => {
-    window.env.get().then(setEnv);
+    jrc.env.get().then(setEnv);
   }, []);
 
   const runningProfiles = state.processStates.filter((s) => s.running);
-  const totalConsoleLines = Object.values(state.consoleLogs).reduce((a, b) => a + b.length, 0);
-  const restEnabled = state.settings?.restApiEnabled ?? false;
+  const appVersion = typeof __APP_VERSION__ !== 'undefined' ? __APP_VERSION__ : 'unknown';
 
   return (
     <ScrollContent>
-      <Section title="Environment">
-        <div className="grid grid-cols-2 gap-2">
-          <StatCard label="Start-Source" value={env?.startUpSource ?? 'undefined'} />
-          <StatCard label="Type (env)" value={env?.type ?? 'undefined'} />
+      {/* ── Versions ─────────────────────────────────────── */}
+      <Section title="Versions">
+        <div className="grid grid-cols-2 sm:grid-cols-4 gap-2">
+          <StatCard label="App" value={`v${appVersion}`} />
+          <StatCard label="Electron" value={sysInfo?.electronVersion ?? '...'} />
+          <StatCard label="Chrome" value={sysInfo?.chromeVersion ?? '...'} />
+          <StatCard label="Node.js" value={sysInfo?.nodeVersion ?? '...'} />
         </div>
       </Section>
 
-      {sysInfo && (
-        <Card className="p-3">
-          <p className="text-xs text-text-muted font-mono uppercase tracking-widest mb-2">
-            Process Argv
-          </p>
-          <p className="text-xs font-mono text-text-secondary break-all leading-5 select-text">
-            {sysInfo.argv.join(' ')}
-          </p>
+      {/* ── Environment ──────────────────────────────────── */}
+      <Section title="Environment">
+        <Card divided>
+          <DataRow
+            label="Platform"
+            value={sysInfo ? `${sysInfo.platform} (${sysInfo.arch})` : '...'}
+          />
+          <DataRow label="Type" value={env?.type ?? '...'} mono />
+          <DataRow label="Launch Context" value={env?.launchContext ?? '...'} mono />
+          <DataRow label="Process Uptime" value={sysInfo ? formatUptime(sysInfo.uptime) : '...'} />
+          <DataRow label="Main Memory" value={sysInfo ? `${sysInfo.memoryUsageMB} MB` : '...'} />
         </Card>
+      </Section>
+
+      {/* ── Process Argv ─────────────────────────────────── */}
+      {sysInfo && sysInfo.argv.length > 0 && (
+        <Section title="Process Argv" collapsible defaultCollapsed>
+          <Card className="p-3">
+            <p className="text-xs font-mono text-text-secondary break-all leading-5 select-text">
+              {sysInfo.argv.join(' ')}
+            </p>
+          </Card>
+        </Section>
       )}
 
-      <Section title="Feature Flags">
+      {/* ── Feature Flags ────────────────────────────────── */}
+      <Section title={`Feature Flags (${flags.filter((f) => f.enabled()).length}/${flags.length})`}>
         <div className="flex flex-wrap gap-2">
-          <FeatureBadge ok={restEnabled} label="REST API" />
-          <FeatureBadge ok={state.settings?.launchOnStartup ?? false} label="Launch on Startup" />
-          <FeatureBadge ok={state.settings?.minimizeToTray ?? false} label="Minimize to Tray" />
-          <FeatureBadge ok={state.settings?.consoleWordWrap ?? false} label="Word Wrap" />
-          <FeatureBadge ok={state.settings?.consoleLineNumbers ?? false} label="Line Numbers" />
+          {flags.map((flag) => {
+            const on = flag.enabled();
+            return (
+              <Badge
+                key={flag.label}
+                label={flag.label}
+                variant={on ? 'success' : 'default'}
+                icon={on ? <VscCircleFilled size={8} /> : <VscCircle size={8} />}
+              />
+            );
+          })}
         </div>
       </Section>
 
+      {/* ── Running Processes ────────────────────────────── */}
       <Section title={`Running Processes (${runningProfiles.length})`}>
         {runningProfiles.length === 0 ? (
           <p className="text-xs font-mono text-text-muted py-2">No processes running</p>
@@ -86,46 +137,34 @@ export function DevDashboard() {
                     {profile?.name ?? s.profileId}
                   </span>
                   <span className="text-xs font-mono text-text-muted">PID {s.pid}</span>
-                  <span className="text-xs font-mono text-text-muted">{uptimeSec}s</span>
+                  <span className="text-xs font-mono text-text-muted">
+                    {formatUptime(uptimeSec)}
+                  </span>
                 </div>
               );
             })}
           </div>
         )}
       </Section>
-
-      <Section title="System">
-        {sysInfo ? (
-          <div className="grid grid-cols-4 gap-2">
-            <StatCard label="Platform" value={sysInfo.platform} sub={sysInfo.arch} />
-            <StatCard label="Memory" value={`${sysInfo.memoryUsageMB} MB`} />
-            <StatCard label="Node.js" value={sysInfo.nodeVersion} />
-            <StatCard label="Electron" value={sysInfo.electronVersion} />
-          </div>
-        ) : (
-          <p className="text-xs font-mono text-text-muted animate-pulse">Loading...</p>
-        )}
-      </Section>
     </ScrollContent>
   );
 }
 
-function StatCard({ label, value, sub }: { label: string; value: string | number; sub?: string }) {
+// ─── Helpers ──────────────────────────────────────────────────────────────────
+
+function StatCard({ label, value }: { label: string; value: string }) {
   return (
     <Card className="px-4 py-3 space-y-1">
       <p className="text-xs font-mono text-text-muted uppercase tracking-widest">{label}</p>
       <p className="text-lg font-mono font-semibold text-text-primary">{value}</p>
-      {sub && <p className="text-xs font-mono text-text-muted">{sub}</p>}
     </Card>
   );
 }
 
-function FeatureBadge({ ok, label }: { ok: boolean; label: string }) {
-  return (
-    <Badge
-      label={label}
-      variant={ok ? 'success' : 'default'}
-      icon={ok ? <VscCircleFilled size={8} /> : <VscCircle size={8} />}
-    />
-  );
+function formatUptime(seconds: number): string {
+  if (seconds < 60) return `${seconds}s`;
+  if (seconds < 3600) return `${Math.floor(seconds / 60)}m ${seconds % 60}s`;
+  const h = Math.floor(seconds / 3600);
+  const m = Math.floor((seconds % 3600) / 60);
+  return `${h}h ${m}m`;
 }
diff --git a/src/renderer/components/developer/DevDiagnostics.tsx b/src/renderer/components/developer/DevDiagnostics.tsx
index 41574a5..a6c36fa 100644
--- a/src/renderer/components/developer/DevDiagnostics.tsx
+++ b/src/renderer/components/developer/DevDiagnostics.tsx
@@ -1,43 +1,102 @@
+import { JRCEnvironment } from '@shared/types/App.types';
 import { useEffect, useRef, useState } from 'react';
 import { VscCheck, VscCopy } from 'react-icons/vsc';
 import { useApp } from '../../AppProvider';
 import { Button } from '../common/inputs';
-import { Card, DataRow, ScrollContent, Section } from '../layout/containers';
+import { Card, DataRow, ScrollContent, Section } from '../common/layout/containers';
 
 declare const __APP_VERSION__: string;
 
 interface PerfSample {
   timestamp: number;
-  memMB: number;
+  heapUsedMB: number;
+  heapTotalMB: number;
+  heapLimitMB: number;
+}
+
+interface SysInfo {
+  platform: string;
+  arch: string;
+  nodeVersion: string;
+  electronVersion: string;
+  chromeVersion: string;
+  argv: string[];
+  uptime: number;
+  memoryUsageMB: number;
+}
+
+function samplePerf(): PerfSample | null {
+  const mem = (performance as any).memory;
+  if (!mem) return null;
+  return {
+    timestamp: Date.now(),
+    heapUsedMB: Math.round(mem.usedJSHeapSize / 1024 / 1024),
+    heapTotalMB: Math.round(mem.totalJSHeapSize / 1024 / 1024),
+    heapLimitMB: Math.round(mem.jsHeapSizeLimit / 1024 / 1024),
+  };
 }
 
 export function DevDiagnostics() {
   const { state } = useApp();
   const [perfSamples, setPerfSamples] = useState<PerfSample[]>([]);
+  const [sysInfo, setSysInfo] = useState<SysInfo | null>(null);
+  const [env, setEnv] = useState<JRCEnvironment>();
   const [copied, setCopied] = useState(false);
   const intervalRef = useRef<ReturnType<typeof setInterval> | null>(null);
 
-  const samplePerf = () => {
-    if (window.performance && (performance as any).memory) {
-      const mb = Math.round((performance as any).memory.usedJSHeapSize / 1024 / 1024);
-      setPerfSamples((prev) => [...prev.slice(-29), { timestamp: Date.now(), memMB: mb }]);
-    }
-  };
-
   useEffect(() => {
-    samplePerf();
-    intervalRef.current = setInterval(samplePerf, 2000);
+    const tick = () => {
+      const s = samplePerf();
+      if (s) setPerfSamples((prev) => [...prev.slice(-59), s]);
+    };
+    tick();
+    intervalRef.current = setInterval(tick, 2000);
     return () => {
       if (intervalRef.current) clearInterval(intervalRef.current);
     };
   }, []);
 
-  const exportDiagReport = () => {
+  useEffect(() => {
+    jrc.api.getSysInfo().then(setSysInfo);
+    jrc.env.get().then(setEnv);
+  }, []);
+
+  const latest = perfSamples[perfSamples.length - 1];
+  const maxUsed = Math.max(...perfSamples.map((s) => s.heapUsedMB), 1);
+
+  const totalConsoleLines = Object.values(state.consoleLogs).reduce((a, b) => a + b.length, 0);
+  const runningCount = state.processStates.filter((s) => s.running).length;
+  const profilesWithLogging = state.profiles.filter((p) => p.fileLogging).length;
+  const totalEnvVars = state.profiles.reduce((sum, p) => sum + (p.envVars ?? []).length, 0);
+
+  const exportBugReport = () => {
     const report = {
-      timestamp: new Date().toISOString(),
-      appVersion: typeof __APP_VERSION__ !== 'undefined' ? __APP_VERSION__ : 'unknown',
-      profiles: state.profiles.length,
-      runningProcesses: state.processStates.filter((s) => s.running).length,
+      _generated: new Date().toISOString(),
+      _version: typeof __APP_VERSION__ !== 'undefined' ? __APP_VERSION__ : 'unknown',
+      environment: {
+        platform: sysInfo?.platform,
+        arch: sysInfo?.arch,
+        nodeVersion: sysInfo?.nodeVersion,
+        electronVersion: sysInfo?.electronVersion,
+        chromeVersion: sysInfo?.chromeVersion,
+        uptime: sysInfo?.uptime,
+        type: env?.type,
+        launchContext: env?.launchContext,
+      },
+      memory: {
+        mainProcessMB: sysInfo?.memoryUsageMB,
+        rendererHeapUsedMB: latest?.heapUsedMB,
+        rendererHeapTotalMB: latest?.heapTotalMB,
+        rendererHeapLimitMB: latest?.heapLimitMB,
+      },
+      state: {
+        profiles: state.profiles.length,
+        runningProcesses: runningCount,
+        totalConsoleLines,
+        totalEnvVars,
+        profilesWithFileLogging: profilesWithLogging,
+        settingsLoaded: !!state.settings,
+      },
       settings: state.settings,
       profileMeta: state.profiles.map((p) => ({
         id: p.id,
@@ -46,33 +105,24 @@ export function DevDiagnostics() {
         fileLogging: p.fileLogging ?? false,
         autoRestart: p.autoRestart,
       })),
-      consoleLogCounts: Object.fromEntries(
-        Object.entries(state.consoleLogs).map(([id, lines]) => [id, lines.length])
-      ),
-      memorySnapshot: perfSamples[perfSamples.length - 1] ?? null,
     };
     navigator.clipboard.writeText(JSON.stringify(report, null, 2));
     setCopied(true);
     setTimeout(() => setCopied(false), 2000);
   };
 
-  const latest = perfSamples[perfSamples.length - 1];
-  const maxMem = Math.max(...perfSamples.map((s) => s.memMB), 1);
-
-  const profilesWithLogging = state.profiles.filter((p) => p.fileLogging).length;
-  const totalEnvVars = state.profiles.reduce((sum, p) => sum + (p.envVars ?? []).length, 0);
-
   return (
     <ScrollContent>
+      {/* ── JS Heap Memory ──────────────────────────────── */}
       <Section title="JS Heap Memory (renderer)">
         <div className="rounded-lg border border-surface-border bg-base-950 px-3 py-2">
-          <div className="flex items-end gap-px h-16 mb-1">
+          <div className="flex items-end gap-px h-20 mb-1">
             {perfSamples.map((s, i) => (
               <div
                 key={i}
                 className="flex-1 bg-accent/40 rounded-t-sm transition-all duration-300"
-                style={{ height: `${Math.max(4, (s.memMB / maxMem) * 100)}%` }}
-                title={`${s.memMB} MB`}
+                style={{ height: `${Math.max(4, (s.heapUsedMB / maxUsed) * 100)}%` }}
+                title={`${s.heapUsedMB} MB`}
               />
             ))}
             {perfSamples.length === 0 && (
@@ -81,84 +131,29 @@ export function DevDiagnostics() {
               </p>
             )}
           </div>
-          <div className="flex items-center justify-between text-xs font-mono text-text-muted">
-            <span>{latest ? `${latest.memMB} MB used` : '---'}</span>
-            <span>max {maxMem} MB</span>
-          </div>
+          {latest && (
+            <div className="flex items-center justify-between text-xs font-mono text-text-muted">
+              <span>{latest.heapUsedMB} MB used</span>
+              <span>{latest.heapTotalMB} MB allocated</span>
+              <span>{latest.heapLimitMB} MB limit</span>
+            </div>
+          )}
         </div>
       </Section>
 
-      <Section title="Renderer State">
-        <Card divided>
-          <DataRow
-            label="Active profile ID"
-            value={state.activeProfileId || '---'}
-            mono
-            labelWidth="w-44"
-          />
-          <DataRow
-            label="Profiles loaded"
-            value={String(state.profiles.length)}
-            labelWidth="w-44"
-          />
-          <DataRow
-            label="Process states"
-            value={String(state.processStates.length)}
-            labelWidth="w-44"
-          />
-          <DataRow
-            label="Console buffers"
-            value={`${Object.keys(state.consoleLogs).length} profiles`}
-            labelWidth="w-44"
-          />
-          <DataRow
-            label="Total buffered lines"
-            value={String(Object.values(state.consoleLogs).reduce((a, b) => a + b.length, 0))}
-            labelWidth="w-44"
-          />
-          <DataRow
-            label="Settings loaded"
-            value={state.settings ? 'Yes' : 'No'}
-            labelWidth="w-44"
-          />
-        </Card>
-      </Section>
-
-      <Section title="Feature Usage">
-        <Card divided>
-          <DataRow
-            label="Console timestamps"
-            value={state.settings?.consoleTimestamps ? 'On' : 'Off'}
-            labelWidth="w-44"
-          />
-          <DataRow
-            label="File logging (profiles)"
-            value={`${profilesWithLogging} / ${state.profiles.length}`}
-            labelWidth="w-44"
-          />
-          <DataRow label="Total env vars" value={String(totalEnvVars)} labelWidth="w-44" />
-          <DataRow
-            label="REST API"
-            value={state.settings?.restApiEnabled ? `Port ${state.settings.restApiPort}` : 'Off'}
-            labelWidth="w-44"
-          />
-          <DataRow
-            label="Word wrap"
-            value={state.settings?.consoleWordWrap ? 'On' : 'Off'}
-            labelWidth="w-44"
-          />
-          <DataRow
-            label="Line numbers"
-            value={state.settings?.consoleLineNumbers ? 'On' : 'Off'}
-            labelWidth="w-44"
-          />
-        </Card>
+      {/* ── Renderer Metrics ────────────────────────────── */}
+      <Section title="Renderer Metrics">
+        <div className="grid grid-cols-2 sm:grid-cols-4 gap-2">
+          <MetricCard label="Profiles" value={state.profiles.length} />
+          <MetricCard label="Running" value={runningCount} accent={runningCount > 0} />
+          <MetricCard label="Console Lines" value={totalConsoleLines} />
+          <MetricCard label="Env Vars" value={totalEnvVars} />
+        </div>
       </Section>
 
-      <Section title="Profile Console Buffers">
-        {state.profiles.length === 0 ? (
-          <p className="text-xs font-mono text-text-muted">No profiles</p>
-        ) : (
+      {/* ── Profile Console Buffers ─────────────────────── */}
+      {state.profiles.length > 0 && (
+        <Section title="Console Buffers" collapsible>
           <Card divided>
             {state.profiles.map((p) => {
               const lines = state.consoleLogs[p.id]?.length ?? 0;
@@ -172,10 +167,6 @@ export function DevDiagnostics() {
                   <span className="text-xs font-mono text-text-primary flex-1 truncate">
                     {p.name}
                   </span>
-                  <span className="text-[10px] font-mono text-text-muted">
-                    {(p.envVars ?? []).length > 0 ? `${(p.envVars ?? []).length} env` : ''}
-                    {p.fileLogging ? ' log' : ''}
-                  </span>
                   <span className="text-xs font-mono text-text-muted">
                     {lines.toLocaleString()} lines
                   </span>
@@ -183,18 +174,52 @@ export function DevDiagnostics() {
               );
             })}
           </Card>
-        )}
+        </Section>
+      )}
+
+      {/* ── Renderer State ──────────────────────────────── */}
+      <Section title="Renderer State" collapsible defaultCollapsed>
+        <Card divided>
+          <DataRow label="Active profile ID" value={state.activeProfileId || '---'} mono />
+          <DataRow label="Process states" value={String(state.processStates.length)} />
+          <DataRow
+            label="Console buffers"
+            value={`${Object.keys(state.consoleLogs).length} profiles`}
+          />
+          <DataRow label="Settings loaded" value={state.settings ? 'Yes' : 'No'} />
+          <DataRow
+            label="File logging"
+            value={`${profilesWithLogging} / ${state.profiles.length}`}
+          />
+        </Card>
       </Section>
 
-      <Section title="Diagnostic Report">
-        <p className="text-xs text-text-muted font-mono">
-          Copy a JSON snapshot of the current app state to clipboard for bug reports.
+      {/* ── Bug Report ──────────────────────────────────── */}
+      <Section title="Bug Report">
+        <p className="text-xs text-text-muted font-mono leading-relaxed">
+          Copies a JSON snapshot including app version, environment, memory stats, settings, and
+          profile metadata to clipboard. Paste into a bug report for full context.
         </p>
-        <Button variant="ghost" size="sm" onClick={exportDiagReport}>
+        <Button variant="ghost" size="sm" onClick={exportBugReport}>
           {copied ? <VscCheck size={11} className="text-accent" /> : <VscCopy size={11} />}
-          {copied ? 'Copied!' : 'Copy Report to Clipboard'}
+          {copied ? 'Copied!' : 'Copy Bug Report to Clipboard'}
         </Button>
       </Section>
     </ScrollContent>
   );
 }
+
+// ─── Helpers ──────────────────────────────────────────────────────────────────
+
+function MetricCard({ label, value, accent }: { label: string; value: number; accent?: boolean }) {
+  return (
+    <Card className="px-4 py-3 space-y-1">
+      <p className="text-xs font-mono text-text-muted uppercase tracking-widest">{label}</p>
+      <p
+        className={`text-2xl font-mono font-semibold ${accent ? 'text-accent' : 'text-text-primary'}`}
+      >
+        {value.toLocaleString()}
+      </p>
+    </Card>
+  );
+}
diff --git a/src/renderer/components/developer/DevModeGate.tsx b/src/renderer/components/developer/DevModeGate.tsx
index 1dd7360..89b9622 100644
--- a/src/renderer/components/developer/DevModeGate.tsx
+++ b/src/renderer/components/developer/DevModeGate.tsx
@@ -54,7 +54,7 @@ export function DevModeGate() {
             variant="primary"
             size="sm"
             onClick={() => {
-              window.env.toggleDevMode(!devEnabled);
+              jrc.env.toggleDevMode(!devEnabled);
               setDialogOpen(false);
             }}
           >
diff --git a/src/renderer/components/developer/DevStorage.tsx b/src/renderer/components/developer/DevStorage.tsx
index d3b620a..9675e73 100644
--- a/src/renderer/components/developer/DevStorage.tsx
+++ b/src/renderer/components/developer/DevStorage.tsx
@@ -1,9 +1,10 @@
 import { useEffect, useState } from 'react';
-import { VscRefresh, VscTrash } from 'react-icons/vsc';
-import { useApp } from '../../AppProvider';
+import { VscFolderOpened, VscRefresh, VscTrash } from 'react-icons/vsc';
 import { Button } from '../common/inputs';
+import { Card, ScrollContent, Section } from '../common/layout/containers';
 import { Dialog } from '../common/overlays';
-import { Card, DataRow, ScrollContent, Section } from '../layout/containers';
+
+// ─── Session Storage helpers ──────────────────────────────────────────────────
 
 interface SessionEntry {
   key: string;
@@ -27,60 +28,77 @@ function getSessionEntries(): SessionEntry[] {
 
 function formatBytes(n: number): string {
   if (n < 1024) return `${n} B`;
-  return `${(n / 1024).toFixed(1)} KB`;
+  if (n < 1024 * 1024) return `${(n / 1024).toFixed(1)} KB`;
+  return `${(n / 1024 / 1024).toFixed(1)} MB`;
 }
 
+// ─── Component ────────────────────────────────────────────────────────────────
+
 export function DevStorage() {
-  const { state } = useApp();
+  const [storeJson, setStoreJson] = useState<string | null>(null);
+  const [storeSize, setStoreSize] = useState(0);
   const [sessionEntries, setSessionEntries] = useState<SessionEntry[]>([]);
   const [confirmReset, setConfirmReset] = useState<'electron-store' | 'session' | null>(null);
 
-  const refresh = () => setSessionEntries(getSessionEntries());
+  const refreshStore = () =>
+    jrc.api.getStoreJson().then((json: string) => {
+      setStoreJson(json);
+      setStoreSize(new Blob([json]).size);
+    });
+
+  const refreshSession = () => setSessionEntries(getSessionEntries());
+
   useEffect(() => {
-    refresh();
+    refreshStore();
+    refreshSession();
   }, []);
 
   const totalSessionBytes = sessionEntries.reduce((a, b) => a + b.sizeBytes, 0);
-  const profilesWithLogging = state.profiles.filter((p) => p.fileLogging).length;
+
+  let formattedJson = '';
+  try {
+    formattedJson = JSON.stringify(JSON.parse(storeJson ?? '{}'), null, 2);
+  } catch {
+    formattedJson = storeJson ?? '';
+  }
 
   return (
     <ScrollContent>
-      <Section title="Electron Store (Persistent)">
-        <Card divided>
-          <DataRow label="Profiles" value={String(state.profiles.length)} />
-          <DataRow label="Active profile ID" value={state.activeProfileId || '---'} mono />
-          <DataRow
-            label="REST API"
-            value={
-              state.settings?.restApiEnabled
-                ? `Enabled (${state.settings.restApiPort})`
-                : 'Disabled'
-            }
-          />
-          <DataRow
-            label="Console max lines"
-            value={String(state.settings?.consoleMaxLines ?? '---')}
-          />
-          <DataRow
-            label="Console timestamps"
-            value={state.settings?.consoleTimestamps ? 'Enabled' : 'Disabled'}
-          />
-          <DataRow
-            label="File logging profiles"
-            value={`${profilesWithLogging} / ${state.profiles.length}`}
-          />
+      {/* ── Electron Store (JSON Viewer) ─────────────────── */}
+      <Section title={`Electron Store (${formatBytes(storeSize)})`}>
+        <Card className="flex flex-col">
+          <div className="max-h-80 overflow-auto scrollbar-thin">
+            {storeJson === null ? (
+              <p className="text-xs font-mono text-text-muted p-3 animate-pulse">Loading...</p>
+            ) : (
+              <pre className="text-[11px] font-mono text-text-secondary p-3 leading-5 select-text whitespace-pre">
+                {formattedJson}
+              </pre>
+            )}
+          </div>
         </Card>
-        <Button variant="danger" size="sm" onClick={() => setConfirmReset('electron-store')}>
-          <VscTrash size={11} />
-          Reset Electron Store
-        </Button>
+        <div className="flex items-center gap-2 mt-1">
+          <Button variant="ghost" size="sm" onClick={refreshStore}>
+            <VscRefresh size={11} />
+            Refresh
+          </Button>
+          <Button variant="ghost" size="sm" onClick={() => jrc.api.openStoreFile()}>
+            <VscFolderOpened size={11} />
+            Open in Explorer
+          </Button>
+          <Button variant="danger" size="sm" onClick={() => setConfirmReset('electron-store')}>
+            <VscTrash size={11} />
+            Reset Store
+          </Button>
+        </div>
       </Section>
 
+      {/* ── Session Storage ──────────────────────────────── */}
       <Section title={`Session Storage (${formatBytes(totalSessionBytes)})`}>
         <div className="flex items-center justify-between mb-2">
           <p className="text-xs text-text-muted font-mono">{sessionEntries.length} keys</p>
           <button
-            onClick={refresh}
+            onClick={refreshSession}
             className="text-text-muted hover:text-accent transition-colors p-1"
           >
             <VscRefresh size={12} />
@@ -103,7 +121,7 @@ export function DevStorage() {
                   <button
                     onClick={() => {
                       sessionStorage.removeItem(e.key);
-                      refresh();
+                      refreshSession();
                     }}
                     className="text-text-muted hover:text-red-400 transition-colors"
                   >
@@ -125,6 +143,7 @@ export function DevStorage() {
         </Button>
       </Section>
 
+      {/* ── Dialogs ──────────────────────────────────────── */}
       <Dialog
         open={confirmReset === 'electron-store'}
         title="Reset Electron Store?"
@@ -132,8 +151,9 @@ export function DevStorage() {
         confirmLabel="Reset"
         danger
         onConfirm={async () => {
-          await window.api.resetStore();
+          await jrc.api.resetStore();
           setConfirmReset(null);
+          refreshStore();
         }}
         onCancel={() => setConfirmReset(null)}
       />
@@ -145,7 +165,7 @@ export function DevStorage() {
         danger
         onConfirm={() => {
           sessionStorage.clear();
-          refresh();
+          refreshSession();
           setConfirmReset(null);
         }}
         onCancel={() => setConfirmReset(null)}
diff --git a/src/renderer/components/developer/DeveloperTab.tsx b/src/renderer/components/developer/DeveloperTab.tsx
index 47469c9..600c4a2 100644
--- a/src/renderer/components/developer/DeveloperTab.tsx
+++ b/src/renderer/components/developer/DeveloperTab.tsx
@@ -2,7 +2,7 @@ import { useState } from 'react';
 import { VscBeaker, VscDashboard, VscDatabase, VscPlug, VscSymbolColor } from 'react-icons/vsc';
 import { useTranslation } from '../../i18n/I18nProvider';
 import { StatusDot } from '../common/display';
-import { TabBar } from '../layout/navigation';
+import { TabBar } from '../common/layout/navigation';
 import { DevApiExplorer } from './DevApiExplorer';
 import { DevAssets } from './DevAssets';
 import { DevDashboard } from './DevDashboard';
diff --git a/src/renderer/components/faq/FaqPanel.tsx b/src/renderer/components/faq/FaqPanel.tsx
index bdfe1d7..fca417e 100644
--- a/src/renderer/components/faq/FaqPanel.tsx
+++ b/src/renderer/components/faq/FaqPanel.tsx
@@ -2,7 +2,7 @@ import type { FaqItem } from '@shared/config/faq/_index';
 import { getFAQ } from '@shared/config/faq/_index';
 import { useEffect, useMemo, useState } from 'react';
 import { useTranslation } from '../../i18n/I18nProvider';
-import { SidebarLayout } from '../layout/navigation';
+import { SidebarLayout } from '../common/layout/navigation';
 
 export function FaqPanel() {
   const { language, t } = useTranslation();
diff --git a/src/renderer/components/layout/navigation/TabBar.tsx b/src/renderer/components/layout/navigation/TabBar.tsx
deleted file mode 100644
index d9cc0dd..0000000
--- a/src/renderer/components/layout/navigation/TabBar.tsx
+++ /dev/null
@@ -1,61 +0,0 @@
-import React from 'react';
-
-export interface Tab {
-  id: string;
-  label: string;
-  icon?: React.ReactNode;
-  badge?: React.ReactNode;
-  Icon?: React.ElementType;
-}
-
-interface TabBarProps {
-  tabs: Tab[];
-  active: string;
-  onChange: (id: string) => void;
-  accentColor?: string;
-  className?: string;
-  dotTab?: string;
-}
-
-export function TabBar({
-  tabs,
-  active,
-  onChange,
-  accentColor = 'var(--tw-theme-accent, #4ade80)',
-  className = '',
-  dotTab,
-}: TabBarProps) {
-  return (
-    <div
-      className={[
-        'flex items-center px-4 border-b border-surface-border bg-base-900 shrink-0',
-        className,
-      ].join(' ')}
-    >
-      {tabs.map((tab) => {
-        const isActive = tab.id === active;
-        return (
-          <button
-            key={tab.id}
-            onClick={() => onChange(tab.id)}
-            className={[
-              'flex items-center gap-1.5 px-3 py-2 text-xs border-b-2 -mb-px transition-all duration-150',
-              isActive
-                ? 'font-medium'
-                : 'text-text-muted border-transparent hover:text-text-primary',
-            ].join(' ')}
-            style={isActive ? { borderBottomColor: accentColor, color: accentColor } : {}}
-          >
-            {tab.icon}
-            {tab.Icon && <tab.Icon size={13} />}
-            {tab.label}
-            {tab.badge}
-            {dotTab === tab.id && (
-              <span className="ml-1 inline-block w-1.5 h-1.5 rounded-full bg-console-warn align-middle" />
-            )}
-          </button>
-        );
-      })}
-    </div>
-  );
-}
diff --git a/src/renderer/components/profiles/ConfigTab.tsx b/src/renderer/components/profiles/ConfigTab.tsx
index 8bf3cab..9b60f5c 100644
--- a/src/renderer/components/profiles/ConfigTab.tsx
+++ b/src/renderer/components/profiles/ConfigTab.tsx
@@ -3,11 +3,11 @@ import { useCallback, useEffect, useMemo, useState } from 'react';
 import { useApp } from '../../AppProvider';
 import { useTranslation } from '../../i18n/I18nProvider';
 import { Button } from '../common/inputs';
+import { Card, Section } from '../common/layout/containers';
+import { TabBar } from '../common/layout/navigation';
+import { Toolbar } from '../common/layout/shell';
 import { ArgList, EnvVarList, PropList } from '../common/lists';
 import { Dialog } from '../common/overlays';
-import { Card, Section } from '../layout/containers';
-import { TabBar } from '../layout/navigation';
-import { Toolbar } from '../layout/shell';
 import { FilesSection } from './FilesSection';
 import { GeneralSection } from './GeneralSection';
 
diff --git a/src/renderer/components/profiles/FilesSection.tsx b/src/renderer/components/profiles/FilesSection.tsx
index 7e8c06b..824480d 100644
--- a/src/renderer/components/profiles/FilesSection.tsx
+++ b/src/renderer/components/profiles/FilesSection.tsx
@@ -20,15 +20,15 @@ export function FilesSection({
   const { onContextMenu, contextMenu } = useInputContextMenu();
 
   const handlePickJar = async () => {
-    const p = await window.api.pickJar();
+    const p = await jrc.api.pickJar();
     if (p) update({ jarPath: p });
   };
   const handlePickDir = async () => {
-    const p = await window.api.pickDir();
+    const p = await jrc.api.pickDir();
     if (p) update({ workingDir: p });
   };
   const handlePickResolutionDir = async () => {
-    const p = await window.api.pickDir();
+    const p = await jrc.api.pickDir();
     if (p)
       update({
         jarResolution: {
@@ -43,7 +43,7 @@ export function FilesSection({
       });
   };
   const handlePickJava = async () => {
-    const p = await window.api.pickJava();
+    const p = await jrc.api.pickJava();
     if (p) update({ javaPath: p });
   };
 
diff --git a/src/renderer/components/profiles/GeneralSection.tsx b/src/renderer/components/profiles/GeneralSection.tsx
index e3fdd00..70bf74a 100644
--- a/src/renderer/components/profiles/GeneralSection.tsx
+++ b/src/renderer/components/profiles/GeneralSection.tsx
@@ -1,7 +1,7 @@
 import { Profile } from '@shared/types/Profile.types';
 import { useTranslation } from '../../i18n/I18nProvider';
 import { Toggle } from '../common/inputs';
-import { Card, Section } from '../layout/containers';
+import { Card, Section } from '../common/layout/containers';
 
 export function GeneralSection({
   draft,
diff --git a/src/renderer/components/profiles/LogsTab.tsx b/src/renderer/components/profiles/LogsTab.tsx
index 3319b0d..c9c1699 100644
--- a/src/renderer/components/profiles/LogsTab.tsx
+++ b/src/renderer/components/profiles/LogsTab.tsx
@@ -3,8 +3,8 @@ import { VscCopy, VscFolderOpened, VscRefresh, VscTrash } from 'react-icons/vsc'
 import { useApp } from '../../AppProvider';
 import { useTranslation } from '../../i18n/I18nProvider';
 import { Button } from '../common/inputs';
+import { Toolbar } from '../common/layout/shell';
 import { ContextMenu, Dialog } from '../common/overlays';
-import { Toolbar } from '../layout/shell';
 
 interface LogFileInfo {
   filename: string;
@@ -35,7 +35,7 @@ export function LogsTab() {
 
   const refresh = useCallback(async () => {
     if (!profileId) return;
-    const files = await window.api.getLogFiles(profileId);
+    const files = await jrc.api.getLogFiles(profileId);
     setLogFiles(files);
   }, [profileId]);
 
@@ -48,14 +48,14 @@ export function LogsTab() {
   const handleSelectFile = useCallback(async (file: LogFileInfo) => {
     setSelectedFile(file);
     setLoading(true);
-    const content = await window.api.readLogFile(file.filePath);
+    const content = await jrc.api.readLogFile(file.filePath);
     setLogContent(content);
     setLoading(false);
   }, []);
 
   const handleDelete = useCallback(async () => {
     if (!deleteTarget) return;
-    await window.api.deleteLogFile(deleteTarget.filePath);
+    await jrc.api.deleteLogFile(deleteTarget.filePath);
     if (selectedFile?.filePath === deleteTarget.filePath) {
       setSelectedFile(null);
       setLogContent(null);
@@ -66,7 +66,7 @@ export function LogsTab() {
 
   const handleOpenDir = useCallback(async () => {
     if (!profileId) return;
-    await window.api.openLogsDirectory(profileId);
+    await jrc.api.openLogsDirectory(profileId);
   }, [profileId]);
 
   if (!activeProfile) {
@@ -174,7 +174,7 @@ export function LogsTab() {
                 <button
                   onClick={(e) => {
                     if (e.shiftKey) {
-                      window.api.deleteLogFile(selectedFile.filePath);
+                      jrc.api.deleteLogFile(selectedFile.filePath);
                       setSelectedFile(null);
                       setLogContent(null);
                       refresh();
diff --git a/src/renderer/components/profiles/ProfileTab.tsx b/src/renderer/components/profiles/ProfileTab.tsx
index 02152a2..4d6e8df 100644
--- a/src/renderer/components/profiles/ProfileTab.tsx
+++ b/src/renderer/components/profiles/ProfileTab.tsx
@@ -3,9 +3,9 @@ import React, { useEffect, useState } from 'react';
 import { PROFILE_COLORS, useApp } from '../../AppProvider';
 import { useTranslation } from '../../i18n/I18nProvider';
 import { Button, Input } from '../common/inputs';
+import { Section } from '../common/layout/containers';
+import { Toolbar } from '../common/layout/shell';
 import { Dialog } from '../common/overlays';
-import { Section } from '../layout/containers';
-import { Toolbar } from '../layout/shell';
 
 export function ProfileTab() {
   const { activeProfile, saveProfile, deleteProfile } = useApp();
diff --git a/src/renderer/components/profiles/TemplateModal.tsx b/src/renderer/components/profiles/TemplateModal.tsx
index 1b9adbf..a4c37b5 100644
--- a/src/renderer/components/profiles/TemplateModal.tsx
+++ b/src/renderer/components/profiles/TemplateModal.tsx
@@ -35,7 +35,7 @@ export function TemplateModal({ open, onClose }: Props) {
   const load = async () => {
     setLoading(true);
     setError(null);
-    const res = await window.api.fetchTemplates();
+    const res = await jrc.api.fetchTemplates();
     setLoading(false);
     if (!res.ok || !res.data) {
       setError(res.error ?? 'Failed to load templates');
diff --git a/src/renderer/components/profiles/jar/DynamicJarConfig.tsx b/src/renderer/components/profiles/jar/DynamicJarConfig.tsx
index 12e8a72..805dcc9 100644
--- a/src/renderer/components/profiles/jar/DynamicJarConfig.tsx
+++ b/src/renderer/components/profiles/jar/DynamicJarConfig.tsx
@@ -1,5 +1,4 @@
-import { JAR_RESOLUTION_STRATEGIES } from '@shared/config/JarResolution.config';
-import type { JarResolutionConfig } from '@shared/types/JarResolution.types';
+import type { JarResolutionConfig } from '@shared/types/Profile.types';
 import { useInputContextMenu } from '../../../hooks/useInputContextMenu';
 import { useJarResolutionPreview } from '../../../hooks/useJarResolutionPreview';
 import { useTranslation } from '../../../i18n/I18nProvider';
@@ -48,15 +47,15 @@ export function DynamicJarConfig({ config, onChange, onPickDir }: Props) {
           {t('config.strategy')}
         </label>
         <div className="flex flex-col gap-1">
-          {JAR_RESOLUTION_STRATEGIES.map((s) => {
-            const keys = STRATEGY_KEYS[s.id];
+          {(Object.keys(STRATEGY_KEYS) as Array<JarResolutionConfig['strategy']>).map((id) => {
+            const keys = STRATEGY_KEYS[id];
             return (
               <button
-                key={s.id}
-                onClick={() => onChange({ strategy: s.id })}
+                key={id}
+                onClick={() => onChange({ strategy: id })}
                 className={[
                   'flex items-start gap-3 px-3 py-2 rounded-lg border text-left transition-colors',
-                  config.strategy === s.id
+                  config.strategy === id
                     ? 'border-accent/30 bg-accent/5'
                     : 'border-surface-border bg-base-900/50 hover:border-surface-border/80',
                 ].join(' ')}
@@ -64,7 +63,7 @@ export function DynamicJarConfig({ config, onChange, onPickDir }: Props) {
                 <span
                   className={[
                     'mt-0.5 w-3 h-3 rounded-full border-2 shrink-0 transition-colors',
-                    config.strategy === s.id
+                    config.strategy === id
                       ? 'border-accent bg-accent'
                       : 'border-surface-border bg-transparent',
                   ].join(' ')}
@@ -73,13 +72,13 @@ export function DynamicJarConfig({ config, onChange, onPickDir }: Props) {
                   <span
                     className={[
                       'block text-xs font-mono',
-                      config.strategy === s.id ? 'text-accent' : 'text-text-primary',
+                      config.strategy === id ? 'text-accent' : 'text-text-primary',
                     ].join(' ')}
                   >
-                    {keys ? t(keys.label) : s.label}
+                    {t(keys.label)}
                   </span>
                   <span className="block text-xs text-text-muted mt-0.5 leading-relaxed">
-                    {keys ? t(keys.hint) : s.hint}
+                    {t(keys.hint)}
                   </span>
                 </span>
               </button>
diff --git a/src/renderer/components/profiles/jar/JarSelector.tsx b/src/renderer/components/profiles/jar/JarSelector.tsx
index 97f9dbc..7e56043 100644
--- a/src/renderer/components/profiles/jar/JarSelector.tsx
+++ b/src/renderer/components/profiles/jar/JarSelector.tsx
@@ -1,5 +1,4 @@
-import { DEFAULT_JAR_RESOLUTION } from '@shared/config/JarResolution.config';
-import type { JarResolutionConfig } from '@shared/types/JarResolution.types';
+import type { JarResolutionConfig } from '@shared/types/Profile.types';
 import { useTranslation } from '../../../i18n/I18nProvider';
 import { DynamicJarConfig } from './DynamicJarConfig';
 import { StaticJarPicker } from './StaticJarPicker';
@@ -22,7 +21,13 @@ export function JarSelector({
   onPickDir,
 }: Props) {
   const { t } = useTranslation();
-  const config = resolution ?? DEFAULT_JAR_RESOLUTION;
+  const config: JarResolutionConfig = resolution ?? {
+    enabled: false,
+    baseDir: '',
+    pattern: 'app-{version}.jar',
+    strategy: 'highest-version',
+    regexOverride: '',
+  };
   const isDynamic = config.enabled;
 
   const setDynamic = (enabled: boolean) => {
diff --git a/src/renderer/components/profiles/jar/ResolutionPreview.tsx b/src/renderer/components/profiles/jar/ResolutionPreview.tsx
index 321337e..4a66f0e 100644
--- a/src/renderer/components/profiles/jar/ResolutionPreview.tsx
+++ b/src/renderer/components/profiles/jar/ResolutionPreview.tsx
@@ -1,4 +1,4 @@
-import type { JarResolutionResult } from '@shared/types/JarResolution.types';
+import type { JarResolutionResult } from '@shared/types/Profile.types';
 import { VscCheck, VscSync, VscWarning } from 'react-icons/vsc';
 import { useTranslation } from '../../../i18n/I18nProvider';
 
diff --git a/src/renderer/components/settings/SettingsRow.tsx b/src/renderer/components/settings/SettingsRow.tsx
index e9dfe93..42a0e40 100644
--- a/src/renderer/components/settings/SettingsRow.tsx
+++ b/src/renderer/components/settings/SettingsRow.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { Section } from '../layout/containers';
+import { Section } from '../common/layout/containers';
 
 export { Section };
 
diff --git a/src/renderer/components/settings/SettingsSectionRenderer.tsx b/src/renderer/components/settings/SettingsSectionRenderer.tsx
index 99b9a49..1ba2a76 100644
--- a/src/renderer/components/settings/SettingsSectionRenderer.tsx
+++ b/src/renderer/components/settings/SettingsSectionRenderer.tsx
@@ -1,11 +1,11 @@
 import type { AppSettings } from '@shared/config/Settings.config';
 import { SETTINGS_SCHEMA } from '@shared/config/Settings.config';
-import type { AnyFieldDef, NoteDef, NumberDef, RangeDef, ToggleDef } from '@shared/types/Settings.types';
+import type { AnyFieldDef, NoteDef, NumberDef, RangeDef } from '@shared/types/Settings.types';
 import React, { useMemo } from 'react';
 import { useTranslation } from '../../i18n/I18nProvider';
 import type { TranslationKey } from '../../i18n/TranslationKeys';
 import { Toggle } from '../common/inputs';
-import { Section } from '../layout/containers';
+import { Section } from '../common/layout/containers';
 import { NumInput, Row } from './SettingsRow';
 
 type SetFn = (patch: Partial<AppSettings>) => void;
@@ -70,42 +70,44 @@ function SettingsField({
         />
       )}
 
-      {field.type === 'number' && (() => {
-        const f = field as NumberDef;
-        return (
-          <NumInput
-            value={s[fieldKey] as number}
-            min={f.min}
-            max={f.max}
-            step={f.step}
-            onChange={(v) => set({ [fieldKey]: v } as Partial<AppSettings>)}
-          />
-        );
-      })()}
-
-      {field.type === 'range' && (() => {
-        const f = field as RangeDef;
-        const val = s[fieldKey] as number;
-        return (
-          <div className="flex items-center gap-2.5">
-            <input
-              type="range"
+      {field.type === 'number' &&
+        (() => {
+          const f = field as NumberDef;
+          return (
+            <NumInput
+              value={s[fieldKey] as number}
               min={f.min}
               max={f.max}
               step={f.step}
-              value={val}
-              onChange={(e) =>
-                set({ [fieldKey]: Number(e.target.value) } as Partial<AppSettings>)
-              }
-              className="w-24 accent-accent cursor-pointer"
+              onChange={(v) => set({ [fieldKey]: v } as Partial<AppSettings>)}
             />
-            <span className="text-sm font-mono text-text-secondary w-10 text-right tabular-nums">
-              {val}
-              {f.unit ?? ''}
-            </span>
-          </div>
-        );
-      })()}
+          );
+        })()}
+
+      {field.type === 'range' &&
+        (() => {
+          const f = field as RangeDef;
+          const val = s[fieldKey] as number;
+          return (
+            <div className="flex items-center gap-2.5">
+              <input
+                type="range"
+                min={f.min}
+                max={f.max}
+                step={f.step}
+                value={val}
+                onChange={(e) =>
+                  set({ [fieldKey]: Number(e.target.value) } as Partial<AppSettings>)
+                }
+                className="w-24 accent-accent cursor-pointer"
+              />
+              <span className="text-sm font-mono text-text-secondary w-10 text-right tabular-nums">
+                {val}
+                {f.unit ?? ''}
+              </span>
+            </div>
+          );
+        })()}
     </Row>
   );
 }
diff --git a/src/renderer/components/settings/SettingsTab.tsx b/src/renderer/components/settings/SettingsTab.tsx
index 565382b..f5b4381 100644
--- a/src/renderer/components/settings/SettingsTab.tsx
+++ b/src/renderer/components/settings/SettingsTab.tsx
@@ -1,11 +1,10 @@
-import { SETTINGS_TOPICS } from '@shared/config/Settings.config';
-import { AppSettings } from '@shared/config/Settings.config';
+import { AppSettings, SETTINGS_TOPICS } from '@shared/config/Settings.config';
 import { useEffect, useMemo, useRef, useState } from 'react';
 import { useApp } from '../../AppProvider';
 import { useTranslation } from '../../i18n/I18nProvider';
 import type { TranslationKey } from '../../i18n/TranslationKeys';
 import { Button } from '../common/inputs';
-import { SidebarLayout } from '../layout/navigation';
+import { SidebarLayout } from '../common/layout/navigation';
 import { AdvancedSection } from './sections/AdvancedSection';
 import { AppearanceSection } from './sections/AppearanceSection';
 import { ConsoleSection } from './sections/ConsoleSection';
@@ -42,7 +41,7 @@ export function SettingsTab() {
   }, [state.settings]);
 
   useEffect(() => {
-    const unsub = window.env.onChange((env) => {
+    const unsub = jrc.env.onChange((env) => {
       setDraft((prev) => {
         if (!prev || prev.devModeEnabled === env.devMode) return prev;
         return { ...prev, devModeEnabled: env.devMode };
@@ -69,7 +68,7 @@ export function SettingsTab() {
 
   const handleSave = async () => {
     await saveSettings(draft);
-    window.env.reload();
+    jrc.env.reload();
     setSaved(true);
     setTimeout(() => setSaved(false), 2000);
   };
@@ -90,7 +89,7 @@ export function SettingsTab() {
       <SidebarLayout
         topics={translatedTopics}
         activeTopicId={activeTopic}
-        onTopicChange={setActiveTopic}
+        onTopicChange={(id) => setActiveTopic(id as typeof activeTopic)}
       >
         <div className="px-5 py-5 max-w-2xl space-y-6">
           {activeTopic === 'general' && <GeneralSection draft={draft} set={set} />}
diff --git a/src/renderer/components/settings/sections/AppearanceSection.tsx b/src/renderer/components/settings/sections/AppearanceSection.tsx
index a5d6523..a993173 100644
--- a/src/renderer/components/settings/sections/AppearanceSection.tsx
+++ b/src/renderer/components/settings/sections/AppearanceSection.tsx
@@ -5,6 +5,22 @@ import { useMemo, useState } from 'react';
 import { VscCheck, VscSearch } from 'react-icons/vsc';
 import { useTheme } from '../../../hooks/ThemeProvider';
 import { useTranslation } from '../../../i18n/I18nProvider';
+import { Section } from '../../common/layout/containers';
+
+function FlagIcon({ countryCode }: { countryCode?: string }) {
+  const [failed, setFailed] = useState(false);
+  if (!countryCode || failed) return null;
+  return (
+    <img
+      src={`https://flagcdn.com/w40/${countryCode.toLowerCase()}.png`}
+      alt=""
+      width={20}
+      height={15}
+      className="shrink-0 rounded-[2px] object-cover"
+      onError={() => setFailed(true)}
+    />
+  );
+}
 
 const PREVIEW_KEYS: (keyof ThemeColors)[] = [
   'accent',
@@ -40,81 +56,82 @@ export function AppearanceSection() {
     <div className="flex flex-col gap-5 h-full">
       {/* ── Themes panel ─────────────────────────────────────────────────── */}
       <div className="flex flex-col min-h-0 max-h-[50%]">
-        <h3 className="text-xs font-mono text-text-muted uppercase tracking-widest mb-3">
-          {t('settings.theme')}
-        </h3>
-        <SearchInput
-          value={themeSearch}
-          onChange={setThemeSearch}
-          placeholder={t('appearance.searchThemes')}
-        />
-        <div className="flex-1 min-h-0 overflow-y-auto mt-2 space-y-1 pr-1 scrollbar-thin">
-          {filteredThemes.length === 0 ? (
-            <p className="px-3 py-4 text-xs text-text-muted text-center">
-              {t('appearance.noThemesFound')}
-            </p>
-          ) : (
-            filteredThemes.map((item) => (
-              <button
-                key={item.id}
-                onClick={() => item.id !== theme.id && setTheme(item)}
-                className={[
-                  'w-full flex items-center gap-3 px-3 py-2.5 rounded-lg text-left transition-all duration-150',
-                  theme.id === item.id
-                    ? 'bg-surface-raised ring-1 ring-accent/20'
-                    : 'hover:bg-surface-raised/50 cursor-pointer',
-                ].join(' ')}
-              >
-                <div className="flex gap-1 shrink-0">
-                  {PREVIEW_KEYS.map((key) => (
-                    <span
-                      key={key}
-                      className="w-3.5 h-3.5 rounded-full ring-1 ring-surface-border/50"
-                      style={{ backgroundColor: item.colors[key] }}
-                    />
-                  ))}
-                </div>
-                <span className="text-xs text-text-primary flex-1 truncate">{item.name}</span>
-                {theme.id === item.id && <VscCheck size={12} className="text-accent shrink-0" />}
-              </button>
-            ))
-          )}
-        </div>
+        <Section title={t('settings.theme')} collapsible>
+          <SearchInput
+            value={themeSearch}
+            onChange={setThemeSearch}
+            placeholder={t('appearance.searchThemes')}
+          />
+          <div className="flex-1 min-h-0 overflow-y-auto mt-2 space-y-1 pr-1 scrollbar-thin">
+            {filteredThemes.length === 0 ? (
+              <p className="px-3 py-4 text-xs text-text-muted text-center">
+                {t('appearance.noThemesFound')}
+              </p>
+            ) : (
+              filteredThemes.map((item) => (
+                <button
+                  key={item.id}
+                  onClick={() => item.id !== theme.id && setTheme(item)}
+                  className={[
+                    'w-full flex items-center gap-3 px-3 py-2.5 rounded-lg text-left transition-all duration-150',
+                    theme.id === item.id
+                      ? 'bg-surface-raised ring-1 ring-accent/20'
+                      : 'hover:bg-surface-raised/50 cursor-pointer',
+                  ].join(' ')}
+                >
+                  <div className="flex gap-1 shrink-0">
+                    {PREVIEW_KEYS.map((key) => (
+                      <span
+                        key={key}
+                        className="w-3.5 h-3.5 rounded-full ring-1 ring-surface-border/50"
+                        style={{ backgroundColor: item.colors[key] }}
+                      />
+                    ))}
+                  </div>
+                  <span className="text-xs text-text-primary flex-1 truncate">{item.name}</span>
+                  {theme.id === item.id && <VscCheck size={12} className="text-accent shrink-0" />}
+                </button>
+              ))
+            )}
+          </div>
+        </Section>
       </div>
 
       {/* ── Languages panel ──────────────────────────────────────────────── */}
       <div className="flex flex-col min-h-0 max-h-[50%]">
-        <h3 className="text-xs font-mono text-text-muted uppercase tracking-widest mb-3">
-          {t('settings.language')}
-        </h3>
-        <SearchInput
-          value={langSearch}
-          onChange={setLangSearch}
-          placeholder={t('appearance.searchLanguages')}
-        />
-        <div className="flex-1 min-h-0 overflow-y-auto mt-2 space-y-1 pr-1 scrollbar-thin">
-          {filteredLangs.length === 0 ? (
-            <p className="px-3 py-4 text-xs text-text-muted text-center">
-              {t('appearance.noLanguagesFound')}
-            </p>
-          ) : (
-            filteredLangs.map((item) => (
-              <button
-                key={item.id}
-                onClick={() => item.id !== language.id && setLanguage(item)}
-                className={[
-                  'w-full flex items-center gap-3 px-3 py-2.5 rounded-lg text-left transition-all duration-150',
-                  language.id === item.id
-                    ? 'bg-surface-raised ring-1 ring-accent/20'
-                    : 'hover:bg-surface-raised/50 cursor-pointer',
-                ].join(' ')}
-              >
-                <span className="text-xs text-text-primary flex-1 truncate">{item.name}</span>
-                {language.id === item.id && <VscCheck size={12} className="text-accent shrink-0" />}
-              </button>
-            ))
-          )}
-        </div>
+        <Section title={t('settings.language')} collapsible>
+          <SearchInput
+            value={langSearch}
+            onChange={setLangSearch}
+            placeholder={t('appearance.searchLanguages')}
+          />
+          <div className="flex-1 min-h-0 overflow-y-auto mt-2 space-y-1 pr-1 scrollbar-thin">
+            {filteredLangs.length === 0 ? (
+              <p className="px-3 py-4 text-xs text-text-muted text-center">
+                {t('appearance.noLanguagesFound')}
+              </p>
+            ) : (
+              filteredLangs.map((item) => (
+                <button
+                  key={item.id}
+                  onClick={() => item.id !== language.id && setLanguage(item)}
+                  className={[
+                    'w-full flex items-center gap-3 px-3 py-2.5 rounded-lg text-left transition-all duration-150',
+                    language.id === item.id
+                      ? 'bg-surface-raised ring-1 ring-accent/20'
+                      : 'hover:bg-surface-raised/50 cursor-pointer',
+                  ].join(' ')}
+                >
+                  <FlagIcon countryCode={item.countryCode} />
+                  <span className="text-xs text-text-primary flex-1 truncate">{item.name}</span>
+                  {language.id === item.id && (
+                    <VscCheck size={12} className="text-accent shrink-0" />
+                  )}
+                </button>
+              ))
+            )}
+          </div>
+        </Section>
       </div>
     </div>
   );
diff --git a/src/renderer/components/settings/sections/about/AboutSection.tsx b/src/renderer/components/settings/sections/about/AboutSection.tsx
index 7942ff9..1344cea 100644
--- a/src/renderer/components/settings/sections/about/AboutSection.tsx
+++ b/src/renderer/components/settings/sections/about/AboutSection.tsx
@@ -18,7 +18,7 @@ export function AboutSection() {
           <span className="font-mono text-xs text-text-muted">%APPDATA%\java-runner-client</span>
           <Tooltip content={t('settings.openConfigFolder')} side="left" delay={300}>
             <button
-              onClick={() => window.api.openConfigFolder()}
+              onClick={() => jrc.api.openConfigFolder()}
               className="p-1 rounded text-text-muted hover:text-text-primary hover:bg-surface-raised transition-colors"
             >
               <VscFolderOpened size={14} />
diff --git a/src/renderer/components/settings/sections/about/ReleaseModal.tsx b/src/renderer/components/settings/sections/about/ReleaseModal.tsx
index 4a9a53a..83644a8 100644
--- a/src/renderer/components/settings/sections/about/ReleaseModal.tsx
+++ b/src/renderer/components/settings/sections/about/ReleaseModal.tsx
@@ -120,7 +120,7 @@ export function ReleaseModal({ release, open, onClose }: Props) {
   }, []);
 
   useEffect(() => {
-    const unsub = window.api.onDownloadProgress((progress: DownloadProgress) =>
+    const unsub = jrc.api.onDownloadProgress((progress: DownloadProgress) =>
       updateDownload(progress)
     );
     return () => unsub();
@@ -134,18 +134,18 @@ export function ReleaseModal({ release, open, onClose }: Props) {
   };
 
   const handleDownload = async (asset: GitHubAsset) => {
-    await window.api.downloadAsset(asset.browser_download_url, asset.name);
+    await jrc.api.downloadAsset(asset.browser_download_url, asset.name);
   };
 
   const handlePause = async (filename: string) => {
     const dl = downloads.get(filename);
     if (!dl) return;
-    if (dl.status === 'paused') await window.api.resumeDownload(filename);
-    else await window.api.pauseDownload(filename);
+    if (dl.status === 'paused') await jrc.api.resumeDownload(filename);
+    else await jrc.api.pauseDownload(filename);
   };
 
   const handleCancel = async (filename: string) => {
-    await window.api.cancelDownload(filename);
+    await jrc.api.cancelDownload(filename);
   };
 
   const renderControls = (asset: GitHubAsset, variant: 'primary' | 'ghost') => {
@@ -357,7 +357,7 @@ export function ReleaseModal({ release, open, onClose }: Props) {
         <div className="flex items-center justify-between pt-1 border-t border-surface-border">
           {release.html_url ? (
             <button
-              onClick={() => window.api.openExternal(release.html_url)}
+              onClick={() => jrc.api.openExternal(release.html_url)}
               className="flex items-center gap-1.5 text-xs text-text-muted hover:text-accent transition-colors font-mono"
             >
               <LuExternalLink size={11} />
diff --git a/src/renderer/components/settings/sections/about/VersionChecker.tsx b/src/renderer/components/settings/sections/about/VersionChecker.tsx
index 391e971..faa3b89 100644
--- a/src/renderer/components/settings/sections/about/VersionChecker.tsx
+++ b/src/renderer/components/settings/sections/about/VersionChecker.tsx
@@ -30,7 +30,7 @@ export function VersionChecker({ currentVersion }: Props) {
   const check = useCallback(async () => {
     setCheckState('checking');
     setErrorMsg(null);
-    const res = await window.api.fetchLatestRelease();
+    const res = await jrc.api.fetchLatestRelease();
     if (!res.ok || !res.data) {
       setCheckState('error');
       setErrorMsg(res.error ?? 'Could not reach GitHub');
diff --git a/src/renderer/components/utils/ActivityLogPanel.tsx b/src/renderer/components/utils/ActivityLogPanel.tsx
index 0b0bf15..f017eb5 100644
--- a/src/renderer/components/utils/ActivityLogPanel.tsx
+++ b/src/renderer/components/utils/ActivityLogPanel.tsx
@@ -4,9 +4,9 @@ import { VscListUnordered } from 'react-icons/vsc';
 import { useTranslation } from '../../i18n/I18nProvider';
 import { EmptyState, StatusDot } from '../common/display';
 import { Button } from '../common/inputs';
+import { Card } from '../common/layout/containers';
+import { Toolbar } from '../common/layout/shell';
 import { Dialog } from '../common/overlays';
-import { Card } from '../layout/containers';
-import { Toolbar } from '../layout/shell';
 
 export function ActivityLogPanel() {
   const { t } = useTranslation();
@@ -16,7 +16,7 @@ export function ActivityLogPanel() {
 
   const load = useCallback(async () => {
     setLoading(true);
-    setEntries(await window.api.getProcessLog());
+    setEntries(await jrc.api.getProcessLog());
     setLoading(false);
   }, []);
 
@@ -68,7 +68,7 @@ export function ActivityLogPanel() {
         confirmLabel={t('general.clear')}
         danger
         onConfirm={async () => {
-          await window.api.clearProcessLog();
+          await jrc.api.clearProcessLog();
           setEntries([]);
           setConfirmClear(false);
         }}
diff --git a/src/renderer/components/utils/ScannerPanel.tsx b/src/renderer/components/utils/ScannerPanel.tsx
index 7964d15..17e5624 100644
--- a/src/renderer/components/utils/ScannerPanel.tsx
+++ b/src/renderer/components/utils/ScannerPanel.tsx
@@ -5,9 +5,9 @@ import { VscCheck } from 'react-icons/vsc';
 import { useTranslation } from '../../i18n/I18nProvider';
 import { Badge, EmptyState } from '../common/display';
 import { Button } from '../common/inputs';
+import { DataRow } from '../common/layout/containers';
+import { Toolbar } from '../common/layout/shell';
 import { Dialog } from '../common/overlays';
-import { DataRow } from '../layout/containers';
-import { Toolbar } from '../layout/shell';
 
 type Filter = 'java' | 'all';
 interface KillIntent {
@@ -33,7 +33,7 @@ export function ScannerPanel() {
     setKilledPids(new Set());
     setSearch('');
     setExpandedPid(null);
-    const found = await window.api.scanAllProcesses();
+    const found = await jrc.api.scanAllProcesses();
     setResults(found);
     setScanning(false);
     const javaCount = found.filter((p) => p.isJava).length;
@@ -48,7 +48,7 @@ export function ScannerPanel() {
 
   const handleKill = async () => {
     if (!killIntent) return;
-    const res = await window.api.killPid(killIntent.proc.pid);
+    const res = await jrc.api.killPid(killIntent.proc.pid);
     if (res.ok) {
       setKilledPids((prev) => new Set([...prev, killIntent.proc.pid]));
       setStatusMsg({
@@ -65,7 +65,7 @@ export function ScannerPanel() {
   };
 
   const handleKillAll = async () => {
-    const res = await window.api.killAllJava();
+    const res = await jrc.api.killAllJava();
     setStatusMsg({
       text:
         res.killed === 1
diff --git a/src/renderer/components/utils/UtilitiesTab.tsx b/src/renderer/components/utils/UtilitiesTab.tsx
index ec616e1..f618eb1 100644
--- a/src/renderer/components/utils/UtilitiesTab.tsx
+++ b/src/renderer/components/utils/UtilitiesTab.tsx
@@ -2,7 +2,7 @@ import { useState } from 'react';
 import { LuScanLine } from 'react-icons/lu';
 import { VscListUnordered } from 'react-icons/vsc';
 import { useTranslation } from '../../i18n/I18nProvider';
-import { TabBar } from '../layout/navigation';
+import { TabBar } from '../common/layout/navigation';
 import { ActivityLogPanel } from './ActivityLogPanel';
 import { ScannerPanel } from './ScannerPanel';
 
diff --git a/src/renderer/global.d.ts b/src/renderer/global.d.ts
index 3d6f874..a4b5eb4 100644
--- a/src/renderer/global.d.ts
+++ b/src/renderer/global.d.ts
@@ -3,7 +3,8 @@ import type { API, Environment } from '../main/ipc/_index';
 
 declare global {
   interface Window {
-    api: API;
-    env: Environment;
+    jrc: { api: API; env: Environment };
   }
+
+  const jrc: { api: API; env: Environment };
 }
diff --git a/src/renderer/hooks/ThemeProvider.tsx b/src/renderer/hooks/ThemeProvider.tsx
index 41e99ed..23268c3 100644
--- a/src/renderer/hooks/ThemeProvider.tsx
+++ b/src/renderer/hooks/ThemeProvider.tsx
@@ -114,8 +114,8 @@ export function ThemeProvider({ children }: { children: React.ReactNode }) {
   const [theme, setThemeState] = useState<ThemeDefinition>(BUILTIN_THEME);
 
   useEffect(() => {
-    if (!window.api) return;
-    window.api.getSettings().then((s) => {
+    if (!jrc.api) return;
+    jrc.api.getSettings().then((s) => {
       const t = resolveTheme(s.themeId);
       setThemeState(t);
       applyThemeToDOM(t);
@@ -123,11 +123,11 @@ export function ThemeProvider({ children }: { children: React.ReactNode }) {
   }, []);
 
   const setTheme = useCallback((theme: ThemeDefinition) => {
-    if (!window.api) return;
+    if (!jrc.api) return;
     setThemeState(theme);
     applyThemeToDOM(theme);
-    window.api.getSettings().then((s) => {
-      window.api.saveSettings({ ...s, themeId: theme.id });
+    jrc.api.getSettings().then((s) => {
+      jrc.api.saveSettings({ ...s, themeId: theme.id });
     });
   }, []);
 
diff --git a/src/renderer/hooks/useDevMode.ts b/src/renderer/hooks/useDevMode.ts
index 120e32a..d69c700 100644
--- a/src/renderer/hooks/useDevMode.ts
+++ b/src/renderer/hooks/useDevMode.ts
@@ -7,14 +7,14 @@ export function useDevMode(): boolean {
   useEffect(() => {
     let mounted = true;
 
-    window.env.get().then((value) => {
+    jrc.env.get().then((value) => {
       if (mounted) setEnabled(value.devMode);
     });
 
     const handler = (value: JRCEnvironment) => {
       if (mounted) setEnabled(value.devMode);
     };
-    window.env.onChange(handler);
+    jrc.env.onChange(handler);
 
     return () => {
       mounted = false;
diff --git a/src/renderer/hooks/useJarResolutionPreview.ts b/src/renderer/hooks/useJarResolutionPreview.ts
index 776981e..724ea28 100644
--- a/src/renderer/hooks/useJarResolutionPreview.ts
+++ b/src/renderer/hooks/useJarResolutionPreview.ts
@@ -1,4 +1,4 @@
-import type { JarResolutionConfig, JarResolutionResult } from '@shared/types/JarResolution.types';
+import type { JarResolutionConfig, JarResolutionResult } from '@shared/types/Profile.types';
 import { useCallback, useEffect, useState } from 'react';
 
 export function useJarResolutionPreview(config: JarResolutionConfig, enabled: boolean) {
@@ -11,7 +11,7 @@ export function useJarResolutionPreview(config: JarResolutionConfig, enabled: bo
       return;
     }
     setLoading(true);
-    const res = await window.api.previewCandidates(config);
+    const res = await jrc.api.previewCandidates(config);
     setResult(res);
     setLoading(false);
   }, [config, enabled]);
diff --git a/src/renderer/i18n/I18nProvider.tsx b/src/renderer/i18n/I18nProvider.tsx
index f5146de..a86b573 100644
--- a/src/renderer/i18n/I18nProvider.tsx
+++ b/src/renderer/i18n/I18nProvider.tsx
@@ -24,8 +24,8 @@ export function I18nProvider({ children }: { children: React.ReactNode }) {
   }, [language]);
 
   useEffect(() => {
-    if (!window.api) return;
-    window.api.getSettings().then((s) => {
+    if (!jrc.api) return;
+    jrc.api.getSettings().then((s) => {
       const l = resolveLanguage(s.languageId);
       setLang(l);
       langRef.current = l;
@@ -47,11 +47,11 @@ export function I18nProvider({ children }: { children: React.ReactNode }) {
   );
 
   const setLanguage = useCallback((lang: LanguageDefinition) => {
-    if (!window.api) return;
+    if (!jrc.api) return;
     langRef.current = lang;
     setLang(lang);
-    window.api.getSettings().then((s) => {
-      window.api.saveSettings({ ...s, languageId: lang.id });
+    jrc.api.getSettings().then((s) => {
+      jrc.api.saveSettings({ ...s, languageId: lang.id });
     });
   }, []);
 
diff --git a/src/renderer/index.html b/src/renderer/index.html
index c6ded00..349cf40 100644
--- a/src/renderer/index.html
+++ b/src/renderer/index.html
@@ -3,17 +3,7 @@
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width,initial-scale=1.0" />
-    <meta
-      http-equiv="Content-Security-Policy"
-      content="
-    default-src 'self';
-    script-src 'self';
-    style-src 'self' 'unsafe-inline';
-    img-src 'self' data: https://avatars.githubusercontent.com;
-    font-src 'self';
-    connect-src 'self' http://127.0.0.1:* http://localhost:*;
-  "
-    />
+    <!--CSP-->
     <title>Java Runner Client</title>
   </head>
 
diff --git a/src/renderer/styles/globals.css b/src/renderer/styles/globals.css
index fcb303d..927c0ff 100644
--- a/src/renderer/styles/globals.css
+++ b/src/renderer/styles/globals.css
@@ -1,3 +1,5 @@
+@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600&family=JetBrains+Mono:wght@400;500&display=swap');
+
 @tailwind base;
 @tailwind components;
 @tailwind utilities;
@@ -9,11 +11,7 @@
 }
 
 body {
-  font-family:
-    'Inter',
-    system-ui,
-    -apple-system,
-    sans-serif;
+  font-family: 'JetBrains Mono', 'Fira Code', monospace;
   background: #08090d;
   color: #e8eaf2;
   overflow: hidden;
@@ -39,6 +37,15 @@ body {
   user-select: text;
 }
 
+.scrollbar-none::-webkit-scrollbar {
+  display: none;
+}
+
+.scrollbar-thin::-webkit-scrollbar {
+  width: 4px;
+  height: 4px;
+}
+
 @keyframes fade-in {
   from {
     opacity: 0;
diff --git a/tailwind.config.js b/tailwind.config.js
index 3fc6138..f75c8b5 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -3,6 +3,10 @@ module.exports = {
   content: ['./src/renderer/**/*.{ts,tsx,html}', './src/main/shared/**/*.ts'],
   theme: {
     extend: {
+      fontFamily: {
+        mono: ['"JetBrains Mono"', '"Fira Code"', 'monospace'],
+        sans: ['"DM Sans"', 'system-ui', 'sans-serif'],
+      },
       colors: {
         accent: '#4ade80',
         'base-950': '#08090d',
diff --git a/tsconfig.json b/tsconfig.json
index d2b5132..4c66cd7 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -14,10 +14,9 @@
     "strict": true,
     "noUnusedLocals": false,
     "noUnusedParameters": false,
-    "baseUrl": ".",
     "paths": {
-      "@/*": ["src/renderer/*"],
-      "@shared/*": ["src/main/shared/*"]
+      "@/*": ["./src/renderer/*"],
+      "@shared/*": ["./src/main/shared/*"]
     }
   },
   "include": ["src/renderer", "src/main/shared"]
diff --git a/vite.config.ts b/vite.config.ts
index e86777e..88406b6 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -1,10 +1,25 @@
 import react from '@vitejs/plugin-react';
 import { readFileSync } from 'fs';
 import path from 'path';
-import { defineConfig } from 'vite';
+import { defineConfig, Plugin } from 'vite';
+import { buildCSP } from './src/main/shared/config/App.config';
+
 const { version } = JSON.parse(readFileSync(path.resolve(__dirname, 'package.json'), 'utf-8'));
+
+function cspPlugin(): Plugin {
+  return {
+    name: 'inject-csp',
+    transformIndexHtml(html) {
+      return html.replace(
+        '<!--CSP-->',
+        `<meta http-equiv="Content-Security-Policy" content="${buildCSP()}" />`
+      );
+    },
+  };
+}
+
 export default defineConfig({
-  plugins: [react()],
+  plugins: [react(), cspPlugin()],
   base: './',
   root: 'src/renderer',
   define: { __APP_VERSION__: JSON.stringify(version) },