diff --git a/resources/views/livewire/public/station-search.blade.php b/resources/views/livewire/public/station-search.blade.php
new file mode 100644
index 0000000..517ed5b
--- /dev/null
+++ b/resources/views/livewire/public/station-search.blade.php
@@ -0,0 +1,106 @@
+<div>
+    <flux:heading size="xl" class="mb-1">Find Cheap Fuel Near You</flux:heading>
+    <flux:subheading class="mb-6">Search by postcode, town or city</flux:subheading>
+
+    <form wire:submit="findStations">
+        <div class="flex flex-col gap-3 sm:flex-row sm:items-end">
+            <div class="flex-1">
+                <flux:input
+                    wire:model="search"
+                    name="search"
+                    label="Location"
+                    placeholder="Postcode, town or city"
+                />
+                @error('search')
+                    <p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
+                @enderror
+            </div>
+
+            <div class="w-full sm:w-48">
+                <flux:select wire:model="fuelType" name="fuelType" label="Fuel type">
+                    <flux:select.option value="">Select fuel type</flux:select.option>
+                    <flux:select.option value="petrol">Petrol (E10)</flux:select.option>
+                    <flux:select.option value="e5">Super Unleaded (E5)</flux:select.option>
+                    <flux:select.option value="diesel">Diesel</flux:select.option>
+                    <flux:select.option value="b7_premium">Premium Diesel</flux:select.option>
+                    <flux:select.option value="b10">B10 Biodiesel</flux:select.option>
+                    <flux:select.option value="hvo">HVO</flux:select.option>
+                </flux:select>
+                @error('fuelType')
+                    <p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
+                @enderror
+            </div>
+
+            <div class="w-full sm:w-36">
+                <flux:select wire:model="radius" name="radius" label="Radius">
+                    <flux:select.option value="1">1 mile</flux:select.option>
+                    <flux:select.option value="2">2 miles</flux:select.option>
+                    <flux:select.option value="5">5 miles</flux:select.option>
+                    <flux:select.option value="10">10 miles</flux:select.option>
+                    <flux:select.option value="20">20 miles</flux:select.option>
+                </flux:select>
+            </div>
+
+            <div>
+                <flux:button type="submit" variant="primary" wire:loading.attr="disabled">
+                    <span wire:loading.remove wire:target="findStations">Search</span>
+                    <span wire:loading wire:target="findStations">Searching…</span>
+                </flux:button>
+            </div>
+        </div>
+    </form>
+
+    @if ($apiError)
+        <div class="mt-4 rounded-lg border border-red-200 bg-red-50 px-4 py-3 text-sm text-red-700 dark:border-red-800 dark:bg-red-950 dark:text-red-400">
+            {{ $apiError }}
+        </div>
+    @endif
+
+    @if (! empty($meta))
+        <div class="mt-6">
+            @if (! empty($results))
+                <p class="mb-3 text-sm text-zinc-500 dark:text-zinc-400">
+                    {{ $meta['count'] }} {{ Str::plural('station', $meta['count']) }} found
+                    &middot; Cheapest: {{ number_format($meta['lowest_pence'] / 100, 1) }}p
+                    &middot; Average: {{ number_format($meta['avg_pence'] / 100, 1) }}p
+                </p>
+
+                <div class="space-y-2">
+                    @foreach ($results as $station)
+                        <div class="flex items-center justify-between rounded-xl border border-neutral-200 px-4 py-3 dark:border-neutral-700">
+                            <div class="min-w-0 flex-1">
+                                <div class="flex items-center gap-2">
+                                    <p class="truncate font-semibold text-zinc-900 dark:text-zinc-100">
+                                        {{ $station['name'] }}
+                                    </p>
+                                    @if ($station['is_supermarket'])
+                                        <flux:badge color="lime" size="sm">Supermarket</flux:badge>
+                                    @endif
+                                </div>
+                                <p class="truncate text-sm text-zinc-500 dark:text-zinc-400">
+                                    {{ $station['address'] }}, {{ $station['postcode'] }}
+                                </p>
+                                <p class="text-sm text-zinc-400 dark:text-zinc-500">
+                                    {{ number_format($station['distance_km'] * 0.621371, 1) }} miles away
+                                </p>
+                            </div>
+
+                            <div class="ml-4 shrink-0 text-right">
+                                <p class="text-xl font-bold text-zinc-900 dark:text-zinc-100">
+                                    {{ $station['price'] }}p
+                                </p>
+                                <p class="text-xs text-zinc-400 dark:text-zinc-500">
+                                    {{ \Carbon\Carbon::parse($station['price_updated_at'])->diffForHumans() }}
+                                </p>
+                            </div>
+                        </div>
+                    @endforeach
+                </div>
+            @else
+                <p class="text-sm text-zinc-500 dark:text-zinc-400">
+                    No stations found within {{ $radius }} {{ Str::plural('mile', $radius) }} of "{{ $search }}".
+                </p>
+            @endif
+        </div>
+    @endif
+</div>