.input{position:relative;width:100%}.input__field{width:100%;height:52px;padding:14px 16px;background-color:var(--color-surface);border:1px solid var(--color-field-border);border-radius:var(--radius-2xl);font-family:var(--font-compact);font-weight:var(--font-regular);font-size:var(--text-lg);color:var(--color-text);outline:none;transition:border-color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out),background-color var(--duration-fast) var(--ease-out),padding var(--duration-fast) var(--ease-out)}.input__field::placeholder{color:var(--color-field-placeholder)}.input__field:focus{border-color:var(--color-field-focus-border);box-shadow:var(--shadow-field-focus)}.input__field:focus-visible{outline:none}.input__field:disabled{color:var(--color-field-disabled-foreground);background:var(--color-field-disabled-background);opacity:var(--opacity-field-disabled);cursor:not-allowed}.input__field:read-only{background:var(--color-bg);color:var(--color-field-readonly-foreground);cursor:default}.input__field:read-only:focus{border-color:var(--color-field-border);box-shadow:none}.input__label{position:absolute;top:26px;left:16px;transform:translateY(-50%);font-family:var(--font-compact);font-size:var(--text-lg);color:var(--color-text-tertiary);pointer-events:none;transition:top var(--duration-fast) var(--ease-out),font-size var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out)}.input--has-label .input__field:focus,.input--has-label .input__field:not(:placeholder-shown){padding-top:22px;padding-bottom:6px}.input--has-label .input__field:focus~.input__label,.input--has-label .input__field:not(:placeholder-shown)~.input__label{top:13px;font-size:var(--text-xs);color:var(--color-field-focus-foreground)}.input--error .input__field{background-color:var(--color-danger-background);border-color:var(--color-danger-border)}.input--error .input__field:focus{box-shadow:var(--shadow-field-error-focus)}.input--error .input__label{color:var(--color-field-error-foreground)}.input--error.input--has-label .input__field:focus~.input__label,.input--error.input--has-label .input__field:not(:placeholder-shown)~.input__label{color:var(--color-field-error-foreground)}.input--validated .input__field{background-color:var(--color-success-background);border-color:var(--color-field-border)}.input__error{margin-top:var(--spacing-xs);font-family:var(--font-compact);font-size:var(--text-xs);color:var(--color-field-error-foreground)}.input__action{position:absolute;top:26px;right:16px;transform:translateY(-50%);background:none;border:none;padding:0;font-family:var(--font-primary);font-weight:var(--font-medium);font-size:var(--text-sm);color:var(--color-field-action-foreground);cursor:pointer}.input__action:hover{text-decoration:underline}.input--sm .input__field{height:40px;padding:8px 14px;font-size:var(--text-base)}.input--sm .input__label{top:20px;font-size:var(--text-base)}.input--sm.input--has-label .input__field:focus,.input--sm.input--has-label .input__field:not(:placeholder-shown){padding-top:18px;padding-bottom:2px}.input--sm.input--has-label .input__field:focus~.input__label,.input--sm.input--has-label .input__field:not(:placeholder-shown)~.input__label{top:8px;font-size:10px}.input--sm .input__action{top:20px}.input--textarea .input__field{height:auto;min-height:96px;background-color:var(--color-surface-muted);border-radius:var(--radius-3xl);resize:vertical}.input--textarea.input--has-label .input__field:focus~.input__label,.input--textarea.input--has-label .input__field:not(:placeholder-shown)~.input__label{top:1px;left:1px;right:16px;transform:none;padding:2px 15px 3px;background-color:var(--color-surface-muted);border-radius:var(--radius-3xl) var(--radius-3xl) 0 0}.input--textarea.input--has-label .input__field:focus,.input--textarea.input--has-label .input__field:not(:placeholder-shown){padding-top:24px}.input--textarea.input--error.input--has-label .input__field:focus~.input__label,.input--textarea.input--error.input--has-label .input__field:not(:placeholder-shown)~.input__label{background-color:var(--color-danger-background)}.input--textarea.input--validated.input--has-label .input__field:focus~.input__label,.input--textarea.input--validated.input--has-label .input__field:not(:placeholder-shown)~.input__label{background-color:var(--color-success-background)}.input--area .input__field{height:82px;border-radius:var(--radius-3xl)}