step 9.3: done

src/app.js

@@ -1,6 +1,7 @@
 const express = require('express');
 const helmet = require('helmet');
 const rateLimit = require('express-rate-limit');
+const path = require('path');
 const { createSessionMiddleware, requireAuth } = require('./middleware/session');
 const { registerLimiter, loginLimiter, routes: authRoutes } = require('./routes/auth');
 const { routes: characterRoutes } = require('./routes/character');
@@ -91,7 +92,24 @@ function createApp() {
   // Hero profile route (public, no session required)
   app.get('/api/heroes/:name', heroProfileRoutes.getHeroProfile);
 
-  // Central error handler
+  // Catch-all: serve 404 page for unknown paths (HTML requests only).
+  // API paths still return JSON errors via the central handler.
+  // Placed before static files so it intercepts non-file paths.
+  const PUBLIC_DIR = path.resolve(__dirname, '../public');
+  app.use((req, res, next) => {
+    // If a route already set headers, let it through (e.g., static file not found)
+    if (res.headersSent) return next();
+    if (req.accepts('html')) {
+      return res.status(404).sendFile(path.join(PUBLIC_DIR, '404.html'));
+    }
+    return res.status(404).json({
+      ok: false,
+      error: { code: 'NOT_FOUND', message: 'Resource not found.' },
+    });
+  });
+
+  // Static files (after catch-all for API paths, but static will still serve HTML pages)
+  app.use(express.static('public'));
   app.use((err, _req, res, _next) => {
     // Log stack traces server-side only
     if (err.stack) {
@@ -120,6 +138,9 @@ function createApp() {
     }
 
     // Generic error
+    if (req.accepts('html')) {
+      return res.status(500).sendFile(path.join(PUBLIC_DIR, '500.html'));
+    }
     res.status(500).json({
       ok: false,
       error: {