Fix interactive dialogs and enhance UI functionality

eslint.config.mjs

@@ -137,6 +137,8 @@ export default [
   },
   {
     ignores: [
+      ".next/**",
+      "out/**",
       "src-backend/src/bundle.js",
       "src-backend/src/bundle.js.map",
       "cli.mjs",

src/pages/about.tsx

@@ -4,6 +4,7 @@ import {
   Brain,
   Code2,
   Eye,
+  Quote,
   Rocket,
   Settings,
   Sparkles,
@@ -301,6 +302,26 @@ export default function About() {
             </Card>
           </div>
 
+          <div className="mt-8 mb-8 flex justify-center">
+            <Card className="glass w-[90%] md:w-[35%] min-w-[400px]">
+              <CardContent className="pt-6">
+                <div className="flex items-start gap-4">
+                  <Quote className="h-12 w-12 text-muted-foreground/50 flex-shrink-0" />
+                  <div>
+                    <p className="text-muted-foreground text-2xl italic">
+                      We created Betsey (bTc) not only to train our ehAye™
+                      Engine Vision & Control, but because Betsey needs to
+                      exist.
+                    </p>
+                    <p className="text-muted-foreground/80 text-sm mt-4">
+                      — Val Neekman @ Neekware Inc.
+                    </p>
+                  </div>
+                </div>
+              </CardContent>
+            </Card>
+          </div>
+
           <Card className="mt-8 border-2 border-green-500/20 bg-gradient-to-br from-green-50/20 to-emerald-50/20 shadow-2xl dark:from-green-950/10 dark:to-emerald-950/10">
             <CardHeader>
               <CardTitle className="flex items-center justify-center gap-3">

src/pages/focus.tsx

@@ -277,8 +277,8 @@ export default function Focus() {
                 </CardDescription>
               </CardHeader>
               <CardContent>
-                <div className="space-y-3 rounded-lg border-2 border-blue-300 bg-blue-50 p-4">
-                  <p className="text-sm text-blue-700">
+                <div className="space-y-3 rounded-lg border-2 border-gray-300 dark:border-gray-600 bg-gray-50 dark:bg-gray-800 p-4">
+                  <p className="text-sm text-gray-700 dark:text-gray-300">
                     Tab navigation is trapped within this box:
                   </p>
                   <Input
@@ -307,7 +307,7 @@ export default function Focus() {
                         document.getElementById("trap-input-1")?.focus();
                       }
                     }}
-                    className="w-full bg-blue-600 hover:bg-blue-700"
+                    className="w-full"
                   >
                     Last element (Tab goes back to first)
                   </Button>