feat: implement universal icon system with Phosphor Icons

- Install @phosphor-icons/react package
- Create centralized Icon component with size/weight/color variants
- Create icon registry with 34 icons across 5 categories
- Replace all raw Unicode symbols with proper icon components
- Add icons to navigation, buttons, status indicators, git operations
- Add icon CSS with consistent sizing and spacing
- Fix type definitions for Phosphor icon compatibility

Quality gates: typecheck ✓, lint ✓, build ✓ (375KB bundle)

apps/web/src/components/workspace-header.tsx

@@ -1,4 +1,5 @@
 import { Link } from "react-router-dom";
+import { Icon } from "./icon";
 
 interface WorkspaceHeaderProps {
   project: {
@@ -16,7 +17,9 @@ export const WorkspaceHeader = ({ project, currentRepo }: WorkspaceHeaderProps)
   return (
     <div className="workspace-header">
       <div className="workspace-header-left">
-        <div className="workspace-header-icon">📁</div>
+        <div className="workspace-header-icon">
+          <Icon name="folder" size="lg" />
+        </div>
         <div className="workspace-header-info">
           <h1 className="workspace-header-title">{project.name}</h1>
           {currentRepo && (
@@ -29,14 +32,14 @@ export const WorkspaceHeader = ({ project, currentRepo }: WorkspaceHeaderProps)
           className="workspace-header-action-btn"
           to={`/projects/${project.id}/repositories/${currentRepo?.id || ""}/history`}
         >
-          <span className="icon">🕐</span>
+          <Icon name="history" size="sm" />
           History
         </Link>
         <Link
           className="workspace-header-action-btn"
           to={`/projects/${project.id}/settings`}
         >
-          <span className="icon">⚙️</span>
+          <Icon name="settings" size="sm" />
           Settings
         </Link>
       </div>