Updated ASCII slider interface

bicorder-app/src/components/GradientSlider.svelte

@@ -72,23 +72,23 @@
   }
 
   function renderBar(value: number | null): string {
-    // Fixed scale with 9 positions using ||||#||||
+    // Slider-style visualization with brackets and value number
     if (value === null) {
-      return '||||·||||';
+      return '[----X----]';
     }
-    // Value is 1-9, position the # marker at the right spot
-    const positions = [
-      '#||||||||',
-      '|#|||||||',
-      '||#||||||',
-      '|||#|||||',
-      '||||#||||',
-      '|||||#|||',
-      '||||||#||',
-      '|||||||#|',
-      '||||||||#'
+    // Value is 1-9, show the number at its position along the slider
+    const bars = [
+      '[1--------]',  // value 1
+      '[-2-------]',  // value 2
+      '[--3------]',  // value 3
+      '[---4-----]',  // value 4
+      '[----5----]',  // value 5 (centered)
+      '[-----6---]',  // value 6
+      '[------7--]',  // value 7
+      '[-------8-]',  // value 8
+      '[--------9]'   // value 9
     ];
-    return positions[value - 1];
+    return bars[value - 1];
   }
 
   $: barDisplay = renderBar(gradient.value);