Replace generic cloud-lightning logo with custom network nexus mark

The new icon represents Wild Central's role as a network hub —
a central node radiating connections to services. Updated favicon,
sidebar logo component, theme color, and PWA manifest name.

web/index.html

@@ -4,7 +4,7 @@
     <meta charset="utf-8" />
     <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <meta name="theme-color" content="#0ea5e9" />
+    <meta name="theme-color" content="#2563eb" />
     <meta
       name="description"
       content="Wild Central — Network management for your LAN"

web/public/favicon.svg

@@ -1,7 +1,23 @@
 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32">
-  <rect width="32" height="32" rx="6" fill="#0ea5e9"/>
+  <rect width="32" height="32" rx="7" fill="#2563eb"/>
-  <g transform="translate(4, 4)" stroke="white" fill="none" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+  <!-- Central node -->
-    <path d="M6 16.326A7 7 0 1 1 15.71 8h1.79a4.5 4.5 0 0 1 .5 8.973"/>
+  <circle cx="16" cy="16" r="4" fill="white"/>
-    <path d="M13 11l-3 5h4l-3 5"/>
+  <!-- Radiating connections -->
-  </g>
+  <line x1="16" y1="6" x2="16" y2="11" stroke="white" stroke-width="2" stroke-linecap="round"/>
+  <line x1="16" y1="21" x2="16" y2="26" stroke="white" stroke-width="2" stroke-linecap="round"/>
+  <line x1="6" y1="16" x2="11" y2="16" stroke="white" stroke-width="2" stroke-linecap="round"/>
+  <line x1="21" y1="16" x2="26" y2="16" stroke="white" stroke-width="2" stroke-linecap="round"/>
+  <line x1="8.9" y1="8.9" x2="12.5" y2="12.5" stroke="white" stroke-width="2" stroke-linecap="round"/>
+  <line x1="19.5" y1="19.5" x2="23.1" y2="23.1" stroke="white" stroke-width="2" stroke-linecap="round"/>
+  <line x1="23.1" y1="8.9" x2="19.5" y2="12.5" stroke="white" stroke-width="2" stroke-linecap="round"/>
+  <line x1="12.5" y1="19.5" x2="8.9" y2="23.1" stroke="white" stroke-width="2" stroke-linecap="round"/>
+  <!-- Outer ring nodes -->
+  <circle cx="16" cy="5.5" r="1.5" fill="white" opacity="0.7"/>
+  <circle cx="16" cy="26.5" r="1.5" fill="white" opacity="0.7"/>
+  <circle cx="5.5" cy="16" r="1.5" fill="white" opacity="0.7"/>
+  <circle cx="26.5" cy="16" r="1.5" fill="white" opacity="0.7"/>
+  <circle cx="8.6" cy="8.6" r="1.5" fill="white" opacity="0.5"/>
+  <circle cx="23.4" cy="23.4" r="1.5" fill="white" opacity="0.5"/>
+  <circle cx="23.4" cy="8.6" r="1.5" fill="white" opacity="0.5"/>
+  <circle cx="8.6" cy="23.4" r="1.5" fill="white" opacity="0.5"/>
 </svg>

web/public/manifest.json

@@ -1,6 +1,6 @@
 {
-  "short_name": "Wild Cloud",
+  "short_name": "Wild Central",
-  "name": "Wild Cloud Central",
+  "name": "Wild Central",
   "icons": [
     {
       "src": "favicon.svg",
@@ -10,6 +10,6 @@
   ],
   "start_url": ".",
   "display": "standalone",
-  "theme_color": "#0ea5e9",
+  "theme_color": "#2563eb",
   "background_color": "#ffffff"
 }

web/src/components/AppSidebar.tsx

@@ -1,6 +1,6 @@
 import { useState, useEffect } from 'react';
 import { NavLink } from 'react-router';
-import { Sun, Moon, Monitor, Shield, Lock, ShieldAlert, Wifi, LayoutDashboard, Globe, CloudLightning, Network, ChevronRight } from 'lucide-react';
+import { Sun, Moon, Monitor, Shield, Lock, ShieldAlert, Wifi, LayoutDashboard, Globe, Network, ChevronRight } from 'lucide-react';
 import { Collapsible, CollapsibleContent, CollapsibleTrigger } from './ui/collapsible';
 import {
   Sidebar,
@@ -19,6 +19,26 @@ import {
 import { useTheme } from '../contexts/ThemeContext';
 import { useCentralStatus } from '../hooks/useCentralStatus';
 
+function WildCentralLogo({ className }: { className?: string }) {
+  return (
+    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" className={className} fill="none">
+      <circle cx="12" cy="12" r="3" fill="currentColor"/>
+      <line x1="12" y1="4" x2="12" y2="8.5" stroke="currentColor" strokeWidth="2" strokeLinecap="round"/>
+      <line x1="12" y1="15.5" x2="12" y2="20" stroke="currentColor" strokeWidth="2" strokeLinecap="round"/>
+      <line x1="4" y1="12" x2="8.5" y2="12" stroke="currentColor" strokeWidth="2" strokeLinecap="round"/>
+      <line x1="15.5" y1="12" x2="20" y2="12" stroke="currentColor" strokeWidth="2" strokeLinecap="round"/>
+      <line x1="6.3" y1="6.3" x2="9.4" y2="9.4" stroke="currentColor" strokeWidth="2" strokeLinecap="round"/>
+      <line x1="14.6" y1="14.6" x2="17.7" y2="17.7" stroke="currentColor" strokeWidth="2" strokeLinecap="round"/>
+      <line x1="17.7" y1="6.3" x2="14.6" y2="9.4" stroke="currentColor" strokeWidth="2" strokeLinecap="round"/>
+      <line x1="9.4" y1="14.6" x2="6.3" y2="17.7" stroke="currentColor" strokeWidth="2" strokeLinecap="round"/>
+      <circle cx="12" cy="3.5" r="1.2" fill="currentColor" opacity="0.6"/>
+      <circle cx="12" cy="20.5" r="1.2" fill="currentColor" opacity="0.6"/>
+      <circle cx="3.5" cy="12" r="1.2" fill="currentColor" opacity="0.6"/>
+      <circle cx="20.5" cy="12" r="1.2" fill="currentColor" opacity="0.6"/>
+    </svg>
+  );
+}
+
 const ADVANCED_OPEN_KEY = 'wild-central:advanced-open';
 
 export function AppSidebar() {
@@ -88,7 +108,7 @@ export function AppSidebar() {
       <SidebarHeader>
         <div className="flex items-center justify-center pb-2">
           <div className="p-1 bg-primary/10 rounded-lg">
-            <CloudLightning className="h-6 w-6 text-primary" />
+            <WildCentralLogo className="h-6 w-6" />
           </div>
           <div className="overflow-hidden transition-all duration-200 ease-linear ml-2 max-w-[200px] opacity-100 group-data-[collapsible=icon]:ml-0 group-data-[collapsible=icon]:max-w-0 group-data-[collapsible=icon]:opacity-0">
             <h2 className="text-lg font-bold text-foreground whitespace-nowrap">Wild Central</h2>