Use CodeForge developer illustration for branding

src/components/Footer.tsx

@@ -1,6 +1,6 @@
 import { Link } from "@tanstack/react-router";
 import { useQuery } from "@tanstack/react-query";
-import { Code2, Github, Linkedin, Mail } from "lucide-react";
+import { Github, Linkedin, Mail } from "lucide-react";
 import { supabase } from "@/integrations/supabase/client";
 
 function XLogo({ className }: { className?: string }) {
@@ -33,9 +33,13 @@ export function Footer() {
         <div className="grid gap-8 sm:grid-cols-2 md:grid-cols-4">
           <div className="md:col-span-2">
             <Link to="/" className="flex items-center gap-2.5">
-              <div className="grid h-9 w-9 place-items-center rounded-xl bg-gradient-to-br from-violet to-electric">
-                <Code2 className="h-5 w-5 text-white" />
-              </div>
+              <img
+                src="/Firefly_RemoveBackground.png"
+                alt="CodeForge developer logo"
+                className="h-9 w-9 shrink-0 rounded-xl object-contain"
+                width={36}
+                height={36}
+              />
               <span className="font-display text-lg font-bold">CodeForge</span>
             </Link>
             <p className="mt-3 max-w-sm text-sm leading-6 text-muted-foreground">

src/components/Navbar.tsx

@@ -1,5 +1,5 @@
 import { Link, useRouterState } from "@tanstack/react-router";
-import { Code2, Menu, X, LayoutDashboard } from "lucide-react";
+import { Menu, X, LayoutDashboard } from "lucide-react";
 import { useState } from "react";
 import { useAuth } from "@/hooks/use-auth";
 import { Button } from "@/components/ui/button";
@@ -23,9 +23,13 @@ export function Navbar() {
         <nav className="glass-strong grid grid-cols-[1fr_1fr] items-center rounded-2xl px-4 py-3 md:grid-cols-3">
           {/* Left — logo */}
           <Link to="/" className="group flex items-center gap-2.5 justify-self-start">
-            <div className="relative grid h-9 w-9 place-items-center rounded-xl bg-gradient-to-br from-violet to-electric glow-violet">
-              <Code2 className="h-5 w-5 text-white" />
-            </div>
+            <img
+              src="/Firefly_RemoveBackground.png"
+              alt="CodeForge developer logo"
+              className="h-9 w-9 shrink-0 rounded-xl object-contain"
+              width={36}
+              height={36}
+            />
             <div className="flex flex-col leading-none">
               <span className="font-display text-base font-bold tracking-tight">CodeForge</span>
               <span className="text-[10px] uppercase tracking-[0.18em] text-muted-foreground">Forge ideas</span>

src/routes/__root.tsx

@@ -84,10 +84,8 @@ export const Route = createRootRouteWithContext<{ queryClient: QueryClient }>()(
     ],
     links: [
       { rel: "stylesheet", href: appCss },
-      { rel: "icon", href: "/favicon.ico", sizes: "48x48" },
-      { rel: "icon", href: "/favicon-16x16.png", sizes: "16x16", type: "image/png" },
-      { rel: "icon", href: "/favicon-32x32.png", sizes: "32x32", type: "image/png" },
-      { rel: "apple-touch-icon", href: "/apple-touch-icon.png", sizes: "180x180" },
+      { rel: "icon", href: "/Firefly_RemoveBackground.png", type: "image/png" },
+      { rel: "apple-touch-icon", href: "/Firefly_RemoveBackground.png", type: "image/png" },
       { rel: "manifest", href: "/site.webmanifest" },
       { rel: "preconnect", href: "https://fonts.googleapis.com" },
       { rel: "preconnect", href: "https://fonts.gstatic.com", crossOrigin: "" },