Widen the header and collapse blacklist listings by default

- the header row is no longer capped at 1600px, so the nav hugs the left
  edge and the status/account controls the right; main content and footer
  keep their width
- OnlinePage's blacklist chips and the Followed page's blacklisted-tag
  cloud start collapsed behind a count toggle (N tags / N entries)

frontend/src/features/follows/FollowedPage.tsx

@@ -1,5 +1,5 @@
 import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
-import { Eye, StarOff } from "lucide-react";
+import { ChevronDown, ChevronRight, Eye, StarOff } from "lucide-react";
 import { useState } from "react";
 import { Link } from "react-router-dom";
 
@@ -148,48 +148,65 @@ function BlacklistCloudPanel() {
       q.state.data?.status === "building" ? 2000 : false,
   });
   const cloud = query.data;
+  const [expanded, setExpanded] = useState(false);
 
   return (
     <section className="rounded-lg border border-ctp-surface0 bg-ctp-base p-4">
-      <div className="flex flex-wrap items-center justify-between gap-2">
+      <button
+        type="button"
+        onClick={() => setExpanded((value) => !value)}
+        title={expanded ? "Hide the tags" : "Show the tags"}
+        className="flex w-full items-center justify-between gap-2 text-left"
+      >
         <h2 className="text-sm font-semibold text-ctp-subtext1">
           Blacklisted tags
         </h2>
-        <p className="text-xs text-ctp-overlay0">
-          {cloud?.source === "user"
-            ? "From your e621 blacklist"
-            : "From e621's anonymous default blacklist"}
-          {cloud ? ` · ${cloud.blacklist_count} entries` : ""}
-          {cloud ? ` · ${cloud.posts} feed post(s) scanned` : ""}
-          {cloud?.computed_at ? ` · computed ${formatDate(cloud.computed_at)}` : ""}
+        <span className="flex items-center gap-1.5 font-mono text-[11px] text-ctp-overlay0">
+          {cloud ? `${cloud.blacklist_count} entries` : "…"}
           {cloud?.status === "building" ? (
-            <span className="ml-2 inline-flex items-center gap-1.5">
-              <Spinner className="h-3 w-3" /> building…
-            </span>
+            <Spinner className="h-3 w-3" />
           ) : null}
-        </p>
-      </div>
+          {expanded ? (
+            <ChevronDown className="h-3.5 w-3.5" />
+          ) : (
+            <ChevronRight className="h-3.5 w-3.5" />
+          )}
+        </span>
+      </button>
 
-      {query.isPending ? (
-        <div className="mt-3 flex justify-center py-4">
-          <Spinner className="h-4 w-4" />
-        </div>
-      ) : cloud && cloud.tags.length > 0 ? (
-        <div className="mt-3 flex flex-wrap gap-1.5">
-          {cloud.tags.map(([tag, count]) => (
-            <span
-              key={tag}
-              className="rounded border border-ctp-red/30 bg-ctp-red/10 px-1.5 py-0.5 font-mono text-[11px] text-ctp-red"
-            >
-              {tag} ({count})
-            </span>
-          ))}
-        </div>
-      ) : (
-        <p className="mt-3 text-xs text-ctp-overlay0">
-          No blacklisted tags in your feeds.
-        </p>
-      )}
+      {expanded ? (
+        <>
+          <p className="mt-2 text-xs text-ctp-overlay0">
+            {cloud?.source === "user"
+              ? "From your e621 blacklist"
+              : "From e621's anonymous default blacklist"}
+            {cloud ? ` · ${cloud.posts} feed post(s) scanned` : ""}
+            {cloud?.computed_at
+              ? ` · computed ${formatDate(cloud.computed_at)}`
+              : ""}
+          </p>
+          {query.isPending ? (
+            <div className="mt-3 flex justify-center py-4">
+              <Spinner className="h-4 w-4" />
+            </div>
+          ) : cloud && cloud.tags.length > 0 ? (
+            <div className="mt-3 flex flex-wrap gap-1.5">
+              {cloud.tags.map(([tag, count]) => (
+                <span
+                  key={tag}
+                  className="rounded border border-ctp-red/30 bg-ctp-red/10 px-1.5 py-0.5 font-mono text-[11px] text-ctp-red"
+                >
+                  {tag} ({count})
+                </span>
+              ))}
+            </div>
+          ) : (
+            <p className="mt-3 text-xs text-ctp-overlay0">
+              No blacklisted tags in your feeds.
+            </p>
+          )}
+        </>
+      ) : null}
     </section>
   );
 }