bug(MatFormField): textarea can be reduce to a smaller height than it's content

### Is this a regression?

- [ ] Yes, this behavior used to work in the previous version

### The previous version in which this bug was not present was

_No response_

### Description

A `textarea` within a `mat-form-field` can be resized using the mouse. If its height is reduced to less than the height of a single line of text, a vertical scrollbar will appear, and the text within the `textarea` will become truncated. This occurs while the parent `mat-form-field` maintains a minimum height of 56px.

### Reproduction

StackBlitz link: https://stackblitz.com/edit/components-issue-starter-wybpxw?file=src%2Findex.html,src%2Fmain.ts
Steps to reproduce:
1. using the mouse, reduce the `textarea` height below 24pixels => a vertical scrollbar appears

This bug can also be reproduced on Material's documentation: https://material.angular.io/components/form-field/overview#form-field-overview

### Expected Behavior

It should not be possible to reduce a `textarea` height below 24px, which represents a single line of text.

### Actual Behavior

When a `textarea` height is reduced below 24px, a vertical scrollbar appears even though the parent `mat-form-field` keeps a minimal height of 56px.

I also noticed that when the `textarea` height is reduced from 28px to 27px, the text within the `textarea` is moved up by 1px. The same behavior can be observed down to 24px. I couldn't understand why this occurs and I'm not sure it is related to the height problem described above.

### Environment

- Angular: 18.2.8
- CDK/Material: 18.2.8 (but could be reproduced on all versions of the Material documentation)
- Browser(s): Edge 131.0.2903.51 / Chrome 130.0.6723.116
- Operating System (e.g. Windows, macOS, Ubuntu): Windows / Ubuntu

从 src/index.html 和 src/main.ts 中链接的 StackBlitz 复现开始，然后将其行为与 Material 文档中的 form-field 示例进行比较。当 textarea 无法调整到小于 24px 的大小，并且其中的文本不会被截断或意外移动时，修复就完成了。

由索引模型根据 Issue 内容生成。