Fix navbar alignment: use navbar__item class and optimize typography

- Use navbar__item for proper framework integration
- Add baseline alignment for labels and values
- Use font-weight: 600 for better number readability
- Remove monospace to maintain consistent 16px font size

Author: odysseus0

src/components/MevMetrics.module.css

@@ -2,25 +2,17 @@
   display: flex;
   align-items: center;
   gap: 0.75rem;
-  font-size: 0.875rem;
   color: var(--ifm-navbar-link-color);
-  margin-right: 0.75rem;
 }
 
 .metric {
   display: flex;
-  align-items: center;
+  align-items: baseline;
   gap: 0.25rem;
 }
 
-.label {
-  font-weight: 400;
-}
-
 .value {
-  font-family: monospace;
   font-weight: 600;
-  transition: opacity 0.3s ease;
 }
 
 .loading {

src/components/MevMetrics.tsx

@@ -62,16 +62,16 @@ export default function MevMetrics(): JSX.Element | null {
 
   return (
     <div 
-      className={`${styles.container} ${styles.clickable}`}
-      onClick={handleClick}
-      role="button"
-      tabIndex={0}
-      onKeyDown={(e) => {
-        if (e.key === 'Enter' || e.key === ' ') {
-          handleClick();
-        }
-      }}
-    >
+      className={`navbar__item ${styles.container} ${styles.clickable}`}
+        onClick={handleClick}
+        role="button"
+        tabIndex={0}
+        onKeyDown={(e) => {
+          if (e.key === 'Enter' || e.key === ' ') {
+            handleClick();
+          }
+        }}
+      >
       <span className={styles.label}>Refund</span>
       <span className={styles.separator}>|</span>
       <div className={styles.metric}>