diff --git a/doc/80-Upgrading.md b/doc/80-Upgrading.md
index 85e89f121..842c281a9 100644
--- a/doc/80-Upgrading.md
+++ b/doc/80-Upgrading.md
@@ -10,6 +10,7 @@ v2.6 to v2.8 requires to follow the instructions for v2.7 too.
 * Asset support for modules (#3961) introduced with v2.8 has now been removed.
 * `expandable-toggle`-support has been removed. Use `class="collapsible" data-visible-height=0`
   to achieve the same effect. (Available since v2.7.0)
+* The `.var()` LESS mixin and the LESS function `extract-variable-default` have been removed (introduced with v2.9)
 
 ## Upgrading to Icinga Web 2 2.9.1
 
diff --git a/library/Icinga/Util/LessParser.php b/library/Icinga/Util/LessParser.php
index 595332a30..946b3f686 100644
--- a/library/Icinga/Util/LessParser.php
+++ b/library/Icinga/Util/LessParser.php
@@ -4,10 +4,6 @@
 namespace Icinga\Util;
 
 use Icinga\Less\Visitor;
-use Less_Tree_Anonymous;
-use Less_Tree_Expression;
-use Less_Tree_Quoted;
-use Less_Tree_Value;
 use lessc;
 
 require_once 'lessphp/lessc.inc.php';
@@ -20,57 +16,8 @@ class LessParser extends lessc
      */
     public function __construct($disableModes = false)
     {
-        $this->registerFunction('extract-variable-default', [$this, 'extractVariableDefault']);
         if (! $disableModes) {
             $this->setOption('plugins', [new Visitor()]);
         }
     }
-
-    /**
-     * Extract default from given variable call
-     *
-     * How to use:
-     *
-     *   color: extract-variable-default(@mixin-parameter);
-     *   color: @mixin-parameter;
-     *
-     *   border: extract-variable-default(1px solid @mixin-parameter);
-     *   border: 1px solid @mixin-parameter;
-     *
-     *   background: drop-shadow(5px 0 3px extract-variable-default(@mixin-parameter, true));
-     *   background: drop-shadow(5px 0 3px @mixin-parameter);
-     *
-     * @param mixed $value
-     * @param bool  $valAsDefault
-     *
-     * @return mixed
-     */
-    public function extractVariableDefault($value, $valAsDefault = false)
-    {
-        $defaultValue = 'inherit';
-        if ($value instanceof Less_Tree_Quoted) {
-            $stripped = preg_replace(
-                '~var\s*\(\s*[-\w]+\s*,\s*([^)]+)\)~',
-                '$1',
-                $value->value,
-                -1,
-                $replacements
-            );
-            if ($replacements > 0) {
-                $defaultValue = $stripped;
-            }
-        } elseif ($value instanceof Less_Tree_Expression) {
-            foreach ($value->value as $i => $item) {
-                $value->value[$i] = $this->extractVariableDefault($item, true);
-            }
-
-            return $value;
-        }
-
-        if ($valAsDefault && $defaultValue === 'inherit') {
-            return $value;
-        }
-
-        return new Less_Tree_Value([new Less_Tree_Anonymous($defaultValue)]);
-    }
 }
diff --git a/library/Icinga/Web/LessCompiler.php b/library/Icinga/Web/LessCompiler.php
index aebff28b1..571d342e2 100644
--- a/library/Icinga/Web/LessCompiler.php
+++ b/library/Icinga/Web/LessCompiler.php
@@ -3,9 +3,9 @@
 
 namespace Icinga\Web;
 
-use Exception;
 use Icinga\Application\Logger;
 use Icinga\Util\LessParser;
