Don’t worry! It’s not a mess up thing, it’s actually CSS minification. 🙂
Minification is a way to serve less weight files to the visitors. But irony is, minified files are not good to read, and not good to edit too. 🙁 It’s actually for machine.
To not to go in that way, just check your LESS compiler. Somewhere in it, you have checked the compiler to minify your compiled CSS file. Just turn off the minification and you will get a nice CSS file after compilation. 🙂
But I do it in other way, I uncheck minification and compile the final file once. Copy the compiled unminified CSS file into a directory called /development/, and then check minification and compile the file again, and put the minified one in theme’s root. On the readme file I mention, where the developer can find the necessary file for further development. 🙂
Minified WordPress theme’s style.css Considerations
But note that, on minification compiler ignores all the commented texts. And you know that WordPress theme stores its information on the very first line within a comment-block. If you serve a minified file, it will wipe out all those comments, and your theme will become orphan. To prevent this, start the very first comment of your style.less file with /*! instead of /*. It will tell the compiler to preserve the comment as it is even the file is minified. 🙂
/*!
Theme name: example
...
*/
selector{
//css rules
}