feat: Standardize capture page layout to a unified content width across all relevant pages

docs/issues/PHASE_PLAN_RESPONSIVE_UI.md

@@ -17,7 +17,7 @@
 | P3 | Dashboard (Desktop-Grid) | ☑ erledigt | 4-spaltige Kennzahlen; Begrüßung; Ernährung/Aktivität 2-spaltig |
 | P4 | Verlauf (Tabs links / Content rechts) | ☑ erledigt | `History.jsx` + `.history-*` in `app.css`; Tab-State bei `location.state.tab` |
 | P5 | Analyse (Prompts links / Ergebnis rechts) | ☑ erledigt | `Analysis.jsx` + `.analysis-split*` in `app.css` |
-| P6 | Erfassung / Capture & Formularseiten | ☑ erledigt | `.capture-page` / `.capture-page--wide` in `app.css`; CaptureHub, Wizard, Gewicht–Ziele, Guide, Ernährung/Aktivität/Vital/Schlaf breiter |
+| P6 | Erfassung / Capture & Formularseiten | ☑ erledigt | `.capture-page` + `--capture-content-max` (eine Desktop-Breite); CaptureShell-Navigation |
 | P7 | Admin & restliche Vollbreiten-Seiten | ⏸ Konzeption | Layout nach Abstimmung; nicht mit P6 mitgezogen |
 | P8 | Abschluss, Regression, Spec-Pflege | ☐ pending | |
 

frontend/src/app.css

@@ -15,6 +15,7 @@
   --nav-h: 64px;
   --header-h: 52px;
   --font: system-ui, -apple-system, 'Segoe UI', sans-serif;
+  --capture-content-max: 800px;
 }
 @media (prefers-color-scheme: dark) {
   :root {
@@ -344,7 +345,7 @@ body { font-family: var(--font); background: var(--bg); color: var(--text1); -we
   }
 }
 
-/* P6 / RESPONSIVE_UI §5.4 – Erfassung: Desktop zentriert; data-lastige Seiten etwas breiter */
+/* Erfassung: eine einheitliche Inhaltsbreite (Desktop), zentriert; mobil volle Breite */
 .capture-page {
   width: 100%;
   max-width: 100%;
@@ -353,14 +354,10 @@ body { font-family: var(--font); background: var(--bg); color: var(--text1); -we
 
 @media (min-width: 1024px) {
   .capture-page {
-    max-width: 600px;
+    max-width: var(--capture-content-max);
     margin-left: auto;
     margin-right: auto;
   }
-
-  .capture-page--wide {
-    max-width: 900px;
-  }
 }
 
 /* Erfassung: Sub-Navigation (Mobil = Chips, Desktop = linke Spalte) */

frontend/src/pages/ActivityPage.jsx

@@ -254,7 +254,7 @@ export default function ActivityPage() {
   }
 
   return (
-    <div className="capture-page capture-page--wide">
+    <div className="capture-page">
       <h1 className="page-title">Aktivität</h1>
 
       <div className="tabs" style={{overflowX:'auto',flexWrap:'nowrap'}}>

frontend/src/pages/NutritionPage.jsx

@@ -802,7 +802,7 @@ export default function NutritionPage() {
   useEffect(() => { load() }, [])
 
   return (
-    <div className="capture-page capture-page--wide">
+    <div className="capture-page">
       <h1 className="page-title">Ernährung</h1>
 
       {/* Input Method Tabs */}

frontend/src/pages/SleepPage.jsx

@@ -142,7 +142,7 @@ export default function SleepPage() {
   }
 
   return (
-    <div className="capture-page capture-page--wide" style={{ padding: '16px 16px 80px' }}>
+    <div className="capture-page" style={{ padding: '16px 16px 80px' }}>
       {/* Toast Notification */}
       {toast && (
         <div style={{

frontend/src/pages/VitalsPage.jsx

@@ -1064,7 +1064,7 @@ export default function VitalsPage() {
   }
 
   return (
-    <div className="capture-page capture-page--wide">
+    <div className="capture-page">
       <h1 className="page-title">Vitalwerte</h1>
 
       <div className="tabs" style={{ overflowX: 'auto', flexWrap: 'nowrap' }}>