fix: expand highlight captures for better Nix support

- src/highlight.rs: Add 7 new captures to HIGHLIGHT_NAMES:
  embedded, escape, function, punctuation.special, string.special,
  string.special.path, string.special.uri. Now 27 total captures.

- static/style.css: Add CSS variables and class rules for new
  captures in both light and dark themes. escape gets bold
  styling, string-special uses distinct color.

These captures are used by tree-sitter-nix but were previously
missing, causing sparse highlighting. Now functions, escapes,
and paths are properly highlighted.

src/highlight.rs

@@ -4,12 +4,15 @@ use tree_sitter_highlight::{HighlightConfiguration, Highlighter as TSHighlighter
 
 /// Recognized highlight names mapped to CSS classes.
 /// Order matters: index becomes the class name suffix.
+/// Comprehensive list covering captures from all supported languages.
 const HIGHLIGHT_NAMES: &[&str] = &[
     "attribute",
     "comment",
     "constant",
     "constant.builtin",
     "constructor",
+    "embedded",
+    "escape",
     "function",
     "function.builtin",
     "keyword",
@@ -19,7 +22,11 @@ const HIGHLIGHT_NAMES: &[&str] = &[
     "punctuation",
     "punctuation.bracket",
     "punctuation.delimiter",
+    "punctuation.special",
     "string",
+    "string.special",
+    "string.special.path",
+    "string.special.uri",
     "type",
     "type.builtin",
     "variable",
@@ -29,13 +36,15 @@ const HIGHLIGHT_NAMES: &[&str] = &[
 
 /// Static HTML attributes for each highlight class.
 /// Pre-computed to avoid allocations in the render loop.
-/// HtmlRenderer wraps with <span ...>...</span>, callback returns just the attributes.
+/// Must be in same order as HIGHLIGHT_NAMES.
 const HTML_ATTRS: &[&[u8]] = &[
     b" class=\"hl-attribute\"",
     b" class=\"hl-comment\"",
     b" class=\"hl-constant\"",
     b" class=\"hl-constant-builtin\"",
     b" class=\"hl-constructor\"",
+    b" class=\"hl-embedded\"",
+    b" class=\"hl-escape\"",
     b" class=\"hl-function\"",
     b" class=\"hl-function-builtin\"",
     b" class=\"hl-keyword\"",
@@ -45,7 +54,11 @@ const HTML_ATTRS: &[&[u8]] = &[
     b" class=\"hl-punctuation\"",
     b" class=\"hl-punctuation-bracket\"",
     b" class=\"hl-punctuation-delimiter\"",
+    b" class=\"hl-punctuation-special\"",
     b" class=\"hl-string\"",
+    b" class=\"hl-string-special\"",
+    b" class=\"hl-string-special-path\"",
+    b" class=\"hl-string-special-uri\"",
     b" class=\"hl-type\"",
     b" class=\"hl-type-builtin\"",
     b" class=\"hl-variable\"",

static/style.css

@@ -272,6 +272,7 @@ article.post header {
 :root {
   --hl-keyword: #d73a49;
   --hl-string: #22863a;
+  --hl-string-special: #032f62;
   --hl-comment: #6a737d;
   --hl-function: #6f42c1;
   --hl-type: #005cc5;
@@ -281,13 +282,17 @@ article.post header {
   --hl-constant: #005cc5;
   --hl-property: #005cc5;
   --hl-punctuation: #24292e;
+  --hl-punctuation-special: #d73a49;
   --hl-attribute: #22863a;
+  --hl-escape: #005cc5;
+  --hl-embedded: #6f42c1;
 }
 
 @media (prefers-color-scheme: dark) {
   :root {
     --hl-keyword: #f97583;
     --hl-string: #9ecbff;
+    --hl-string-special: #b392f0;
     --hl-comment: #6a737d;
     --hl-function: #b392f0;
     --hl-type: #79b8ff;
@@ -297,7 +302,10 @@ article.post header {
     --hl-constant: #79b8ff;
     --hl-property: #79b8ff;
     --hl-punctuation: #e1e4e8;
+    --hl-punctuation-special: #f97583;
     --hl-attribute: #85e89d;
+    --hl-escape: #79b8ff;
+    --hl-embedded: #b392f0;
   }
 }
 
@@ -380,4 +388,23 @@ article.post header {
 
 .hl-constructor {
   color: var(--hl-type);
+}
+
+.hl-escape {
+  color: var(--hl-escape);
+  font-weight: 600;
+}
+
+.hl-embedded {
+  color: var(--hl-embedded);
+}
+
+.hl-string-special,
+.hl-string-special-path,
+.hl-string-special-uri {
+  color: var(--hl-string-special);
+}
+
+.hl-punctuation-special {
+  color: var(--hl-punctuation-special);
 }