Add outline cursor mode to CursorSurface for slider rows

Wide content rows (slider rows in audio / monitor panels) opted out of
the cursor fill by setting fill: "transparent" on their CursorSurface,
which left them with no cursor visual at all — j/k landed there
silently with no way to know what was selected.

Add an `outline: bool` flag to CursorSurface. When true, hasCursor
paints an accent border (Style.focusBorderColor at
Style.focusBorderWidth) instead of a fill, leaving the row's chrome
fully visible underneath. Use for slider rows where a fill would
obscure the track.

Audio output / input slider rows and the monitor brightness row opt
in. The dev gallery's slider section replaces its bespoke Rectangle
wrapper with the same CursorSurface { outline: true }, so what the
gallery documents is what the panels ship.

shell/plugins/bar/widgets/audioPanel.qml

@@ -454,7 +454,7 @@ Item {
               hasCursor: root.focusSection === "output" && root.selectedIndex === -1
               onHasCursorChanged: if (hasCursor) root.ensureCursorVisible(outputSliderRow)
               foreground: root.bar.foreground
-              fill: "transparent"
+              outline: true
 
               Row {
                 id: outputSliderInner
@@ -571,7 +571,7 @@ Item {
               hasCursor: root.focusSection === "input" && root.selectedIndex === -1
               onHasCursorChanged: if (hasCursor) root.ensureCursorVisible(inputSliderRow)
               foreground: root.bar.foreground
-              fill: "transparent"
+              outline: true
 
               Row {
                 id: inputSliderInner

shell/plugins/bar/widgets/monitorPanel.qml

@@ -415,7 +415,7 @@ Item {
               hasCursor: root.focusSection === "brightness" && root.selectedIndex === -1
               onHasCursorChanged: if (hasCursor) root.ensureCursorVisible(brightnessRow)
               foreground: root.bar.foreground
-              fill: "transparent"
+              outline: true
 
               Row {
                 id: brightnessInner

shell/plugins/dev-gallery/GalleryPanel.qml

@@ -1121,18 +1121,14 @@ Item {
               wrapMode: Text.WordWrap
             }
 
-            Rectangle {
+            CursorSurface {
               id: sliderWrapper
               width: parent.width
               implicitHeight: sliderRow.implicitHeight + 24
-              readonly property bool focused: root.focusSection === "slider"
-              color: Qt.rgba(root.foreground.r, root.foreground.g, root.foreground.b, 0.04)
-              radius: Style.cornerRadius
-              border.color: focused
-                ? Style.focusBorderColor
-                : Qt.rgba(root.foreground.r, root.foreground.g, root.foreground.b, 0.10)
-              border.width: focused ? Style.focusBorderWidth : 1
-              onFocusedChanged: if (focused) root.ensureCursorVisible(this)
+              outline: true
+              foreground: root.foreground
+              hasCursor: root.focusSection === "slider"
+              onHasCursorChanged: if (hasCursor) root.ensureCursorVisible(this)
 
               HoverHandler {
                 onHoveredChanged: if (hovered) {