feat(go): M6.5 — member-detail modal JS module for /adults and /juniors

Adds static/js/member-detail.js: fetches /api/<page> once on page load,
caches the response, and renders a per-member detail modal on [i] row click.
Keyboard nav: Esc closes, ↑/↓ walk visible (filtered) rows. All modal CSS
was already in place from M6.1.

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

CHANGELOG.md

@@ -1,5 +1,60 @@
 # Changelog
 
+## 2026-05-08 12:48 CEST — feat(go): M6.4 — Go-native /payments page
+
+- Extracted `AssemblePayments(ctx)` from the inlined JSON handler body, following the M6.2/M6.3 `AssembleAdults`/`AssembleJuniors` pattern.
+- Added `PaymentsPageData` to `render.go`; wired `HTMLHandler.ServePayments` to call `AssemblePayments` and render the new template.
+- Replaced the "Coming in M6.4" placeholder in `payments.tmpl` with the full grouped-by-person ledger: alphabetical `<h2>` member blocks, each with a `txn-table` (Date / Amount / Purpose / Bank Message), newest-first rows, `"Unmatched / Unknown"` bucket.
+- Appended ledger CSS classes to `app.css` (`.ledger-container`, `.member-block`, `.txn-table`, `.txn-{date,amount,purpose,message}`, `tr:hover`).
+- Added `TestPaymentsPage` markup test. No filters, no JS — matches the Python page.
+
+## 2026-05-08 11:25 CEST — feat(go): M6.3 — Go-native /juniors page
+
+- Extracted `AssembleJuniors(ctx)` from the JSON handler so HTML and JSON share one view-model path (mirrors `AssembleAdults`).
+- Added `JuniorsPageData` to `render.go`; wired `HTMLHandler.ServeJuniors` to call `AssembleJuniors` and render the new template.
+- Replaced the 4-line "Coming in M6.3" placeholder in `juniors.tmpl` with the full template: member table, name/month-range filters, totals row, Credits + Debts sections, Pay / Pay All links to `/qr`. No Unmatched section (parity with Python).
+- J/A attendance breakdown and `"?"` sentinel rendered via `MonthCell.Text` produced by `buildJuniorMemberRow` — no extra template logic.
+- `make parity` reports 3/3 routes OK; all Go tests pass.
+
+## 2026-05-08 11:11 CEST — fix: period selector showed only Dec 2025+ on adults
+
+- Restored the `2025-09 → 2025-10` adult merge in `scripts/attendance.py` and `go/internal/services/membership/sources.go` (commented-out by `1257f0d`); the `2025-12 → 2026-01` mapping stays disabled per product decision (Dec and Jan are billed separately for adults).
+- Dropped the `defaultFrom = maxMonthIdx − 4` JS auto-default in `templates/adults.html` and `templates/juniors.html` (introduced by `7774301`); the From-selector now starts at the oldest available month so all non-future periods render on first load. Future-month removal is preserved.
+- `go/internal/services/membership/sources_test.go`: `TestLoadAdults` / `TestLoadAdults_Fee` now assert that Sep dates land in the merged `2025-10` bucket.
+- **Independent of these code changes**: the live adults attendance Google Sheet header had been pruned to start at `02.12.2025` (Sep/Oct/Nov 2025 columns deleted); restoring those columns from Sheets version history is required to actually see those periods on the dashboard.
+
+## 2026-05-08 10:15 CEST — fix(go): adults template — use lifted CSS classes for visual parity
+
+- Use existing `.balance-pos` / `.balance-neg` (drop invented `balance-cell` / `balance-negative`); Pay-All button now lives inside the balance cell with `position: relative` (matches Python; no separate trailing column).
+- Credits / Debts / Unmatched sections rewritten from `<ul>` / `<table>` to `<div class="list-container"><div class="list-item">…` / `<div class="unmatched-row">…` so the lifted CSS actually applies.
+- Section headings get the descriptive Python text: "Credits (Advance Payments / Surplus)", "Debts (Missing Payments)".
+- Source links moved from page bottom to a `<div class="description">` block under the h1, matching Python's "Source: Attendance Sheet | Payments Ledger".
+- Total row uses `cell-{{Status}}` plus the small "received / expected" caption span and Python's inline-styled bold/dark background.
+- Drop the redundant `class="cell"` wrapper; debts amount turns red via inline style; balance value drops the trailing "CZK".
+
+## 2026-05-08 01:09 CEST — feat(go): M6.2 — adults page (table, filters, Pay buttons)
+
+- `go/internal/web/api/handler.go`: extracted `ServeAdults` body into `AssembleAdults(ctx)` — shared by the JSON API route and the new HTML handler.
+- `go/internal/web/render.go`: added `AdultsPageData` view model (`PageData` + `api.AdultsResponse` + `Error`); `tmplFuncs` with `qrHref` / `qrHrefAll` (URL-encode QR Platba params, convert YYYY-MM → MM/YYYY).
+- `go/internal/web/html_handler.go`: `HTMLHandler` gains `*api.Handler`; `ServeAdults` loads real reconcile data and renders the full adults page.
+- `go/internal/web/templates/adults.tmpl`: full table (per-member rows, per-cell status classes, `data-month-idx`, Pay button hrefs to `/qr`), totals row, credits/debts/unmatched sections, filter controls, sheet links.
+- `go/internal/web/static/js/filters.js`: name filter (NFD-normalize) + month-range hide/show by `data-month-idx`; future months hidden by default.
+
+## 2026-05-08 00:44 CEST — feat(go): M6.1 — template skeleton + embed.FS
+
+- `go/internal/web/templates/`: `base.tmpl` (full HTML layout), `partials/nav.tmpl` (three-tier nav with active-link highlighting), `partials/footer.tmpl` (build meta), and stub pages for each route (adults/juniors/payments/sync/flush_cache).
+- `go/internal/web/static/css/app.css`: terminal-green-on-black theme extracted once from Python `templates/adults.html` — shared by all Go HTML pages via `<link>`.
+- `go/internal/web/assets.go`: `//go:embed templates static` for single-binary deployment.
+- `go/internal/web/render.go`: `Renderer` parses a fresh `*template.Template` per page at startup; `Render(w, name, data)` executes the "base" template block.
+- `go/internal/web/html_handler.go`: `HTMLHandler` with one method per route (`ServeAdults`, `ServeJuniors`, `ServePayments`, `ServeSync`, `ServeFlushCache`).
+- `go/internal/web/server.go`: drops `helloHandler`; `GET /{$}` now redirects to `/adults`; HTML + `/static/` routes registered alongside the existing `/api/*` routes.
+- `go/internal/web/html_handler_test.go`: smoke test — each route returns 200 `text/html` with exactly one `class="active"` on the matching nav link.
+
+## 2026-05-08 00:26 CEST — fix(py): parity coercions — amount/message types + junior '?' sticky
+
+- `scripts/match_payments.py`: added `get_float` helper — non-numeric `amount` values (e.g. `"---"` placeholder rows) now coerce to `0.0` matching Go's `parseFloat` behaviour; `message` field now goes through `get_str` so numeric cell values (bank references) are emitted as strings, matching Go's `fmt.Sprint`.
+- `scripts/views.py`: junior month cell `"?"` text is now sticky across exception overrides. Previously `reconcile` replaced `expected` with the exception amount before the view builder ran, silently turning `"?"` into `"-"` when the override was 0. Fixed by deriving `is_unknown` from `original_expected == "?"` instead of `expected == "?"`. Also aligned tooltip guard: only show Received/Expected for non-unknown months (or when paid > 0), matching Go's `!md.IsUnknown` condition.
+
 ## 2026-05-07 23:51 CEST — feat(py): M5.4 fix #2 — add vs and sync_id to payments tx projection
 
 - `scripts/match_payments.py`: `fetch_sheet_data` now reads `VS` and `Sync ID` columns and includes `vs`/`sync_id` keys in every tx dict. Previously only 9 columns were projected, causing `make parity` to report extra `vs`/`sync_id` fields on every raw payment row emitted by the Go backend. Values flow through `group_payments_by_person` → `_unwrap_view_model_for_api` to `raw_payments` (adults/juniors) and `grouped_payments` (payments) automatically.

docs/plans/2026-05-03-2349-go-backend-rewrite-progress.md

@@ -2,9 +2,9 @@
 
 Companion to [2026-05-03-2349-go-backend-rewrite.md](2026-05-03-2349-go-backend-rewrite.md).
 
-**Current milestone:** M5 — JSON-only `/api/...` routes ✅
+**Current milestone:** M6 — Go-native HTML frontend
 **Started:** 2026-05-04
-**Last updated:** 2026-05-07 (M5.4)
+**Last updated:** 2026-05-08 (M6.4 merged)
 
 ## How to use
 
@@ -110,10 +110,10 @@ Goal: byte-equal JSON between Python and Go for every route. This is the parity
 
 Goal: feature-equivalent UX on the Go side, designed cleanly. Not a Jinja port.
 
-- [ ] **M6.1** Template skeleton: base layout, nav (Adults/Juniors/Payments/Sync/Flush), terminal-green-on-black theme; `embed.FS` for `templates/` + `static/`
+- [x] **M6.1** Template skeleton: base layout, nav (Adults/Juniors/Payments/Sync/Flush), terminal-green-on-black theme; `embed.FS` for `templates/` + `static/` — `78e5059`
-- [ ] **M6.2** `/adults` page: table, name filter input, month range filter, totals row, credits/debts/unmatched sections, Pay buttons that link to `/qr`
+- [x] **M6.2** `/adults` page: table, name filter input, month range filter, totals row, credits/debts/unmatched sections, Pay buttons that link to `/qr` — `c85748b`
-- [ ] **M6.3** `/juniors` page: same structure + per-month J/A attendance breakdown + `"?"` sentinel rendering
+- [x] **M6.3** `/juniors` page: same structure + per-month J/A attendance breakdown + `"?"` sentinel rendering — `9564103`
-- [ ] **M6.4** `/payments` page: grouped-by-person ledger view
+- [x] **M6.4** `/payments` page: grouped-by-person ledger view — `689f1c0`
 - [ ] **M6.5** Modal JS module (`static/js/member-detail.js`): fetches `/api/adults` (or juniors), renders status/exceptions/transactions on row click; keyboard nav (Esc, ↑/↓)
 - [ ] **M6.6** `/qr`, `/sync-bank`, `/flush-cache`, `/version` pages
 - [ ] **M6.7** Wire `embed.FS` into handlers; verify single-binary deployment includes all assets

docs/plans/2026-05-08-0034-go-rewrite-m6-1-template-skeleton.md

