refactor: update styles in MembersDirectory and NewsletterArchive for consistency and improved theming

- Updated color classes to use CSS variables for better maintainability and theming.
- Refactored component styles in MembersDirectory.js to enhance visual consistency.
- Adjusted loading states and empty states in NewsletterArchive.js for improved user experience.
- Added new brand colors to tailwind.config.js for future use.

src/components/MemberRoute.js

@@ -19,8 +19,8 @@ const MemberRoute = ({ children }) => {
 
   if (loading) {
     return (
-      <div className="min-h-screen flex items-center justify-center bg-[#FDFCF8]">
-        <p className="text-[#6B708D]">Loading...</p>
+      <div className="min-h-screen flex items-center justify-center bg-var(--neutral-200:)">
+        <p className="text-var(--slate-muted)">Loading...</p>
       </div>
     );
   }