perf: lazy-load panel CSS by moving imports to component files

src/components/AiChatSidebar.tsx

@@ -1,5 +1,6 @@
 import { useState, useEffect, useCallback, useRef } from "react";
 import { invoke } from "@tauri-apps/api/core";
+import "../styles/ai-chat.css";
 
 /* ------------------------------------------------------------------ */
 /*  Types                                                              */

src/components/ClipboardHistory.tsx

@@ -1,6 +1,7 @@
 import { useState, useEffect, useCallback, useRef } from "react";
 import { invoke } from "@tauri-apps/api/core";
 import { Dialog, DialogContent } from "./ui/dialog";
+import "../styles/clipboard-history.css";
 
 interface ClipboardEntry {
   id: number;

src/components/DensityPicker.tsx

@@ -1,5 +1,6 @@
 import { useState, useCallback } from "react";
 import { applyDensity, saveDensity, type DensityMode } from "../themes/density";
+import "../styles/density-picker.css";
 
 interface DensityPickerProps {
   currentMode: DensityMode;

src/components/DependencyAnalyzer.tsx

@@ -1,6 +1,7 @@
 import { useState, useCallback, useEffect, useMemo } from "react";
 import { invoke } from "@tauri-apps/api/core";
 import { Dialog, DialogContent } from "./ui/dialog";
+import "../styles/dependency-analyzer.css";
 
 interface DependencyInfo {
   name: string;

src/components/DirectoryStats.tsx

@@ -1,6 +1,7 @@
 import { useState, useCallback, useEffect, useMemo } from "react";
 import { invoke } from "@tauri-apps/api/core";
 import { Dialog, DialogContent } from "./ui/dialog";
+import "../styles/directory-stats.css";
 
 interface ExtensionStat {
   extension: string;

src/components/DoraMetrics.tsx

@@ -1,6 +1,7 @@
 import { useState, useCallback, useEffect } from "react";
 import { invoke } from "@tauri-apps/api/core";
 import { Dialog, DialogContent } from "./ui/dialog";
+import "../styles/dora-metrics.css";
 
 /* ------------------------------------------------------------------ */
 /*  Types                                                              */

src/components/EnvPanel.tsx

@@ -2,6 +2,7 @@ import { useState, useCallback } from "react";
 import { useEnvVault } from "../hooks/useEnvVault";
 import { EnvVarRow } from "./EnvVarRow";
 import { ProfileSelector } from "./ProfileSelector";
+import "../styles/env-panel.css";
 
 interface EnvPanelProps {
   projectId: number;

src/components/GitHubSidebar.tsx

@@ -1,5 +1,6 @@
 import { useState, useEffect, useCallback, useRef } from "react";
 import { invoke } from "@tauri-apps/api/core";
+import "../styles/github-sidebar.css";
 
 /* ------------------------------------------------------------------ */
 /*  Types                                                              */

src/components/GitLogViewer.tsx

@@ -1,6 +1,7 @@
 import { useState, useEffect, useCallback } from "react";
 import { invoke } from "@tauri-apps/api/core";
 import { Dialog, DialogContent } from "./ui/dialog";
+import "../styles/git-log.css";
 
 interface CommitEntry {
   id: string;

src/components/PluginRuntime.tsx

@@ -1,6 +1,7 @@
 import { useState, useCallback, useEffect } from "react";
 import { invoke } from "@tauri-apps/api/core";
 import { Dialog, DialogContent } from "./ui/dialog";
+import "../styles/plugin-runtime.css";
 
 interface PluginDetail {
   name: string;

src/components/PortScanner.tsx

@@ -1,5 +1,6 @@
 import { useState, useCallback, useEffect } from "react";
 import { invoke } from "@tauri-apps/api/core";
+import "../styles/port-scanner.css";
 
 interface PortResult {
   port: number;

src/components/QuickSwitcher.tsx

@@ -1,5 +1,6 @@
 import { useState, useEffect, useCallback, useRef, useMemo } from "react";
 import { invoke } from "@tauri-apps/api/core";
+import "../styles/quick-switcher.css";
 
 /* ------------------------------------------------------------------ */
 /*  Types                                                              */

src/components/SettingsPage.tsx

@@ -8,6 +8,7 @@ import { Button } from "./ui/button";
 import { Input } from "./ui/input";
 import { Switch } from "./ui/switch";
 import { Label } from "./ui/label";
+import "../styles/settings-page.css";
 
 /* ------------------------------------------------------------------ */
 /*  Types                                                              */

src/components/TagManager.tsx

@@ -1,5 +1,6 @@
 import { useState, useEffect, useCallback } from "react";
 import { invoke } from "@tauri-apps/api/core";
+import "../styles/tag-manager.css";
 
 interface TagInfo {
   name: string;

src/components/TaskGraph.tsx

@@ -1,5 +1,6 @@
 import { useState, useEffect, useCallback, useMemo } from "react";
 import { invoke } from "@tauri-apps/api/core";
+import "../styles/task-graph.css";
 
 interface TaskDep {
   source: string;

src/components/TaskScheduler.tsx

@@ -1,6 +1,7 @@
 import { useState, useEffect, useCallback } from "react";
 import { invoke } from "@tauri-apps/api/core";
 import { Dialog, DialogContent } from "./ui/dialog";
+import "../styles/task-scheduler.css";
 
 interface ScheduledTask {
   id: number;

src/components/TerminalRecording.tsx

@@ -1,6 +1,7 @@
 import { useState, useCallback, useEffect, useRef, useMemo } from "react";
 import { invoke } from "@tauri-apps/api/core";
 import AnsiToHtml from "ansi-to-html";
+import "../styles/terminal-recording.css";
 
 /* ------------------------------------------------------------------ */
 /*  Types                                                              */

src/components/TodoPanel.tsx

@@ -1,5 +1,6 @@
 import { useState, useEffect, useCallback } from "react";
 import { invoke } from "@tauri-apps/api/core";
+import "../styles/todo-panel.css";
 
 type Priority = "high" | "medium" | "low";
 type Status = "todo" | "in_progress" | "done";

src/components/UnifiedSearch.tsx

@@ -1,5 +1,6 @@
 import { useState, useEffect, useCallback, useRef, useMemo } from "react";
 import { invoke } from "@tauri-apps/api/core";
+import "../styles/unified-search.css";
 
 /* ------------------------------------------------------------------ */
 /*  Types                                                              */

src/components/WebVitals.tsx

@@ -1,5 +1,6 @@
 import { useState, useCallback } from "react";
 import { invoke } from "@tauri-apps/api/core";
+import "../styles/web-vitals.css";
 
 interface LighthouseResult {
   performance_score: number;

src/components/WebhookEvents.tsx

@@ -1,5 +1,6 @@
 import { useState, useCallback, useEffect, useRef } from "react";
 import { invoke } from "@tauri-apps/api/core";
+import "../styles/webhook-events.css";
 
 /* ------------------------------------------------------------------ */
 /*  Types                                                              */

src/components/WorkspaceManager.tsx

@@ -1,6 +1,7 @@
 import { useState, useEffect, useCallback } from "react";
 import { invoke } from "@tauri-apps/api/core";
 import { useFocusTrap } from "../hooks/useFocusTrap";
+import "../styles/workspace-manager.css";
 
 interface WorkspaceEntry {
   id: number;

src/main.tsx

@@ -3,69 +3,8 @@ import ReactDOM from "react-dom/client";
 import App from "./App";
 import "./styles.css";
 import "./styles/sidebar.css";
-import "./styles/env-panel.css";
 import "./styles/terminal.css";
 import "./styles/command-palette.css";
-import "./styles/command-bookmarks.css";
-import "./styles/terminal-themes.css";
-import "./styles/task-runner.css";
-import "./styles/task-graph.css";
-import "./styles/app-theme-picker.css";
-import "./styles/github-sidebar.css";
-import "./styles/task-history.css";
-import "./styles/theme-editor.css";
-import "./styles/density-picker.css";
-import "./styles/custom-css-editor.css";
-import "./styles/stash-manager.css";
-import "./styles/blame-view.css";
-import "./styles/branch-compare.css";
-import "./styles/git-hooks.css";
-import "./styles/conflict-resolver.css";
-import "./styles/security-audit.css";
-import "./styles/secret-scanner.css";
-import "./styles/license-report.css";
-import "./styles/security-headers.css";
-import "./styles/test-runner-panel.css";
-import "./styles/coverage-report.css";
-import "./styles/benchmark-dashboard.css";
-import "./styles/docker-panel.css";
-import "./styles/docker-images.css";
-import "./styles/container-monitor.css";
-import "./styles/flaky-tests.css";
-import "./styles/notification-center.css";
-import "./styles/activity-timeline.css";
-import "./styles/plugin-manager.css";
-import "./styles/backup-restore.css";
-import "./styles/analytics-dashboard.css";
-import "./styles/ai-chat.css";
-import "./styles/unified-search.css";
-import "./styles/settings-page.css";
-import "./styles/terminal-recording.css";
-import "./styles/dora-metrics.css";
-import "./styles/webhook-events.css";
-import "./styles/ssh-manager.css";
-import "./styles/git-analytics.css";
-import "./styles/snippet-manager.css";
-import "./styles/env-diff.css";
-import "./styles/app-performance.css";
-import "./styles/file-explorer.css";
-import "./styles/project-overview.css";
-import "./styles/inline-diff.css";
-import "./styles/web-vitals.css";
-import "./styles/plugin-runtime.css";
-import "./styles/dependency-analyzer.css";
-import "./styles/port-scanner.css";
-import "./styles/directory-stats.css";
-import "./styles/tag-manager.css";
-import "./styles/git-log.css";
-import "./styles/workspace-manager.css";
-import "./styles/task-scheduler.css";
-import "./styles/clipboard-history.css";
-import "./styles/todo-panel.css";
-import "./styles/quick-switcher.css";
-import "./styles/error-diagnosis.css";
-import "./styles/browser-events.css";
-import "./styles/database-explorer.css";
 import "./styles/dashboard.css";
 import "./styles/status-bar.css";
 import "./styles/project-tabs.css";