diff --git a/src/modules/events/components/EventCard.vue b/src/modules/events/components/EventCard.vue
index 2604798..cbb4eae 100644
--- a/src/modules/events/components/EventCard.vue
+++ b/src/modules/events/components/EventCard.vue
@@ -72,8 +72,14 @@ const isNonApproved = computed(
 </script>
 
 <template>
+  <!-- `min-w-0`: the card is a grid item, and a grid item's default
+       `min-width: auto` resolves to its min-content width. The nowrap
+       `truncate` rows below (location, organizer) contribute their
+       full text width to that, so a long address would widen the
+       whole column past the viewport on phones. Letting the item
+       shrink is what makes `truncate` actually truncate. -->
   <Card
-    class="relative cursor-pointer hover:shadow-lg transition-shadow duration-200"
+    class="relative min-w-0 cursor-pointer hover:shadow-lg transition-shadow duration-200"
     @click="emit('click', event)"
   >
     <!-- Wash-out wrapper. The pending/rejected status badge below sits