Phase 3: J-IDs, ownership, roles, guest safety, adaptive detail, download

Backend:
- User.role (user/uploader/staff) with can_upload; uploads and downloads
  gated to uploader+; owners and staff can edit their items
- MediaItem.uploaded_by plus J-<id> identity (serializer, admin,
  scan_files --user, first superuser as default owner)
- API resolves J-<id>, bare numeric ids and MD5s; neighbors and lookup
  return j_ids
- Guest safety: mirror e621's anonymous default blacklist into Redis
  (parses comments, negations and wildcards), flag hidden_from_guests
  and filter lists, details and lookups for anonymous users
- POST /api/online/downloads/ writes an e621 file into the watched
  folder and indexes it for the uploader
- MariaDB + Redis via docker compose (host ports 3307/6380), PyMySQL
  driver shim, Redis cache replacing the file cache; SQLite data
  dumped and loaded into MariaDB

Frontend:
- Single /detail/:itemId route with an adaptive shell: J-<id> renders
  the library item, bare numbers render the e621 post
- Legacy /view/<md5> and /online/view/<id> redirect to canonical URLs
- Cards expose J-IDs; library custom-data editor is read-only for
  non-owners
- Role gating: Upload hidden/blocked for regular users, account shows
  the role, guest hint on the library

frontend/src/features/detail/DetailPage.tsx

@@ -0,0 +1,32 @@
+import { useParams } from "react-router-dom";
+
+import { EmptyState } from "@/components/ui";
+import { LibraryDetail } from "@/features/library/LibraryDetail";
+import { OnlineDetail } from "@/features/online/OnlineDetail";
+
+const J_ID_RE = /^J-\d+$/i;
+
+export default function DetailPage() {
+  const { itemId = "" } = useParams();
+
+  if (J_ID_RE.test(itemId)) {
+    const normalized = `J-${itemId.slice(2)}`;
+    return <LibraryDetail jId={normalized} />;
+  }
+
+  if (/^\d+$/.test(itemId)) {
+    return <OnlineDetail postId={Number(itemId)} />;
+  }
+
+  return (
+    <EmptyState
+      title="Unknown item"
+      description={
+        <span className="font-mono text-xs">
+          Use /detail/J-&lt;id&gt; for library items or /detail/&lt;id&gt; for
+          e621 posts.
+        </span>
+      }
+    />
+  );
+}

frontend/src/features/detail/DetailShell.tsx

@@ -0,0 +1,29 @@
+import type { ReactNode } from "react";
+
+export function DetailShell({
+  breadcrumb,
+  actions,
+  media,
+  aside,
+  footer,
+}: {
+  breadcrumb: ReactNode;
+  actions?: ReactNode;
+  media: ReactNode;
+  aside: ReactNode;
+  footer?: ReactNode;
+}) {
+  return (
+    <div className="flex flex-col gap-4">
+      {breadcrumb}
+      <div className="grid gap-6 lg:grid-cols-[320px_minmax(0,1fr)]">
+        <aside className="order-2 flex flex-col gap-4 lg:order-1">{aside}</aside>
+        <div className="order-1 flex min-w-0 flex-col gap-4 lg:order-2">
+          {actions}
+          {media}
+          {footer}
+        </div>
+      </div>
+    </div>
+  );
+}