Write the notes in an app, a school day at a time

The notes existed but there was nowhere to write them: a CLI command on a
laptop, a tool call through Claude, or a file in a Docker volume. None of
those is reachable from a phone in a lesson, which is where notes are
actually taken.

So: `/app`, served only when WEB_PASSWORD is set. A login, the day's
notes, and a settings page for the Schulcloud token — the one surface
here meant for a person rather than a program.

The shape follows how the notes are written: one note per school day,
one `##` heading per lesson, prose and lists and tables beneath. That
turns out to be the design decision that matters, twice over.

First, it is what lets WebUntis earn its keep. Opening a day with no
note fills in that day's lessons — numbered, with times, teacher and
room, cancellations dropped and substitutions marked. Retyping the
timetable is exactly the work the second upstream exists to avoid, and
"Stunden ergänzen" tops up a note started before the day ended without
touching what is already written.

Second, it changes how notes are indexed. A day note is indexed per
lesson, not whole: search answers "my own note, Deutsch, 18.09.2026"
rather than "my own note, Friday", and `list_notes subject=Deutsch`
finds a day whose frontmatter names no subject at all. Indexed whole,
every hit would read as a weekday and "what did we do in Deutsch" would
match notes whose other five lessons were something else. `lessonHeading`
and `subjectFromHeading` are a loop — the app writes the heading, the
indexer reads the subject back out — and a test holds them to it.

Notes taken in a lesson cannot be retaken, so the editor is built
around not losing them: autosave, every keystroke mirrored to local
storage, a save when the phone locks, and a fallback to the local copy
when the request never arrives. A save that would overwrite a version
the editor never saw is refused and the choice handed back — the notes
folder is synced and open in more than one place, and a phone must not
silently win over a laptop. `replaceNote` is separate from `writeNote`
for that reason: never-overwrite is right for `add_note` and exactly
wrong for an editor.

WEB_PASSWORD is the first credential here a human types, so it is the
first that can be guessed: scrypt at startup, never stored or compared
in the clear, per-address rate limiting — which is not decoration, since
the scrypt cost is itself a denial-of-service vector without it. The
session is a signed HttpOnly SameSite=Strict cookie whose key is derived
from the password, so changing it logs everyone out and there is no
second secret to keep. It opens /api, because a session is the user, and
never /mcp, because nothing in a browser speaks MCP.

Also here, because the app made them matter: frontmatter now reads the
indented `- item` list form editors write, so an Obsidian vault
round-trips its tags; and a four-digit folder is a filing scheme, not a
subject, so `2026/` does not file a school year under one.

357 tests; 106/107 smoke against the local instance, the one failure
being the H5P service that instance does not run.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

src/http/app/app.css