@@ -0,0 +1,88 @@
+# Plan: Go rewrite — M6.1 Template skeleton
+
+## Context
+
+M5 finished — Go and Python now produce byte-equal JSON across `/api/{adults,juniors,payments,version}` and `cmd/parity` enforces it. See [progress tracker §M5](2026-05-03-2349-go-backend-rewrite-progress.md#L96-L106).
+
+M6 begins the Go-native HTML frontend that lets us actually retire the Python web UI. **M6.1 is the foundation step**: stand up the base HTML layout, shared nav, terminal-green-on-black theme, and the `embed.FS` plumbing that every subsequent M6 page (adults, juniors, payments, sync, flush, qr) will compose into. After M6.1, opening :8080 shows chrome (header, nav, footer) on every route with placeholder bodies — no real data wiring; that lands in M6.2+.
+
+This is **not a Jinja port**. The Python templates are reference for nav structure and CSS values; the Go layout is designed natively (per the [master plan](2026-05-03-2349-go-backend-rewrite.md#L24-L27): "frontends are allowed to diverge").
+
+## Current Go web state (what we're building on)
+
+- [go/internal/web/server.go](../../go/internal/web/server.go) — `Run()` registers `GET /{$}` (text-plain hello) + four `/api/*` routes. `BuildInfo{Version,Commit,BuildDate}` already flows in.
+- [go/internal/web/api/handler.go](../../go/internal/web/api/handler.go) — central handler struct holding `Sources`, `Config`, `Logger`, build fields.
+- No `templates/`, no `static/`, no `embed` directives, no `html/template` import anywhere in `go/`. We're starting from a blank slate.
+
+## Approach
+
+1. **Create `templates/` and `static/` under `go/internal/web/`**, embedded via `//go:embed`.
+2. **Single base template** (`base.tmpl`) using `html/template` `block`s for `title` and `content`. Each page template defines those blocks; the renderer executes via `ExecuteTemplate(w, "base", data)`.
+3. **Nav partial** parameterized by a `pageData.Active` string so each page highlights its own link with `class="active"`. Three tiers preserved (Primary / Archived / Tools) — matches Python UX in [templates/adults.html:491-505](../../templates/adults.html#L491-L505).
+4. **CSS** lifted verbatim from [templates/adults.html:8-487](../../templates/adults.html#L8-L487) into `static/css/app.css`. Page templates `<link>` it from the base layout. M6.2+ reuses the same class names (`.cell-ok`, `.modal-content`, …) without re-extracting.
+5. **HTML handlers** in a new `go/internal/web/html/` package (sibling of `api/`). One `Handler` struct holding `*Renderer` + `BuildInfo` + `Config`. Routes for `/`, `/adults`, `/juniors`, `/payments`, `/sync-bank`, `/flush-cache` registered in `server.go`. Each route renders a placeholder body ("Coming in M6.X") inside the base shell — the goal is to prove the chrome works, not to populate data.
+6. **Replace the existing `helloHandler`**: `GET /{$}` → `http.Redirect` to `/adults` (mirrors Python's meta-refresh in [app.py:112-115](../../app.py#L112-L115)).
+7. **Static file route**: `GET /static/` served from `staticFS` via `http.StripPrefix("/static/", http.FileServerFS(staticFS))`.
+8. **Footer keeps it simple**: `{{.Build.Version}}@{{.Build.Commit}} | built {{.Build.BuildDate}}`. The Python per-request render-time breakdown is deferred — `middleware/timer.go` only logs to slog today; threading a timer into request context can come back in a later milestone if we miss it.
+
+## Files to create / modify
+
+```
+go/internal/web/
+├── assets.go                          NEW — //go:embed templates/* static/*
+├── render.go                          NEW — Renderer wraps parsed *template.Template
+├── server.go                          MODIFY — drop helloHandler; mount HTML routes + /static/
+├── html/
+│   ├── handler.go                     NEW — html.Handler + page methods
+│   └── handler_test.go                NEW — httptest smoke per route
+├── templates/
+│   ├── base.tmpl                      NEW — <html>/<head>/<body>; nav + content + footer blocks
+│   ├── partials/
+│   │   ├── nav.tmpl                   NEW — three-tier nav, active highlighting
+│   │   └── footer.tmpl                NEW — build meta line
+│   ├── adults.tmpl                    NEW — placeholder "Coming in M6.2"
+│   ├── juniors.tmpl                   NEW — placeholder "Coming in M6.3"
+│   ├── payments.tmpl                  NEW — placeholder "Coming in M6.4"
+│   ├── sync.tmpl                      NEW — placeholder "Coming in M6.6"
+│   └── flush_cache.tmpl               NEW — placeholder "Coming in M6.6"
+└── static/
+    └── css/
+        └── app.css                    NEW — verbatim from templates/adults.html:8-487
+```
+
+## Key design notes
+
+- **Parse once at startup**: `NewRenderer(fs embed.FS)` calls `template.ParseFS(fs, "templates/*.tmpl", "templates/partials/*.tmpl")`. Parse failure aborts boot — template syntax errors surface immediately, not at first request.
+- **Per-page cloned templates** to avoid `define "content"` collisions across pages: `Renderer` stores `map[string]*template.Template` keyed by page name; each is `base+partials` clone with that page's `content`/`title` overlaid.
+- **View model** — small `pageData` struct: `Active` (nav key), `Build` (BuildInfo), `Body` (per-page payload, `any` until M6.2 widens it).
+- **Active-link logic** in nav partial: `{{ if eq .Active "adults" }}class="active"{{ end }}` — markup-side, no template funcs needed.
+- **No JS in M6.1.** Member-detail and QR modals + `static/js/*.js` come in M6.5. M6.1 only sets up the embedded-asset machinery.
+- **Nav anchor labels are literal text** (`[Adults]`, `[Juniors]`, etc.) — keep the brackets in the template strings, they're part of the look.
+- **`/qr` is not in the nav** — it's an image endpoint, M6.6 territory.
+
+## Critical files to read
+
+- [go/internal/web/server.go](../../go/internal/web/server.go) — mux registration; `Run()` signature stays unchanged.
+- [go/internal/web/api/handler.go](../../go/internal/web/api/handler.go) — pattern to mirror for `html.Handler` (same field layout, most fields unused in M6.1).
+- [templates/adults.html:8-487](../../templates/adults.html#L8-L487) — CSS source, copy verbatim.
+- [templates/adults.html:491-505](../../templates/adults.html#L491-L505) — nav markup source (three tiers).
+- [docs/plans/2026-05-03-2349-go-backend-rewrite.md:88-101](2026-05-03-2349-go-backend-rewrite.md#L88-L101) — original layout intent for `web/handlers/`, `web/templates/`, `web/static/`.
+
+## Verification
+
+End-to-end smoke from a fresh `make go-build`:
+
+1. `make web-go &` — server boots; no template-parse errors in slog output.
+2. `curl -i localhost:8080/` → `302` to `/adults`.
+3. `curl -s localhost:8080/adults | grep -F 'class="active"'` matches the Adults anchor only.
+4. `curl -sI localhost:8080/static/css/app.css` → `200`, `Content-Type: text/css`.
+5. Browser at `http://localhost:8080/adults`: terminal-green-on-black theme, three-tier nav at top (Adults active), "Coming in M6.2" placeholder, footer `{tag}@{commit} | built {date}`.
+6. Click each nav link in turn (`/juniors`, `/payments`, `/sync-bank`, `/flush-cache`) — same chrome, the clicked link is highlighted, per-page placeholder body shows.
+7. `make go-test` — `web/html/handler_test.go` passes: each route returns 200, `text/html`, `class="active"` only on the matching anchor.
+8. `make go-lint` clean.
+9. `make parity` still green (regression check — M6.1 doesn't touch `/api/*`).
+10. CHANGELOG entry per CLAUDE.md; M6.1 ticked in [progress tracker §M6.1](2026-05-03-2349-go-backend-rewrite-progress.md#L113) with commit SHA.
+
+## Branch & MR
+
+`feat/go-m6-1-template-skeleton` per CLAUDE.md branch-per-feature workflow. Open MR via `tea pr create --base main --head feat/go-m6-1-template-skeleton`. User merges in the Gitea browser UI.

docs/plans/2026-05-08-0052-go-rewrite-m6-2-adults-page.md

@@ -0,0 +1,131 @@
+# Plan: Go rewrite — M6.2 Adults page
+
+## Context
+
+M6.1 landed the template skeleton, embed.FS, and HTML routes ([progress §M6.1](2026-05-03-2349-go-backend-rewrite-progress.md#L113), commit `78e5059`). Every page renders chrome + a "Coming in M6.X" placeholder body. **M6.2 fills in `/adults`** — the most data-rich page and the template that drives the rest of the M6 work (juniors mostly mirrors it).
+
+Acceptance criteria, verbatim from [progress §M6.2](2026-05-03-2349-go-backend-rewrite-progress.md#L114):
+
+> `/adults` page: table, name filter input, month range filter, totals row, credits/debts/unmatched sections, Pay buttons that link to `/qr`
+
+The Go side has done excellent prep: `buildAdultsResponse` in [go/internal/web/api/build_adults.go](../../go/internal/web/api/build_adults.go) already produces the full view model (currently consumed only by `/api/adults`), the wire types in [go/internal/web/api/types.go](../../go/internal/web/api/types.go) match the Python view-model 1:1, and the CSS is already lifted into [go/internal/web/static/css/app.css](../../go/internal/web/static/css/app.css). M6.2 is therefore mostly **template authoring + handler wiring + a small filters script**, not a fresh port.
+
+## Current Go web state (what we're building on)
+
+- [go/internal/web/server.go:49](../../go/internal/web/server.go#L49) — `mux.HandleFunc("GET /adults", hh.ServeAdults)` already wired.
+- [go/internal/web/html_handler.go:16-18](../../go/internal/web/html_handler.go#L16-L18) — placeholder handler renders a `PageData{Active, Build}` shell only. Needs to gain access to the data layer.
+- [go/internal/web/render.go:11](../../go/internal/web/render.go#L11) — `PageData` struct is currently `{Active, Build}` only. Needs to extend or be wrapped by a typed adults view model.
+- [go/internal/web/api/handler.go:36-45](../../go/internal/web/api/handler.go#L36-L45) — `ServeAdults` already does `loadAll` → `Reconcile` → `buildAdultsResponse`. We will extract that body into an exported method so the HTML handler can reuse it without duplication.
+- [go/internal/web/api/build_adults.go:17](../../go/internal/web/api/build_adults.go#L17) — `buildAdultsResponse(...) AdultsResponse` returns everything the template needs (`Months`, `Results`, `Totals`, `Credits`, `Debts`, `Unmatched`, `BankAccount`, `CurrentMonth`, …). We pass this struct straight into the template.
+- [go/internal/web/templates/adults.tmpl](../../go/internal/web/templates/adults.tmpl) — currently a 5-line placeholder. Replace contents.
+- [go/internal/web/static/css/app.css](../../go/internal/web/static/css/app.css) — all selectors needed (`.cell-ok`, `.cell-unpaid`, `.cell-unpaid-current`, `.cell-overridden`, `.unmatched-row`, `.filter-container`, `.pay-btn`, `.member-row`, …) already present from M6.1.
+
+Reference for parity: [templates/adults.html](../../templates/adults.html) (Python source). Sections to mirror in markup terms:
+- Reconcile table — [adults.html:534-585](../../templates/adults.html#L534-L585)
+- Totals row — [adults.html:571-582](../../templates/adults.html#L571-L582)
+- Credits / Debts — [adults.html:587-609](../../templates/adults.html#L587-L609)
+- Unmatched — [adults.html:611-629](../../templates/adults.html#L611-L629)
+- Filter controls — [adults.html:515-532](../../templates/adults.html#L515-L532)
+- Filter JS (name + month range) — [adults.html:1019-1051](../../templates/adults.html#L1019-L1051)
+
+The member-detail modal, Pay-preview modal, and JSON-hydrated `memberData`/`rawPaymentsByPerson` globals are explicitly **out of scope for M6.2** — they belong to M6.5 (modal JS).
+
+## Approach
+
+1. **Share data assembly between HTML and JSON** — extract `ServeAdults`'s body into `(*api.Handler).AssembleAdults(ctx) (AdultsResponse, error)` and have `ServeAdults` call it. The HTML handler then calls the same method, keeping `/adults` and `/api/adults` byte-identical in semantics (same loaded data, same reconcile, same view model).
+2. **Wire HTMLHandler to data** — extend `HTMLHandler` with an `apiHandler *api.Handler` field and pass it from `Run()`. `ServeAdults` becomes: `AssembleAdults` → on error render an error body (or 500) → render `adults.tmpl` with a typed view model wrapping `PageData` + `api.AdultsResponse`.
+3. **Per-page typed view model** — add `AdultsPageData{ PageData; Data api.AdultsResponse }` in [render.go](../../go/internal/web/render.go) (or a new `view.go`). Template references `.Active`, `.Build` (chrome) and `.Data.Results`, `.Data.Totals`, `.Data.Months`, etc. Keeps the chrome contract for nav/footer untouched.
+4. **Author `adults.tmpl`** — port markup from [templates/adults.html:489-629](../../templates/adults.html#L489-L629). Notable mechanics:
+   - Filter controls block with `<input id="nameFilter">`, `<select id="fromMonth">`, `<select id="toMonth">`, `Apply` / `All` buttons. Month dropdown options rendered server-side from `.Data.Months` (no client-side hydration needed for filters).
+   - Reconcile table iterates `.Data.Results`; each row's months iterate `row.Months`. Cell `<td>` gets class `cell-{{.Status}}`, plus `cell-unpaid-current` when `.RawMonth >= .Data.CurrentMonth`, plus `cell-overridden` when `.Overridden`. Cells carry `data-month-idx="{{$i}}"` so the filter script can hide columns.
+   - Per-cell Pay button visible on hover when `(unpaid|partial)` and `RawMonth < CurrentMonth` — `<a class="pay-btn" href="/qr?...">Pay</a>` with the QR query string built server-side via a template helper (see Key design notes).
+   - Per-row "Pay All" button when `.PayableAmount > 0`, same href construction using `.UnpaidPeriods` for display and `.RawUnpaidPeriods` for the QR message.
+   - Totals `<tr>` iterates `.Data.Totals`, classes `total-cell-{{.Status}}`.
+   - Credits / Debts / Unmatched sections rendered conditionally on non-empty slices.
+5. **Tiny filter script** — new [go/internal/web/static/js/filters.js](../../go/internal/web/static/js/filters.js):
+   - `nameFilter` `input` event: NFD-normalize + lowercase + substring match against `.member-row [data-name]` (or row's first cell text); toggle `display:none` on non-matches.
+   - `fromMonth` / `toMonth` `change` event + `Apply` button: read selected `data-month-idx` range, toggle `month-hidden` class on `[data-month-idx]` `<th>`/`<td>` outside the range.
+   - `All` button: clear filters, restore all rows/cells.
+   - Match Python's behaviour byte-for-byte from [adults.html:864-1051](../../templates/adults.html#L864-L1051) but trimmed of modal/`memberData` calls.
+   - Loaded via `<script src="/static/js/filters.js" defer></script>` from the adults template (or base, if juniors will reuse it — yes, it should be in base or a content-block include).
+6. **`<a href="/qr?…">` Pay buttons now, modal in M6.5** — the M6.6 milestone adds `/qr`. Until then, hrefs return 404. M6.5 will layer modal preview behaviour on top by wrapping clicks; the markup stays the same. This is the simplest staged rollout.
+7. **Template helper for QR href** — add a `funcMap` to `Renderer` with `qrHref(account, amount, name, month string) string` (and a periods-list variant) that builds `/qr?account=…&amount=…&message=…` with proper URL encoding. Implementation: `net/url.Values{}.Encode()`. This keeps URL-construction logic out of the template syntax (`html/template` URL escaping isn't enough — query-param building deserves a Go helper).
+8. **Active-link key** — `Active: "adults"` already set; nav highlighting works as-is (verified in M6.1 smoke test).
+
+## Files to create / modify
+
+```
+go/internal/web/
+├── api/
+│   └── handler.go                MODIFY — extract ServeAdults body to AssembleAdults(ctx)
+├── html_handler.go               MODIFY — hold *api.Handler; ServeAdults loads + renders
+├── render.go                     MODIFY — add AdultsPageData type; add funcMap with qrHref()
+├── server.go                     MODIFY — pass *api.Handler into NewHTMLHandler
+├── html_handler_test.go          MODIFY — add adults markup-level assertions w/ stub Sources
+├── templates/
+│   └── adults.tmpl               MODIFY — replace placeholder w/ full table + filters + sections
+└── static/
+    └── js/
+        └── filters.js            NEW — name + month-range client-side filtering
+```
+
+No new packages; no domain or wire-type changes.
+
+## Key design notes
+
+- **Reuse `buildAdultsResponse` verbatim** — no parallel "view model" needed. `AdultsResponse` already has every field the template wants. `/adults` and `/api/adults` consume the same struct.
+- **Extracting `AssembleAdults`** preserves the parity contract: anything that changes the JSON also changes the HTML, by construction. (It also sets up the same pattern for M6.3 juniors and M6.4 payments.)
+- **Filter UX is DOM-driven**, no JSON hydration. `member_data` / `raw_payments` JSON payloads stay deferred to M6.5 (modal needs them; filters do not).
+- **`current_month` boundary is server-side** — `AdultsResponse.CurrentMonth` (set from `time.Now().Format("2006-01")` in `loadAll`) is what the template compares `RawMonth` against for `cell-unpaid-current` styling and Pay-button visibility. Same value Python passes through `vm["current_month"]`.
+- **`html/template` autoescaping is sufficient** for member names, sender, message, etc. — but Pay-button URLs need explicit `url.Values` encoding (Czech names have diacritics and spaces). Hence the `qrHref` funcMap helper.
+- **Error rendering**: if `AssembleAdults` fails, render the base shell with an error banner inside `content` rather than `http.Error`. Keeps nav visible so the user can navigate away. Match Python's `"No data."` fallback at [app.py:233](../../app.py#L233) for empty results.
+- **No JS framework, no bundler** — filter script is plain ES2020, ~80 lines, inline-readable. Matches M6.1's "no JS in M6.1" follow-through (we add JS in M6.2, but kept minimal).
+- **NFD-normalize** in JS via `s.normalize('NFD').replace(/\p{Diacritic}/gu, '').toLowerCase()` to match Python's `unicodedata.normalize('NFD', ...)`. Python ref: [adults.html:868-873](../../templates/adults.html#L868-L873).
+- **Filter persistence is out of scope** — Python's filters are session-only (no localStorage). Same here.
+
+## Critical files to read
+
+- [go/internal/web/api/build_adults.go](../../go/internal/web/api/build_adults.go) — full view model already built; the template just iterates over `AdultsResponse`.
+- [go/internal/web/api/types.go:91-122](../../go/internal/web/api/types.go#L91-L122) — `MonthCell`, `TotalCell`, `MemberRow`, `Credit` shapes.
+- [go/internal/web/api/handler.go:36-96](../../go/internal/web/api/handler.go#L36-L96) — pattern for `loadAll` + `Reconcile` + `buildAdultsResponse`; the bit to refactor into `AssembleAdults`.
+- [go/internal/web/static/css/app.css](../../go/internal/web/static/css/app.css) — class names available; no edits needed.
+- [templates/adults.html:489-629](../../templates/adults.html#L489-L629) — markup reference for filter controls, table, totals, credits/debts, unmatched.
+- [templates/adults.html:864-1051](../../templates/adults.html#L864-L1051) — JS reference for filter behaviour (NFD-normalize, month range hiding, Apply/All).
+- [tests/test_app.py:50-75](../../tests/test_app.py#L50-L75) — `test_adults_route` in Python, mirror its assertions in Go: status 200, body contains member name + `750/750 CZK (4)` + `Adults Dashboard`, does not contain `OK`.
+
+## Verification
+
+End-to-end smoke after `make go-build`:
+
+1. `make web-go &` — server boots, no template-parse errors.
+2. `curl -i localhost:8080/adults` → `200`, `Content-Type: text/html`.
+3. Browser at `http://localhost:8080/adults` against real data:
+   - Table renders with one row per adult member, one column per month, totals row at bottom.
+   - Cell colors match `/api/adults` JSON — pick a `Credits` member from JSON, confirm green-ish status; pick a `Debts` member, confirm red-ish.
+   - Credits / Debts / Unmatched sections render with content matching the JSON arrays for those keys.
+   - Per-cell `Pay` buttons appear on hover for past-month unpaid/partial cells; href contains `/qr?account=...&amount=...&message=`.
+   - Per-row "Pay All" button shows for members with `payable_amount > 0`.
+4. Filters:
+   - Type a partial member name in `#nameFilter` → only matching rows visible. Test with diacritics (e.g. `nemec` matches `Němec`).
+   - Pick `fromMonth=2026-02`, `toMonth=2026-04`, click `Apply` → only those columns visible (table + totals row).
+   - Click `All` → everything restored.
+5. `curl -s localhost:8080/adults | grep -F 'Adults Dashboard'` matches; `grep -F 'Coming in M6.2'` does **not** match.
+6. `make go-test` — `html_handler_test.go` adults assertions pass with stub Sources fixture (replicating `test_adults_route` from Python).
+7. `make go-lint` clean.
+8. `make parity` still green — `/api/adults` JSON unchanged because `AssembleAdults` extraction is a pure refactor.
+9. CHANGELOG entry per CLAUDE.md (timestamp via `date "+%Y-%m-%d %H:%M %Z"`).
+10. Tick M6.2 in [progress tracker §M6.2](2026-05-03-2349-go-backend-rewrite-progress.md#L114) with the merge commit SHA.
+
+## Branch & MR
+
+Branch `feat/go-m6-2-adults-page` per CLAUDE.md branch-per-feature workflow. Commit, push with `-u`, then:
+
+```bash
+tea pr create \
+  --title "feat(go): M6.2 — adults page (table, filters, credits/debts/unmatched, Pay buttons)" \
+  --description "..." \
+  --base main \
+  --head feat/go-m6-2-adults-page
+```
+
+Print the PR URL for the user. User merges in Gitea browser.

docs/plans/2026-05-08-1052-period-selector-missing-old-months.md

@@ -0,0 +1,142 @@
+# Period selector missing older months — diagnosis
+
+## Context
+
+User reports the "From / To" period selector on the **adults** dashboard now
+shows **Dec 2025** as the oldest available period. The older production
+deployment shows Sep+Oct 2025, Nov 2025, Dec 2025+Jan 2026 (merged labels) —
+i.e. data going back to September 2025. The user wants to know what went
+sideways. Confirmed: the dropdown options on both Python and Go genuinely
+start at Dec 2025, not just the default selection — Sep/Oct/Nov 2025 are not
+in the list at all.
+
+## Root cause — the live adults sheet header is missing those columns
+
+The fresh cache files at `tmp/go/attendance_regular_cache.json` (raw rows from
+Google Sheets, modifiedTime `2026-05-06T22:30:02Z`, cached `2026-05-08T00:26`)
+contain the actual header row for the adults tab (gid=0):
+
+```text
+['FUJ tréninky úterý 20:30-22:00', '', '', '02.12.2025', '09.12.2025',
+ '16.12.2025', '06.01.2026', '13.01.2026', '20.01.2026', '27.01.2026',
+ '03.02.2026', '10.02.2026', '17.02.2026', '24.02.2026', '03.03.2026',
+ '10.03.2026', '17.03.2026', '23.03.2026', '31.03.2026', '13.04.2026',
+ '20.04.2026', '27.04.2026', '04.05.2026', '', '', '']
+```
+
+**The first date column in the live adults sheet is `02.12.2025` (Dec 2 2025).**
+There are no September, October, or November 2025 columns in the header at
+all. Both backends parse this faithfully (no slicing, no cutoff anywhere) and
+correctly produce `sortedMonths = ["2025-12", "2026-01", …, "2026-05"]`.
+
+The juniors sheet (different tab, `JUNIOR_SHEET_GID`) is **fine** — its header
+still contains `['', 'tier', '', '15.09.2025', '13.10.2025', '20.10.2025',
+'03.11.2025', '24.11.2025', '10.11.2025', '17.11.2025', '01.12.2025', …]`. So
+the juniors page still shows Sep+Oct / Nov / Dec+Jan correctly.
+
+So this is a **data issue in the adults attendance Google Sheet**: at some
+point between when production's cache was last warmed (showing Sep–Nov) and
+2026-05-06, somebody (or some action) removed the columns for September,
+October, and November 2025 from the adults tab header.
+
+The code is doing exactly what it should. There is no parser regression.
+
+## What to do
+
+### 1. Restore the missing date columns in the adults attendance sheet
+
+The fix lives in Google Sheets, not in the codebase. Options, in order of
+preference:
+
+- **(a) Use Sheets version history.** File → Version history → See version
+  history; find a version from before the columns were dropped (anything
+  before about Mar 2026 should still have them). Copy the Sep/Oct/Nov 2025
+  date column headers and the `TRUE/FALSE` cells underneath them back into
+  the current sheet. Only restore the 11 missing date columns; do not
+  full-revert (you'd lose every change since then).
+- **(b) Pull from the production server's cache.** The production deployment
+  evidently still has the older cache, since its dashboard renders those
+  months. SSH there, copy `tmp/attendance_regular_cache.json`, and you can
+  reconstruct the per-member Sep/Oct/Nov attendance counts from the
+  `data[*][2]` map (keys `"2025-09"`, `"2025-10"`, `"2025-11"`). Re-enter
+  those into the sheet manually as date columns + `TRUE` cells — tedious but
+  deterministic.
+- **(c) Accept the loss.** If the older columns aren't recoverable, the
+  dashboard correctly reflects what the sheet contains; nothing more to do.
+
+Which to pick depends on whether those months still need to be billed /
+reconciled.
+
+### 2. Restore `ADULT_MERGED_MONTHS` (user confirmed this was unintentional)
+
+Independent of the sheet issue: commit `1257f0d` (Mar 9 2026) commented out
+the adult merge mappings. Once the Sep/Oct/Nov columns are back in the sheet,
+the dashboard would still show them as separate periods instead of the
+production-style "Sep+Oct 2025" and "Dec 2025+Jan 2026" merged labels.
+
+User confirmed this was unintentional. Two files to update:
+
+- [scripts/attendance.py:32-35](scripts/attendance.py#L32-L35) — uncomment
+  the two mappings:
+
+  ```python
+  ADULT_MERGED_MONTHS = {
+      "2025-12": "2026-01",   # keys are merged into values
+      "2025-09": "2025-10",
+  }
+  ```
+
+- [go/internal/services/membership/sources.go:30](go/internal/services/membership/sources.go#L30) — mirror the same:
+
+  ```go
+  var AdultMergedMonths = map[string]string{
+      "2025-12": "2026-01",
+      "2025-09": "2025-10",
+  }
+  ```
+
+After this change, hit `POST /flush-cache` on each backend so the in-process
+post-processed adults cache is rebuilt with the new mapping.
+
+### 3. (Optional, separate) Fix the JS auto-default that hides older months
+
+This is **not** the cause of the user's current symptom (that's the sheet
+issue), but it will become a UX issue once Sep/Oct/Nov columns are restored:
+the Python frontend's `defaultFrom = Math.max(0, maxMonthIdx - 4)` will still
+default the From-selector to ~5 months before the latest column on every page
+load, hiding restored older months until the user manually picks them.
+
+- [templates/adults.html:1047](templates/adults.html#L1047) — `var defaultFrom = Math.max(0, maxMonthIdx - 4);`
+- [templates/juniors.html:1028](templates/juniors.html#L1028) — same line.
+
+Drop those four lines (`defaultFrom`, `fromSelect.value = defaultFrom`,
+`toSelect.value = maxMonthIdx`, `applyMonthFilter()`) so the page loads with
+all non-future months visible — matching the Go side, which only calls
+`hideFutureMonths()` and leaves From at its first option.
+
+Recommend bundling this with step 2 since they touch related UI.
+
+## Verification
+
+1. **After step 1** — `POST /flush-cache` on Python and Go backends; reload
+   `/adults` on each. Confirm the dropdown now lists Sep/Oct/Nov 2025.
+2. **After step 2** — reload `/adults`. Confirm the dropdown shows
+   "Sep+Oct 2025" as a single period and "Dec 2025+Jan 2026" as a single
+   period. (Still requires the sheet columns to exist.)
+3. **After step 3** — reload `/adults` and `/juniors` on Python. Confirm the
+   table renders all non-future months on first load (Sep 2025 through the
+   current month) instead of starting at Dec 2025.
+4. **Parity check** — `make parity` should report zero diffs between Python
+   and Go on `/api/adults` and `/api/juniors`.
+
+## Critical files referenced
+
+- `tmp/go/attendance_regular_cache.json` — current adults sheet rows
+  (evidence: header starts at `02.12.2025`).
+- `tmp/go/attendance_juniors_cache.json` — current juniors sheet rows
+  (header still has `15.09.2025`).
+- [scripts/attendance.py](scripts/attendance.py) — `ADULT_MERGED_MONTHS`
+  empty after `1257f0d`; `parse_dates` / `group_by_month` faithful.
+- [go/internal/services/membership/sources.go](go/internal/services/membership/sources.go) — Go counterpart, same shape.
+- [templates/adults.html](templates/adults.html), [templates/juniors.html](templates/juniors.html) — JS onload `defaultFrom = -4` issue (step 3).
+- [go/internal/web/static/js/filters.js](go/internal/web/static/js/filters.js) — Go filter UI (already correct, no changes).

docs/plans/2026-05-08-1123-go-m6-3-juniors-page.md

@@ -0,0 +1,67 @@
+# M6.3 — Go-native `/juniors` page
+
+## Context
+
+The Go rewrite is in milestone M6 (Go-native HTML frontend). M6.2 shipped the `/adults` page in commit `c85748b`; the [progress tracker](../../srv/personal/fuj-management/docs/plans/2026-05-03-2349-go-backend-rewrite-progress.md) line 115 names M6.3 as:
+
+> `/juniors` page: same structure + per-month J/A attendance breakdown + `"?"` sentinel rendering
+
+The Go side already has `buildJuniorsResponse` (M5.2) that produces the full JSON view model, and the JuniorsResponse uses the same `MemberRow`/`MonthCell`/`TotalCell` types as `AdultsResponse`. Critically, `buildJuniorMemberRow` ([go/internal/web/api/build_juniors.go:142](../../srv/personal/fuj-management/go/internal/web/api/build_juniors.go#L142)) already bakes the J/A breakdown (e.g. `"3/500 CZK (4:2J,2A)"`) and the `"?"` sentinel into `MonthCell.Text` — no template-level junior-specific logic is required for the M6.3 table.
+
+Today `juniors.tmpl` is a 4-line "Coming in M6.3" placeholder and `HTMLHandler.ServeJuniors` ([html_handler.go:35](../../srv/personal/fuj-management/go/internal/web/html_handler.go#L35)) just renders that placeholder. Goal of M6.3: produce a working `/juniors` page that mirrors the structure of `/adults` and reaches feature parity with the Python `/juniors` route.
+
+## Approach
+
+Mirror the M6.2 pattern exactly:
+
+1. **Extract `AssembleJuniors(ctx)`** from the JSON handler so HTML + JSON share one view-model assembly path (the parity contract).
+2. **Add `JuniorsPageData`** wrapper type next to `AdultsPageData` in `render.go`.
+3. **Replace `juniors.tmpl`** with an adults-shaped layout. Because `JuniorsResponse` shares the same field names used by `adults.tmpl` (`Months`, `RawMonths`, `Results`, `Totals`, `Credits`, `Debts`, `AttendanceURL`, `PaymentsURL`, `BankAccount`, `CurrentMonth`), the template body is essentially copy/paste with one parity tweak (see "Decisions" below).
+4. **Wire `HTMLHandler.ServeJuniors`** to call `AssembleJuniors` and render the new template, parallel to `ServeAdults`.
+
+No new CSS, no new JS — `filters.js` and the `cell-*` classes (lifted in M6.1) already cover juniors.
+
+## Files to modify
+
+| File | Change |
+| --- | --- |
+| [go/internal/web/api/handler.go](../../srv/personal/fuj-management/go/internal/web/api/handler.go) | Add `AssembleJuniors(ctx) (JuniorsResponse, error)`; refactor existing `ServeJuniors` to call it (mirrors `AssembleAdults` at line 47). |
+| [go/internal/web/render.go](../../srv/personal/fuj-management/go/internal/web/render.go) | Add `JuniorsPageData` struct (PageData + `Data api.JuniorsResponse` + `Error string`). |
+| [go/internal/web/html_handler.go](../../srv/personal/fuj-management/go/internal/web/html_handler.go) | Replace stub `ServeJuniors` with the same shape as `ServeAdults` (lines 20–33). |
+| [go/internal/web/templates/juniors.tmpl](../../srv/personal/fuj-management/go/internal/web/templates/juniors.tmpl) | Replace placeholder with a structurally identical copy of [adults.tmpl](../../srv/personal/fuj-management/go/internal/web/templates/adults.tmpl), with the title swapped to "Juniors Dashboard" and the Unmatched section removed (parity with Python). |
+| [docs/plans/2026-05-03-2349-go-backend-rewrite-progress.md](../../srv/personal/fuj-management/docs/plans/2026-05-03-2349-go-backend-rewrite-progress.md) | Tick `M6.3` once merged, append merge SHA. |
+| [CHANGELOG.md](../../srv/personal/fuj-management/CHANGELOG.md) | New top-most entry per CLAUDE.md format. |
+
+## Decisions captured
+
+- **No "Unmatched Transactions" section on `/juniors`.** Python's [templates/juniors.html](../../srv/personal/fuj-management/templates/juniors.html) renders only Credits + Debts (no Unmatched block). Although `JuniorsResponse.Unmatched` is populated, parity says we don't render it on juniors. The data stays available for the modal in M6.5.
+- **Reuse `qrHref` / `qrHrefAll` template funcs** from [render.go:35–57](../../srv/personal/fuj-management/go/internal/web/render.go#L35-L57). They are name-only (not adult-specific) and already on `tmplFuncs`.
+- **Reuse the existing `cell-empty / cell-unpaid / cell-unpaid-current / cell-ok / cell-overridden` cell-class branching** from `adults.tmpl` lines 60–67 verbatim. The "?" sentinel is rendered as plain `{{$cell.Text}}` text — no template branch needed because `buildJuniorMemberRow` produces `"?"` or `"? CZK"` already.
+- **No template helper extraction** (e.g. shared `_table_section.tmpl`). The two templates will be near-duplicates, but extracting a shared partial now is premature — wait until M6.4 or later when patterns settle. M6.2 didn't extract one either.
+- **Branch**: `feat/go-m6-3-juniors-page`, MR via `tea pr create` per CLAUDE.md.
+
+## Verification
+
+End-to-end smoke (parallel-running both backends as in M5/M6.2):
+
+1. `cd go && make run` (or whatever target boots the Go server on :8080).
+2. Browser-load `http://localhost:8080/juniors`. Confirm:
+   - Member rows render with cells containing fee + attendance breakdown like `0/500 CZK (3:2J,1A)`.
+   - At least one `"?"` cell visible (any junior with exactly one session in some month).
+   - Filter input narrows rows by name; From/To month selects hide columns via `data-month-idx`.
+   - `Pay` button visible on past-month unpaid cells; clicking links to `/qr?...`. (The QR endpoint itself lands in M6.6 — only the link target is in scope here.)
+   - `Pay All` visible on rows with `Balance < 0`.
+   - TOTAL row sums correctly per month.
+   - Credits + Debts sections render when present; no Unmatched section.
+3. JSON parity: `make parity` against the M3 fixture corpus must still report zero non-allowlisted diffs for `/api/juniors` (the `AssembleJuniors` extraction must not change wire output).
+4. Compare side-by-side against Python `/juniors` on :5001 for the same fixture; the table cells should match cell-for-cell modulo the known M5 allowlist.
+
+## Out of scope
+
+- Modal (`[i]` info button + `#memberModal`) — that is M6.5.
+- QR endpoint, `/sync-bank`, `/flush-cache`, `/version` pages — M6.6.
+- Embed.FS deploy verification — M6.7.
+
+## Plan-file relocation
+
+Per [CLAUDE.md](../../srv/personal/fuj-management/CLAUDE.md) "Plans" section, plan files belong in `docs/plans/YYYY-MM-DD-HHMM-<slug>.md` inside the repo. Plan mode forced this draft into `~/.claude/plans/`; first step after ExitPlanMode is to copy this file to `docs/plans/2026-05-08-HHMM-go-m6-3-juniors-page.md` (resolving the timestamp at that moment) and commit it on the feature branch alongside the implementation.

docs/plans/2026-05-08-1220-go-m6-4-payments-page.md

@@ -0,0 +1,215 @@
+# M6.4 — Go-native `/payments` page (grouped-by-person ledger)
+
+> Plan-mode note: per project convention this plan should live at
+> `docs/plans/2026-05-08-1220-go-m6-4-payments-page.md`. The first execution
+> step after approval is to copy this file there.
+
+## Context
+
+The Go port of the Flask app is at milestone **M6.4**: replace the placeholder
+`/payments` template ([go/internal/web/templates/payments.tmpl](go/internal/web/templates/payments.tmpl))
+with a feature-equivalent grouped-by-person ledger view, matching the Python
+[templates/payments.html](templates/payments.html) page.
+
+Compared to M6.2 (`/adults`) and M6.3 (`/juniors`), this page is **structurally
+much simpler**:
+
+- No filters (no name input, no month-range selects).
+- No totals / credits / debts / unmatched-as-extra-section.
+- No JS (no `filters.js`, no modal — modal is M6.5 territory and Python's
+  payments page itself has none).
+- No QR / Pay buttons.
+- Single grouping dimension: **by person**, sorted alphabetically, with a
+  synthetic `"Unmatched / Unknown"` bucket appended.
+- Each person's transactions sorted **newest-first**.
+- Columns: Date, Amount (right-aligned, green), Purpose, Bank Message.
+
+The JSON API side is already done (`/api/payments` at
+[go/internal/web/api/handler.go:78-86](go/internal/web/api/handler.go#L78-L86)),
+returning a `PaymentsResponse{ GroupedPayments, SortedPeople, AttendanceURL,
+PaymentsURL }`. The HTML side just needs to consume it.
+
+## Approach
+
+Mirror the M6.2/M6.3 pattern: extract an `AssembleX(ctx)` method, add a typed
+`PageData` wrapper, render a real template, lift the page-specific CSS into the
+shared stylesheet.
+
+### 1. Extract `AssemblePayments(ctx) (PaymentsResponse, error)`
+
+In [go/internal/web/api/handler.go](go/internal/web/api/handler.go), refactor
+`ServePayments` (currently inlines the load+build at lines 78-86) to mirror
+`AssembleAdults` / `AssembleJuniors`:
+
+```go
+func (h *Handler) ServePayments(w http.ResponseWriter, r *http.Request) {
+    resp, err := h.AssemblePayments(r.Context())
+    if err != nil { h.writeError(w, r, err); return }
+    writeJSON(w, resp)
+}
+
+func (h *Handler) AssemblePayments(ctx context.Context) (PaymentsResponse, error) {
+    txns, err := h.Sources.LoadTransactions(ctx)
+    if err != nil { return PaymentsResponse{}, fmt.Errorf("load transactions: %w", err) }
+    return buildPaymentsResponse(txns, h.allMemberNames(ctx)), nil
+}
+```
+
+Pure refactor — `make parity` should report zero diffs on `/api/payments`.
+
+### 2. Add `PaymentsPageData` wrapper
+
+In [go/internal/web/render.go](go/internal/web/render.go), alongside
+`AdultsPageData` / `JuniorsPageData`:
+
+```go
+type PaymentsPageData struct {
+    PageData
+    Data  api.PaymentsResponse
+    Error string
+}
+```
+
+No changes needed to `pageNames` — `"payments"` is already registered.
+
+### 3. Rewire HTML handler
+
+Replace [go/internal/web/html_handler.go:50-52](go/internal/web/html_handler.go#L50-L52):
+
+```go
+func (h *HTMLHandler) ServePayments(w http.ResponseWriter, r *http.Request) {
+    data := PaymentsPageData{ PageData: PageData{Active: "payments", Build: h.build} }
+    resp, err := h.apiHandler.AssemblePayments(r.Context())
+    if err != nil { data.Error = err.Error() } else { data.Data = resp }
+    h.renderer.Render(w, "payments", data)
+}
+```
+
+### 4. Replace template stub
+
+Rewrite [go/internal/web/templates/payments.tmpl](go/internal/web/templates/payments.tmpl)
+(currently a 5-line placeholder). Structure:
+
+```gotmpl
+{{define "title"}}Payments Ledger{{end}}
+{{define "content"}}
+<h1>Payments Ledger</h1>
+<p class="description">
+  All bank transactions from the
+  <a href="{{.Data.PaymentsURL}}" target="_blank">payments sheet</a>,
+  grouped by member. Names are matched against the
+  <a href="{{.Data.AttendanceURL}}" target="_blank">attendance sheet</a>.
+</p>
+{{if .Error}}<p class="error">{{.Error}}</p>{{end}}
+<div class="ledger-container">
+{{range $person := .Data.SortedPeople}}
+  <div class="member-block">
+    <h2>{{$person}}</h2>
+    <table class="txn-table">
+      <thead><tr>
+        <th class="txn-date">Date</th>
+        <th class="txn-amount">Amount</th>
+        <th class="txn-purpose">Purpose</th>
+        <th class="txn-message">Bank Message</th>
+      </tr></thead>
+      <tbody>
+      {{range $tx := index $.Data.GroupedPayments $person}}
+        <tr>
+          <td class="txn-date">{{$tx.Date}}</td>
+          <td class="txn-amount">{{printf "%.0f" $tx.Amount}} CZK</td>
+          <td class="txn-purpose">{{$tx.Purpose}}</td>
+          <td class="txn-message">{{$tx.Message}}</td>
+        </tr>
+      {{end}}
+      </tbody>
+    </table>
+  </div>
+{{end}}
+</div>
+{{end}}
+```
+
+Notes:
+- `printf "%.0f"` matches the visual style of integer CZK amounts (Python prints
+  the float as-is, but bank-row amounts are always whole CZK). If the user
+  prefers exact Python parity (`750.0 CZK`), drop the `printf` and use
+  `{{$tx.Amount}}`.
+- Iterating a `map` requires using `.Data.SortedPeople` to drive order then
+  `index $.Data.GroupedPayments $person` — Go templates don't preserve map
+  insertion order.
+
+### 5. Add CSS classes to `app.css`
+
+Append the page-specific rules from [templates/payments.html:111-164](templates/payments.html#L111-L164)
+to [go/internal/web/static/css/app.css](go/internal/web/static/css/app.css):
+`.ledger-container`, `.member-block`, `.txn-table`, `.txn-table th/td`,
+`.txn-date`, `.txn-amount`, `.txn-purpose`, `.txn-message`, `tr:hover`. The
+terminal-green palette already matches.
+
+### 6. Unit test
+
+Add a markup-level test to `go/internal/web/html_handler_test.go` (the file
+created in M6.2/M6.3) following the same pattern: stub `Sources` returning a
+fixed transaction list, assert response is HTML 200, assert key strings appear
+(person names as `<h2>`, "Payments Ledger" `<h1>`, expected amount, "Unmatched
+/ Unknown" bucket when an unattributed tx exists).
+
+## Critical files
+
+| Action  | Path |
+|---------|------|
+| edit    | [go/internal/web/api/handler.go](go/internal/web/api/handler.go) — extract `AssemblePayments` |
+| edit    | [go/internal/web/render.go](go/internal/web/render.go) — add `PaymentsPageData` |
+| edit    | [go/internal/web/html_handler.go](go/internal/web/html_handler.go) — rewire `ServePayments` |
+| rewrite | [go/internal/web/templates/payments.tmpl](go/internal/web/templates/payments.tmpl) — real template |
+| edit    | [go/internal/web/static/css/app.css](go/internal/web/static/css/app.css) — append ledger CSS |
+| edit    | `go/internal/web/html_handler_test.go` — payments markup test |
+
+No changes to `server.go`, `assets.go`, `Sources` interface, `buildPaymentsResponse`,
+or any domain code — these were completed in M5 / M6.1.
+
+## Reused existing helpers
+
+- [go/internal/web/api/build_payments.go](go/internal/web/api/build_payments.go) — `buildPaymentsResponse` (existing, unchanged)
+- [go/internal/web/api/build_common.go:84-117](go/internal/web/api/build_common.go#L84-L117) — `groupRawPaymentsByPerson` handles canonicalization, comma-splitting, `[?]` stripping, newest-first sort
+- [go/internal/web/api/handler.go:116-129](go/internal/web/api/handler.go#L116-L129) — `allMemberNames`
+- [go/internal/web/templates/partials/nav.tmpl](go/internal/web/templates/partials/nav.tmpl) and `footer.tmpl` — already include the `[Payments Ledger]` nav link
+
+## Verification
+
+End-to-end:
+
+1. `cd go && make go-build go-test go-lint` — all green.
+2. `make parity` — confirm the `AssemblePayments` extraction is byte-equal on
+   `/api/payments`.
+3. `make web-go &` then:
+   - `curl -i localhost:8080/payments | head -30` — HTTP 200, `text/html`.
+   - Browser load `http://localhost:8080/payments`:
+     - "Payments Ledger" heading + description with two clickable sheet links.
+     - Alphabetical member blocks, each with a table.
+     - Amounts right-aligned, green, "CZK" suffix.
+     - Newest-first ordering inside each block.
+     - "Unmatched / Unknown" bucket sorts in alphabetical position (capital U →
+       near end).
+     - Hover on a row darkens the background.
+     - Nav highlights `[Payments Ledger]` as the active link.
+   - Cross-check with Python: `make web-py &` → `http://localhost:5001/payments`
+     should look visually identical except for nav styling.
+4. `make web-py & make web-go &` then `tea pr create` once committed (per
+   project branch-per-feature workflow).
+
+## Branching
+
+Create `feat/go-m6-4-payments-page` off `main`, push, open MR via `tea`.
+Follow project conventions: Co-Authored-By trailer, CHANGELOG entry once user
+confirms it works, tick **M6.4** in
+[docs/plans/2026-05-03-2349-go-backend-rewrite-progress.md:116](docs/plans/2026-05-03-2349-go-backend-rewrite-progress.md#L116)
+with the merge SHA after the user merges in Gitea.
+
+## Out of scope (deferred)
+
+- **Modal / `[i]` info button** — M6.5 (not present in Python `/payments` either).
+- **Period selector** — `/payments` has none in Python; not adding one.
+- **embed.FS deploy verification** — M6.7.
+- **Shared partial extraction** — payments structurally diverges from
+  adults/juniors enough that there's no obvious common partial to lift; defer.

docs/plans/2026-05-08-1259-go-m6-5-modal-js.md

@@ -0,0 +1,288 @@
+# M6.5 — Member-detail modal JS module (`/adults`, `/juniors`)
+
+> Plan-mode note: per project convention this plan should live at
+> `docs/plans/2026-05-08-HHMM-go-m6-5-modal-js.md` (use `date "+%Y-%m-%d-%H%M"`
+> when copying). The first execution step after approval is to copy this file
+> there. Branch: `feat/go-m6-5-modal-js` off `main`.
+
+## Context
+
+The Go port of the Flask app is at milestone **M6.5**: the `/adults` and
+`/juniors` pages currently render their tables ([go/internal/web/templates/adults.tmpl](go/internal/web/templates/adults.tmpl),
+[go/internal/web/templates/juniors.tmpl](go/internal/web/templates/juniors.tmpl))
+but have no row-click member-detail modal — the feature that lets a user click
+a member's row to inspect status per month, exception overrides, "other"
+transactions, the matched payment list, and a debug raw-payments view.
+
+The Python implementation lives inline in
+[templates/adults.html:718-993](templates/adults.html#L718-L993)
+(matching code in [templates/juniors.html](templates/juniors.html) — same
+modal markup and JS). It uses globals injected via Jinja:
+`memberData`, `sortedMonths`, `monthLabels`, `rawPaymentsByPerson`. M6.5
+replaces this with a clean static JS module.
+
+Per milestone wording — *"fetches `/api/adults` (or juniors), renders
+status/exceptions/transactions on row click; keyboard nav (Esc, ↑/↓)"* —
+and per the user's design choice: the JS module fetches `/api/<page>` **once
+on page load** and caches the response in a module-scoped variable. Subsequent
+row clicks render synchronously from cache. This keeps HTML purely
+server-rendered and reuses the parity-tested JSON contract already shipped in
+M5.
+
+All the building blocks are already in place:
+
+- **JSON API**: `/api/adults` and `/api/juniors` already return
+  `member_data`, `month_labels`, `raw_payments` as nested objects (see
+  [go/internal/web/api/adults.go:27-42](go/internal/web/api/adults.go#L27-L42)
+  and the analogous juniors response). Junior `Expected` serialises as `"?"`
+  for the unknown sentinel via custom `MarshalJSON`
+  ([go/internal/web/api/types.go:24-29](go/internal/web/api/types.go#L24-L29)) — JS sees a literal string `"?"`.
+- **CSS**: `#memberModal`, `.modal-content`, `.modal-section`, `.modal-table`,
+  `.tx-list`, `.tx-item`, `.tx-meta`, `.tx-amount`, `.info-icon`, `.raw-toggle`
+  were lifted whole during M6.1 and live in
+  [go/internal/web/static/css/app.css](go/internal/web/static/css/app.css)
+  (lines 168-487). No CSS work needed.
+- **Member-row hooks**: `tr.member-row[data-name="..."]` and `td.member-name`
+  are already rendered by both templates.
+- **JS module convention**: `static/js/filters.js` is loaded with `<script src="/static/js/filters.js" defer>`;
+  M6.5 adds a sibling `static/js/member-detail.js` with the same loading
+  pattern.
+
+## Approach
+
+### 1. Add `[i]` info icon + `#memberModal` markup to both templates
+
+In [go/internal/web/templates/adults.tmpl](go/internal/web/templates/adults.tmpl)
+and [go/internal/web/templates/juniors.tmpl](go/internal/web/templates/juniors.tmpl):
+
+a. Inside the `<td class="member-name">{{$row.Name}}</td>` cell (line 59 of
+   each template), append the icon button:
+
+   ```gotmpl
+   <td class="member-name">{{$row.Name}}<span class="info-icon" data-name="{{$row.Name}}" title="Show details">[i]</span></td>
+   ```
+
+   Using a `data-name` attribute and a CSS class (rather than `onclick="..."`)
+   keeps the template free of inline JS — the module wires up the listener
+   itself.
+
+b. After the closing `</div>` of the table-container / sections, before the
+   `<script>` tag at line 140 (adults) / 120 (juniors), inject the modal
+   markup. Mirror the Python structure verbatim
+   ([templates/adults.html:644-707](templates/adults.html#L644-L707)):
+
+   ```gotmpl
+   <div id="memberModal" class="modal" onclick="if (event.target === this) this.classList.remove('active')">
+     <div class="modal-content">
+       <div class="modal-header">
+         <span class="modal-title" id="modalMemberName">—</span>
+         <span id="modalTier" class="modal-tier"></span>
+         <a href="#" class="modal-close" onclick="event.preventDefault(); document.getElementById('memberModal').classList.remove('active')">[x]</a>
+       </div>
+
+       <div class="modal-section">
+         <div class="modal-section-title">Status by Month</div>
+         <table class="modal-table">
+           <thead><tr><th>Month</th><th>Sessions</th><th>Expected</th><th>Paid</th><th>Status</th></tr></thead>
+           <tbody id="modalStatusBody"></tbody>
+         </table>
+       </div>
+
+       <div class="modal-section" id="modalExceptionSection" style="display:none">
+         <div class="modal-section-title">Exception Overrides</div>
+         <div id="modalExceptionList" class="tx-list"></div>
+       </div>
+
+       <div class="modal-section" id="modalOtherSection" style="display:none">
+         <div class="modal-section-title">Other Payments</div>
+         <div id="modalOtherList" class="tx-list"></div>
+       </div>
+
+       <div class="modal-section">
+         <div class="modal-section-title">Matched Transactions</div>
+         <div id="modalTxList" class="tx-list"></div>
+       </div>
+
+       <div class="modal-section">
+         <div class="modal-section-title">
+           Raw Payments (debug)
+           <a href="#" id="rawPaymentsToggle" class="raw-toggle">[show]</a>
+         </div>
+         <div id="modalRawList" class="tx-list" style="display:none"></div>
+       </div>
+     </div>
+   </div>
+   ```
+
+c. Add the script tag alongside `filters.js`. To tell the module which API
+   endpoint to fetch, use a `data-page` attribute on `body` (or on the
+   filter container — already exists). Simplest: add `data-page="adults"` /
+   `data-page="juniors"` to the existing `<div id="filterContainer">`.
+   The module reads it on load.
+
+   ```gotmpl
+   <script src="/static/js/member-detail.js" defer></script>
+   ```
+
+### 2. Create [go/internal/web/static/js/member-detail.js](go/internal/web/static/js/member-detail.js)
+
+A single shared module — both pages use the same DOM contract, so the same
+JS works for both. Structure (vanilla ES, no build step, matches `filters.js`
+style — IIFE, `'use strict'`, no globals leaked):
+
+```js
+(function () {
+  'use strict';
+
+  const container = document.getElementById('filterContainer');
+  if (!container) return;
+  const page = container.dataset.page;        // "adults" | "juniors"
+  if (!page) return;
+
+  let apiData = null;          // cached /api/<page> response
+  let currentMemberName = null;
+
+  // ── Data load ─────────────────────────────────────────────────────────
+  async function loadData() {
+    if (apiData) return apiData;
+    const r = await fetch('/api/' + page);
+    if (!r.ok) throw new Error('failed to fetch /api/' + page);
+    apiData = await r.json();
+    return apiData;
+  }
+
+  // Pre-warm immediately so first click is instant.
+  loadData().catch(err => console.error('[member-detail]', err));
+
+  // ── Modal render ──────────────────────────────────────────────────────
+  async function showMember(name) { /* port of Python showMemberDetails */ }
+  function toggleRawPayments(ev)  { /* port */ }
+  function closeModal()           { document.getElementById('memberModal').classList.remove('active'); }
+  function navigateMember(dir)    { /* port — walk visible .member-row */ }
+
+  // ── Wiring ────────────────────────────────────────────────────────────
+  document.querySelectorAll('.info-icon[data-name]').forEach(el => {
+    el.addEventListener('click', ev => {
+      ev.stopPropagation();
+      showMember(el.dataset.name);
+    });
+  });
+  document.getElementById('rawPaymentsToggle').addEventListener('click', toggleRawPayments);
+
+  document.addEventListener('keydown', e => {
+    const modal = document.getElementById('memberModal');
+    if (e.key === 'Escape') { closeModal(); return; }
+    if (!modal.classList.contains('active')) return;
+    if (e.key === 'ArrowDown') { e.preventDefault(); navigateMember(1); }
+    if (e.key === 'ArrowUp')   { e.preventDefault(); navigateMember(-1); }
+  });
+}());
+```
+
+The four `port` functions transcribe Python literally, with two adjustments:
+
+- `data.tier` — read directly from the API response (already present as
+  `AdultsMemberData.Tier` / `JuniorsMemberData.Tier`).
+- Junior `expected` may equal the literal string `"?"` (sentinel from
+  `Expected.MarshalJSON`). The status-row formatter must treat string
+  `expected` as "unknown / single attendance" and skip the numeric
+  comparisons — same logic Python uses when it sees `"?"`.
+
+`navigateMember` walks `document.querySelectorAll('tr.member-row')` filtered
+by `style.display !== 'none'`, finds the index whose `dataset.name`
+matches `currentMemberName`, and calls `showMember` on the next/previous
+visible row. Identical to Python lines 944-962 but uses `dataset.name`
+instead of parsing `childNodes[0].textContent`.
+
+### 3. Wire `data-page` attribute
+
+Append `data-page="adults"` to the `filterContainer` div in `adults.tmpl`,
+`data-page="juniors"` in `juniors.tmpl`. One-line edit per template.
+
+### 4. Unit test
+
+Extend [go/internal/web/html_handler_test.go](go/internal/web/html_handler_test.go)
+with assertions that the rendered HTML for `/adults` and `/juniors` contains:
+
+- `class="info-icon"` with the expected `data-name` per fixture row,
+- `id="memberModal"`,
+- `<script src="/static/js/member-detail.js"`,
+- `data-page="adults"` / `data-page="juniors"` on the filter container.
+
+These are markup-level checks only — the JS module behaviour is not unit
+tested in Go (would require headless-browser tooling that is out of scope
+for this milestone). Manual browser verification covers it.
+
+## Critical files
+
+| Action | Path |
+|--------|------|
+| edit   | [go/internal/web/templates/adults.tmpl](go/internal/web/templates/adults.tmpl) — add `[i]` icon, modal markup, `data-page`, script tag |
+| edit   | [go/internal/web/templates/juniors.tmpl](go/internal/web/templates/juniors.tmpl) — same |
+| new    | `go/internal/web/static/js/member-detail.js` — modal module |
+| edit   | `go/internal/web/html_handler_test.go` — markup assertions |
+
+No changes to: `app.css` (already complete), `assets.go` (the `embed.FS`
+glob `static/js/*` already picks up new files), `server.go`, `render.go`,
+the API handlers, or any domain code.
+
+## Reused existing infrastructure
+
+- [go/internal/web/api/handler.go](go/internal/web/api/handler.go) — `/api/adults`, `/api/juniors` already serve the modal's data
+- [go/internal/web/api/adults.go:27-42](go/internal/web/api/adults.go#L27-L42), [go/internal/web/api/juniors.go](go/internal/web/api/juniors.go) — typed responses
+- [go/internal/web/api/types.go:24-29](go/internal/web/api/types.go#L24-L29) — `Expected` "?" sentinel marshalling
+- [go/internal/web/static/css/app.css](go/internal/web/static/css/app.css) — modal CSS already lifted
+- [go/internal/web/static/js/filters.js](go/internal/web/static/js/filters.js) — IIFE / `'use strict'` / `data-*` attribute style to match
+- [templates/adults.html:725-962](templates/adults.html#L725-L962) — Python reference implementation to port (logic, not literal copy)
+
+## Verification
+
+End-to-end:
+
+1. `cd go && make go-build go-test go-lint` — all green.
+2. `make web-go &` — boot Go on `:8080`.
+3. Browser: `http://localhost:8080/adults`
+   - Click `[i]` next to a member name → modal opens with that member's data.
+   - Status table populated; cells colour-coded (cell-ok / cell-unpaid).
+   - Exception section visible only if member has exceptions; exception
+     amount shown with "*" override style.
+   - "Other Payments" section visible only if member has other-purpose
+     transactions.
+   - Matched transactions list newest-first; raw-payments section starts
+     hidden, `[show]` toggles to `[hide]`.
+   - `Esc` closes the modal; `ArrowDown` / `ArrowUp` walk visible rows
+     (after applying name filter).
+   - Click outside the `.modal-content` closes the modal.
+   - Open DevTools Network tab → reload; confirm one request to `/api/adults`
+     fires on page load (data is pre-warmed), no further requests on row
+     click.
+4. Browser: `http://localhost:8080/juniors`
+   - Same checks; verify `expected = "?"` rows render the question-mark
+     status without throwing JS errors.
+5. Cross-check against Python: `make web-py &` → `http://localhost:5001/adults`
+   should look visually equivalent (modulo nav styling) for the same fixture.
+6. After commit: `tea pr create --base main --head feat/go-m6-5-modal-js`.
+
+## Branching
+
+Per [CLAUDE.md](CLAUDE.md): create `feat/go-m6-5-modal-js` off `main`,
+commit with `Co-Authored-By` trailer, push with `-u`, open MR via
+`tea pr create`. Do not merge from CLI. After the user merges in Gitea:
+
+- Add CHANGELOG entry (timestamp via `date "+%Y-%m-%d %H:%M %Z"`).
+- Tick **M6.5** in
+  [docs/plans/2026-05-03-2349-go-backend-rewrite-progress.md:117](docs/plans/2026-05-03-2349-go-backend-rewrite-progress.md#L117)
+  with the merge SHA.
+
+## Out of scope (deferred)
+
+- **`/qr` modal** — separate `#qrModal` element, lives in M6.6 alongside
+  `/sync-bank`, `/flush-cache`, `/version`.
+- **Pay buttons inside the modal** — Python's modal does not include
+  Pay-from-modal; current Go pages already render row-level Pay buttons
+  in M6.2/M6.3.
+- **Modal on `/payments`** — Python `/payments` has no modal, neither does
+  Go (confirmed in M6.4 plan).
+- **Deep-linking (`/adults#name=Foo`)** — not in Python, not adding.
+- **Headless-browser JS tests** — out of scope for this milestone; manual
+  browser verification per §Verification.

go/internal/services/membership/sources.go

@@ -27,7 +27,9 @@ const (
 
 // AdultMergedMonths mirrors ADULT_MERGED_MONTHS in scripts/attendance.py.
 // Source month → target month (source attendance accumulated into target).
-var AdultMergedMonths = map[string]string{}
+var AdultMergedMonths = map[string]string{
+	"2025-09": "2025-10",
+}
 
 // JuniorMergedMonths mirrors JUNIOR_MERGED_MONTHS in scripts/attendance.py.
 var JuniorMergedMonths = map[string]string{

go/internal/services/membership/sources_test.go

@@ -46,8 +46,8 @@ func TestLoadAdults(t *testing.T) {
 	if err != nil {
 		t.Fatal(err)
 	}
-	// adultMergedMonths is empty so 2025-09 stays as-is
+	// AdultMergedMonths sends 2025-09 → 2025-10
-	if len(months) != 1 || months[0] != "2025-09" {
+	if len(months) != 1 || months[0] != "2025-10" {
 		t.Errorf("unexpected months: %v", months)
 	}
 	if len(members) != 2 {
@@ -55,7 +55,7 @@ func TestLoadAdults(t *testing.T) {
 	}
 	byName := map[string]int{}
 	for _, m := range members {
-		byName[m.Name] = m.Fees["2025-09"].Attendance
+		byName[m.Name] = m.Fees["2025-10"].Attendance
 	}
 	if byName["Alice"] != 2 {
 		t.Errorf("Alice: want 2 sessions, got %d", byName["Alice"])
@@ -73,9 +73,9 @@ func TestLoadAdults_Fee(t *testing.T) {
 	}
 	byName := map[string]int{}
 	for _, m := range members {
-		byName[m.Name] = m.Fees["2025-09"].Expected
+		byName[m.Name] = m.Fees["2025-10"].Expected
 	}
-	// 2 sessions in 2025-09 → AdultFeeMonthlyRate["2025-09"] = 750
+	// 2 sessions land in merged 2025-10 → AdultFeeMonthlyRate["2025-10"] = 750
 	if byName["Alice"] != 750 {
 		t.Errorf("Alice fee: want 750, got %d", byName["Alice"])
 	}

go/internal/web/api/handler.go

@@ -34,37 +34,64 @@ func (h *Handler) ServeVersion(w http.ResponseWriter, r *http.Request) {
 
 // ServeAdults handles GET /api/adults.
 func (h *Handler) ServeAdults(w http.ResponseWriter, r *http.Request) {
-	ctx := r.Context()
+	resp, err := h.AssembleAdults(r.Context())
-	members, sortedMonths, txns, exceptions, err := h.loadAll(ctx, true)
 	if err != nil {
 		h.writeError(w, r, err)
 		return
 	}
+	writeJSON(w, resp)
+}
+
+// AssembleAdults loads all data and builds the adults view model.
+// Shared between the JSON API route and the HTML handler.
+func (h *Handler) AssembleAdults(ctx context.Context) (AdultsResponse, error) {
+	members, sortedMonths, txns, exceptions, err := h.loadAll(ctx, true)
+	if err != nil {
+		return AdultsResponse{}, err
+	}
 	result := domreconcile.Reconcile(members, sortedMonths, txns, exceptions, time.Now().Year())
-	writeJSON(w, buildAdultsResponse(members, sortedMonths, result, txns, h.Config, time.Now().Format("2006-01")))
+	return buildAdultsResponse(members, sortedMonths, result, txns, h.Config, time.Now().Format("2006-01")), nil
 }
 
 // ServeJuniors handles GET /api/juniors.
 func (h *Handler) ServeJuniors(w http.ResponseWriter, r *http.Request) {
-	ctx := r.Context()
+	resp, err := h.AssembleJuniors(r.Context())
-	members, sortedMonths, txns, exceptions, err := h.loadAll(ctx, false)
 	if err != nil {
 		h.writeError(w, r, err)
 		return
 	}
+	writeJSON(w, resp)
+}
+
+// AssembleJuniors loads all data and builds the juniors view model.
+// Shared between the JSON API route and the HTML handler.
+func (h *Handler) AssembleJuniors(ctx context.Context) (JuniorsResponse, error) {
+	members, sortedMonths, txns, exceptions, err := h.loadAll(ctx, false)
+	if err != nil {
+		return JuniorsResponse{}, err
+	}
 	result := domreconcile.Reconcile(members, sortedMonths, txns, exceptions, time.Now().Year())
-	writeJSON(w, buildJuniorsResponse(members, sortedMonths, result, txns, h.Config, time.Now().Format("2006-01")))
+	return buildJuniorsResponse(members, sortedMonths, result, txns, h.Config, time.Now().Format("2006-01")), nil
 }
 
 // ServePayments handles GET /api/payments.
 func (h *Handler) ServePayments(w http.ResponseWriter, r *http.Request) {
-	ctx := r.Context()
+	resp, err := h.AssemblePayments(r.Context())
-	txns, err := h.Sources.LoadTransactions(ctx)
 	if err != nil {
-		h.writeError(w, r, fmt.Errorf("load transactions: %w", err))
+		h.writeError(w, r, err)
 		return
 	}
-	writeJSON(w, buildPaymentsResponse(txns, h.allMemberNames(ctx)))
+	writeJSON(w, resp)
+}
+
+// AssemblePayments loads transactions and builds the payments view model.
+// Shared between the JSON API route and the HTML handler.
+func (h *Handler) AssemblePayments(ctx context.Context) (PaymentsResponse, error) {
+	txns, err := h.Sources.LoadTransactions(ctx)
+	if err != nil {
+		return PaymentsResponse{}, fmt.Errorf("load transactions: %w", err)
+	}
+	return buildPaymentsResponse(txns, h.allMemberNames(ctx)), nil
 }
 
 func (h *Handler) loadAll(ctx context.Context, adults bool) (

go/internal/web/assets.go

@@ -0,0 +1,9 @@
+package web
+
+import "embed"
+
+//go:embed templates
+var templateFS embed.FS
+
+//go:embed static
+var staticFS embed.FS

go/internal/web/html_handler.go

@@ -0,0 +1,71 @@
+package web
+
+import (
+	"fuj-management/go/internal/web/api"
+	"net/http"
+)
+
+// HTMLHandler serves the Go-native HTML frontend.
+type HTMLHandler struct {
+	renderer   *Renderer
+	build      BuildInfo
+	apiHandler *api.Handler
+}
+
+// NewHTMLHandler constructs an HTMLHandler.
+func NewHTMLHandler(r *Renderer, b BuildInfo, ah *api.Handler) *HTMLHandler {
+	return &HTMLHandler{renderer: r, build: b, apiHandler: ah}
+}
+
+func (h *HTMLHandler) ServeAdults(w http.ResponseWriter, r *http.Request) {
+	data, err := h.apiHandler.AssembleAdults(r.Context())
+	if err != nil {
+		h.renderer.Render(w, "adults", AdultsPageData{
+			PageData: PageData{Active: "adults", Build: h.build},
+			Error:    err.Error(),
+		})
+		return
+	}
+	h.renderer.Render(w, "adults", AdultsPageData{
+		PageData: PageData{Active: "adults", Build: h.build},
+		Data:     data,
+	})
+}
+
+func (h *HTMLHandler) ServeJuniors(w http.ResponseWriter, r *http.Request) {
+	data, err := h.apiHandler.AssembleJuniors(r.Context())
+	if err != nil {
+		h.renderer.Render(w, "juniors", JuniorsPageData{
+			PageData: PageData{Active: "juniors", Build: h.build},
+			Error:    err.Error(),
+		})
+		return
+	}
+	h.renderer.Render(w, "juniors", JuniorsPageData{
+		PageData: PageData{Active: "juniors", Build: h.build},
+		Data:     data,
+	})
+}
+
+func (h *HTMLHandler) ServePayments(w http.ResponseWriter, r *http.Request) {
+	data, err := h.apiHandler.AssemblePayments(r.Context())
+	if err != nil {
+		h.renderer.Render(w, "payments", PaymentsPageData{
+			PageData: PageData{Active: "payments", Build: h.build},
+			Error:    err.Error(),
+		})
+		return
+	}
+	h.renderer.Render(w, "payments", PaymentsPageData{
+		PageData: PageData{Active: "payments", Build: h.build},
+		Data:     data,
+	})
+}
+
+func (h *HTMLHandler) ServeSync(w http.ResponseWriter, r *http.Request) {
+	h.renderer.Render(w, "sync", PageData{Active: "sync", Build: h.build})
+}
+
+func (h *HTMLHandler) ServeFlushCache(w http.ResponseWriter, r *http.Request) {
+	h.renderer.Render(w, "flush_cache", PageData{Active: "flush", Build: h.build})
+}

go/internal/web/html_handler_test.go

@@ -0,0 +1,200 @@
+package web_test
+
+import (
+	"context"
+	"fmt"
+	"fuj-management/go/internal/config"
+	"fuj-management/go/internal/domain/reconcile"
+	"fuj-management/go/internal/web"
+	"fuj-management/go/internal/web/api"
+	"net/http"
+	"net/http/httptest"
+	"strings"
+	"testing"
+)
+
+// fixtureSources returns one adult ("Test Member", tier A) with a 2026-01 fee
+// of 750 CZK (4 sessions) and a matching payment of 750 — mirrors Python's
+// test_adults_route fixture.
+type fixtureSources struct{}
+
+func (fixtureSources) LoadAdults(_ context.Context) ([]reconcile.Member, []string, error) {
+	return []reconcile.Member{
+		{Name: "Test Member", Tier: "A", Fees: map[string]reconcile.FeeData{
+			"2026-01": {Expected: 750, Attendance: 4},
+		}},
+	}, []string{"2026-01"}, nil
+}
+
+func (fixtureSources) LoadJuniors(_ context.Context) ([]reconcile.Member, []string, error) {
+	return nil, nil, nil
+}
+
+func (fixtureSources) LoadTransactions(_ context.Context) ([]reconcile.Transaction, error) {
+	amt := float64(750)
+	return []reconcile.Transaction{
+		{Date: "2026-01-01", Amount: 750, Person: "Test Member", Purpose: "2026-01", InferredAmount: &amt},
+	}, nil
+}
+
+func (fixtureSources) LoadExceptions(_ context.Context) (map[reconcile.ExceptionKey]reconcile.Exception, error) {
+	return nil, nil
+}
+
+func fixtureHandler(t *testing.T) *api.Handler {
+	t.Helper()
+	return &api.Handler{
+		Sources: fixtureSources{},
+		Config:  config.Config{BankAccount: "CZ0000000000000000000000"},
+	}
+}
+
+func TestHTMLHandlerSmoke(t *testing.T) {
+	renderer, err := web.NewRenderer()
+	if err != nil {
+		t.Fatalf("NewRenderer: %v", err)
+	}
+	b := web.BuildInfo{Version: "v0", Commit: "abc1234", BuildDate: "2026-01-01"}
+	h := web.NewHTMLHandler(renderer, b, fixtureHandler(t))
+
+	cases := []struct {
+		path    string
+		handler http.HandlerFunc
+	}{
+		{"/adults", h.ServeAdults},
+		{"/juniors", h.ServeJuniors},
+		{"/payments", h.ServePayments},
+		{"/sync-bank", h.ServeSync},
+		{"/flush-cache", h.ServeFlushCache},
+	}
+
+	for _, tc := range cases {
+		t.Run(tc.path, func(t *testing.T) {
+			req := httptest.NewRequest(http.MethodGet, tc.path, nil)
+			w := httptest.NewRecorder()
+			tc.handler(w, req)
+
+			if w.Code != http.StatusOK {
+				t.Errorf("status = %d, want 200", w.Code)
+			}
+			if ct := w.Header().Get("Content-Type"); !strings.HasPrefix(ct, "text/html") {
+				t.Errorf("Content-Type = %q, want text/html", ct)
+			}
+
+			body := w.Body.String()
+			if n := strings.Count(body, `class="active"`); n != 1 {
+				t.Errorf(`class="active" count = %d, want 1`, n)
+			}
+			want := fmt.Sprintf(`href="%s" class="active"`, tc.path)
+			if !strings.Contains(body, want) {
+				t.Errorf("missing active link %q in body", want)
+			}
+		})
+	}
+}
+
+func TestAdultsPage(t *testing.T) {
+	renderer, err := web.NewRenderer()
+	if err != nil {
+		t.Fatalf("NewRenderer: %v", err)
+	}
+	b := web.BuildInfo{Version: "v0", Commit: "abc1234", BuildDate: "2026-01-01"}
+	h := web.NewHTMLHandler(renderer, b, fixtureHandler(t))
+
+	req := httptest.NewRequest(http.MethodGet, "/adults", nil)
+	w := httptest.NewRecorder()
+	h.ServeAdults(w, req)
+
+	if w.Code != http.StatusOK {
+		t.Fatalf("status = %d, want 200", w.Code)
+	}
+
+	body := w.Body.String()
+
+	for _, want := range []string{
+		"Adults Dashboard",
+		"Test Member",
+		"750/750 CZK (4)", // paid/expected (attendance)
+	} {
+		if !strings.Contains(body, want) {
+			t.Errorf("body missing %q", want)
+		}
+	}
+
+	// Python assertion: cell text never says literally "OK"
+	if strings.Contains(body, ">OK<") {
+		t.Error("body should not contain >OK<")
+	}
+}
+
+func TestModalMarkup(t *testing.T) {
+	renderer, err := web.NewRenderer()
+	if err != nil {
+		t.Fatalf("NewRenderer: %v", err)
+	}
+	b := web.BuildInfo{Version: "v0", Commit: "abc1234", BuildDate: "2026-01-01"}
+	h := web.NewHTMLHandler(renderer, b, fixtureHandler(t))
+
+	cases := []struct {
+		path    string
+		handler http.HandlerFunc
+		page    string
+		wantRow string // data-name present only when the page has rows
+	}{
+		{"/adults", h.ServeAdults, "adults", `data-name="Test Member"`},
+		{"/juniors", h.ServeJuniors, "juniors", ""},
+	}
+
+	for _, tc := range cases {
+		t.Run(tc.path, func(t *testing.T) {
+			req := httptest.NewRequest(http.MethodGet, tc.path, nil)
+			w := httptest.NewRecorder()
+			tc.handler(w, req)
+			body := w.Body.String()
+
+			for _, want := range []string{
+				`data-page="` + tc.page + `"`,
+				`id="memberModal"`,
+				`/static/js/member-detail.js`,
+			} {
+				if !strings.Contains(body, want) {
+					t.Errorf("body missing %q", want)
+				}
+			}
+			if tc.wantRow != "" && !strings.Contains(body, tc.wantRow) {
+				t.Errorf("body missing info-icon row %q", tc.wantRow)
+			}
+		})
+	}
+}
+
+func TestPaymentsPage(t *testing.T) {
+	renderer, err := web.NewRenderer()
+	if err != nil {
+		t.Fatalf("NewRenderer: %v", err)
+	}
+	b := web.BuildInfo{Version: "v0", Commit: "abc1234", BuildDate: "2026-01-01"}
+	h := web.NewHTMLHandler(renderer, b, fixtureHandler(t))
+
+	req := httptest.NewRequest(http.MethodGet, "/payments", nil)
+	w := httptest.NewRecorder()
+	h.ServePayments(w, req)
+
+	if w.Code != http.StatusOK {
+		t.Fatalf("status = %d, want 200", w.Code)
+	}
+
+	body := w.Body.String()
+
+	for _, want := range []string{
+		"Payments Ledger",
+		"<h2>Test Member</h2>",
+		"750 CZK",
+		"2026-01-01",
+		"2026-01",
+	} {
+		if !strings.Contains(body, want) {
+			t.Errorf("body missing %q", want)
+		}
+	}
+}

go/internal/web/render.go

@@ -0,0 +1,108 @@
+package web
+
+import (
+	"fmt"
+	"fuj-management/go/internal/web/api"
+	"html/template"
+	"log/slog"
+	"net/http"
+	"net/url"
+	"strconv"
+)
+
+// PageData is the view model passed to every HTML template.
+type PageData struct {
+	Active string
+	Build  BuildInfo
+}
+
+// AdultsPageData is the view model for the /adults HTML page.
+type AdultsPageData struct {
+	PageData
+	Data  api.AdultsResponse
+	Error string
+}
+
+// JuniorsPageData is the view model for the /juniors HTML page.
+type JuniorsPageData struct {
+	PageData
+	Data  api.JuniorsResponse
+	Error string
+}
+
+// PaymentsPageData is the view model for the /payments HTML page.
+type PaymentsPageData struct {
+	PageData
+	Data  api.PaymentsResponse
+	Error string
+}
+
+// Renderer parses and executes HTML templates from the embedded FS.
+type Renderer struct {
+	tmpls map[string]*template.Template
+}
+
+var pageNames = []string{"adults", "juniors", "payments", "sync", "flush_cache"}
+
+// qrHref builds the /qr query URL for a single-month Pay button.
+// rawMonth is "YYYY-MM"; it is converted to "MM/YYYY" in the QR message.
+func qrHref(account string, amount int, name, rawMonth string) string {
+	// Convert "YYYY-MM" → "MM/YYYY" to match Python's showPayQR JS.
+	if len(rawMonth) == 7 && rawMonth[4] == '-' {
+		rawMonth = rawMonth[5:] + "/" + rawMonth[:4]
+	}
+	msg := name + ": " + rawMonth
+	return "/qr?" + url.Values{
+		"account": {account},
+		"amount":  {strconv.Itoa(amount)},
+		"message": {msg},
+	}.Encode()
+}
+
+// qrHrefAll builds the /qr query URL for a Pay-All button.
+// rawPeriods is the "+" -joined MM/YYYY string from MemberRow.RawUnpaidPeriods.
+func qrHrefAll(account string, amount int, name, rawPeriods string) string {
+	msg := name + ": " + rawPeriods
+	return "/qr?" + url.Values{
+		"account": {account},
+		"amount":  {strconv.Itoa(amount)},
+		"message": {msg},
+	}.Encode()
+}
+
+var tmplFuncs = template.FuncMap{
+	"qrHref":    qrHref,
+	"qrHrefAll": qrHrefAll,
+}
+
+// NewRenderer parses all templates from the embedded FS.
+// A parse failure should be treated as a startup-time fatal error.
+func NewRenderer() (*Renderer, error) {
+	tmpls := make(map[string]*template.Template, len(pageNames))
+	for _, name := range pageNames {
+		t, err := template.New("").Funcs(tmplFuncs).ParseFS(templateFS,
+			"templates/base.tmpl",
+			"templates/partials/nav.tmpl",
+			"templates/partials/footer.tmpl",
+			"templates/"+name+".tmpl",
+		)
+		if err != nil {
+			return nil, fmt.Errorf("parse template %q: %w", name, err)
+		}
+		tmpls[name] = t
+	}
+	return &Renderer{tmpls: tmpls}, nil
+}
+
+// Render executes the named template with data, writing to w.
+func (r *Renderer) Render(w http.ResponseWriter, name string, data any) {
+	t, ok := r.tmpls[name]
+	if !ok {
+		http.Error(w, "template not found: "+name, http.StatusInternalServerError)
+		return
+	}
+	w.Header().Set("Content-Type", "text/html; charset=utf-8")
+	if err := t.ExecuteTemplate(w, "base", data); err != nil {
+		slog.Error("render template", "name", name, "err", err)
+	}
+}

go/internal/web/server.go

@@ -6,6 +6,7 @@ import (
 	"fuj-management/go/internal/services/membership"
 	"fuj-management/go/internal/web/api"
 	"fuj-management/go/internal/web/middleware"
+	"io/fs"
 	"log/slog"
 	"net/http"
 )
@@ -19,7 +20,12 @@ type BuildInfo struct {
 
 // Run registers routes and starts the HTTP server on addr.
 func Run(logger *slog.Logger, addr string, build BuildInfo, sources membership.Sources, cfg config.Config) error {
-	h := &api.Handler{
+	renderer, err := NewRenderer()
+	if err != nil {
+		return fmt.Errorf("init templates: %w", err)
+	}
+
+	ah := &api.Handler{
 		BuildVersion: build.Version,
 		BuildCommit:  build.Commit,
 		BuildDate:    build.BuildDate,
@@ -27,22 +33,34 @@ func Run(logger *slog.Logger, addr string, build BuildInfo, sources membership.S
 		Config:       cfg,
 		Logger:       logger,
 	}
+	hh := NewHTMLHandler(renderer, build, ah)
+
+	staticSubFS, err := fs.Sub(staticFS, "static")
+	if err != nil {
+		return fmt.Errorf("static subfs: %w", err)
+	}
 
 	mux := http.NewServeMux()
-	mux.HandleFunc("GET /{$}", helloHandler(build))
+
-	mux.HandleFunc("GET /api/version", h.ServeVersion)
+	// HTML routes
-	mux.HandleFunc("GET /api/adults", h.ServeAdults)
+	mux.HandleFunc("GET /{$}", func(w http.ResponseWriter, r *http.Request) {
-	mux.HandleFunc("GET /api/juniors", h.ServeJuniors)
+		http.Redirect(w, r, "/adults", http.StatusFound)
-	mux.HandleFunc("GET /api/payments", h.ServePayments)
+	})
+	mux.HandleFunc("GET /adults", hh.ServeAdults)
+	mux.HandleFunc("GET /juniors", hh.ServeJuniors)
+	mux.HandleFunc("GET /payments", hh.ServePayments)
+	mux.HandleFunc("GET /sync-bank", hh.ServeSync)
+	mux.HandleFunc("GET /flush-cache", hh.ServeFlushCache)
+
+	// Static files
+	mux.Handle("/static/", http.StripPrefix("/static/", http.FileServerFS(staticSubFS)))
+
+	// JSON API routes
+	mux.HandleFunc("GET /api/version", ah.ServeVersion)
+	mux.HandleFunc("GET /api/adults", ah.ServeAdults)
+	mux.HandleFunc("GET /api/juniors", ah.ServeJuniors)
+	mux.HandleFunc("GET /api/payments", ah.ServePayments)
 
 	logger.Info("starting server", "addr", addr)
 	return http.ListenAndServe(addr, middleware.RequestTimer(logger, mux))
 }
-
-func helloHandler(build BuildInfo) http.HandlerFunc {
-	return func(w http.ResponseWriter, r *http.Request) {
-		w.Header().Set("Content-Type", "text/plain; charset=utf-8")
-		fmt.Fprintf(w, "fuj-go ok\nversion: %s\ncommit:  %s\nbuilt:   %s\n",
-			build.Version, build.Commit, build.BuildDate)
-	}
-}

go/internal/web/static/css/app.css

@@ -0,0 +1,534 @@
+body {
+    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
+    background-color: #0c0c0c;
+    color: #cccccc;
+    padding: 10px;
+    margin: 0;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    font-size: 11px;
+    line-height: 1.2;
+}
+
+h1 {
+    color: #00ff00;
+    font-family: inherit;
+    margin-top: 10px;
+    margin-bottom: 20px;
+    text-transform: uppercase;
+    letter-spacing: 1px;
+    font-size: 14px;
+}
+
+h2 {
+    color: #00ff00;
+    font-size: 12px;
+    margin-top: 30px;
+    margin-bottom: 10px;
+    text-transform: uppercase;
+    width: 100%;
+    max-width: 1200px;
+    border-bottom: 1px solid #333;
+    padding-bottom: 5px;
+}
+
+.nav {
+    margin-bottom: 20px;
+    font-size: 12px;
+    color: #555;
+    display: flex;
+    flex-direction: column;
+    gap: 10px;
+    align-items: center;
+}
+
+.nav > div {
+    display: flex;
+    gap: 15px;
+    align-items: center;
+}
+
+.nav a {
+    color: #00ff00;
+    text-decoration: none;
+    padding: 2px 8px;
+    border: 1px solid #333;
+}
+
+.nav a.active {
+    color: #000;
+    background-color: #00ff00;
+    border-color: #00ff00;
+}
+
+.nav a:hover {
+    color: #fff;
+    border-color: #555;
+}
+
+.nav-archived a {
+    font-size: 10px;
+    color: #666;
+    border-color: #222;
+}
+
+.nav-archived a.active {
+    color: #ccc;
+    background-color: #333;
+    border-color: #555;
+}
+
+.nav-archived a:hover {
+    color: #999;
+    border-color: #444;
+}
+
+.description {
+    margin-bottom: 20px;
+    text-align: center;
+    color: #888;
+    max-width: 800px;
+}
+
+.description a {
+    color: #00ff00;
+    text-decoration: none;
+}
+
+.description a:hover {
+    text-decoration: underline;
+}
+
+.table-container {
+    background-color: transparent;
+    border: 1px solid #333;
+    box-shadow: none;
+    overflow-x: auto;
+    width: 100%;
+    max-width: 1200px;
+    margin-bottom: 30px;
+}
+
+table {
+    border-collapse: collapse;
+    width: 100%;
+    table-layout: auto;
+}
+
+th,
+td {
+    padding: 2px 8px;
+    text-align: right;
+    border-bottom: 1px dashed #222;
+    white-space: nowrap;
+}
+
+th:first-child,
+td:first-child {
+    text-align: left;
+}
+
+th {
+    background-color: transparent;
+    color: #888888;
+    font-weight: normal;
+    border-bottom: 1px solid #555;
+    text-transform: lowercase;
+}
+
+tr:hover {
+    background-color: #1a1a1a;
+}
+
+.balance-pos {
+    color: #00ff00;
+}
+
+.balance-neg {
+    color: #ff3333;
+}
+
+.cell-ok {
+    color: #00ff00;
+}
+
+.cell-unpaid {
+    color: #ff3333;
+    background-color: rgba(255, 51, 51, 0.05);
+    position: relative;
+}
+
+.cell-unpaid-current {
+    color: #994444;
+    background-color: rgba(153, 68, 68, 0.05);
+    position: relative;
+}
+
+.cell-overridden {
+    color: #ffa500 !important;
+}
+
+.pay-btn {
+    display: none;
+    position: absolute;
+    right: 5px;
+    top: 50%;
+    transform: translateY(-50%);
+    background: #ff3333;
+    color: white;
+    text-decoration: none;
+    border: none;
+    border-radius: 3px;
+    padding: 2px 6px;
+    font-size: 10px;
+    cursor: pointer;
+    font-weight: bold;
+}
+
+.member-row:hover .pay-btn {
+    display: inline-block;
+}
+
+.cell-empty {
+    color: #444444;
+}
+
+.list-container {
+    width: 100%;
+    max-width: 1200px;
+    color: #888;
+    margin-bottom: 40px;
+}
+
+.list-item {
+    display: flex;
+    justify-content: flex-start;
+    gap: 20px;
+    padding: 1px 0;
+    border-bottom: 1px dashed #222;
+}
+
+.list-item-name {
+    color: #ccc;
+    min-width: 200px;
+}
+
+.list-item-val {
+    color: #00ff00;
+}
+
+.unmatched-row {
+    font-family: inherit;
+    display: grid;
+    grid-template-columns: 100px 100px 200px 1fr;
+    gap: 15px;
+    color: #888;
+    padding: 2px 0;
+    border-bottom: 1px dashed #222;
+}
+
+.unmatched-header {
+    color: #555;
+    border-bottom: 1px solid #333;
+    margin-bottom: 5px;
+}
+
+.filter-container {
+    width: 100%;
+    max-width: 1200px;
+    margin-bottom: 15px;
+    display: flex;
+    align-items: center;
+    gap: 10px;
+}
+
+.filter-input {
+    background-color: #1a1a1a;
+    border: 1px solid #333;
+    color: #00ff00;
+    font-family: inherit;
+    font-size: 11px;
+    padding: 4px 8px;
+    width: 250px;
+    outline: none;
+}
+
+.filter-input:focus {
+    border-color: #00ff00;
+}
+
+.filter-select {
+    background-color: #1a1a1a;
+    border: 1px solid #333;
+    color: #00ff00;
+    font-family: inherit;
+    font-size: 11px;
+    padding: 4px 8px;
+    outline: none;
+}
+
+.filter-select:focus {
+    border-color: #00ff00;
+}
+
+.month-hidden {
+    display: none !important;
+}
+
+.filter-label {
+    color: #888;
+    text-transform: lowercase;
+}
+
+.info-icon {
+    color: #00ff00;
+    cursor: pointer;
+    margin-left: 5px;
+    font-size: 10px;
+    opacity: 0.5;
+}
+
+.info-icon:hover {
+    opacity: 1;
+}
+
+/* Modal Styles */
+#memberModal {
+    display: none !important;
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100vw;
+    height: 100vh;
+    background-color: rgba(0, 0, 0, 0.9);
+    z-index: 9999;
+    justify-content: center;
+    align-items: center;
+}
+
+#memberModal.active {
+    display: flex !important;
+}
+
+.modal-content {
+    background-color: #0c0c0c;
+    border: 1px solid #00ff00;
+    width: 90%;
+    max-width: 800px;
+    max-height: 85vh;
+    overflow-y: auto;
+    padding: 20px;
+    box-shadow: 0 0 20px rgba(0, 255, 0, 0.2);
+    position: relative;
+}
+
+.modal-header {
+    border-bottom: 1px solid #333;
+    margin-bottom: 20px;
+    padding-bottom: 10px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+}
+
+.modal-title {
+    color: #00ff00;
+    font-size: 14px;
+    text-transform: uppercase;
+}
+
+.close-btn {
+    color: #ff3333;
+    cursor: pointer;
+    font-size: 14px;
+    text-transform: lowercase;
+}
+
+.modal-section {
+    margin-bottom: 25px;
+}
+
+.modal-section-title {
+    color: #555;
+    text-transform: uppercase;
+    font-size: 10px;
+    margin-bottom: 8px;
+    border-bottom: 1px dashed #222;
+}
+
+.raw-toggle {
+    color: #333;
+    font-size: 9px;
+    text-transform: lowercase;
+    margin-left: 8px;
+    text-decoration: none;
+    letter-spacing: 0;
+}
+
+.raw-toggle:hover {
+    color: #666;
+}
+
+.modal-table {
+    width: 100%;
+    border-collapse: collapse;
+}
+
+.modal-table th,
+.modal-table td {
+    text-align: left;
+    padding: 4px 0;
+    border-bottom: 1px dashed #1a1a1a;
+}
+
+.modal-table th {
+    color: #666;
+    font-weight: normal;
+    font-size: 10px;
+}
+
+.tx-list {
+    list-style: none;
+    padding: 0;
+    margin: 0;
+}
+
+.tx-item {
+    padding: 8px 0;
+    border-bottom: 1px dashed #222;
+}
+
+.tx-meta {
+    color: #555;
+    font-size: 10px;
+    margin-bottom: 4px;
+}
+
+.tx-main {
+    display: flex;
+    justify-content: space-between;
+    gap: 20px;
+}
+
+.tx-amount {
+    color: #00ff00;
+}
+
+.tx-sender {
+    color: #ccc;
+}
+
+.tx-msg {
+    color: #888;
+    font-style: italic;
+}
+
+.footer {
+    margin-top: 50px;
+    margin-bottom: 20px;
+    color: #333;
+    font-size: 9px;
+    text-align: center;
+    width: 100%;
+    cursor: pointer;
+    user-select: none;
+}
+
+.perf-breakdown {
+    display: none;
+    margin-top: 5px;
+    color: #222;
+}
+
+/* QR Modal styles */
+#qrModal .modal-content {
+    max-width: 400px;
+    text-align: center;
+}
+
+.qr-image {
+    background: white;
+    padding: 10px;
+    border-radius: 5px;
+    margin: 20px 0;
+    display: inline-block;
+}
+
+.qr-image img {
+    display: block;
+    width: 250px;
+    height: 250px;
+}
+
+.qr-details {
+    text-align: left;
+    margin-top: 15px;
+    font-size: 14px;
+    color: #ccc;
+}
+
+.qr-details div {
+    margin-bottom: 5px;
+}
+
+.qr-details span {
+    color: #00ff00;
+    font-family: monospace;
+}
+
+/* /payments ledger */
+.ledger-container {
+    width: 100%;
+    max-width: 1000px;
+    margin-bottom: 40px;
+}
+
+.member-block {
+    margin-bottom: 20px;
+}
+
+.txn-table {
+    border-collapse: collapse;
+    width: 100%;
+    margin-top: 5px;
+}
+
+.txn-table th,
+.txn-table td {
+    padding: 2px 8px;
+    text-align: left;
+    border-bottom: 1px dashed #222;
+}
+
+.txn-table th {
+    color: #555;
+    text-transform: lowercase;
+    font-weight: normal;
+    border-bottom: 1px solid #333;
+}
+
+.txn-date {
+    min-width: 80px;
+    color: #888;
+}
+
+.txn-amount {
+    min-width: 80px;
+    text-align: right !important;
+    color: #00ff00;
+}
+
+.txn-purpose {
+    min-width: 100px;
+    color: #aaa;
+}
+
+.txn-message {
+    color: #666;
+    font-style: italic;
+}
+
+.txn-table tr:hover {
+    background-color: #1a1a1a;
+}

go/internal/web/static/js/filters.js

@@ -0,0 +1,91 @@
+// Client-side filters for the Adults (and future Juniors) dashboard table.
+// Mirrors adults.html:864-1051 from the Python frontend.
+(function () {
+  'use strict';
+
+  // NFD-normalize + strip diacritics + lowercase, matching Python's
+  // unicodedata.normalize('NFD', s).encode('ascii', 'ignore').decode().lower()
+  function normalize(s) {
+    return s.normalize('NFD').replace(/\p{Diacritic}/gu, '').toLowerCase();
+  }
+
+  const container = document.getElementById('filterContainer');
+  if (!container) return;
+
+  const currentMonth = container.dataset.currentMonth || '';
+
+  const nameInput   = document.getElementById('nameFilter');
+  const fromSelect  = document.getElementById('fromMonth');
+  const toSelect    = document.getElementById('toMonth');
+  const applyBtn    = document.getElementById('applyFilter');
+  const clearBtn    = document.getElementById('clearFilter');
+
+  // ── Month column visibility ───────────────────────────────────────────────
+
+  // Hide columns whose raw month is in the future by default.
+  function hideFutureMonths() {
+    if (!currentMonth) return;
+    document.querySelectorAll('[data-raw-month]').forEach(el => {
+      if (el.dataset.rawMonth > currentMonth) {
+        el.classList.add('month-hidden');
+      }
+    });
+    // Sync toMonth select to the last non-hidden month.
+    const ths = [...document.querySelectorAll('thead th[data-month-idx]')];
+    const visibleIdxs = ths
+      .filter(th => !th.classList.contains('month-hidden'))
+      .map(th => parseInt(th.dataset.monthIdx, 10));
+    if (visibleIdxs.length) {
+      toSelect.value = String(visibleIdxs[visibleIdxs.length - 1]);
+    }
+  }
+
+  function applyMonthFilter() {
+    const from = fromSelect.value !== '' ? parseInt(fromSelect.value, 10) : -Infinity;
+    const to   = toSelect.value   !== '' ? parseInt(toSelect.value,   10) :  Infinity;
+
+    document.querySelectorAll('[data-month-idx]').forEach(el => {
+      const idx = parseInt(el.dataset.monthIdx, 10);
+      if (idx < from || idx > to) {
+        el.classList.add('month-hidden');
+      } else {
+        el.classList.remove('month-hidden');
+      }
+    });
+  }
+
+  function clearMonthFilter() {
+    document.querySelectorAll('[data-month-idx]').forEach(el => {
+      el.classList.remove('month-hidden');
+    });
+    fromSelect.value = '';
+    toSelect.value   = '';
+  }
+
+  // ── Name row visibility ───────────────────────────────────────────────────
+
+  function applyNameFilter() {
+    const query = normalize(nameInput.value.trim());
+    document.querySelectorAll('tr.member-row').forEach(row => {
+      const name = normalize(row.dataset.name || '');
+      row.style.display = (!query || name.includes(query)) ? '' : 'none';
+    });
+  }
+
+  // ── Event wiring ─────────────────────────────────────────────────────────
+
+  nameInput.addEventListener('input', applyNameFilter);
+
+  applyBtn.addEventListener('click', applyMonthFilter);
+
+  clearBtn.addEventListener('click', function () {
+    nameInput.value = '';
+    applyNameFilter();
+    clearMonthFilter();
+    hideFutureMonths();
+  });
+
+  // ── Initialise ────────────────────────────────────────────────────────────
+
+  hideFutureMonths();
+}());

go/internal/web/static/js/member-detail.js

@@ -0,0 +1,245 @@
+// Member-detail modal for /adults and /juniors pages.
+// Fetches /api/<page> once on load, caches the response, renders on row click.
+// Mirrors templates/adults.html JS (lines 718-993) but as a standalone module.
+(function () {
+  'use strict';
+
+  const container = document.getElementById('filterContainer');
+  if (!container) return;
+  const page = container.dataset.page; // "adults" | "juniors"
+  if (!page) return;
+
+  let apiData = null;
+  let currentMemberName = null;
+
+  // ── Data load ─────────────────────────────────────────────────────────────
+
+  async function loadData() {
+    if (apiData) return apiData;
+    const r = await fetch('/api/' + page);
+    if (!r.ok) throw new Error('[member-detail] failed to fetch /api/' + page + ': ' + r.status);
+    apiData = await r.json();
+    return apiData;
+  }
+
+  // Pre-warm on page load so first click is instant.
+  loadData().catch(function (err) { console.error(err); });
+
+  // ── Modal render ──────────────────────────────────────────────────────────
+
+  async function showMember(name) {
+    currentMemberName = name;
+    const data = (await loadData());
+    const member = data.member_data[name];
+    if (!member) return;
+
+    document.getElementById('modalMemberName').textContent = name;
+    document.getElementById('modalTier').textContent = 'Tier: ' + (member.tier || '-');
+
+    const monthLabels = data.month_labels || {};
+    const statusBody = document.getElementById('modalStatusBody');
+    statusBody.innerHTML = '';
+
+    const allTransactions = [];
+    const monthKeys = Object.keys(member.months || {}).sort().reverse();
+
+    monthKeys.forEach(function (m) {
+      const md = member.months[m];
+      const expected = md.expected;          // int for adults; int or "?" for juniors
+      const paid = md.paid || 0;
+      const attendance = md.attendance_count || 0;
+      const originalExpected = md.original_expected;
+      const isUnknown = (expected === '?');
+
+      let status = '-';
+      let statusClass = '';
+      if (!isUnknown && (expected > 0 || paid > 0)) {
+        if (paid >= expected && expected > 0) {
+          status = paid + '/' + expected;
+          statusClass = 'cell-ok';
+        } else if (paid > 0) {
+          status = paid + '/' + expected;
+        } else {
+          status = '0/' + expected;
+          statusClass = 'cell-unpaid';
+        }
+      } else if (isUnknown) {
+        status = paid > 0 ? paid + '/?' : '?';
+      }
+
+      let expectedCell;
+      if (isUnknown) {
+        expectedCell = '?';
+      } else if (md.exception) {
+        expectedCell = '<span style="color: #ffaa00;" title="Overridden from ' + originalExpected + '">' + expected + '*</span>';
+      } else {
+        expectedCell = expected;
+      }
+
+      const displayMonth = monthLabels[m] || m;
+      const row = document.createElement('tr');
+      row.innerHTML =
+        '<td style="color: #888;">' + displayMonth + '</td>' +
+        '<td style="text-align: center; color: #ccc;">' + attendance + '</td>' +
+        '<td style="text-align: center; color: #ccc;">' + expectedCell + '</td>' +
+        '<td style="text-align: center; color: #ccc;">' + paid + '</td>' +
+        '<td style="text-align: right;" class="' + statusClass + '">' + status + '</td>';
+      statusBody.appendChild(row);
+
+      if (md.transactions) {
+        md.transactions.forEach(function (tx) {
+          allTransactions.push(Object.assign({ month: m }, tx));
+        });
+      }
+    });
+
+    // Exceptions
+    const exList = document.getElementById('modalExceptionList');
+    const exSection = document.getElementById('modalExceptionSection');
+    exList.innerHTML = '';
+    const exceptions = [];
+    monthKeys.forEach(function (m) {
+      if (member.months[m].exception) {
+        exceptions.push(Object.assign({ month: m }, member.months[m].exception));
+      }
+    });
+    if (exceptions.length > 0) {
+      exSection.style.display = 'block';
+      exceptions.forEach(function (ex) {
+        const displayMonth = monthLabels[ex.month] || ex.month;
+        const item = document.createElement('div');
+        item.className = 'tx-item';
+        item.innerHTML =
+          '<div class="tx-meta">' + displayMonth + '</div>' +
+          '<div class="tx-main"><span class="tx-amount" style="color: #ffaa00;">' + ex.amount + ' CZK</span></div>' +
+          '<div class="tx-msg">' + (ex.note || 'No details provided.') + '</div>';
+        exList.appendChild(item);
+      });
+    } else {
+      exSection.style.display = 'none';
+    }
+
+    // Other transactions
+    const otherList = document.getElementById('modalOtherList');
+    const otherSection = document.getElementById('modalOtherSection');
+    otherList.innerHTML = '';
+    if (member.other_transactions && member.other_transactions.length > 0) {
+      otherSection.style.display = 'block';
+      member.other_transactions.forEach(function (tx) {
+        const item = document.createElement('div');
+        item.className = 'tx-item';
+        item.innerHTML =
+          '<div class="tx-meta">' + tx.date + ' | ' + (tx.purpose || 'Other') + '</div>' +
+          '<div class="tx-main">' +
+            '<span class="tx-amount" style="color: #66ccff;">' + tx.amount + ' CZK</span>' +
+            '<span class="tx-sender">' + (tx.sender || '') + '</span>' +
+          '</div>' +
+          '<div class="tx-msg">' + (tx.message || '') + '</div>';
+        otherList.appendChild(item);
+      });
+    } else {
+      otherSection.style.display = 'none';
+    }
+
+    // Matched transactions (payment history)
+    const txList = document.getElementById('modalTxList');
+    txList.innerHTML = '';
+    if (allTransactions.length === 0) {
+      txList.innerHTML = '<div style="color: #444; font-style: italic; padding: 10px 0;">No transactions matched to this member.</div>';
+    } else {
+      allTransactions.sort(function (a, b) { return b.date.localeCompare(a.date); });
+      allTransactions.forEach(function (tx) {
+        const displayMonth = monthLabels[tx.month] || tx.month;
+        const item = document.createElement('div');
+        item.className = 'tx-item';
+        item.innerHTML =
+          '<div class="tx-meta">' + tx.date + ' | matched to ' + displayMonth + '</div>' +
+          '<div class="tx-main">' +
+            '<span class="tx-amount">' + tx.amount + ' CZK</span>' +
+            '<span class="tx-sender">' + (tx.sender || '') + '</span>' +
+          '</div>' +
+          '<div class="tx-msg">' + (tx.message || '') + '</div>';
+        txList.appendChild(item);
+      });
+    }
+
+    // Raw payments — hidden by default; reset toggle on each open
+    const rawList = document.getElementById('modalRawList');
+    const rawToggle = document.getElementById('rawPaymentsToggle');
+    rawList.style.display = 'none';
+    rawToggle.textContent = '[show]';
+    rawList.innerHTML = '';
+    const rawRows = (data.raw_payments || {})[name] || [];
+    if (rawRows.length === 0) {
+      rawList.innerHTML = '<div style="color: #444; font-style: italic; padding: 10px 0;">No raw payments tied to this member.</div>';
+    } else {
+      rawRows.forEach(function (tx) {
+        const inferredNote = (tx.inferred_amount && tx.inferred_amount !== '' && tx.inferred_amount !== tx.amount)
+          ? ' <span style="color:#888;">(inferred: ' + tx.inferred_amount + ')</span>'
+          : '';
+        const manualNote = tx.manual_fix ? ' <span style="color:#ffaa00;">[manual fix]</span>' : '';
+        const bankIdNote = tx.bank_id ? '<span style="color:#444;"> · bank_id: ' + tx.bank_id + '</span>' : '';
+        const item = document.createElement('div');
+        item.className = 'tx-item';
+        item.innerHTML =
+          '<div class="tx-meta">' + tx.date + ' | purpose: ' + (tx.purpose || '—') + manualNote + '</div>' +
+          '<div class="tx-main">' +
+            '<span class="tx-amount">' + tx.amount + ' CZK' + inferredNote + '</span>' +
+            '<span class="tx-sender">' + (tx.sender || '') + '</span>' +
+          '</div>' +
+          '<div class="tx-msg">' + (tx.message || '') + '</div>' +
+          '<div class="tx-meta">' + (tx.person || '') + bankIdNote + '</div>';
+        rawList.appendChild(item);
+      });
+    }
+
+    document.getElementById('memberModal').classList.add('active');
+  }
+
+  // ── Raw-payments toggle ───────────────────────────────────────────────────
+
+  function toggleRawPayments(ev) {
+    ev.preventDefault();
+    const list = document.getElementById('modalRawList');
+    const link = document.getElementById('rawPaymentsToggle');
+    const hidden = list.style.display === 'none';
+    list.style.display = hidden ? 'block' : 'none';
+    link.textContent = hidden ? '[hide]' : '[show]';
+  }
+
+  // ── Close + keyboard nav ──────────────────────────────────────────────────
+
+  function closeModal() {
+    document.getElementById('memberModal').classList.remove('active');
+  }
+
+  function navigateMember(direction) {
+    const rows = Array.from(document.querySelectorAll('tr.member-row'));
+    const visible = rows.filter(function (r) { return r.style.display !== 'none'; });
+    const idx = visible.findIndex(function (r) { return r.dataset.name === currentMemberName; });
+    if (idx === -1) return;
+    const next = idx + direction;
+    if (next >= 0 && next < visible.length) {
+      showMember(visible[next].dataset.name);
+    }
+  }
+
+  // ── Wiring ────────────────────────────────────────────────────────────────
+
+  document.querySelectorAll('.info-icon[data-name]').forEach(function (el) {
+    el.addEventListener('click', function (ev) {
+      ev.stopPropagation();
+      showMember(el.dataset.name);
+    });
+  });
+
+  document.getElementById('rawPaymentsToggle').addEventListener('click', toggleRawPayments);
+
+  document.addEventListener('keydown', function (e) {
+    if (e.key === 'Escape') { closeModal(); return; }
+    const modal = document.getElementById('memberModal');
+    if (!modal.classList.contains('active')) return;
+    if (e.key === 'ArrowDown') { e.preventDefault(); navigateMember(1); }
+    if (e.key === 'ArrowUp')   { e.preventDefault(); navigateMember(-1); }
+  });
+}());

go/internal/web/templates/adults.tmpl

@@ -0,0 +1,189 @@
+{{define "title"}}Adults{{end}}
+{{define "content"}}
+<h1>Adults Dashboard</h1>
+
+{{if .Error}}
+<div class="description">Error loading data: {{.Error}}</div>
+{{else}}
+
+<div class="description">
+  Balances calculated by matching Google Sheet payments against attendance fees.<br>
+  Source: <a href="{{.Data.AttendanceURL}}" target="_blank" rel="noopener">Attendance Sheet</a> |
+  <a href="{{.Data.PaymentsURL}}" target="_blank" rel="noopener">Payments Ledger</a>
+</div>
+
+<div class="filter-container" id="filterContainer" data-current-month="{{.Data.CurrentMonth}}" data-page="adults">
+  <div class="filter-item">
+    <label class="filter-label" for="nameFilter">Member</label>
+    <input id="nameFilter" class="filter-input" type="text" placeholder="Filter by name…">
+  </div>
+  <div class="filter-item">
+    <label class="filter-label" for="fromMonth">From</label>
+    <select id="fromMonth" class="filter-select">
+      <option value="">All</option>
+      {{range $i, $m := .Data.Months}}
+      <option value="{{$i}}">{{$m}}</option>
+      {{end}}
+    </select>
+  </div>
+  <div class="filter-item">
+    <label class="filter-label" for="toMonth">To</label>
+    <select id="toMonth" class="filter-select">
+      <option value="">All</option>
+      {{range $i, $m := .Data.Months}}
+      <option value="{{$i}}">{{$m}}</option>
+      {{end}}
+    </select>
+  </div>
+  <div class="filter-item">
+    <button id="applyFilter" class="filter-select" type="button" style="cursor: pointer;">Apply</button>
+    <button id="clearFilter" class="filter-select" type="button" style="cursor: pointer;">All</button>
+  </div>
+</div>
+
+{{if .Data.Results}}
+<div class="table-container">
+<table>
+  <thead>
+    <tr>
+      <th>Member</th>
+      {{range $i, $m := .Data.Months}}
+      <th data-month-idx="{{$i}}" data-raw-month="{{index $.Data.RawMonths $i}}">{{$m}}</th>
+      {{end}}
+      <th>Balance</th>
+    </tr>
+  </thead>
+  <tbody>
+    {{range $row := .Data.Results}}
+    <tr class="member-row" data-name="{{$row.Name}}">
+      <td class="member-name">{{$row.Name}}<span class="info-icon" data-name="{{$row.Name}}" title="Show details">[i]</span></td>
+      {{range $i, $cell := $row.Months}}
+      <td data-month-idx="{{$i}}" title="{{$cell.Tooltip}}"
+          class="{{if eq $cell.Status "empty"}}cell-empty{{else if and (or (eq $cell.Status "unpaid") (eq $cell.Status "partial")) (ge $cell.RawMonth $.Data.CurrentMonth)}}cell-unpaid-current{{else if or (eq $cell.Status "unpaid") (eq $cell.Status "partial")}}cell-unpaid{{else if eq $cell.Status "ok"}}cell-ok{{end}}{{if $cell.Overridden}} cell-overridden{{end}}">
+        {{$cell.Text}}
+        {{if and (or (eq $cell.Status "unpaid") (eq $cell.Status "partial")) (lt $cell.RawMonth $.Data.CurrentMonth)}}
+        <a class="pay-btn" href="{{qrHref $.Data.BankAccount $cell.Amount $row.Name $cell.RawMonth}}">Pay</a>
+        {{end}}
+      </td>
+      {{end}}
+      <td class="{{if lt $row.Balance 0}}balance-neg{{else if gt $row.Balance 0}}balance-pos{{end}}" style="position: relative;">
+        {{$row.Balance}}
+        {{if gt $row.PayableAmount 0}}
+        <a class="pay-btn" href="{{qrHrefAll $.Data.BankAccount $row.PayableAmount $row.Name $row.RawUnpaidPeriods}}">Pay All</a>
+        {{end}}
+      </td>
+    </tr>
+    {{end}}
+    <tr class="totals-row" style="font-weight: bold; background-color: #111; border-top: 2px solid #333;">
+      <td style="text-align: left; padding: 6px 8px;">TOTAL</td>
+      {{range $i, $t := .Data.Totals}}
+      <td data-month-idx="{{$i}}" data-raw-month="{{index $.Data.RawMonths $i}}" class="{{if eq $t.Status "ok"}}cell-ok{{else if eq $t.Status "unpaid"}}cell-unpaid{{else if eq $t.Status "surplus"}}cell-overridden{{end}}" style="padding-top: 4px; padding-bottom: 4px;">
+        <span style="font-size: 0.6em; font-weight: normal; color: #666; text-transform: lowercase; display: block; margin-bottom: 2px;">received / expected</span>
+        {{$t.Text}}
+      </td>
+      {{end}}
+      <td></td>
+    </tr>
+  </tbody>
+</table>
+</div>
+{{else}}
+<div class="description">No members found.</div>
+{{end}}
+
+{{if .Data.Credits}}
+<h2>Credits (Advance Payments / Surplus)</h2>
+<div class="list-container">
+  {{range .Data.Credits}}
+  <div class="list-item">
+    <span class="list-item-name">{{.Name}}</span>
+    <span class="list-item-val">{{.Amount}} CZK</span>
+  </div>
+  {{end}}
+</div>
+{{end}}
+
+{{if .Data.Debts}}
+<h2>Debts (Missing Payments)</h2>
+<div class="list-container">
+  {{range .Data.Debts}}
+  <div class="list-item">
+    <span class="list-item-name">{{.Name}}</span>
+    <span class="list-item-val" style="color: #ff3333;">{{.Amount}} CZK</span>
+  </div>
+  {{end}}
+</div>
+{{end}}
+
+{{if .Data.Unmatched}}
+<h2>Unmatched Transactions</h2>
+<div class="list-container">
+  <div class="unmatched-row unmatched-header">
+    <span>Date</span>
+    <span>Amount</span>
+    <span>Sender</span>
+    <span>Message</span>
+  </div>
+  {{range .Data.Unmatched}}
+  <div class="unmatched-row">
+    <span>{{.Date}}</span>
+    <span>{{printf "%.0f" .Amount}}</span>
+    <span>{{.Sender}}</span>
+    <span>{{.Message}}</span>
+  </div>
+  {{end}}
+</div>
+{{end}}
+
+{{end}}
+
+<div id="memberModal" onclick="if(event.target===this)this.classList.remove('active')">
+  <div class="modal-content">
+    <div class="modal-header">
+      <div class="modal-title" id="modalMemberName">Member Name</div>
+      <div class="close-btn" onclick="document.getElementById('memberModal').classList.remove('active')">[close]</div>
+    </div>
+
+    <div class="modal-section">
+      <div class="modal-section-title">Status Summary</div>
+      <div id="modalTier" style="margin-bottom: 10px; color: #888;">Tier: -</div>
+      <table class="modal-table">
+        <thead><tr>
+          <th>Month</th>
+          <th style="text-align: center;">Att.</th>
+          <th style="text-align: center;">Expected</th>
+          <th style="text-align: center;">Paid</th>
+          <th style="text-align: right;">Status</th>
+        </tr></thead>
+        <tbody id="modalStatusBody"></tbody>
+      </table>
+    </div>
+
+    <div class="modal-section" id="modalExceptionSection" style="display: none;">
+      <div class="modal-section-title">Fee Exceptions</div>
+      <div id="modalExceptionList" class="tx-list"></div>
+    </div>
+
+    <div class="modal-section" id="modalOtherSection" style="display: none;">
+      <div class="modal-section-title">Other Transactions</div>
+      <div id="modalOtherList" class="tx-list"></div>
+    </div>
+
+    <div class="modal-section">
+      <div class="modal-section-title">Payment History</div>
+      <div id="modalTxList" class="tx-list"></div>
+    </div>
+
+    <div class="modal-section">
+      <div class="modal-section-title">
+        Raw Payments
+        <a href="#" id="rawPaymentsToggle" class="raw-toggle">[show]</a>
+      </div>
+      <div id="modalRawList" class="tx-list" style="display: none;"></div>
+    </div>
+  </div>
+</div>
+
+<script src="/static/js/filters.js" defer></script>
+<script src="/static/js/member-detail.js" defer></script>
+{{end}}

go/internal/web/templates/base.tmpl

@@ -0,0 +1,15 @@
+{{define "base"}}<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>FUJ — {{template "title" .}}</title>
+    <link rel="stylesheet" href="/static/css/app.css">
+</head>
+<body>
+{{template "nav" .}}
+{{template "content" .}}
+{{template "footer" .}}
+</body>
+</html>
+{{end}}

go/internal/web/templates/flush_cache.tmpl

@@ -0,0 +1,5 @@
+{{define "title"}}Flush Cache{{end}}
+{{define "content"}}
+<h1>Flush Cache</h1>
+<p class="description">Coming in M6.6</p>
+{{end}}

go/internal/web/templates/juniors.tmpl

@@ -0,0 +1,169 @@
+{{define "title"}}Juniors{{end}}
+{{define "content"}}
+<h1>Juniors Dashboard</h1>
+
+{{if .Error}}
+<div class="description">Error loading data: {{.Error}}</div>
+{{else}}
+
+<div class="description">
+  Balances calculated by matching Google Sheet payments against attendance fees.<br>
+  Source: <a href="{{.Data.AttendanceURL}}" target="_blank" rel="noopener">Attendance Sheet</a> |
+  <a href="{{.Data.PaymentsURL}}" target="_blank" rel="noopener">Payments Ledger</a>
+</div>
+
+<div class="filter-container" id="filterContainer" data-current-month="{{.Data.CurrentMonth}}" data-page="juniors">
+  <div class="filter-item">
+    <label class="filter-label" for="nameFilter">Member</label>
+    <input id="nameFilter" class="filter-input" type="text" placeholder="Filter by name…">
+  </div>
+  <div class="filter-item">
+    <label class="filter-label" for="fromMonth">From</label>
+    <select id="fromMonth" class="filter-select">
+      <option value="">All</option>
+      {{range $i, $m := .Data.Months}}
+      <option value="{{$i}}">{{$m}}</option>
+      {{end}}
+    </select>
+  </div>
+  <div class="filter-item">
+    <label class="filter-label" for="toMonth">To</label>
+    <select id="toMonth" class="filter-select">
+      <option value="">All</option>
+      {{range $i, $m := .Data.Months}}
+      <option value="{{$i}}">{{$m}}</option>
+      {{end}}
+    </select>
+  </div>
+  <div class="filter-item">
+    <button id="applyFilter" class="filter-select" type="button" style="cursor: pointer;">Apply</button>
+    <button id="clearFilter" class="filter-select" type="button" style="cursor: pointer;">All</button>
+  </div>
+</div>
+
+{{if .Data.Results}}
+<div class="table-container">
+<table>
+  <thead>
+    <tr>
+      <th>Member</th>
+      {{range $i, $m := .Data.Months}}
+      <th data-month-idx="{{$i}}" data-raw-month="{{index $.Data.RawMonths $i}}">{{$m}}</th>
+      {{end}}
+      <th>Balance</th>
+    </tr>
+  </thead>
+  <tbody>
+    {{range $row := .Data.Results}}
+    <tr class="member-row" data-name="{{$row.Name}}">
+      <td class="member-name">{{$row.Name}}<span class="info-icon" data-name="{{$row.Name}}" title="Show details">[i]</span></td>
+      {{range $i, $cell := $row.Months}}
+      <td data-month-idx="{{$i}}" title="{{$cell.Tooltip}}"
+          class="{{if eq $cell.Status "empty"}}cell-empty{{else if and (or (eq $cell.Status "unpaid") (eq $cell.Status "partial")) (ge $cell.RawMonth $.Data.CurrentMonth)}}cell-unpaid-current{{else if or (eq $cell.Status "unpaid") (eq $cell.Status "partial")}}cell-unpaid{{else if eq $cell.Status "ok"}}cell-ok{{end}}{{if $cell.Overridden}} cell-overridden{{end}}">
+        {{$cell.Text}}
+        {{if and (or (eq $cell.Status "unpaid") (eq $cell.Status "partial")) (lt $cell.RawMonth $.Data.CurrentMonth)}}
+        <a class="pay-btn" href="{{qrHref $.Data.BankAccount $cell.Amount $row.Name $cell.RawMonth}}">Pay</a>
+        {{end}}
+      </td>
+      {{end}}
+      <td class="{{if lt $row.Balance 0}}balance-neg{{else if gt $row.Balance 0}}balance-pos{{end}}" style="position: relative;">
+        {{$row.Balance}}
+        {{if gt $row.PayableAmount 0}}
+        <a class="pay-btn" href="{{qrHrefAll $.Data.BankAccount $row.PayableAmount $row.Name $row.RawUnpaidPeriods}}">Pay All</a>
+        {{end}}
+      </td>
+    </tr>
+    {{end}}
+    <tr class="totals-row" style="font-weight: bold; background-color: #111; border-top: 2px solid #333;">
+      <td style="text-align: left; padding: 6px 8px;">TOTAL</td>
+      {{range $i, $t := .Data.Totals}}
+      <td data-month-idx="{{$i}}" data-raw-month="{{index $.Data.RawMonths $i}}" class="{{if eq $t.Status "ok"}}cell-ok{{else if eq $t.Status "unpaid"}}cell-unpaid{{else if eq $t.Status "surplus"}}cell-overridden{{end}}" style="padding-top: 4px; padding-bottom: 4px;">
+        <span style="font-size: 0.6em; font-weight: normal; color: #666; text-transform: lowercase; display: block; margin-bottom: 2px;">received / expected</span>
+        {{$t.Text}}
+      </td>
+      {{end}}
+      <td></td>
+    </tr>
+  </tbody>
+</table>
+</div>
+{{else}}
+<div class="description">No members found.</div>
+{{end}}
+
+{{if .Data.Credits}}
+<h2>Credits (Advance Payments / Surplus)</h2>
+<div class="list-container">
+  {{range .Data.Credits}}
+  <div class="list-item">
+    <span class="list-item-name">{{.Name}}</span>
+    <span class="list-item-val">{{.Amount}} CZK</span>
+  </div>
+  {{end}}
+</div>
+{{end}}
+
+{{if .Data.Debts}}
+<h2>Debts (Missing Payments)</h2>
+<div class="list-container">
+  {{range .Data.Debts}}
+  <div class="list-item">
+    <span class="list-item-name">{{.Name}}</span>
+    <span class="list-item-val" style="color: #ff3333;">{{.Amount}} CZK</span>
+  </div>
+  {{end}}
+</div>
+{{end}}
+
+{{end}}
+
+<div id="memberModal" onclick="if(event.target===this)this.classList.remove('active')">
+  <div class="modal-content">
+    <div class="modal-header">
+      <div class="modal-title" id="modalMemberName">Member Name</div>
+      <div class="close-btn" onclick="document.getElementById('memberModal').classList.remove('active')">[close]</div>
+    </div>
+
+    <div class="modal-section">
+      <div class="modal-section-title">Status Summary</div>
+      <div id="modalTier" style="margin-bottom: 10px; color: #888;">Tier: -</div>
+      <table class="modal-table">
+        <thead><tr>
+          <th>Month</th>
+          <th style="text-align: center;">Att.</th>
+          <th style="text-align: center;">Expected</th>
+          <th style="text-align: center;">Paid</th>
+          <th style="text-align: right;">Status</th>
+        </tr></thead>
+        <tbody id="modalStatusBody"></tbody>
+      </table>
+    </div>
+
+    <div class="modal-section" id="modalExceptionSection" style="display: none;">
+      <div class="modal-section-title">Fee Exceptions</div>
+      <div id="modalExceptionList" class="tx-list"></div>
+    </div>
+
+    <div class="modal-section" id="modalOtherSection" style="display: none;">
+      <div class="modal-section-title">Other Transactions</div>
+      <div id="modalOtherList" class="tx-list"></div>
+    </div>
+
+    <div class="modal-section">
+      <div class="modal-section-title">Payment History</div>
+      <div id="modalTxList" class="tx-list"></div>
+    </div>
+
+    <div class="modal-section">
+      <div class="modal-section-title">
+        Raw Payments
+        <a href="#" id="rawPaymentsToggle" class="raw-toggle">[show]</a>
+      </div>
+      <div id="modalRawList" class="tx-list" style="display: none;"></div>
+    </div>
+  </div>
+</div>
+
+<script src="/static/js/filters.js" defer></script>
+<script src="/static/js/member-detail.js" defer></script>
+{{end}}

go/internal/web/templates/partials/footer.tmpl

@@ -0,0 +1,3 @@
+{{define "footer"}}
+<div class="footer">{{.Build.Version}}@{{.Build.Commit}} | built {{.Build.BuildDate}}</div>
+{{end}}

go/internal/web/templates/partials/nav.tmpl

@@ -0,0 +1,17 @@
+{{define "nav"}}
+<div class="nav">
+    <div>
+        <a href="/adults"{{if eq .Active "adults"}} class="active"{{end}}>[Adults]</a>
+        <a href="/juniors"{{if eq .Active "juniors"}} class="active"{{end}}>[Juniors]</a>
+    </div>
+    <div class="nav-archived">
+        <span style="color: #666; margin-right: 5px;">Archived:</span>
+        <a href="/payments"{{if eq .Active "payments"}} class="active"{{end}}>[Payments Ledger]</a>
+    </div>
+    <div class="nav-archived">
+        <span style="color: #666; margin-right: 5px;">Tools:</span>
+        <a href="/sync-bank"{{if eq .Active "sync"}} class="active"{{end}}>[Sync Bank Data]</a>
+        <a href="/flush-cache"{{if eq .Active "flush"}} class="active"{{end}}>[Flush Cache]</a>
+    </div>
+</div>
+{{end}}

go/internal/web/templates/payments.tmpl

@@ -0,0 +1,38 @@
+{{define "title"}}Payments Ledger{{end}}
+{{define "content"}}
+<h1>Payments Ledger</h1>
+<p class="description">
+    All bank transactions from the
+    <a href="{{.Data.PaymentsURL}}" target="_blank">payments sheet</a>,
+    grouped by member. Names are matched against the
+    <a href="{{.Data.AttendanceURL}}" target="_blank">attendance sheet</a>.
+</p>
+{{if .Error}}<p class="error">{{.Error}}</p>{{end}}
+<div class="ledger-container">
+{{range $person := .Data.SortedPeople}}
+    <div class="member-block">
+        <h2>{{$person}}</h2>
+        <table class="txn-table">
+            <thead>
+                <tr>
+                    <th class="txn-date">Date</th>
+                    <th class="txn-amount">Amount</th>
+                    <th class="txn-purpose">Purpose</th>
+                    <th class="txn-message">Bank Message</th>
+                </tr>
+            </thead>
+            <tbody>
+            {{range $tx := index $.Data.GroupedPayments $person}}
+                <tr>
+                    <td class="txn-date">{{$tx.Date}}</td>
+                    <td class="txn-amount">{{printf "%.0f" $tx.Amount}} CZK</td>
+                    <td class="txn-purpose">{{$tx.Purpose}}</td>
+                    <td class="txn-message">{{$tx.Message}}</td>
+                </tr>
+            {{end}}
+            </tbody>
+        </table>
+    </div>
+{{end}}
+</div>
+{{end}}

go/internal/web/templates/sync.tmpl

@@ -0,0 +1,5 @@
+{{define "title"}}Sync Bank Data{{end}}
+{{define "content"}}
+<h1>Sync Bank Data</h1>
+<p class="description">Coming in M6.6</p>
+{{end}}

scripts/attendance.py

@@ -30,8 +30,7 @@ JUNIOR_MONTHLY_RATE = {
     "2026-03": 250   # reduced fee for March 2026
 }
 ADULT_MERGED_MONTHS = {
-    #"2025-12": "2026-01",   # keys are merged into values
+    "2025-09": "2025-10",   # keys are merged into values
-    #"2025-09": "2025-10"
 }
 
 JUNIOR_MERGED_MONTHS = {

scripts/match_payments.py

@@ -255,16 +255,25 @@ def fetch_sheet_data(spreadsheet_id: str, credentials_path: str) -> list[dict]:
                 return str(int(v))
             return str(v)
 
+        def get_float(idx):
+            v = get_val(idx)
+            if isinstance(v, (int, float)):
+                return float(v)
+            try:
+                return float(str(v).strip())
+            except (ValueError, TypeError):
+                return 0.0
+
         tx = {
             "date": format_date(get_val(idx_date)),
-            "amount": get_val(idx_amount),
+            "amount": get_float(idx_amount),
             "manual_fix": get_val(idx_manual),
             "person": get_val(idx_person),
             "purpose": get_val(idx_purpose),
             "inferred_amount": get_val(idx_inferred_amount),
             "sender": get_val(idx_sender),
             "vs": get_str(idx_vs),
-            "message": get_val(idx_message),
+            "message": get_str(idx_message),
             "bank_id": get_val(idx_bank_id),
             "sync_id": get_val(idx_sync_id),
         }

scripts/views.py

@@ -310,8 +310,9 @@ def build_juniors_view_model(
             cell_text = "-"
             amount_to_pay = 0
 
-            if expected == "?" or (isinstance(expected, int) and expected > 0):
+            is_unknown = original_expected == "?"
-                if expected == "?":
+            if is_unknown or (isinstance(expected, int) and expected > 0):
+                if is_unknown:
                     status = "empty"
                     cell_text = f"?{count_str}"
                 elif paid >= expected:
@@ -339,7 +340,7 @@ def build_juniors_view_model(
                 status = "surplus"
                 cell_text = f"PAID {paid}"
 
-            if (isinstance(expected, int) and expected > 0) or paid > 0:
+            if (not is_unknown and isinstance(expected, int) and expected > 0) or paid > 0:
                 tooltip = f"Received: {paid}, Expected: {expected}"
             else:
                 tooltip = ""

templates/adults.html

@@ -1044,8 +1044,6 @@
                 }
             });
 
-            var defaultFrom = Math.max(0, maxMonthIdx - 4);
-            fromSelect.value = defaultFrom;
             toSelect.value = maxMonthIdx;
             applyMonthFilter();
         })();

templates/juniors.html

@@ -1025,8 +1025,6 @@
                 }
             });
 
-            var defaultFrom = Math.max(0, maxMonthIdx - 4);
-            fromSelect.value = defaultFrom;
             toSelect.value = maxMonthIdx;
             applyMonthFilter();
         })();