From b977d91310e2154e67d68b030c80059c39f937cd Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Sun, 6 Sep 2026 09:43:52 +0000
Subject: [PATCH 1/5] Split shared CSS base into data-shared style blocks, add
 CI check

Both pages keep their CSS fully inlined (no external stylesheet),
preserving single-file portability. A CI workflow verifies the
<style data-shared> blocks are byte-identical across all HTML files.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01S3ETpFXfDZUnDPky8Vs6Gw
---
 .github/workflows/check-shared-css.yml | 27 ++++++++++++
 index.html                             | 60 ++++++--------------------
 playground.html                        | 26 +++++------
 3 files changed, 55 insertions(+), 58 deletions(-)
 create mode 100644 .github/workflows/check-shared-css.yml

diff --git a/.github/workflows/check-shared-css.yml b/.github/workflows/check-shared-css.yml
new file mode 100644
index 0000000..278c394
--- /dev/null
+++ b/.github/workflows/check-shared-css.yml
@@ -0,0 +1,27 @@
+name: Shared CSS coherence
+on:
+  push:
+
+jobs:
+  check:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - name: Verify shared CSS blocks are identical
+        run: |
+          blocks=()
+          for f in $(grep -rl 'data-shared' --include='*.html'); do
+            blocks+=("$(sed -n '/<style data-shared>/,/<\/style>/p' "$f")")
+          done
+          if [ "${#blocks[@]}" -lt 2 ]; then
+            echo "Need at least two files with <style data-shared>; found ${#blocks[@]}"
+            exit 1
+          fi
+          for i in $(seq 1 $((${#blocks[@]} - 1))); do
+            if [ "${blocks[0]}" != "${blocks[$i]}" ]; then
+              echo "Shared CSS mismatch"
+              diff <(echo "${blocks[0]}") <(echo "${blocks[$i]}")
+              exit 1
+            fi
+          done
+          echo "Shared CSS is consistent across ${#blocks[@]} files."
diff --git a/index.html b/index.html
index 65b5419..c77085e 100644
--- a/index.html
+++ b/index.html
@@ -4,7 +4,7 @@
 <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <title>NSV Explorer</title>
-<style>
+<style data-shared>
   :root {
     --bg: #1a1a1a;
     --fg: #d4d4d4;
@@ -17,35 +17,20 @@
     --add-fg: #6fbf6f;
     --del-fg: #bf6f6f;
   }
-
   * { margin: 0; padding: 0; box-sizing: border-box; }
-
-  body {
-    font-family: var(--sans);
-    background-color: var(--bg);
-    color: var(--fg);
-    margin: 0;
-    padding: 0;
-    display: flex;
-    flex-direction: column;
-    height: 100vh;
-    line-height: 1.5;
-  }
-
-  header {
-    padding: 20px 24px;
-    display: flex;
-    align-items: baseline;
-    gap: 16px;
-    border-bottom: 1px solid var(--border);
-  }
-
-  header h1 {
-    font-size: 18px;
-    font-weight: 600;
-    letter-spacing: -0.02em;
-    margin: 0;
+  body { font-family: var(--sans); background: var(--bg); color: var(--fg); line-height: 1.5; }
+  header { display: flex; align-items: baseline; gap: 16px; }
+  header h1 { font-size: 18px; font-weight: 600; letter-spacing: -0.02em; }
+  textarea {
+    width: 100%; background: var(--surface); color: var(--fg);
+    border: 1px solid var(--border); border-radius: 4px; padding: 12px;
+    font-family: var(--mono); font-size: 13px; line-height: 1.6; resize: vertical;
   }
+  textarea:focus { outline: none; border-color: #555; }
+</style>
+<style>
+  body { display: flex; flex-direction: column; height: 100vh; }
+  header { padding: 20px 24px; border-bottom: 1px solid var(--border); }
 
   #status {
     font-size: 13px;
@@ -113,24 +98,7 @@
     gap: 12px;
   }
 
-  textarea {
-    width: 100%;
-    height: 120px;
-    background-color: var(--surface);
-    color: var(--fg);
-    border: 1px solid var(--border);
-    border-radius: 4px;
-    padding: 12px;
-    font-family: var(--mono);
-    font-size: 13px;
-    line-height: 1.6;
-    resize: vertical;
-  }
-
-  textarea:focus {
-    outline: none;
-    border-color: #555;
-  }
+  textarea { height: 120px; }
 
   .controls {
     display: flex;
diff --git a/playground.html b/playground.html
index 86f3495..85fe11d 100644
--- a/playground.html
+++ b/playground.html
@@ -4,7 +4,7 @@
 <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <title>NSV Playground</title>
-<style>
+<style data-shared>
   :root {
     --bg: #1a1a1a;
     --fg: #d4d4d4;
@@ -14,17 +14,24 @@
     --surface: #242424;
     --mono: 'SF Mono', 'Cascadia Code', 'Fira Code', 'JetBrains Mono', 'Consolas', monospace;
     --sans: system-ui, -apple-system, sans-serif;
-    --add: #2d4a2d;
-    --del: #4a2d2d;
     --add-fg: #6fbf6f;
     --del-fg: #bf6f6f;
-    --drop-active: #2a3a2a;
   }
   * { margin: 0; padding: 0; box-sizing: border-box; }
   body { font-family: var(--sans); background: var(--bg); color: var(--fg); line-height: 1.5; }
-
-  header { padding: 20px 24px 0; display: flex; align-items: baseline; gap: 16px; }
+  header { display: flex; align-items: baseline; gap: 16px; }
   header h1 { font-size: 18px; font-weight: 600; letter-spacing: -0.02em; }
+  textarea {
+    width: 100%; background: var(--surface); color: var(--fg);
+    border: 1px solid var(--border); border-radius: 4px; padding: 12px;
+    font-family: var(--mono); font-size: 13px; line-height: 1.6; resize: vertical;
+  }
+  textarea:focus { outline: none; border-color: #555; }
+</style>
+<style>
+  :root { --add: #2d4a2d; --del: #4a2d2d; --drop-active: #2a3a2a; }
+
+  header { padding: 20px 24px 0; }
   header span { font-size: 13px; color: var(--fg-dim); }
   header a { color: var(--fg-dim); font-size: 13px; text-decoration: none; margin-left: auto; }
   header a:hover { color: var(--fg); }
@@ -110,12 +117,7 @@
     display: block; font-size: 12px; color: var(--fg-dim); text-transform: uppercase;
     letter-spacing: 0.05em; margin-bottom: 6px;
   }
-  textarea {
-    width: 100%; height: 280px; background: var(--surface); color: var(--fg);
-    border: 1px solid var(--border); border-radius: 4px; padding: 12px;
-    font-family: var(--mono); font-size: 13px; line-height: 1.6; resize: vertical; tab-size: 2;
-  }
-  textarea:focus { outline: none; border-color: #555; }
+  textarea { height: 280px; tab-size: 2; }
   textarea::placeholder { color: #555; }
 
   .actions { display: flex; gap: 8px; margin-top: 10px; align-items: center; }

From 1b64d8d08037deaeba2881a9ab0769bc081da822 Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Sun, 6 Sep 2026 09:48:37 +0000
Subject: [PATCH 2/5] Restore readable formatting in shared CSS, use
 html.parser in CI check

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01S3ETpFXfDZUnDPky8Vs6Gw
---
 .github/workflows/check-shared-css.yml | 55 ++++++++++++++++++--------
 index.html                             | 25 ++++++++++--
 playground.html                        | 25 ++++++++++--
 3 files changed, 81 insertions(+), 24 deletions(-)

diff --git a/.github/workflows/check-shared-css.yml b/.github/workflows/check-shared-css.yml
index 278c394..9bac8b0 100644
--- a/.github/workflows/check-shared-css.yml
+++ b/.github/workflows/check-shared-css.yml
@@ -9,19 +9,42 @@ jobs:
       - uses: actions/checkout@v4
       - name: Verify shared CSS blocks are identical
         run: |
-          blocks=()
-          for f in $(grep -rl 'data-shared' --include='*.html'); do
-            blocks+=("$(sed -n '/<style data-shared>/,/<\/style>/p' "$f")")
-          done
-          if [ "${#blocks[@]}" -lt 2 ]; then
-            echo "Need at least two files with <style data-shared>; found ${#blocks[@]}"
-            exit 1
-          fi
-          for i in $(seq 1 $((${#blocks[@]} - 1))); do
-            if [ "${blocks[0]}" != "${blocks[$i]}" ]; then
-              echo "Shared CSS mismatch"
-              diff <(echo "${blocks[0]}") <(echo "${blocks[$i]}")
-              exit 1
-            fi
-          done
-          echo "Shared CSS is consistent across ${#blocks[@]} files."
+          python3 -c "
+          import glob, sys
+          from html.parser import HTMLParser
+
+          class SharedCSS(HTMLParser):
+              def __init__(self):
+                  super().__init__()
+                  self._in = False
+                  self.parts = []
+              def handle_starttag(self, tag, attrs):
+                  if tag == 'style' and any(k == 'data-shared' for k, v in attrs):
+                      self._in = True
+              def handle_data(self, data):
+                  if self._in: self.parts.append(data)
+              def handle_endtag(self, tag):
+                  if tag == 'style' and self._in: self._in = False
+
+          files = sorted(glob.glob('**/*.html', recursive=True))
+          blocks = {}
+          for f in files:
+              p = SharedCSS()
+              p.feed(open(f).read())
+              if p.parts:
+                  blocks[f] = ''.join(p.parts)
+
+          if len(blocks) < 2:
+              print(f'Need at least 2 files with <style data-shared>; found {len(blocks)}')
+              sys.exit(1)
+
+          ref_file, ref_css = next(iter(blocks.items()))
+          ok = True
+          for f, css in blocks.items():
+              if css != ref_css:
+                  print(f'Shared CSS mismatch: {ref_file} vs {f}')
+                  ok = False
+          if not ok:
+              sys.exit(1)
+          print(f'Shared CSS is consistent across {len(blocks)} files.')
+          "
diff --git a/index.html b/index.html
index c77085e..d1d83b1 100644
--- a/index.html
+++ b/index.html
@@ -17,15 +17,32 @@
     --add-fg: #6fbf6f;
     --del-fg: #bf6f6f;
   }
+
   * { margin: 0; padding: 0; box-sizing: border-box; }
-  body { font-family: var(--sans); background: var(--bg); color: var(--fg); line-height: 1.5; }
+
+  body {
+    font-family: var(--sans);
+    background: var(--bg);
+    color: var(--fg);
+    line-height: 1.5;
+  }
+
   header { display: flex; align-items: baseline; gap: 16px; }
   header h1 { font-size: 18px; font-weight: 600; letter-spacing: -0.02em; }
+
   textarea {
-    width: 100%; background: var(--surface); color: var(--fg);
-    border: 1px solid var(--border); border-radius: 4px; padding: 12px;
-    font-family: var(--mono); font-size: 13px; line-height: 1.6; resize: vertical;
+    width: 100%;
+    background: var(--surface);
+    color: var(--fg);
+    border: 1px solid var(--border);
+    border-radius: 4px;
+    padding: 12px;
+    font-family: var(--mono);
+    font-size: 13px;
+    line-height: 1.6;
+    resize: vertical;
   }
+
   textarea:focus { outline: none; border-color: #555; }
 </style>
 <style>
diff --git a/playground.html b/playground.html
index 85fe11d..4142879 100644
--- a/playground.html
+++ b/playground.html
@@ -17,15 +17,32 @@
     --add-fg: #6fbf6f;
     --del-fg: #bf6f6f;
   }
+
   * { margin: 0; padding: 0; box-sizing: border-box; }
-  body { font-family: var(--sans); background: var(--bg); color: var(--fg); line-height: 1.5; }
+
+  body {
+    font-family: var(--sans);
+    background: var(--bg);
+    color: var(--fg);
+    line-height: 1.5;
+  }
+
   header { display: flex; align-items: baseline; gap: 16px; }
   header h1 { font-size: 18px; font-weight: 600; letter-spacing: -0.02em; }
+
   textarea {
-    width: 100%; background: var(--surface); color: var(--fg);
-    border: 1px solid var(--border); border-radius: 4px; padding: 12px;
-    font-family: var(--mono); font-size: 13px; line-height: 1.6; resize: vertical;
+    width: 100%;
+    background: var(--surface);
+    color: var(--fg);
+    border: 1px solid var(--border);
+    border-radius: 4px;
+    padding: 12px;
+    font-family: var(--mono);
+    font-size: 13px;
+    line-height: 1.6;
+    resize: vertical;
   }
+
   textarea:focus { outline: none; border-color: #555; }
 </style>
 <style>

From 16d65fd1b1d6696ef4f3da236adcdcb29ab87275 Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Sun, 6 Sep 2026 09:55:13 +0000
Subject: [PATCH 3/5] Simplify CI check, restore original formatting in shared
 block

Drop HTMLParser class in favor of string splitting.
Expand header rules back to multi-line to match original style.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01S3ETpFXfDZUnDPky8Vs6Gw
---
 .github/workflows/check-shared-css.yml | 24 ++++--------------------
 index.html                             | 13 +++++++++++--
 playground.html                        | 13 +++++++++++--
 3 files changed, 26 insertions(+), 24 deletions(-)

diff --git a/.github/workflows/check-shared-css.yml b/.github/workflows/check-shared-css.yml
index 9bac8b0..234620c 100644
--- a/.github/workflows/check-shared-css.yml
+++ b/.github/workflows/check-shared-css.yml
@@ -11,28 +11,12 @@ jobs:
         run: |
           python3 -c "
           import glob, sys
-          from html.parser import HTMLParser
 
-          class SharedCSS(HTMLParser):
-              def __init__(self):
-                  super().__init__()
-                  self._in = False
-                  self.parts = []
-              def handle_starttag(self, tag, attrs):
-                  if tag == 'style' and any(k == 'data-shared' for k, v in attrs):
-                      self._in = True
-              def handle_data(self, data):
-                  if self._in: self.parts.append(data)
-              def handle_endtag(self, tag):
-                  if tag == 'style' and self._in: self._in = False
-
-          files = sorted(glob.glob('**/*.html', recursive=True))
           blocks = {}
-          for f in files:
-              p = SharedCSS()
-              p.feed(open(f).read())
-              if p.parts:
-                  blocks[f] = ''.join(p.parts)
+          for f in sorted(glob.glob('**/*.html', recursive=True)):
+              text = open(f).read()
+              if '<style data-shared>' not in text: continue
+              blocks[f] = text.split('<style data-shared>', 1)[1].split('</style>', 1)[0]
 
           if len(blocks) < 2:
               print(f'Need at least 2 files with <style data-shared>; found {len(blocks)}')
diff --git a/index.html b/index.html
index d1d83b1..48ee913 100644
--- a/index.html
+++ b/index.html
@@ -27,8 +27,17 @@
     line-height: 1.5;
   }
 
-  header { display: flex; align-items: baseline; gap: 16px; }
-  header h1 { font-size: 18px; font-weight: 600; letter-spacing: -0.02em; }
+  header {
+    display: flex;
+    align-items: baseline;
+    gap: 16px;
+  }
+
+  header h1 {
+    font-size: 18px;
+    font-weight: 600;
+    letter-spacing: -0.02em;
+  }
 
   textarea {
     width: 100%;
diff --git a/playground.html b/playground.html
index 4142879..cc79f70 100644
--- a/playground.html
+++ b/playground.html
@@ -27,8 +27,17 @@
     line-height: 1.5;
   }
 
-  header { display: flex; align-items: baseline; gap: 16px; }
-  header h1 { font-size: 18px; font-weight: 600; letter-spacing: -0.02em; }
+  header {
+    display: flex;
+    align-items: baseline;
+    gap: 16px;
+  }
+
+  header h1 {
+    font-size: 18px;
+    font-weight: 600;
+    letter-spacing: -0.02em;
+  }
 
   textarea {
     width: 100%;

From 0437eef08eab6e5a35eb6a413f719d1e02e15d02 Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Sun, 6 Sep 2026 10:01:13 +0000
Subject: [PATCH 4/5] Add shared CSS coherence check, mark shared tokens with
 data-shared

Splits :root tokens and reset into <style data-shared> in both pages.
CI uses xmllint XPath to extract and compare the shared blocks.
No selectors reorganized; page-specific CSS untouched.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01S3ETpFXfDZUnDPky8Vs6Gw
---
 .github/workflows/check-shared-css.yml | 40 +++++++++-----------
 index.html                             | 51 +++++++++++++++-----------
 playground.html                        | 45 +++++------------------
 3 files changed, 55 insertions(+), 81 deletions(-)

diff --git a/.github/workflows/check-shared-css.yml b/.github/workflows/check-shared-css.yml
index 234620c..a641e6c 100644
--- a/.github/workflows/check-shared-css.yml
+++ b/.github/workflows/check-shared-css.yml
@@ -9,26 +9,20 @@ jobs:
       - uses: actions/checkout@v4
       - name: Verify shared CSS blocks are identical
         run: |
-          python3 -c "
-          import glob, sys
-
-          blocks = {}
-          for f in sorted(glob.glob('**/*.html', recursive=True)):
-              text = open(f).read()
-              if '<style data-shared>' not in text: continue
-              blocks[f] = text.split('<style data-shared>', 1)[1].split('</style>', 1)[0]
-
-          if len(blocks) < 2:
-              print(f'Need at least 2 files with <style data-shared>; found {len(blocks)}')
-              sys.exit(1)
-
-          ref_file, ref_css = next(iter(blocks.items()))
-          ok = True
-          for f, css in blocks.items():
-              if css != ref_css:
-                  print(f'Shared CSS mismatch: {ref_file} vs {f}')
-                  ok = False
-          if not ok:
-              sys.exit(1)
-          print(f'Shared CSS is consistent across {len(blocks)} files.')
-          "
+          files=$(grep -rl 'data-shared' --include='*.html')
+          n=$(echo "$files" | wc -l)
+          if [ "$n" -lt 2 ]; then
+            echo "Need at least 2 files with <style data-shared>; found $n"
+            exit 1
+          fi
+          ref=""
+          for f in $files; do
+            css=$(xmllint --html --xpath 'string(//style[@data-shared])' "$f" 2>/dev/null)
+            if [ -z "$ref" ]; then ref="$css"; ref_file="$f"; continue; fi
+            if [ "$css" != "$ref" ]; then
+              echo "Shared CSS mismatch: $ref_file vs $f"
+              diff <(echo "$ref") <(echo "$css")
+              exit 1
+            fi
+          done
+          echo "Shared CSS is consistent across $n files."
diff --git a/index.html b/index.html
index 48ee913..cdd4e3a 100644
--- a/index.html
+++ b/index.html
@@ -19,45 +19,35 @@
   }
 
   * { margin: 0; padding: 0; box-sizing: border-box; }
-
+</style>
+<style>
   body {
     font-family: var(--sans);
-    background: var(--bg);
+    background-color: var(--bg);
     color: var(--fg);
+    margin: 0;
+    padding: 0;
+    display: flex;
+    flex-direction: column;
+    height: 100vh;
     line-height: 1.5;
   }
 
   header {
+    padding: 20px 24px;
     display: flex;
     align-items: baseline;
     gap: 16px;
+    border-bottom: 1px solid var(--border);
   }
 
   header h1 {
     font-size: 18px;
     font-weight: 600;
     letter-spacing: -0.02em;
+    margin: 0;
   }
 
-  textarea {
-    width: 100%;
-    background: var(--surface);
-    color: var(--fg);
-    border: 1px solid var(--border);
-    border-radius: 4px;
-    padding: 12px;
-    font-family: var(--mono);
-    font-size: 13px;
-    line-height: 1.6;
-    resize: vertical;
-  }
-
-  textarea:focus { outline: none; border-color: #555; }
-</style>
-<style>
-  body { display: flex; flex-direction: column; height: 100vh; }
-  header { padding: 20px 24px; border-bottom: 1px solid var(--border); }
-
   #status {
     font-size: 13px;
     color: var(--fg-dim);
@@ -124,7 +114,24 @@
     gap: 12px;
   }
 
-  textarea { height: 120px; }
+  textarea {
+    width: 100%;
+    height: 120px;
+    background-color: var(--surface);
+    color: var(--fg);
+    border: 1px solid var(--border);
+    border-radius: 4px;
+    padding: 12px;
+    font-family: var(--mono);
+    font-size: 13px;
+    line-height: 1.6;
+    resize: vertical;
+  }
+
+  textarea:focus {
+    outline: none;
+    border-color: #555;
+  }
 
   .controls {
     display: flex;
diff --git a/playground.html b/playground.html
index cc79f70..504855b 100644
--- a/playground.html
+++ b/playground.html
@@ -19,45 +19,13 @@
   }
 
   * { margin: 0; padding: 0; box-sizing: border-box; }
-
-  body {
-    font-family: var(--sans);
-    background: var(--bg);
-    color: var(--fg);
-    line-height: 1.5;
-  }
-
-  header {
-    display: flex;
-    align-items: baseline;
-    gap: 16px;
-  }
-
-  header h1 {
-    font-size: 18px;
-    font-weight: 600;
-    letter-spacing: -0.02em;
-  }
-
-  textarea {
-    width: 100%;
-    background: var(--surface);
-    color: var(--fg);
-    border: 1px solid var(--border);
-    border-radius: 4px;
-    padding: 12px;
-    font-family: var(--mono);
-    font-size: 13px;
-    line-height: 1.6;
-    resize: vertical;
-  }
-
-  textarea:focus { outline: none; border-color: #555; }
 </style>
 <style>
   :root { --add: #2d4a2d; --del: #4a2d2d; --drop-active: #2a3a2a; }
+  body { font-family: var(--sans); background: var(--bg); color: var(--fg); line-height: 1.5; }
 
-  header { padding: 20px 24px 0; }
+  header { padding: 20px 24px 0; display: flex; align-items: baseline; gap: 16px; }
+  header h1 { font-size: 18px; font-weight: 600; letter-spacing: -0.02em; }
   header span { font-size: 13px; color: var(--fg-dim); }
   header a { color: var(--fg-dim); font-size: 13px; text-decoration: none; margin-left: auto; }
   header a:hover { color: var(--fg); }
@@ -143,7 +111,12 @@
     display: block; font-size: 12px; color: var(--fg-dim); text-transform: uppercase;
     letter-spacing: 0.05em; margin-bottom: 6px;
   }
-  textarea { height: 280px; tab-size: 2; }
+  textarea {
+    width: 100%; height: 280px; background: var(--surface); color: var(--fg);
+    border: 1px solid var(--border); border-radius: 4px; padding: 12px;
+    font-family: var(--mono); font-size: 13px; line-height: 1.6; resize: vertical; tab-size: 2;
+  }
+  textarea:focus { outline: none; border-color: #555; }
   textarea::placeholder { color: #555; }
 
   .actions { display: flex; gap: 8px; margin-top: 10px; align-items: center; }

From 4dc745ca7f9a829f31d3ee458896a8345ea25d0a Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Sun, 6 Sep 2026 10:03:57 +0000
Subject: [PATCH 5/5] Fix CI: use Python string split instead of xmllint (not
 on runner)

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01S3ETpFXfDZUnDPky8Vs6Gw
---
 .github/workflows/check-shared-css.yml | 40 +++++++++++++++-----------
 1 file changed, 23 insertions(+), 17 deletions(-)

diff --git a/.github/workflows/check-shared-css.yml b/.github/workflows/check-shared-css.yml
index a641e6c..234620c 100644
--- a/.github/workflows/check-shared-css.yml
+++ b/.github/workflows/check-shared-css.yml
@@ -9,20 +9,26 @@ jobs:
       - uses: actions/checkout@v4
       - name: Verify shared CSS blocks are identical
         run: |
-          files=$(grep -rl 'data-shared' --include='*.html')
-          n=$(echo "$files" | wc -l)
-          if [ "$n" -lt 2 ]; then
-            echo "Need at least 2 files with <style data-shared>; found $n"
-            exit 1
-          fi
-          ref=""
-          for f in $files; do
-            css=$(xmllint --html --xpath 'string(//style[@data-shared])' "$f" 2>/dev/null)
-            if [ -z "$ref" ]; then ref="$css"; ref_file="$f"; continue; fi
-            if [ "$css" != "$ref" ]; then
-              echo "Shared CSS mismatch: $ref_file vs $f"
-              diff <(echo "$ref") <(echo "$css")
-              exit 1
-            fi
-          done
-          echo "Shared CSS is consistent across $n files."
+          python3 -c "
+          import glob, sys
+
+          blocks = {}
+          for f in sorted(glob.glob('**/*.html', recursive=True)):
+              text = open(f).read()
+              if '<style data-shared>' not in text: continue
+              blocks[f] = text.split('<style data-shared>', 1)[1].split('</style>', 1)[0]
+
+          if len(blocks) < 2:
+              print(f'Need at least 2 files with <style data-shared>; found {len(blocks)}')
+              sys.exit(1)
+
+          ref_file, ref_css = next(iter(blocks.items()))
+          ok = True
+          for f, css in blocks.items():
+              if css != ref_css:
+                  print(f'Shared CSS mismatch: {ref_file} vs {f}')
+                  ok = False
+          if not ok:
+              sys.exit(1)
+          print(f'Shared CSS is consistent across {len(blocks)} files.')
+          "