+use Less_Exception_Parser;
 
 /**
  * Compile LESS into CSS
@@ -229,7 +229,7 @@ class LessCompiler
                 '\2 \1',
                 $this->lessc->compile($this->source)
             );
-        } catch (Exception $e) {
+        } catch (Less_Exception_Parser $e) {
             $excerpt = substr($this->source, $e->index - 500, 1000);
 
             $lines = [];
diff --git a/modules/doc/public/css/module.less b/modules/doc/public/css/module.less
index 97d293824..007c5c515 100644
--- a/modules/doc/public/css/module.less
+++ b/modules/doc/public/css/module.less
@@ -2,27 +2,20 @@
 
 // Mixins
 
-.gradient(@a: ~"var(--gray-lighter, @{gray-lighter})"; @b: ~"var(--gray-lightest, @{gray-lightest})") {
-  background: extract-variable-default(@a);
+.gradient(@a: @gray-lighter; @b: @gray-lightest) {
   background: @a;
-  background: -webkit-gradient(linear, left top, left bottom, from(extract-variable-default(@a, true)), to(extract-variable-default(@b, true)));
   background: -webkit-gradient(linear, left top, left bottom, from(@a), to(@b));
-  background: -webkit-linear-gradient(top, extract-variable-default(@a, true), extract-variable-default(@b, true));
   background: -webkit-linear-gradient(top, @a, @b);
-  background: -moz-linear-gradient(top, extract-variable-default(@a, true), extract-variable-default(@b, true));
   background: -moz-linear-gradient(top, @a, @b);
-  background: -ms-linear-gradient(top, extract-variable-default(@a, true), extract-variable-default(@b, true));
   background: -ms-linear-gradient(top, @a, @b);
-  background: -o-linear-gradient(top, extract-variable-default(@a, true), extract-variable-default(@b, true));
   background: -o-linear-gradient(top, @a, @b);
-  background: linear-gradient(to bottom, extract-variable-default(@a, true), extract-variable-default(@b, true));
   background: linear-gradient(to bottom, @a, @b);
 }
 
 // General styles
 
 code {
-  .var(color, icinga-blue);
+  color: @icinga-blue;
   font-family: @font-family-fixed;
 }
 
@@ -31,13 +24,11 @@ pre > code {
 }
 
 .chapter a {
-  border-bottom: 1px dotted;
-  .var(border-bottom-color, gray-light);
+  border-bottom: 1px dotted @gray-light;
   font-weight: @font-weight-bold;
 
   &:hover {
-    border-bottom: 1px solid;
-    .var(border-bottom-color, text-color);
+    border-bottom: 1px solid @text-color;
     text-decoration: none;
   }
 }
@@ -49,8 +40,8 @@ pre > code {
 .search-highlight {
   .rounded-corners();
 
-  .var(background, icinga-blue);
-  .var(color, text-color-on-icinga-blue);
+  background: @icinga-blue;
+  color: @text-color-on-icinga-blue;
   padding: 0 0.3em 0 0.3em;
 }
 
@@ -70,7 +61,7 @@ pre > code {
 
     a {
       &:before {
-        .var(color, icinga-blue);
+        color: @icinga-blue;
         content: counters(li,".") " ";
         display: inline-block;
         font-size: small;
@@ -97,7 +88,7 @@ tbody > tr:nth-child(odd) {
 }
 
 tbody > tr:nth-child(even) {
-  .var(background, body-bg-color);
+  background: @body-bg-color;
 }
 
 td, th {
@@ -111,8 +102,7 @@ td {
 }
 
 th {
-  border-bottom: 2px solid;
-  .var(border-bottom-color, icinga-blue);
+  border-bottom: 2px solid @icinga-blue;
   font-weight: @font-weight-bold;
   text-align: left;
   text-transform: uppercase;
diff --git a/modules/monitoring/public/css/module.less b/modules/monitoring/public/css/module.less
index 03d062804..1eb9ea6b5 100644
--- a/modules/monitoring/public/css/module.less
+++ b/modules/monitoring/public/css/module.less
@@ -2,9 +2,8 @@
 
 .monitoring-statusbar {
   position: relative;
-  .var(background-color, body-bg-color);
-  border-top: 1px solid;
-  .var(border-top-color, gray-lighter);
+  background-color: @body-bg-color;
+  border-top: 1px solid @gray-lighter;
   padding: .25em @gutter;
   line-height: 1.3;
 
@@ -32,11 +31,11 @@
     font-size: 1.25em;
 
     &.-active {
-      .var(color, icinga-blue);
+      color: @icinga-blue;
     }
 
     &.-inactive {
-      .var(color, gray-light);
+      color: @gray-light;
     }
   }
 }
@@ -71,7 +70,7 @@
     color: white;
   }
   .group-grid-cell > div.state-none {
-    .var(background-color, gray-light);
+    background-color: @gray-light;
   }
 }
 
@@ -156,10 +155,10 @@
 }
 
 .service-on {
-  .var(color, text-color-light);
+  color: @text-color-light;
 
   > a {
-    .var(color, text-color);
+    color: @text-color;
     letter-spacing: normal;
     font-weight: bold;
   }
@@ -187,7 +186,7 @@
   }
 
   li {
-    .var(color, icinga-blue);
+    color: @icinga-blue;
   }
 
   a,
@@ -196,7 +195,7 @@
     padding: .25em .5em;
 
     &:hover {
-      .var(background-color, gray-lighter);
+      background-color: @gray-lighter;
       text-decoration: none;
     }
   }
@@ -255,7 +254,7 @@
 .tactical div.box.header {
   margin: 10px;
   min-height: 8em;
-  .var(color, text-color-inverted);
+  color: @text-color-inverted;
   font-size: @font-size-dashboard;
 }
 
@@ -264,12 +263,12 @@
 }
 
 div.box.ok_hosts.state_up {
-  .var(background-color, color-ok);
+  background-color: @color-ok;
   border: 1px solid white;
 }
 
 div.box.problem_hosts.state_down {
-  .var(background-color, color-critical);
+  background-color: @color-critical;
   border: 1px solid white;
 }
 
@@ -286,29 +285,25 @@ div.box.ok_hosts div.box.entry, div.box.problem_hosts div.box.entry {
 }
 
 div.box.monitoringfeatures {
-  border: 1px solid;
-  .var(border-color, gray-lighter);
-  border-left: 15px solid;
-  .var(border-left-color, "gray");
+  border: 1px solid @gray-lighter;
+  border-left: 15px @gray;
 }
 
 div.box.monitoringfeatures div.box-separator {
   color: white;
-  .var(background-color, color-ok);
+  background-color: @color-ok;
 }
 
 div.box.monitoringfeatures div.feature-highlight {
-  .var(background-color, color-critical);
+  background-color: @color-critical;
 }
 
 div.box.monitoringfeatures a.feature-highlight {
 }
 
 div.box.hostservicechecks {
-  border: 1px solid;
-  .var(border-color, gray-lighter);
-  border-left: 15px solid;
-  .var(border-left-color, "gray");
+  border: 1px solid @gray-lighter;
+  border-left: 15px @gray;
 }
 
 div.box.hostservicechecks th {
@@ -320,18 +315,15 @@ div.box.hostservicechecks th {
 div.box.process {
   width: 100%;
   max-width: 50em;
-  border: 1px solid;
-  .var(border-color, gray-lighter);
-  border-left: 15px solid;
-  .var(border-left-color, "gray");
+  border: 1px solid @gray-lighter;
+  border-left: 15px @gray;
   margin-bottom: 1em;
   margin-right: 1em;
 }
 
 .process div.box.header {
   min-height: 5em;
-  border-bottom:1px solid;
-  .var(border-bottom-color, gray-lighter);
+  border-bottom: 1px solid @gray-lighter;
 }
 
 .process > .boxview > div.box {
@@ -342,8 +334,7 @@ div.box.process {
   margin-top: 0;
   margin-bottom: 1em;
   padding-bottom: 1em;
-  border-bottom:1px solid;
-  .var(border-bottom-color, gray-lighter);
+  border-bottom: 1px solid @gray-lighter;
 }
 
 .process th {
@@ -358,7 +349,7 @@ div.box.process {
 }
 
 div.backend-running {
-  .var(background, color-ok);
+  background: @color-ok;
   color: white;
   text-align: center;
   margin-top: 1em;
@@ -370,7 +361,7 @@ div.backend-running {
 }
 
 div.backend-not-running {
-  .var(background, color-critical);
+  background: @color-critical;
   color: white;
   text-align: center;
   padding: 0.1em;
@@ -382,16 +373,13 @@ div.backend-not-running {
 div.box.features {
   width: 100%;
   max-width: 50em;
-  border: 1px solid;
-  .var(border-color, gray-lighter);
-  border-left: 15px solid;
-  .var(border-left-color, "gray");
+  border: 1px solid @gray-lighter;
+  border-left: 15px @gray;
 }
 
 .features div.box.header {
   min-height: 5em;
-  border-bottom: 1px solid;
-  .var(border-bottom-color, gray-lighter);
+  border-bottom: 1px solid @gray-lighter;
 }
 
 .features > .boxview > div.box {
@@ -402,8 +390,7 @@ div.box.features {
   margin-top: 0;
   margin-bottom: 1em;
   padding-bottom: 1em;
-  border-bottom: 1px solid;
-  .var(border-bottom-color, gray-lighter);
+  border-bottom: 1px solid @gray-lighter;
 }
 
 
@@ -412,11 +399,9 @@ div.box.features {
 div.box.stats {
   width: 100%;
   max-width: 50em;
-  border: 1px solid;
-  .var(border-color, gray-lighter);
-  border-left: 15px solid;
-  .var(border-left-color, "gray");
-  .var(color, text-color);
+  border: 1px solid @gray-lighter;
+  border-left: 15px @gray;
+  color: @text-color;
 }
 
 .stats > .boxview > div.box {
@@ -429,13 +414,12 @@ div.box.stats {
 }
 
 .stats > table > thead {
-  .var(color, "gray");
+  color: @gray;
 }
 
 .stats > h2 {
   text-align: left;
-  border-bottom: 1px solid;
-  .var(border-bottom-color, gray-lighter);
+  border-bottom: 1px solid @gray-lighter;
 
   > .hosts-summary,
   > .services-summary {
@@ -455,10 +439,8 @@ div.box.stats {
 div.timeline-legend {
   padding: 0.5em;
   margin-top: 2em;
-  border: 1px solid;
-  .var(border-color, gray-lighter);
-  border-left: 15px solid;
-  .var(border-left-color, "gray");
+  border: 1px solid @gray-lighter;
+  border-left-width: 15px;
 
   h2 {
     margin: 0;
@@ -478,7 +460,7 @@ div.timeline-legend {
       font-weight: @font-weight-bold;
       font-size: 11px;
       text-align: center;
-      .var(color, text-color-inverted);
+      color: @text-color-inverted;
       padding-left: 5px;
       padding-right: 5px;
       padding-top: 2px;
@@ -624,7 +606,7 @@ form.instance-features span.description, form.object-features span.description {
     text-align: left;
     margin-right: 0;
     width: @name-value-table-name-width;
-    .var(color, text-color-light);
+    color: @text-color-light;
 
     label {
       font-size: inherit;
@@ -663,50 +645,49 @@ form.instance-features span.description, form.object-features span.description {
 
     & + span.hint {
       margin: .35em;
-      .var(color, gray-light);
+      color: @gray-light;
       font-style: italic;
     }
   }
 }
 
 .plugin-output {
-  border-left: 5px solid;
-  .var(border-left-color, gray-lighter);
+  border-left: 5px solid @gray-lighter;
   padding: 0.66em 0.33em;
 
   .state-critical {
-    .var(background-color, color-critical);
-    .var(color, body-bg-color);
+    background-color: @color-critical;
+    color: @body-bg-color;
     padding: 0.2em;
   }
 
   .state-ok {
-    .var(background-color, color-ok);
-    .var(color, body-bg-color);
+    background-color: @color-ok;
+    color: @body-bg-color;
     padding: 0.2em;
   }
 
   .state-unknown {
-    .var(background-color, color-unknown);
-    .var(color, body-bg-color);
+    background-color: @color-unknown;
+    color: @body-bg-color;
     padding: 0.2em;
   }
 
   .state-warning {
-    .var(background-color, color-warning);
-    .var(color, body-bg-color);
+    background-color: @color-warning;
+    color: @body-bg-color;
     padding: 0.2em;
   }
 
   .state-down {
-    .var(background-color, color-down);
-    .var(color, body-bg-color);
+    background-color: @color-down;
+    color: @body-bg-color;
     padding: 0.2em;
   }
 
   .state-up {
-    .var(background-color, color-up);
-    .var(color, body-bg-color);
+    background-color: @color-up;
+    color: @body-bg-color;
     padding: 0.2em;
   }
 }
@@ -715,12 +696,10 @@ form.instance-features span.description, form.object-features span.description {
 .markdown,
 .plugin-output {
   a {
-    border-bottom: 1px dotted;
-    .var(border-bottom-color, gray-light);
+    border-bottom: 1px dotted @gray-light;
 
     &:hover {
-      border-bottom: 1px solid;
-      .var(border-bottom-color, text-color);
+      border-bottom: 1px solid @text-color;
       text-decoration: none;
     }
   }
diff --git a/modules/monitoring/public/css/service-grid.less b/modules/monitoring/public/css/service-grid.less
index 936f0a97f..fd22097a6 100644
--- a/modules/monitoring/public/css/service-grid.less
+++ b/modules/monitoring/public/css/service-grid.less
@@ -5,7 +5,7 @@
   white-space: nowrap;
 
   td {
-    .var(color, gray-light);
+    color: @gray-light;
     padding: 0.2em;
     text-align: center;
     width: 1em;
@@ -33,14 +33,14 @@
   font-size: 130%;
 
   a {
-    .var(color, text-color);
+    color: @text-color;
     outline: none;
 
     &:hover {
-      .var(color, text-color-light);
+      color: @text-color-light;
     }
     &:focus, &:active {
-      .var(color, icinga-blue);
+      color: @icinga-blue;
     }
   }
 
@@ -66,7 +66,7 @@ form.filter-toggle {
     display: inline-block;
     vertical-align: top;
     margin-left: .5em;
-    .var(color, gray-light);
+    color: @gray-light;
   }
 
   input[type="checkbox"]:checked ~ label {
diff --git a/modules/monitoring/public/css/tables.less b/modules/monitoring/public/css/tables.less
index 9dea557f9..ea1747761 100644
--- a/modules/monitoring/public/css/tables.less
+++ b/modules/monitoring/public/css/tables.less
@@ -59,20 +59,20 @@
 
 // Host name and IP addresses in the host and service detail view
 .host-meta {
-  .var(color, text-color-light);
+  color: @text-color-light;
   font-size: @font-size-small;
 }
 
 // Link to unhandled services in the hosts overview
 .host-services-incidents {
-  .var(color, color-critical);
+  color: @color-critical;
   font-family: @font-family-wide;
   font-size: @font-size-small;
 }
 
 // Notification recipient in the notifications overview
 .notification-recipient {
-  .var(color, text-color-light);
+  color: @text-color-light;
   float: right;
   font-size: @font-size-small;
 }
@@ -104,7 +104,7 @@
 
 // Plugin output in overviews
 .overview-plugin-output {
-  .var(color, text-color-light);
+  color: @text-color-light;
   font-family: @font-family-fixed;
   font-size: @font-size-small;
   margin: 0;
@@ -146,7 +146,7 @@
 
 // Service description if in the service detail view
 .service-meta {
-  .var(color, text-color-light);
+  color: @text-color-light;
   font-size: @font-size-small;
 }
 
@@ -154,68 +154,61 @@
 .state-col {
   &.state-ok,
   &.state-up {
-    border-left: @border-left-width solid;
-    .var(border-left-color, color-ok);
+    border-left: @border-left-width solid @color-ok;
   }
 
   &.state-pending {
-    border-left: @border-left-width solid;
-    .var(border-left-color, color-pending);
+    border-left: @border-left-width solid @color-pending;
   }
 
   &.state-critical,
   &.state-down {
-    .var(background-color, color-critical);
-    .var(color, text-color-inverted);
+    background-color: @color-critical;
+    color: @text-color-inverted;
 
     &.handled {
       background-color: inherit;
       color: inherit;
-      border-left: @border-left-width solid;
-      .var(border-left-color, color-critical-handled);
+      border-left: @border-left-width solid @color-critical-handled;
     }
   }
 
   &.state-warning {
-    .var(background-color, color-warning);
-    .var(color, text-color-inverted);
+    background-color: @color-warning;
+    color: @text-color-inverted;
 
     &.handled {
       background-color: inherit;
       color: inherit;
-      border-left: @border-left-width solid;
-      .var(border-left-color, color-warning-handled);
+      border-left: @border-left-width solid @color-warning-handled;
     }
   }
 
   &.state-unknown {
-    .var(background-color, color-unknown);
-    .var(color, text-color-inverted);
+    background-color: @color-unknown;
+    color: @text-color-inverted;
 
     &.handled {
       background-color: inherit;
       color: inherit;
-      border-left: @border-left-width solid;
-      .var(border-left-color, color-unknown-handled);
+      border-left: @border-left-width solid @color-unknown-handled;
     }
   }
 
   &.state-unreachable {
-    .var(background-color, color-unreachable);
-    .var(color, text-color-inverted);
+    background-color: @color-unreachable;
+    color: @text-color-inverted;
 
     &.handled {
       background-color: inherit;
       color: inherit;
-      border-left: @border-left-width solid;
-      .var(border-left-color, color-unreachable-handled);
+      border-left: @border-left-width solid @color-unreachable-handled;
     }
   }
 
   // State class for history events
   &.state-no-state {
-    border-left: @border-left-width solid;
-    .var(border-left-color, text-color-light);
+    border-left: @border-left-width solid @text-color-light;
   }
 
   * {
@@ -263,11 +256,11 @@
   }
 
   tr[href].active {
-    .var(background-color, tr-active-color);
+    background-color: @tr-active-color;
   }
 
   tr[href]:hover {
-    .var(background-color, tr-hover-color);
+    background-color: @tr-hover-color;
     cursor: pointer;
   }
 
diff --git a/public/css/icinga/about.less b/public/css/icinga/about.less
index 464200242..de151fe97 100644
--- a/public/css/icinga/about.less
+++ b/public/css/icinga/about.less
@@ -7,11 +7,11 @@
 
   .about-social i {
     font-size: 1.7em;
-    .var(color, text-color);
+    color: @text-color;
   }
 
   .about-social i:hover {
-    .var(color, icinga-blue);
+    color: @icinga-blue;
   }
 
   .about-links {
@@ -23,11 +23,11 @@
     margin: 0.5em;
     padding: 0;
     font-size: 5em;
-    .var(color, text-color);
+    color: @text-color;
   }
 
   .about-links i:hover {
-    .var(color, icinga-blue);
+    color: @icinga-blue;
   }
 
   .common-table th {
diff --git a/public/css/icinga/audit.less b/public/css/icinga/audit.less
index a3e9c7acf..9e435f86f 100644
--- a/public/css/icinga/audit.less
+++ b/public/css/icinga/audit.less
@@ -6,10 +6,10 @@
   li {
     .rounded-corners(3px);
     border: 1px solid;
-    .var(border-color, low-sat-blue);
+    border-color: @low-sat-blue;
 
     &.active {
-      .var(border-color, icinga-blue);
+      border-color: @icinga-blue;
     }
   }
 }
@@ -20,14 +20,13 @@
   }
 
   h3 {
-    border-bottom: 1px solid;
-    .var(border-bottom-color, gray-light);
+    border-bottom: 1px solid @gray-light;
   }
 
   h3 em,
   .previews em,
   .privilege-label em {
-    .var(color, text-color-light);
+    color: @text-color-light;
   }
   h3 em {
     font-weight: normal;
@@ -37,18 +36,18 @@
   }
 
   .icon {
-    .var(color, gray-light);
+    color: @gray-light;
 
     &.granted {
-      .var(color, color-granted);
+      color: @color-granted;
     }
 
     &.refused {
-      .var(color, color-refused);
+      color: @color-refused;
     }
 
     &.restricted {
-      .var(color, color-restricted);
+      color: @color-restricted;
     }
   }
 
@@ -61,7 +60,7 @@
     &:hover .spacer {
       .transition(opacity .25s .25s ease-in);
       border: 0 dashed;
-      .var(border-color, gray-light);
+      border-color: @gray-light;
       border-top-width: .2em;
       opacity: 1;
     }
@@ -72,25 +71,25 @@
     border-left-width: 2px;
 
     &.granted {
-      .var(border-color, color-granted);
+      border-color: @color-granted;
     }
 
     &.refused {
-      .var(border-color, color-refused);
+      border-color: @color-refused;
     }
   }
 
   .connector {
     border: 0 solid;
-    .var(border-color, gray-lighter);
+    border-color: @gray-lighter;
     border-bottom-width: 2px;
 
     &.granted {
-      .var(border-color, color-granted);
+      border-color: @color-granted;
     }
 
     &.refused {
-      .var(border-color, color-refused);
+      border-color: @color-refused;
     }
 
     &:first-child {
@@ -102,22 +101,22 @@
   .role {
     .rounded-corners(1em);
     border: 2px solid;
-    .var(border-color, gray-lighter);
+    border-color: @gray-lighter;
 
     &.granted {
       border: 2px solid;
-      .var(border-color, color-granted);
+      border-color: @color-granted;
     }
 
     &.refused {
       border: 2px solid;
-      .var(border-color, color-refused);
+      border-color: @color-refused;
     }
   }
 
   .restriction {
     font-family: @font-family-fixed;
-    .var(background-color, gray-lighter);
+    background-color: @gray-lighter;
   }
 }
 
diff --git a/public/css/icinga/badges.less b/public/css/icinga/badges.less
index 020f6176f..eae95c219 100644
--- a/public/css/icinga/badges.less
+++ b/public/css/icinga/badges.less
@@ -8,8 +8,8 @@
   .bg-stateful();
   .rounded-corners();
 
-  .var(background-color, "gray");
-  .var(color, badge-color);
+  background-color: @gray;
+  color: @badge-color;
   display: inline-block;
   font-family: @font-family-wide;
   font-size: @font-size-small;
diff --git a/public/css/icinga/base.less b/public/css/icinga/base.less
index e85104223..7cecc9c9e 100644
--- a/public/css/icinga/base.less
+++ b/public/css/icinga/base.less
@@ -186,8 +186,7 @@ blockquote, p, pre {
 }
 
 blockquote {
-  border-left: 5px solid;
-  .var(border-left-color, gray-lighter);
+  border-left: 5px solid @gray-lighter;
   padding: 0.667em 0.333em;
 }
 
@@ -197,8 +196,7 @@ h1, h2, h3, h4, h5, h6 {
 }
 
 h1 {
-  border-bottom: 1px solid;
-  .var(border-bottom-color, gray-lighter);
+  border-bottom: 1px solid @gray-lighter;
   font-size: 1.333em;
 }
 
@@ -225,7 +223,7 @@ h6 {
 
 pre {
   .rounded-corners(.25em);
-  .var(background-color, gray-lighter);
+  background-color: @gray-lighter;
   font-family: @font-family-fixed;
   font-size: @font-size-small;
   padding: @vertical-padding @horizontal-padding;
@@ -262,7 +260,7 @@ td, th {
     display: block;
 
     background: url(../img/icinga-loader.gif) no-repeat center center;
-    .var(background-color, body-bg-color);
+    background-color: @body-bg-color;
     background-size: 4em 4em;
 
     opacity: 0;
diff --git a/public/css/icinga/controls.less b/public/css/icinga/controls.less
index 7f6c485d3..8d89f952c 100644
--- a/public/css/icinga/controls.less
+++ b/public/css/icinga/controls.less
@@ -39,7 +39,7 @@ input.search {
   }
 
   &:focus:not([readonly]) {
-    .var(border-color, icinga-blue);
+    border-color: @icinga-blue;
   }
 }
 
@@ -64,7 +64,7 @@ input.search {
   margin: .5em 0;
 
   > a {
-    .var(color, icinga-blue);
+    color: @icinga-blue;
     padding: .5em;
     line-height: 1;
   }
@@ -104,12 +104,11 @@ input.search {
     line-height: 1;
 
     &.active {
-      border-bottom: 2px solid;
-      .var(border-bottom-color, icinga-blue);
+      border-bottom: 2px solid @icinga-blue;
 
       > a,
       > a:hover {
-        .var(color, icinga-blue);
+        color: @icinga-blue;
         /* Compensate border-bottom: 2px */
         margin-bottom: -2px;
       }
