{"messages":[{"content":"You are a constitutional council ranking individual git commits for ownership allocation.\n\nCompare these two commits. Decide which contributed more lasting value to the project.\n\nJudge substance, not spectacle:\n- Prefer correct, lasting design and real bugfixes over churn, formatting, renames, or generated noise.\n- Prefer clarity and necessity over sheer line count. A small precise change can beat a large diffuse one.\n- Do not favor a side merely because its patch is longer or noisier.\n- Weight what the change does for the project, not the contributor's name.\n\nReturn ONLY a JSON object: {\"winner\": \"A\" or \"B\", \"ratio\": \"N:M\", \"explanation\": \"...\"}\nThe explanation must cite concrete differences in the patches (1-3 sentences).\n\nSide A — contributor: tommy-mor\nSide A — commit message:\n[30a67104] fixes\n\nSide A — unified diff (full patch):\ndiff --git a/agents.md b/agents.md\nindex a6a283716e09fcaba1fd690f4e877e0bbecda2c0..d9a924d2f77c444d9b112bbf37a480b963ace4f0 100644\n--- a/agents.md\n+++ b/agents.md\n@@ -39,7 +39,7 @@ Strict **CSP** that blocks `eval` would break the current app. Other projects ma\n \n - **`VoteComparePost`:** On success returns **`text/javascript`** that **morphs** **`#vote-compare-preview`** (new ingest card) and **`#vote-edge-history-region`** (recomputed edge list). Uses **`RpcResult::PostOk`**’s **`post_id`** / **`post_index`** for the card. **`__rpc__`** carries **`form_action: \"/ui\"`**; **`thread_tag`** and ratio fields come from the same form as **`$form`** holes.\n \n-- **Garden pin / compare voting:** Cookie **`slug_garden_pin`** via **`set_garden_pin`**. Pairwise UI: **`GET /vote/compare?…`** / **`GET /r/:room_key/vote/compare?…`**. HUD: **`#slug-pin-hud`** when **`layout`** passes garden metadata on **`body`**.\n+- **Garden pin / compare voting:** Cookie **`slug_garden_pin`** via **`set_garden_pin`**. Pairwise UI: **`GET /vote/compare?…`** / **`GET /r/:room_key/vote/compare?…`**. HUD: **`#slug-pin-hud`** when **`layout`** passes garden metadata on **`body`**; the label is **`POST /ui`** **`set_garden_pin`** **`clear:true`** (**`slug_ui.js`**), not a permalink to the item.\n \n **Rule of thumb:** New **CLI or API** verbs → `RpcCommand`. New **in-page morph or form-driven** behavior that only makes sense in the browser → `HtmlUiAction`. If both need the same operation, implement the real work once (e.g. call shared RPC helpers from `post_ui_html`) and keep the wire shapes separate.\n \ndiff --git a/server/src/html/garden.rs b/server/src/html/garden.rs\nindex 8a46b1e92d38f2c390f88d48750d95d11388cd73..121d9498e8cb93d4d001dc1bbce23d74fbb958f5 100644\n--- a/server/src/html/garden.rs\n+++ b/server/src/html/garden.rs\n@@ -16,7 +16,6 @@ use crate::{\n     canonical_path::{canonicalize_item, canonicalize_tag},\n     form_template::template_json_compact,\n     html::{\n-        forum::ingest_entry_markup,\n         ui_action::UI_RPC_FIELD,\n         user_can_post_room,\n         JsBuilder,\n@@ -111,6 +110,23 @@ fn votes_for_edge(content: &ContentState, a: &ItemId, b: &ItemId) -> Vec<crate::\n     out\n }\n \n+/// Number of vote ingests recorded for this unordered pair in `content` (same scope as ranking).\n+fn edge_vote_count_for_pair(content: &ContentState, a: &ItemId, b: &ItemId) -> usize {\n+    let (lo, hi) = canonical_edge_items(a, b);\n+    let lo_s = lo.as_str();\n+    let hi_s = hi.as_str();\n+    content\n+        .item_votes\n+        .get(&lo)\n+        .into_iter()\n+        .flat_map(|q| q.iter())\n+        .filter(|v| {\n+            (v.a.as_str() == lo_s && v.b.as_str() == hi_s)\n+                || (v.a.as_str() == hi_s && v.b.as_str() == lo_s)\n+        })\n+        .count()\n+}\n+\n fn vote_thread_tags_for_pair(content: &ContentState, a: &ItemId, b: &ItemId) -> Vec<String> {\n     let set: HashSet<String> = content\n         .item_threads\n@@ -288,6 +304,7 @@ fn child_row_pin_or_vote(\n     nav: &ThreadNav,\n     row_item: &ItemId,\n     pinned_room_and_item: Option<&(String, ItemId)>,\n+    scope_content: &ContentState,\n     next_path: &str,\n ) -> maud::Markup {\n     let pin_matches_scope = pinned_room_and_item\n@@ -315,7 +332,16 @@ fn child_row_pin_or_vote(\n                 @if pi == row_item {\n                     span class=\"ont-garden-pinned-here\" title=\"Pinned\" aria-label=\"Pinned\" { \"📌\" }\n                 } @else {\n-                    a class=\"ont-garden-vote-ico\" href=(vote_compare_href(nav, pi, row_item, None)) title=\"Vote vs pinned\" aria-label=\"Vote\" { \"⚖\" }\n+                    @let nv = edge_vote_count_for_pair(scope_content, pi, row_item);\n+                    @let tip = format!(\n+                        \"Compare and vote — {nv} pairwise vote{} in this scope for pinned vs this row\",\n+                        if nv == 1 { \"\" } else { \"s\" },\n+                    );\n+                    @let aria = format!(\"Vote; {} pairwise {}\", nv, if nv == 1 { \"vote\" } else { \"votes\" });\n+                    a class=\"ont-garden-vote-ico\" href=(vote_compare_href(nav, pi, row_item, None)) title=(tip) aria-label=(aria) {\n+                        span class=\"ont-garden-vote-glyph\" aria-hidden=\"true\" { \"⚖\" }\n+                        span class=\"ont-garden-vote-count\" { (format!(\"{}\", nv)) }\n+                    }\n                 }\n             } @else {\n                 form method=\"POST\" action=\"/ui\" data-navigate=\"full\" class=\"ont-pin-form ont-garden-pin-form\" {\n@@ -978,10 +1004,9 @@ async fn render_scope_view(\n ) -> axum::response::Response {\n     let scope = nav.scope();\n     let pin_ref = pinned_item_from_jar(&jar);\n-    let model = {\n-        let reduced = state.reduced.read().await;\n-        build_item_page_view_model(&reduced, &scope, browse.item())\n-    };\n+    let reduced = state.reduced.read().await;\n+    let model = build_item_page_view_model(&reduced, &scope, browse.item());\n+    let scope_content = content_for_garden_view(&reduced, &scope);\n     let thread_href = |tag: &str| nav.thread_url(tag);\n     let external_empty_body = browse.is_external() && model.body.is_none();\n     let cli_path_arg = item_display_path(&model.item);\n@@ -1108,7 +1133,7 @@ async fn render_scope_view(\n                                     @let item_url = item_href(r.item.as_str(), &nav);\n                                     @let score_str = format!(\"{:.3}\", r.score);\n                                     li data-garden-item=(r.item.as_str()) {\n-                                        (child_row_pin_or_vote(&nav, &r.item, pin_ref.as_ref(), &next_for_pin))\n+                                        (child_row_pin_or_vote(&nav, &r.item, pin_ref.as_ref(), scope_content, &next_for_pin))\n                                         a class=\"item-link\" href=(item_url) { code { (item_display_path(r.item.as_str())) } }\n                                         span class=\"ont-rank-score\" { (score_str) }\n                                     }\n@@ -1124,7 +1149,7 @@ async fn render_scope_view(\n                         ul class=\"ont-group-list\" {\n                             @for name in &model.child_rankings.unranked_items {\n                                 li data-garden-item=(name.as_str()) {\n-                                    (child_row_pin_or_vote(&nav, name, pin_ref.as_ref(), &next_for_pin))\n+                                    (child_row_pin_or_vote(&nav, name, pin_ref.as_ref(), scope_content, &next_for_pin))\n                                     @let href = item_href(name.as_str(), &nav);\n                                     a class=\"item-link\" href=(href) { code { (item_display_path(name.as_str())) } }\n                                 }\n@@ -1363,6 +1388,33 @@ mod tests {\n         }));\n     }\n \n+    #[test]\n+    fn edge_vote_count_for_pair_matches_votes_for_edge_len() {\n+        use super::{\n+            content_for_garden_view, edge_vote_count_for_pair, votes_for_edge,\n+        };\n+        use crate::path_types::ItemId;\n+        let mut reduced = ReducerState::default();\n+        apply_ingest(\n+            &mut reduced,\n+            1,\n+            \"@00000000-0000-0000-0000-000000000000:test:local/test\\n\\\n+             ~/topic {root}\\n\\\n+             ~/topic/a {alpha}\\n\\\n+             ~/topic/b {beta}\\n\\\n+             ~/topic/a 3:2 ~/topic/b {first vote}\\n\\\n+             ~/topic/b 2:3 ~/topic/a {second vote}\\n\",\n+        );\n+        let content = content_for_garden_view(&reduced, &ScopeId::Public);\n+        let a = ItemId::parse(\"~/topic/a\").unwrap().normalized_storage();\n+        let b = ItemId::parse(\"~/topic/b\").unwrap().normalized_storage();\n+        assert_eq!(\n+            edge_vote_count_for_pair(content, &a, &b),\n+            votes_for_edge(content, &a, &b).len()\n+        );\n+        assert_eq!(votes_for_edge(content, &a, &b).len(), 2);\n+    }\n+\n     #[test]\n     fn item_page_model_includes_body_and_unranked_without_votes() {\n         let mut reduced = ReducerState::default();\ndiff --git a/server/static/slug_ui.js b/server/static/slug_ui.js\nindex c0de1cddbba78227dfb80bfd41e7b855b3a42bc3..86f935f8dd998f3d6df016f33b1e47f9780782ea 100644\n--- a/server/static/slug_ui.js\n+++ b/server/static/slug_ui.js\n@@ -170,15 +170,6 @@\n       return { room: raw.slice(0, i), item: raw.slice(i + 1) };\n     }\n \n-    function gardenItemHref(prefix, storageUrl) {\n-      var marker = 'https://slug.social/~/';\n-      if (storageUrl.indexOf(marker) === 0) {\n-        var tail = storageUrl.slice(marker.length);\n-        return prefix.replace(/\\/$/, '') + (tail ? '/' + tail : '');\n-      }\n-      return storageUrl;\n-    }\n-\n     function refreshPinHud() {\n       var hud = document.getElementById('slug-pin-hud');\n       if (!hud) return;\n@@ -187,19 +178,37 @@\n       var pin = decodePinCookie();\n       hud.innerHTML = '';\n       if (!pin || !prefix || pin.room !== bodyRoom) return;\n-      var a = document.createElement('a');\n-      a.className = 'slug-pin-hud-link';\n-      a.href = gardenItemHref(prefix, pin.item);\n-      a.title = 'Pinned item';\n+      var form = document.createElement('form');\n+      form.method = 'POST';\n+      form.action = '/ui';\n+      form.setAttribute('data-navigate', 'full');\n+      form.className = 'slug-pin-hud-form';\n+      var rpc = document.createElement('input');\n+      rpc.type = 'hidden';\n+      rpc.name = '__rpc__';\n+      rpc.value = JSON.stringify({\n+        action: 'set_garden_pin',\n+        clear: true,\n+        room_wire: '',\n+        next: window.location.pathname + window.location.search,\n+        form_action: '/ui',\n+      });\n+      form.appendChild(rpc);\n+      var btn = document.createElement('button');\n+      btn.type = 'submit';\n+      btn.className = 'slug-pin-hud-link slug-pin-hud-unpin-btn';\n+      btn.title = 'Unpin — removes this item from the corner HUD';\n+      btn.setAttribute('aria-label', 'Unpin pinned item');\n       var span = document.createElement('span');\n       span.className = 'slug-pin-hud-glyph';\n       span.setAttribute('aria-hidden', 'true');\n       span.textContent = '📌';\n-      a.appendChild(span);\n+      btn.appendChild(span);\n       var label = pin.item.replace(/^https:\\/\\/slug\\.social\\/~\\/?/, '~/');\n       if (label.length > 36) label = label.slice(0, 34) + '…';\n-      a.appendChild(document.createTextNode(' ' + label));\n-      hud.appendChild(a);\n+      btn.appendChild(document.createTextNode(' ' + label));\n+      form.appendChild(btn);\n+      hud.appendChild(form);\n     }\n     refreshPinHud();\n \ndiff --git a/server/static/theme_default.css b/server/static/theme_default.css\nindex ec0fbe7acee0aa2802f978f14a9b0fc86e78c5b8..9178f0629cfb868348740e6dea1626dc6afb8345 100644\n--- a/server/static/theme_default.css\n+++ b/server/static/theme_default.css\n@@ -799,6 +799,12 @@ details > summary::-webkit-details-marker { display: none; }\n }\n \n /* Pinned item HUD — bottom bar, same plane as spread */\n+.slug-pin-hud-form {\n+  display: inline;\n+  margin: 0;\n+  padding: 0;\n+  border: none;\n+}\n #slug-pin-hud.slug-pin-hud {\n   margin-left: auto;\n   max-width: min(42vw, 280px);\n@@ -808,6 +814,13 @@ details > summary::-webkit-details-marker { display: none; }\n   overflow: hidden;\n   text-overflow: ellipsis;\n }\n+.slug-pin-hud-link.slug-pin-hud-unpin-btn {\n+  background: transparent;\n+  border: none;\n+  cursor: pointer;\n+  font-size: inherit;\n+  font-family: inherit;\n+}\n .slug-pin-hud-link {\n   color: var(--ui);\n   text-decoration: none;\n@@ -815,7 +828,10 @@ details > summary::-webkit-details-marker { display: none; }\n   align-items: center;\n   gap: 4px;\n }\n-.slug-pin-hud-link:hover { color: var(--signal); }\n+.slug-pin-hud-link:hover,\n+.slug-pin-hud-unpin-btn:hover {\n+  color: var(--signal);\n+}\n .slug-pin-hud-glyph { font-size: 13px; line-height: 1; }\n \n /* Garden pin / vote controls */\n@@ -890,10 +906,21 @@ span.ont-garden-pinned-here {\n   align-items: center;\n   justify-content: center;\n }\n+a.ont-garden-vote-ico {\n+  gap: 4px;\n+}\n a.ont-garden-vote-ico:hover {\n   color: var(--signal);\n   background: var(--g4);\n }\n+.ont-garden-vote-count {\n+  font-size: 10px;\n+  font-weight: 700;\n+  font-variant-numeric: tabular-nums;\n+}\n+span.ont-garden-vote-glyph {\n+  line-height: 1;\n+}\n span.ont-garden-pinned-here {\n   border-color: var(--link);\n   color: var(--signal);\ndiff --git a/server/static/theme_retro_craft.css b/server/static/theme_retro_craft.css\nindex 092d4b3540b052cc86870179e4c264541c4446cc..efaeed06d01fd835df0621f4c621c8f034c8b536 100644\n--- a/server/static/theme_retro_craft.css\n+++ b/server/static/theme_retro_craft.css\n@@ -593,6 +593,12 @@ body.view-ontology #controls {\n    (Global craft `code` + `button[type=submit]` are tuned for dark\n    thread pages; these overrides match the cream ontology shell.)\n    ---------------------------------------------------------------- */\n+body.view-ontology .slug-pin-hud-form {\n+  display: inline;\n+  margin: 0;\n+  padding: 0;\n+  border: none;\n+}\n body.view-ontology #slug-pin-hud.slug-pin-hud {\n   margin-left: auto;\n   max-width: min(42vw, 280px);\n@@ -603,6 +609,14 @@ body.view-ontology #slug-pin-hud.slug-pin-hud {\n   overflow: hidden;\n   text-overflow: ellipsis;\n }\n+body.view-ontology .slug-pin-hud-link.slug-pin-hud-unpin-btn {\n+  background: transparent;\n+  border: none;\n+  cursor: pointer;\n+  font-size: inherit;\n+  font-family: inherit;\n+  padding: 0;\n+}\n body.view-ontology .slug-pin-hud-link {\n   color: #1a4a8c;\n   text-decoration: none;\n@@ -610,7 +624,8 @@ body.view-ontology .slug-pin-hud-link {\n   align-items: center;\n   gap: 0.25rem;\n }\n-body.view-ontology .slug-pin-hud-link:hover {\n+body.view-ontology .slug-pin-hud-link:hover,\n+body.view-ontology .slug-pin-hud-unpin-btn:hover {\n   color: #0d3d82;\n   text-decoration: underline;\n }\n@@ -676,6 +691,20 @@ body.view-ontology .ont-garden-child-actions {\n   gap: 0.1rem;\n }\n body.view-ontology button.ont-garden-pin-ico,\n+body.view-ontology a.ont-garden-vote-ico {\n+  gap: 0.2rem;\n+}\n+body.view-ontology .ont-garden-vote-count {\n+  font-size: 0.65rem;\n+  font-family: var(--font-ui);\n+  font-weight: 600;\n+  font-variant-numeric: tabular-nums;\n+  opacity: 0.92;\n+}\n+body.view-ontology span.ont-garden-vote-glyph {\n+  line-height: 1;\n+}\n+body.view-ontology button.ont-garden-pin-ico,\n body.view-ontology a.ont-garden-vote-ico,\n body.view-ontology span.ont-garden-pinned-here {\n   font-size: 0.95rem;\ndiff --git a/test/browser_garden_pin.clj b/test/browser_garden_pin.clj\nindex 169ff9b6913049094611fb0e5b6683b30220b285..98c086d5647207f3ac72dbb9cbc13488c030eef1 100644\n--- a/test/browser_garden_pin.clj\n+++ b/test/browser_garden_pin.clj\n@@ -21,6 +21,17 @@\n             (do (Thread/sleep 200) (recur))\n             false))))))\n \n+(defn- wait-for-absence-substr [pg selector substr timeout-ms]\n+  \"True once selector text does not contain substr (or is empty), or timeout.\"\n+  (let [deadline (+ (System/currentTimeMillis) timeout-ms)]\n+    (loop []\n+      (let [text (locator/text-content (page/locator pg selector))]\n+        (if (not (and (string? text) (str/includes? text substr)))\n+          true\n+          (if (< (System/currentTimeMillis) deadline)\n+            (do (Thread/sleep 200) (recur))\n+            false))))))\n+\n (defn garden-pin-flow! []\n   (println \"\\n━━━ browser garden pin (POST /ui set_garden_pin + HUD + vote link) ━━━\\n\")\n \n@@ -75,8 +86,14 @@\n                (is (wait-for-text pg \".ont-item-shell\" \"~/gp-pin-b\" 15000) \"on item b page\")\n                (is (wait-for-text pg \"a.ont-vote-compare-btn\" \"vote\" 10000)\n                    \"vote link visible vs pinned item\")\n+               ;; HUD clears pin (POST set_garden_pin clear), not navigate to item\n+               (locator/click (page/locator pg \"#slug-pin-hud button.slug-pin-hud-unpin-btn\"))\n+               (is (wait-for-absence-substr pg \"#slug-pin-hud\" \"gp-pin-a\" 15000)\n+                   \"HUD clears after unpin from HUD button\")\n+               (is (wait-for-absence-substr pg \"body\" \"ont-vote-compare-btn\" 15000)\n+                   \"compare vote CTA removed after HUD unpin on same reload\")\n                (is (str/includes? (or (page/url pg) \"\") \"/~/gp-pin-b\")\n-                   \"still on item b after vote link check\"))))))\n+                   \"still on item b after HUD unpin\"))))))\n \n      (finally\n        (when-some [s @!server] (common/kill-server s))\n\n\nSide B — contributor: tommy-mor\nSide B — commit message:\n[04b81f91] Fix vote compare highlighting\n\nCo-authored-by: Cursor <cursoragent@cursor.com>\n\nSide B — unified diff (full patch):\ndiff --git a/server/src/html/mod.rs b/server/src/html/mod.rs\nindex 588cf62bcea608ed4ede363810f022a67b43b960..e180a0ca542a33e2300c0a4809e6b9cfee07ecfe 100644\n--- a/server/src/html/mod.rs\n+++ b/server/src/html/mod.rs\n@@ -291,18 +291,17 @@ fn rank_list(\n     label: &str,\n     items: &[RankedItem],\n     start_rank: usize,\n-    total_ranked: usize,\n-    ordinal_offset: usize,\n     highlighted: &HashSet<ItemId>,\n     tree: &GlobalTree,\n ) -> Markup {\n+    let group_len = items.len();\n     html! {\n         @if !items.is_empty() {\n             h3 class=\"rank-heading muted small\" { (label) }\n             ol class=\"rank-list\" {\n                 @for (i, r) in items.iter().enumerate() {\n                     @let href = item_href(&r.item);\n-                    @let style = rank_row_style(parent, ordinal_offset + i, total_ranked);\n+                    @let style = rank_row_style(parent, i, group_len);\n                     @let class = rank_row_class(&r.item, highlighted);\n                     li class=(class)\n                         data-rank-item=(r.item.as_str())\n@@ -420,8 +419,6 @@ pub fn ranking_panel_with_highlights(\n \n     let has_ranked = !ranked_groups.is_empty();\n     let multi = ranked_groups.len() > 1;\n-    let total_ranked: usize = ranked_groups.iter().map(|g| g.len()).sum();\n-    let mut ordinal_offset = 0usize;\n \n     html! {\n         section id=\"ranking-panel\" class=\"demo-panel\" {\n@@ -436,8 +433,7 @@ pub fn ranking_panel_with_highlights(\n             } @else {\n                 @for (gi, ranked) in ranked_groups.iter().enumerate() {\n                     @let label = if multi { format!(\"Ranking group {}\", gi + 1) } else { \"Ranking\".to_string() };\n-                    (rank_list(item, &label, ranked, 1, total_ranked, ordinal_offset, highlighted, tree))\n-                    @let _ = { ordinal_offset += ranked.len(); };\n+                    (rank_list(item, &label, ranked, 1, highlighted, tree))\n                 }\n                 (unranked_list(\"Unranked\", &unranked, highlighted, tree))\n             }\n@@ -520,7 +516,20 @@ pub async fn browse(State(state): State<AppState>, uri: Uri) -> impl IntoRespons\n \n #[cfg(test)]\n mod tests {\n-    use super::SORTER_UI_JS;\n+    use super::{rank_row_style, SORTER_UI_JS};\n+    use crate::path_types::ItemId;\n+\n+    #[test]\n+    fn rank_row_style_gradients_per_group_not_globally() {\n+        let parent = ItemId::opaque(\"test-scope\");\n+        let first_in_four = rank_row_style(&parent, 0, 4);\n+        let last_in_four = rank_row_style(&parent, 3, 4);\n+        let first_in_two = rank_row_style(&parent, 0, 2);\n+        let last_in_two = rank_row_style(&parent, 1, 2);\n+        assert_eq!(first_in_four, first_in_two);\n+        assert_eq!(last_in_four, last_in_two);\n+        assert_ne!(first_in_four, last_in_four);\n+    }\n \n     #[test]\n     fn vote_slider_left_position_favors_left_item() {\ndiff --git a/server/src/html/vote.rs b/server/src/html/vote.rs\nindex 483c7ff8cd35266744957cf0087f2b5f76f1a237..30dab303b9d1e763a5b9261dffff13a778e3e4e3 100644\n--- a/server/src/html/vote.rs\n+++ b/server/src/html/vote.rs\n@@ -19,7 +19,7 @@ use crate::{\n     ui_action::UI_RPC_FIELD,\n };\n \n-use super::{breadcrumb_path, item_href, layout};\n+use super::{breadcrumb_path, layout};\n \n #[derive(Debug, Deserialize)]\n pub struct VoteQuery {\n@@ -59,17 +59,6 @@ fn child_title(tree: &GlobalTree, id: &ItemId) -> String {\n         .unwrap_or_else(|| display_label(id))\n }\n \n-fn ratio_pct(ratio_left: i32, ratio_right: i32) -> f64 {\n-    let l = ratio_left.max(0) as f64;\n-    let r = ratio_right.max(0) as f64;\n-    let sum = l + r;\n-    if sum <= 0.0 {\n-        50.0\n-    } else {\n-        (l / sum) * 100.0\n-    }\n-}\n-\n fn ratios_for_page(v: &VoteData, page_left: &ItemId, page_right: &ItemId) -> (i32, i32) {\n     match (v.a.as_str(), v.b.as_str()) {\n         (a, b) if a == page_left.as_str() && b == page_right.as_str() => {\n@@ -94,6 +83,37 @@ fn edge_votes(group: &GroupState, left: &ItemId, right: &ItemId) -> Vec<VoteData\n         .collect()\n }\n \n+/// HUD `data-winner` value: which side the ratio favours on this page.\n+fn winner_side(r_left: i32, r_right: i32) -> &'static str {\n+    if r_left > r_right {\n+        \"left\"\n+    } else if r_right > r_left {\n+        \"right\"\n+    } else {\n+        \"even\"\n+    }\n+}\n+\n+fn winner_text(r_left: i32, r_right: i32) -> &'static str {\n+    match winner_side(r_left, r_right) {\n+        \"left\" => \"left wins\",\n+        \"right\" => \"right wins\",\n+        _ => \"tie\",\n+    }\n+}\n+\n+/// Map stored ratios to the live slider position (0 = full left, 100 = full right).\n+/// Matches `sorter_ui.js`: `left = 100 - v`, `right = v`.\n+fn slider_value_from_ratios(r_left: i32, r_right: i32) -> i32 {\n+    let l = r_left.max(0) as f64;\n+    let r = r_right.max(0) as f64;\n+    let sum = l + r;\n+    if sum <= 0.0 {\n+        return 50;\n+    }\n+    ((r / sum) * 100.0).round().clamp(0.0, 100.0) as i32\n+}\n+\n fn vote_edge_history(tree: &GlobalTree, group: &GroupState, left: &ItemId, right: &ItemId) -> Markup {\n     let mut votes = edge_votes(group, left, right);\n     votes.sort_by(|a, b| b.ts.cmp(&a.ts));\n@@ -106,17 +126,26 @@ fn vote_edge_history(tree: &GlobalTree, group: &GroupState, left: &ItemId, right\n             h3 class=\"vote-edge-history-title\" {\n                 \"votes on this pair\"\n             }\n+            p class=\"muted small vote-edge-legend\" {\n+                (format!(\"left: {legend_left} — right: {legend_right}\"))\n+            }\n             ul class=\"vote-edge-history\" {\n                 @for v in &votes {\n                     @let (r_left, r_right) = ratios_for_page(v, left, right);\n-                    @let pct = ratio_pct(r_left, r_right);\n+                    @let slider_val = slider_value_from_ratios(r_left, r_right);\n+                    @let side = winner_side(r_left, r_right);\n+                    @let label = winner_text(r_left, r_right);\n                     li class=\"vote-edge-history-row\" {\n                         div class=\"vote-edge-meta\" {\n                             span class=\"vote-edge-ratio\" { (format!(\"{}:{}\", r_left, r_right)) }\n+                            span class=\"vote-edge-winner muted small\" { \" · \" (label) }\n                         }\n-                        div class=\"ratio-bar vote-edge-bar\" aria-hidden=\"true\" {\n-                            div class=\"ratio-left\" style={(format!(\"width: {:.3}%;\", pct))} {}\n-                            div class=\"ratio-right\" style={(format!(\"width: {:.3}%;\", 100.0 - pct))} {}\n+                        label class=\"vote-hud-slider vote-edge-slider\" aria-hidden=\"true\" {\n+                            input type=\"range\" class=\"vote-edge-range\" min=\"0\" max=\"100\" value=(slider_val)\n+                                data-winner=(side)\n+                                style={(format!(\"--vote-slider-pct: {}%;\", slider_val))}\n+                                disabled\n+                                tabindex=\"-1\";\n                         }\n                     }\n                 }\n@@ -283,7 +312,6 @@ pub async fn vote_page(\n                         span class=\"vote-compare-vs\" { \"vs\" }\n                         (vote_compare_item_card(&tree, &right, \"vote-compare-right\"))\n                     }\n-                    (vote_back_nav(&parent))\n                     div id=\"vote-edge-history-region\" {\n                         (edge_history)\n                     }\n@@ -308,3 +336,66 @@ pub async fn vote_page(\n     )\n     .into_response()\n }\n+\n+#[cfg(test)]\n+mod polarity_tests {\n+    use super::*;\n+    use crate::ranking::ranked_items;\n+    use crate::reducer::GlobalTree;\n+\n+    fn id(s: &str) -> ItemId {\n+        ItemId::parse(s).unwrap()\n+    }\n+\n+    /// The page's left number must always equal the vote's weight for the\n+    /// item shown on the left, regardless of which order the vote stored a/b.\n+    #[test]\n+    fn ratios_for_page_orients_to_page_left() {\n+        let left = id(\"left_item\");\n+        let right = id(\"right_item\");\n+\n+        // Stored a == page left: keep order.\n+        let v1 = VoteData::from_recorded(1, left.as_str(), right.as_str(), 9, 1).unwrap();\n+        assert_eq!(ratios_for_page(&v1, &left, &right), (9, 1));\n+\n+        // Stored a == page right: swap so left stays left.\n+        let v2 = VoteData::from_recorded(2, right.as_str(), left.as_str(), 9, 1).unwrap();\n+        assert_eq!(ratios_for_page(&v2, &left, &right), (1, 9));\n+    }\n+\n+    #[test]\n+    fn winner_side_follows_larger_ratio() {\n+        assert_eq!(winner_side(9, 1), \"left\");\n+        assert_eq!(winner_side(1, 9), \"right\");\n+        assert_eq!(winner_side(1, 1), \"even\");\n+    }\n+\n+    #[test]\n+    fn slider_value_matches_hud_mapping() {\n+        assert_eq!(slider_value_from_ratios(9, 1), 10);\n+        assert_eq!(slider_value_from_ratios(1, 4), 80);\n+        assert_eq!(slider_value_from_ratios(1, 1), 50);\n+    }\n+\n+    /// End-to-end polarity invariant: a vote that favours the LEFT item (higher\n+    /// `ratio_left`, recorded as the RPC's `a`) must make that item rank #1.\n+    /// This is the property the UI must preserve: sliding left => left wins.\n+    #[test]\n+    fn sliding_left_makes_left_item_win_ranking() {\n+        let parent = id(\"scope\");\n+        let left = id(\"left_item\");\n+        let right = id(\"right_item\");\n+\n+        // Slider dragged left yields e.g. 9:1 with a = left item.\n+        let vote = VoteData::from_recorded(1, left.as_str(), right.as_str(), 9, 1).unwrap();\n+        let mut tree = GlobalTree::new();\n+        tree.apply_vote(&parent, vote);\n+\n+        let group = &tree.get(&parent).unwrap().local_ranking;\n+        let ranked = ranked_items(group);\n+        assert_eq!(\n+            ranked[0].item, left,\n+            \"left item should rank first when ratio favours the left\"\n+        );\n+    }\n+}\ndiff --git a/server/static/sorter.css b/server/static/sorter.css\nindex 5da967e8bfddc2bc34662fced841860f63f1ef36..bdd3d931365703705be08537a07f3ccaf975d3ea 100644\n--- a/server/static/sorter.css\n+++ b/server/static/sorter.css\n@@ -124,7 +124,7 @@ code {\n   z-index: 1;\n   box-shadow:\n     inset 0 0 0 3px var(--accent),\n-    inset 0 0 0 5px color-mix(in oklch, var(--rank-fg) 70%, transparent);\n+    inset 0 0 0 5px color-mix(in oklch, var(--rank-fg, var(--fg)) 70%, transparent);\n   filter: saturate(1.15) brightness(1.04);\n }\n \n@@ -320,7 +320,7 @@ h1 {\n   grid-template-columns: var(--vote-ratio-col) minmax(0, 1fr) var(--vote-actions-col);\n   gap: 0.5rem 0.65rem;\n   align-items: center;\n-  --vote-ratio-col: 3.25rem;\n+  --vote-ratio-col: 12.5rem;\n   --vote-actions-col: 11.5rem;\n }\n \n@@ -332,7 +332,7 @@ h1 {\n   margin: 0;\n   width: var(--vote-ratio-col);\n   min-width: var(--vote-ratio-col);\n-  text-align: center;\n+  text-align: right;\n   white-space: nowrap;\n }\n \n@@ -474,6 +474,16 @@ h1 {\n   --vote-track-muted: color-mix(in oklch, var(--muted) 55%, var(--bg));\n }\n \n+/* Center-anchored fill: the accent grows from the midpoint toward the thumb,\n+   so the highlighted mass always sits on the *winning* side (the side the\n+   thumb was dragged toward). Left winning => accent on the left half. */\n+.vote-hud-slider input[type=\"range\"][data-winner=\"even\"]::-webkit-slider-runnable-track {\n+  height: 0.65rem;\n+  border-radius: 0;\n+  border: 2px solid var(--border);\n+  background: var(--vote-track-muted);\n+}\n+\n .vote-hud-slider input[type=\"range\"][data-winner=\"left\"]::-webkit-slider-runnable-track {\n   height: 0.65rem;\n   border-radius: 0;\n@@ -483,7 +493,9 @@ h1 {\n     var(--vote-track-muted) 0%,\n     var(--vote-track-muted) var(--vote-slider-pct, 50%),\n     var(--accent) var(--vote-slider-pct, 50%),\n-    var(--accent) 100%\n+    var(--accent) 50%,\n+    var(--vote-track-muted) 50%,\n+    var(--vote-track-muted) 100%\n   );\n }\n \n@@ -493,7 +505,9 @@ h1 {\n   border: 2px solid var(--border);\n   background: linear-gradient(\n     to right,\n-    var(--accent) 0%,\n+    var(--vote-track-muted) 0%,\n+    var(--vote-track-muted) 50%,\n+    var(--accent) 50%,\n     var(--accent) var(--vote-slider-pct, 50%),\n     var(--vote-track-muted) var(--vote-slider-pct, 50%),\n     var(--vote-track-muted) 100%\n@@ -513,26 +527,35 @@ h1 {\n }\n \n .vote-hud-slider input[type=\"range\"][data-winner=\"left\"]::-moz-range-track,\n-.vote-hud-slider input[type=\"range\"][data-winner=\"right\"]::-moz-range-track {\n+.vote-hud-slider input[type=\"range\"][data-winner=\"right\"]::-moz-range-track,\n+.vote-hud-slider input[type=\"range\"][data-winner=\"even\"]::-moz-range-track {\n   height: 0.65rem;\n   border-radius: 0;\n   border: 2px solid var(--border);\n }\n \n+.vote-hud-slider input[type=\"range\"][data-winner=\"even\"]::-moz-range-track {\n+  background: var(--vote-track-muted);\n+}\n+\n .vote-hud-slider input[type=\"range\"][data-winner=\"left\"]::-moz-range-track {\n   background: linear-gradient(\n     to right,\n     var(--vote-track-muted) 0%,\n     var(--vote-track-muted) var(--vote-slider-pct, 50%),\n     var(--accent) var(--vote-slider-pct, 50%),\n-    var(--accent) 100%\n+    var(--accent) 50%,\n+    var(--vote-track-muted) 50%,\n+    var(--vote-track-muted) 100%\n   );\n }\n \n .vote-hud-slider input[type=\"range\"][data-winner=\"right\"]::-moz-range-track {\n   background: linear-gradient(\n     to right,\n-    var(--accent) 0%,\n+    var(--vote-track-muted) 0%,\n+    var(--vote-track-muted) 50%,\n+    var(--accent) 50%,\n     var(--accent) var(--vote-slider-pct, 50%),\n     var(--vote-track-muted) var(--vote-slider-pct, 50%),\n     var(--vote-track-muted) 100%\n@@ -573,20 +596,23 @@ h1 {\n   margin-bottom: 0.25rem;\n }\n \n-.ratio-bar {\n-  display: flex;\n-  height: 8px;\n-  border-radius: 0;\n-  overflow: hidden;\n-  background: var(--border);\n+/* Read-only sliders in vote history — same track/thumb styling as the HUD. */\n+.vote-edge-slider {\n+  display: block;\n+  margin-top: 0.15rem;\n }\n \n-.ratio-left {\n-  background: var(--accent);\n+.vote-edge-slider input[type=\"range\"] {\n+  pointer-events: none;\n+  cursor: default;\n+}\n+\n+.vote-edge-slider input[type=\"range\"]:disabled {\n+  opacity: 1;\n }\n \n-.ratio-right {\n-  background: var(--muted);\n+.vote-edge-legend {\n+  margin: 0 0 0.5rem;\n }\n \n @media (max-width: 900px) {\ndiff --git a/server/static/sorter_ui.js b/server/static/sorter_ui.js\nindex f665b45f4fd4771427dc4c37e563e4976873beee..5d6d765f69f301722e59248c76e919043559fb78 100644\n--- a/server/static/sorter_ui.js\n+++ b/server/static/sorter_ui.js\n@@ -138,6 +138,10 @@\n     function update() {\n       var v = parseInt(slider.value, 10);\n       if (!Number.isFinite(v)) v = 50;\n+      // Slider position drives the colored fill (a center-anchored bar that\n+      // grows toward whichever side is winning — see sorter.css). Sliding the\n+      // thumb left raises the left number; left winning keeps the accent mass\n+      // on the left, matching the \"votes on this pair\" history bars.\n       slider.style.setProperty('--vote-slider-pct', v + '%');\n       slider.setAttribute('aria-valuenow', String(v));\n       var left = Math.max(1, 100 - v);\n@@ -147,8 +151,12 @@\n       right = right / divisor;\n       if (leftInput) leftInput.value = String(left);\n       if (rightInput) rightInput.value = String(right);\n-      if (ratioDisplay) ratioDisplay.textContent = left + ':' + right;\n-      slider.dataset.winner = left >= right ? 'left' : 'right';\n+      var winner = left > right ? 'left' : (right > left ? 'right' : 'even');\n+      slider.dataset.winner = winner;\n+      if (ratioDisplay) {\n+        var label = winner === 'even' ? 'tie' : (winner + ' wins');\n+        ratioDisplay.textContent = left + ':' + right + ' \\u00b7 ' + label;\n+      }\n     }\n     slider.addEventListener('input', update);\n     update();\n","role":"user"}],"model":"~x-ai/grok-latest"}