diff --git a/.prettierrc.json b/.prettierrc.json
index 583ce10..3cbe1bf 100644
--- a/.prettierrc.json
+++ b/.prettierrc.json
@@ -1,8 +1,10 @@
 {
-  "semi": false,
+  "semi": true,
   "singleQuote": true,
   "trailingComma": "es5",
   "printWidth": 100,
   "tabWidth": 2,
-  "endOfLine": "lf"
+  "endOfLine": "lf",
+  "objectWrap": "preserve",
+  "bracketSameLine": false
 }
diff --git a/package-lock.json b/package-lock.json
index e89fe35..d62714c 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "java-runner-client",
-  "version": "2.1.2",
+  "version": "2.1.4",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "java-runner-client",
-      "version": "2.1.2",
+      "version": "2.1.4",
       "dependencies": {
         "electron-store": "^8.1.0",
         "framer-motion": "^12.38.0",
diff --git a/postcss.config.js b/postcss.config.js
index 2959567..cce4985 100644
--- a/postcss.config.js
+++ b/postcss.config.js
@@ -1 +1 @@
-module.exports = { plugins: { tailwindcss: {}, autoprefixer: {} } }
+module.exports = { plugins: { tailwindcss: {}, autoprefixer: {} } };
diff --git a/src/main/shared/IPCController.ts b/src/main/IPCController.ts
similarity index 83%
rename from src/main/shared/IPCController.ts
rename to src/main/IPCController.ts
index 2f5dfba..cc4f542 100644
--- a/src/main/shared/IPCController.ts
+++ b/src/main/IPCController.ts
@@ -13,35 +13,35 @@
  *             main pushes via webContents.send(channel, ...args)
  */
 
-import { ipcMain, ipcRenderer, IpcMainInvokeEvent, IpcMainEvent, IpcRendererEvent } from 'electron'
+import { ipcMain, ipcRenderer, IpcMainInvokeEvent, IpcMainEvent, IpcRendererEvent } from 'electron';
 
 // ─── Route descriptors ────────────────────────────────────────────────────────
 
 type InvokeRoute = {
-  type: 'invoke'
-  channel: string
-  handler: (event: IpcMainInvokeEvent, ...args: any[]) => any
-}
+  type: 'invoke';
+  channel: string;
+  handler: (event: IpcMainInvokeEvent, ...args: any[]) => any;
+};
 
 type SendRoute = {
-  type: 'send'
-  channel: string
-  handler: (event: IpcMainEvent, ...args: any[]) => void
-}
+  type: 'send';
+  channel: string;
+  handler: (event: IpcMainEvent, ...args: any[]) => void;
+};
 
 /** No handler — main pushes via webContents.send(channel, ...) */
 type OnRoute = {
-  type: 'on'
-  channel: string
+  type: 'on';
+  channel: string;
   /** Cast a function signature here to type the callback args on window.api.onFoo.
    *  e.g. `args: {} as (profileId: string, line: ConsoleLine) => void`
    *  Never called at runtime — purely a compile-time phantom. */
-  args?: (...args: any[]) => void
-}
+  args?: (...args: any[]) => void;
+};
 
-type Route = InvokeRoute | SendRoute | OnRoute
+type Route = InvokeRoute | SendRoute | OnRoute;
 
-export type RouteMap = Record<string, Route>
+export type RouteMap = Record<string, Route>;
 
 // ─── Type inference: RouteMap → window.api shape ──────────────────────────────
 
@@ -50,15 +50,15 @@ type InvokeAPI<R extends InvokeRoute> = R['handler'] extends (
   ...args: infer A
 ) => infer Ret
   ? (...args: A) => Promise<Awaited<Ret>>
-  : never
+  : never;
 
 type SendAPI<R extends SendRoute> = R['handler'] extends (_e: any, ...args: infer A) => any
   ? (...args: A) => void
-  : never
+  : never;
 
 type OnAPI<K extends string, R extends OnRoute> = R extends { args: (...args: infer A) => void }
   ? { [key in `on${Capitalize<K>}`]: (cb: (...args: A) => void) => () => void }
-  : { [key in `on${Capitalize<K>}`]: (cb: (...args: any[]) => void) => () => void }
+  : { [key in `on${Capitalize<K>}`]: (cb: (...args: any[]) => void) => () => void };
 
 /** Derives the full window.api type from a RouteMap. */
 export type InferAPI<M extends RouteMap> = {
@@ -66,7 +66,7 @@ export type InferAPI<M extends RouteMap> = {
     ? InvokeAPI<M[K]>
     : M[K] extends SendRoute
       ? SendAPI<M[K]>
-      : never
+      : never;
 } & {
   [K in keyof M as M[K]['type'] extends 'on'
     ? `on${Capitalize<string & K>}`
@@ -74,16 +74,16 @@ export type InferAPI<M extends RouteMap> = {
     ? M[K] extends { args: (...args: infer A) => void }
       ? (cb: (...args: A) => void) => () => void
       : (cb: (...args: any[]) => void) => () => void
-    : never
-}
+    : never;
+};
 
 // ─── Main-process: register all routes onto ipcMain ──────────────────────────
 
 export function registerIPC(routes: RouteMap[]): void {
   for (const map of routes) {
     for (const route of Object.values(map)) {
-      if (route.type === 'invoke') ipcMain.handle(route.channel, route.handler)
-      if (route.type === 'send') ipcMain.on(route.channel, route.handler)
+      if (route.type === 'invoke') ipcMain.handle(route.channel, route.handler);
+      if (route.type === 'send') ipcMain.on(route.channel, route.handler);
       // 'on' routes are push-only from main — no listener to register
     }
   }
@@ -92,26 +92,26 @@ export function registerIPC(routes: RouteMap[]): void {
 // ─── Preload: build the window.api object ────────────────────────────────────
 
 export function buildPreloadAPI(routes: RouteMap[]): Record<string, unknown> {
-  const api: Record<string, unknown> = {}
+  const api: Record<string, unknown> = {};
 
   for (const map of routes) {
     for (const [key, route] of Object.entries(map)) {
       if (route.type === 'invoke') {
-        api[key] = (...args: unknown[]) => ipcRenderer.invoke(route.channel, ...args)
+        api[key] = (...args: unknown[]) => ipcRenderer.invoke(route.channel, ...args);
       }
       if (route.type === 'send') {
-        api[key] = (...args: unknown[]) => ipcRenderer.send(route.channel, ...args)
+        api[key] = (...args: unknown[]) => ipcRenderer.send(route.channel, ...args);
       }
       if (route.type === 'on') {
-        const cbKey = `on${key[0].toUpperCase()}${key.slice(1)}`
+        const cbKey = `on${key[0].toUpperCase()}${key.slice(1)}`;
         api[cbKey] = (cb: (...args: unknown[]) => void) => {
-          const handler = (_e: IpcRendererEvent, ...args: unknown[]) => cb(...args)
-          ipcRenderer.on(route.channel, handler)
-          return () => ipcRenderer.off(route.channel, handler)
-        }
+          const handler = (_e: IpcRendererEvent, ...args: unknown[]) => cb(...args);
+          ipcRenderer.on(route.channel, handler);
+          return () => ipcRenderer.off(route.channel, handler);
+        };
       }
     }
   }
 
-  return api
+  return api;
 }
diff --git a/src/main/JRCEnvironment.ts b/src/main/JRCEnvironment.ts
new file mode 100644
index 0000000..b544fcc
--- /dev/null
+++ b/src/main/JRCEnvironment.ts
@@ -0,0 +1,44 @@
+import { app, BrowserWindow } from 'electron';
+import { EnvironmentIPC } from './ipc/Environment.ipc';
+import { JRCEnvironment } from './shared/types/App.types';
+import { getSettings } from './Store';
+
+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'],
+};
+
+export function loadEnvironment() {
+  env = {
+    isReady: true,
+    devMode: getSettings().devModeEnabled,
+    type: app.isPackaged ? 'prod' : 'dev',
+    startUpSource: detectStartupSource(),
+  };
+
+  broadcast();
+}
+
+export function getEnvironment() {
+  return env;
+}
+
+export function shouldStartMinimized(): boolean {
+  return process.argv.includes('--minimized');
+}
+
+function broadcast(channel: string = EnvironmentIPC.change.channel) {
+  BrowserWindow.getAllWindows().forEach((w) => w.webContents.send(channel, env));
+}
+
+function detectStartupSource(): JRCEnvironment['startUpSource'] {
+  if (!app.isPackaged) return 'development';
+
+  const login = app.getLoginItemSettings();
+
+  if (login.wasOpenedAtLogin || process.argv.includes('--autostart')) return 'withSystem';
+
+  return 'userRequest';
+}
diff --git a/src/main/ProcessManager.ts b/src/main/ProcessManager.ts
index 14b7180..92386f6 100644
--- a/src/main/ProcessManager.ts
+++ b/src/main/ProcessManager.ts
@@ -1,18 +1,18 @@
-import { spawn, execSync, ChildProcess } from 'child_process'
-import { BrowserWindow } from 'electron'
-import path from 'path'
-import { v4 as uuidv4 } from 'uuid'
-import type {
-  Profile,
-  ProcessState,
+import { spawn, execSync, ChildProcess } from 'child_process';
+import { BrowserWindow } from 'electron';
+import path from 'path';
+import { v4 as uuidv4 } from 'uuid';
+import { PROTECTED_PROCESS_NAMES } from './shared/config/Scanner.config';
+import {
   ConsoleLine,
-  ProcessLogEntry,
   JavaProcessInfo,
-} from './shared/types'
-import { IPC } from './shared/types'
-import { PROTECTED_PROCESS_NAMES } from './shared/config/Scanner.config'
+  ProcessLogEntry,
+  ProcessState,
+} from './shared/types/Process.types';
+import { Profile } from './shared/types/Profile.types';
+import { ProcessIPC } from './ipc/Process.ipc';
 
-const SELF_PROCESS_NAME = 'Java Client Runner'
+const SELF_PROCESS_NAME = 'Java Client Runner';
 
 type SystemMessageType =
   | 'start'
@@ -23,57 +23,57 @@ type SystemMessageType =
   | 'error-runtime'
   | 'info-pid'
   | 'info-workdir'
-  | 'info-restart'
+  | 'info-restart';
 
 interface ManagedProcess {
-  process: ChildProcess
-  profileId: string
-  profileName: string
-  jarPath: string
-  startedAt: number
-  intentionallyStopped: boolean
+  process: ChildProcess;
+  profileId: string;
+  profileName: string;
+  jarPath: string;
+  startedAt: number;
+  intentionallyStopped: boolean;
 }
 
 class ProcessManager {
-  private processes = new Map<string, ManagedProcess>()
-  private activityLog: ProcessLogEntry[] = []
-  private window: BrowserWindow | null = null
-  private restartTimers = new Map<string, ReturnType<typeof setTimeout>>()
-  private profileSnapshots = new Map<string, Profile>()
-  private lineCounters = new Map<string, number>()
-  private seenLineIds = new Map<string, Set<string | number>>()
-  private onTrayUpdate?: () => void
+  private processes = new Map<string, ManagedProcess>();
+  private activityLog: ProcessLogEntry[] = [];
+  private window: BrowserWindow | null = null;
+  private restartTimers = new Map<string, ReturnType<typeof setTimeout>>();
+  private profileSnapshots = new Map<string, Profile>();
+  private lineCounters = new Map<string, number>();
+  private seenLineIds = new Map<string, Set<string | number>>();
+  private onTrayUpdate?: () => void;
 
   setWindow(win: BrowserWindow): void {
-    this.window = win
+    this.window = win;
   }
 
   private buildArgs(profile: Profile): { cmd: string; args: string[] } {
-    const cmd = profile.javaPath || 'java'
-    const args: string[] = []
-    for (const a of profile.jvmArgs) if (a.enabled && a.value.trim()) args.push(a.value.trim())
+    const cmd = profile.javaPath || 'java';
+    const args: string[] = [];
+    for (const a of profile.jvmArgs) if (a.enabled && a.value.trim()) args.push(a.value.trim());
     for (const p of profile.systemProperties)
       if (p.enabled && p.key.trim())
-        args.push(p.value.trim() ? `-D${p.key.trim()}=${p.value.trim()}` : `-D${p.key.trim()}`)
-    args.push('-jar', profile.jarPath)
-    for (const a of profile.programArgs) if (a.enabled && a.value.trim()) args.push(a.value.trim())
-    return { cmd, args }
+        args.push(p.value.trim() ? `-D${p.key.trim()}=${p.value.trim()}` : `-D${p.key.trim()}`);
+    args.push('-jar', profile.jarPath);
+    for (const a of profile.programArgs) if (a.enabled && a.value.trim()) args.push(a.value.trim());
+    return { cmd, args };
   }
 
   start(profile: Profile): { ok: boolean; error?: string } {
-    if (this.processes.has(profile.id)) return { ok: false, error: 'Process already running' }
-    if (!profile.jarPath) return { ok: false, error: 'No JAR file specified' }
+    if (this.processes.has(profile.id)) return { ok: false, error: 'Process already running' };
+    if (!profile.jarPath) return { ok: false, error: 'No JAR file specified' };
 
-    this.cancelRestartTimer(profile.id)
-    this.profileSnapshots.set(profile.id, profile)
+    this.cancelRestartTimer(profile.id);
+    this.profileSnapshots.set(profile.id, profile);
 
-    const { cmd, args } = this.buildArgs(profile)
-    const cwd = profile.workingDir || path.dirname(profile.jarPath)
+    const { cmd, args } = this.buildArgs(profile);
+    const cwd = profile.workingDir || path.dirname(profile.jarPath);
 
-    this.pushSystem('start', profile.id, 'pending', `Starting: ${cmd} ${args.join(' ')}`)
-    this.pushSystem('info-workdir', profile.id, 'pending', `Working dir: ${cwd}`)
+    this.pushSystem('start', profile.id, 'pending', `Starting: ${cmd} ${args.join(' ')}`);
+    this.pushSystem('info-workdir', profile.id, 'pending', `Working dir: ${cwd}`);
 
-    let proc: ChildProcess
+    let proc: ChildProcess;
     try {
       proc = spawn(cmd, args, {
         cwd,
@@ -81,11 +81,11 @@ class ProcessManager {
         shell: false,
         detached: false,
         stdio: ['pipe', 'pipe', 'pipe'],
-      })
+      });
     } catch (err: unknown) {
-      const msg = err instanceof Error ? err.message : String(err)
-      this.pushSystem('error-starting', profile.id, 'pending', `Failed to start: ${msg}`)
-      return { ok: false, error: msg }
+      const msg = err instanceof Error ? err.message : String(err);
+      this.pushSystem('error-starting', profile.id, 'pending', `Failed to start: ${msg}`);
+      return { ok: false, error: msg };
     }
 
     const managed: ManagedProcess = {
@@ -95,16 +95,16 @@ class ProcessManager {
       jarPath: profile.jarPath,
       startedAt: Date.now(),
       intentionallyStopped: false,
-    }
-    this.processes.set(profile.id, managed)
+    };
+    this.processes.set(profile.id, managed);
 
     if (!this.lineCounters.has(profile.id)) {
-      this.lineCounters.set(profile.id, 0)
-      this.seenLineIds.set(profile.id, new Set())
+      this.lineCounters.set(profile.id, 0);
+      this.seenLineIds.set(profile.id, new Set());
     }
 
-    const pid = proc.pid ?? 0
-    this.pushSystem('info-pid', profile.id, String(pid), `PID: ${pid}`)
+    const pid = proc.pid ?? 0;
+    this.pushSystem('info-pid', profile.id, String(pid), `PID: ${pid}`);
 
     const logEntry: ProcessLogEntry = {
       id: uuidv4(),
@@ -113,128 +113,128 @@ class ProcessManager {
       jarPath: profile.jarPath,
       pid,
       startedAt: managed.startedAt,
-    }
-    this.activityLog.unshift(logEntry)
-    if (this.activityLog.length > 500) this.activityLog.pop()
+    };
+    this.activityLog.unshift(logEntry);
+    if (this.activityLog.length > 500) this.activityLog.pop();
 
-    proc.stdout?.setEncoding('utf8')
+    proc.stdout?.setEncoding('utf8');
     proc.stdout?.on('data', (chunk: string) =>
       this.pushOutput(profile.id, chunk, 'stdout', managed)
-    )
-    proc.stderr?.setEncoding('utf8')
+    );
+    proc.stderr?.setEncoding('utf8');
     proc.stderr?.on('data', (chunk: string) =>
       this.pushOutput(profile.id, chunk, 'stderr', managed)
-    )
+    );
     proc.on('error', (err) =>
       this.pushSystem('error-runtime', profile.id, String(pid), `Error: ${err.message}`)
-    )
+    );
     proc.on('exit', (code, signal) => {
-      this.processes.delete(profile.id)
+      this.processes.delete(profile.id);
       this.pushSystem(
         'stopped',
         profile.id,
         String(pid),
         `Process stopped (${signal ? `signal ${signal}` : `exit code ${code ?? '?'}`})`
-      )
-      const entry = this.activityLog.find((e) => e.profileId === profile.id && !e.stoppedAt)
+      );
+      const entry = this.activityLog.find((e) => e.profileId === profile.id && !e.stoppedAt);
       if (entry) {
-        entry.stoppedAt = Date.now()
-        entry.exitCode = code ?? undefined
-        entry.signal = signal ?? undefined
+        entry.stoppedAt = Date.now();
+        entry.exitCode = code ?? undefined;
+        entry.signal = signal ?? undefined;
       }
-      this.broadcastStates()
-      this.updateTray()
+      this.broadcastStates();
+      this.updateTray();
 
       if (!managed.intentionallyStopped && code !== 0) {
-        const snapshot = this.profileSnapshots.get(profile.id)
+        const snapshot = this.profileSnapshots.get(profile.id);
         if (snapshot?.autoRestart) {
-          const delaySec = Math.max(1, snapshot.autoRestartInterval ?? 10)
+          const delaySec = Math.max(1, snapshot.autoRestartInterval ?? 10);
           this.pushSystem(
             'info-restart',
             profile.id,
             String(pid),
             `Auto-restart in ${delaySec}s...`
-          )
+          );
           const timer = setTimeout(() => {
-            this.restartTimers.delete(profile.id)
-            const latest = this.profileSnapshots.get(profile.id) ?? snapshot
-            this.start(latest)
-          }, delaySec * 1000)
-          this.restartTimers.set(profile.id, timer)
+            this.restartTimers.delete(profile.id);
+            const latest = this.profileSnapshots.get(profile.id) ?? snapshot;
+            this.start(latest);
+          }, delaySec * 1000);
+          this.restartTimers.set(profile.id, timer);
         }
       }
-    })
+    });
 
-    this.broadcastStates()
-    this.updateTray()
-    return { ok: true }
+    this.broadcastStates();
+    this.updateTray();
+    return { ok: true };
   }
 
   stop(profileId: string): { ok: boolean; error?: string } {
-    const m = this.processes.get(profileId)
-    if (!m) return { ok: false, error: 'Not running' }
+    const m = this.processes.get(profileId);
+    if (!m) return { ok: false, error: 'Not running' };
 
-    m.intentionallyStopped = true
-    this.cancelRestartTimer(profileId)
+    m.intentionallyStopped = true;
+    this.cancelRestartTimer(profileId);
 
-    this.pushSystem('stopping', profileId, String(m.process.pid ?? 0), 'Stopping process...')
-    const pid = m.process.pid
+    this.pushSystem('stopping', profileId, String(m.process.pid ?? 0), 'Stopping process...');
+    const pid = m.process.pid;
     if (process.platform === 'win32' && pid) {
       try {
-        execSync(`taskkill /PID ${pid} /T /F`, { timeout: 5000 })
+        execSync(`taskkill /PID ${pid} /T /F`, { timeout: 5000 });
       } catch {
         try {
-          m.process.kill('SIGTERM')
+          m.process.kill('SIGTERM');
         } catch {
           /* ignore */
         }
       }
     } else {
       try {
-        m.process.kill('SIGTERM')
+        m.process.kill('SIGTERM');
       } catch {
         /* ignore */
       }
       setTimeout(() => {
         if (this.processes.has(profileId))
           try {
-            m.process.kill('SIGKILL')
+            m.process.kill('SIGKILL');
           } catch {
             /* ignore */
           }
-      }, 5000)
+      }, 5000);
     }
 
-    this.updateTray()
-    return { ok: true }
+    this.updateTray();
+    return { ok: true };
   }
 
   updateProfileSnapshot(profile: Profile): void {
     if (this.profileSnapshots.has(profile.id)) {
-      this.profileSnapshots.set(profile.id, profile)
+      this.profileSnapshots.set(profile.id, profile);
     }
   }
 
   clearConsoleForProfile(profileId: string): void {
-    this.window?.webContents.send(IPC.CONSOLE_CLEAR, profileId)
+    this.window?.webContents.send(ProcessIPC.consoleClear.channel, profileId);
   }
 
   private cancelRestartTimer(profileId: string): void {
-    const t = this.restartTimers.get(profileId)
+    const t = this.restartTimers.get(profileId);
     if (t) {
-      clearTimeout(t)
-      this.restartTimers.delete(profileId)
+      clearTimeout(t);
+      this.restartTimers.delete(profileId);
     }
   }
 
   sendInput(profileId: string, input: string): { ok: boolean; error?: string } {
-    const m = this.processes.get(profileId)
-    if (!m) return { ok: false, error: 'Not running' }
-    m.process.stdin?.write(input.endsWith('\n') ? input : `${input}\n`)
-    const counter = (this.lineCounters.get(profileId) ?? 0) + 1
-    this.lineCounters.set(profileId, counter)
-    this.pushLine(profileId, input, 'input', counter)
-    return { ok: true }
+    const m = this.processes.get(profileId);
+    if (!m) return { ok: false, error: 'Not running' };
+    m.process.stdin?.write(input.endsWith('\n') ? input : `${input}\n`);
+    const counter = (this.lineCounters.get(profileId) ?? 0) + 1;
+    this.lineCounters.set(profileId, counter);
+    this.pushLine(profileId, input, 'input', counter);
+    return { ok: true };
   }
 
   getStates(): ProcessState[] {
@@ -243,14 +243,14 @@ class ProcessManager {
       running: true,
       pid: m.process.pid,
       startedAt: m.startedAt,
-    }))
+    }));
   }
 
   getActivityLog(): ProcessLogEntry[] {
-    return this.activityLog
+    return this.activityLog;
   }
   clearActivityLog(): void {
-    this.activityLog = []
+    this.activityLog = [];
   }
 
   // ── Process Scanner ──────────────────────────────────────────────────────────
@@ -259,17 +259,17 @@ class ProcessManager {
     return PROTECTED_PROCESS_NAMES.some(
       (n) =>
         name.toLowerCase().includes(n.toLowerCase()) || cmd.toLowerCase().includes(n.toLowerCase())
-    )
+    );
   }
 
   private isSelf(name: string, cmd: string): boolean {
-    return cmd.includes(SELF_PROCESS_NAME) || name.includes(SELF_PROCESS_NAME)
+    return cmd.includes(SELF_PROCESS_NAME) || name.includes(SELF_PROCESS_NAME);
   }
 
   private parseJarName(cmd: string): string | undefined {
-    const m = cmd.match(/-jar\s+([^\s]+)/i)
-    if (!m) return undefined
-    return m[1].split(/[/\\]/).pop()
+    const m = cmd.match(/-jar\s+([^\s]+)/i);
+    if (!m) return undefined;
+    return m[1].split(/[/\\]/).pop();
   }
 
   scanAllProcesses(): JavaProcessInfo[] {
@@ -277,9 +277,9 @@ class ProcessManager {
       Array.from(this.processes.values())
         .map((m) => m.process.pid)
         .filter((p): p is number => p != null)
-    )
-    if (process.platform === 'win32') return this.scanAllWindows(managedPids)
-    return this.scanAllUnix(managedPids)
+    );
+    if (process.platform === 'win32') return this.scanAllWindows(managedPids);
+    return this.scanAllUnix(managedPids);
   }
 
   private scanAllWindows(managedPids: Set<number>): JavaProcessInfo[] {
@@ -293,30 +293,30 @@ class ProcessManager {
       '  $st  = if ($_.StartTime) { $_.StartTime.ToString("yyyy-MM-dd HH:mm:ss") } else { "" }',
       '  [PSCustomObject]@{ Id=$_.Id; Name=$_.ProcessName; Cmd=$cmd; MemMB=$mem; Threads=$thr; Start=$st }',
       '} | ConvertTo-Json -Compress -Depth 2',
-    ].join('; ')
+    ].join('; ');
 
-    const encoded = Buffer.from(psScript, 'utf16le').toString('base64')
+    const encoded = Buffer.from(psScript, 'utf16le').toString('base64');
     try {
       const raw_out = execSync(
         `powershell -NoProfile -NonInteractive -OutputFormat Text -EncodedCommand ${encoded}`,
         { encoding: 'utf8', timeout: 20000 }
-      )
+      );
       const jsonLine = raw_out.split('\n').find((l) => {
-        const t = l.trim()
-        return t.startsWith('[') || t.startsWith('{')
-      })
-      if (!jsonLine) return this.scanAllWindowsTasklist(managedPids)
+        const t = l.trim();
+        return t.startsWith('[') || t.startsWith('{');
+      });
+      if (!jsonLine) return this.scanAllWindowsTasklist(managedPids);
 
-      const raw = JSON.parse(jsonLine.trim())
-      const procs = Array.isArray(raw) ? raw : [raw]
+      const raw = JSON.parse(jsonLine.trim());
+      const procs = Array.isArray(raw) ? raw : [raw];
       return procs
         .map((p: Record<string, unknown>) => {
-          const pid = Number(p.Id)
-          const name = String(p.Name ?? '')
-          const cmd = String(p.Cmd ?? name)
-          if (isNaN(pid) || pid <= 0) return null
-          if (this.isSelf(name, cmd)) return null
-          const isJava = /java/i.test(name) || /java/i.test(cmd)
+          const pid = Number(p.Id);
+          const name = String(p.Name ?? '');
+          const cmd = String(p.Cmd ?? name);
+          if (isNaN(pid) || pid <= 0) return null;
+          if (this.isSelf(name, cmd)) return null;
+          const isJava = /java/i.test(name) || /java/i.test(cmd);
           return {
             pid,
             name,
@@ -328,29 +328,29 @@ class ProcessManager {
             threads: typeof p.Threads === 'number' ? p.Threads : undefined,
             startTime: p.Start ? String(p.Start) : undefined,
             jarName: this.parseJarName(cmd),
-          } as JavaProcessInfo
+          } as JavaProcessInfo;
         })
         .filter((x): x is JavaProcessInfo => x !== null)
-        .sort((a, b) => (b.isJava ? 1 : 0) - (a.isJava ? 1 : 0))
+        .sort((a, b) => (b.isJava ? 1 : 0) - (a.isJava ? 1 : 0));
     } catch {
-      return this.scanAllWindowsTasklist(managedPids)
+      return this.scanAllWindowsTasklist(managedPids);
     }
   }
 
   private scanAllWindowsTasklist(managedPids: Set<number>): JavaProcessInfo[] {
     try {
-      const out = execSync('tasklist /fo csv /nh', { encoding: 'utf8', timeout: 8000 })
-      const results: JavaProcessInfo[] = []
+      const out = execSync('tasklist /fo csv /nh', { encoding: 'utf8', timeout: 8000 });
+      const results: JavaProcessInfo[] = [];
       for (const line of out.split('\n')) {
-        const t = line.trim()
-        if (!t) continue
-        const parts = t.replace(/"/g, '').split(',')
-        if (parts.length < 2) continue
-        const name = parts[0].trim()
-        const pid = parseInt(parts[1].trim(), 10)
-        if (isNaN(pid) || pid <= 0) continue
-        if (this.isSelf(name, name)) continue
-        const isJava = /java/i.test(name)
+        const t = line.trim();
+        if (!t) continue;
+        const parts = t.replace(/"/g, '').split(',');
+        if (parts.length < 2) continue;
+        const name = parts[0].trim();
+        const pid = parseInt(parts[1].trim(), 10);
+        if (isNaN(pid) || pid <= 0) continue;
+        if (this.isSelf(name, name)) continue;
+        const isJava = /java/i.test(name);
         results.push({
           pid,
           name,
@@ -358,29 +358,29 @@ class ProcessManager {
           isJava,
           managed: managedPids.has(pid),
           protected: this.isProtected(name, name),
-        })
+        });
       }
-      return results.sort((a, b) => (b.isJava ? 1 : 0) - (a.isJava ? 1 : 0))
+      return results.sort((a, b) => (b.isJava ? 1 : 0) - (a.isJava ? 1 : 0));
     } catch {
-      return []
+      return [];
     }
   }
 
   private scanAllUnix(managedPids: Set<number>): JavaProcessInfo[] {
     try {
-      const out = execSync('ps -eo pid,comm,args', { encoding: 'utf8', timeout: 5000 })
+      const out = execSync('ps -eo pid,comm,args', { encoding: 'utf8', timeout: 5000 });
       return out
         .split('\n')
         .slice(1)
         .filter(Boolean)
         .map((line) => {
-          const parts = line.trim().split(/\s+/)
-          const pid = parseInt(parts[0], 10)
-          const name = parts[1] ?? ''
-          const cmd = parts.slice(2).join(' ').slice(0, 400)
-          if (isNaN(pid)) return null
-          if (this.isSelf(name, cmd)) return null
-          const isJava = /java/i.test(name) || /java/i.test(cmd)
+          const parts = line.trim().split(/\s+/);
+          const pid = parseInt(parts[0], 10);
+          const name = parts[1] ?? '';
+          const cmd = parts.slice(2).join(' ').slice(0, 400);
+          if (isNaN(pid)) return null;
+          if (this.isSelf(name, cmd)) return null;
+          const isJava = /java/i.test(name) || /java/i.test(cmd);
           return {
             pid,
             name,
@@ -389,39 +389,39 @@ class ProcessManager {
             managed: managedPids.has(pid),
             protected: this.isProtected(name, cmd),
             jarName: this.parseJarName(cmd),
-          } as JavaProcessInfo
+          } as JavaProcessInfo;
         })
         .filter((x): x is JavaProcessInfo => x !== null)
-        .sort((a, b) => (b.isJava ? 1 : 0) - (a.isJava ? 1 : 0))
+        .sort((a, b) => (b.isJava ? 1 : 0) - (a.isJava ? 1 : 0));
     } catch {
-      return []
+      return [];
     }
   }
 
   killPid(pid: number): { ok: boolean; error?: string } {
     try {
-      if (process.platform === 'win32') execSync(`taskkill /PID ${pid} /T /F`, { timeout: 5000 })
-      else process.kill(pid, 'SIGKILL')
+      if (process.platform === 'win32') execSync(`taskkill /PID ${pid} /T /F`, { timeout: 5000 });
+      else process.kill(pid, 'SIGKILL');
       for (const [id, m] of this.processes.entries()) {
         if (m.process.pid === pid) {
-          this.processes.delete(id)
-          break
+          this.processes.delete(id);
+          break;
         }
       }
-      this.broadcastStates()
-      this.updateTray()
-      return { ok: true }
+      this.broadcastStates();
+      this.updateTray();
+      return { ok: true };
     } catch (err: unknown) {
-      return { ok: false, error: err instanceof Error ? err.message : String(err) }
+      return { ok: false, error: err instanceof Error ? err.message : String(err) };
     }
   }
 
   // Only kills non-protected java processes
   killAllJava(): { ok: boolean; killed: number } {
-    const procs = this.scanAllProcesses().filter((p) => p.isJava && !p.protected)
-    let killed = 0
-    for (const p of procs) if (this.killPid(p.pid).ok) killed++
-    return { ok: true, killed }
+    const procs = this.scanAllProcesses().filter((p) => p.isJava && !p.protected);
+    let killed = 0;
+    for (const p of procs) if (this.killPid(p.pid).ok) killed++;
+    return { ok: true, killed };
   }
 
   private pushOutput(
@@ -431,10 +431,10 @@ class ProcessManager {
     m: ManagedProcess
   ) {
     for (const [i, text] of chunk.split(/\r?\n/).entries()) {
-      if (i === chunk.split(/\r?\n/).length - 1 && text === '') continue
-      const counter = (this.lineCounters.get(profileId) ?? 0) + 1
-      this.lineCounters.set(profileId, counter)
-      this.pushLine(profileId, text, type, counter)
+      if (i === chunk.split(/\r?\n/).length - 1 && text === '') continue;
+      const counter = (this.lineCounters.get(profileId) ?? 0) + 1;
+      this.lineCounters.set(profileId, counter);
+      this.pushLine(profileId, text, type, counter);
     }
   }
 
@@ -444,41 +444,41 @@ class ProcessManager {
     type: ConsoleLine['type'],
     id: number | string
   ) {
-    const seenIds = this.seenLineIds.get(profileId)
+    const seenIds = this.seenLineIds.get(profileId);
     if (seenIds?.has(id)) {
-      throw new Error(`Duplicate line ID detected for profile ${profileId}: ${id}`)
+      throw new Error(`Duplicate line ID detected for profile ${profileId}: ${id}`);
     }
     if (seenIds) {
-      seenIds.add(id)
+      seenIds.add(id);
       if (seenIds.size > 10000) {
-        this.seenLineIds.set(profileId, new Set([id]))
+        this.seenLineIds.set(profileId, new Set([id]));
       }
     }
-    this.window?.webContents.send(IPC.CONSOLE_LINE, profileId, {
+    this.window?.webContents.send(ProcessIPC.consoleLine.channel, profileId, {
       id,
       text,
       type,
       timestamp: Date.now(),
-    })
+    });
   }
 
   private pushSystem(_type: SystemMessageType, profileId: string, _pid: string, text: string) {
-    const counter = (this.lineCounters.get(profileId) ?? 0) + 1
-    this.lineCounters.set(profileId, counter)
-    this.pushLine(profileId, text, 'system', counter)
+    const counter = (this.lineCounters.get(profileId) ?? 0) + 1;
+    this.lineCounters.set(profileId, counter);
+    this.pushLine(profileId, text, 'system', counter);
   }
 
   private broadcastStates() {
-    this.window?.webContents.send('process:statesUpdate', this.getStates())
+    this.window?.webContents.send('process:statesUpdate', this.getStates());
   }
 
   setTrayUpdater(fn: () => void) {
-    this.onTrayUpdate = fn
+    this.onTrayUpdate = fn;
   }
 
   private updateTray() {
-    this.onTrayUpdate?.()
+    this.onTrayUpdate?.();
   }
 }
 
-export const processManager = new ProcessManager()
+export const processManager = new ProcessManager();
diff --git a/src/main/RestAPI.routes.ts b/src/main/RestAPI.routes.ts
new file mode 100644
index 0000000..cb82f2c
--- /dev/null
+++ b/src/main/RestAPI.routes.ts
@@ -0,0 +1,135 @@
+import { routeConfig, type RouteKey } from './shared/config/API.config';
+import { ok, err } from './RestAPI';
+import { getAllProfiles, saveProfile, deleteProfile, getSettings, saveSettings } from './Store';
+import { processManager } from './ProcessManager';
+import { v4 as uuidv4 } from 'uuid';
+import type http from 'http';
+import { Profile } from './shared/types/Profile.types';
+import { AppSettings } from './shared/types/App.types';
+
+// ─── Context ──────────────────────────────────────────────────────────────────
+
+type Params = Record<string, string>;
+
+export interface Context {
+  req: http.IncomingMessage;
+  res: http.ServerResponse;
+  params: Params;
+  body: unknown;
+}
+
+type RouteHandler = (ctx: Context) => void | Promise<void>;
+
+// ─── Typed route builder ──────────────────────────────────────────────────────
+
+type BuiltRoute<K extends RouteKey> = (typeof routeConfig)[K] & {
+  handler: RouteHandler;
+};
+
+function defineRoute<K extends RouteKey>(key: K, handler: RouteHandler): BuiltRoute<K> {
+  return {
+    ...routeConfig[key],
+    handler,
+  };
+}
+
+// ─── Routes ───────────────────────────────────────────────────────────────────
+
+export const routes: { [K in RouteKey]: BuiltRoute<K> } = {
+  status: defineRoute('status', ({ res }) =>
+    ok(res, {
+      ok: true,
+      version: process.env.npm_package_version ?? 'unknown',
+      profiles: getAllProfiles().length,
+      running: processManager.getStates().filter((s) => s.running).length,
+    })
+  ),
+
+  profiles_list: defineRoute('profiles_list', ({ res }) => ok(res, getAllProfiles())),
+
+  profiles_get: defineRoute('profiles_get', ({ res, params }) => {
+    const p = getAllProfiles().find((p) => p.id === params.id);
+    p ? ok(res, p) : err(res, 'Profile not found', 404);
+  }),
+
+  profiles_create: defineRoute('profiles_create', ({ res, body }) => {
+    const b = body as Partial<Profile>;
+
+    const p: Profile = {
+      id: uuidv4(),
+      name: b.name ?? 'New Profile',
+      jarPath: b.jarPath ?? '',
+      workingDir: b.workingDir ?? '',
+      jvmArgs: b.jvmArgs ?? [],
+      systemProperties: b.systemProperties ?? [],
+      programArgs: b.programArgs ?? [],
+      javaPath: b.javaPath ?? '',
+      autoStart: b.autoStart ?? false,
+      autoRestart: b.autoRestart ?? false,
+      autoRestartInterval: b.autoRestartInterval ?? 10,
+      color: b.color ?? '#4ade80',
+      createdAt: Date.now(),
+      updatedAt: Date.now(),
+    };
+
+    saveProfile(p);
+    ok(res, p, 201);
+  }),
+
+  profiles_update: defineRoute('profiles_update', ({ res, params, body }) => {
+    const existing = getAllProfiles().find((p) => p.id === params.id);
+    if (!existing) return err(res, 'Profile not found', 404);
+
+    const updated: Profile = {
+      ...existing,
+      ...(body as Partial<Profile>),
+      id: params.id,
+      updatedAt: Date.now(),
+    };
+
+    saveProfile(updated);
+    processManager.updateProfileSnapshot(updated);
+    ok(res, updated);
+  }),
+
+  profiles_delete: defineRoute('profiles_delete', ({ res, params }) => {
+    if (!getAllProfiles().find((p) => p.id === params.id))
+      return err(res, 'Profile not found', 404);
+
+    deleteProfile(params.id);
+    ok(res);
+  }),
+
+  processes_list: defineRoute('processes_list', ({ res }) => ok(res, processManager.getStates())),
+
+  processes_log: defineRoute('processes_log', ({ res }) =>
+    ok(res, processManager.getActivityLog())
+  ),
+
+  processes_start: defineRoute('processes_start', ({ res, params }) => {
+    const p = getAllProfiles().find((p) => p.id === params.id);
+    if (!p) return err(res, 'Profile not found', 404);
+    ok(res, processManager.start(p));
+  }),
+
+  processes_stop: defineRoute('processes_stop', ({ res, params }) =>
+    ok(res, processManager.stop(params.id))
+  ),
+
+  processes_clear: defineRoute('processes_clear', ({ res, params }) => {
+    processManager.clearConsoleForProfile(params.id);
+    ok(res);
+  }),
+
+  settings_get: defineRoute('settings_get', ({ res }) => ok(res, getSettings())),
+
+  settings_update: defineRoute('settings_update', ({ res, body }) => {
+    const updated: AppSettings = {
+      ...getSettings(),
+      ...(body as Partial<AppSettings>),
+    };
+
+    saveSettings(updated);
+    ok(res, updated);
+  }),
+};
diff --git a/src/main/RestAPI.ts b/src/main/RestAPI.ts
index a4dc53f..dde996d 100644
--- a/src/main/RestAPI.ts
+++ b/src/main/RestAPI.ts
@@ -1,220 +1,82 @@
-import http from 'http'
-import { v4 as uuidv4 } from 'uuid'
-import type { Profile, AppSettings } from './shared/types'
-import { getAllProfiles, saveProfile, deleteProfile, getSettings, saveSettings } from './Store'
-import { processManager } from './ProcessManager'
-import { REST_API_CONFIG } from './shared/config/RestApi.config'
-
-// ─── Primitives ───────────────────────────────────────────────────────────────
-
-type Params = Record<string, string>
-
-interface Context {
-  req: http.IncomingMessage
-  res: http.ServerResponse
-  params: Params
-  body: unknown
-}
-
-type RouteHandler = (ctx: Context) => void | Promise<void>
-
-interface RestRoute {
-  method: string
-  path: string
-  handler: RouteHandler
-}
+import http from 'http';
+import { routes } from './RestAPI.routes';
+import { routeConfig } from './shared/config/API.config';
+import { getSettings } from './Store';
+import { REST_API_CONFIG } from './shared/config/API.config';
+
+type Params = Record<string, string>;
+
+// ─── Types ────────────────────────────────────────────────────────────────────
+
+type CompiledRoute = {
+  method: string;
+  path: string;
+  pattern: RegExp;
+  keys: string[];
+  handler: (ctx: {
+    req: http.IncomingMessage;
+    res: http.ServerResponse;
+    params: Params;
+    body: unknown;
+  }) => void | Promise<void>;
+};
 
 // ─── Helpers ──────────────────────────────────────────────────────────────────
 
 function json(res: http.ServerResponse, data: unknown, status = 200) {
-  res.writeHead(status, { 'Content-Type': 'application/json', 'Access-Control-Allow-Origin': '*' })
-  res.end(JSON.stringify(data))
+  res.writeHead(status, {
+    'Content-Type': 'application/json',
+    'Access-Control-Allow-Origin': '*',
+  });
+  res.end(JSON.stringify(data));
 }
 
-function ok(res: http.ServerResponse, data: unknown = { ok: true }, status = 200) {
-  json(res, data, status)
+export function ok(res: http.ServerResponse, data: unknown = { ok: true }, status = 200) {
+  json(res, data, status);
 }
 
-function err(res: http.ServerResponse, msg: string, status = 400) {
-  json(res, { error: msg }, status)
+export function err(res: http.ServerResponse, msg: string, status = 400) {
+  json(res, { error: msg }, status);
 }
 
-function readBody(req: http.IncomingMessage): Promise<unknown> {
+async function readBody(req: http.IncomingMessage): Promise<unknown> {
   return new Promise((resolve) => {
-    let raw = ''
-    req.on('data', (c) => {
-      raw += c
-    })
+    let raw = '';
+    req.on('data', (c) => (raw += c));
     req.on('end', () => {
       try {
-        resolve(JSON.parse(raw))
+        resolve(JSON.parse(raw));
       } catch {
-        resolve({})
+        resolve({});
       }
-    })
-  })
+    });
+  });
 }
 
