.klyp-FormField{--klyp-FormField-inset:calc(var(--bw-default) + var(--padding-control-x));gap:var(--space-6);flex-direction:column;display:flex}.klyp-FormField__head{align-items:baseline;gap:var(--space-8);padding-inline:var(--klyp-FormField-inset);display:flex}.klyp-FormField__label{min-inline-size:0;font:var(--type-caption);font-weight:var(--font-weight-medium);color:var(--color-fg-muted);flex:auto}.klyp-FormField__counter{font:var(--type-caption);color:var(--color-fg-subtle);font-variant-numeric:tabular-nums;flex:none}.klyp-FormField__footer{min-block-size:var(--space-16);padding-inline:var(--klyp-FormField-inset);font:var(--type-caption);color:var(--color-fg-subtle);text-wrap:pretty;margin:0}.klyp-FormField[data-frame=ring] .klyp-Input,.klyp-FormField[data-frame=ring] .klyp-Textarea{background:var(--color-bg-surface);inline-size:100%;box-shadow:inset 0 0 0 var(--bw-default) var(--color-border-default);border-color:#0000}.klyp-FormField[data-frame=ring] .klyp-Input:hover:not(:disabled):not([readonly]),.klyp-FormField[data-frame=ring] .klyp-Textarea:hover:not(:disabled):not([readonly]){box-shadow:inset 0 0 0 var(--bw-default) var(--color-border-strong)}.klyp-FormField[data-frame=ring] .klyp-Input:focus:not(:disabled),.klyp-FormField[data-frame=ring] .klyp-Textarea:focus:not(:disabled),.klyp-FormField[data-frame=ring] .klyp-Input:focus-visible:not(:disabled),.klyp-FormField[data-frame=ring] .klyp-Textarea:focus-visible:not(:disabled){box-shadow:inset 0 0 0 var(--bw-default) var(--color-ring);border-color:#0000;outline:none}.klyp-FormField[data-frame=fill] .klyp-Input,.klyp-FormField[data-frame=fill] .klyp-Textarea{background:var(--color-bg-surface);border-color:#0000;inline-size:100%}.klyp-FormField[data-frame=fill] .klyp-Input:hover:not(:disabled):not([readonly]),.klyp-FormField[data-frame=fill] .klyp-Textarea:hover:not(:disabled):not([readonly]){border-color:var(--color-border-subtle)}.klyp-FormField[data-frame=fill] .klyp-Input:focus:not(:disabled),.klyp-FormField[data-frame=fill] .klyp-Textarea:focus:not(:disabled),.klyp-FormField[data-frame=fill] .klyp-Input:focus-visible:not(:disabled),.klyp-FormField[data-frame=fill] .klyp-Textarea:focus-visible:not(:disabled){border-color:var(--color-ring);box-shadow:none;outline:none}.klyp-FormField[data-frame=ring] .klyp-Input[aria-invalid=true],.klyp-FormField[data-frame=ring] .klyp-Input[data-invalid],.klyp-FormField[data-frame=ring] .klyp-Textarea[aria-invalid=true],.klyp-FormField[data-frame=ring] .klyp-Input[aria-invalid=true]:focus-visible:not(:disabled),.klyp-FormField[data-frame=ring] .klyp-Input[data-invalid]:focus-visible:not(:disabled),.klyp-FormField[data-frame=ring] .klyp-Textarea[aria-invalid=true]:focus-visible:not(:disabled){box-shadow:inset 0 0 0 var(--bw-default) var(--color-status-danger)}.klyp-FormField[data-frame=fill] .klyp-Input[aria-invalid=true],.klyp-FormField[data-frame=fill] .klyp-Input[data-invalid],.klyp-FormField[data-frame=fill] .klyp-Textarea[aria-invalid=true]{border-color:var(--color-status-danger)}.klyp-FormField[data-frame=fill] .klyp-Input[aria-invalid=true]:focus-visible:not(:disabled),.klyp-FormField[data-frame=fill] .klyp-Input[data-invalid]:focus-visible:not(:disabled),.klyp-FormField[data-frame=fill] .klyp-Textarea[aria-invalid=true]:focus-visible:not(:disabled){border-color:var(--color-status-danger);box-shadow:none}