Group and enlarge the toolbox device picker (v0.13.4)

Split the SELECT DEVICE list into Instruments / MIDI effects / Audio effects,
each with a gap and a small header, and bump the device labels 13→18 sp with more
tap padding. The old [INS]/[EFF] prefix is dropped since the grouping conveys it.

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

app/build.gradle.kts

@@ -22,8 +22,8 @@ android {
         // (android.media.midi) and AAudio low-latency audio we rely on.
         minSdk = 26
         targetSdk = 34
-        versionCode = 36
+        versionCode = 37
-        versionName = "0.13.3"
+        versionName = "0.13.4"
 
         // We provide our own instrumentation runner if/when tests are added.
         testInstrumentationRunner = "androidx.test.runner.AndroidJUnitRunner"

app/src/main/java/space/rcmd/android/sizzle/ui/toolbox/ToolboxScreen.kt

@@ -242,26 +242,42 @@ private fun SlotTile(
     }
 }
 
-/** A simple overlay list of all available instruments and effects to load. */
+/** A simple overlay list of all available devices, grouped into instruments, MIDI
+ *  effects and audio effects (separated by a gap + header). */
 @Composable
 private fun DevicePicker(onDismiss: () -> Unit, onPick: (ToolboxType) -> Unit) {
     val c = LocalRetro.current
+    // MIDI effects alter note generation (handled by the sequencer); every other
+    // effect processes audio. Split the two so the list reads in three clear groups.
+    val midiEffects = setOf(ToolboxType.ARPEGGIATOR, ToolboxType.TRANSPOSER, ToolboxType.LFO)
+    val groups = listOf(
+        "INSTRUMENTS" to ToolboxType.entries.filter { it.isInstrument },
+        "MIDI EFFECTS" to ToolboxType.entries.filter { !it.isInstrument && it in midiEffects },
+        "AUDIO EFFECTS" to ToolboxType.entries.filter { !it.isInstrument && it !in midiEffects },
+    )
     Box(
         Modifier.fillMaxSize().background(c.background.copy(alpha = 0.92f))
             .pointerInput(Unit) { detectTapGestures { onDismiss() } },
         contentAlignment = Alignment.Center,
     ) {
         Column(Modifier.fillMaxHeight().padding(16.dp).verticalScroll(rememberScrollState())) {
-            Text("SELECT DEVICE", color = c.accent, fontFamily = FontFamily.Monospace, fontSize = 14.sp)
+            Text("SELECT DEVICE", color = c.accent, fontFamily = FontFamily.Monospace, fontSize = 16.sp)
-            ToolboxType.entries.forEach { type ->
+            groups.forEach { (header, types) ->
+                Spacer(Modifier.height(16.dp)) // visual gap between groups
                 Text(
-                    "[${type.kind.name.take(3)}] ${type.displayName}",
+                    header, color = c.textDim, fontFamily = FontFamily.Monospace, fontSize = 11.sp,
-                    color = c.text, fontFamily = FontFamily.Monospace, fontSize = 13.sp,
+                    modifier = Modifier.padding(bottom = 2.dp),
-                    modifier = Modifier
-                        .fillMaxWidth()
-                        .pointerInput(type) { detectTapGestures { onPick(type) } }
-                        .padding(vertical = 6.dp),
                 )
+                types.forEach { type ->
+                    Text(
+                        type.displayName,
+                        color = c.text, fontFamily = FontFamily.Monospace, fontSize = 18.sp,
+                        modifier = Modifier
+                            .fillMaxWidth()
+                            .pointerInput(type) { detectTapGestures { onPick(type) } }
+                            .padding(vertical = 8.dp),
+                    )
+                }
             }
         }
     }