-function parsePattern(path: string): { pattern: RegExp; keys: string[] } {
-  const keys: string[] = []
+function parsePattern(path: string) {
+  const keys: string[] = [];
   const src = path.replace(/:([a-zA-Z]+)/g, (_m, k) => {
-    keys.push(k)
-    return '([^/]+)'
-  })
-  return { pattern: new RegExp(`^${src}$`), keys }
+    keys.push(k);
+    return '([^/]+)';
+  });
+  return { pattern: new RegExp(`^${src}$`), keys };
 }
 
-// ─── Route definitions ────────────────────────────────────────────────────────
-//
-// Add a new endpoint here — nothing else to touch.
-//
-// ctx.params → path params  (e.g. :id)
-// ctx.body   → parsed JSON body (POST/PUT/PATCH only, otherwise {})
-// Use ok() / err() / json() to respond.
-
-const routes: RestRoute[] = [
-  // ── Status ─────────────────────────────────────────────────────────────────
-
-  {
-    method: 'GET',
-    path: '/api/status',
-    handler: ({ res }) =>
-      ok(res, {
-        ok: true,
-        version: process.env.npm_package_version ?? 'unknown',
-        profiles: getAllProfiles().length,
-        running: processManager.getStates().filter((s) => s.running).length,
-      }),
-  },
-
-  // ── Profiles ───────────────────────────────────────────────────────────────
-
-  {
-    method: 'GET',
-    path: '/api/profiles',
-    handler: ({ res }) => ok(res, getAllProfiles()),
-  },
-  {
-    method: 'GET',
-    path: '/api/profiles/:id',
-    handler: ({ res, params }) => {
-      const p = getAllProfiles().find((p) => p.id === params.id)
-      p ? ok(res, p) : err(res, 'Profile not found', 404)
-    },
-  },
-  {
-    method: 'POST',
-    path: '/api/profiles',
-    handler: ({ res, body }) => {
-      const b = body as Partial<Profile>
-      const p: Profile = {
-        id: uuidv4(),
-        name: b.name ?? 'New Profile',
-        jarPath: b.jarPath ?? '',
-        workingDir: b.workingDir ?? '',
-        jvmArgs: b.jvmArgs ?? [],
-        systemProperties: b.systemProperties ?? [],
-        programArgs: b.programArgs ?? [],
-        javaPath: b.javaPath ?? '',
-        autoStart: b.autoStart ?? false,
-        autoRestart: b.autoRestart ?? false,
-        autoRestartInterval: b.autoRestartInterval ?? 10,
-        color: b.color ?? '#4ade80',
-        createdAt: Date.now(),
-        updatedAt: Date.now(),
-      }
-      saveProfile(p)
-      ok(res, p, 201)
-    },
-  },
-  {
-    method: 'PUT',
-    path: '/api/profiles/:id',
-    handler: ({ res, params, body }) => {
-      const existing = getAllProfiles().find((p) => p.id === params.id)
-      if (!existing) return err(res, 'Profile not found', 404)
-      const updated: Profile = {
-        ...existing,
-        ...(body as Partial<Profile>),
-        id: params.id,
-        updatedAt: Date.now(),
-      }
-      saveProfile(updated)
-      processManager.updateProfileSnapshot(updated)
-      ok(res, updated)
-    },
-  },
-  {
-    method: 'DELETE',
-    path: '/api/profiles/:id',
-    handler: ({ res, params }) => {
-      if (!getAllProfiles().find((p) => p.id === params.id))
-        return err(res, 'Profile not found', 404)
-      deleteProfile(params.id)
-      ok(res)
-    },
-  },
-
-  // ── Processes ──────────────────────────────────────────────────────────────
-
-  {
-    method: 'GET',
-    path: '/api/processes',
-    handler: ({ res }) => ok(res, processManager.getStates()),
-  },
-  {
-    method: 'GET',
-    path: '/api/processes/log',
-    handler: ({ res }) => ok(res, processManager.getActivityLog()),
-  },
-  {
-    method: 'POST',
-    path: '/api/processes/:id/start',
-    handler: ({ res, params }) => {
-      const p = getAllProfiles().find((p) => p.id === params.id)
-      if (!p) return err(res, 'Profile not found', 404)
-      ok(res, processManager.start(p))
-    },
-  },
-  {
-    method: 'POST',
-    path: '/api/processes/:id/stop',
-    handler: ({ res, params }) => ok(res, processManager.stop(params.id)),
-  },
-  {
-    method: 'POST',
-    path: '/api/processes/:id/console/clear',
-    handler: ({ res, params }) => {
-      processManager.clearConsoleForProfile(params.id)
-      ok(res)
-    },
-  },
-
-  // ── Settings ───────────────────────────────────────────────────────────────
-
-  {
-    method: 'GET',
-    path: '/api/settings',
-    handler: ({ res }) => ok(res, getSettings()),
-  },
-  {
-    method: 'PUT',
-    path: '/api/settings',
-    handler: ({ res, body }) => {
-      const updated: AppSettings = { ...getSettings(), ...(body as Partial<AppSettings>) }
-      saveSettings(updated)
-      ok(res, updated)
-    },
-  },
-]
+function compileRoutes(): CompiledRoute[] {
+  return Object.entries(routes).map(([_, r]) => ({
+    ...r,
+    ...parsePattern(r.path),
+  }));
+}
 
-const compiled = routes.map((r) => ({ ...r, ...parsePattern(r.path) }))
+// ─── Server ───────────────────────────────────────────────────────────────────
 
 class RestApiServer {
-  private server: http.Server | null = null
+  private server: http.Server | null = null;
+  private compiled = compileRoutes();
 
   start(port: number): void {
-    if (this.server) return
+    if (this.server) return;
 
     this.server = http.createServer(async (req, res) => {
       if (req.method === 'OPTIONS') {
@@ -222,38 +84,42 @@ class RestApiServer {
           'Access-Control-Allow-Origin': '*',
           'Access-Control-Allow-Methods': 'GET,POST,PUT,DELETE,OPTIONS',
           'Access-Control-Allow-Headers': 'Content-Type',
-        })
-        return res.end()
+        });
+        return res.end();
       }
 
-      const url = req.url?.split('?')[0] ?? '/'
-      const method = req.method ?? 'GET'
-      const body = ['POST', 'PUT', 'PATCH'].includes(method) ? await readBody(req) : {}
+      const url = req.url?.split('?')[0] ?? '/';
+      const method = req.method ?? 'GET';
+      const body =
+        method === 'POST' || method === 'PUT' || method === 'PATCH' ? await readBody(req) : {};
+
+      for (const route of this.compiled) {
+        if (route.method !== method) continue;
 
-      for (const route of compiled) {
-        if (route.method !== method) continue
-        const match = url.match(route.pattern)
-        if (!match) continue
-        const params: Params = {}
+        const match = url.match(route.pattern);
+        if (!match) continue;
+
+        const params: Params = {};
         route.keys.forEach((k, i) => {
-          params[k] = match[i + 1]
-        })
-        await route.handler({ req, res, params, body })
-        return
+          params[k] = match[i + 1];
+        });
+
+        await route.handler({ req, res, params, body });
+        return;
       }
 
-      err(res, 'Not found', 404)
-    })
+      err(res, 'Not found', 404);
+    });
 
     this.server.listen(port, REST_API_CONFIG.host, () => {
-      console.log(`[JRC REST] Listening on ${REST_API_CONFIG.host}:${port}`)
-    })
+      console.log(`[JRC REST] Listening on ${REST_API_CONFIG.host}:${port}`);
+    });
   }
 
   stop(): void {
-    this.server?.close()
-    this.server = null
+    this.server?.close();
+    this.server = null;
   }
 }
 
-export const restApiServer = new RestApiServer()
+export const restApiServer = new RestApiServer();
diff --git a/src/main/Store.ts b/src/main/Store.ts
index eac34b3..6a10ea8 100644
--- a/src/main/Store.ts
+++ b/src/main/Store.ts
@@ -1,67 +1,78 @@
-import Store from 'electron-store'
-import type { Profile, AppSettings } from './shared/types'
-import { REST_API_CONFIG } from './shared/config/RestApi.config'
+import { app } from 'electron';
+import Store from 'electron-store';
+import { DEFAULT_SETTINGS } from './shared/config/App.config';
+import { Profile } from './shared/types/Profile.types';
+import { AppSettings } from './shared/types/App.types';
 
 interface StoreSchema {
-  profiles: Profile[]
-  settings: AppSettings
-}
-
-const DEFAULT_SETTINGS: AppSettings = {
-  launchOnStartup: false,
-  startMinimized: false,
-  minimizeToTray: true,
-  consoleFontSize: 13,
-  consoleMaxLines: 5000,
-  consoleWordWrap: false,
-  consoleLineNumbers: false,
-  consoleHistorySize: 200,
-  theme: 'dark',
-  restApiEnabled: false,
-  restApiPort: REST_API_CONFIG.defaultPort,
+  profiles: Profile[];
+  settings: AppSettings;
 }
 
 const store = new Store<StoreSchema>({
   name: 'java-runner-config',
   defaults: { profiles: [], settings: DEFAULT_SETTINGS },
-})
+});
 
 export function getAllProfiles(): Profile[] {
-  const profiles = store.get('profiles', [])
-  return [...profiles].sort((a, b) => (a.order ?? 0) - (b.order ?? 0))
+  const profiles = store.get('profiles', []);
+  return [...profiles].sort((a, b) => (a.order ?? 0) - (b.order ?? 0));
 }
 
 export function saveProfile(profile: Profile): void {
-  const profiles = getAllProfiles()
-  const idx = profiles.findIndex((p) => p.id === profile.id)
-  profile.updatedAt = Date.now()
-  if (idx >= 0) profiles[idx] = profile
+  const profiles = getAllProfiles();
+  const idx = profiles.findIndex((p) => p.id === profile.id);
+  profile.updatedAt = Date.now();
+  if (idx >= 0) profiles[idx] = profile;
   else {
-    profile.order = profiles.length
-    profiles.push(profile)
+    profile.order = profiles.length;
+    profiles.push(profile);
   }
-  store.set('profiles', profiles)
+  store.set('profiles', profiles);
 }
 
 export function deleteProfile(id: string): void {
   store.set(
     'profiles',
     getAllProfiles().filter((p) => p.id !== id)
-  )
+  );
 }
 
 export function reorderProfiles(orderedIds: string[]): void {
-  const profiles = getAllProfiles()
+  const profiles = getAllProfiles();
   const updated = profiles.map((p) => ({
     ...p,
     order: orderedIds.indexOf(p.id),
-  }))
-  store.set('profiles', updated)
+  }));
+  store.set('profiles', updated);
+}
+
+export function toggleDevMode(enabled: boolean): void {
+  const settings = getSettings();
+  settings.devModeEnabled = enabled;
+  saveSettings(settings);
 }
 
 export function getSettings(): AppSettings {
-  return { ...DEFAULT_SETTINGS, ...store.get('settings', DEFAULT_SETTINGS) }
+  return { ...DEFAULT_SETTINGS, ...store.get('settings', DEFAULT_SETTINGS) };
 }
+
 export function saveSettings(settings: AppSettings): void {
-  store.set('settings', settings)
+  const prev = getSettings();
+  store.set('settings', settings);
+  if (
+    settings.launchOnStartup !== prev.launchOnStartup ||
+    settings.startMinimized !== prev.startMinimized
+  ) {
+    syncLoginItem(settings.launchOnStartup, settings.startMinimized);
+  }
+}
+
+export function syncLoginItem(openAtLogin: boolean, startMinimized: boolean): void {
+  if (!app.isPackaged) return;
+  const args = ['--autostart', startMinimized && '--minimized'].filter(Boolean) as string[];
+  app.setLoginItemSettings({
+    openAtLogin,
+    args,
+  });
 }
diff --git a/src/main/ipc/Dev.ipc.ts b/src/main/ipc/Dev.ipc.ts
new file mode 100644
index 0000000..840ff7b
--- /dev/null
+++ b/src/main/ipc/Dev.ipc.ts
@@ -0,0 +1,40 @@
+import { BrowserWindow } from 'electron';
+import { DEFAULT_SETTINGS } from '../shared/config/App.config';
+import type { RouteMap } from '../IPCController';
+import { getAllProfiles, getSettings, toggleDevMode } from '../Store';
+
+let getWindow: () => BrowserWindow | null = () => null;
+
+export function initDevIPC(windowGetter: () => BrowserWindow | null) {
+  getWindow = windowGetter;
+}
+
+export const DevIPC = {
+  getSysInfo: {
+    type: 'invoke',
+    channel: 'dev:getSysInfo',
+    handler: () => ({
+      platform: process.platform,
+      arch: process.arch,
+      nodeVersion: process.versions.node,
+      electronVersion: process.versions.electron,
+      argv: process.argv,
+      chromeVersion: process.versions.chrome,
+      uptime: Math.floor(process.uptime()),
+      memoryUsageMB: Math.round(process.memoryUsage().heapUsed / 1024 / 1024),
+    }),
+  },
+
+  resetStore: {
+    type: 'invoke',
+    channel: 'dev:resetStore',
+    handler: async () => {
+      // Remove all profiles and reset settings to defaults
+      const profiles = getAllProfiles();
+      const Store = (await import('electron-store')).default;
+      const store = new Store({ name: 'java-runner-config' });
+      store.set('profiles', []);
+      store.set('settings', DEFAULT_SETTINGS);
+    },
+  },
+} satisfies RouteMap;
diff --git a/src/main/ipc/Environment.ipc.ts b/src/main/ipc/Environment.ipc.ts
new file mode 100644
index 0000000..3d9ebbb
--- /dev/null
+++ b/src/main/ipc/Environment.ipc.ts
@@ -0,0 +1,41 @@
+import { BrowserWindow } from 'electron';
+import { getEnvironment, loadEnvironment } from '../JRCEnvironment';
+import { RouteMap } from '../IPCController';
+import { JRCEnvironment } from '../shared/types/App.types';
+import { toggleDevMode } from '../Store';
+
+export const EnvironmentIPC = {
+  get: {
+    type: 'invoke',
+    channel: 'env:get',
+    handler: () => getEnvironment(),
+  },
+
+  reload: {
+    type: 'send',
+    channel: 'env:reload',
+    handler: () => loadEnvironment(),
+  },
+
+  change: {
+    type: 'on',
+    channel: 'env:changed',
+    args: {} as (env: JRCEnvironment) => void,
+  },
+
+  toggleDevMode: {
+    type: 'invoke',
+    channel: 'env:toggleDevMode',
+    handler: (_e: Electron.IpcMainInvokeEvent, enabled: boolean) => {
+      const win = BrowserWindow.getAllWindows()[0];
+      if (!win) return;
+
+      toggleDevMode(enabled);
+      loadEnvironment();
+
+      if (!enabled) {
+        win.webContents.closeDevTools();
+      }
+    },
+  },
+} satisfies RouteMap;
diff --git a/src/main/ipc/GitHub.ipc.ts b/src/main/ipc/GitHub.ipc.ts
index 905e9ec..9245349 100644
--- a/src/main/ipc/GitHub.ipc.ts
+++ b/src/main/ipc/GitHub.ipc.ts
@@ -1,49 +1,49 @@
-import fs from 'fs'
-import https from 'https'
-import { dialog, shell, BrowserWindow } from 'electron'
-import type { RouteMap } from '../shared/IPCController'
-import { latestReleaseUrl, templateListUrl, rawTemplateUrl } from '../shared/config/GitHub.config'
-import type { GitHubRelease, ProfileTemplate } from '../shared/GitHub.types'
+import fs from 'fs';
+import https from 'https';
+import { dialog, shell, BrowserWindow } from 'electron';
+import type { RouteMap } from '../IPCController';
+import { latestReleaseUrl, templateListUrl, rawTemplateUrl } from '../shared/config/GitHub.config';
+import type { GitHubRelease, ProfileTemplate } from '../shared/types/GitHub.types';
 
 function httpsGet(url: string): Promise<unknown> {
   return new Promise((resolve, reject) => {
-    const options = { headers: { 'User-Agent': 'java-runner-client' } }
+    const options = { headers: { 'User-Agent': 'java-runner-client' } };
     const req = https.get(url, options, (res) => {
       if (res.statusCode && res.statusCode >= 300 && res.statusCode < 400 && res.headers.location) {
-        resolve(httpsGet(res.headers.location))
-        return
+        resolve(httpsGet(res.headers.location));
+        return;
       }
-      let data = ''
+      let data = '';
       res.on('data', (c) => {
-        data += c
-      })
+        data += c;
+      });
       res.on('end', () => {
         try {
-          resolve(JSON.parse(data))
+          resolve(JSON.parse(data));
         } catch {
-          reject(new Error('JSON parse error'))
+          reject(new Error('JSON parse error'));
         }
-      })
-    })
-    req.on('error', reject)
+      });
+    });
+    req.on('error', reject);
     req.setTimeout(10000, () => {
-      req.destroy()
-      reject(new Error('Timeout'))
-    })
-  })
+      req.destroy();
+      reject(new Error('Timeout'));
+    });
+  });
 }
 
 interface ActiveDownload {
-  req: ReturnType<typeof https.get>
-  res: import('http').IncomingMessage
-  fileStream: fs.WriteStream
-  filePath: string
-  bytesWritten: number
-  totalBytes: number
-  paused: boolean
+  req: ReturnType<typeof https.get>;
+  res: import('http').IncomingMessage;
+  fileStream: fs.WriteStream;
+  filePath: string;
+  bytesWritten: number;
+  totalBytes: number;
+  paused: boolean;
 }
 
-const activeDownloads = new Map<string, ActiveDownload>()
+const activeDownloads = new Map<string, ActiveDownload>();
 
 export const GitHubIPC = {
   fetchLatestRelease: {
@@ -51,9 +51,9 @@ export const GitHubIPC = {
     channel: 'github:latestRelease',
     handler: async () => {
       try {
-        return { ok: true, data: (await httpsGet(latestReleaseUrl())) as GitHubRelease }
+        return { ok: true, data: (await httpsGet(latestReleaseUrl())) as GitHubRelease };
       } catch (e) {
-        return { ok: false, error: String(e) }
+        return { ok: false, error: String(e) };
       }
     },
   },
@@ -63,23 +63,23 @@ export const GitHubIPC = {
     channel: 'github:templates',
     handler: async () => {
       try {
-        const raw = await httpsGet(templateListUrl())
+        const raw = await httpsGet(templateListUrl());
         if (!Array.isArray(raw))
-          return { ok: false, error: 'Templates folder not found or repo not configured' }
-        const templates: Array<{ filename: string; template: ProfileTemplate }> = []
+          return { ok: false, error: 'Templates folder not found or repo not configured' };
+        const templates: Array<{ filename: string; template: ProfileTemplate }> = [];
         for (const f of (raw as Array<{ name: string }>).filter((f) => f.name.endsWith('.json'))) {
           try {
             templates.push({
               filename: f.name,
               template: (await httpsGet(rawTemplateUrl(f.name))) as ProfileTemplate,
-            })
+            });
           } catch {
             /* skip malformed */
           }
         }
-        return { ok: true, data: templates }
+        return { ok: true, data: templates };
       } catch (e) {
-        return { ok: false, error: String(e) }
+        return { ok: false, error: String(e) };
       }
     },
   },
@@ -91,17 +91,17 @@ export const GitHubIPC = {
       const { canceled, filePath } = await dialog.showSaveDialog({
         defaultPath: filename,
         filters: [{ name: 'Installer', extensions: ['exe', 'dmg', 'AppImage', 'deb', '*'] }],
-      })
-      if (canceled || !filePath) return { ok: false }
+      });
+      if (canceled || !filePath) return { ok: false };
 
-      const { sender } = e
+      const { sender } = e;
       const sendProgress = (
         dl: Pick<ActiveDownload, 'bytesWritten' | 'totalBytes'>,
         status: 'downloading' | 'paused' | 'done' | 'error' | 'cancelled',
         error?: string
       ) => {
-        if (sender.isDestroyed()) return
-        const { bytesWritten, totalBytes } = dl
+        if (sender.isDestroyed()) return;
+        const { bytesWritten, totalBytes } = dl;
         sender.send('github:downloadProgress', {
           filename,
           bytesWritten,
@@ -109,12 +109,12 @@ export const GitHubIPC = {
           percent: totalBytes > 0 ? Math.round((bytesWritten / totalBytes) * 100) : 0,
           status,
           error,
-        })
-      }
+        });
+      };
 
       return new Promise<{ ok: boolean; error?: string }>((resolve) => {
         const doRequest = (requestUrl: string) => {
-          const options = { headers: { 'User-Agent': 'java-runner-client' } }
+          const options = { headers: { 'User-Agent': 'java-runner-client' } };
           const req = https.get(requestUrl, options, (res) => {
             // Follow redirect
             if (
@@ -123,12 +123,12 @@ export const GitHubIPC = {
               res.statusCode < 400 &&
               res.headers.location
             ) {
-              doRequest(res.headers.location)
-              return
+              doRequest(res.headers.location);
+              return;
             }
 
-            const totalBytes = parseInt(res.headers['content-length'] ?? '0', 10)
-            const file = fs.createWriteStream(filePath)
+            const totalBytes = parseInt(res.headers['content-length'] ?? '0', 10);
+            const file = fs.createWriteStream(filePath);
 
             const dl: ActiveDownload = {
               req,
@@ -138,47 +138,47 @@ export const GitHubIPC = {
               bytesWritten: 0,
               totalBytes,
               paused: false,
-            }
-            activeDownloads.set(filename, dl)
+            };
+            activeDownloads.set(filename, dl);
 
-            sendProgress(dl, 'downloading')
+            sendProgress(dl, 'downloading');
 
             res.on('data', (chunk: Buffer) => {
-              dl.bytesWritten += chunk.length
-              file.write(chunk)
-              sendProgress(dl, dl.paused ? 'paused' : 'downloading')
-            })
+              dl.bytesWritten += chunk.length;
+              file.write(chunk);
+              sendProgress(dl, dl.paused ? 'paused' : 'downloading');
+            });
 
             res.on('end', () => {
-              file.end()
-            })
+              file.end();
+            });
 
             file.on('finish', () => {
-              file.close()
-              activeDownloads.delete(filename)
-              sendProgress({ bytesWritten: dl.totalBytes, totalBytes: dl.totalBytes }, 'done')
-              shell.showItemInFolder(filePath)
-              resolve({ ok: true })
-            })
+              file.close();
+              activeDownloads.delete(filename);
+              sendProgress({ bytesWritten: dl.totalBytes, totalBytes: dl.totalBytes }, 'done');
+              shell.showItemInFolder(filePath);
+              resolve({ ok: true });
+            });
 
             req.on('error', (err) => {
-              activeDownloads.delete(filename)
-              fs.unlink(filePath, () => {})
-              sendProgress(dl, 'error', err.message)
-              resolve({ ok: false, error: err.message })
-            })
+              activeDownloads.delete(filename);
+              fs.unlink(filePath, () => {});
+              sendProgress(dl, 'error', err.message);
+              resolve({ ok: false, error: err.message });
+            });
 
             file.on('error', (err) => {
-              activeDownloads.delete(filename)
-              fs.unlink(filePath, () => {})
-              sendProgress(dl, 'error', err.message)
-              resolve({ ok: false, error: err.message })
-            })
-          })
-        }
+              activeDownloads.delete(filename);
+              fs.unlink(filePath, () => {});
+              sendProgress(dl, 'error', err.message);
+              resolve({ ok: false, error: err.message });
+            });
+          });
+        };
 
-        doRequest(url)
-      })
+        doRequest(url);
+      });
     },
   },
 
@@ -186,10 +186,10 @@ export const GitHubIPC = {
     type: 'invoke',
     channel: 'github:pauseDownload',
     handler: async (e: Electron.IpcMainInvokeEvent, filename: string) => {
-      const dl = activeDownloads.get(filename)
-      if (!dl) return { ok: false, error: 'No active download' }
-      dl.res.pause()
-      dl.paused = true
+      const dl = activeDownloads.get(filename);
+      if (!dl) return { ok: false, error: 'No active download' };
+      dl.res.pause();
+      dl.paused = true;
       if (!e.sender.isDestroyed()) {
         e.sender.send('github:downloadProgress', {
           filename,
@@ -197,9 +197,9 @@ export const GitHubIPC = {
           totalBytes: dl.totalBytes,
           percent: dl.totalBytes > 0 ? Math.round((dl.bytesWritten / dl.totalBytes) * 100) : 0,
           status: 'paused',
-        })
+        });
       }
-      return { ok: true }
+      return { ok: true };
     },
   },
 
@@ -207,10 +207,10 @@ export const GitHubIPC = {
     type: 'invoke',
     channel: 'github:resumeDownload',
     handler: async (e: Electron.IpcMainInvokeEvent, filename: string) => {
-      const dl = activeDownloads.get(filename)
-      if (!dl) return { ok: false, error: 'No active download' }
-      dl.res.resume()
-      dl.paused = false
+      const dl = activeDownloads.get(filename);
+      if (!dl) return { ok: false, error: 'No active download' };
+      dl.res.resume();
+      dl.paused = false;
       if (!e.sender.isDestroyed()) {
         e.sender.send('github:downloadProgress', {
           filename,
@@ -218,9 +218,9 @@ export const GitHubIPC = {
           totalBytes: dl.totalBytes,
           percent: dl.totalBytes > 0 ? Math.round((dl.bytesWritten / dl.totalBytes) * 100) : 0,
           status: 'downloading',
-        })
+        });
       }
-      return { ok: true }
+      return { ok: true };
     },
   },
 
@@ -228,12 +228,12 @@ export const GitHubIPC = {
     type: 'invoke',
     channel: 'github:cancelDownload',
     handler: async (e: Electron.IpcMainInvokeEvent, filename: string) => {
-      const dl = activeDownloads.get(filename)
-      if (!dl) return { ok: false, error: 'No active download' }
-      dl.res.destroy()
-      dl.fileStream.close()
-      fs.unlink(dl.filePath, () => {})
-      activeDownloads.delete(filename)
+      const dl = activeDownloads.get(filename);
+      if (!dl) return { ok: false, error: 'No active download' };
+      dl.res.destroy();
+      dl.fileStream.close();
+      fs.unlink(dl.filePath, () => {});
+      activeDownloads.delete(filename);
       if (!e.sender.isDestroyed()) {
         e.sender.send('github:downloadProgress', {
           filename,
@@ -241,9 +241,9 @@ export const GitHubIPC = {
           totalBytes: dl.totalBytes,
           percent: dl.totalBytes > 0 ? Math.round((dl.bytesWritten / dl.totalBytes) * 100) : 0,
           status: 'cancelled',
-        })
+        });
       }
-      return { ok: true }
+      return { ok: true };
     },
   },
 
@@ -251,12 +251,12 @@ export const GitHubIPC = {
     type: 'on',
     channel: 'github:downloadProgress',
     args: {} as (progress: {
-      filename: string
-      bytesWritten: number
-      totalBytes: number
-      percent: number
-      status: 'downloading' | 'paused' | 'done' | 'error' | 'cancelled'
-      error?: string
+      filename: string;
+      bytesWritten: number;
+      totalBytes: number;
+      percent: number;
+      status: 'downloading' | 'paused' | 'done' | 'error' | 'cancelled';
+      error?: string;
     }) => void,
   },
-} satisfies RouteMap
+} satisfies RouteMap;
diff --git a/src/main/ipc/Process.ipc.ts b/src/main/ipc/Process.ipc.ts
index ebd6939..c475dfb 100644
--- a/src/main/ipc/Process.ipc.ts
+++ b/src/main/ipc/Process.ipc.ts
@@ -1,6 +1,7 @@
-import type { RouteMap } from '../shared/IPCController'
-import { processManager } from '../ProcessManager'
-import type { Profile, ProcessState, ConsoleLine } from '../shared/types'
+import type { RouteMap } from '../IPCController';
+import { processManager } from '../ProcessManager';
+import { Profile } from '../shared/types/Profile.types';
+import { ConsoleLine, ProcessState } from '../shared/types/Process.types';
 
 export const ProcessIPC = {
   startProcess: {
@@ -62,4 +63,4 @@ export const ProcessIPC = {
     channel: 'process:statesUpdate',
     args: {} as (states: ProcessState[]) => void,
   },
-} satisfies RouteMap
+} satisfies RouteMap;
diff --git a/src/main/ipc/Profile.ipc.ts b/src/main/ipc/Profile.ipc.ts
index 513081b..f69036b 100644
--- a/src/main/ipc/Profile.ipc.ts
+++ b/src/main/ipc/Profile.ipc.ts
@@ -1,7 +1,7 @@
-import type { RouteMap } from '../shared/IPCController'
-import { getAllProfiles, saveProfile, deleteProfile, reorderProfiles } from '../Store'
-import { processManager } from '../ProcessManager'
-import type { Profile } from '../shared/types'
+import type { RouteMap } from '../IPCController';
+import { getAllProfiles, saveProfile, deleteProfile, reorderProfiles } from '../Store';
+import { processManager } from '../ProcessManager';
+import type { Profile } from '../shared/types/Profile.types';
 
 export const ProfileIPC = {
   getProfiles: { type: 'invoke', channel: 'profiles:getAll', handler: () => getAllProfiles() },
@@ -20,8 +20,8 @@ export const ProfileIPC = {
     type: 'invoke',
     channel: 'profiles:save',
     handler: (_e: any, profile: Profile) => {
-      saveProfile(profile)
-      processManager.updateProfileSnapshot(profile)
+      saveProfile(profile);
+      processManager.updateProfileSnapshot(profile);
     },
   },
-} satisfies RouteMap
+} satisfies RouteMap;
diff --git a/src/main/ipc/System.ipc.ts b/src/main/ipc/System.ipc.ts
index 1e4f002..5c88b69 100644
--- a/src/main/ipc/System.ipc.ts
+++ b/src/main/ipc/System.ipc.ts
@@ -1,13 +1,14 @@
-import { dialog, shell } from 'electron'
-import type { RouteMap } from '../shared/IPCController'
-import { getSettings, saveSettings } from '../Store'
-import { restApiServer } from '../RestAPI'
-import type { AppSettings } from '../shared/types'
+import { dialog, shell } from 'electron';
+import { restApiServer } from '../RestAPI';
+import type { RouteMap } from '../IPCController';
+import type { AppSettings, JRCEnvironment } from '../shared/types/App.types';
+import { getSettings, saveSettings } from '../Store';
+import { getEnvironment } from './../JRCEnvironment';
 
 // mainWindow is needed for dialogs — set via initSystemIPC() called from main.ts
