feat(prefs): per-user UI font scale (A−/A+), saved to the profile

A header A−/value/A+ control scales the whole UI, persisted per user and
restored on login from any booth — cloning the theme-pref pattern end to end.

- DB: users.font_scale (migration 0014; percent, 100 = base, NOT NULL default).
- Server: PUT /api/auth/font-scale (auth-guarded; clamps to 80–160, snaps to a
  10-step); fontScale flows through sessionView → login + /me.
- Client: setFontScalePref + applyFontScale; applied in App alongside theme;
  FontScaleToggle in the header; i18n sq+en.

Scaling uses CSS `zoom` on the root, NOT root font-size: the app's type is pinned
in px (text-[12px] etc., ~230 spots), which a font-size change would not scale —
so the dense Active-sessions / Live-feed logs stayed tiny. `zoom` scales
everything uniformly (text, spacing, icons) like the browser's Ctrl+/−, which is
the readability win for operators who need larger text.

Tests: 4 font-scale auth-route cases (persist + /me, clamp/snap, 400, default-100).
Full workspace build/lint/test green.

Claude-Session: https://claude.ai/code/session_01Xcm6ikLgGoCxxHrxtjkk5V

apps/server/src/routes/auth.ts

@@ -29,6 +29,13 @@ interface ThemeBody {
   theme: Theme;
 }
 
+// UI font scale: percent of base, clamped to [80, 160] in steps of 10. Integer percent.
+const FONT_SCALE_MIN = 80;
+const FONT_SCALE_MAX = 160;
+interface FontScaleBody {
+  fontScale: number;
+}
+
 // Self-service profile: a signed-in user edits their OWN display name + email. This is
 // NOT the admin user-management path (routes/users.ts) — it only ever touches the caller
 // (req.user.sub), needs no `user:*` permission, and can't change username, role, or any
@@ -67,6 +74,7 @@ function sessionView(
     roleId: string;
     language: string;
     theme: string;
+    fontScale: number;
     fullName?: string | null;
     email?: string | null;
   },
@@ -81,6 +89,7 @@ function sessionView(
     permissions,
     language: user.language,
     theme: user.theme,
+    fontScale: user.fontScale,
     fullName: user.fullName ?? null,
     email: user.email ?? null,
   };
@@ -171,6 +180,23 @@ export async function authRoutes(app: FastifyInstance, db: Db): Promise<void> {
     },
   );
 
+  // Change MY own UI font scale (any signed-in user). Percent of base, clamped to
+  // [80, 160] in steps of 10. Persisted like `theme`, restored on the next login.
+  app.put<{ Body: FontScaleBody }>(
+    "/api/auth/font-scale",
+    { preHandler: requireAuth },
+    async (req, reply) => {
+      const raw = req.body?.fontScale;
+      if (typeof raw !== "number" || !Number.isFinite(raw)) {
+        return reply.code(400).send({ error: "fontScale must be a number" });
+      }
+      // Snap to a 10-step and clamp to the allowed band (defensive — the UI already does).
+      const fontScale = Math.min(FONT_SCALE_MAX, Math.max(FONT_SCALE_MIN, Math.round(raw / 10) * 10));
+      await db.update(users).set({ fontScale }).where(eq(users.id, req.user.sub)).run();
+      return { fontScale };
+    },
+  );
+
   // Edit MY own display name / email (any signed-in user; no permission needed — it only
   // touches the caller). Cannot change username or role — those stay admin-only (users.ts).
   app.put<{ Body: ProfileBody }>(

apps/server/src/routes/profile.test.ts

@@ -128,3 +128,57 @@ describe("PUT /api/auth/password (self-service)", () => {
     expect(res.statusCode).toBe(400);
   });
 });
+
+describe("PUT /api/auth/font-scale (self-service)", () => {
+  it("persists a valid scale and returns it on the next session", async () => {
+    const { username, password } = await seedUser(db, { username: "f1", roleId: "viewer", permissions: [] });
+    const { cookie, csrf } = await login(app, username, password);
+    const res = await app.inject({
+      method: "PUT", url: "/api/auth/font-scale",
+      headers: { cookie, "x-csrf-token": csrf },
+      payload: { fontScale: 120 },
+    });
+    expect(res.statusCode).toBe(200);
+    expect(res.json().fontScale).toBe(120);
+    // Persisted to the caller's row…
+    expect(db.select().from(users).where(eq(users.username, "f1")).get()?.fontScale).toBe(120);
+    // …and surfaced on /me (the session bootstrap).
+    const me = await app.inject({ method: "GET", url: "/api/auth/me", headers: { cookie } });
+    expect(me.json().fontScale).toBe(120);
+  });
+
+  it("clamps + snaps out-of-band / off-step values", async () => {
+    const { username, password } = await seedUser(db, { username: "f2", roleId: "viewer", permissions: [] });
+    const { cookie, csrf } = await login(app, username, password);
+    const tooBig = await app.inject({
+      method: "PUT", url: "/api/auth/font-scale",
+      headers: { cookie, "x-csrf-token": csrf },
+      payload: { fontScale: 999 },
+    });
+    expect(tooBig.json().fontScale).toBe(160); // clamped to max
+    const offStep = await app.inject({
+      method: "PUT", url: "/api/auth/font-scale",
+      headers: { cookie, "x-csrf-token": csrf },
+      payload: { fontScale: 113 },
+    });
+    expect(offStep.json().fontScale).toBe(110); // snapped to the 10-step
+  });
+
+  it("rejects a non-numeric scale (400)", async () => {
+    const { username, password } = await seedUser(db, { username: "f3", roleId: "viewer", permissions: [] });
+    const { cookie, csrf } = await login(app, username, password);
+    const res = await app.inject({
+      method: "PUT", url: "/api/auth/font-scale",
+      headers: { cookie, "x-csrf-token": csrf },
+      payload: { fontScale: "big" },
+    });
+    expect(res.statusCode).toBe(400);
+  });
+
+  it("defaults to 100 for a fresh user", async () => {
+    const { username, password } = await seedUser(db, { username: "f4", roleId: "viewer", permissions: [] });
+    const { cookie } = await login(app, username, password);
+    const me = await app.inject({ method: "GET", url: "/api/auth/me", headers: { cookie } });
+    expect(me.json().fontScale).toBe(100);
+  });
+});