fix(ui): replace JS toggle with native <details> for device manage section

lightsync/frontend/style.css

@@ -92,35 +92,40 @@ body {
     justify-content: space-between;
 }
 
-.panel-manage-btn {
-    background: none;
-    border: 1px solid transparent;
-    color: var(--text-dim);
-    font-family: var(--font-mono);
+/* Device manage section — collapsible via <details> */
+.device-manage-section {
+    border-top: 1px solid var(--border-dim);
+}
+
+.device-manage-section > summary {
+    padding: 5px 12px;
     font-size: 10px;
-    letter-spacing: 0.08em;
-    cursor: pointer;
-    padding: 1px 6px;
+    letter-spacing: 0.1em;
     text-transform: uppercase;
+    color: var(--text-dim);
+    cursor: pointer;
+    user-select: none;
+    list-style: none;
 }
 
-.panel-manage-btn:hover {
-    border-color: var(--border-dim);
+.device-manage-section > summary::-webkit-details-marker { display: none; }
+
+.device-manage-section > summary::before {
+    content: "▶ ";
+    font-size: 8px;
+}
+
+.device-manage-section[open] > summary {
     color: var(--text-accent);
 }
 
-.panel-manage-btn.active {
-    border-color: var(--accent);
-    color: var(--text-accent);
+.device-manage-section[open] > summary::before {
+    content: "▼ ";
 }
 
-/* Management controls hidden by default */
-#devices-panel .device-remove { display: none; }
-#devices-panel .device-form   { display: none; }
-
-/* Shown when manage mode active */
-#devices-panel.manage-active .device-remove { display: block; }
-#devices-panel.manage-active .device-form   { display: flex; }
+.device-manage-section > summary:hover {
+    color: var(--text-accent);
+}
 
 .panel-content {
     flex: 1;