Малоиспользуемые, но от этого не менее прекрасные возможности LESS

Удивительное рядом. Буквально только что из статьи habrahabr.ru/post/181746/ узнал, что LESS умеет выполнять javascript. Это я к чему: функции и обычные условия нужны не так часто и, обычно, если нужны, то нужны вместе (для обычных случаев вполне хватает гардов вместо условий). Тут как раз и придёт на помощь злой, но полезный eval. Так что могу предложить вам задуматься ещё раз =)

Малоиспользуемые, но от этого не менее прекрасные возможности LESS

Пока не покажете, не поверю. Только что проверил в последнем стабильном Хроме, свойство перезаписывается: сравните
jsbin.com/qocol/1 — при mouseout плавное движение обратно
jsbin.com/qocol/2 — рывок

Малоиспользуемые, но от этого не менее прекрасные возможности LESS

Ваш транзишн отработает неправильно. Потому что в итоговом CSS для класса .button второе объявление убъёт первое, а не дополнит его

Малоиспользуемые, но от этого не менее прекрасные возможности LESS

какой смысл писать одно свойство в классе двумя строчками?

Смысл в том, что LESS сам склеит их в одну строку и Webstorm как ошибку вам их не подсветит.

А ещё более глобальный смысл покажу на примере.

Пусть у вас три транзишна на элементе: top, opacity и color. При этом top и opacity всегда есть. А вот если у элемента :hover, то color у него нету, то бишь проявляться должен цвет мгновенно, а пропадать плавно (http://jsbin.com/qocol/1/)
Вам приходится писать оба неменяющихся транзишна дважды. А если в дело вступают другие состояния (через классы, которые навешиваются в JS), то и ещё больше чем дважды. И если надо поправить тайминг, то делать это приходится везде.
С помощью возможности объединения свойств, используя миксин

.transition (@property: all,@duration: 0s,@delay: 0s,@ease: ease-in-out){
    transition+: @arguments;
}

Вы сможете написать что-то вроде

.button_transitions(){
    .transition(height,1s);
    .transition(opacity,1s);
}

.button{
    .button_transitions;
    .transition(color,1s);
    &:hover{
        .button_transitions;
    }
}

И получите то, что нужно

.button {
  transition: height 1s 0s ease-in-out, opacity 1s 0s ease-in-out, color 1s 0s ease-in-out;
}
.button:hover {
  transition: height 1s 0s ease-in-out, opacity 1s 0s ease-in-out;
}

плюс возможность менять общую часть транзишнов в одном месте.

Малоиспользуемые, но от этого не менее прекрасные возможности LESS

Не очень понял, как Grunt (или Gulp) помогут в той части, которая касается слияний. Из моего опыта: довольно часто происходит так, что на элемент наложено 3-4 транзишна и он имеет несколько состояний. При этом отличия в тразишнах для разных состояний только в одном из этих четырех, а переписывать приходится полностью. Тут отлично поможет миксин на неизменяемую часть и объединение через запятую.
Если Grunt как-то здесь может помочь, то не могли бы вы направить в какую сторону смотреть?
В остальном несомненно, вы правы. Однако не только этими примерами ограничивается применение указанных возможностей: циклы (через рекурсию) можно применить при генерации сетки (так делает bootstrap), передача кода как параметр поможет заменить длинные media query (пожалуй, добавлю это в статью), условия вообще полезная штука.
Ну а использовать или не использовать препроцессоры — это настолько холиварная тема, что даже касаться не хочется