@@ -122,7 +121,7 @@ input.search {
     }
 
     &.disabled {
-      .var(color, disabled-gray);
+      color: @disabled-gray;
       cursor: no-drop;
     }
 
@@ -131,7 +130,7 @@ input.search {
       padding: 0.5em;
     }
     > a:hover {
-      .var(background-color, gray-lighter);
+      background-color: @gray-lighter;
       text-decoration: none;
     }
   }
@@ -238,7 +237,7 @@ input.search {
 .icinga-datetime-picker .flatpickr-day.today {
   &:hover,
   &:focus {
-    .var(color, fp-today_fg_color);
+    color: @fp-today_fg_color;
   }
 }
 
diff --git a/public/css/icinga/forms.less b/public/css/icinga/forms.less
index bf013b0a0..aa1087204 100644
--- a/public/css/icinga/forms.less
+++ b/public/css/icinga/forms.less
@@ -162,7 +162,7 @@ form.icinga-form .control-group .toggle-switch ~ .control-info {
   input[type="file"],
   textarea,
   select {
-    .var(background-color, low-sat-blue);
+    background-color: @low-sat-blue;
   }
 }
 
@@ -306,22 +306,22 @@ form.icinga-form .form-controls {
   }
 
   input[type="submit"].btn-remove {
-    .button(~"var(--body-bg-color, @{body-bg-color})", ~"var(--color-critical, @{color-critical})", ~"var(--color-critical-accentuated, @{color-critical-accentuated})");
+    .button(@body-bg-color, @color-critical, @color-critical-accentuated);
   }
 
   input[type="submit"].btn-cancel {
-    .button(~"var(--body-bg-color, @{body-bg-color})", ~"var(--gray, @{gray})", ~"var(--black, @{black})");
+    .button(@body-bg-color, @gray, @black);
   }
 
   button.noscript-apply {
-    .var(color, "gray");
-    .var(background-color, gray-lightest);
-    .var(border-color, "gray");
+    color: @gray;
+    background-color: @gray-lightest;
+    border-color: @gray;
     border-width: 1px;
   }
 
   button[type="button"] {
-    .var(background-color, low-sat-blue);
+    background-color: @low-sat-blue;
   }
 }
 
