diff --git a/index.html b/index.html
index 0773718..83f8327 100644
--- a/index.html
+++ b/index.html
@@ -2,15 +2,15 @@
 <html lang="en">
   <head>
     <meta charset="UTF-8" />
-    <link rel="icon" type="image/png" href="/favicon-96x96.png" sizes="96x96" />
-    <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
-    <link rel="shortcut icon" href="/favicon.ico" />
-    <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />
+    <link rel="icon" type="image/png" href="./favicon-96x96.png" sizes="96x96" />
+    <link rel="icon" type="image/svg+xml" href="./favicon.svg" />
+    <link rel="shortcut icon" href="./favicon.ico" />
+    <link rel="apple-touch-icon" sizes="180x180" href="./apple-touch-icon.png" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>K.G.Studio</title>
   </head>
   <body>
     <div id="root"></div>
-    <script type="module" src="/src/main.tsx"></script>
+    <script type="module" src="./src/main.tsx"></script>
   </body>
 </html>
diff --git a/src/agent/core/SystemPrompts.ts b/src/agent/core/SystemPrompts.ts
index c731ea3..1f20d2d 100644
--- a/src/agent/core/SystemPrompts.ts
+++ b/src/agent/core/SystemPrompts.ts
@@ -34,7 +34,7 @@ export class SystemPrompts {
     }
     
     try {
-      const response = await fetch('/prompts/system.md');
+      const response = await fetch(`${import.meta.env.BASE_URL}prompts/system.md`);
       if (!response.ok) {
         throw new Error(`Failed to load system prompt: ${response.status}`);
       }
diff --git a/src/components/InstrumentSelection.tsx b/src/components/InstrumentSelection.tsx
index 949c155..6d98609 100644
--- a/src/components/InstrumentSelection.tsx
+++ b/src/components/InstrumentSelection.tsx
@@ -65,7 +65,7 @@ const InstrumentSelection: React.FC = () => {
       <div className="instrument-selection-top">
         <div className="instrument-preview">
           <img
-            src={`/resources/instruments/${previewImage}`}
+            src={`${import.meta.env.BASE_URL}resources/instruments/${previewImage}`}
             alt={previewAlt.toString()}
             width={256}
             height={256}
diff --git a/src/components/Toolbar.tsx b/src/components/Toolbar.tsx
index 25457ab..242c3f9 100644
--- a/src/components/Toolbar.tsx
+++ b/src/components/Toolbar.tsx
@@ -675,7 +675,7 @@ const Toolbar: React.FC = () => {
       <div className="toolbar">
         <div className="toolbar-left">
           <div className="logo-container">
-            <img src="/logo.png" alt="DAW Logo" className="logo" />
+            <img src={`${import.meta.env.BASE_URL}logo.png`} alt="DAW Logo" className="logo" />
           </div>
           <div 
             className="project-name" 
diff --git a/src/components/track/TrackInfoItem.tsx b/src/components/track/TrackInfoItem.tsx
index e503a92..d697fe2 100644
--- a/src/components/track/TrackInfoItem.tsx
+++ b/src/components/track/TrackInfoItem.tsx
@@ -247,7 +247,7 @@ const TrackInfoItem: React.FC<TrackInfoItemProps> = ({
         <div className="track-name-and-volume">
           <div className="instrument-image">
             <img 
-              src={`/resources/instruments/${String(FLUIDR3_INSTRUMENT_MAP[currentInstrument as keyof typeof FLUIDR3_INSTRUMENT_MAP]?.image || 'piano.png')}`} 
+              src={`${import.meta.env.BASE_URL}resources/instruments/${String(FLUIDR3_INSTRUMENT_MAP[currentInstrument as keyof typeof FLUIDR3_INSTRUMENT_MAP]?.image || 'piano.png')}`} 
               alt={String(FLUIDR3_INSTRUMENT_MAP[currentInstrument as keyof typeof FLUIDR3_INSTRUMENT_MAP]?.displayName || currentInstrument)}
               width="64"
               height="64"
diff --git a/src/core/config/ConfigManager.ts b/src/core/config/ConfigManager.ts
index 7e588b4..e540827 100644
--- a/src/core/config/ConfigManager.ts
+++ b/src/core/config/ConfigManager.ts
@@ -137,7 +137,7 @@ export class ConfigManager {
    */
   private async loadDefaultConfig(): Promise<void> {
     try {
-      const response = await fetch('/config.json');
+      const response = await fetch(`${import.meta.env.BASE_URL}config.json`);
       if (!response.ok) {
         throw new Error(`Failed to fetch config.json: ${response.status}`);
       }
diff --git a/src/util/messageFilter/UserMessageFilter.ts b/src/util/messageFilter/UserMessageFilter.ts
index 7d4d856..47c9a4e 100644
--- a/src/util/messageFilter/UserMessageFilter.ts
+++ b/src/util/messageFilter/UserMessageFilter.ts
@@ -57,7 +57,7 @@ export async function processUserMessage(originalMessage: string): Promise<UserM
           const oaiCompatBaseUrl = (configManager.get('general.openai_compatible.base_url') as string) || '';
           const isNew = openaiKey.trim() === '' && oaiCompatKey.trim() === '' && oaiCompatBaseUrl.trim() === '';
 
-          const url = isNew ? '/chat/welcome_new.md' : '/chat/welcome_again.md';
+          const url = isNew ? `${import.meta.env.BASE_URL}chat/welcome_new.md` : `${import.meta.env.BASE_URL}chat/welcome_again.md`;
           const resp = await fetch(url);
           if (!resp.ok) {
             throw new Error(`Failed to fetch ${url}: ${resp.status}`);
@@ -110,7 +110,7 @@ export async function processUserMessage(originalMessage: string): Promise<UserM
       if (provider === 'openai') {
         const openaiKey = (configManager.get('general.openai.api_key') as string) || '';
         if (openaiKey.trim() === '') {
-          const url = '/chat/error_no_openai_key.md';
+          const url = `${import.meta.env.BASE_URL}chat/error_no_openai_key.md`;
           let md = 'OpenAI provider selected, but no API key configured.';
           try {
             const resp = await fetch(url);
@@ -129,7 +129,7 @@ export async function processUserMessage(originalMessage: string): Promise<UserM
       } else if (provider === 'openai_compatible') {
         const baseUrl = (configManager.get('general.openai_compatible.base_url') as string) || '';
         if (baseUrl.trim() === '') {
-          const url = '/chat/error_no_openai_compatible_base_url.md';
+          const url = `${import.meta.env.BASE_URL}chat/error_no_openai_compatible_base_url.md`;
           let md = 'OpenAI Compatible provider selected, but no Base URL configured.';
           try {
             const resp = await fetch(url);
@@ -148,7 +148,7 @@ export async function processUserMessage(originalMessage: string): Promise<UserM
 
         const model = (configManager.get('general.openai_compatible.model') as string) || '';
         if (model.trim() === '') {
-          const url = '/chat/error_no_openai_compatible_model.md';
+          const url = `${import.meta.env.BASE_URL}chat/error_no_openai_compatible_model.md`;
           let md = 'OpenAI Compatible provider selected, but no Model configured.';
           try {
             const resp = await fetch(url);
@@ -174,7 +174,7 @@ export async function processUserMessage(originalMessage: string): Promise<UserM
 
     if (!hasContextRegion) {
       // No region context: show guidance and do not send to LLM
-      const url = '/chat/error_no_selected_region.md';
+      const url = `${import.meta.env.BASE_URL}chat/error_no_selected_region.md`;
       let md = 'Please select a region or open a MIDI region in the piano roll before asking for editing.';
       try {
         const resp = await fetch(url);
@@ -198,7 +198,7 @@ export async function processUserMessage(originalMessage: string): Promise<UserM
     // Has region context: pass through, but append processed appendix to the LLM-bound message
     let appendix = '';
     try {
-      const resp = await fetch('/prompts/user_msg_appendix.md');
+      const resp = await fetch(`${import.meta.env.BASE_URL}prompts/user_msg_appendix.md`);
       if (resp.ok) {
         const rawAppendix = await resp.text();
         appendix = await SystemPrompts.getPromptWithContext(rawAppendix);
diff --git a/vite.config.ts b/vite.config.ts
index 8b0f57b..3c235bb 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -4,4 +4,5 @@ import react from '@vitejs/plugin-react'
 // https://vite.dev/config/
 export default defineConfig({
   plugins: [react()],
+  base: '/kgstudio/',
 })
