Darker tag code badges, in the same font as the severity badges

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>

.env.example

@@ -4,11 +4,16 @@ HTTP_PORT=8080
 TZ=Europe/Paris
 # How long logs are kept (e.g. 7d, 30d, 12w, 1y)
 RETENTION=30d
-# Web UI authentication: local (HTTP Basic below, or none) or oidc (OpenID Connect provider)
+# Web UI authentication: local (login page with the account below, or none) or oidc (OpenID Connect provider)
 AUTH_MODE=local
 # local mode: user and password (empty = no authentication)
 AUTH_USER=
 AUTH_PASS=
+# local mode: PNG logo shown on the login page, path inside the container (empty = no logo).
+# Mount the file in docker-compose.yml, e.g. ./logo.png:/config/logo.png:ro, then LOGIN_LOGO=/config/logo.png
+LOGIN_LOGO=
+# Session lifetime, both modes (e.g. 8h, 24h)
+SESSION_TTL=12h
 # oidc mode: issuer URL exactly as the provider announces it
 # (Keycloak: https://sso.example.org/realms/<realm>, Authentik: https://auth.example.org/application/o/<slug>/)
 OIDC_ISSUER=
@@ -16,9 +21,8 @@ OIDC_CLIENT_ID=
 OIDC_CLIENT_SECRET=
 # Callback URL of logstream, to register in the provider (path free, /auth/callback recommended)
 OIDC_REDIRECT_URL=https://logs.example.org/auth/callback
-# Requested scopes (openid is always added) and session lifetime (e.g. 8h, 24h)
+# Requested scopes (openid is always added)
 OIDC_SCOPES=openid profile email
-OIDC_SESSION_TTL=12h
 # Reverse DNS: show host names instead of IP addresses (on/off)
 RDNS=on
 # DNS server used for reverse lookups (e.g. your router: 192.168.1.1). Empty = system resolver

README.fr.md

@@ -78,8 +78,8 @@ par exemple `error AND host:web-01`, `app:~"ssh|nginx"` ou `* | stats by (host)
 Le direct est désactivé dans ce mode.
 
 Chaque ligne affiche, de gauche à droite : l'**heure de réception** (horloge du serveur),
-l'horodatage trouvé dans le message lui-même (`msg_time`), la sévérité, l'hôte, l'application
-et le message. Un clic sur un hôte ou une application filtre dessus.
+l'horodatage trouvé dans le message lui-même (`msg_time`), la sévérité, l'hôte, l'application,
+les codes des tags trouvés et le message. Un clic sur un hôte ou une application filtre dessus.
 
 Les logs sont indexés, recherchés et triés par **heure de réception** : les équipements dont
 l'horloge est fausse (par exemple des points d'accès dont le NTP échoue) apparaissent quand même
@@ -228,17 +228,32 @@ couleur, est mémorisé par navigateur.
   Tags par défaut (pastel) : `warning` (orange), `error` (rouge), `ok` (vert). Les tags par
   défaut qui utilisent encore les couleurs des versions précédentes passent automatiquement aux
   couleurs pastel.
+  Le menu *+ Préréglage…* ajoute des tags tout faits pour les logs d'accès HTTP/HTTPS (nginx et
+  Apache common/combined, Traefik CLF et JSON, Caddy JSON, HAProxy httplog) : codes de statut
+  (2xx vert, 3xx bleu, 4xx orange, 5xx rouge), méthodes, sondes et attaques (`wp-login.php`,
+  `/.env`, `../`…), robots et scripts, erreurs TLS et proxy. Les tags déjà présents ne sont pas
+  ajoutés en double, et les tags ajoutés se modifient comme les autres. Dans une expression
+  régulière, un groupe nommé `hl` (`(?<hl>…)`) ne colore que cette partie de la correspondance :
+  les préréglages s'en servent pour colorer le code de statut ou la méthode, pas le texte autour.
+  Chaque tag reçoit un code à deux chiffres (`01`, `02`…) attribué par le serveur : il reste
+  attaché au tag jusqu'à sa suppression (les tags créés par les versions précédentes en reçoivent
+  un aussi). La colonne *Filtres* de la liste affiche, en badges gris, les codes des tags actifs
+  trouvés dans chaque message ; elle a la place pour 3, au-delà elle en affiche 2 et `+N`, et
+  l'infobulle les liste tous.
 - **Interface**
   - *Thème* : Système (suit la préférence de l'ordinateur ou du téléphone), Clair ou Sombre. Le
     bouton soleil/lune de l'en-tête bascule entre clair et sombre.
-  - *Affichage des logs* : taille du texte (très petite, petite, moyenne, grande) et police :
-    la police monospace du système, ou l'une des 12 polices libres conçues pour le texte dense
+  - *Affichage des logs* : taille du texte (très petite, petite, moyenne, grande), densité
+    (normale, ou compacte pour afficher environ 50 % de lignes en plus à l'écran) et police :
+    la police monospace du système, l'une des 3 polices étroites intégrées, servies par
+    LogStream lui-même et utilisables hors ligne (Inconsolata Condensed, la plus étroite,
+    Iosevka et Ubuntu Mono), ou l'une des 11 polices libres conçues pour le texte dense
     (JetBrains Mono, Fira Code, Source Code Pro, IBM Plex Mono, Cascadia Code, Roboto Mono,
-    Ubuntu Mono, Inconsolata, Red Hat Mono, Noto Sans Mono, Victor Mono, DM Mono). Elles sont
+    Inconsolata, Red Hat Mono, Noto Sans Mono, Victor Mono, DM Mono). Ces 11 polices sont
     chargées par le navigateur depuis [Bunny Fonts](https://fonts.bunny.net), un service
     européen de polices respectueux de la vie privée ; sans accès à internet, la police du
     système est utilisée. Les ligatures sont désactivées pour que `->` ou `!=` s'affichent tels
-    quels.
+    quels. Le réglage le plus dense est Très petite + Compacte + Inconsolata Condensed.
 - **Données** : « Supprimer tous les logs » efface définitivement tous les logs stockés (il faut
   taper `PURGE` pour confirmer). Les tags et les paramètres sont conservés. VictoriaLogs doit
   être lancé avec `-delete.enable` (déjà présent dans `docker-compose.yml`) ; mettez
@@ -250,11 +265,31 @@ couleur, est mémorisé par navigateur.
 
 `AUTH_MODE` choisit comment l'interface et l'API sont protégées (`/healthz` reste toujours ouvert) :
 
-- **`local`** (par défaut) : authentification HTTP Basic avec `AUTH_USER` / `AUTH_PASS` ; laissez-les
+- **`local`** (par défaut) : une page de connexion avec le compte `AUTH_USER` / `AUTH_PASS` ; laissez-les
   vides pour n'avoir aucune authentification (par exemple derrière un reverse proxy qui contrôle déjà).
 - **`oidc`** : connexion par un fournisseur OpenID Connect (Keycloak, Authentik, Authelia, Zitadel…),
   flux « authorization code » avec PKCE.
 
+En mode `local`, la page de connexion suit le thème et la langue de l'interface. La session dure
+`SESSION_TTL` (12 h par défaut), survit aux redémarrages (sa clé de signature est dans
+`/data/session.key`) et se termine quand `AUTH_USER` ou `AUTH_PASS` change ; le bouton de
+déconnexion (en haut à droite) y met fin. Les échecs de connexion sont écrits dans les logs avec
+l'adresse du client (`auth: failed login for "bob" from 192.0.2.7`). Les scripts peuvent toujours
+appeler l'API avec des identifiants HTTP Basic (`curl -u utilisateur:motdepasse`).
+
+Pour afficher votre logo sur la page de connexion, montez un PNG dans le conteneur et indiquez
+son chemin dans `LOGIN_LOGO` :
+
+```yaml
+# docker-compose.yml, service logstream
+    volumes:
+      - ./logo.png:/config/logo.png:ro
+```
+```bash
+# .env
+LOGIN_LOGO=/config/logo.png
+```
+
 Pour utiliser OIDC :
 
 1. Dans le fournisseur, créez un client **confidentiel** (avec secret) pour logstream et déclarez
@@ -271,7 +306,7 @@ Pour utiliser OIDC :
    laquelle le fournisseur n'a pas pu être lu (issuer incorrect, injoignable…).
 
 Ouvrir l'interface renvoie vers la page de connexion du fournisseur, puis revient sur logstream.
-La session dure `OIDC_SESSION_TTL` (12 h par défaut) et survit aux redémarrages (sa clé de
+La session dure `SESSION_TTL` (12 h par défaut) et survit aux redémarrages (sa clé de
 signature est dans `/data/session.key`) ; à son expiration, la page repasse par la connexion. Le
 bouton de déconnexion (en haut à droite) termine la session logstream, puis ouvre la page de
 déconnexion du fournisseur s'il en a une.
@@ -302,13 +337,14 @@ résolutions.
 | `SYSLOG_PORT` | `514` | port syslog publié sur l'hôte |
 | `HTTP_PORT` | `8080` | port de l'interface web |
 | `RETENTION` | `30d` | durée de conservation des logs dans VictoriaLogs |
-| `AUTH_MODE` | `local` | `local` (HTTP Basic) ou `oidc`, voir [Authentification](#authentification) |
-| `AUTH_USER` / `AUTH_PASS` | vide | authentification HTTP Basic pour l'interface (mode `local`) |
+| `AUTH_MODE` | `local` | `local` (page de connexion) ou `oidc`, voir [Authentification](#authentification) |
+| `AUTH_USER` / `AUTH_PASS` | vide | compte de la page de connexion (mode `local`) ; vide = pas d'authentification |
+| `LOGIN_LOGO` | vide | PNG affiché sur la page de connexion, chemin dans le conteneur (mode `local`) |
+| `SESSION_TTL` | `12h` | durée de la session (les deux modes ; `OIDC_SESSION_TTL` fonctionne toujours) |
 | `OIDC_ISSUER` | vide | URL de l'issuer du fournisseur OpenID Connect (mode `oidc`) |
 | `OIDC_CLIENT_ID` / `OIDC_CLIENT_SECRET` | vide | client déclaré dans le fournisseur |
 | `OIDC_REDIRECT_URL` | vide | URL de retour de logstream, ex. `https://logs.example.org/auth/callback` |
 | `OIDC_SCOPES` | `openid profile email` | scopes demandés |
-| `OIDC_SESSION_TTL` | `12h` | durée de la session |
 | `RDNS` | `on` | résoudre les hôtes donnés par leur IP en noms DNS |
 | `DNS_SERVER` | vide | serveur DNS pour les résolutions inverses (`ip` ou `ip:port`) |
 | `ALLOW_PURGE` | `true` | autoriser « Supprimer tous les logs » dans les Paramètres |
@@ -366,7 +402,8 @@ Pour mettre à jour l'une d'elles :
 | Fichier | Contenu |
 |---|---|
 | `main.go` | configuration, démarrage |
