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/Products.jsx

@@ -100,12 +100,14 @@ export default function Products() {
                         : <span className="thumb thumb-fallback"><Icon name="box" size={16} /></span>}
                     </td>
                     <td data-label="Name" className="strong">
-                      {p.name}
-                      {p.expired_count > 0 && (
-                        <span className="badge danger" style={{ marginLeft: 6 }}>
-                          <Icon name="alert" size={12} />{p.expired_count} abgelaufen
-                        </span>
-                      )}
+                      <span className="cell-row">
+                        <span>{p.name}</span>
+                        {p.expired_count > 0 && (
+                          <span className="badge danger nowrap">
+                            <Icon name="alert" size={12} />{p.expired_count} abgelaufen
+                          </span>
+                        )}
+                      </span>
                     </td>
                     <td data-label="Marke" className="muted">{p.brand || "–"}</td>
                     <td data-label="Kategorie" className="muted">{p.category_name || "–"}</td>
@@ -119,10 +121,14 @@ export default function Products() {
                       {fmt(p.stock / (p.unit_factor || 1))} {p.unit_name || unitShort(p.base_unit)}
                     </td>
                     <td data-label="Einheiten" className="num">
-                      {fmt(p.stock / unitCount(p))}
-                      {p.min_stock != null ? ` / ${fmt(p.min_stock / unitCount(p))}` : ""}{" "}
-                      {countLabel(p)}
-                      {low && <span className="badge warn" style={{ marginLeft: 6 }}>niedrig</span>}
+                      <span className="cell-row" style={{ justifyContent: "flex-end" }}>
+                        <span>
+                          {fmt(p.stock / unitCount(p))}
+                          {p.min_stock != null ? ` / ${fmt(p.min_stock / unitCount(p))}` : ""}{" "}
+                          {countLabel(p)}
+                        </span>
+                        {low && <span className="badge warn">niedrig</span>}
+                      </span>
                     </td>
                     <td className="num"><Link to={`/products/${p.id}`}>Details</Link></td>
                   </tr>