@@ -363,9 +363,9 @@ form.inline {
   top: 0;
 
   display: inline-block;
-  .var(background, low-sat-blue);
+  background: @low-sat-blue;
   border: 1px solid;
-  .var(border-color, low-sat-blue);
+  border-color: @low-sat-blue;
   box-sizing: content-box;
   border-radius: 1em;
   height: 4/3em;
@@ -378,10 +378,10 @@ form.inline {
   top: 0;
   left: 0;
 
-  .var(background, text-color-inverted);
+  background: @text-color-inverted;
   border-radius: 1em;
   border: 1px solid;
-  .var(border-color, low-sat-blue);
+  border-color: @low-sat-blue;
   box-sizing: border-box;
   content: "";
   display: block;
@@ -397,19 +397,18 @@ form.inline {
 }
 
 .icinga-controls input[type="checkbox"]:checked + .toggle-switch .toggle-slider {
-  .var(background-color, icinga-blue);
+  background-color: @icinga-blue;
   border: 1px solid;
-  .var(border-color, icinga-blue);
+  border-color: @icinga-blue;
 }
 
 .icinga-controls input[type="checkbox"]:focus + .toggle-switch .toggle-slider {
   box-shadow: 0 0 0 2px @body-bg-color, 0 0 0 4px @icinga-blue-light;
-  box-shadow: 0 0 0 2px var(--body-bg-color, @body-bg-color), 0 0 0 4px var(--icinga-blue-light, @icinga-blue-light);
 }
 
 .icinga-controls input[type="checkbox"]:checked + .toggle-switch .toggle-slider:before {
   border: 1px solid;
-  .var(border-color, icinga-blue);
+  border-color: @icinga-blue;
   left: 100%;
   margin-left: -4/3em;
 }
@@ -420,24 +419,24 @@ form.inline {
   cursor: default;
 
   & > .toggle-slider {
-    .var(background-color, gray-light);
-    .var(border-color, gray-light);
+    background-color: @gray-light;
+    border-color: @gray-light;
 
     &:before {
-      .var(background-color, gray-lighter);
-      .var(border-color, gray-light);
+      background-color: @gray-lighter;
+      border-color: @gray-light;
     }
   }
 }
 
 form.icinga-form .control-group.disabled .control-label-group {
-  .var(color, disabled-gray);
+  color: @disabled-gray;
 }
 
 .icinga-controls {
   input[disabled],
   select[disabled] {
-    .var(background-color, gray-lighter);
+    background-color: @gray-lighter;
     border-color: transparent;
   }
 }
@@ -475,20 +474,20 @@ form.icinga-form {
 
   .form-notifications {
     &.info {
-      .var(background-color, form-info-bg-color);
+      background-color: @form-info-bg-color;
     }
 
     &.error {
-      .var(background-color, form-error-bg-color);
+      background-color: @form-error-bg-color;
     }
 
     &.warning {
-      .var(background-color, form-warning-bg-color);
+      background-color: @form-warning-bg-color;
     }
   }
 
   .form-description {
-    .var(background-color, light-text-bg-color);
+    background-color: @light-text-bg-color;
   }
 
   .errors {
@@ -506,7 +505,7 @@ form.icinga-form {
 }
 
 form.icinga-form .form-info {
-  .var(color, text-color-light);
+  color: @text-color-light;
   font-size: @font-size-small;
   list-style: none;
   padding-left: 0;
@@ -516,13 +515,13 @@ form.icinga-form .form-info {
 
 .icinga-controls {
   input::placeholder {
-    .var(color, disabled-gray);
+    color: @disabled-gray;
     font-style: italic;
     opacity: 1;
   }
 
   input:-ms-input-placeholder {
-    .var(color, disabled-gray);
+    color: @disabled-gray;
     font-style: italic;
     opacity: 1;
   }
@@ -548,7 +547,7 @@ form.icinga-form .form-info {
   display: none;
 
   &:checked + img {
-    .var(border-color, icinga-blue);
+    border-color: @icinga-blue;
     border-radius: .25em;
   }
 
diff --git a/public/css/icinga/health.less b/public/css/icinga/health.less
index 5c9fe01e0..50cc11add 100644
--- a/public/css/icinga/health.less
+++ b/public/css/icinga/health.less
@@ -2,28 +2,28 @@
 
 .app-health {
   header {
-    .var(color, text-color-light);
+    color: @text-color-light;
 
     span {
-      .var(color, text-color);
+      color: @text-color;
     }
   }
 
   span {
     &.state-ok {
-      .var(background-color, color-ok);
+      background-color: @color-ok;
     }
 
     &.state-warning {
-      .var(background-color, color-warning);
+      background-color: @color-warning;
     }
 
     &.state-critical {
-      .var(background-color, color-critical);
+      background-color: @color-critical;
     }
 
     &.state-unknown {
-      .var(background-color, color-unknown);
+      background-color: @color-unknown;
     }
   }
 
@@ -37,12 +37,12 @@
 
   tr:not(:last-child) td {
     border: 0 solid;
-    .var(border-color, gray-light);
+    border-color: @gray-light;
     border-bottom-width: 1px;
   }
 
   section {
-    .var(color, text-color-light);
+    color: @text-color-light;
     font-family: @font-family-fixed;
   }
 }
diff --git a/public/css/icinga/layout.less b/public/css/icinga/layout.less
index ddafaa227..e6570c613 100644
--- a/public/css/icinga/layout.less
+++ b/public/css/icinga/layout.less
@@ -9,7 +9,7 @@
 }
 
 #guest-error {
-  .var(background-color, icinga-blue);
+  background-color: @icinga-blue;
   height: 100%;
   overflow: auto;
 }
@@ -20,7 +20,7 @@
 
 #guest-error-message {
   .fadein();
-  .var(color, body-bg-color);
+  color: @body-bg-color;
   font-size: 2em;
 }
 
@@ -32,7 +32,7 @@
 }
 
 #header-logo-container {
-  .var(background, menu-bg-color);
+  background: @menu-bg-color;
   height: 6em;
   padding: 1.25em;
   width: 16em;
@@ -81,8 +81,8 @@
 }
 
 #layout {
-  .var(background-color, body-bg-color);
-  .var(color, text-color);
+  background-color: @body-bg-color;
+  color: @text-color;
   font-family: @font-family;
 }
 
@@ -141,11 +141,11 @@
 
 // Mobile menu
 #layout.minimal-layout #sidebar {
-  .var(background-color, menu-bg-color);
+  background-color: @menu-bg-color;
 }
 
 #mobile-menu-toggle {
-  .var(color, menu-color);
+  color: @menu-color;
   text-align: right;
 
   > button {
@@ -213,12 +213,11 @@
 }
 
 #notifications > li {
-  .var(color, text-color);
+  color: @text-color;
   display: block;
   line-height: 2.5em;
-  border-left: .5em solid;
-  .var(border-left-color, gray-light);
-  .var(background, body-bg-color);
+  border-left: .5em solid @gray-light;
+  background: @body-bg-color;
   margin-bottom: 1px;
   box-shadow: 0 0 1em 0 rgba(0,0,0,0.25);
 
@@ -233,38 +232,38 @@
   }
 
   &.error {
-    .var(border-color, color-notification-error);
-    .var(background, color-notification-error);
-    .var(color, text-color-on-icinga-blue);
+    border-color: @color-notification-error;
+    background: @color-notification-error;
+    color: @text-color-on-icinga-blue;
 
     .icon {
-      .var(color, text-color-on-icinga-blue);
+      color: @text-color-on-icinga-blue;
     }
   }
 
   &.info {
-    .var(border-color, color-notification-info);
+    border-color: @color-notification-info;
 
     .icon {
-      .var(color, color-notification-info);
+      color: @color-notification-info;
     }
   }
 
   &.success {
-    .var(border-color, color-notification-success);
+    border-color: @color-notification-success;
 
     .icon {
-      .var(color, color-notification-success);
+      color: @color-notification-success;
     }
   }
 
   &.warning {
-    .var(border-color, color-notification-warning);
-    .var(background, color-notification-warning);
-    .var(color, text-color-inverted);
+    border-color: @color-notification-warning;
+    background: @color-notification-warning;
+    color: @text-color-inverted;
 
     .icon {
-      .var(color, text-color-inverted);
+      color: @text-color-inverted;
     }
   }
 }
