@tiagojct/subsub 0.18.0 → 0.20.0

package/CHANGELOG.md

@@ -2,6 +2,28 @@
 
 Sub-Sub follows the version numbers of npm: a change in the second number (0.13) adds features or changes how you use it; a change in the third (0.13.1) only fixes.
 
+## 0.20.0 (2026-10-23)
+
+Changes from a technical evaluation of 0.19.0 and Starbuck 0.2.0 (LLMSSH 2026).
+
+- Searching the library: when you ask what you have on a topic, Sub-Sub first searches with your own words, then with close synonyms and other word forms, and says which words it searched. In the evaluation it missed items whose titles use a synonym or repeat your words. In a test on the 20 evaluation tasks, recall rose from 0.87 to 0.96 and precision fell from 0.98 to 0.91: the wider search also lists some items that are only near the topic. Check the list.
+- Drafts: Sub-Sub now works from quotes. It reads the full text of each item, chooses a quote for each sentence, and writes the sentence so that it says no more than the quote, with one source for each sentence. A table "Quotes for the check" follows the draft with the quote, word for word, and the page or section for each sentence. A sentence without a quote is cut. In the evaluation, 37% to 53% of the factual sentences in drafts were only partly supported or unsupported by the works they cited. In a test on 18 drafts by two language-model raters, the share fell to 12% to 14% with the new rule. A second test on nine drafts of three other tasks, with the same raters, gave 14% and 16% against 35% and 37% for the old rule; one of the three tasks showed no change. The drafts have more and shorter sentences. Read the table as a way to check, not as a guarantee.
+- Reference checks: a Check with "not found by search" is reported as "not confirmed", with the note that books, theses, reports, archives and works in Portuguese are often missing from Crossref and PubMed. Claim verdicts are reported as sentences to check; Sub-Sub does not change the text or the citation because of a verdict.
+- Guide pages (English and Portuguese): the same two notes on reference checks.
+- Website: a Changes page (English; the Portuguese menu links to it) shows this file.
+- Bench: `retrievalScore` scores a retrieval answer by precision and recall against gold items, naming items by citekey or by title.
+
+## 0.19.0 (2026-10-16)
+
+A new look for the browser view, the website, the tutorial and the workshop, after the engraved plates of 19th-century natural history books.
+
+- A grey-green paper, blue-black ink, and four colours with one meaning each: blue for the Researcher and for links, madder red for the Librarian, green for what is applied or checked, ochre for a preview. In dark mode the page is a blue-black plate.
+- Type: Literata for text, with true italics; Atkinson Hyperlegible Next for the interface; Atkinson Hyperlegible Mono for commands. They replace IBM Plex.
+- The notes pane shows what a note was written from: a line under `evidence:`, solid for the full text, dashed for the abstract, dotted for the metadata.
+- Reading mode in the notes pane: larger type and more space between lines, for long notes. Sub-Sub remembers it on this computer. The tutorial has the same button.
+- In a preview, a tag that would be removed is struck through instead of red. Errors show in ink, with a word, so that red belongs to the Librarian only. Each mode button keeps its own colour, selected or not.
+- A preview has a dashed frame: nothing has changed yet.
+
 ## 0.18.0 (2026-10-15)
 
 - Figures and tables from the PDF. With the Zotero server 0.6.0, Sub-Sub can cut a figure or a table out of an item's PDF (`zotero_get_figure`, with the label of its caption, such as "Figure 2" or "Table 1") and show it in a note, with its caption and a link to the page. `/read critique` shows the table or figure with the main result. The images are PNG files in `Literature/figures/`; the notes pane and Obsidian show them. When the figure cannot be cut out, Sub-Sub takes the whole page and says so.

package/README.md

@@ -1,6 +1,6 @@
 # Sub-Sub
 