-let getWindow: () => Electron.BrowserWindow | null = () => null
+let getWindow: () => Electron.BrowserWindow | null = () => null;
 export function initSystemIPC(windowGetter: () => Electron.BrowserWindow | null) {
-  getWindow = windowGetter
+  getWindow = windowGetter;
 }
 
 export const SystemIPC = {
@@ -17,13 +18,13 @@ export const SystemIPC = {
     type: 'invoke',
     channel: 'settings:save',
     handler: (_e: any, next: AppSettings) => {
-      const prev = getSettings()
-      saveSettings(next)
-      if (!next.restApiEnabled && prev.restApiEnabled) restApiServer.stop()
-      else if (next.restApiEnabled && !prev.restApiEnabled) restApiServer.start(next.restApiPort)
+      const prev = getSettings();
+      saveSettings(next);
+      if (!next.restApiEnabled && prev.restApiEnabled) restApiServer.stop();
+      else if (next.restApiEnabled && !prev.restApiEnabled) restApiServer.start(next.restApiPort);
       else if (next.restApiEnabled && next.restApiPort !== prev.restApiPort) {
-        restApiServer.stop()
-        restApiServer.start(next.restApiPort)
+        restApiServer.stop();
+        restApiServer.start(next.restApiPort);
       }
     },
   },
@@ -35,16 +36,16 @@ export const SystemIPC = {
       const r = await dialog.showOpenDialog(getWindow()!, {
         filters: [{ name: 'JAR', extensions: ['jar'] }],
         properties: ['openFile'],
-      })
-      return r.canceled ? null : r.filePaths[0]
+      });
+      return r.canceled ? null : r.filePaths[0];
     },
   },
   pickDir: {
     type: 'invoke',
     channel: 'dialog:pickDir',
     handler: async () => {
-      const r = await dialog.showOpenDialog(getWindow()!, { properties: ['openDirectory'] })
-      return r.canceled ? null : r.filePaths[0]
+      const r = await dialog.showOpenDialog(getWindow()!, { properties: ['openDirectory'] });
+      return r.canceled ? null : r.filePaths[0];
     },
   },
   pickJava: {
@@ -54,8 +55,8 @@ export const SystemIPC = {
       const r = await dialog.showOpenDialog(getWindow()!, {
         filters: [{ name: 'Executable', extensions: ['exe', '*'] }],
         properties: ['openFile'],
-      })
-      return r.canceled ? null : r.filePaths[0]
+      });
+      return r.canceled ? null : r.filePaths[0];
     },
   },
 
@@ -64,4 +65,4 @@ export const SystemIPC = {
     channel: 'shell:openExternal',
     handler: (_e: any, url: string) => shell.openExternal(url),
   },
-} satisfies RouteMap
+} satisfies RouteMap;
diff --git a/src/main/ipc/Window.ipc.ts b/src/main/ipc/Window.ipc.ts
index b303d4b..7cc2eb6 100644
--- a/src/main/ipc/Window.ipc.ts
+++ b/src/main/ipc/Window.ipc.ts
@@ -1,17 +1,17 @@
-import { app } from 'electron'
-import type { RouteMap } from '../shared/IPCController'
-import { getSettings } from '../Store'
+import { app } from 'electron';
+import type { RouteMap } from '../IPCController';
+import { getSettings } from '../Store';
 
 // Injected from main.ts — avoids a circular import on mainWindow/forceQuit
-let getWindow: () => Electron.BrowserWindow | null = () => null
-let setForceQuit: () => void = () => {}
+let getWindow: () => Electron.BrowserWindow | null = () => null;
+let setForceQuit: () => void = () => {};
 
 export function initWindowIPC(
   windowGetter: () => Electron.BrowserWindow | null,
   forceQuitSetter: () => void
 ) {
-  getWindow = windowGetter
-  setForceQuit = forceQuitSetter
+  getWindow = windowGetter;
+  setForceQuit = forceQuitSetter;
 }
 
 export const WindowIPC = {
@@ -25,11 +25,11 @@ export const WindowIPC = {
     type: 'send',
     channel: 'window:close',
     handler: () => {
-      if (getSettings().minimizeToTray) getWindow()?.hide()
+      if (getSettings().minimizeToTray) getWindow()?.hide();
       else {
-        setForceQuit()
-        app.quit()
+        setForceQuit();
+        app.quit();
       }
     },
   },
-} satisfies RouteMap
+} satisfies RouteMap;
diff --git a/src/main/ipc/_index.ts b/src/main/ipc/_index.ts
index bddd5f5..dfec313 100644
--- a/src/main/ipc/_index.ts
+++ b/src/main/ipc/_index.ts
@@ -1,3 +1,4 @@
+import { EnvironmentIPC } from './Environment.ipc';
 /**
  * Central IPC registry.
  *
@@ -7,22 +8,30 @@
  *   3. That's it — main, preload, and types all update automatically
  */
 
-export { GitHubIPC } from './GitHub.ipc'
-export { ProcessIPC } from './Process.ipc'
-export { ProfileIPC } from './Profile.ipc'
-export { SystemIPC, initSystemIPC } from './System.ipc'
-export { WindowIPC, initWindowIPC } from './Window.ipc'
+export { GitHubIPC } from './GitHub.ipc';
+export { ProcessIPC } from './Process.ipc';
+export { ProfileIPC } from './Profile.ipc';
+export { SystemIPC, initSystemIPC } from './System.ipc';
+export { WindowIPC, initWindowIPC } from './Window.ipc';
+export { DevIPC, initDevIPC } from './Dev.ipc';
 
-import { GitHubIPC } from './GitHub.ipc'
-import { ProcessIPC } from './Process.ipc'
-import { ProfileIPC } from './Profile.ipc'
-import { SystemIPC } from './System.ipc'
-import { WindowIPC } from './Window.ipc'
-import type { InferAPI } from '../shared/IPCController'
+import { GitHubIPC } from './GitHub.ipc';
+import { ProcessIPC } from './Process.ipc';
+import { ProfileIPC } from './Profile.ipc';
+import { SystemIPC } from './System.ipc';
+import { WindowIPC } from './Window.ipc';
+import { DevIPC } from './Dev.ipc';
+import type { InferAPI } from '../IPCController';
 
-export const allRoutes = [GitHubIPC, ProcessIPC, ProfileIPC, SystemIPC, WindowIPC] as const
+export const allRoutes = [GitHubIPC, ProcessIPC, ProfileIPC, SystemIPC, WindowIPC, DevIPC] as const;
 
-// The full inferred window.api type — used in global.d.ts
 export type API = InferAPI<
-  typeof GitHubIPC & typeof ProcessIPC & typeof ProfileIPC & typeof SystemIPC & typeof WindowIPC
->
+  typeof GitHubIPC &
+    typeof ProcessIPC &
+    typeof ProfileIPC &
+    typeof SystemIPC &
+    typeof WindowIPC &
+    typeof DevIPC
+>;
+
+export type Environment = InferAPI<typeof EnvironmentIPC>;
diff --git a/src/main/main.ts b/src/main/main.ts
index 4aa275a..2fbc4cc 100644
--- a/src/main/main.ts
+++ b/src/main/main.ts
@@ -1,42 +1,39 @@
-import { app, BrowserWindow, Tray, Menu, nativeImage } from 'electron'
-import path from 'path'
-import fs from 'fs'
-import { getAllProfiles, getSettings } from './Store'
-import { processManager } from './ProcessManager'
-import { restApiServer } from './RestAPI'
-import { registerIPC } from './shared/IPCController'
-import { allRoutes, initSystemIPC, initWindowIPC } from './ipc/_index'
-
-const IS_DEV = !app.isPackaged
-const RESOURCES = IS_DEV
-  ? path.join(__dirname, '../../resources')
-  : path.join(app.getAppPath(), 'resources')
-const isActiveLaunch =
-  !process.argv.includes('--hidden') && !process.argv.includes('--squirrel-firstrun')
-const DEBUG = true
-
-const actualLog = console.log
-console.log =
-  IS_DEV && DEBUG ? (...args) => actualLog(`[${new Date().toISOString()}]`, ...args) : () => {}
+import { app, BrowserWindow, Input, Menu, nativeImage, Tray } from 'electron';
+import fs from 'fs';
+import path from 'path';
+import { allRoutes, initDevIPC, initSystemIPC, initWindowIPC } from './ipc/_index';
+import { EnvironmentIPC } from './ipc/Environment.ipc';
+import { getEnvironment, loadEnvironment, shouldStartMinimized } from './JRCEnvironment';
+import { processManager } from './ProcessManager';
+import { restApiServer } from './RestAPI';
+import { registerIPC } from './IPCController';
+import { getAllProfiles, getSettings, syncLoginItem } from './Store';
+
+loadEnvironment();
+
+const RESOURCES =
+  getEnvironment().type === 'dev'
+    ? path.join(__dirname, '../../resources')
+    : path.join(app.getAppPath(), 'resources');
 
 function getIconImage(): Electron.NativeImage {
   const candidates =
-    process.platform === 'win32' ? ['icon.ico', 'icon.png'] : ['icon.png', 'icon.ico']
+    process.platform === 'win32' ? ['icon.ico', 'icon.png'] : ['icon.png', 'icon.ico'];
   for (const name of candidates) {
-    const p = path.join(RESOURCES, name)
+    const p = path.join(RESOURCES, name);
     if (fs.existsSync(p)) {
-      const img = nativeImage.createFromPath(p)
-      if (!img.isEmpty()) return img
+      const img = nativeImage.createFromPath(p);
+      if (!img.isEmpty()) return img;
     }
   }
   return nativeImage.createFromDataURL(
     'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mNk+M9QDwADhgGAWjR9awAAAABJRU5ErkJggg=='
-  )
+  );
 }
 
-let mainWindow: BrowserWindow | null = null
-let tray: Tray | null = null
-let forceQuit = false
+let mainWindow: BrowserWindow | null = null;
+let tray: Tray | null = null;
+let forceQuit = false;
 
 function createWindow(): void {
   mainWindow = new BrowserWindow({
@@ -47,60 +44,61 @@ function createWindow(): void {
     frame: false,
     backgroundColor: '#08090d',
     icon: getIconImage(),
-    show: IS_DEV ? true : false,
+    show: getEnvironment().startUpSource !== 'withSystem',
     webPreferences: {
       preload: path.join(__dirname, 'preload.js'),
       contextIsolation: true,
       nodeIntegration: false,
       sandbox: false,
+      devTools: true,
     },
-  })
+  });
 
-  if (IS_DEV) mainWindow.loadURL('http://localhost:5173')
-  else mainWindow.loadFile(path.join(__dirname, '../renderer/index.html'))
+  if (getEnvironment().type === 'dev') mainWindow.loadURL('http://localhost:5173');
+  else mainWindow.loadFile(path.join(__dirname, '../renderer/index.html'));
 
   mainWindow.once('ready-to-show', () => {
-    const shouldStartHidden = getSettings().startMinimized && !IS_DEV && !isActiveLaunch
-    if (shouldStartHidden) mainWindow?.hide()
-    else mainWindow?.show()
-  })
+    const shouldStartHidden = shouldStartMinimized();
+    if (shouldStartHidden) mainWindow?.hide();
+    else mainWindow?.show();
+  });
 
   mainWindow.on('close', (e) => {
-    if (forceQuit) return
-    if (getSettings().minimizeToTray && !isActiveLaunch) {
-      e.preventDefault()
-      mainWindow?.hide()
+    if (forceQuit) return;
+    if (getSettings().minimizeToTray) {
+      e.preventDefault();
+      mainWindow?.hide();
     }
-  })
+  });
 
-  processManager.setWindow(mainWindow)
+  processManager.setWindow(mainWindow);
 }
 
 function createTray(): void {
-  tray = new Tray(getIconImage().resize({ width: 16, height: 16 }))
-  tray.setToolTip('Java Runner Client')
-  updateTrayMenu()
+  tray = new Tray(getIconImage().resize({ width: 16, height: 16 }));
+  tray.setToolTip('Java Runner Client');
+  updateTrayMenu();
   tray.on('double-click', () => {
-    mainWindow?.show()
-    mainWindow?.focus()
-  })
+    mainWindow?.show();
+    mainWindow?.focus();
+  });
 }
 
 function updateTrayMenu(): void {
-  if (!tray) return
-  const states = processManager.getStates()
-  const profiles = getAllProfiles()
+  if (!tray) return;
+  const states = processManager.getStates();
+  const profiles = getAllProfiles();
   const items = states.map((s) => ({
     label: `  ${profiles.find((p) => p.id === s.profileId)?.name ?? s.profileId}  (PID ${s.pid ?? '?'})`,
     enabled: false,
-  }))
+  }));
   tray.setContextMenu(
     Menu.buildFromTemplate([
       {
         label: 'Open Java Runner Client',
         click: () => {
-          mainWindow?.show()
-          mainWindow?.focus()
+          mainWindow?.show();
+          mainWindow?.focus();
         },
       },
       { type: 'separator' },
@@ -110,57 +108,97 @@ function updateTrayMenu(): void {
       {
         label: 'Quit',
         click: () => {
-          forceQuit = true
-          app.quit()
+          forceQuit = true;
+          app.quit();
         },
       },
     ])
-  )
+  );
 }
 
-const gotLock = app.requestSingleInstanceLock()
+let devToolsPressCount = 0;
+let devToolsTimer: NodeJS.Timeout | null = null;
+
+const gotLock = app.requestSingleInstanceLock();
 
 if (!gotLock) {
-  app.quit()
+  app.quit();
 } else {
   app.on('second-instance', () => {
     if (mainWindow) {
-      if (mainWindow.isMinimized()) mainWindow.restore()
-      mainWindow.show()
-      mainWindow.focus()
+      if (mainWindow.isMinimized()) mainWindow.restore();
+      mainWindow.show();
+      mainWindow.focus();
     }
-  })
+  });
 
   app.whenReady().then(() => {
-    createWindow()
-    createTray()
+    // If launched by the OS at login but the user has since disabled autostart, bail out.
+    // This handles the edge case where the registry entry outlives the setting.
+    if (getEnvironment().startUpSource === 'withSystem' && !getSettings().launchOnStartup) return;
+
+    // Ensure the OS login item always reflects the stored setting
+    syncLoginItem(getSettings().launchOnStartup, getSettings().startMinimized);
+
+    createWindow();
+    createTray();
+
+    mainWindow?.webContents.on('before-input-event', handleBeforeInputEvent);
 
     // ── IPC ────────────────────────────────────────────────────────────────────
-    initSystemIPC(() => mainWindow)
+    initSystemIPC(() => mainWindow);
     initWindowIPC(
       () => mainWindow,
       () => {
-        forceQuit = true
+        forceQuit = true;
       }
-    )
-    registerIPC([...allRoutes])
+    );
+    initDevIPC(() => mainWindow);
+    registerIPC([...allRoutes]);
+    registerIPC([EnvironmentIPC]);
     // ──────────────────────────────────────────────────────────────────────────
 
-    const settings = getSettings()
-    if (settings.restApiEnabled) restApiServer.start(settings.restApiPort)
-    for (const p of getAllProfiles()) if (p.autoStart && p.jarPath) processManager.start(p)
+    const settings = getSettings();
+    if (settings.restApiEnabled) restApiServer.start(settings.restApiPort);
+    for (const p of getAllProfiles()) if (p.autoStart && p.jarPath) processManager.start(p);
 
-    mainWindow?.webContents.on('did-finish-load', updateTrayMenu)
-    processManager.setTrayUpdater(updateTrayMenu)
-  })
+    mainWindow?.webContents.on('did-finish-load', updateTrayMenu);
+    processManager.setTrayUpdater(updateTrayMenu);
+  });
 }
 
 app.on('window-all-closed', () => {
   /* keep alive in tray */
-})
+});
 app.on('before-quit', () => {
-  forceQuit = true
-})
+  forceQuit = true;
+});
 app.on('activate', () => {
-  mainWindow?.show()
-})
+  mainWindow?.show();
+});
+
+const handleBeforeInputEvent = (event: Electron.Event, input: Input) => {
+  const isDevToolsShortcut =
+    input.key === 'F12' ||
+    (input.control && input.shift && input.key.toUpperCase() === 'I') ||
+    (input.meta && input.alt && input.key.toUpperCase() === 'I');
+
+  if (!isDevToolsShortcut) return;
+
+  event.preventDefault();
+
+  devToolsPressCount++;
+
+  if (devToolsTimer) clearTimeout(devToolsTimer);
+  devToolsTimer = setTimeout(() => (devToolsPressCount = 0), 1000);
+
+  if (devToolsPressCount >= 7) {
+    devToolsPressCount = 0;
+    mainWindow?.webContents.openDevTools({ mode: 'detach' });
+    return;
+  }
+
+  if (getEnvironment().devMode) {
+    mainWindow?.webContents.openDevTools();
+  }
+};
diff --git a/src/main/preload.ts b/src/main/preload.ts
index 5eedd04..49769fa 100644
--- a/src/main/preload.ts
+++ b/src/main/preload.ts
@@ -1,5 +1,8 @@
-import { contextBridge } from 'electron'
-import { buildPreloadAPI } from './shared/IPCController'
-import { allRoutes } from './ipc/_index'
+import { contextBridge } from 'electron';
+import { allRoutes } from './ipc/_index';
+import { EnvironmentIPC } from './ipc/Environment.ipc';
+import { buildPreloadAPI } from './IPCController';
 
-contextBridge.exposeInMainWorld('api', buildPreloadAPI([...allRoutes]))
+contextBridge.exposeInMainWorld('api', buildPreloadAPI([...allRoutes]));
+
+contextBridge.exposeInMainWorld('env', buildPreloadAPI([EnvironmentIPC]));
diff --git a/src/main/shared/GitHub.types.ts b/src/main/shared/GitHub.types.ts
deleted file mode 100644
index 016069f..0000000
--- a/src/main/shared/GitHub.types.ts
+++ /dev/null
@@ -1,60 +0,0 @@
-export interface GitHubAsset {
-  id: number
-  name: string
-  label: string | null
-  content_type: string
-  state: string
-  size: number
-  download_count: number
-  browser_download_url: string
-  created_at: string
-  updated_at: string
-}
-
-export interface GitHubRelease {
-  id: number
-  tag_name: string
-  name: string | null
-  body: string | null
-  draft: boolean
-  prerelease: boolean
-  created_at: string
-  published_at: string
-  html_url: string
-  tarball_url: string
-  zipball_url: string
-  assets: GitHubAsset[]
-  author: {
-    login: string
-    avatar_url: string
-    html_url: string
-  }
-}
-
-export interface ProfileTemplate {
-  templateVersion: number
-  minAppVersion: string
-  name: string
-  description: string
-  category: string
-  tags: string[]
-  defaults: {
-    jvmArgs: { value: string; enabled: boolean }[]
-    systemProperties: { key: string; value: string; enabled: boolean }[]
-    programArgs: { value: string; enabled: boolean }[]
-    javaPath: string
-    autoStart: boolean
-    autoRestart: boolean
-    autoRestartInterval: number
-    color: string
-  }
-}
-
-export interface DownloadProgress {
-  filename: string
-  bytesWritten: number
-  totalBytes: number
-  percent: number
-  status: 'downloading' | 'paused' | 'done' | 'error' | 'cancelled'
-  error?: string
-}
diff --git a/src/main/shared/config/API.config.ts b/src/main/shared/config/API.config.ts
new file mode 100644
index 0000000..fd683ca
--- /dev/null
+++ b/src/main/shared/config/API.config.ts
@@ -0,0 +1,86 @@
+export const REST_API_CONFIG = {
+  defaultPort: 4444,
+  host: '127.0.0.1',
+} as const;
+
+export type RouteDefinition = {
+  method: 'GET' | 'POST' | 'PUT' | 'DELETE';
+  path: string;
+  description: string;
+  bodyTemplate?: string;
+};
+
+export const routeConfig = {
+  status: {
+    method: 'GET',
+    path: '/api/status',
+    description: 'App status + version',
+  },
+
+  profiles_list: {
+    method: 'GET',
+    path: '/api/profiles',
+    description: 'List all profiles',
+  },
+  profiles_get: {
+    method: 'GET',
+    path: '/api/profiles/:id',
+    description: 'Get profile by ID',
+  },
+  profiles_create: {
+    method: 'POST',
+    path: '/api/profiles',
+    description: 'Create profile',
+    bodyTemplate: '{ "name": "New Profile", "jarPath": "" }',
+  },
+  profiles_update: {
+    method: 'PUT',
+    path: '/api/profiles/:id',
+    description: 'Update profile',
+  },
+  profiles_delete: {
+    method: 'DELETE',
+    path: '/api/profiles/:id',
+    description: 'Delete profile',
+  },
+
+  processes_list: {
+    method: 'GET',
+    path: '/api/processes',
+    description: 'Running process states',
+  },
+  processes_log: {
+    method: 'GET',
+    path: '/api/processes/log',
+    description: 'Activity log',
+  },
+  processes_start: {
+    method: 'POST',
+    path: '/api/processes/:id/start',
+    description: 'Start process',
+  },
+  processes_stop: {
+    method: 'POST',
+    path: '/api/processes/:id/stop',
+    description: 'Stop process',
+  },
+  processes_clear: {
+    method: 'POST',
+    path: '/api/processes/:id/console/clear',
+    description: 'Clear console',
+  },
+
+  settings_get: {
+    method: 'GET',
+    path: '/api/settings',
+    description: 'Get settings',
+  },
+  settings_update: {
+    method: 'PUT',
+    path: '/api/settings',
+    description: 'Update settings',
+    bodyTemplate: '{ "consoleFontSize": 13 }',
+  },
+} as const satisfies Record<string, RouteDefinition>;
+
+export type RouteKey = keyof typeof routeConfig;
diff --git a/src/main/shared/config/App.config.ts b/src/main/shared/config/App.config.ts
new file mode 100644
index 0000000..22ab8e4
--- /dev/null
+++ b/src/main/shared/config/App.config.ts
@@ -0,0 +1,17 @@
+import type { AppSettings } from '../types/App.types';
+import { REST_API_CONFIG } from './API.config';
+
+export const DEFAULT_SETTINGS: AppSettings = {
+  launchOnStartup: false,
+  startMinimized: false,
+  minimizeToTray: true,
+  consoleFontSize: 13,
+  consoleMaxLines: 5000,
+  consoleWordWrap: false,
+  consoleLineNumbers: false,
+  consoleHistorySize: 200,
+  theme: 'dark',
+  restApiEnabled: false,
+  restApiPort: REST_API_CONFIG.defaultPort,
+  devModeEnabled: false,
+};
diff --git a/src/main/shared/config/FAQ.config.ts b/src/main/shared/config/FAQ.config.ts
index 1349bff..feb5611 100644
--- a/src/main/shared/config/FAQ.config.ts
+++ b/src/main/shared/config/FAQ.config.ts
@@ -1,11 +1,11 @@
 export interface FaqItem {
-  q: string
-  a: string
+  q: string;
+  a: string;
 }
 export interface FaqTopic {
-  id: string
-  label: string
-  items: FaqItem[]
+  id: string;
+  label: string;
+  items: FaqItem[];
 }
 
 export const FAQ_TOPICS: FaqTopic[] = [
@@ -97,4 +97,4 @@ export const FAQ_TOPICS: FaqTopic[] = [
       },
     ],
   },
-]
+];
diff --git a/src/main/shared/config/GitHub.config.ts b/src/main/shared/config/GitHub.config.ts
index 7b3d6f7..2c9875d 100644
--- a/src/main/shared/config/GitHub.config.ts
+++ b/src/main/shared/config/GitHub.config.ts
@@ -4,20 +4,20 @@ export const GITHUB_CONFIG = {
   templatesPath: 'profile-templates',
   templateMinVersion: 1,
   apiBase: 'https://api.github.com',
-} as const
+} as const;
 
 export function releasesUrl(): string {
-  return `${GITHUB_CONFIG.apiBase}/repos/${GITHUB_CONFIG.owner}/${GITHUB_CONFIG.repo}/releases`
+  return `${GITHUB_CONFIG.apiBase}/repos/${GITHUB_CONFIG.owner}/${GITHUB_CONFIG.repo}/releases`;
 }
 
 export function latestReleaseUrl(): string {
-  return `${GITHUB_CONFIG.apiBase}/repos/${GITHUB_CONFIG.owner}/${GITHUB_CONFIG.repo}/releases/latest`
+  return `${GITHUB_CONFIG.apiBase}/repos/${GITHUB_CONFIG.owner}/${GITHUB_CONFIG.repo}/releases/latest`;
 }
 
 export function templateListUrl(): string {
-  return `${GITHUB_CONFIG.apiBase}/repos/${GITHUB_CONFIG.owner}/${GITHUB_CONFIG.repo}/contents/${GITHUB_CONFIG.templatesPath}`
+  return `${GITHUB_CONFIG.apiBase}/repos/${GITHUB_CONFIG.owner}/${GITHUB_CONFIG.repo}/contents/${GITHUB_CONFIG.templatesPath}`;
 }
 
 export function rawTemplateUrl(filename: string): string {
-  return `https://raw.githubusercontent.com/${GITHUB_CONFIG.owner}/${GITHUB_CONFIG.repo}/main/${GITHUB_CONFIG.templatesPath}/${filename}`
+  return `https://raw.githubusercontent.com/${GITHUB_CONFIG.owner}/${GITHUB_CONFIG.repo}/main/${GITHUB_CONFIG.templatesPath}/${filename}`;
 }
diff --git a/src/main/shared/config/RestApi.config.ts b/src/main/shared/config/RestApi.config.ts
deleted file mode 100644
index 9271f4a..0000000
--- a/src/main/shared/config/RestApi.config.ts
+++ /dev/null
@@ -1,23 +0,0 @@
-export const REST_API_CONFIG = {
-  defaultPort: 4444,
-  host: '127.0.0.1',
-} as const
-
-export const REST_ROUTES = {
-  // Info
-  status: '/api/status',
-  profiles: '/api/profiles',
-  profile: '/api/profiles/:id',
-  settings: '/api/settings',
-  processStates: '/api/processes',
-  processLog: '/api/processes/log',
-
-  // Actions
-  profileCreate: '/api/profiles',
-  profileUpdate: '/api/profiles/:id',
-  profileDelete: '/api/profiles/:id',
-  processStart: '/api/processes/:id/start',
-  processStop: '/api/processes/:id/stop',
-  consoleClear: '/api/processes/:id/console/clear',
-  settingsUpdate: '/api/settings',
-} as const
diff --git a/src/main/shared/config/Scanner.config.ts b/src/main/shared/config/Scanner.config.ts
index eb7444a..7adc8ac 100644
--- a/src/main/shared/config/Scanner.config.ts
+++ b/src/main/shared/config/Scanner.config.ts
@@ -3,4 +3,4 @@
  * and excluded from "Kill All Java".
  * Add entries by exact process name (case-insensitive match).
  */
-export const PROTECTED_PROCESS_NAMES: string[] = ['Java Runner Client']
+export const PROTECTED_PROCESS_NAMES: string[] = ['Java Runner Client'];
diff --git a/src/main/shared/types.ts b/src/main/shared/types.ts
deleted file mode 100644
index b746d5f..0000000
--- a/src/main/shared/types.ts
+++ /dev/null
@@ -1,111 +0,0 @@
-export interface SystemProperty {
-  key: string
-  value: string
-  enabled: boolean
-}
-export interface JvmArgument {
-  value: string
-  enabled: boolean
-}
-export interface ProgramArgument {
-  value: string
-  enabled: boolean
-}
-
-export interface Profile {
-  id: string
-  name: string
-  jarPath: string
-  workingDir: string
-  jvmArgs: JvmArgument[]
-  systemProperties: SystemProperty[]
-  programArgs: ProgramArgument[]
-  javaPath: string
-  autoStart: boolean
-  color: string
-  createdAt: number
-  updatedAt: number
-  autoRestart: boolean
-  autoRestartInterval: number
-  order?: number
-}
-
-export interface AppSettings {
-  launchOnStartup: boolean
-  startMinimized: boolean
-  minimizeToTray: boolean
-  consoleFontSize: number
-  consoleMaxLines: number
-  consoleWordWrap: boolean
-  consoleLineNumbers: boolean
-  consoleHistorySize: number
-  theme: 'dark'
-  restApiEnabled: boolean
-  restApiPort: number
-}
-
-export interface ConsoleLine {
-  id: number
-  text: string
-  type: 'stdout' | 'stderr' | 'input' | 'system'
-  timestamp: number
-}
-
-export interface ProcessState {
-  profileId: string
-  running: boolean
-  pid?: number
-  startedAt?: number
-  exitCode?: number
-}
-
-export interface ProcessLogEntry {
-  id: string
-  profileId: string
-  profileName: string
-  jarPath: string
-  pid: number
-  startedAt: number
-  stoppedAt?: number
-  exitCode?: number
-  signal?: string
-}
-
-export interface JavaProcessInfo {
-  pid: number
-  name: string
-  command: string
-  isJava: boolean
-  managed: boolean
-  protected: boolean
-  memoryMB?: number
-  startTime?: string
-  threads?: number
-  jarName?: string
-}
-
-export const IPC = {
-  PROFILES_GET_ALL: 'profiles:getAll',
-  PROFILES_SAVE: 'profiles:save',
-  PROFILES_DELETE: 'profiles:delete',
-  PROFILES_REORDER: 'profiles:reorder',
-  PROCESS_START: 'process:start',
-  PROCESS_STOP: 'process:stop',
-  PROCESS_SEND_INPUT: 'process:sendInput',
-  PROCESS_GET_STATES: 'process:getStates',
-  PROCESS_GET_LOG: 'process:getLog',
-  PROCESS_CLEAR_LOG: 'process:clearLog',
-  PROCESS_SCAN_ALL: 'process:scanAll',
-  PROCESS_KILL_PID: 'process:killPid',
-  PROCESS_KILL_ALL_JAVA: 'process:killAllJava',
-  CONSOLE_LINE: 'console:line',
-  CONSOLE_CLEAR: 'console:clear',
-  SETTINGS_GET: 'settings:get',
-  SETTINGS_SAVE: 'settings:save',
-  DIALOG_PICK_JAR: 'dialog:pickJar',
-  DIALOG_PICK_DIR: 'dialog:pickDir',
-  DIALOG_PICK_JAVA: 'dialog:pickJava',
-  WINDOW_MINIMIZE: 'window:minimize',
-  WINDOW_CLOSE: 'window:close',
-  TRAY_SHOW: 'tray:show',
-} as const
diff --git a/src/main/shared/types/App.types.ts b/src/main/shared/types/App.types.ts
new file mode 100644
index 0000000..06f77ff
--- /dev/null
+++ b/src/main/shared/types/App.types.ts
@@ -0,0 +1,21 @@
+export interface AppSettings {
+  launchOnStartup: boolean;
+  startMinimized: boolean;
+  minimizeToTray: boolean;
+  consoleFontSize: number;
+  consoleMaxLines: number;
+  consoleWordWrap: boolean;
+  consoleLineNumbers: boolean;
+  consoleHistorySize: number;
+  theme: 'dark';
+  restApiEnabled: boolean;
+  restApiPort: number;
+  devModeEnabled: boolean;
+}
+
+export interface JRCEnvironment {
+  isReady: boolean;
+  devMode: boolean;
+  type: 'dev' | 'prod';
+  startUpSource: 'userRequest' | 'withSystem' | 'development';
+}
diff --git a/src/main/shared/types/GitHub.types.ts b/src/main/shared/types/GitHub.types.ts
new file mode 100644
index 0000000..44cfa76
--- /dev/null
+++ b/src/main/shared/types/GitHub.types.ts
@@ -0,0 +1,60 @@
+export interface GitHubAsset {
+  id: number;
+  name: string;
+  label: string | null;
+  content_type: string;
+  state: string;
+  size: number;
+  download_count: number;
+  browser_download_url: string;
+  created_at: string;
+  updated_at: string;
+}
+
+export interface GitHubRelease {
+  id: number;
+  tag_name: string;
+  name: string | null;
+  body: string | null;
+  draft: boolean;
+  prerelease: boolean;
+  created_at: string;
+  published_at: string;
+  html_url: string;
+  tarball_url: string;
+  zipball_url: string;
+  assets: GitHubAsset[];
+  author: {
+    login: string;
+    avatar_url: string;
+    html_url: string;
+  };
+}
+
+export interface ProfileTemplate {
+  templateVersion: number;
+  minAppVersion: string;
+  name: string;
+  description: string;
+  category: string;
+  tags: string[];
+  defaults: {
+    jvmArgs: { value: string; enabled: boolean }[];
+    systemProperties: { key: string; value: string; enabled: boolean }[];
+    programArgs: { value: string; enabled: boolean }[];
+    javaPath: string;
+    autoStart: boolean;
+    autoRestart: boolean;
+    autoRestartInterval: number;
+    color: string;
+  };
+}
+
+export interface DownloadProgress {
+  filename: string;
+  bytesWritten: number;
+  totalBytes: number;
+  percent: number;
+  status: 'downloading' | 'paused' | 'done' | 'error' | 'cancelled';
+  error?: string;
+}
diff --git a/src/main/shared/types/Process.types.ts b/src/main/shared/types/Process.types.ts
new file mode 100644
index 0000000..5bd8f7e
--- /dev/null
+++ b/src/main/shared/types/Process.types.ts
@@ -0,0 +1,39 @@
+export interface ProcessState {
+  profileId: string;
+  running: boolean;
+  pid?: number;
+  startedAt?: number;
+  exitCode?: number;
+}
+
+export interface ProcessLogEntry {
+  id: string;
+  profileId: string;
+  profileName: string;
+  jarPath: string;
+  pid: number;
+  startedAt: number;
+  stoppedAt?: number;
+  exitCode?: number;
+  signal?: string;
+}
+
+export interface JavaProcessInfo {
+  pid: number;
+  name: string;
+  command: string;
+  isJava: boolean;
+  managed: boolean;
+  protected: boolean;
+  memoryMB?: number;
+  startTime?: string;
+  threads?: number;
+  jarName?: string;
+}
+
+export interface ConsoleLine {
+  id: number;
+  text: string;
+  type: 'stdout' | 'stderr' | 'input' | 'system';
+  timestamp: number;
+}
diff --git a/src/main/shared/types/Profile.types.ts b/src/main/shared/types/Profile.types.ts
new file mode 100644
index 0000000..6a11c49
--- /dev/null
+++ b/src/main/shared/types/Profile.types.ts
@@ -0,0 +1,31 @@
+export interface SystemProperty {
+  key: string;
+  value: string;
+  enabled: boolean;
+}
+export interface JvmArgument {
+  value: string;
+  enabled: boolean;
+}
+export interface ProgramArgument {
+  value: string;
+  enabled: boolean;
+}
+
+export interface Profile {
+  id: string;
+  name: string;
+  jarPath: string;
+  workingDir: string;
+  jvmArgs: JvmArgument[];
+  systemProperties: SystemProperty[];
+  programArgs: ProgramArgument[];
+  javaPath: string;
+  autoStart: boolean;
+  color: string;
+  createdAt: number;
+  updatedAt: number;
+  autoRestart: boolean;
+  autoRestartInterval: number;
+  order?: number;
+}
diff --git a/src/renderer/App.tsx b/src/renderer/App.tsx
index 90982de..2c6e703 100644
--- a/src/renderer/App.tsx
+++ b/src/renderer/App.tsx
@@ -1,13 +1,13 @@
-import React from 'react'
-import { HashRouter, Routes, Route, Navigate } from 'react-router-dom'
-import { AppProvider } from './store/AppStore'
-import { TitleBar } from './components/common/TitleBar'
-import { MainLayout } from './components/MainLayout'
+import { HashRouter, Navigate, Route, Routes } from 'react-router-dom';
+import { TitleBar } from './components/common/TitleBar';
+import { DevModeGate } from './components/developer/DevModeGate';
+import { MainLayout } from './components/MainLayout';
+import { AppProvider } from './store/AppStore';
 
 function JavaRunnerFallback() {
   return (
     <div className="flex flex-col items-center justify-center h-screen bg-gray-900 text-gray-100 p-8 text-center select-none">
-      <div className="mb-6 text-6xl">⚠️</div>
+      <div className="mb-6 text-6xl">!</div>
       <h1 className="text-3xl font-bold mb-4">App cannot run</h1>
       <p className="mb-4 text-lg">
         The preload script failed to load, or you are trying to open this app in an incompatible
@@ -20,11 +20,11 @@ function JavaRunnerFallback() {
         window.api is undefined
       </div>
     </div>
-  )
+  );
 }
 
 export default function App() {
-  if (!window.api) return <JavaRunnerFallback />
+  if (!window.api) return <JavaRunnerFallback />;
 
   return (
     <AppProvider>
@@ -34,14 +34,15 @@ export default function App() {
           v7_relativeSplatPath: false,
         }}
       >
-        <div className="flex flex-col h-screen bg-base-900 text-text-primary overflow-hidden select-none">
+        <div className="flex flex-col h-screen bg-base-900 text-text-primary min-h-0 select-none">
           <TitleBar />
           <Routes>
             <Route path="/" element={<Navigate to="/console" replace />} />
             <Route path="/*" element={<MainLayout />} />
           </Routes>
         </div>
+        <DevModeGate />
       </HashRouter>
     </AppProvider>
-  )
+  );
 }
