diff --git a/README.md b/README.md
index faa1f1c..4a43396 100755
--- a/README.md
+++ b/README.md
@@ -89,6 +89,13 @@ npm run build:linux
 npm run build:mac
 ```
 
+## Renderer Structure
+
+- `src/renderer/public/`: static HTML shell (`index.html`)
+- `src/renderer/styles/`: renderer stylesheet sources
+- `src/renderer/components/`, `context/`, `i18n/`: runtime renderer code
+- `src/assets/`: canonical app icons and static media assets
+
 ## Dev Container
 
 This repo includes `.devcontainer/` for a reproducible local environment.
diff --git a/package.json b/package.json
index 02a487f..e2f4c0d 100644
--- a/package.json
+++ b/package.json
@@ -35,9 +35,9 @@
     "test:patterns": "jest --config jest.config.js --testMatch=\"**/tests/**/*pattern*.test.{js,ts}\" --verbose",
     "test:lint": "npm run test && npm run lint:tests",
     "prewatch:css": "node scripts/ensure-build-dirs.js",
-    "watch:css": "npx @tailwindcss/cli -i ./src/renderer/styles.css -o ./dist/renderer/output.css --watch",
+    "watch:css": "npx @tailwindcss/cli -i ./src/renderer/styles/styles.css -o ./dist/renderer/output.css --watch",
     "prebuild:css": "node scripts/ensure-build-dirs.js",
-    "build:css": "npx @tailwindcss/cli -i ./src/renderer/styles.css -o ./dist/renderer/output.css",
+    "build:css": "npx @tailwindcss/cli -i ./src/renderer/styles/styles.css -o ./dist/renderer/output.css",
     "prepare": "husky install",
     "sonar": "node scripts/sonar-scan.js",
     "qa": "node scripts/index.js qa",
diff --git a/scripts/capture-ui-screenshot.js b/scripts/capture-ui-screenshot.js
index 4a8dbce..b1b6fc9 100644
--- a/scripts/capture-ui-screenshot.js
+++ b/scripts/capture-ui-screenshot.js
@@ -8,6 +8,7 @@ const { chromium } = require('playwright');
 const ROOT_DIR = path.join(__dirname, '..');
 const ASSETS_DIR = path.join(ROOT_DIR, 'src', 'assets');
 const RENDERER_SOURCE_DIR = path.join(ROOT_DIR, 'src', 'renderer');
+const RENDERER_PUBLIC_DIR = path.join(RENDERER_SOURCE_DIR, 'public');
 const RENDERER_BUILD_DIR = path.join(ROOT_DIR, 'dist', 'renderer');
 const DEFAULT_SCREENSHOT_DIR = path.join('dist', 'qa', 'screenshots');
 const SCREENSHOT_DIR = resolveOutputDirectory(process.env.UI_SCREENSHOT_DIR);
@@ -47,8 +48,8 @@ const MIME_TYPES = {
 };
 
 const STATIC_FILE_ROUTES = new Map([
-  ['/', path.join(RENDERER_SOURCE_DIR, 'index.html')],
-  ['/index.html', path.join(RENDERER_SOURCE_DIR, 'index.html')],
+  ['/', path.join(RENDERER_PUBLIC_DIR, 'index.html')],
+  ['/index.html', path.join(RENDERER_PUBLIC_DIR, 'index.html')],
   ['/assets/icon.png', path.join(ASSETS_DIR, 'icon.png')],
   ['/dist/renderer/output.css', path.join(RENDERER_BUILD_DIR, 'output.css')],
   ['/dist/renderer/bundle.js', path.join(RENDERER_BUILD_DIR, 'bundle.js')],
diff --git a/sonar-project.properties b/sonar-project.properties
index 372653e..f5de4dd 100644
--- a/sonar-project.properties
+++ b/sonar-project.properties
@@ -8,7 +8,7 @@ sonar.sources=src
 sonar.sourceEncoding=UTF-8
 
 # Excluded directories and files (avoid noise from tests, fixtures, generated assets)
-sonar.exclusions=node_modules/**,dist/**,coverage/**,tests/**,scripts/**,**/__tests__/**,**/*.test.js,**/*.test.jsx,**/*.test.ts,**/*.test.tsx,**/*.spec.js,**/*.spec.jsx,**/*.spec.ts,**/*.spec.tsx,src/renderer/styles.css
+sonar.exclusions=node_modules/**,dist/**,coverage/**,tests/**,scripts/**,**/__tests__/**,**/*.test.js,**/*.test.jsx,**/*.test.ts,**/*.test.tsx,**/*.spec.js,**/*.spec.jsx,**/*.spec.ts,**/*.spec.tsx,src/renderer/styles/styles.css
 
 # Test directories (kept for coverage mapping, excluded from issue noise)
 sonar.tests=tests,src/__tests__
diff --git a/src/main/index.ts b/src/main/index.ts
index f2b996c..ea1a936 100755
--- a/src/main/index.ts
+++ b/src/main/index.ts
@@ -66,7 +66,7 @@ let updaterService = createUpdaterService(
 );
 
 const APP_ROOT = path.resolve(__dirname, '../../..');
-const RENDERER_INDEX_PATH = path.join(APP_ROOT, 'src', 'renderer', 'index.html');
+const RENDERER_INDEX_PATH = path.join(APP_ROOT, 'src', 'renderer', 'public', 'index.html');
 const ASSETS_DIR = path.join(APP_ROOT, 'src', 'assets');
 const createForbiddenAssetResponse = (): Response => new Response('Forbidden', { status: 403 });
 
diff --git a/src/renderer/index.html b/src/renderer/public/index.html
similarity index 88%
rename from src/renderer/index.html
rename to src/renderer/public/index.html
index 63b639b..cdbaf09 100755
--- a/src/renderer/index.html
+++ b/src/renderer/public/index.html
@@ -4,7 +4,7 @@
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>AI Code Fusion</title>
-    <link rel="stylesheet" href="../../dist/renderer/output.css" />
+    <link rel="stylesheet" href="../../../dist/renderer/output.css" />
     <script>
       // Apply dark mode immediately to prevent flash of light theme
       const appWindow = globalThis;
@@ -25,6 +25,6 @@
     class="h-screen overflow-hidden bg-gray-100 dark:bg-gray-900 transition-colors duration-200"
   >
     <div id="app" class="h-full"></div>
-    <script src="../../dist/renderer/bundle.js"></script>
+    <script src="../../../dist/renderer/bundle.js"></script>
   </body>
 </html>
diff --git a/src/renderer/styles.css b/src/renderer/styles/styles.css
similarity index 91%
rename from src/renderer/styles.css
rename to src/renderer/styles/styles.css
index e0009d3..ef6f2f8 100755
--- a/src/renderer/styles.css
+++ b/src/renderer/styles/styles.css
@@ -1,7 +1,4 @@
-@config '../../tailwind.config.js';
 @import 'tailwindcss';
-@source './**/*.{js,jsx,ts,tsx}';
-@source './index.html';
 
 .file-tree {
   font-family:
diff --git a/tailwind.config.js b/tailwind.config.js
index 87dee32..769afc3 100755
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -1,5 +1,5 @@
 module.exports = {
-  content: ['./src/renderer/**/*.{js,jsx,ts,tsx}', './src/renderer/index.html'],
+  content: ['./src/renderer/**/*.{js,jsx,ts,tsx}', './src/renderer/public/index.html'],
   darkMode: 'class',
   theme: {
     extend: {},