-[![npm](https://img.shields.io/npm/v/@tiagojct/subsub.svg?style=flat-square&color=1d4f7c)](https://www.npmjs.com/package/@tiagojct/subsub)
+[![npm](https://img.shields.io/npm/v/@tiagojct/subsub.svg?style=flat-square&color=2c5d87)](https://www.npmjs.com/package/@tiagojct/subsub)
 [![Website](https://img.shields.io/badge/website-subsub.tiagojacinto.eu-a33b14.svg?style=flat-square)](https://subsub.tiagojacinto.eu)
 [![Licence: MIT](https://img.shields.io/badge/licence-MIT-5f5c55.svg?style=flat-square)](LICENSE)
 
@@ -24,7 +24,7 @@ Each mode can have its own model. Switch with `/researcher` and `/librarian`, or
 
 Every library change works the same way in both modes:
 
-- The Zotero server computes the change first. Sub-Sub shows it to you (added tags in green, removed tags in red) and applies it only when you select Yes. The check is in the program, so the model cannot skip it.
+- The Zotero server computes the change first. Sub-Sub shows it to you (the tags it adds and the tags it removes) and applies it only when you select Yes. The check is in the program, so the model cannot skip it.
 - If you edit an item in Zotero while the preview is open, Sub-Sub shows you the new preview before it changes anything. Each change also sends the item's version, so a field you edit at the moment of writing is not overwritten.
 - Every change is journaled, including new collections. `/undo` reverts the last one, and the browser view shows an Undo button under each change.
 - Nothing is deleted: items go to the Zotero trash. Only tags from your tag list can be added.
@@ -183,4 +183,4 @@ This DOI always points to the latest version; each version also has its own DOI
 
 ## Licence
 
-[MIT](LICENSE), Tiago Jacinto. The `/lit`, `/compare` and `/review` prompts adapt text from [Feynman](https://github.com/Companion-Inc/feynman) (MIT); see [THIRD_PARTY_NOTICES](THIRD_PARTY_NOTICES). IBM Plex fonts: SIL Open Font License.
+[MIT](LICENSE), Tiago Jacinto. The `/lit`, `/compare` and `/review` prompts adapt text from [Feynman](https://github.com/Companion-Inc/feynman) (MIT); see [THIRD_PARTY_NOTICES](THIRD_PARTY_NOTICES). Literata and Atkinson Hyperlegible fonts: SIL Open Font License.

package/THIRD_PARTY_NOTICES

@@ -55,99 +55,101 @@ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
 SOFTWARE.
 
 
-web/fonts/ and the website use IBM Plex Sans, IBM Plex Serif and IBM Plex Mono,
-https://github.com/IBM/plex. Their licence:
-
-Copyright © 2017 IBM Corp. with Reserved Font Name "Plex"
-
-This Font Software is licensed under the SIL Open Font License, Version 1.1.
-
-This license is copied below, and is also available with a FAQ at: http://scripts.sil.org/OFL
-
-
------------------------------------------------------------
-SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
------------------------------------------------------------
-
-PREAMBLE
-The goals of the Open Font License (OFL) are to stimulate worldwide
-development of collaborative font projects, to support the font creation
-efforts of academic and linguistic communities, and to provide a free and
-open framework in which fonts may be shared and improved in partnership
-with others.
-
-The OFL allows the licensed fonts to be used, studied, modified and
-redistributed freely as long as they are not sold by themselves. The
-fonts, including any derivative works, can be bundled, embedded, 
-redistributed and/or sold with any software provided that any reserved
-names are not used by derivative works. The fonts and derivatives,
-however, cannot be released under any other type of license. The
-requirement for fonts to remain under this license does not apply
-to any document created using the fonts or their derivatives.
-
-DEFINITIONS
-"Font Software" refers to the set of files released by the Copyright
-Holder(s) under this license and clearly marked as such. This may
-include source files, build scripts and documentation.
-
-"Reserved Font Name" refers to any names specified as such after the
-copyright statement(s).
-
-"Original Version" refers to the collection of Font Software components as
-distributed by the Copyright Holder(s).
-
-"Modified Version" refers to any derivative made by adding to, deleting,
-or substituting -- in part or in whole -- any of the components of the
-Original Version, by changing formats or by porting the Font Software to a
-new environment.
-
-"Author" refers to any designer, engineer, programmer, technical
-writer or other person who contributed to the Font Software.
-
-PERMISSION & CONDITIONS
-Permission is hereby granted, free of charge, to any person obtaining
-a copy of the Font Software, to use, study, copy, merge, embed, modify,
-redistribute, and sell modified and unmodified copies of the Font
-Software, subject to the following conditions:
-
-1) Neither the Font Software nor any of its individual components,
-in Original or Modified Versions, may be sold by itself.
-
-2) Original or Modified Versions of the Font Software may be bundled,
-redistributed and/or sold with any software, provided that each copy
-contains the above copyright notice and this license. These can be
-included either as stand-alone text files, human-readable headers or
-in the appropriate machine-readable metadata fields within text or
-binary files as long as those fields can be easily viewed by the user.
-
-3) No Modified Version of the Font Software may use the Reserved Font
-Name(s) unless explicit written permission is granted by the corresponding
-Copyright Holder. This restriction only applies to the primary font name as
-presented to the users.
-
-4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
-Software shall not be used to promote, endorse or advertise any
-Modified Version, except to acknowledge the contribution(s) of the
-Copyright Holder(s) and the Author(s) or with their explicit written
-permission.
-
-5) The Font Software, modified or unmodified, in part or in whole,
-must be distributed entirely under this license, and must not be
-distributed under any other license. The requirement for fonts to
-remain under this license does not apply to any document created
-using the Font Software.
-
-TERMINATION
-This license becomes null and void if any of the above conditions are
-not met.
-
-DISCLAIMER
-THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
-EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
-MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
-OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
-COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
-INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
-DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
-FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
-OTHER DEALINGS IN THE FONT SOFTWARE.
+web/fonts/, the website, the tutorial and the workshop use Literata, Atkinson
+Hyperlegible Next and Atkinson Hyperlegible Mono, subset to Latin. Their licence:
+
+Copyright 2017 The Literata Project Authors (https://github.com/googlefonts/literata)
+Copyright 2020-2024 The Atkinson Hyperlegible Next Project Authors (https://github.com/googlefonts/atkinson-hyperlegible-next)
+Copyright 2020-2024 The Atkinson Hyperlegible Mono Project Authors (https://github.com/googlefonts/atkinson-hyperlegible-next-mono)
+
+This Font Software is licensed under the SIL Open Font License, Version 1.1.
+
+This license is copied below, and is also available with a FAQ at: http://scripts.sil.org/OFL
+
+
+-----------------------------------------------------------
+SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
+-----------------------------------------------------------
+
+PREAMBLE
+The goals of the Open Font License (OFL) are to stimulate worldwide
+development of collaborative font projects, to support the font creation
+efforts of academic and linguistic communities, and to provide a free and
+open framework in which fonts may be shared and improved in partnership
+with others.
+
+The OFL allows the licensed fonts to be used, studied, modified and
+redistributed freely as long as they are not sold by themselves. The
+fonts, including any derivative works, can be bundled, embedded, 
+redistributed and/or sold with any software provided that any reserved
+names are not used by derivative works. The fonts and derivatives,
+however, cannot be released under any other type of license. The
+requirement for fonts to remain under this license does not apply
+to any document created using the fonts or their derivatives.
+
+DEFINITIONS
+"Font Software" refers to the set of files released by the Copyright
+Holder(s) under this license and clearly marked as such. This may
+include source files, build scripts and documentation.
+
+"Reserved Font Name" refers to any names specified as such after the
+copyright statement(s).
+
+"Original Version" refers to the collection of Font Software components as
+distributed by the Copyright Holder(s).
+
+"Modified Version" refers to any derivative made by adding to, deleting,
+or substituting -- in part or in whole -- any of the components of the
+Original Version, by changing formats or by porting the Font Software to a
+new environment.
+
+"Author" refers to any designer, engineer, programmer, technical
+writer or other person who contributed to the Font Software.
+
+PERMISSION & CONDITIONS
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of the Font Software, to use, study, copy, merge, embed, modify,
+redistribute, and sell modified and unmodified copies of the Font
+Software, subject to the following conditions:
+
+1) Neither the Font Software nor any of its individual components,
+in Original or Modified Versions, may be sold by itself.
+
+2) Original or Modified Versions of the Font Software may be bundled,
+redistributed and/or sold with any software, provided that each copy
+contains the above copyright notice and this license. These can be
+included either as stand-alone text files, human-readable headers or
+in the appropriate machine-readable metadata fields within text or
+binary files as long as those fields can be easily viewed by the user.
+
+3) No Modified Version of the Font Software may use the Reserved Font
+Name(s) unless explicit written permission is granted by the corresponding
+Copyright Holder. This restriction only applies to the primary font name as
+presented to the users.
+
+4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
+Software shall not be used to promote, endorse or advertise any
+Modified Version, except to acknowledge the contribution(s) of the
+Copyright Holder(s) and the Author(s) or with their explicit written
+permission.
+
+5) The Font Software, modified or unmodified, in part or in whole,
+must be distributed entirely under this license, and must not be
+distributed under any other license. The requirement for fonts to
+remain under this license does not apply to any document created
+using the Font Software.
+
+TERMINATION
+This license becomes null and void if any of the above conditions are
+not met.
+
+DISCLAIMER
+THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
+OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
+COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
+DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
+OTHER DEALINGS IN THE FONT SOFTWARE.

package/dist/bench.js

@@ -212,6 +212,37 @@ export function prf(pred, gold) {
     const fn = gold.size - tp;
     return { tp, fp, fn };
 }
+function plainTitle(t) {
+    return t.toLowerCase().replace(/[^\p{L}\p{N}]+/gu, " ").trim();
+}
+/**
+ * The library items that an answer names. An item is named by its citekey, or by the first 40 characters of its title
+ * (at least 15). A duplicate copy (citekey ending in -dup) counts as its original.
+ */
+export function itemsNamed(text, library) {
+    const plain = plainTitle(text);
+    const found = new Set();
+    for (const item of library) {
+        const key = item.citekey.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+        const title = plainTitle(item.title).slice(0, 40).trim();
+        if (new RegExp(`(?<![A-Za-z0-9_])${key}(?![A-Za-z0-9_])`).test(text) || (title.length >= 15 && plain.includes(title))) {
+            found.add(item.citekey.replace(/-dup$/, ""));
+        }
+    }
+    return found;
+}
+/**
+ * Precision and recall of the items in a retrieval answer against the gold items. Items in `acceptable` are on the topic but
+ * outside the gold list: they count as neither hits nor errors. "(copy)" and "-dup" mark a duplicate and count as the original.
+ */
+export function retrievalScore(text, gold, acceptable, library) {
+    const original = (k) => k.replace(/\s*\(copy\)\s*$/, "").replace(/-dup$/, "");
+    const goldSet = new Set(gold.map(original));
+    const skip = new Set(acceptable.map(original));
+    const said = new Set([...itemsNamed(text, library)].filter((k) => goldSet.has(k) || !skip.has(k)));
+    const { tp, fp, fn } = prf(said, goldSet);
+    return { ...f1(tp, fp, fn), tp, fp, fn };
+}
 function f1(tp, fp, fn) {
     const p = tp + fp ? tp / (tp + fp) : 0;
     const r = tp + fn ? tp / (tp + fn) : 0;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tiagojct/subsub",
-  "version": "0.18.0",
+  "version": "0.20.0",
   "description": "Sub-Sub: a research assistant that works from your own Zotero library, in the browser or the terminal, built on pi",
   "type": "module",
   "license": "MIT",

package/prompts/compare.md

@@ -8,7 +8,7 @@ Make a short slug: lower case, hyphens, at most five words. Use today's date (YY
 
 1. Find the sources.
    - If the user gave citekeys, DOIs or PMIDs, use exactly those.
-   - Otherwise: library first (zotero_find_items), then scholar_search_multi with three phrasings. Choose 3 to 10 sources and say why.
+   - Otherwise: library first (zotero_find_items, with the user's own words and then close synonyms), then scholar_search_multi with three phrasings. Choose 3 to 10 sources and say why.
 2. Read each source before you describe it: zotero_get_fulltext for library items, scholar_read_oa_fulltext (methods and results) for open-access works, scholar_get_work for the abstract of the others. Note whether you read the full text or only the abstract.
 3. Build the matrix, one row per source:
    | # | Source | Claim on the question | Evidence type | Population and setting | Caveats | Confidence |

package/prompts/lit.md

@@ -18,7 +18,7 @@ Make a short slug from the topic: lower case, hyphens, at most five words. Use t
 
 ## 2. Gather
 
-1. Library first: zotero_find_items for the topic (and the topic tags). Note what the library already has.
+1. Library first: zotero_find_items for the topic, with the user's own words first and then with close synonyms and word forms, one call for each (and the topic tags). Note what the library already has.
 2. Outside: scholar_search_multi with three or four phrasings of the question (synonyms, the test or drug name, the condition name, MeSH terms). Give include_terms (the key concepts) and exclude_terms (populations or designs outside the question) so that the server pre-screens the results. Use year limits when the question needs recent work.
 3. Screen. For every work in the merged list, decide: read, maybe, or exclude, with a reason of a few words. Prefer systematic reviews, guidelines and primary studies with the right design. Write the screening log to `Research/.plans/<slug>-screening.md`: a table (#, work, identifier, pre-screen, decision, reason) and the counts for a flow diagram: found by the searches, unique works, pre-screen excluded, screened, read, used.
 4. Read before you summarise:

package/prompts/verify.md

@@ -7,12 +7,12 @@ Check the references of $1 with Starbuck.
 1. If the verify_ tools are not available, tell the user that reference checks need Starbuck: add "addons": ["starbuck"] to the Sub-Sub settings file and start Sub-Sub again. Then stop.
 2. Call verify_check_manuscript with path $1.
 3. Report the summary: how many references failed, need checking, have notes and passed.
-4. For each Fail and each Check, give the citation key, Starbuck's reason and its suggested action. Keep Starbuck's result; do not make it stronger or weaker.
+4. For each Fail and each Check, give the citation key, Starbuck's reason and its suggested action. Keep Starbuck's result; do not make it stronger or weaker. When the reason is that no record was found, write "not confirmed" and say that books, theses, reports, archives and works in Portuguese are often missing from Crossref and PubMed.
 5. List the cited keys without a bibliography entry.
 6. Give the path of the HTML report.
 7. If the second argument is "claims", or the user asks whether the sources support the text:
    1. Call verify_prepare_claims with path $1. Get all pages (offset, limit).
    2. Judge each claim with status ready from its passages only: supported, partly_supported, not_supported or cannot_assess. Copy the passage you rely on character for character into quote.
    3. Call verify_record_claims once, with the verdicts of all claims.
-   4. Report the claims that are not supported or only partly supported, with the line and the reason. Say for each whether the evidence was the full text or the abstract only.
+   4. Report the claims that are not supported or only partly supported as sentences to check, not as errors, with the line and the reason. Say for each whether the evidence was the full text or the abstract only.
 8. Do not change the manuscript. Offer fixes and wait for the user's answer.

package/roles/researcher.md

@@ -30,7 +30,7 @@ You read the Zotero library (zotero_ tools), search PubMed, Europe PMC and OpenA
 
 ## Questions about the library
 
-- "What do I have on X": zotero_find_items (query, tags, fulltext=true when needed). Answer in the chat: citekey, year, one line per item.
+- "What do I have on X": search with zotero_find_items (query, tags, fulltext=true when needed). First search with {{user}}'s own words, as written. Then search again with close synonyms and other word forms (singular and plural, noun and adjective, spelling variants, an older or foreign name), one call for each. Join the results and list each item once. Answer in the chat: citekey, year, one line per item, and the words you searched.
 
 ## Outside search and gaps
 
@@ -103,10 +103,12 @@ If zotero_get_vocabulary has no topic/ tags, propose topics before tagging: read
 2. Propose fixes for missing keys. Do not edit the manuscript text without approval.
 3. scholar_export_bibliography to the file named in the YAML header, or references.json next to the manuscript.
 
-Draft text for {{user}}'s manuscripts or theses only when {{user}} asks. Cite library items as [@citekey], use only claims from sources you read, and mark drafted text clearly so that {{user}} can check it. Never draft text for an assignment (coursework that {{user}} hands in for a grade), even when asked: say so, and offer /read, quotes and questions instead.
+Draft text for {{user}}'s manuscripts or theses only when {{user}} asks. Cite library items as [@citekey], use only claims from sources you read, and mark drafted text clearly so that {{user}} can check it. Work from quotes. Read the full text (zotero_get_fulltext) of each item you will cite. First choose the quotes: for each sentence of the draft, one passage of one source, word for word, with its page or section. Then write each sentence so that it says no more than its quote says: one source for each sentence, no sentence that joins claims from two sources, no figure, date, name or cause that is not in the quote, and no stronger wording than the quote has. End every factual sentence (a fact, date, number, name, cause or comparison) with [@citekey]. If you have only the abstract or the metadata of an item, say so, and use it for no more than it says. After the draft, give a table "Quotes for the check" with one row for each factual sentence: its number, the citekey, the quote, and the page or section. A sentence that you cannot support with a quote is cut. Never draft text for an assignment (coursework that {{user}} hands in for a grade), even when asked: say so, and offer /read, quotes and questions instead.
 
 ## Reference checks (Starbuck, when the verify_ tools are available)
 
 - verify_check_manuscript checks that each cited work exists, matches its citation and was not retracted. Use it on {{user}}'s manuscripts and on your own reports before you deliver them.
 - Report Starbuck's results as Starbuck states them. Do not turn a Check into a Fail, or a Pass into "verified". Give the path of the report.
+- When Starbuck found no record for a reference (a Check with "not found by search"), say "not confirmed", not "wrong". The work may exist: books, theses, reports, archives and works in Portuguese are often not in Crossref or PubMed. Suggest a library catalogue or the publisher's page.
+- Report claim verdicts as sentences for {{user}} to check. Do not change the text or the citation because of a verdict. For a verdict of not supported, write "not supported by the passages I saw" and give the passage.
 - Claim support (level 4) only when {{user}} asks: verify_prepare_claims, then judge each claim from its passages only, then verify_record_claims with all verdicts. Quote the passage you rely on character for character. With an abstract only, answer cannot_assess for details an abstract would not report.

package/src/bench.ts

@@ -262,6 +262,46 @@ export function prf(pred: Set<string>, gold: Set<string>) {
 	return { tp, fp, fn };
 }
 
+/** A library item as the retrieval score needs it: the citekey and the title. */
+export interface LibraryItem {
+	citekey: string;
+	title: string;
+}
+
+function plainTitle(t: string): string {
+	return t.toLowerCase().replace(/[^\p{L}\p{N}]+/gu, " ").trim();
+}
+
+/**
+ * The library items that an answer names. An item is named by its citekey, or by the first 40 characters of its title
+ * (at least 15). A duplicate copy (citekey ending in -dup) counts as its original.
+ */
+export function itemsNamed(text: string, library: LibraryItem[]): Set<string> {
+	const plain = plainTitle(text);
+	const found = new Set<string>();
+	for (const item of library) {
+		const key = item.citekey.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+		const title = plainTitle(item.title).slice(0, 40).trim();
+		if (new RegExp(`(?<![A-Za-z0-9_])${key}(?![A-Za-z0-9_])`).test(text) || (title.length >= 15 && plain.includes(title))) {
+			found.add(item.citekey.replace(/-dup$/, ""));
+		}
+	}
+	return found;
+}
+
+/**
+ * Precision and recall of the items in a retrieval answer against the gold items. Items in `acceptable` are on the topic but
+ * outside the gold list: they count as neither hits nor errors. "(copy)" and "-dup" mark a duplicate and count as the original.
+ */
+export function retrievalScore(text: string, gold: string[], acceptable: string[], library: LibraryItem[]) {
+	const original = (k: string) => k.replace(/\s*\(copy\)\s*$/, "").replace(/-dup$/, "");
+	const goldSet = new Set(gold.map(original));
+	const skip = new Set(acceptable.map(original));
+	const said = new Set([...itemsNamed(text, library)].filter((k) => goldSet.has(k) || !skip.has(k)));
+	const { tp, fp, fn } = prf(said, goldSet);
+	return { ...f1(tp, fp, fn), tp, fp, fn };
+}
+
 function f1(tp: number, fp: number, fn: number) {
 	const p = tp + fp ? tp / (tp + fp) : 0;
 	const r = tp + fn ? tp / (tp + fn) : 0;

package/web/app.css

@@ -1,93 +1,97 @@
-/* Sub-Sub web view.
-   Type: IBM Plex Sans for the interface, IBM Plex Serif for replies, IBM Plex Mono for commands.
-   The fonts are local: the page's CSP allows no other origin. */
+/* Sub-Sub web view: the plate, at work.
+   A grey-green sheet, a lighter field, copperplate ink, and four washes as the only colour:
+   Prussian blue (the Researcher), madder (the Librarian), sap green (applied), gamboge (a preview).
+   Type: Atkinson Hyperlegible Next for the interface, Literata for replies and notes (true italics),
+   Atkinson Hyperlegible Mono for commands. The fonts are local: the page's CSP allows no other origin. */
 
-@font-face { font-family: "IBM Plex Sans"; src: url("/fonts/IBMPlexSans.woff2") format("woff2"); font-weight: 100 700; font-stretch: 75% 100%; font-display: swap; }
-@font-face { font-family: "IBM Plex Serif"; src: url("/fonts/IBMPlexSerif.woff2") format("woff2"); font-weight: 100 700; font-display: swap; }
-@font-face { font-family: "IBM Plex Mono"; src: url("/fonts/IBMPlexMono.woff2") format("woff2"); font-weight: 400; font-display: swap; }
+@font-face { font-family: "Literata"; src: url("/fonts/Literata.woff2") format("woff2"); font-weight: 400 700; font-style: normal; font-display: swap; }
+@font-face { font-family: "Literata"; src: url("/fonts/Literata-Italic.woff2") format("woff2"); font-weight: 400 700; font-style: italic; font-display: swap; }
+@font-face { font-family: "Atkinson Hyperlegible Next"; src: url("/fonts/AtkinsonHyperlegibleNext.woff2") format("woff2"); font-weight: 400 700; font-display: swap; }
+@font-face { font-family: "Atkinson Hyperlegible Mono"; src: url("/fonts/AtkinsonHyperlegibleMono.woff2") format("woff2"); font-weight: 400 600; font-display: swap; }
 
 /* ---------------------------------------------------------------- tokens */
 
 :root {
-	--sans: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
-	--serif: "IBM Plex Serif", Georgia, serif;
-	--mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
-
-	--bg: #f7f6f2;
-	--surface: #efede7;
-	--raised: #ffffff;
-	--text: #1c1b19;
-	--muted: #5f5c55;
-	--faint: #8a867d;
-	--rule: #e0ddd4;
-	--rule-strong: #c8c3b8;
-	--shadow: 0 1px 2px rgb(28 27 25 / 0.05), 0 8px 24px -12px rgb(28 27 25 / 0.18);
-
-	--researcher: #1d4f7c;
-	--researcher-soft: #e3ebf3;
-	--librarian: #a33b14;
-	--librarian-soft: #f5e6de;
-	--on-accent: #ffffff;
-
-	--add: #256b3b;
-	--add-soft: #e2f0e5;
-	--rem: #a8321d;
-	--rem-soft: #f7e3de;
-	--warn: #946412;
-
-	--radius: 6px;
-	--radius-lg: 10px;
+	--sans: "Atkinson Hyperlegible Next", system-ui, -apple-system, "Segoe UI", sans-serif;
+	--serif: "Literata", Georgia, serif;
+	--mono: "Atkinson Hyperlegible Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
+
+	--bg: #e9ece6;
+	--surface: #dfe3dc;
+	--raised: #f4f5f1;
+	--text: #16202a;
+	--muted: #44505b;
+	--faint: #5d6870;
+	--rule: #c6ccc6;
+	--rule-strong: #7d878e;
+
+	--researcher: #2c5d87;
+	--researcher-soft: #d8e2eb;
+	--librarian: #a8432d;
+	--librarian-soft: #f0ddd6;
+	--on-accent: #f4f5f1;
+
+	--add: #4f6a2e;
+	--add-soft: #dfe7d2;
+	--rem: #a8432d;
+	--rem-soft: #f0ddd6;
+	--warn: #86601a;
+	--warn-soft: #f2e5c6;
+
+	--radius: 2px;
+	--radius-lg: 3px;
 	--side-w: 17rem;
 	--measure: 46rem;
 }
 
+/* Dark: the steel plate. */
 @media (prefers-color-scheme: dark) {
 	:root:not([data-theme="light"]) {
-		--bg: #141413;
-		--surface: #1c1c1a;
-		--raised: #232320;
-		--text: #ebe8e1;
-		--muted: #a7a399;
-		--faint: #7b776f;
-		--rule: #2e2d2a;
-		--rule-strong: #45433e;
-		--shadow: 0 1px 2px rgb(0 0 0 / 0.3), 0 12px 32px -12px rgb(0 0 0 / 0.6);
-		--researcher: #7fb0de;
-		--researcher-soft: #1b2733;
-		--librarian: #e48a5f;
-		--librarian-soft: #33221a;
-		--on-accent: #141413;
-		--add: #7cc493;
-		--add-soft: #1a2c20;
-		--rem: #ec8a70;
-		--rem-soft: #36201b;
-		--warn: #d6a84e;
+		--bg: #12171c;
+		--surface: #0d1115;
+		--raised: #192128;
+		--text: #dce1de;
+		--muted: #a6b0b3;
+		--faint: #8d989d;
+		--rule: #2c363f;
+		--rule-strong: #66727c;
+		--researcher: #86b4da;
+		--researcher-soft: #1e3042;
+		--librarian: #e6866d;
+		--librarian-soft: #3d2620;
+		--on-accent: #12171c;
+		--add: #a3c078;
+		--add-soft: #253220;
+		--rem: #e6866d;
+		--rem-soft: #3d2620;
+		--warn: #e2b45a;
+		--warn-soft: #3a3019;
 	}
 }
 
 :root[data-theme="dark"] {
-	--bg: #141413;
-	--surface: #1c1c1a;
-	--raised: #232320;
-	--text: #ebe8e1;
-	--muted: #a7a399;
-	--faint: #7b776f;
-	--rule: #2e2d2a;
-	--rule-strong: #45433e;
-	--shadow: 0 1px 2px rgb(0 0 0 / 0.3), 0 12px 32px -12px rgb(0 0 0 / 0.6);
-	--researcher: #7fb0de;
-	--researcher-soft: #1b2733;
-	--librarian: #e48a5f;
-	--librarian-soft: #33221a;
-	--on-accent: #141413;
-	--add: #7cc493;
-	--add-soft: #1a2c20;
-	--rem: #ec8a70;
-	--rem-soft: #36201b;
-	--warn: #d6a84e;
-}
-
-/* The mode sets the accent: blue for the Researcher, rust for the Librarian. */
+	--bg: #12171c;
+	--surface: #0d1115;
+	--raised: #192128;
+	--text: #dce1de;
+	--muted: #a6b0b3;
+	--faint: #8d989d;
+	--rule: #2c363f;
+	--rule-strong: #66727c;
+	--researcher: #86b4da;
+	--researcher-soft: #1e3042;
+	--librarian: #e6866d;
+	--librarian-soft: #3d2620;
+	--on-accent: #12171c;
+	--add: #a3c078;
+	--add-soft: #253220;
+	--rem: #e6866d;
+	--rem-soft: #3d2620;
+	--warn: #e2b45a;
+	--warn-soft: #3a3019;
+}
+
+/* The mode sets the accent: Prussian blue for the Researcher, madder for the Librarian. */
 body { --accent: var(--researcher); --accent-soft: var(--researcher-soft); }
 body[data-mode="librarian"] { --accent: var(--librarian); --accent-soft: var(--librarian-soft); }
 
@@ -106,6 +110,8 @@ body {
 	-webkit-font-smoothing: antialiased;
 	-moz-osx-font-smoothing: grayscale;
 	text-rendering: optimizeLegibility;
+	caret-color: var(--accent);
+	scrollbar-color: var(--rule-strong) transparent;
 }
 
 button, input, select, textarea { font: inherit; color: inherit; }
@@ -116,7 +122,7 @@ svg { flex: none; }
 .visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
 [hidden] { display: none !important; }
 :focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
-::selection { background: var(--accent-soft); }
+::selection { background: var(--accent-soft); color: var(--text); }
 
 /* Icons drawn with strokes, at the size of the text. */
 .icon-btn svg, .new-btn svg, .brand .mark, .icon {
@@ -135,7 +141,7 @@ button { cursor: pointer; background: none; border: 1px solid transparent; borde
 button:disabled { opacity: 0.45; cursor: default; }
 
 .primary { background: var(--accent); border-color: var(--accent); color: var(--on-accent); font-weight: 550; }
-.primary:hover:not(:disabled) { filter: brightness(1.08); }
+.primary:hover:not(:disabled) { background: var(--text); border-color: var(--text); color: var(--bg); }
 .secondary { background: var(--raised); border-color: var(--rule-strong); }
 .secondary:hover:not(:disabled) { border-color: var(--text); }
 .ghost { color: var(--muted); }
@@ -215,9 +221,9 @@ select:hover { border-color: var(--rule-strong); }
 	display: flex;
 	align-items: center;
 	gap: 0.45rem;
+	font-family: var(--serif);
 	font-weight: 600;
-	font-size: 1.02rem;
-	letter-spacing: -0.01em;
+	font-size: 1.1rem;
 	margin-right: 0.25rem;
 }
 .brand .mark { color: var(--accent); }
@@ -225,24 +231,25 @@ select:hover { border-color: var(--rule-strong); }
 
 .modes {
 	display: inline-flex;
-	padding: 3px;
-	border-radius: 8px;
-	background: var(--surface);
-	border: 1px solid var(--rule);
+	border: 1px solid var(--rule-strong);
+	background: var(--raised);
 }
 .modes button {
-	padding: 0.28rem 0.8rem;
-	border-radius: 5px;
+	padding: 0.3rem 0.8rem;
+	border-radius: 0;
 	font-size: 0.86rem;
 	color: var(--muted);
 	border: 0;
 }
 .modes button:hover { color: var(--text); }
+/* Each mode keeps its own colour, chosen or not. */
+.modes button[data-mode="researcher"] { color: var(--researcher); }
+.modes button[data-mode="librarian"] { color: var(--librarian); }
 .modes button[aria-pressed="true"] {
-	background: var(--raised);
+	background: var(--accent-soft);
 	color: var(--accent);
 	font-weight: 600;
-	box-shadow: 0 1px 2px rgb(0 0 0 / 0.08), 0 0 0 1px var(--rule);
+	box-shadow: inset 0 -2px 0 var(--accent);
 }
 
 .status {
@@ -258,7 +265,6 @@ select:hover { border-color: var(--rule-strong); }
 	align-items: center;
 	gap: 0.45rem;
 	padding: 0.3rem 0.7rem;
-	border-radius: 999px;
 	font-size: 0.8rem;
 	color: var(--muted);
 	white-space: nowrap;
@@ -268,9 +274,10 @@ select:hover { border-color: var(--rule-strong); }
 	font-variant-numeric: tabular-nums;
 }
 .library-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--rule-strong); flex: none; }
-.library.reachable .library-dot { background: var(--add); box-shadow: 0 0 0 3px var(--add-soft); }
-.library.down { color: var(--rem); background: var(--rem-soft); font-weight: 550; }
-.library.down .library-dot { background: var(--rem); }
+.library.reachable .library-dot { background: var(--add); }
+/* Errors are drawn in ink, with a hollow mark and a word: madder means only the Librarian. */
+.library.down { color: var(--text); background: var(--surface); font-weight: 600; }
+.library.down .library-dot { background: none; border: 1.5px solid var(--text); }
 .library.checking .library-dot { background: var(--warn); animation: pulse 1.2s ease-in-out infinite; }
 
 /* ---------------------------------------------------------------- side panel */
@@ -289,11 +296,12 @@ select:hover { border-color: var(--rule-strong); }
 }
 
 .side h2 {
-	font-size: 0.7rem;
-	font-weight: 600;
+	font-family: var(--serif);
+	font-size: 0.98rem;
+	font-weight: 400;
+	font-variant-caps: all-small-caps;
 	letter-spacing: 0.08em;
-	text-transform: uppercase;
-	color: var(--faint);
+	color: var(--muted);
 	margin: 0 0 0.35rem;
 	padding: 0 0.5rem;
 }
@@ -306,10 +314,9 @@ select:hover { border-color: var(--rule-strong); }
 	padding: 0.5rem 0.7rem;
 	background: var(--raised);
 	border: 1px solid var(--rule);
-	font-weight: 550;
-	box-shadow: 0 1px 1px rgb(0 0 0 / 0.03);
+	font-weight: 600;
 }
-.new-btn:hover { border-color: var(--rule-strong); }
+.new-btn:hover { border-color: var(--text); }
 .new-btn svg { width: 16px; height: 16px; color: var(--accent); }
 
 .actions { display: flex; flex-direction: column; }
@@ -318,10 +325,10 @@ select:hover { border-color: var(--rule-strong); }
 	padding: 0.32rem 0.5rem;
 	font-size: 0.88rem;
 	color: var(--text);
-	border-radius: 5px;
+	border-radius: 0;
 }
 .actions button:hover { background: var(--bg); }
-.actions .group { margin: 0.55rem 0 0.15rem; padding: 0 0.5rem; font-size: 0.74rem; font-weight: 600; color: var(--muted); }
+.actions .group { margin: 0.6rem 0 0.15rem; padding: 0 0.5rem; font-family: var(--serif); font-style: italic; font-size: 0.86rem; color: var(--muted); }
 .actions .group:first-child { margin-top: 0; }
 
 .side .grow { flex: 1; display: flex; flex-direction: column; min-height: 8rem; }
@@ -345,10 +352,10 @@ select:hover { border-color: var(--rule-strong); }
 	text-align: left;
 	padding: 0.42rem 0.5rem;
 	display: block;
-	border-radius: 5px;
+	border-radius: 0;
 }
 .sessions button:hover { background: var(--bg); }
-.sessions .current button { background: var(--raised); box-shadow: inset 2px 0 0 var(--accent), 0 0 0 1px var(--rule); }
+.sessions .current button { background: var(--raised); outline: 1px solid var(--rule-strong); outline-offset: -1px; }
 .sessions .what {
 	display: -webkit-box;
 	-webkit-line-clamp: 2;
@@ -384,7 +391,7 @@ select:hover { border-color: var(--rule-strong); }
 	flex: none;
 	width: 28px;
 	height: 16px;
-	border-radius: 999px;
+	border-radius: var(--radius);
 	background: var(--rule-strong);
 	transition: background-color 0.15s ease;
 }
@@ -395,9 +402,8 @@ select:hover { border-color: var(--rule-strong); }
 	left: 2px;
 	width: 12px;
 	height: 12px;
-	border-radius: 50%;
-	background: #fff;
-	box-shadow: 0 1px 2px rgb(0 0 0 / 0.25);
+	border-radius: 1px;
+	background: var(--raised);
 	transition: transform 0.15s ease;
 }
 .switch input:checked + .track { background: var(--accent); }
@@ -416,7 +422,7 @@ body.layout-full { --measure: 72rem; }
 	margin: 0.9rem auto 0;
 	padding: 0.6rem 0.6rem 0.6rem 0.9rem;
 	border: 1px solid var(--rule);
-	border-left: 3px solid var(--warn);
+	border-top: 2px solid var(--warn);
 	border-radius: var(--radius);
 	background: var(--raised);
 	display: flex;
@@ -441,7 +447,7 @@ body.layout-full { --measure: 72rem; }
 .msg.user .bubble {
 	background: var(--raised);
 	border: 1px solid var(--rule);
-	border-radius: var(--radius-lg) var(--radius-lg) 3px var(--radius-lg);
+	border-radius: var(--radius-lg);
 	padding: 0.6rem 0.95rem;
 	max-width: min(36rem, 88%);
 	white-space: pre-wrap;
@@ -456,6 +462,7 @@ body.layout-full { --measure: 72rem; }
 	font-family: var(--serif);
 	font-size: 1.02rem;
 	line-height: 1.68;
+	font-variant-numeric: oldstyle-nums proportional-nums;
 	overflow-wrap: anywhere;
 }
 .md > :first-child { margin-top: 0; }
@@ -464,9 +471,8 @@ body.layout-full { --measure: 72rem; }
 .md li { margin: 0.2rem 0; }
 .md li::marker { color: var(--faint); }
 .md h1, .md h2, .md h3, .md h4 {
-	font-family: var(--sans);
+	font-family: var(--serif);
 	line-height: 1.3;
-	letter-spacing: -0.01em;
 	margin: 1.6rem 0 0.5rem;
 	font-weight: 600;
 }
@@ -484,14 +490,17 @@ body.layout-full { --measure: 72rem; }
 	padding: 0.1rem 0 0.1rem 1rem;
 	border-left: 2px solid var(--accent);
 	color: var(--muted);
+	font-style: italic;
 }
+.md blockquote code, .md blockquote a { font-style: normal; }
+/* A page link stays whole: (p. 12) never breaks after "p.". */
+.md a[href^="zotero://open-pdf"] { white-space: nowrap; }
 
 .md code {
 	font-family: var(--mono);
 	font-size: 0.84em;
 	background: var(--surface);
-	border: 1px solid var(--rule);
-	border-radius: 4px;
+	border-radius: var(--radius);
 	padding: 0.05em 0.32em;
 }
 
@@ -530,9 +539,8 @@ body.layout-full { --measure: 72rem; }
 .md-table-wrap {
 	overflow-x: auto;
 	margin: 1.1rem 0;
-	border: 1px solid var(--rule);
-	border-radius: var(--radius);
-	background: var(--raised);
+	border-top: 1.5px solid var(--text);
+	border-bottom: 1.5px solid var(--text);
 }
 .md table {
 	border-collapse: collapse;
@@ -540,18 +548,19 @@ body.layout-full { --measure: 72rem; }
 	font-family: var(--sans);
 	font-size: 0.86rem;
 	line-height: 1.45;
-	font-variant-numeric: tabular-nums;
+	font-variant-numeric: lining-nums tabular-nums;
 }
 .md th, .md td { padding: 0.5rem 0.75rem; text-align: left; vertical-align: top; border-bottom: 1px solid var(--rule); }
 .md tr:last-child td { border-bottom: 0; }
 .md th {
-	font-size: 0.72rem;
-	font-weight: 600;
-	letter-spacing: 0.04em;
-	text-transform: uppercase;
+	font-family: var(--serif);
+	font-size: 0.98rem;
+	font-weight: 400;
+	font-variant-caps: all-small-caps;
+	letter-spacing: 0.07em;
 	color: var(--muted);
 	white-space: nowrap;
-	background: var(--surface);
+	border-bottom-color: var(--text);
 }
 .md td:first-child { white-space: nowrap; }
 .md td code { white-space: nowrap; }
@@ -576,7 +585,7 @@ body.layout-full { --measure: 72rem; }
 	align-items: baseline;
 	padding: 0.28rem 0.55rem;
 	margin-left: -0.55rem;
-	border-radius: 5px;
+	border-radius: 0;
 	width: fit-content;
 	max-width: calc(100% + 0.55rem);
 }
