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/HomeView.module.css

@@ -12,11 +12,12 @@
 }
 
 .heroTitle {
-  font-size: 2.75rem;
+  font-size: 3rem;
   font-weight: 700;
   color: var(--text-primary, #1a1612);
   margin-bottom: 1rem;
-  line-height: 1.2;
+  line-height: 1.1;
+  letter-spacing: -0.02em;
   font-family: var(--font-playfair), 'Playfair Display', serif;
 }
 
@@ -58,11 +59,22 @@
 .sectionHeader h2 {
   font-size: 1.875rem;
   font-weight: 700;
-  margin-bottom: 0.5rem;
+  margin-bottom: 0.75rem;
   color: var(--text-primary, #1a1612);
   font-family: var(--font-playfair), 'Playfair Display', serif;
 }
 
+/* Decorative coral bar under section headings */
+.sectionHeader h2::after {
+  content: '';
+  display: block;
+  width: 60px;
+  height: 3px;
+  background: var(--accent-coral, #e07256);
+  border-radius: 2px;
+  margin-top: 0.75rem;
+}
+
 .sectionDescription {
   font-size: 1rem;
   color: var(--text-secondary, #5c564d);
@@ -102,6 +114,33 @@
   margin-bottom: 2rem;
 }
 
+/* Staggered grid entry animation */
+.grid > * {
+  animation: gridItemFadeIn 0.4s ease-out both;
+}
+
+.grid > *:nth-child(1) { animation-delay: 0ms; }
+.grid > *:nth-child(2) { animation-delay: 50ms; }
+.grid > *:nth-child(3) { animation-delay: 100ms; }
+.grid > *:nth-child(4) { animation-delay: 150ms; }
+.grid > *:nth-child(5) { animation-delay: 200ms; }
+.grid > *:nth-child(6) { animation-delay: 250ms; }
+.grid > *:nth-child(7) { animation-delay: 300ms; }
+.grid > *:nth-child(8) { animation-delay: 350ms; }
+.grid > *:nth-child(9) { animation-delay: 400ms; }
+.grid > *:nth-child(n+10) { animation-delay: 450ms; }
+
+@keyframes gridItemFadeIn {
+  from {
+    opacity: 0;
+    transform: translateY(16px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
 .emptyState {
   text-align: center;
   padding: 4rem 2rem;