refactor: replace hardcoded rgba/hex colors with Tailwind tokens

- rgba(255,255,255,0.xx) → bg-white/[0.xx], border-white/[0.xx]
- rgba(6,182,212,0.3) → border-primary/30 (focus states)
- #0a0a0a → bg-background
- Inline style hex colors → var(--color-primary), var(--color-brand-gradient-to)
- 28 files updated, zero hardcoded rgba() patterns remaining

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

frontend/src/pages/account/ProfileSettingsPage.tsx

@@ -10,7 +10,7 @@ import type { UserUpdate } from '@/types'
 const inputClass = cn(
   'mt-1 block w-full rounded-[10px] border border-border bg-card px-3 py-2',
   'text-foreground placeholder:text-muted-foreground',
-  'focus:border-[rgba(6,182,212,0.3)] focus:outline-hidden focus:ring-1 focus:ring-primary/20'
+  'focus:border-primary/30 focus:outline-hidden focus:ring-1 focus:ring-primary/20'
 )
 
 export function ProfileSettingsPage() {
@@ -145,8 +145,8 @@ export function ProfileSettingsPage() {
               to="/change-password"
               className={cn(
                 'inline-flex items-center rounded-[10px] px-4 py-2 text-sm font-medium',
-                'bg-[rgba(255,255,255,0.04)] border border-brand-border text-foreground',
-                'hover:border-[rgba(255,255,255,0.12)]'
+                'bg-white/[0.04] border border-brand-border text-foreground',
+                'hover:border-white/[0.12]'
               )}
             >
               Change Password