@@ -0,0 +1,188 @@
+/*
+ * The app is used with one thumb, in a lesson, on a phone that may be at 10%.
+ * Everything below follows from that: one column, large touch targets, the
+ * editor taking every pixel that is not navigation, and no webfont — the CSP
+ * forbids outside resources anyway, and a font that has not loaded is a blank
+ * screen in a classroom with no signal.
+ */
+
+:root {
+	color-scheme: light dark;
+	--bg: #ffffff;
+	--fg: #1f2328;
+	--muted: #656d76;
+	--line: #d0d7de;
+	--accent: #1f6feb;
+	--ok: #1a7f37;
+	--error: #cf222e;
+	--warn: #9a6700;
+	--card: #f6f8fa;
+	font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
+}
+
+@media (prefers-color-scheme: dark) {
+	:root {
+		--bg: #0d1117;
+		--fg: #e6edf3;
+		--muted: #8b949e;
+		--line: #30363d;
+		--accent: #4493f8;
+		--ok: #3fb950;
+		--error: #f85149;
+		--warn: #d29922;
+		--card: #161b22;
+	}
+}
+
+* { box-sizing: border-box; }
+
+body {
+	margin: 0;
+	background: var(--bg);
+	color: var(--fg);
+	/* Fills the viewport on a phone, where 100vh lies about the toolbar. */
+	min-height: 100dvh;
+	display: flex;
+	flex-direction: column;
+	padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
+}
+
+.screen { display: flex; flex-direction: column; flex: 1; min-height: 0; }
+[hidden] { display: none !important; }
+
+/* --- chrome ------------------------------------------------------------ */
+
+header { border-bottom: 1px solid var(--line); }
+
+.tabs { display: flex; }
+
+.tab {
+	flex: 1;
+	padding: 0.9rem 0.5rem;
+	border: 0;
+	border-bottom: 2px solid transparent;
+	background: none;
+	color: var(--muted);
+	font: inherit;
+	font-weight: 600;
+	cursor: pointer;
+}
+
+.tab[aria-current="page"] { color: var(--fg); border-bottom-color: var(--accent); }
+
+.view { flex: 1; min-height: 0; display: flex; flex-direction: column; padding: 0.75rem; gap: 0.5rem; }
+
+/* --- the day bar ------------------------------------------------------- */
+
+.daybar { display: flex; align-items: center; gap: 0.5rem; }
+
+.daybar button {
+	flex: 0 0 auto;
+	width: 2.75rem;
+	height: 2.75rem;
+	font-size: 1.5rem;
+	line-height: 1;
+	border: 1px solid var(--line);
+	border-radius: 0.5rem;
+	background: var(--card);
+	color: var(--fg);
+	cursor: pointer;
+}
+
+.daybar-centre { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 0.15rem; }
+.daybar-centre strong { font-size: 1.05rem; }
+.daybar-centre input { border: 0; background: none; color: var(--muted); font: inherit; font-size: 0.85rem; }
+
+/* --- the editor -------------------------------------------------------- */
+
+textarea {
+	flex: 1;
+	min-height: 12rem;
+	width: 100%;
+	padding: 0.75rem;
+	border: 1px solid var(--line);
+	border-radius: 0.5rem;
+	background: var(--bg);
+	color: var(--fg);
+	/* Monospace: the notes are Markdown, and headings and list markers have to
+	   line up to be read back as structure. */
+	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
+	font-size: 0.95rem;
+	line-height: 1.5;
+	resize: none;
+}
+
+.actions { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; }
+
+button {
+	padding: 0.65rem 1rem;
+	border: 1px solid var(--line);
+	border-radius: 0.5rem;
+	background: var(--card);
+	color: var(--fg);
+	font: inherit;
+	cursor: pointer;
+}
+
+button:disabled { opacity: 0.5; cursor: default; }
+
+#save, #login-form button, #token-form button {
+	background: var(--accent);
+	border-color: var(--accent);
+	color: #ffffff;
+	font-weight: 600;
+}
+
+/* --- text -------------------------------------------------------------- */
+
+.status { margin: 0; color: var(--muted); font-size: 0.85rem; min-height: 1.2em; }
+.hint { color: var(--muted); font-size: 0.85rem; }
+.ok { color: var(--ok); }
+.error { color: var(--error); margin: 0.5rem 0 0; }
+.warn { color: var(--warn); }
+
+.conflict {
+	margin: 0;
+	padding: 0.6rem 0.75rem;
+	border: 1px solid var(--warn);
+	border-radius: 0.5rem;
+	color: var(--warn);
+	font-size: 0.9rem;
+}
+
+/* --- cards (login, settings) ------------------------------------------- */
+
+.card {
+	margin: 0.75rem;
+	padding: 1rem;
+	border: 1px solid var(--line);
+	border-radius: 0.75rem;
+	background: var(--card);
+}
+
+.card h1, .card h2 { margin-top: 0; font-size: 1.15rem; }
+
+label { display: block; margin: 0.75rem 0 0.25rem; font-weight: 600; font-size: 0.9rem; }
+
+input[type="password"], input[type="text"] {
+	width: 100%;
+	padding: 0.7rem;
+	border: 1px solid var(--line);
+	border-radius: 0.5rem;
+	background: var(--bg);
+	color: var(--fg);
+	font: inherit;
+}
+
+#login { justify-content: center; }
+#login .card { width: min(24rem, 100%); align-self: center; }
+#login button { width: 100%; margin-top: 1rem; }
+
+.steps { margin: 0.5rem 0; padding-left: 1.1rem; color: var(--muted); font-size: 0.85rem; line-height: 1.5; }
+.steps code { font-family: ui-monospace, monospace; }
+
+#token-form button, #logout { margin-top: 0.75rem; }
+
+dl { margin: 0; display: grid; grid-template-columns: auto 1fr; gap: 0.35rem 0.75rem; font-size: 0.9rem; }
+dt { color: var(--muted); }
+dd { margin: 0; }