feat(admissions): replace sparse Q&A list with 2×2 stat tiles

The "How Hard to Get Into This School" this-year view rendered four
question/answer rows stretched to fill the trend chart's height, leaving
tall gaps and a long horizontal jump from a small muted question to its
number. Replace with a 2×2 grid of stat tiles — each number paired with
its label directly beneath — so the panel reads quickly and fills the
reserved height without artificial spacing.

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

nextjs-app/components/SchoolDetailView.module.css

@@ -1203,55 +1203,58 @@
 }
 
 /* ── Admissions Q&A list ── */
-.admissionsQa {
+/* 2×2 stat tiles — number and label grouped together so the eye
+   doesn't travel the full card width. Hairline grid via gap + bg. */
+.admissionsTiles {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    gap: 1px;
+    background: var(--border-color, #e5dfd5);
+    border: 1px solid var(--border-color, #e5dfd5);
+    border-radius: 10px;
+    overflow: hidden;
+    margin: 0;
+}
+
+.admissionsTile {
+    background: var(--bg-card, #fff);
+    padding: 1.15rem 1.25rem;
     display: flex;
     flex-direction: column;
-    margin: 0;
 }
 
-.admissionsQaRow {
-    display: flex;
-    justify-content: space-between;
-    align-items: baseline;
-    padding: 0.85rem 0;
-    border-bottom: 1px solid var(--border-color, #e5dfd5);
-    gap: 1rem;
-}
-
-.admissionsQaRow:first-child {
-    padding-top: 0.35rem;
-}
-
-.admissionsQaRow:last-child {
-    border-bottom: none;
-    padding-bottom: 0.35rem;
-}
-
-.admissionsQaQuestion {
-    font-size: 0.92rem;
-    color: var(--text-secondary, #5c564d);
-    line-height: 1.35;
-    margin: 0;
-}
-
-.admissionsQaAnswer {
+.admissionsTileNum {
     font-family: var(--font-playfair), "Playfair Display", Georgia, serif;
-    font-size: 1.4rem;
+    font-size: 2.4rem;
     font-weight: 700;
-    color: var(--text-primary, #1a1612);
     line-height: 1;
-    white-space: nowrap;
-    flex-shrink: 0;
+    color: var(--text-primary, #1a1612);
     font-variant-numeric: tabular-nums;
     margin: 0;
+    display: flex;
+    align-items: baseline;
+    gap: 0.4rem;
+    flex-wrap: wrap;
 }
 
-.admissionsQaAnswerSub {
-    font-size: 0.7rem;
+.admissionsTileSub {
+    font-family: var(--font-dm-sans), "DM Sans", sans-serif;
+    font-size: 0.85rem;
     font-weight: 500;
     color: var(--text-muted, #6d685f);
-    margin-left: 0.35rem;
-    font-family: var(--font-dm-sans), "DM Sans", sans-serif;
+}
+
+.admissionsTileLabel {
+    margin: 0.55rem 0 0;
+    font-size: 0.78rem;
+    font-weight: 600;
+    letter-spacing: 0.04em;
+    text-transform: uppercase;
+    color: var(--text-muted, #6d685f);
+}
+
+.admissionsTileAccent .admissionsTileNum {
+    color: var(--accent-coral-dark, #c45a3f);
 }
 
 .admissionsVerdict {
@@ -1283,15 +1286,12 @@
 }
 
 @media (max-width: 480px) {
-    .admissionsQaRow {
-        flex-direction: column;
-        align-items: flex-start;
-        gap: 0.25rem;
-        padding: 0.7rem 0;
+    .admissionsTile {
+        padding: 0.95rem 1rem;
     }
 
-    .admissionsQaAnswer {
-        white-space: normal;
+    .admissionsTileNum {
+        font-size: 2rem;
     }
 }
 
@@ -1361,15 +1361,15 @@
     pointer-events: none;
 }
 
-/* The this-year rows spread to fill the height reserved by the taller view. */
+/* The tile grid fills the height reserved by the taller (trend) view. */
 .admissionsViewYear {
     display: flex;
     flex-direction: column;
 }
 
-.admissionsViewYear .admissionsQa {
+.admissionsViewYear .admissionsTiles {
     flex: 1;
-    justify-content: space-between;
+    grid-template-rows: 1fr 1fr;
 }
 
 .admissionsChartCap {