fix(buttons): use inline-flex on all buttons so <a> and <button> render same height

<a> tags are display:inline by default and don't respect vertical padding,
while <button> is inline-block. Mixed anchor/button pairs (View/Add) rendered
at different heights despite identical padding. Apply display:inline-flex +
align-items:center to every button-styled element across SchoolRow, RankingsView,
and SchoolCard. Add border:1px solid transparent to borderless buttons so total
box size matches bordered siblings.

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

nextjs-app/components/RankingsView.module.css

@@ -267,15 +267,18 @@
 }
 
 .addButton {
+  display: inline-flex;
+  align-items: center;
   padding: 0.5rem 1rem;
   font-size: 0.875rem;
   font-weight: 600;
-  border: none;
+  border: 1px solid transparent;
   border-radius: 6px;
   cursor: pointer;
   transition: all 0.2s ease;
   background: var(--accent-coral, #e07256);
   color: white;
+  box-sizing: border-box;
 }
 
 .addButton:hover:not(:disabled) {
@@ -371,7 +374,8 @@
 }
 
 .viewButton {
-  display: inline-block;
+  display: inline-flex;
+  align-items: center;
   padding: 0.5rem 1rem;
   font-size: 0.875rem;
   font-weight: 500;
@@ -381,6 +385,7 @@
   text-decoration: none;
   margin-right: 0.375rem;
   transition: all var(--transition, 0.2s ease);
+  box-sizing: border-box;
 }
 
 .viewButton:hover {