changed to centered layout

src/lib/timeline/TimelineCard.svelte

@@ -42,7 +42,7 @@
 
       <!-- Trip badge — top-right of card, outside photo -->
       <span class="trip-badge trip-badge--{entry.tripType}">
-        {entry.tripType === 'solo' ? 'Solo' : 'Friends'}
+        {entry.tripType === 'solo' ? 'Solo' : entry.tripType === 'family' ? 'Family' : 'Friends'}
       </span>
 
       <!-- Photos -->
@@ -99,7 +99,7 @@
 
       <!-- Info bar -->
       <div class="card-info">
-        <span class="city">{entry.location.city}</span>
+        <span class="city">{entry.location.cities.join(', ')}</span>
         <div class="meta">
           {#if entry.transport}
             <span class="transport-chip transport-chip--{entry.transport}">
@@ -206,6 +206,7 @@
   }
   .trip-badge--solo    { background: rgba(245,158,11,0.85); color: #fff; }
   .trip-badge--friends { background: rgba(124,58,237,0.85); color: #fff; }
+  .trip-badge--family  { background: rgba(16,185,129,0.85); color: #fff; }
 
   /* ── Photo grid — fixed height, always consistent ── */
   .photo-grid {