diff --git a/wiki/templates/wiki/includes/feedback_widget.html b/wiki/templates/wiki/includes/feedback_widget.html
index 2c24d7c2..34bf5751 100644
--- a/wiki/templates/wiki/includes/feedback_widget.html
+++ b/wiki/templates/wiki/includes/feedback_widget.html
@@ -5,11 +5,10 @@
 
         <!-- Reaction Buttons (pill-shaped toggle group) -->
         {% set reactions = [
-            {"type": "Good", "mouth": '<path d="M8 14s1.5 2 4 2 4-2 4-2"/>'},
-            {"type": "Ok", "mouth": '<line x1="8" y1="15" x2="16" y2="15"/>'},
-            {"type": "Bad", "mouth": '<path d="M16 16s-1.5-2-4-2-4 2-4 2"/>'}
+            {"type": "Bad", "icon": '<path d="M9 18.12 10 14H4.17a2 2 0 0 1-1.92-2.56l2.33-8A2 2 0 0 1 6.5 2H20a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2h-2.76a2 2 0 0 0-1.79 1.11L12 22h0a3.13 3.13 0 0 1-3-3.88Z"/>', "transform": "translate(0, 2)", "viewBox": "0 1 24 24"},
+            {"type": "Good", "icon": '<path d="M15 5.88 14 10h5.83a2 2 0 0 1 1.92 2.56l-2.33 8A2 2 0 0 1 17.5 22H4a2 2 0 0 1-2-2v-8a2 2 0 0 1 2-2h2.76a2 2 0 0 0 1.79-1.11L12 2h0a3.13 3.13 0 0 1 3 3.88Z"/>', "transform": "translate(0, -2)", "viewBox": "0 -1 24 24"}
         ] %}
-        <fieldset class="inline-flex rounded-full bg-[var(--surface-gray-2)] p-0.5" role="radiogroup" aria-label="Feedback rating">
+        <fieldset class="inline-flex items-center rounded-full bg-[var(--surface-gray-2)] p-0.5 gap-0.5" role="radiogroup" aria-label="Feedback rating">
             {% for reaction in reactions %}
             <button type="button"
                     @click="selectFeedback('{{ reaction.type }}')"
@@ -19,13 +18,15 @@
                     role="radio"
                     :aria-checked="feedbackType === '{{ reaction.type }}'"
                     aria-label="{{ reaction.type }}">
-                <svg class="w-4 h-4" :class="feedbackType === '{{ reaction.type }}' ? 'text-[var(--ink-gray-9)]' : 'text-[var(--ink-gray-5)]'" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
-                    <circle cx="12" cy="12" r="10"/>
-                    {{ reaction.mouth | safe }}
-                    <line x1="9" y1="9" x2="9.01" y2="9"/>
-                    <line x1="15" y1="9" x2="15.01" y2="9"/>
+                <svg class="w-4 h-4" :class="feedbackType === '{{ reaction.type }}' ? 'text-[var(--ink-gray-9)]' : 'text-[var(--ink-gray-5)]'" viewBox="{{ reaction.viewBox }}" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                    <g transform="{{ reaction.transform }}">
+                        {{ reaction.icon | safe }}
+                    </g>
                 </svg>
             </button>
+            {% if not loop.last %}
+            <div class="h-5 w-px bg-[var(--outline-gray-2)]"></div>
+            {% endif %}
             {% endfor %}
         </fieldset>
     </div>