Ваня Зорин

По попе:

position relative
  width 100%
  height auto
  min-height 100%

Что делает этот код? Для чего все эти свойства?
Для чего вы и так блочным элементам даёте 100% ширину? Так как в данном коде width: 100% ну вообще не нужно!

По делу:
Учите наследование! % всегда берутся от родительского элемента. И если размер у родителя не указан, то и проценты не сработают!

У body родитель html, а у html окно браузера. Что бы растянуть body на 100%, нужно сначала html дать 100%, а потом body, а потом вашему #intro. Вот тогда #intro растянется на 100%.

html,
body,
#intro {
height: 100%;
}

Проще способ выглядит так:

#intro {
height: 100vh;
}

alert(elem.style.cssText);

currentStyle - это то, что описано в CSS-селекторе или в атрибуте style, или программно дополненный elem.style (как хочет разработчик описать стили).
runtimeStyle - это то, как смог нарисовать браузер заданный стиль.
В современном JS, условно currentStyle можно считать, то что мы достанем или записываем из/в elem.style.свойствоЕлемента, а runtimeStyle - это всякие offset-ы и client-ы - elem.offsetWidth, elem.offsetHeight и тд.
PS: попробуйте поиграться с currentStyle и runtimeStyle над таблицей с заполненными данными с разной степенью распиранием ячеек. Попытаться изменить ширину ячеек - вы поймете разницу, где браузер откликнется на заданную ширину, а где - нет.

function insert(n, arr) {
  let i = 0;
  while (n > arr[i]) i++;
  arr.splice(i, 0, n);
  return arr;
}

вы пытаетесь писать лесс императивно, будто это сасс. а он декларативный, на нём надо писать примерно как на функциональных языках.

здесь нет переменных в привычном смысле, поскольку их нельзя, собственно, изменять. то есть, объявлять переменную заранее и менять потом её значение - не нужно. зато здесь можно в другой области видимости объявить другое значение с этим же именем. например, изменяющиеся значения можно передавать в качестве параметров, при каждом новом вызове.

в общем, код как у вас может быть написан примерно так:

.y(@y) when (@y < 10) {
	.x(@x) when (@x < 10) {
		@squareI: @y * 10 + @x + 1;
		@delayI: @y + @x;
		@output: round(0.2 * @delayI, 1);
		#square-@{squareI} {
			animation-delay: ~"@{output}s";
		}
		.x(@x + 1);
	}
	.x(0);
	.y(@y + 1);
}
.y(0);

но то же самое делается и проще:

.delay(@i: 0) when(@i < 100)
{
	@squareI: @i + 1;
	@x: mod(@i, 10);
	@y: floor(@i / 10);
	@delay: @x + @y;
	#square-@{squareI} { animation-delay: ~"@{delay}s"; }
	.delay(@i + 1);
}
.delay();

Если прямо начинающий... Налоговая вся сидит на винде, уйти от этого не возможно. Знаю, работал тоже там :)

В целом развитие сисадмина выглядит как-то так:
1. Целиком изучаешь Windows. Что, где, как принтеры настроить, чем отличается сетевой принтер от локального, расшаренного по сети. При чем здесь порт 9100.
2. Тут же изучаешь строение принтера, в будущем будет полезно, когда будешь искать контору, которая будет тебя обслуживать.
3. Изучаешь свою локальную сеть. Скорее всего это будет типология "звезда", которая была сделана ещё в году 2003, когда была первая массовая закупка ПК. Чего сделать с ней конечно не дадут, но в серверной есть вполне интересные железки от фсб, пара 2-х ядерных серверов, схд. Если начальник грамотный (или найдешь контакты в своей управе), смело можно расспрашивать, что за чем и для чего.

В общем, тут заканчивается путь эникея. Дальше начинается полет фантазии, чего бы сделать, когда это сделать собственно нельзя.

4. Берешь старый компьютер, ставишь на него например Убунту или Дебиан. Пробуешь поднять самбу, LDAP-авторизацию, изучаешь что такое билеты керберос и почему у тебя ничего не работает, хотя все сделал по инструкции. Вот тут у тебя уже должно быть понимание, что такое система на ядре Linux и чем она отличается от Windows. На этом этапе надо будет обзавестись такой штукой как KVM-роутер (найдешь в серверной).

5. Берешь ещё один старый компьютер. Ставишь на него программный роутер, например pfSense. Настраиваешь его и параллельно разбираешься, чем FreeBSD лучше Linux. Тут главное понять идею всего того что ты делаешь. Параллельно настройке, поднимаешь такие вопросы что такое фаервол, таблица маршрутизации, почему компьютер включен и виден в сети, а на ping не отвечает. Попутно настраиваешь VPN, проксю (если глаз упадет на 3-й squid можешь побаловаться с подменной сертификатов).

6. Берешь в руки старую Циску. Если в инспекции её нет, то идешь в магазин и покупаешь Микротик. Например 2011. Стоит относительно не дорого, да и дома пригодится. Ну или на будущее, воткнешь его в какой нибудь конторе, когда будешь подрабатывать или уволишься из налоговой. В общем разбираешься с устройством, настраиваешь тот же VPN и подключаешься к своему шлюзу, который должен работать на FreeBSD.

Вот тут из тебя будет уже толковый специалист, который пригодится в каждой организации. Есть вполне практический опыт работы, есть представление что такое правильно, а что нет и теоретическая база, которая не даст ударить в грязь на собеседовании.
А вот уже дальше, можешь выбирать куда двигаться в развитии, прям как у littleguga . Остаться на винде, изучать серверные решения и облако Azure, уйти в сторону nix, в сетевое администрирование и т.д.