A host from the web site; the same page kept once; deleting from the Notebooks chooser

From the development repository at 299f73d, 2026-10-11:
hosting from the site documented; a page loaded from a notebook and left
unchanged is not kept again; notebooks and pages are deleted from the
chooser, to the system's Trash (--trash); the Notebooks button.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>

client/kokkoja.css

@@ -404,6 +404,23 @@ h2 {
 .chooser header { display: flex; align-items: center; }
 .chooser header h2 { flex: 1; margin: 0; }
 .chooser header button { width: 2rem; padding: 0.2rem 0; font-size: 1.1rem; line-height: 1; }
+/* The notebook chooser's title takes the width of the notebook column,
+   so that the Delete button starts where the page cards start, away
+   from the close mark, which stays at the right (Andy, 2026-10-11).
+   The button is shaped like the notebook buttons on the left, and the
+   header is as tall as such a button (its line box, padding and
+   borders) whether the button is shown or not, so that the body does
+   not move when it appears. */
+#notebook_chooser header { min-height: calc(1lh + 0.7rem + 2px); }
+#notebook_chooser header h2 { flex: 0 0 13rem; }
+#notebook_chooser header #chooser_close { margin-left: auto; }
+.chooser header button.delete {
+  width: auto;
+  padding: 0.35rem 0.8rem;
+  font-size: inherit;
+  line-height: normal;
+  color: #b42318;
+}
 
 .chooser_body {
   display: flex;
@@ -420,7 +437,29 @@ h2 {
   overflow: auto;
 }
 
-.chooser_notebooks button { text-align: left; }
+.chooser_notebooks button.notebook_pick { flex: 1; min-width: 0; text-align: left; }
+
+/* Rows and cards carry a mark, ×, for deletion; marked, they dim. */
+.notebook_row { display: flex; gap: 0.3rem; align-items: stretch; }
+.notebook_row.marked button.notebook_pick, .page_slot.marked .page_card { opacity: 0.45; }
+.page_slot { position: relative; display: flex; }
+.page_slot .page_card { flex: 1; }
+button.mark {
+  width: 1.6rem;
+  padding: 0;
+  font-size: 1.1rem;
+  line-height: 1;
+  color: var(--muted);
+}
+.page_slot button.mark {
+  position: absolute;
+  top: 0.3rem;
+  right: 0.3rem;
+  height: 1.6rem;
+  background: white;
+}
+button.mark[aria-pressed="true"] { color: #b42318; }
+button.mark.unavailable { opacity: 0.4; }
 
 .chooser_pages {
   display: grid;