feat(journal): wrap Crew an diesem Reisetag card inside a collapsible accordion defaulting to collapsed

client/src/components/EntryCrewSection.tsx

@@ -1,6 +1,6 @@
 import { useEffect, useMemo, useState } from 'react'
 import { useTranslation } from 'react-i18next'
-import { Users } from 'lucide-react'
+import { Users, ChevronDown, ChevronUp } from 'lucide-react'
 import type { EntryCrewFields, PersonSnapshot } from '../types/person.js'
 import { loadPersonPool } from '../services/personPool.js'
 import { loadLogbookCrewSelection } from '../services/logbookCrewSelection.js'
@@ -24,6 +24,7 @@ export default function EntryCrewSection({
   preloadedPool
 }: EntryCrewSectionProps) {
   const { t } = useTranslation()
+  const [collapsed, setCollapsed] = useState(true)
   const [pool, setPool] = useState<Map<string, PersonData>>(preloadedPool ?? new Map())
 
   useEffect(() => {
@@ -90,11 +91,33 @@ export default function EntryCrewSection({
 
   return (
     <div className="form-card" data-tour="entry-crew">
-      <div className="form-header">
+      <div
+        className="form-header accordion-header"
+        onClick={() => setCollapsed(!collapsed)}
+        onKeyDown={(e) => {
+          if (e.key === 'Enter' || e.key === ' ') {
+            e.preventDefault()
+            setCollapsed(!collapsed)
+          }
+        }}
+        role="button"
+        aria-expanded={!collapsed}
+        tabIndex={0}
+      >
+        <div className="accordion-header-title">
           <Users size={22} className="form-icon" />
           <h3>{t('entry_crew.title')}</h3>
         </div>
-      <p className="help-text mb-3">{t('entry_crew.subtitle')}</p>
+        {collapsed ? (
+          <ChevronDown size={20} className="accordion-chevron" />
+        ) : (
+          <ChevronUp size={20} className="accordion-chevron" />
+        )}
+      </div>
+
+      {!collapsed && (
+        <>
+          <p className="help-text mb-3" style={{ marginTop: '16px' }}>{t('entry_crew.subtitle')}</p>
 
           <div className="input-group mb-3">
             <label>{t('entry_crew.day_skipper')}</label>
@@ -138,6 +161,8 @@ export default function EntryCrewSection({
               </div>
             )}
           </div>
+        </>
+      )}
     </div>
   )
 }