Tabellen entzerrt, EAN-Codes mit Marke und Artikelname, Codes-Block nach unten

EAN-Codes:
- Das Kennzeichen "Artikel" ist weg; stattdessen stehen Marke und Artikelname
  zusammen ("Zweifel - Moutarde Original Chips"). Die Marke allein reichte nicht,
  um einen Code wiederzuerkennen. Hinweistext entsprechend angepasst.

Produktseite:
- "Weitere EAN-Codes" steht jetzt unterhalb von Formular und Chargen statt als
  dritte Spalte dazwischen. Die Codes braucht man selten und sie schoben die
  beiden wichtigen Bloecke auseinander.

Tabellen:
- "overflow-wrap: anywhere" galt fuer ALLE Zellen und zerriss Woerter mitten
  drin ("PROD UKTE", "555 Gram m"). Jetzt nur noch gezielt per Klasse.
- Kopfzeilen und Zahl-plus-Einheit brechen nicht mehr um.
- Eingaben in Tabellen sind kompakter (kleinere Polsterung, Zahlenfelder 8ch),
  Auswahlfelder richten sich nach ihrem Text statt 132px Mindestbreite -
  dadurch sind die Zeilen deutlich schlanker.
- Kennzeichen wie "niedrig" oder "abgelaufen" sitzen ueber .cell-row in einer
  Zeile mit dem Wert und rutschen nicht mehr je nach Zeilenhoehe herum.

Geprueft: "npm run build" laeuft durch. Backend unveraendert.

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

web/src/pages/ProductForm.jsx

@@ -387,28 +387,6 @@ export default function ProductForm() {
           {readOnly && <p className="muted small mt-0">Nur Administratoren können Produkte bearbeiten.</p>}
         </form>
 
-        {!isNew && product && (
-          <section className="card">
-            <div className="card-head"><Icon name="search" /><h2>Weitere EAN-Codes</h2></div>
-            <BarcodeList
-              barcodes={product.barcodes || []}
-              disabled={readOnly}
-              hint="Nützlich, wenn dasselbe Produkt mehrere Codes hat (z.B. Aktionspackung)."
-              onAdd={async (body) => {
-                try {
-                  setProduct(await api.addProductBarcode(id, body));
-                } catch (err) { setError(err.message); }
-              }}
-              onDelete={async (code) => {
-                try {
-                  await api.deleteProductBarcode(id, code);
-                  setProduct(await api.getProduct(id));
-                } catch (err) { setError(err.message); }
-              }}
-            />
-          </section>
-        )}
-
         {!isNew && (
           <LotsCard
             product={product}
@@ -425,6 +403,30 @@ export default function ProductForm() {
           />
         )}
       </div>
+
+      {/* Unterhalb der beiden Spalten: die Codes braucht man selten, sie sollen
+          Formular und Chargen nicht auseinanderschieben. */}
+      {!isNew && product && (
+        <section className="card">
+          <div className="card-head"><Icon name="search" /><h2>Weitere EAN-Codes</h2></div>
+          <BarcodeList
+            barcodes={product.barcodes || []}
+            disabled={readOnly}
+            hint="Nützlich, wenn dasselbe Produkt mehrere Codes hat (z.B. Aktionspackung)."
+            onAdd={async (body) => {
+              try {
+                setProduct(await api.addProductBarcode(id, body));
+              } catch (err) { setError(err.message); }
+            }}
+            onDelete={async (code) => {
+              try {
+                await api.deleteProductBarcode(id, code);
+                setProduct(await api.getProduct(id));
+              } catch (err) { setError(err.message); }
+            }}
+          />
+        </section>
+      )}
     </div>
   );
 }