diff --git a/ui/src/pages/Calendar.vue b/ui/src/pages/Calendar.vue
index 5f627ff..1ad7875 100644
--- a/ui/src/pages/Calendar.vue
+++ b/ui/src/pages/Calendar.vue
@@ -266,11 +266,11 @@ onMounted(() => {
                 :style="{ height: 'calc(100vh - 61px)', position: 'sticky', top: '64px' }">
                 <!-- Header -->
                 <div class="flex items-center justify-between gap-3 border-b px-4 py-3">
-                    <h2 class="text-lg font-semibold line-clamp-2">
+                    <h2 class="text-lg font-semibold break-all">
                         {{ activeEvent?.name || 'Event' }}
                     </h2>
                     <button
-                        class="inline-flex size-8 items-center justify-center rounded-md border hover:bg-muted/40 transition"
+                        class="inline-flex flex-none size-8 items-center justify-center rounded-md border hover:bg-muted/40 transition"
                         aria-label="Close" @click="panelOpen = false">
                         <X class="size-4" />
                     </button>
@@ -294,7 +294,7 @@ onMounted(() => {
                         <span
                             class="inline-flex items-center gap-1.5 rounded-md border px-2 py-1 text-xs">
                             <User class="size-3.5 opacity-80" />
-                            <span class="font-medium">Owner: {{ activeEvent.creator_name || "Unknown User" }}</span>
+                            <span class="font-medium">Created by: {{ activeEvent.creator_name || "Unknown User" }}</span>
                         </span>
                     </section>
                     <!-- Agenda (special-cased array) -->
@@ -377,6 +377,8 @@ onMounted(() => {
     /* no internal scroll for month grid */
 }
 
+
+
 /* Subtle borders everywhere */
 :global(.fc .fc-scrollgrid),
 :global(.fc .fc-scrollgrid td),