-| `auth.go` | authentification : HTTP Basic ou OpenID Connect (découverte, PKCE, contrôle de l'ID token, cookie de session) |
+| `auth.go` | authentification : OpenID Connect (découverte, PKCE, contrôle de l'ID token) et cookie de session signé |
+| `auth_local.go` | mode `local` : page de connexion (`web/login.html`), cookie de session, `LOGIN_LOGO` |
 | `syslog.go` | écoute UDP/TCP et analyse RFC 3164 / 5424 |
 | `store.go` | insertions par lots dans VictoriaLogs et requêtes LogsQL |
 | `query.go` | traduit les filtres de l'interface en LogsQL ; filtre du direct |
@@ -379,7 +416,7 @@ Pour mettre à jour l'une d'elles :
 | `hostlogs.go`, `journal.go` | logs système de l'hôte : lecteur du journal systemd (sans `journalctl`) et suivi de `/var/log` |
 | `tags.go` | stockage des tags de couleur |
 | `api.go` | routes HTTP `/api/*` |
-| `web/` | interface (HTML, CSS, JavaScript simple, sans étape de build), embarquée dans le binaire ; les traductions sont dans `web/app.js` (`I18N`) |
+| `web/` | interface (HTML, CSS, JavaScript simple, sans étape de build), embarquée dans le binaire ; les traductions sont dans `web/app.js` (`I18N`), et dans `web/login.html` pour la page de connexion |
 
 ## Remarque
 

README.md

@@ -72,7 +72,7 @@ message, host and app. Words are combined with AND.
 The live view is disabled in this mode.
 
 Each row shows, from left to right: the **reception time** (server clock), the timestamp
-found in the message itself (`msg_time`), severity, host, app and message. Click a host or an
+found in the message itself (`msg_time`), severity, host, app, codes of the tags found and message. Click a host or an
 app to filter on it.
 
 Logs are indexed, searched and sorted by **reception time**: devices with a wrong clock
@@ -207,15 +207,30 @@ remembered per browser.
   (`logstream-data` volume), so they are shared by every browser. Default tags (pastel):
   `warning` (orange), `error` (red), `ok` (green). Default tags still using the colors of
   earlier versions are switched to the pastel ones automatically.
+  The *+ Preset…* menu adds ready-made tags for HTTP/HTTPS access logs (nginx and Apache
+  common/combined, Traefik CLF and JSON, Caddy JSON, HAProxy httplog): status codes (2xx green,
+  3xx blue, 4xx orange, 5xx red), methods, probes and attacks (`wp-login.php`, `/.env`,
+  `../`…), bots and scripts, TLS and proxy errors. Tags already in the list are skipped, and the
+  added tags can be edited like any other. In a regular expression, a group named `hl`
+  (`(?<hl>…)`) colors only that part of the match: the presets use it to color the status code
+  or the method, not the text around it.
+  Each tag gets a two-digit code (`01`, `02`…) assigned by the server: it stays with the tag
+  until the tag is deleted (codes are also given to tags created by earlier versions). The
+  *Filters* column of the log list shows, as grey badges, the codes of the active tags found in
+  each message; it has room for 3, beyond that it shows 2 and `+N`, and the tooltip lists them
+  all.
 - **Interface**
   - *Theme*: System (follows the computer/phone preference), Light or Dark. The sun/moon
     button in the header switches between light and dark.
-  - *Log display*: font size (tiny, small, medium, large) and font: the system monospace
-    font, or one of 12 free fonts made for dense text (JetBrains Mono, Fira Code, Source
-    Code Pro, IBM Plex Mono, Cascadia Code, Roboto Mono, Ubuntu Mono, Inconsolata, Red Hat
-    Mono, Noto Sans Mono, Victor Mono, DM Mono). They are loaded by the browser from
+  - *Log display*: font size (tiny, small, medium, large), density (normal, or compact to
+    fit about 50% more lines on screen) and font: the system monospace font, one of 3 narrow
+    built-in fonts served by LogStream itself, which work offline (Inconsolata Condensed, the
+    narrowest, Iosevka and Ubuntu Mono), or one of 11 free fonts made for dense text (JetBrains
+    Mono, Fira Code, Source Code Pro, IBM Plex Mono, Cascadia Code, Roboto Mono, Inconsolata,
+    Red Hat Mono, Noto Sans Mono, Victor Mono, DM Mono). These 11 are loaded by the browser from
     [Bunny Fonts](https://fonts.bunny.net), a privacy-friendly European font service; without
-    internet access, the system font is used. Ligatures are disabled so `->` or `!=` show as typed.
+    internet access, the system font is used. Ligatures are disabled so `->` or `!=` show as
+    typed. The densest setting is Tiny + Compact + Inconsolata Condensed.
 - **Data**: "Delete all logs" permanently erases every stored log (you must type
   `PURGE` to confirm). Tags and settings are kept. VictoriaLogs needs `-delete.enable`
   (already set in `docker-compose.yml`); set `ALLOW_PURGE=false` to disable the feature.
@@ -226,11 +241,29 @@ remembered per browser.
 
 `AUTH_MODE` picks how the UI and the API are protected (`/healthz` always stays open):
 
-- **`local`** (default): HTTP Basic authentication with `AUTH_USER` / `AUTH_PASS`; leave them
+- **`local`** (default): a login page with the account `AUTH_USER` / `AUTH_PASS`; leave them
   empty to have no authentication (for instance behind a reverse proxy that already checks).
 - **`oidc`**: login through an OpenID Connect provider (Keycloak, Authentik, Authelia, Zitadel…),
   authorization code flow with PKCE.
 
+In `local` mode the login page follows the theme and language of the UI. The session lasts
+`SESSION_TTL` (12 h by default), survives restarts (its signing key is in `/data/session.key`) and
+ends when `AUTH_USER` or `AUTH_PASS` changes; the log out button (top right) ends it. Failed logins
+are written in the logs with the client address (`auth: failed login for "bob" from 192.0.2.7`).
+Scripts can still call the API with HTTP Basic credentials (`curl -u user:pass`).
+
+To show your logo on the login page, mount a PNG in the container and point `LOGIN_LOGO` to it:
+
+```yaml
+# docker-compose.yml, logstream service
+    volumes:
+      - ./logo.png:/config/logo.png:ro
+```
+```bash
+# .env
+LOGIN_LOGO=/config/logo.png
+```
+
 To use OIDC:
 
 1. In the provider, create a **confidential** client (with a secret) for logstream and register
@@ -247,7 +280,7 @@ To use OIDC:
    provider could not be read (wrong issuer, unreachable…).
 
 Opening the UI sends you to the provider's login page, then back to logstream. The session
-lasts `OIDC_SESSION_TTL` (12 h by default) and survives restarts (its signing key is in
+lasts `SESSION_TTL` (12 h by default) and survives restarts (its signing key is in
 `/data/session.key`); when it ends, the page goes through the login again. The log out button
 (top right) ends the logstream session, then opens the provider's log out page if it has one.
 
@@ -274,13 +307,14 @@ are only known by your router or a local DNS (Pi-hole, AdGuard, Unbound…), set
 | `SYSLOG_PORT` | `514` | syslog port published on the host |
 | `HTTP_PORT` | `8080` | web UI port |
 | `RETENTION` | `30d` | how long VictoriaLogs keeps logs |
-| `AUTH_MODE` | `local` | `local` (HTTP Basic) or `oidc`, see [Authentication](#authentication) |
-| `AUTH_USER` / `AUTH_PASS` | empty | HTTP Basic authentication for the UI (`local` mode) |
+| `AUTH_MODE` | `local` | `local` (login page) or `oidc`, see [Authentication](#authentication) |
+| `AUTH_USER` / `AUTH_PASS` | empty | account of the login page (`local` mode); empty = no authentication |
+| `LOGIN_LOGO` | empty | PNG shown on the login page, path inside the container (`local` mode) |
+| `SESSION_TTL` | `12h` | session lifetime (both modes; `OIDC_SESSION_TTL` still works) |
 | `OIDC_ISSUER` | empty | issuer URL of the OpenID Connect provider (`oidc` mode) |
 | `OIDC_CLIENT_ID` / `OIDC_CLIENT_SECRET` | empty | client registered in the provider |
 | `OIDC_REDIRECT_URL` | empty | callback URL of logstream, e.g. `https://logs.example.org/auth/callback` |
 | `OIDC_SCOPES` | `openid profile email` | requested scopes |
-| `OIDC_SESSION_TTL` | `12h` | session lifetime |
 | `RDNS` | `on` | resolve IP hosts to DNS names |
 | `DNS_SERVER` | empty | DNS server for reverse lookups (`ip` or `ip:port`) |
 | `ALLOW_PURGE` | `true` | allow "Delete all logs" in Settings |
@@ -335,7 +369,8 @@ To update one of them:
 | File | Contents |
 |---|---|
 | `main.go` | configuration, startup |
-| `auth.go` | authentication: HTTP Basic or OpenID Connect (discovery, PKCE, ID token checks, session cookie) |
+| `auth.go` | authentication: OpenID Connect (discovery, PKCE, ID token checks) and the signed session cookie |
+| `auth_local.go` | `local` mode: login page (`web/login.html`), session cookie, `LOGIN_LOGO` |
 | `syslog.go` | UDP/TCP listeners and RFC 3164 / 5424 parsing |
 | `store.go` | batched inserts into VictoriaLogs and LogsQL queries |
 | `query.go` | turns UI filters into LogsQL; live-view filter |
@@ -348,7 +383,7 @@ To update one of them:
 | `hostlogs.go`, `journal.go` | host system logs: systemd journal reader (no `journalctl`) and `/var/log` follower |
 | `tags.go` | color tag storage |
 | `api.go` | `/api/*` HTTP routes |
-| `web/` | UI (HTML, CSS, plain JavaScript, no build step), embedded in the binary; translations live in `web/app.js` (`I18N`) |
+| `web/` | UI (HTML, CSS, plain JavaScript, no build step), embedded in the binary; translations live in `web/app.js` (`I18N`), and in `web/login.html` for the login page |
 
 ## Note
 

auth.go

@@ -27,8 +27,8 @@ import (
 	"time"
 )
 
-// Web UI authentication. AUTH_MODE=local (default) keeps the optional HTTP Basic
-// authentication (AUTH_USER / AUTH_PASS); AUTH_MODE=oidc delegates the login to an
+// Web UI authentication. AUTH_MODE=local (default) shows a login page when AUTH_USER /
+// AUTH_PASS are set (auth_local.go); AUTH_MODE=oidc delegates the login to an
 // OpenID Connect provider (Keycloak, Authentik, Authelia…) with the authorization code
 // flow and PKCE. Only the standard library is used.
 
@@ -49,13 +49,23 @@ type authConfig struct {
 	scopes       string
 	sessionTTL   time.Duration
 	dataDir      string
+	loginLogo    string // local mode: PNG shown on the login page
+
 }
 
 // newAuth returns the middleware that protects the UI and the API (except /healthz).
 func newAuth(c authConfig, next http.Handler) (http.Handler, error) {
+	if c.sessionTTL <= 0 {
+		c.sessionTTL = 12 * time.Hour
+	}
 	switch strings.ToLower(c.mode) {
 	case "", "local":
-		return basicAuth(c.user, c.pass, next), nil
+		if c.user == "" {
+			return next, nil
+		}
+		l := newLocal(c)
+		l.next = next
+		return l, nil
 	case "oidc":
 		o, err := newOIDC(c)
 		if err != nil {
@@ -68,28 +78,6 @@ func newAuth(c authConfig, next http.Handler) (http.Handler, error) {
 	return nil, fmt.Errorf("AUTH_MODE=%q: expected local or oidc", c.mode)
 }
 
-// basicAuth protects the UI when AUTH_USER is set (except /healthz).
-func basicAuth(user, pass string, next http.Handler) http.Handler {
-	if user == "" {
-		return next
-	}
-	return http.HandlerFunc(func(w http.ResponseWriter, r *http.Request) {
-		if r.URL.Path == "/healthz" {
-			next.ServeHTTP(w, r)
-			return
-		}
-		u, p, ok := r.BasicAuth()
-		if !ok ||
-			subtle.ConstantTimeCompare([]byte(u), []byte(user)) != 1 ||
-			subtle.ConstantTimeCompare([]byte(p), []byte(pass)) != 1 {
-			w.Header().Set("WWW-Authenticate", `Basic realm="logstream"`)
-			http.Error(w, "authentication required", http.StatusUnauthorized)
-			return
-		}
-		next.ServeHTTP(w, r)
-	})
-}
-
 type oidcMeta struct {
 	Issuer           string   `json:"issuer"`
 	AuthEndpoint     string   `json:"authorization_endpoint"`
@@ -136,9 +124,6 @@ func newOIDC(c authConfig) (*OIDC, error) {
 	if !strings.Contains(" "+c.scopes+" ", " openid ") {
 		c.scopes = "openid " + c.scopes
 	}
-	if c.sessionTTL <= 0 {
-		c.sessionTTL = 12 * time.Hour
-	}
 	return &OIDC{
 		cfg:      c,
 		callback: ru.Path,
@@ -166,7 +151,7 @@ func sessionKey(dir string) []byte {
 		log.Fatalf("session key: %v", err)
 	}
 	if err := os.WriteFile(path, k, 0o600); err != nil {
-		log.Printf("oidc: cannot save %s (%v): sessions end when logstream restarts", path, err)
+		log.Printf("auth: cannot save %s (%v): sessions end when logstream restarts", path, err)
 	}
 	return k
 }
@@ -176,6 +161,14 @@ type session struct {
 	Exp  int64  `json:"e"`
 }
 
+// writeAuthRequired answers API calls without a session; the UI turns it into a reload
+// (and so into a new login).
+func writeAuthRequired(w http.ResponseWriter) {
+	w.Header().Set("Content-Type", "application/json")
+	w.WriteHeader(http.StatusUnauthorized)
+	_, _ = w.Write([]byte(`{"error":"authentication required","code":"auth"}` + "\n"))
+}
+
 type loginState struct {
 	Nonce    string `json:"n"`
 	Verifier string `json:"v"`
@@ -196,7 +189,7 @@ func (o *OIDC) ServeHTTP(w http.ResponseWriter, r *http.Request) {
 		return
 	}
 	var s session
-	if c, err := r.Cookie(sessionCookie); err == nil && o.verifyCookie(c.Value, &s) && time.Now().Unix() < s.Exp {
+	if c, err := r.Cookie(sessionCookie); err == nil && verifyCookie(o.key, c.Value, &s) && time.Now().Unix() < s.Exp {
 		if r.URL.Path == "/auth/me" {
 			writeJSON(w, http.StatusOK, map[string]string{"mode": "oidc", "user": s.User})
 			return
@@ -210,9 +203,7 @@ func (o *OIDC) ServeHTTP(w http.ResponseWriter, r *http.Request) {
 		o.startLogin(w, r)
 		return
 	}
-	w.Header().Set("Content-Type", "application/json")
-	w.WriteHeader(http.StatusUnauthorized)
-	_, _ = w.Write([]byte(`{"error":"authentication required","code":"auth"}` + "\n"))
+	writeAuthRequired(w)
 }
 
 func (o *OIDC) startLogin(w http.ResponseWriter, r *http.Request) {
@@ -229,7 +220,7 @@ func (o *OIDC) startLogin(w http.ResponseWriter, r *http.Request) {
 	}
 	http.SetCookie(w, &http.Cookie{
 		Name:     loginCookie + state,
-		Value:    o.signCookie(loginState{Nonce: nonce, Verifier: verifier, Return: ret, Exp: time.Now().Add(loginTTL).Unix()}),
+		Value:    signCookie(o.key, loginState{Nonce: nonce, Verifier: verifier, Return: ret, Exp: time.Now().Add(loginTTL).Unix()}),
 		Path:     "/",
 		MaxAge:   int(loginTTL.Seconds()),
 		HttpOnly: true,
@@ -260,8 +251,8 @@ func (o *OIDC) handleCallback(w http.ResponseWriter, r *http.Request) {
 	state := q.Get("state")
 	var ls loginState
 	c, err := r.Cookie(loginCookie + state)
-	if state == "" || err != nil || !o.verifyCookie(c.Value, &ls) || time.Now().Unix() > ls.Exp {
-		http.Error(w, "login expired or started in another browser: open logstream again", http.StatusBadRequest)
+	if state == "" || err != nil || !verifyCookie(o.key, c.Value, &ls) || time.Now().Unix() > ls.Exp {
+		http.Error(w, "login expired or started in another browser: open LogStream again", http.StatusBadRequest)
 		return
 	}
 	http.SetCookie(w, &http.Cookie{Name: loginCookie + state, Path: "/", MaxAge: -1, HttpOnly: true, Secure: o.secure})
@@ -269,13 +260,13 @@ func (o *OIDC) handleCallback(w http.ResponseWriter, r *http.Request) {
 	user, err := o.exchange(r, q.Get("code"), ls)
 	if err != nil {
 		log.Printf("oidc: login failed: %v", err)
-		http.Error(w, "login failed, see the logstream logs", http.StatusForbidden)
+		http.Error(w, "login failed, see the LogStream logs", http.StatusForbidden)
 		return
 	}
 	log.Printf("oidc: %s logged in", user)
 	http.SetCookie(w, &http.Cookie{
 		Name:     sessionCookie,
-		Value:    o.signCookie(session{User: user, Exp: time.Now().Add(o.cfg.sessionTTL).Unix()}),
+		Value:    signCookie(o.key, session{User: user, Exp: time.Now().Add(o.cfg.sessionTTL).Unix()}),
 		Path:     "/",
 		MaxAge:   int(o.cfg.sessionTTL.Seconds()),
 		HttpOnly: true,
@@ -564,15 +555,15 @@ func (o *OIDC) getJSON(u string, v any) error {
 }
 
 // Cookies are base64url(JSON) + "." + base64url(HMAC-SHA256).
-func (o *OIDC) signCookie(v any) string {
+func signCookie(key []byte, v any) string {
 	b, _ := json.Marshal(v)
 	p := base64.RawURLEncoding.EncodeToString(b)
-	m := hmac.New(sha256.New, o.key)
+	m := hmac.New(sha256.New, key)
 	m.Write([]byte(p))
 	return p + "." + base64.RawURLEncoding.EncodeToString(m.Sum(nil))
 }
 
-func (o *OIDC) verifyCookie(s string, v any) bool {
+func verifyCookie(key []byte, s string, v any) bool {
 	p, sig, ok := strings.Cut(s, ".")
 	if !ok {
 		return false
@@ -581,7 +572,7 @@ func (o *OIDC) verifyCookie(s string, v any) bool {
 	if err != nil {
 		return false
 	}
-	m := hmac.New(sha256.New, o.key)
+	m := hmac.New(sha256.New, key)
 	m.Write([]byte(p))
 	if !hmac.Equal(got, m.Sum(nil)) {
 		return false

auth_local.go

@@ -0,0 +1,167 @@
+package main
+
+import (
+	"crypto/hmac"
+	"crypto/sha256"
+	"crypto/subtle"
+	"log"
+	"net"
+	"net/http"
+	"net/url"
+	"os"
+	"strings"
+	"time"
+)
+
+// Local mode with AUTH_USER set: a login page (web/login.html) in the colors of the UI and a
+// session kept in a signed cookie, like the OIDC mode. HTTP Basic credentials are still
+// accepted so scripts calling the API keep working, but the browser popup is gone.
+
+const loginPage = "/login.html"
+
+var loginFailDelay = time.Second // slows down password guessing
+
+type Local struct {
+	user, pass string
+	ttl        time.Duration
+	logo       string // LOGIN_LOGO, served at /auth/logo
+	key        []byte
+	next       http.Handler
+}
+
+func newLocal(c authConfig) *Local {
+	// The key depends on the credentials: changing AUTH_USER or AUTH_PASS ends every session.
+	m := hmac.New(sha256.New, sessionKey(c.dataDir))
+	m.Write([]byte("local\x00" + c.user + "\x00" + c.pass))
+	if c.loginLogo != "" {
+		if _, err := os.Stat(c.loginLogo); err != nil {
+			log.Printf("auth: LOGIN_LOGO: %v", err)
+		}
+	}
+	log.Printf("local authentication enabled (user %s)", c.user)
+	return &Local{user: c.user, pass: c.pass, ttl: c.sessionTTL, logo: c.loginLogo, key: m.Sum(nil)}
+}
+
+func (l *Local) ServeHTTP(w http.ResponseWriter, r *http.Request) {
+	switch r.URL.Path {
+	case "/healthz", "/style.css":
+		l.next.ServeHTTP(w, r)
+		return
+	case "/auth/logo":
+		l.serveLogo(w, r)
+		return
+	case "/auth/login":
+		l.handleLogin(w, r)
+		return
+	case "/auth/logout":
+		http.SetCookie(w, &http.Cookie{Name: sessionCookie, Path: "/", MaxAge: -1, HttpOnly: true, Secure: isHTTPS(r)})
+		http.Redirect(w, r, loginPage, http.StatusFound)
+		return
+	}
+	user, ok := l.sessionUser(r)
+	if !ok {
+		if u, p, basic := r.BasicAuth(); basic && l.check(u, p) {
+			user, ok = u, true
+		}
+	}
+	switch {
+	case r.URL.Path == loginPage:
+		if ok {
+			http.Redirect(w, r, safeReturn(r.URL.Query().Get("r")), http.StatusFound)
+			return
+		}
+		w.Header().Set("Cache-Control", "no-store")
+		l.next.ServeHTTP(w, r)
+	case ok && r.URL.Path == "/auth/me":
+		writeJSON(w, http.StatusOK, map[string]string{"mode": "local", "user": user})
+	case ok:
+		l.next.ServeHTTP(w, r)
+	case r.Method == http.MethodGet && !strings.HasPrefix(r.URL.Path, "/api/") && r.URL.Path != "/auth/me":
+		target := loginPage
+		if ret := r.URL.RequestURI(); ret != "/" {
+			target += "?" + url.Values{"r": {ret}}.Encode()
+		}
+		http.Redirect(w, r, target, http.StatusFound)
+	default:
+		writeAuthRequired(w)
+	}
+}
+
+func (l *Local) handleLogin(w http.ResponseWriter, r *http.Request) {
+	if r.Method != http.MethodPost {
+		http.Redirect(w, r, loginPage, http.StatusFound)
+		return
+	}
+	user, pass := r.PostFormValue("user"), r.PostFormValue("pass")
+	ret := safeReturn(r.PostFormValue("r"))
+	if !l.check(user, pass) {
+		log.Printf("auth: failed login for %q from %s", user, clientIP(r))
+		time.Sleep(loginFailDelay)
+		q := url.Values{"e": {"1"}}
+		if ret != "/" {
+			q.Set("r", ret)
+		}
+		http.Redirect(w, r, loginPage+"?"+q.Encode(), http.StatusSeeOther)
+		return
+	}
+	log.Printf("auth: %s logged in from %s", user, clientIP(r))
+	http.SetCookie(w, &http.Cookie{
+		Name:     sessionCookie,
+		Value:    signCookie(l.key, session{User: user, Exp: time.Now().Add(l.ttl).Unix()}),
+		Path:     "/",
+		MaxAge:   int(l.ttl.Seconds()),
+		HttpOnly: true,
+		Secure:   isHTTPS(r),
+		SameSite: http.SameSiteLaxMode,
+	})
+	http.Redirect(w, r, ret, http.StatusSeeOther)
+}
+
+func (l *Local) sessionUser(r *http.Request) (string, bool) {
+	var s session
+	c, err := r.Cookie(sessionCookie)
+	if err != nil || !verifyCookie(l.key, c.Value, &s) || time.Now().Unix() >= s.Exp {
+		return "", false
+	}
+	return s.User, true
+}
+
+func (l *Local) check(user, pass string) bool {
+	u := subtle.ConstantTimeCompare([]byte(user), []byte(l.user))
+	p := subtle.ConstantTimeCompare([]byte(pass), []byte(l.pass))
+	return u&p == 1
+}
+
+// serveLogo sends LOGIN_LOGO; without it the login page hides the image.
+func (l *Local) serveLogo(w http.ResponseWriter, r *http.Request) {
+	if l.logo == "" {
+		http.NotFound(w, r)
+		return
+	}
+	w.Header().Set("Cache-Control", "no-cache")
+	http.ServeFile(w, r, l.logo)
+}
+
+// safeReturn keeps the page to open after login inside logstream.
+func safeReturn(ret string) string {
+	if !strings.HasPrefix(ret, "/") || strings.HasPrefix(ret, "//") || strings.HasPrefix(ret, "/\\") || ret == loginPage {
+		return "/"
+	}
+	return ret
+}
+
+// isHTTPS is true when the browser talks HTTPS, directly or through a reverse proxy.
+func isHTTPS(r *http.Request) bool {
+	return r.TLS != nil || strings.EqualFold(r.Header.Get("X-Forwarded-Proto"), "https")
+}
+
+func clientIP(r *http.Request) string {
+	if f := r.Header.Get("X-Forwarded-For"); f != "" {
+		return strings.TrimSpace(strings.Split(f, ",")[0])
+	}
+	host, _, err := net.SplitHostPort(r.RemoteAddr)
+	if err != nil {
+		return r.RemoteAddr
+	}
+	return host
+}

auth_local_test.go

@@ -0,0 +1,142 @@
+package main
+
+import (
+	"net/http"
+	"net/http/cookiejar"
+	"net/url"
+	"os"
+	"path/filepath"
+	"strings"
+	"testing"
+)
+
+// newLocalApp puts the local login in front of a handler that echoes "app" and returns a
+// browser (client with cookies) that does not follow redirects.
+func newLocalApp(t *testing.T, c authConfig) (string, *http.Client) {
+	t.Helper()
+	loginFailDelay = 0
+	c.mode, c.dataDir = "local", t.TempDir()
+	h, err := newAuth(c, http.HandlerFunc(func(w http.ResponseWriter, r *http.Request) { _, _ = w.Write([]byte("app " + r.URL.Path)) }))
+	if err != nil {
+		t.Fatal(err)
+	}
+	jar, _ := cookiejar.New(nil)
+	return "http://app.test", &http.Client{
+		Jar:           jar,
+		Transport:     hosts{"app.test": h},
+		CheckRedirect: func(*http.Request, []*http.Request) error { return http.ErrUseLastResponse },
+	}
+}
+
+func login(t *testing.T, c *http.Client, app, user, pass, ret string) *http.Response {
+	t.Helper()
+	res, err := c.PostForm(app+"/auth/login", url.Values{"user": {user}, "pass": {pass}, "r": {ret}})
+	if err != nil {
+		t.Fatal(err)
+	}
+	res.Body.Close()
+	return res
+}
+
+func TestLocalLoginFlow(t *testing.T) {
+	app, c := newLocalApp(t, authConfig{user: "admin", pass: "pw"})
+
+	res, _ := c.Get(app + "/api/logs?q=x")
+	if res.StatusCode != http.StatusUnauthorized || res.Header.Get("WWW-Authenticate") != "" {
+		t.Fatalf("API without session: %d %q", res.StatusCode, res.Header.Get("WWW-Authenticate"))
+	}
+	res, _ = c.Get(app + "/?q=disk")
+	if loc := res.Header.Get("Location"); res.StatusCode != http.StatusFound || loc != "/login.html?r=%2F%3Fq%3Ddisk" {
+		t.Fatalf("page without session: %d %q", res.StatusCode, loc)
+	}
+	for _, p := range []string{"/login.html", "/style.css", "/healthz"} {
+		if code, body := get(t, c, app+p); code != http.StatusOK || body != "app "+p {
+			t.Errorf("%s without session: %d %q", p, code, body)
+		}
+	}
+
+	res = login(t, c, app, "admin", "wrong", "/?q=disk")
+	if loc := res.Header.Get("Location"); res.StatusCode != http.StatusSeeOther || !strings.Contains(loc, "e=1") {
+		t.Fatalf("wrong password: %d %q", res.StatusCode, loc)
+	}
+	if code, _ := get(t, c, app+"/api/logs"); code != http.StatusUnauthorized {
+		t.Fatal("session created by a wrong password")
+	}
+
+	res = login(t, c, app, "admin", "pw", "//evil.example/")
+	if loc := res.Header.Get("Location"); loc != "/" {
+		t.Fatalf("open redirect: %q", loc)
+	}
+	res = login(t, c, app, "admin", "pw", "/?q=disk")
+	if loc := res.Header.Get("Location"); res.StatusCode != http.StatusSeeOther || loc != "/?q=disk" {
+		t.Fatalf("login: %d %q", res.StatusCode, loc)
+	}
+	if code, body := get(t, c, app+"/api/logs"); code != http.StatusOK || body != "app /api/logs" {
+		t.Fatalf("API with session: %d %q", code, body)
+	}
+	if code, body := get(t, c, app+"/auth/me"); code != http.StatusOK || !strings.Contains(body, `"user":"admin"`) || !strings.Contains(body, `"mode":"local"`) {
+		t.Fatalf("/auth/me: %d %s", code, body)
+	}
+	if res, _ := c.Get(app + "/login.html"); res.StatusCode != http.StatusFound {
+		t.Errorf("login page while logged in: %d", res.StatusCode)
+	}
+
+	if res, _ := c.Get(app + "/auth/logout"); res.Header.Get("Location") != "/login.html" {
+		t.Fatalf("logout: %q", res.Header.Get("Location"))
+	}
+	if code, _ := get(t, c, app+"/api/logs"); code != http.StatusUnauthorized {
+		t.Fatal("session still valid after logout")
+	}
+}
+
+func TestLocalBasicAuthForScripts(t *testing.T) {
+	app, c := newLocalApp(t, authConfig{user: "admin", pass: "pw"})
+	req, _ := http.NewRequest(http.MethodGet, app+"/api/logs", nil)
+	req.SetBasicAuth("admin", "pw")
+	if res, _ := c.Do(req); res.StatusCode != http.StatusOK {
+		t.Fatalf("basic auth: %d", res.StatusCode)
+	}
+	req.SetBasicAuth("admin", "nope")
+	if res, _ := c.Do(req); res.StatusCode != http.StatusUnauthorized {
+		t.Fatalf("wrong basic auth: %d", res.StatusCode)
+	}
+}
+
+func TestLocalPasswordChangeEndsSessions(t *testing.T) {
+	dir := t.TempDir()
+	loginFailDelay = 0
+	echo := http.HandlerFunc(func(w http.ResponseWriter, r *http.Request) {})
+	h1, _ := newAuth(authConfig{mode: "local", user: "admin", pass: "old", dataDir: dir}, echo)
+	h2, _ := newAuth(authConfig{mode: "local", user: "admin", pass: "new", dataDir: dir}, echo)
+	cookie := signCookie(h1.(*Local).key, session{User: "admin", Exp: 9999999999})
+	r, _ := http.NewRequest(http.MethodGet, "/", nil)
+	r.AddCookie(&http.Cookie{Name: sessionCookie, Value: cookie})
+	if _, ok := h1.(*Local).sessionUser(r); !ok {
+		t.Fatal("session refused with the same password")
+	}
+	if _, ok := h2.(*Local).sessionUser(r); ok {
+		t.Fatal("session kept after a password change")
+	}
+}
+
+func TestLocalLogo(t *testing.T) {
+	app, c := newLocalApp(t, authConfig{user: "admin", pass: "pw"})
+	if code, _ := get(t, c, app+"/auth/logo"); code != http.StatusNotFound {
+		t.Errorf("no LOGIN_LOGO: %d", code)
+	}
+	png := filepath.Join(t.TempDir(), "logo.png")
+	_ = os.WriteFile(png, []byte("\x89PNG\r\n\x1a\nfake"), 0o644)
+	app, c = newLocalApp(t, authConfig{user: "admin", pass: "pw", loginLogo: png})
+	res, _ := c.Get(app + "/auth/logo")
+	if res.StatusCode != http.StatusOK || res.Header.Get("Content-Type") != "image/png" {
+		t.Errorf("LOGIN_LOGO: %d %q", res.StatusCode, res.Header.Get("Content-Type"))
+	}
+}
+
+func TestLocalWithoutUserIsOpen(t *testing.T) {
+	if h, _ := newAuth(authConfig{mode: "local"}, http.NotFoundHandler()); h == nil || isLocal(h) {
+		t.Error("local mode without AUTH_USER should not protect anything")
+	}
+}
+
+func isLocal(h http.Handler) bool { _, ok := h.(*Local); return ok }

docker-compose.yml

@@ -14,15 +14,16 @@ services:
       VLOGS_URL: http://victorialogs:9428
       SYSLOG_PUBLIC_PORT: ${SYSLOG_PORT:-514}     # le port d'ecoute syslog par defaut (attention aux ports <1024)
       TZ: ${TZ:-Europe/Paris}
-      AUTH_MODE: ${AUTH_MODE:-local}   # local (Basic Auth ci-dessous) ou oidc
+      AUTH_MODE: ${AUTH_MODE:-local}   # local (page de connexion, compte ci-dessous) ou oidc
       AUTH_USER: ${AUTH_USER:-}   # vide = pas d'authentification, on delegue ca au reverse proxy traefik
       AUTH_PASS: ${AUTH_PASS:-}
+      LOGIN_LOGO: ${LOGIN_LOGO:-}     # PNG affiche sur la page de connexion (chemin dans le conteneur, voir volumes)
       OIDC_ISSUER: ${OIDC_ISSUER:-}
       OIDC_CLIENT_ID: ${OIDC_CLIENT_ID:-}
       OIDC_CLIENT_SECRET: ${OIDC_CLIENT_SECRET:-}
       OIDC_REDIRECT_URL: ${OIDC_REDIRECT_URL:-}
       OIDC_SCOPES: ${OIDC_SCOPES:-openid profile email}
-      OIDC_SESSION_TTL: ${OIDC_SESSION_TTL:-12h}
+      SESSION_TTL: ${SESSION_TTL:-${OIDC_SESSION_TTL:-12h}}   # duree de la session (local et oidc)
       RDNS: ${RDNS:-on}               # resol dns
       DNS_SERVER: ${DNS_SERVER:-}     # si resolv directe
       ALLOW_PURGE: ${ALLOW_PURGE:-true}
@@ -38,6 +39,8 @@ services:
       # logs systeme de l'hote, en lecture seule (source a activer dans Reglages > Sources)
       - /var/log:/host/var/log:ro                     # journal systemd persistant et fichiers texte
       - /run/log/journal:/host/run/log/journal:ro     # journal systemd volatile
+      # logo de la page de connexion, avec LOGIN_LOGO=/config/logo.png dans .env
+      # - ./logo.png:/config/logo.png:ro
     labels:
       logstream.exclude: "true"      # pas de collect des logs logstream
 

main.go

@@ -89,7 +89,9 @@ func main() {
 			clientSecret: os.Getenv("OIDC_CLIENT_SECRET"),
 			redirectURL:  os.Getenv("OIDC_REDIRECT_URL"),
 			scopes:       os.Getenv("OIDC_SCOPES"),
-			sessionTTL:   getenvDuration("OIDC_SESSION_TTL", 12*time.Hour),
+			// SESSION_TTL applies to both modes; OIDC_SESSION_TTL is its former name.
+			sessionTTL: getenvDuration("SESSION_TTL", getenvDuration("OIDC_SESSION_TTL", 12*time.Hour)),
+			loginLogo:  os.Getenv("LOGIN_LOGO"),
 		},
 		rdns:       getenvBool("RDNS", true),
 		dnsServer:  os.Getenv("DNS_SERVER"),

tags.go

@@ -16,7 +16,9 @@ import (
 // Tag highlights a keyword in displayed messages.
 type Tag struct {
 	ID            string `json:"id"`
+	Code          string `json:"code"` // two digits, shown on matching log lines
 	Pattern       string `json:"pattern"`
+	Label         string `json:"label,omitempty"` // shown instead of the pattern (presets)
 	Color         string `json:"color"`
 	WholeWord     bool   `json:"wholeWord"`
 	CaseSensitive bool   `json:"caseSensitive"`
@@ -26,12 +28,47 @@ type Tag struct {
 
 func defaultTags() []Tag {
 	return []Tag{
-		{ID: "warning", Pattern: "warning", Color: "#fdba74", WholeWord: true, Enabled: true},
-		{ID: "error", Pattern: "error", Color: "#fca5a5", WholeWord: true, Enabled: true},
-		{ID: "ok", Pattern: "ok", Color: "#86efac", WholeWord: true, Enabled: true},
+		{ID: "warning", Code: "01", Pattern: "warning", Color: "#fdba74", WholeWord: true, Enabled: true},
+		{ID: "error", Code: "02", Pattern: "error", Color: "#fca5a5", WholeWord: true, Enabled: true},
+		{ID: "ok", Code: "03", Pattern: "ok", Color: "#86efac", WholeWord: true, Enabled: true},
 	}
 }
 
+var codeRe = regexp.MustCompile(`^[0-9]{2}$`)
+
+// freeCode returns the lowest code from 01 to 99 not used by tags, or "" when
+// all are taken. A code stays with its tag until the tag is deleted.
+func freeCode(tags []Tag) string {
+	used := map[string]bool{}
+	for _, t := range tags {
+		used[t.Code] = true
+	}
+	for n := 1; n <= 99; n++ {
+		if c := fmt.Sprintf("%02d", n); !used[c] {
+			return c
+		}
+	}
+	return ""
+}
+
+// assignCodes gives a code to the tags that have none (files written before
+// codes existed) or share one with an earlier tag.
+func assignCodes(tags []Tag) bool {
+	changed := false
+	seen := map[string]bool{}
+	for i := range tags {
+		if codeRe.MatchString(tags[i].Code) && !seen[tags[i].Code] {
+			seen[tags[i].Code] = true
+			continue
+		}
+		tags[i].Code = ""
+		tags[i].Code = freeCode(tags)
+		seen[tags[i].Code] = true
+		changed = true
+	}
+	return changed
+}
+
 // Colors of the default tags in earlier versions: still unchanged, they are
 // switched to the new pastel defaults when the file is loaded.
 var oldDefaultColors = map[string]string{"warning": "#f59e0b", "error": "#ef4444", "ok": "#22c55e"}
@@ -67,11 +104,13 @@ func (e *codedError) Error() string {
 
 var (
 	errTagNotFound = &codedError{code: "tag_not_found", msg: "tag not found"}
+	errTooManyTags = &codedError{code: "too_many_tags", msg: "too many tags (99 at most)"}
 	colorRe        = regexp.MustCompile(`^#[0-9a-fA-F]{6}$`)
 )
 
 func (t *Tag) validate() error {
 	t.Pattern = strings.TrimSpace(t.Pattern)
+	t.Label = strings.TrimSpace(t.Label)
 	if t.Pattern == "" {
 		return &codedError{code: "pattern_required", msg: "the keyword is required"}
 	}
@@ -106,7 +145,7 @@ func LoadTagStore(path string) (*TagStore, error) {
 	if err := json.Unmarshal(b, &s.tags); err != nil {
 		return nil, fmt.Errorf("%s: %w", path, err)
 	}
-	if migrateDefaultColors(s.tags) {
+	if c1, c2 := migrateDefaultColors(s.tags), assignCodes(s.tags); c1 || c2 {
 		if err := s.save(); err != nil {
 			return nil, err
 		}
@@ -143,6 +182,9 @@ func (s *TagStore) Create(t Tag) (Tag, error) {
 	t.ID = newID()
 	s.mu.Lock()
 	defer s.mu.Unlock()
+	if t.Code = freeCode(s.tags); t.Code == "" {
+		return t, errTooManyTags
+	}
 	s.tags = append(s.tags, t)
 	return t, s.save()
 }
@@ -156,6 +198,7 @@ func (s *TagStore) Update(id string, t Tag) (Tag, error) {
 	defer s.mu.Unlock()
 	for i := range s.tags {
 		if s.tags[i].ID == id {
+			t.Code = s.tags[i].Code // assigned by the server, never changed
 			s.tags[i] = t
 			return t, s.save()
 		}

tags_test.go

@@ -0,0 +1,54 @@
+package main
+
+import (
+	"os"
+	"path/filepath"
+	"slices"
+	"testing"
+)
+
+func TestTagCodes(t *testing.T) {
+	path := filepath.Join(t.TempDir(), "tags.json")
+	// File written before codes existed, with a duplicate code.
+	old := `[{"id":"a","pattern":"x","color":"#000000"},{"id":"b","code":"07","pattern":"y","color":"#000000"},{"id":"c","code":"07","pattern":"z","color":"#000000"}]`
+	if err := os.WriteFile(path, []byte(old), 0o644); err != nil {
+		t.Fatal(err)
+	}
+	s, err := LoadTagStore(path)
+	if err != nil {
+		t.Fatal(err)
+	}
+	got := []string{}
+	for _, tg := range s.List() {
+		got = append(got, tg.Code)
+	}
+	if want := []string{"01", "07", "02"}; !slices.Equal(got, want) {
+		t.Fatalf("migrated codes = %v, want %v", got, want)
+	}
+
+	n, err := s.Create(Tag{Pattern: "w", Color: "#000000"})
+	if err != nil || n.Code != "03" {
+		t.Fatalf("Create code = %q, %v; want 03", n.Code, err)
+	}
+	// The client cannot change a code.
+	u, err := s.Update("b", Tag{Code: "42", Pattern: "y2", Color: "#000000"})
+	if err != nil || u.Code != "07" {
+		t.Fatalf("Update code = %q, %v; want 07", u.Code, err)
+	}
+	// A deleted tag frees its code; the others keep theirs.
+	if err := s.Delete("a"); err != nil {
+		t.Fatal(err)
+	}
+	if n, _ := s.Create(Tag{Pattern: "v", Color: "#000000"}); n.Code != "01" {
+		t.Fatalf("code after delete = %q, want 01", n.Code)
+	}
+
+	// Codes are saved in the file.
+	s2, err := LoadTagStore(path)
+	if err != nil {
+		t.Fatal(err)
+	}
+	if got := s2.List()[0].Code; got != "07" {
+		t.Fatalf("reloaded code = %q, want 07", got)
+	}
+}

web/app.js

@@ -48,11 +48,18 @@ const I18N = {
     newTag: 'new',
     confirmDelete: (p) => `Delete tag "${p}"?`,
     confirmReset: 'Replace all tags with the defaults (warning, error, ok)?',
+    presetAria: 'Add a preset', presetPick: '+ Preset…',
+    preset_http_status: 'HTTP status codes', preset_http_methods: 'HTTP methods',
+    preset_http_probes: 'Probes and attacks', preset_http_bots: 'Bots and scripts',
+    preset_http_errors: 'TLS/HTTPS and proxy errors',
+    pl_probes: 'probes / attacks', pl_bots: 'bots / scripts', pl_tls: 'TLS errors', pl_proxy: 'proxy errors',
+    presetAdded: (n) => (n ? `${n} tag(s) added` : 'These tags are already in the list'),
     tagsLoadErr: 'Tags: ',
     err_pattern_required: 'The keyword is required',
     err_invalid_color: 'Invalid color (expected #rrggbb)',
     err_invalid_regex: 'Invalid regular expression',
     err_tag_not_found: 'Tag not found',
+    err_too_many_tags: 'Too many tags (99 at most)',
     err_live_logsql: 'Live view is not available in LogsQL mode',
     dateTime: 'Date & time',
     tzLabel: 'Time zone',
@@ -71,7 +78,7 @@ const I18N = {
     srcHost: 'Host system',
     hostTitle: 'Host system logs',
     hostEnabled: 'Collect the system logs of this machine',
-    hostOff: 'Off: the system logs of the machine hosting Logstream are not collected.',
+    hostOff: 'Off: the system logs of the machine hosting LogStream are not collected.',
     hostWaiting: 'Starting…',
     hostJournal: ({ n, r }) => `Reading the systemd journal (${n} files): ${r} entries since startup.`,
     hostFiles: ({ n, r }) => `Following ${n} files of /var/log: ${r} lines since startup.`,
@@ -98,8 +105,8 @@ const I18N = {
     dockerLegend: 'Colored: followed · grey: not followed · dashed: stopped · the color identifies the compose project. Click a label to switch it.',
     dockerNoMatch: 'No container',
     stFollowing: 'followed', stSelected: 'followed when running', stIgnored: 'not followed', stStopped: 'stopped',
-    stLocked: 'excluded', stLockedTitle: 'Logstream itself, or label logstream.exclude=true',
-    dockerHelp: 'Logs are read through docker-socket-proxy, a read-only gateway: Logstream can list containers and read their logs, nothing else. Choices apply per compose service (or container name), so they survive container re-creations.',
+    stLocked: 'excluded', stLockedTitle: 'LogStream itself, or label logstream.exclude=true',
+    dockerHelp: 'Logs are read through docker-socket-proxy, a read-only gateway: LogStream can list containers and read their logs, nothing else. Choices apply per compose service (or container name), so they survive container re-creations.',
     fContainer: 'container', fContainerId: 'container ID', fImage: 'image', fProject: 'compose project',
     fService: 'compose service', fStream: 'stream', fSourceType: 'source',
     fUnit: 'systemd unit', fLogFile: 'log file',
@@ -113,8 +120,9 @@ const I18N = {
     themeHelp: 'System follows the light/dark preference of your computer or phone.',
     logDisplay: 'Log display', fontSize: 'Font size',
     sizeTiny: 'Tiny', sizeSmall: 'Small', sizeMedium: 'Medium', sizeLarge: 'Large',
-    fontLabel: 'Font', fontSystem: 'System monospace (no download)',
-    fontHelp: 'Free fonts (SIL Open Font License) loaded by your browser from Bunny Fonts, a privacy-friendly European font service. Without internet access, the system font is used.',
+    density: 'Density', densityNormal: 'Normal', densityCompact: 'Compact',
+    fontLabel: 'Font', fontSystem: 'System monospace (no download)', fontBuiltin: 'built in, narrow',
+    fontHelp: 'Free fonts. The built-in ones (Inconsolata Condensed, the narrowest, Iosevka and Ubuntu Mono) are served by LogStream itself and work offline; they are narrow, so more text fits on each line. The others are loaded by your browser from Bunny Fonts, a privacy-friendly European font service; without internet access, the system font is used.',
     previewMsgs: ['error: link down on eth1, carrier lost', 'warning: disk /dev/sda temperature 58°C', 'backup finished: ok (12.4 GB in 00:14:32)'],
     dangerZone: 'Danger zone',
     purgeHelp: 'Permanently delete every stored log to start from scratch. Color tags and settings are kept.',
@@ -142,7 +150,9 @@ const I18N = {
     hCappedTitle: 'The chosen division would exceed 300 intervals over this range: it has been enlarged.',
     hUnzoom: '× Reset zoom', unitDay: 'd',
     toTop: 'Back to top',
-    colRcv: 'Received', colMt: 'Message time', colSev: 'Severity', colHost: 'Host', colApp: 'App', colMsg: 'Message',
+    colRcv: 'Received', colMt: 'Message time', colSev: 'Severity', colHost: 'Host', colApp: 'App', colCodes: 'Filters', colMsg: 'Message',
+    codesTitle: 'Codes of the color tags found in the message',
+    tagCodeTitle: 'Code shown on the log lines this tag matches',
     colGrip: 'Drag to resize, double-click for the automatic width',
     resetCols: 'Reset column widths', colsReset: 'Column widths reset',
     colsHelp: 'Drag the edge of a column header in the log list to resize it (remembered by this browser).',
@@ -192,11 +202,18 @@ const I18N = {
     newTag: 'nouveau',
     confirmDelete: (p) => `Supprimer le tag « ${p} » ?`,
     confirmReset: 'Remplacer tous les tags par les tags par défaut (warning, error, ok) ?',
+    presetAria: 'Ajouter un préréglage', presetPick: '+ Préréglage…',
+    preset_http_status: 'Codes HTTP', preset_http_methods: 'Méthodes HTTP',
+    preset_http_probes: 'Sondes et attaques', preset_http_bots: 'Robots et scripts',
+    preset_http_errors: 'Erreurs TLS/HTTPS et proxy',
+    pl_probes: 'sondes / attaques', pl_bots: 'robots / scripts', pl_tls: 'erreurs TLS', pl_proxy: 'erreurs proxy',
+    presetAdded: (n) => (n ? `${n} tag(s) ajouté(s)` : 'Ces tags sont déjà dans la liste'),
     tagsLoadErr: 'Tags : ',
     err_pattern_required: 'Le mot-clé est obligatoire',
     err_invalid_color: 'Couleur invalide (format #rrggbb attendu)',
     err_invalid_regex: 'Expression régulière invalide',
     err_tag_not_found: 'Tag introuvable',
+    err_too_many_tags: 'Trop de tags (99 au maximum)',
     err_live_logsql: 'Le direct n\'est pas disponible en mode LogsQL',
     dateTime: 'Date et heure',
     tzLabel: 'Fuseau horaire',
@@ -215,7 +232,7 @@ const I18N = {
     srcHost: 'Système hôte',
     hostTitle: 'Logs système de l\'hôte',
     hostEnabled: 'Collecter les logs système de cette machine',
-    hostOff: 'Désactivé : les logs système de la machine qui héberge Logstream ne sont pas collectés.',
+    hostOff: 'Désactivé : les logs système de la machine qui héberge LogStream ne sont pas collectés.',
     hostWaiting: 'Démarrage…',
     hostJournal: ({ n, r }) => `Lecture du journal systemd (${n} fichiers) : ${r} entrées depuis le démarrage.`,
     hostFiles: ({ n, r }) => `Suivi de ${n} fichiers de /var/log : ${r} lignes depuis le démarrage.`,
@@ -242,8 +259,8 @@ const I18N = {
     dockerLegend: 'En couleur : suivis · en gris : non suivis · pointillés : arrêtés · la couleur identifie le projet compose. Cliquez sur une étiquette pour la basculer.',
     dockerNoMatch: 'Aucun conteneur',
     stFollowing: 'suivi', stSelected: 'suivi dès qu\'il tourne', stIgnored: 'non suivi', stStopped: 'arrêté',
-    stLocked: 'exclu', stLockedTitle: 'Logstream lui-même, ou étiquette logstream.exclude=true',
-    dockerHelp: 'Les logs sont lus via docker-socket-proxy, une passerelle en lecture seule : Logstream peut lister les conteneurs et lire leurs logs, rien d\'autre. Les choix s\'appliquent par service compose (ou nom de conteneur), ils survivent donc à la recréation des conteneurs.',
+    stLocked: 'exclu', stLockedTitle: 'LogStream lui-même, ou étiquette logstream.exclude=true',
+    dockerHelp: 'Les logs sont lus via docker-socket-proxy, une passerelle en lecture seule : LogStream peut lister les conteneurs et lire leurs logs, rien d\'autre. Les choix s\'appliquent par service compose (ou nom de conteneur), ils survivent donc à la recréation des conteneurs.',
     fContainer: 'conteneur', fContainerId: 'ID du conteneur', fImage: 'image', fProject: 'projet compose',
     fService: 'service compose', fStream: 'flux', fSourceType: 'source',
     fUnit: 'unité systemd', fLogFile: 'fichier de log',
@@ -257,8 +274,9 @@ const I18N = {
     themeHelp: 'Système suit la préférence clair/sombre de votre ordinateur ou de votre téléphone.',
     logDisplay: 'Affichage des logs', fontSize: 'Taille du texte',
     sizeTiny: 'Très petite', sizeSmall: 'Petite', sizeMedium: 'Moyenne', sizeLarge: 'Grande',
-    fontLabel: 'Police', fontSystem: 'Monospace du système (aucun téléchargement)',
-    fontHelp: 'Polices libres (licence SIL Open Font) chargées par votre navigateur depuis Bunny Fonts, un service européen respectueux de la vie privée. Sans accès à internet, la police du système est utilisée.',
+    density: 'Densité', densityNormal: 'Normale', densityCompact: 'Compacte',
+    fontLabel: 'Police', fontSystem: 'Monospace du système (aucun téléchargement)', fontBuiltin: 'intégrée, étroite',
+    fontHelp: 'Polices libres. Les polices intégrées (Inconsolata Condensed, la plus étroite, Iosevka et Ubuntu Mono) sont servies par LogStream lui-même et fonctionnent hors ligne ; elles sont étroites, donc chaque ligne affiche plus de texte. Les autres sont chargées par votre navigateur depuis Bunny Fonts, un service européen respectueux de la vie privée ; sans accès à internet, la police du système est utilisée.',
     previewMsgs: ['error: link down on eth1, carrier lost', 'warning: disk /dev/sda temperature 58°C', 'backup finished: ok (12.4 GB in 00:14:32)'],
     dangerZone: 'Zone de danger',
     purgeHelp: 'Supprime définitivement tous les logs stockés pour repartir de zéro. Les tags de couleur et les réglages sont conservés.',
@@ -286,7 +304,9 @@ const I18N = {
     hCappedTitle: 'La division choisie dépasserait 300 intervalles sur cette plage : elle a été élargie.',
     hUnzoom: '× Annuler le zoom', unitDay: 'j',
     toTop: 'Revenir en haut',
-    colRcv: 'Réception', colMt: 'Heure message', colSev: 'Sévérité', colHost: 'Hôte', colApp: 'App', colMsg: 'Message',
+    colRcv: 'Réception', colMt: 'Heure message', colSev: 'Sévérité', colHost: 'Hôte', colApp: 'App', colCodes: 'Filtres', colMsg: 'Message',
+    codesTitle: 'Codes des tags de couleur trouvés dans le message',
+    tagCodeTitle: 'Code affiché sur les lignes de log où ce tag est trouvé',
     colGrip: 'Glisser pour redimensionner, double-clic pour la largeur automatique',
     resetCols: 'Réinitialiser les colonnes', colsReset: 'Largeurs de colonnes réinitialisées',
     colsHelp: 'Glissez le bord d\'un en-tête de colonne de la liste pour la redimensionner (mémorisé par ce navigateur).',
@@ -519,16 +539,19 @@ $('#themeSwitch').addEventListener('click', (ev) => {
 
 /* ================= Log font and size ================= */
 
-// Free monospace fonts, served by Bunny Fonts (https://fonts.bunny.net).
+// Free monospace fonts, served by Bunny Fonts (https://fonts.bunny.net), except the
+// built-in ones (web/fonts, declared in style.css), which also work offline.
 const LOG_FONTS = [
   { id: 'system' },
+  { id: 'inconsolata-condensed', family: 'Inconsolata Condensed', builtin: true },
+  { id: 'iosevka', family: 'Iosevka', builtin: true },
+  { id: 'ubuntu-mono', family: 'Ubuntu Mono', builtin: true },
   { id: 'jetbrains-mono', family: 'JetBrains Mono' },
   { id: 'fira-code', family: 'Fira Code' },
   { id: 'source-code-pro', family: 'Source Code Pro' },
   { id: 'ibm-plex-mono', family: 'IBM Plex Mono' },
   { id: 'cascadia-code', family: 'Cascadia Code' },
   { id: 'roboto-mono', family: 'Roboto Mono' },
-  { id: 'ubuntu-mono', family: 'Ubuntu Mono' },
   { id: 'inconsolata', family: 'Inconsolata' },
   { id: 'red-hat-mono', family: 'Red Hat Mono' },
   { id: 'noto-sans-mono', family: 'Noto Sans Mono' },
@@ -536,7 +559,8 @@ const LOG_FONTS = [
   { id: 'dm-mono', family: 'DM Mono', weights: '400,500' },
 ];
 const LOG_SIZES = { tiny: '10.5px', small: '11.5px', medium: '12.5px', large: '14px' };
-const ui = { font: 'system', size: 'medium' };
+const LOG_DENSITIES = ['normal', 'compact'];
+const ui = { font: 'system', size: 'medium', density: 'normal' };
 
 function applyLogFont(id) {
   const f = LOG_FONTS.find((x) => x.id === id) || LOG_FONTS[0];
@@ -546,6 +570,10 @@ function applyLogFont(id) {
     root.removeProperty('--log-font');
     return;
   }
+  if (f.builtin) {
+    root.setProperty('--log-font', `'${f.family}', var(--mono)`);
+    return;
+  }
   const href = `https://fonts.bunny.net/css?family=${f.id}:${f.weights || '400,700'}&display=swap`;
   let link = document.getElementById('logFontCss');
   if (!link) {
@@ -561,13 +589,22 @@ function applyLogSize(id) {
   document.documentElement.style.setProperty('--log-size', LOG_SIZES[ui.size]);
 }
 
+function applyLogDensity(id) {
+  ui.density = LOG_DENSITIES.includes(id) ? id : 'normal';
+  document.documentElement.dataset.density = ui.density;
+}
+
 function renderInterface() {
   renderThemeSwitch();
   for (const b of document.querySelectorAll('#sizeSwitch [data-size]')) {
     b.setAttribute('aria-checked', String(b.dataset.size === ui.size));
   }
+  for (const b of document.querySelectorAll('#densitySwitch [data-density]')) {
+    b.setAttribute('aria-checked', String(b.dataset.density === ui.density));
+  }
   const sel = $('#fontSelect');
-  sel.innerHTML = LOG_FONTS.map((f) => `<option value="${f.id}">${esc(f.family || t('fontSystem'))}</option>`).join('');
+  const fontName = (f) => (!f.family ? t('fontSystem') : f.builtin ? `${f.family} (${t('fontBuiltin')})` : f.family);
+  sel.innerHTML = LOG_FONTS.map((f) => `<option value="${f.id}">${esc(fontName(f))}</option>`).join('');
   sel.value = ui.font;
   renderFontPreview();
   renderHistoSettings();
@@ -591,6 +628,13 @@ $('#sizeSwitch').addEventListener('click', (ev) => {
   store.set('logSize', ui.size);
   renderInterface();
 });
+$('#densitySwitch').addEventListener('click', (ev) => {
+  const b = ev.target.closest('[data-density]');
+  if (!b) return;
+  applyLogDensity(b.dataset.density);
+  store.set('logDensity', ui.density);
+  renderInterface();
+});
 $('#fontSelect').addEventListener('change', (ev) => {
   applyLogFont(ev.target.value);
   store.set('logFont', ui.font);
@@ -681,7 +725,11 @@ function compileMatchers() {
     let src = tag.regex ? tag.pattern : escapeRe(tag.pattern);
     if (tag.wholeWord) src = `(?<![\\p{L}\\p{N}_])(?:${src})(?![\\p{L}\\p{N}_])`;
     try {
-      out.push({ re: new RegExp(src, 'gu' + (tag.caseSensitive ? '' : 'i')), html: `<mark class="tag" style="${tagStyle(tag.color)}">` });
+      // A regex may name a group "hl" to color only that part of the match.
+      const hl = tag.regex && /\(\?P?<hl>/.test(tag.pattern);
+      if (hl) src = src.replace(/\(\?P<hl>/g, '(?<hl>');
+      out.push({ re: new RegExp(src, 'gu' + (hl ? 'd' : '') + (tag.caseSensitive ? '' : 'i')), html: `<mark class="tag" style="${tagStyle(tag.color)}">`,
+        code: tag.code, name: tag.label || tag.pattern });
     } catch (e) {
       console.warn('Tag skipped (invalid pattern):', tag.pattern, e.message);
     }
@@ -706,6 +754,8 @@ function highlight(text) {
     let x;
     while ((x = m.re.exec(text)) !== null) {
       if (x[0] === '') { m.re.lastIndex++; continue; }
+      const g = x.indices?.groups?.hl;
+      if (g) { if (g[1] > g[0]) spans.push({ s: g[0], e: g[1], prio, html: m.html }); continue; }
       spans.push({ s: x.index, e: x.index + x[0].length, prio, html: m.html });
     }
   });
@@ -721,6 +771,30 @@ function highlight(text) {
   return out + esc(text.slice(pos));
 }
 
+// Badges with the codes of the tags found in a message, in list order. The
+// column has room for 3: beyond that, 2 badges and "+N" (all in the tooltip).
+function codesHTML(text) {
+  text = String(text ?? '');
+  const found = [];
+  for (const m of state.matchers) {
+    if (!m.code || !text) continue;
+    m.re.lastIndex = 0;
+    let x;
+    while ((x = m.re.exec(text)) !== null) {
+      if (x[0] === '') { m.re.lastIndex++; continue; }
+      const g = x.indices?.groups?.hl;
+      if (!x.indices?.groups || g) { found.push(m); break; }
+    }
+  }
+  if (!found.length) return '';
+  const shown = found.length > 3 ? found.slice(0, 2) : found;
+  const title = found.map((m) => `${m.code} ${m.name}`).join('\n');
+  return `<span title="${esc(title)}">`
+    + shown.map((m) => `<b>${esc(m.code)}</b>`).join('')
+    + (found.length > 3 ? `<b class="more">+${found.length - 2}</b>` : '')
+    + '</span>';
+}
+
 /* ================= List rendering ================= */
 
 const SEV_CLASS = { emerg: 'crit', alert: 'crit', crit: 'crit', err: 'err', warning: 'warning', notice: 'notice', info: 'info', debug: 'debug' };
@@ -746,6 +820,7 @@ function rowHTML(r, isNew) {
     + (r.app
       ? `<span class="app${r.source_type === 'docker' ? ' proj' : ''}" data-act="app"${r.source_type === 'docker' ? ` style="--h:${hueOf(r.compose_project || r.container || r.app)}"` : ''} title="${esc((r.compose_project ? r.compose_project + '/' : '') + (r.container ? r.container + ' · ' : '') + r.app + ' · ' + t('clickApp'))}">${r.source_type === 'docker' ? DOCKER_ICON : ''}${esc(r.app)}</span>`
       : '<span class="app"></span>')
+    + `<span class="codes">${codesHTML(r._msg)}</span>`
     + `<div class="msg">${highlight(r._msg)}</div>`
     + '</article>';
 }
@@ -812,7 +887,9 @@ function renderList() {
 function rehighlight() {
   for (const row of list.children) {
     const r = recOf.get(row);
-    if (r) row.querySelector('.msg').innerHTML = highlight(r._msg);
+    if (!r) continue;
+    row.querySelector('.msg').innerHTML = highlight(r._msg);
+    row.querySelector('.codes').innerHTML = codesHTML(r._msg);
   }
 }
 
@@ -1978,6 +2055,28 @@ $('#purgeBtn').addEventListener('click', async () => {
 
 const PALETTE = ['#6366f1', '#0ea5e9', '#14b8a6', '#a855f7', '#ec4899', '#eab308', '#64748b', '#f97316'];
 
+// Ready-made tags for HTTP/HTTPS access logs. The patterns are valid in both
+// JavaScript and Go (RE2) and cover nginx/Apache (common, combined), Traefik
+// (CLF, JSON), Caddy (JSON) and HAProxy (httplog). For status codes and
+// methods only the "hl" group is colored, not the context around it.
+const HTTP_STATUS_CTX = '(?:" |"(?:status|DownstreamStatus|OriginStatus|status_code)": ?|(?:-1|\\d+)/(?:-1|\\d+)/(?:-1|\\d+)/(?:-1|\\d+)/\\+?\\d+ )';
+const httpStatus = (d, color) => ({ label: `HTTP ${d}xx`, pattern: `${HTTP_STATUS_CTX}(?<hl>${d}\\d\\d)\\b`, color });
+const httpMethod = (m, color) => ({ label: m.replace(/\|/g, '/'), pattern: `"(?<hl>${m})[ "]`, color, caseSensitive: true });
+const PRESETS = {
+  http_status: () => [httpStatus(2, '#86efac'), httpStatus(3, '#93c5fd'), httpStatus(4, '#fdba74'), httpStatus(5, '#f87171')],
+  http_methods: () => [httpMethod('GET|HEAD|OPTIONS', '#cbd5e1'), httpMethod('POST|PUT|PATCH', '#c4b5fd'), httpMethod('DELETE', '#f9a8d4')],
+  http_probes: () => [{ label: t('pl_probes'), color: '#fda4af',
+    pattern: '(?:wp-login\\.php|xmlrpc\\.php|wp-admin|phpmyadmin|/\\.env|/\\.git|/\\.aws|/cgi-bin/|\\.\\./|%2e%2e|/etc/passwd|<script|union(?:\\s|%20|\\+)+select)' }],
+  http_bots: () => [{ label: t('pl_bots'), color: '#fde68a',
+    pattern: '\\b(?:[a-z]*bot|crawler|spider|curl|wget|python-requests|Go-http-client|zgrab|masscan|nmap|sqlmap|nikto)\\b' }],
+  http_errors: () => [
+    { label: t('pl_tls'), color: '#f0abfc',
+      pattern: '(?:TLS handshake error|SSL_do_handshake\\(\\) failed|SSL handshake|SSL routines|certificate (?:has )?expired|certificate verify failed|bad certificate|unknown certificate|x509:)' },
+    { label: t('pl_proxy'), color: '#fdba74',
+      pattern: '(?:upstream timed out|upstream prematurely closed|no live upstreams|connect\\(\\) failed|connection refused|bad gateway|gateway time-?out|service unavailable)' },
+  ],
+};
+
 async function loadTags() {
   try { state.tags = await api('/api/tags'); } catch (e) { toast(t('tagsLoadErr') + e.message); }
   compileMatchers();
@@ -1987,9 +2086,10 @@ function tagRowHTML(tag) {
   const opt = (field, label, title) =>
     `<label class="opt" title="${esc(title)}"><input type="checkbox" data-f="${field}"${tag[field] ? ' checked' : ''}>${esc(label)}</label>`;
   return `<div class="tag-row${tag.enabled ? '' : ' off'}" data-id="${esc(tag.id)}">
+    <span class="tag-code" title="${esc(t('tagCodeTitle'))}">${esc(tag.code || '··')}</span>
     <input type="color" value="${esc(tag.color)}" data-f="color" aria-label="${esc(t('colorAria'))}">
     <input type="text" value="${esc(tag.pattern)}" data-f="pattern" placeholder="${esc(t('keyword'))}" spellcheck="false" aria-label="${esc(t('keyword'))}">
-    <span class="preview"><mark class="tag" style="${tagStyle(tag.color)}">${esc(tag.pattern || t('preview'))}</mark></span>
+    <span class="preview" title="${esc(tag.pattern)}"><mark class="tag" style="${tagStyle(tag.color)}">${esc(tag.label || tag.pattern || t('preview'))}</mark></span>
     <div class="opts">
       ${opt('wholeWord', t('optWhole'), t('optWholeTitle'))}
       ${opt('caseSensitive', 'Aa', t('optCaseTitle'))}
@@ -2032,7 +2132,7 @@ $('#tagList').addEventListener('input', (ev) => {
   tag[field] = ev.target.type === 'checkbox' ? ev.target.checked : ev.target.value;
   rowEl.classList.toggle('off', !tag.enabled);
   const mark = rowEl.querySelector('.preview mark');
-  mark.textContent = tag.pattern || t('preview');
+  mark.textContent = tag.label || tag.pattern || t('preview');
   mark.setAttribute('style', tagStyle(tag.color));
   scheduleSave(tag, rowEl);
   applyTags();
@@ -2065,6 +2165,24 @@ $('#addTag').addEventListener('click', async () => {
   } catch (e) { toast(e.message); }
 });
 
+// Adds a preset group, skipping tags whose pattern is already in the list.
+$('#presetTags').addEventListener('change', async (ev) => {
+  const make = PRESETS[ev.target.value];
+  ev.target.value = '';
+  if (!make) return;
+  let added = 0;
+  try {
+    for (const p of make()) {
+      if (state.tags.some((x) => x.pattern === p.pattern)) continue;
+      state.tags.push(await api('/api/tags', { method: 'POST', body: { regex: true, enabled: true, ...p } }));
+      added++;
+    }
+  } catch (e) { toast(e.message); }
+  renderTagList();
+  applyTags();
+  toast(t('presetAdded', added));
+});
+
 $('#resetTags').addEventListener('click', async () => {
   if (!confirm(t('confirmReset'))) return;
   try {
@@ -2098,12 +2216,13 @@ $('#settingsDlg').addEventListener('click', (ev) => { if (ev.target === ev.curre
 }
 applyLogFont(store.get('logFont', 'system'));
 applyLogSize(store.get('logSize', 'medium'));
+applyLogDensity(store.get('logDensity', 'normal'));
 applyLang();
 $('#range').value = store.get('range', '1h');
 if (!$('#range').value) $('#range').value = '1h';
 $('#severity').value = store.get('severity', '');
 
-// With OIDC login, show who is logged in and the log out button.
+// With a login (local or OIDC), show who is logged in and the log out button.
 fetch('/auth/me').then((res) => (res.ok ? res.json() : null)).then((me) => {
   if (!me || !me.user) return;
   const btn = $('#logoutBtn');

web/fonts/OFL-Inconsolata.txt

@@ -0,0 +1,93 @@
+Copyright 2006 The Inconsolata Project Authors (https://github.com/cyrealtype/Inconsolata)
+
+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/OFL-Iosevka.txt

@@ -0,0 +1,110 @@
+Copyright (c) 2015-2023, Renzhi Li (aka. Belleve Invis, belleve@typeof.net)
+
+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 v1.1
+====================================================
+
+
+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/UFL-Ubuntu-Mono.txt

@@ -0,0 +1,96 @@
+-------------------------------
+UBUNTU FONT LICENCE Version 1.0
+-------------------------------
+
+PREAMBLE
+This licence allows the licensed fonts to be used, studied, modified and
+redistributed freely. The fonts, including any derivative works, can be
+bundled, embedded, and redistributed provided the terms of this licence
+are met. The fonts and derivatives, however, cannot be released under
+any other licence. The requirement for fonts to remain under this
+licence does not require any document created using the fonts or their
+derivatives to be published under this licence, as long as the primary
+purpose of the document is not to be a vehicle for the distribution of
+the fonts.
+
+DEFINITIONS
+"Font Software" refers to the set of files released by the Copyright
+Holder(s) under this licence and clearly marked as such. This may
+include source files, build scripts and documentation.
+
+"Original Version" refers to the collection of Font Software components
+as received under this licence.
+
+"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.
+
+"Copyright Holder(s)" refers to all individuals and companies who have a
+copyright ownership of the Font Software.
+
+"Substantially Changed" refers to Modified Versions which can be easily
+identified as dissimilar to the Font Software by users of the Font
+Software comparing the Original Version with the Modified Version.
+
+To "Propagate" a work means to do anything with it that, without
+permission, would make you directly or secondarily liable for
+infringement under applicable copyright law, except executing it on a
+computer or modifying a private copy. Propagation includes copying,
+distribution (with or without modification and with or without charging
+a redistribution fee), making available to the public, and in some
+countries other activities as well.
+
+PERMISSION & CONDITIONS
+This licence does not grant any rights under trademark law and all such
+rights are reserved.
+
+Permission is hereby granted, free of charge, to any person obtaining a
+copy of the Font Software, to propagate the Font Software, subject to
+the below conditions:
+
+1) Each copy of the Font Software must contain the above copyright
+notice and this licence. 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.
+
+2) The font name complies with the following:
+(a) The Original Version must retain its name, unmodified.
+(b) Modified Versions which are Substantially Changed must be renamed to
+avoid use of the name of the Original Version or similar names entirely.
+(c) Modified Versions which are not Substantially Changed must be
+renamed to both (i) retain the name of the Original Version and (ii) add
+additional naming elements to distinguish the Modified Version from the
+Original Version. The name of such Modified Versions must be the name of
+the Original Version, with "derivative X" where X represents the name of
+the new work, appended to that name.
+
+3) The name(s) of the Copyright Holder(s) and any contributor to the
+Font Software shall not be used to promote, endorse or advertise any
+Modified Version, except (i) as required by this licence, (ii) to
+acknowledge the contribution(s) of the Copyright Holder(s) or (iii) with
+their explicit written permission.
+
+4) The Font Software, modified or unmodified, in part or in whole, must
+be distributed entirely under this licence, and must not be distributed
+under any other licence. The requirement for fonts to remain under this
+licence does not affect any document created using the Font Software,
+except any version of the Font Software extracted from a document
+created using the Font Software may only be distributed under this
+licence.
+
+TERMINATION
+This licence 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/index.html

@@ -3,7 +3,7 @@
 <head>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, initial-scale=1">
-  <title>Logstream</title>
+  <title>LogStream</title>
   <link rel="icon" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Crect width='32' height='32' rx='8' fill='%236366f1'/%3E%3Cpath d='M8 10h16M8 16h11M8 22h14' stroke='white' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E">
   <link rel="stylesheet" href="style.css">
   <script>
@@ -20,7 +20,7 @@
   <header class="topbar">
     <div class="brand">
       <svg viewBox="0 0 32 32" aria-hidden="true"><rect width="32" height="32" rx="8"/><path d="M8 10h16M8 16h11M8 22h14"/></svg>
-      <span>Logstream</span>
+      <span>LogStream</span>
     </div>
 
     <div class="search">
@@ -107,6 +107,7 @@
       <span data-col="sev"><span class="lbl" data-i18n="colSev">Severity</span><i class="grip" data-i18n-title="colGrip"></i></span>
       <span data-col="host"><span class="lbl" data-i18n="colHost">Host</span><i class="grip" data-i18n-title="colGrip"></i></span>
       <span data-col="app"><span class="lbl" data-i18n="colApp">App</span><i class="grip" data-i18n-title="colGrip"></i></span>
+      <span data-col="codes"><span class="lbl" data-i18n="colCodes" data-i18n-title="codesTitle">Filters</span></span>
       <span data-col="msg"><span class="lbl" data-i18n="colMsg">Message</span></span>
     </div>
     <main id="list" class="list"></main>
@@ -188,7 +189,17 @@
               <p class="muted small" data-i18n="tagsHelp"></p>
               <div id="tagList" class="tag-list"></div>
               <footer>
-                <button id="addTag" class="btn primary" type="button" data-i18n="addTag">+ Add tag</button>
+                <span class="tag-add">
+                  <button id="addTag" class="btn primary" type="button" data-i18n="addTag">+ Add tag</button>
+                  <select id="presetTags" class="field" aria-label="Presets" data-i18n-aria="presetAria">
+                    <option value="" data-i18n="presetPick">+ Preset…</option>
+                    <option value="http_status" data-i18n="preset_http_status">HTTP status codes</option>
+                    <option value="http_methods" data-i18n="preset_http_methods">HTTP methods</option>
+                    <option value="http_probes" data-i18n="preset_http_probes">Probes and attacks</option>
+                    <option value="http_bots" data-i18n="preset_http_bots">Bots and scripts</option>
+                    <option value="http_errors" data-i18n="preset_http_errors">TLS/HTTPS and proxy errors</option>
+                  </select>
+                </span>
                 <button id="resetTags" class="btn ghost" type="button" data-i18n="resetTags">Restore default tags</button>
               </footer>
             </section>
@@ -271,6 +282,11 @@
                   <button type="button" role="radio" data-size="medium" data-i18n="sizeMedium">Medium</button>
                   <button type="button" role="radio" data-size="large" data-i18n="sizeLarge">Large</button>
                 </div>
+                <span class="lbl" data-i18n="density">Density</span>
+                <div id="densitySwitch" class="seg" role="radiogroup" data-i18n-aria="density">
+                  <button type="button" role="radio" data-density="normal" data-i18n="densityNormal">Normal</button>
+                  <button type="button" role="radio" data-density="compact" data-i18n="densityCompact">Compact</button>
+                </div>
                 <label for="fontSelect" data-i18n="fontLabel">Font</label>
                 <select id="fontSelect" class="field"></select>
               </div>

web/login.html

@@ -0,0 +1,95 @@
+<!doctype html>
+<html lang="en">
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <title>LogStream</title>
+  <link rel="icon" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Crect width='32' height='32' rx='8' fill='%236366f1'/%3E%3Cpath d='M8 10h16M8 16h11M8 22h14' stroke='white' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E">
+  <link rel="stylesheet" href="style.css">
+  <script>
+    // Same saved theme and language as the UI, applied before first paint.
+    try {
+      var t = localStorage.getItem('logstream.theme');
+      if (t === 'light' || t === 'dark') document.documentElement.dataset.theme = t;
+      var l = localStorage.getItem('logstream.lang');
+      if (l) document.documentElement.lang = l;
+    } catch (e) {}
+  </script>
+</head>
+<body class="login-page">
+  <div class="login-tools">
+    <div class="seg" role="radiogroup" id="langSwitch">
+      <button type="button" role="radio" data-lang="fr">FR</button>
+      <button type="button" role="radio" data-lang="en">EN</button>
+    </div>
+    <button id="themeBtn" class="icon-btn" type="button" data-i18n-title="theme" data-i18n-aria="theme">
+      <svg class="sun" viewBox="0 0 24 24"><circle cx="12" cy="12" r="4"/><path d="M12 2v2M12 20v2M4.9 4.9l1.4 1.4M17.7 17.7l1.4 1.4M2 12h2M20 12h2M4.9 19.1l1.4-1.4M17.7 6.3l1.4-1.4"/></svg>
+      <svg class="moon" viewBox="0 0 24 24"><path d="M21 12.8A9 9 0 1 1 11.2 3a7 7 0 0 0 9.8 9.8z"/></svg>
+    </button>
+  </div>
+
+  <main class="login-card">
+    <img id="logo" class="login-logo" src="auth/logo" alt="" hidden>
+    <div class="brand">
+      <svg viewBox="0 0 32 32" aria-hidden="true"><rect width="32" height="32" rx="8"/><path d="M8 10h16M8 16h11M8 22h14"/></svg>
+      <span>LogStream</span>
+    </div>
+    <p class="muted" data-i18n="intro">Sign in to view the logs.</p>
+
+    <form method="post" action="auth/login">
+      <input type="hidden" name="r" id="ret">
+      <label for="user" data-i18n="user">User</label>
+      <input id="user" name="user" type="text" autocomplete="username" autocapitalize="none" spellcheck="false" required autofocus>
+      <label for="pass" data-i18n="pass">Password</label>
+      <input id="pass" name="pass" type="password" autocomplete="current-password" required>
+      <p id="err" class="login-err" role="alert" data-i18n="error" hidden>Wrong user or password.</p>
+      <button class="btn primary" type="submit" data-i18n="submit">Sign in</button>
+    </form>
+  </main>
+
+  <script>
+    (function () {
+      var I18N = {
+        en: { intro: 'Sign in to view the logs.', user: 'User', pass: 'Password', submit: 'Sign in',
+              error: 'Wrong user or password.', theme: 'Light / dark theme' },
+        fr: { intro: 'Connectez-vous pour consulter les logs.', user: 'Utilisateur', pass: 'Mot de passe',
+              submit: 'Se connecter', error: 'Utilisateur ou mot de passe incorrect.', theme: 'Thème clair / sombre' },
+      };
+      function get(k) { try { return localStorage.getItem('logstream.' + k); } catch (e) { return null; } }
+      function set(k, v) { try { localStorage.setItem('logstream.' + k, v); } catch (e) {} }
+      var lang = get('lang');
+      if (!I18N[lang]) lang = /^fr\b/i.test(navigator.language || '') ? 'fr' : 'en';
+
+      function applyLang() {
+        var d = I18N[lang];
+        document.documentElement.lang = lang;
+        document.querySelectorAll('[data-i18n]').forEach(function (el) { el.textContent = d[el.dataset.i18n]; });
+        document.querySelectorAll('[data-i18n-title]').forEach(function (el) { el.title = d[el.dataset.i18nTitle]; });
+        document.querySelectorAll('[data-i18n-aria]').forEach(function (el) { el.setAttribute('aria-label', d[el.dataset.i18nAria]); });
+        document.querySelectorAll('#langSwitch [data-lang]').forEach(function (b) { b.setAttribute('aria-checked', String(b.dataset.lang === lang)); });
+      }
+      document.querySelectorAll('#langSwitch [data-lang]').forEach(function (b) {
+        b.addEventListener('click', function () { lang = b.dataset.lang; set('lang', lang); applyLang(); });
+      });
+
+      document.getElementById('themeBtn').addEventListener('click', function () {
+        var root = document.documentElement;
+        var dark = root.dataset.theme ? root.dataset.theme === 'dark' : matchMedia('(prefers-color-scheme: dark)').matches;
+        root.dataset.theme = dark ? 'light' : 'dark';
+        set('theme', root.dataset.theme);
+      });
+
+      var q = new URLSearchParams(location.search);
+      document.getElementById('ret').value = q.get('r') || '/';
+      document.getElementById('err').hidden = q.get('e') !== '1';
+
+      // LOGIN_LOGO: shown only when the server has one.
+      var logo = document.getElementById('logo');
+      logo.addEventListener('load', function () { logo.hidden = false; });
+      if (logo.complete && logo.naturalWidth) logo.hidden = false;
+
+      applyLang();
+    })();
+  </script>
+</body>
+</html>

web/style.css

@@ -1,3 +1,13 @@
+/* Narrow monospace fonts served by LogStream itself, so they also work offline (licences in
+   web/fonts). Latin subset only; other scripts fall back to --mono. Inconsolata Condensed is
+   Inconsolata's variable font pinned at width 75 (0.4em per character, others 0.5em). */
+@font-face { font-family: "Iosevka"; src: url("fonts/iosevka-400.woff2") format("woff2"); font-weight: 400 500; font-display: swap; }
+@font-face { font-family: "Iosevka"; src: url("fonts/iosevka-700.woff2") format("woff2"); font-weight: 600 800; font-display: swap; }
+@font-face { font-family: "Ubuntu Mono"; src: url("fonts/ubuntu-mono-400.woff2") format("woff2"); font-weight: 400 500; font-display: swap; }
+@font-face { font-family: "Ubuntu Mono"; src: url("fonts/ubuntu-mono-700.woff2") format("woff2"); font-weight: 600 800; font-display: swap; }
+@font-face { font-family: "Inconsolata Condensed"; src: url("fonts/inconsolata-condensed-400.woff2") format("woff2"); font-weight: 400 500; font-display: swap; }
+@font-face { font-family: "Inconsolata Condensed"; src: url("fonts/inconsolata-condensed-700.woff2") format("woff2"); font-weight: 600 800; font-display: swap; }
+
 /* ---------- Theme: everything goes through these variables ---------- */
 :root {
   --bg: #f6f7f9;
@@ -38,6 +48,8 @@
   --tag-warning-text: #111827;
 
   --log-size: 12.5px;   /* Settings > Interface > Font size */
+  --codes-w: 4.9rem;    /* tag codes column: room for 3 badges */
+  --code-bg: #858c97;   /* tag code badges */
   /* --log-font is set by Settings > Interface > Font (defaults to --mono) */
   --mono: ui-monospace, "SF Mono", "JetBrains Mono", "Cascadia Code", Menlo, Consolas, monospace;
   --sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
@@ -296,13 +308,13 @@ body.busy .progress::after {
 .list { margin: 6px 20px 0; background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; }
 .list:empty { display: none; }
 
-/* Columns: received, message time, severity, host, app, message. Widths come from
+/* Columns: received, message time, severity, host, app, tag codes, message. Widths come from
    --col-* (set on #table when a column has been resized, see app.js), shared by
    the header and every row through subgrid so that the columns line up. */
 .table {
   display: grid;
   grid-template-columns: var(--col-rcv, max-content) var(--col-mt, max-content) var(--col-sev, 4.6rem)
-    var(--col-host, minmax(5rem, 9rem)) var(--col-app, minmax(4rem, 8rem)) minmax(0, 1fr);
+    var(--col-host, minmax(5rem, 9rem)) var(--col-app, minmax(4rem, 8rem)) var(--codes-w) minmax(0, 1fr);
   column-gap: 12px;
   margin: 6px 20px 0; background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius);
   overflow: clip; /* rounded corners without breaking the sticky header (hidden would) */
@@ -331,7 +343,7 @@ body.col-resizing, body.col-resizing * { cursor: col-resize !important; user-sel
 
 .row {
   display: grid;
-  grid-template-columns: max-content max-content 4.6rem minmax(5rem, 9rem) minmax(4rem, 8rem) 1fr;
+  grid-template-columns: max-content max-content 4.6rem minmax(5rem, 9rem) minmax(4rem, 8rem) var(--codes-w) 1fr;
   gap: 0 12px; align-items: baseline;
   padding: 5px 14px 5px 11px;
   border-left: 3px solid transparent;
@@ -341,6 +353,10 @@ body.col-resizing, body.col-resizing * { cursor: col-resize !important; user-sel
   cursor: pointer;
 }
 .row:last-child { border-bottom: 0; }
+/* Settings > Interface > Density: compact fits about 50% more lines on screen */
+:root[data-density="compact"] .row { padding-top: 1px; padding-bottom: 1px; line-height: 1.25; }
+:root[data-density="compact"] .row .sev { padding-top: 0; padding-bottom: 0; line-height: 1.3; }
+:root[data-density="compact"] .row .codes b { padding-top: 0; padding-bottom: 0; line-height: 1.2; }
 .row:hover { background: var(--row-hover); }
 .row:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
 .row.new { animation: flash 1.2s ease-out; }
@@ -372,6 +388,17 @@ body.col-resizing, body.col-resizing * { cursor: col-resize !important; user-sel
 .row.sev-crit, .row.sev-err, .row.sev-warning { border-left-color: var(--sev); }
 .row.sev-crit, .row.sev-err { background: color-mix(in srgb, var(--sev) 7%, transparent); }
 .row .host[data-act], .row .app[data-act] { cursor: pointer; }
+/* Codes of the tags found in the message: grey badges, fixed size */
+.row .codes { white-space: nowrap; overflow: hidden; }
+.row .codes > span { display: inline-flex; gap: 3px; vertical-align: 1px; }
+.row .codes b, .tag-code {
+  min-width: 2.2ch; padding: 1px 4px; border-radius: 5px; text-align: center;
+  /* same font as the severity badges (the log font) */
+  font-family: var(--log-font, var(--mono)); font-size: 10.5px; font-weight: 700; letter-spacing: .03em;
+  line-height: 1.35; font-variant-numeric: tabular-nums;
+  background: var(--code-bg); color: #0b0f17;
+}
+.row .codes b.more { background: none; box-shadow: inset 0 0 0 1px var(--code-bg); color: var(--muted); }
 .row .host[data-act]:hover, .row .app[data-act]:hover { color: var(--accent); text-decoration: underline; text-underline-offset: 2px; }
 
 mark.tag {
@@ -475,6 +502,7 @@ dialog.settings .dlg > header { padding: 14px 16px 14px 22px; border-bottom: 1px
 .preview-list .row .host { grid-area: host; }
 .preview-list .row .app { grid-area: app; display: block; }
 .preview-list .row .msg { grid-area: msg; }
+.preview-list .row .codes { display: none; }
 
 dialog {
   width: min(720px, calc(100vw - 32px)); max-height: calc(100vh - 64px);
@@ -578,6 +606,8 @@ input.switch:disabled { cursor: not-allowed; }
 input.switch:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
 
 .set-section footer { display: flex; flex-wrap: wrap; gap: 8px; justify-content: space-between; margin-top: 14px; }
+.tag-add { display: flex; flex-wrap: wrap; gap: 8px; }
+.tag-add select.field { width: auto; }
 
 .seg { display: inline-flex; padding: 3px; gap: 3px; background: var(--panel-2); border: 1px solid var(--border); border-radius: 10px; }
 .seg button {
@@ -590,11 +620,12 @@ input.switch:focus-visible { outline: 2px solid var(--accent); outline-offset: 2
 .tag-list { display: flex; flex-direction: column; gap: 8px; margin-top: 12px; }
 .tag-row {
   display: grid; align-items: center; gap: 8px 10px;
-  grid-template-columns: 38px minmax(8rem, 1fr) 7.5rem auto 36px;
+  grid-template-columns: auto 38px minmax(8rem, 1fr) 7.5rem auto 36px;
   padding: 8px 10px; border: 1px solid var(--border); border-radius: 10px;
   background: var(--panel-2);
 }
 .tag-row.off { opacity: .55; }
+.tag-row .tag-code { font-size: 12px; padding: 3px 6px; cursor: default; }
 .tag-row input[type="color"] {
   width: 38px; height: 32px; padding: 0; border: 1px solid var(--border); border-radius: 8px;
   background: none; cursor: pointer;
@@ -637,8 +668,8 @@ input.switch:focus-visible { outline: 2px solid var(--accent); outline-offset: 2
   .table .list { display: block; margin: 0; }
   .list-head { display: none; }
   .row, .table .row {
-    grid-template-columns: auto auto 1fr;
-    grid-template-areas: "rcv sev host" "msg msg msg";
+    grid-template-columns: auto auto 1fr auto;
+    grid-template-areas: "rcv sev host codes" "msg msg msg msg";
     gap: 3px 8px; padding: 8px 12px 8px 10px;
   }
   .row time.rcv { grid-area: rcv; }
@@ -646,6 +677,7 @@ input.switch:focus-visible { outline: 2px solid var(--accent); outline-offset: 2
   .row .sev { grid-area: sev; }
   .row .host { grid-area: host; justify-self: end; max-width: 100%; }
   .row .app { display: none; }
+  .row .codes { grid-area: codes; }
   .row .msg { grid-area: msg; }
   .details { grid-column: 1 / -1; }
   .details dl { grid-template-columns: 1fr; }
@@ -663,12 +695,39 @@ input.switch:focus-visible { outline: 2px solid var(--accent); outline-offset: 2
   }
   .set-nav button span { max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
   .set-panels { padding: 0 16px 18px; }
-  #sizeSwitch { display: flex; }
-  #sizeSwitch button { flex: 1; padding: 0 4px; white-space: nowrap; font-size: 12px; }
+  #sizeSwitch, #densitySwitch { display: flex; }
+  #sizeSwitch button, #densitySwitch button { flex: 1; padding: 0 4px; white-space: nowrap; font-size: 12px; }
+  :root[data-density="compact"] .row { padding-top: 3px; padding-bottom: 3px; }
   .field-grid select { margin-bottom: 6px; }
   .status { padding: 6px 16px; }
-  .tag-row { grid-template-columns: 38px 1fr 36px; }
+  .tag-row { grid-template-columns: auto 38px 1fr 36px; }
   .tag-row .preview { display: none; }
   .tag-row .opts { grid-column: 1 / -1; grid-row: 2; flex-wrap: wrap; }
-  .tag-row [data-del] { grid-column: 3; grid-row: 1; }
+  .tag-row [data-del] { grid-column: 4; grid-row: 1; }
 }
+
+/* ---------- Login page (AUTH_MODE=local) ---------- */
+body.login-page {
+  min-height: 100vh; padding: 16px;
+  display: grid; place-items: center;
+}
+.login-tools { position: fixed; top: 12px; right: 16px; display: flex; align-items: center; gap: 8px; }
+.login-card {
+  width: 100%; max-width: 360px;
+  display: flex; flex-direction: column; align-items: center; gap: 10px;
+  padding: 32px 28px 28px;
+  background: var(--panel); border: 1px solid var(--border); border-radius: 14px; box-shadow: var(--shadow);
+}
+.login-logo { max-width: 200px; max-height: 96px; object-fit: contain; margin-bottom: 6px; }
+.login-card .brand { font-size: 20px; }
+.login-card .brand svg { width: 32px; height: 32px; }
+.login-card > p { margin: 0 0 8px; text-align: center; }
+.login-card form { width: 100%; display: flex; flex-direction: column; gap: 6px; }
+.login-card label { font-size: 13px; font-weight: 550; }
+.login-card input {
+  height: 38px; padding: 0 11px; margin-bottom: 6px;
+  border: 1px solid var(--border); border-radius: 9px; background: var(--bg);
+}
+.login-card input:focus { outline: 0; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
+.login-card .btn.primary { height: 38px; justify-content: center; margin-top: 6px; font-size: 14px; }
+.login-err { margin: 0; color: var(--sev-err); font-size: 13px; }