Fix device card rendering - disable legacy code and fix CSS

- Disable legacy addBtDeviceCard when BluetoothMode is active
- Clear device container when starting scan to remove legacy cards
- Fix grid CSS with explicit auto height and align-items: start
- Add visibility rules for all card body elements
- Reset devices map when clearing container

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

static/css/components/device-cards.css

@@ -560,28 +560,52 @@
 #btDeviceListContent {
     display: grid !important;
     grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)) !important;
+    grid-auto-rows: auto !important;
     gap: 12px !important;
     padding: 12px !important;
+    align-items: start !important;
 }
 
-#btDeviceListContent .device-card {
+#btDeviceListContent > * {
+    min-height: auto !important;
+    height: auto !important;
+}
+
+#btDeviceListContent .device-card,
+#btDeviceListContent .signal-card {
     margin: 0;
-    height: fit-content;
+    height: auto !important;
+    min-height: auto !important;
 }
 
 /* Ensure card body is visible */
-.device-card .signal-card-body {
+.device-card .signal-card-body,
+.signal-card .signal-card-body {
     display: flex !important;
-    flex-direction: column;
-    gap: 8px;
+    flex-direction: column !important;
+    gap: 8px !important;
+    visibility: visible !important;
+    opacity: 1 !important;
+    height: auto !important;
+    overflow: visible !important;
 }
 
-.device-card .device-identity {
+.device-card .device-identity,
+.signal-card .device-identity {
     display: block !important;
+    visibility: visible !important;
 }
 
-.device-card .device-signal-row {
+.device-card .device-signal-row,
+.signal-card .device-signal-row {
     display: flex !important;
+    visibility: visible !important;
+}
+
+.device-card .device-meta-row,
+.signal-card .device-meta-row {
+    display: flex !important;
+    visibility: visible !important;
 }
 
 /* ============================================

static/js/modes/bluetooth.js

@@ -213,12 +213,10 @@ const BluetoothMode = (function() {
         if (startBtn) startBtn.style.display = scanning ? 'none' : 'block';
         if (stopBtn) stopBtn.style.display = scanning ? 'block' : 'none';
 
-        // Clear placeholder when starting scan
+        // Clear container when starting scan (removes legacy cards and placeholder)
         if (scanning && deviceContainer) {
-            const placeholder = deviceContainer.querySelector('div[style*="text-align: center"]');
-            if (placeholder && placeholder.textContent.includes('Start scanning')) {
-                deviceContainer.innerHTML = '';
-            }
+            deviceContainer.innerHTML = '';
+            devices.clear();  // Also clear our device map
         }
 
         // Update global status if available

templates/index.html

@@ -6315,6 +6315,11 @@
 
         // Add Bluetooth device card to device list panel
         function addBtDeviceCard(device, isNew) {
+            // Skip if new BluetoothMode is handling rendering
+            if (typeof BluetoothMode !== 'undefined' && BluetoothMode.isScanning()) {
+                return;
+            }
+
             // Add to new device list panel
             const deviceList = document.getElementById('btDeviceListContent');
             if (deviceList) {