diff --git a/src/renderer/components/MainLayout.tsx b/src/renderer/components/MainLayout.tsx
index bb1c53e..97b1829 100644
--- a/src/renderer/components/MainLayout.tsx
+++ b/src/renderer/components/MainLayout.tsx
@@ -1,73 +1,91 @@
-import React, { useEffect } from 'react'
-import { Routes, Route, Navigate, useNavigate, useLocation } from 'react-router-dom'
-import { ProfileSidebar } from './profiles/ProfileSidebar'
-import { ConsoleTab } from './console/ConsoleTab'
-import { ConfigTab } from './profiles/ConfigTab'
-import { ProfileTab } from './profiles/ProfileTab'
-import { SettingsTab } from './settings/SettingsTab'
-import { UtilitiesTab } from './utils/UtilitiesTab'
-import { FaqPanel } from './faq/FaqPanel'
-import { useApp } from '../store/AppStore'
-import { VscTerminal, VscAccount } from 'react-icons/vsc'
-import { LuList } from 'react-icons/lu'
+import React, { useEffect, useState } from 'react';
+import { Routes, Route, Navigate, useNavigate, useLocation } from 'react-router-dom';
+import { ProfileSidebar } from './profiles/ProfileSidebar';
+import { ConsoleTab } from './console/ConsoleTab';
+import { ConfigTab } from './profiles/ConfigTab';
+import { ProfileTab } from './profiles/ProfileTab';
+import { SettingsTab } from './settings/SettingsTab';
+import { UtilitiesTab } from './utils/UtilitiesTab';
+import { FaqPanel } from './faq/FaqPanel';
+import { DeveloperTab } from './developer/DeveloperTab';
+import { useApp } from '../store/AppStore';
+import { useDevMode } from '../hooks/useDevMode';
+import { VscTerminal, VscAccount } from 'react-icons/vsc';
+import { LuList } from 'react-icons/lu';
+import { JRCEnvironment } from 'src/main/shared/types/App.types';
 
 const MAIN_TABS = [
   { path: 'console', label: 'Console', Icon: VscTerminal },
   { path: 'config', label: 'Configure', Icon: LuList },
   { path: 'profile', label: 'Profile', Icon: VscAccount },
-] as const
+] as const;
 
-const SIDE_PANELS = ['settings', 'faq', 'utilities'] as const
-type SidePanel = (typeof SIDE_PANELS)[number]
+const SIDE_PANELS = ['settings', 'faq', 'utilities', 'developer'] as const;
+type SidePanel = (typeof SIDE_PANELS)[number];
 
 function isSidePanel(seg: string): seg is SidePanel {
-  return (SIDE_PANELS as readonly string[]).includes(seg)
+  return (SIDE_PANELS as readonly string[]).includes(seg);
 }
 
+const PANEL_LABELS: Record<SidePanel, string> = {
+  settings: 'Application Settings',
+  faq: 'FAQ',
+  utilities: 'Utilities',
+  developer: 'Developer',
+};
+
 export function MainLayout() {
-  const { state, activeProfile, isRunning, setActiveProfile } = useApp()
-  const navigate = useNavigate()
-  const location = useLocation()
+  const { state, activeProfile, isRunning, setActiveProfile } = useApp();
+  const devMode = useDevMode();
+  const navigate = useNavigate();
+  const location = useLocation();
+
+  const segments = location.pathname.replace(/^\//, '').split('/');
+  const firstSeg = segments[0] ?? 'console';
+  const activePanel = isSidePanel(firstSeg) ? firstSeg : null;
+  const activeTab = activePanel ? 'console' : firstSeg;
 
-  const segments = location.pathname.replace(/^\//, '').split('/')
-  const firstSeg = segments[0] ?? 'console'
-  const activePanel = isSidePanel(firstSeg) ? firstSeg : null
-  const activeTab = activePanel ? 'console' : firstSeg
+  const color = activeProfile?.color ?? '#4ade80';
+  const running = activeProfile ? isRunning(activeProfile.id) : false;
 
-  const color = activeProfile?.color ?? '#4ade80'
-  const running = activeProfile ? isRunning(activeProfile.id) : false
+  // Redirect away from developer panel if dev mode is turned off
+  useEffect(() => {
+    if (!devMode && activePanel === 'developer') {
+      navigate('console', { replace: true });
+    }
+  }, [devMode, activePanel, navigate]);
 
   // When profile changes, go to console
-  const prevIdRef = React.useRef(state.activeProfileId)
+  const prevIdRef = React.useRef(state.activeProfileId);
   useEffect(() => {
     if (state.activeProfileId !== prevIdRef.current) {
-      prevIdRef.current = state.activeProfileId
-      if (!activePanel) navigate('console', { replace: true })
+      prevIdRef.current = state.activeProfileId;
+      if (!activePanel) navigate('console', { replace: true });
     }
-  }, [state.activeProfileId, activePanel, navigate])
+  }, [state.activeProfileId, activePanel, navigate]);
 
   const openPanel = (panel: SidePanel) => {
-    navigate(activePanel === panel ? 'console' : panel)
-  }
+    navigate(activePanel === panel ? 'console' : panel);
+  };
 
   const handleProfileClick = () => {
-    if (activePanel) navigate('console')
-  }
+    if (activePanel) navigate('console');
+  };
 
   return (
-    <div className="flex flex-1 overflow-hidden">
+    <div className="flex flex-1 min-h-0">
       <ProfileSidebar
         onOpenSettings={() => openPanel('settings')}
         onOpenFaq={() => openPanel('faq')}
         onOpenUtilities={() => openPanel('utilities')}
+        onOpenDeveloper={() => openPanel('developer')}
         onProfileClick={handleProfileClick}
         activeSidePanel={activePanel}
       />
 
-      <div className="flex flex-col flex-1 overflow-hidden">
+      <div className="flex flex-col flex-1 min-h-0">
         {activePanel ? (
           <>
-            {/* Panel header with back navigation */}
             <div className="shrink-0">
               <div className="flex items-center gap-3 px-4 h-10 bg-base-900">
                 <button
@@ -89,30 +107,26 @@ export function MainLayout() {
                 </button>
                 <div className="w-px h-4 bg-surface-border" />
                 <span className="text-xs font-medium text-text-secondary capitalize">
-                  {
-                    { settings: 'Application Settings', faq: 'FAQ', utilities: 'Utilities' }[
-                      activePanel
-                    ]
-                  }
+                  {PANEL_LABELS[activePanel]}
                 </span>
               </div>
               <div className="border-b border-surface-border" />
             </div>
 
-            <div className="flex-1 overflow-hidden bg-base-800">
+            <div className="flex-1 min-h-0 bg-base-800 animate-fade-in">
               <Routes>
                 <Route path="settings" element={<SettingsTab />} />
                 <Route path="faq" element={<FaqPanel />} />
                 <Route path="utilities" element={<UtilitiesTab />} />
+                <Route path="developer" element={<DeveloperTab />} />
               </Routes>
             </div>
           </>
         ) : (
           <>
-            {/* Main tab bar */}
             <div className="flex items-center px-4 pt-2 border-b border-surface-border bg-base-900 shrink-0">
               {MAIN_TABS.map((tab) => {
-                const isActive = activeTab === tab.path
+                const isActive = activeTab === tab.path;
                 return (
                   <button
                     key={tab.path}
@@ -134,7 +148,7 @@ export function MainLayout() {
                       />
                     )}
                   </button>
-                )
+                );
               })}
               <div className="flex-1" />
               {activeProfile && (
@@ -144,7 +158,7 @@ export function MainLayout() {
               )}
             </div>
 
-            <div className="flex-1 overflow-hidden bg-base-800 animate-fade-in">
+            <div className="flex-1 min-h-0 bg-base-800 animate-fade-in">
               <Routes>
                 <Route path="console" element={<ConsoleTab />} />
                 <Route path="config" element={<ConfigTab />} />
@@ -156,5 +170,5 @@ export function MainLayout() {
         )}
       </div>
     </div>
-  )
+  );
 }
diff --git a/src/renderer/components/common/ArgList.tsx b/src/renderer/components/common/ArgList.tsx
index 7f3dcef..9c3a22d 100644
--- a/src/renderer/components/common/ArgList.tsx
+++ b/src/renderer/components/common/ArgList.tsx
@@ -1,39 +1,39 @@
-import React, { useState } from 'react'
-import { Button } from './Button'
+import React, { useState } from 'react';
+import { Button } from './Button';
 
 export interface ArgItem {
-  value: string
-  enabled: boolean
+  value: string;
+  enabled: boolean;
 }
 
 interface Props {
-  items: ArgItem[]
-  onChange: (items: ArgItem[]) => void
-  onPendingChange?: (hasPending: boolean) => void
-  placeholder?: string
+  items: ArgItem[];
+  onChange: (items: ArgItem[]) => void;
+  onPendingChange?: (hasPending: boolean) => void;
+  placeholder?: string;
 }
 
 export function ArgList({ items, onChange, onPendingChange, placeholder = '--arg' }: Props) {
-  const [draft, setDraft] = useState('')
+  const [draft, setDraft] = useState('');
 
   const setDraftAndNotify = (v: string) => {
-    setDraft(v)
-    onPendingChange?.(v.trim().length > 0)
-  }
+    setDraft(v);
+    onPendingChange?.(v.trim().length > 0);
+  };
 
   const add = () => {
-    const v = draft.trim()
-    if (!v) return
-    onChange([...items, { value: v, enabled: true }])
-    setDraft('')
-    onPendingChange?.(false)
-  }
+    const v = draft.trim();
+    if (!v) return;
+    onChange([...items, { value: v, enabled: true }]);
+    setDraft('');
+    onPendingChange?.(false);
+  };
 
-  const remove = (i: number) => onChange(items.filter((_, idx) => idx !== i))
+  const remove = (i: number) => onChange(items.filter((_, idx) => idx !== i));
   const toggle = (i: number) =>
-    onChange(items.map((it, idx) => (idx === i ? { ...it, enabled: !it.enabled } : it)))
+    onChange(items.map((it, idx) => (idx === i ? { ...it, enabled: !it.enabled } : it)));
   const edit = (i: number, value: string) =>
-    onChange(items.map((it, idx) => (idx === i ? { ...it, value } : it)))
+    onChange(items.map((it, idx) => (idx === i ? { ...it, value } : it)));
 
   return (
     <div className="space-y-1.5">
@@ -104,5 +104,5 @@ export function ArgList({ items, onChange, onPendingChange, placeholder = '--arg
         </Button>
       </div>
     </div>
-  )
+  );
 }
diff --git a/src/renderer/components/common/Button.tsx b/src/renderer/components/common/Button.tsx
index dcec728..5307bdc 100644
--- a/src/renderer/components/common/Button.tsx
+++ b/src/renderer/components/common/Button.tsx
@@ -1,9 +1,9 @@
-import React from 'react'
+import React from 'react';
 
 interface Props extends React.ButtonHTMLAttributes<HTMLButtonElement> {
-  variant?: 'primary' | 'ghost' | 'danger'
-  size?: 'sm' | 'md'
-  loading?: boolean
+  variant?: 'primary' | 'ghost' | 'danger';
+  size?: 'sm' | 'md';
+  loading?: boolean;
 }
 
 export function Button({
@@ -16,14 +16,14 @@ export function Button({
   ...rest
 }: Props) {
   const base =
-    'inline-flex items-center justify-center gap-1.5 rounded-md border font-mono transition-colors focus:outline-none disabled:opacity-40 disabled:cursor-not-allowed'
-  const sizes = { sm: 'px-2.5 py-1 text-xs', md: 'px-3.5 py-1.5 text-sm' }
+    'inline-flex items-center justify-center gap-1.5 rounded-md border font-mono transition-colors focus:outline-none disabled:opacity-40 disabled:cursor-not-allowed';
+  const sizes = { sm: 'px-2.5 py-1 text-xs', md: 'px-3.5 py-1.5 text-sm' };
   const variants = {
     primary: 'bg-accent border-accent text-base-950 hover:brightness-110',
     ghost:
       'bg-transparent border-surface-border text-text-secondary hover:text-text-primary hover:border-text-muted',
     danger: 'bg-transparent border-red-500/30 text-red-400 hover:border-red-400 hover:text-red-300',
-  }
+  };
   return (
     <button
       disabled={disabled || loading}
@@ -32,5 +32,5 @@ export function Button({
     >
       {loading ? <span className="opacity-60">...</span> : children}
     </button>
-  )
+  );
 }
diff --git a/src/renderer/components/common/ContextMenu.tsx b/src/renderer/components/common/ContextMenu.tsx
index 50ae5b2..60f53a4 100644
--- a/src/renderer/components/common/ContextMenu.tsx
+++ b/src/renderer/components/common/ContextMenu.tsx
@@ -1,61 +1,61 @@
-import React, { useEffect, useRef } from 'react'
+import React, { useEffect, useRef } from 'react';
 
 export interface ContextMenuItem {
-  label?: string
-  icon?: React.ReactNode
-  danger?: boolean
-  disabled?: boolean
-  type?: 'separator'
-  onClick?: (e: React.MouseEvent) => void
+  label?: string;
+  icon?: React.ReactNode;
+  danger?: boolean;
+  disabled?: boolean;
+  type?: 'separator';
+  onClick?: (e: React.MouseEvent) => void;
 }
 
 interface Props {
-  x: number
-  y: number
-  items: ContextMenuItem[]
-  onClose: () => void
+  x: number;
+  y: number;
+  items: ContextMenuItem[];
+  onClose: () => void;
 }
 
 export function ContextMenu({ x, y, items, onClose }: Props) {
-  const ref = useRef<HTMLDivElement>(null)
+  const ref = useRef<HTMLDivElement>(null);
 
   useEffect(() => {
     const handleClick = (e: MouseEvent) => {
-      if (!ref.current) return
+      if (!ref.current) return;
 
       // only close if clicking OUTSIDE
       if (!ref.current.contains(e.target as Node)) {
-        onClose()
+        onClose();
       }
-    }
+    };
 
     const handleKey = (e: KeyboardEvent) => {
-      if (e.key === 'Escape') onClose()
-    }
+      if (e.key === 'Escape') onClose();
+    };
 
-    document.addEventListener('click', handleClick)
-    document.addEventListener('keydown', handleKey)
+    document.addEventListener('click', handleClick);
+    document.addEventListener('keydown', handleKey);
 
     return () => {
-      document.removeEventListener('click', handleClick)
-      document.removeEventListener('keydown', handleKey)
-    }
-  }, [onClose])
+      document.removeEventListener('click', handleClick);
+      document.removeEventListener('keydown', handleKey);
+    };
+  }, [onClose]);
 
-  const style: React.CSSProperties = { position: 'fixed', zIndex: 1000 }
+  const style: React.CSSProperties = { position: 'fixed', zIndex: 1000 };
 
-  if (x + 180 > window.innerWidth) style.right = window.innerWidth - x
-  else style.left = x
+  if (x + 180 > window.innerWidth) style.right = window.innerWidth - x;
+  else style.left = x;
 
-  if (y + items.length * 32 > window.innerHeight) style.bottom = window.innerHeight - y
-  else style.top = y
+  if (y + items.length * 32 > window.innerHeight) style.bottom = window.innerHeight - y;
+  else style.top = y;
 
   return (
     <div ref={ref} style={style}>
       <div className="bg-base-900 border border-surface-border rounded-lg shadow-2xl py-1 min-w-[175px] animate-fade-in">
         {items.map((item, i) => {
           if (item.type === 'separator') {
-            return <div key={i} className="my-1 border-t border-surface-border/60" />
+            return <div key={i} className="my-1 border-t border-surface-border/60" />;
           }
 
           return (
@@ -64,9 +64,9 @@ export function ContextMenu({ x, y, items, onClose }: Props) {
               disabled={item.disabled}
               onMouseDown={(e) => e.preventDefault()} // prevent focus jump
               onClick={(e) => {
-                if (item.disabled || !item.onClick) return
-                item.onClick(e)
-                onClose()
+                if (item.disabled || !item.onClick) return;
+                item.onClick(e);
+                onClose();
               }}
               className={[
                 'w-full flex items-center gap-2.5 px-3 py-1.5 text-xs text-left transition-colors',
@@ -80,9 +80,9 @@ export function ContextMenu({ x, y, items, onClose }: Props) {
               {item.icon && <span className="opacity-70 shrink-0">{item.icon}</span>}
               <span className="flex-1">{item.label}</span>
             </button>
-          )
+          );
         })}
       </div>
     </div>
-  )
+  );
 }
diff --git a/src/renderer/components/common/Dialog.tsx b/src/renderer/components/common/Dialog.tsx
index 26aee4e..fbffe54 100644
--- a/src/renderer/components/common/Dialog.tsx
+++ b/src/renderer/components/common/Dialog.tsx
@@ -1,15 +1,15 @@
-import React from 'react'
-import { Button } from './Button'
+import React from 'react';
+import { Button } from './Button';
 
 interface Props {
-  open: boolean
-  title: string
-  message: string
-  confirmLabel?: string
-  cancelLabel?: string
-  danger?: boolean
-  onConfirm: () => void
-  onCancel: () => void
+  open: boolean;
+  title: string;
+  message: string;
+  confirmLabel?: string;
+  cancelLabel?: string;
+  danger?: boolean;
+  onConfirm: () => void;
+  onCancel: () => void;
 }
 
 export function Dialog({
@@ -22,7 +22,7 @@ export function Dialog({
   onConfirm,
   onCancel,
 }: Props) {
-  if (!open) return null
+  if (!open) return null;
   return (
     <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/60 animate-fade-in">
       <div className="bg-base-900 border border-surface-border rounded-xl shadow-2xl w-full max-w-sm mx-4 p-5 space-y-4">
@@ -38,5 +38,5 @@ export function Dialog({
         </div>
       </div>
     </div>
-  )
+  );
 }
diff --git a/src/renderer/components/common/Input.tsx b/src/renderer/components/common/Input.tsx
index eef09e4..cafb17c 100644
--- a/src/renderer/components/common/Input.tsx
+++ b/src/renderer/components/common/Input.tsx
@@ -1,9 +1,9 @@
-import React from 'react'
+import React from 'react';
 
 interface Props extends React.InputHTMLAttributes<HTMLInputElement> {
-  label?: string
-  hint?: string
-  rightElement?: React.ReactNode
+  label?: string;
+  hint?: string;
+  rightElement?: React.ReactNode;
 }
 
 export function Input({ label, hint, rightElement, className = '', ...rest }: Props) {
@@ -26,5 +26,5 @@ export function Input({ label, hint, rightElement, className = '', ...rest }: Pr
       </div>
       {hint && <p className="text-xs text-text-muted/70">{hint}</p>}
     </div>
-  )
+  );
 }
diff --git a/src/renderer/components/common/Modal.tsx b/src/renderer/components/common/Modal.tsx
index b44560d..7477a1f 100644
--- a/src/renderer/components/common/Modal.tsx
+++ b/src/renderer/components/common/Modal.tsx
@@ -1,12 +1,12 @@
-import React, { useEffect, useRef } from 'react'
-import { VscClose } from 'react-icons/vsc'
+import React, { useEffect, useRef } from 'react';
+import { VscClose } from 'react-icons/vsc';
 
 interface Props {
-  open: boolean
-  title: string
-  onClose: () => void
-  width?: 'sm' | 'md' | 'lg' | 'xl'
-  children: React.ReactNode
+  open: boolean;
+  title: string;
+  onClose: () => void;
+  width?: 'sm' | 'md' | 'lg' | 'xl';
+  children: React.ReactNode;
 }
 
 const WIDTHS = {
@@ -14,27 +14,27 @@ const WIDTHS = {
   md: 'max-w-md',
   lg: 'max-w-lg',
   xl: 'max-w-2xl',
-}
+};
 
 export function Modal({ open, title, onClose, width = 'md', children }: Props) {
-  const ref = useRef<HTMLDivElement>(null)
+  const ref = useRef<HTMLDivElement>(null);
 
   useEffect(() => {
-    if (!open) return
+    if (!open) return;
     const handler = (e: KeyboardEvent) => {
-      if (e.key === 'Escape') onClose()
-    }
-    window.addEventListener('keydown', handler)
-    return () => window.removeEventListener('keydown', handler)
-  }, [open, onClose])
+      if (e.key === 'Escape') onClose();
+    };
+    window.addEventListener('keydown', handler);
+    return () => window.removeEventListener('keydown', handler);
+  }, [open, onClose]);
 
-  if (!open) return null
+  if (!open) return null;
 
   return (
     <div
       className="fixed inset-0 z-50 flex items-center justify-center bg-black/70 animate-fade-in px-4"
       onMouseDown={(e) => {
-        if (e.target === e.currentTarget) onClose()
+        if (e.target === e.currentTarget) onClose();
       }}
     >
       <div
@@ -59,5 +59,5 @@ export function Modal({ open, title, onClose, width = 'md', children }: Props) {
         <div className="flex-1 overflow-y-auto">{children}</div>
       </div>
     </div>
-  )
+  );
 }
diff --git a/src/renderer/components/common/PropList.tsx b/src/renderer/components/common/PropList.tsx
index 3c4d901..474b0ff 100644
--- a/src/renderer/components/common/PropList.tsx
+++ b/src/renderer/components/common/PropList.tsx
@@ -1,48 +1,48 @@
-import React, { useState } from 'react'
-import { Button } from './Button'
+import React, { useState } from 'react';
+import { Button } from './Button';
 
 export interface PropItem {
-  key: string
-  value: string
-  enabled: boolean
+  key: string;
+  value: string;
+  enabled: boolean;
 }
 
 interface Props {
-  items: PropItem[]
-  onChange: (items: PropItem[]) => void
-  onPendingChange?: (hasPending: boolean) => void
+  items: PropItem[];
+  onChange: (items: PropItem[]) => void;
+  onPendingChange?: (hasPending: boolean) => void;
 }
 
 export function PropList({ items, onChange, onPendingChange }: Props) {
-  const [draftKey, setDraftKey] = useState('')
-  const [draftValue, setDraftValue] = useState('')
+  const [draftKey, setDraftKey] = useState('');
+  const [draftValue, setDraftValue] = useState('');
 
   const notify = (k: string, v: string) =>
-    onPendingChange?.(k.trim().length > 0 || v.trim().length > 0)
+    onPendingChange?.(k.trim().length > 0 || v.trim().length > 0);
   const setKey = (v: string) => {
-    setDraftKey(v)
-    notify(v, draftValue)
-  }
+    setDraftKey(v);
+    notify(v, draftValue);
+  };
   const setVal = (v: string) => {
-    setDraftValue(v)
-    notify(draftKey, v)
-  }
+    setDraftValue(v);
+    notify(draftKey, v);
+  };
 
   const add = () => {
-    if (!draftKey.trim()) return
-    onChange([...items, { key: draftKey.trim(), value: draftValue.trim(), enabled: true }])
-    setDraftKey('')
-    setDraftValue('')
-    onPendingChange?.(false)
-  }
+    if (!draftKey.trim()) return;
+    onChange([...items, { key: draftKey.trim(), value: draftValue.trim(), enabled: true }]);
+    setDraftKey('');
+    setDraftValue('');
+    onPendingChange?.(false);
+  };
 
-  const remove = (i: number) => onChange(items.filter((_, idx) => idx !== i))
+  const remove = (i: number) => onChange(items.filter((_, idx) => idx !== i));
   const toggle = (i: number) =>
-    onChange(items.map((it, idx) => (idx === i ? { ...it, enabled: !it.enabled } : it)))
+    onChange(items.map((it, idx) => (idx === i ? { ...it, enabled: !it.enabled } : it)));
   const editKey = (i: number, key: string) =>
-    onChange(items.map((it, idx) => (idx === i ? { ...it, key } : it)))
+    onChange(items.map((it, idx) => (idx === i ? { ...it, key } : it)));
   const editValue = (i: number, value: string) =>
-    onChange(items.map((it, idx) => (idx === i ? { ...it, value } : it)))
+    onChange(items.map((it, idx) => (idx === i ? { ...it, value } : it)));
 
   return (
     <div className="space-y-1.5">
@@ -146,5 +146,5 @@ export function PropList({ items, onChange, onPendingChange }: Props) {
         </Button>
       </div>
     </div>
-  )
+  );
 }
diff --git a/src/renderer/components/common/TitleBar.tsx b/src/renderer/components/common/TitleBar.tsx
index a68ff7a..7168620 100644
--- a/src/renderer/components/common/TitleBar.tsx
+++ b/src/renderer/components/common/TitleBar.tsx
@@ -1,10 +1,10 @@
-import React from 'react'
-import { useApp } from '../../store/AppStore'
-import { VscChromeMinimize, VscChromeClose } from 'react-icons/vsc'
+import React from 'react';
+import { useApp } from '../../store/AppStore';
+import { VscChromeMinimize, VscChromeClose } from 'react-icons/vsc';
 
 export function TitleBar() {
-  const { state } = useApp()
-  const runningCount = state.processStates.filter((s) => s.running).length
+  const { state } = useApp();
+  const runningCount = state.processStates.filter((s) => s.running).length;
 
   return (
     <div
@@ -73,5 +73,5 @@ export function TitleBar() {
         </button>
       </div>
     </div>
-  )
+  );
 }
diff --git a/src/renderer/components/common/Toggle.tsx b/src/renderer/components/common/Toggle.tsx
index 463f731..ed22c64 100644
--- a/src/renderer/components/common/Toggle.tsx
+++ b/src/renderer/components/common/Toggle.tsx
@@ -1,9 +1,9 @@
-import React from 'react'
+import React from 'react';
 
 interface Props {
-  checked: boolean
-  onChange: (v: boolean) => void
-  disabled?: boolean
+  checked: boolean;
+  onChange: (v: boolean) => void;
+  disabled?: boolean;
 }
 
 export function Toggle({ checked, onChange, disabled }: Props) {
@@ -25,5 +25,5 @@ export function Toggle({ checked, onChange, disabled }: Props) {
         ].join(' ')}
       />
     </button>
-  )
+  );
 }
diff --git a/src/renderer/components/common/Tooltip.tsx b/src/renderer/components/common/Tooltip.tsx
index a44a2c0..1eacc2c 100644
--- a/src/renderer/components/common/Tooltip.tsx
+++ b/src/renderer/components/common/Tooltip.tsx
@@ -1,99 +1,99 @@
-import React, { useState, useRef, useEffect } from 'react'
+import React, { useState, useRef, useEffect } from 'react';
 
 interface Props {
-  content: React.ReactNode
-  children: React.ReactElement
-  delay?: number
-  side?: 'top' | 'bottom' | 'left' | 'right'
+  content: React.ReactNode;
+  children: React.ReactElement;
+  delay?: number;
+  side?: 'top' | 'bottom' | 'left' | 'right';
 }
 
 export function Tooltip({ content, children, delay = 400, side = 'top' }: Props) {
-  const [visible, setVisible] = useState(false)
-  const [pos, setPos] = useState({ x: 0, y: 0 })
-  const timerRef = useRef<ReturnType<typeof setTimeout> | null>(null)
-  const targetRef = useRef<HTMLElement | null>(null)
-  const tipRef = useRef<HTMLDivElement>(null)
+  const [visible, setVisible] = useState(false);
+  const [pos, setPos] = useState({ x: 0, y: 0 });
+  const timerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
+  const targetRef = useRef<HTMLElement | null>(null);
+  const tipRef = useRef<HTMLDivElement>(null);
 
   const show = (e: React.MouseEvent<HTMLElement>) => {
-    const rect = (e.currentTarget as HTMLElement).getBoundingClientRect()
-    targetRef.current = e.currentTarget as HTMLElement
+    const rect = (e.currentTarget as HTMLElement).getBoundingClientRect();
+    targetRef.current = e.currentTarget as HTMLElement;
     timerRef.current = setTimeout(() => {
-      const tip = tipRef.current
-      const tw = tip?.offsetWidth ?? 0
-      const th = tip?.offsetHeight ?? 0
-      let x = 0
-      let y = 0
+      const tip = tipRef.current;
+      const tw = tip?.offsetWidth ?? 0;
+      const th = tip?.offsetHeight ?? 0;
+      let x = 0;
+      let y = 0;
       if (side === 'top') {
-        x = rect.left + rect.width / 2 - tw / 2
-        y = rect.top - th - 6
+        x = rect.left + rect.width / 2 - tw / 2;
+        y = rect.top - th - 6;
       }
       if (side === 'bottom') {
-        x = rect.left + rect.width / 2 - tw / 2
-        y = rect.bottom + 6
+        x = rect.left + rect.width / 2 - tw / 2;
+        y = rect.bottom + 6;
       }
       if (side === 'left') {
-        x = rect.left - tw - 6
-        y = rect.top + rect.height / 2 - th / 2
+        x = rect.left - tw - 6;
+        y = rect.top + rect.height / 2 - th / 2;
       }
       if (side === 'right') {
-        x = rect.right + 6
-        y = rect.top + rect.height / 2 - th / 2
+        x = rect.right + 6;
+        y = rect.top + rect.height / 2 - th / 2;
       }
       // Clamp to viewport
-      x = Math.max(6, Math.min(window.innerWidth - tw - 6, x))
-      y = Math.max(6, Math.min(window.innerHeight - th - 6, y))
-      setPos({ x, y })
-      setVisible(true)
-    }, delay)
-  }
+      x = Math.max(6, Math.min(window.innerWidth - tw - 6, x));
+      y = Math.max(6, Math.min(window.innerHeight - th - 6, y));
+      setPos({ x, y });
+      setVisible(true);
+    }, delay);
+  };
 
   const hide = () => {
-    if (timerRef.current) clearTimeout(timerRef.current)
-    setVisible(false)
-  }
+    if (timerRef.current) clearTimeout(timerRef.current);
+    setVisible(false);
+  };
 
   useEffect(
     () => () => {
-      if (timerRef.current) clearTimeout(timerRef.current)
+      if (timerRef.current) clearTimeout(timerRef.current);
     },
     []
-  )
+  );
 
   // Recalculate position when tip dimensions are known
   useEffect(() => {
-    if (!visible || !targetRef.current) return
-    const rect = targetRef.current.getBoundingClientRect()
-    const tip = tipRef.current
-    if (!tip) return
-    const tw = tip.offsetWidth
-    const th = tip.offsetHeight
-    let x = 0
-    let y = 0
+    if (!visible || !targetRef.current) return;
+    const rect = targetRef.current.getBoundingClientRect();
+    const tip = tipRef.current;
+    if (!tip) return;
+    const tw = tip.offsetWidth;
+    const th = tip.offsetHeight;
+    let x = 0;
+    let y = 0;
     if (side === 'top') {
-      x = rect.left + rect.width / 2 - tw / 2
-      y = rect.top - th - 6
+      x = rect.left + rect.width / 2 - tw / 2;
+      y = rect.top - th - 6;
     }
     if (side === 'bottom') {
-      x = rect.left + rect.width / 2 - tw / 2
-      y = rect.bottom + 6
+      x = rect.left + rect.width / 2 - tw / 2;
+      y = rect.bottom + 6;
     }
     if (side === 'left') {
-      x = rect.left - tw - 6
-      y = rect.top + rect.height / 2 - th / 2
+      x = rect.left - tw - 6;
+      y = rect.top + rect.height / 2 - th / 2;
     }
     if (side === 'right') {
-      x = rect.right + 6
-      y = rect.top + rect.height / 2 - th / 2
+      x = rect.right + 6;
+      y = rect.top + rect.height / 2 - th / 2;
     }
-    x = Math.max(6, Math.min(window.innerWidth - tw - 6, x))
-    y = Math.max(6, Math.min(window.innerHeight - th - 6, y))
-    setPos({ x, y })
-  }, [visible, side])
+    x = Math.max(6, Math.min(window.innerWidth - tw - 6, x));
+    y = Math.max(6, Math.min(window.innerHeight - th - 6, y));
+    setPos({ x, y });
+  }, [visible, side]);
 
   const child = React.cloneElement(children, {
     onMouseEnter: show,
     onMouseLeave: hide,
-  })
+  });
 
   return (
     <>
@@ -110,5 +110,5 @@ export function Tooltip({ content, children, delay = 400, side = 'top' }: Props)
         {content}
       </div>
     </>
-  )
+  );
 }
diff --git a/src/renderer/components/console/ConsoleTab.tsx b/src/renderer/components/console/ConsoleTab.tsx
index 8841968..a7faded 100644
--- a/src/renderer/components/console/ConsoleTab.tsx
+++ b/src/renderer/components/console/ConsoleTab.tsx
@@ -1,185 +1,182 @@
-/**
- * ConsoleTab — live output, stdin, history, Ctrl+L clear, Ctrl+F search.
- */
-import React, { useRef, useEffect, useState, useCallback, useMemo, KeyboardEvent } from 'react'
-import { useApp } from '../../store/AppStore'
-import { Button } from '../common/Button'
-import { VscSearch, VscChevronUp, VscChevronDown, VscClose } from 'react-icons/vsc'
-import type { ConsoleLine } from '../../types'
+import React, { useRef, useEffect, useState, useCallback, useMemo, KeyboardEvent } from 'react';
+import { useApp } from '../../store/AppStore';
+import { Button } from '../common/Button';
+import { VscSearch, VscChevronUp, VscChevronDown, VscClose } from 'react-icons/vsc';
+import { ConsoleLine } from '../../../main/shared/types/Process.types';
 
 export function ConsoleTab() {
   const { state, activeProfile, startProcess, stopProcess, sendInput, clearConsole, isRunning } =
-    useApp()
-
-  const profileId = activeProfile?.id ?? ''
-  const running = isRunning(profileId)
-  const lines = state.consoleLogs[profileId] ?? []
-  const settings = state.settings
-  const color = activeProfile?.color ?? '#4ade80'
-  const processState = state.processStates.find((s) => s.profileId === profileId)
-  const pid = processState?.pid
-
-  const [inputValue, setInputValue] = useState('')
-  const [historyIdx, setHistoryIdx] = useState(-1)
-  const [cmdHistory, setCmdHistory] = useState<string[]>([])
-  const [autoScroll, setAutoScroll] = useState(true)
-  const [starting, setStarting] = useState(false)
-  const [errorMsg, setErrorMsg] = useState<string | null>(null)
-  const [searchOpen, setSearchOpen] = useState(false)
-  const [searchQuery, setSearchQuery] = useState('')
-  const [searchIdx, setSearchIdx] = useState(0)
-
-  const scrollRef = useRef<HTMLDivElement>(null)
-  const inputRef = useRef<HTMLInputElement>(null)
-  const searchRef = useRef<HTMLInputElement>(null)
-  const bottomRef = useRef<HTMLDivElement>(null)
-  const matchRefs = useRef<(HTMLDivElement | null)[]>([])
+    useApp();
+
+  const profileId = activeProfile?.id ?? '';
+  const running = isRunning(profileId);
+  const lines = state.consoleLogs[profileId] ?? [];
+  const settings = state.settings;
+  const color = activeProfile?.color ?? '#4ade80';
+  const processState = state.processStates.find((s) => s.profileId === profileId);
+  const pid = processState?.pid;
+
+  const [inputValue, setInputValue] = useState('');
+  const [historyIdx, setHistoryIdx] = useState(-1);
+  const [cmdHistory, setCmdHistory] = useState<string[]>([]);
+  const [autoScroll, setAutoScroll] = useState(true);
+  const [starting, setStarting] = useState(false);
+  const [errorMsg, setErrorMsg] = useState<string | null>(null);
+  const [searchOpen, setSearchOpen] = useState(false);
+  const [searchQuery, setSearchQuery] = useState('');
+  const [searchIdx, setSearchIdx] = useState(0);
+
+  const scrollRef = useRef<HTMLDivElement>(null);
+  const inputRef = useRef<HTMLInputElement>(null);
+  const searchRef = useRef<HTMLInputElement>(null);
+  const bottomRef = useRef<HTMLDivElement>(null);
+  const matchRefs = useRef<(HTMLDivElement | null)[]>([]);
 
   useEffect(() => {
-    setInputValue('')
-    setHistoryIdx(-1)
-    setErrorMsg(null)
-    setSearchOpen(false)
-    setSearchQuery('')
-    setSearchIdx(0)
-  }, [profileId])
+    setInputValue('');
+    setHistoryIdx(-1);
+    setErrorMsg(null);
+    setSearchOpen(false);
+    setSearchQuery('');
+    setSearchIdx(0);
+  }, [profileId]);
 
   useEffect(() => {
-    if (autoScroll && !searchOpen) bottomRef.current?.scrollIntoView({ behavior: 'instant' })
-  }, [lines.length, autoScroll, searchOpen])
+    if (autoScroll && !searchOpen) bottomRef.current?.scrollIntoView({ behavior: 'instant' });
+  }, [lines.length, autoScroll, searchOpen]);
 
   const handleScroll = useCallback(() => {
-    const el = scrollRef.current
-    if (!el) return
-    setAutoScroll(el.scrollHeight - el.scrollTop - el.clientHeight < 40)
-  }, [])
+    const el = scrollRef.current;
+    if (!el) return;
+    setAutoScroll(el.scrollHeight - el.scrollTop - el.clientHeight < 40);
+  }, []);
 
-  const searchTerm = searchQuery.trim().toLowerCase()
+  const searchTerm = searchQuery.trim().toLowerCase();
 
   const matchIndices = useMemo<number[]>(() => {
-    if (!searchTerm) return []
+    if (!searchTerm) return [];
     return lines.reduce<number[]>((acc, line, i) => {
-      if (line.text.toLowerCase().includes(searchTerm)) acc.push(i)
-      return acc
-    }, [])
-  }, [lines, searchTerm])
+      if (line.text.toLowerCase().includes(searchTerm)) acc.push(i);
+      return acc;
+    }, []);
+  }, [lines, searchTerm]);
 
   const clampedIdx =
     matchIndices.length > 0
       ? ((searchIdx % matchIndices.length) + matchIndices.length) % matchIndices.length
