diff --git a/client/src/pages/TeslaTripPlanner.tsx b/client/src/pages/TeslaTripPlanner.tsx
index 7b5a8e2..23db5b1 100644
--- a/client/src/pages/TeslaTripPlanner.tsx
+++ b/client/src/pages/TeslaTripPlanner.tsx
@@ -245,7 +245,8 @@ const AMENITY_ICONS: Record<string, string> = {
 };
 
 // ─── Stop meta (icon + accent colour per type) ───────────────────────────────
-function stopMeta(type: StopType): { icon: React.ComponentType<{ className?: string; size?: number }>; color: string } {
+type IconComponent = React.ComponentType<{ className?: string; size?: number | string }>;
+function stopMeta(type: StopType): { icon: IconComponent; color: string } {
   switch (type) {
     case 'origin': return { icon: HomeIcon, color: '#9ca3af' };
     case 'destination': return { icon: Flag, color: 'var(--gd-red)' };
@@ -695,7 +696,7 @@ const VARIANT_TONE: Record<RouteVariant['tone'], string> = {
   blue: 'var(--gd-blue)',
 };
 
-const VARIANT_ICON: Record<RouteVariant['id'], React.ComponentType<{ className?: string; size?: number }>> = {
+const VARIANT_ICON: Record<RouteVariant['id'], IconComponent> = {
   fast: Gauge,
   scenic: TreePine,
   cheap: Euro,
@@ -2566,7 +2567,7 @@ function CustomiseStopModal({
   const [pickedNearby, setPickedNearby] = React.useState<Set<string>>(new Set());
   const [chosenChargerId, setChosenChargerId] = React.useState<string>(stop.chargerOptions?.find(c => c.isCurrent)?.id || stop.chargerOptions?.[0]?.id || '');
 
-  const tabs: { id: CustomiseTab; label: string; icon: React.ComponentType<{ className?: string; size?: number }>; count?: number; show: boolean }[] = [
+  const tabs: { id: CustomiseTab; label: string; icon: IconComponent; count?: number; show: boolean }[] = [
     { id: 'charger', label: 'Charger', icon: Zap, count: stop.chargerOptions?.length, show: isCharge },
     { id: 'overnight', label: 'Overnight', icon: Bed, count: stop.alternatives?.length, show: isSleep },
     { id: 'duration', label: 'Duration', icon: Clock, show: true },