/* Mitwachsende Textfelder, geteilter Baustein (Hausregel "Mehrzeilige Felder
 * wachsen mit"). Klasse `melucio-mitwachsen` auf ein <textarea>.
 *
 * Mit `field-sizing: content` waechst das Feld allein (Chrome/Edge ab 123,
 * Safari 26); sonst setzt melucio-mitwachsen.js die Hoehe. Mindesthoehe aus
 * `--mw-zeilen` (Vorgabe 3) plus `--mw-rand` (Padding plus Rahmen in px, Vorgabe
 * 22), Hoechsthoehe die halbe SICHTBARE Hoehe, hoechstens 24rem; darueber
 * scrollt das Feld. Keine transition auf height.
 *
 * --sicht-hoehe setzt das Skript aus visualViewport: Am Telefon schrumpfen vh
 * und dvh nicht mit der Tastatur, das Feld waere sonst hoeher als der freie
 * Platz und der feste Kopf deckte die oberen Zeilen ab (Vorfall 04.10.2026).
 */
textarea.melucio-mitwachsen {
  field-sizing: content;
  box-sizing: border-box;
  min-height: calc(var(--mw-zeilen, 3) * 1lh + var(--mw-rand, 22px));
  max-height: min(50vh, 24rem);
  max-height: min(calc(var(--sicht-hoehe, 100dvh) * 0.5), 24rem);
  overflow-y: auto;
  resize: vertical;
  /* Beim Rollen nicht unter einen festen Kopf (56px plus Notch plus Luft). */
  scroll-margin-top: calc(56px + env(safe-area-inset-top, 0px) + 8px);
}