-      : 0
+      : 0;
 
   const scrollToMatch = useCallback((idx: number) => {
-    const el = matchRefs.current[idx]
-    if (el) el.scrollIntoView({ behavior: 'smooth', block: 'center' })
-  }, [])
+    const el = matchRefs.current[idx];
+    if (el) el.scrollIntoView({ behavior: 'smooth', block: 'center' });
+  }, []);
 
   useEffect(() => {
-    if (matchIndices.length > 0) scrollToMatch(clampedIdx)
-  }, [clampedIdx, matchIndices, scrollToMatch])
+    if (matchIndices.length > 0) scrollToMatch(clampedIdx);
+  }, [clampedIdx, matchIndices, scrollToMatch]);
 
   const openSearch = useCallback(() => {
-    setSearchOpen(true)
-    setAutoScroll(false)
-    setTimeout(() => searchRef.current?.focus(), 50)
-  }, [])
+    setSearchOpen(true);
+    setAutoScroll(false);
+    setTimeout(() => searchRef.current?.focus(), 50);
+  }, []);
 
   const closeSearch = useCallback(() => {
-    setSearchOpen(false)
-    setSearchQuery('')
-    setSearchIdx(0)
-    setAutoScroll(true)
-  }, [])
+    setSearchOpen(false);
+    setSearchQuery('');
+    setSearchIdx(0);
+    setAutoScroll(true);
+  }, []);
 
-  const goNext = useCallback(() => setSearchIdx((i) => i + 1), [])
-  const goPrev = useCallback(() => setSearchIdx((i) => i - 1), [])
+  const goNext = useCallback(() => setSearchIdx((i) => i + 1), []);
+  const goPrev = useCallback(() => setSearchIdx((i) => i - 1), []);
 
   const handleToggle = useCallback(async () => {
-    if (!activeProfile) return
-    setErrorMsg(null)
+    if (!activeProfile) return;
+    setErrorMsg(null);
     if (running) {
-      await stopProcess(profileId)
+      await stopProcess(profileId);
     } else {
       if (!activeProfile.jarPath) {
-        setErrorMsg('No JAR file selected. Go to Configure to set one.')
-        return
+        setErrorMsg('No JAR file selected. Go to Configure to set one.');
+        return;
       }
-      setStarting(true)
-      const res = await startProcess(activeProfile)
-      setStarting(false)
-      if (!res.ok) setErrorMsg(res.error ?? 'Failed to start')
+      setStarting(true);
+      const res = await startProcess(activeProfile);
+      setStarting(false);
+      if (!res.ok) setErrorMsg(res.error ?? 'Failed to start');
     }
-  }, [activeProfile, running, profileId, stopProcess, startProcess])
+  }, [activeProfile, running, profileId, stopProcess, startProcess]);
 
   const handleSend = useCallback(async () => {
-    const cmd = inputValue.trim()
-    if (!cmd || !running) return
-    await sendInput(profileId, cmd)
+    const cmd = inputValue.trim();
+    if (!cmd || !running) return;
+    await sendInput(profileId, cmd);
     setCmdHistory((prev) =>
       [cmd, ...prev.filter((c) => c !== cmd)].slice(0, settings?.consoleHistorySize ?? 200)
-    )
-    setInputValue('')
-    setHistoryIdx(-1)
-  }, [inputValue, running, profileId, sendInput, settings])
+    );
+    setInputValue('');
+    setHistoryIdx(-1);
+  }, [inputValue, running, profileId, sendInput, settings]);
 
   const handleKeyDown = useCallback(
     (e: KeyboardEvent<HTMLInputElement>) => {
       if (e.key === 'Enter') {
-        e.preventDefault()
-        handleSend()
-        return
+        e.preventDefault();
+        handleSend();
+        return;
       }
       if (e.key === 'ArrowUp') {
-        e.preventDefault()
-        const n = Math.min(historyIdx + 1, cmdHistory.length - 1)
-        setHistoryIdx(n)
-        setInputValue(cmdHistory[n] ?? '')
-        return
+        e.preventDefault();
+        const n = Math.min(historyIdx + 1, cmdHistory.length - 1);
+        setHistoryIdx(n);
+        setInputValue(cmdHistory[n] ?? '');
+        return;
       }
       if (e.key === 'ArrowDown') {
-        e.preventDefault()
-        const n = Math.max(historyIdx - 1, -1)
-        setHistoryIdx(n)
-        setInputValue(n === -1 ? '' : (cmdHistory[n] ?? ''))
-        return
+        e.preventDefault();
+        const n = Math.max(historyIdx - 1, -1);
+        setHistoryIdx(n);
+        setInputValue(n === -1 ? '' : (cmdHistory[n] ?? ''));
+        return;
       }
       if (e.key === 'l' && e.ctrlKey) {
-        e.preventDefault()
-        clearConsole(profileId)
+        e.preventDefault();
+        clearConsole(profileId);
       }
       if (e.key === 'f' && e.ctrlKey) {
-        e.preventDefault()
-        openSearch()
+        e.preventDefault();
+        openSearch();
       }
     },
     [handleSend, historyIdx, cmdHistory, clearConsole, profileId, openSearch]
-  )
+  );
 
   useEffect(() => {
     const handler = (e: globalThis.KeyboardEvent) => {
       if (e.ctrlKey && e.key === 'f') {
-        e.preventDefault()
-        openSearch()
+        e.preventDefault();
+        openSearch();
       }
-      if (e.key === 'Escape' && searchOpen) closeSearch()
-    }
-    window.addEventListener('keydown', handler)
-    return () => window.removeEventListener('keydown', handler)
-  }, [openSearch, closeSearch, searchOpen])
+      if (e.key === 'Escape' && searchOpen) closeSearch();
+    };
+    window.addEventListener('keydown', handler);
+    return () => window.removeEventListener('keydown', handler);
+  }, [openSearch, closeSearch, searchOpen]);
 
-  const fontSize = settings?.consoleFontSize ?? 13
-  const wordWrap = settings?.consoleWordWrap ?? false
-  const lineNums = settings?.consoleLineNumbers ?? false
+  const fontSize = settings?.consoleFontSize ?? 13;
+  const wordWrap = settings?.consoleWordWrap ?? false;
+  const lineNums = settings?.consoleLineNumbers ?? false;
 
   if (!activeProfile) {
     return (
       <div className="flex items-center justify-center h-full text-sm text-text-muted">
         No profile selected
       </div>
-    )
+    );
   }
 
-  matchRefs.current = new Array(matchIndices.length).fill(null)
+  matchRefs.current = new Array(matchIndices.length).fill(null);
 
   return (
     <div className="flex flex-col h-full">
@@ -209,8 +206,8 @@ export function ConsoleTab() {
         {!autoScroll && !searchOpen && (
           <button
             onClick={() => {
-              setAutoScroll(true)
-              bottomRef.current?.scrollIntoView({ behavior: 'smooth' })
+              setAutoScroll(true);
+              bottomRef.current?.scrollIntoView({ behavior: 'smooth' });
             }}
             className="text-xs font-mono transition-colors"
             style={{ color }}
@@ -247,15 +244,15 @@ export function ConsoleTab() {
             type="text"
             value={searchQuery}
             onChange={(e) => {
-              setSearchQuery(e.target.value)
-              setSearchIdx(0)
+              setSearchQuery(e.target.value);
+              setSearchIdx(0);
             }}
             onKeyDown={(e) => {
               if (e.key === 'Enter') {
-                e.preventDefault()
-                e.shiftKey ? goPrev() : goNext()
+                e.preventDefault();
+                e.shiftKey ? goPrev() : goNext();
               }
-              if (e.key === 'Escape') closeSearch()
+              if (e.key === 'Escape') closeSearch();
             }}
             placeholder="Search console... (Enter next, Shift+Enter prev)"
             className="flex-1 bg-base-950 border border-surface-border rounded px-2.5 py-1
@@ -317,9 +314,9 @@ export function ConsoleTab() {
             </div>
           )}
           {lines.map((line, i) => {
-            const matchPos = matchIndices.indexOf(i)
-            const isCurrentMatch = matchPos === clampedIdx && matchPos !== -1
-            const isAnyMatch = matchPos !== -1
+            const matchPos = matchIndices.indexOf(i);
+            const isCurrentMatch = matchPos === clampedIdx && matchPos !== -1;
+            const isAnyMatch = matchPos !== -1;
 
             return (
               <ConsoleLineRow
@@ -334,12 +331,12 @@ export function ConsoleTab() {
                 ref={
                   matchPos !== -1
                     ? (el: HTMLDivElement | null) => {
-                        matchRefs.current[matchPos] = el
+                        matchRefs.current[matchPos] = el;
                       }
                     : undefined
                 }
               />
-            )
+            );
           })}
           <div ref={bottomRef} />
         </div>
@@ -364,7 +361,7 @@ export function ConsoleTab() {
         />
       </div>
     </div>
-  )
+  );
 }
 
 const LINE_COLORS: Record<ConsoleLine['type'], string> = {
@@ -372,24 +369,24 @@ const LINE_COLORS: Record<ConsoleLine['type'], string> = {
   stderr: 'text-console-error',
   input: 'text-console-input',
   system: 'text-text-muted',
-}
+};
 
 const ConsoleLineRow = React.forwardRef<
   HTMLDivElement,
   {
-    line: ConsoleLine
-    lineNum: number
-    showLineNum: boolean
-    wordWrap: boolean
-    searchTerm: string
-    isCurrentMatch: boolean
-    isAnyMatch: boolean
+    line: ConsoleLine;
+    lineNum: number;
+    showLineNum: boolean;
+    wordWrap: boolean;
+    searchTerm: string;
+    isCurrentMatch: boolean;
+    isAnyMatch: boolean;
   }
 >(({ line, lineNum, showLineNum, wordWrap, searchTerm, isCurrentMatch, isAnyMatch }, ref) => {
-  const text = line.text || ' '
+  const text = line.text || ' ';
 
   const content =
-    searchTerm && isAnyMatch ? renderHighlighted(text, searchTerm, isCurrentMatch) : text
+    searchTerm && isAnyMatch ? renderHighlighted(text, searchTerm, isCurrentMatch) : text;
 
   return (
     <div
@@ -418,19 +415,19 @@ const ConsoleLineRow = React.forwardRef<
         {content}
       </span>
     </div>
-  )
-})
-ConsoleLineRow.displayName = 'ConsoleLineRow'
+  );
+});
+ConsoleLineRow.displayName = 'ConsoleLineRow';
 
 function renderHighlighted(text: string, term: string, isCurrent: boolean): React.ReactNode {
-  const parts: React.ReactNode[] = []
-  const lower = text.toLowerCase()
-  let last = 0
-  let idx = lower.indexOf(term)
-  let key = 0
+  const parts: React.ReactNode[] = [];
+  const lower = text.toLowerCase();
+  let last = 0;
+  let idx = lower.indexOf(term);
+  let key = 0;
 
   while (idx !== -1) {
-    if (idx > last) parts.push(text.slice(last, idx))
+    if (idx > last) parts.push(text.slice(last, idx));
     parts.push(
       <mark
         key={key++}
@@ -442,10 +439,10 @@ function renderHighlighted(text: string, term: string, isCurrent: boolean): Reac
       >
         {text.slice(idx, idx + term.length)}
       </mark>
-    )
-    last = idx + term.length
-    idx = lower.indexOf(term, last)
+    );
+    last = idx + term.length;
+    idx = lower.indexOf(term, last);
   }
-  if (last < text.length) parts.push(text.slice(last))
-  return parts
+  if (last < text.length) parts.push(text.slice(last));
+  return parts;
 }
diff --git a/src/renderer/components/developer/DevApiExplorer.tsx b/src/renderer/components/developer/DevApiExplorer.tsx
new file mode 100644
index 0000000..e00cdd6
--- /dev/null
+++ b/src/renderer/components/developer/DevApiExplorer.tsx
@@ -0,0 +1,438 @@
+import { useState, useCallback } from 'react';
+import { VscCheck, VscCopy, VscPlay, VscEdit, VscCode } from 'react-icons/vsc';
+import { routeConfig, RouteDefinition } from '../../../main/shared/config/API.config';
+import { useApp } from '../../store/AppStore';
+import { Button } from '../common/Button';
+import { REST_API_CONFIG } from '../../../main/shared/config/API.config';
+import { ContextMenu, ContextMenuItem } from '../common/ContextMenu';
+
+const METHOD_COLORS: Record<string, string> = {
+  GET: 'text-accent border-accent/30 bg-accent/10',
+  POST: 'text-blue-400 border-blue-400/30 bg-blue-400/10',
+  PUT: 'text-yellow-400 border-yellow-400/30 bg-yellow-400/10',
+  DELETE: 'text-red-400 border-red-400/30 bg-red-400/10',
+};
+
+// ─── JSON Syntax Highlighter ────────────────────────────────────────────────
+
+type Token =
+  | { type: 'key'; value: string }
+  | { type: 'string'; value: string }
+  | { type: 'number'; value: string }
+  | { type: 'boolean'; value: string }
+  | { type: 'null'; value: string }
+  | { type: 'punct'; value: string }
+  | { type: 'plain'; value: string };
+
+function tokenizeJson(text: string): Token[] {
+  const tokens: Token[] = [];
+  let i = 0;
+
+  while (i < text.length) {
+    const ws = text.slice(i).match(/^[\s,:\[\]{}]+/);
+    if (ws) {
+      const chunk = ws[0];
+      for (const ch of chunk) {
+        if ('{}[],:'.includes(ch)) tokens.push({ type: 'punct', value: ch });
+        else tokens.push({ type: 'plain', value: ch });
+      }
+      i += chunk.length;
+      continue;
+    }
+
+    if (text[i] === '"') {
+      let j = i + 1;
+      while (j < text.length) {
+        if (text[j] === '\\') {
+          j += 2;
+          continue;
+        }
+        if (text[j] === '"') {
+          j++;
+          break;
+        }
+        j++;
+      }
+      const raw = text.slice(i, j);
+      const afterStr = text.slice(j).match(/^\s*:/);
+      tokens.push({ type: afterStr ? 'key' : 'string', value: raw });
+      i = j;
+      continue;
+    }
+
+    const num = text.slice(i).match(/^-?\d+(\.\d+)?([eE][+-]?\d+)?/);
+    if (num) {
+      tokens.push({ type: 'number', value: num[0] });
+      i += num[0].length;
+      continue;
+    }
+
+    const keyword = text.slice(i).match(/^(true|false|null)/);
+    if (keyword) {
+      tokens.push({ type: keyword[0] === 'null' ? 'null' : 'boolean', value: keyword[0] });
+      i += keyword[0].length;
+      continue;
+    }
+
+    tokens.push({ type: 'plain', value: text[i] });
+    i++;
+  }
+
+  return tokens;
+}
+
+const TOKEN_CLASS: Record<Token['type'], string> = {
+  key: 'text-blue-300',
+  string: 'text-emerald-400',
+  number: 'text-amber-400',
+  boolean: 'text-purple-400',
+  null: 'text-red-400/80',
+  punct: 'text-text-muted',
+  plain: 'text-text-secondary',
+};
+
+function JsonHighlight({ text }: { text: string }) {
+  let isJson = false;
+  try {
+    JSON.parse(text);
+    isJson = true;
+  } catch {
+    /* not JSON */
+  }
+
+  if (!isJson) return <span className="text-text-secondary">{text}</span>;
+
+  const tokens = tokenizeJson(text);
+  return (
+    <>
+      {tokens.map((tok, idx) => (
+        <span key={idx} className={TOKEN_CLASS[tok.type]}>
+          {tok.value}
+        </span>
+      ))}
+    </>
+  );
+}
+
+// ─── Component ───────────────────────────────────────────────────────────────
+
+export function DevApiExplorer() {
+  const { state } = useApp();
+
+  const [selected, setSelected] = useState<RouteDefinition | null>(null);
+  const [pathParams, setPathParams] = useState<Record<string, string>>({});
+  const [body, setBody] = useState('');
+  const [response, setResponse] = useState<string | null>(null);
+  const [loading, setLoading] = useState(false);
+
+  const [urlCopied, setUrlCopied] = useState(false);
+  const [responseCopied, setResponseCopied] = useState(false);
+  const [isEditing, setIsEditing] = useState(false);
+
+  const [ctxMenu, setCtxMenu] = useState<{
+    x: number;
+    y: number;
+    items: ContextMenuItem[];
+  } | null>(null);
+
+  const port = state.settings?.restApiPort ?? 4444;
+  const restEnabled = state.settings?.restApiEnabled ?? false;
+
+  // ── Helpers ──────────────────────────────────────────────────────────────
+
+  const handleContextMenu = useCallback(
+    (e: React.MouseEvent, extraItems: ContextMenuItem[] = []) => {
+      const selection = window.getSelection()?.toString() ?? '';
+
+      const items: ContextMenuItem[] = [
+        {
+          label: 'Copy',
+          icon: <VscCopy size={12} />,
+          disabled: !selection,
+          onClick: () => navigator.clipboard.writeText(selection),
+        },
+        ...extraItems,
+      ];
+
+      e.preventDefault();
+      setCtxMenu({ x: e.clientX, y: e.clientY, items });
+    },
+    []
+  );
+
+  const handleSelect = (route: RouteDefinition) => {
+    setSelected(route);
+    setResponse(null);
+    setIsEditing(false);
+    setBody(route.bodyTemplate ?? '');
+
+    const params: Record<string, string> = {};
+    const matches = route.path.matchAll(/:([a-zA-Z]+)/g);
+    for (const m of matches) params[m[1]] = '';
+    setPathParams(params);
+  };
+
+  const buildUrl = () => {
+    if (!selected) return '';
+    let path = selected.path;
+    for (const [k, v] of Object.entries(pathParams)) {
+      path = path.replace(`:${k}`, v || `:${k}`);
+    }
+    return `http://${REST_API_CONFIG.host}:${port}${path}`;
+  };
+
+  const handleCall = async () => {
+    if (!selected) return;
+    setLoading(true);
+    setResponse(null);
+    setIsEditing(false);
+
+    try {
+      const url = buildUrl();
+      const opts: RequestInit = { method: selected.method };
+
+      if (body.trim() && ['POST', 'PUT', 'PATCH'].includes(selected.method)) {
+        opts.headers = { 'Content-Type': 'application/json' };
+        opts.body = body;
+      }
+
+      const res = await fetch(url, opts);
+      const text = await res.text();
+
+      try {
+        setResponse(JSON.stringify(JSON.parse(text), null, 2));
+      } catch {
+        setResponse(text);
+      }
+    } catch (err) {
+      setResponse(`Error: ${err instanceof Error ? err.message : String(err)}`);
+    }
+
+    setLoading(false);
+  };
+
+  const copyUrl = () => {
+    navigator.clipboard.writeText(buildUrl());
+    setUrlCopied(true);
+    setTimeout(() => setUrlCopied(false), 1500);
+  };
+
+  const copyResponse = useCallback(() => {
+    if (!response) return;
+    navigator.clipboard.writeText(response);
+    setResponseCopied(true);
+    setTimeout(() => setResponseCopied(false), 1500);
+  }, [response]);
+
+  const toggleEdit = () => setIsEditing((v) => !v);
+
+  // ── Response context menu items (extend here in the future) ──────────────
+
+  const responseCtxItems = useCallback(
+    (): ContextMenuItem[] =>
+      response
+        ? [
+            { type: 'separator' },
+            {
+              label: 'Copy all',
+              icon: <VscCopy size={12} />,
+              onClick: () => navigator.clipboard.writeText(response),
+            },
+          ]
+        : [],
+    [response]
+  );
+
+  // ─────────────────────────────────────────────────────────────────────────
+
+  return (
+    <div className="flex h-full overflow-hidden">
+      {/* ── Route list ──────────────────────────────────────────────────── */}
+      <div className="w-56 shrink-0 border-r border-surface-border overflow-y-auto py-2 bg-base-900/50">
+        {!restEnabled && (
+          <div className="mx-2 mb-2 px-2 py-1.5 rounded-md bg-yellow-400/10 border border-yellow-400/20 text-xs font-mono text-yellow-400">
+            REST API disabled in Settings
+          </div>
+        )}
+
+        {Object.entries(routeConfig).map(([key, route]) => (
+          <button
+            key={key}
+            onClick={() => handleSelect(route)}
+            className={[
+              'w-full text-left px-3 py-2 transition-colors',
+              selected === route
+                ? 'bg-surface-raised border-r-2 border-accent'
+                : 'hover:bg-surface-raised/50',
+            ].join(' ')}
+          >
+            <div className="flex items-center gap-2">
+              <span
+                className={[
+                  'text-[10px] font-mono border rounded px-1 py-px shrink-0',
+                  METHOD_COLORS[route.method],
+                ].join(' ')}
+              >
+                {route.method}
+              </span>
+            </div>
+            <p className="text-xs font-mono text-text-secondary mt-0.5 truncate">{route.path}</p>
+            <p className="text-[10px] text-text-muted mt-0.5">{route.description}</p>
+          </button>
+        ))}
+      </div>
+
+      {/* ── Request + response ──────────────────────────────────────────── */}
+      <div className="flex-1 flex flex-col overflow-hidden">
+        {!selected ? (
+          <div className="flex items-center justify-center h-full text-xs font-mono text-text-muted">
+            Select a route to inspect and call it
+          </div>
+        ) : (
+          <>
+            {/* URL bar */}
+            <div className="px-4 py-3 border-b border-surface-border bg-base-900 shrink-0 space-y-2">
+              <div className="flex items-center gap-2">
+                <span
+                  className={[
+                    'text-xs font-mono border rounded px-1.5 py-0.5 shrink-0',
+                    METHOD_COLORS[selected.method],
+                  ].join(' ')}
+                >
+                  {selected.method}
+                </span>
+
+                <code
+                  onContextMenu={(e) => handleContextMenu(e)}
+                  className="flex-1 text-xs font-mono text-text-primary bg-base-950 border border-surface-border rounded px-2.5 py-1.5 truncate select-text"
+                >
+                  {buildUrl()}
+                </code>
+
+                <button
+                  onClick={copyUrl}
+                  className="text-text-muted hover:text-accent transition-colors p-1"
+                  title="Copy URL"
+                >
+                  {urlCopied ? (
+                    <VscCheck size={13} className="text-accent" />
+                  ) : (
+                    <VscCopy size={13} />
+                  )}
+                </button>
+
+                <Button variant="primary" size="sm" onClick={handleCall} loading={loading}>
+                  <VscPlay size={11} />
+                  Send
+                </Button>
+              </div>
+
+              {/* Path params */}
+              {Object.keys(pathParams).length > 0 && (
+                <div className="flex items-center gap-2 flex-wrap">
+                  {Object.entries(pathParams).map(([k, v]) => (
+                    <div key={k} className="flex items-center gap-1">
+                      <span className="text-xs font-mono text-text-muted">:{k}</span>
+                      <input
+                        value={v}
+                        onChange={(e) => setPathParams((p) => ({ ...p, [k]: e.target.value }))}
+                        placeholder="value"
+                        className="w-32 bg-base-950 border border-surface-border rounded px-2 py-1 text-xs font-mono text-text-primary focus:outline-none focus:border-accent/40"
+                      />
+                    </div>
+                  ))}
+                </div>
+              )}
+            </div>
+
+            <div className="flex flex-1 overflow-hidden">
+              {/* Body */}
+              {['POST', 'PUT', 'PATCH'].includes(selected.method) && (
+                <div className="w-1/2 border-r border-surface-border flex flex-col">
+                  <div className="px-3 py-1.5 border-b border-surface-border bg-base-900/50 shrink-0">
+                    <span className="text-xs font-mono text-text-muted">Request Body (JSON)</span>
+                  </div>
+                  <textarea
+                    value={body}
+                    onChange={(e) => setBody(e.target.value)}
+                    spellCheck={false}
+                    className="flex-1 bg-base-950 text-xs font-mono text-text-primary px-3 py-2 resize-none focus:outline-none select-text"
+                  />
+                </div>
+              )}
+
+              {/* ── Response panel ────────────────────────────────────── */}
+              <div className="flex-1 flex flex-col overflow-hidden">
+                {/* Titlebar */}
+                <div className="px-3 py-1.5 border-b border-surface-border bg-base-900/50 shrink-0 flex items-center justify-between">
+                  <span className="text-xs font-mono text-text-muted">Response</span>
+
+                  {response && (
+                    <div className="flex items-center gap-0.5">
+                      <button
+                        onClick={toggleEdit}
+                        title={isEditing ? 'Show highlighted' : 'Edit raw'}
+                        className={[
+                          'p-1 rounded transition-colors',
+                          isEditing ? 'text-accent' : 'text-text-muted hover:text-accent',
+                        ].join(' ')}
+                      >
+                        {isEditing ? <VscCode size={13} /> : <VscEdit size={13} />}
+                      </button>
+
+                      <button
+                        onClick={copyResponse}
+                        title="Copy response"
+                        className="p-1 rounded text-text-muted hover:text-accent transition-colors"
+                      >
+                        {responseCopied ? (
+                          <VscCheck size={13} className="text-accent" />
+                        ) : (
+                          <VscCopy size={13} />
+                        )}
+                      </button>
+                    </div>
+                  )}
+                </div>
+
+                {/* Highlighted view or editable textarea */}
+                {isEditing ? (
+                  <textarea
+                    value={response ?? ''}
+                    onChange={(e) => setResponse(e.target.value)}
+                    onContextMenu={(e) => handleContextMenu(e, responseCtxItems())}
+                    spellCheck={false}
+                    className="flex-1 overflow-auto px-3 py-2 text-xs font-mono text-text-secondary bg-base-950 resize-none focus:outline-none select-text"
+                  />
+                ) : (
+                  <pre
+                    onContextMenu={(e) => handleContextMenu(e, responseCtxItems())}
+                    className="flex-1 overflow-auto px-3 py-2 text-xs font-mono bg-base-950 whitespace-pre-wrap select-text"
+                  >
+                    {response != null ? (
+                      <JsonHighlight text={response} />
+                    ) : (
+                      <span className="text-text-muted">
+                        {loading ? 'Waiting…' : 'Press Send to call the API'}
+                      </span>
+                    )}
+                  </pre>
+                )}
+              </div>
+            </div>
+          </>
+        )}
+      </div>
+
+      {/* ── Context menu ────────────────────────────────────────────────── */}
+      {ctxMenu && (
+        <ContextMenu
+          x={ctxMenu.x}
+          y={ctxMenu.y}
+          items={ctxMenu.items}
+          onClose={() => setCtxMenu(null)}
+        />
+      )}
+    </div>
+  );
+}
diff --git a/src/renderer/components/developer/DevDashboard.tsx b/src/renderer/components/developer/DevDashboard.tsx
new file mode 100644
index 0000000..18ee59f
--- /dev/null
+++ b/src/renderer/components/developer/DevDashboard.tsx
@@ -0,0 +1,171 @@
+import React, { useEffect, useState } from 'react';
+import { useApp } from '../../store/AppStore';
+import { VscCircleFilled, VscCircle } from 'react-icons/vsc';
+import { JRCEnvironment } from '../../../main/shared/types/App.types';
+
+declare const __APP_VERSION__: string;
+
+interface SysInfo {
+  platform: string;
+  arch: string;
+  nodeVersion: string;
+  electronVersion: string;
+  chromeVersion: string;
+  argv: string[];
+  uptime: number;
+  memoryUsageMB: number;
+}
+
+function StatCard({
+  label,
+  value,
+  accent,
+  sub,
+}: {
+  label: string;
+  value: string | number;
+  accent?: boolean;
+  sub?: string;
+}) {
+  return (
+    <div className="rounded-lg border border-surface-border bg-base-900 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',
+          accent ? 'text-accent' : 'text-text-primary',
+        ].join(' ')}
+      >
+        {value}
+      </p>
+      {sub && <p className="text-xs font-mono text-text-muted">{sub}</p>}
+    </div>
+  );
+}
+
+function Badge({ ok, label }: { ok: boolean; label: string }) {
+  return (
+    <span
+      className={[
+        'inline-flex items-center gap-1.5 px-2 py-0.5 rounded-full text-xs font-mono border',
+        ok
+          ? 'bg-accent/10 border-accent/20 text-accent'
+          : 'bg-surface-raised border-surface-border text-text-muted',
+      ].join(' ')}
+    >
+      {ok ? <VscCircleFilled size={8} /> : <VscCircle size={8} />}
+      {label}
+    </span>
+  );
+}
+
+function Section({ title, children }: { title: string; children: React.ReactNode }) {
+  return (
+    <div className="space-y-2">
+      <p className="text-xs font-mono text-text-muted uppercase tracking-widest">{title}</p>
+      {children}
+    </div>
+  );
+}
+
+export function DevDashboard() {
+  const { state } = useApp();
+  const [sysInfo, setSysInfo] = useState<SysInfo | null>(null);
+  const [env, setEnv] = useState<JRCEnvironment>();
+
+  useEffect(() => {
+    const load = () => window.api.getSysInfo().then(setSysInfo);
+    load();
+    const id = setInterval(load, 3000);
+    return () => clearInterval(id);
+  }, []);
+
+  useEffect(() => {
+    const loadEnv = async () => {
+      const environment = await window.env.get();
+      setEnv(environment);
+    };
+    loadEnv();
+  }, []);
+
+  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;
+
+  return (
+    <div className="h-full overflow-y-auto">
+      <div className="px-4 py-4 pb-4 space-y-5">
+        {/* Application State */}
+        <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'} />
+          </div>
+        </Section>
+
+        {sysInfo && (
+          <div className="rounded-lg bg-base-900 border border-surface-border 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>
+          </div>
+        )}
+        {/* Feature Flags */}
+        <Section title="Feature Flags">
+          <div className="flex flex-wrap gap-2">
+            <Badge ok={restEnabled} label="REST API" />
+            <Badge ok={state.settings?.launchOnStartup ?? false} label="Launch on Startup" />
+            <Badge ok={state.settings?.minimizeToTray ?? false} label="Minimize to Tray" />
+            <Badge ok={state.settings?.consoleWordWrap ?? false} label="Word Wrap" />
+            <Badge ok={state.settings?.consoleLineNumbers ?? false} label="Line Numbers" />
+          </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>
+          ) : (
+            <div className="space-y-1.5">
+              {runningProfiles.map((s) => {
+                const profile = state.profiles.find((p) => p.id === s.profileId);
+                const uptimeSec = s.startedAt ? Math.floor((Date.now() - s.startedAt) / 1000) : 0;
+
+                return (
+                  <div
+                    key={s.profileId}
+                    className="flex items-center gap-3 px-3 py-2 rounded-lg border border-accent/20 bg-accent/5"
+                  >
+                    <span className="w-1.5 h-1.5 rounded-full bg-accent animate-pulse-dot shrink-0" />
+                    <span className="text-xs font-mono text-text-primary flex-1 truncate">
+                      {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>
+                  </div>
+                );
+              })}
+            </div>
+          )}
+        </Section>
+
+        {/* System */}
+        <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>
+      </div>
+    </div>
+  );
+}
diff --git a/src/renderer/components/developer/DevDiagnostics.tsx b/src/renderer/components/developer/DevDiagnostics.tsx
new file mode 100644
index 0000000..819a213
--- /dev/null
+++ b/src/renderer/components/developer/DevDiagnostics.tsx
@@ -0,0 +1,170 @@
+import React, { useEffect, useRef, useState } from 'react';
+import { VscCheck, VscCopy } from 'react-icons/vsc';
+import { useApp } from '../../store/AppStore';
+import { Button } from '../common/Button';
+
+interface PerfSample {
+  timestamp: number;
+  memMB: number;
+}
+
+export function DevDiagnostics() {
+  const { state } = useApp();
+  const [perfSamples, setPerfSamples] = useState<PerfSample[]>([]);
+  const [copied, setCopied] = useState(false);
+  const [ipcLog, setIpcLog] = useState<{ ts: number; msg: string }[]>([]);
+  const intervalRef = useRef<ReturnType<typeof setInterval> | null>(null);
+
+  const samplePerf = () => {
+    if (window.performance && (performance as any).memory) {
+      const mem = (performance as any).memory;
+      const mb = Math.round(mem.usedJSHeapSize / 1024 / 1024);
+      setPerfSamples((prev) => [...prev.slice(-29), { timestamp: Date.now(), memMB: mb }]);
+    }
+  };
+
+  useEffect(() => {
+    samplePerf();
+    intervalRef.current = setInterval(samplePerf, 2000);
+    return () => {
+      if (intervalRef.current) clearInterval(intervalRef.current);
+    };
+  }, []);
+
+  const exportDiagReport = () => {
+    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,
+      settings: state.settings,
+      consoleLogCounts: Object.fromEntries(
+        Object.entries(state.consoleLogs).map(([id, lines]) => [id, lines.length])
+      ),
+      memorySnapshot: perfSamples[perfSamples.length - 1] ?? null,
+    };
+    const text = JSON.stringify(report, null, 2);
+    navigator.clipboard.writeText(text);
+    setCopied(true);
+    setTimeout(() => setCopied(false), 2000);
+  };
+
+  const latest = perfSamples[perfSamples.length - 1];
+  const maxMem = Math.max(...perfSamples.map((s) => s.memMB), 1);
+
+  return (
+    <div className="flex-1 overflow-y-auto px-4 py-4 space-y-5">
+      {/* Memory chart */}
+      <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">
+            {perfSamples.map((s, i) => {
+              const pct = (s.memMB / maxMem) * 100;
+              return (
+                <div
+                  key={i}
+                  className="flex-1 bg-accent/40 rounded-t-sm transition-all duration-300"
+                  style={{ height: `${Math.max(4, pct)}%` }}
+                  title={`${s.memMB} MB`}
+                />
+              );
+            })}
+            {perfSamples.length === 0 && (
+              <p className="text-xs font-mono text-text-muted self-center w-full text-center">
+                Collecting samples...
+              </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>
+        </div>
+      </Section>
+
+      {/* Renderer state summary */}
+      <Section title="Renderer State">
+        <div className="rounded-lg border border-surface-border bg-base-900 divide-y divide-surface-border/50">
+          <DiagRow label="Active profile ID" value={state.activeProfileId || '—'} mono />
+          <DiagRow label="Profiles loaded" value={String(state.profiles.length)} />
+          <DiagRow label="Process states" value={String(state.processStates.length)} />
+          <DiagRow
+            label="Console buffers"
+            value={`${Object.keys(state.consoleLogs).length} profiles`}
+          />
+          <DiagRow
+            label="Total buffered lines"
+            value={String(Object.values(state.consoleLogs).reduce((a, b) => a + b.length, 0))}
+          />
+          <DiagRow label="Settings loaded" value={state.settings ? 'Yes' : 'No'} />
+        </div>
+      </Section>
+
+      {/* Profile detail */}
+      <Section title="Profile Console Buffers">
+        {state.profiles.length === 0 ? (
+          <p className="text-xs font-mono text-text-muted">No profiles</p>
+        ) : (
+          <div className="rounded-lg border border-surface-border bg-base-900 divide-y divide-surface-border/50">
+            {state.profiles.map((p) => {
+              const lines = state.consoleLogs[p.id]?.length ?? 0;
+              const running = state.processStates.some((s) => s.profileId === p.id && s.running);
+              return (
+                <div key={p.id} className="px-3 py-2 flex items-center gap-3">
+                  <span
+                    className="w-1.5 h-1.5 rounded-full shrink-0"
+                    style={{ backgroundColor: running ? (p.color ?? '#4ade80') : '#242736' }}
+                  />
+                  <span className="text-xs font-mono text-text-primary flex-1 truncate">
+                    {p.name}
+                  </span>
+                  <span className="text-xs font-mono text-text-muted">
+                    {lines.toLocaleString()} lines
+                  </span>
+                </div>
+              );
+            })}
+          </div>
+        )}
+      </Section>
+
+      {/* Export */}
+      <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.
+        </p>
+        <Button variant="ghost" size="sm" onClick={exportDiagReport}>
+          {copied ? <VscCheck size={11} className="text-accent" /> : <VscCopy size={11} />}
+          {copied ? 'Copied!' : 'Copy Report to Clipboard'}
+        </Button>
+      </Section>
+    </div>
+  );
+}
+
+function Section({ title, children }: { title: string; children: React.ReactNode }) {
+  return (
+    <div className="space-y-2">
+      <p className="text-xs font-mono text-text-muted uppercase tracking-widest">{title}</p>
+      {children}
+    </div>
+  );
+}
+
+function DiagRow({ label, value, mono }: { label: string; value: string; mono?: boolean }) {
+  return (
+    <div className="flex items-center justify-between gap-4 px-3 py-2">
+      <span className="text-xs text-text-muted font-mono w-44 shrink-0">{label}</span>
+      <span
+        className={[
+          'text-xs flex-1 truncate text-right',
+          mono ? 'font-mono text-text-secondary' : 'text-text-secondary',
+        ].join(' ')}
+      >
+        {value}
+      </span>
+    </div>
+  );
+}
+
+declare const __APP_VERSION__: string;
diff --git a/src/renderer/components/developer/DevModeGate.tsx b/src/renderer/components/developer/DevModeGate.tsx
new file mode 100644
index 0000000..e95d148
--- /dev/null
+++ b/src/renderer/components/developer/DevModeGate.tsx
@@ -0,0 +1,79 @@
+import React, { useEffect, useState } from 'react';
+import { useDevMode } from '../../hooks/useDevMode';
+import { Button } from '../common/Button';
+import { VscCode } from 'react-icons/vsc';
+
+export function DevModeGate() {
+  const devEnabled = useDevMode();
+  const [dialogOpen, setDialogOpen] = useState(false);
+
+  useEffect(() => {
+    const keysPressed = new Set<string>();
+
+    const keydownHandler = (e: KeyboardEvent) => {
+      keysPressed.add(e.code);
+
+      // right shift + 7
+      if (keysPressed.has('ShiftRight') && keysPressed.has('Digit7')) {
+        e.preventDefault();
+        setDialogOpen(true);
+      }
+    };
+
+    const keyupHandler = (e: KeyboardEvent) => {
+      keysPressed.delete(e.code);
+    };
+
+    window.addEventListener('keydown', keydownHandler);
+    window.addEventListener('keyup', keyupHandler);
+
+    return () => {
+      window.removeEventListener('keydown', keydownHandler);
+      window.removeEventListener('keyup', keyupHandler);
+    };
+  }, []);
+
+  if (!dialogOpen) return null;
+
+  const isOn = devEnabled;
+
+  return (
+    <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/70 animate-fade-in">
+      <div className="bg-base-900 border border-surface-border rounded-xl shadow-2xl w-full max-w-sm mx-4 p-5 space-y-4">
+        <div className="flex items-center gap-3">
+          <div className="w-8 h-8 rounded-lg bg-accent/10 border border-accent/20 flex items-center justify-center shrink-0">
+            <VscCode size={16} className="text-accent" />
+          </div>
+          <div>
+            <h2 className="text-sm font-semibold text-text-primary">Developer Mode</h2>
+            <p className="text-xs text-text-muted mt-0.5">
+              {isOn ? 'Currently enabled' : 'Currently disabled'}
+            </p>
+          </div>
+        </div>
+
+        <p className="text-xs text-text-secondary leading-relaxed">
+          {isOn
+            ? 'Disable developer mode? This will hide the Developer panel and close DevTools.'
+            : 'Enable developer mode? This will show the Developer panel and enable DevTools for this session.'}
+        </p>
+
+        <div className="flex justify-end gap-2 pt-1">
+          <Button variant="ghost" size="sm" onClick={() => setDialogOpen(false)}>
+            Cancel
+          </Button>
+          <Button
+            variant="primary"
+            size="sm"
+            onClick={() => {
+              window.env.toggleDevMode(!isOn);
+              setDialogOpen(false);
+            }}
+          >
+            {isOn ? 'Disable' : 'Enable'}
+          </Button>
+        </div>
+      </div>
+    </div>
+  );
+}
diff --git a/src/renderer/components/developer/DevStorage.tsx b/src/renderer/components/developer/DevStorage.tsx
new file mode 100644
index 0000000..37fcd89
--- /dev/null
+++ b/src/renderer/components/developer/DevStorage.tsx
@@ -0,0 +1,174 @@
+import React, { useState, useEffect } from 'react';
+import { Button } from '../common/Button';
+import { Dialog } from '../common/Dialog';
+import { useApp } from '../../store/AppStore';
+import { VscRefresh, VscTrash } from 'react-icons/vsc';
+
+interface SessionEntry {
+  key: string;
+  sizeBytes: number;
+  preview: string;
+}
+
+function getSessionEntries(): SessionEntry[] {
+  const entries: SessionEntry[] = [];
+  for (let i = 0; i < sessionStorage.length; i++) {
+    const key = sessionStorage.key(i)!;
+    const raw = sessionStorage.getItem(key) ?? '';
+    entries.push({
+      key,
+      sizeBytes: new Blob([raw]).size,
+      preview: raw.slice(0, 80) + (raw.length > 80 ? '…' : ''),
+    });
+  }
+  return entries.sort((a, b) => b.sizeBytes - a.sizeBytes);
+}
+
+function formatBytes(n: number): string {
+  if (n < 1024) return `${n} B`;
+  return `${(n / 1024).toFixed(1)} KB`;
+}
+
+export function DevStorage() {
+  const { state } = useApp();
+  const [sessionEntries, setSessionEntries] = useState<SessionEntry[]>([]);
+  const [confirmReset, setConfirmReset] = useState<'electron-store' | 'session' | null>(null);
+
+  const refresh = () => setSessionEntries(getSessionEntries());
+
+  useEffect(() => {
+    refresh();
+  }, []);
+
+  const totalSessionBytes = sessionEntries.reduce((a, b) => a + b.sizeBytes, 0);
+
+  return (
+    <div className="flex-1 overflow-y-auto px-4 py-4 space-y-5">
+      {/* Electron store */}
+      <Section title="Electron Store (Persistent)">
+        <div className="rounded-lg border border-surface-border bg-base-900 divide-y divide-surface-border/50">
+          <StoreRow label="Profiles" value={String(state.profiles.length)} />
+          <StoreRow label="Active profile ID" value={state.activeProfileId || '—'} mono />
+          <StoreRow
+            label="REST API"
+            value={
+              state.settings?.restApiEnabled
+                ? `Enabled (${state.settings.restApiPort})`
+                : 'Disabled'
+            }
+          />
+          <StoreRow
+            label="Console max lines"
+            value={String(state.settings?.consoleMaxLines ?? '—')}
+          />
+        </div>
+        <Button variant="danger" size="sm" onClick={() => setConfirmReset('electron-store')}>
+          <VscTrash size={11} />
+          Reset Electron Store
+        </Button>
+      </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}
+            className="text-text-muted hover:text-accent transition-colors p-1"
+          >
+            <VscRefresh size={12} />
+          </button>
+        </div>
+        {sessionEntries.length === 0 ? (
+          <p className="text-xs font-mono text-text-muted py-2">Empty</p>
+        ) : (
+          <div className="rounded-lg border border-surface-border bg-base-900 divide-y divide-surface-border/50">
+            {sessionEntries.map((e) => (
+              <div key={e.key} className="px-3 py-2 flex items-start gap-3">
+                <div className="flex-1 min-w-0">
+                  <p className="text-xs font-mono text-text-primary truncate">{e.key}</p>
+                  <p className="text-xs font-mono text-text-muted truncate mt-0.5">{e.preview}</p>
+                </div>
+                <div className="flex items-center gap-2 shrink-0">
+                  <span className="text-xs font-mono text-text-muted">
+                    {formatBytes(e.sizeBytes)}
+                  </span>
+                  <button
+                    onClick={() => {
+                      sessionStorage.removeItem(e.key);
+                      refresh();
+                    }}
+                    className="text-text-muted hover:text-red-400 transition-colors"
+                  >
+                    <VscTrash size={11} />
+                  </button>
+                </div>
+              </div>
+            ))}
+          </div>
+        )}
+        <Button
+          variant="danger"
+          size="sm"
+          onClick={() => setConfirmReset('session')}
+          disabled={sessionEntries.length === 0}
+        >
+          <VscTrash size={11} />
+          Clear Session Storage
+        </Button>
+      </Section>
+
+      <Dialog
+        open={confirmReset === 'electron-store'}
+        title="Reset Electron Store?"
+        message="This will wipe ALL profiles and settings permanently. The app will need to be restarted. This cannot be undone."
+        confirmLabel="Reset"
+        danger
+        onConfirm={async () => {
+          await window.api.resetStore();
+          setConfirmReset(null);
+        }}
+        onCancel={() => setConfirmReset(null)}
+      />
+
+      <Dialog
+        open={confirmReset === 'session'}
+        title="Clear Session Storage?"
+        message="All cached console logs for this session will be removed. Running processes are not affected."
+        confirmLabel="Clear"
+        danger
+        onConfirm={() => {
+          sessionStorage.clear();
+          refresh();
+          setConfirmReset(null);
+        }}
+        onCancel={() => setConfirmReset(null)}
+      />
+    </div>
+  );
+}
+
+function Section({ title, children }: { title: string; children: React.ReactNode }) {
+  return (
+    <div className="space-y-2">
+      <p className="text-xs font-mono text-text-muted uppercase tracking-widest">{title}</p>
+      {children}
+    </div>
+  );
+}
+
+function StoreRow({ label, value, mono }: { label: string; value: string; mono?: boolean }) {
+  return (
+    <div className="flex items-center justify-between gap-4 px-3 py-2">
+      <span className="text-xs text-text-muted font-mono w-40 shrink-0">{label}</span>
+      <span
+        className={[
+          'text-xs flex-1 truncate text-right',
+          mono ? 'font-mono text-text-secondary' : 'text-text-secondary',
+        ].join(' ')}
+      >
+        {value}
+      </span>
+    </div>
+  );
+}
diff --git a/src/renderer/components/developer/DeveloperTab.tsx b/src/renderer/components/developer/DeveloperTab.tsx
new file mode 100644
index 0000000..08eb879
--- /dev/null
+++ b/src/renderer/components/developer/DeveloperTab.tsx
@@ -0,0 +1,57 @@
+import React, { useState } from 'react';
+import { VscDashboard, VscPlug, VscDatabase, VscBeaker } from 'react-icons/vsc';
+import { DevDashboard } from './DevDashboard';
+import { DevApiExplorer } from './DevApiExplorer';
+import { DevStorage } from './DevStorage';
+import { DevDiagnostics } from './DevDiagnostics';
+
+type Panel = 'dashboard' | 'api' | 'storage' | 'diagnostics';
+
+const PANELS: { id: Panel; label: string; Icon: React.ElementType }[] = [
+  { id: 'dashboard', label: 'Dashboard', Icon: VscDashboard },
+  { id: 'api', label: 'API Explorer', Icon: VscPlug },
+  { id: 'storage', label: 'Storage', Icon: VscDatabase },
+  { id: 'diagnostics', label: 'Diagnostics', Icon: VscBeaker },
+];
+
+export function DeveloperTab() {
+  const [panel, setPanel] = useState<Panel>('dashboard');
+
+  return (
+    <div className="flex flex-col h-full bg-base-800">
+      {/* Header banner */}
+      <div className="shrink-0 px-4 py-2 bg-accent/5 border-b border-accent/20 flex items-center gap-2">
+        <span className="w-1.5 h-1.5 rounded-full bg-accent animate-pulse-dot" />
+        <span className="text-xs font-mono text-accent tracking-widest uppercase">
+          Developer Mode
+        </span>
+      </div>
+
+      {/* Sub-tab bar */}
+      <div className="flex items-center gap-0 px-4 border-b border-surface-border bg-base-900 shrink-0">
+        {PANELS.map((p) => (
+          <button
+            key={p.id}
+            onClick={() => setPanel(p.id)}
+            className={[
+              'flex items-center gap-1.5 px-3 py-2.5 text-xs font-mono border-b-2 -mb-px transition-colors',
+              panel === p.id
+                ? 'text-accent border-accent font-medium'
+                : 'text-text-muted border-transparent hover:text-text-primary',
+            ].join(' ')}
+          >
+            <p.Icon size={13} />
+            {p.label}
+          </button>
+        ))}
+      </div>
+
+      <div className="flex-1 min-h-0">
+        {panel === 'dashboard' && <DevDashboard />}
+        {panel === 'api' && <DevApiExplorer />}
+        {panel === 'storage' && <DevStorage />}
+        {panel === 'diagnostics' && <DevDiagnostics />}
+      </div>
+    </div>
+  );
+}
diff --git a/src/renderer/components/faq/FaqPanel.tsx b/src/renderer/components/faq/FaqPanel.tsx
index 8c12d3d..0195c06 100644
--- a/src/renderer/components/faq/FaqPanel.tsx
+++ b/src/renderer/components/faq/FaqPanel.tsx
@@ -1,30 +1,30 @@
-import React, { useState, useMemo } from 'react'
-import { FAQ_TOPICS } from '../../../main/shared/config/FAQ.config'
-import type { FaqItem, FaqTopic } from '../../../main/shared/config/FAQ.config'
+import { useMemo, useState } from 'react';
+import type { FaqItem, FaqTopic } from '../../../main/shared/config/FAQ.config';
+import { FAQ_TOPICS } from '../../../main/shared/config/FAQ.config';
 
 export function FaqPanel() {
-  const [search, setSearch] = useState('')
-  const [activeTopic, setActiveTopic] = useState<string>(FAQ_TOPICS[0]?.id ?? '')
-  const [expandedIdx, setExpandedIdx] = useState<number | null>(null)
+  const [search, setSearch] = useState('');
+  const [activeTopic, setActiveTopic] = useState<string>(FAQ_TOPICS[0]?.id ?? '');
+  const [expandedIdx, setExpandedIdx] = useState<number | null>(null);
 
-  const searchTrimmed = search.trim().toLowerCase()
+  const searchTrimmed = search.trim().toLowerCase();
 
   const searchResults = useMemo<FaqItem[]>(() => {
-    if (!searchTrimmed) return []
+    if (!searchTrimmed) return [];
     return FAQ_TOPICS.flatMap((t) => t.items).filter(
       (item) =>
         item.q.toLowerCase().includes(searchTrimmed) || item.a.toLowerCase().includes(searchTrimmed)
-    )
-  }, [searchTrimmed])
+    );
+  }, [searchTrimmed]);
 
