diff --git a/web/templates/base.html b/web/templates/base.html
index 2266767..2b6abce 100644
--- a/web/templates/base.html
+++ b/web/templates/base.html
@@ -26,5 +26,6 @@
 <div class="container-fluid mt-2 px-3">
   {% block content %}{% endblock %}
 </div>
+{% block scripts %}{% endblock %}
 </body>
 </html>
\ No newline at end of file
diff --git a/web/templates/candidates.html b/web/templates/candidates.html
index a36d69b..4128e96 100644
--- a/web/templates/candidates.html
+++ b/web/templates/candidates.html
@@ -85,8 +85,10 @@
                   {% if p.direction %}<span class="badge bg-light">{{ p.direction }}</span>{% endif %}
                 </span>
               </a>
-              <input class="form-check-input ms-auto mt-1" type="checkbox" name="ids" value="{{ p.id }}"
-                     form="bulk-form" {% if selected and selected.id == p.id %}checked{% endif %}>
+              <input type="checkbox" name="ids" value="{{ p.id }}" form="bulk-form"
+                     class="ms-auto flex-shrink-0"
+                     style="width:1.3em;height:1.3em;cursor:pointer;"
+                     {% if selected and selected.id == p.id %}checked{% endif %}>
             </div>
             {% endfor %}
           </div>
@@ -199,4 +201,19 @@
     </div>
   </div>
 </div>
+{% endblock %}
+{% block scripts %}
+<script>
+(function(){
+  var boxes = document.querySelectorAll('#bulk-form input[name="ids"]');
+  var badge = document.getElementById('sel-count');
+  function upd(){
+    var n = 0;
+    for (var i = 0; i < boxes.length; i++) if (boxes[i].checked) n++;
+    badge.textContent = n;
+  }
+  for (var i = 0; i < boxes.length; i++) boxes[i].addEventListener('change', upd);
+  upd();
+})();
+</script>
 {% endblock %}
\ No newline at end of file