` cannot swallow the page chrome. A suppressed element (`script`, `style`, `svg`, …) is dropped with its body; any other unknown tag is escaped and stays visible. `markdownHtml: false` restores escape-only rendering. The page CSP keeps the rest inert. - **Highlighting safety.** The highlighter escapes every literal before it wraps it in a token span, so a code file's content cannot inject markup or attributes; only the fixed `tok-*` class names reach the page. - **Event stream.** `/events` is a `GET` on the same loopback server, behind the same method and `Host` checks, and it only reads: the frame is the branch, the change paths and their revision, an uptime, and a request count, all of which the page it feeds already renders. It carries no page policy (`text/event-stream` is not a document), sends `Cache-Control: no-store`, and cannot be cached or replayed. A tick runs only while a page is attached, and the timer is `unref`ed, so an idle server does no work and a forgotten tab cannot hold the process open. At most eight pages may attach; a ninth is answered `204`, the one status an event source never reconnects after. - **Caps.** `maxFileBytes` (inline rendering), `maxTextLines` (rendered lines), `maxThumbBytes` (thumbnails), and `maxDirEntries` (listings) bound every read. - **Git reads.** The header chip and the diff view run read-only git (`rev-parse`, `status --porcelain=v1 -z`, `diff --stat`, `diff -U`) with a timeout and a short cache; any failure simply omits the chip or the diff. A per-file diff sets `GIT_LITERAL_PATHSPECS=1`, so a filename containing glob characters is matched literally. - **Read-only.** Nothing is ever written. ## The page The page is server-rendered HTML with an inline style block and inline SVG icons, progressively enhanced by one first-party script (`client.ts`). Each page names its own subject in the tab — `browse · `, `browse · ` for a file, the ` · ` shape the kit's `tabTitle` gives every served page — and links the brand mark as an SVG data URI, in the appearance the system is in. A folder folds from its twisty, and a `fold all` / `expand all` button beside the filter folds the whole tree at once. The tree scrolls in its own pane with quick open and the filter pinned above it; below 860px it collapses into a `Files` disclosure above the listing. Below 820px the served folder's path takes a row of its own and keeps its last segments, an ellipsis cutting the leading directories; below 520px the card's controls hold one scrolling row above the file instead of stacking. A hairline progress bar tracks whichever column is scrolling (the card body for a file or diff, the main column otherwise), and the served folder names the root page. The sidebar is a `

