diff --git a/README.md b/README.md
index d10f912..00f5399 100644
--- a/README.md
+++ b/README.md
@@ -211,38 +211,38 @@ Three things changed shape and are worth knowing if you already set variables:
| Variable | Default (light / dark) | |
|---|---|---|
-| `$skinMainFirstColor` | `#23282f` | |
-| `$skinMainSecondColor` | `#5ea3d3` | |
+| `$skinMainFirstColor` |  `#23282f` | |
+| `$skinMainSecondColor` |  `#5ea3d3` | |
| `$skinBorderRadius` | `4px` | |
-| `$skinBorderWindowColor` | `#e6e9ee` | |
+| `$skinBorderWindowColor` |  `#e6e9ee` | |
| `$skinTablePadding` | `10px` | |
#### Surfaces, text and borders
| Variable | Default (light / dark) | |
|---|---|---|
-| `$skinPageBgColor` / `$skinPageBgColorDark` | `#f7f9fb` / `#161a1e` | page background |
-| `$skinSurfaceColor` / `$skinSurfaceColorDark` | `#ffffff` / `#25292f` | panels / cards / content |
-| `$skinSurface2Color` / `$skinSurface2ColorDark` | `#f0f2f5` / `#2c3137` | table headers / striping / subtle fills |
-| `$skinSurfaceHoverColor` / `$skinSurfaceHoverColorDark` | `#f5f7fa` / `#3f454d` | row / item hover |
-| `$skinSelectedRowColor` / `$skinSelectedRowColorDark` | `#d9e4ec` / `#304457` | checked table row |
-| `$skinElevatedColor` / `$skinElevatedColorDark` | `$skinSurfaceColor` / `#363c43` | tool buttons and dropdown panels floating above the page |
-| `$skinTextColor` / `$skinTextColorDark` | `#323537` / `#dde2e8` | body text |
-| `$skinTextMutedColor` / `$skinTextMutedColorDark` | `#6b7177` / `#b0b8c2` | secondary text / axis labels |
-| `$skinBorderColor` / `$skinBorderColorDark` | `#e0e4e9` / `#404750` | borders / grid lines |
-| `$skinInputBgColor` / `$skinInputBgColorDark` | `#ffffff` / `#1e2227` | form control background |
-| `$skinInputBorderColor` / `$skinInputBorderColorDark` | `#c9ced4` / `#4d555f` | form control border |
+| `$skinPageBgColor` / `$skinPageBgColorDark` |  `#f7f9fb` /  `#161a1e` | page background |
+| `$skinSurfaceColor` / `$skinSurfaceColorDark` |  `#ffffff` /  `#25292f` | panels / cards / content |
+| `$skinSurface2Color` / `$skinSurface2ColorDark` |  `#f0f2f5` /  `#2c3137` | table headers / striping / subtle fills |
+| `$skinSurfaceHoverColor` / `$skinSurfaceHoverColorDark` |  `#f5f7fa` /  `#3f454d` | row / item hover |
+| `$skinSelectedRowColor` / `$skinSelectedRowColorDark` |  `#d9e4ec` /  `#304457` | checked table row |
+| `$skinElevatedColor` / `$skinElevatedColorDark` | `$skinSurfaceColor` /  `#363c43` | tool buttons and dropdown panels floating above the page |
+| `$skinTextColor` / `$skinTextColorDark` |  `#323537` /  `#dde2e8` | body text |
+| `$skinTextMutedColor` / `$skinTextMutedColorDark` |  `#6b7177` /  `#b0b8c2` | secondary text / axis labels |
+| `$skinBorderColor` / `$skinBorderColorDark` |  `#e0e4e9` /  `#404750` | borders / grid lines |
+| `$skinInputBgColor` / `$skinInputBgColorDark` |  `#ffffff` /  `#1e2227` | form control background |
+| `$skinInputBorderColor` / `$skinInputBorderColorDark` |  `#c9ced4` /  `#4d555f` | form control border |
#### Header menu
| Variable | Default (light / dark) | |
|---|---|---|
-| `$skinMenuPillColor` | `#2e3236` | top-level current/hover pill |
-| `$skinMenuPillTextColor` | `#6cb0de` | text on that pill; follows the dropdown text so a |
-| `$skinMenuPanelColor` | `#2e3236` | dropdown panel bg + hover "bridge" border |
-| `$skinMenuTextColor` | `#dfe2e6` | dropdown item text (was: inherited #fff) |
-| `$skinMenuItemHoverColor` | `#3f454c` | dropdown item hover/current bg (was: none) |
-| `$skinMenuItemHoverTextColor` | `#6cb0de` | hover/current dropdown item text, same reason |
+| `$skinMenuPillColor` |  `#2e3236` | top-level current/hover pill |
+| `$skinMenuPillTextColor` |  `#6cb0de` | text on that pill; follows the dropdown text so a |
+| `$skinMenuPanelColor` |  `#2e3236` | dropdown panel bg + hover "bridge" border |
+| `$skinMenuTextColor` |  `#dfe2e6` | dropdown item text (was: inherited #fff) |
+| `$skinMenuItemHoverColor` |  `#3f454c` | dropdown item hover/current bg (was: none) |
+| `$skinMenuItemHoverTextColor` |  `#6cb0de` | hover/current dropdown item text, same reason |
| `$skinMenuFontSize` | `13px` | header menu text size |
| `$skinMenuItemPaddingY` | `5px` | dropdown item top/bottom padding (was 6px/4px + a 7px border) |
| `$skinMenuItemLineHeight` | `1.35` | dropdown item line-height |
@@ -256,7 +256,7 @@ Three things changed shape and are worth knowing if you already set variables:
| Variable | Default (light / dark) | |
|---|---|---|
-| `$skinTitleBarColor` | `#343c46` | |
+| `$skinTitleBarColor` |  `#343c46` | |
| `$skinTitleBarBorderColor` | `$skinMainSecondColor` | |
| `$skinTitleBarBorderWidth` | `0` | |
| `$skinTitleBarButtonPaddingY` | `6px` | action button vertical padding |
@@ -269,17 +269,17 @@ Three things changed shape and are worth knowing if you already set variables:
| `$skinPanelHeaderColor` / `$skinPanelHeaderColorDark` | `var(--aa-page-bg)` / `var(--aa-page-bg)` | |
| `$skinPanelHeaderTextColor` / `$skinPanelHeaderTextColorDark` | `var(--aa-inactive-tab-text)` / `var(--aa-inactive-tab-text)` | |
| `$skinPanelHeaderPaddingY` | `5px` | panel + sidebar header height |
-| `$skinLabelColor` / `$skinLabelColorDark` | `#8494a8` / `$skinTextColorDark` | |
-| `$skinTabInactiveColor` / `$skinTabInactiveColorDark` | `#f7f9fb` / `#161a1e` | inactive tab fill |
-| `$skinActiveTabTextColor` / `$skinActiveTabTextColorDark` | `$skinMainSecondColor` / `#7cc0ec` | selected tab label |
-| `$skinInactiveTabTextColor` / `$skinInactiveTabTextColorDark` | `#5e6469` / `#b0b8c2` | inactive tab label |
+| `$skinLabelColor` / `$skinLabelColorDark` |  `#8494a8` / `$skinTextColorDark` | |
+| `$skinTabInactiveColor` / `$skinTabInactiveColorDark` |  `#f7f9fb` /  `#161a1e` | inactive tab fill |
+| `$skinActiveTabTextColor` / `$skinActiveTabTextColorDark` | `$skinMainSecondColor` /  `#7cc0ec` | selected tab label |
+| `$skinInactiveTabTextColor` / `$skinInactiveTabTextColorDark` |  `#5e6469` /  `#b0b8c2` | inactive tab label |
| `$skinTableHeaderTextColor` / `$skinTableHeaderTextColorDark` | `$skinTextColor` / `$skinTextColorDark` | index-table column header text; the body text colour, so headings read as strongly as the rows |
-| `$skinStatusTagTextColor` | `#ffffff` | label inside a filled status tag; `empty` / `unknown` / `none` have no fill and keep `$skinTextMutedColor` |
-| `$skinStatusTagNeutralColor` | `#707681` | unclassified tags: `No`, protocol tags |
-| `$skinStatusTagOkColor` | `#5e7e63` | `ok` `published` `complete` `completed` `green` `yes` |
-| `$skinStatusTagNoticeColor` | `#3874d2` | `notice` `blue` |
-| `$skinStatusTagWarnColor` | `#9e6c15` | `warn` `warning` `orange` |
-| `$skinStatusTagErrorColor` | `#ce483b` | `error` `errored` `red` |
+| `$skinStatusTagTextColor` |  `#ffffff` | label inside a filled status tag; `empty` / `unknown` / `none` have no fill and keep `$skinTextMutedColor` |
+| `$skinStatusTagNeutralColor` |  `#707681` | unclassified tags: `No`, protocol tags |
+| `$skinStatusTagOkColor` |  `#5e7e63` | `ok` `published` `complete` `completed` `green` `yes` |
+| `$skinStatusTagNoticeColor` |  `#3874d2` | `notice` `blue` |
+| `$skinStatusTagWarnColor` |  `#9e6c15` | `warn` `warning` `orange` |
+| `$skinStatusTagErrorColor` |  `#ce483b` | `error` `errored` `red` |
| `$skinTabPaddingY` | `8px` | tab height |
| `$skinTabPaddingX` | `15px` | tab label horizontal padding (text → border) |
@@ -288,7 +288,7 @@ Three things changed shape and are worth knowing if you already set variables:
| Variable | Default (light / dark) | |
|---|---|---|
| `$skinButtonColor` / `$skinButtonColorDark` | `darken($skinMainSecondColor, 20%)` / `$skinButtonColor` | one tone in both modes; white on it is 5.35:1 |
-| `$skinButtonTextColor` / `$skinButtonTextColorDark` | `#ffffff` / `$skinButtonTextColor` | label on those buttons |
+| `$skinButtonTextColor` / `$skinButtonTextColorDark` |  `#ffffff` / `$skinButtonTextColor` | label on those buttons |
| `$skinTableToolsHeight` | `30px` | |
| `$skinTableToolsPaddingX` | `$skinTableToolsHeight * 0.4` | 12px at 30px |
@@ -297,8 +297,8 @@ Three things changed shape and are worth knowing if you already set variables:
| Variable | Default (light / dark) | |
|---|---|---|
| `$skinAccentColor` / `$skinAccentColorDark` | `$skinMainSecondColor` / `$skinAccentColor` | focus ring / accent outline |
-| `$skinLinkColor` / `$skinLinkColorDark` | `#38678b` / `#7cc0ec` | |
-| `$skinDeleteLinkColor` / `$skinDeleteLinkColorDark` | `$skinLinkColor` / `#f49b9b` | |
+| `$skinLinkColor` / `$skinLinkColorDark` |  `#38678b` /  `#7cc0ec` | |
+| `$skinDeleteLinkColor` / `$skinDeleteLinkColorDark` | `$skinLinkColor` /  `#f49b9b` | |
## Screen
diff --git a/docs/swatches/161a1e.svg b/docs/swatches/161a1e.svg
new file mode 100644
index 0000000..e62500f
--- /dev/null
+++ b/docs/swatches/161a1e.svg
@@ -0,0 +1 @@
+
diff --git a/docs/swatches/1e2227.svg b/docs/swatches/1e2227.svg
new file mode 100644
index 0000000..3a7ea3f
--- /dev/null
+++ b/docs/swatches/1e2227.svg
@@ -0,0 +1 @@
+
diff --git a/docs/swatches/23282f.svg b/docs/swatches/23282f.svg
new file mode 100644
index 0000000..c78e439
--- /dev/null
+++ b/docs/swatches/23282f.svg
@@ -0,0 +1 @@
+
diff --git a/docs/swatches/25292f.svg b/docs/swatches/25292f.svg
new file mode 100644
index 0000000..f486957
--- /dev/null
+++ b/docs/swatches/25292f.svg
@@ -0,0 +1 @@
+
diff --git a/docs/swatches/2c3137.svg b/docs/swatches/2c3137.svg
new file mode 100644
index 0000000..c75c002
--- /dev/null
+++ b/docs/swatches/2c3137.svg
@@ -0,0 +1 @@
+
diff --git a/docs/swatches/2e3236.svg b/docs/swatches/2e3236.svg
new file mode 100644
index 0000000..dfe97a8
--- /dev/null
+++ b/docs/swatches/2e3236.svg
@@ -0,0 +1 @@
+
diff --git a/docs/swatches/304457.svg b/docs/swatches/304457.svg
new file mode 100644
index 0000000..a664cb0
--- /dev/null
+++ b/docs/swatches/304457.svg
@@ -0,0 +1 @@
+
diff --git a/docs/swatches/323537.svg b/docs/swatches/323537.svg
new file mode 100644
index 0000000..e60b955
--- /dev/null
+++ b/docs/swatches/323537.svg
@@ -0,0 +1 @@
+
diff --git a/docs/swatches/343c46.svg b/docs/swatches/343c46.svg
new file mode 100644
index 0000000..bec61d9
--- /dev/null
+++ b/docs/swatches/343c46.svg
@@ -0,0 +1 @@
+
diff --git a/docs/swatches/363c43.svg b/docs/swatches/363c43.svg
new file mode 100644
index 0000000..8f40008
--- /dev/null
+++ b/docs/swatches/363c43.svg
@@ -0,0 +1 @@
+
diff --git a/docs/swatches/38678b.svg b/docs/swatches/38678b.svg
new file mode 100644
index 0000000..4ce5e96
--- /dev/null
+++ b/docs/swatches/38678b.svg
@@ -0,0 +1 @@
+
diff --git a/docs/swatches/3874d2.svg b/docs/swatches/3874d2.svg
new file mode 100644
index 0000000..ac2c9e8
--- /dev/null
+++ b/docs/swatches/3874d2.svg
@@ -0,0 +1 @@
+
diff --git a/docs/swatches/3f454c.svg b/docs/swatches/3f454c.svg
new file mode 100644
index 0000000..42af0f7
--- /dev/null
+++ b/docs/swatches/3f454c.svg
@@ -0,0 +1 @@
+
diff --git a/docs/swatches/3f454d.svg b/docs/swatches/3f454d.svg
new file mode 100644
index 0000000..1cee829
--- /dev/null
+++ b/docs/swatches/3f454d.svg
@@ -0,0 +1 @@
+
diff --git a/docs/swatches/404750.svg b/docs/swatches/404750.svg
new file mode 100644
index 0000000..d78c43d
--- /dev/null
+++ b/docs/swatches/404750.svg
@@ -0,0 +1 @@
+
diff --git a/docs/swatches/4d555f.svg b/docs/swatches/4d555f.svg
new file mode 100644
index 0000000..d176c9b
--- /dev/null
+++ b/docs/swatches/4d555f.svg
@@ -0,0 +1 @@
+
diff --git a/docs/swatches/5e6469.svg b/docs/swatches/5e6469.svg
new file mode 100644
index 0000000..07f06db
--- /dev/null
+++ b/docs/swatches/5e6469.svg
@@ -0,0 +1 @@
+
diff --git a/docs/swatches/5e7e63.svg b/docs/swatches/5e7e63.svg
new file mode 100644
index 0000000..2773685
--- /dev/null
+++ b/docs/swatches/5e7e63.svg
@@ -0,0 +1 @@
+
diff --git a/docs/swatches/5ea3d3.svg b/docs/swatches/5ea3d3.svg
new file mode 100644
index 0000000..ed96940
--- /dev/null
+++ b/docs/swatches/5ea3d3.svg
@@ -0,0 +1 @@
+
diff --git a/docs/swatches/6b7177.svg b/docs/swatches/6b7177.svg
new file mode 100644
index 0000000..4cdb271
--- /dev/null
+++ b/docs/swatches/6b7177.svg
@@ -0,0 +1 @@
+
diff --git a/docs/swatches/6cb0de.svg b/docs/swatches/6cb0de.svg
new file mode 100644
index 0000000..ade7b54
--- /dev/null
+++ b/docs/swatches/6cb0de.svg
@@ -0,0 +1 @@
+
diff --git a/docs/swatches/707681.svg b/docs/swatches/707681.svg
new file mode 100644
index 0000000..04a2407
--- /dev/null
+++ b/docs/swatches/707681.svg
@@ -0,0 +1 @@
+
diff --git a/docs/swatches/7cc0ec.svg b/docs/swatches/7cc0ec.svg
new file mode 100644
index 0000000..cde65f3
--- /dev/null
+++ b/docs/swatches/7cc0ec.svg
@@ -0,0 +1 @@
+
diff --git a/docs/swatches/8494a8.svg b/docs/swatches/8494a8.svg
new file mode 100644
index 0000000..4a241a1
--- /dev/null
+++ b/docs/swatches/8494a8.svg
@@ -0,0 +1 @@
+
diff --git a/docs/swatches/9e6c15.svg b/docs/swatches/9e6c15.svg
new file mode 100644
index 0000000..afa667f
--- /dev/null
+++ b/docs/swatches/9e6c15.svg
@@ -0,0 +1 @@
+
diff --git a/docs/swatches/b0b8c2.svg b/docs/swatches/b0b8c2.svg
new file mode 100644
index 0000000..1e162a0
--- /dev/null
+++ b/docs/swatches/b0b8c2.svg
@@ -0,0 +1 @@
+
diff --git a/docs/swatches/c9ced4.svg b/docs/swatches/c9ced4.svg
new file mode 100644
index 0000000..08e745c
--- /dev/null
+++ b/docs/swatches/c9ced4.svg
@@ -0,0 +1 @@
+
diff --git a/docs/swatches/ce483b.svg b/docs/swatches/ce483b.svg
new file mode 100644
index 0000000..228b857
--- /dev/null
+++ b/docs/swatches/ce483b.svg
@@ -0,0 +1 @@
+
diff --git a/docs/swatches/d9e4ec.svg b/docs/swatches/d9e4ec.svg
new file mode 100644
index 0000000..0a76887
--- /dev/null
+++ b/docs/swatches/d9e4ec.svg
@@ -0,0 +1 @@
+
diff --git a/docs/swatches/dde2e8.svg b/docs/swatches/dde2e8.svg
new file mode 100644
index 0000000..b98d0b4
--- /dev/null
+++ b/docs/swatches/dde2e8.svg
@@ -0,0 +1 @@
+
diff --git a/docs/swatches/dfe2e6.svg b/docs/swatches/dfe2e6.svg
new file mode 100644
index 0000000..6bbd924
--- /dev/null
+++ b/docs/swatches/dfe2e6.svg
@@ -0,0 +1 @@
+
diff --git a/docs/swatches/e0e4e9.svg b/docs/swatches/e0e4e9.svg
new file mode 100644
index 0000000..fb587a1
--- /dev/null
+++ b/docs/swatches/e0e4e9.svg
@@ -0,0 +1 @@
+
diff --git a/docs/swatches/e6e9ee.svg b/docs/swatches/e6e9ee.svg
new file mode 100644
index 0000000..e3a0c43
--- /dev/null
+++ b/docs/swatches/e6e9ee.svg
@@ -0,0 +1 @@
+
diff --git a/docs/swatches/f0f2f5.svg b/docs/swatches/f0f2f5.svg
new file mode 100644
index 0000000..a2555da
--- /dev/null
+++ b/docs/swatches/f0f2f5.svg
@@ -0,0 +1 @@
+
diff --git a/docs/swatches/f49b9b.svg b/docs/swatches/f49b9b.svg
new file mode 100644
index 0000000..73768ea
--- /dev/null
+++ b/docs/swatches/f49b9b.svg
@@ -0,0 +1 @@
+
diff --git a/docs/swatches/f5f7fa.svg b/docs/swatches/f5f7fa.svg
new file mode 100644
index 0000000..1866308
--- /dev/null
+++ b/docs/swatches/f5f7fa.svg
@@ -0,0 +1 @@
+
diff --git a/docs/swatches/f7f9fb.svg b/docs/swatches/f7f9fb.svg
new file mode 100644
index 0000000..161a0c8
--- /dev/null
+++ b/docs/swatches/f7f9fb.svg
@@ -0,0 +1 @@
+
diff --git a/docs/swatches/ffffff.svg b/docs/swatches/ffffff.svg
new file mode 100644
index 0000000..d1d17d7
--- /dev/null
+++ b/docs/swatches/ffffff.svg
@@ -0,0 +1 @@
+
diff --git a/test/css_check.rb b/test/css_check.rb
index b5406f0..4afdbac 100644
--- a/test/css_check.rb
+++ b/test/css_check.rb
@@ -86,7 +86,11 @@ def self.readme_table_matches_declarations
listed_twice = []
blank = []
rows.each do |light, dark, values|
- parts = values.split("/").map { |part| part.strip.delete("`") }
+ # Drop any inline swatch images (``) the README
+ # adds next to each value, then read the backticked hex(es). Without this
+ # the image URL's slashes break the light/dark split below.
+ cleaned = values.gsub(/!\[[^\]]*\]\([^)]*\)/, "")
+ parts = cleaned.split("/").map { |part| part.strip.delete("`") }.reject(&:empty?)
[[light, parts[0]], [dark, parts[1]]].each do |name, value|
next if name.nil?
# Every row counts towards duplicate detection, blank or not. Skipping