feat: add transport image icons and expand country list to match world map

src/lib/timeline/NewEntryForm.svelte

@@ -4,6 +4,12 @@
   import { countryNames } from '../shared/countries.js';
   import SearchInput from '../shared/SearchInput.svelte';
   import PhotoEditor from './PhotoEditor.svelte';
+  import airplaneImg from '../../assets/airplane.png';
+  import trainImg    from '../../assets/train.png';
+  import busImg      from '../../assets/bus.png';
+  import carImg      from '../../assets/car.png';
+  import shipImg     from '../../assets/ship.png';
+  import walkImg     from '../../assets/walk.png';
 
   let { initialCountry = '', onBack } = $props();
 
@@ -69,12 +75,12 @@
   $effect(() => { if (transport) errors.transport = ''; });
 
   const transportOptions = [
-    { value: 'flight', label: '✈ Flight' },
+    { value: 'flight', label: 'Flight', img: airplaneImg },
-    { value: 'train',  label: '🚂 Train'  },
+    { value: 'train',  label: 'Train',  img: trainImg    },
-    { value: 'bus',    label: '🚌 Bus'    },
+    { value: 'bus',    label: 'Bus',    img: busImg      },
-    { value: 'car',    label: '🚗 Car'    },
+    { value: 'car',    label: 'Car',    img: carImg      },
-    { value: 'ship',   label: '🚢 Ship'   },
+    { value: 'ship',   label: 'Ship',   img: shipImg     },
-    { value: 'walk',   label: '🚶 Walk'   },
+    { value: 'walk',   label: 'Walk',   img: walkImg     },
   ];
 
   // ── Navigation ─────────────────────────────────────────────────────
@@ -210,7 +216,8 @@
             {#each transportOptions as opt}
               <label class="transport-opt" class:active={transport === opt.value}>
                 <input type="radio" name="nc-transport" value={opt.value} bind:group={transport} />
-                {opt.label}
+                <img src={opt.img} alt={opt.label} class="transport-img" />
+                <span class="transport-label">{opt.label}</span>
               </label>
             {/each}
           </div>
@@ -392,15 +399,19 @@
 
   .transport-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
   .transport-opt {
-    display: flex; align-items: center; justify-content: center; gap: 6px;
+    display: flex; flex-direction: column; align-items: center; justify-content: center;
-    font-size: 13px; font-weight: 300; color: var(--text);
+    gap: 8px; aspect-ratio: 1;
-    padding: 8px 10px; border-radius: 8px;
+    border-radius: 12px; border: 1px solid var(--border); background: var(--bg-subtle);
-    border: 1px solid var(--border); background: var(--bg-subtle);
+    cursor: pointer; transition: border-color 0.15s, background 0.15s;
-    cursor: pointer; transition: border-color 0.15s, background 0.15s, color 0.15s;
-    white-space: nowrap;
   }
   .transport-opt input { display: none; }
-  .transport-opt.active { border-color: var(--accent-border); background: var(--accent-bg); color: var(--accent); }
+  .transport-opt.active { border-color: var(--accent-border); background: var(--accent-bg); }
+  .transport-img { width: 60px; height: 60px; object-fit: contain; }
+  .transport-label {
+    font-size: 12px; font-weight: 300; color: var(--text-sub);
+    letter-spacing: 0.02em;
+  }
+  .transport-opt.active .transport-label { color: var(--accent); }
 
   .tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
   .tag {