Style linting fixes.

assets/sass/_variables.scss

@@ -1,4 +1,5 @@
-// stylelint-disable value-keyword-case, scss/dollar-variable-colon-space-after, max-line-length
+// stylelint-disable max-line-length, number-leading-zero, number-no-trailing-zeros
+// stylelint-disable scss/dollar-variable-colon-space-after, value-keyword-case
 
 // Variables
 
@@ -22,6 +23,7 @@ $print-font-size:     12pt;
 
 // The font sizes in our type hierarchy as tee shirt sizes.
 // Size m is base.
+// Use like this: var(--fs-m)
 $font-size-fixed: (
   xxxxl:      2.778rem,
   xxxl:       2.335rem,
@@ -35,6 +37,7 @@ $font-size-fixed: (
 
 // The responsive font sizes in our type hierarchy as tee shirt sizes.
 // Size m is base.
+// Use like this: var(--fs-m)
 $font-size-fluid: (
   xxxxl:      clamp(1.80rem, calc(1.45rem + 1.73vw), 2.80rem),
   xxxl:       clamp(1.60rem, calc(1.35rem + 1.27vw), 2.33rem),
@@ -48,9 +51,10 @@ $font-size-fluid: (
 
 // Set the font sizes to use, fixed or fluid.
 $font-size: $font-size-fixed;
-//$font-size: $font-size-fluid;
+// $font-size: $font-size-fluid;
 
 // Font weights.
+// Use like this: var(--fw-normal)
 $font-weight: (
   bolder:     900,
   bold:       700,
@@ -88,6 +92,8 @@ $system-ui:       system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Rob
 // http://meyerweb.com/eric/thoughts/2010/02/12/fixed-monospace-sizing/
 $menlo:           Menlo, 'Ubuntu Mono', 'DejaVu Sans Mono', 'Courier New', Courier, monospace, sans-serif;
 
+// Font family.
+// Use like this: var(--ff-body)
 $font-family: (
   body:       $garamond,
   headings:   $futura,
@@ -96,7 +102,7 @@ $font-family: (
 );
 
 // Breakpoints
-// Use the `respond-to()` mixin to use named breakpoints.
+// Use the `respond-to(s)` mixin to use named breakpoints.
 $breakpoints: (
   'xxxl':     1222px,
   'xxl':      1111px,
@@ -110,6 +116,7 @@ $breakpoints: (
 );
 
 // Border radius.
+// Use like this: var(--radius-m)
 $border-radius: (
   l:          1rem,
   m:          0.3rem,
@@ -117,6 +124,7 @@ $border-radius: (
 );
 
 // Spacing.
+// Use like this: var(--space-m)
 $spacing: (
   xxxl:       5rem,
   xxl:        3rem,
@@ -135,7 +143,7 @@ $max-content-width:   1111px;
 // The max page width. Defaults to max-content-width.
 // Setting this to a larger value than max-content-width allows
 // content with class "stetch" to strech out to the page edge.
-//$max-page-width:      1111px;
+// $max-page-width:      1111px;
 
 // The max line width for readability.
 $max-line-width:      70ch;

assets/sass/components/flex-group/_flex-group.scss

@@ -1,6 +1,7 @@
 .flex-group,
 %flex-group {
   $gap: 1;
+
   @include gap($gap);
   display: flex;
   flex-wrap: wrap;

assets/sass/components/grid-group/_grid-group.scss

@@ -1,7 +1,9 @@
 .grid-group,
 %grid-group {
-  --column-min: 250px;
   $gap: 1;
+
+  --column-min: 250px;
+
   @include gap($gap);
   display: grid;
   grid-template-columns: repeat(auto-fill, minmax(var(--column-min), 1fr));

assets/sass/components/visually-hidden/_visually-hidden.scss

@@ -4,7 +4,7 @@
 
 .visually-hidden,
 %visually-hidden {
-  &:not(:focus):not(:active) {
+  &:not(:focus, :active) {
     position: absolute;
     clip: rect(0 0 0 0);
     clip-path: inset(50%);

assets/sass/mixins/breakpoint/_respond-to.scss

@@ -5,8 +5,7 @@
     @media (min-width: map-get($breakpoints, $breakpoint)) {
       @content;
     }
-  }
+  } @else {
-  @else {
     @media (min-width: $breakpoint) {
       @content;
     }

assets/sass/mixins/spacing/_spacing.scss

@@ -16,21 +16,27 @@
 @mixin margin($x) {
   @include spacing(margin, $x);
 }
+
 @mixin margin-inline($x) {
   @include spacing(margin-inline, $x);
 }
+
 @mixin margin-block($x) {
   @include spacing(margin-block, $x);
 }
+
 @mixin margin-top($x) {
   @include spacing(margin-top, $x);
 }
+
 @mixin margin-bottom($x) {
   @include spacing(margin-bottom, $x);
 }
+
 @mixin margin-left($x) {
   @include spacing(margin-left, $x);
 }
+
 @mixin margin-right($x) {
   @include spacing(margin-right, $x);
 }
@@ -38,21 +44,27 @@
 @mixin padding($x) {
   @include spacing(padding, $x);
 }
+
 @mixin padding-inline($x) {
   @include spacing(padding-inline, $x);
 }
+
 @mixin padding-block($x) {
   @include spacing(padding-block, $x);
 }
+
 @mixin padding-top($x) {
   @include spacing(padding-top, $x);
 }
+
 @mixin padding-bottom($x) {
   @include spacing(padding-bottom, $x);
 }
+
 @mixin padding-left($x) {
   @include spacing(padding-left, $x);
 }
+
 @mixin padding-right($x) {
   @include spacing(padding-right, $x);
 }

assets/sass/mobile.scss

@@ -1,4 +1,3 @@
-// @file
 // The mobile navigation stylesheet for this theme.
 
 @import 'init';

assets/sass/print.scss

@@ -1,4 +1,5 @@
-// @file
+// stylelint-disable color-named
+
 // The print stylesheet for this theme.
 
 @import 'init';