@layer components{.form-field{flex-direction:column;gap:6px;display:flex}.form-field .form-field__label{color:var(--color-foreground);margin-bottom:6px;font-size:14px;font-weight:500;display:block}.form-field .form-field__required{color:var(--color-accent)}.form-field .form-field__control{background:var(--color-background);border:1px solid oklch(from var(--color-quiet) l calc(c * .3) h);color:var(--color-foreground);border-radius:8px;width:100%;padding:12px 14px;font-size:16px;transition:border-color .2s}.form-field .form-field__control:where(textarea){resize:vertical;min-height:100px}.form-field .form-field__control:focus,.form-field .form-field__control[data-expanded]{border-color:var(--color-accent);outline:none}.form-field .form-field__control[data-invalid]{border-color:var(--color-error)}.form-field .form-field__errors{color:var(--color-error);font-size:13px;display:contents}.form-field .form-field__error{color:var(--color-error);font-size:13px}.form-field .form-field__hint,.form-field .form-field__note{color:var(--color-quiet);font-size:13px}}