Add color mappings for all port types

Maps all Meshtastic port types from portnums.proto to distinct neon colors in the cypherpunk palette. Previously unlabeled ports (like PORT_35) now display with proper names and unique colors for better packet identification.

Port colors added:
- STORE_FORWARD_PLUSPLUS: Purple
- ADMIN: Red-orange
- AUDIO: Magenta
- ALERT: Bright red
- SERIAL: Turquoise
- RANGE_TEST: Yellow
- NEIGHBORINFO: Bright orange
- ATAK_PLUGIN: Dark green
- And 15+ more port types

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

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

Author: statico

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@meshtastic/cli-viewer",
-  "version": "1.6.1",
+  "version": "1.6.2",
   "type": "module",
   "scripts": {
     "dev": "bun run src/index.ts",

src/ui/components/PacketList.tsx

@@ -112,12 +112,38 @@ export function PacketList({ packets, selectedIndex, nodeStore, height = 20, isF
 function getPortColor(portnum?: Portnums.PortNum): string {
   if (portnum === undefined) return theme.packet.encrypted;
   switch (portnum) {
+    case Portnums.PortNum.UNKNOWN_APP: return theme.packet.unknown;
     case Portnums.PortNum.TEXT_MESSAGE_APP: return theme.packet.message;
+    case Portnums.PortNum.REMOTE_HARDWARE_APP: return theme.packet.remoteHardware;
     case Portnums.PortNum.POSITION_APP: return theme.packet.position;
-    case Portnums.PortNum.TELEMETRY_APP: return theme.packet.telemetry;
     case Portnums.PortNum.NODEINFO_APP: return theme.packet.nodeinfo;
     case Portnums.PortNum.ROUTING_APP: return theme.packet.routing;
+    case Portnums.PortNum.ADMIN_APP: return theme.packet.admin;
+    case Portnums.PortNum.TEXT_MESSAGE_COMPRESSED_APP: return theme.packet.compressed;
+    case Portnums.PortNum.WAYPOINT_APP: return theme.packet.waypoint;
+    case Portnums.PortNum.AUDIO_APP: return theme.packet.audio;
+    case Portnums.PortNum.DETECTION_SENSOR_APP: return theme.packet.detectionSensor;
+    case Portnums.PortNum.ALERT_APP: return theme.packet.alert;
+    case Portnums.PortNum.KEY_VERIFICATION_APP: return theme.packet.keyVerification;
+    case Portnums.PortNum.REPLY_APP: return theme.packet.reply;
+    case Portnums.PortNum.IP_TUNNEL_APP: return theme.packet.ipTunnel;
+    case Portnums.PortNum.PAXCOUNTER_APP: return theme.packet.paxcounter;
+    case Portnums.PortNum.STORE_FORWARD_PLUSPLUS_APP: return theme.packet.storeForwardPP;
+    case Portnums.PortNum.SERIAL_APP: return theme.packet.serial;
+    case Portnums.PortNum.STORE_FORWARD_APP: return theme.packet.storeForward;
+    case Portnums.PortNum.RANGE_TEST_APP: return theme.packet.rangeTest;
+    case Portnums.PortNum.TELEMETRY_APP: return theme.packet.telemetry;
+    case Portnums.PortNum.ZPS_APP: return theme.packet.zps;
+    case Portnums.PortNum.SIMULATOR_APP: return theme.packet.simulator;
     case Portnums.PortNum.TRACEROUTE_APP: return theme.packet.traceroute;
+    case Portnums.PortNum.NEIGHBORINFO_APP: return theme.packet.neighborinfo;
+    case Portnums.PortNum.ATAK_PLUGIN: return theme.packet.atakPlugin;
+    case Portnums.PortNum.MAP_REPORT_APP: return theme.packet.mapReport;
+    case Portnums.PortNum.POWERSTRESS_APP: return theme.packet.powerstress;
+    case Portnums.PortNum.RETICULUM_TUNNEL_APP: return theme.packet.reticulumTunnel;
+    case Portnums.PortNum.CAYENNE_APP: return theme.packet.cayenne;
+    case Portnums.PortNum.PRIVATE_APP: return theme.packet.privateApp;
+    case Portnums.PortNum.ATAK_FORWARDER: return theme.packet.atakForwarder;
     default: return theme.packet.unknown;
   }
 }

src/ui/theme.ts

@@ -18,9 +18,35 @@ export const theme = {
     routing: "#666666",
     traceroute: "#ffff00",
     encrypted: "#ff0040",
-    unknown: "#404040",
+    unknown: "#ff00ff",
     direct: "#00ff00",
     config: "#8080ff",
+    // Additional port type colors - cypherpunk neon palette
+    remoteHardware: "#ff0099",     // Hot pink for hardware control
+    admin: "#ff3300",              // Red-orange for admin commands
+    compressed: "#00ff66",         // Bright green for compressed messages
+    waypoint: "#00ccff",           // Cyan for waypoints
+    audio: "#ff00cc",              // Magenta for audio
+    detectionSensor: "#ffcc00",    // Gold for sensors
+    alert: "#ff0000",              // Bright red for alerts
+    keyVerification: "#00ff00",    // Lime for security
+    reply: "#99ff00",              // Yellow-green for replies
+    ipTunnel: "#0099ff",           // Blue for network tunnels
+    paxcounter: "#ff9933",         // Orange for paxcounter
+    storeForwardPP: "#9900ff",     // Purple for S&F++
+    serial: "#00ffcc",             // Turquoise for serial
+    storeForward: "#cc00ff",       // Violet for S&F
+    rangeTest: "#ffff33",          // Yellow for range tests
+    zps: "#33ff99",                // Mint for position estimation
+    simulator: "#ff3399",          // Pink for simulator
+    neighborinfo: "#ff6600",       // Bright orange for neighbors
+    atakPlugin: "#009933",         // Dark green for ATAK
+    mapReport: "#0066ff",          // Blue for map reports
+    powerstress: "#ff6666",        // Light red for power testing
+    reticulumTunnel: "#6600ff",    // Deep purple for reticulum
+    cayenne: "#ff9900",            // Orange for Cayenne
+    privateApp: "#666666",         // Gray for private apps
+    atakForwarder: "#00cc66",      // Sea green for ATAK forwarder
   },
   // Cypherpunk palette for data differentiation
   data: {