` whose content wrapper has no definite height, so the panel fills it absolutely and the tree flexes inside. The filter hides non-matching rows while keeping ancestors, and disclosure triangles lazily fetch `/api/tree`. Without JavaScript the page still browses and renders Markdown, and the JS-only controls (filter, disclosure, actions, quick open) are hidden; the sort buttons lose their pointer so they do not look live. The page palette is the shared Bytefly web theme (`lib/web/tokens.ts`), derived from the `bytefly-dark`/`bytefly-light` terminal themes. It follows `prefers-color-scheme` until an explicit choice sets `data-theme` on the root: `/theme.js` applies the saved choice in the head before first paint, and the header toggle flips and stores it (`pi-web-theme` in `localStorage`, the key shared with plan's review page). The page is keyboard-first, and the tree is one tab stop rather than two per folder: | Key | What it does in the tree | |---|---| | `↑` / `↓` | Move between the rows on screen | | `→` | Open a folder (reading its children first if needed), or enter it | | `←` | Close the folder, or step out to its parent | | `Space` | Open or close the focused folder | | `Enter` | Follow the focused row's link | | `Home` / `End` | First or last row on screen | The folder's own link carries `aria-expanded`, so a screen reader hears its state once; the twisty beside it is a pointer control kept out of the tab order. A mouse click moves the tab stop to that row, so `Tab` comes back to where you were. Elsewhere the page keeps its own keys: `/` or `Ctrl`/`Cmd`+`K` for quick open, `-` to fold, `u` to wrap, `r` for raw Markdown, `y` to copy a line reference, `n`/`p` between diff hunks, and `?` for the sheet, whose dialog traps `Tab` and returns focus to its button. Printing is supported: the paper gets the light palette whatever the screen is showing, the chrome and the tree are dropped, and a file or diff prints whole instead of inside its scroll box. ## Previews Text, rendered Markdown, images (thumbnails), and binary/over-size download cards, with per-language icons. Broken thumbnails fall back to the category icon. Code files render with keywords, strings, numbers, and comments coloured, in the dark and light palettes: JavaScript/TypeScript (`js`, `mjs`, `cjs`, `jsx`, `ts`, `mts`, `cts`, `tsx`), JSON, CSS (`css`, `scss`, `sass`, `less`), HTML/XML and template components (`html`, `htm`, `xml`, `vue`, `svelte`), shell (`sh`, `bash`, `zsh`), Python (`py`, `pyw`, `pyi`), Java, YAML (`yaml`, `yml`), and SQL. Other text types stay plain. `lib/highlight.ts` is a first-party, escape-first tokenizer for those file types. `detectLanguage` maps a filename to a tokenizer and an unmapped type stays plain. `highlightLines` walks the whole file, so block comments, template literals, open HTML tags, CSS brace depth, and Python triple-quoted strings carry across lines; every literal is escaped with the same `escapeHtml` the plain view uses, and a line's markup is only the fixed `tok-*` classes the stylesheet colours. It backs both the plain text view and fenced code blocks in the rendered Markdown view. The Name / Size / Modified headers sort the current directory, directories first, and the choice is remembered per browser. Below 520px the Modified column is dropped, so the name keeps the row instead of truncating to the first few characters. Copy a file's root-relative path or its contents, copy a `path:12-30` reference for the lines you selected, and toggle line wrapping for text and raw views. ## Markdown preview `.md`, `.markdown`, `.mdown`, `.mkd`, and `.mkdn` files render as headings, lists, tables, code, inline and reference links, bare-URL autolinks, and images, with a one-click **raw** view (`?raw=1`). The page fills the card, so the scroll bar sits at the card edge; headings, prose, and images keep a centred reading measure of at most 1012px. Code blocks stay inside that column; tables start at it and are never wider than it, so every table in a document ends on the same line as the prose above it, and one wider than the pane scrolls, its right edge fading until the last column is reached. Columns size to the content, and in a pane narrower than 600px they stop shrinking: each cell keeps a readable width, so the table scrolls instead of stacking one word per line. A task list's checkbox is drawn by the page, so a done item carries the success colour in both themes. Named and numeric character references are decoded. Headings get stable anchor ids, so in-document `#anchor` links work. Fenced code blocks are syntax-highlighted when the fence names a supported language. A README's raw HTML is re-emitted through an allowlist (`

`, `

`, tables, ``, images), so it renders without becoming an injection path. Raw HTML in the source is escaped, never executed, and external images are shown as links rather than fetched. `markdownHtml: false` restores escape-only rendering; `markdown: false` falls back to the plain-text view. `markdown.ts` is a first-party, escape-first renderer for the constructs that show up in repository READMEs. It emits only a known tag set, escapes every literal character, allowlists URL schemes (dropping `javascript:`/`data:`), rewrites local links and images to `/view`/`/raw`, and renders an external image as a link instead of loading it (the page CSP is `img-src 'self' data:`). Link reference definitions (`[id]: url`), including the full `[text][id]`, collapsed `[text][]`, and shortcut `[text]` forms, and numeric and common named character references are resolved. The Rendered/Raw switch is a server-side `?raw=1` link, so it works without JavaScript. Headings are demoted one level so the card title stays the page's only `h1`, and each gets a slug `id` (unique in the document). A fenced code block whose info string names a supported language is highlighted through `lib/highlight.ts` (either an extension or a long-form alias, `fenceLanguage`); an absent or unknown language stays plain. A line that starts with an allowed block tag (``, ``, ``, ``, …), a comment, or a closing tag opens an HTML block that runs to the next blank line; text inside it stays text, and a suppressed tag (`