-  const activeTopic_ = FAQ_TOPICS.find((t) => t.id === activeTopic) ?? FAQ_TOPICS[0]
-  const displayItems = searchTrimmed ? searchResults : (activeTopic_?.items ?? [])
+  const activeTopic_ = FAQ_TOPICS.find((t) => t.id === activeTopic) ?? FAQ_TOPICS[0];
+  const displayItems = searchTrimmed ? searchResults : (activeTopic_?.items ?? []);
 
   const handleTopicClick = (id: string) => {
-    setActiveTopic(id)
-    setExpandedIdx(null)
-    setSearch('')
-  }
+    setActiveTopic(id);
+    setExpandedIdx(null);
+    setSearch('');
+  };
 
   return (
     <div className="flex flex-col h-full">
@@ -33,8 +33,8 @@ export function FaqPanel() {
           type="text"
           value={search}
           onChange={(e) => {
-            setSearch(e.target.value)
-            setExpandedIdx(null)
+            setSearch(e.target.value);
+            setExpandedIdx(null);
           }}
           placeholder="Search FAQ..."
           className="w-full bg-base-950 border border-surface-border rounded-md px-3 py-1.5 text-xs text-text-primary placeholder:text-text-muted focus:outline-none focus:border-accent/40 transition-colors font-mono"
@@ -70,7 +70,7 @@ export function FaqPanel() {
         </div>
       </div>
     </div>
-  )
+  );
 }
 
 function TopicButton({
@@ -78,9 +78,9 @@ function TopicButton({
   active,
   onClick,
 }: {
-  topic: FaqTopic
-  active: boolean
-  onClick: () => void
+  topic: FaqTopic;
+  active: boolean;
+  onClick: () => void;
 }) {
   return (
     <button
@@ -94,7 +94,7 @@ function TopicButton({
     >
       {topic.label}
     </button>
-  )
+  );
 }
 
 function FaqEntry({
@@ -102,9 +102,9 @@ function FaqEntry({
   open,
   onToggle,
 }: {
-  item: FaqItem
-  open: boolean
-  onToggle: () => void
+  item: FaqItem;
+  open: boolean;
+  onToggle: () => void;
 }) {
   return (
     <div
@@ -142,5 +142,5 @@ function FaqEntry({
         </div>
       )}
     </div>
-  )
+  );
 }
diff --git a/src/renderer/components/profiles/ConfigTab.tsx b/src/renderer/components/profiles/ConfigTab.tsx
index 25b3b09..be01543 100644
--- a/src/renderer/components/profiles/ConfigTab.tsx
+++ b/src/renderer/components/profiles/ConfigTab.tsx
@@ -1,18 +1,14 @@
-/**
- * ConfigTab — per-profile configuration.
- * Sub-tabs: General | Files & Paths | JVM Args | Properties (-D) | Program Args
- */
-import React, { useState, useEffect, useCallback, useMemo } from 'react'
-import { useApp } from '../../store/AppStore'
-import { Button } from '../common/Button'
-import { Input } from '../common/Input'
-import { Toggle } from '../common/Toggle'
-import { ArgList } from '../common/ArgList'
-import { PropList } from '../common/PropList'
-import { Dialog } from '../common/Dialog'
-import type { Profile } from '../../types'
+import React, { useState, useEffect, useCallback, useMemo } from 'react';
+import { useApp } from '../../store/AppStore';
+import { Button } from '../common/Button';
+import { Input } from '../common/Input';
+import { Toggle } from '../common/Toggle';
+import { ArgList } from '../common/ArgList';
+import { PropList } from '../common/PropList';
+import { Dialog } from '../common/Dialog';
+import { Profile } from 'src/main/shared/types/Profile.types';
 
-type Section = 'general' | 'files' | 'jvm' | 'props' | 'args'
+type Section = 'general' | 'files' | 'jvm' | 'props' | 'args';
 
 const SECTIONS: { id: Section; label: string }[] = [
   { id: 'general', label: 'General' },
@@ -20,72 +16,72 @@ const SECTIONS: { id: Section; label: string }[] = [
   { id: 'jvm', label: 'JVM Args' },
   { id: 'props', label: 'Properties (-D)' },
   { id: 'args', label: 'Program Args' },
-]
+];
 
 export function ConfigTab() {
-  const { activeProfile, saveProfile, isRunning, startProcess, stopProcess } = useApp()
+  const { activeProfile, saveProfile, isRunning, startProcess, stopProcess } = useApp();
 
-  const [draft, setDraft] = useState<Profile | null>(null)
-  const [saved, setSaved] = useState(false)
-  const [section, setSection] = useState<Section>('general')
-  const [pendingArg, setPendingArg] = useState(false)
-  const [pendingChange, setPendingChange] = useState<Section | null>(null)
+  const [draft, setDraft] = useState<Profile | null>(null);
+  const [saved, setSaved] = useState(false);
+  const [section, setSection] = useState<Section>('general');
+  const [pendingArg, setPendingArg] = useState(false);
+  const [pendingChange, setPendingChange] = useState<Section | null>(null);
 
   useEffect(() => {
     if (activeProfile) {
-      setDraft({ ...activeProfile })
-      setSaved(false)
-      setPendingArg(false)
+      setDraft({ ...activeProfile });
+      setSaved(false);
+      setPendingArg(false);
     }
-  }, [activeProfile?.id])
+  }, [activeProfile?.id]);
 
   const isDirty = useMemo(() => {
-    if (!draft || !activeProfile) return false
-    return JSON.stringify(draft) !== JSON.stringify(activeProfile)
-  }, [draft, activeProfile])
+    if (!draft || !activeProfile) return false;
+    return JSON.stringify(draft) !== JSON.stringify(activeProfile);
+  }, [draft, activeProfile]);
 
   const handleSave = useCallback(async () => {
-    if (!draft) return
-    await saveProfile(draft)
+    if (!draft) return;
+    await saveProfile(draft);
 
-    activeProfile && Object.assign(activeProfile, draft)
+    activeProfile && Object.assign(activeProfile, draft);
 
-    setSaved(true)
-    setTimeout(() => setSaved(false), 1800)
-  }, [draft, saveProfile, activeProfile])
+    setSaved(true);
+    setTimeout(() => setSaved(false), 1800);
+  }, [draft, saveProfile, activeProfile]);
 
   const requestSectionChange = useCallback(
     (next: Section) => {
       if (pendingArg && next !== section) {
-        setPendingChange(next)
-        return
+        setPendingChange(next);
+        return;
       }
-      setPendingArg(false)
-      setSection(next)
+      setPendingArg(false);
+      setSection(next);
     },
     [pendingArg, section]
-  )
+  );
 
   const handleRestart = useCallback(async () => {
-    if (!draft) return
-    await stopProcess(draft.id)
-    setTimeout(() => startProcess(draft), 800)
-  }, [draft, stopProcess, startProcess])
+    if (!draft) return;
+    await stopProcess(draft.id);
+    setTimeout(() => startProcess(draft), 800);
+  }, [draft, stopProcess, startProcess]);
 
   if (!draft || !activeProfile) {
     return (
       <div className="flex items-center justify-center h-full text-sm text-text-muted">
         No profile selected
       </div>
-    )
+    );
   }
 
-  const running = isRunning(draft.id)
-  const color = draft.color || '#4ade80'
+  const running = isRunning(draft.id);
+  const color = draft.color || '#4ade80';
   const update = (patch: Partial<Profile>) => {
-    setSaved(false)
-    setDraft((prev) => (prev ? { ...prev, ...patch } : prev))
-  }
+    setSaved(false);
+    setDraft((prev) => (prev ? { ...prev, ...patch } : prev));
+  };
 
   return (
     <>
@@ -200,15 +196,15 @@ export function ConfigTab() {
         cancelLabel="Stay"
         onConfirm={() => {
           if (pendingChange) {
-            setPendingArg(false)
-            setSection(pendingChange)
+            setPendingArg(false);
+            setSection(pendingChange);
           }
-          setPendingChange(null)
+          setPendingChange(null);
         }}
         onCancel={() => setPendingChange(null)}
       />
     </>
-  )
+  );
 }
 
 function GeneralSection({
@@ -218,11 +214,11 @@ function GeneralSection({
   color,
   onRestart,
 }: {
-  draft: Profile
-  update: (p: Partial<Profile>) => void
-  running: boolean
-  color: string
-  onRestart: () => void
+  draft: Profile;
+  update: (p: Partial<Profile>) => void;
+  running: boolean;
+  color: string;
+  onRestart: () => void;
 }) {
   return (
     <div className="space-y-6">
@@ -293,28 +289,28 @@ function GeneralSection({
         </div>
       )}
     </div>
-  )
+  );
 }
 
 function FilesSection({
   draft,
   update,
 }: {
-  draft: Profile
-  update: (p: Partial<Profile>) => void
+  draft: Profile;
+  update: (p: Partial<Profile>) => void;
 }) {
   const handlePickJar = async () => {
-    const p = await window.api.pickJar()
-    if (p) update({ jarPath: p })
-  }
+    const p = await window.api.pickJar();
+    if (p) update({ jarPath: p });
+  };
   const handlePickDir = async () => {
-    const p = await window.api.pickDir()
-    if (p) update({ workingDir: p })
-  }
+    const p = await window.api.pickDir();
+    if (p) update({ workingDir: p });
+  };
   const handlePickJava = async () => {
-    const p = await window.api.pickJava()
-    if (p) update({ javaPath: p })
-  }
+    const p = await window.api.pickJava();
+    if (p) update({ javaPath: p });
+  };
 
   return (
     <div className="space-y-4">
@@ -343,7 +339,7 @@ function FilesSection({
         rightElement={<FolderBtn onClick={handlePickJava} />}
       />
     </div>
-  )
+  );
 }
 
 function ArgSection({
@@ -351,9 +347,9 @@ function ArgSection({
   hint,
   children,
 }: {
-  title: string
-  hint: string
-  children: React.ReactNode
+  title: string;
+  hint: string;
+  children: React.ReactNode;
 }) {
   return (
     <div className="space-y-3">
@@ -363,7 +359,7 @@ function ArgSection({
       </div>
       {children}
     </div>
-  )
+  );
 }
 
 function FolderBtn({ onClick }: { onClick: () => void }) {
@@ -381,16 +377,16 @@ function FolderBtn({ onClick }: { onClick: () => void }) {
         <path d="M1 3.5h4l1.5 2H13v7H1V3.5z" />
       </svg>
     </button>
-  )
+  );
 }
 
 function buildCmdPreview(p: Profile): string {
-  const parts: string[] = [p.javaPath || 'java']
-  p.jvmArgs.filter((a) => a.enabled && a.value).forEach((a) => parts.push(a.value))
+  const parts: string[] = [p.javaPath || 'java'];
+  p.jvmArgs.filter((a) => a.enabled && a.value).forEach((a) => parts.push(a.value));
   p.systemProperties
     .filter((a) => a.enabled && a.key)
-    .forEach((a) => parts.push(a.value ? `-D${a.key}=${a.value}` : `-D${a.key}`))
-  parts.push('-jar', p.jarPath || '<no jar>')
-  p.programArgs.filter((a) => a.enabled && a.value).forEach((a) => parts.push(a.value))
-  return parts.join(' ')
+    .forEach((a) => parts.push(a.value ? `-D${a.key}=${a.value}` : `-D${a.key}`));
+  parts.push('-jar', p.jarPath || '<no jar>');
+  p.programArgs.filter((a) => a.enabled && a.value).forEach((a) => parts.push(a.value));
+  return parts.join(' ');
 }
diff --git a/src/renderer/components/profiles/ProfileSidebar.tsx b/src/renderer/components/profiles/ProfileSidebar.tsx
index 20f5bf1..adaeb1d 100644
--- a/src/renderer/components/profiles/ProfileSidebar.tsx
+++ b/src/renderer/components/profiles/ProfileSidebar.tsx
@@ -1,11 +1,11 @@
-import React, { useState, useCallback } from 'react'
-import { Reorder } from 'framer-motion'
-import { useApp, PROFILE_COLORS } from '../../store/AppStore'
-import { Dialog } from '../common/Dialog'
-import { ContextMenu } from '../common/ContextMenu'
-import { TemplateModal } from './TemplateModal'
-import type { ContextMenuItem } from '../common/ContextMenu'
-import type { Profile } from '../../types'
+import React, { useState, useCallback } from 'react';
+import { Reorder } from 'framer-motion';
+import { useApp, PROFILE_COLORS } from '../../store/AppStore';
+import { Dialog } from '../common/Dialog';
+import { ContextMenu } from '../common/ContextMenu';
+import { TemplateModal } from './TemplateModal';
+import { useDevMode } from '../../hooks/useDevMode';
+import type { ContextMenuItem } from '../common/ContextMenu';
 import {
   VscPlay,
   VscDebugStop,
@@ -17,26 +17,30 @@ import {
   VscTools,
   VscAdd,
   VscLayout,
-} from 'react-icons/vsc'
+  VscCode,
+} from 'react-icons/vsc';
+import { Profile } from '../../../main/shared/types/Profile.types';
 
 interface Props {
-  onOpenSettings: () => void
-  onOpenFaq: () => void
-  onOpenUtilities: () => void
-  onProfileClick?: () => void
-  activeSidePanel: 'settings' | 'faq' | 'utilities' | null
+  onOpenSettings: () => void;
+  onOpenFaq: () => void;
+  onOpenUtilities: () => void;
+  onOpenDeveloper: () => void;
+  onProfileClick?: () => void;
+  activeSidePanel: 'settings' | 'faq' | 'utilities' | 'developer' | null;
 }
 
 interface CtxState {
-  profileId: string
-  x: number
-  y: number
+  profileId: string;
+  x: number;
+  y: number;
 }
 
 export function ProfileSidebar({
   onOpenSettings,
   onOpenFaq,
   onOpenUtilities,
+  onOpenDeveloper,
   onProfileClick,
   activeSidePanel,
 }: Props) {
@@ -51,43 +55,44 @@ export function ProfileSidebar({
     clearConsole,
     isRunning,
     reorderProfiles,
-  } = useApp()
+  } = useApp();
 
-  const [ctxMenu, setCtxMenu] = useState<CtxState | null>(null)
-  const [deleteTarget, setDeleteTarget] = useState<Profile | null>(null)
-  const [actionError, setActionError] = useState<string | null>(null)
-  const [templateOpen, setTemplateOpen] = useState(false)
-  const [draggingId, setDraggingId] = useState<string | null>(null)
+  const devMode = useDevMode();
+  const [ctxMenu, setCtxMenu] = useState<CtxState | null>(null);
+  const [deleteTarget, setDeleteTarget] = useState<Profile | null>(null);
+  const [actionError, setActionError] = useState<string | null>(null);
+  const [templateOpen, setTemplateOpen] = useState(false);
+  const [draggingId, setDraggingId] = useState<string | null>(null);
 
-  const canDelete = state.profiles.length > 1
+  const canDelete = state.profiles.length > 1;
 
   const handleContextMenu = useCallback((e: React.MouseEvent, profile: Profile) => {
-    e.preventDefault()
-    setCtxMenu({ profileId: profile.id, x: e.clientX, y: e.clientY })
-  }, [])
+    e.preventDefault();
+    setCtxMenu({ profileId: profile.id, x: e.clientX, y: e.clientY });
+  }, []);
 
-  const ctxProfile = ctxMenu ? state.profiles.find((p) => p.id === ctxMenu.profileId) : null
-  const ctxRunning = ctxProfile ? isRunning(ctxProfile.id) : false
+  const ctxProfile = ctxMenu ? state.profiles.find((p) => p.id === ctxMenu.profileId) : null;
+  const ctxRunning = ctxProfile ? isRunning(ctxProfile.id) : false;
 
   const handleStart = useCallback(
     async (profile: Profile) => {
       if (!profile.jarPath) {
-        setActionError(`"${profile.name}" has no JAR configured.`)
-        return
+        setActionError(`"${profile.name}" has no JAR configured.`);
+        return;
       }
-      const res = await startProcess(profile)
-      if (!res.ok) setActionError(res.error ?? 'Failed to start')
+      const res = await startProcess(profile);
+      if (!res.ok) setActionError(res.error ?? 'Failed to start');
     },
     [startProcess]
-  )
+  );
 
   const handleStop = useCallback(
     async (profile: Profile) => {
-      const res = await stopProcess(profile.id)
-      if (!res.ok) setActionError(res.error ?? 'Failed to stop')
+      const res = await stopProcess(profile.id);
+      if (!res.ok) setActionError(res.error ?? 'Failed to stop');
     },
     [stopProcess]
-  )
+  );
 
   const ctxItems: ContextMenuItem[] = ctxProfile
     ? [
@@ -109,8 +114,8 @@ export function ProfileSidebar({
           label: 'Select',
           icon: <VscCheck size={12} />,
           onClick: () => {
-            setActiveProfile(ctxProfile.id)
-            onProfileClick?.()
+            setActiveProfile(ctxProfile.id);
+            onProfileClick?.();
           },
         },
         {
@@ -125,24 +130,20 @@ export function ProfileSidebar({
           danger: true,
           disabled: !canDelete,
           onClick: (e?: React.MouseEvent) => {
-            if (!canDelete) return
-
-            if (e?.shiftKey) {
-              deleteProfile(ctxProfile.id)
-            } else {
-              setDeleteTarget(ctxProfile)
-            }
+            if (!canDelete) return;
+            if (e?.shiftKey) deleteProfile(ctxProfile.id);
+            else setDeleteTarget(ctxProfile);
           },
         },
       ]
-    : []
+    : [];
 
   return (
     <>
       <aside className="w-52 shrink-0 flex flex-col bg-base-950 border-r border-surface-border">
         <div className="px-2 pt-2 pb-1 shrink-0">
           <button
-            onClick={createProfile}
+            onClick={async () => createProfile()}
             className="w-full flex items-center gap-2 px-2.5 py-1.5 rounded-md text-xs font-mono
               text-text-muted hover:text-accent hover:bg-surface-raised transition-colors border border-dashed border-surface-border hover:border-accent/40"
           >
@@ -185,8 +186,8 @@ export function ProfileSidebar({
                 running={isRunning(profile.id)}
                 isDragging={draggingId === profile.id}
                 onClick={() => {
-                  setActiveProfile(profile.id)
-                  onProfileClick?.()
+                  setActiveProfile(profile.id);
+                  onProfileClick?.();
                 }}
                 onContextMenu={(e) => handleContextMenu(e, profile)}
               />
@@ -213,6 +214,15 @@ export function ProfileSidebar({
             onClick={onOpenSettings}
             icon={<VscSettings size={13} />}
           />
+          {devMode && (
+            <FooterButton
+              label="Developer"
+              active={activeSidePanel === 'developer'}
+              onClick={onOpenDeveloper}
+              icon={<VscCode size={13} />}
+              accent
+            />
+          )}
         </div>
       </aside>
 
@@ -243,13 +253,13 @@ export function ProfileSidebar({
         confirmLabel="Delete"
         danger
         onConfirm={async () => {
-          if (deleteTarget) await deleteProfile(deleteTarget.id)
-          setDeleteTarget(null)
+          if (deleteTarget) await deleteProfile(deleteTarget.id);
+          setDeleteTarget(null);
         }}
         onCancel={() => setDeleteTarget(null)}
       />
     </>
-  )
+  );
 }
 
 function ProfileItem({
@@ -260,22 +270,22 @@ function ProfileItem({
   onClick,
   onContextMenu,
 }: {
-  profile: Profile
-  active: boolean
-  running: boolean
-  isDragging: boolean
-  onClick: () => void
-  onContextMenu: (e: React.MouseEvent) => void
+  profile: Profile;
+  active: boolean;
+  running: boolean;
+  isDragging: boolean;
+  onClick: () => void;
+  onContextMenu: (e: React.MouseEvent) => void;
 }) {
-  const color = profile.color || PROFILE_COLORS[0]
-  const jarName = profile.jarPath?.split(/[/\\]/).pop() ?? ''
+  const color = profile.color || PROFILE_COLORS[0];
+  const jarName = profile.jarPath?.split(/[/\\]/).pop() ?? '';
 
   return (
     <button
       onClick={onClick}
       onContextMenu={onContextMenu}
       onMouseDown={(e) => {
-        if (e.detail !== 0) e.preventDefault() // ignore keyboard-triggered clicks
+        if (e.detail !== 0) e.preventDefault();
       }}
       className={[
         'w-full flex items-center gap-2.5 px-2.5 py-2 rounded-md text-left transition-colors',
@@ -309,7 +319,7 @@ function ProfileItem({
 
       {running && <span className="w-1.5 h-1.5 rounded-full" style={{ backgroundColor: color }} />}
     </button>
-  )
+  );
 }
 
 function FooterButton({
@@ -317,11 +327,13 @@ function FooterButton({
   active,
   onClick,
   icon,
+  accent,
 }: {
-  label: string
-  active: boolean
-  onClick: () => void
-  icon: React.ReactNode
+  label: string;
+  active: boolean;
+  onClick: () => void;
+  icon: React.ReactNode;
+  accent?: boolean;
 }) {
   return (
     <button
@@ -329,12 +341,16 @@ function FooterButton({
       className={[
         'w-full flex items-center gap-2 px-2.5 py-1.5 rounded-md text-xs transition-colors',
         active
-          ? 'bg-surface-raised text-text-primary'
-          : 'text-text-muted hover:text-text-primary hover:bg-surface-raised/50',
+          ? accent
+            ? 'bg-accent/10 text-accent'
+            : 'bg-surface-raised text-text-primary'
+          : accent
+            ? 'text-accent/70 hover:text-accent hover:bg-accent/10'
+            : 'text-text-muted hover:text-text-primary hover:bg-surface-raised/50',
       ].join(' ')}
     >
       {icon}
       {label}
     </button>
-  )
+  );
 }
diff --git a/src/renderer/components/profiles/ProfileTab.tsx b/src/renderer/components/profiles/ProfileTab.tsx
index af295b5..e30bda1 100644
--- a/src/renderer/components/profiles/ProfileTab.tsx
+++ b/src/renderer/components/profiles/ProfileTab.tsx
@@ -1,40 +1,40 @@
-import React, { useState, useEffect } from 'react'
-import { useApp, PROFILE_COLORS } from '../../store/AppStore'
-import { Button } from '../common/Button'
-import { Input } from '../common/Input'
-import { Dialog } from '../common/Dialog'
-import type { Profile } from '../../types'
+import React, { useState, useEffect } from 'react';
+import { useApp, PROFILE_COLORS } from '../../store/AppStore';
+import { Button } from '../common/Button';
+import { Input } from '../common/Input';
+import { Dialog } from '../common/Dialog';
+import { Profile } from '../../../main/shared/types/Profile.types';
 
 export function ProfileTab() {
-  const { activeProfile, saveProfile, deleteProfile } = useApp()
-  const [draft, setDraft] = useState<Profile | null>(null)
-  const [saved, setSaved] = useState(false)
-  const [showDelete, setShowDelete] = useState(false)
+  const { activeProfile, saveProfile, deleteProfile } = useApp();
+  const [draft, setDraft] = useState<Profile | null>(null);
+  const [saved, setSaved] = useState(false);
+  const [showDelete, setShowDelete] = useState(false);
 
   useEffect(() => {
-    if (activeProfile) setDraft({ ...activeProfile })
-  }, [activeProfile?.id])
+    if (activeProfile) setDraft({ ...activeProfile });
+  }, [activeProfile?.id]);
 
   if (!draft || !activeProfile)
     return (
       <div className="flex items-center justify-center h-full text-sm text-text-muted">
         No profile selected
       </div>
-    )
+    );
 
   const update = (patch: Partial<Profile>) =>
-    setDraft((prev) => (prev ? { ...prev, ...patch } : prev))
-  const color = draft.color || PROFILE_COLORS[0]
+    setDraft((prev) => (prev ? { ...prev, ...patch } : prev));
+  const color = draft.color || PROFILE_COLORS[0];
 
   const handleSave = async () => {
-    await saveProfile(draft)
-    setSaved(true)
-    setTimeout(() => setSaved(false), 1800)
-  }
+    await saveProfile(draft);
+    setSaved(true);
+    setTimeout(() => setSaved(false), 1800);
+  };
   const handleDelete = async () => {
-    await deleteProfile(draft.id)
-    setShowDelete(false)
-  }
+    await deleteProfile(draft.id);
+    setShowDelete(false);
+  };
 
   return (
     <>
@@ -108,7 +108,7 @@ export function ProfileTab() {
         onCancel={() => setShowDelete(false)}
       />
     </>
-  )
+  );
 }
 
 function Section({
@@ -116,9 +116,9 @@ function Section({
   hint,
   children,
 }: {
-  title: string
-  hint?: string
-  children: React.ReactNode
+  title: string;
+  hint?: string;
+  children: React.ReactNode;
 }) {
   return (
     <div className="space-y-2">
@@ -128,5 +128,5 @@ function Section({
       </div>
       {children}
     </div>
-  )
+  );
 }
diff --git a/src/renderer/components/profiles/TemplateModal.tsx b/src/renderer/components/profiles/TemplateModal.tsx
index d20cd67..b84c888 100644
--- a/src/renderer/components/profiles/TemplateModal.tsx
+++ b/src/renderer/components/profiles/TemplateModal.tsx
@@ -1,54 +1,54 @@
-import React, { useState, useEffect } from 'react'
-import { Modal } from '../common/Modal'
-import { Button } from '../common/Button'
-import { useApp } from '../../store/AppStore'
-import type { ProfileTemplate } from '../../types'
-import { VscPackage, VscTag, VscRefresh, VscAdd } from 'react-icons/vsc'
-import { LuShield } from 'react-icons/lu'
+import React, { useState, useEffect } from 'react';
+import { Modal } from '../common/Modal';
+import { Button } from '../common/Button';
+import { useApp } from '../../store/AppStore';
+import { VscPackage, VscTag, VscRefresh, VscAdd } from 'react-icons/vsc';
+import { LuShield } from 'react-icons/lu';
+import { ProfileTemplate } from '../../../main/shared/types/GitHub.types';
 
-const APP_TEMPLATE_VERSION = 1
+const APP_TEMPLATE_VERSION = 1;
 
 interface TemplateEntry {
-  filename: string
-  template: ProfileTemplate
+  filename: string;
+  template: ProfileTemplate;
 }
 
 interface Props {
-  open: boolean
-  onClose: () => void
+  open: boolean;
+  onClose: () => void;
 }
 
 function isCompatible(t: ProfileTemplate): boolean {
-  return t.templateVersion <= APP_TEMPLATE_VERSION
+  return t.templateVersion <= APP_TEMPLATE_VERSION;
 }
 
 export function TemplateModal({ open, onClose }: Props) {
-  const { createProfile } = useApp()
-  const [loading, setLoading] = useState(false)
-  const [error, setError] = useState<string | null>(null)
-  const [templates, setTemplates] = useState<TemplateEntry[] | null>(null)
-  const [selected, setSelected] = useState<TemplateEntry | null>(null)
-  const [filter, setFilter] = useState('')
+  const { createProfile } = useApp();
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+  const [templates, setTemplates] = useState<TemplateEntry[] | null>(null);
+  const [selected, setSelected] = useState<TemplateEntry | null>(null);
+  const [filter, setFilter] = useState('');
 
   const load = async () => {
-    setLoading(true)
-    setError(null)
-    const res = await window.api.fetchTemplates()
-    setLoading(false)
+    setLoading(true);
+    setError(null);
+    const res = await window.api.fetchTemplates();
+    setLoading(false);
     if (!res.ok || !res.data) {
-      setError(res.error ?? 'Failed to load templates')
-      return
+      setError(res.error ?? 'Failed to load templates');
+      return;
     }
-    setTemplates(res.data)
-  }
+    setTemplates(res.data);
+  };
 
   useEffect(() => {
-    if (open && templates === null) load()
-  }, [open])
+    if (open && templates === null) load();
+  }, [open]);
 
   const handleCreate = () => {
-    if (!selected) return
-    const tpl = selected.template
+    if (!selected) return;
+    const tpl = selected.template;
     createProfile({
       name: tpl.name,
       jvmArgs: tpl.defaults.jvmArgs,
@@ -59,9 +59,9 @@ export function TemplateModal({ open, onClose }: Props) {
       autoRestart: tpl.defaults.autoRestart,
       autoRestartInterval: tpl.defaults.autoRestartInterval,
       color: tpl.defaults.color,
-    })
-    onClose()
-  }
+    });
+    onClose();
+  };
 
   const filtered =
     templates?.filter(
@@ -70,15 +70,15 @@ export function TemplateModal({ open, onClose }: Props) {
         e.template.name.toLowerCase().includes(filter.toLowerCase()) ||
         e.template.category.toLowerCase().includes(filter.toLowerCase()) ||
         e.template.tags.some((t) => t.toLowerCase().includes(filter.toLowerCase()))
-    ) ?? []
+    ) ?? [];
 
   // Group by category
   const grouped = filtered.reduce<Record<string, TemplateEntry[]>>((acc, e) => {
-    const cat = e.template.category || 'Other'
-    if (!acc[cat]) acc[cat] = []
-    acc[cat].push(e)
-    return acc
-  }, {})
+    const cat = e.template.category || 'Other';
+    if (!acc[cat]) acc[cat] = [];
+    acc[cat].push(e);
+    return acc;
+  }, {});
 
   return (
     <Modal open={open} onClose={onClose} title="Profile Templates" width="lg">
@@ -124,7 +124,7 @@ export function TemplateModal({ open, onClose }: Props) {
                   {cat}
                 </p>
                 {entries.map((entry) => {
-                  const compat = isCompatible(entry.template)
+                  const compat = isCompatible(entry.template);
                   return (
                     <button
                       key={entry.filename}
@@ -146,7 +146,7 @@ export function TemplateModal({ open, onClose }: Props) {
                         </span>
                       )}
                     </button>
-                  )
+                  );
                 })}
               </div>
             ))}
@@ -241,7 +241,7 @@ export function TemplateModal({ open, onClose }: Props) {
         </div>
       </div>
     </Modal>
-  )
+  );
 }
 
 function Section({ title, children }: { title: string; children: React.ReactNode }) {
@@ -250,7 +250,7 @@ function Section({ title, children }: { title: string; children: React.ReactNode
       <p className="text-xs font-mono text-text-muted uppercase tracking-widest">{title}</p>
       <div className="flex flex-wrap gap-1.5">{children}</div>
     </div>
-  )
+  );
 }
 
 function Pill({ value, enabled }: { value: string; enabled: boolean }) {
@@ -265,12 +265,12 @@ function Pill({ value, enabled }: { value: string; enabled: boolean }) {
     >
       {value}
     </span>
-  )
+  );
 }
 
 function Divider() {
-  return <div className="border-t border-surface-border" />
+  return <div className="border-t border-surface-border" />;
 }
 function Empty() {
-  return <span className="text-xs text-text-muted font-mono italic">none</span>
+  return <span className="text-xs text-text-muted font-mono italic">none</span>;
 }
diff --git a/src/renderer/components/settings/SettingsTab.tsx b/src/renderer/components/settings/SettingsTab.tsx
index 5ced91e..13afb75 100644
--- a/src/renderer/components/settings/SettingsTab.tsx
+++ b/src/renderer/components/settings/SettingsTab.tsx
@@ -1,38 +1,76 @@
-import React, { useState, useEffect, useMemo } from 'react'
-import { useApp } from '../../store/AppStore'
-import { Button } from '../common/Button'
-import { Toggle } from '../common/Toggle'
-import { VersionChecker } from './version/VersionChecker'
-import type { AppSettings } from '../../types'
-import { REST_API_CONFIG } from '../../../main/shared/config/RestApi.config'
-import { version } from '../../../../package.json'
+import React, { useState, useEffect, useMemo } from 'react';
+import { useApp } from '../../store/AppStore';
+import { Button } from '../common/Button';
+import { Toggle } from '../common/Toggle';
+import { VersionChecker } from './version/VersionChecker';
+import { REST_API_CONFIG } from '../../../main/shared/config/API.config';
+import { version } from '../../../../package.json';
+import { AppSettings, JRCEnvironment } from '../../../main/shared/types/App.types';
 
 export function SettingsTab() {
-  const { state, saveSettings } = useApp()
-  const [draft, setDraft] = useState<AppSettings | null>(null)
-  const [saved, setSaved] = useState(false)
+  const { state, saveSettings } = useApp();
+  const [draft, setDraft] = useState<AppSettings | null>(null);
+  const [saved, setSaved] = useState(false);
+
+  const set = (patch: Partial<AppSettings>) => {
+    setSaved(false);
+    setDraft((prev) => (prev ? { ...prev, ...patch } : prev));
+  };
 
   useEffect(() => {
-    if (state.settings) setDraft({ ...state.settings })
-  }, [state.settings])
+    if (!state.settings) return;
 
-  const isDirty = useMemo(() => {
-    if (!draft || !state.settings) return false
-    return JSON.stringify(draft) !== JSON.stringify(state.settings)
-  }, [draft, state.settings])
+    setDraft((prev) => {
+      if (!prev) return state.settings;
 
-  if (!draft) return null
+      // keep user changes, but refresh from store
+      return {
+        ...state.settings,
+        ...prev,
+        devModeEnabled: prev.devModeEnabled, // external wins
+      };
+    });
+  }, [state.settings]);
 
