fix(reader): Library in the nav, breadcrumbs in the chapter

marketing-site/pages/read/recipe/[id].jsx

@@ -2,6 +2,7 @@ import Head from "next/head";
 import Link from "next/link";
 import { useRouter } from "next/router";
 import ReaderNav from "../../../components/reader/ReaderNav";
+import ReaderCrumbs from "../../../components/reader/ReaderCrumbs";
 import ReaderFooter from "../../../components/reader/ReaderFooter";
 import WorkflowBlock from "../../../components/reader/WorkflowBlock";
 import useActivation from "../../../components/reader/useActivation";
@@ -16,7 +17,7 @@ export default function RecipeFocus() {
   if (!router.isReady) {
     return (
       <>
-        <ReaderNav chapterName="Real Estate" />
+        <ReaderNav here="chapter" />
         <main>
           <div className="wrap reader-wide recipe-focus-page">
             <p className="spec">Loading recipe…</p>
@@ -62,16 +63,18 @@ export default function RecipeFocus() {
         <meta name="viewport" content="width=device-width, initial-scale=1" />
       </Head>
 
-      <ReaderNav chapterName="Real Estate" />
+      <ReaderNav here="chapter" />
       <main>
         <div className="wrap reader-wide recipe-focus-page">
+          <ReaderCrumbs
+            items={[
+              { href: "/read", label: "Library" },
+              { href: "/read/real-estate", label: "Real Estate" },
+              { label: recipe.id, current: true },
+            ]}
+          />
           <span className="spec demo-chip">Reading demo · not the live book</span>
           <p className="spec chapter-kicker">Print / focus view</p>
-          <p className="focus-back">
-            <Link href={`/read/real-estate#${recipe.anchor}`}>← Back to the chapter</Link>
-            {" · "}
-            <Link href="/read">Library</Link>
-          </p>
           <WorkflowBlock
             recipe={recipe}
             index={Math.max(RECIPES.findIndex((r) => r.id === recipe.id) + 1, 1)}