Kategorien sind Zeilen in der Liste, kein Feld am Formular

Marcs Vorschlag, und er ist der bessere: "+ kategorie" setzt eine
Ueberschriftenzeile, und was darunter steht, gehoert dazu, bis die naechste
kommt. Die Ueberschrift hat dieselben Pfeile wie eine App, laesst sich
umbenennen und mit x aufloesen.

Damit faellt die Sonderregel von gestern weg -- "am Rand der Gruppe
kategorisiert der Pfeil um, statt zu tauschen". Sie war die Beschreibung
eines Modells; jetzt ist es das Modell: Schiebt man eine App ueber eine
Ueberschrift, ist sie in der anderen Gruppe, und schiebt man eine
Ueberschrift, wandert die Grenze. Nichts davon braucht Code.

Vor allem loest es den echten Mangel der ersten Fassung: Eine Kategorie
umbenennen war ein Feld je App, jetzt ist es eine Zeile.

Gespeichert wird weiter als Feld an der App. Waere die Ueberschrift ein
Eintrag in der App-Liste, enthielte diese Zeilen ohne ID und ohne Adresse,
und jeder Leser muesste das wissen -- Kacheln, Schublade, Pruefung auf
Erreichbarkeit und vor allem die HoneyBar in fremden Apps. Der Preis: Eine
Ueberschrift ohne Apps darunter ueberlebt das Speichern nicht. Eine
Kategorie besteht durch ihre Apps.

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

web/css/style.css

@@ -1426,19 +1426,45 @@ body {
 }
 .applist .al-kopf:first-child { padding-top: 2px; }
 
-/* Im Editor trägt die Überschrift die Pfeile für die ganze Gruppe. */
+/* Im Editor ist die Überschrift eine Zeile wie jede andere: Sie lässt sich
+   umbenennen, verschieben und auflösen. Deshalb sitzt hier ein Eingabefeld und
+   kein Text — Umbenennen ist eine Zeile statt eines Feldes je App. */
 .ae-gruppe {
   display: flex;
   align-items: center;
-  justify-content: space-between;
-  gap: 8px;
+  gap: 6px;
   padding: 10px 4px 3px;
+}
+.ae-gruppe:first-child { padding-top: 2px; }
+
+.ae-kat {
+  flex: 1;
+  min-width: 0;
+  background: none;
+  border: 1px solid transparent;
+  border-bottom-color: var(--p-faint);
+  color: var(--p-mid);
+  font: inherit;
   font-size: 10px;
   letter-spacing: .18em;
   text-transform: uppercase;
-  color: var(--p-dim);
+  padding: 3px 4px;
 }
-.ae-gruppe:first-of-type { padding-top: 2px; }
+.ae-kat::placeholder { color: var(--p-dim); text-transform: none; letter-spacing: normal; }
+.ae-kat:focus { outline: none; border-color: var(--p-dim); background: var(--p-faint); color: var(--p); }
+
+.ae-kat-weg {
+  flex: none;
+  background: none;
+  border: 1px solid transparent;
+  color: var(--p-dim);
+  font: inherit;
+  line-height: 1;
+  padding: 2px 6px;
+  cursor: pointer;
+}
+.ae-kat-weg:hover,
+.ae-kat-weg:focus-visible { color: var(--p); border-color: var(--p-dim); }
 
 /* Die Schublade ist ein Raster mit drei Spalten — die Überschrift spannt
    darüber, sonst stünde sie als vierte Kachel neben den Apps. */