feat(mangas): add tag-similarity "Similar" section on manga detail

Add GET /v1/mangas/:id/similar returning the top 5 mangas ranked by
Jaccard tag overlap (shared / union), excluding self, as MangaCard items
in a plain { items } object. Surface them in a hidden-when-empty
"Similar" section on the manga detail page, reusing MangaCard.

Backend: new repo::manga::list_similar with a manga_tags self-join; a
shared cards_from_rows helper (also used by list_cards) that loads
authors+genres concurrently; single-sourced column list via MANGA_COLS +
manga_cols(alias) to replace the fragile SELECT_COLS string-splitting.

Frontend: getSimilarMangas client fn (guards a malformed body), loader
fetch with non-critical .catch fallback, and the catalog grid hoisted to
a shared global .manga-grid (lib/styles/tokens.css), de-duplicating the
per-route copies.

Bump version 0.62.0 -> 0.63.0 (backend + frontend in lockstep).

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

backend/tests/api_mangas.rs

@@ -315,3 +315,166 @@ async fn get_unknown_id_is_404_with_envelope(pool: PgPool) {
     let msg = body["error"]["message"].as_str().expect("message is string");
     assert!(!msg.is_empty(), "message should be non-empty");
 }
+
+// ----------------------------------------------------------------------------
+// GET /v1/mangas/:id/similar — recommendation by tag overlap (Jaccard).
+// ----------------------------------------------------------------------------
+
+/// Attach a tag to a manga via the public API. Asserts the call succeeds
+/// (201 created or 200 already-attached) so test setup failures surface loudly.
+async fn attach_tag(app: &axum::Router, cookie: &str, manga_id: uuid::Uuid, name: &str) {
+    let resp = app
+        .clone()
+        .oneshot(common::post_json_with_cookie(
+            &format!("/api/v1/mangas/{manga_id}/tags"),
+            json!({ "name": name }),
+            cookie,
+        ))
+        .await
+        .unwrap();
+    assert!(
+        resp.status() == StatusCode::CREATED || resp.status() == StatusCode::OK,
+        "attach_tag({name}) failed: {}",
+        resp.status()
+    );
+}
+
+fn ids(body: &serde_json::Value) -> Vec<String> {
+    body["items"]
+        .as_array()
+        .unwrap()
+        .iter()
+        .map(|m| m["id"].as_str().unwrap().to_string())
+        .collect()
+}
+
+#[sqlx::test(migrations = "./migrations")]
+async fn similar_ranks_by_jaccard(pool: PgPool) {
+    let h = common::harness(pool);
+    let (_, cookie) = common::register_user(&h.app).await;
+
+    let a = common::seed_manga_via_api(&h.app, &cookie, "Source").await;
+    let b = common::seed_manga_via_api(&h.app, &cookie, "Perfect Match").await;
+    let c = common::seed_manga_via_api(&h.app, &cookie, "Tight Subset").await;
+    let d = common::seed_manga_via_api(&h.app, &cookie, "Broad Overlap").await;
+    let e = common::seed_manga_via_api(&h.app, &cookie, "No Overlap").await;
+
+    // Source A: t1..t4
+    for t in ["t1", "t2", "t3", "t4"] {
+        attach_tag(&h.app, &cookie, a, t).await;
+    }
+    // B shares all 4 -> Jaccard 4/4 = 1.0
+    for t in ["t1", "t2", "t3", "t4"] {
+        attach_tag(&h.app, &cookie, b, t).await;
+    }
+    // C has t1,t2 -> shares 2 -> Jaccard 2/4 = 0.5
+    for t in ["t1", "t2"] {
+        attach_tag(&h.app, &cookie, c, t).await;
+    }
+    // D has t1..t8 -> shares 4 -> Jaccard 4/8 = 0.5 (tie with C; loses on shared-count tie-break)
+    for t in ["t1", "t2", "t3", "t4", "t5", "t6", "t7", "t8"] {
+        attach_tag(&h.app, &cookie, d, t).await;
+    }
+    // E disjoint -> excluded
+    for t in ["z1", "z2"] {
+        attach_tag(&h.app, &cookie, e, t).await;
+    }
+
+    let resp = h
+        .app
+        .oneshot(common::get(&format!("/api/v1/mangas/{a}/similar")))
+        .await
+        .unwrap();
+    assert_eq!(resp.status(), StatusCode::OK);
+    let body = common::body_json(resp).await;
+    let got = ids(&body);
+
+    let b = b.to_string();
+    let c = c.to_string();
+    let d = d.to_string();
+    // B (1.0) first; then C and D both 0.5 but C wins the shared-count tie-break (D shares 4 too,
+    // wait — D shares 4, C shares 2). Tie-break is more-shared-first, so D precedes C.
+    assert_eq!(got, vec![b, d, c], "ranked B(1.0), D(0.5,4 shared), C(0.5,2 shared)");
+    // Self and the disjoint manga never appear.
+    assert!(!got.contains(&a.to_string()));
+    assert!(!got.contains(&e.to_string()));
+    // Cards carry the enriched shape.
+    assert!(body["items"][0]["authors"].is_array());
+    assert!(body["items"][0]["genres"].is_array());
+}
+
+#[sqlx::test(migrations = "./migrations")]
+async fn similar_caps_at_five_and_excludes_self(pool: PgPool) {
+    let h = common::harness(pool);
+    let (_, cookie) = common::register_user(&h.app).await;
+
+    let source = common::seed_manga_via_api(&h.app, &cookie, "Source").await;
+    attach_tag(&h.app, &cookie, source, "shared").await;
+
+    for i in 0..7 {
+        let m = common::seed_manga_via_api(&h.app, &cookie, &format!("Neighbor {i}")).await;
+        attach_tag(&h.app, &cookie, m, "shared").await;
+    }
+
+    let resp = h
+        .app
+        .oneshot(common::get(&format!("/api/v1/mangas/{source}/similar")))
+        .await
+        .unwrap();
+    assert_eq!(resp.status(), StatusCode::OK);
+    let body = common::body_json(resp).await;
+    let got = ids(&body);
+    assert_eq!(got.len(), 5, "capped at 5");
+    assert!(!got.contains(&source.to_string()), "self excluded");
+}
+
+#[sqlx::test(migrations = "./migrations")]
+async fn similar_empty_when_no_tags(pool: PgPool) {
+    let h = common::harness(pool);
+    let (_, cookie) = common::register_user(&h.app).await;
+    let source = common::seed_manga_via_api(&h.app, &cookie, "Untagged").await;
+
+    let resp = h
+        .app
+        .oneshot(common::get(&format!("/api/v1/mangas/{source}/similar")))
+        .await
+        .unwrap();
+    assert_eq!(resp.status(), StatusCode::OK);
+    let body = common::body_json(resp).await;
+    assert_eq!(body["items"], json!([]));
+}
+
+#[sqlx::test(migrations = "./migrations")]
+async fn similar_empty_when_no_overlap(pool: PgPool) {
+    let h = common::harness(pool);
+    let (_, cookie) = common::register_user(&h.app).await;
+    let source = common::seed_manga_via_api(&h.app, &cookie, "Source").await;
+    let other = common::seed_manga_via_api(&h.app, &cookie, "Unrelated").await;
+    attach_tag(&h.app, &cookie, source, "alpha").await;
+    attach_tag(&h.app, &cookie, other, "beta").await;
+
+    let resp = h
+        .app
+        .oneshot(common::get(&format!("/api/v1/mangas/{source}/similar")))
+        .await
+        .unwrap();
+    assert_eq!(resp.status(), StatusCode::OK);
+    let body = common::body_json(resp).await;
+    assert_eq!(body["items"], json!([]));
+}
+
+#[sqlx::test(migrations = "./migrations")]
+async fn similar_404_for_unknown_manga(pool: PgPool) {
+    let h = common::harness(pool);
+    let resp = h
+        .app
+        .oneshot(common::get(&format!(
+            "/api/v1/mangas/{}/similar",
+            uuid::Uuid::new_v4()
+        )))
+        .await
+        .unwrap();
+    assert_eq!(resp.status(), StatusCode::NOT_FOUND);
+    let body = common::body_json(resp).await;
+    assert_eq!(body["error"]["code"], "not_found");
+}