diff --git a/app/assets/stylesheets/cards.css b/app/assets/stylesheets/cards.css
index d6352661b..a91eafae7 100644
--- a/app/assets/stylesheets/cards.css
+++ b/app/assets/stylesheets/cards.css
@@ -468,9 +468,11 @@
   }
 
   .input.boost__input {
+    --hover-size: 0;
     --input-border-radius: 0;
     --input-border-size: 0;
     --input-padding: 0;
+    --outline-size: 0;
 
     color: inherit;
     font-size: inherit;
@@ -478,11 +480,22 @@
     inline-size: min-content;
     max-inline-size: 3ch;
     min-inline-size: 1ch;
+    outline: none;
 
     @supports (field-sizing: content) {
       field-sizing: content;
       max-inline-size: unset;
     }
+
+    &:focus {
+      background-color: var(--color-highlight);
+    }
+
+    &::-webkit-outer-spin-button,
+    &::-webkit-inner-spin-button {
+      -webkit-appearance: none;
+      margin: 0;
+    }
   }
 
   .card__popped {
diff --git a/app/views/bubbles/boosts/_boosts.html.erb b/app/views/bubbles/boosts/_boosts.html.erb
index b741a89fb..ca12a1ed5 100644
--- a/app/views/bubbles/boosts/_boosts.html.erb
+++ b/app/views/bubbles/boosts/_boosts.html.erb
@@ -1,11 +1,10 @@
-<div class="pad-inline flex align-center gap">
+<%= form_with url: bubble_boosts_path(bubble), class: "pad-inline flex align-center gap" do %>
   <span class="overflow-ellipsis">
-    <strong><%= text_field_tag :boost_count, bubble.boosts_count, min: 1, class: "boost__input input", autocomplete: "off" %></strong>
+    <strong><%= number_field_tag :boost_count, bubble.boosts_count, min: 1, class: "boost__input input", autocomplete: "off" %></strong>
     <span><%= bubble.boosts_count == 1 ? "boost" : "boosts" %></span>
   </span>
-
-  <%= button_to bubble_boosts_path(bubble), class: "btn", type: :submit, style: "font-size: 0.5em" do %>
+  <%= tag.button class: "btn", type: :submit, style: "font-size: 0.4em" do %>
     <%= icon_tag "add" %>
     <span class="for-screen-reader">Boost</span>
   <% end %>
-</div>
+<% end %>
\ No newline at end of file