title: What does 'default' keyword mean with css variables?
body: <p>I've come across following syntax:</p>
  <pre><code>border-color: var(--disabled) default;
  </code></pre>
  <p>which is not correctly interpreted by my css minifier (it believes it is alternating colors - top-bottom &amp; left-right).</p>
  <p>Unfortunately, I cannot find any documentation on the css feature.
  Can anyone point me to the feature name / documentation?</p>
  <p>See it in action (I tested it on Chrome):</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>:root {
      --disabled: #0000DD;
  }
  
  .status-parent {
      color: red;
  }
  
  .status {
      border-width: 5px;
      border-style: solid;
      border-color: var(--disabled) default;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;p class="status-parent"&gt;
      &lt;span class="status"&gt;I have red border&lt;/span&gt;
  &lt;/p&gt;</code></pre>
  </div>
  </div>
  </p>