-  const set = (patch: Partial<AppSettings>) => {
-    setSaved(false)
-    setDraft((prev) => (prev ? { ...prev, ...patch } : prev))
-  }
+  useEffect(() => {
+    const listener = async (e: JRCEnvironment) => {
+      setSaved(false);
+
+      setDraft((prev) => {
+        if (!prev) return prev;
+        if (prev.devModeEnabled === e.devMode) return prev;
+
+        return {
+          ...prev,
+          devModeEnabled: e.devMode,
+        };
+      });
+
+      // 🔥 sync to store so isDirty stays correct
+      if (state.settings && state.settings.devModeEnabled !== e.devMode) {
+        await saveSettings({
+          ...state.settings,
+          devModeEnabled: e.devMode,
+        });
+      }
+    };
+
+    window.env.onChange(listener);
+  }, [state.settings, saveSettings]);
+
+  const isDirty = useMemo(() => {
+    if (!draft || !state.settings) return false;
+    return JSON.stringify(draft) !== JSON.stringify(state.settings);
+  }, [draft, state.settings]);
+
+  if (!draft) return null;
 
   const handleSave = async () => {
-    await saveSettings(draft)
-    setSaved(true)
-    setTimeout(() => setSaved(false), 2000)
-  }
+    await saveSettings(draft);
+    window.env.reload();
+    setSaved(true);
+    setTimeout(() => setSaved(false), 2000);
+  };
 
   return (
     <div className="flex flex-col h-full">
@@ -133,7 +171,13 @@ export function SettingsTab() {
 
           <Divider />
 
-          <Section title="REST API">
+          <Section title="Developer Options">
+            <Row
+              label="Toggle Developer Mode (Right-Shift + 7)"
+              hint="Enables the Developer tab and DevTools. Warning: may expose sensitive information and powerful features. Use with caution."
+            >
+              <Toggle checked={draft.devModeEnabled} onChange={(v) => set({ devModeEnabled: v })} />
+            </Row>
             <Row
               label="Enable REST API"
               hint={`Exposes a local HTTP API for automation (default port ${REST_API_CONFIG.defaultPort})`}
@@ -155,7 +199,9 @@ export function SettingsTab() {
               <div className="rounded-lg border border-surface-border bg-base-900/50 px-3 py-2.5 pl-5">
                 <p className="text-xs text-text-muted font-mono">
                   Listening on{' '}
-                  <span className="text-accent">http://127.0.0.1:{draft.restApiPort}/api</span>
+                  <span className="text-accent">
+                    http://{REST_API_CONFIG.host}:{draft.restApiPort}/api
+                  </span>
                 </p>
                 <p className="text-xs text-text-muted font-mono mt-0.5">
                   Endpoints: /status · /profiles · /processes · /settings
@@ -181,7 +227,7 @@ export function SettingsTab() {
         </div>
       </div>
     </div>
-  )
+  );
 }
 
 function Section({ title, children }: { title: string; children: React.ReactNode }) {
@@ -190,7 +236,7 @@ function Section({ title, children }: { title: string; children: React.ReactNode
       <h3 className="text-xs font-mono text-text-muted uppercase tracking-widest mb-4">{title}</h3>
       <div className="space-y-0 divide-y divide-surface-border/50">{children}</div>
     </div>
-  )
+  );
 }
 
 function Row({
@@ -199,10 +245,10 @@ function Row({
   sub,
   children,
 }: {
-  label: string
-  hint?: string
-  sub?: boolean
-  children?: React.ReactNode
+  label: string;
+  hint?: string;
+  sub?: boolean;
+  children?: React.ReactNode;
 }) {
   return (
     <div
@@ -214,11 +260,11 @@ function Row({
       </div>
       {children && <div className="shrink-0">{children}</div>}
     </div>
-  )
+  );
 }
 
 function Divider() {
-  return <div className="border-t border-surface-border" />
+  return <div className="border-t border-surface-border" />;
 }
 
 function NumInput({
@@ -228,11 +274,11 @@ function NumInput({
   step,
   onChange,
 }: {
-  value: number
-  min: number
-  max: number
-  step: number
-  onChange: (v: number) => void
+  value: number;
+  min: number;
+  max: number;
+  step: number;
+  onChange: (v: number) => void;
 }) {
   return (
     <input
@@ -244,5 +290,5 @@ function NumInput({
       onChange={(e) => onChange(Number(e.target.value))}
       className="w-24 bg-transparent border border-surface-border rounded-md px-2.5 py-1.5 text-sm font-mono text-text-primary text-right focus:outline-none focus:border-accent/40 transition-colors"
     />
-  )
+  );
 }
diff --git a/src/renderer/components/settings/version/ReleaseModal.tsx b/src/renderer/components/settings/version/ReleaseModal.tsx
index 44a9572..fd7439c 100644
--- a/src/renderer/components/settings/version/ReleaseModal.tsx
+++ b/src/renderer/components/settings/version/ReleaseModal.tsx
@@ -1,7 +1,6 @@
-import React, { useState, useEffect, useCallback } from 'react'
-import { Modal } from '../../common/Modal'
-import { Button } from '../../common/Button'
-import type { GitHubRelease, GitHubAsset } from '../../../types'
+import React, { useState, useEffect, useCallback } from 'react';
+import { Modal } from '../../common/Modal';
+import { Button } from '../../common/Button';
 import {
   VscPackage,
   VscGithub,
@@ -12,28 +11,29 @@ import {
   VscDebugPause,
   VscDebugContinue,
   VscClose,
-} from 'react-icons/vsc'
-import { LuDownload, LuExternalLink, LuCheck, LuRotateCcw } from 'react-icons/lu'
+} from 'react-icons/vsc';
+import { LuDownload, LuExternalLink, LuCheck, LuRotateCcw } from 'react-icons/lu';
+import { GitHubAsset, GitHubRelease } from '../../../../main/shared/types/GitHub.types';
 
 interface Props {
-  release: GitHubRelease
-  open: boolean
-  onClose: () => void
+  release: GitHubRelease;
+  open: boolean;
+  onClose: () => void;
 }
 
 interface DownloadProgress {
-  filename: string
-  bytesWritten: number
-  totalBytes: number
-  percent: number
-  status: 'downloading' | 'paused' | 'done' | 'error' | 'cancelled'
-  error?: string
+  filename: string;
+  bytesWritten: number;
+  totalBytes: number;
+  percent: number;
+  status: 'downloading' | 'paused' | 'done' | 'error' | 'cancelled';
+  error?: string;
 }
 
 function formatBytes(bytes: number): string {
-  if (bytes < 1024) return `${bytes} B`
-  if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)} KB`
-  return `${(bytes / 1024 / 1024).toFixed(1)} MB`
+  if (bytes < 1024) return `${bytes} B`;
+  if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)} KB`;
+  return `${(bytes / 1024 / 1024).toFixed(1)} MB`;
 }
 
 function formatDate(iso: string): string {
@@ -41,24 +41,24 @@ function formatDate(iso: string): string {
     year: 'numeric',
     month: 'long',
     day: 'numeric',
-  })
+  });
 }
 
 function getPlatformAsset(assets?: GitHubAsset[]): GitHubAsset | undefined {
-  if (!assets || !Array.isArray(assets)) return undefined
+  if (!assets || !Array.isArray(assets)) return undefined;
   return (
     assets.find((a) => a.name.endsWith('.exe') || a.name.endsWith('.msi')) ??
     assets.find((a) => a.name.endsWith('.dmg') || a.name.endsWith('.pkg')) ??
     assets.find((a) => a.name.endsWith('.AppImage') || a.name.endsWith('.deb'))
-  )
+  );
 }
 
 function DownloadProgressBar({ progress }: { progress: DownloadProgress }) {
-  const { status, percent, bytesWritten, totalBytes, error } = progress
-  const isDone = status === 'done'
-  const isError = status === 'error'
-  const isPaused = status === 'paused'
-  const isCancelled = status === 'cancelled'
+  const { status, percent, bytesWritten, totalBytes, error } = progress;
+  const isDone = status === 'done';
+  const isError = status === 'error';
+  const isPaused = status === 'paused';
+  const isCancelled = status === 'cancelled';
 
   const barColor =
     isError || isCancelled
@@ -67,7 +67,7 @@ function DownloadProgressBar({ progress }: { progress: DownloadProgress }) {
         ? 'bg-green-500'
         : isPaused
           ? 'bg-yellow-400'
-          : 'bg-accent'
+          : 'bg-accent';
 
   const label = isError
     ? (error ?? 'Error')
@@ -77,9 +77,9 @@ function DownloadProgressBar({ progress }: { progress: DownloadProgress }) {
         ? 'Complete'
         : isPaused
           ? 'Paused'
-          : `${formatBytes(bytesWritten)}${totalBytes > 0 ? ` / ${formatBytes(totalBytes)}` : ''}`
+          : `${formatBytes(bytesWritten)}${totalBytes > 0 ? ` / ${formatBytes(totalBytes)}` : ''}`;
 
-  const percentLabel = isDone ? '100%' : `${percent}%`
+  const percentLabel = isDone ? '100%' : `${percent}%`;
 
   const percentColor = isDone
     ? 'text-green-400'
@@ -87,7 +87,7 @@ function DownloadProgressBar({ progress }: { progress: DownloadProgress }) {
       ? 'text-red-400'
       : isPaused
         ? 'text-yellow-400'
-        : 'text-accent'
+        : 'text-accent';
 
   return (
     <div className="mt-2 space-y-1">
@@ -104,63 +104,63 @@ function DownloadProgressBar({ progress }: { progress: DownloadProgress }) {
         <span className={percentColor}>{percentLabel}</span>
       </div>
     </div>
-  )
+  );
 }
 
 export function ReleaseModal({ release, open, onClose }: Props) {
-  const [downloads, setDownloads] = useState<Map<string, DownloadProgress>>(new Map())
+  const [downloads, setDownloads] = useState<Map<string, DownloadProgress>>(new Map());
 
   const updateDownload = useCallback((payload: DownloadProgress) => {
-    setDownloads((prev) => new Map(prev).set(payload.filename, payload))
-  }, [])
+    setDownloads((prev) => new Map(prev).set(payload.filename, payload));
+  }, []);
 
   const resetDownload = useCallback((filename: string) => {
     setDownloads((prev) => {
-      const next = new Map(prev)
-      next.delete(filename)
-      return next
-    })
-  }, [])
+      const next = new Map(prev);
+      next.delete(filename);
+      return next;
+    });
+  }, []);
 
   useEffect(() => {
     const unsub = window.api.onDownloadProgress((progress: DownloadProgress) => {
-      updateDownload(progress)
-    })
-    return () => unsub()
-  }, [updateDownload])
+      updateDownload(progress);
+    });
+    return () => unsub();
+  }, [updateDownload]);
 
-  const platformAsset = getPlatformAsset(release.assets)
+  const platformAsset = getPlatformAsset(release.assets);
 
   const handleDownload = async (asset: GitHubAsset) => {
     // Don't touch download state here — main process drives everything via events
-    await window.api.downloadAsset(asset.browser_download_url, asset.name)
-  }
+    await window.api.downloadAsset(asset.browser_download_url, asset.name);
+  };
 
   const handlePause = async (filename: string) => {
-    const dl = downloads.get(filename)
-    if (!dl) return
+    const dl = downloads.get(filename);
+    if (!dl) return;
     if (dl.status === 'paused') {
-      await window.api.resumeDownload(filename)
+      await window.api.resumeDownload(filename);
     } else {
-      await window.api.pauseDownload(filename)
+      await window.api.pauseDownload(filename);
     }
     // State update comes from the progress event sent by main
-  }
+  };
 
   const handleCancel = async (filename: string) => {
-    await window.api.cancelDownload(filename)
+    await window.api.cancelDownload(filename);
     // State update comes from the progress event sent by main
-  }
+  };
 
-  const getDl = (name: string) => downloads.get(name)
+  const getDl = (name: string) => downloads.get(name);
   const isActive = (name: string) => {
-    const s = downloads.get(name)?.status
-    return s === 'downloading' || s === 'paused'
-  }
+    const s = downloads.get(name)?.status;
+    return s === 'downloading' || s === 'paused';
+  };
 
   const renderControls = (asset: GitHubAsset, variant: 'primary' | 'ghost') => {
-    const dl = getDl(asset.name)
-    const active = isActive(asset.name)
+    const dl = getDl(asset.name);
+    const active = isActive(asset.name);
 
     return (
       <div className="flex items-center gap-1.5 shrink-0">
@@ -210,8 +210,8 @@ export function ReleaseModal({ release, open, onClose }: Props) {
             variant={variant}
             size="sm"
             onClick={() => {
-              resetDownload(asset.name)
-              handleDownload(asset)
+              resetDownload(asset.name);
+              handleDownload(asset);
             }}
           >
             Retry
@@ -225,10 +225,10 @@ export function ReleaseModal({ release, open, onClose }: Props) {
           </Button>
         )}
       </div>
-    )
-  }
+    );
+  };
 
-  const bodyLines = (release.body ?? '').split('\n')
+  const bodyLines = (release.body ?? '').split('\n');
 
   return (
     <Modal open={open} onClose={onClose} title="Release Details" width="xl">
@@ -310,34 +310,34 @@ export function ReleaseModal({ release, open, onClose }: Props) {
             </p>
             <div className="rounded-lg border border-surface-border bg-base-950 px-4 py-3 space-y-1 max-h-48 overflow-y-auto">
               {bodyLines.map((line, i) => {
-                const h2 = line.startsWith('## ')
-                const h3 = line.startsWith('### ')
-                const li = line.startsWith('- ') || line.startsWith('* ')
-                if (!line.trim()) return <div key={i} className="h-1" />
+                const h2 = line.startsWith('## ');
+                const h3 = line.startsWith('### ');
+                const li = line.startsWith('- ') || line.startsWith('* ');
+                if (!line.trim()) return <div key={i} className="h-1" />;
                 if (h2)
                   return (
                     <p key={i} className="text-xs font-semibold text-text-primary pt-1">
                       {line.slice(3)}
                     </p>
-                  )
+                  );
                 if (h3)
                   return (
                     <p key={i} className="text-xs font-medium text-text-secondary">
                       {line.slice(4)}
                     </p>
-                  )
+                  );
                 if (li)
                   return (
                     <div key={i} className="flex gap-2 text-xs text-text-secondary font-mono">
                       <span className="text-accent shrink-0">·</span>
                       <span>{line.slice(2)}</span>
                     </div>
-                  )
+                  );
                 return (
                   <p key={i} className="text-xs text-text-muted font-mono">
                     {line}
                   </p>
-                )
+                );
               })}
             </div>
           </div>
@@ -392,5 +392,5 @@ export function ReleaseModal({ release, open, onClose }: Props) {
         </div>
       </div>
     </Modal>
-  )
+  );
 }
diff --git a/src/renderer/components/settings/version/VersionChecker.tsx b/src/renderer/components/settings/version/VersionChecker.tsx
index 10657fc..10a23fa 100644
--- a/src/renderer/components/settings/version/VersionChecker.tsx
+++ b/src/renderer/components/settings/version/VersionChecker.tsx
@@ -1,44 +1,44 @@
-import React, { useState, useCallback } from 'react'
-import { Button } from '../../common/Button'
-import { Tooltip } from '../../common/Tooltip'
-import { ReleaseModal } from './ReleaseModal'
-import type { GitHubRelease } from '../../../types'
-import { VscCheck, VscWarning, VscSync, VscCircleSlash } from 'react-icons/vsc'
+import React, { useState, useCallback } from 'react';
+import { Button } from '../../common/Button';
+import { Tooltip } from '../../common/Tooltip';
+import { ReleaseModal } from './ReleaseModal';
+import { VscCheck, VscWarning, VscSync, VscCircleSlash } from 'react-icons/vsc';
+import { GitHubRelease } from '../../../../main/shared/types/GitHub.types';
 
 interface Props {
-  currentVersion: string
+  currentVersion: string;
 }
 
-type CheckState = 'idle' | 'checking' | 'up-to-date' | 'update-available' | 'error'
+type CheckState = 'idle' | 'checking' | 'up-to-date' | 'update-available' | 'error';
 
 function semverGt(a: string, b: string): boolean {
-  const parse = (v: string) => v.replace(/^v/, '').split('.').map(Number)
-  const [am, an, ap] = parse(a)
-  const [bm, bn, bp] = parse(b)
-  if (am !== bm) return am > bm
-  if (an !== bn) return an > bn
-  return ap > bp
+  const parse = (v: string) => v.replace(/^v/, '').split('.').map(Number);
+  const [am, an, ap] = parse(a);
+  const [bm, bn, bp] = parse(b);
+  if (am !== bm) return am > bm;
+  if (an !== bn) return an > bn;
+  return ap > bp;
 }
 
 export function VersionChecker({ currentVersion }: Props) {
-  const [checkState, setCheckState] = useState<CheckState>('idle')
-  const [release, setRelease] = useState<GitHubRelease | null>(null)
-  const [modalOpen, setModalOpen] = useState(false)
-  const [errorMsg, setErrorMsg] = useState<string | null>(null)
+  const [checkState, setCheckState] = useState<CheckState>('idle');
+  const [release, setRelease] = useState<GitHubRelease | null>(null);
+  const [modalOpen, setModalOpen] = useState(false);
+  const [errorMsg, setErrorMsg] = useState<string | null>(null);
 
   const check = useCallback(async () => {
-    setCheckState('checking')
-    setErrorMsg(null)
-    const res = await window.api.fetchLatestRelease()
+    setCheckState('checking');
+    setErrorMsg(null);
+    const res = await window.api.fetchLatestRelease();
     if (!res.ok || !res.data) {
-      setCheckState('error')
-      setErrorMsg(res.error ?? 'Could not reach GitHub')
-      return
+      setCheckState('error');
+      setErrorMsg(res.error ?? 'Could not reach GitHub');
+      return;
     }
-    setRelease(res.data)
-    const remoteVersion = (res.data.tag_name ?? '').replace(/^v/, '')
-    setCheckState(semverGt(remoteVersion, currentVersion) ? 'update-available' : 'up-to-date')
-  }, [currentVersion])
+    setRelease(res.data);
+    const remoteVersion = (res.data.tag_name ?? '').replace(/^v/, '');
+    setCheckState(semverGt(remoteVersion, currentVersion) ? 'update-available' : 'up-to-date');
+  }, [currentVersion]);
 
   const Icon = {
     idle: VscSync,
@@ -46,7 +46,7 @@ export function VersionChecker({ currentVersion }: Props) {
     'up-to-date': VscCheck,
     'update-available': VscWarning,
     error: VscCircleSlash,
-  }[checkState]
+  }[checkState];
 
   const iconColor = {
     idle: 'text-text-muted',
@@ -54,7 +54,7 @@ export function VersionChecker({ currentVersion }: Props) {
     'up-to-date': 'text-accent',
     'update-available': 'text-yellow-400',
     error: 'text-red-400',
-  }[checkState]
+  }[checkState];
 
   const tooltipContent = {
     idle: 'Click to check for updates',
@@ -64,16 +64,16 @@ export function VersionChecker({ currentVersion }: Props) {
       ? `${release.tag_name} is available — click for details`
       : 'Update available',
     error: errorMsg ?? 'Check failed',
-  }[checkState]
+  }[checkState];
 
   const handleClick = () => {
     if (checkState === 'idle' || checkState === 'error') {
-      check()
-      return
+      check();
+      return;
     }
     if ((checkState === 'up-to-date' || checkState === 'update-available') && release)
-      setModalOpen(true)
-  }
+      setModalOpen(true);
+  };
 
   return (
     <>
@@ -106,5 +106,5 @@ export function VersionChecker({ currentVersion }: Props) {
         <ReleaseModal release={release} open={modalOpen} onClose={() => setModalOpen(false)} />
       )}
     </>
-  )
+  );
 }
diff --git a/src/renderer/components/utils/ActivityLogPanel.tsx b/src/renderer/components/utils/ActivityLogPanel.tsx
index 5a17bd7..e5efbf1 100644
--- a/src/renderer/components/utils/ActivityLogPanel.tsx
+++ b/src/renderer/components/utils/ActivityLogPanel.tsx
@@ -1,23 +1,23 @@
-import React, { useState, useCallback } from 'react'
-import { Button } from '../common/Button'
-import { Dialog } from '../common/Dialog'
-import { VscListUnordered } from 'react-icons/vsc'
-import type { ProcessLogEntry } from '../../types'
+import React, { useState, useCallback } from 'react';
+import { Button } from '../common/Button';
+import { Dialog } from '../common/Dialog';
+import { VscListUnordered } from 'react-icons/vsc';
+import { ProcessLogEntry } from '../../../main/shared/types/Process.types';
 
 export function ActivityLogPanel() {
-  const [entries, setEntries] = useState<ProcessLogEntry[] | null>(null)
-  const [loading, setLoading] = useState(false)
-  const [confirmClear, setConfirmClear] = useState(false)
+  const [entries, setEntries] = useState<ProcessLogEntry[] | null>(null);
+  const [loading, setLoading] = useState(false);
+  const [confirmClear, setConfirmClear] = useState(false);
 
   const load = useCallback(async () => {
-    setLoading(true)
-    setEntries(await window.api.getProcessLog())
-    setLoading(false)
-  }, [])
+    setLoading(true);
+    setEntries(await window.api.getProcessLog());
+    setLoading(false);
+  }, []);
 
   React.useEffect(() => {
-    load()
-  }, [load])
+    load();
+  }, [load]);
 
   return (
     <>
@@ -66,19 +66,19 @@ export function ActivityLogPanel() {
         confirmLabel="Clear"
         danger
         onConfirm={async () => {
-          await window.api.clearProcessLog()
-          setEntries([])
-          setConfirmClear(false)
+          await window.api.clearProcessLog();
+          setEntries([]);
+          setConfirmClear(false);
         }}
         onCancel={() => setConfirmClear(false)}
       />
     </>
-  )
+  );
 }
 
 function LogEntryRow({ entry }: { entry: ProcessLogEntry }) {
-  const duration = entry.stoppedAt ? formatDuration(entry.stoppedAt - entry.startedAt) : null
-  const jarName = entry.jarPath.split(/[/\\]/).pop() ?? entry.jarPath
+  const duration = entry.stoppedAt ? formatDuration(entry.stoppedAt - entry.startedAt) : null;
+  const jarName = entry.jarPath.split(/[/\\]/).pop() ?? entry.jarPath;
 
   return (
     <div className="rounded-lg border border-surface-border bg-base-900 px-3 py-2.5">
@@ -118,7 +118,7 @@ function LogEntryRow({ entry }: { entry: ProcessLogEntry }) {
         </div>
       </div>
     </div>
-  )
+  );
 }
 
 function EmptyState({ icon, text }: { icon: React.ReactNode; text: string }) {
@@ -127,7 +127,7 @@ function EmptyState({ icon, text }: { icon: React.ReactNode; text: string }) {
       {icon}
       <p className="text-xs font-mono text-center max-w-xs leading-relaxed">{text}</p>
     </div>
-  )
+  );
 }
 
 function formatTime(ts: number): string {
@@ -135,12 +135,12 @@ function formatTime(ts: number): string {
     hour: '2-digit',
     minute: '2-digit',
     second: '2-digit',
-  })
+  });
 }
 
 function formatDuration(ms: number): string {
-  const s = Math.floor(ms / 1000)
-  if (s < 60) return `${s}s`
-  if (s < 3600) return `${Math.floor(s / 60)}m ${s % 60}s`
-  return `${Math.floor(s / 3600)}h ${Math.floor((s % 3600) / 60)}m`
+  const s = Math.floor(ms / 1000);
+  if (s < 60) return `${s}s`;
+  if (s < 3600) return `${Math.floor(s / 60)}m ${s % 60}s`;
+  return `${Math.floor(s / 3600)}h ${Math.floor((s % 3600) / 60)}m`;
 }
diff --git a/src/renderer/components/utils/ScannerPanel.tsx b/src/renderer/components/utils/ScannerPanel.tsx
index 38cdf06..51c94a9 100644
--- a/src/renderer/components/utils/ScannerPanel.tsx
+++ b/src/renderer/components/utils/ScannerPanel.tsx
@@ -1,66 +1,66 @@
-import React, { useState, useCallback } from 'react'
-import { Button } from '../common/Button'
-import { Dialog } from '../common/Dialog'
-import { VscCheck } from 'react-icons/vsc'
-import { LuScanLine } from 'react-icons/lu'
-import type { JavaProcessInfo } from '../../types'
+import React, { useState, useCallback } from 'react';
+import { Button } from '../common/Button';
+import { Dialog } from '../common/Dialog';
+import { VscCheck } from 'react-icons/vsc';
+import { LuScanLine } from 'react-icons/lu';
+import { JavaProcessInfo } from '../../../main/shared/types/Process.types';
 
 interface KillIntent {
-  proc: JavaProcessInfo
-  nonJava: boolean
+  proc: JavaProcessInfo;
+  nonJava: boolean;
 }
 
-type Filter = 'java' | 'all'
+type Filter = 'java' | 'all';
 
 export function ScannerPanel() {
-  const [results, setResults] = useState<JavaProcessInfo[] | null>(null)
-  const [scanning, setScanning] = useState(false)
-  const [killIntent, setKillIntent] = useState<KillIntent | null>(null)
-  const [killAllConfirm, setKillAllConfirm] = useState(false)
-  const [statusMsg, setStatusMsg] = useState<{ text: string; ok: boolean } | null>(null)
-  const [killedPids, setKilledPids] = useState<Set<number>>(new Set())
-  const [filter, setFilter] = useState<Filter>('java')
-  const [search, setSearch] = useState('')
-  const [expandedPid, setExpandedPid] = useState<number | null>(null)
+  const [results, setResults] = useState<JavaProcessInfo[] | null>(null);
+  const [scanning, setScanning] = useState(false);
+  const [killIntent, setKillIntent] = useState<KillIntent | null>(null);
+  const [killAllConfirm, setKillAllConfirm] = useState(false);
+  const [statusMsg, setStatusMsg] = useState<{ text: string; ok: boolean } | null>(null);
+  const [killedPids, setKilledPids] = useState<Set<number>>(new Set());
+  const [filter, setFilter] = useState<Filter>('java');
+  const [search, setSearch] = useState('');
+  const [expandedPid, setExpandedPid] = useState<number | null>(null);
 
   const scan = useCallback(async () => {
-    setScanning(true)
-    setStatusMsg(null)
-    setKilledPids(new Set())
-    setSearch('')
-    setExpandedPid(null)
+    setScanning(true);
+    setStatusMsg(null);
+    setKilledPids(new Set());
+    setSearch('');
+    setExpandedPid(null);
 
-    const found = await window.api.scanAllProcesses()
-    setResults(found)
-    setScanning(false)
+    const found = await window.api.scanAllProcesses();
+    setResults(found);
+    setScanning(false);
 
-    const javaCount = found.filter((p) => p.isJava).length
-    setStatusMsg({ text: `Found ${found.length} processes — ${javaCount} java`, ok: true })
-  }, [])
+    const javaCount = found.filter((p) => p.isJava).length;
+    setStatusMsg({ text: `Found ${found.length} processes — ${javaCount} java`, ok: true });
+  }, []);
 
   const handleKill = async () => {
-    if (!killIntent) return
-    const res = await window.api.killPid(killIntent.proc.pid)
+    if (!killIntent) return;
+    const res = await window.api.killPid(killIntent.proc.pid);
     if (res.ok) {
-      setKilledPids((prev) => new Set([...prev, killIntent.proc.pid]))
-      setStatusMsg({ text: `Killed PID ${killIntent.proc.pid}`, ok: true })
+      setKilledPids((prev) => new Set([...prev, killIntent.proc.pid]));
+      setStatusMsg({ text: `Killed PID ${killIntent.proc.pid}`, ok: true });
     } else {
-      setStatusMsg({ text: `Failed to kill PID ${killIntent.proc.pid}: ${res.error}`, ok: false })
+      setStatusMsg({ text: `Failed to kill PID ${killIntent.proc.pid}: ${res.error}`, ok: false });
     }
-    setKillIntent(null)
-  }
+    setKillIntent(null);
+  };
 
   const handleKillAll = async () => {
-    const res = await window.api.killAllJava()
+    const res = await window.api.killAllJava();
     setStatusMsg({
       text: `Killed ${res.killed} java process${res.killed === 1 ? '' : 'es'}`,
       ok: true,
-    })
-    setKillAllConfirm(false)
-    setTimeout(scan, 800)
-  }
+    });
+    setKillAllConfirm(false);
+    setTimeout(scan, 800);
+  };
 
