feat: WiFi signal-strength indicator in the navbar

Show the WiFi signal strength (RSSI as a quality percentage, color-coded
green/cyan/magenta) next to the battery indicator in the navbar. Uses the
rssi value the device already reports in the websocket pong, so it
updates roughly every few seconds. Frontend-only.

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

Author: fhirschmann

README.md

@@ -69,6 +69,7 @@ neon logo that doubles as the SVG favicon ([`8d9725c`](../../commit/8d9725c)):
 | Equalizer profiles: dropdown presets (Flat / Music / Audiobook-Speech / Deep voices / Custom) on top of the 3-band tone control; speech presets cut bass and lift mids/highs so deep narrator voices stay intelligible, persisted in NVS. Profiles can also be assigned per file or directory (right-click in the file browser) — e.g. set the speech profile for all Bibi Blocksberg episodes at once; the RFID tab shows the active profile for the highlighted file (or "No EQ set"). The active profile can be cycled with the bindable command **154** (button/RFID modifier) and set/reported via the MQTT topic `equalizer` (`flat`/`music`/`speech`/`voiceBoost`) | [`300b9dd`](../../commit/300b9dd) |
 | Blinking "OK" indicator next to the battery replaces the generic "action successful" toast | [`0870ccc`](../../commit/0870ccc) |
 | Blinking "connection lost" icon in the navbar replaces the connection-lost toast | [`c45402b`](../../commit/c45402b) |
+| WiFi signal-strength indicator in the navbar (RSSI %, color-coded), next to the battery | [`e4ac7e7`](../../commit/e4ac7e7) |
 | Play/pause button in the RFID tab plays the highlighted file/folder (and pauses running playback) | [`8d3d196`](../../commit/8d3d196) |
 | Cyberpunk footer below the interface (neon "LEO INDUSTRIES // DIVISION: AUDIO" branding) | [`c21f8bf`](../../commit/c21f8bf) |
 | SD card cleanup: removes macOS metadata (`.DS_Store`, `._*`, Spotlight/Trashes) with one click | [`5f38a51`](../../commit/5f38a51) |

html/management.html

@@ -229,6 +229,28 @@
 			text-shadow: 0 0 8px rgba(10, 255, 157, .5);
 		}
 
+		#wifiIndicator {
+			margin-right: 12px;
+			font-family: "Share Tech Mono", monospace;
+			font-size: .9rem;
+			color: var(--cp-cyan);
+			text-shadow: 0 0 8px rgba(0, 240, 255, .5);
+		}
+
+		#wifiIndicator #wifiLevel {
+			margin-left: 3px;
+		}
+
+		#wifiIndicator.wifi-good {
+			color: var(--cp-green);
+			text-shadow: 0 0 8px rgba(10, 255, 157, .5);
+		}
+
+		#wifiIndicator.wifi-weak {
+			color: var(--cp-magenta);
+			text-shadow: 0 0 8px rgba(255, 42, 109, .6);
+		}
+
 		#batteryIndicator.battery-low {
 			color: var(--cp-magenta);
 			text-shadow: 0 0 8px rgba(255, 42, 109, .6);
@@ -1197,6 +1219,9 @@
 			<div class="collapse navbar-collapse justify-content-end">
 				<span class="navbar-text" id="connLost" data-i18n="[title]toast.conlost"><i class="fas fa-link-slash"></i></span>
 				<span class="navbar-text" id="actionOk" aria-hidden="true"><i class="fas fa-check"></i> OK</span>
+				<span class="navbar-text" id="wifiIndicator" data-visible="false" data-i18n="[title]nav.wifi">
+					<i class="fas fa-wifi" id="wifiIcon"></i><span id="wifiLevel"></span>
+				</span>
 				<span class="navbar-text" id="batteryIndicator" data-visible="false">
 					<i class="fas fa-battery-three-quarters" id="batteryIcon"></i><span id="batteryLevel"></span>
 				</span>
@@ -3605,6 +3630,9 @@ <h5 class="modal-title" data-i18n="tools.nvs.erase.title"></h5>
 				if ("battery" in socketMsg) {
 					updateBatteryIndicator(socketMsg.battery);
 				}
+				if ("rssi" in socketMsg) {
+					updateWifiIndicator(socketMsg.rssi);
+				}
 				if ("volume" in socketMsg) {
 					volumeSlider.setValue(parseInt(socketMsg.volume));
 				}
@@ -4881,6 +4909,18 @@ <h5 class="modal-title" data-i18n="tools.nvs.erase.title"></h5>
 			}
 		}
 
+		// Update the navbar WiFi indicator from the RSSI (dBm) reported by the device.
+		function updateWifiIndicator(rssi) {
+			const indicator = document.getElementById('wifiIndicator');
+			if (!indicator || rssi == null) return;
+			// same quality mapping as the firmware WiFi scan (0..100 %)
+			let quality = rssi <= -100 ? 0 : rssi >= -50 ? 100 : 2 * (rssi + 100);
+			document.getElementById('wifiLevel').textContent = quality + '%';
+			indicator.title = rssi + ' dBm';
+			indicator.classList.toggle('wifi-good', quality >= 60);
+			indicator.classList.toggle('wifi-weak', quality < 30);
+			indicator.setAttribute('data-visible', true);
+		}
 		var batteryLowWarned = false;
 		function updateBatteryIndicator(battery) {
 			const indicator = document.getElementById('batteryIndicator');