@@ -342,10 +341,10 @@
   }
 
   #search:focus {
-    .var(background-color, menu-bg-color);
+    background-color: @menu-bg-color;
     border-radius: 0 .25em .25em 0;
     box-shadow: 0 0 .25em 0 rgba(0, 0, 0, .2);
-    .var(color, menu-color);
+    color: @menu-color;
     width: 20em;
     position: fixed;
     z-index: 1;
diff --git a/public/css/icinga/login.less b/public/css/icinga/login.less
index 9ed4c7bbf..b37dbd865 100644
--- a/public/css/icinga/login.less
+++ b/public/css/icinga/login.less
@@ -4,7 +4,7 @@
 
 #login {
   height: 100%;
-  .var(background-color, menu-bg-color);
+  background-color: @menu-bg-color;
   background-image: url(../img/icingaweb2-background-orbs.jpg);
   background-repeat:  no-repeat;
   background-size: cover;
@@ -18,8 +18,8 @@
     position: relative;
     z-index: 10;
     padding: 2em 6em;
-    .var(background-color, login-box-background);
-    .box-shadow(0, 0, 1em, 1em, ~"var(--login-box-background, @{login-box-background})");
+    background-color: @login-box-background;
+    .box-shadow(0, 0, 1em, 1em, @login-box-background);
   }
 
   #icinga-logo {
@@ -43,7 +43,7 @@
   }
 
   .errors {
-    .var(background-color, color-critical);
+    background-color: @color-critical;
     color: white;
   }
 
@@ -76,12 +76,12 @@
 
   input[type="submit"]:focus {
     outline: 3px solid;
-    .var(outline-color, icinga-blue-light);
+    outline-color: @icinga-blue-light;
   }
 
   input[type=submit] {
     border-radius: .25em;
-    .var(background, icinga-secondary);
+    background: @icinga-secondary;
     color: white;
     border: none;
     height: 2.5em;
@@ -89,19 +89,19 @@
     width: 100%;
 
     &:hover {
-      .var(background-color, icinga-secondary-dark);
+      background-color: @icinga-secondary-dark;
     }
   }
 
   .config-note {
-    .var(background-color, color-critical);
+    background-color: @color-critical;
     margin: 0 auto 2em auto; // Center horizontally w/ bottom margin
     max-width: 50%;
     min-width: 24em;
     padding: 1em;
 
     a {
-      .var(color, text-color-inverted);
+      color: @text-color-inverted;
       font-weight: bold;
     }
   }
