Refactor useAuth hook, settings components, and docs for formatting and readability improvements

- Consolidated multi-line arguments into single lines where appropriate in `useAuth`.
- Improved spacing and readability in data processing across components (`ProfileSettingsForm`, `PasswordChangeForm`, `SessionCard`).
- Applied consistent table and markdown formatting in design system docs (e.g., `README.md`, `08-ai-guidelines.md`, `00-quick-start.md`).
- Updated code snippets to ensure adherence to Prettier rules and streamlined JSX structures.

frontend/src/components/settings/ProfileSettingsForm.tsx

@@ -34,9 +34,7 @@ const profileSchema = z.object({
     .max(50, 'Last name must not exceed 50 characters')
     .optional()
     .or(z.literal('')),
-  email: z
-    .string()
-    .email('Invalid email address'),
+  email: z.string().email('Invalid email address'),
 });
 
 type ProfileFormData = z.infer<typeof profileSchema>;
@@ -68,10 +66,7 @@ interface ProfileSettingsFormProps {
  * <ProfileSettingsForm onSuccess={() => console.log('Profile updated')} />
  * ```
  */
-export function ProfileSettingsForm({
-  onSuccess,
-  className,
-}: ProfileSettingsFormProps) {
+export function ProfileSettingsForm({ onSuccess, className }: ProfileSettingsFormProps) {
   const [serverError, setServerError] = useState<string | null>(null);
   const currentUser = useCurrentUser();
   const updateProfileMutation = useUpdateProfile((message) => {
@@ -201,19 +196,12 @@ export function ProfileSettingsForm({
 
           {/* Submit Button */}
           <div className="flex items-center gap-4">
-            <Button
-              type="submit"
-              disabled={isSubmitting || !isDirty}
-            >
+            <Button type="submit" disabled={isSubmitting || !isDirty}>
               {isSubmitting ? 'Saving...' : 'Save Changes'}
             </Button>
             {/* istanbul ignore next - Reset button requires isDirty state, tested in E2E */}
             {isDirty && !isSubmitting && (
-              <Button
-                type="button"
-                variant="outline"
-                onClick={() => form.reset()}
-              >
+              <Button type="button" variant="outline" onClick={() => form.reset()}>
                 Reset
               </Button>
             )}