Add visual polish and micro-interactions for editorial feel

Phase 1 - Critical Fixes:
- EmptyState: warm palette, coral button, Playfair Display title
- Pagination: design system colors, coral active state
- LoadingSkeleton: warm shimmer with coral tint

Phase 2 - Signature Patterns:
- Navigation: sliding underline hover effect on links
- globals.css: increased noise texture opacity for paper feel
- RankingsView: alternating row backgrounds
- HomeView: decorative coral bar under section headings

Phase 3 - Polish:
- SchoolCard: SVG trend icons replacing unicode arrows
- RankingsView: styled metallic rank badges replacing emoji medals

Phase 4 - Micro-interactions:
- Navigation badge: pop animation when count changes
- HomeView grid: staggered entry animation for cards

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

nextjs-app/components/LoadingSkeleton.module.css

@@ -5,17 +5,23 @@
 }
 
 .skeletonCard {
-  background: white;
-  border: 1px solid #e5e7eb;
-  border-radius: 8px;
+  background: var(--bg-card, white);
+  border: 1px solid var(--border-color, #e5dfd5);
+  border-radius: 12px;
   padding: 1.5rem;
+  box-shadow: var(--shadow-soft, 0 2px 8px rgba(26, 22, 18, 0.06));
 }
 
 .skeleton {
-  background: linear-gradient(90deg, #f3f4f6 25%, #e5e7eb 50%, #f3f4f6 75%);
+  background: linear-gradient(
+    90deg,
+    var(--bg-secondary, #f3ede4) 25%,
+    rgba(224, 114, 86, 0.08) 50%,
+    var(--bg-secondary, #f3ede4) 75%
+  );
   background-size: 200% 100%;
-  animation: shimmer 1.5s infinite;
-  border-radius: 4px;
+  animation: shimmer 1.5s ease-in-out infinite;
+  border-radius: 6px;
 }
 
 @keyframes shimmer {
@@ -50,8 +56,8 @@
   gap: 1rem;
   margin-bottom: 1.5rem;
   padding: 1rem;
-  background: #f9fafb;
-  border-radius: 6px;
+  background: var(--bg-secondary, #f3ede4);
+  border-radius: 8px;
 }
 
 .metric {
@@ -76,10 +82,11 @@
 }
 
 .skeletonListItem {
-  background: white;
-  border: 1px solid #e5e7eb;
-  border-radius: 8px;
+  background: var(--bg-card, white);
+  border: 1px solid var(--border-color, #e5dfd5);
+  border-radius: 12px;
   padding: 1.5rem;
+  box-shadow: var(--shadow-soft, 0 2px 8px rgba(26, 22, 18, 0.06));
 }
 
 .listTitle {