-  const searchLower = search.trim().toLowerCase()
+  const searchLower = search.trim().toLowerCase();
   const visible = results
     ? (filter === 'java' ? results.filter((r) => r.isJava) : results)
         .filter((r) => !killedPids.has(r.pid))
@@ -70,9 +70,9 @@ export function ScannerPanel() {
             r.command.toLowerCase().includes(searchLower) ||
             String(r.pid).includes(searchLower)
         )
-    : null
+    : null;
 
-  const javaVisible = visible?.some((r) => r.isJava) ?? false
+  const javaVisible = visible?.some((r) => r.isJava) ?? false;
 
   return (
     <div className="flex flex-col h-full">
@@ -170,7 +170,7 @@ export function ScannerPanel() {
         onCancel={() => setKillAllConfirm(false)}
       />
     </div>
-  )
+  );
 }
 
 function FilterToggle({ value, onChange }: { value: Filter; onChange: (f: Filter) => void }) {
@@ -191,7 +191,7 @@ function FilterToggle({ value, onChange }: { value: Filter; onChange: (f: Filter
         </button>
       ))}
     </div>
-  )
+  );
 }
 
 function ProcessRow({
@@ -200,10 +200,10 @@ function ProcessRow({
   onToggle,
   onKill,
 }: {
-  proc: JavaProcessInfo
-  expanded: boolean
-  onToggle: () => void
-  onKill: () => void
+  proc: JavaProcessInfo;
+  expanded: boolean;
+  onToggle: () => void;
+  onKill: () => void;
 }) {
   return (
     <div
@@ -270,7 +270,7 @@ function ProcessRow({
         </div>
       )}
     </div>
-  )
+  );
 }
 
 function ExpandChevron({ expanded, onClick }: { expanded: boolean; onClick: () => void }) {
@@ -292,7 +292,7 @@ function ExpandChevron({ expanded, onClick }: { expanded: boolean; onClick: () =
         <polyline points="3,2 7,5 3,8" />
       </svg>
     </button>
-  )
+  );
 }
 
 function DetailRow({
@@ -301,10 +301,10 @@ function DetailRow({
   mono,
   wrap,
 }: {
-  label: string
-  value: string
-  mono?: boolean
-  wrap?: boolean
+  label: string;
+  value: string;
+  mono?: boolean;
+  wrap?: boolean;
 }) {
   return (
     <div className="flex gap-3 text-xs">
@@ -319,7 +319,7 @@ function DetailRow({
         {value}
       </span>
     </div>
-  )
+  );
 }
 
 function EmptyState({ icon, text }: { icon: React.ReactNode; text: string }) {
@@ -328,5 +328,5 @@ function EmptyState({ icon, text }: { icon: React.ReactNode; text: string }) {
       {icon}
       <p className="text-xs font-mono text-center max-w-xs leading-relaxed">{text}</p>
     </div>
-  )
+  );
 }
diff --git a/src/renderer/components/utils/UtilitiesTab.tsx b/src/renderer/components/utils/UtilitiesTab.tsx
index 1221030..d736c7b 100644
--- a/src/renderer/components/utils/UtilitiesTab.tsx
+++ b/src/renderer/components/utils/UtilitiesTab.tsx
@@ -1,24 +1,19 @@
-/**
- * UtilitiesTab — Activity Log + Process Scanner.
- * Process Scanner: expandable rows, protected processes grayed out,
- * excluded from "Kill All Java".
- */
-import React, { useState, useCallback } from 'react'
-import { Dialog } from '../common/Dialog'
-import { Button } from '../common/Button'
-import { VscCheck, VscListUnordered } from 'react-icons/vsc'
-import { LuScanLine } from 'react-icons/lu'
-import type { ProcessLogEntry, JavaProcessInfo } from '../../types'
-
-type Panel = 'log' | 'scanner'
+import React, { useState, useCallback } from 'react';
+import { Dialog } from '../common/Dialog';
+import { Button } from '../common/Button';
+import { VscCheck, VscListUnordered } from 'react-icons/vsc';
+import { LuScanLine } from 'react-icons/lu';
+import { JavaProcessInfo, ProcessLogEntry } from '../../../main/shared/types/Process.types';
+
+type Panel = 'log' | 'scanner';
 
 const PANELS = [
   { id: 'log', label: 'Activity Log', Icon: VscListUnordered },
   { id: 'scanner', label: 'Process Scanner', Icon: LuScanLine },
-]
+];
 
 export function UtilitiesTab() {
-  const [panel, setPanel] = useState<Panel>('log')
+  const [panel, setPanel] = useState<Panel>('log');
   return (
     <div className="flex flex-col h-full">
       <div className="flex items-center gap-0 px-4 border-b border-surface-border bg-base-900 shrink-0">
@@ -43,25 +38,25 @@ export function UtilitiesTab() {
         {panel === 'scanner' && <ScannerPanel />}
       </div>
     </div>
-  )
+  );
 }
 
 // ── Activity Log ──────────────────────────────────────────────────────────────
 
 function ActivityLogPanel() {
-  const [entries, setEntries] = useState<ProcessLogEntry[] | null>(null)
-  const [loading, setLoading] = useState(false)
-  const [confirmClear, setConfirmClear] = useState(false)
+  const [entries, setEntries] = useState<ProcessLogEntry[] | null>(null);
+  const [loading, setLoading] = useState(false);
+  const [confirmClear, setConfirmClear] = useState(false);
 
   const load = useCallback(async () => {
-    setLoading(true)
-    setEntries(await window.api.getProcessLog())
-    setLoading(false)
-  }, [])
+    setLoading(true);
+    setEntries(await window.api.getProcessLog());
+    setLoading(false);
+  }, []);
 
   React.useEffect(() => {
-    load()
-  }, [load])
+    load();
+  }, [load]);
 
   return (
     <>
@@ -108,19 +103,19 @@ function ActivityLogPanel() {
         confirmLabel="Clear"
         danger
         onConfirm={async () => {
-          await window.api.clearProcessLog()
-          setEntries([])
-          setConfirmClear(false)
+          await window.api.clearProcessLog();
+          setEntries([]);
+          setConfirmClear(false);
         }}
         onCancel={() => setConfirmClear(false)}
       />
     </>
-  )
+  );
 }
 
 function LogEntryRow({ entry }: { entry: ProcessLogEntry }) {
-  const duration = entry.stoppedAt ? formatDuration(entry.stoppedAt - entry.startedAt) : null
-  const jarName = entry.jarPath.split(/[/\\]/).pop() ?? entry.jarPath
+  const duration = entry.stoppedAt ? formatDuration(entry.stoppedAt - entry.startedAt) : null;
+  const jarName = entry.jarPath.split(/[/\\]/).pop() ?? entry.jarPath;
   return (
     <div className="rounded-lg border border-surface-border bg-base-900 px-3 py-2.5">
       <div className="flex items-start justify-between gap-3">
@@ -159,63 +154,63 @@ function LogEntryRow({ entry }: { entry: ProcessLogEntry }) {
         </div>
       </div>
     </div>
-  )
+  );
 }
 
 // ── Process Scanner ───────────────────────────────────────────────────────────
 
 interface KillIntent {
-  proc: JavaProcessInfo
-  nonJava: boolean
+  proc: JavaProcessInfo;
+  nonJava: boolean;
 }
 
 function ScannerPanel() {
-  const [results, setResults] = useState<JavaProcessInfo[] | null>(null)
-  const [scanning, setScanning] = useState(false)
-  const [killIntent, setKillIntent] = useState<KillIntent | null>(null)
-  const [killAllConfirm, setKillAllConfirm] = useState(false)
-  const [statusMsg, setStatusMsg] = useState<{ text: string; ok: boolean } | null>(null)
-  const [killedPids, setKilledPids] = useState<Set<number>>(new Set())
-  const [filter, setFilter] = useState<'all' | 'java'>('java')
-  const [search, setSearch] = useState('')
-  const [expandedPid, setExpandedPid] = useState<number | null>(null)
+  const [results, setResults] = useState<JavaProcessInfo[] | null>(null);
+  const [scanning, setScanning] = useState(false);
+  const [killIntent, setKillIntent] = useState<KillIntent | null>(null);
+  const [killAllConfirm, setKillAllConfirm] = useState(false);
+  const [statusMsg, setStatusMsg] = useState<{ text: string; ok: boolean } | null>(null);
+  const [killedPids, setKilledPids] = useState<Set<number>>(new Set());
+  const [filter, setFilter] = useState<'all' | 'java'>('java');
+  const [search, setSearch] = useState('');
+  const [expandedPid, setExpandedPid] = useState<number | null>(null);
 
   const scan = useCallback(async () => {
-    setScanning(true)
-    setStatusMsg(null)
-    setKilledPids(new Set())
-    setSearch('')
-    setExpandedPid(null)
-    const found = await window.api.scanAllProcesses()
-    setResults(found)
-    setScanning(false)
-    const javaCount = found.filter((p) => p.isJava).length
-    setStatusMsg({ text: `Found ${found.length} processes - ${javaCount} java`, ok: true })
-  }, [])
+    setScanning(true);
+    setStatusMsg(null);
+    setKilledPids(new Set());
+    setSearch('');
+    setExpandedPid(null);
+    const found = await window.api.scanAllProcesses();
+    setResults(found);
+    setScanning(false);
+    const javaCount = found.filter((p) => p.isJava).length;
+    setStatusMsg({ text: `Found ${found.length} processes - ${javaCount} java`, ok: true });
+  }, []);
 
   const handleKill = async () => {
-    if (!killIntent) return
-    const res = await window.api.killPid(killIntent.proc.pid)
+    if (!killIntent) return;
+    const res = await window.api.killPid(killIntent.proc.pid);
     if (res.ok) {
-      setKilledPids((prev) => new Set([...prev, killIntent.proc.pid]))
-      setStatusMsg({ text: `Killed PID ${killIntent.proc.pid}`, ok: true })
+      setKilledPids((prev) => new Set([...prev, killIntent.proc.pid]));
+      setStatusMsg({ text: `Killed PID ${killIntent.proc.pid}`, ok: true });
     } else {
-      setStatusMsg({ text: `Failed to kill PID ${killIntent.proc.pid}: ${res.error}`, ok: false })
+      setStatusMsg({ text: `Failed to kill PID ${killIntent.proc.pid}: ${res.error}`, ok: false });
     }
-    setKillIntent(null)
-  }
+    setKillIntent(null);
+  };
 
   const handleKillAll = async () => {
-    const res = await window.api.killAllJava()
+    const res = await window.api.killAllJava();
     setStatusMsg({
       text: `Killed ${res.killed} java process${res.killed === 1 ? '' : 'es'} (protected processes skipped)`,
       ok: true,
-    })
-    setKillAllConfirm(false)
-    setTimeout(scan, 800)
-  }
+    });
+    setKillAllConfirm(false);
+    setTimeout(scan, 800);
+  };
 
-  const searchLower = search.trim().toLowerCase()
+  const searchLower = search.trim().toLowerCase();
   const visible = results
     ? (filter === 'java' ? results.filter((r) => r.isJava) : results)
         .filter((r) => !killedPids.has(r.pid))
@@ -225,10 +220,10 @@ function ScannerPanel() {
             r.command.toLowerCase().includes(searchLower) ||
             String(r.pid).includes(searchLower)
         )
-    : null
+    : null;
 
   // Only killable (non-protected) java processes shown in the "Kill All" button
-  const killableJavaVisible = visible?.some((r) => r.isJava && !r.protected) ?? false
+  const killableJavaVisible = visible?.some((r) => r.isJava && !r.protected) ?? false;
 
   return (
     <div className="flex flex-col h-full">
@@ -354,7 +349,7 @@ function ScannerPanel() {
         onCancel={() => setKillAllConfirm(false)}
       />
     </div>
-  )
+  );
 }
 
 function ProcessRow({
@@ -363,12 +358,12 @@ function ProcessRow({
   onToggle,
   onKill,
 }: {
-  proc: JavaProcessInfo
-  expanded: boolean
-  onToggle: () => void
-  onKill: () => void
+  proc: JavaProcessInfo;
+  expanded: boolean;
+  onToggle: () => void;
+  onKill: () => void;
 }) {
-  const isProtected = proc.protected
+  const isProtected = proc.protected;
 
   return (
     <div
@@ -464,7 +459,7 @@ function ProcessRow({
         </div>
       )}
     </div>
-  )
+  );
 }
 
 function DetailRow({
@@ -473,10 +468,10 @@ function DetailRow({
   mono,
   wrap,
 }: {
-  label: string
-  value: string
-  mono?: boolean
-  wrap?: boolean
+  label: string;
+  value: string;
+  mono?: boolean;
+  wrap?: boolean;
 }) {
   return (
     <div className="flex gap-3 text-xs">
@@ -491,7 +486,7 @@ function DetailRow({
         {value}
       </span>
     </div>
-  )
+  );
 }
 
 function EmptyState({ icon, text }: { icon: React.ReactNode; text: string }) {
@@ -500,7 +495,7 @@ function EmptyState({ icon, text }: { icon: React.ReactNode; text: string }) {
       {icon}
       <p className="text-xs font-mono text-center max-w-xs leading-relaxed">{text}</p>
     </div>
-  )
+  );
 }
 
 function formatTime(ts: number): string {
@@ -508,12 +503,12 @@ function formatTime(ts: number): string {
     hour: '2-digit',
     minute: '2-digit',
     second: '2-digit',
-  })
+  });
 }
 
 function formatDuration(ms: number): string {
-  const s = Math.floor(ms / 1000)
-  if (s < 60) return `${s}s`
-  if (s < 3600) return `${Math.floor(s / 60)}m ${s % 60}s`
-  return `${Math.floor(s / 3600)}h ${Math.floor((s % 3600) / 60)}m`
+  const s = Math.floor(ms / 1000);
+  if (s < 60) return `${s}s`;
+  if (s < 3600) return `${Math.floor(s / 60)}m ${s % 60}s`;
+  return `${Math.floor(s / 3600)}h ${Math.floor((s % 3600) / 60)}m`;
 }
diff --git a/src/renderer/global.d.ts b/src/renderer/global.d.ts
new file mode 100644
index 0000000..3d6f874
--- /dev/null
+++ b/src/renderer/global.d.ts
@@ -0,0 +1,9 @@
+// API type is fully inferred from the route definitions
+import type { API, Environment } from '../main/ipc/_index';
+
+declare global {
+  interface Window {
+    api: API;
+    env: Environment;
+  }
+}
diff --git a/src/renderer/hooks/useDevMode.ts b/src/renderer/hooks/useDevMode.ts
new file mode 100644
index 0000000..62998c1
--- /dev/null
+++ b/src/renderer/hooks/useDevMode.ts
@@ -0,0 +1,27 @@
+import { useState, useEffect } from 'react';
+import { JRCEnvironment } from 'src/main/shared/types/App.types';
+
+export function useDevMode(): boolean {
+  const [enabled, setEnabled] = useState(false);
+
+  useEffect(() => {
+    let mounted = true;
+
+    // fetch initial value
+    window.env.get().then((value) => {
+      if (mounted) setEnabled(value.devMode);
+    });
+
+    // subscribe to changes
+    const handler = (value: JRCEnvironment) => {
+      if (mounted) setEnabled(value.devMode);
+    };
+    window.env.onChange(handler);
+
+    return () => {
+      mounted = false;
+    };
+  }, []);
+
+  return enabled;
+}
diff --git a/src/renderer/index.html b/src/renderer/index.html
index 2b930ef..7e74d02 100644
--- a/src/renderer/index.html
+++ b/src/renderer/index.html
@@ -11,7 +11,7 @@
     style-src 'self' 'unsafe-inline';
     img-src 'self' data:;
     font-src 'self';
-    connect-src 'self';
+    connect-src 'self' http://127.0.0.1:* http://localhost:*;
   "
     />
     <title>Java Runner Client</title>
diff --git a/src/renderer/main.tsx b/src/renderer/main.tsx
index be88595..dfa8b77 100644
--- a/src/renderer/main.tsx
+++ b/src/renderer/main.tsx
@@ -1,9 +1,9 @@
-import React from 'react'
-import ReactDOM from 'react-dom/client'
-import App from './App'
-import './styles/globals.css'
+import React from 'react';
+import ReactDOM from 'react-dom/client';
+import App from './App';
+import './styles/globals.css';
 
-import { name, version } from '../../package.json'
+import { name, version } from '../../package.json';
 
 async function printVersionInfo() {
   console.log(
@@ -12,7 +12,7 @@ async function printVersionInfo() {
     'color: magenta;', // name
     'color: lightgreen;', // version
     'color: gray;' // reset
-  )
+  );
 }
 
 printVersionInfo().then(() => {
@@ -20,5 +20,5 @@ printVersionInfo().then(() => {
     <React.StrictMode>
       <App />
     </React.StrictMode>
-  )
-})
+  );
+});
diff --git a/src/renderer/store/AppStore.tsx b/src/renderer/store/AppStore.tsx
index 21bb094..ff12f55 100644
--- a/src/renderer/store/AppStore.tsx
+++ b/src/renderer/store/AppStore.tsx
@@ -5,41 +5,43 @@ import React, {
   useEffect,
   useCallback,
   type ReactNode,
-} from 'react'
-import { v4 as uuidv4 } from 'uuid'
-import type { Profile, AppSettings, ProcessState, ConsoleLine } from '../types'
+} from 'react';
+import { AppSettings } from '../../main/shared/types/App.types';
+import { ConsoleLine, ProcessState } from '../../main/shared/types/Process.types';
+import { Profile } from '../../main/shared/types/Profile.types';
+import { v4 as uuidv4 } from 'uuid';
 
-const SS_KEY = (id: string) => `jrc:console:${id}`
+const SS_KEY = (id: string) => `jrc:console:${id}`;
 function loadLogs(id: string, max: number): ConsoleLine[] {
   try {
-    const r = sessionStorage.getItem(SS_KEY(id))
-    return r ? (JSON.parse(r) as ConsoleLine[]).slice(-max) : []
+    const r = sessionStorage.getItem(SS_KEY(id));
+    return r ? (JSON.parse(r) as ConsoleLine[]).slice(-max) : [];
   } catch {
-    return []
+    return [];
   }
 }
 function saveLogs(id: string, lines: ConsoleLine[]): void {
   try {
-    sessionStorage.setItem(SS_KEY(id), JSON.stringify(lines))
+    sessionStorage.setItem(SS_KEY(id), JSON.stringify(lines));
   } catch {
     /* quota */
   }
 }
 function clearLogs(id: string): void {
   try {
-    sessionStorage.removeItem(SS_KEY(id))
+    sessionStorage.removeItem(SS_KEY(id));
   } catch {
     /* ignore */
   }
 }
 
 interface AppState {
-  profiles: Profile[]
-  activeProfileId: string
-  processStates: ProcessState[]
-  settings: AppSettings | null
-  consoleLogs: Record<string, ConsoleLine[]>
-  loading: boolean
+  profiles: Profile[];
+  activeProfileId: string;
+  processStates: ProcessState[];
+  settings: AppSettings | null;
+  consoleLogs: Record<string, ConsoleLine[]>;
+  loading: boolean;
 }
 
 const INITIAL_STATE: AppState = {
@@ -49,7 +51,7 @@ const INITIAL_STATE: AppState = {
   settings: null,
   consoleLogs: {},
   loading: true,
-}
+};
 
 type Action =
   | { type: 'INIT'; profiles: Profile[]; settings: AppSettings; states: ProcessState[] }
@@ -59,7 +61,7 @@ type Action =
   | { type: 'SET_SETTINGS'; settings: AppSettings }
   | { type: 'LOAD_LOG'; profileId: string; lines: ConsoleLine[] }
   | { type: 'APPEND_LOG'; profileId: string; line: ConsoleLine; maxLines: number }
-  | { type: 'CLEAR_LOG'; profileId: string }
+  | { type: 'CLEAR_LOG'; profileId: string };
 
 function reducer(state: AppState, action: Action): AppState {
   switch (action.type) {
@@ -71,112 +73,112 @@ function reducer(state: AppState, action: Action): AppState {
         processStates: action.states,
         settings: action.settings,
         loading: false,
-      }
+      };
     case 'SET_PROFILES':
-      return { ...state, profiles: action.profiles }
+      return { ...state, profiles: action.profiles };
     case 'SET_ACTIVE':
-      return { ...state, activeProfileId: action.id }
+      return { ...state, activeProfileId: action.id };
     case 'SET_STATES':
-      return { ...state, processStates: action.states }
+      return { ...state, processStates: action.states };
     case 'SET_SETTINGS':
-      return { ...state, settings: action.settings }
+      return { ...state, settings: action.settings };
     case 'LOAD_LOG':
-      return { ...state, consoleLogs: { ...state.consoleLogs, [action.profileId]: action.lines } }
+      return { ...state, consoleLogs: { ...state.consoleLogs, [action.profileId]: action.lines } };
     case 'APPEND_LOG': {
-      const prev = state.consoleLogs[action.profileId] ?? []
-      const next = [...prev, action.line]
+      const prev = state.consoleLogs[action.profileId] ?? [];
+      const next = [...prev, action.line];
       const trimmed =
-        next.length > action.maxLines ? next.slice(next.length - action.maxLines) : next
-      saveLogs(action.profileId, trimmed)
-      return { ...state, consoleLogs: { ...state.consoleLogs, [action.profileId]: trimmed } }
+        next.length > action.maxLines ? next.slice(next.length - action.maxLines) : next;
+      saveLogs(action.profileId, trimmed);
+      return { ...state, consoleLogs: { ...state.consoleLogs, [action.profileId]: trimmed } };
     }
     case 'CLEAR_LOG':
-      clearLogs(action.profileId)
-      return { ...state, consoleLogs: { ...state.consoleLogs, [action.profileId]: [] } }
+      clearLogs(action.profileId);
+      return { ...state, consoleLogs: { ...state.consoleLogs, [action.profileId]: [] } };
     default:
-      return state
+      return state;
   }
 }
 
 interface AppContextValue {
-  state: AppState
-  activeProfile: Profile | undefined
-  setActiveProfile: (id: string) => void
-  saveProfile: (p: Profile) => Promise<void>
-  deleteProfile: (id: string) => Promise<void>
-  createProfile: () => void
-  reorderProfiles: (profiles: Profile[]) => Promise<void>
-  startProcess: (p: Profile) => Promise<{ ok: boolean; error?: string }>
-  stopProcess: (id: string) => Promise<{ ok: boolean; error?: string }>
-  sendInput: (profileId: string, input: string) => Promise<void>
-  clearConsole: (profileId: string) => void
-  saveSettings: (s: AppSettings) => Promise<void>
-  isRunning: (profileId: string) => boolean
+  state: AppState;
+  activeProfile: Profile | undefined;
+  setActiveProfile: (id: string) => void;
+  saveProfile: (p: Profile) => Promise<void>;
+  deleteProfile: (id: string) => Promise<void>;
+  createProfile: (overrides?: Partial<Profile>) => void;
+  reorderProfiles: (profiles: Profile[]) => Promise<void>;
+  startProcess: (p: Profile) => Promise<{ ok: boolean; error?: string }>;
+  stopProcess: (id: string) => Promise<{ ok: boolean; error?: string }>;
+  sendInput: (profileId: string, input: string) => Promise<void>;
+  clearConsole: (profileId: string) => void;
+  saveSettings: (s: AppSettings) => Promise<void>;
+  isRunning: (profileId: string) => boolean;
 }
 
-const AppContext = createContext<AppContextValue | null>(null)
+const AppContext = createContext<AppContextValue | null>(null);
 
 export function AppProvider({ children }: { children: ReactNode }) {
-  const [state, dispatch] = useReducer(reducer, INITIAL_STATE)
+  const [state, dispatch] = useReducer(reducer, INITIAL_STATE);
 
   useEffect(() => {
-    if (!window.api) return
+    if (!window.api) return;
     async function init() {
       const [profiles, settings, states] = await Promise.all([
         window.api.getProfiles(),
         window.api.getSettings(),
         window.api.getStates(),
-      ])
-      dispatch({ type: 'INIT', profiles, settings, states })
-      const max = settings?.consoleMaxLines ?? 5000
+      ]);
+      dispatch({ type: 'INIT', profiles, settings, states });
+      const max = settings?.consoleMaxLines ?? 5000;
       for (const p of profiles) {
-        const lines = loadLogs(p.id, max)
-        if (lines.length > 0) dispatch({ type: 'LOAD_LOG', profileId: p.id, lines })
+        const lines = loadLogs(p.id, max);
+        if (lines.length > 0) dispatch({ type: 'LOAD_LOG', profileId: p.id, lines });
       }
     }
-    init()
-  }, [])
+    init();
+  }, []);
 
   useEffect(() => {
-    if (!window.api) return
-    const max = state.settings?.consoleMaxLines ?? 5000
+    if (!window.api) return;
+    const max = state.settings?.consoleMaxLines ?? 5000;
     return window.api.onConsoleLine((profileId: string, line: unknown) => {
-      dispatch({ type: 'APPEND_LOG', profileId, line: line as ConsoleLine, maxLines: max })
-    })
-  }, [state.settings?.consoleMaxLines])
+      dispatch({ type: 'APPEND_LOG', profileId, line: line as ConsoleLine, maxLines: max });
+    });
+  }, [state.settings?.consoleMaxLines]);
 
   useEffect(() => {
-    if (!window.api) return
+    if (!window.api) return;
     return window.api.onConsoleClear((profileId) => {
-      dispatch({ type: 'CLEAR_LOG', profileId })
-    })
-  }, [])
+      dispatch({ type: 'CLEAR_LOG', profileId });
+    });
+  }, []);
 
   useEffect(() => {
-    if (!window.api) return
-    return window.api.onStatesUpdate((states) => dispatch({ type: 'SET_STATES', states }))
-  }, [])
+    if (!window.api) return;
+    return window.api.onStatesUpdate((states) => dispatch({ type: 'SET_STATES', states }));
+  }, []);
 
-  const setActiveProfile = useCallback((id: string) => dispatch({ type: 'SET_ACTIVE', id }), [])
+  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 window.api.saveProfile(p);
+    dispatch({ type: 'SET_PROFILES', profiles: await window.api.getProfiles() });
+  }, []);
 
   const deleteProfile = useCallback(
     async (id: string) => {
-      clearLogs(id)
-      await window.api.deleteProfile(id)
-      const profiles = await window.api.getProfiles()
-      dispatch({ type: 'SET_PROFILES', profiles })
-      if (state.activeProfileId === id) dispatch({ type: 'SET_ACTIVE', id: profiles[0]?.id ?? '' })
+      clearLogs(id);
+      await window.api.deleteProfile(id);
+      const profiles = await window.api.getProfiles();
+      dispatch({ type: 'SET_PROFILES', profiles });
+      if (state.activeProfileId === id) dispatch({ type: 'SET_ACTIVE', id: profiles[0]?.id ?? '' });
     },
     [state.activeProfileId]
-  )
+  );
 
   const createProfile = useCallback(
-    (overrides: Partial<Profile> = {}) => {
+    async (overrides: Partial<Profile> = {}) => {
       const p: Profile = {
         id: uuidv4(),
         name: overrides.name ?? 'New Profile',
@@ -193,38 +195,37 @@ export function AppProvider({ children }: { children: ReactNode }) {
         order: state.profiles.length,
         createdAt: Date.now(),
         updatedAt: Date.now(),
-      }
-      dispatch({ type: 'SET_PROFILES', profiles: [...state.profiles, p] })
-      dispatch({ type: 'SET_ACTIVE', id: p.id })
-      window.api.saveProfile(p)
+      };
+      dispatch({ type: 'SET_PROFILES', profiles: [...state.profiles, p] });
+      dispatch({ type: 'SET_ACTIVE', id: p.id });
+      window.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))
-  }, [])
+    dispatch({ type: 'SET_PROFILES', profiles });
+    await window.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 sendInput = useCallback(
-    (profileId: string, input: string) => window.api.sendInput(profileId, input),
-    []
-  )
+  const startProcess = useCallback((p: Profile) => window.api.startProcess(p), []);
+  const stopProcess = useCallback((id: string) => window.api.stopProcess(id), []);
+  const sendInput = useCallback(async (profileId: string, input: string) => {
+    await window.api.sendInput(profileId, input);
+  }, []);
   const clearConsole = useCallback(
     (profileId: string) => dispatch({ type: 'CLEAR_LOG', profileId }),
     []
-  )
+  );
   const saveSettings = useCallback(async (s: AppSettings) => {
-    await window.api.saveSettings(s)
-    dispatch({ type: 'SET_SETTINGS', settings: s })
-  }, [])
+    await window.api.saveSettings(s);
+    dispatch({ type: 'SET_SETTINGS', settings: s });
+  }, []);
   const isRunning = useCallback(
     (profileId: string) => state.processStates.some((s) => s.profileId === profileId && s.running),
     [state.processStates]
-  )
-  const activeProfile = state.profiles.find((p) => p.id === state.activeProfileId)
+  );
+  const activeProfile = state.profiles.find((p) => p.id === state.activeProfileId);
 
   return (
     <AppContext.Provider
@@ -246,13 +247,13 @@ export function AppProvider({ children }: { children: ReactNode }) {
     >
       {children}
     </AppContext.Provider>
-  )
+  );
 }
 
 export function useApp(): AppContextValue {
-  const ctx = useContext(AppContext)
-  if (!ctx) throw new Error('useApp must be used within AppProvider')
-  return ctx
+  const ctx = useContext(AppContext);
+  if (!ctx) throw new Error('useApp must be used within AppProvider');
+  return ctx;
 }
 
 export const PROFILE_COLORS = [
@@ -264,4 +265,4 @@ export const PROFILE_COLORS = [
   '#34d399',
   '#fbbf24',
   '#f87171',
-]
+];
diff --git a/src/renderer/store/appReducer.ts b/src/renderer/store/appReducer.ts
index 6287272..ff0195e 100644
--- a/src/renderer/store/appReducer.ts
+++ b/src/renderer/store/appReducer.ts
@@ -1,13 +1,15 @@
-import type { Profile, AppSettings, ProcessState, ConsoleLine } from '../types'
-import { saveLogs, clearLogs } from './sessionLogs'
+import { Profile } from '../../main/shared/types/Profile.types';
+import { saveLogs, clearLogs } from './sessionLogs';
+import { ConsoleLine, ProcessState } from '../../main/shared/types/Process.types';
+import { AppSettings } from '../../main/shared/types/App.types';
 
 export interface AppState {
-  profiles: Profile[]
-  activeProfileId: string
-  processStates: ProcessState[]
-  settings: AppSettings | null
-  consoleLogs: Record<string, ConsoleLine[]>
-  loading: boolean
+  profiles: Profile[];
+  activeProfileId: string;
+  processStates: ProcessState[];
+  settings: AppSettings | null;
+  consoleLogs: Record<string, ConsoleLine[]>;
+  loading: boolean;
 }
 
 export const INITIAL_STATE: AppState = {
@@ -17,7 +19,7 @@ export const INITIAL_STATE: AppState = {
   settings: null,
   consoleLogs: {},
   loading: true,
-}
+};
 
 export type Action =
   | { type: 'INIT'; profiles: Profile[]; settings: AppSettings; states: ProcessState[] }
@@ -27,7 +29,7 @@ export type Action =
   | { type: 'SET_SETTINGS'; settings: AppSettings }
   | { type: 'LOAD_LOG'; profileId: string; lines: ConsoleLine[] }
   | { type: 'APPEND_LOG'; profileId: string; line: ConsoleLine; maxLines: number }
-  | { type: 'CLEAR_LOG'; profileId: string }
+  | { type: 'CLEAR_LOG'; profileId: string };
 
 export function reducer(state: AppState, action: Action): AppState {
   switch (action.type) {
@@ -39,37 +41,37 @@ export function reducer(state: AppState, action: Action): AppState {
         processStates: action.states,
         settings: action.settings,
         loading: false,
-      }
+      };
 
     case 'SET_PROFILES':
-      return { ...state, profiles: action.profiles }
+      return { ...state, profiles: action.profiles };
 
     case 'SET_ACTIVE':
-      return { ...state, activeProfileId: action.id }
+      return { ...state, activeProfileId: action.id };
 
     case 'SET_STATES':
-      return { ...state, processStates: action.states }
+      return { ...state, processStates: action.states };
 
     case 'SET_SETTINGS':
-      return { ...state, settings: action.settings }
+      return { ...state, settings: action.settings };
 
     case 'LOAD_LOG':
-      return { ...state, consoleLogs: { ...state.consoleLogs, [action.profileId]: action.lines } }
+      return { ...state, consoleLogs: { ...state.consoleLogs, [action.profileId]: action.lines } };
 
     case 'APPEND_LOG': {
-      const prev = state.consoleLogs[action.profileId] ?? []
-      const next = [...prev, action.line]
+      const prev = state.consoleLogs[action.profileId] ?? [];
+      const next = [...prev, action.line];
       const trimmed =
-        next.length > action.maxLines ? next.slice(next.length - action.maxLines) : next
-      saveLogs(action.profileId, trimmed)
-      return { ...state, consoleLogs: { ...state.consoleLogs, [action.profileId]: trimmed } }
+        next.length > action.maxLines ? next.slice(next.length - action.maxLines) : next;
+      saveLogs(action.profileId, trimmed);
+      return { ...state, consoleLogs: { ...state.consoleLogs, [action.profileId]: trimmed } };
     }
 
     case 'CLEAR_LOG':
-      clearLogs(action.profileId)
-      return { ...state, consoleLogs: { ...state.consoleLogs, [action.profileId]: [] } }
+      clearLogs(action.profileId);
+      return { ...state, consoleLogs: { ...state.consoleLogs, [action.profileId]: [] } };
 
     default:
-      return state
+      return state;
   }
 }
diff --git a/src/renderer/store/sessionLogs.ts b/src/renderer/store/sessionLogs.ts
index c93a989..5398d59 100644
--- a/src/renderer/store/sessionLogs.ts
+++ b/src/renderer/store/sessionLogs.ts
@@ -1,19 +1,19 @@
-import type { ConsoleLine } from '../types'
+import { ConsoleLine } from '../../main/shared/types/Process.types';
 
-const key = (id: string) => `jrc:console:${id}`
+const key = (id: string) => `jrc:console:${id}`;
 
 export function loadLogs(id: string, max: number): ConsoleLine[] {
   try {
-    const raw = sessionStorage.getItem(key(id))
-    return raw ? (JSON.parse(raw) as ConsoleLine[]).slice(-max) : []
+    const raw = sessionStorage.getItem(key(id));
+    return raw ? (JSON.parse(raw) as ConsoleLine[]).slice(-max) : [];
   } catch {
-    return []
+    return [];
   }
 }
 
 export function saveLogs(id: string, lines: ConsoleLine[]): void {
   try {
-    sessionStorage.setItem(key(id), JSON.stringify(lines))
+    sessionStorage.setItem(key(id), JSON.stringify(lines));
   } catch {
     /* quota */
   }
@@ -21,7 +21,7 @@ export function saveLogs(id: string, lines: ConsoleLine[]): void {
 
 export function clearLogs(id: string): void {
   try {
-    sessionStorage.removeItem(key(id))
+    sessionStorage.removeItem(key(id));
   } catch {
     /* ignore */
   }
diff --git a/src/renderer/types/index.ts b/src/renderer/types/index.ts
deleted file mode 100644
index 8c3accd..0000000
--- a/src/renderer/types/index.ts
+++ /dev/null
@@ -1,19 +0,0 @@
-export type {
-  Profile,
-  AppSettings,
-  ConsoleLine,
-  ProcessState,
-  ProcessLogEntry,
-  JavaProcessInfo,
-} from '../../main/shared/types'
-
-export type { GitHubRelease, GitHubAsset, ProfileTemplate } from '../../main/shared/GitHub.types'
-
-// API type is fully inferred from the route definitions — never write this by hand again.
-import type { API } from '../../main/ipc/_index'
-
-declare global {
-  interface Window {
-    api: API
-  }
-}
diff --git a/tailwind.config.js b/tailwind.config.js
index 0350ffb..9f77c71 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -21,4 +21,4 @@ module.exports = {
     },
   },
   plugins: [],
-}
+};
diff --git a/vite.config.ts b/vite.config.ts
index 624a6df..36ef9f6 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -1,8 +1,8 @@
-import { defineConfig } from 'vite'
-import react from '@vitejs/plugin-react'
-import path from 'path'
-import { readFileSync } from 'fs'
-const { version } = JSON.parse(readFileSync(path.resolve(__dirname, 'package.json'), 'utf-8'))
+import { defineConfig } from 'vite';
+import react from '@vitejs/plugin-react';
+import path from 'path';
+import { readFileSync } from 'fs';
+const { version } = JSON.parse(readFileSync(path.resolve(__dirname, 'package.json'), 'utf-8'));
 export default defineConfig({
   plugins: [react()],
   base: './',
@@ -27,4 +27,4 @@ export default defineConfig({
   },
   resolve: { alias: { '@': path.resolve(__dirname, 'src/renderer') } },
   server: { port: 5173 },
-})
+});