feat(qbz-slint): move QConnect diagnostics to Settings > Developer

Relocate the QConnect diagnostics launcher out of the now-playing bar flyout
into a new opt-in Settings > Developer section (the modal + DEV log/status code
is unchanged). Also make the status block selectable (read-only TextEdit) so
session_uuid etc. can be copied, and relabel the event log.

cc

crates/qbz-slint/ui/settings/DeveloperSettings.slint

@@ -0,0 +1,61 @@
+// Settings > Developer — opt-in home for developer/diagnostic tools. Same
+// structure as the other settings panels (GroupHeader + SettingRow + a
+// SecondaryButton). Currently launches the Qobuz Connect diagnostics modal
+// (live session topology + rolling event log); more dev tools can land here.
+
+import { Theme } from "../foundation/semantic-colors.slint";
+import { Typography } from "../foundation/typography.slint";
+import { Radius } from "../foundation/radius.slint";
+import { QconnectDevState } from "../state.slint";
+import { SettingRow } from "SettingRow.slint";
+
+component GroupHeader inherits Text {
+    color: Theme.text-muted;
+    font-size: 11px;
+    letter-spacing: 1.5px;
+    font-weight: Typography.semibold;
+}
+
+component SecondaryButton inherits Rectangle {
+    in property <string> label;
+    callback clicked();
+    width: 160px;
+    height: 34px;
+    border-radius: Radius.sm;
+    border-width: 1px;
+    border-color: Theme.border-subtle;
+    background: ta.has-hover ? Theme.surface-hover : Theme.surface-elevated;
+    Text {
+        width: 100%;
+        height: 100%;
+        text: root.label;
+        color: Theme.text-secondary;
+        font-size: Typography.body;
+        font-weight: Typography.medium;
+        horizontal-alignment: center;
+        vertical-alignment: center;
+    }
+    ta := TouchArea {
+        mouse-cursor: pointer;
+        clicked => {
+            root.clicked();
+        }
+    }
+}
+
+export component DeveloperSettings inherits VerticalLayout {
+    spacing: 4px;
+
+    GroupHeader { text: @tr("QOBUZ CONNECT"); }
+
+    SettingRow {
+        label: @tr("Connect diagnostics");
+        description: @tr("Live session topology and a rolling event log for debugging Qobuz Connect at runtime.");
+        SecondaryButton {
+            label: @tr("Open diagnostics");
+            clicked => {
+                QconnectDevState.open = true;
+            }
+        }
+    }
+}

crates/qbz-slint/ui/settings/SettingsView.slint

@@ -16,6 +16,7 @@ import { PlaybackSettings } from "PlaybackSettings.slint";
 import { AppearanceSettings } from "AppearanceSettings.slint";
 import { OfflineSettings } from "OfflineSettings.slint";
 import { LocalLibrarySettings } from "LocalLibrarySettings.slint";
+import { DeveloperSettings } from "DeveloperSettings.slint";
 import { ScrollView } from "std-widgets.slint";
 
 component SubNavItem inherits Rectangle {
@@ -149,6 +150,14 @@ export component SettingsView inherits Rectangle {
                             SettingsState.section = 4;
                         }
                     }
+                    SubNavItem {
+                        icon: @image-url("../assets/icons/bug.svg");
+                        label: @tr("Developer");
+                        active: SettingsState.section == 5;
+                        clicked => {
+                            SettingsState.section = 5;
+                        }
+                    }
                 }
             }
 
@@ -200,6 +209,7 @@ export component SettingsView inherits Rectangle {
                     if !SettingsState.loading && SettingsState.section == 2: AppearanceSettings { }
                     if !SettingsState.loading && SettingsState.section == 3: OfflineSettings { }
                     if !SettingsState.loading && SettingsState.section == 4: LocalLibrarySettings { }
+                    if !SettingsState.loading && SettingsState.section == 5: DeveloperSettings { }
                 }
             }
         }

crates/qbz-slint/ui/shell/PlayerBar.slint

@@ -19,7 +19,7 @@ import { IconButton, PlayButton } from "../primitives/BarControls.slint";
 import { SeekBar } from "SeekBar.slint";
 import { SongCard } from "SongCard.slint";
 import { TransportControls } from "TransportControls.slint";
-import { NowPlayingState, ShellState, AppearanceState, SettingsState, TooltipState, QconnectDevState } from "../state.slint";
+import { NowPlayingState, ShellState, AppearanceState, SettingsState, TooltipState } from "../state.slint";
 
 // IconButton + PlayButton now live in primitives/BarControls.slint (shared
 // with TransportControls). ConnectButton + ToggleRow stay local (bar-only).
@@ -412,22 +412,6 @@ export component PlayerBar inherits Rectangle {
                                             vertical-alignment: center;
                                         }
                                     }
-                                    // DEV: open the QConnect diagnostics modal.
-                                    diag-ta := TouchArea {
-                                        height: 22px;
-                                        mouse-cursor: pointer;
-                                        clicked => {
-                                            QconnectDevState.open = true;
-                                            qconnect-menu.close();
-                                        }
-                                        Text {
-                                            text: "Diagnostics";
-                                            color: diag-ta.has-hover ? Theme.text-secondary : Theme.text-muted;
-                                            font-size: 11px;
-                                            horizontal-alignment: center;
-                                            vertical-alignment: center;
-                                        }
-                                    }
                                 }
                             }
                         }

crates/qbz-slint/ui/shell/QconnectDevModal.slint

@@ -74,23 +74,24 @@ export component QconnectDevModal inherits Rectangle {
                 Rectangle {
                     background: Theme.surface-elevated;
                     border-radius: Radius.sm;
-                    VerticalLayout {
+                    height: 140px;
-                        padding: 12px;
+                    clip: true;
-                        Text {
+                    TextEdit {
-                            text: QconnectDevState.status == ""
+                        width: 100%;
-                                ? "Not connected."
+                        height: 100%;
-                                : QconnectDevState.status;
+                        read-only: true;
-                            color: Theme.text-secondary;
+                        wrap: word-wrap;
-                            font-size: 12px;
+                        font-size: 12px;
-                            wrap: word-wrap;
+                        text: QconnectDevState.status == ""
-                        }
+                            ? "Not connected."
+                            : QconnectDevState.status;
                     }
                 }
 
                 // Event-log header + clear.
                 HorizontalLayout {
                     Text {
-                        text: "Event log";
+                        text: "Event log (newest first)";
                         color: Theme.text-primary;
                         font-size: Typography.body;
                         font-weight: Typography.semibold;