wrap inputs in real forms, so enter submits instead of doing nothing

24 panel and screen files had their fields sitting in a <div> instead of a
<form> — typing a value and pressing Enter did nothing, and the button was
the only way in. Fixed the sites that are a real form, a single field with
an obvious action, or a multi-field editor; left search/filter boxes and a
few genuinely ambiguous sites alone (see TODO.md for the full breakdown).

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

src/apps/officer-web/Screens/Dashboard/Settings/ServerSettings/TTSSection.tsx

@@ -1,3 +1,4 @@
+import type { FormEvent } from 'react';
 import { useState, useEffect, useRef } from 'react';
 import { useQuery, useQueryClient } from '@tanstack/react-query';
 import { toast } from 'sonner';
@@ -102,7 +103,8 @@ export const TTSSection = () => {
     ...(apiKey ? { apiKey } : {}),
   });
 
-  const handleSave = async () => {
+  const handleSave = async (ev?: FormEvent) => {
+    ev?.preventDefault();
     if (isSaving) return;
     setIsSaving(true);
     try {
@@ -152,7 +154,7 @@ export const TTSSection = () => {
   if (isLoading) return <p className="text-sm text-duck-dark/40">Loading...</p>;
 
   return (
-    <div className="grid gap-4">
+    <form onSubmit={handleSave} className="grid gap-4">
       <Label className="grid gap-2">
         <span className="text-duck-dark/70 dark:text-foreground/70">Provider</span>
         <Select value={provider} onValueChange={(v) => handleProviderChange(v as Provider)}>
@@ -255,8 +257,7 @@ export const TTSSection = () => {
 
       <div className="flex items-center gap-2">
         <Button
-          type="button"
-          onClick={handleSave}
+          type="submit"
           disabled={isSaving}
           className="flex-1 h-11 bg-duck-yellow hover:bg-duck-yellow/90 text-duck-teal font-bold transition-all duration-200 hover:scale-105 cursor-pointer disabled:opacity-50 disabled:hover:scale-100"
         >
@@ -272,6 +273,6 @@ export const TTSSection = () => {
           {isTesting ? 'Testing...' : 'Test'}
         </Button>
       </div>
-    </div>
+    </form>
   );
 };