docs: color code by Vesper's scopes and let a Project's page carry the Signature

.changeset/syntax-scopes-and-signature.md

@@ -0,0 +1,5 @@
+---
+"@variablelab/brand": patch
+---
+
+Code coloring follows Vesper's scopes with the two accents: numbers, booleans, types, `support.*` names and JSON keys take `function`, symbols and `constant.other.key` take `string`, and Vesper's third accent is `text`. The Logo chapter says that a Project's page or docs carry the Signature, set apart from the Sign.

README.md

@@ -35,8 +35,8 @@ Code is colored with soft Vesper: the roles and the peach and mint accents of [V
 | --- | --- | --- | --- |
 | <img src=".github/readme/syntax-text.svg" width="48" height="24" alt=""> | `text` | `#f3f0e8` | Identifiers, punctuation and flags. |
 | <img src=".github/readme/syntax-keyword.svg" width="48" height="24" alt=""> | `keyword` | `#a39e93` | `import`, `from`, `const`, `export`, `as` and operators; JSX attributes; a code block's file name. |
-| <img src=".github/readme/syntax-function.svg" width="48" height="24" alt=""> | `function` | `#e8bf98` | Function calls and declarations; HTML tags and attributes; the first token of a shell command (`pnpm`). |
-| <img src=".github/readme/syntax-string.svg" width="48" height="24" alt=""> | `string` | `#a3d9ca` | Strings; the arguments of a shell command (`init`, package names). |
+| <img src=".github/readme/syntax-function.svg" width="48" height="24" alt=""> | `function` | `#e8bf98` | Function calls and declarations; numbers, booleans, types and other `support.*` names; HTML tags and attributes; JSON keys; the first token of a shell command (`pnpm`). |
+| <img src=".github/readme/syntax-string.svg" width="48" height="24" alt=""> | `string` | `#a3d9ca` | Strings, symbols and `constant.other.key`; the arguments of a shell command (`init`, package names). |
 | <img src=".github/readme/syntax-comment.svg" width="48" height="24" alt=""> | `comment` | `#8a857b` | Comments; a code block's language label. |
 | <img src=".github/readme/syntax-gutter.svg" width="48" height="24" alt=""> | `gutter` | `#5f5a52` | Line numbers and the `$` prompt. |
 <!-- /build:syntax -->

skills/vlab-brand/color.md

@@ -23,15 +23,15 @@ A dark, warm palette in flat planes.
 
 ## Syntax: soft Vesper
 
-Code takes its roles and its two accents, peach and mint, from [Vesper](https://github.com/raunofreiberg/vesper), with the accents desaturated. The neutrals and the background are the page's: Vesper's `#101010` and cool grays clashed with the warm `ground`. Code blocks sit on `surface`. Whatever Vesper leaves in its default color is `text`.
+Code takes its roles and its two accents, peach and mint, from [Vesper](https://github.com/raunofreiberg/vesper), with the accents desaturated. The neutrals and the background are the page's: Vesper's `#101010` and cool grays clashed with the warm `ground`. Code blocks sit on `surface`. Each scope Vesper colors takes the token that has its Vesper color in the table. Whatever Vesper leaves in its default color is `text`, and so is its third accent (`#FF8080`: invalid code, deleted lines, some JavaScript module and class names): the brand keeps two accents.
 
 <!-- build:syntax -->
 | Token | Value | Vesper | Use |
 | --- | --- | --- | --- |
 | text | `#f3f0e8` | `#FFFFFF` | Identifiers, punctuation and flags. |
 | keyword | `#a39e93` | `#A0A0A0` | `import`, `from`, `const`, `export`, `as` and operators; JSX attributes; a code block's file name. |
-| function | `#e8bf98` | `#FFC799` | Function calls and declarations; HTML tags and attributes; the first token of a shell command (`pnpm`). |
-| string | `#a3d9ca` | `#99FFE4` | Strings; the arguments of a shell command (`init`, package names). |
+| function | `#e8bf98` | `#FFC799` | Function calls and declarations; numbers, booleans, types and other `support.*` names; HTML tags and attributes; JSON keys; the first token of a shell command (`pnpm`). |
+| string | `#a3d9ca` | `#99FFE4` | Strings, symbols and `constant.other.key`; the arguments of a shell command (`init`, package names). |
 | comment | `#8a857b` | `#8b8b8b94` | Comments; a code block's language label. |
 | gutter | `#5f5a52` | `#505050` | Line numbers and the `$` prompt. |
 <!-- /build:syntax -->

skills/vlab-brand/logo.md

@@ -14,7 +14,7 @@ File: `assets/logo.svg` in the brand repository, `viewBox 0 0 402.02 468.12`.
 
 - Another color, an outline, or a background other than `ground`.
 - "Variable Lab" beside it: the name beside the Logo is Variable Land.
-- A Project using it, or the Logo set beside a Sign.
+- A Project using it as its own mark, or the Logo locked up with a Sign. A Project's page or docs still carry the Signature, set apart from the Sign.
 - A drawn wordmark or any other variant.
 
 ## Linking it

tokens/tokens.json

@@ -12,8 +12,8 @@
   "syntax": {
     "text": { "value": "#f3f0e8", "vesper": "#FFFFFF", "use": "Identifiers, punctuation and flags." },
     "keyword": { "value": "#a39e93", "vesper": "#A0A0A0", "use": "`import`, `from`, `const`, `export`, `as` and operators; JSX attributes; a code block's file name." },
-    "function": { "value": "#e8bf98", "vesper": "#FFC799", "use": "Function calls and declarations; HTML tags and attributes; the first token of a shell command (`pnpm`)." },
-    "string": { "value": "#a3d9ca", "vesper": "#99FFE4", "use": "Strings; the arguments of a shell command (`init`, package names)." },
+    "function": { "value": "#e8bf98", "vesper": "#FFC799", "use": "Function calls and declarations; numbers, booleans, types and other `support.*` names; HTML tags and attributes; JSON keys; the first token of a shell command (`pnpm`)." },
+    "string": { "value": "#a3d9ca", "vesper": "#99FFE4", "use": "Strings, symbols and `constant.other.key`; the arguments of a shell command (`init`, package names)." },
     "comment": { "value": "#8a857b", "vesper": "#8b8b8b94", "use": "Comments; a code block's language label." },
     "gutter": { "value": "#5f5a52", "vesper": "#505050", "use": "Line numbers and the `$` prompt." }
   },