feat(onboarding): redesign user onboarding flow with modern UI/UX

- Add centered, card-based layout with clean design
- Implement 3-step progress indicator component
- Add proper dark/light mode support following Coolify design system
- Implement Livewire URL state persistence for browser navigation
- Separate private key textareas for "Generate" vs "Add your own" modes
- Consistent checkpoint styling across all onboarding phases
- Enhanced typography with prominent titles (semibold, white in dark mode)
- Fixed state restoration on page refresh and browser back/forward navigation

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

resources/views/components/boarding-progress.blade.php

@@ -0,0 +1,47 @@
+@props(['currentStep' => 1, 'totalSteps' => 3])
+
+<div class="w-full max-w-2xl mx-auto mb-8">
+    <div class="flex items-center justify-between">
+        @for ($i = 1; $i <= $totalSteps; $i++)
+            <div class="flex items-center {{ $i < $totalSteps ? 'flex-1' : '' }}">
+                <div class="flex flex-col items-center">
+                    <div
+                        class="flex items-center justify-center size-10 rounded-full border-2 transition-all duration-300
+                        {{ $i < $currentStep ? 'bg-success border-success' : '' }}
+                        {{ $i === $currentStep ? 'bg-white dark:bg-coolgray-100' : '' }}
+                       ">
+                        @if ($i < $currentStep)
+                            <svg class="size-5 text-white" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"
+                                fill="currentColor">
+                                <path fill-rule="evenodd"
+                                    d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z"
+                                    clip-rule="evenodd" />
+                            </svg>
+                        @else
+                            <span
+                                class="text-sm font-bold text-black dark:text-white">
+                                {{ $i }}
+                            </span>
+                        @endif
+                    </div>
+                    <span
+                        class="mt-2 text-xs font-medium text-black dark:text-white">
+                        @if ($i === 1)
+                            Server
+                        @elseif ($i === 2)
+                            Connection
+                        @elseif ($i === 3)
+                            Complete
+                        @endif
+                    </span>
+                </div>
+                @if ($i < $totalSteps)
+                    <div
+                        class="flex-1 h-0.5 mx-4 transition-all duration-300
+                        {{ $i < $currentStep ? 'bg-success' : 'bg-coolgray-200 dark:bg-coolgray-600' }}">
+                    </div>
+                @endif
+            </div>
+        @endfor
+    </div>
+</div>