Transform homepage claims list to Hacker News style

Before: Card-style with borders, backgrounds, padding
After: Compact numbered list (HN style)

Changes:
- Numbered list (1., 2., 3...) with monospace font
- Title on one line (clickable, bold)
- Metadata below: date • 5 claims • featured claim
- No borders or background colors
- Much more compact and scannable
- Added ai-judgment-skills to list (11 total)

Format:
1. Article Title
   Nov 3, 2025 • 5 claims • Featured claim snippet

Benefits:
- More articles visible without scrolling
- Cleaner, more professional look
- Information-dense like Hacker News
- Keeps all essential info (date, claims, snippet)

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

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

src/components/ClaimsLibrary.tsx

@@ -1,4 +1,3 @@
-import { Card } from "@/components/ui/card";
 import Link from "next/link";
 
 const ClaimsLibrary = () => {
@@ -47,6 +46,12 @@ const ClaimsLibrary = () => {
       date: "2025-10-16",
       featuredClaim: "Amazon's recommendation engine generates $200 billion in annual sales representing 35% of e-commerce revenue"
     },
+    {
+      title: "Why Judgment Is Your New Career Currency",
+      link: "/claims-library/ai-judgment-skills",
+      date: "2025-10-08",
+      featuredClaim: "AI will fully replace just 0.7% of job-related skills according to CNBC reporting"
+    },
     {
       title: "Make ChatGPT Writing Undetectable With Five Techniques",
       link: "/claims-library/undetectable-writing",
@@ -70,33 +75,53 @@ const ClaimsLibrary = () => {
   return (
     <section className="py-10 md:py-12 border-b border-border">
       <div className="container max-w-[780px] mx-auto px-5">
-        <div className="flex justify-between items-center mb-8">
+        <div className="flex justify-between items-center mb-6">
           <h2 className="text-2xl md:text-3xl font-bold">Claims Library</h2>
           <Link
             href="/claims-library"
             className="text-sm font-medium text-accent hover:text-accent/80 hover:underline transition-colors"
           >
-            View Full Library →
+            View All →
           </Link>
         </div>
 
-        <div className="space-y-4">
+        {/* Hacker News style list */}
+        <ol className="space-y-3">
           {claims.map((claim, idx) => (
-            <div key={idx} className="border-l-4 border-l-accent bg-muted p-4 rounded hover:shadow-md transition-shadow">
+            <li key={idx} className="group">
-              <Link href={claim.link} className="block">
+              <div className="flex gap-3">
-                <div className="text-base font-semibold text-foreground hover:text-accent transition-colors mb-2">
+                {/* Number */}
-                  {claim.title}
+                <span className="text-muted-foreground text-sm font-mono shrink-0 pt-0.5">
+                  {idx + 1}.
+                </span>
+
+                {/* Content */}
+                <div className="min-w-0 flex-1">
+                  {/* Title */}
+                  <Link
+                    href={claim.link}
+                    className="text-foreground hover:text-accent font-medium leading-snug inline"
+                  >
+                    {claim.title}
+                  </Link>
+
+                  {/* Metadata line */}
+                  <div className="text-xs text-muted-foreground mt-1 leading-relaxed">
+                    {new Date(claim.date).toLocaleDateString('en-US', {
+                      year: 'numeric',
+                      month: 'short',
+                      day: 'numeric'
+                    })}
+                    <span className="mx-1.5">•</span>
+                    5 claims
+                    <span className="mx-1.5">•</span>
+                    <span className="italic">{claim.featuredClaim}</span>
+                  </div>
                 </div>
-                <p className="text-sm text-muted-foreground leading-relaxed">
+              </div>
-                  {claim.featuredClaim}
+            </li>
-                </p>
-                <div className="text-xs text-muted-foreground mt-2">
-                  {new Date(claim.date).toLocaleDateString('en-US', { year: 'numeric', month: 'short', day: 'numeric' })} • 5 Claims
-                </div>
-              </Link>
-            </div>
           ))}
-        </div>
+        </ol>
       </div>
     </section>
   );