new paste tab: rework number box submenus (#157)

Give the custom expiry and readable N times submenus a shared boxed
container with proper padding, indent them under their parent option,
and style the number inputs and unit select with palette vars, the
existing radius scale, and the select chevron. No em dashes, no hard
coded colors in new rules.

LICENSE

@@ -1,4 +1,4 @@
-Palette - self-hosted pastebin
+Palette - self-hosted pastebin with paste cans
 Copyright (C) 2026 poslop
 
 This program is free software: you can redistribute it and/or modify

README.md

@@ -1,7 +1,7 @@
 # Palette
 
 Palette is a fast, self-hosted pastebin. One Go binary, a SQLite database, and
-a web UI for sharing text and small files.
+a web UI for sharing text and small files
 
 > [!NOTE]
 > <table><tr><td>
@@ -10,27 +10,22 @@ a web UI for sharing text and small files.
 
 ## Features
 
-- Text pastes
+- Multiple files in one paste
-- File attachments (one file per paste, up to 25 MB)
 - Password protected pastes
-- Expire after a specified time
+- Expir after a specified time
 - Burn after a number of views
 - Custom URLs
 - Syntax highlighting with language auto-detection (go-enry)
-- Public paste listing with search, sort and pagination
+- Local cookie based submission history
-- Cookie based saved pastes and settings
+- Cookie based settings
-- Five base themes (midnight, smooth, pastel-lavender, pastel-peach, pastel-cloud), each with a dark and light variant
+- Themes!
-- Dark mode toggle in the topbar and settings, with a configurable default
-- Polished code viewer: line-number gutter sized to the widest number and pinned during horizontal scroll, optional line wrap, jump-to-top/bottom buttons, and theme-aware scrollbars
 
 ## Screenshots
 
 | | |
 |---|---|
-| ![Editor in midnight (dark)](https://git.archfox.org/poslop/palette/wiki/raw/palette-previews%2Fdesktop-editor-new.png) | ![Paste view in pastel-peach (light)](https://git.archfox.org/poslop/palette/wiki/raw/palette-previews%2Fdesktop-paste-pastel-peach-light.png) |
+| ![Editor in midnight](https://git.archfox.org/poslop/palette/wiki/raw/palette-previews%2Fmidnight-new.png) | ![Paste view in pastel-peach](https://git.archfox.org/poslop/palette/wiki/raw/palette-previews%2Fpastel-peach-paste.png) |
-| ![Public pastes list](https://git.archfox.org/poslop/palette/wiki/raw/palette-previews%2Fdesktop-public.png) | ![Settings and theme picker](https://git.archfox.org/poslop/palette/wiki/raw/palette-previews%2Fdesktop-settings-themes.png) |
+| ![History in pastel-lavender](https://git.archfox.org/poslop/palette/wiki/raw/palette-previews%2Fpastel-lavender-history.png) | ![Saved in pastel-cloud](https://git.archfox.org/poslop/palette/wiki/raw/palette-previews%2Fpastel-cloud-mine.png) |
-
-
 
 ## Get Started
 
@@ -66,13 +61,12 @@ go build -o palette ./cmd/palette
 | `PALETTE_ADDR` | `:8080` | Listen address |
 | `PALETTE_DB` | `palette.db` | SQLite database path |
 | `PALETTE_MAX_TEXT` | `5242880` | Max paste size in bytes (5 MB) |
-| `PALETTE_MAX_ITEM` | `26214400` | Max file attachment / multipart size in bytes (25 MB) |
+| `PALETTE_MAX_ITEM` | `26214400` | Max can item size in bytes (25 MB) |
 | `PALETTE_ADMIN_KEY` | generated | Admin key; if unset a 32-char hex key is generated and persisted to `<db-dir>/admin-key` (0600) |
 | `PALETTE_DEFAULT_DARK` | dark on | Default dark mode for new visitors. Set `false`, `0`, or `off` to default to light mode. Visitors who toggle dark mode keep their choice in their browser. |
-| `PALETTE_UNLOCK_SECRET` | random per start | HMAC secret for password-unlock cookies. Set a fixed value to keep unlock sessions across restarts or across replicas. |
 
 An `/admin` page exists for runtime settings, protected by a key set at
-install (`PALETTE_ADMIN_KEY` env var) and resettable locally. See
+install (`PALETTE_ADMIN_KEY` env var) and resettable locally — see
 [API](https://git.archfox.org/poslop/palette/wiki/API) and the [design docs](https://git.archfox.org/poslop/palette/wiki/Home) in the wiki for details.
 
 ## API
@@ -101,4 +95,4 @@ data loss, or legal issues arising from use of the software. You use it
 at your own risk.
 
 If you run a modified version of Palette as a network service, the AGPL
-requires you to offer your modified source code to its users.
+requires you to offer your modified source code to its users.

docker-compose.yml

@@ -32,16 +32,10 @@ services:
       # Default: 5242880 (5 MiB).
       # PALETTE_MAX_TEXT: "5242880"
 
-      # Max size in bytes for multipart request parsing (paste file
+      # Max size in bytes of a single can item (file/text inside a can).
-      # attachments are capped at 25 MB).
       # Default: 26214400 (25 MiB).
       # PALETTE_MAX_ITEM: "26214400"
 
-      # Default dark mode for new visitors. Unset = dark on; set to "false",
-      # "0" or "off" to default to light mode. Visitors who toggle dark mode
-      # keep their choice in their browser.
-      # PALETTE_DEFAULT_DARK: "false"
-
       # HMAC secret for password-unlock cookies. Default: random per start,
       # which logs out every unlocked browser session on restart. Set a fixed
       # secret (any random string) to keep unlock sessions across restarts,

docs/api.md

@@ -1,256 +0,0 @@
-# Palette API
-
-Palette's REST API lives under `/api` on the same port that serves the web UI. All request and response bodies are JSON unless noted otherwise. This document describes the API as implemented in `internal/api`.
-
-## Overview
-
-### Base URL
-
-The server listens on the address set by `PALETTE_ADDR` (default `:8080`). In production palette runs behind a reverse proxy, so API URLs are relative to the site root, for example:
-
-```
-https://paste.example.com/api/pastes
-```
-
-The examples below use `http://localhost:8080` as a placeholder.
-
-### Authentication
-
-There is no user account system. Access control works through three mechanisms:
-
-- Viewer cookie. Every request gets an anonymous, random viewer id in an HttpOnly `vwr` cookie. This cookie identifies the browser that created a paste, and authorizes browser-scoped actions such as `GET /api/mine` and creator-only deletion.
-- Deletion token. Creating a paste returns a one-time `deletion_token`. Sending it in the `Authorization` header (Bearer or Token prefix, or the bare value) authorizes deletion of that paste. The token is deliberately not accepted as a URL query parameter, because query strings leak into access logs and browser history.
-- Admin key. The admin settings endpoints require an install-time key sent in the `X-Admin-Key` header. The key comes from `PALETTE_ADMIN_KEY` or is generated and persisted server-side at first start.
-
-Password-protected pastes are unlocked with the `X-Paste-Password` request header (or the browser unlock flow on the web pages). Password checks are rate limited per IP and per paste.
-
-### Rate limiting
-
-Rate limits are token buckets keyed by client IP (the rightmost `X-Forwarded-For` entry, then `X-Real-Ip`, then the remote address). Current limits:
-
-| Scope | Limit | Refill |
-|---|---|---|
-| Paste create | 5 burst (admin tunable) | 60 per minute (admin tunable) |
-| Language guess | 5 burst | 1 per second |
-| Password unlock | 5 burst, per IP and paste | 5 per minute |
-| Admin key check | 5 burst, per IP | 5 per minute |
-
-Exceeding a limit returns `429` with a `Retry-After` header and the error code `rate_limited`. Create and guess responses include `X-RateLimit-Limit` and `X-RateLimit-Burst` headers.
-
-### Size limits
-
-- Paste content: `PALETTE_MAX_TEXT` (default 5 MB), admin tunable. Larger content is rejected with `413`.
-- Attached files: 25 MB per file, one file per paste.
-- The request body itself is capped server side; oversized bodies fail with `413` before handlers run.
-
-### Error format
-
-Errors are JSON with a human-readable `error` message and, for create/validation failures, a machine-readable `code`:
-
-```json
-{"error": "slug already taken", "code": "slug_taken"}
-```
-
-Known codes: `content_empty`, `content_too_large`, `slug_invalid`, `slug_taken`, `slug_reserved`, `expiry_invalid`, `invalid_visibility`, `one_file_only`, `file_too_large`, `rate_limited`, `invalid_request`. Unknown codes should be treated as a generic failure.
-
-## Endpoint reference
-
-### Pastes
-
-#### POST /api/pastes
-
-Create a paste. Rate limited.
-
-Two body formats:
-
-1. `application/json` with these fields:
-
-| Field | Type | Notes |
-|---|---|---|
-| `content` | string | required; non-whitespace; up to the content cap |
-| `title` | string | optional, trimmed, truncated to 200 chars |
-| `language` | string | optional, max 40 chars, `^[a-zA-Z0-9+#-]{1,40}$` |
-| `custom_slug` | string | optional custom URL slug |
-| `password` | string | optional; hash stored server side |
-| `expires_in` | string | Go duration (`90m`, `6h`, `168h`); 1 minute to 1 year |
-| `burn_after_read` | bool | convenience for a single-read budget |
-| `burn_after_reads` | int | number of reads the paste survives (min 1) |
-| `visibility` | string | `public` or `unlisted`; default `public` |
-| `public` | bool | alias for `visibility`; takes precedence when both are sent |
-
-2. `multipart/form-data` with the same fields as form values plus a `file` part. A paste is either text or one file; if both are sent the file wins and the text is ignored. The MIME type is sniffed from the file content, never from client headers.
-
-If the admin has set a default expiry, pastes created without `expires_in` inherit it.
-
-Response `201`:
-
-```json
-{
-  "id": "ab12cd34",
-  "deletion_token": "one-time token",
-  "url": "/ab12cd34",
-  "raw_url": "/raw/ab12cd34",
-  "api_url": "/api/pastes/ab12cd34",
-  "expires_at": 1735689600,
-  "created_at": 1735603200,
-  "rate_limit": {"create_per_sec": 1, "burst": 5}
-}
-```
-
-With a multipart file, an extra `attachment` object is returned: `id`, `filename`, `mime`, `size`, `sha256`, `url` (`/f/{aid}/{filename}`).
-
-The deletion token is also set as a short-lived `tok_{id}` cookie for the creating browser.
-
-Errors: `400` invalid JSON or validation (codes `content_empty`, `slug_invalid`, `slug_taken`, `slug_reserved`, `expiry_invalid`, `one_file_only`), `413` (`content_too_large`, `file_too_large`), `429` rate limited.
-
-#### GET /api/pastes/{id}
-
-Fetch a paste's JSON representation. For password-protected pastes send `X-Paste-Password`; wrong or missing passwords return `401` and count against the unlock rate limit.
-
-Response `200`: `id`, `content`, `content_type`, `language`, `title`, `created_at`, `view_count`, `visibility`, and `reads_remaining` (number or `null` when no read budget is set).
-
-Errors: `404` not found, expired, or burned out; `401` password required; `429` too many unlock attempts.
-
-#### DELETE /api/pastes/{id}
-
-Soft delete a paste. Requires either the deletion token in the `Authorization` header or the creating browser's `vwr` cookie.
-
-Response `200`: `{"status": "soft-deleted"}`.
-
-Errors: `403` deletion token required, `404` not found.
-
-#### DELETE /api/pastes/{id}/redeem
-
-Hard delete immediately using the one-time deletion token in the `Authorization` header. The paste row is removed entirely instead of waiting for the sweeper.
-
-Response `200`: `{"status": "deleted"}`.
-
-Errors: `400` token required, `403` invalid token, `404` not found.
-
-#### GET /api/mine
-
-List pastes created from this browser, via the `vwr` cookie. Query parameters: `limit` (default 50, max 100), `offset`.
-
-Response `200`: `{"total": n, "limit": l, "offset": o, "items": [...]}` with each item carrying `id`, `title`, `language`, `created_at`, `view_count`, `size`, `custom_slug`, `visibility`.
-
-#### GET /api/public
-
-List public pastes. Query parameters: `limit` (default 25, max 100), `offset`. Same shape as `/api/mine`; items include `custom_slug`.
-
-### Files and raw content
-
-#### GET /raw/{id}
-
-Paste content served verbatim. Content types outside a safe fixed set (plain text, markdown, JSON, PDF, common images, octet-stream) are served as `text/plain` with `nosniff`. Raw reads count against a burn-after-read budget, with the same per-viewer dedupe window as page views (15 minutes by default, admin tunable). Password-protected pastes are not available raw (`401`).
-
-Errors: `401` password required, `404` not found, expired, or burned.
-
-#### GET /f/{aid}/{filename}
-
-Download a file attachment. The filename path segment is decorative; lookups key on the attachment id. Files are served with the server-sniffed MIME type, `nosniff`, and a safe `Content-Disposition`; only images and PDFs render inline, everything else downloads. Attachments inherit the paste lifecycle: expired or burned pastes make their attachments disappear.
-
-Errors: `404` attachment or paste not found.
-
-### Language detection
-
-#### POST /api/guess-language
-
-Body: `{"content": "package main"}`. Rate limited like create.
-
-Response `200`: `{"language": "go"}`. The result is a best-effort guess and may be `""`.
-
-Errors: `400` invalid JSON body, `429` rate limited.
-
-### Admin
-
-#### GET /admin/api/settings and POST /admin/api/settings
-
-Read or update runtime settings. Requires the `X-Admin-Key` header; wrong keys return `401` and all admin key checks are rate limited to 5 per minute per IP. The admin key is never accepted as a query parameter.
-
-Settings object (POST accepts the full object and persists it):
-
-| Field | Default | Meaning |
-|---|---|---|
-| `rate_limit_burst` | 5 | paste-create token bucket burst |
-| `rate_limit_per_minute` | 60 | paste-create refill rate |
-| `max_content_bytes` | 5242880 | paste content cap |
-| `default_expiry` | `""` | expiry applied to pastes created without one |
-| `custom_slug_reservation_days` | 30 | how long a released slug stays reserved |
-| `burn_viewer_window_minutes` | 15 | per-viewer dedupe window for burn reads |
-
-Errors: `400` invalid JSON or validation (all numeric settings must be positive, `default_expiry` must be a duration between 1 minute and 1 year or empty), `401` unauthorized, `429` rate limited.
-
-## Examples
-
-Create a text paste:
-
-```bash
-curl -X POST http://localhost:8080/api/pastes \
-  -H "Content-Type: application/json" \
-  -d '{
-    "content": "print(hello)",
-    "title": "my snippet",
-    "language": "python",
-    "expires_in": "168h",
-    "visibility": "public"
-  }'
-```
-
-Response:
-
-```json
-{
-  "id": "ab12cd34",
-  "deletion_token": "TOKEN",
-  "url": "/ab12cd34",
-  "raw_url": "/raw/ab12cd34",
-  "api_url": "/api/pastes/ab12cd34",
-  "expires_at": 1735689600,
-  "created_at": 1735603200,
-  "rate_limit": {"create_per_sec": 1, "burst": 5}
-}
-```
-
-Save the `deletion_token`; it is shown once and authorizes deletion.
-
-Create a file paste:
-
-```bash
-curl -X POST http://localhost:8080/api/pastes \
-  -F "title=quarterly report" \
-  -F "file=@report.pdf"
-```
-
-Fetch a paste:
-
-```bash
-curl http://localhost:8080/api/pastes/ab12cd34
-
-# password-protected paste (header only; query parameters are not accepted):
-curl -H "X-Paste-Password: secret" http://localhost:8080/api/pastes/ab12cd34
-```
-
-Fetch raw content:
-
-```bash
-curl http://localhost:8080/raw/ab12cd34
-```
-
-Soft delete (paste becomes unavailable but is recoverable during the grace period):
-
-```bash
-curl -X DELETE -H "Authorization: Bearer TOKEN" http://localhost:8080/api/pastes/ab12cd34
-```
-
-Hard delete immediately (row removed):
-
-```bash
-curl -X DELETE -H "Authorization: Bearer TOKEN" http://localhost:8080/api/pastes/ab12cd34/redeem
-```
-
-## Deletion and expiry behavior
-
-- Expired pastes are soft-deleted by a background sweeper that runs every minute.
-- Soft-deleted pastes are hard-deleted after a 7-day grace period.
-- The deletion token allows immediate hard delete via the redeem endpoint.
-- Burn-after-read pastes are soft-deleted once the read budget is exhausted. A read is counted once per unique viewer within the dedupe window (15 minutes by default); the same viewer returning inside the window does not consume another read.

internal/api/attachments_test.go

@@ -306,64 +306,3 @@ func TestMultipartPasswordFieldAccepted(t *testing.T) {
 		t.Fatalf("paste should require password, got %d", rec2.Code)
 	}
 }
-
-// #281: /raw/{id} must stream the attachment blob for ALL attachment mimes,
-// not just raster images (the old isImageMime gate left non-image
-// attachments serving an empty body from row.Content).
-func TestRawStreamsNonImageAttachment(t *testing.T) {
-	s := testServer(t)
-	h := s.routes()
-
-	body := []byte("hello, this is a plain text attachment body")
-	rec, resp := multipartCreate(t, h, "notes.txt", body, nil)
-	if rec.Code != 201 {
-		t.Fatalf("create: %d %s", rec.Code, rec.Body.String())
-	}
-	if resp["attachment"] == nil {
-		t.Fatalf("no attachment in response: %v", resp)
-	}
-	id, _ := resp["id"].(string)
-
-	req := httptest.NewRequest("GET", "/raw/"+id, nil)
-	rec2 := httptest.NewRecorder()
-	h.ServeHTTP(rec2, req)
-	if rec2.Code != 200 {
-		t.Fatalf("raw: %d %s", rec2.Code, rec2.Body.String())
-	}
-	if got := rec2.Header().Get("Content-Type"); got != "text/plain; charset=utf-8" {
-		t.Fatalf("Content-Type = %q", got)
-	}
-	if got := rec2.Header().Get("X-Content-Type-Options"); got != "nosniff" {
-		t.Fatalf("nosniff = %q", got)
-	}
-	if !bytes.Equal(rec2.Body.Bytes(), body) {
-		t.Fatalf("raw bytes differ: got %d bytes want %d", rec2.Body.Len(), len(body))
-	}
-}
-
-// #281: active-content attachment types still get forced to text/plain on
-// /raw, same rule as the /f/ serving path (#34).
-func TestRawHtmlAttachmentServesAsPlainText(t *testing.T) {
-	s := testServer(t)
-	h := s.routes()
-
-	html := []byte("<html><body><script>alert(1)</script></body></html>")
-	rec, resp := multipartCreate(t, h, "page.html", html, nil)
-	if rec.Code != 201 {
-		t.Fatalf("create: %d %s", rec.Code, rec.Body.String())
-	}
-	id, _ := resp["id"].(string)
-
-	req := httptest.NewRequest("GET", "/raw/"+id, nil)
-	rec2 := httptest.NewRecorder()
-	h.ServeHTTP(rec2, req)
-	if rec2.Code != 200 {
-		t.Fatalf("raw: %d %s", rec2.Code, rec2.Body.String())
-	}
-	if got := rec2.Header().Get("Content-Type"); got != "text/plain; charset=utf-8" {
-		t.Fatalf("Content-Type = %q", got)
-	}
-	if !bytes.Equal(rec2.Body.Bytes(), html) {
-		t.Fatal("raw bytes differ from upload")
-	}
-}

internal/api/cans.go

@@ -0,0 +1,273 @@
+package api
+
+import (
+	"encoding/json"
+	"fmt"
+	"io"
+	"net/http"
+	"palette/internal/store"
+	"strings"
+	"time"
+
+	"github.com/go-chi/chi/v5"
+
+	"palette/internal/web"
+)
+
+// CreateCan makes a can with N items (multipart form).
+// Fields: title, description, visibility, expires_in, password, files (one or more), or json_items for text items.
+func (a *apiServer) handleCreateCan(w http.ResponseWriter, r *http.Request) {
+	if err := r.ParseMultipartForm(a.cfg.MaxItemBytes); err != nil {
+		writeErr(w, 400, "multipart form required")
+		return
+	}
+
+	title := r.FormValue("title")
+	visibility := r.FormValue("visibility")
+	if visibility == "" {
+		visibility = "public"
+	}
+	if visibility != "public" && visibility != "unlisted" {
+		writeErrCode(w, 400, "invalid_visibility", "visibility must be public or unlisted")
+		return
+	}
+	expiresIn := r.FormValue("expires_in")
+	password := r.FormValue("password")
+	customSlug := r.FormValue("custom_slug")
+
+	var expiresAt *int64
+	now := time.Now().Unix()
+	if expiresIn != "" {
+		d, err := time.ParseDuration(expiresIn)
+		if err != nil {
+			writeErrCode(w, 400, "expiry_invalid", "invalid expires_in")
+			return
+		}
+		// #60/#48: clamp at the API boundary like the pastes API does -
+		// reject zero/negative and durations past the 1-year UI cap.
+		if !store.ValidExpiry(d) {
+			writeErrCode(w, 400, "expiry_invalid", "expires_in must be between 1 minute and 1 year")
+			return
+		}
+		t := now + int64(d.Seconds())
+		expiresAt = &t
+	}
+	var pwHash *string
+	if password != "" {
+		h, err := store.Argon2IDHash(password)
+		if err != nil {
+			writeErr(w, 500, "hash error")
+			return
+		}
+		pwHash = &h
+	}
+
+	canID := store.GenSlug(8)
+	var slugPtr *string
+	if customSlug != "" {
+		slugPtr = &customSlug
+	}
+	err := a.store.CreateCan(canID, title, r.FormValue("description"), visibility, pwHash, now, expiresAt, slugPtr)
+	if err != nil {
+		switch err {
+		case store.ErrSlugTaken, store.ErrInvalidSlug, store.ErrReservedSlug:
+			writeErrCode(w, 409, createErrCode(err), err.Error())
+		default:
+			writeErr(w, 500, "db error")
+		}
+		return
+	}
+	if slugPtr != nil {
+		canID = customSlug // #4: custom slug becomes the can id
+	}
+	// #4: remember the creating browser so /mine and viewer-scoped delete work
+	a.store.Exec(`UPDATE paste_cans SET viewer_id=? WHERE id=?`, currentViewerID(r), canID)
+
+	// text items passed as JSON array: [{"title":"notes.txt","content":"..."}]
+	itemCount := 0
+	if itemsJSON := r.FormValue("json_items"); itemsJSON != "" {
+		var items []map[string]string
+		if err := json.Unmarshal([]byte(itemsJSON), &items); err != nil {
+			writeErr(w, 400, "invalid json_items")
+			return
+		}
+		for _, it := range items {
+			content := it["content"]
+			if int64(len(content)) > a.cfg.MaxItemBytes {
+				writeErr(w, 413, fmt.Sprintf("item %q exceeds max", it["title"]))
+				return
+			}
+			lang := it["language"]
+			if err := a.store.InsertCanItem(canID, it["title"], content, "text/plain", &lang, nil, nil, now); err != nil {
+				writeErr(w, 500, "db error")
+				return
+			}
+			itemCount++
+		}
+	}
+
+	// uploaded files
+	if r.MultipartForm != nil {
+		for _, headers := range r.MultipartForm.File {
+			for _, fh := range headers {
+				f, err := fh.Open()
+				if err != nil {
+					writeErr(w, 400, "cannot read uploaded file")
+					return
+				}
+				content, err := io.ReadAll(f)
+				f.Close()
+				if err != nil {
+					writeErr(w, 400, "cannot read uploaded file")
+					return
+				}
+				if int64(len(content)) > a.cfg.MaxItemBytes {
+					writeErr(w, 413, fmt.Sprintf("file %q exceeds max %d bytes", fh.Filename, a.cfg.MaxItemBytes))
+					return
+				}
+				contentStr := string(content)
+				if err := a.store.InsertCanItem(canID, fh.Filename, contentStr, detectContentType(fh.Filename, content), nil, nil, &contentStr, now); err != nil {
+					writeErr(w, 500, "db error")
+					return
+				}
+				itemCount++
+			}
+		}
+	}
+
+	if itemCount == 0 {
+		a.store.DeleteCan(canID)
+		writeErrCode(w, 400, "content_empty", "can needs at least one item (files or json_items)")
+		return
+	}
+
+	writeJSON(w, 201, map[string]any{
+		"id": canID, "url": "/can/" + canID, "items": itemCount,
+	})
+}
+
+// handleDeleteCan soft-deletes a can (parity with paste deletion, #63):
+// requires the vwr viewer cookie matching the can's viewer (cans carry no
+// deletion token since they are built in the browser).
+func (a *apiServer) handleDeleteCan(w http.ResponseWriter, r *http.Request) {
+	id := chi.URLParam(r, "id")
+	can, err := a.store.GetCan(id)
+	if err != nil || can == nil {
+		writeErr(w, 404, "can not found")
+		return
+	}
+	vid := currentViewerID(r)
+	if !(vid != "" && viewerSentCookie(r) && can.ViewerID.Valid &&
+		can.ViewerID.String != "" && can.ViewerID.String == vid) {
+		writeErr(w, 403, "deletion not authorized")
+		return
+	}
+	if _, err := a.store.SoftDeleteCan(can.ID); err != nil {
+		writeErr(w, 500, "db error")
+		return
+	}
+	writeJSON(w, 200, map[string]string{"status": "soft-deleted"})
+}
+
+func detectContentType(name string, content []byte) string {
+	lower := strings.ToLower(name)
+	switch {
+	case strings.HasSuffix(lower, ".png"):
+		return "image/png"
+	case strings.HasSuffix(lower, ".jpg"), strings.HasSuffix(lower, ".jpeg"):
+		return "image/jpeg"
+	case strings.HasSuffix(lower, ".gif"):
+		return "image/gif"
+	case strings.HasSuffix(lower, ".webp"):
+		return "image/webp"
+	case strings.HasSuffix(lower, ".pdf"):
+		return "application/pdf"
+	}
+	if len(content) > 8 && content[0] == 0x89 && content[1] == 'P' {
+		return "image/png"
+	}
+	return "text/plain"
+}
+
+func (a *apiServer) handleGetCan(w http.ResponseWriter, r *http.Request) {
+	id := chi.URLParam(r, "id")
+	can, err := a.store.GetCan(id)
+	if err != nil {
+		writeErr(w, 500, "db error")
+		return
+	}
+	if can == nil {
+		writeErr(w, 404, "can not found")
+		return
+	}
+	if can.ExpiresAt.Valid && can.ExpiresAt.Int64 < time.Now().Unix() {
+		writeErr(w, 404, "can expired")
+		return
+	}
+	if can.PasswordHash.Valid {
+		pw := r.Header.Get("X-Paste-Password")
+		if pw == "" || !store.CheckPassword(can.PasswordHash.String, pw) {
+			writeErr(w, 401, "password required")
+			return
+		}
+	}
+	items, err := a.store.ListCanItems(can.ID)
+	if err != nil {
+		writeErr(w, 500, "db error")
+		return
+	}
+	type itemMeta struct {
+		ID          string  `json:"id"`
+		Title       *string `json:"title"`
+		ContentType string  `json:"content_type"`
+		Size        int     `json:"size"`
+		URL         string  `json:"url"`
+	}
+	metas := make([]itemMeta, 0, len(items))
+	for _, it := range items {
+		metas = append(metas, itemMeta{
+			ID: it.ID, Title: store.NullStrPtr(it.Title), ContentType: it.ContentType,
+			Size: len(it.Content), URL: "/api/pastes/" + it.ID,
+		})
+	}
+	writeJSON(w, 200, map[string]any{
+		"id": can.ID, "title": store.NullStrPtr(can.Title), "visibility": can.Visibility,
+		"created_at": can.CreatedAt, "items": metas,
+	})
+}
+
+func (a *apiServer) handleCanItem(w http.ResponseWriter, r *http.Request) {
+	id := chi.URLParam(r, "item")
+	row, err := a.store.GetPaste(id)
+	if err != nil || row == nil {
+		writeErr(w, 404, "item not found")
+		return
+	}
+	// must belong to a can
+	if !row.CanID.Valid {
+		writeErr(w, 404, "not a can item")
+		return
+	}
+	// inherit can password protection: password via header/query, or the
+	// same pw_<can> unlock cookie the can page sets (#4 cookie parity).
+	can, _ := a.store.GetCan(row.CanID.String)
+	if can != nil && can.PasswordHash.Valid {
+		pw := r.Header.Get("X-Paste-Password")
+		if pw == "" || !store.CheckPassword(can.PasswordHash.String, pw) {
+			// fall back to the browser's unlock cookie for this can
+			c, cerr := r.Cookie("pw_" + can.ID)
+			if cerr != nil || c.Value != web.UnlockToken(can.ID) {
+				writeErr(w, 401, "password required")
+				return
+			}
+		}
+	}
+	// #34: same content-type guard as /raw — never serve active content types.
+	ct := row.ContentType
+	if !safeRawContentType(ct) {
+		ct = "text/plain; charset=utf-8"
+	}
+	w.Header().Set("Content-Type", ct)
+	w.Header().Set("X-Content-Type-Options", "nosniff")
+	w.Write([]byte(row.Content))
+}

internal/api/cans_expiry_test.go

@@ -0,0 +1,45 @@
+package api
+
+import (
+	"net/http/httptest"
+	"testing"
+)
+
+// #60: the cans API must clamp expires_in at the boundary exactly like the
+// pastes API — reject zero/negative durations and anything over the 1-year
+// UI cap, accept the exact boundaries.
+func TestCreateCanExpiryBounds(t *testing.T) {
+	s := testServer(t)
+	h := s.routes()
+
+	cases := []struct {
+		expiresIn string
+		wantCode  int
+	}{
+		{"-1h", 400},    // negative
+		{"-0s", 400},    // negative zero
+		{"0s", 400},     // zero
+		{"1ns", 400},    // positive but below the 1-minute floor
+		{"59s", 400},    // just under the floor
+		{"1m", 201},     // exactly the floor
+		{"90s", 201},    // just over the floor
+		{"8760h", 201},  // exactly 1 year
+		{"8785h", 400},  // 1 year + 1 day: over the cap
+		{"87600h", 400}, // 10 years, the originally reported case
+	}
+	for _, c := range cases {
+		globalLimiter = newLimiter() // avoid create rate limit between cases
+		body, ct := multipartBody(t, map[string]string{
+			"json_items": `[{"title":"a.txt","content":"AAA"}]`,
+			"expires_in": c.expiresIn,
+		}, "files", "pic.txt", "file data")
+		req := httptest.NewRequest("POST", "/api/pastes/can", body)
+		req.Header.Set("Content-Type", ct)
+		rec := httptest.NewRecorder()
+		h.ServeHTTP(rec, req)
+		if rec.Code != c.wantCode {
+			t.Errorf("expires_in %q: got %d want %d (%s)",
+				c.expiresIn, rec.Code, c.wantCode, rec.Body.String())
+		}
+	}
+}

internal/api/cans_flow_test.go

@@ -0,0 +1,414 @@
+package api
+
+import (
+	"encoding/json"
+	"net/http"
+	"net/http/httptest"
+	"strings"
+	"testing"
+
+	"palette/internal/store"
+)
+
+// #4: cans appear in /api/public as normal rows with is_can=true.
+func TestCanInPublicListing(t *testing.T) {
+	s := testServer(t)
+	h := s.routes()
+
+	// a can and a regular paste
+	body, ct := multipartBody(t, map[string]string{
+		"title":      "Listed can",
+		"json_items": `[{"title":"a.txt","content":"AAA"}]`,
+	}, "", "", "")
+	req := httptest.NewRequest("POST", "/api/pastes/can", body)
+	req.Header.Set("Content-Type", ct)
+	rec := httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	if rec.Code != 201 {
+		t.Fatalf("create can: %d %s", rec.Code, rec.Body.String())
+	}
+	var created struct{ ID string `json:"id"` }
+	json.Unmarshal(rec.Body.Bytes(), &created)
+
+	req = httptest.NewRequest("POST", "/api/pastes", strings.NewReader(`{"content":"plain"}`))
+	rec = httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+
+	req = httptest.NewRequest("GET", "/api/public", nil)
+	rec = httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	if rec.Code != 200 {
+		t.Fatalf("public: %d", rec.Code)
+	}
+	var got struct {
+		Total int `json:"total"`
+		Items []struct {
+			ID    string `json:"id"`
+			IsCan bool   `json:"is_can"`
+			Title any    `json:"title"`
+		} `json:"items"`
+	}
+	json.Unmarshal(rec.Body.Bytes(), &got)
+	if got.Total != 2 {
+		t.Fatalf("expected total 2 (can + paste), got %d", got.Total)
+	}
+	foundCan := false
+	for _, it := range got.Items {
+		if it.ID == created.ID {
+			if !it.IsCan {
+				t.Fatalf("can row missing is_can flag")
+			}
+			foundCan = true
+		} else if it.IsCan {
+			t.Fatalf("plain paste flagged as can")
+		}
+	}
+	if !foundCan {
+		t.Fatalf("can not present in /api/public")
+	}
+
+	// #4: unlisted can must not be listed
+	body2, ct2 := multipartBody(t, map[string]string{
+		"title":       "Hidden can",
+		"visibility":  "unlisted",
+		"json_items":  `[{"title":"b.txt","content":"BBB"}]`,
+	}, "", "", "")
+	req = httptest.NewRequest("POST", "/api/pastes/can", body2)
+	req.Header.Set("Content-Type", ct2)
+	rec = httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	if rec.Code != 201 {
+		t.Fatalf("unlisted can create: %d", rec.Code)
+	}
+	req = httptest.NewRequest("GET", "/api/public", nil)
+	rec = httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	if strings.Contains(rec.Body.String(), "Hidden can") {
+		t.Fatalf("unlisted can leaked into /api/public")
+	}
+}
+
+// #4: custom slug support for cans + conflict with existing paste slug.
+func TestCanCustomSlug(t *testing.T) {
+	s := testServer(t)
+	h := s.routes()
+
+	body, ct := multipartBody(t, map[string]string{
+		"title":       "Slugged",
+		"custom_slug": "my-bundle",
+		"json_items":  `[{"title":"a.txt","content":"AAA"}]`,
+	}, "", "", "")
+	req := httptest.NewRequest("POST", "/api/pastes/can", body)
+	req.Header.Set("Content-Type", ct)
+	rec := httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	if rec.Code != 201 {
+		t.Fatalf("create can with slug: %d %s", rec.Code, rec.Body.String())
+	}
+	var created struct{ ID, URL string }
+	json.Unmarshal(rec.Body.Bytes(), &created)
+	if created.ID != "my-bundle" {
+		t.Fatalf("expected id my-bundle, got %q", created.ID)
+	}
+	// custom slug resolves on the can page route
+	req = httptest.NewRequest("GET", "/can/my-bundle", nil)
+	rec = httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	if rec.Code != 200 || !strings.Contains(rec.Body.String(), "Slugged") {
+		t.Fatalf("can page by slug: %d", rec.Code)
+	}
+	// duplicate slug rejected 409
+	body, ct = multipartBody(t, map[string]string{
+		"title": "Again", "custom_slug": "my-bundle",
+		"json_items": `[{"title":"a.txt","content":"AAA"}]`,
+	}, "", "", "")
+	req = httptest.NewRequest("POST", "/api/pastes/can", body)
+	req.Header.Set("Content-Type", ct)
+	rec = httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	if rec.Code != 409 {
+		t.Fatalf("duplicate slug expected 409, got %d", rec.Code)
+	}
+	// reserved slug rejected
+	body, ct = multipartBody(t, map[string]string{
+		"title": "R", "custom_slug": "admin",
+		"json_items": `[{"title":"a.txt","content":"AAA"}]`,
+	}, "", "", "")
+	req = httptest.NewRequest("POST", "/api/pastes/can", body)
+	req.Header.Set("Content-Type", ct)
+	rec = httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	if rec.Code != 409 {
+		t.Fatalf("reserved slug expected 409, got %d", rec.Code)
+	}
+}
+
+// #4: invalid expiry rejected on cans, mirroring paste behavior (#48).
+func TestCanExpiryValidation(t *testing.T) {
+	s := testServer(t)
+	h := s.routes()
+	body, ct := multipartBody(t, map[string]string{
+		"title": "Bad expiry", "expires_in": "30s",
+		"json_items": `[{"title":"a.txt","content":"AAA"}]`,
+	}, "", "", "")
+	req := httptest.NewRequest("POST", "/api/pastes/can", body)
+	req.Header.Set("Content-Type", ct)
+	rec := httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	if rec.Code != 400 {
+		t.Fatalf("expected 400 for 30s expiry, got %d", rec.Code)
+	}
+}
+
+// #4: expired cans 404 on the page and API.
+func TestCanExpiryAccess(t *testing.T) {
+	s := testServer(t)
+	h := s.routes()
+	body, ct := multipartBody(t, map[string]string{
+		"title": "Dying", "expires_in": "1h",
+		"json_items": `[{"title":"a.txt","content":"AAA"}]`,
+	}, "", "", "")
+	req := httptest.NewRequest("POST", "/api/pastes/can", body)
+	req.Header.Set("Content-Type", ct)
+	rec := httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	var created struct{ ID string `json:"id"` }
+	json.Unmarshal(rec.Body.Bytes(), &created)
+
+	// backdate expiry to force the expired path
+	s.store.Exec(`UPDATE paste_cans SET expires_at=? WHERE id=?`, 100, created.ID)
+
+	req = httptest.NewRequest("GET", "/api/cans/"+created.ID, nil)
+	rec = httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	if rec.Code != 404 {
+		t.Fatalf("expired can API expected 404, got %d", rec.Code)
+	}
+	req = httptest.NewRequest("GET", "/can/"+created.ID, nil)
+	rec = httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	if rec.Code != 404 {
+		t.Fatalf("expired can page expected 404, got %d", rec.Code)
+	}
+}
+
+// #4: password-protected can page uses the same unlock flow as pastes.
+func TestCanUnlockFlow(t *testing.T) {
+	s := testServer(t)
+	h := s.routes()
+	body, ct := multipartBody(t, map[string]string{
+		"title": "Locked can", "password": "pw123",
+		"json_items": `[{"title":"secret.txt","content":"sec content"}]`,
+	}, "", "", "")
+	req := httptest.NewRequest("POST", "/api/pastes/can", body)
+	req.Header.Set("Content-Type", ct)
+	rec := httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	var created struct{ ID string `json:"id"` }
+	json.Unmarshal(rec.Body.Bytes(), &created)
+
+	// GET page without cookie -> unlock form
+	req = httptest.NewRequest("GET", "/can/"+created.ID, nil)
+	rec = httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	if rec.Code != 200 || !strings.Contains(rec.Body.String(), "locked") {
+		t.Fatalf("expected unlock form, got %d", rec.Code)
+	}
+
+	// POST wrong password -> unlock form with error
+	fd := strings.NewReader("password=wrong")
+	req = httptest.NewRequest("POST", "/can/"+created.ID, fd)
+	req.Header.Set("Content-Type", "application/x-www-form-urlencoded")
+	rec = httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	if !strings.Contains(rec.Body.String(), "Wrong password") {
+		t.Fatalf("expected wrong-password message")
+	}
+
+	// POST correct password -> page renders, cookie set
+	fd = strings.NewReader("password=pw123")
+	req = httptest.NewRequest("POST", "/can/"+created.ID, fd)
+	req.Header.Set("Content-Type", "application/x-www-form-urlencoded")
+	rec = httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	if !strings.Contains(rec.Body.String(), "sec content") {
+		t.Fatalf("unlocked can page missing item content")
+	}
+	var pwCookie *http.Cookie
+	for _, c := range rec.Result().Cookies() {
+		if c.Name == "pw_"+created.ID {
+			pwCookie = c
+		}
+	}
+	if pwCookie == nil {
+		t.Fatalf("unlock cookie not set")
+	}
+
+	// GET with cookie -> unlocked
+	req = httptest.NewRequest("GET", "/can/"+created.ID, nil)
+	req.AddCookie(pwCookie)
+	rec = httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	if !strings.Contains(rec.Body.String(), "sec content") {
+		t.Fatalf("cookie unlock failed: %d", rec.Code)
+	}
+	// a forged cookie value must not unlock
+	req = httptest.NewRequest("GET", "/can/"+created.ID, nil)
+	req.AddCookie(&http.Cookie{Name: "pw_" + created.ID, Value: "forged"})
+	rec = httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	if strings.Contains(rec.Body.String(), "sec content") {
+		t.Fatalf("forged cookie unlocked the can")
+	}
+}
+
+// #4: can item access inherits the can unlock cookie (not just query param).
+func TestCanItemCookieParity(t *testing.T) {
+	s := testServer(t)
+	h := s.routes()
+	body, ct := multipartBody(t, map[string]string{
+		"title": "Cookie can", "password": "pw123",
+		"json_items": `[{"title":"s.txt","content":"sec"}]`,
+	}, "", "", "")
+	req := httptest.NewRequest("POST", "/api/pastes/can", body)
+	req.Header.Set("Content-Type", ct)
+	rec := httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	var created struct{ ID string `json:"id"` }
+	json.Unmarshal(rec.Body.Bytes(), &created)
+
+	// unlock via page to get the cookie
+	fd := strings.NewReader("password=pw123")
+	req = httptest.NewRequest("POST", "/can/"+created.ID, fd)
+	req.Header.Set("Content-Type", "application/x-www-form-urlencoded")
+	rec = httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	var pwCookie *http.Cookie
+	for _, c := range rec.Result().Cookies() {
+		if c.Name == "pw_"+created.ID {
+			pwCookie = c
+		}
+	}
+	if pwCookie == nil {
+		t.Fatalf("no unlock cookie")
+	}
+
+	// item id from API (with password query)
+	req = httptest.NewRequest("GET", "/api/cans/"+created.ID, nil)
+	req.Header.Set("X-Paste-Password", "pw123")
+	rec = httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	var can struct {
+		Items []struct{ ID string `json:"id"` } `json:"items"`
+	}
+	json.Unmarshal(rec.Body.Bytes(), &can)
+	itemID := can.Items[0].ID
+
+	// API item with the unlock cookie but no password -> 200
+	req = httptest.NewRequest("GET", "/api/cans/"+created.ID+"/items/"+itemID, nil)
+	req.AddCookie(pwCookie)
+	rec = httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	if rec.Code != 200 {
+		t.Fatalf("item via cookie expected 200, got %d", rec.Code)
+	}
+	// forged cookie -> 401
+	req = httptest.NewRequest("GET", "/api/cans/"+created.ID+"/items/"+itemID, nil)
+	req.AddCookie(&http.Cookie{Name: "pw_" + created.ID, Value: "forged"})
+	rec = httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	if rec.Code != 401 {
+		t.Fatalf("forged cookie on item expected 401, got %d", rec.Code)
+	}
+}
+
+// #4: viewer-scoped soft delete of cans.
+func TestCanDeleteParity(t *testing.T) {
+	s := testServer(t)
+	h := s.routes()
+	body, ct := multipartBody(t, map[string]string{
+		"title": "Doomed", "json_items": `[{"title":"a.txt","content":"AAA"}]`,
+	}, "", "", "")
+	req := httptest.NewRequest("POST", "/api/pastes/can", body)
+	req.Header.Set("Content-Type", ct)
+	req.AddCookie(&http.Cookie{Name: "vwr", Value: "creator"})
+	rec := httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	var created struct{ ID string `json:"id"` }
+	json.Unmarshal(rec.Body.Bytes(), &created)
+
+	// delete without matching viewer -> 403
+	req = httptest.NewRequest("DELETE", "/api/cans/"+created.ID, nil)
+	rec = httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	if rec.Code != 403 {
+		t.Fatalf("unauthorized delete expected 403, got %d", rec.Code)
+	}
+	// creator's browser -> 200
+	req = httptest.NewRequest("DELETE", "/api/cans/"+created.ID, nil)
+	req.AddCookie(&http.Cookie{Name: "vwr", Value: "creator"})
+	rec = httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	if rec.Code != 200 {
+		t.Fatalf("creator delete expected 200, got %d", rec.Code)
+	}
+	// gone from API and page
+	req = httptest.NewRequest("GET", "/api/cans/"+created.ID, nil)
+	rec = httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	if rec.Code != 404 {
+		t.Fatalf("deleted can expected 404, got %d", rec.Code)
+	}
+	// gone from listings
+	req = httptest.NewRequest("GET", "/api/public", nil)
+	rec = httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	if strings.Contains(rec.Body.String(), "Doomed") {
+		t.Fatalf("deleted can still listed")
+	}
+}
+
+// #4: cans appear in /api/mine for the creating browser.
+func TestCanInMine(t *testing.T) {
+	s := testServer(t)
+	h := s.routes()
+	body, ct := multipartBody(t, map[string]string{
+		"title": "Mine can", "json_items": `[{"title":"a.txt","content":"AAA"}]`,
+	}, "", "", "")
+	req := httptest.NewRequest("POST", "/api/pastes/can", body)
+	req.Header.Set("Content-Type", ct)
+	req.AddCookie(&http.Cookie{Name: "vwr", Value: "v-mine"})
+	rec := httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	if rec.Code != 201 {
+		t.Fatalf("create: %d", rec.Code)
+	}
+
+	req = httptest.NewRequest("GET", "/api/mine", nil)
+	req.AddCookie(&http.Cookie{Name: "vwr", Value: "v-mine"})
+	rec = httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	var got struct {
+		Items []struct {
+			ID    string `json:"id"`
+			IsCan bool   `json:"is_can"`
+		} `json:"items"`
+	}
+	json.Unmarshal(rec.Body.Bytes(), &got)
+	if len(got.Items) != 1 || !got.Items[0].IsCan {
+		t.Fatalf("can missing from /api/mine: %s", rec.Body.String())
+	}
+}
+
+// #4: sweep soft-deletes expired cans (parity with pastes).
+func TestCanSweepExpired(t *testing.T) {
+	s := testServer(t)
+	s.store.CreateCan("sweepcan", "sweep", "", "public", nil, 1, nil, nil)
+	s.store.InsertCanItem("sweepcan", "a.txt", "AAA", "text/plain", nil, nil, nil, 1)
+	s.store.Exec(`UPDATE paste_cans SET expires_at=? WHERE id=?`, 100, "sweepcan")
+	s.store.SweepExpired()
+	if can, _ := s.store.GetCan("sweepcan"); can != nil {
+		t.Fatalf("expired can survived sweep")
+	}
+	_ = store.GenSlug(4) // keep import if store pkg shrinks
+}

internal/api/cans_test.go

@@ -0,0 +1,144 @@
+package api
+
+import (
+	"bytes"
+	"encoding/json"
+	"mime/multipart"
+	"net/http/httptest"
+	"strings"
+	"testing"
+)
+
+func multipartBody(t *testing.T, fields map[string]string, fileField, fileName, fileContent string) (*bytes.Buffer, string) {
+	t.Helper()
+	var buf bytes.Buffer
+	w := multipart.NewWriter(&buf)
+	for k, v := range fields {
+		w.WriteField(k, v)
+	}
+	if fileField != "" {
+		fw, _ := w.CreateFormFile(fileField, fileName)
+		fw.Write([]byte(fileContent))
+	}
+	w.Close()
+	return &buf, w.FormDataContentType()
+}
+
+func TestCreateAndGetCan(t *testing.T) {
+	s := testServer(t)
+	h := s.routes()
+
+	body, ct := multipartBody(t, map[string]string{
+		"title":      "My can",
+		"json_items": `[{"title":"a.txt","content":"AAA"},{"title":"b.txt","content":"BBB"}]`,
+		"expires_in": "1h",
+	}, "files", "pic.txt", "file data")
+
+	req := httptest.NewRequest("POST", "/api/pastes/can", body)
+	req.Header.Set("Content-Type", ct)
+	rec := httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	if rec.Code != 201 {
+		t.Fatalf("create can: got %d: %s", rec.Code, rec.Body.String())
+	}
+	var created struct {
+		ID    string `json:"id"`
+		Items int    `json:"items"`
+	}
+	json.Unmarshal(rec.Body.Bytes(), &created)
+	if created.Items != 3 {
+		t.Fatalf("expected 3 items, got %d", created.Items)
+	}
+
+	// get can
+	req = httptest.NewRequest("GET", "/api/cans/"+created.ID, nil)
+	rec = httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	if rec.Code != 200 {
+		t.Fatalf("get can: got %d", rec.Code)
+	}
+	var can struct {
+		Items []struct{ ID string `json:"id"` } `json:"items"`
+	}
+	json.Unmarshal(rec.Body.Bytes(), &can)
+	if len(can.Items) != 3 {
+		t.Fatalf("expected 3 items in get, got %d", len(can.Items))
+	}
+
+	// fetch item
+	req = httptest.NewRequest("GET", "/api/cans/"+created.ID+"/items/"+can.Items[0].ID, nil)
+	rec = httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	if rec.Code != 200 {
+		t.Fatalf("item fetch: got %d", rec.Code)
+	}
+}
+
+func TestEmptyCanRejected(t *testing.T) {
+	s := testServer(t)
+	h := s.routes()
+	body, ct := multipartBody(t, map[string]string{"title": "empty"}, "", "", "")
+	req := httptest.NewRequest("POST", "/api/pastes/can", body)
+	req.Header.Set("Content-Type", ct)
+	rec := httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	if rec.Code != 400 {
+		t.Fatalf("expected 400 for empty can, got %d", rec.Code)
+	}
+}
+
+func TestCanPasswordInheritedByItems(t *testing.T) {
+	s := testServer(t)
+	h := s.routes()
+
+	body, ct := multipartBody(t, map[string]string{
+		"title":      "locked",
+		"password":   "pw123",
+		"json_items": `[{"title":"s.txt","content":"sec"}]`,
+	}, "", "", "")
+	req := httptest.NewRequest("POST", "/api/pastes/can", body)
+	req.Header.Set("Content-Type", ct)
+	rec := httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	var created struct{ ID string `json:"id"` }
+	json.Unmarshal(rec.Body.Bytes(), &created)
+
+	// can without pw -> 401
+	req = httptest.NewRequest("GET", "/api/cans/"+created.ID, nil)
+	rec = httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	if rec.Code != 401 {
+		t.Fatalf("expected 401, got %d", rec.Code)
+	}
+
+	// get item id with pw
+	req = httptest.NewRequest("GET", "/api/cans/"+created.ID, nil)
+	req.Header.Set("X-Paste-Password", "pw123")
+	rec = httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	var can struct {
+		Items []struct{ ID string `json:"id"` } `json:"items"`
+	}
+	json.Unmarshal(rec.Body.Bytes(), &can)
+	itemID := can.Items[0].ID
+
+	// item without pw -> 401
+	req = httptest.NewRequest("GET", "/api/cans/"+created.ID+"/items/"+itemID, nil)
+	rec = httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	if rec.Code != 401 {
+		t.Fatalf("item expected 401, got %d", rec.Code)
+	}
+
+	// item with pw -> 200
+	req = httptest.NewRequest("GET", "/api/cans/"+created.ID+"/items/"+itemID, nil)
+	req.Header.Set("X-Paste-Password", "pw123")
+	rec = httptest.NewRecorder()
+	h.ServeHTTP(rec, req)
+	if rec.Code != 200 {
+		t.Fatalf("item expected 200, got %d", rec.Code)
+	}
+	if !strings.Contains(rec.Body.String(), "sec") {
+		t.Fatalf("item content mismatch: %s", rec.Body.String())
+	}
+}

internal/api/clientip.go

@@ -1,27 +0,0 @@
-// clientIP extracts the client IP for rate-limit keying.
-//
-// Trust boundary (issue #280): the bucket key MUST NOT come from any header a
-// client can influence. The previous rightmost-X-Forwarded-For scheme (#85)
-// assumed Traefik appends the real client IP, but the deployed ingress does
-// not rewrite XFF, so a client rotating its own XFF value got a fresh bucket
-// per request and the limit was unenforceable (pentest H1: 6x201 across 8
-// rotating-XFF creates).
-//
-// The bucket key is the actual peer address (RemoteAddr) only. Behind any
-// reverse proxy this is the proxy's address, so all clients share one bucket
-// per endpoint — coarse, but safe. Client-supplied IP headers
-// (X-Forwarded-For, X-Real-Ip) are never trusted.
-package api
-
-import (
-	"net"
-	"net/http"
-)
-
-func clientIP(r *http.Request) string {
-	host := r.RemoteAddr
-	if h, _, err := net.SplitHostPort(r.RemoteAddr); err == nil {
-		host = h
-	}
-	return host
-}

internal/api/cookie_set_test.go

@@ -1,7 +1,7 @@
 package api
 
-// #143: create responses must set the short-lived tok_<id> HttpOnly+Secure
+// #143: create responses must set the short-lived tok_<id> HttpOnly cookie
-// cookie that the paste view reads for the one-time created banner.
+// that the paste view reads for the one-time created banner.
 
 import (
 	"net/http"
@@ -29,9 +29,6 @@ func TestCreateSetsDeletionTokenCookie(t *testing.T) {
 			if !c.HttpOnly {
 				t.Error("tok_ cookie not HttpOnly")
 			}
-			if !c.Secure {
-				t.Error("tok_ cookie not Secure")
-			}
 			if c.MaxAge != 60 {
 				t.Errorf("tok_ cookie MaxAge = %d, want 60", c.MaxAge)
 			}
@@ -94,15 +91,7 @@ func TestCreatedBannerViaCookie(t *testing.T) {
 	if rec2.Code != 200 {
 		t.Fatalf("paste view: got %d", rec2.Code)
 	}
-	// #168: the created pill no longer prints the deletion token; the token
+	if !strings.Contains(rec2.Body.String(), tok) {
-	// still arrives via the one-time cookie flow (re-set on the view response).
+		t.Error("created banner does not show the deletion token (#143 cookie flow broken)")
-	var got bool
-	for _, c := range rec2.Result().Cookies() {
-		if c.Name == "tok_"+id && c.Value == tok {
-			got = true
-		}
-	}
-	if !got {
-		t.Error("created view did not re-set the deletion token cookie (#143 cookie flow broken)")
 	}
 }

internal/api/issue105_errorcode_test.go

@@ -86,3 +86,38 @@ func TestErrorCodeRateLimited(t *testing.T) {
 	}
 	t.Fatalf("never got rate_limited, last code = %q", code)
 }
+
+func TestErrorCodeCanValidation(t *testing.T) {
+	h := testServer(t).routes()
+
+	post := func(fields map[string]string) *httptest.ResponseRecorder {
+		var b strings.Builder
+		for k, v := range fields {
+			b.WriteString("--B\r\nContent-Disposition: form-data; name=\"" + k + "\"\r\n\r\n" + v + "\r\n")
+		}
+		b.WriteString("--B--\r\n")
+		req := httptest.NewRequest("POST", "/api/pastes/can", strings.NewReader(b.String()))
+		req.Header.Set("Content-Type", "multipart/form-data; boundary=B")
+		rec := httptest.NewRecorder()
+		h.ServeHTTP(rec, req)
+		return rec
+	}
+
+	// bad visibility
+	if _, _, code := decodeErr(t, post(map[string]string{"title": "x", "visibility": "nope"})); code != "invalid_visibility" {
+		t.Fatalf("visibility code = %q, want invalid_visibility", code)
+	}
+
+	// invalid expiry
+	if _, _, code := decodeErr(t, post(map[string]string{"title": "x", "expires_in": "1s"})); code != "expiry_invalid" {
+		t.Fatalf("expiry code = %q, want expiry_invalid", code)
+	}
+
+	// slug taken on can create
+	if rec := postCreate(h, `{"content":"a","custom_slug":"can-slug"}`); rec.Code != 201 {
+		t.Fatalf("seed create: %d", rec.Code)
+	}
+	if _, _, code := decodeErr(t, post(map[string]string{"title": "x", "custom_slug": "can-slug", "json_items": `[{"title":"a","content":"b"}]`})); code != "slug_taken" {
+		t.Fatalf("can slug code = %q, want slug_taken", code)
+	}
+}

internal/api/issue138_cookie_test.go

@@ -29,7 +29,7 @@ func newTestServer138(t *testing.T) *httptest.ResponseRecorder {
 	globalSettingsFn = ss.get
 	t.Cleanup(func() { globalSettingsFn = nil })
 	a := &apiServer{store: st, cfg: cfg, ui: ui, settings: ss, adminKey: "test-admin-key"}
-	req := httptest.NewRequest("GET", "/public", nil)
+	req := httptest.NewRequest("GET", "/history", nil)
 	rec := httptest.NewRecorder()
 	a.routes().ServeHTTP(rec, req)
 	return rec

internal/api/issue235_type_test.go

@@ -1,40 +0,0 @@
-package api
-
-import "testing"
-
-// #235: Type column. Text pastes show the language, attachment pastes show
-// the file extension (lowercase, no dot).
-func TestDisplayType(t *testing.T) {
-	lang := "python"
-	cases := []struct {
-		lang *string
-		att  string
-		want string
-	}{
-		{nil, "", "text"},
-		{&lang, "", "python"},
-		{&lang, "report.pdf", "pdf"},
-		{nil, "photo.PNG", "png"},
-		{&lang, "archive.tar.gz", "gz"},
-		{&lang, "noext", "python"},     // no extension: fall back to language
-		{&lang, ".hidden", "python"},   // dotfile: no extension
-		{&lang, "dir/name.txt", "txt"}, // path component only
-	}
-	for _, c := range cases {
-		if got := displayType(c.lang, c.att); got != c.want {
-			t.Errorf("displayType(%v, %q) = %q, want %q", c.lang, c.att, got, c.want)
-		}
-	}
-}
-
-func TestAttachmentExtName(t *testing.T) {
-	cases := map[string]string{
-		"a.txt": "txt", "A.PNG": "png", "noext": "", ".hidden": "",
-		"x.": "", "dir/b.md": "md", "": "",
-	}
-	for in, want := range cases {
-		if got := attachmentExtName(in); got != want {
-			t.Errorf("attachmentExtName(%q) = %q, want %q", in, got, want)
-		}
-	}
-}

internal/api/main_test.go

@@ -299,27 +299,3 @@ func TestNotFound(t *testing.T) {
 		t.Fatalf("expected 404, got %d", rec.Code)
 	}
 }
-
-// #173: a missing paste ID on the UI route (/p/{id}, i.e. /{id} HTML view)
-// should render the main UI page with a friendly "Paste ID not found"
-// message, not a bare text 404. Status stays 404.
-func TestPasteViewNotFoundFriendly(t *testing.T) {
-	s := testServer(t)
-	h := s.routes()
-	req := httptest.NewRequest("GET", "/zzzzzz", nil)
-	rec := httptest.NewRecorder()
-	h.ServeHTTP(rec, req)
-	if rec.Code != http.StatusNotFound {
-		t.Fatalf("expected 404 status, got %d", rec.Code)
-	}
-	body := rec.Body.String()
-	if !strings.Contains(body, "Paste ID not found") {
-		t.Fatalf("expected friendly message in body, got: %.200s", body)
-	}
-	if !strings.Contains(body, "<nav>") {
-		t.Fatalf("expected main UI chrome in body")
-	}
-	if strings.Contains(body, "404 page not found") {
-		t.Fatalf("body still contains bare Go 404 text")
-	}
-}

internal/api/mine_test.go

@@ -58,7 +58,7 @@ func TestMineCreateListDelete(t *testing.T) {
 	a := &apiServer{store: st, cfg: cfg, ui: ui, settings: ss, adminKey: "test-admin-key"}
 	h := a.routes()
 
-	alice := viewerCookieFor(t, h, "/public")
+	alice := viewerCookieFor(t, h, "/history")
 	if alice == "" {
 		t.Fatal("no viewer cookie issued")
 	}
@@ -89,7 +89,7 @@ func TestMineCreateListDelete(t *testing.T) {
 	}
 
 	// a different browser's cookie does NOT see it
-	bob := viewerCookieFor(t, h, "/public")
+	bob := viewerCookieFor(t, h, "/history")
 	rec = doReq(t, h, "GET", "/api/mine", bob, "")
 	json.Unmarshal(rec.Body.Bytes(), &list)
 	if list.Total != 0 {

internal/api/ratelimit.go

@@ -3,6 +3,7 @@ package api
 import (
 	"net/http"
 	"strconv"
+	"strings"
 	"sync"
 	"time"
 )
@@ -47,6 +48,35 @@ func (l *limiter) allow(key string, rate, burst float64) bool {
 	return true
 }
 
+// clientIP extracts the client IP for rate-limit keying (#85).
+//
+// Trust boundary: palette runs behind exactly ONE trusted reverse proxy
+// (Traefik in the k3s pod network). Traefik APPENDS the real client IP to
+// X-Forwarded-For, so the RIGHTMOST entry is the last value the trusted
+// proxy observed and is unspoofable by the client (a client-supplied fake
+// entry only lands on the LEFT and is ignored). This matches chi's
+// middleware.RealIP semantics for a single trusted proxy hop.
+//
+// Direct connections (no XFF header) fall back to RemoteAddr. Directly
+// reachable deployments must NOT expose the app to untrusted networks
+// without a proxy in front, or attackers could forge the rightmost entry.
+func clientIP(r *http.Request) string {
+	if xff := r.Header.Get("X-Forwarded-For"); xff != "" {
+		if i := strings.LastIndex(xff, ","); i >= 0 {
+			return strings.TrimSpace(xff[i+1:])
+		}
+		return strings.TrimSpace(xff)
+	}
+	if xr := r.Header.Get("X-Real-Ip"); xr != "" {
+		return strings.TrimSpace(xr)
+	}
+	host := r.RemoteAddr
+	if i := strings.LastIndex(host, ":"); i > 0 {
+		host = host[:i]
+	}
+	return host
+}
+
 var globalLimiter = newLimiter()
 
 // globalSettingsFn is set at startup; tests can point it at fixed settings.

internal/api/ratelimit_test.go

@@ -166,11 +166,8 @@ func TestHighlightCode(t *testing.T) {
 	if plain != "<b>x</b>" {
 		t.Fatalf("plain escaping wrong: %q", plain)
 	}
-	// #205: newline join preserved as the delimiter paste-lines.js splits on;
+	// line count preserved (gutter alignment)
-	// per-line segments survive and the client joins with '' so no newline
+	if got := len(splitLines(lang.HighlightCode("a\nb\nc", "go"))); got != 3 {
-	// text node reaches the rendered DOM.
-	hl := lang.HighlightCode("a\nb\nc", "go")
-	if got := len(splitLines(hl)); got != 3 {
 		t.Fatalf("want 3 lines, got %d", got)
 	}
 }

internal/api/ratelimit_xff_test.go

@@ -1,50 +1,85 @@
 package api
 
+// Issue #85: the rate limit key must use the rightmost X-Forwarded-For entry
+// (appended by the trusted Traefik proxy), never the raw/leftmost header
+// value a client can forge. A spoofed FIRST XFF entry must not bypass the
+// limit or rotate buckets.
+
 import (
-	"fmt"
+	"bytes"
 	"net/http/httptest"
 	"testing"
 )
 
-func TestClientIPUsesRemoteAddrNotXFF(t *testing.T) {
+func TestClientIPTakesRightmostXFF(t *testing.T) {
-	r := httptest.NewRequest("POST", "/api/pastes", nil)
+	r := httptest.NewRequest("POST", "/", nil)
-	r.RemoteAddr = "203.0.113.7:4432"
+	r.RemoteAddr = "10.42.0.7:51000" // trusted Traefik pod
 	r.Header.Set("X-Forwarded-For", "1.2.3.4, 1.2.3.5, 203.0.113.9")
+	if got := clientIP(r); got != "203.0.113.9" {
+		t.Fatalf("clientIP = %q, want rightmost 203.0.113.9", got)
+	}
+}
+
+func TestClientIPXRealIPFallback(t *testing.T) {
+	r := httptest.NewRequest("POST", "/", nil)
+	r.RemoteAddr = "10.42.0.7:51000"
 	r.Header.Set("X-Real-Ip", "203.0.113.10")
-	if got := clientIP(r); got != "203.0.113.7" {
+	if got := clientIP(r); got != "203.0.113.10" {
-		t.Fatalf("clientIP = %q, want peer 203.0.113.7", got)
+		t.Fatalf("clientIP = %q, want 203.0.113.10", got)
 	}
 }
 
-// A proxy-controlled header is not honored even when set: #280 revision
+func TestClientIPDirectFallback(t *testing.T) {
-// removed the PALETTE_TRUSTED_IP_HEADER mechanism per owner decision, so the
+	r := httptest.NewRequest("POST", "/", nil)
-// bucket key is the peer address only.
+	r.RemoteAddr = "198.51.100.5:51000"
-func TestClientIPNeverTrustsHeaders(t *testing.T) {
+	if got := clientIP(r); got != "198.51.100.5" {
-	r := httptest.NewRequest("POST", "/api/pastes", nil)
+		t.Fatalf("clientIP = %q, want 198.51.100.5", got)
-	r.RemoteAddr = "10.0.1.47:9999"
-	r.Header.Set("CF-Connecting-IP", "198.51.100.9")
-	if got := clientIP(r); got != "10.0.1.47" {
-		t.Fatalf("clientIP = %q, want peer 10.0.1.47", got)
 	}
 }
 
-// Issue #280: rotating X-Forwarded-For must NOT reset the bucket. Pentest
+// TestRateLimitSpoofedFirstXFFDoesNotBypass: an attacker rotating a fake
-// repro was 8 creates with rotating XFF -> 6x201.
+// leftmost XFF entry stays limited on their real (rightmost) IP.
-func TestRotatingXFFDoesNotResetBucket(t *testing.T) {
+func TestRateLimitSpoofedFirstXFFDoesNotBypass(t *testing.T) {
-	globalLimiter = newLimiter()
+	srv := newTestServer(t)
-	s := defaultSettings(Config{}) // burst/limit defaults; header values are ignored anyway
+	h := srv.routes()
-	var allowed, limited int
+	for i := 0; i < 5; i++ {
-	for i := 0; i < 8; i++ {
+		req := httptest.NewRequest("POST", "/api/pastes", bytes.NewReader([]byte(`{"content":"hi"}`)))
-		r := httptest.NewRequest("POST", "/api/pastes", nil)
+		req.RemoteAddr = "10.42.0.7:51000"
-		r.RemoteAddr = "198.51.100.1:5000"
+		// each request spoofs a DIFFERENT leftmost entry
-		r.Header.Set("X-Forwarded-For", fmt.Sprintf("9.9.9.%d", i))
+		req.Header.Set("X-Forwarded-For", spoofN(i)+", 203.0.113.9")
-		if rateLimitCreate(r, s) {
+		rr := httptest.NewRecorder()
-			allowed++
+		h.ServeHTTP(rr, req)
-		} else {
+		if rr.Code != 201 {
-			limited++
+			t.Fatalf("req %d: want 201, got %d", i, rr.Code)
 		}
 	}
-	if float64(allowed) != s.RateLimitBurst || limited != 8-int(s.RateLimitBurst) {
+	// 6th request, still the same real IP, new spoofed prefix: must 429
-		t.Fatalf("rotating XFF: allowed=%d limited=%d, want allowed=%v (burst), limited=%d", allowed, limited, s.RateLimitBurst, 8-int(s.RateLimitBurst))
+	req := httptest.NewRequest("POST", "/api/pastes", bytes.NewReader([]byte(`{"content":"hi"}`)))
+	req.RemoteAddr = "10.42.0.7:51000"
+	req.Header.Set("X-Forwarded-For", "9.9.9.9, 203.0.113.9")
+	rr := httptest.NewRecorder()
+	h.ServeHTTP(rr, req)
+	if rr.Code != 429 {
+		t.Fatalf("spoofed 6th req: want 429, got %d", rr.Code)
+	}
+}
+
+func spoofN(i int) string {
+	return "1.2.3." + string(rune('0'+i))
+}
+
+// Distinct real IPs must still get distinct buckets (no over-limiting).
+func TestRateLimitDistinctRightmostIPsIndependent(t *testing.T) {
+	srv := newTestServer(t)
+	h := srv.routes()
+	for _, ip := range []string{"203.0.113.20", "203.0.113.21"} {
+		req := httptest.NewRequest("POST", "/api/pastes", bytes.NewReader([]byte(`{"content":"hi"}`)))
+		req.RemoteAddr = "10.42.0.7:51000"
+		req.Header.Set("X-Forwarded-For", "6.6.6.6, "+ip)
+		rr := httptest.NewRecorder()
+		h.ServeHTTP(rr, req)
+		if rr.Code != 201 {
+			t.Fatalf("ip %s: want 201, got %d", ip, rr.Code)
+		}
 	}
 }

internal/api/routes_rename_test.go

@@ -1,52 +0,0 @@
-package api
-
-// #256: renamed page routes; old URLs redirect.
-import (
-	"palette/internal/store"
-	"palette/internal/web"
-
-	"net/http"
-	"net/http/httptest"
-	"testing"
-)
-
-func TestRenamedPageRoutes(t *testing.T) {
-	globalLimiter = newLimiter() // fresh rate-limit buckets
-	st, err := store.OpenStore(":memory:")
-	if err != nil {
-		t.Fatal(err)
-	}
-	ui, err := web.New()
-	if err != nil {
-		t.Fatal(err)
-	}
-	cfg := Config{MaxTextBytes: 5 * 1024 * 1024}
-	ss := NewTestSettingsStore(t, cfg)
-	globalSettingsFn = ss.get
-	t.Cleanup(func() { globalSettingsFn = nil })
-	a := &apiServer{store: st, cfg: cfg, ui: ui, settings: ss, adminKey: "test-admin-key"}
-	h := a.routes()
-
-	// new routes render pages
-	for _, path := range []string{"/public", "/saved"} {
-		req := httptest.NewRequest("GET", path, nil)
-		rec := httptest.NewRecorder()
-		h.ServeHTTP(rec, req)
-		if rec.Code != http.StatusOK {
-			t.Fatalf("GET %s: %d, want 200", path, rec.Code)
-		}
-	}
-
-	// old routes redirect
-	for _, tc := range [][2]string{{"/history", "/public"}, {"/mine", "/saved"}, {"/", "/public"}} {
-		req := httptest.NewRequest("GET", tc[0], nil)
-		rec := httptest.NewRecorder()
-		h.ServeHTTP(rec, req)
-		if rec.Code != http.StatusMovedPermanently && rec.Code != http.StatusFound {
-			t.Fatalf("GET %s: %d, want redirect", tc[0], rec.Code)
-		}
-		if loc := rec.Header().Get("Location"); loc != tc[1] {
-			t.Fatalf("GET %s redirects to %s, want %s", tc[0], loc, tc[1])
-		}
-	}
-}

internal/api/server.go

@@ -1,5 +1,5 @@
 // Package api implements palette's REST handlers and the HTTP router:
-// pastes, guess-language, rate limiting middleware, and the admin API.
+// pastes, cans, guess-language, rate limiting middleware, and the admin API.
 package api
 
 import (
@@ -8,6 +8,7 @@ import (
 	"encoding/json"
 	"errors"
 	"fmt"
+	"html/template"
 	"net/http"
 	"os"
 	"strconv"
@@ -17,6 +18,7 @@ import (
 	"github.com/go-chi/chi/v5"
 	"github.com/go-chi/chi/v5/middleware"
 
+	langpkg "palette/internal/lang"
 	"palette/internal/store"
 	"palette/internal/web"
 )
@@ -57,7 +59,8 @@ func writeErrCode(w http.ResponseWriter, status int, code, msg string) {
 	writeJSON(w, status, map[string]string{"error": msg, "code": code})
 }
 
-// createErrCode maps a store.CreatePaste error to its UI error code (#105).
+// createErrCode maps a store.CreatePaste/CreateCan error to its UI error
+// code (#105).
 func createErrCode(err error) string {
 	switch {
 	case errors.Is(err, store.ErrSlugTaken):
@@ -100,33 +103,35 @@ func (a *apiServer) routes() http.Handler {
 		r.Delete("/pastes/{id}/redeem", a.handleRedeemDeletion)
 		r.Get("/public", a.handleListPublic)
 		r.Post("/guess-language", a.handleGuessLang)
+		r.Post("/pastes/can", a.handleCreateCan)
+		r.Get("/cans/{id}", a.handleGetCan)
+		r.Delete("/cans/{id}", a.handleDeleteCan)
+		r.Get("/cans/{id}/items/{item}", a.handleCanItem)
 	})
 
+	// can page (#4): GET renders, POST unlocks (same flow as pastes)
+	r.Get("/can/{id}", a.handleCanPage)
+	r.Post("/can/{id}", a.handleCanPage)
+
 	// raw + #38 attachment serving
 	r.Get("/f/{aid}/{filename}", a.handleServeAttachment)
 	r.Get("/raw/{id}", a.handleRaw)
 
 	// web pages
-	r.Get("/", http.RedirectHandler("/public", http.StatusFound).ServeHTTP)
+	r.Get("/", http.RedirectHandler("/history", http.StatusFound).ServeHTTP)
 	r.Get("/new", a.ui.Handlers().HandleNewPage)
-	r.Get("/public", a.ui.Handlers().HandleHistoryPage)
+	r.Get("/history", a.ui.Handlers().HandleHistoryPage)
-	r.Get("/saved", a.ui.Handlers().HandleMinePage)
 	r.Get("/settings", a.ui.Handlers().HandleSettingsPage)
-	// #256: old URLs redirect to the renamed pages
+	r.Get("/mine", a.ui.Handlers().HandleMinePage)
-	r.Get("/history", http.RedirectHandler("/public", http.StatusMovedPermanently).ServeHTTP)
-	r.Get("/mine", http.RedirectHandler("/saved", http.StatusMovedPermanently).ServeHTTP)
 	r.Handle("/static/*", a.ui.StaticHandler())
 	r.Get("/unlock/{id}", a.handlePasteView)
 	r.Post("/unlock/{id}", a.handlePasteView)
 	r.Get("/{id}", a.handlePasteView)
 	r.Post("/{id}", a.handlePasteView)
 
-// #173: missing paste URLs render the main UI with a friendly not-found
+	r.NotFound(func(w http.ResponseWriter, r *http.Request) {
-// message instead of a bare JSON 404. Known routes (above) handle real pages;
+		writeErr(w, 404, "not found")
-// anything else is a nonexistent paste ID or typo.
+	})
-r.NotFound(func(w http.ResponseWriter, r *http.Request) {
-	a.webHandlers().HandleNotFoundPage(w, r)
-})
 	return r
 }
 
@@ -178,7 +183,7 @@ func viewerSentCookie(r *http.Request) bool {
 func setDeletionTokenCookie(w http.ResponseWriter, pasteID, token string) {
 	http.SetCookie(w, &http.Cookie{
 		Name: "tok_" + pasteID, Value: token, Path: "/",
-		MaxAge: 60, HttpOnly: true, SameSite: http.SameSiteLaxMode, Secure: true,
+		MaxAge: 60, HttpOnly: true, SameSite: http.SameSiteLaxMode,
 	})
 }
 
@@ -307,26 +312,11 @@ func (a *apiServer) handleGetPaste(w http.ResponseWriter, r *http.Request) {
 	writeJSON(w, 200, map[string]any{
 		"id": row.ID, "content": row.Content, "content_type": row.ContentType,
 		"language": store.NullStrPtr(row.Language), "title": store.NullStrPtr(row.Title), "created_at": row.CreatedAt,
-		"type":     a.pasteTypeLabel(row),
 		"view_count": row.ViewCount, "visibility": row.Visibility,
 		"reads_remaining": rem,
 	})
 }
 
-// pasteTypeLabel computes the Type value for a single paste (#235): file
-// extension for attachment pastes, else the stored language, else "text".
-func (a *apiServer) pasteTypeLabel(row *store.PasteRow) string {
-	if att, err := a.store.GetAttachmentForPaste(row.ID); err == nil && att != nil {
-		if ext := attachmentExtName(att.Filename); ext != "" {
-			return ext
-		}
-	}
-	if !row.Language.Valid || row.Language.String == "" {
-		return "text"
-	}
-	return row.Language.String
-}
-
 func (a *apiServer) handleDeletePaste(w http.ResponseWriter, r *http.Request) {
 	id := chi.URLParam(r, "id")
 	row, err := a.store.GetPaste(id)
@@ -383,33 +373,6 @@ func (a *apiServer) deletionAuthorized(r *http.Request, row *store.PasteRow) boo
 		row.ViewerID.String != "" && row.ViewerID.String == vid
 }
 
-// displayType returns the Type-column value for a list row (#235): the file
-// extension for attachment pastes, otherwise the detected language (default
-// "text").
-func displayType(lang *string, attFilename string) string {
-	if ext := attachmentExtName(attFilename); ext != "" {
-		return ext
-	}
-	if lang == nil || *lang == "" {
-		return "text"
-	}
-	return *lang
-}
-
-// attachmentExtName returns the lowercase extension (without dot) of a
-// filename, or "" when there is none.
-func attachmentExtName(filename string) string {
-	name := filename
-	if i := strings.LastIndexByte(name, '/'); i >= 0 {
-		name = name[i+1:]
-	}
-	i := strings.LastIndexByte(name, '.')
-	if i <= 0 || i == len(name)-1 {
-		return ""
-	}
-	return strings.ToLower(name[i+1:])
-}
-
 // handleListMine serves /api/mine: pastes created from this browser (#37).
 func (a *apiServer) handleListMine(w http.ResponseWriter, r *http.Request) {
 	vid := currentViewerID(r)
@@ -428,9 +391,10 @@ func (a *apiServer) handleListMine(w http.ResponseWriter, r *http.Request) {
 	for _, row := range rows {
 		lang, title := store.NullStrPtr(row.Language), store.NullStrPtr(row.Title)
 		items = append(items, map[string]any{
-			"id": row.ID, "title": title, "language": lang, "type": displayType(lang, row.AttFilename),
+			"id": row.ID, "title": title, "language": lang,
 			"created_at": row.CreatedAt, "view_count": row.ViewCount, "size": row.Size,
 			"custom_slug": store.NullStrPtr(row.CustomSlug), "visibility": row.Visibility,
+			"is_can": row.IsCan,
 		})
 	}
 	writeJSON(w, 200, map[string]any{"total": total, "limit": limit, "offset": offset, "items": items})
@@ -448,9 +412,10 @@ func (a *apiServer) handleListPublic(w http.ResponseWriter, r *http.Request) {
 	for _, row := range rows {
 		lang, title := store.NullStrPtr(row.Language), store.NullStrPtr(row.Title)
 		items = append(items, map[string]any{
-			"id": row.ID, "title": title, "language": lang, "type": displayType(lang, row.AttFilename),
+			"id": row.ID, "title": title, "language": lang,
 			"created_at": row.CreatedAt, "view_count": row.ViewCount, "size": row.Size,
-			"custom_slug": store.NullStrPtr(row.CustomSlug), "visibility": row.Visibility,
+			"custom_slug": store.NullStrPtr(row.CustomSlug),
+			"is_can":      row.IsCan,
 		})
 	}
 	writeJSON(w, 200, map[string]any{"total": total, "limit": limit, "offset": offset, "items": items})
@@ -483,25 +448,6 @@ func (a *apiServer) handleRaw(w http.ResponseWriter, r *http.Request) {
 		http.Error(w, "not found", 404)
 		return
 	}
-	// #221: raw view of a paste backed by an attachment serves the stored
-	// blob bytes with the sniffed mime, not the (empty) text content — for
-	// ALL attachment mimes (#281); /raw/{id} is the raw fetch for the file
-	// too. serveContentType still forces active-content types (html, svg,
-	// xml) to text/plain per the #34 rule below.
-	if att, err := a.store.GetAttachmentForPaste(row.ID); err == nil && att != nil {
-		blobs := a.store.Blobs()
-		if blobs != nil {
-			if blob, err := blobs.Get(row.ID + "/" + att.SHA256); err == nil {
-				defer blob.Close()
-				a.store.IncrementViews(row.ID, "", 0) // raw views always count (#49/#95)
-				w.Header().Set("Content-Type", serveContentType(att.Mime))
-				w.Header().Set("X-Content-Type-Options", "nosniff")
-				w.Header().Set("Content-Length", fmt.Sprintf("%d", att.Size))
-				http.ServeContent(w, r, "", time.Unix(att.CreatedAt, 0), blob)
-				return
-			}
-		}
-	}
 	// #34: content_type is attacker-controlled via the create API. Serving it
 	// verbatim let a paste be stored with text/html (or image/svg+xml) and
 	// render as active content on this origin when fetched from /raw —
@@ -535,6 +481,130 @@ func safeRawContentType(ct string) bool {
 	return false
 }
 
+func (a *apiServer) handleCanPage(w http.ResponseWriter, r *http.Request) {
+	id := chi.URLParam(r, "id")
+	can, err := a.store.GetCan(id)
+	if err != nil || can == nil {
+		http.NotFound(w, r)
+		return
+	}
+	if can.ExpiresAt.Valid && can.ExpiresAt.Int64 < time.Now().Unix() {
+		http.NotFound(w, r)
+		return
+	}
+	// #4: password-protected cans go through the same unlock flow as pastes:
+	// the pw_<id> cookie carries an HMAC token bound to this can id. Items
+	// inherit the protection (handleCanItem checks the same cookie).
+	if can.PasswordHash.Valid {
+		h := a.webHandlers()
+		if r.Method == http.MethodPost {
+			if !rateLimitUnlock(can.ID, r) {
+				h.WriteRateLimited(w, 60)
+				return
+			}
+			r.ParseForm()
+			pw := r.FormValue("password")
+			if pw != "" && store.CheckPassword(can.PasswordHash.String, pw) {
+				http.SetCookie(w, &http.Cookie{
+					Name: "pw_" + can.ID, Value: web.UnlockToken(can.ID), Path: "/",
+					MaxAge: 3600, HttpOnly: true, SameSite: http.SameSiteLaxMode,
+				})
+				a.renderCan(w, can)
+				return
+			}
+			h.RenderPage(w, "unlock.html", map[string]any{
+				"Page": "unlock", "ID": can.ID, "Wrong": true,
+				"CreatedAgo": web.AgoString(can.CreatedAt), "CreatedAtUnix": can.CreatedAt,
+			})
+			return
+		}
+		c, err := r.Cookie("pw_" + can.ID)
+		if err != nil || c.Value != web.UnlockToken(can.ID) {
+			h.RenderPage(w, "unlock.html", map[string]any{
+				"Page": "unlock", "ID": can.ID, "Wrong": false,
+				"CreatedAgo": web.AgoString(can.CreatedAt), "CreatedAtUnix": can.CreatedAt,
+			})
+			return
+		}
+	}
+	a.renderCan(w, can)
+}
+
+// renderCan renders the can view page: title/description and items as cards.
+// Text items expand inline; files link to download.
+func (a *apiServer) renderCan(w http.ResponseWriter, can *store.CanRow) {
+	h := a.webHandlers()
+	items, err := a.store.ListCanItems(can.ID)
+	if err != nil {
+		http.Error(w, "db error", 500)
+		return
+	}
+	type canItem struct {
+		ID          string
+		Title       string
+		ContentType string
+		Size        string
+		IsFile      bool
+		Content     string
+		ContentHTML template.HTML
+		Language    string
+	}
+	cards := make([]canItem, 0, len(items))
+	totalSize := 0
+	for _, it := range items {
+		totalSize += len(it.Content)
+		isFile := it.ContentType != "text/plain" && !strings.HasPrefix(it.ContentType, "text/")
+		ci := canItem{
+			ID:          it.ID,
+			Title:       nullStrOr(it.Title, it.ID),
+			ContentType: it.ContentType,
+			Size:        web.HumanSize(len(it.Content)),
+			IsFile:      isFile,
+			Language:    it.Language.String,
+		}
+		if !isFile {
+			ci.ContentHTML = template.HTML(langpkg.HighlightCode(it.Content, it.Language.String))
+		}
+		cards = append(cards, ci)
+	}
+	h.RenderPage(w, "can.html", map[string]any{
+		"Page":           "can",
+		"ID":             can.ID,
+		"Title":          nullStrOr(can.Title, "Untitled can"),
+		"Description":    can.Description.String,
+		"HasDescription": can.Description.Valid && can.Description.String != "",
+		"HasPassword":    can.PasswordHash.Valid,
+		"Items":          cards,
+		"ItemCount":      len(cards),
+		"SizeHuman":      web.HumanSize(totalSize),
+		"CreatedAgo":     web.AgoString(can.CreatedAt),
+		"CreatedAtUnix":  can.CreatedAt,
+		"ExpiresAt":      can.ExpiresAt.Valid,
+		"ExpiresIn":      expiryStringIfValid(can.ExpiresAt),
+	})
+}
+
+// expiryStringIfValid formats remaining time for a valid expiry, "" otherwise.
+func expiryStringIfValid(ns sql.NullInt64) string {
+	if !ns.Valid {
+		return ""
+	}
+	remaining := ns.Int64 - time.Now().Unix()
+	s := remaining
+	switch {
+	case s < 3600:
+		return fmt.Sprintf("%dm", s/60)
+	case s < 86400:
+		return fmt.Sprintf("%dh", s/3600)
+	default:
+		return fmt.Sprintf("%dd", s/86400)
+	}
+}
+
+func templateEsc(s string) string {
+	r := strings.NewReplacer("&", "&amp;", "<", "&lt;", ">", "&gt;")
+	return r.Replace(s)
+}
 
 func (a *apiServer) handlePasteView(w http.ResponseWriter, r *http.Request) {
 	h := a.webHandlers()

internal/api/validate.go

@@ -9,7 +9,7 @@ import (
 	"strings"
 )
 
-// #68 input-validation helpers. Paste payloads are size-capped and list
+// #68 input-validation helpers. Paste/can payloads are size-capped and list
 // endpoints get a single place where limit/offset are parsed and clamped.
 
 // maxRequestBody returns the HTTP body cap for JSON create endpoints: the

internal/lang/highlight.go

@@ -146,9 +146,5 @@ func HighlightCode(content, langID string) string {
 	for i, line := range lines {
 		out[i] = highlightLine(line, h, langID)
 	}
-	// Note: lines are joined with "\n" on purpose — paste-lines.js splits on
-	// the newline to build its per-line .codeline blocks, then joins those
-	// with "" and strips whitespace-only text nodes (#205), so no newline
-	// text node ever reaches the rendered DOM.
 	return strings.Join(out, "\n")
 }

internal/store/attachment.go

@@ -26,10 +26,7 @@ type Attachment struct {
 	SizeHuman string `json:"-"` // template-only: human-readable size
 }
 
-// MaxFilenameLen caps stored attachment filenames (bytes) to bound DB
+const MaxFilenameLen = 255
-// rows and Content-Disposition echoes. 128 keeps names readable while
-// stopping filename-bloat abuse; longer names truncate.
-const MaxFilenameLen = 128
 
 // ErrFileTooLarge is returned when an attachment exceeds the per-file cap.
 var ErrFileTooLarge = errors.New("file too large")

internal/store/blob_test.go

@@ -105,9 +105,4 @@ func TestSanitizeFilename(t *testing.T) {
 	if got := SanitizeFilename(long); len(got) != MaxFilenameLen {
 		t.Errorf("long name len = %d want %d", len(got), MaxFilenameLen)
 	}
-	// issue #248: a 250-char multipart filename must truncate to the cap
-	repro := strings.Repeat("b", 246) + ".txt"
-	if got := SanitizeFilename(repro); len(got) != MaxFilenameLen {
-		t.Errorf("repro name len = %d want %d", len(got), MaxFilenameLen)
-	}
 }

internal/store/customslug.go

@@ -10,10 +10,9 @@ var slugRE = regexp.MustCompile(`^[a-zA-Z0-9][a-zA-Z0-9-_]{0,63}$`)
 
 // reserved words that would collide with routes
 var reservedSlugs = map[string]bool{
-	"api": true, "raw": true, "public": true,
+	"api": true, "raw": true, "can": true, "cans": true, "public": true,
 	"history": true, "static": true, "assets": true, "favicon.ico": true,
 	"new": true, "login": true, "logout": true, "admin": true, "settings": true,
-	"mine": true, "saved": true, "unlock": true, "guess": true, "f": true,
 }
 
 var ErrInvalidSlug = errors.New("custom slug must be 1-64 chars: letters, digits, dash, underscore; must start with letter or digit")
@@ -36,5 +35,12 @@ func (s *Store) SlugTaken(slug string) (bool, error) {
 	if err != nil {
 		return false, err
 	}
+	if n > 0 {
+		return true, nil
+	}
+	err = s.db.QueryRow(`SELECT COUNT(*) FROM paste_cans WHERE id = ?`, slug).Scan(&n)
+	if err != nil {
+		return false, err
+	}
 	return n > 0, nil
 }

internal/store/migration_test.go

@@ -1,108 +0,0 @@
-package store
-
-import (
-	"database/sql"
-	"path/filepath"
-	"testing"
-)
-
-// Cans feature removal (2026-10-16): opening a store on a pre-removal
-// database must drop the paste_cans table (only when empty) and the
-// pastes.can_id column. A non-empty paste_cans table is left in place.
-func TestMigrateDropsCansSchema(t *testing.T) {
-	dir := t.TempDir()
-
-	legacy := func(name string, canRows int) string {
-		db, err := sql.Open("sqlite", filepath.Join(dir, name))
-		if err != nil {
-			t.Fatalf("open raw db: %v", err)
-		}
-		defer db.Close()
-		stmts := []string{
-			`CREATE TABLE pastes (
-				id TEXT PRIMARY KEY, custom_slug TEXT UNIQUE, content TEXT NOT NULL,
-				content_type TEXT NOT NULL DEFAULT 'text/plain', language TEXT, title TEXT,
-				password_hash TEXT, expires_at INTEGER, burn_after_read INTEGER DEFAULT 0,
-				visibility TEXT NOT NULL DEFAULT 'public', can_id TEXT,
-				created_at INTEGER NOT NULL, deleted_at INTEGER,
-				view_count INTEGER NOT NULL DEFAULT 0, deletion_token TEXT
-			)`,
-			`CREATE TABLE paste_cans (
-				id TEXT PRIMARY KEY, title TEXT, description TEXT,
-				visibility TEXT NOT NULL DEFAULT 'public', password_hash TEXT,
-				created_at INTEGER NOT NULL, deleted_at INTEGER, expires_at INTEGER
-			)`,
-			`ALTER TABLE paste_cans ADD COLUMN viewer_id TEXT`,
-			`INSERT INTO pastes (id, content, content_type, visibility, can_id, created_at)
-				VALUES ('p1', 'x', 'text/plain', 'public', NULL, 1)`,
-		}
-		for _, q := range stmts {
-			if _, err := db.Exec(q); err != nil {
-				t.Fatalf("seed %q: %v", q, err)
-			}
-		}
-		for i := 0; i < canRows; i++ {
-			if _, err := db.Exec(`INSERT INTO paste_cans (id, created_at) VALUES (?, 1)`, string(rune('a'+i))); err != nil {
-				t.Fatalf("seed can row: %v", err)
-			}
-		}
-		return filepath.Join(dir, name)
-	}
-
-	intCol := func(s *Store, table, col string) int {
-		var n int
-		s.db.QueryRow(`SELECT COUNT(*) FROM pragma_table_info(?) WHERE name = ?`, table, col).Scan(&n)
-		return n
-	}
-	tableExists := func(s *Store, table string) bool {
-		var n int
-		s.db.QueryRow(`SELECT COUNT(*) FROM sqlite_master WHERE type='table' AND name=?`, table).Scan(&n)
-		return n > 0
-	}
-
-	// Empty paste_cans: table and column both dropped.
-	s1, err := OpenStore(legacy("empty.db", 0))
-	if err != nil {
-		t.Fatalf("open: %v", err)
-	}
-	defer s1.db.Close()
-	if tableExists(s1, "paste_cans") {
-		t.Error("paste_cans still exists after migrate (was empty; should be dropped)")
-	}
-	if intCol(s1, "pastes", "can_id") != 0 {
-		t.Error("pastes.can_id still exists after migrate; should be dropped")
-	}
-	// The store still works end to end.
-	if _, err := s1.CreatePaste(&Paste{Content: "hello", Visibility: "public"}); err != nil {
-		t.Fatalf("create paste on migrated db: %v", err)
-	}
-	if got := s1.QueryInt(`SELECT COUNT(*) FROM pastes`); got != 2 {
-		t.Errorf("pastes count = %d, want 2", got)
-	}
-
-	// Non-empty paste_cans: table kept, can_id still dropped.
-	s2, err := OpenStore(legacy("full.db", 2))
-	if err != nil {
-		t.Fatalf("open: %v", err)
-	}
-	defer s2.db.Close()
-	if !tableExists(s2, "paste_cans") {
-		t.Error("non-empty paste_cans was dropped; must be kept until cleaned")
-	}
-	if intCol(s2, "pastes", "can_id") != 0 {
-		t.Error("pastes.can_id still exists after migrate; should be dropped")
-	}
-
-	// Fresh database: neither the table nor the column is ever created.
-	s3, err := OpenStore(filepath.Join(dir, "fresh.db"))
-	if err != nil {
-		t.Fatalf("open fresh: %v", err)
-	}
-	defer s3.db.Close()
-	if tableExists(s3, "paste_cans") {
-		t.Error("fresh db created paste_cans")
-	}
-	if intCol(s3, "pastes", "can_id") != 0 {
-		t.Error("fresh db created pastes.can_id")
-	}
-}

internal/store/store.go

@@ -32,6 +32,7 @@ type Paste struct {
 	Visibility  string  `json:"visibility"`
 	// #83: accept "public": true/false as an alias for visibility.
 	Public *bool `json:"public,omitempty"`
+	CanID       *string `json:"can_id,omitempty"`
 	CreatedAt   int64   `json:"created_at"`
 	DeletedAt   *int64  `json:"deleted_at,omitempty"`
 	ExpiresAt   *int64  `json:"expires_at,omitempty"`
@@ -54,13 +55,26 @@ type PasteRow struct {
 	ReadsLimit    sql.NullInt64
 	ReadsUsed     int
 	Visibility    string
+	CanID         sql.NullString
 	CreatedAt     int64
 	DeletedAt     sql.NullInt64
 	ViewCount     int
 	Size          int
 	DeletionToken sql.NullString
 	ViewerID      sql.NullString
-	AttFilename   string // attachment filename when the paste is a file paste (#235); empty otherwise
+	IsCan         bool // set on list rows that are cans (#4)
+}
+
+type CanRow struct {
+	ID           string
+	Title        sql.NullString
+	Visibility   string
+	PasswordHash sql.NullString
+	CreatedAt    int64
+	DeletedAt    sql.NullInt64
+	ExpiresAt    sql.NullInt64
+	Description  sql.NullString
+	ViewerID     sql.NullString
 }
 
 type Store struct {
@@ -104,6 +118,7 @@ func (s *Store) migrate() error {
 		expires_at    INTEGER,
 		burn_after_read INTEGER DEFAULT 0,
 		visibility    TEXT NOT NULL DEFAULT 'public',
+		can_id        TEXT,
 		created_at    INTEGER NOT NULL,
 		deleted_at    INTEGER,
 		view_count    INTEGER NOT NULL DEFAULT 0,
@@ -112,32 +127,22 @@ deletion_token TEXT
 	CREATE INDEX IF NOT EXISTS idx_pastes_visibility_created ON pastes(visibility, created_at DESC);
 	CREATE INDEX IF NOT EXISTS idx_pastes_expires ON pastes(expires_at) WHERE expires_at IS NOT NULL;
 	CREATE INDEX IF NOT EXISTS idx_pastes_deleted ON pastes(deleted_at) WHERE deleted_at IS NOT NULL;
+	CREATE TABLE IF NOT EXISTS paste_cans (
+		id            TEXT PRIMARY KEY,
+		title         TEXT,
+		description   TEXT,
+		visibility    TEXT NOT NULL DEFAULT 'public',
+		password_hash TEXT,
+		created_at    INTEGER NOT NULL,
+		deleted_at    INTEGER,
+		expires_at    INTEGER
+	);
 	`)
 	s.db.Exec(`ALTER TABLE pastes ADD COLUMN deletion_token TEXT`) // ignore if exists
 	s.db.Exec(`ALTER TABLE pastes ADD COLUMN viewer_id TEXT`)     // ignore if exists (#37)
 	s.db.Exec(`ALTER TABLE pastes ADD COLUMN reads_limit INTEGER`)          // ignore if exists (#49)
 	s.db.Exec(`ALTER TABLE pastes ADD COLUMN reads_used INTEGER DEFAULT 0`) // ignore if exists (#49)
-	// Cans feature removal (owner decision 2026-10-16): drop the leftover
+	s.db.Exec(`ALTER TABLE paste_cans ADD COLUMN viewer_id TEXT`) // ignore if exists (#4)
-	// schema. paste_cans is only dropped when empty so no data is silently
-	// destroyed; a non-empty table is left in place and logged. The dormant
-	// pastes.can_id column is dropped too (prod verified clean 2026-10-16:
-	// zero rows referenced a can).
-	var tbl int
-	s.db.QueryRow(`SELECT COUNT(*) FROM sqlite_master WHERE type='table' AND name='paste_cans'`).Scan(&tbl)
-	if tbl > 0 {
-		var rows int
-		s.db.QueryRow(`SELECT COUNT(*) FROM paste_cans`).Scan(&rows)
-		if rows == 0 {
-			s.db.Exec(`DROP TABLE paste_cans`)
-		} else {
-			log.Printf("store: paste_cans still holds %d row(s); leaving the table in place (cans feature removed)", rows)
-		}
-	}
-	var col int
-	s.db.QueryRow(`SELECT COUNT(*) FROM pragma_table_info('pastes') WHERE name='can_id'`).Scan(&col)
-	if col > 0 {
-		s.db.Exec(`ALTER TABLE pastes DROP COLUMN can_id`)
-	}
 	s.db.Exec(`CREATE TABLE IF NOT EXISTS paste_views (
 		paste_id    TEXT NOT NULL,
 		viewer_id   TEXT NOT NULL,
@@ -284,10 +289,10 @@ func (s *Store) CreatePaste(p *Paste) (*Paste, error) {
 }
 
 func (s *Store) GetPaste(idOrSlug string) (*PasteRow, error) {
-	row := s.db.QueryRow(`SELECT id, custom_slug, content, content_type, language, title, password_hash, expires_at, burn_after_read, visibility, created_at, deleted_at, view_count, deletion_token, viewer_id, reads_limit, COALESCE(reads_used, 0)
+	row := s.db.QueryRow(`SELECT id, custom_slug, content, content_type, language, title, password_hash, expires_at, burn_after_read, visibility, can_id, created_at, deleted_at, view_count, deletion_token, viewer_id, reads_limit, COALESCE(reads_used, 0)
 		FROM pastes WHERE (id = ? OR custom_slug = ?) AND deleted_at IS NULL`, idOrSlug, idOrSlug)
 	var r PasteRow
-	err := row.Scan(&r.ID, &r.CustomSlug, &r.Content, &r.ContentType, &r.Language, &r.Title, &r.PasswordHash, &r.ExpiresAt, &r.BurnAfterRead, &r.Visibility, &r.CreatedAt, &r.DeletedAt, &r.ViewCount, &r.DeletionToken, &r.ViewerID, &r.ReadsLimit, &r.ReadsUsed)
+	err := row.Scan(&r.ID, &r.CustomSlug, &r.Content, &r.ContentType, &r.Language, &r.Title, &r.PasswordHash, &r.ExpiresAt, &r.BurnAfterRead, &r.Visibility, &r.CanID, &r.CreatedAt, &r.DeletedAt, &r.ViewCount, &r.DeletionToken, &r.ViewerID, &r.ReadsLimit, &r.ReadsUsed)
 	if err == sql.ErrNoRows {
 		return nil, nil
 	}
@@ -295,15 +300,18 @@ func (s *Store) GetPaste(idOrSlug string) (*PasteRow, error) {
 }
 
 // ListPublic backs /api/public and the public listing page. Visibility rules
-// mirror the history page: only non-deleted, non-expired pastes are listed,
+// mirror the history page: only non-deleted, non-expired, non-can pastes are
-// and password-protected pastes are excluded at the query level (#65) so
+// listed, and password-protected pastes are excluded at the query level
-// their metadata (title, slug, existence) never leaks.
+// (#65) so their metadata (title, slug, existence) never leaks.
 func (s *Store) ListPublic(limit, offset int) ([]PasteRow, int, error) {
-	rows, err := s.db.Query(`SELECT p.id, p.custom_slug, p.content_type, p.language, p.title, p.visibility, p.created_at, p.view_count, LENGTH(p.content), COALESCE(a.filename, '')
+	rows, err := s.db.Query(`SELECT id, custom_slug, content_type, language, title, visibility, created_at, view_count, LENGTH(content), 0
-		FROM pastes p
+		FROM pastes
-		LEFT JOIN attachments a ON a.paste_id = p.id
+		WHERE visibility='public' AND deleted_at IS NULL AND can_id IS NULL AND password_hash IS NULL AND (expires_at IS NULL OR expires_at > ?)
-		WHERE p.visibility='public' AND p.deleted_at IS NULL AND p.password_hash IS NULL AND (p.expires_at IS NULL OR p.expires_at > ?)
+		UNION ALL
-		ORDER BY p.created_at DESC LIMIT ? OFFSET ?`, time.Now().Unix(), limit, offset)
+		SELECT id, NULL, 'text/plain', NULL, title, visibility, created_at, 0, 0, 1
+		FROM paste_cans
+		WHERE visibility='public' AND deleted_at IS NULL AND (expires_at IS NULL OR expires_at > ?)
+		ORDER BY created_at DESC LIMIT ? OFFSET ?`, time.Now().Unix(), time.Now().Unix(), limit, offset)
 	if err != nil {
 		return nil, 0, err
 	}
@@ -312,27 +320,33 @@ func (s *Store) ListPublic(limit, offset int) ([]PasteRow, int, error) {
 	for rows.Next() {
 		var r PasteRow
 		var cs, lang, title sql.NullString
-		if err := rows.Scan(&r.ID, &cs, &r.ContentType, &lang, &title, &r.Visibility, &r.CreatedAt, &r.ViewCount, &r.Size, &r.AttFilename); err != nil {
+		var isCan int
+		if err := rows.Scan(&r.ID, &cs, &r.ContentType, &lang, &title, &r.Visibility, &r.CreatedAt, &r.ViewCount, &r.Size, &isCan); err != nil {
 			return nil, 0, err
 		}
 		r.CustomSlug = cs
 		r.Language = lang
 		r.Title = title
+		r.IsCan = isCan == 1
 		out = append(out, r)
 	}
 	var total int
-	s.db.QueryRow(`SELECT COUNT(*) FROM pastes WHERE visibility='public' AND deleted_at IS NULL AND password_hash IS NULL AND (expires_at IS NULL OR expires_at > ?)`,
+	s.db.QueryRow(`SELECT (SELECT COUNT(*) FROM pastes WHERE visibility='public' AND deleted_at IS NULL AND can_id IS NULL AND password_hash IS NULL AND (expires_at IS NULL OR expires_at > ?))
-		time.Now().Unix()).Scan(&total)
+		+ (SELECT COUNT(*) FROM paste_cans WHERE visibility='public' AND deleted_at IS NULL AND (expires_at IS NULL OR expires_at > ?))`,
+		time.Now().Unix(), time.Now().Unix()).Scan(&total)
 	return out, total, nil
 }
 
 // ListMine lists pastes created from the given viewer id (browser cookie), newest first.
 func (s *Store) ListMine(viewerID string, limit, offset int) ([]PasteRow, int, error) {
-	rows, err := s.db.Query(`SELECT p.id, p.custom_slug, p.language, p.title, p.visibility, p.created_at, p.view_count, LENGTH(p.content), COALESCE(a.filename, '')
+	rows, err := s.db.Query(`SELECT id, custom_slug, language, title, visibility, created_at, view_count, LENGTH(content), 0
-		FROM pastes p
+		FROM pastes
-		LEFT JOIN attachments a ON a.paste_id = p.id
+		WHERE viewer_id = ? AND deleted_at IS NULL AND can_id IS NULL AND (expires_at IS NULL OR expires_at > ?)
-		WHERE p.viewer_id = ? AND p.deleted_at IS NULL AND (p.expires_at IS NULL OR p.expires_at > ?)
+		UNION ALL
-		ORDER BY p.created_at DESC LIMIT ? OFFSET ?`, viewerID, time.Now().Unix(), limit, offset)
+		SELECT id, NULL, NULL, title, visibility, created_at, 0, 0, 1
+		FROM paste_cans
+		WHERE viewer_id = ? AND deleted_at IS NULL AND (expires_at IS NULL OR expires_at > ?)
+		ORDER BY created_at DESC LIMIT ? OFFSET ?`, viewerID, time.Now().Unix(), viewerID, time.Now().Unix(), limit, offset)
 	if err != nil {
 		return nil, 0, err
 	}
@@ -341,15 +355,18 @@ func (s *Store) ListMine(viewerID string, limit, offset int) ([]PasteRow, int, e
 	for rows.Next() {
 		var r PasteRow
 		var cs, lang, title sql.NullString
-		if err := rows.Scan(&r.ID, &cs, &lang, &title, &r.Visibility, &r.CreatedAt, &r.ViewCount, &r.Size, &r.AttFilename); err != nil {
+		var isCan int
+		if err := rows.Scan(&r.ID, &cs, &lang, &title, &r.Visibility, &r.CreatedAt, &r.ViewCount, &r.Size, &isCan); err != nil {
 			return nil, 0, err
 		}
 		r.CustomSlug, r.Language, r.Title = cs, lang, title
+		r.IsCan = isCan == 1
 		out = append(out, r)
 	}
 	var total int
-	s.db.QueryRow(`SELECT COUNT(*) FROM pastes WHERE viewer_id = ? AND deleted_at IS NULL AND (expires_at IS NULL OR expires_at > ?)`,
+	s.db.QueryRow(`SELECT (SELECT COUNT(*) FROM pastes WHERE viewer_id = ? AND deleted_at IS NULL AND can_id IS NULL AND (expires_at IS NULL OR expires_at > ?))
-		viewerID, time.Now().Unix()).Scan(&total)
+		+ (SELECT COUNT(*) FROM paste_cans WHERE viewer_id = ? AND deleted_at IS NULL AND (expires_at IS NULL OR expires_at > ?))`,
+		viewerID, time.Now().Unix(), viewerID, time.Now().Unix()).Scan(&total)
 	return out, total, nil
 }
 
@@ -412,6 +429,8 @@ func (s *Store) IncrementViews(id, viewerID string, burnWindowMinutes int) bool
 func (s *Store) SweepExpired() {
 	now := time.Now().Unix()
 	s.db.Exec(`UPDATE pastes SET deleted_at=? WHERE expires_at IS NOT NULL AND expires_at < ? AND deleted_at IS NULL`, now, now)
+	// #4: cans expire too — mirror paste behavior
+	s.db.Exec(`UPDATE paste_cans SET deleted_at=? WHERE expires_at IS NOT NULL AND expires_at < ? AND deleted_at IS NULL`, now, now)
 	grace := now - SoftDeleteGraceDays*86400
 	s.db.Exec(`DELETE FROM pastes WHERE deleted_at IS NOT NULL AND deleted_at < ?`, grace)
 }
@@ -468,6 +487,92 @@ func (s *Store) HardDelete(id string) {
 	s.db.Exec(`DELETE FROM pastes WHERE id = ?`, id)
 }
 
+// CreateCan inserts a paste_can row with optional custom slug (parity with
+// pastes: validated by the same rules, checked against both tables).
+// Returns ErrSlugTaken / ErrInvalidSlug / ErrReservedSlug on conflict.
+func (s *Store) CreateCan(canID, title, description, visibility string, pwHash *string, createdAt int64, expiresAt *int64, customSlug *string) error {
+	if customSlug != nil && *customSlug != "" {
+		slug := *customSlug
+		if err := ValidateCustomSlug(slug); err != nil {
+			return err
+		}
+		taken, err := s.SlugTaken(slug)
+		if err != nil {
+			return err
+		}
+		if taken {
+			return ErrSlugTaken
+		}
+		canID = slug
+	}
+	if visibility == "" {
+		visibility = "public"
+	}
+	if visibility != "public" && visibility != "unlisted" {
+		return errors.New("visibility must be public or unlisted")
+	}
+	_, err := s.db.Exec(`INSERT INTO paste_cans (id, title, description, visibility, password_hash, created_at, expires_at)
+		VALUES (?,?,?,?,?,?,?)`, canID, title, description, visibility, pwHash, createdAt, expiresAt)
+	return err
+}
+
+// SoftDeleteCan marks a can deleted (its items stay; they are unlisted and
+// hidden from listings by can_id and disappear with the can's page).
+func (s *Store) SoftDeleteCan(canID string) (bool, error) {
+	res, err := s.db.Exec(`UPDATE paste_cans SET deleted_at=? WHERE id=? AND deleted_at IS NULL`, time.Now().Unix(), canID)
+	if err != nil {
+		return false, err
+	}
+	n, err := res.RowsAffected()
+	return n > 0, err
+}
+
+// DeleteCan removes an (empty/aborted) can row.
+func (s *Store) DeleteCan(canID string) {
+	s.db.Exec(`DELETE FROM paste_cans WHERE id=?`, canID)
+}
+
+// InsertCanItem adds an item paste belonging to a can.
+func (s *Store) InsertCanItem(canID, title, content, contentType string, language *string, expiresAt, binary *string, now int64) error {
+	// language/expiresAt unused here for now; content stored as text (binary-safe in sqlite)
+	_, err := s.db.Exec(`INSERT INTO pastes
+		(id, content, content_type, language, title, visibility, can_id, created_at)
+		VALUES (?,?,?,?,?,?,?,?)`,
+		genSlug(6), content, contentType, language, &title, "unlisted", canID, now)
+	_ = expiresAt
+	_ = binary
+	return err
+}
+
+func (s *Store) GetCan(id string) (*CanRow, error) {
+	row := s.db.QueryRow(`SELECT id, title, visibility, password_hash, created_at, deleted_at, expires_at, description, viewer_id
+		FROM paste_cans WHERE (id = ?) AND deleted_at IS NULL`, id)
+	var c CanRow
+	err := row.Scan(&c.ID, &c.Title, &c.Visibility, &c.PasswordHash, &c.CreatedAt, &c.DeletedAt, &c.ExpiresAt, &c.Description, &c.ViewerID)
+	if err == sql.ErrNoRows {
+		return nil, nil
+	}
+	return &c, err
+}
+
+func (s *Store) ListCanItems(canID string) ([]PasteRow, error) {
+	rows, err := s.db.Query(`SELECT id, custom_slug, content, content_type, language, title, password_hash, expires_at, burn_after_read, visibility, can_id, created_at, deleted_at, view_count
+		FROM pastes WHERE can_id = ? AND deleted_at IS NULL ORDER BY created_at ASC`, canID)
+	if err != nil {
+		return nil, err
+	}
+	defer rows.Close()
+	var out []PasteRow
+	for rows.Next() {
+		var r PasteRow
+		if err := rows.Scan(&r.ID, &r.CustomSlug, &r.Content, &r.ContentType, &r.Language, &r.Title, &r.PasswordHash, &r.ExpiresAt, &r.BurnAfterRead, &r.Visibility, &r.CanID, &r.CreatedAt, &r.DeletedAt, &r.ViewCount); err != nil {
+			return nil, err
+		}
+		out = append(out, r)
+	}
+	return out, nil
+}
+
 // GenSlug is the exported slug generator.
 func GenSlug(n int) string { return genSlug(n) }
 

internal/web/csp_noinline_test.go

@@ -1,56 +0,0 @@
-package web
-
-import (
-	"embed"
-	"io/fs"
-	"regexp"
-	"strings"
-	"testing"
-)
-
-// #139 regression guards: with CSP script-src/style-src 'self' (no
-// 'unsafe-inline'), the templates must not carry inline <script> blocks or
-// style="" attributes, and the external scripts referenced must exist.
-func TestNoInlineScripts(t *testing.T) {
-	entries, err := fs.ReadDir(tmplFS, "templates")
-	if err != nil {
-		t.Fatal(err)
-	}
-	re := regexp.MustCompile(`(?s)<script[^>]*>.*?</script>`)
-	srcOnly := regexp.MustCompile(`<script[^>]+src=`)
-	for _, e := range entries {
-		b, err := fs.ReadFile(tmplFS, "templates/"+e.Name())
-		if err != nil {
-			t.Fatal(err)
-		}
-		for _, m := range re.FindAll(b, -1) {
-			if srcOnly.Match(m) {
-				continue // external script tag with src: fine
-			}
-			t.Errorf("%s: inline <script> block found (CSP #139): %q", e.Name(), string(m[:60]))
-		}
-		if strings.Contains(string(b), " onclick=") || strings.Contains(string(b), "onload=") {
-			t.Errorf("%s: inline event handler attribute found (CSP #139)", e.Name())
-		}
-		if strings.Contains(string(b), "style=\"") {
-			t.Errorf("%s: inline style attribute found (CSP #139)", e.Name())
-		}
-	}
-}
-
-func TestReferencedStaticScriptsExist(t *testing.T) {
-	entries, _ := fs.ReadDir(tmplFS, "templates")
-	var staticFiles embed.FS = staticFS
-	for _, e := range entries {
-		b, err := fs.ReadFile(tmplFS, "templates/"+e.Name())
-		if err != nil {
-			t.Fatal(err)
-		}
-		for _, m := range regexp.MustCompile(`<script src="/static/([^"]+)"`).FindAllSubmatch(b, -1) {
-			name := string(m[1])
-			if _, err := fs.ReadFile(staticFiles, "static/"+name); err != nil {
-				t.Errorf("%s references /static/%s: %v", e.Name(), name, err)
-			}
-		}
-	}
-}

internal/web/securityheaders_test.go

@@ -16,7 +16,7 @@ func TestSecurityHeaders(t *testing.T) {
 	h := SecurityHeaders(pages)
 	rec := httptest.NewRecorder()
 	h.ServeHTTP(rec, httptest.NewRequest("GET", "/", nil))
-	wantCSP := "default-src 'self'; script-src 'self'; style-src 'self'; img-src 'self' data:; frame-ancestors 'none'"
+	wantCSP := "default-src 'self'; script-src 'self' 'unsafe-inline'; style-src 'self' 'unsafe-inline'; img-src 'self' data:; frame-ancestors 'none'"
 	if got := rec.Header().Get("Content-Security-Policy"); got != wantCSP {
 		t.Errorf("CSP = %q, want %q", got, wantCSP)
 	}

internal/web/static/admin.js

@@ -1,74 +0,0 @@
-// #99/#139: admin lock + settings panel. Key lives in sessionStorage for this visit only.
-(function () {
-  var KEY = 'palette_admin_key';
-  var keyInput = document.getElementById('admin-key');
-  var status = document.getElementById('admin-key-status');
-  var panel = document.getElementById('admin-panel');
-
-  function key() { return sessionStorage.getItem(KEY) || ''; }
-
-  function api(path, opts) {
-    opts = opts || {};
-    // allow callers to override the key header (e.g. validating a typed key, #99)
-    opts.headers = Object.assign({ 'X-Admin-Key': key() }, opts.headers || {});
-    if (opts.body) opts.headers['Content-Type'] = 'application/json';
-    return fetch(path, opts);
-  }
-
-  function loadSettings() {
-    api('/admin/api/settings').then(function (r) {
-      if (r.status !== 200) { showLock(); return; }
-      return r.json();
-    }).then(function (s) {
-      if (!s) return;
-      document.getElementById('rl-burst').value = s.rate_limit_burst;
-      document.getElementById('rl-refill').value = s.rate_limit_per_minute;
-      document.getElementById('max-content').value = s.max_content_bytes;
-      document.getElementById('default-expiry').value = s.default_expiry;
-      document.getElementById('slug-days').value = s.custom_slug_reservation_days;
-      document.getElementById('burn-window').value = s.burn_viewer_window_minutes;
-      panel.classList.remove('hidden');
-    });
-  }
-
-  function showLock() {
-    panel.classList.add('hidden');
-    sessionStorage.removeItem(KEY);
-  }
-
-  document.getElementById('admin-key-form').addEventListener('submit', function (e) {
-    e.preventDefault();
-    // #99: don't persist the key until the server accepts it
-    api('/admin/api/settings', { headers: { 'X-Admin-Key': keyInput.value } }).then(function (r) {
-      if (r.status === 200) {
-        sessionStorage.setItem(KEY, keyInput.value);
-        status.textContent = '✓';
-        keyInput.value = '';
-        loadSettings();
-      } else {
-        status.textContent = 'invalid key';
-        showLock();
-      }
-    });
-  });
-
-  document.getElementById('admin-settings-form').addEventListener('submit', function (e) {
-    e.preventDefault();
-    var body = {
-      rate_limit_burst: parseFloat(document.getElementById('rl-burst').value),
-      rate_limit_per_minute: parseFloat(document.getElementById('rl-refill').value),
-      max_content_bytes: parseInt(document.getElementById('max-content').value, 10),
-      default_expiry: document.getElementById('default-expiry').value,
-      custom_slug_reservation_days: parseInt(document.getElementById('slug-days').value, 10),
-      burn_viewer_window_minutes: parseInt(document.getElementById('burn-window').value, 10)
-    };
-    api('/admin/api/settings', { method: 'POST', body: JSON.stringify(body) }).then(function (r) {
-      document.getElementById('admin-save-status').textContent = r.status === 200 ? 'saved' : 'error';
-      if (r.status !== 200) showLock();
-    });
-  });
-
-  // #112: always show the lock on fresh load — do not auto-restore the
-  // panel from a stale sessionStorage key. The key is only written after a
-  // successful unlock (above) so in-page actions still work within this visit.
-})();

internal/web/static/app.css

@@ -150,7 +150,8 @@ body {
 }
 .editor-head-title { flex: 1; min-width: 0; }
 .editor-head-settings { flex: 0 0 fit-content; }
-.editor-head-title:focus-within { border-color: var(--accent); }
+.editor-head-title:focus-within,
+.editor-head-settings:focus-within { border-color: var(--accent); }
 .editor-head input {
   border: none; outline: none; background: transparent; color: var(--fg); font: inherit; font-size: 23.2px; flex: 1;
 }
@@ -197,17 +198,11 @@ body {
   border: 1px solid var(--border); border-radius: var(--radius); padding: 5px 8px; background: var(--bg);
   color: var(--fg); font: inherit; font-size: 21.6px; width: 130px;
 }
-/* #168: compact side notification pill (paste-created feedback) */
+.created-banner {
-.created-pill {
+  display: none; padding: 10px 16px; font-size: 22.4px; background: var(--surface-2);
-  position: fixed; right: 12px; bottom: 12px; z-index: 200;
+  border-bottom: 1px solid var(--border); word-break: break-all;
-  background: var(--surface-2); color: var(--ok); border: 1px solid var(--ok);
-  border-radius: var(--radius-sm); padding: 2px 8px; font-size: 11.5px;
-  opacity: 0; pointer-events: none; transform: translateY(6px);
-  transition: opacity .25s ease, transform .25s ease;
-  box-shadow: 0 4px 16px rgba(0,0,0,.25);
 }
-.created-pill.show { opacity: 1; transform: translateY(0); }
+.created-banner a { color: var(--accent); }
-@media (max-width: 640px) { .created-pill { right: 12px; bottom: 12px; } }
 
 /* paste view */
 .meta-bar { display: flex; align-items: center; gap: 12px; padding: 12px 18px; flex-wrap: wrap; }
@@ -215,18 +210,15 @@ body {
 .slug { font-family: var(--font-mono); font-size: 21.6px; color: var(--muted-fg); background: var(--surface-2); padding: 3px 9px; border-radius: var(--radius-sm); }
 .tag { font-size: 19.8px; color: var(--muted-fg); border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 2px 9px; }
 .paste-title-bar { display: flex; align-items: center; gap: 12px; padding: 12px 18px; flex-wrap: wrap; }
-.paste-title-bar h1 { font-size: 29.2px; font-weight: 600; margin: 0; word-break: normal; overflow-wrap: anywhere; }
+.paste-title-bar h1 { font-size: 29.2px; font-weight: 600; margin: 0; }
-/* #222: .float already draws the border + radius and clips corners; the pill's own
+.stats-pill { border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; }
-   tighter border curve was getting clipped thin at the corners. Let .float be the
+.stats-head { display: flex; align-items: center; gap: 16px; width: 100%; background: none; border: 0; color: var(--muted-fg); font: inherit; font-size: 21.6px; padding: 14px 18px; cursor: pointer; text-align: left; }
-   only border/paint surface for the details pill (collapsed and expanded). */
-.stats-pill { border: 0; border-radius: 0; overflow: hidden; }
-.stats-head { display: flex; align-items: center; gap: 16px; width: 100%; background: none; border: 0; border-bottom: 1px solid var(--border); color: var(--muted-fg); font: inherit; font-size: 21.6px; padding: 14px 18px; cursor: pointer; text-align: left; }
 .stats-head:hover { color: var(--fg); background: var(--surface-2); }
 .stats-chev { width: 18px; height: 18px; flex: none; transition: transform 0.15s ease; }
 .stats-pill.open .stats-chev { transform: rotate(180deg); }
 .stats-summary { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; letter-spacing: .01em; }
 @media (max-width: 640px) { .stats-summary { white-space: normal; word-break: break-word; } }
-.stats-body { /* #169: divider under the dropdown title is the head's own persistent border-bottom */ }
+.stats-body { border-top: 1px solid var(--border); }
 .stats-grid { display: grid; grid-template-columns: max-content 1fr; gap: 6px 18px; padding: 12px 16px; font-size: 20.7px; }
 .stats-k { color: var(--muted-fg); }
 .stats-v { color: var(--fg); word-break: break-all; }
@@ -256,12 +248,6 @@ body {
 .settings-section-title { color: var(--fg); font-size: 24px; margin-bottom: 6px; }
 /* theme switcher cards (#100) */
 .theme-grid { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 14px; }
-
-/* #161: more breathing room between settings sections */
-/* #207 r2: owner wants the toggle left aligned (revert #197 centering) */
-#settings-dark-toggle { margin-bottom: 20px; }
-.settings-body h3 { margin-top: 28px; }
-.settings-body .theme-grid { margin-bottom: 8px; }
 .theme-card {
   display: flex; flex-direction: column; gap: 10px; align-items: flex-start;
   padding: 14px 16px; min-width: 180px;
@@ -275,18 +261,10 @@ body {
 .theme-name { font-weight: 600; }
 .iconbtn:hover { color: var(--fg); border-color: var(--muted); }
 /* #130: line wrap toggle, accent when active like other toggles */
-/* #166: wrap toggle must show its state: neutral when off, accent when on.
-   The .btn base is accent filled, which made on and off look identical. */
-.btn-icon.wrap-toggle { background: var(--surface-2); color: var(--muted-fg); font-size: 21.6px; font-weight: inherit; border: 1px solid var(--border); }
-.btn-icon.wrap-toggle:hover { color: var(--fg); border-color: var(--muted-fg); filter: none; }
 .iconbtn.wrap-toggle[aria-pressed="true"],
 .btn-icon.wrap-toggle[aria-pressed="true"] { background: var(--accent); color: var(--bg); border-color: var(--accent); }
 /* #152: wrap ON must break long unbroken tokens mid-word and allow no horizontal scrolling */
 html[data-wrap] .codebody { white-space: pre-wrap; overflow-wrap: anywhere; word-break: break-all; overflow-x: hidden; }
-/* #167: overflow:hidden zeroes the flex auto-minimum, so the codebody must
-   be told to fill the space left of the gutter or it collapses and the
-   gutter (flex-shrink:0) consumes the whole row */
-html[data-wrap] .code .codebody { flex: 1 1 auto; min-width: 0; }
 html[data-wrap] .editor { white-space: pre-wrap; overflow-wrap: anywhere; word-break: break-all; overflow-x: hidden; }
 /* #152: with wrap on nothing may scroll horizontally, including the code container and mobile floats */
 html[data-wrap] .code { overflow-x: hidden; }
@@ -299,33 +277,12 @@ html[data-wrap] .float { overflow-x: hidden; }
 .code-head .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--accent); }
 .code {
   font-family: var(--font-mono); font-size: var(--code-fs); line-height: var(--code-lh);
-  padding: 14px 0; display: flex; overflow-x: hidden;
+  padding: 14px 0; display: flex; overflow-x: auto;
 }
-/* #261: horizontal scroll must live on the codebody, not the .code flex
-   container — a container-level scroll takes the gutter with it when the
-   user scrolls long lines. The gutter sits OUTSIDE the scroll container and
-   stays visible; the codebody shrinks to the remaining space and scrolls
-   (min-width: 0 lets it shrink below its content width inside the flex row). */
-.code .codebody { flex: 1 1 auto; min-width: 0; overflow-x: auto; }
-/* #167: the gutter must not drive the flex layout — its content width
-   (row count × number width) shrinks the code column, which re-wraps lines,
-   which grows the gutter: a feedback loop. Pin the gutter with a fixed
-   basis, take its width out of the negotiation, and let the codebody take
-   the rest. */
-.code .gutter { flex: 0 0 auto; width: 3ch; min-width: 3ch; overflow: visible; }
 .code .gutter { flex-shrink: 0; }
 /* gutter/code share line metrics; the editor gutter keeps its own padding (#50) */
 .code .gutter { padding-top: 0; padding-bottom: 0; }
-.codebody { padding: 0 18px; white-space: pre; overflow-x: auto; }
+.codebody { padding: 0 18px; white-space: pre; }
-/* #167: each logical line is its own block so offsetTop identifies its first visual row */
-.codeline { display: block; }
-/* #167: gutter number spans must stack one per visual row (wrap on).
-   #274: the /new editor gutter uses the same .gutline blocks when its own
-   wrap toggle is on, so scope the rule to any gutter, not just .code. */
-.code .gutter .gutline, .editor-wrap .gutter .gutline { display: block; }
-/* #194: codeline blocks are adjacent (no '\n' text between them), so an
-   empty block (blank source line) needs its own line box to stay one row */
-.codeline:empty::before { content: "\200B"; }
 /* syntax highlight tokens (#1) */
 .tok-kw { color: #c792ea; }
 .tok-str { color: #a5e075; }
@@ -354,15 +311,10 @@ tr:last-child td { border-bottom: none; }
 tr.row { cursor: pointer; }
 tr.row:hover td { background: var(--surface-2); }
 tr.row:hover td a.slug { color: var(--accent); }
-/* #292: highlight the paste NAME uniformly on row hover, titled or not */
-tr.row:hover td .paste-name { color: var(--accent); }
 td a.slug { font-family: var(--font-mono); font-size: 21.6px; color: var(--fg); text-decoration: none; }
-td a.url-link { font-family: inherit; font-size: inherit; color: inherit; text-decoration: none; }
-td a.url-link:hover { color: var(--accent); }
 td a.slug:hover { color: var(--accent); }
 /* PASTE column fallback for untitled pastes: plain text, identical to a titled paste. URL/ID chips keep .slug styling. */
 td a.slug.paste-name { background: none; padding: 0; border-radius: 0; font-family: inherit; font-size: inherit; color: var(--fg); }
-td a.paste-name { color: var(--fg); text-decoration: none; font-family: inherit; font-size: inherit; }
 .badge { font-size: 18.9px; border: 1px solid var(--border); color: var(--muted-fg); border-radius: var(--radius-sm); padding: 1px 8px; }
 .badge.lock { color: var(--accent); border-color: var(--accent); }
 .dim { color: var(--muted-fg); white-space: nowrap; }
@@ -384,9 +336,6 @@ td a.paste-name { color: var(--fg); text-decoration: none; font-family: inherit;
 }
 .inner h1 { font-size: 29.2px; font-weight: 600; margin-bottom: 6px; }
 .inner .sub { font-size: 22.4px; color: var(--muted-fg); margin-bottom: 20px; }
-/* #173: missing paste message box */
-.notfound-err { color: var(--err); }
-.notfound-card .btn { display: block; margin-top: 10px; }
 .pwinput {
   width: 100%; padding: 10px 14px; border: 1px solid var(--border); border-radius: var(--radius);
   background: var(--bg); color: var(--fg); font: inherit; font-size: 23.2px; outline: none; text-align: center;
@@ -426,15 +375,15 @@ td a.paste-name { color: var(--fg); text-decoration: none; font-family: inherit;
 }
 .seg input, .toggle input { accent-color: var(--accent); width: 16px; height: 16px; margin: 0; }
 
-/* toast (#19, #168): small pill anchored to the corner, out of content flow */
+/* toast (#19) */
 .toast {
-  position: fixed; right: 16px; bottom: 16px;
+  position: fixed; left: 50%; bottom: 32px; transform: translateX(-50%) translateY(8px);
   background: var(--surface-2); color: var(--fg); border: 1px solid var(--border);
-  border-radius: var(--radius-sm); padding: 6px 12px; font-size: 13px;
+  border-radius: var(--radius-sm); padding: 6px 18px; font-size: 20.7px;
   opacity: 0; pointer-events: none; transition: opacity .25s ease, transform .25s ease; z-index: 200;
   box-shadow: 0 4px 16px rgba(0,0,0,.25);
 }
-.toast.show { opacity: 1; transform: translateY(0); }
+.toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }
 /* status variants (#16) */
 .toast.success { border-color: var(--ok); color: var(--ok); }
 .toast.error { border-color: var(--err); color: var(--err); }
@@ -448,15 +397,13 @@ td a.paste-name { color: var(--fg); text-decoration: none; font-family: inherit;
 
 /* protection section rhythm (#20) */
 .protect { display: flex; flex-direction: column; gap: 2px; }
-.protect .pw-row:not(.submenu) { padding: 2px 8px 4px; }
+.protect .pw-row { padding: 2px 8px 4px; }
 
 /* submenu number boxes (#157): styled number inputs + unit selects,
    padded + indented to line up with parent option labels */
 .submenu {
-  /* #240: indent the box under the parent option LABEL text (8px row padding
+  margin: 6px 0 4px 8px;
-     + 16px control + 8px gap = 32px), and match the row control padding rhythm */
+  padding: 8px 10px;
-  margin: 4px 0 4px 32px;
-  padding: 6px 10px;
   background: var(--bg);
   border: 1px solid var(--border);
   border-radius: var(--radius);
@@ -533,7 +480,7 @@ td a.paste-name { color: var(--fg); text-decoration: none; font-family: inherit;
 /* paste name under slug pill in Paste column (#43) */
 .paste-sub { font-size: 19.8px; color: var(--muted-fg); margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
 .paste-sub.dim { color: var(--muted); }
-td a.url-link { max-width: 100%; display: inline-block; vertical-align: middle; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; box-sizing: border-box; }
+td a.slug.url-link { max-width: 100%; display: inline-block; vertical-align: middle; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; box-sizing: border-box; }
 td .id-link { color: var(--muted-fg); text-decoration: none; font-family: var(--font-mono); font-size: 19.8px; }
 td .id-link:hover { color: var(--accent); }
 
@@ -541,11 +488,12 @@ td .id-link:hover { color: var(--accent); }
 th.sortable { cursor: pointer; user-select: none; }
 th.sortable:hover { color: var(--fg); }
 th.sortable { cursor: pointer; user-select: none; white-space: nowrap; }
-/* #209: arrow sits RIGHT of the label, vertically centered, and absolutely
+/* #101: arrow sits LEFT of the label, further spaced, vertically centered,
-   positioned so it never shifts the label text; label aligns with column contents. */
+   and absolutely positioned so it never shifts the label text. */
+th.sortable { position: relative; padding-left: 24px; }
 th.sortable .sort-ind {
-  /* #209 r2: inline right after the label text with a fixed gap, not pinned to the column edge */
+  position: absolute; left: 8px; top: 50%; transform: translateY(-50%);
-  display: inline-block; width: 0; height: 0; margin-left: 6px; vertical-align: middle;
+  display: inline-block; width: 0; height: 0;
   border-left: 5px solid transparent; border-right: 5px solid transparent;
 }
 th.sorted.asc .sort-ind { border-bottom: 6px solid var(--accent); }
@@ -593,20 +541,6 @@ a.admin-link:hover { color: var(--fg); text-decoration: underline; }
   border-color: var(--ok);
 }
 
-/* #260: static-width success feedback. Label and checkmark stack in one
-   grid cell, so the button is always as wide as the wider of the two and
-   never shifts on click. Feedback is a pure .ok class toggle. */
-.swapbtn {
-  display: inline-grid;
-}
-.swapbtn > * {
-  grid-area: 1 / 1;
-  justify-self: center;
-}
-.swapbtn .swap-check { visibility: hidden; }
-.swapbtn.ok .swap-check { visibility: visible; }
-.swapbtn.ok .swap-label { visibility: hidden; }
-
 /* headings: unified treatment (mirrors .side-section h3) */
 .settings-head h1, .paste-title-bar h1, .head-row h1, .inner h1 {
   letter-spacing: -0.01em;
@@ -676,12 +610,9 @@ a.admin-link:hover { color: var(--fg); text-decoration: underline; }
   .stats-head { font-size: 13px; }
   .stats-grid { font-size: 13px; padding: 10px 12px; }
   .code { font-size: 13px; }
-  /* #167: gutter and code must share one line box at mobile width too — a
-     taller gutter font stacks its rows taller than the code rows and every
-     number drifts off its line start */
-  .code .gutter { font-size: 13px; }
   .codebody { padding: 0 12px; }
   .footnote { font-size: 12px; padding: 8px 12px; gap: 10px; }
+  .created-banner { font-size: 13px; }
   .iconbtn { font-size: 13px; padding: 6px 10px; }
 
   /* unlock card */
@@ -694,6 +625,19 @@ a.admin-link:hover { color: var(--fg); text-decoration: underline; }
   .center .foot { font-size: 13px; }
 }
 
+/* #4: can view page + can builder */
+.can-page h1 { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
+.can-items { display: flex; flex-direction: column; gap: 12px; margin-top: 14px; }
+.can-item { padding: 12px 14px; }
+.can-item-head { display: flex; align-items: center; gap: 10px; }
+.can-item-head strong { flex: 1; word-break: break-all; }
+.can-item-body { margin-top: 8px; }
+.can-item-body summary { cursor: pointer; font-size: 19px; color: var(--muted, #888); }
+.can-item-body pre.code { margin: 8px 0 0; overflow-x: auto; }
+.can-item-row { margin-top: 8px; }
+.can-item-row .can-item-title { width: 100%; margin-bottom: 6px; }
+.can-item-row .can-item-content { width: 100%; font-family: var(--mono, monospace); resize: vertical; }
+
 /* ============================================================
    Styled controls (#123) — buttons, selects, checkboxes, radios
    match the custom URL box house pattern: 1px var(--border) on
@@ -795,19 +739,6 @@ button[type="submit"]:focus-visible,
   background: var(--surface-2);
 }
 .dropzone.dragover { border-width: 2px; }
-/* #171: uploaded-file preview replaces the editor area; image fitted inside */
-.file-preview {
-  flex: 1;
-  min-width: 0;
-  min-height: 0;
-  max-width: 100%;
-  max-height: 100%;
-  object-fit: contain;
-  border-radius: 8px;
-}
-.editor-wrap.previewing .editor,
-.editor-wrap.previewing .gutter { display: none; }
-
 .file-chip {
   display: flex; align-items: center; gap: 10px;
   border: 1px solid var(--border); border-radius: var(--radius);
@@ -821,105 +752,13 @@ button[type="submit"]:focus-visible,
   font-size: 22px; padding: 0 4px; border-radius: var(--radius-sm);
 }
 .file-chip .file-chip-remove:hover { color: var(--danger, #c0392b); }
-.attachment-bar { display: flex; flex-direction: column; gap: 10px; padding: 12px; }
+.attachment-bar { display: flex; flex-direction: column; gap: 10px; }
-/* #221: the link pill under an image preview stays a small inline chip,
+.attachment-chip {
-   left-aligned under the image, not stretched above it. */
-.attachment-bar .attachment-chip {
   display: inline-flex; align-items: center; gap: 12px; align-self: flex-start;
   border: 1px solid var(--border); border-radius: var(--radius);
-  padding: 6px 14px; text-decoration: none; color: var(--fg);
+  padding: 8px 16px; text-decoration: none; color: var(--fg);
-  background: var(--surface-2); font-size: 19px;
+  background: var(--surface-2); font-size: 21.6px;
 }
-.attachment-bar .attachment-chip:hover { border-color: var(--accent); }
+.attachment-chip:hover { border-color: var(--accent); }
-.attachment-bar .attachment-chip .attachment-name {
+.attachment-chip .attachment-size { color: var(--muted-fg); font-size: 19px; }
-  min-width: 0;
+.attachment-preview img { max-width: 480px; max-height: 360px; border-radius: var(--radius); border: 1px solid var(--border); }
-  flex: 1;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-/* #232: long filenames are truncated but the pill stays a reasonable
-   width; on narrow viewports it shrinks to the container instead of
-   overflowing the card. */
-.attachment-bar .attachment-chip {
-  max-width: 100%;
-}
-.attachment-bar .attachment-chip .attachment-name:hover {
-  white-space: normal;
-  overflow-wrap: anywhere;
-}
-/* #221: images scale to fit the viewer box, aspect ratio preserved. */
-.attachment-preview {
-  max-width: 100%;
-  align-self: flex-start;
-  /* #229: no inner border/radius of its own; the .float wrapper already
-     frames the pill (inner borders get corner-clipped by overflow:hidden).
-     Padding on .attachment-bar gives the image breathing room from the
-     pill border. */
-  border: 0;
-  border-radius: 0;
-  background: var(--surface-2);
-  overflow: hidden;
-}
-.attachment-preview img {
-  display: block;
-  max-width: 100%;
-  max-height: 70vh;
-  width: auto;
-  height: auto;
-  object-fit: contain;
-}
-
-/* #139: CSP-safe replacements for inline style attributes (style-src 'self') */
-.hidden { display: none; }
-.col-a { width: 260px; } .col-b { width: 140px; } .col-c { width: 120px; }
-.col-d { width: 90px; } .col-d2 { width: 150px; } .col-e { width: 150px; }
-.col-f { width: 100px; } .col-g { width: 120px; }
-/* #255: history's URL column had its own narrow width (col-f doubles as
-   /mine's ID column); give it a dedicated class. */
-.col-url { width: 230px; }
-/* #210: /mine rows render a delete button cell that had no declared column,
-   so under table-layout:fixed it overlapped the ID column. */
-.col-del { width: 64px; }
-.spacer-flex { flex: 1; }
-.input-num { width: 80px; }
-.input-num-sm { width: 64px; }
-.danger-hint { color: var(--danger, #c0392b); margin-top: 6px; }
-.hint-lg { font-size: 19px; }
-.mt6 { margin-top: 6px; }
-.mt18 { margin-top: 18px; }
-.toggle-inline { display: inline-flex; }
-.wrap-normal { word-break: normal; overflow-wrap: break-word; }
-.created-banner { display: block; }
-/* #167: gutter rows for wrapped paste view — one row per visual code line */
-.gutline { display: block; }
-
-/* #267: jump to top/bottom pills for long pastes and the editor.
-   Hidden unless JS (jump.js) detects content more than 2x the viewport. */
-.jumpnav {
-  position: fixed;
-  right: 18px;
-  bottom: 18px;
-  z-index: 50;
-  display: flex;
-  flex-direction: column;
-  gap: 8px;
-}
-.jumpnav.hidden { display: none; }
-.jump-btn { box-shadow: 0 4px 16px rgba(0, 0, 0, 0.25); }
-
-/* #273: theme-aware scrollbars. Standard properties first (Firefox, and
-   Chromium >= 121 honors scrollbar-color), then ::-webkit rules for finer
-   Chromium styling. Colors come from CSS vars so they track the preset. */
-* {
-  scrollbar-width: thin;
-  scrollbar-color: var(--border) transparent;
-}
-::-webkit-scrollbar { width: 10px; height: 10px; }
-::-webkit-scrollbar-track { background: transparent; }
-::-webkit-scrollbar-thumb {
-  background: var(--border);
-  border-radius: 5px;
-}
-::-webkit-scrollbar-thumb:hover { background: var(--muted-fg); }
-::-webkit-scrollbar-corner { background: transparent; }

internal/web/static/favicon.svg

@@ -1,9 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32">
-  <rect width="32" height="32" rx="7" fill="#7B5FC0"/>
-  <g fill="none" stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
-    <path d="M16 7a9 9 0 1 0 0 18c1.4 0 2-1 2-2s-.7-2.2-.7-3c0-1.1.9-2 2-2h3.2A2.5 2.5 0 0 0 25 15.5 9 9 0 0 0 16 7z"/>
-    <circle cx="11.5" cy="14.5" r="1.6" fill="#ffffff" stroke="none"/>
-    <circle cx="16" cy="11.5" r="1.6" fill="#ffffff" stroke="none"/>
-    <circle cx="20.8" cy="13.8" r="1.6" fill="#ffffff" stroke="none"/>
-  </g>
-</svg>

internal/web/static/foot.js

@@ -1,19 +0,0 @@
-// #46: live relative-time counters: tick any [data-ts] (epoch seconds) every second
-(function () {
-  function fmt(ts) {
-    const s = Math.max(0, Math.floor(Date.now() / 1000) - ts);
-    if (s < 60) return s + 's ago';
-    if (s < 3600) return Math.floor(s / 60) + 'm ago';
-    if (s < 86400) return Math.floor(s / 3600) + 'h ago';
-    return Math.floor(s / 86400) + 'd ago';
-  }
-  function tick() {
-    document.querySelectorAll('[data-ts]').forEach(el => {
-      const ts = parseInt(el.dataset.ts, 10);
-      if (!isNaN(ts)) el.textContent = fmt(ts);
-    });
-  }
-  setInterval(tick, 1000);
-  document.addEventListener('DOMContentLoaded', tick);
-  tick();
-})();

internal/web/static/history.js

@@ -1,20 +0,0 @@
-// #139: public history table + 30s auto-refresh.
-const t = PaletteTable.init({
-  endpoint: '/api/public',
-  perPage: 25,
-  hasPager: true,
-  rowHtml: it =>
-    `<tr class="row" data-href="/${t.esc(it.id)}"><td>` +
-    (it.title
-      ? `<a class="paste-name" href="/${t.esc(it.id)}">${t.esc(it.title)}</a>`
-      : `<a class="slug paste-name" href="/${t.esc(it.id)}">${t.esc(it.id)}</a>`) +
-    `</td>` +
-    `<td><span class="badge">${t.esc(it.type || it.language || 'text')}</span></td>` +
-    `<td class="dim">${t.fmtSize(it.size)}</td><td class="dim">${it.view_count}</td><td class="dim" data-ts="${it.created_at}">${t.ago(it.created_at)}</td>` +
-    (it.custom_slug ? `<td class="dim"><a class="url-link" href="/${t.esc(it.custom_slug)}">/${t.esc(it.custom_slug)}</a></td>` : `<td class="dim">none</td>`) +
-    `<td class="dim"><a class="id-link" href="/${t.esc(it.id)}">${t.esc(it.id)}</a></td></tr>`,
-  emptyFiltered: 'No pastes match your search.',
-  emptyAll: 'No pastes yet. Create the first one.',
-});
-t.load();
-setInterval(t.load, 30000); // auto-refresh history every 30s

internal/web/static/jump.js

@@ -1,51 +0,0 @@
-/* #267: jump to top / bottom controls for long content.
-   Paste view scrolls the window; the /new editor scrolls its textarea.
-   The active scroller is chosen via data-jump-scroll on the script tag. */
-(function () {
-  var nav = document.getElementById('jumpnav');
-  if (!nav) return;
-  var scroller = window;
-  var sel = nav.dataset.jumpScroll;
-  if (sel) scroller = document.querySelector(sel);
-
-  function el() {
-    return scroller === window ? document.scrollingElement : scroller;
-  }
-  function isLarge() {
-    var e = el();
-    if (!e) return false;
-    var visible = scroller === window ? window.innerHeight : e.clientHeight;
-    return e.scrollHeight > visible * 2;
-  }
-  function refresh() {
-    nav.classList.toggle('hidden', !isLarge());
-  }
-  function jump(toTop) {
-    var e = el();
-    if (!e) return;
-    if (scroller === window) {
-      window.scrollTo({ top: toTop ? 0 : e.scrollHeight });
-    } else {
-      e.scrollTop = toTop ? 0 : e.scrollHeight;
-    }
-  }
-  nav.addEventListener('click', function (ev) {
-    var b = ev.target.closest('[data-jump]');
-    if (!b) return;
-    ev.preventDefault();
-    jump(b.dataset.jump === 'top');
-  });
-  window.addEventListener('resize', refresh);
-  if (scroller !== window && scroller) scroller.addEventListener('input', refresh);
-  refresh();
-  /* #282: the first evaluation can run before the layout settles (media
-     queries, web fonts, async highlighting) and under-measure the content,
-     leaving the nav hidden on long pages. Re-check once a real layout exists
-     and after load; the ResizeObserver also catches late content growth. */
-  requestAnimationFrame(function () { requestAnimationFrame(refresh); });
-  window.addEventListener('load', refresh);
-  window.setTimeout(refresh, 300);
-  if (window.ResizeObserver && scroller === window && document.body) {
-    new ResizeObserver(refresh).observe(document.body);
-  }
-})();

internal/web/static/mine.js

@@ -1,46 +0,0 @@
-// #139: saved pastes table.
-function toast(msg, kind) {
-  let t = document.querySelector('.toast');
-  if (!t) { t = document.createElement('div'); t.className = 'toast'; document.body.appendChild(t); }
-  t.textContent = msg;
-  t.classList.remove('success', 'error');
-  if (kind === 'success') t.classList.add('success');
-  if (kind === 'error') t.classList.add('error');
-  t.classList.add('show');
-  clearTimeout(t._h);
-  t._h = setTimeout(() => t.classList.remove('show'), 2000);
-}
-
-const t = PaletteTable.init({
-  endpoint: '/api/mine',
-  perPage: 25,
-  hasPager: true,
-  rowHtml: it =>
-    `<tr class="row" data-href="/${t.esc(it.id)}"><td>` +
-    (it.title
-      ? `<a class="paste-name" href="/${t.esc(it.id)}">${t.esc(it.title)}</a>`
-      : `<a class="slug paste-name" href="/${t.esc(it.id)}">${t.esc(it.id)}</a>`) +
-    `</td>` +
-    `<td><span class="badge">${t.esc(it.type || it.language || 'text')}</span></td>` +
-    `<td class="dim">${t.fmtSize(it.size)}</td><td class="dim" data-ts="${it.created_at}">${t.ago(it.created_at)}</td>` +
-    (it.custom_slug ? `<td class="dim"><a class="url-link" href="/${t.esc(it.custom_slug)}">/${t.esc(it.custom_slug)}</a></td>` : `<td class="dim">none</td>`) +
-    `<td class="dim"><a class="id-link" href="/${t.esc(it.id)}">${t.esc(it.id)}</a></td>` +
-    `<td><button class="btn btn-icon del" data-id="${t.esc(it.id)}" title="Delete paste" aria-label="Delete paste">&times;</button></td></tr>`,
-  emptyFiltered: 'No pastes from this browser match your search.',
-  emptyAll: 'No pastes from this browser yet.',
-});
-
-// delete buttons (viewer-scoped, enforced server-side #37)
-document.getElementById('rows').addEventListener('click', async e => {
-  const del = e.target.closest('button.del');
-  if (!del) return;
-  e.stopPropagation();
-  del.disabled = true;
-  try {
-    const res = await fetch('/api/pastes/' + del.dataset.id, { method: 'DELETE' });
-    if (res.ok) { toast('Deleted', 'success'); t.load(); }
-    else { toast('Delete failed', 'error'); del.disabled = false; }
-  } catch (err) { toast('Delete failed', 'error'); del.disabled = false; }
-});
-
-t.load();

internal/web/static/new.js

@@ -1,487 +0,0 @@
-// #139: editor page logic (gutter, expiry, burn, attachments, create).
-const $ = id => document.getElementById(id);
-const content = $('content'), gutter = $('gutter');
-
-// #274: with wrap on, a logical line occupies several VISUAL rows in the
-// textarea, so one number per logical line drifts off its text (same bug the
-// paste view fixed in #167). A textarea can't be split into spans, so the
-// wrapped row count per logical line is measured with a hidden mirror div
-// that shares the editor's font, line metrics and wrapping rules, and the
-// gutter renders one .gutline block per visual row with the number on the
-// FIRST row of its logical line (fillers elsewhere).
-let mirror = null;
-function measureRows(lines) {
-  if (!mirror) {
-    mirror = document.createElement('div');
-    mirror.style.position = 'absolute';
-    mirror.style.visibility = 'hidden';
-    mirror.style.top = '0';
-    mirror.style.left = '-9999px';
-    document.body.appendChild(mirror);
-  }
-  const cs = getComputedStyle(content);
-  mirror.style.font = cs.font;
-  mirror.style.lineHeight = cs.lineHeight;
-  mirror.style.whiteSpace = 'pre-wrap';
-  mirror.style.overflowWrap = 'anywhere';
-  mirror.style.wordBreak = 'break-all';
-  mirror.style.width = (content.clientWidth - parseFloat(cs.paddingLeft) - parseFloat(cs.paddingRight)) + 'px';
-  const lh = parseFloat(cs.lineHeight) || 1;
-  const starts = [];
-  let total = 0;
-  const n = Math.max(lines.length, 1);
-  for (let i = 0; i < n; i++) {
-    // A trailing newline yields an empty last line: it still occupies one row.
-    mirror.textContent = lines[i] + '\n';
-    let rows = Math.max(1, Math.round(mirror.getBoundingClientRect().height / lh));
-    starts.push(total);
-    total += rows;
-  }
-  return { starts, total };
-}
-
-function updateGutter() {
-  const lines = content.value.split('\n');
-  const n = Math.max(lines.length, 1);
-  if (!document.documentElement.hasAttribute('data-wrap')) {
-    let s = '';
-    for (let i = 1; i <= n; i++) s += i + '\n';
-    gutter.textContent = s.slice(0, -1);
-    return;
-  }
-  const { starts, total } = measureRows(lines);
-  gutter.textContent = '';
-  const frag = document.createDocumentFragment();
-  const spans = [];
-  for (let r = 0; r < total; r++) {
-    const c = document.createElement('span');
-    c.className = 'gutline';
-    c.textContent = '\u00a0';
-    spans.push(c);
-    frag.appendChild(c);
-  }
-  gutter.appendChild(frag);
-  for (let j = 0; j < starts.length; j++) spans[starts[j]].textContent = String(j + 1);
-}
-content.addEventListener('input', updateGutter);
-// #274: the wrap toggle and width changes re-wrap the textarea; re-measure.
-new MutationObserver(updateGutter).observe(document.documentElement, { attributes: true, attributeFilter: ['data-wrap'] });
-window.addEventListener('resize', updateGutter);
-// #259: the editor scrolls itself; keep the gutter's numbers in step with it.
-content.addEventListener('scroll', () => { gutter.scrollTop = content.scrollTop; });
-updateGutter();
-
-function toast(msg, kind) {
-  let t = document.querySelector('.toast');
-  if (!t) { t = document.createElement('div'); t.className = 'toast'; document.body.appendChild(t); }
-  t.textContent = msg;
-  t.classList.remove('success', 'error');
-  if (kind === 'success') t.classList.add('success');
-  if (kind === 'error') t.classList.add('error');
-  t.classList.add('show');
-  clearTimeout(t._h);
-  t._h = setTimeout(() => t.classList.remove('show'), 2000);
-}
-const setHidden = (id, hid) => { const el = $(id); if (el) el.classList.toggle('hidden', hid); };
-$('haspw').addEventListener('change', e => setHidden('pwrow', !e.target.checked));
-$('burn').addEventListener('change', e => setHidden('burnrow', !e.target.checked));
-document.querySelectorAll('input[name="exp"]').forEach(r => r.addEventListener('change', () => {
-  setHidden('customexp-row', document.querySelector('input[name="exp"]:checked').value !== 'custom');
-  setHidden('customexp-err', true);
-}));
-
-// compose the expires_in Go-duration string when Custom is checked (#48).
-// Returns the string, or null with an inline error shown.
-function composeCustomExpiry() {
-  const n = parseInt($('expnum').value, 10);
-  const unit = $('expunit').value;
-  let mins = NaN;
-  if (n > 0) {
-    if (unit === 'm') mins = n;
-    else if (unit === 'h') mins = n * 60;
-    else if (unit === 'd') mins = n * 1440;
-    else if (unit === 'w') mins = n * 10080;
-    else if (unit === 'mo') mins = n * 43200; // months counted as 30 days
-  }
-  const err = $('customexp-err');
-  if (!(mins >= 1)) {
-    err.textContent = 'Enter a duration of at least 1 minute.';
-    err.classList.remove('hidden');
-    return null;
-  }
-  if (mins > 525600) { // more than 1 year
-    err.textContent = 'Custom expiry cannot exceed 1 year.';
-    err.classList.remove('hidden');
-    return null;
-  }
-  err.classList.add('hidden');
-  // compose as h (+d/m remainders); Go parses '336h', '90m', '6h30m' fine
-  const hours = Math.floor(mins / 60), rem = mins % 60;
-  if (rem === 0) return hours + 'h';
-  if (hours === 0) return rem + 'm';
-  return hours + 'h' + rem + 'm';
-}
-
-$('pwreveal').addEventListener('click', () => {
-  const pw = $('password');
-  const show = pw.type === 'password';
-  pw.type = show ? 'text' : 'password';
-  $('pwreveal').classList.toggle('off', !show);
-  $('pwreveal').title = show ? 'Hide password' : 'Show password';
-});
-
-let guessed = ''; // last auto-detected language, '' = user override
-
-// #105: map backend machine-readable error codes to plain-language guidance.
-// Unknown codes fall back to a generic message; the technical detail stays
-// in the API response for API consumers.
-const ERROR_MESSAGES = {
-  slug_taken: 'That Custom URL is already taken. Try another.',
-  slug_reserved: 'That Custom URL is reserved. Try another.',
-  slug_invalid: 'Please keep the Custom URL under 64 characters, using only letters, numbers, dashes, or underscores.',
-  content_empty: 'Write or paste something first.',
-  content_too_large: 'This paste is too large. The limit is 5 MB.',
-  file_too_large: 'File is too large. The limit is 25 MB.',
-  one_file_only: 'Choose either text or a file for now.',
-  expiry_invalid: 'Please pick an expiry between 1 minute and 1 year.',
-  rate_limited: 'Too many tries. Wait a minute and try again.',
-};
-const GENERIC_ERROR = 'Something went wrong. Please try again.';
-
-function friendlyError(data) {
-  return ERROR_MESSAGES[data && data.code] || GENERIC_ERROR;
-}
-
-// #105: color the result box by outcome — success (ok), error (err),
-// warning (warn) — with a colored left border (CSS .result-ok/.result-err).
-function setResultKind(kind) {
-  const card = $('result-card');
-  card.classList.remove('result-ok', 'result-err', 'result-warn');
-  if (kind) card.classList.add('result-' + kind);
-}
-
-function showResult(html, kind) {
-  $('result').innerHTML = html;
-  $('result').dataset.token = kind === 'ok' ? ($('result').dataset.token || '') : ($('result').dataset.token || '');
-  setHidden('result-card', false);
-  setResultKind(kind === 'ok' ? 'ok' : (kind === 'warn' ? 'warn' : 'err'));
-}
-function defaultFilename(lang) {
-  const names = {
-    python: 'Python.py', go: 'main.go', javascript: 'script.js', typescript: 'index.ts',
-    rust: 'main.rs', c: 'main.c', cpp: 'main.cpp', java: 'Main.java', bash: 'script.sh',
-    sql: 'query.sql', yaml: 'config.yaml', json: 'data.json', html: 'index.html',
-    css: 'style.css', xml: 'doc.xml', php: 'index.php', ruby: 'main.rb',
-    perl: 'main.pl', lua: 'main.lua', dockerfile: 'Dockerfile', toml: 'config.toml',
-    ini: 'config.ini', diff: 'changes.diff',
-    markdown: 'notes.md', text: 'Text.txt',
-  };
-  return names[lang] || '';
-}
-// fill default filename when title is still blank
-function maybeSetDefaultTitle(lang) {
-  const title = $('title');
-  if (lang && !title.value.trim()) {
-    const fn = defaultFilename(lang);
-    if (fn) title.value = fn;
-  }
-}
-
-async function guessLang() {
-  if (!content.value.trim()) return;
-  try {
-    const res = await fetch('/api/guess-language', {
-      method: 'POST',
-      headers: {'Content-Type': 'application/json'},
-      body: JSON.stringify({content: content.value}),
-    });
-    const data = await res.json();
-    if (res.ok && data.language) {
-      guessed = data.language;
-      $('language').value = data.language;
-      maybeSetDefaultTitle(data.language);
-    }
-  } catch(e) {}
-}
-
-// refresh button: always re-detect, even if user picked something
-$('reguess').addEventListener('click', guessLang);
-
-// auto-guess when pasting into the editor
-content.addEventListener('paste', () => setTimeout(guessLang, 0));
-
-async function create() {
-  // #38: file attached -> file paste (1 file = 1 paste; text is ignored)
-  if (attachedFile) return createFilePaste();
-
-  const body = {
-    content: content.value,
-    title: $('title').value || null,
-    language: $('language').value || null,
-    custom_slug: $('custom').value || null,
-    burn_after_read: $('burn').checked,
-  };
-  if ($('burn').checked) body.burn_after_reads = parseInt($('burnreads').value, 10) || 1;
-  if ($('haspw').checked) body.password = $('password').value;
-  const exp = document.querySelector('input[name="exp"]:checked').value;
-  if (exp === 'custom') {
-    const dur = composeCustomExpiry();
-    if (dur === null) { toast('Check the custom expiry', 'error'); return; }
-    body.expires_in = dur;
-  } else if (exp) {
-    body.expires_in = exp;
-  }
-
-  const res = await fetch('/api/pastes', {
-    method: 'POST',
-    headers: {'Content-Type': 'application/json'},
-    body: JSON.stringify(body),
-  });
-  const data = await res.json();
-  if (!res.ok) {
-    showResult(friendlyError(data), 'err');
-    toast('Create failed', 'error');
-    return;
-  }
-  finishCreate(data);
-}
-
-// shared success handling for both create paths (#38): result box, copy
-// button, password auto-unlock, then redirect to the paste.
-function finishCreate(data) {
-  const url = location.origin + '/' + (data.custom_slug || data.id);
-  // #260 attempt 2: .swapbtn markup — label and checkmark share one grid
-  // cell, so the button width is static and feedback is a class toggle.
-  showResult('<a href="' + url + '">' + url + '</a> <button class="btn btn-icon swapbtn" id="result-copy" title="Copy URL" type="button"><span class="swap-label">Copy</span><span class="swap-check">✓</span></button>', 'ok');
-  $('result').dataset.token = data.deletion_token || '';
-  const copyBtn = document.getElementById('result-copy');
-  copyBtn.addEventListener('click', () => {
-    try {
-      navigator.clipboard.writeText(url);
-      copyBtn.classList.add('ok');               // in-place success feedback (#53)
-      setTimeout(() => copyBtn.classList.remove('ok'), 2000);
-    } catch(e) { toast('Copy failed', 'error'); }
-  });
-  // token carried via sessionStorage, never in the URL (#143)
-  const dest = '/' + data.id + '?created=1';
-  try { sessionStorage.setItem('deletion_token_' + data.id, data.deletion_token || ''); } catch(e) {}
-  // password-protected: unlock now with the password we already have (#26)
-  if ($('haspw').checked && data.id) {
-    const fd = new FormData();
-    fd.append('password', $('password').value);
-    fd.append('next', dest);
-    try {
-      fetch('/' + data.id, {method: 'POST', body: fd}).finally(() => { location.href = dest; });
-      return;
-    } catch(e) {}
-  }
-  // show the paste
-  location.href = dest;
-}
-$('create').addEventListener('click', create);
-
-// #38: file attachment support — 1 file = 1 paste. Three input paths:
-// Ctrl+V paste of a file, upload button (file picker), drag-and-drop.
-const MAX_FILE_BYTES = 25 * 1024 * 1024;
-let attachedFile = null; // the single attached File, or null
-
-function humanSize(n) {
-  if (n >= 1048576) return (n / 1048576).toFixed(1) + ' MB';
-  if (n >= 1024) return (n / 1024).toFixed(1) + ' KB';
-  return n + ' B';
-}
-
-// #171: text-file extensions -> language key for title placeholder
-// convention (e.g. Python.py); fallback Text.
-const LANG_BY_EXT = {
-  py: 'python', go: 'go', js: 'javascript', mjs: 'javascript', ts: 'typescript',
-  tsx: 'typescript', rs: 'rust', c: 'c', h: 'c', cpp: 'cpp', cc: 'cpp', hpp: 'cpp',
-  java: 'java', cs: 'csharp', sh: 'bash', bash: 'bash', sql: 'sql', yml: 'yaml',
-  yaml: 'yaml', json: 'json', html: 'html', htm: 'html', css: 'css', xml: 'xml',
-  php: 'php', rb: 'ruby', pl: 'perl', lua: 'lua', toml: 'toml', ini: 'ini',
-  diff: 'diff', md: 'markdown', txt: 'text', log: 'text',
-};
-const TEXT_EXTS = new Set(Object.keys(LANG_BY_EXT));
-
-function extOf(name) {
-  const i = name.lastIndexOf('.');
-  return i >= 0 ? name.slice(i + 1).toLowerCase() : '';
-}
-
-// #171: when a file is attached it takes over the main editing area.
-// Images render fitted into the editor area; text files load their
-// content into the editor. Title auto-fills only if still blank (house
-// rule: never overwrite a typed title).
-const IMAGE_RE = /^image\//;
-let previewURL = null;
-
-// #171: CSP img-src only allows 'self' and data:, so blob: URLs are
-// blocked — read the file as a data: URL via FileReader instead.
-function readFileDataURL(file, cb) {
-  const r = new FileReader();
-  r.onload = () => cb(r.result);
-  r.readAsDataURL(file);
-}
-
-async function showFileInEditor(file) {
-  const wrap = document.querySelector('.editor-wrap');
-  const img = $('file-preview');
-  if (IMAGE_RE.test(file.type)) {
-    readFileDataURL(file, (dataURL) => {
-      previewURL = dataURL;
-      img.src = dataURL;
-      img.alt = file.name;
-      wrap.classList.add('previewing');
-      img.classList.remove('hidden');
-    });
-    return;
-  }
-  wrap.classList.remove('previewing');
-  img.classList.add('hidden');
-  if (!TEXT_EXTS.has(extOf(file.name))) return; // unknown binary: leave editor alone
-  try {
-    const text = await file.text();
-    // #184: the file replaces the main editing area, so the text always
-    // loads over whatever was in the editor (same rule as images, which
-    // hide the editor entirely).
-    content.value = text;
-    updateGutter();
-    guessLang();
-  } catch (e) {}
-}
-
-function clearPreview() {
-  const wrap = document.querySelector('.editor-wrap');
-  const img = $('file-preview');
-  wrap.classList.remove('previewing');
-  img.classList.add('hidden');
-  img.removeAttribute('src');
-  if (previewURL) { URL.revokeObjectURL(previewURL); previewURL = null; }
-}
-
-function setAttachedFile(file) {
-  if (!file) return clearAttachedFile();
-  if (file.size > MAX_FILE_BYTES) {
-    toast('File is too large. The limit is 25 MB.', 'error');
-    return;
-  }
-  attachedFile = file;
-  renderFileChip();
-  setHidden('file-text-note', false);
-  // #233: title auto-fill — the file's own name always wins when the
-  // title is still blank; fallback is date.fileextension (e.g.
-  // 2026-09-10.txt) when the name is missing or unusable. Never
-  // overwrite a typed title.
-  if (!$('title').value.trim()) {
-    const raw = (file.name || '').trim();
-    if (raw) {
-      $('title').value = raw;
-    } else {
-      const d = new Date();
-      const iso = d.getFullYear() + '-' + String(d.getMonth() + 1).padStart(2, '0') + '-' + String(d.getDate()).padStart(2, '0');
-      const ext = extOf(raw || file.name);
-      $('title').value = ext ? iso + '.' + ext : iso;
-    }
-  }
-  showFileInEditor(file);
-}
-
-function clearAttachedFile() {
-  attachedFile = null;
-  $('file-input').value = '';
-  renderFileChip();
-  setHidden('file-text-note', true);
-  clearPreview();
-}
-
-function renderFileChip() {
-  const slot = $('file-chip-slot');
-  slot.innerHTML = '';
-  if (!attachedFile) return;
-  const chip = document.createElement('div');
-  chip.className = 'file-chip';
-  chip.innerHTML = '<span class="file-chip-name"></span>' +
-    '<span class="file-chip-size">' + humanSize(attachedFile.size) + '</span>' +
-    '<button type="button" class="file-chip-remove" title="Remove file">&times;</button>';
-  chip.querySelector('.file-chip-name').textContent = attachedFile.name;
-  chip.querySelector('.file-chip-remove').addEventListener('click', clearAttachedFile);
-  slot.appendChild(chip);
-}
-
-// (1) file picker via the dropzone click
-$('dropzone').addEventListener('click', () => $('file-input').click());
-$('file-input').addEventListener('change', () => {
-  if ($('file-input').files.length) setAttachedFile($('file-input').files[0]);
-});
-
-// (2) drag-and-drop onto the dropzone (and the page broadly)
-const dz = $('dropzone');
-['dragenter', 'dragover'].forEach(ev => {
-  document.addEventListener(ev, e => {
-    if (!e.dataTransfer || ![...e.dataTransfer.types].includes('Files')) return;
-    e.preventDefault();
-    dz.classList.add('dragover');
-  });
-});
-['dragleave', 'drop'].forEach(ev => {
-  document.addEventListener(ev, e => {
-    if (ev === 'drop') e.preventDefault();
-    if (e.target === dz || ev === 'drop') dz.classList.remove('dragover');
-  });
-});
-document.addEventListener('drop', e => {
-  if (!e.dataTransfer || !e.dataTransfer.files.length) return;
-  e.preventDefault();
-  setAttachedFile(e.dataTransfer.files[0]);
-});
-
-// (3) Ctrl+V of a file anywhere on the page
-document.addEventListener('paste', e => {
-  const files = e.clipboardData && e.clipboardData.files;
-  if (!files || !files.length) return; // normal text paste into the editor
-  e.preventDefault();
-  setAttachedFile(files[0]);
-});
-
-// file create path: POST multipart. 1 file = 1 paste: when a file is
-// attached the editor text is ignored (server enforces this too).
-async function createFilePaste() {
-  const fd = new FormData();
-  fd.append('file', attachedFile);
-  if ($('title').value) fd.append('title', $('title').value);
-  if ($('custom').value) fd.append('custom_slug', $('custom').value);
-  if ($('haspw').checked) fd.append('password', $('password').value);
-  if ($('burn').checked) {
-    fd.append('burn_after_read', 'true');
-    fd.append('burn_after_reads', String(parseInt($('burnreads').value, 10) || 1));
-  }
-  if ($('unlisted').checked) fd.append('visibility', 'unlisted');
-  const exp = document.querySelector('input[name="exp"]:checked').value;
-  if (exp === 'custom') {
-    const dur = composeCustomExpiry();
-    if (dur === null) { toast('Check the custom expiry', 'error'); return; }
-    fd.append('expires_in', dur);
-  } else if (exp) {
-    fd.append('expires_in', exp);
-  }
-  const res = await fetch('/api/pastes', { method: 'POST', body: fd });
-  const data = await res.json();
-  if (!res.ok) {
-    showResult(friendlyError(data), 'err');
-    toast('Create failed', 'error');
-    return;
-  }
-  finishCreate(data);
-}
-
-// reset stale result state when returning via Back (bfcache) (#28)
-window.addEventListener('pageshow', e => {
-  if (!e.persisted) return;
-  const rc = document.getElementById('result-card');
-  if (rc) rc.classList.add('hidden');
-  const r = document.getElementById('result');
-  if (r) { r.innerHTML = 'empty'; delete r.dataset.token; }
-});
-document.addEventListener('keydown', e => {
-  if ((e.ctrlKey || e.metaKey) && e.key === 'Enter') { e.preventDefault(); create(); }
-});

internal/web/static/paste-lines.js

@@ -1,140 +0,0 @@
-// #167: with line wrapping on, a logical line can occupy several visual
-// lines; the gutter must show one number per VISUAL line, and each number
-// must sit on the visual row where its logical line STARTS. Per-line spans
-// give each logical line its own box so offsetTop order stays correct even
-// when highlighting spans cross no line boundaries.
-(function () {
-  var body = document.getElementById('codebody');
-  var gutter = document.getElementById('gutter');
-  var code = document.getElementById('code');
-  if (!body || !gutter || !code) return;
-
-  var wrapOn = function () {
-    return document.documentElement.hasAttribute('data-wrap');
-  };
-
-  // Wrap each logical line (split on newline; spans never contain newlines
-  // because HighlightCode highlights per line) in a .codeline block. The
-  // spans are display:block, so they are joined with '' — a '\n' join leaves
-  // newline text nodes between blocks that pre-wrap renders as an extra line
-  // box per line, which would shift every following number down one row (#167,
-  // #205). Whitespace-only text nodes are also stripped defensively below: any
-  // that reach the DOM (older cached HTML, other templates) render as phantom
-  // rows under white-space: pre and drift the gutter.
-  function splitLines() {
-    var html = body.innerHTML;
-    var parts = html.split('\n');
-    var out = [];
-    for (var i = 0; i < parts.length; i++) {
-      out.push('<span class="codeline">' + parts[i] + '</span>');
-    }
-    body.innerHTML = out.join('');
-    // #205: strip whitespace-only text nodes between the .codeline blocks.
-    var ws = [];
-    for (var n = body.firstChild; n; n = n.nextSibling) {
-      if (n.nodeType === 3 && !/\S/.test(n.nodeValue)) ws.push(n);
-    }
-    for (var w = 0; w < ws.length; w++) body.removeChild(ws[w]);
-  }
-
-  // One .gutline block per visual row. The gutter must reproduce the code
-  // column's REAL rendered rows: each number goes on the visual row whose top
-  // matches its .codeline's top (a line wrapping to N rows gets its number on
-  // the FIRST of those rows), and filler rows pad the gaps. Geometry is
-  // measured, not derived from span counts or heights.
-  function renumber() {
-    var lines = body.querySelectorAll('.codeline');
-    // #257: size the gutter column to the widest line number so numbers in
-    // the 100s+ fit their own column instead of bleeding into the code text.
-    // The gutter is box-sizing: border-box, so the column width must be the
-    // digits PLUS the 10px left + 10px right padding; at the CSS default 3ch
-    // the padding alone leaves only ~19px of content, and any 2+ digit
-    // number overflows into the code. Numbers are right-aligned, and the
-    // width below fits the widest number exactly. Set via CSSOM (CSP
-    // forbids inline style attributes). Only touch the width when it
-    // changes: the resize observer below re-runs renumber() when the gutter
-    // width reflows the code column, and rewriting the same value would
-    // ping-pong the fixed point forever.
-    var digits = String(lines.length || 1).length;
-    var w = 'calc(' + digits + 'ch + 20px)';
-    if (gutter.style.width !== w) {
-      gutter.style.minWidth = w;
-      gutter.style.width = w;
-    }
-    if (!wrapOn() || !lines.length) {
-      // wrap OFF: one number per logical line (pre-existing behavior,
-      // including the gutter scrolling with horizontal scroll).
-      var s = '';
-      for (var k = 1; k <= lines.length; k++) s += k + '\n';
-      gutter.textContent = lines.length ? s.slice(0, -1) : '1';
-      return;
-    }
-
-    // Read all rects first: batching layout reads before the writes below
-    // avoids interleaved read/write reflows.
-    var bodyTop = body.getBoundingClientRect().top;
-    var lh = parseFloat(getComputedStyle(body).lineHeight) || 1;
-    var rowIdx = [];
-    var totalRows = 1;
-    for (var i = 0; i < lines.length; i++) {
-      var row = Math.round((lines[i].getBoundingClientRect().top - bodyTop) / lh);
-      if (row < 0) row = 0;
-      rowIdx.push(row);
-      if (row + 1 > totalRows) totalRows = row + 1;
-    }
-    if (totalRows < lines.length) totalRows = lines.length;
-    gutter.textContent = '';
-    var frag = document.createDocumentFragment();
-    var spans = [];
-    for (var r = 0; r < totalRows; r++) {
-      var cell = document.createElement('span');
-      cell.className = 'gutline';
-      cell.textContent = '\u00a0';
-      spans.push(cell);
-      frag.appendChild(cell);
-    }
-    gutter.appendChild(frag);
-    for (var j = 0; j < rowIdx.length; j++) {
-      spans[rowIdx[j]].textContent = String(j + 1);
-    }
-    // A wrapped line whose last visual row is only partially filled can
-    // settle a hair under N * line-height after the gutter is rebuilt; a
-    // gutter pass that changes the code column width reflows it. Verify the
-    // placement one frame later and re-run if any line's row moved (#167).
-    var placed = [];
-    for (var p = 0; p < rowIdx.length; p++) placed.push(rowIdx[p]);
-    requestAnimationFrame(function () {
-      var moved = false;
-      var bodyTop2 = body.getBoundingClientRect().top;
-      var lh2 = parseFloat(getComputedStyle(body).lineHeight) || lh;
-      var tops2 = [];
-      for (var q2 = 0; q2 < lines.length; q2++) tops2.push(lines[q2].getBoundingClientRect().top);
-      for (var q3 = 0; q3 < tops2.length; q3++) {
-        if (Math.round((tops2[q3] - bodyTop2) / lh2) !== placed[q3]) { moved = true; break; }
-      }
-      if (moved) renumber();
-    });
-  }
-
-  splitLines();
-  renumber();
-
-  // Re-renumber on toggle (theme.js toggles data-wrap on <html>) and on any
-  // size change (paste of lots of text, window resize, zoom). Only width
-  // changes of the code column affect wrapping, so observe width only —
-  // height changes caused by our own renumbering must not re-trigger.
-  var mo = new MutationObserver(renumber);
-  mo.observe(document.documentElement, { attributes: true, attributeFilter: ['data-wrap'] });
-  var lastW = body.getBoundingClientRect().width;
-  if (window.ResizeObserver) {
-    var ro = new ResizeObserver(function () {
-      var w = body.getBoundingClientRect().width;
-      if (Math.abs(w - lastW) < 0.5) return;
-      lastW = w;
-      renumber();
-    });
-    ro.observe(body);
-  } else {
-    window.addEventListener('resize', renumber);
-  }
-})();

internal/web/static/paste.js

@@ -1,65 +0,0 @@
-// #53/#139: paste viewer page logic. Paste id arrives via <body data-paste-id>.
-function toast(msg) {
-  let t = document.querySelector('.toast');
-  if (!t) { t = document.createElement('div'); t.className = 'toast'; document.body.appendChild(t); }
-  t.textContent = msg;
-  t.classList.add('show');
-  clearTimeout(t._h);
-  t._h = setTimeout(() => t.classList.remove('show'), 2000);
-}
-function toggleStats() {
-  const body = document.getElementById('stats-body');
-  const pill = document.getElementById('stats-pill');
-  const btn = document.getElementById('stats-toggle');
-  const open = body.hidden;
-  body.hidden = !open;
-  pill.classList.toggle('open', open);
-  btn.setAttribute('aria-expanded', open ? 'true' : 'false');
-}
-function copyFeedback(btn) {
-  if (!btn) return;
-  // #260 attempt 2: .swapbtn stacks the label and checkmark in the same grid
-  // cell, so the button width is always the wider of the two and never moves.
-  // Feedback is a pure class toggle; no width pinning, no textContent swap.
-  btn.classList.add('ok');
-  clearTimeout(btn._okh);
-  btn._okh = setTimeout(() => btn.classList.remove('ok'), 2000);
-}
-function copyContent(btn) {
-  navigator.clipboard.writeText(document.getElementById('raw-content').value)
-    .then(() => copyFeedback(btn))
-    .catch(() => toast('Copy failed'));
-}
-// #243: copy the paste LINK (full URL), not the paste id or content
-function copyLink(btn) {
-  const url = location.origin + location.pathname;
-  navigator.clipboard.writeText(url)
-    .then(() => copyFeedback(btn))
-    .catch(() => toast('Copy failed'));
-}
-function redeem() {
-  if (!confirm('Hard delete this paste immediately?')) return;
-  let tok = '';
-  try { tok = sessionStorage.getItem('deletion_token_' + PASTE_ID) || ''; } catch(e) {}
-  if (!tok) { alert('deletion token not available in this browser'); return; }
-  fetch('/api/pastes/' + PASTE_ID + '/redeem', {method: 'DELETE', headers: {'Authorization': 'Bearer ' + tok}})
-    .then(r => { if (r.ok) location.href = '/public'; else alert('delete failed'); });
-}
-
-// wiring (moved from inline handlers for CSP #139)
-var PASTE_ID = document.currentScript.getAttribute('data-paste-id');
-var copyBtn = document.getElementById('copy-btn');
-if (copyBtn) copyBtn.addEventListener('click', function (e) { e.preventDefault(); copyContent(copyBtn); });
-var copyLinkBtn = document.getElementById('copy-link-btn');
-if (copyLinkBtn) copyLinkBtn.addEventListener('click', function (e) { e.preventDefault(); copyLink(copyLinkBtn); });
-var delBtn = document.getElementById('delete-btn');
-
-// #168: show the compact paste-created pill in the bottom corner, then fade it out
-const createdPill = document.getElementById('created-pill');
-if (createdPill) {
-  requestAnimationFrame(() => createdPill.classList.add('show'));
-  setTimeout(() => createdPill.classList.remove('show'), 4000);
-}
-if (delBtn) delBtn.addEventListener('click', function (e) { e.preventDefault(); redeem(); });
-var statsToggle = document.getElementById('stats-toggle');
-if (statsToggle) statsToggle.addEventListener('click', toggleStats);

internal/web/static/settings.js

@@ -1,108 +0,0 @@
-// #112/#127/#139: theme switcher. Swatch colors are derived from computed CSS vars per preset.
-(function () {
-  // #112: derive each preset's swatches from the real CSS variables in
-  // app.css by temporarily applying data-preset, so they can never drift.
-  // #127: 5 theme pairs, light swatches top row, dark bottom row.
-  var pairs = [
-    { id: 'midnight',        name: 'Midnight' },
-    { id: 'smooth',          name: 'Smooth' },
-    { id: 'pastel-lavender', name: 'Pastel Lavender' },
-    { id: 'pastel-peach',    name: 'Pastel Peach' },
-    { id: 'pastel-cloud',    name: 'Pastel Cloud' }
-  ];
-  var SWATCH_VARS = ['--bg', '--surface', '--surface-2', '--muted', '--accent'];
-
-  function presetColors(id) {
-    var root = document.documentElement;
-    var prev = root.getAttribute('data-preset');
-    root.setAttribute('data-preset', id);
-    var cs = getComputedStyle(root);
-    var colors = SWATCH_VARS.map(function (v) { return cs.getPropertyValue(v).trim(); });
-    if (prev === null) root.removeAttribute('data-preset'); else root.setAttribute('data-preset', prev);
-    return colors;
-  }
-
-  // current base pair + dark flag from the resolved data-preset.
-  // "midnight" is itself the dark variant, so check dark ids first.
-  function state() {
-    var p = document.documentElement.dataset.preset || 'midnight';
-    if (p === 'midnight' || /-dark$/.test(p)) {
-      return { base: p === 'midnight' ? 'midnight' : p.replace(/-dark$/, ''), dark: true };
-    }
-    return { base: p === 'midnight-light' ? 'midnight' : p, dark: false };
-  }
-
-  var grid = document.getElementById('theme-grid');
-  var cards = {};
-  // #132: midnight is dark-first (root preset = midnight = dark; its light
-  // variant is midnight-light), the others are light-first. Resolve the
-  // LIGHT and DARK preset ids generically so the light swatches always
-  // render in the top row of every card.
-  function lightPreset(id) {
-    if (id === 'midnight') return 'midnight-light';
-    return id; // light-first bases use themselves as the light variant
-  }
-  function darkPreset(id) {
-    if (id === 'midnight') return 'midnight'; // root preset is midnight's dark
-    return id + '-dark';
-  }
-  pairs.forEach(function (t) {
-    var light = presetColors(lightPreset(t.id));
-    var dark = presetColors(darkPreset(t.id));
-    var btn = document.createElement('button');
-    btn.type = 'button';
-    btn.className = 'theme-card';
-    btn.setAttribute('aria-pressed', 'false');
-    btn.setAttribute('data-pair', t.id);
-    // #139: build the swatches via DOM APIs (CSSOM styles) instead of
-    // innerHTML strings: re-parsing serialized inline styles would trip
-    // style-src 'self'.
-    var label = document.createElement('strong');
-    label.textContent = t.name;
-    btn.appendChild(label);
-    [light, dark].forEach(function (colors) {
-      var row = document.createElement('span');
-      row.className = 'swatches';
-      colors.forEach(function (c) {
-        var sw = document.createElement('span');
-        sw.className = 'swatch';
-        sw.style.backgroundColor = c;
-        row.appendChild(sw);
-      });
-      btn.appendChild(row);
-    });
-    btn.addEventListener('click', function () {
-      var dark = state().dark;
-      // #294: use the generic variant resolvers - midnight is dark-first
-      // (dark preset = 'midnight', light = 'midnight-light'), so a raw
-      // t.id + '-dark' build landed on nonexistent/forced-dark presets.
-      document.documentElement.dataset.preset = dark ? darkPreset(t.id) : lightPreset(t.id);
-      try { localStorage.setItem('palette-theme', t.id); } catch (e) {}
-      Object.keys(cards).forEach(function (k) { cards[k].setAttribute('aria-pressed', 'false'); });
-      btn.setAttribute('aria-pressed', 'true');
-    });
-    cards[t.id] = btn;
-    grid.appendChild(btn);
-  });
-
-  function sync() {
-    var s = state();
-    Object.keys(cards).forEach(function (k) {
-      cards[k].setAttribute('aria-pressed', k === s.base ? 'true' : 'false');
-    });
-    var dt = document.getElementById('settings-dark-toggle');
-    if (dt) dt.setAttribute('aria-pressed', s.dark ? 'true' : 'false');
-  }
-  sync();
-  // topbar.js already binds every .dark-toggle (deferred, so the settings
-  // button exists by then). Only wire here if it somehow did not run,
-  // otherwise the button would toggle twice per click and never change (#197).
-  var dt = document.getElementById('settings-dark-toggle');
-  if (dt && !dt.dataset.darkWired) {
-    dt.addEventListener('click', function () {
-      var btns = document.querySelectorAll('.topbar .dark-toggle');
-      if (btns.length) btns[0].click(); else document.dispatchEvent(new CustomEvent('palette-darkchange'));
-    });
-  }
-  document.addEventListener('palette-darkchange', sync);
-})();

internal/web/static/table.js

@@ -16,7 +16,7 @@ const PaletteTable = (() => {
   const sortVal = (it, k) => {
     let v = it[k];
     if (k === 'title' || k === 'custom_slug') v = (v == null || v === '') ? null : String(v).toLowerCase();
-    if (k === 'language' || k === 'type') v = (v == null || v === '') ? 'text' : String(v).toLowerCase();
+    if (k === 'language') v = (v == null || v === '') ? 'text' : String(v).toLowerCase();
     if (k === 'size' || k === 'view_count' || k === 'created_at') return v == null ? -1 : v;
     return v == null ? null : v;
   };
@@ -79,10 +79,10 @@ const PaletteTable = (() => {
         const rows = $('rows'), empty = $('empty');
         if (!items.length) {
           rows.innerHTML = '';
-          empty.classList.remove('hidden');
+          empty.style.display = 'block';
           empty.textContent = filtered ? opts.emptyFiltered : opts.emptyAll;
         } else {
-          empty.classList.add('hidden');
+          empty.style.display = 'none';
           rows.innerHTML = items.map(opts.rowHtml).join('');
         }
 
@@ -97,14 +97,14 @@ const PaletteTable = (() => {
             const view = items.slice(fOff, fOff + opts.perPage);
             rows.innerHTML = view.length ? view.map(opts.rowHtml).join('') : '';
             if (!view.length) {
-              empty.classList.remove('hidden');
+              empty.style.display = 'block';
               empty.textContent = filtered ? opts.emptyFiltered : opts.emptyAll;
             }
             showing.textContent = `Showing ${view.length === 0 ? 0 : fOff+1}–${fOff+view.length} of ${items.length.toLocaleString()} ${filtered ? 'matches' : 'sorted'} · page ${state.page} of ${filtPages}`;
             const btns = [];
             const add = (label, target, o={}) => btns.push(`<button ${o.on?'class="on"':''} ${o.dis?'disabled':''} data-p="${target}">${label}</button>`);
             add('‹', state.page-1, {dis: state.page===1});
-            const win = new Set([1, state.page-1, state.page, state.page+1, filtPages]);
+            const win = new Set([1, 2, state.page-1, state.page, state.page+1, filtPages]);
             let last = 0;
             for (let i = 1; i <= filtPages; i++) {
               if (win.has(i)) {
@@ -121,7 +121,7 @@ const PaletteTable = (() => {
             const btns = [];
             const add = (label, target, o={}) => btns.push(`<button ${o.on?'class="on"':''} ${o.dis?'disabled':''} data-p="${target}">${label}</button>`);
             add('‹', state.page-1, {dis: state.page===1});
-            const win = new Set([1, state.page-1, state.page, state.page+1, pages]);
+            const win = new Set([1, 2, state.page-1, state.page, state.page+1, pages]);
             let last = 0;
             for (let i = 1; i <= pages; i++) {
               if (win.has(i)) {

internal/web/static/theme.js

@@ -1,78 +0,0 @@
-// #16/#100/#127: theme preset resolution. Runs in <head> (blocking) so the
-// correct data-preset is set before first paint. The server default dark flag
-// arrives via the script tag's data-default-dark attribute so no inline script is needed.
-// #130: shared line wrap preference (localStorage 'palette-wrap', default off).
-// preset hook (#16): ?theme= wins; else persisted choice (#100).
-// #127: theme pairs - each base theme has a light and dark variant;
-// palette-theme stores the base id, palette-dark the dark flag.
-(function () {
-  var PAIRS = {
-    'midnight':        { light: 'midnight-light',       dark: 'midnight' },
-    'smooth':          { light: 'smooth',               dark: 'smooth-dark' },
-    'pastel-lavender': { light: 'pastel-lavender',      dark: 'pastel-lavender-dark' },
-    'pastel-peach':    { light: 'pastel-peach',         dark: 'pastel-peach-dark' },
-    'pastel-cloud':    { light: 'pastel-cloud',         dark: 'pastel-cloud-dark' }
-  };
-  function resolve(t, dark) {
-    for (var base in PAIRS) {
-      if (t === PAIRS[base].light || t === PAIRS[base].dark) return t;
-      if (t === base) return dark ? PAIRS[base].dark : PAIRS[base].light;
-    }
-    return null;
-  }
-  var t = new URLSearchParams(location.search).get('theme');
-  // precedence: URL ?theme= > stored pair+dark prefs > server default dark > dark on
-  var dark = (document.currentScript && document.currentScript.getAttribute('data-default-dark')) === '1';
-  try {
-    var stored = localStorage.getItem('palette-dark');
-    if (stored !== null) dark = stored !== 'false';
-  } catch (e) {}
-  if (t) {
-    // URL ?theme= wins and accepts both base and variant ids; a variant id
-    // also sets the dark flag and normalizes t back to its base pair id.
-    var found = false;
-    for (var base in PAIRS) {
-      if (t === PAIRS[base].dark) { dark = true; t = base; found = true; break; }
-      if (t === PAIRS[base].light) { dark = false; t = base; found = true; break; }
-      if (t === base) { found = true; break; }
-    }
-    if (!found) t = null;
-  }
-  if (!t) {
-    try { t = localStorage.getItem('palette-theme'); } catch (e) {}
-  }
-  if (!PAIRS[t]) t = 'midnight';
-  // do not persist anything here: URL theme is a one-off override
-  document.documentElement.dataset.preset = dark ? PAIRS[t].dark : PAIRS[t].light;
-})();
-// #130: shared line wrap preference (localStorage 'palette-wrap', default off)
-(function () {
-  function wrapOn() {
-    try { return localStorage.getItem('palette-wrap') === '1'; } catch (e) { return false; }
-  }
-  function wrapApply(on) {
-    if (on) document.documentElement.setAttribute('data-wrap', '1');
-    else document.documentElement.removeAttribute('data-wrap');
-    document.querySelectorAll('.wrap-toggle').forEach(function (b) {
-      b.setAttribute('aria-pressed', on ? 'true' : 'false');
-    });
-    var s = document.getElementById('wrap-setting');
-    if (s) s.checked = on;
-  }
-  window.paletteWrapToggle = function () {
-    var on = !wrapOn();
-    try { localStorage.setItem('palette-wrap', on ? '1' : '0'); } catch (e) {}
-    wrapApply(on);
-    return on;
-  };
-  document.addEventListener('DOMContentLoaded', function () {
-    wrapApply(wrapOn());
-    document.querySelectorAll('.wrap-toggle').forEach(function (b) {
-      b.addEventListener('click', function () { window.paletteWrapToggle(); });
-    });
-    var s = document.getElementById('wrap-setting');
-    if (s) s.addEventListener('change', function () {
-      if (s.checked !== wrapOn()) window.paletteWrapToggle();
-    });
-  });
-})();

internal/web/static/topbar.js

@@ -1,47 +0,0 @@
-// #127: dark mode toggle: flips to the other variant of the active pair.
-// #127: dark mode toggle - flips to the other variant of the active pair.
-  (function () {
-    var PAIRS = {
-      'midnight':        { light: 'midnight-light',       dark: 'midnight' },
-      'smooth':          { light: 'smooth',               dark: 'smooth-dark' },
-      'pastel-lavender': { light: 'pastel-lavender',      dark: 'pastel-lavender-dark' },
-      'pastel-peach':    { light: 'pastel-peach',         dark: 'pastel-peach-dark' },
-      'pastel-cloud':    { light: 'pastel-cloud',         dark: 'pastel-cloud-dark' }
-    };
-    var root = document.documentElement;
-    function state() {
-      var p = root.dataset.preset || 'midnight';
-      for (var base in PAIRS) {
-        if (p === PAIRS[base].dark) return { base: base, dark: true };
-        if (p === PAIRS[base].light) return { base: base, dark: false };
-      }
-      return { base: 'midnight', dark: true };
-    }
-    function apply() {
-      var s = state();
-      document.body.classList.toggle('dark', s.dark);
-      root.classList.toggle('dark', s.dark);
-    }
-    function sync(btns) {
-      btns.forEach(function (b) {
-        b.setAttribute('aria-pressed', state().dark ? 'true' : 'false');
-      });
-    }
-    var btns = document.querySelectorAll('.dark-toggle');
-    apply();
-    sync(Array.prototype.slice.call(btns));
-    btns.forEach(function (b) {
-      // mark as wired so settings.js does not add a second handler
-      // (#197: double-binding made the settings toggle flip twice = no-op)
-      b.dataset.darkWired = '1';
-      b.addEventListener('click', function () {
-        var s = state();
-        var dark = !s.dark;
-        root.dataset.preset = dark ? PAIRS[s.base].dark : PAIRS[s.base].light;
-        try { localStorage.setItem('palette-dark', dark ? 'true' : 'false'); } catch (e) {}
-        apply();
-        sync(Array.prototype.slice.call(btns));
-        document.dispatchEvent(new CustomEvent('palette-darkchange'));
-      });
-    });
-  })();

internal/web/static/unlock.js

@@ -1,7 +0,0 @@
-// #139: unlock page: password reveal toggle.
-document.getElementById('pwreveal').addEventListener('click', () => {
-  const pw = document.getElementById('password');
-  const show = pw.type === 'password';
-  pw.type = show ? 'text' : 'password';
-  document.getElementById('pwreveal').title = show ? 'Hide password' : 'Show password';
-});

internal/web/templates/admin.html

@@ -12,7 +12,7 @@
         <span id="admin-key-status"></span>
       </form>
 
-      <div id="admin-panel" class="hidden">
+      <div id="admin-panel" style="display:none">
         <h2>Settings</h2>
         <form id="admin-settings-form">
           <table>
@@ -30,5 +30,79 @@
     </div>
   </div>
 </div>
-<script src="/static/admin.js" defer></script>
+<script>
+(function () {
+  var KEY = 'palette_admin_key';
+  var keyInput = document.getElementById('admin-key');
+  var status = document.getElementById('admin-key-status');
+  var panel = document.getElementById('admin-panel');
+
+  function key() { return sessionStorage.getItem(KEY) || ''; }
+
+  function api(path, opts) {
+    opts = opts || {};
+    // allow callers to override the key header (e.g. validating a typed key, #99)
+    opts.headers = Object.assign({ 'X-Admin-Key': key() }, opts.headers || {});
+    if (opts.body) opts.headers['Content-Type'] = 'application/json';
+    return fetch(path, opts);
+  }
+
+  function loadSettings() {
+    api('/admin/api/settings').then(function (r) {
+      if (r.status !== 200) { showLock(); return; }
+      return r.json();
+    }).then(function (s) {
+      if (!s) return;
+      document.getElementById('rl-burst').value = s.rate_limit_burst;
+      document.getElementById('rl-refill').value = s.rate_limit_per_minute;
+      document.getElementById('max-content').value = s.max_content_bytes;
+      document.getElementById('default-expiry').value = s.default_expiry;
+      document.getElementById('slug-days').value = s.custom_slug_reservation_days;
+      document.getElementById('burn-window').value = s.burn_viewer_window_minutes;
+      panel.style.display = '';
+    });
+  }
+
+  function showLock() {
+    panel.style.display = 'none';
+    sessionStorage.removeItem(KEY);
+  }
+
+  document.getElementById('admin-key-form').addEventListener('submit', function (e) {
+    e.preventDefault();
+    // #99: don't persist the key until the server accepts it
+    api('/admin/api/settings', { headers: { 'X-Admin-Key': keyInput.value } }).then(function (r) {
+      if (r.status === 200) {
+        sessionStorage.setItem(KEY, keyInput.value);
+        status.textContent = '✓';
+        keyInput.value = '';
+        loadSettings();
+      } else {
+        status.textContent = 'invalid key';
+        showLock();
+      }
+    });
+  });
+
+  document.getElementById('admin-settings-form').addEventListener('submit', function (e) {
+    e.preventDefault();
+    var body = {
+      rate_limit_burst: parseFloat(document.getElementById('rl-burst').value),
+      rate_limit_per_minute: parseFloat(document.getElementById('rl-refill').value),
+      max_content_bytes: parseInt(document.getElementById('max-content').value, 10),
+      default_expiry: document.getElementById('default-expiry').value,
+      custom_slug_reservation_days: parseInt(document.getElementById('slug-days').value, 10),
+      burn_viewer_window_minutes: parseInt(document.getElementById('burn-window').value, 10)
+    };
+    api('/admin/api/settings', { method: 'POST', body: JSON.stringify(body) }).then(function (r) {
+      document.getElementById('admin-save-status').textContent = r.status === 200 ? 'saved' : 'error';
+      if (r.status !== 200) showLock();
+    });
+  });
+
+  // #112: always show the lock on fresh load — do not auto-restore the
+  // panel from a stale sessionStorage key. The key is only written after a
+  // successful unlock (above) so in-page actions still work within this visit.
+})();
+</script>
 {{template "foot" .}}

internal/web/templates/can.html

@@ -0,0 +1,36 @@
+{{template "head" .}}
+{{template "topbar" .}}
+<div class="center">
+  <div class="float can-page" style="max-width:900px; width:100%;">
+    <div class="inner">
+      <h1>{{.Title}} <span class="badge" title="This is a can — a bundle of pastes">can</span></h1>
+      {{if .HasDescription}}<p class="sub">{{.Description}}</p>{{end}}
+      <p class="hint">{{.ItemCount}} item{{if ne .ItemCount 1}}s{{end}} · {{.SizeHuman}} · created <span data-ts="{{.CreatedAtUnix}}">{{.CreatedAgo}}</span>{{if .ExpiresAt}} · expires in {{.ExpiresIn}}{{end}}{{if .HasPassword}} · password protected{{end}}</p>
+
+      <div class="can-items">
+        {{range .Items}}
+        <div class="can-item float">
+          <div class="can-item-head">
+            <strong>{{.Title}}</strong>
+            <span class="dim">{{.Size}}</span>
+            {{if .IsFile}}
+              <a class="btn btn-icon" href="/api/cans/{{$.ID}}/items/{{.ID}}" download="{{.Title}}" title="Download file" aria-label="Download {{.Title}}">↓</a>
+            {{else}}
+              <a class="btn btn-icon" href="/api/cans/{{$.ID}}/items/{{.ID}}" title="Raw item" aria-label="Raw {{.Title}}">⧉</a>
+            {{end}}
+          </div>
+          {{if not .IsFile}}
+          <details class="can-item-body">
+            <summary>Show content</summary>
+            <pre class="code"><code>{{.ContentHTML}}</code></pre>
+          </details>
+          {{else}}
+          <div class="hint">Attached file — use the download button above.</div>
+          {{end}}
+        </div>
+        {{end}}
+      </div>
+    </div>
+  </div>
+</div>
+{{template "foot" .}}

internal/web/templates/foot.html

@@ -1 +1,21 @@
-{{define "foot"}}<script src="/static/foot.js" defer></script>{{end}}
+{{define "foot"}}<script>
+// live relative-time counters (#46): tick any [data-ts] (epoch seconds) every second
+(function () {
+  function fmt(ts) {
+    const s = Math.max(0, Math.floor(Date.now() / 1000) - ts);
+    if (s < 60) return s + 's ago';
+    if (s < 3600) return Math.floor(s / 60) + 'm ago';
+    if (s < 86400) return Math.floor(s / 3600) + 'h ago';
+    return Math.floor(s / 86400) + 'd ago';
+  }
+  function tick() {
+    document.querySelectorAll('[data-ts]').forEach(el => {
+      const ts = parseInt(el.dataset.ts, 10);
+      if (!isNaN(ts)) el.textContent = fmt(ts);
+    });
+  }
+  setInterval(tick, 1000);
+  document.addEventListener('DOMContentLoaded', tick);
+  tick();
+})();
+</script>{{end}}

internal/web/templates/history.html

@@ -8,19 +8,19 @@
   <div class="search"><input id="filter" placeholder="Search…"><span class="search-spinner" id="search-spinner"></span></div>
   <div class="float">
     <table>
-      <colgroup><col class="col-a"><col class="col-b"><col class="col-c"><col class="col-d"><col class="col-e"><col class="col-url"><col class="col-g"></colgroup>
+      <colgroup><col style="width:260px"><col style="width:140px"><col style="width:120px"><col style="width:96px"><col style="width:140px"><col style="width:190px"><col style="width:100px"></colgroup>
       <thead><tr>
-        <th data-sort="title" class="sortable">Paste<span class="sort-ind"></span></th>
+        <th data-sort="title" class="sortable"><span class="sort-ind"></span>Paste</th>
-        <th data-sort="type" class="sortable">Type<span class="sort-ind"></span></th>
+        <th data-sort="language" class="sortable"><span class="sort-ind"></span>Language</th>
-        <th data-sort="size" class="sortable">Size<span class="sort-ind"></span></th>
+        <th data-sort="size" class="sortable"><span class="sort-ind"></span>Size</th>
-        <th data-sort="view_count" class="sortable">Views<span class="sort-ind"></span></th>
+        <th data-sort="view_count" class="sortable"><span class="sort-ind"></span>Views</th>
-        <th data-sort="created_at" class="sortable">Created<span class="sort-ind"></span></th>
+        <th data-sort="created_at" class="sortable"><span class="sort-ind"></span>Created</th>
-        <th data-sort="custom_slug" class="sortable">URL<span class="sort-ind"></span></th>
+        <th data-sort="custom_slug" class="sortable"><span class="sort-ind"></span>URL</th>
-        <th data-sort="id" class="sortable">ID<span class="sort-ind"></span></th>
+        <th data-sort="id" class="sortable"><span class="sort-ind"></span>ID</th>
       </tr></thead>
       <tbody id="rows"></tbody>
     </table>
-    <div class="empty hidden" id="empty">No pastes yet. Create the first one.</div>
+    <div class="empty" id="empty" style="display:none">No pastes yet. Create the first one.</div>
   </div>
   <div class="pager float">
     <span id="showing"></span>
@@ -28,5 +28,25 @@
   </div>
 </div>
 <script src="/static/table.js"></script>
-<script src="/static/history.js" defer></script>
+<script>
+const t = PaletteTable.init({
+  endpoint: '/api/public',
+  perPage: 25,
+  hasPager: true,
+  rowHtml: it =>
+    `<tr class="row" data-href="/${t.esc(it.id)}"><td>` +
+    (it.title
+      ? `${t.esc(it.title)}${it.is_can ? ' <span class="badge" title="Can — bundle of items">can</span>' : ''}`
+      : `<a class="slug paste-name" href="/${t.esc(it.id)}">${t.esc(it.id)}</a>${it.is_can ? ' <span class="badge" title="Can — bundle of items">can</span>' : ''}`) +
+    `</td>` +
+    `<td><span class="badge">${t.esc(it.language || 'text')}</span></td>` +
+    `<td class="dim">${t.fmtSize(it.size)}</td><td class="dim">${it.view_count}</td><td class="dim" data-ts="${it.created_at}">${t.ago(it.created_at)}</td>` +
+    (it.custom_slug ? `<td><a class="slug url-link" href="/${t.esc(it.custom_slug)}">/${t.esc(it.custom_slug)}</a></td>` : `<td class="dim">none</td>`) +
+    `<td class="dim"><a class="id-link" href="/${t.esc(it.id)}">${t.esc(it.id)}</a></td></tr>`,
+  emptyFiltered: 'No pastes match your search.',
+  emptyAll: 'No pastes yet. Create the first one.',
+});
+t.load();
+setInterval(t.load, 30000); // auto-refresh history every 30s
+</script>
 {{template "foot" .}}

internal/web/templates/layout.html

@@ -2,17 +2,91 @@
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <link rel="stylesheet" href="/static/app.css">
-<link rel="icon" type="image/svg+xml" href="/static/favicon.svg">
+<script>
-<script src="/static/theme.js" data-default-dark="{{ if defaultDark }}1{{ else }}0{{ end }}"></script>
+// preset hook (#16): ?theme= wins; else persisted choice (#100).
+// #127: theme pairs - each base theme has a light and dark variant;
+// palette-theme stores the base id, palette-dark the dark flag.
+(function () {
+  var PAIRS = {
+    'midnight':        { light: 'midnight-light',       dark: 'midnight' },
+    'smooth':          { light: 'smooth',               dark: 'smooth-dark' },
+    'pastel-lavender': { light: 'pastel-lavender',      dark: 'pastel-lavender-dark' },
+    'pastel-peach':    { light: 'pastel-peach',         dark: 'pastel-peach-dark' },
+    'pastel-cloud':    { light: 'pastel-cloud',         dark: 'pastel-cloud-dark' }
+  };
+  function resolve(t, dark) {
+    for (var base in PAIRS) {
+      if (t === PAIRS[base].light || t === PAIRS[base].dark) return t;
+      if (t === base) return dark ? PAIRS[base].dark : PAIRS[base].light;
+    }
+    return null;
+  }
+  var t = new URLSearchParams(location.search).get('theme');
+  // precedence: URL ?theme= > stored pair+dark prefs > server default dark > dark on
+  var dark = {{ defaultDark }};
+  try {
+    var stored = localStorage.getItem('palette-dark');
+    if (stored !== null) dark = stored !== 'false';
+  } catch (e) {}
+  if (t) {
+    // URL ?theme= wins and accepts both base and variant ids; a variant id
+    // also sets the dark flag and normalizes t back to its base pair id.
+    var found = false;
+    for (var base in PAIRS) {
+      if (t === PAIRS[base].dark) { dark = true; t = base; found = true; break; }
+      if (t === PAIRS[base].light) { dark = false; t = base; found = true; break; }
+      if (t === base) { found = true; break; }
+    }
+    if (!found) t = null;
+  }
+  if (!t) {
+    try { t = localStorage.getItem('palette-theme'); } catch (e) {}
+  }
+  if (!PAIRS[t]) t = 'midnight';
+  // do not persist anything here: URL theme is a one-off override
+  document.documentElement.dataset.preset = dark ? PAIRS[t].dark : PAIRS[t].light;
+})();
+// #130: shared line wrap preference (localStorage 'palette-wrap', default off)
+(function () {
+  function wrapOn() {
+    try { return localStorage.getItem('palette-wrap') === '1'; } catch (e) { return false; }
+  }
+  function wrapApply(on) {
+    if (on) document.documentElement.setAttribute('data-wrap', '1');
+    else document.documentElement.removeAttribute('data-wrap');
+    document.querySelectorAll('.wrap-toggle').forEach(function (b) {
+      b.setAttribute('aria-pressed', on ? 'true' : 'false');
+    });
+    var s = document.getElementById('wrap-setting');
+    if (s) s.checked = on;
+  }
+  window.paletteWrapToggle = function () {
+    var on = !wrapOn();
+    try { localStorage.setItem('palette-wrap', on ? '1' : '0'); } catch (e) {}
+    wrapApply(on);
+    return on;
+  };
+  document.addEventListener('DOMContentLoaded', function () {
+    wrapApply(wrapOn());
+    document.querySelectorAll('.wrap-toggle').forEach(function (b) {
+      b.addEventListener('click', function () { window.paletteWrapToggle(); });
+    });
+    var s = document.getElementById('wrap-setting');
+    if (s) s.addEventListener('change', function () {
+      if (s.checked !== wrapOn()) window.paletteWrapToggle();
+    });
+  });
+})();
+</script>
 {{end}}
 
 {{define "topbar"}}
   <div class="topbar">
-    <a class="logo" href="/public">Palette <em>/ {{ version }}</em></a>
+    <a class="logo" href="/history">Palette <em>/ {{ version }}</em></a>
     <nav>
       <a href="/new" {{if eq .Page "new"}}class="on"{{end}}>New</a>
-      <a href="/public" {{if eq .Page "public"}}class="on"{{end}}>Public</a>
+      <a href="/history" {{if eq .Page "history"}}class="on"{{end}}>Public</a>
-      <a href="/saved" {{if eq .Page "saved"}}class="on"{{end}}>Saved</a>
+      <a href="/mine" {{if eq .Page "mine"}}class="on"{{end}}>Saved</a>
       <a href="https://git.archfox.org/poslop/palette" target="_blank" rel="noopener">Git<svg class="ext" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"/><polyline points="15 3 21 3 21 9"/><line x1="10" y1="14" x2="21" y2="3"/></svg></a>
     </nav>
     <div class="spacer"></div>
@@ -24,5 +98,49 @@
       <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="12" cy="12" r="3"/><path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z"/></svg>
     </a>
   </div>
-  <script src="/static/topbar.js" defer></script>
+  <script>
+  // #127: dark mode toggle - flips to the other variant of the active pair.
+  (function () {
+    var PAIRS = {
+      'midnight':        { light: 'midnight-light',       dark: 'midnight' },
+      'smooth':          { light: 'smooth',               dark: 'smooth-dark' },
+      'pastel-lavender': { light: 'pastel-lavender',      dark: 'pastel-lavender-dark' },
+      'pastel-peach':    { light: 'pastel-peach',         dark: 'pastel-peach-dark' },
+      'pastel-cloud':    { light: 'pastel-cloud',         dark: 'pastel-cloud-dark' }
+    };
+    var root = document.documentElement;
+    function state() {
+      var p = root.dataset.preset || 'midnight';
+      for (var base in PAIRS) {
+        if (p === PAIRS[base].dark) return { base: base, dark: true };
+        if (p === PAIRS[base].light) return { base: base, dark: false };
+      }
+      return { base: 'midnight', dark: true };
+    }
+    function apply() {
+      var s = state();
+      document.body.classList.toggle('dark', s.dark);
+      root.classList.toggle('dark', s.dark);
+    }
+    function sync(btns) {
+      btns.forEach(function (b) {
+        b.setAttribute('aria-pressed', state().dark ? 'true' : 'false');
+      });
+    }
+    var btns = document.querySelectorAll('.dark-toggle');
+    apply();
+    sync(Array.prototype.slice.call(btns));
+    btns.forEach(function (b) {
+      b.addEventListener('click', function () {
+        var s = state();
+        var dark = !s.dark;
+        root.dataset.preset = dark ? PAIRS[s.base].dark : PAIRS[s.base].light;
+        try { localStorage.setItem('palette-dark', dark ? 'true' : 'false'); } catch (e) {}
+        apply();
+        sync(Array.prototype.slice.call(btns));
+        document.dispatchEvent(new CustomEvent('palette-darkchange'));
+      });
+    });
+  })();
+  </script>
 {{end}}

internal/web/templates/mine.html

@@ -8,19 +8,18 @@
   <div class="search"><input id="filter" placeholder="Search…"><span class="search-spinner" id="search-spinner"></span></div>
   <div class="float">
     <table>
-      <colgroup><col class="col-a"><col class="col-b"><col class="col-c"><col class="col-d2"><col class="col-url"><col class="col-f"><col class="col-del"></colgroup>
+      <colgroup><col style="width:260px"><col style="width:140px"><col style="width:120px"><col style="width:150px"><col style="width:190px"><col style="width:100px"></colgroup>
       <thead><tr>
-        <th data-sort="title" class="sortable">Paste<span class="sort-ind"></span></th>
+        <th data-sort="title" class="sortable"><span class="sort-ind"></span>Paste</th>
-        <th data-sort="type" class="sortable">Type<span class="sort-ind"></span></th>
+        <th data-sort="language" class="sortable"><span class="sort-ind"></span>Language</th>
-        <th data-sort="size" class="sortable">Size<span class="sort-ind"></span></th>
+        <th data-sort="size" class="sortable"><span class="sort-ind"></span>Size</th>
-        <th data-sort="created_at" class="sortable">Created<span class="sort-ind"></span></th>
+        <th data-sort="created_at" class="sortable"><span class="sort-ind"></span>Created</th>
-        <th data-sort="custom_slug" class="sortable">URL<span class="sort-ind"></span></th>
+        <th data-sort="custom_slug" class="sortable"><span class="sort-ind"></span>URL</th>
-        <th data-sort="id" class="sortable">ID<span class="sort-ind"></span></th>
+        <th data-sort="id" class="sortable"><span class="sort-ind"></span>ID</th>
-        <th aria-label="Delete"></th>
       </tr></thead>
       <tbody id="rows"></tbody>
     </table>
-    <div class="empty hidden" id="empty">No pastes from this browser yet.</div>
+    <div class="empty" id="empty" style="display:none">No pastes from this browser yet.</div>
   </div>
   <div class="pager float">
     <span id="showing"></span>
@@ -28,5 +27,51 @@
   </div>
 </div>
 <script src="/static/table.js"></script>
-<script src="/static/mine.js" defer></script>
+<script>
+function toast(msg, kind) {
+  let t = document.querySelector('.toast');
+  if (!t) { t = document.createElement('div'); t.className = 'toast'; document.body.appendChild(t); }
+  t.textContent = msg;
+  t.classList.remove('success', 'error');
+  if (kind === 'success') t.classList.add('success');
+  if (kind === 'error') t.classList.add('error');
+  t.classList.add('show');
+  clearTimeout(t._h);
+  t._h = setTimeout(() => t.classList.remove('show'), 2000);
+}
+
+const t = PaletteTable.init({
+  endpoint: '/api/mine',
+  perPage: 25,
+  hasPager: true,
+  rowHtml: it =>
+    `<tr class="row" data-href="/${t.esc(it.id)}"><td>` +
+    (it.title
+      ? `${t.esc(it.title)}${it.is_can ? ' <span class="badge" title="Can — bundle of items">can</span>' : ''}`
+      : `<a class="slug paste-name" href="/${t.esc(it.id)}">${t.esc(it.id)}</a>${it.is_can ? ' <span class="badge" title="Can — bundle of items">can</span>' : ''}`) +
+    `</td>` +
+    `<td><span class="badge">${t.esc(it.language || 'text')}</span></td>` +
+    `<td class="dim">${t.fmtSize(it.size)}</td><td class="dim" data-ts="${it.created_at}">${t.ago(it.created_at)}</td>` +
+    (it.custom_slug ? `<td><a class="slug url-link" href="/${t.esc(it.custom_slug)}">/${t.esc(it.custom_slug)}</a></td>` : `<td class="dim">none</td>`) +
+    `<td class="dim"><a class="id-link" href="/${t.esc(it.id)}">${t.esc(it.id)}</a></td>` +
+    `<td><button class="btn btn-icon del" data-id="${t.esc(it.id)}" title="Delete paste" aria-label="Delete paste">&times;</button></td></tr>`,
+  emptyFiltered: 'No pastes from this browser match your search.',
+  emptyAll: 'No pastes from this browser yet.',
+});
+
+// delete buttons (viewer-scoped, enforced server-side #37)
+document.getElementById('rows').addEventListener('click', async e => {
+  const del = e.target.closest('button.del');
+  if (!del) return;
+  e.stopPropagation();
+  del.disabled = true;
+  try {
+    const res = await fetch('/api/pastes/' + del.dataset.id, { method: 'DELETE' });
+    if (res.ok) { toast('Deleted', 'success'); t.load(); }
+    else { toast('Delete failed', 'error'); del.disabled = false; }
+  } catch (err) { toast('Delete failed', 'error'); del.disabled = false; }
+});
+
+t.load();
+</script>
 {{template "foot" .}}

internal/web/templates/new.html

@@ -19,24 +19,20 @@
           <option>markdown</option><option>text</option>
         </select>
         <button class="btn btn-icon" id="reguess" title="Re-detect language" type="button"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M21 12a9 9 0 1 1-2.64-6.36"/><polyline points="21 3 21 9 15 9"/></svg></button>
-        <button type="button" class="btn btn-icon wrap-toggle" id="wrap-toggle" title="Toggle line wrap" aria-pressed="false">Wrap</button>
+        <button type="button" class="btn btn-icon wrap-toggle" id="wrap-toggle" title="Toggle line wrap" aria-pressed="false">wrap</button>
         </div>
       </div>
     </div>
     <div class="float editor-wrap">
       <div class="gutter" id="gutter">1</div>
       <textarea class="editor" id="content" placeholder="Paste your code, text, or notes here…" spellcheck="false"></textarea>
-      <img id="file-preview" class="file-preview hidden" alt="File preview">
     </div>
+    <div class="created-banner" id="created"></div>
     <div class="actionbar">
       <span class="hint">Ctrl+Enter to create</span>
-      <div class="spacer spacer-flex"></div>
+      <div class="spacer" style="flex:1"></div>
       <button class="btn" id="create">Create</button>
     </div>
-    <div class="jumpnav hidden" id="jumpnav" data-jump-scroll="#content">
-      <button type="button" class="btn jump-btn" data-jump="top">Top</button>
-      <button type="button" class="btn jump-btn" data-jump="bottom">Bottom</button>
-    </div>
   </div>
 
   <div class="pane-r">
@@ -50,7 +46,7 @@
         <label><input type="radio" name="exp" value="720h"> 30 days</label>
         <label><input type="radio" name="exp" value="custom"> Custom</label>
       </div>
-      <div class="pw-row submenu hidden" id="customexp-row">
+      <div class="pw-row submenu" id="customexp-row" style="display:none">
         <div class="exp-group">
           <input type="number" class="num-input" id="expnum" min="1" placeholder="90" aria-label="Custom expiry amount">
           <select id="expunit" class="unit-select">
@@ -61,16 +57,22 @@
             <option value="mo">months</option>
           </select>
         </div>
-        <div class="hint danger-hint hidden" id="customexp-err"></div>
+        <div class="hint" id="customexp-err" style="display:none; color:var(--err, #c0392b); margin-top:6px;"></div>
       </div>
     </div>
     <div class="float side-section">
       <h3>Protection</h3>
       <div class="protect">
         <label class="toggle"><input type="checkbox" id="haspw"> Password lock</label>
-        <div class="pw-row hidden" id="pwrow"><div class="pw-field"><input type="password" id="password" placeholder="Password" autocomplete="new-password"><button type="button" class="reveal" id="pwreveal" title="Show password" tabindex="-1"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M1 12s4-7 11-7 11 7 11 7-4 7-11 7-11-7-11-7z"/><circle cx="12" cy="12" r="3"/><line class="eye-slash" x1="4" y1="4" x2="20" y2="20"/></svg></button></div></div>
+        <div class="pw-row" id="pwrow" style="display:none"><div class="pw-field"><input type="password" id="password" placeholder="Password" autocomplete="new-password"><button type="button" class="reveal" id="pwreveal" title="Show password" tabindex="-1"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M1 12s4-7 11-7 11 7 11 7-4 7-11 7-11-7-11-7z"/><circle cx="12" cy="12" r="3"/><line class="eye-slash" x1="4" y1="4" x2="20" y2="20"/></svg></button></div></div>
         <label class="toggle"><input type="checkbox" id="burn"> Burn after read</label>
-        <div class="pw-row submenu hidden" id="burnrow"><div class="exp-group readable-group"><label class="hint readable-label">Readable</label><input type="number" class="num-input" id="burnreads" min="1" value="1" aria-label="Times readable"><label class="hint readable-label">times</label></div></div>
+        <div class="pw-row submenu" id="burnrow" style="display:none">
+          <div class="exp-group readable-group">
+            <label class="hint readable-label">Readable</label>
+            <input type="number" class="num-input" id="burnreads" min="1" value="1" aria-label="Times readable">
+            <label class="hint readable-label">times</label>
+          </div>
+        </div>
         <label class="toggle"><input type="checkbox" id="unlisted"> Unlisted</label>
       </div>
     </div>
@@ -81,18 +83,414 @@
       </div>
       <input type="file" id="file-input" class="file-input" aria-label="Choose a file">
       <div id="file-chip-slot"></div>
-      <div class="hint hint-lg hidden mt6" id="file-text-note">File pastes ignore the text editor (one file per paste)</div>
+      <div class="hint" style="margin-top:6px; font-size:19px; display:none" id="file-text-note">File pastes ignore the text editor (one file per paste)</div>
     </div>
     <div class="float side-section">
       <h3>Custom URL</h3>
       <input type="text" id="custom" class="custom-input" placeholder="my-snippet">
     </div>
-    <div class="float side-section hidden" id="result-card">
+    <div class="float side-section" id="result-card" style="display:none">
       <h3>Result</h3>
-      <div class="hint wrap-normal" id="result">empty</div>
+      <div class="hint" id="result" style="word-break:normal;overflow-wrap:break-word">empty</div>
     </div>
   </div>
 </div>
-<script src="/static/new.js" defer></script>
+<script>
-<script src="/static/jump.js" defer></script>
+const $ = id => document.getElementById(id);
+const content = $('content'), gutter = $('gutter');
+
+function updateGutter() {
+  const lines = content.value.split('\n').length;
+  let s = '';
+  for (let i = 1; i <= Math.max(lines, 1); i++) s += i + '\n';
+  gutter.textContent = s;
+}
+content.addEventListener('input', updateGutter);
+updateGutter();
+
+function toast(msg, kind) {
+  let t = document.querySelector('.toast');
+  if (!t) { t = document.createElement('div'); t.className = 'toast'; document.body.appendChild(t); }
+  t.textContent = msg;
+  t.classList.remove('success', 'error');
+  if (kind === 'success') t.classList.add('success');
+  if (kind === 'error') t.classList.add('error');
+  t.classList.add('show');
+  clearTimeout(t._h);
+  t._h = setTimeout(() => t.classList.remove('show'), 2000);
+}
+$('haspw').addEventListener('change', e => { $('pwrow').style.display = e.target.checked ? 'block' : 'none'; });
+$('burn').addEventListener('change', e => { $('burnrow').style.display = e.target.checked ? 'block' : 'none'; });
+document.querySelectorAll('input[name="exp"]').forEach(r => r.addEventListener('change', () => {
+  $('customexp-row').style.display = document.querySelector('input[name="exp"]:checked').value === 'custom' ? 'block' : 'none';
+  $('customexp-err').style.display = 'none';
+}));
+
+// compose the expires_in Go-duration string when Custom is checked (#48).
+// Returns the string, or null with an inline error shown.
+function composeCustomExpiry() {
+  const n = parseInt($('expnum').value, 10);
+  const unit = $('expunit').value;
+  let mins = NaN;
+  if (n > 0) {
+    if (unit === 'm') mins = n;
+    else if (unit === 'h') mins = n * 60;
+    else if (unit === 'd') mins = n * 1440;
+    else if (unit === 'w') mins = n * 10080;
+    else if (unit === 'mo') mins = n * 43200; // months counted as 30 days
+  }
+  const err = $('customexp-err');
+  if (!(mins >= 1)) {
+    err.textContent = 'Enter a duration of at least 1 minute.';
+    err.style.display = 'block';
+    return null;
+  }
+  if (mins > 525600) { // more than 1 year
+    err.textContent = 'Custom expiry cannot exceed 1 year.';
+    err.style.display = 'block';
+    return null;
+  }
+  err.style.display = 'none';
+  // compose as h (+d/m remainders); Go parses '336h', '90m', '6h30m' fine
+  const hours = Math.floor(mins / 60), rem = mins % 60;
+  if (rem === 0) return hours + 'h';
+  if (hours === 0) return rem + 'm';
+  return hours + 'h' + rem + 'm';
+}
+
+$('pwreveal').addEventListener('click', () => {
+  const pw = $('password');
+  const show = pw.type === 'password';
+  pw.type = show ? 'text' : 'password';
+  $('pwreveal').classList.toggle('off', !show);
+  $('pwreveal').title = show ? 'Hide password' : 'Show password';
+});
+
+let guessed = ''; // last auto-detected language, '' = user override
+
+// #105: map backend machine-readable error codes to plain-language guidance.
+// Unknown codes fall back to a generic message; the technical detail stays
+// in the API response for API consumers.
+const ERROR_MESSAGES = {
+  slug_taken: 'That Custom URL is already taken. Try another.',
+  slug_reserved: 'That Custom URL is reserved. Try another.',
+  slug_invalid: 'Please keep the Custom URL under 64 characters, using only letters, numbers, dashes, or underscores.',
+  content_empty: 'Write or paste something first.',
+  content_too_large: 'This paste is too large. The limit is 5 MB.',
+  file_too_large: 'File is too large. The limit is 25 MB.',
+  one_file_only: 'Choose either text or a file for now.',
+  expiry_invalid: 'Please pick an expiry between 1 minute and 1 year.',
+  rate_limited: 'Too many tries. Wait a minute and try again.',
+};
+const GENERIC_ERROR = 'Something went wrong. Please try again.';
+
+function friendlyError(data) {
+  return ERROR_MESSAGES[data && data.code] || GENERIC_ERROR;
+}
+
+// #105: color the result box by outcome — success (ok), error (err),
+// warning (warn) — with a colored left border (CSS .result-ok/.result-err).
+function setResultKind(kind) {
+  const card = $('result-card');
+  card.classList.remove('result-ok', 'result-err', 'result-warn');
+  if (kind) card.classList.add('result-' + kind);
+}
+
+function showResult(html, kind) {
+  $('result').innerHTML = html;
+  $('result').dataset.token = kind === 'ok' ? ($('result').dataset.token || '') : ($('result').dataset.token || '');
+  $('result-card').style.display = 'block';
+  setResultKind(kind === 'ok' ? 'ok' : (kind === 'warn' ? 'warn' : 'err'));
+}
+function defaultFilename(lang) {
+  const names = {
+    python: 'Python.py', go: 'main.go', javascript: 'script.js', typescript: 'index.ts',
+    rust: 'main.rs', c: 'main.c', cpp: 'main.cpp', java: 'Main.java', bash: 'script.sh',
+    sql: 'query.sql', yaml: 'config.yaml', json: 'data.json', html: 'index.html',
+    css: 'style.css', xml: 'doc.xml', php: 'index.php', ruby: 'main.rb',
+    perl: 'main.pl', lua: 'main.lua', dockerfile: 'Dockerfile', toml: 'config.toml',
+    ini: 'config.ini', diff: 'changes.diff',
+    markdown: 'notes.md', text: 'Text.txt',
+  };
+  return names[lang] || '';
+}
+// fill default filename when title is still blank
+function maybeSetDefaultTitle(lang) {
+  const title = $('title');
+  if (lang && !title.value.trim()) {
+    const fn = defaultFilename(lang);
+    if (fn) title.value = fn;
+  }
+}
+
+async function guessLang() {
+  if (!content.value.trim()) return;
+  try {
+    const res = await fetch('/api/guess-language', {
+      method: 'POST',
+      headers: {'Content-Type': 'application/json'},
+      body: JSON.stringify({content: content.value}),
+    });
+    const data = await res.json();
+    if (res.ok && data.language) {
+      guessed = data.language;
+      $('language').value = data.language;
+      maybeSetDefaultTitle(data.language);
+    }
+  } catch(e) {}
+}
+
+// refresh button: always re-detect, even if user picked something
+$('reguess').addEventListener('click', guessLang);
+
+// auto-guess when pasting into the editor
+content.addEventListener('paste', () => setTimeout(guessLang, 0));
+
+async function create() {
+  // #4: can mode — bundle the editor + extra items into a can via multipart
+  if ($('iscan').checked) return createCan();
+  // #38: file attached -> file paste (1 file = 1 paste; text is ignored)
+  if (attachedFile) return createFilePaste();
+
+  const body = {
+    content: content.value,
+    title: $('title').value || null,
+    language: $('language').value || null,
+    custom_slug: $('custom').value || null,
+    burn_after_read: $('burn').checked,
+  };
+  if ($('burn').checked) body.burn_after_reads = parseInt($('burnreads').value, 10) || 1;
+  if ($('haspw').checked) body.password = $('password').value;
+  const exp = document.querySelector('input[name="exp"]:checked').value;
+  if (exp === 'custom') {
+    const dur = composeCustomExpiry();
+    if (dur === null) { toast('Check the custom expiry', 'error'); return; }
+    body.expires_in = dur;
+  } else if (exp) {
+    body.expires_in = exp;
+  }
+
+  const res = await fetch('/api/pastes', {
+    method: 'POST',
+    headers: {'Content-Type': 'application/json'},
+    body: JSON.stringify(body),
+  });
+  const data = await res.json();
+  if (!res.ok) {
+    showResult(friendlyError(data), 'err');
+    toast('Create failed', 'error');
+    return;
+  }
+  finishCreate(data);
+}
+
+// shared success handling for both create paths (#38): result box, copy
+// button, password auto-unlock, then redirect to the paste.
+function finishCreate(data) {
+  const url = location.origin + '/' + (data.custom_slug || data.id);
+  showResult('<a href="' + url + '">' + url + '</a> <button class="btn btn-icon" id="result-copy" title="Copy URL" type="button">⧉</button>', 'ok');
+  $('result').dataset.token = data.deletion_token || '';
+  const copyBtn = document.getElementById('result-copy');
+  copyBtn.addEventListener('click', () => {
+    try {
+      navigator.clipboard.writeText(url);
+      copyBtn.classList.add('ok');               // in-place success feedback (#53)
+      copyBtn.textContent = 'Success!';
+      setTimeout(() => { copyBtn.classList.remove('ok'); copyBtn.textContent = '⧉'; }, 2000);
+    } catch(e) { toast('Copy failed', 'error'); }
+  });
+  // token carried via sessionStorage, never in the URL (#143)
+  const dest = '/' + data.id + '?created=1';
+  try { sessionStorage.setItem('deletion_token_' + data.id, data.deletion_token || ''); } catch(e) {}
+  // password-protected: unlock now with the password we already have (#26)
+  if ($('haspw').checked && data.id) {
+    const fd = new FormData();
+    fd.append('password', $('password').value);
+    fd.append('next', dest);
+    try {
+      fetch('/' + data.id, {method: 'POST', body: fd}).finally(() => { location.href = dest; });
+      return;
+    } catch(e) {}
+  }
+  // show the paste
+  location.href = dest;
+}
+$('create').addEventListener('click', create);
+
+// #38: file attachment support — 1 file = 1 paste. Three input paths:
+// Ctrl+V paste of a file, upload button (file picker), drag-and-drop.
+const MAX_FILE_BYTES = 25 * 1024 * 1024;
+let attachedFile = null; // the single attached File, or null
+
+function humanSize(n) {
+  if (n >= 1048576) return (n / 1048576).toFixed(1) + ' MB';
+  if (n >= 1024) return (n / 1024).toFixed(1) + ' KB';
+  return n + ' B';
+}
+
+function setAttachedFile(file) {
+  if (!file) return clearAttachedFile();
+  if (file.size > MAX_FILE_BYTES) {
+    toast('File is too large. The limit is 25 MB.', 'error');
+    return;
+  }
+  attachedFile = file;
+  renderFileChip();
+  $('file-text-note').style.display = 'block';
+}
+
+function clearAttachedFile() {
+  attachedFile = null;
+  $('file-input').value = '';
+  renderFileChip();
+  $('file-text-note').style.display = 'none';
+}
+
+function renderFileChip() {
+  const slot = $('file-chip-slot');
+  slot.innerHTML = '';
+  if (!attachedFile) return;
+  const chip = document.createElement('div');
+  chip.className = 'file-chip';
+  chip.innerHTML = '<span class="file-chip-name"></span>' +
+    '<span class="file-chip-size">' + humanSize(attachedFile.size) + '</span>' +
+    '<button type="button" class="file-chip-remove" title="Remove file">&times;</button>';
+  chip.querySelector('.file-chip-name').textContent = attachedFile.name;
+  chip.querySelector('.file-chip-remove').addEventListener('click', clearAttachedFile);
+  slot.appendChild(chip);
+}
+
+// (1) file picker via the dropzone click
+$('dropzone').addEventListener('click', () => $('file-input').click());
+$('file-input').addEventListener('change', () => {
+  if ($('file-input').files.length) setAttachedFile($('file-input').files[0]);
+});
+
+// (2) drag-and-drop onto the dropzone (and the page broadly)
+const dz = $('dropzone');
+['dragenter', 'dragover'].forEach(ev => {
+  document.addEventListener(ev, e => {
+    if (!e.dataTransfer || ![...e.dataTransfer.types].includes('Files')) return;
+    e.preventDefault();
+    dz.classList.add('dragover');
+  });
+});
+['dragleave', 'drop'].forEach(ev => {
+  document.addEventListener(ev, e => {
+    if (ev === 'drop') e.preventDefault();
+    if (e.target === dz || ev === 'drop') dz.classList.remove('dragover');
+  });
+});
+document.addEventListener('drop', e => {
+  if (!e.dataTransfer || !e.dataTransfer.files.length) return;
+  e.preventDefault();
+  setAttachedFile(e.dataTransfer.files[0]);
+});
+
+// (3) Ctrl+V of a file anywhere on the page
+document.addEventListener('paste', e => {
+  const files = e.clipboardData && e.clipboardData.files;
+  if (!files || !files.length) return; // normal text paste into the editor
+  e.preventDefault();
+  setAttachedFile(files[0]);
+});
+
+// file create path: POST multipart. 1 file = 1 paste: when a file is
+// attached the editor text is ignored (server enforces this too).
+async function createFilePaste() {
+  const fd = new FormData();
+  fd.append('file', attachedFile);
+  if ($('title').value) fd.append('title', $('title').value);
+  if ($('custom').value) fd.append('custom_slug', $('custom').value);
+  if ($('haspw').checked) fd.append('password', $('password').value);
+  if ($('burn').checked) {
+    fd.append('burn_after_read', 'true');
+    fd.append('burn_after_reads', String(parseInt($('burnreads').value, 10) || 1));
+  }
+  if ($('unlisted').checked) fd.append('visibility', 'unlisted');
+  const exp = document.querySelector('input[name="exp"]:checked').value;
+  if (exp === 'custom') {
+    const dur = composeCustomExpiry();
+    if (dur === null) { toast('Check the custom expiry', 'error'); return; }
+    fd.append('expires_in', dur);
+  } else if (exp) {
+    fd.append('expires_in', exp);
+  }
+  const res = await fetch('/api/pastes', { method: 'POST', body: fd });
+  const data = await res.json();
+  if (!res.ok) {
+    showResult(friendlyError(data), 'err');
+    toast('Create failed', 'error');
+    return;
+  }
+  finishCreate(data);
+}
+
+// #4: can creation — POST multipart to /api/pastes/can. The main editor is
+// the first item; each extra can-item row is another text item.
+async function createCan() {
+  const items = [];
+  if (content.value.trim()) {
+    items.push({title: $('title').value || 'main', content: content.value, language: $('language').value || ''});
+  }
+  document.querySelectorAll('#can-items .can-item-row').forEach(row => {
+    const t = row.querySelector('.can-item-title').value.trim();
+    const c = row.querySelector('.can-item-content').value;
+    if (c.trim()) items.push({title: t || ('item-' + (items.length + 1)), content: c});
+  });
+  if (!items.length) { toast('Nothing to put in the can', 'error'); return; }
+
+  const fd = new FormData();
+  fd.append('title', $('title').value || 'Untitled can');
+  fd.append('json_items', JSON.stringify(items));
+  if ($('haspw').checked) fd.append('password', $('password').value);
+  if ($('unlisted').checked) fd.append('visibility', 'unlisted');
+  const exp = document.querySelector('input[name="exp"]:checked').value;
+  if (exp === 'custom') {
+    const dur = composeCustomExpiry();
+    if (dur === null) { toast('Check the custom expiry', 'error'); return; }
+    if (dur) fd.append('expires_in', dur);
+  } else if (exp) {
+    fd.append('expires_in', exp);
+  }
+  if ($('custom').value.trim()) fd.append('custom_slug', $('custom').value.trim());
+
+  const res = await fetch('/api/pastes/can', {method: 'POST', body: fd});
+  const data = await res.json();
+  if (!res.ok) {
+    showResult(friendlyError(data), 'err');
+    toast('Can create failed', 'error');
+    return;
+  }
+  const url = location.origin + data.url;
+  showResult('<a href="' + url + '">' + url + '</a> <button class="btn btn-icon" id="result-copy" title="Copy URL" type="button">⧉</button>', 'ok');
+  const copyBtn = document.getElementById('result-copy');
+  copyBtn.addEventListener('click', () => {
+    try {
+      navigator.clipboard.writeText(url);
+      copyBtn.classList.add('ok');
+      copyBtn.textContent = 'Success!';
+      setTimeout(() => { copyBtn.classList.remove('ok'); copyBtn.textContent = '⧉'; }, 2000);
+    } catch(e) { toast('Copy failed', 'error'); }
+  });
+  // password-protected can: unlock now with the password we already have (#26 parity)
+  if ($('haspw').checked && data.id) {
+    const pd = new FormData();
+    pd.append('password', $('password').value);
+    try { await fetch('/can/' + data.id, {method: 'POST', body: pd}); } catch(e) {}
+  }
+  location.href = data.url;
+}
+// reset stale result state when returning via Back (bfcache) (#28)
+window.addEventListener('pageshow', e => {
+  if (!e.persisted) return;
+  const rc = document.getElementById('result-card');
+  if (rc) rc.style.display = 'none';
+  const r = document.getElementById('result');
+  if (r) { r.innerHTML = 'empty'; delete r.dataset.token; }
+});
+document.addEventListener('keydown', e => {
+  if ((e.ctrlKey || e.metaKey) && e.key === 'Enter') { e.preventDefault(); create(); }
+});
+</script>
 {{template "foot" .}}

internal/web/templates/notfound.html

@@ -1,13 +0,0 @@
-{{template "head" .}}
-{{template "topbar" .}}
-<div class="center">
-  <div class="float notfound-card">
-    <div class="inner">
-      <div class="lockring"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="12" cy="12" r="10"/><line x1="12" y1="8" x2="12" y2="12"/><line x1="12" y1="16" x2="12.01" y2="16"/></svg></div>
-      <h1>Paste ID not found</h1>
-      <p class="sub">The paste <span class="slug">/{{.ID}}</span> does not exist, has expired, or was burned.</p>
-      <a class="btn" href="/new">Create a new paste</a>
-    </div>
-  </div>
-</div>
-{{template "foot" .}}

internal/web/templates/paste.html

@@ -6,22 +6,21 @@
       <h1>{{if .Title}}{{.Title}}{{else}}Untitled paste{{end}}</h1>
       {{if .CustomSlug}}<span class="slug">/{{.CustomSlug}}</span>{{end}}
       <div class="spacer"></div>
-      <button type="button" class="iconbtn wrap-toggle" title="Toggle line wrap" aria-pressed="false">Wrap</button>
+      <button type="button" class="iconbtn wrap-toggle" title="Toggle line wrap" aria-pressed="false">wrap</button>
-      <a class="iconbtn" href="/raw/{{.ID}}">Raw</a>
+      <a class="iconbtn" href="/raw/{{.ID}}">raw</a>
-      <a class="iconbtn swapbtn" href="#" id="copy-link-btn"><span class="swap-label">Link</span><span class="swap-check">✓</span></a>
+      <a class="iconbtn" href="#" id="copy-btn" onclick="copyContent(this); return false;">copy</a>
-      <a class="iconbtn swapbtn" href="#" id="copy-btn"><span class="swap-label">Copy</span><span class="swap-check">✓</span></a>
+      {{if .DeletionToken}}<a class="iconbtn danger" href="#" onclick="redeem(); return false;">delete</a>{{end}}
-      {{if .DeletionToken}}<a class="iconbtn danger" href="#" id="delete-btn">Delete</a>{{end}}
     </div>
   </div>
   <div class="float">
     <div class="stats-pill" id="stats-pill">
-      <button type="button" class="stats-head" id="stats-toggle" aria-expanded="false">
+      <button type="button" class="stats-head" id="stats-toggle" aria-expanded="false" onclick="toggleStats()">
         <svg class="stats-chev" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><polyline points="6 9 12 15 18 9"/></svg>
         <span class="stats-summary">{{.StatsSummary}}</span>
       </button>
       <div class="stats-body" id="stats-body" hidden>
         <div class="stats-grid">
-          <span class="stats-k">Type</span><span class="stats-v">{{.TypeLabel}}</span>
+          <span class="stats-k">Language</span><span class="stats-v">{{if .Language}}{{.Language}}{{else}}text{{end}}</span>
           <span class="stats-k">Size</span><span class="stats-v">{{.SizeHuman}} ({{.LineCount}} lines)</span>
           <span class="stats-k">Views</span><span class="stats-v">{{.ViewCount}}</span>
           <span class="stats-k">Created</span><span class="stats-v" data-ts="{{.CreatedAtUnix}}">{{.CreatedAgo}}</span>
@@ -35,33 +34,68 @@
     </div>
   </div>
   {{if .JustCreated}}
-  <div class="created-pill" id="created-pill" role="status">Paste Created</div>
+  <div class="float">
+    <div class="created-banner" style="display:block">
+      Paste created. Link copied to clipboard: <a href="/{{.ID}}">{{.Host}}/{{.ID}}</a>
+      {{if .DeletionToken}} · deletion token: <code>{{.DeletionToken}}</code>{{end}}
+    </div>
+  </div>
   {{end}}
   {{if .Attachment}}
   <div class="float">
     <div class="attachment-bar">
-      {{if .AttachmentImage}}
-      <div class="attachment-preview"><img src="/f/{{.Attachment.ID}}/{{.Attachment.Filename}}" alt="{{.Attachment.Filename}}"></div>
-      {{end}}
       <a class="attachment-chip" href="/f/{{.Attachment.ID}}/{{.Attachment.Filename}}" data-mime="{{.Attachment.Mime}}">
         <span class="attachment-name">{{.Attachment.Filename}}</span>
         <span class="attachment-size">{{.Attachment.SizeHuman}}</span>
       </a>
+      {{if or (eq .Attachment.Mime "image/png") (eq .Attachment.Mime "image/jpeg") (eq .Attachment.Mime "image/gif") (eq .Attachment.Mime "image/webp")}}
+      <div class="attachment-preview"><img src="/f/{{.Attachment.ID}}/{{.Attachment.Filename}}" alt="{{.Attachment.Filename}}"></div>
+      {{end}}
     </div>
   </div>
   {{end}}
-  {{if not .Attachment}}
   <div class="float">
-    <div class="code" id="code"><div class="gutter" id="gutter">{{.Gutter}}</div><div class="codebody" id="codebody">{{.ContentHTML}}</div></div>
+    <div class="code"><div class="gutter">{{.Gutter}}</div><div class="codebody" id="codebody">{{.ContentHTML}}</div></div>
-  </div>
-  {{end}}
-  <div class="jumpnav hidden" id="jumpnav">
-    <button type="button" class="btn jump-btn" data-jump="top">Top</button>
-    <button type="button" class="btn jump-btn" data-jump="bottom">Bottom</button>
   </div>
 </div>
 <input type="hidden" id="raw-content" value="{{.ContentAttr}}">
-<script src="/static/paste.js" defer data-paste-id="{{.ID}}"></script>
+<script>
-<script src="/static/paste-lines.js" defer></script>
+function toast(msg) {
-<script src="/static/jump.js" defer></script>
+  let t = document.querySelector('.toast');
+  if (!t) { t = document.createElement('div'); t.className = 'toast'; document.body.appendChild(t); }
+  t.textContent = msg;
+  t.classList.add('show');
+  clearTimeout(t._h);
+  t._h = setTimeout(() => t.classList.remove('show'), 2000);
+}
+function toggleStats() {
+  const body = document.getElementById('stats-body');
+  const pill = document.getElementById('stats-pill');
+  const btn = document.getElementById('stats-toggle');
+  const open = body.hidden;
+  body.hidden = !open;
+  pill.classList.toggle('open', open);
+  btn.setAttribute('aria-expanded', open ? 'true' : 'false');
+}
+function copyContent(btn) {
+  navigator.clipboard.writeText(document.getElementById('raw-content').value);
+  // in-place success feedback (#53)
+  if (btn) {
+    btn.classList.add('ok');
+    btn.textContent = 'Success!';
+    clearTimeout(btn._okh);
+    btn._okh = setTimeout(() => { btn.classList.remove('ok'); btn.textContent = 'copy'; }, 2000);
+  } else {
+    toast('Copied', 'success');
+  }
+}
+function redeem() {
+  if (!confirm('Hard delete this paste immediately?')) return;
+  let tok = '';
+  try { tok = sessionStorage.getItem('deletion_token_{{.ID}}') || ''; } catch(e) {}
+  if (!tok) { alert('deletion token not available in this browser'); return; }
+  fetch('/api/pastes/{{.ID}}/redeem', {method: 'DELETE', headers: {'Authorization': 'Bearer ' + tok}})
+    .then(r => { if (r.ok) location.href = '/history'; else alert('delete failed'); });
+}
+</script>
 {{template "foot" .}}

internal/web/templates/settings.html

@@ -13,11 +13,102 @@
       </button>
       <h3>Theme</h3>
       <div class="theme-grid" id="theme-grid"></div>
-      <h3 class="mt18">Editor</h3>
+      <h3 style="margin-top:18px">Editor</h3>
-      <label class="toggle toggle-inline" for="wrap-setting"><input type="checkbox" id="wrap-setting"> Line wrap</label>
+      <label class="toggle" for="wrap-setting" style="display:inline-flex"><input type="checkbox" id="wrap-setting"> Line wrap</label>
       <p class="admin-link-row"><a class="admin-link" href="/admin">Admin</a></p>
     </div>
   </div>
 </div>
-<script src="/static/settings.js" defer></script>
+<script>
+(function () {
+  // #112: derive each preset's swatches from the real CSS variables in
+  // app.css by temporarily applying data-preset, so they can never drift.
+  // #127: 5 theme pairs, light swatches top row, dark bottom row.
+  var pairs = [
+    { id: 'midnight',        name: 'Midnight' },
+    { id: 'smooth',          name: 'Smooth' },
+    { id: 'pastel-lavender', name: 'Pastel Lavender' },
+    { id: 'pastel-peach',    name: 'Pastel Peach' },
+    { id: 'pastel-cloud',    name: 'Pastel Cloud' }
+  ];
+  var SWATCH_VARS = ['--bg', '--surface', '--surface-2', '--muted', '--accent'];
+
+  function presetColors(id) {
+    var root = document.documentElement;
+    var prev = root.getAttribute('data-preset');
+    root.setAttribute('data-preset', id);
+    var cs = getComputedStyle(root);
+    var colors = SWATCH_VARS.map(function (v) { return cs.getPropertyValue(v).trim(); });
+    if (prev === null) root.removeAttribute('data-preset'); else root.setAttribute('data-preset', prev);
+    return colors;
+  }
+
+  // current base pair + dark flag from the resolved data-preset.
+  // "midnight" is itself the dark variant, so check dark ids first.
+  function state() {
+    var p = document.documentElement.dataset.preset || 'midnight';
+    if (p === 'midnight' || /-dark$/.test(p)) {
+      return { base: p === 'midnight' ? 'midnight' : p.replace(/-dark$/, ''), dark: true };
+    }
+    return { base: p === 'midnight-light' ? 'midnight' : p, dark: false };
+  }
+
+  var grid = document.getElementById('theme-grid');
+  var cards = {};
+  // #132: midnight is dark-first (root preset = midnight = dark; its light
+  // variant is midnight-light), the others are light-first. Resolve the
+  // LIGHT and DARK preset ids generically so the light swatches always
+  // render in the top row of every card.
+  function lightPreset(id) {
+    if (id === 'midnight') return 'midnight-light';
+    return id; // light-first bases use themselves as the light variant
+  }
+  function darkPreset(id) {
+    if (id === 'midnight') return 'midnight'; // root preset is midnight's dark
+    return id + '-dark';
+  }
+  pairs.forEach(function (t) {
+    var light = presetColors(lightPreset(t.id));
+    var dark = presetColors(darkPreset(t.id));
+    var btn = document.createElement('button');
+    btn.type = 'button';
+    btn.className = 'theme-card';
+    btn.setAttribute('aria-pressed', 'false');
+    btn.setAttribute('data-pair', t.id);
+    btn.innerHTML = '<strong>' + t.name + '</strong>' +
+      '<span class="swatches">' + light.map(function (c) {
+        return '<span class="swatch" style="background:' + c + '"></span>';
+      }).join('') + '</span>' +
+      '<span class="swatches">' + dark.map(function (c) {
+        return '<span class="swatch" style="background:' + c + '"></span>';
+      }).join('') + '</span>';
+    btn.addEventListener('click', function () {
+      var dark = state().dark;
+      document.documentElement.dataset.preset = dark ? t.id + '-dark' : t.id;
+      try { localStorage.setItem('palette-theme', t.id); } catch (e) {}
+      Object.keys(cards).forEach(function (k) { cards[k].setAttribute('aria-pressed', 'false'); });
+      btn.setAttribute('aria-pressed', 'true');
+    });
+    cards[t.id] = btn;
+    grid.appendChild(btn);
+  });
+
+  function sync() {
+    var s = state();
+    Object.keys(cards).forEach(function (k) {
+      cards[k].setAttribute('aria-pressed', k === s.base ? 'true' : 'false');
+    });
+    var dt = document.getElementById('settings-dark-toggle');
+    if (dt) dt.setAttribute('aria-pressed', s.dark ? 'true' : 'false');
+  }
+  sync();
+  // the topbar script runs before this button exists, so wire it here
+  var dt = document.getElementById('settings-dark-toggle');
+  dt.addEventListener('click', function () {
+    var btns = document.querySelectorAll('.topbar .dark-toggle');
+    if (btns.length) btns[0].click(); else document.dispatchEvent(new CustomEvent('palette-darkchange'));
+  });
+  document.addEventListener('palette-darkchange', sync);
+})();
+</script>
 {{template "foot" .}}

internal/web/templates/unlock.html

@@ -18,5 +18,12 @@
     <div class="foot">Created <span data-ts="{{.CreatedAtUnix}}">{{.CreatedAgo}}</span></div>
   </div>
 </div>
-<script src="/static/unlock.js" defer></script>
+<script>
+document.getElementById('pwreveal').addEventListener('click', () => {
+  const pw = document.getElementById('password');
+  const show = pw.type === 'password';
+  pw.type = show ? 'text' : 'password';
+  document.getElementById('pwreveal').title = show ? 'Hide password' : 'Show password';
+});
+</script>
 {{template "foot" .}}

internal/web/web.go

@@ -1,5 +1,5 @@
-// Package web serves palette's HTML routes: paste pages, unlock, and the
+// Package web serves palette's HTML routes: paste pages, cans, unlock, and
-// admin page. Templates and static assets are embedded in this package.
+// the admin page. Templates and static assets are embedded in this package.
 package web
 
 import (
@@ -104,13 +104,29 @@ func (h *Handlers) renderPage(w http.ResponseWriter, name string, data any) {
 	}
 }
 
-// RenderNotFoundPage is the exported not-found renderer used by the api
+// RenderPage is the exported wrapper used by the api package (#4 can pages).
-// package (#173): the router's NotFound handler renders the main UI with a
+func (h *Handlers) RenderPage(w http.ResponseWriter, name string, data any) {
-// friendly "Paste ID not found" message, still with HTTP 404.
+	h.renderPage(w, name, data)
-func (h *Handlers) RenderNotFoundPage(w http.ResponseWriter, r *http.Request) {
-	h.renderNotFound(w, r, r.URL.Path)
 }
 
+// WriteRateLimited is the exported rate-limit response used by the api package (#4).
+func (h *Handlers) WriteRateLimited(w http.ResponseWriter, retryAfterSecs int) {
+	h.writeRateLimited(w, retryAfterSecs)
+}
+
+// UnlockToken returns the per-id HMAC unlock token (cookie value, #34).
+// Exported for the api package so can pages share paste cookie semantics (#4).
+func UnlockToken(id string) string { return unlockToken(id) }
+
+// AgoString formats a relative "N ago" string (exported for the api package, #4).
+func AgoString(ts int64) string { return agoString(ts) }
+
+// HumanSize formats a byte count as a human string (exported for the api package, #4).
+func HumanSize(n int) string { return humanSize(n) }
+
+// ExpiryString formats remaining time until an epoch seconds expiry (#4).
+func ExpiryString(expiresAt int64) string { return expiryString(expiresAt) }
+
 // #34: per-paste unlock tokens. unlockSecret is generated once at startup
 // (also derivable from PALETTE_UNLOCK_SECRET for multi-instance deploys) and
 // used to HMAC paste ids, so a client can only hold a valid pw_<id> cookie by
@@ -184,44 +200,6 @@ func (h *Handlers) writeRateLimited(w http.ResponseWriter, retryAfterSecs int) {
 	w.Write([]byte(`{"error":"rate limit exceeded"}`))
 }
 
-// renderNotFound serves the friendly not-found page (#173): the main UI
-// chrome (topbar, centered card) with a "Paste ID not found" message in the
-// result card, instead of a bare text 404. Still returns HTTP 404 so
-// crawlers/validators see the correct status.
-func (h *Handlers) renderNotFound(w http.ResponseWriter, r *http.Request, id string) {
-	h.renderPageStatus(w, "notfound.html", http.StatusNotFound, map[string]any{"Page": "notfound", "ID": id})
-}
-
-// HandleNotFoundPage serves the friendly not-found page for unknown routes
-// (#173): main UI chrome with a "Paste ID not found" message. Called from the
-// chi NotFound handler in the api package.
-func (h *Handlers) HandleNotFoundPage(w http.ResponseWriter, r *http.Request) {
-	h.renderNotFound(w, r, r.URL.Path)
-}
-
-// renderPageStatus renders a template with an explicit HTTP status code.
-func (h *Handlers) renderPageStatus(w http.ResponseWriter, name string, status int, data any) {
-	w.Header().Set("Content-Type", "text/html; charset=utf-8")
-	w.WriteHeader(status)
-	if err := h.UI.tmpl.ExecuteTemplate(w, name, data); err != nil {
-		http.Error(w, "template error: "+err.Error(), 500)
-	}
-}
-
-// attachmentExt returns the lowercase file extension (without dot) of a
-// filename, or "" when the name has none. Used by the Type display (#235).
-func attachmentExt(filename string) string {
-	name := filename
-	if i := strings.LastIndexByte(name, '/'); i >= 0 {
-		name = name[i+1:]
-	}
-	i := strings.LastIndexByte(name, '.')
-	if i <= 0 || i == len(name)-1 {
-		return ""
-	}
-	return strings.ToLower(name[i+1:])
-}
-
 func (h *Handlers) renderPaste(w http.ResponseWriter, row *store.PasteRow, justCreated bool, deletionToken string, readsRemaining *int) {
 	lines := strings.Count(row.Content, "\n") + 1
 	gutter := ""
@@ -236,62 +214,27 @@ func (h *Handlers) renderPaste(w http.ResponseWriter, row *store.PasteRow, justC
 	if lang == "" {
 		lang = "text"
 	}
+	summary := fmt.Sprintf("%s · %s · %d views · %s", lang, humanSize(len(row.Content)), row.ViewCount, agoString(row.CreatedAt))
 	// #38: one optional file attachment per paste; nil when none.
 	attachment, err := h.Store.GetAttachmentForPaste(row.ID)
 	if err != nil {
 		http.Error(w, "db error", 500)
 		return
 	}
-	// #221: for attachment pastes the stored text content is empty (the file
-	// replaced it), so the summary size must come from the attachment blob,
-	// not len(row.Content), or the summary shows "0 B".
-	summarySize := len(row.Content)
-	if attachment != nil {
-		summarySize = int(attachment.Size)
-	}
-	// #235: column renamed to "Type". Text pastes keep the detected
-	// language; attachment pastes show the file extension instead.
-	attExt := ""
-	typeLabel := lang
-	if attachment != nil {
-		if ext := attachmentExt(attachment.Filename); ext != "" {
-			attExt = ext
-			typeLabel = ext
-		}
-	}
-	summary := fmt.Sprintf("%s · %s · %d views · %s", typeLabel, humanSize(summarySize), row.ViewCount, agoString(row.CreatedAt))
-	// #221: image attachments render the image, not a text/code box. Size
-	// comes from the attachment's actual file size, not the text content.
-	attImage := false
-	if attachment != nil {
-		switch attachment.Mime {
-		case "image/png", "image/jpeg", "image/gif", "image/webp":
-			attImage = true
-		}
-	}
-	sizeHuman := humanSize(len(row.Content))
-	lineCount := lines
-	if attachment != nil {
-		sizeHuman = attachment.SizeHuman
-		lineCount = 1
-	}
 	data := map[string]any{
 		"Page":          "paste",
 		"ID":            row.ID,
 		"Title":         row.Title.String,
-		"Language":      typeLabel,
+		"Language":      row.Language.String,
-		"TypeLabel":     typeLabel,
-		"HasAttachment":  attachment != nil,
-		"AttachmentExt": attExt,
 		"StatsSummary":  summary,
-		"SizeHuman":     sizeHuman,
+		"SizeHuman":     humanSize(len(row.Content)),
 		"HasPassword":   row.PasswordHash.Valid,
 		"BurnAfterRead": row.BurnAfterRead,
 		"CustomSlug":    row.CustomSlug.String,
 		"ContentHTML":   template.HTML(langpkg.HighlightCode(row.Content, row.Language.String)), // safe: HighlightCode escapes all non-span text
 		"ContentAttr":   row.Content,
 		"Gutter":        strings.TrimSuffix(gutter, "\n"),
-		"LineCount":     lineCount,
+		"LineCount":     lines,
 		"SizeBytes":     len(row.Content),
 		"CreatedAgo":    agoString(row.CreatedAt),
 		"CreatedAtUnix": row.CreatedAt,
@@ -305,7 +248,6 @@ func (h *Handlers) renderPaste(w http.ResponseWriter, row *store.PasteRow, justC
 		"ReadsTotal":    int(row.ReadsLimit.Int64),
 		"JustCreated":   justCreated,
 		"Attachment":    attachment,
-		"AttachmentImage": attImage,
 		"Host":          "this host",
 	}
 	h.renderPage(w, "paste.html", data)
@@ -320,14 +262,11 @@ func (h *Handlers) HandlePasteView(w http.ResponseWriter, r *http.Request) {
 		return
 	}
 	if row == nil {
-		// #173: a missing paste ID gets the main UI with a friendly message,
+		http.NotFound(w, r)
-		// not a bare text 404 page.
-		h.renderNotFound(w, r, id)
 		return
 	}
 	if row.ExpiresAt.Valid && row.ExpiresAt.Int64 < time.Now().Unix() {
-		// #173: expired pastes render the same friendly not-found UI.
+		http.Error(w, "paste expired", 404)
-		h.renderNotFound(w, r, id)
 		return
 	}
 	if row.PasswordHash.Valid {
@@ -346,7 +285,7 @@ func (h *Handlers) HandlePasteView(w http.ResponseWriter, r *http.Request) {
 				// the paste id under the server's random secret.
 				http.SetCookie(w, &http.Cookie{
 					Name: "pw_" + row.ID, Value: unlockToken(row.ID), Path: "/",
-					MaxAge: 3600, HttpOnly: true, SameSite: http.SameSiteLaxMode, Secure: true,
+					MaxAge: 3600, HttpOnly: true, SameSite: http.SameSiteLaxMode,
 				})
 				// re-render without lock, or redirect if ?next= was given (#26)
 				if next := r.FormValue("next"); next != "" {
@@ -379,8 +318,8 @@ func (h *Handlers) HandlePasteView(w http.ResponseWriter, r *http.Request) {
 		token = c.Value
 	}
 	if justCreated && token != "" {
-		// one-time display of the deletion token via sessionStorage (#143)
+		// one-time display of the deletion token via the created banner
-		http.SetCookie(w, &http.Cookie{Name: "tok_" + row.ID, Value: token, Path: "/", MaxAge: 60, HttpOnly: true, SameSite: http.SameSiteLaxMode, Secure: true})
+		http.SetCookie(w, &http.Cookie{Name: "tok_" + row.ID, Value: token, Path: "/", MaxAge: 60, HttpOnly: true, SameSite: http.SameSiteLaxMode})
 	}
 	// Count the view for real page renders, deduped per-viewer within the
 	// burn window (#95): a reload by the same vwr cookie doesn't inflate
@@ -394,8 +333,8 @@ func (h *Handlers) HandlePasteView(w http.ResponseWriter, r *http.Request) {
 	// Just-created first render does not count as a read for the creator.
 	if !justCreated {
 		rem, admitted := h.Store.RegisterRead(row, h.ViewerID(r), h.BurnWindowMin())
-		if !admitted { // #58: lost the burn claim; #173: friendly not-found UI
+		if !admitted { // #58: lost the burn claim; do not render content
-			h.renderNotFound(w, r, row.ID)
+			http.NotFound(w, r)
 			return
 		}
 		h.renderPaste(w, row, false, "", rem)
@@ -410,9 +349,9 @@ func (h *Handlers) HandleNewPage(w http.ResponseWriter, r *http.Request) {
 	h.renderPage(w, "new.html", map[string]any{"Page": "new"})
 }
 
-// HandleHistoryPage serves /public.
+// HandleHistoryPage serves /history.
 func (h *Handlers) HandleHistoryPage(w http.ResponseWriter, r *http.Request) {
-	h.renderPage(w, "history.html", map[string]any{"Page": "public"})
+	h.renderPage(w, "history.html", map[string]any{"Page": "history"})
 }
 
 // HandleSettingsPage serves /settings.
@@ -429,9 +368,9 @@ func (h *Handlers) HandleSettingsPage(w http.ResponseWriter, r *http.Request) {
 	h.renderPage(w, "settings.html", map[string]any{"Page": "settings", "Themes": themes})
 }
 
-// HandleMinePage serves /saved.
+// HandleMinePage serves /mine.
 func (h *Handlers) HandleMinePage(w http.ResponseWriter, r *http.Request) {
-	h.renderPage(w, "mine.html", map[string]any{"Page": "saved"})
+	h.renderPage(w, "mine.html", map[string]any{"Page": "mine"})
 }
 
 // HandleAdminPage serves /admin.
@@ -443,13 +382,9 @@ func (h *Handlers) HandleAdminPage(w http.ResponseWriter, r *http.Request) {
 func (u *UI) Handlers() *Handlers { return &Handlers{UI: u} }
 
 // #59: security headers for rendered HTML pages. Applied wherever the
-// response is text/html (page templates); JSON API
+// response is text/html (page templates and the inline can page); JSON API
-// responses and /raw content pass through untouched.
+// responses and /raw content pass through untouched. script-src allows
-// #139: script-src and style-src no longer allow 'unsafe-inline'. All
+// 'unsafe-inline' because the page templates carry inline scripts; CSP
-// previously-inline scripts moved to external files under static/ (page data
-// reaches them via data-* attributes on the script tags), inline style
-// attributes became CSS classes, and JS sets swatch colors via CSSOM. The
-// img-src data: allowance stays: SVG data-URI backgrounds in app.css need it.
 // default-src 'self' still blocks external content and object/frame embeds,
 // and frame-ancestors 'none' closes the clickjacking gap flagged in the #34
 // pentest. Runs after the handler so the Content-Type is already set.
@@ -461,7 +396,7 @@ func SecurityHeaders(next http.Handler) http.Handler {
 		// is harmless and arguably desirable.
 		h := w.Header()
 		h.Set("Content-Security-Policy",
-			"default-src 'self'; script-src 'self'; style-src 'self'; img-src 'self' data:; frame-ancestors 'none'")
+			"default-src 'self'; script-src 'self' 'unsafe-inline'; style-src 'self' 'unsafe-inline'; img-src 'self' data:; frame-ancestors 'none'")
 		h.Set("Referrer-Policy", "no-referrer")
 		h.Set("X-Content-Type-Options", "nosniff")
 		next.ServeHTTP(w, r)