Merge pull request 'fix minor css issue on stickies' (#4) from minor-css-update into master

Reviewed-on: #4

README.md

@@ -1,4 +1,4 @@
-# kongruity
+# kongruity: Signal from noise
 
 “...All those moments will be lost in time, like tears in rain.”
 
@@ -16,7 +16,7 @@ At the same time, Voyage AI's voyage-3 model (`backend/services/embedding.servic
 
 Once the LLM returns, kongruity scores that grouping (`backend/services/validation.service.js`) using an established silhouette coefficient, with cosine distance rather than Euclidean as the proximity metric. 
 
-For each note, it weighs the average distance to the other notes in its own cluster against the average distance to the notes in the nearest neighboring cluster. Averaged across every note, this yields a single cohesion score in the range [−1, 1], displayed at the top of the results.
+For each note, it weighs the average distance to the other notes in its own cluster against the average distance to the notes in the nearest neighboring cluster. Averaged across every note, this yields a single numeric cohesion score, displayed at the top of the results, along with plaintext: Strong, Moderate, Weak, Poor.
 
 This yields an empirical groundedness evaluation. One model proposes the grouping; an independent model evaluates grouping accuracy.
 

frontend/src/components/stickies.tsx

@@ -87,7 +87,7 @@ const Stickies = () => {
         dragIndex.current = null;
         setDragOverIndex(null);
     };
-
+    console.log(score?.toFixed(2))
     return (
         <div className="stickies-container">
             <Button onClick={handleCluster} isLoading={isPending} label="Group Stickies By Topic" />
@@ -95,7 +95,7 @@ const Stickies = () => {
                 <div className="clusters-container">
                     {score != null && (
                         <div className="cohesion-score">
-                            Cluster cohesion: <strong>{score.toFixed(2)}</strong> — {scoreLabel(score)}
+                            Cluster cohesion: <strong>{scoreLabel(score)}</strong>
                         </div>
                     )}
                     {rankedClusters.map((group, index) => (

frontend/src/styles/stickies.css

@@ -40,10 +40,12 @@
 }
 
 .cluster-header {
+    position: relative;
     display: flex;
     align-items: center;
     gap: 12px;
     margin-bottom: 16px;
+    min-height: 32px;
 }
 
 .cluster-rank {
@@ -69,13 +71,18 @@
 }
 
 .cluster-label {
+    position: absolute;
+    left: 50%;
+    transform: translateX(-50%);
+    max-width: 50%;
     margin: 0;
     font-size: 1.2em;
     font-weight: 600;
-  flex: 1;
+    pointer-events: none;
 }
 
 .cluster-drag-handle {
+    margin-left: auto;
     font-size: 1.4em;
     color: #6dd6f4;
     opacity: 0.4;