Break long trail titles (#466)

web/src/lib/components/trail/trail_card.svelte

@@ -150,7 +150,7 @@
     {/if}
     <div class="p-4">
         <div>
-            <h4 class="font-semibold text-lg line-clamp-2">{trail.name}</h4>
+            <h4 class="font-semibold text-lg line-clamp-2 wrap-anywhere">{trail.name}</h4>
             {#if trail.date}
                 <p class="text-xs text-gray-500 mb-3">
                     {new Date(trail.date).toLocaleDateString(undefined, {

web/src/lib/components/trail/trail_info_panel.svelte

@@ -353,7 +353,7 @@
                         title={trail.name}
                         class="{mode == 'map'
                             ? 'text-4xl'
-                            : 'text-5xl'} font-bold line-clamp-3 mb-1"
+                            : 'text-5xl'} font-bold line-clamp-3 mb-1 wrap-anywhere"
                         style="line-height: 1.18"
                     >
                         {trail.name}

web/src/lib/components/trail/trail_list_item.svelte

@@ -82,7 +82,7 @@
     </div>
     <div class="min-w-0 basis-full relative">
         <div class="flex items-center justify-between">
-            <h4 class="font-semibold text-lg">
+            <h4 class="font-semibold text-lg line-clamp-2 wrap-anywhere">
                 {trail.name}
             </h4>
             <div class="flex items-center shrink-0 gap-3">

web/src/lib/components/trail/trail_table.svelte

@@ -149,7 +149,7 @@
                         <td
                             class="flex justify-between items-center text-sm relative"
                         >
-                            <div class="p-4 w-[75%]" title={trail.name}>
+                            <div class="p-4 w-[75%] line-clamp-2 wrap-anywhere" title={trail.name}>
                                 {trail.name}
                             </div>
                             <div class="flex flex-col items-center">