Complete Hubbly theme conversion: all pages rewritten with CSS variable theming

- Converted all views from Dusk components (x-content.content-card, x-form.*) to inline Hubbly style
- All pages use consistent card pattern: rounded-lg, gradient headers, color-mix borders
- Added Hubbly-style homepage with 2-column layout, login card, swiper news carousel
- Rewrote navigation with Alpine.js dropdowns, CSS variable colors, Hubbly assets
- Updated profile page with Hubbly cards, fixed data bugs (friend/guild relationships)
- Rewrote register page to match Hubbly layout: banner header, avatar preview with Frank GIF, 2-column form, avatar carousel selector, border-4 inputs
- Rewrote login, settings, help center, radio, applications, utility pages
- All colors use CSS variables controlled by Filament theme editor
- Added Hubbly assets: banner, Frank GIF, navigation icons, online badge
- Removed all dependencies on x-content.* and x-form.* components

resources/themes/atom/views/auth/verify-email.blade.php

@@ -1,36 +1,48 @@
 <x-guest-layout>
- <div class="flex min-h-screen flex-col items-center bg-[var(--color-surface)] pt-6 sm:justify-center sm:pt-0">
- <div class="mt-6 w-full overflow-hidden bg-white px-6 py-4 shadow-md sm:max-w-md sm:rounded-lg">
- <div class="mb-4 text-sm text-[var(--color-text-muted)]">
- {{ __('Thanks for signing up! Before getting started, could you verify your email address by clicking on the link we just emailed to you? If you did not receive the email, we will gladly send you another.') }}
- </div>
+ <div class="flex min-h-screen flex-col items-center justify-center px-4"
+      style="background-color: var(--color-background);">
+  <div class="mx-auto max-w-md w-full rounded-lg overflow-hidden"
+       style="background-color: var(--color-surface); border: 1px solid color-mix(in srgb, var(--color-text-muted) 15%, transparent);">
+   <div class="px-6 py-8 text-center"
+        style="background: linear-gradient(140deg, var(--color-primary) 0%, color-mix(in srgb, var(--color-primary) 80%, black) 100%);">
+    <h2 class="text-xl font-bold text-white">{{ __('Verify Email') }}</h2>
+    <p class="text-sm mt-1" style="color: color-mix(in srgb, white 70%, transparent);">
+     {{ __('Verify your email address to get started.') }}
+    </p>
+   </div>
 
- @if (session('status') == 'verification-link-sent')
- <div class="mb-4 text-sm font-medium text-green-600">
- {{ __('A new verification link has been sent to the email address you provided during registration.') }}
- </div>
- @endif
+   <div class="p-6">
+    <div class="mb-4 text-sm" style="color: var(--color-text-muted);">
+     {{ __('Thanks for signing up! Before getting started, could you verify your email address by clicking on the link we just emailed to you? If you did not receive the email, we will gladly send you another.') }}
+    </div>
 
- <div class="mt-4 flex items-center justify-between">
- <form method="POST" action="{{ route('verification.send') }}">
- @csrf
+    @if (session('status') == 'verification-link-sent')
+     <div class="mb-4 p-3 rounded-lg text-sm font-medium"
+          style="background-color: color-mix(in srgb, var(--color-accent, #10b981) 15%, transparent); color: var(--color-accent, #10b981);">
+      {{ __('A new verification link has been sent to the email address you provided during registration.') }}
+     </div>
+    @endif
 
- <div>
- <button type="submit"
- class="ml-4 inline-flex items-center rounded-md border border-transparent bg-gray-800 px-4 py-2 text-xs font-semibold uppercase tracking-widest text-white ring-gray-300 transition duration-150 ease-in-out hover:bg-gray-700 focus:border-gray-900 focus:outline-hidden focus:ring-3 active:bg-gray-900 disabled:opacity-25">
- {{ __('Resend Verification Email') }}
- </button>
- </div>
- </form>
+    <div class="mt-6 flex items-center justify-between">
+     <form method="POST" action="{{ route('verification.send') }}">
+      @csrf
+      <button type="submit"
+              class="inline-flex items-center rounded-lg border-2 px-4 py-2 text-sm font-semibold transition-all duration-200"
+              style="background-color: var(--color-primary); color: var(--button-text-color); border-color: color-mix(in srgb, var(--color-primary) 80%, black);">
+       {{ __('Resend Verification Email') }}
+      </button>
+     </form>
 
- <form method="POST" action="{{ route('logout') }}">
- @csrf
-
- <button type="submit" class="text-sm text-[var(--color-text-muted)] underline hover:text-[var(--color-text)]">
- {{ __('Log Out') }}
- </button>
- </form>
- </div>
- </div>
+     <form method="POST" action="{{ route('logout') }}">
+      @csrf
+      <button type="submit"
+              class="text-sm font-semibold underline transition-colors duration-200 hover:no-underline"
+              style="color: var(--color-text-muted);">
+       {{ __('Log Out') }}
+      </button>
+     </form>
+    </div>
+   </div>
+  </div>
  </div>
 </x-guest-layout>