diff --git a/public/css/icinga/main.less b/public/css/icinga/main.less
index 2173ab782..c6646151d 100644
--- a/public/css/icinga/main.less
+++ b/public/css/icinga/main.less
@@ -7,7 +7,7 @@
 @name-value-table-name-width: 38/3em;
 
 .action-link {
-  .var(color, icinga-blue);
+  color: @icinga-blue;
 }
 
 .error-message {
@@ -119,7 +119,7 @@
 }
 
 a:hover > .icon-cancel {
-  .var(color, color-critical);
+  color: @color-critical;
 }
 
 .icon-stateful {
@@ -132,12 +132,12 @@ a:hover > .icon-cancel {
   .action-link();
   .rounded-corners(3px);
 
-  .var(background, low-sat-blue);
+  background: @low-sat-blue;
   display: inline-block;
   padding: 0.25em 0.5em;
 
   &:hover {
-    .var(background, low-sat-blue-dark);
+    background: @low-sat-blue-dark;
     text-decoration: none;
   }
 }
@@ -148,12 +148,11 @@ a:hover > .icon-cancel {
   margin: 0;
 
   > dt {
-    border-bottom: 1px solid;
-    .var(border-bottom-color, gray-lighter);
+    border-bottom: 1px solid @gray-lighter;
     margin-bottom: 0.25em;
 
     &:hover {
-      .var(background-color, gray-lightest);
+      background-color: @gray-lightest;
 
       > .remove-action button:not(.spinner.active) {
         visibility: visible;
@@ -171,7 +170,7 @@ a:hover > .icon-cancel {
 }
 
 .comment-time {
-  .var(color, text-color-light);
+  color: @text-color-light;
   font-size: @font-size-small;
 }
 
@@ -182,7 +181,7 @@ a:hover > .icon-cancel {
   }
 
   > dt {
-    .var(color, text-color-light);
+    color: @text-color-light;
     font-size: @font-size-small;
   }
 }
@@ -206,13 +205,11 @@ a:hover > .icon-cancel {
   }
 
   thead {
-    border-bottom: 1px solid;
-    .var(border-bottom-color, gray-light);
+    border-bottom: 1px solid @gray-light;
   }
 
   tbody tr {
-    border-bottom: 1px solid;
-    .var(border-bottom-color, gray-lightest);
+    border-bottom: 1px solid @gray-lightest;
     border-left: 5px solid transparent;
 
     &:last-child {
@@ -221,12 +218,12 @@ a:hover > .icon-cancel {
   }
 
   tr[href].active {
-    .var(background-color, tr-active-color);
-    .var(border-left-color, icinga-blue);
+    background-color: @tr-active-color;
+    border-left-color: @icinga-blue;
   }
 
   tr[href]:hover {
-    .var(background-color, tr-hover-color);
+    background-color: @tr-hover-color;
     cursor: pointer;
   }
 }
@@ -242,7 +239,7 @@ a:hover > .icon-cancel {
 }
 
 .name-value-table > tbody > tr > th {
-  .var(color, text-color-light);
+  color: @text-color-light;
   // Reset default font-weight
   font-weight: normal;
   padding-left: 0;
@@ -320,15 +317,15 @@ a:hover > .icon-cancel {
     margin-top: -1em;
     margin-right: .25em;
 
-    .var(background, gray-lighter);
-    .var(color, "gray");
+    background: @gray-lighter;
+    color: @gray;
     border: none;
     -webkit-box-shadow: 0 0 1/3em rgba(0,0,0,.3);
     -moz-box-shadow: 0 0 1/3em rgba(0,0,0,.3);
     box-shadow: 0 0 1/3em rgba(0,0,0,.3);
 
     &:hover {
-      .var(background, gray-light);
+      background: @gray-light;
     }
   }
 
@@ -371,7 +368,6 @@ a:hover > .icon-cancel {
     display: block;
     height: 2em;
     background: linear-gradient(@body-bg-color-transparent, @body-bg-color);
-    background: linear-gradient(var(--body-bg-color-transparent, @body-bg-color-transparent), var(--body-bg-color, @body-bg-color));
     position: absolute;
     bottom: 0;
     left: 0;
@@ -403,8 +399,8 @@ a:hover > .icon-cancel {
 
 .module-dependencies {
   .unmet-dependencies {
-    .var(background-color, color-warning);
-    .var(color, text-color-on-icinga-blue);
+    background-color: @color-warning;
+    color: @text-color-on-icinga-blue;
     padding: .25em .5em;
     margin-left: -.5em;
   }
@@ -412,16 +408,16 @@ a:hover > .icon-cancel {
   .name-value-table {
     > caption {
       font-weight: normal;
-      .var(color, text-color-light);
+      color: @text-color-light;
     }
 
     > tbody > tr > th {
       font-weight: bold;
-      .var(color, text-color);
+      color: @text-color;
     }
 
     .missing {
-      .var(color, color-critical);
+      color: @color-critical;
       font-weight: bold;
     }
 
@@ -439,10 +435,8 @@ a:hover > .icon-cancel {
           height: 1.5em;
           width: 1.5em;
           left: 0.5em;
-          border-top: 3px solid;
-          border-right: 3px solid;
-          .var(border-top-color, "gray");
-          .var(border-right-color, "gray");
+          border-top: 3px solid @gray;
+          border-right: 3px solid @gray;
           border-top-right-radius: .50em;
           transform: rotate(45deg);
         }
diff --git a/public/css/icinga/menu.less b/public/css/icinga/menu.less
index a0adb92d4..6101c3806 100644
--- a/public/css/icinga/menu.less
+++ b/public/css/icinga/menu.less
@@ -10,7 +10,7 @@
 @icon-width: 1.7em; // 1.5em width + 0.2em right margin
 
 #menu {
-  .var(background-color, menu-bg-color);
+  background-color: @menu-bg-color;
   width: 100%;
   flex: 1;
   overflow: auto;
@@ -65,16 +65,16 @@
 
 #menu .nav-level-1 > .nav-item {
   line-height: 2.167em; // 26 px
-  .var(color, menu-color);
+  color: @menu-color;
 
   &.active {
-    .var(color, menu-active-color);
+    color: @menu-active-color;
 
     > a > .badge {
       display: none;
     }
 
-    .var(background-color, menu-active-bg-color);
+    background-color: @menu-active-bg-color;
   }
 
   &.no-icon > a {
@@ -87,12 +87,12 @@
 
   &.active:not(.selected) > a:focus,
   &.active:not(.selected) > a:hover {
-    .var(background-color, menu-active-hover-bg-color);
+    background-color: @menu-active-hover-bg-color;
   }
 
   &:not(.selected) > a:hover,
   &:not(.selected) > a:focus {
-    .var(background-color, menu-hover-bg-color);
+    background-color: @menu-hover-bg-color;
   }
 
   // Balance icon weight for non active menu items
@@ -109,11 +109,11 @@
 }
 
 #menu ul:not(.nav-level-2) > .selected > a {
-  .var(background-color, menu-highlight-color);
-  .var(color, text-color-inverted);
+  background-color: @menu-highlight-color;
+  color: @text-color-inverted;
 
   &:focus {
-    .var(background-color, menu-highlight-hover-bg-color);
+    background-color: @menu-highlight-hover-bg-color;
   }
 
   &:after {
@@ -122,7 +122,7 @@
     position: absolute;
     right: -.75em;
 
-    .var(background-color, body-bg-color);
+    background-color: @body-bg-color;
     box-shadow: 0 0 1em 0 rgba(0,0,0,0.6);
     content: "";
     display: block;
@@ -138,7 +138,7 @@
   line-height: 1.833em; // 22px
 
   > a {
-    .var(color, menu-2ndlvl-color);
+    color: @menu-2ndlvl-color;
     font-size: @font-size-small;
     padding: 0.364em 0.545em 0.364em 0.545em;
 
@@ -156,7 +156,7 @@
   &.active:after {
     .transform(rotate(45deg));
 
-    .var(background-color, body-bg-color);
+    background-color: @body-bg-color;
     box-shadow: 0 0 1em 0 rgba(0,0,0,.6);
     content: "";
     display: block;
@@ -169,14 +169,14 @@
   }
 
   &.active > a {
-    .var(color, menu-2ndlvl-active-color);
-    .var(background-color, menu-2ndlvl-active-bg-color);
+    color: @menu-2ndlvl-active-color;
+    background-color: @menu-2ndlvl-active-bg-color;
 
     &:focus {
       &:first-of-type,
       &:first-of-type ~ a {
-        .var(color, menu-2ndlvl-active-hover-color);
-        .var(background-color, menu-2ndlvl-active-hover-bg-color);
+        color: @menu-2ndlvl-active-hover-color;
+        background-color: @menu-2ndlvl-active-hover-bg-color;
       }
     }
   }
@@ -221,26 +221,26 @@
   background: transparent url('../img/icons/search_white.png') no-repeat 1em center;
   background-size: 1em auto;
   border: none;
-  .var(color, menu-color);
+  color: @menu-color;
   line-height: 2.167em;
   padding: .25em;
   padding-left: @icon-width + .75em;
   width: 100%;
 
   &:focus::placeholder {
-    .var(color, menu-color);
+    color: @menu-color;
   }
   &:focus::-ms-input-placeholder {
     color: @menu-color;
   }
 
   &.active {
-    .var(background-color, menu-active-bg-color);
+    background-color: @menu-active-bg-color;
   }
 
   &:hover,
   &:focus {
-    .var(background-color, menu-search-hover-bg-color);
+    background-color: @menu-search-hover-bg-color;
   }
 }
 
@@ -258,9 +258,9 @@
 #layout:not(.minimal-layout).sidebar-collapsed #menu .nav-level-1 > .nav-item.hover,
 #layout:not(.minimal-layout) #menu .nav-level-1 > .nav-item:not(.active).hover {
   > .nav-level-2 {
-    .var(background-color, menu-flyout-bg-color);
+    background-color: @menu-flyout-bg-color;
     border: 1px solid;
-    .var(border-color, gray-light);
+    border-color: @gray-light;
     border-radius: .25em;
     box-shadow: 0 0 1em 0 rgba(0,0,0,.3);
     padding: @vertical-padding 0;
@@ -271,11 +271,9 @@
     &:after {
       .transform(rotate(45deg));
 
-      .var(background-color, body-bg-color);
-      border-bottom: 1px solid;
-      .var(border-bottom-color, gray-light);
-      border-left: 1px solid;
-      .var(border-left-color, gray-light);
+      background-color: @body-bg-color;
+      border-bottom: 1px solid @gray-light;
+      border-left: 1px solid @gray-light;
       content: "";
       display: block;
       height: 1.1em;
@@ -291,7 +289,7 @@
       position: relative;
 
       > a {
-        .var(color, menu-flyout-color);
+        color: @menu-flyout-color;
 
         &:first-of-type {
           padding-left: 1.5em;
@@ -302,13 +300,13 @@
         a:hover, a:focus {
           &:first-of-type,
           &:first-of-type ~ a {
-            .var(background-color, menu-2ndlvl-highlight-bg-color);
+            background-color: @menu-2ndlvl-highlight-bg-color;
           }
         }
       }
 
       &.active > a {
-        .var(color, menu-color);
+        color: @menu-color;
       }
 
       // Hide activity caret when displayed as flyout
@@ -376,7 +374,7 @@
     li {
       display: block;
       a, button[type="submit"] {
-        .var(background-color, body-bg-color);
+        background-color: @body-bg-color;
         border: none;
         left: -999px;
         padding: @vertical-padding @horizontal-padding;
@@ -410,13 +408,13 @@
 }
 
 .search-input:focus ~ .search-reset:hover {
-  .var(background-color, menu-active-hover-bg-color);
+  background-color: @menu-active-hover-bg-color;
 }
 
 .search-reset {
   background: none;
   border: 0;
-  .var(color, menu-color);
+  color: @menu-color;
   cursor: pointer;
   display: none;
   height: 100%;
@@ -428,7 +426,7 @@
 
   &:focus,
   &:hover {
-    .var(background-color, menu-search-hover-bg-color);
+    background-color: @menu-search-hover-bg-color;
     outline: none;
   }
 }
@@ -441,19 +439,19 @@ input[type=text].search-input {
 }
 
 .search-input:focus:-moz-placeholder { // FF 18-
-  .var(color, gray-light);
+  color: @gray-light;
 }
 
 .search-input:focus::-moz-placeholder { // FF 19+
-  .var(color, gray-light);
+  color: @gray-light;
 }
 
 .search-input:focus:-ms-input-placeholder {
-  .var(color, gray-light);
+  color: @gray-light;
 }
 
 .search-input:focus::-webkit-input-placeholder {
-  .var(color, gray-light);
+  color: @gray-light;
 }
 
 .search-input ~ .search-reset {
@@ -480,14 +478,14 @@ input[type=text].search-input {
   background: none;
   border: none;
   padding: 0;
-  .var(color, text-color-light);
+  color: @text-color-light;
   position: absolute;
   bottom: 0.2em;
   right: 0;
   z-index: 3;
 
   i {
-    .var(background-color, body-bg-color);
+    background-color: @body-bg-color;
     border-radius: .25em 0 0 .25em;
     font-size: 1.125em;
     width: 2em;
@@ -499,7 +497,7 @@ input[type=text].search-input {
 
   &:hover, &:focus {
     i {
-      .var(color, menu-highlight-color);
+      color: @menu-highlight-color;
     }
   }
 }
@@ -526,7 +524,7 @@ html.no-js  #toggle-sidebar {
   &.nav-item:not(.badge-nav-item) {
     &:not(.selected):not(.active) a:hover,
     &:not(.selected):not(.active) a:focus {
-      .var(background-color, menu-2ndlvl-highlight-bg-color);
+      background-color: @menu-2ndlvl-highlight-bg-color;
     }
   }
 }
@@ -561,7 +559,7 @@ html.no-js  #toggle-sidebar {
     a:focus {
       &:first-of-type,
       &:first-of-type ~ a {
-        .var(background-color, menu-2ndlvl-highlight-bg-color);
+        background-color: @menu-2ndlvl-highlight-bg-color;
       }
     }
   }
diff --git a/public/css/icinga/mixins.less b/public/css/icinga/mixins.less
index 4268a49e8..5948a61d6 100644
--- a/public/css/icinga/mixins.less
+++ b/public/css/icinga/mixins.less
@@ -1,26 +1,20 @@
 /*! Icinga Web 2 | (c) 2015 Icinga Development Team | GPLv2+ */
 
 .box-shadow(@x: 0.2em; @y: 0.2em; @blur: 0.2em; @spread: 0; @color: rgba(83, 83, 83, 0.25)) {
-  -webkit-box-shadow: @x @y @blur @spread extract-variable-default(@color);
   -webkit-box-shadow: @arguments;
-     -moz-box-shadow: @x @y @blur @spread extract-variable-default(@color);
      -moz-box-shadow: @arguments;
-          box-shadow: @x @y @blur @spread extract-variable-default(@color);
           box-shadow: @arguments;
 }
 
 .button(
-  @background-color: ~"var(--body-bg-color, @{body-bg-color})",
-  @border-font-color: ~"var(--icinga-blue, @{icinga-blue})",
-  @color-dark: ~"var(--icinga-blue-dark, @{icinga-blue-dark})"
+  @background-color: @body-bg-color,
+  @border-font-color: @icinga-blue,
+  @color-dark: @icinga-blue-dark
 ) {
   .rounded-corners(3px);
 
-  background-color: extract-variable-default(@background-color);
   background-color: @background-color;
-  border: extract-variable-default(2px solid @border-font-color);
   border: 2px solid @border-font-color;
-  color: extract-variable-default(@border-font-color);
   color: @border-font-color;
   cursor: pointer;
   line-height: normal;
@@ -34,19 +28,14 @@
   &:focus,
   &:hover,
   &.btn-primary {
-    background-color: extract-variable-default(@border-font-color);
     background-color: @border-font-color;
-    color: extract-variable-default(@background-color);
     color: @background-color;
   }
 
   &.btn-primary:focus,
   &.btn-primary:hover {
-    background-color: extract-variable-default(@color-dark);
     background-color: @color-dark;
-    border-color: extract-variable-default(@color-dark);
     border-color: @color-dark;
-    color: extract-variable-default(@background-color);
     color: @background-color;
   }
 
@@ -153,90 +142,85 @@
 // Mixin for stateful foreground colors, e.g. text or icons
 .fg-stateful {
   &.state-ok {
-    .var(color, color-ok);
+    color: @color-ok;
   }
   &.state-up {
-    .var(color, color-up);
+    color: @color-up;
   }
   &.state-warning {
-    .var(color, color-warning);
+    color: @color-warning;
     &.handled {
-      .var(color, color-warning-handled);
+      color: @color-warning-handled;
     }
   }
   &.state-critical {
-    .var(color, color-critical);
+    color: @color-critical;
     &.handled {
-      .var(color, color-critical-handled);
+      color: @color-critical-handled;
     }
   }
   &.state-down {
-    .var(color, color-down);
+    color: @color-down;
     &.handled {
-      .var(color, color-down-handled);
+      color: @color-down-handled;
     }
   }
   &.state-unreachable {
-    .var(color, color-unreachable);
+    color: @color-unreachable;
     &.handled {
-      .var(color, color-unreachable-handled);
+      color: @color-unreachable-handled;
     }
   }
   &.state-unknown {
-    .var(color, color-unknown);
+    color: @color-unknown;
     &.handled {
-      .var(color, color-unknown-handled);
+      color: @color-unknown-handled;
     }
   }
   &.state-pending {
-    .var(color, color-pending);
+    color: @color-pending;
   }
 }
 
 // Mixin for stateful background colors
 .bg-stateful {
   &.state-ok {
-    .var(background-color, color-ok);
+    background-color: @color-ok;
   }
   &.state-up {
-    .var(background-color, color-up);
+    background-color: @color-up;
   }
   &.state-warning {
-    .var(background-color, color-warning);
+    background-color: @color-warning;
     &.handled {
-      .var(background-color, color-warning-handled);
+      background-color: @color-warning-handled;
     }
   }
   &.state-critical {
-    .var(background-color, color-critical);
+    background-color: @color-critical;
     &.handled {
-      .var(background-color, color-critical-handled);
+      background-color: @color-critical-handled;
     }
   }
   &.state-down {
-    .var(background-color, color-down);
+    background-color: @color-down;
     &.handled {
-      .var(background-color, color-down-handled);
+      background-color: @color-down-handled;
     }
   }
   &.state-unreachable {
-    .var(background-color, color-unreachable);
+    background-color: @color-unreachable;
     &.handled {
-      .var(background-color, color-unreachable-handled);
+      background-color: @color-unreachable-handled;
     }
   }
   &.state-unknown {
-    .var(background-color, color-unknown);
+    background-color: @color-unknown;
     &.handled {
-      .var(background-color, color-unknown-handled);
+      background-color: @color-unknown-handled;
     }
   }
   &.state-pending {
-    .var(background-color, color-pending);
+    background-color: @color-pending;
   }
 }
-
-.var(@property, @variable) {
-    @{property}: @@variable;
-    @{property}: var(~"--@{variable}", @@variable);
-}
diff --git a/public/css/icinga/modal.less b/public/css/icinga/modal.less
index a23bf26f6..3d497d642 100644
--- a/public/css/icinga/modal.less
+++ b/public/css/icinga/modal.less
@@ -64,10 +64,10 @@
     top: .75em;
     right: 1em;
 
-    .var(background-color, "gray");
+    background-color: @gray;
     border: none;
     border-radius: 50%;
-    .var(color, text-color-inverted);
+    color: @text-color-inverted;
     height: 1.5em;
     line-height: 1em;
     padding: 0;
@@ -102,7 +102,7 @@
   align-items: stretch;
   flex-direction: column;
 
-  .var(background-color, body-bg-color);
+  background-color: @body-bg-color;
   border-radius: .5em;
   box-shadow: 0 0 2em 0 rgba(0, 0, 0, .6);
   flex: 1;
diff --git a/public/css/icinga/responsive.less b/public/css/icinga/responsive.less
index 8ebf83882..6d1cae856 100644
--- a/public/css/icinga/responsive.less
+++ b/public/css/icinga/responsive.less
@@ -141,8 +141,7 @@
 // Columns
 
 #layout.twocols #col2 {
-  border-left: 1px solid;
-  .var(border-left-color, gray-lighter);
+  border-left: 1px solid @gray-lighter;
 }
 
 #layout.twocols.wide-layout #col2 {
@@ -160,8 +159,7 @@
 }
 
 #layout.twocols #col2 {
-  border-left: 1px solid;
-  .var(border-left-color, gray-lighter);
+  border-left: 1px solid @gray-lighter;
 
   &:empty {
     display: flex;
diff --git a/public/css/icinga/setup.less b/public/css/icinga/setup.less
index cf001220c..7e66d1bce 100644
--- a/public/css/icinga/setup.less
+++ b/public/css/icinga/setup.less
@@ -16,7 +16,7 @@
 .setup-header {
   width: 100%;
   height: 5.5em;
-  .var(background-color, icinga-blue);
+  background-color: @icinga-blue;
   text-align: center;
 
   img {
@@ -103,7 +103,7 @@
         }
 
         &.complete {
-          .var(background-color, color-ok);
+          background-color: @color-ok;
         }
 
         &.visited {
@@ -227,7 +227,7 @@ form#setup_requirements {
       padding: 0.4em;
 
       &.fulfilled {
-        .var(background-color, color-ok);
+        background-color: @color-ok;
       }
 
       &.not-available {
@@ -236,7 +236,7 @@ form#setup_requirements {
       }
 
       &.missing {
-        .var(background-color, color-critical);
+        background-color: @color-critical;
       }
     }
   }
@@ -313,11 +313,11 @@ form#setup_requirements {
     color: white;
 
     &.success {
-      .var(background-color, color-ok);
+      background-color: @color-ok;
     }
 
     &.failure {
-      .var(background-color, color-critical);
+      background-color: @color-critical;
     }
   }
 
@@ -370,16 +370,16 @@ form#setup_requirements {
     text-align: left;
     font-size: 0.9em;
     border: 1px solid;
-    .var(border-color, gray-light);
+    border-color: @gray-light;
 
     h3 {
       padding: 0.2em;
       margin: -1em -1em 1em;
       text-align: center;
-      .var(color, text-color);
-      .var(background-color, gray-lightest);
+      color: @text-color;
+      background-color: @gray-lightest;
       border: 1px solid;
-      .var(border-color, gray-light);
+      border-color: @gray-light;
     }
 
     img {
@@ -423,8 +423,8 @@ form#setup_requirements {
     margin: 1em;
     padding: 0.3em;
     border: 1px solid;
-    .var(border-color, gray-semilight);
-    .var(background-color, gray-lightest);
+    border-color: @gray-semilight;
+    background-color: @gray-lightest;
 
     .header {
       height: 2.5em;
diff --git a/public/css/icinga/tabs.less b/public/css/icinga/tabs.less
index d3869fbf1..f730d2ffa 100644
--- a/public/css/icinga/tabs.less
+++ b/public/css/icinga/tabs.less
@@ -3,7 +3,7 @@
 // Styles for tab navigation of containers
 
 .tabs {
-  .var(background-color, menu-bg-color);
+  background-color: @menu-bg-color;
   letter-spacing: -0.417em;
 }
 
@@ -27,18 +27,18 @@
   }
 
   > a {
-    .var(color, menu-color);
+    color: @menu-color;
 
     &:hover {
       text-decoration: none;
-      .var(background, tab-hover-bg-color);
+      background: @tab-hover-bg-color;
     }
   }
 
   &.active > a,
   > a:focus {
-    .var(background-color, body-bg-color);
-    .var(color, text-color);
+    background-color: @body-bg-color;
+    color: @text-color;
   }
 }
 
@@ -55,8 +55,8 @@
 .tabs > li > .close-container-control:hover,
 .tabs > li > .refresh-container-control:focus,
 .tabs > li > .refresh-container-control:hover {
-  .var(background-color, body-bg-color);
-  .var(color, text-color);
+  background-color: @body-bg-color;
+  color: @text-color;
   text-decoration: none;
 }
 
@@ -64,9 +64,9 @@
   .box-shadow();
   .rounded-corners(0 0 0.3em 0.3em);
 
-  .var(background-color, body-bg-color);
+  background-color: @body-bg-color;
   border: 1px solid;
-  .var(border-color, gray-light);
+  border-color: @gray-light;
   border-top: none;
   margin-left: -1px;
   min-width: 14em;
@@ -74,7 +74,7 @@
 }
 
 .tabs > .dropdown-nav-item > ul > li:hover > a {
-  .var(background-color, gray-lighter);
+  background-color: @gray-lighter;
   text-decoration: none;
 }
 
diff --git a/public/css/icinga/widgets.less b/public/css/icinga/widgets.less
index e539a5cb5..8015537eb 100644
--- a/public/css/icinga/widgets.less
+++ b/public/css/icinga/widgets.less
@@ -1,21 +1,20 @@
 /*! Icinga Web 2 | (c) 2014 Icinga Development Team | GPLv2+ */
 
 #announcements > ul {
-  .var(background-color, body-bg-color);
+  background-color: @body-bg-color;
   list-style: none;
   margin: 0;
   padding: 0;
 
   > li {
-    border-bottom: 1px solid;
-    .var(border-bottom-color, gray-lighter);
+    border-bottom: 1px solid @gray-lighter;
     line-height: 1.5em;
     padding: 0.5em 1em 0.5em 3em;
 
     position: relative;
 
     &:before {
-      .var(color, icinga-blue);
+      color: @icinga-blue;
       content: "\e811";
       font-family: 'ifont';
 
@@ -28,7 +27,7 @@
     }
 
     a {
-      .var(color, icinga-blue);
+      color: @icinga-blue;
     }
 
     .message {
@@ -60,13 +59,13 @@
   color: #fff;
 
   &:hover .icon-cancel {
-    .var(color, icinga-blue);
+    color: @icinga-blue;
   }
 }
 
 #application-state-summary > div {
-  .var(background-color, color-critical);
-  .var(color, text-color-on-icinga-blue);
+  background-color: @color-critical;
+  color: @text-color-on-icinga-blue;
   line-height: 1.5em;
   padding: 0.5em 1em 0.5em 3em;
   margin-left: 12em;
@@ -90,7 +89,7 @@
   }
 
   > form .icon-cancel:before {
-    .var(color, text-color-on-icinga-blue);
+    color: @text-color-on-icinga-blue;
   }
 }
 
@@ -115,7 +114,7 @@
        -moz-box-shadow: 0 0 0.5em 0 rgba(0, 0, 0, 0.2);
             box-shadow: 0 0 0.5em 0 rgba(0, 0, 0, 0.2);
 
-    .var(background-color, tr-hover-color);
+    background-color: @tr-hover-color;
     text-decoration: none;
   }
 }
@@ -134,7 +133,7 @@
 }
 
 .link-description {
-  .var(color, text-color-light);
+  color: @text-color-light;
 }
 
 .link-icon {
@@ -218,17 +217,17 @@ table.multiselect tr[href] td {
     }
 
     ul.tree li.active {
-      .var(background-color, gray-lightest);
+      background-color: @gray-lightest;
     }
 
     button {
       padding: .5em;
       border: none;
       background: none;
-      .var(color, text-color);
+      color: @text-color;
 
       &:hover, &:focus {
-        .var(color, icinga-blue);
+        color: @icinga-blue;
       }
     }
 
@@ -249,7 +248,7 @@ form.role-form {
   }
 
   .control-label-group em {
-    .var(color, text-color-light);
+    color: @text-color-light;
     font-style: normal;
   }
 
@@ -265,15 +264,15 @@ form.role-form {
 
     .privilege-preview .icon {
       &.granted {
-        .var(color, color-granted);
+        color: @color-granted;
       }
 
       &.refused {
-        .var(color, color-refused);
+        color: @color-refused;
       }
 
       &.restricted {
-        .var(color, color-restricted);
+        color: @color-restricted;
       }
     }
   }
@@ -286,7 +285,7 @@ form.role-form {
     h3 em {
       font-size: .857em;
       font-weight: normal;
-      .var(color, text-color-light);
+      color: @text-color-light;
     }
 
     h4 {
@@ -303,18 +302,17 @@ form.role-form {
         text-align: center;
 
         &.icon-ok {
-          .var(color, color-granted);
+          color: @color-granted;
         }
 
         &.icon-cancel {
-          .var(color, color-refused);
+          color: @color-refused;
         }
       }
     }
 
     .collapsible-control {
-      border-bottom: 1px solid;
-      .var(border-bottom-color, gray-light);
+      border-bottom: 1px solid @gray-light;
       cursor: pointer;
       -webkit-touch-callout: none;
       -webkit-user-select: none;
@@ -390,7 +388,7 @@ ul.tree li::before, ul.tree li::after {
   position: absolute;
   right: auto;
   left: -0.2em;
-  .var(border-color, gray-light);
+  border-color: @gray-light;
   border-style: dotted;
   border-width: 0;
 }
@@ -432,22 +430,22 @@ ul.tree li a {
   line-height: 2em;
   padding: 0 .5em;
   text-decoration: none;
-  .var(color, "gray");
+  color: @gray;
   background-repeat: no-repeat;
   background-position: 0.8em 0.4em;
 }
 
 ul.tree li a.error {
-  .var(color, color-critical-handled);
+  color: @color-critical-handled;
 }
 
 ul.tree li a:hover {
-  .var(color, text-color);
+  color: @text-color;
   text-decoration: underline;
 }
 
 ul.tree li a.error:hover {
-  .var(color, color-critical);
+  color: @color-critical;
 }
 
 /* charts should grow as much as possible but never beyond the current viewport's size */
@@ -486,9 +484,9 @@ ul.tree li a.error:hover {
   position: relative;
 
   .flyover-content {
-    .var(background-color, body-bg-color);
+    background-color: @body-bg-color;
     border: 1px solid;
-    .var(border-color, gray-lighter);
+    border-color: @gray-lighter;
     box-shadow: 0 0 .5em 0 rgba(0, 0, 0, 0.2);
     position: absolute;
     padding: @vertical-padding @horizontal-padding;
@@ -496,11 +494,9 @@ ul.tree li a.error:hover {
   }
 
   &.flyover-arrow-top .flyover-content:before {
-    .var(background, body-bg-color);
-    border-left: 1px solid;
-    .var(border-left-color, gray-lighter);
-    border-top: 1px solid;
-    .var(border-top-color, gray-lighter);
+    background: @body-bg-color;
+    border-left: 1px solid @gray-lighter;
+    border-top: 1px solid @gray-lighter;
     content: "";
     height: 1em;
     -ms-transform: rotate(45deg);
@@ -524,58 +520,58 @@ ul.tree li a.error:hover {
 }
 
 .slice-state-ok {
-  .var(stroke, color-ok);
-  .var(background, color-ok);
+  stroke: @color-ok;
+  background: @color-ok;
 }
 
 .slice-state-warning-handled {
-  .var(stroke, color-warning-handled);
-  .var(background, color-warning-handled);
+  stroke: @color-warning-handled;
+  background: @color-warning-handled;
 }
 
 .slice-state-warning {
-  .var(stroke, color-warning);
-  .var(background, color-unreachable-handled);
+  stroke: @color-warning;
+  background: @color-unreachable-handled;
 }
 
 .slice-state-critical-handled {
-  .var(stroke, color-critical-handled);
-  .var(background, color-critical-handled);
+  stroke: @color-critical-handled;
+  background: @color-critical-handled;
 }
 
 .slice-state-critical {
-  .var(stroke, color-critical);
-  .var(background, color-critical);
+  stroke: @color-critical;
+  background: @color-critical;
 }
 
 .slice-state-unknown-handled {
-  .var(stroke, color-unknown-handled);
-  .var(background, color-unknown-handled);
+  stroke: @color-unknown-handled;
+  background: @color-unknown-handled;
 }
 
 .slice-state-unknown {
-  .var(stroke, color-unknown);
-  .var(background, color-unknown);
+  stroke: @color-unknown;
+  background: @color-unknown;
 }
 
 .slice-state-unreachable-handled {
-  .var(stroke, color-unreachable-handled);
-  .var(background, color-unreachable-handled);
+  stroke: @color-unreachable-handled;
+  background: @color-unreachable-handled;
 }
 
 .slice-state-unreachable {
-  .var(stroke, color-unreachable);
-  .var(background, color-unreachable);
+  stroke: @color-unreachable;
+  background: @color-unreachable;
 }
 
 .slice-state-pending {
-  .var(stroke, color-pending);
-  .var(background, color-pending);
+  stroke: @color-pending;
+  background: @color-pending;
 }
 
 .slice-state-not-checked {
-  .var(stroke, gray-light);
-  .var(background, gray-light);
+  stroke: @gray-light;
+  background: @gray-light;
 }
 
 .donut {
@@ -592,7 +588,7 @@ ul.tree li a.error:hover {
 
 .donut-label {
   font-weight: bold;
-  .var(fill, text-color);
+  fill: @text-color;
 }
 
 .donut-label {
@@ -601,7 +597,7 @@ ul.tree li a.error:hover {
 }
 
 .donut-label-big {
-  .var(color, gray-light);
+  color: @gray-light;
   .fg-stateful();
   font-size: 6em;
   line-height: 0;
@@ -612,7 +608,7 @@ ul.tree li a.error:hover {
 }
 
 .donut-label-small {
-  .var(fill, text-color);
+  fill: @text-color;
   font-size: 1.2em;
   text-anchor: middle;
   -moz-transform: translateY(0.35em);