@@ -594,8 +603,8 @@ body.layout-full { --measure: 72rem; }
 .tool .label { color: var(--text); white-space: nowrap; }
 .tool.running summary::before { background: var(--accent); animation: pulse 1.1s ease-in-out infinite; }
 .tool.done summary::before { background: var(--add); }
-.tool.error summary::before { background: var(--rem); }
-.tool.error .label { color: var(--rem); }
+.tool.error summary::before { background: none; border: 1.5px solid var(--text); }
+.tool.error .label { color: var(--text); font-weight: 600; }
 .tool .args { font-family: var(--mono); font-size: 0.74rem; color: var(--faint); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
 .tool[open] .args { white-space: normal; overflow-wrap: anywhere; }
 .tool pre {
@@ -631,8 +640,8 @@ body.layout-full { --measure: 72rem; }
 	white-space: pre-wrap;
 	overflow-wrap: anywhere;
 }
-.note.warning { border-left: 3px solid var(--warn); }
-.note.error { border-left: 3px solid var(--rem); }
+.note.warning { border-top: 2px solid var(--warn); }
+.note.error { border-top: 2px solid var(--text); }
 .note.mono { font-family: var(--mono); font-size: 0.76rem; line-height: 1.55; }
 .note pre { font-family: var(--mono); font-size: 0.74rem; white-space: pre-wrap; }
 .note button { margin-top: 0.5rem; }
@@ -640,7 +649,7 @@ body.layout-full { --measure: 72rem; }
 .note details { margin-top: 0.4rem; color: var(--muted); }
 .note details summary { cursor: pointer; font-size: 0.78rem; }
 .note details pre { margin: 0.3rem 0 0; overflow-wrap: anywhere; }
-.free-note { border-left: 3px solid var(--accent); padding-left: 0.6rem; }
+.free-note { border-top: 1px solid var(--accent); padding-top: 0.4rem; }
 
 .working {
 	margin-top: 1rem;
@@ -665,13 +674,18 @@ body.layout-full { --measure: 72rem; }
 /* Empty conversation. */
 .empty { padding-top: 11vh; }
 .empty .kicker {
-	font-size: 0.72rem;
-	font-weight: 600;
+	display: flex;
+	justify-content: space-between;
+	margin: 0 0 1.5rem;
+	padding-bottom: 0.3rem;
+	border-bottom: 1px solid var(--text);
+	font-family: var(--serif);
+	font-size: 1rem;
+	font-variant-caps: all-small-caps;
 	letter-spacing: 0.08em;
-	text-transform: uppercase;
 	color: var(--accent);
-	margin: 0 0 0.6rem;
 }
+.empty .kicker::before { content: "Sub-Sub"; color: var(--muted); order: -1; }
 .empty h1 {
 	font-family: var(--serif);
 	font-weight: 500;
@@ -681,17 +695,18 @@ body.layout-full { --measure: 72rem; }
 	margin: 0 0 0.6rem;
 }
 .empty .lede { color: var(--muted); max-width: 34rem; margin: 0 0 1.75rem; }
-.chips { display: grid; gap: 0.5rem; grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr)); }
+/* Suggestions: a short list of lines to start from, not a row of cards. */
+.chips { display: grid; max-width: 34rem; border-bottom: 1px solid var(--rule-strong); }
 .chips button {
 	text-align: left;
-	border: 1px solid var(--rule);
-	border-radius: var(--radius-lg);
-	background: var(--raised);
-	padding: 0.75rem 0.9rem;
-	font-size: 0.9rem;
+	border: 0;
+	border-top: 1px solid var(--rule-strong);
+	border-radius: 0;
+	padding: 0.6rem 0.25rem;
+	font-size: 0.95rem;
 	line-height: 1.4;
 }
