Translate pages, areas, menus, forms and posts field by field instead of rebuilding them

A site can have further languages (Settings → Languages). A page is built once; each language
adds only its texts, keyed by the stable block IDs, plus its own address under /en/… (ADR 111,
document schema v27, migration 20261009000100 for page_translation).

- Editor: DE | EN switch, a list of all texts with original, state (missing, translated,
  original changed) and filter; structure stays with the main language. Undo, drafts,
  publishing and revisions cover all languages at once.
- Website: /en and translated slugs, lang, canonical, hreflang with x-default, og:locale,
  sitemap; links to translated pages follow the language; a language switch block.
- Header, footer and linked sections translate the same way; menu entries carry labels per
  language; fixed template texts come from a small dictionary.
- Forms: labels, help, options, button and success message per language; messages and the
  step script speak the language, the submission and the email stay in the main language.
- Posts, archives, category names, consent text and the 404 page follow the language.
- Single-language sites see none of it and never touch the new table.

The forms administration becomes an overview with one row per form and its own edit page;
fields are one line each with details collapsed.

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

public/assets/admin.css

@@ -74,6 +74,9 @@ label { display: block; margin: 18px 0 7px; font-size: 13px; font-weight: 600 }
    der Zeile das Häkchen um - in der Menüverwaltung klappten so die Button-Einstellungen zu. */
 .check-label { display: flex; align-items: center; gap: 8px; font-weight: 500; width: fit-content; max-width: 100% }
 .check-label input { width: 16px; min-height: 16px }
+/* Eine Gruppe von Häkchen nebeneinander, die auf schmalen Bildschirmen umbricht (Sprachen). */
+.check-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px 20px; border: 0; padding: 0; margin: 0 0 12px; min-width: 0 }
+.check-grid legend { font-weight: 600; margin-bottom: 8px; padding: 0 }
 /* A grid of fields that becomes one column when there is no room. */
 .fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 0 24px }
 .fields > div > label:first-child, .field > label:first-child { margin-top: 14px }
