Complete React migration improvements and fixes

- Fix button styling inconsistency for 'did' button using proper CSS reset
- Replace Font Awesome spinners with yellow color (#fff700) for consistency
- Implement holographic card effects for special status cards (yui, first, etc.)
- Add cached user data loading from /json/users.json for faster initial load
- Fix loading states to show spinners instead of "User not found" messages
- Clean up debug console logs for production readiness
- Add proper error handling for API calls
- Update CSS imports to use local files from /pkg/ directory

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

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

src/components/pages/HomePage.tsx

@@ -8,13 +8,15 @@ export default function HomePage() {
   
   const { data: users, isLoading } = useQuery({
     queryKey: ['users'],
-    queryFn: () => fetchUsers(),
+    queryFn: () => fetchUsers()
   });
 
   if (isLoading) {
     return (
       <div className="min-h-screen flex items-center justify-center">
-        <div className="text-xl">Loading...</div>
+        <div className="text-center">
+          <i className="fa-solid fa-spinner fa-spin text-6xl text-yellow-500"></i>
+        </div>
       </div>
     );
   }
@@ -39,7 +41,7 @@ export default function HomePage() {
           <a href="/svn" className="btn ml-2">seven</a>
         </div>
 
-        {users && (
+        {users?.data && Array.isArray(users.data) && users.data.length > 0 && (
           <div className="bg-white rounded-lg p-6">
             <div className="grid gap-4">
               {users.data.map((user) => (
@@ -106,6 +108,7 @@ export default function HomePage() {
             </div>
           </div>
         )}
+
       </div>
     </div>
   );