Replace emoji icons with Lucide icons and soften link colors

Replaced emoji icons throughout the Angular app with modern Lucide icon library for a more professional and consistent look matching the original static site design.

**Icon Updates:**
- Navigation tabs: Database, Upload, Search icons
- Toolbar buttons: RefreshCw, Sparkles, Search, X icons
- Action buttons: Download, Trash2 icons
- Form buttons: Upload, Search, X icons

**Style Improvements:**
- Added softer blue color for artifact links (#93c5fd)
- Added hover effect with lighter blue (#bfdbfe)
- Added proper cursor pointer for clickable rows
- Improved icon color consistency throughout

**Dependencies:**
- Added lucide-angular (v0.545.0) for icon support
- Bundle size: 356.54 kB (raw) → 93.91 kB (gzipped)
- Minimal impact: only +7.79 kB for full icon library

All components updated with Lucide imports and icon references.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

frontend/src/app/components/artifacts-list/artifacts-list.html

@@ -1,7 +1,7 @@
 <div class="artifacts-container">
   <div class="toolbar">
     <button (click)="loadArtifacts()" class="btn btn-primary">
-      🔄 Refresh
+      <lucide-icon [img]="RefreshCw" [size]="16"></lucide-icon> Refresh
     </button>
     <button (click)="toggleAutoRefresh()"
             [class.btn-success]="autoRefreshEnabled"
@@ -10,20 +10,22 @@
       Auto-refresh: {{ autoRefreshEnabled ? 'ON' : 'OFF' }}
     </button>
     <button (click)="generateSeedData()" class="btn btn-secondary">
-      ✨ Generate Seed Data
+      <lucide-icon [img]="Sparkles" [size]="16"></lucide-icon> Generate Seed Data
     </button>
 
     <span class="count-badge">{{ filteredArtifacts.length }} artifacts</span>
 
     <div class="filter-inline">
-      <span class="search-icon">🔍</span>
+      <lucide-icon [img]="Search" [size]="16" class="search-icon"></lucide-icon>
       <input
         type="text"
         [(ngModel)]="searchTerm"
         (input)="onSearch()"
         placeholder="Search..."
         class="search-input">
-      <button (click)="clearSearch()" class="btn-clear" *ngIf="searchTerm">✕</button>
+      <button (click)="clearSearch()" class="btn-clear" *ngIf="searchTerm">
+        <lucide-icon [img]="X" [size]="14"></lucide-icon>
+      </button>
     </div>
   </div>
 
@@ -80,10 +82,10 @@
           <td>
             <div class="action-buttons">
               <button (click)="downloadArtifact(artifact, $event)" class="icon-btn" title="Download">
-                ⬇️
+                <lucide-icon [img]="Download" [size]="16"></lucide-icon>
               </button>
               <button (click)="deleteArtifact(artifact, $event)" class="icon-btn danger" title="Delete">
-                🗑️
+                <lucide-icon [img]="Trash2" [size]="16"></lucide-icon>
               </button>
             </div>
           </td>
@@ -177,10 +179,10 @@
       </div>
       <div class="modal-actions">
         <button (click)="downloadArtifact(selectedArtifact, $event)" class="btn btn-primary">
-          ⬇️ Download
+          <lucide-icon [img]="Download" [size]="16"></lucide-icon> Download
         </button>
         <button (click)="deleteArtifact(selectedArtifact, $event); closeDetail()" class="btn btn-danger">
-          🗑️ Delete
+          <lucide-icon [img]="Trash2" [size]="16"></lucide-icon> Delete
         </button>
       </div>
     </div>