@@ -864,12 +867,42 @@ details.card > summary:hover { background: #fafbf8 }
 .card-body .form-fields-head .secondary, .card-body .list-actions .secondary { margin: 0; min-height: 36px; padding: 6px 12px; font-size: 12px }
 .form-fields-head .secondary .nav-icon, .list-actions .secondary .nav-icon { width: 15px; height: 15px; color: var(--accent) }
 .field-list { list-style: none; margin: 12px 0 0; padding: 0; display: grid; gap: 10px }
-.field-card { position: relative; padding: 2px 16px 16px; border: 1px solid var(--line); border-radius: 11px; background: #fafbf8 }
+.field-card { position: relative; padding: 8px 10px; border: 1px solid var(--line); border-radius: 10px; background: #fafbf8 }
+.field-card.is-open { padding-bottom: 14px; background: #fff; box-shadow: 0 1px 6px #203b3414 }
 .field-card-new { border-style: dashed; background: var(--paper) }
-.field-card-head { display: grid; grid-template-columns: 26px minmax(0, 1fr) 190px 38px; gap: 0 12px; align-items: end }
-.field-card-index { display: grid; place-items: center; width: 26px; height: 26px; margin-bottom: 8px; border-radius: 50%; background: #e4ebe2; color: var(--accent); font-size: 12px; font-weight: 700 }
+.field-card-head { display: grid; grid-template-columns: 24px minmax(0, 1fr) 170px auto auto 34px; gap: 0 10px; align-items: center }
+.field-card-head input, .field-card-head select { min-height: 36px }
+.field-card-index { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: #e4ebe2; color: var(--accent); font-size: 12px; font-weight: 700 }
 .field-card label { margin-top: 12px }
-.field-card-body { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 0 16px; padding-left: 38px }
+.field-card-head .field-card-required { margin: 0; font-size: 13px; white-space: nowrap }
+.field-toggle { display: inline-flex; align-items: center; gap: 4px; min-height: 34px; padding: 0 8px; border: 1px solid transparent; border-radius: 8px; background: transparent; color: var(--accent); font-size: 12px; font-weight: 650; white-space: nowrap }
+.field-toggle:hover { background: #eef3ec }
+.field-toggle .form-chevron { transition: transform .15s }
+.field-card.is-open .field-toggle .form-chevron { transform: rotate(180deg) }
+.field-card-meta { margin: 4px 0 0 34px; font-size: 12px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap }
+.field-card-body { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 0 16px; padding-left: 34px }
+.field-card-body[hidden] { display: none }
+.field-translation { grid-column: 1 / -1; margin-top: 12px; padding-top: 8px; border-top: 1px dashed var(--line) }
+.field-translation summary { cursor: pointer; font-size: 13px; font-weight: 650 }
+/* Ein Formular je zuklappbarer Karte, Abschnitte darin ebenfalls zuklappbar. */
+.form-card > .form-card-summary { display: flex; align-items: center; gap: 12px; padding: 16px 20px; cursor: pointer; list-style: none }
+details.form-card > summary.form-card-summary::before, details.form-card[open] > summary.form-card-summary::before { content: none }
+.form-card > .form-card-summary::-webkit-details-marker, .form-section > summary::-webkit-details-marker { display: none }
+.form-card-name { font-size: 16px; font-weight: 700 }
+.form-card > .form-card-summary { cursor: default; border-bottom: 1px solid var(--line) }
+.form-list-name { margin: 0; font-size: 15px; font-weight: 650 }
+.form-list-name a { text-decoration: none }
+.form-list-name a:hover { text-decoration: underline }
+.form-list .row { align-items: center }
+.back-to-list { display: inline-block; margin-top: 4px }
+.form-card-facts { flex: 1; min-width: 0; font-size: 12px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap }
+.form-chevron { flex: none; color: #52665a; transition: transform .15s }
+.form-card[open] > .form-card-summary { border-bottom: 1px solid var(--line) }
+.form-card[open] > .form-card-summary > .form-chevron, .form-section[open] > summary > .form-chevron { transform: rotate(180deg) }
+.form-section { border-bottom: 1px solid var(--line); padding-bottom: 12px }
+.form-section > summary { display: flex; align-items: center; gap: 10px; padding: 14px 0 2px; cursor: pointer; list-style: none }
+.form-section > summary .form-part { margin: 0 }
+.form-section-hint { flex: 1; min-width: 0; font-size: 12px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap }
 .field-card-body .field-help { margin-top: 5px }
 .field-card-flags { align-self: end; padding-bottom: 11px }
 .field-card-flags .check-label { margin: 12px 0 0 }
@@ -916,11 +949,16 @@ details.card > summary:hover { background: #fafbf8 }
 .form-look .color-control { margin-top: 0 }
 @media (max-width: 1100px) { .form-editor { grid-template-columns: 1fr } }
 @media (max-width: 700px) {
-    .field-card { padding-top: 8px }
-    .field-card-head { grid-template-columns: 26px minmax(0, 1fr) }
-    .field-card-title, .field-card-type { grid-column: 2 }
+    .field-card-head { grid-template-columns: 24px minmax(0, 1fr) auto; gap: 8px }
+    .field-card-title { grid-column: 2 / 4; padding-right: 36px }
+    .field-card-type { grid-column: 2 }
+    .field-card-head .field-card-required { grid-column: 3 }
+    .field-toggle { grid-column: 2 }
     .field-card-head .field-remove { position: absolute; top: 8px; right: 8px }
+    .field-card-meta { margin-left: 0 }
     .field-card-body { padding-left: 0 }
+    .form-card-facts { white-space: normal }
+    .form-card > .form-card-summary { flex-wrap: wrap; padding: 14px 16px }
 }
 
 /* ---- design: palette cards, ready-made palettes, font cards, typography preview -------- */
@@ -1006,3 +1044,8 @@ details.card > summary:hover { background: #fafbf8 }
 .menu-entry > .menu-drag-handle { position: absolute; left: 14px; top: 10px; z-index: 1 }
 .menu-entry summary { padding-left: 58px; min-height: 60px }
 @media (max-width: 560px) { .menu-entry > .menu-drag-handle { left: 8px; top: 8px } .menu-entry summary { padding-left: 50px; min-height: 56px } }
+/* Texte der Website in weiteren Sprachen (Einstellungen → Sprachen, ADR 111). */
+.language-texts { margin-top: 24px; padding-top: 16px; border-top: 1px solid #dfe5e1 }
+.language-texts h3 { margin: 0 0 6px; font-size: 15px }
+.language-text-group { display: grid; gap: 6px; border: 1px solid #dfe5e1; border-radius: 8px; padding: 12px 16px; margin: 12px 0; min-width: 0 }
+.language-text-group legend { font-weight: 600; padding: 0 4px }