-.chips button:hover { border-color: var(--accent); }
+.chips button:hover { background: var(--accent-soft); color: var(--accent); }
 
 body > p.empty { text-align: center; color: var(--muted); padding: 30vh 1rem 0; margin: 0; }
 
@@ -702,12 +717,11 @@ body > p.empty { text-align: center; color: var(--muted); padding: 30vh 1rem 0;
 	width: min(100%, var(--measure));
 	margin-inline: auto;
 	border: 1px solid var(--rule-strong);
-	border-radius: 12px;
+	border-radius: var(--radius-lg);
 	background: var(--raised);
-	box-shadow: var(--shadow);
 	transition: border-color 0.12s ease, box-shadow 0.12s ease;
 }
-.composer-box:focus-within { border-color: var(--accent); box-shadow: var(--shadow), 0 0 0 3px var(--accent-soft); }
+.composer-box:focus-within { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
 .composer textarea {
 	display: block;
 	width: 100%;
@@ -737,11 +751,10 @@ body > p.empty { text-align: center; color: var(--muted); padding: 30vh 1rem 0;
 	background: var(--raised);
 	border: 1px solid var(--rule-strong);
 	border-radius: var(--radius-lg);
-	box-shadow: var(--shadow);
 	padding: 0.3rem;
 	z-index: 5;
 }
-.suggest button, .suggest .hint-row { display: flex; align-items: baseline; gap: 0.6rem; width: 100%; text-align: left; padding: 0.38rem 0.55rem; border-radius: 5px; }
+.suggest button, .suggest .hint-row { display: flex; align-items: baseline; gap: 0.6rem; width: 100%; text-align: left; padding: 0.38rem 0.55rem; border-radius: 0; }
 .suggest button[aria-selected="true"], .suggest button:hover { background: var(--accent-soft); }
 .suggest .name { font-family: var(--mono); font-size: 0.8rem; color: var(--accent); white-space: nowrap; }
 .suggest .desc { color: var(--muted); font-size: 0.82rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@@ -749,32 +762,38 @@ body > p.empty { text-align: center; color: var(--muted); padding: 30vh 1rem 0;
 /* ---------------------------------------------------------------- dialogs */
 
 .modal {
-	border: 1px solid var(--rule-strong);
-	border-radius: 12px;
+	border: 1px solid var(--text);
+	border-radius: var(--radius-lg);
 	background: var(--raised);
 	color: var(--text);
 	padding: 1.4rem 1.5rem 1.25rem;
 	width: min(40rem, calc(100vw - 2rem));
 	max-height: calc(100dvh - 2rem);
 	overflow-y: auto;
-	box-shadow: 0 24px 60px -16px rgb(0 0 0 / 0.45);
 }
 .modal.wide { width: min(44rem, calc(100vw - 2rem)); }
-.modal::backdrop { background: rgb(20 20 19 / 0.45); backdrop-filter: blur(2px); }
+.modal::backdrop { background: rgb(18 23 28 / 0.5); }
 .modal[open] { animation: rise 0.16s ease-out; }
 @keyframes rise { from { opacity: 0; transform: translateY(6px); } }
 
+/* A preview is gamboge, and drawn dashed: nothing has happened yet. Its label is the dialog's
+   running head, with "Sub-Sub" opposite, as on the website's plates. */
 .modal-kicker {
-	margin: 0 0 0.3rem;
-	font-size: 0.7rem;
-	font-weight: 600;
+	display: flex;
+	justify-content: space-between;
+	margin: 0 0 0.9rem;
+	padding-bottom: 0.25rem;
+	border-bottom: 1px dashed var(--warn);
+	font-family: var(--serif);
+	font-size: 1rem;
+	font-variant-caps: all-small-caps;
 	letter-spacing: 0.08em;
-	text-transform: uppercase;
-	color: var(--accent);
+	color: var(--warn);
 }
+.modal-kicker::after { content: "Sub-Sub"; color: var(--muted); }
 .modal-kicker:empty { display: none; }
-.modal h2 { font-size: 1.2rem; font-weight: 600; letter-spacing: -0.01em; line-height: 1.3; margin: 0 0 0.3rem; overflow-wrap: anywhere; }
-.modal h3 { font-size: 0.72rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--faint); margin: 1.4rem 0 0.5rem; }
+.modal h2 { font-family: var(--serif); font-size: 1.25rem; font-weight: 600; line-height: 1.3; margin: 0 0 0.3rem; overflow-wrap: anywhere; }
+.modal h3 { font-family: var(--serif); font-size: 0.98rem; font-weight: 400; font-variant-caps: all-small-caps; letter-spacing: 0.08em; color: var(--muted); margin: 1.4rem 0 0.5rem; }
 .modal .hint { color: var(--muted); margin: 0 0 1rem; font-size: 0.88rem; }
 
 .preview {
@@ -784,16 +803,17 @@ body > p.empty { text-align: center; color: var(--muted); padding: 30vh 1rem 0;
 	white-space: pre-wrap;
 	overflow-wrap: anywhere;
 	background: var(--bg);
-	border: 1px solid var(--rule);
-	border-radius: var(--radius);
+	border: 1px dashed var(--warn);
+	border-radius: 0;
 	padding: 0.8rem 0.95rem;
 	max-height: 55vh;
 	overflow-y: auto;
 	margin: 0 0 1.1rem;
 }
-.preview .add, .preview .rem { border-radius: 3px; padding: 0.1em 0.3em; }
+.preview .add, .preview .rem { padding: 0.1em 0.3em; }
 .preview .add { color: var(--add); background: var(--add-soft); }
-.preview .rem { color: var(--rem); background: var(--rem-soft); }
+.preview .rem { color: var(--muted); background: none; text-decoration: line-through; text-decoration-thickness: 1px; }
+/* A removal is struck through: madder stays the Librarian's colour. */
 
 .modal-buttons { display: flex; justify-content: flex-end; align-items: center; gap: 0.5rem; flex-wrap: wrap; margin-top: 0.75rem; }
 .modal-buttons button { min-width: 5.5rem; }
@@ -846,7 +866,7 @@ body > p.empty { text-align: center; color: var(--muted); padding: 30vh 1rem 0;
 .models button { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.25rem 0.6rem; }
 .models .needs-key { opacity: 0.65; }
 .models .model-name { min-width: 0; overflow-wrap: anywhere; }
-.models .model-tag { font-family: var(--sans); font-size: 0.72rem; font-weight: 600; color: var(--accent); border: 1px solid currentColor; border-radius: 999px; padding: 0 0.45rem; }
+.models .model-tag { font-family: var(--sans); font-size: 0.72rem; font-weight: 600; color: var(--accent); border: 1px solid currentColor; padding: 0 0.45rem; }
 .models .model-why { font-family: var(--sans); font-size: 0.75rem; color: var(--muted); }
 
 /* ---------------------------------------------------------------- narrow screens */
@@ -873,7 +893,7 @@ body > p.empty { text-align: center; color: var(--muted); padding: 30vh 1rem 0;
 
 .items { list-style: none; margin: 0; padding: 0; max-height: 18rem; overflow-y: auto; }
 .items:empty { display: none; }
-.items > li { padding: 0.4rem 0.5rem; border-radius: 5px; }
+.items > li { padding: 0.4rem 0.5rem; }
 .items > li:hover { background: var(--bg); }
 .items > li.muted { font-size: 0.82rem; }
 .item-title { font-size: 0.86rem; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
@@ -883,7 +903,7 @@ body > p.empty { text-align: center; color: var(--muted); padding: 30vh 1rem 0;
 .item-actions button:hover, .item-actions a:hover { text-decoration: underline; text-underline-offset: 0.18em; }
 
 .sessions li { position: relative; }
-.session-tools { position: absolute; top: 0.3rem; right: 0.3rem; display: none; gap: 0.3rem; background: var(--raised); border-radius: 4px; }
+.session-tools { position: absolute; top: 0.3rem; right: 0.3rem; display: none; gap: 0.3rem; background: var(--raised); }
 .sessions li:hover .session-tools, .sessions li:focus-within .session-tools { display: flex; }
 /* No hover on a touch screen: the buttons stay under the conversation. */
 @media (hover: none) { .session-tools { display: flex; position: static; justify-content: flex-end; background: none; } }
@@ -902,14 +922,26 @@ body > p.empty { text-align: center; color: var(--muted); padding: 30vh 1rem 0;
 }
 .note-pane[hidden] { display: none; }
 .note-head { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.9rem; border-bottom: 1px solid var(--rule); }
-.note-name { flex: 1; min-width: 0; font-size: 0.84rem; font-weight: 550; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.note-name { flex: 1; min-width: 0; font-family: var(--mono); font-size: 0.8rem; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
 .note-pane > .search { margin: 0.6rem 0.9rem 0; width: auto; }
 .note-body { flex: 1; overflow-y: auto; padding: 0.9rem 1.1rem 1.5rem; }
 .note-body .front { font-size: 0.74rem; color: var(--muted); margin: 0 0 1rem; }
+/* What a note was written from, drawn by line: solid for the full text, dashed for the abstract,
+   dotted for the metadata. The same lines as on the website's Plate II. */
+.evidence { margin: 0 0 0.6rem; font-family: var(--mono); font-size: 0.8rem; color: var(--muted); }
+.evidence span { color: var(--text); padding-bottom: 2px; border-bottom: 2px solid var(--rule-strong); }
+.evidence.ev-full span { border-bottom-style: solid; border-color: var(--add); }
+.evidence.ev-abstract span { border-bottom-style: dashed; border-color: var(--warn); }
+.evidence.ev-meta span { border-bottom-style: dotted; border-color: var(--muted); }
+/* Reading mode: larger type, wider lines and spacing, a shorter measure. */
+.note-pane.reading .note-body { padding: 1.4rem 1.6rem 2.5rem; }
+.note-pane.reading .note-body .md { font-size: 1.2rem; line-height: 1.9; word-spacing: 0.06em; max-width: 36rem; }
+.note-pane.reading .note-body .md p, .note-pane.reading .note-body .md li { margin-block: 0.9rem; }
+#note-read[aria-pressed="true"] { color: var(--accent); text-decoration: underline; }
 .note-body .front summary { cursor: pointer; }
 .note-body .front pre { background: var(--bg); border: 1px solid var(--rule); border-radius: var(--radius); padding: 0.5rem 0.7rem; margin: 0.4rem 0 0; white-space: pre-wrap; overflow-wrap: anywhere; }
 .note-list { list-style: none; margin: 0; padding: 0; }
-.note-list button { width: 100%; text-align: left; padding: 0.4rem 0.5rem; border-radius: 5px; display: grid; gap: 0.1rem; }
+.note-list button { width: 100%; text-align: left; padding: 0.4rem 0.5rem; border-radius: 0; display: grid; gap: 0.1rem; }
 .note-list button:hover { background: var(--bg); }
 .note-list .rel { font-size: 0.84rem; overflow-wrap: anywhere; }
 .note-list .when { font-size: 0.72rem; color: var(--faint); }
@@ -930,7 +962,7 @@ a[data-note] { color: var(--accent); text-decoration: underline; text-decoration
 		width: min(19rem, 86vw);
 		transform: translateX(-100%);
 		transition: transform 0.2s ease;
-		box-shadow: var(--shadow);
+		border-right: 1px solid var(--text);
 	}
 	.side.open { transform: none; }
 	.app.note-open, .app.note-open.side-collapsed { grid-template-columns: minmax(0, 1fr); }
@@ -955,12 +987,12 @@ a[data-note] { color: var(--accent); text-decoration: underline; text-decoration
 }
 
 /* First run: what is still missing */
-.setup { margin-block: 1.4rem 1rem; padding: 0.9rem 1rem; border: 1px solid var(--rule); border-left: 3px solid var(--accent); border-radius: 6px; background: var(--raised); text-align: left; max-width: 40rem; }
-.setup h2 { margin: 0 0 0.5rem; font-size: 0.95rem; }
+.setup { margin-block: 1.4rem 1rem; padding: 0.9rem 1rem; border: 1px solid var(--rule-strong); border-top: 2px solid var(--accent); background: var(--raised); text-align: left; max-width: 40rem; }
+.setup h2 { margin: 0 0 0.5rem; font-family: var(--serif); font-size: 1.02rem; }
 .setup ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.55rem; }
 .setup li { display: grid; grid-template-columns: 4.5rem 1fr auto; gap: 0.6rem; align-items: start; font-size: 0.88rem; line-height: 1.45; }
 .setup li > * { min-width: 0; }
-.setup .mark { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.05em; padding-top: 0.15rem; color: var(--muted); }
-.setup li.todo .mark { color: var(--rem); }
+.setup .mark { font-family: var(--serif); font-size: 0.95rem; font-variant-caps: all-small-caps; letter-spacing: 0.07em; color: var(--muted); }
+.setup li.todo .mark { color: var(--warn); }
 .setup li.ok .step-text { color: var(--muted); }
 @media (max-width: 560px) { .setup li { grid-template-columns: 1fr; gap: 0.2rem; } }

package/web/app.js

@@ -429,6 +429,7 @@ async function showNoteList() {
 	$("note-name").textContent = t("notes");
 	$("note-back").hidden = true;
 	$("note-app").hidden = true;
+	$("note-read").hidden = true;
 	$("note-filter").hidden = false;
 	showPane(true);
 	try {
@@ -461,7 +462,15 @@ async function openNote(path) {
 	noteDir = "";
 	attachCopyButtons(content);
 	attachTableButtons(content, data.name.replace(/\.md$/i, ""));
-	$("note-body").replaceChildren(front ? el("details", { class: "front" }, el("summary", { text: t("properties") }), el("pre", { text: front[1] })) : "", content);
+	// The evidence line: what the note was written from, drawn solid, dashed or dotted.
+	const evidence = front && /^evidence:\s*(.+?)\s*$/m.exec(front[1])?.[1];
+	const kind = evidence && (/full/i.test(evidence) ? "ev-full" : /abstract/i.test(evidence) ? "ev-abstract" : /metadata/i.test(evidence) ? "ev-meta" : "");
+	$("note-body").replaceChildren(
+		evidence ? el("p", { class: `evidence ${kind}` }, "evidence: ", el("span", { text: evidence })) : "",
+		front ? el("details", { class: "front" }, el("summary", { text: t("properties") }), el("pre", { text: front[1] })) : "",
+		content,
+	);
+	$("note-read").hidden = false;
 	$("note-body").scrollTop = 0;
 	showPane(true);
 }
@@ -1513,6 +1522,14 @@ $("library-search").addEventListener("input", searchLibrary);
 $("notes-btn").addEventListener("click", () => ($("note-pane").hidden ? showNoteList() : showPane(false)));
 $("note-back").addEventListener("click", showNoteList);
 $("note-close").addEventListener("click", () => showPane(false));
+// Reading mode for notes: larger type and wider spacing, remembered on this computer.
+function setReading(on) {
+	$("note-pane").classList.toggle("reading", on);
+	$("note-read").setAttribute("aria-pressed", String(on));
+	localStorage.setItem("subsub-reading", String(on));
+}
+$("note-read").addEventListener("click", () => setReading(!$("note-pane").classList.contains("reading")));
+setReading(localStorage.getItem("subsub-reading") === "true");
 $("note-app").addEventListener("click", () => noteShown && api("/api/open", { path: noteShown.path }).catch((err) => note(err.message, "warning")));
 $("note-filter").addEventListener("input", renderNoteList);
 $("note-pane").addEventListener("keydown", (e) => {

package/web/i18n.js

@@ -109,6 +109,8 @@ export const STRINGS = {
 		notesHint: "The notes in your Sub-Sub folder",
 		allNotes: "All notes",
 		properties: "Properties",
+		readingMode: "Reading mode",
+		readingModeHint: "Larger type and wider line spacing for the note",
 		downloadCsv: "Download CSV",
 		filterNotes: "Filter notes",
 		noNotes: "No notes yet.",
@@ -249,6 +251,8 @@ export const STRINGS = {
 		notesHint: "As notas da sua pasta do Sub-Sub",
 		allNotes: "Todas as notas",
 		properties: "Propriedades",
+		readingMode: "Modo de leitura",
+		readingModeHint: "Letra maior e mais espaço entre linhas na nota",
 		downloadCsv: "Transferir CSV",
 		filterNotes: "Filtrar notas",
 		noNotes: "Ainda não há notas.",

package/web/icon.svg

@@ -1,6 +1,6 @@
 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32">
-  <rect width="32" height="32" rx="7" fill="#1d4f7c"/>
-  <rect x="5.5" y="8" width="21" height="16" rx="1.5" fill="#f7f6f2"/>
-  <path d="M9 12.5h8M9 16h14" stroke="#1d4f7c" stroke-width="1.6" stroke-linecap="round"/>
-  <circle cx="16" cy="20.3" r="1.5" fill="#1d4f7c"/>
+  <rect width="32" height="32" rx="7" fill="#2c5d87"/>
+  <rect x="5.5" y="8" width="21" height="16" rx="1.5" fill="#f4f5f1"/>
+  <path d="M9 12.5h8M9 16h14" stroke="#2c5d87" stroke-width="1.6" stroke-linecap="round"/>
+  <circle cx="16" cy="20.3" r="1.5" fill="#2c5d87"/>
 </svg>

package/web/index.html

@@ -6,7 +6,7 @@
 	<meta name="color-scheme" content="light dark">
 	<title>Sub-Sub</title>
 	<link rel="icon" href="/icon.svg" type="image/svg+xml">
-	<link rel="preload" href="/fonts/IBMPlexSans.woff2" as="font" type="font/woff2" crossorigin>
+	<link rel="preload" href="/fonts/AtkinsonHyperlegibleNext.woff2" as="font" type="font/woff2" crossorigin>
 	<link rel="stylesheet" href="/app.css">
 	<script type="module" src="/app.js"></script>
 </head>
@@ -86,6 +86,7 @@
 			<div class="note-head">
 				<button type="button" class="link-btn" id="note-back" data-i18n="allNotes">All notes</button>
 				<span class="note-name" id="note-name"></span>
+				<button type="button" class="link-btn" id="note-read" aria-pressed="false" data-i18n="readingMode" data-i18n-title="readingModeHint" hidden>Reading mode</button>
 				<button type="button" class="link-btn" id="note-app" data-i18n="openInApp" hidden>Open in app</button>
 				<button type="button" class="link-btn" id="note-close" data-i18n="close">Close</button>
 			</div>