feat: chat

app/(app)/(reader)/books/bg/[chapter]/[verse]/page.tsx

@@ -4,7 +4,7 @@ import { PageHeader } from "@/components/layout/page-header";
 import { FindInPage } from "@/components/layout/find-in-page";
 import { notFound } from "next/navigation";
 import { getBookMeta, getSingleVerse, getChapterVerseIndex } from "@/lib/api";
-import { ChapterViewer } from "@/app/(app)/books/chapter-viewer";
+import { ChapterViewer } from "@/app/(app)/(reader)/books/chapter-viewer";
 import type { MobileNavGroup } from "@/components/layout/mobile-nav";
 import { ogForVerse, extractQuoteFromHl, buildOgMeta } from "@/lib/og";
 

app/(app)/(reader)/books/books-grid.tsx

@@ -72,11 +72,16 @@ export function BooksGrid({ books }: { books: BookInfo[] }) {
   );
 
   const filtered = useMemo(() => {
-    if (!query.trim()) return books;
-    const q = normalize(query.trim());
-    return normalizedBooks
-      .filter((entry) => entry.searchText.includes(q))
-      .map((entry) => entry.book);
+    const base = query.trim()
+      ? normalizedBooks
+          .filter((entry) =>
+            entry.searchText.includes(normalize(query.trim())),
+          )
+          .map((entry) => entry.book)
+      : books;
+    return [...base].sort((a, b) =>
+      normalize(a.title).localeCompare(normalize(b.title)),
+    );
   }, [books, normalizedBooks, query]);
 
   return (

app/(app)/(reader)/books/bs/[chapter]/[verse]/page.tsx

@@ -12,7 +12,7 @@ import {
   type VerseIndexEntry,
   type VerseRecord,
 } from "@/lib/api";
-import { ChapterViewer } from "@/app/(app)/books/chapter-viewer";
+import { ChapterViewer } from "@/app/(app)/(reader)/books/chapter-viewer";
 import type { MobileNavGroup } from "@/components/layout/mobile-nav";
 import { ogForVerse, extractQuoteFromHl, buildOgMeta } from "@/lib/og";
 

app/(app)/(reader)/books/cc/[lila]/[chapter]/[verse]/page.tsx

@@ -6,7 +6,7 @@ import { PageHeader } from "@/components/layout/page-header";
 import { FindInPage } from "@/components/layout/find-in-page";
 import { notFound } from "next/navigation";
 import { getBookMeta, getSingleVerse, getChapterVerseIndex } from "@/lib/api";
-import { ChapterViewer } from "@/app/(app)/books/chapter-viewer";
+import { ChapterViewer } from "@/app/(app)/(reader)/books/chapter-viewer";
 import type { MobileNavGroup } from "@/components/layout/mobile-nav";
 import { ogForVerse, extractQuoteFromHl, buildOgMeta } from "@/lib/og";
 

app/(app)/(reader)/books/chapter-viewer.tsx

@@ -219,9 +219,17 @@ function VerseCard({
               Purport
             </h3>
             <div className="text-base text-foreground leading-relaxed space-y-3">
-              {verse.purport.map((p, i) => (
-                <p key={i} dangerouslySetInnerHTML={{ __html: p }} />
-              ))}
+              {verse.purport.map((p, i) =>
+                // Cited ślokas come wrapped in <blockquote class="shloka"> — a
+                // block element that can't live inside a <p>, so render those
+                // in a <div> (styled centered + accent via globals.css); plain
+                // prose paragraphs stay as <p>.
+                /^\s*<blockquote/i.test(p) ? (
+                  <div key={i} dangerouslySetInnerHTML={{ __html: p }} />
+                ) : (
+                  <p key={i} dangerouslySetInnerHTML={{ __html: p }} />
+                ),
+              )}
             </div>
           </div>
         )}

app/(app)/(reader)/books/mm/[chapter]/[verse]/page.tsx

@@ -11,7 +11,7 @@ import {
   type VerseIndexEntry,
   type VerseRecord,
 } from "@/lib/api";
-import { ChapterViewer } from "@/app/(app)/books/chapter-viewer";
+import { ChapterViewer } from "@/app/(app)/(reader)/books/chapter-viewer";
 import type { MobileNavGroup } from "@/components/layout/mobile-nav";
 import type { Metadata } from "next";
 import { ogForVerse, extractQuoteFromHl, buildOgMeta } from "@/lib/og";

app/(app)/(reader)/books/nbs/[chapter]/[verse]/page.tsx

@@ -15,7 +15,7 @@ import {
   type VerseRecord,
 } from "@/lib/api";
 import { ogForVerse, extractQuoteFromHl, buildOgMeta } from "@/lib/og";
-import { ChapterViewer } from "@/app/(app)/books/chapter-viewer";
+import { ChapterViewer } from "@/app/(app)/(reader)/books/chapter-viewer";
 import type { MobileNavGroup } from "@/components/layout/mobile-nav";
 
 type NbsMeta = {

app/(app)/(reader)/books/sb/[canto]/[chapter]/[verse]/page.tsx

@@ -6,7 +6,7 @@ import { PageHeader } from "@/components/layout/page-header";
 import { FindInPage } from "@/components/layout/find-in-page";
 import { notFound } from "next/navigation";
 import { getBookMeta, getSingleVerse, getChapterVerseIndex } from "@/lib/api";
-import { ChapterViewer } from "@/app/(app)/books/chapter-viewer";
+import { ChapterViewer } from "@/app/(app)/(reader)/books/chapter-viewer";
 import type { MobileNavGroup } from "@/components/layout/mobile-nav";
 import { ogForVerse, extractQuoteFromHl, buildOgMeta } from "@/lib/og";
 

app/(app)/(reader)/books/sb1962/[chapter]/[verse]/page.tsx

@@ -4,7 +4,7 @@ import { PageHeader } from "@/components/layout/page-header";
 import { FindInPage } from "@/components/layout/find-in-page";
 import { notFound } from "next/navigation";
 import { getBookMeta, getSingleVerse, getChapterVerseIndex } from "@/lib/api";
-import { ChapterViewer } from "@/app/(app)/books/chapter-viewer";
+import { ChapterViewer } from "@/app/(app)/(reader)/books/chapter-viewer";
 import type { MobileNavGroup } from "@/components/layout/mobile-nav";
 import { ogForVerse, extractQuoteFromHl, buildOgMeta } from "@/lib/og";
 

app/(app)/(reader)/disciples/disciples-browser.tsx

@@ -5,6 +5,7 @@ import Link from "next/link";
 import { Card, CardContent } from "@/components/ui/card";
 import { Badge } from "@/components/ui/badge";
 import { Input } from "@/components/ui/input";
+import { UserAvatar } from "@/components/ui/user-avatar";
 import { cn } from "@/lib/utils";
 import {
   Search,
@@ -32,6 +33,14 @@ export type DiscipleSummary = {
   isVerified: boolean;
 };
 
+/** A disciple who has a platform account (linked by an admin). */
+export type DiscipleLink = {
+  discipleId: string;
+  handle: string;
+  name: string;
+  avatarURL: string | null;
+};
+
 export type LetterCount = { letter: string; count: number };
 export type PlaceGroup = { name: string; count: number };
 export type YearGroup = { year: number; count: number };
@@ -49,6 +58,9 @@ type Props = {
   years: YearGroup[];
   totalCount: number;
   filteredCount: number;
+  /** Disciples who have joined the platform — their cards are highlighted and
+   *  link through to the profile. Small set (dozens at most). */
+  links: DiscipleLink[];
 };
 
 type SortMode = "name-asc" | "name-desc" | "date-asc" | "date-desc" | "place";
@@ -306,6 +318,97 @@ function Pagination({
   );
 }
 
+// ---------------------------------------------------------------------------
+// Disciple card
+// ---------------------------------------------------------------------------
+
+/**
+ * One disciple in the grid.
+ *
+ * When `link` is set the disciple has joined the platform, and the card is
+ * highlighted and becomes a link to their profile. The highlight is drawn
+ * entirely from theme tokens (`--primary`, `--ring`) rather than fixed colours,
+ * so it picks up whichever palette the reader has chosen — peacock green under
+ * Tulasī Garden, deep indigo under Yamunā Mist, and so on.
+ */
+function DiscipleCard({
+  disciple,
+  link,
+}: {
+  disciple: DiscipleSummary;
+  link?: DiscipleLink;
+}) {
+  const locationYear = formatLocationYear(
+    disciple.initiationPlace,
+    disciple.initiationDate,
+  );
+
+  const card = (
+    <Card
+      size="sm"
+      className={cn(
+        "h-full transition-all",
+        link
+          ? // On the platform: tinted surface + primary ring so it reads as
+            // "one of us" at a glance across the grid.
+            "bg-primary/[0.06] ring-2 ring-primary/40 hover:ring-primary/70 hover:shadow-md"
+          : "hover:shadow-md hover:ring-foreground/20",
+      )}
+    >
+      <CardContent className="py-3 px-4 space-y-1.5">
+        <div className="flex items-start justify-between gap-2">
+          <p
+            className={cn(
+              "font-semibold leading-snug truncate",
+              link ? "text-primary" : "text-foreground",
+            )}
+          >
+            {disciple.initiatedName}
+          </p>
+          {disciple.suffix && (
+            <Badge
+              variant={link ? "default" : "secondary"}
+              className="shrink-0 text-[10px]"
+            >
+              {disciple.suffix}
+            </Badge>
+          )}
+        </div>
+        {locationYear && (
+          <p className="text-xs text-muted-foreground truncate">
+            {locationYear}
+          </p>
+        )}
+        {link && (
+          <div className="flex items-center gap-1.5 pt-0.5">
+            <UserAvatar
+              src={link.avatarURL}
+              name={link.name}
+              className="size-5"
+              textClassName="text-[9px]"
+            />
+            <span className="truncate text-xs font-medium text-primary">
+              @{link.handle}
+            </span>
+          </div>
+        )}
+      </CardContent>
+    </Card>
+  );
+
+  if (!link) return card;
+
+  return (
+    <Link
+      href={`/u/${link.handle}`}
+      aria-label={`${disciple.initiatedName} — view @${link.handle}'s profile`}
+      className="block rounded-xl outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2"
+    >
+      {card}
+    </Link>
+  );
+}
+
 // ---------------------------------------------------------------------------
 // Component
 // ---------------------------------------------------------------------------
@@ -318,6 +421,7 @@ export function DisciplesBrowser({
   suffixCounts,
   totalCount,
   filteredCount,
+  links,
 }: Props) {
   const [query, setQuery] = useState("");
   const [sort, setSort] = useState<SortMode>("name-asc");
@@ -334,6 +438,13 @@ export function DisciplesBrowser({
     setPage(1);
   };
 
+  // Disciple id → their platform account, for the highlight + profile link.
+  const linkByDiscipleId = useMemo(() => {
+    const map = new Map<string, DiscipleLink>();
+    for (const l of links) map.set(l.discipleId, l);
+    return map;
+  }, [links]);
+
   // Build a lookup map for letter counts
   const countByLetter = useMemo(() => {
     const map = new Map<string, number>();
@@ -539,41 +650,13 @@ export function DisciplesBrowser({
         </div>
       ) : (
         <div className="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-3">
-          {pageData.map((disciple) => {
-            const locationYear = formatLocationYear(
-              disciple.initiationPlace,
-              disciple.initiationDate,
-            );
-
-            return (
-              <Card
-                key={disciple.id}
-                size="sm"
-                className="transition-all hover:shadow-md hover:ring-foreground/20"
-              >
-                <CardContent className="py-3 px-4 space-y-1.5">
-                  <div className="flex items-start justify-between gap-2">
-                    <p className="font-semibold text-foreground leading-snug truncate">
-                      {disciple.initiatedName}
-                    </p>
-                    {disciple.suffix && (
-                      <Badge
-                        variant="secondary"
-                        className="shrink-0 text-[10px]"
-                      >
-                        {disciple.suffix}
-                      </Badge>
-                    )}
-                  </div>
-                  {locationYear && (
-                    <p className="text-xs text-muted-foreground truncate">
-                      {locationYear}
-                    </p>
-                  )}
-                </CardContent>
-              </Card>
-            );
-          })}
+          {pageData.map((disciple) => (
+            <DiscipleCard
+              key={disciple.id}
+              disciple={disciple}
+              link={linkByDiscipleId.get(disciple.id)}
+            />
+          ))}
         </div>
       )}
 

app/(app)/(reader)/disciples/page.tsx

@@ -12,6 +12,7 @@ import {
   getDiscipleYears,
   getDiscipleSuffixCounts,
   getFilteredDiscipleCount,
+  getDiscipleLinks,
 } from "@/lib/disciples";
 import type { SuffixFilter } from "@/lib/disciples";
 import { DisciplesBrowser } from "./disciples-browser";
@@ -62,6 +63,7 @@ export default async function DisciplesPage({
     places,
     years,
     suffixCounts,
+    links,
   ] = await Promise.all([
     getTotalDiscipleCount(),
     getFilteredDisciples(letterFilter, activeSuffix),
@@ -70,6 +72,7 @@ export default async function DisciplesPage({
     getDisciplePlaces(),
     getDiscipleYears(),
     getDiscipleSuffixCounts(),
+    getDiscipleLinks(),
   ]);
 
   // Serialize dates to ISO strings for the client component
@@ -105,6 +108,7 @@ export default async function DisciplesPage({
           years={years}
           totalCount={totalCount}
           filteredCount={filteredCount}
+          links={links}
         />
       </main>
     </div>

app/(app)/(reader)/layout.tsx

@@ -0,0 +1,37 @@
+import { Suspense } from "react";
+import { TextSelectionToolbar } from "@/components/text-selection-toolbar";
+import { TextHighlighter } from "@/components/text-highlighter";
+import { PageBookmarks } from "@/components/social/page-bookmarks";
+
+/**
+ * Reader layout — the annotation surface for the actual scripture library
+ * (books, letters, lectures, essays, glossary, journals, magazines, other
+ * documents, disciples).
+ *
+ * The text-selection toolbar and its two companions (the `?hl=` highlighter
+ * and the persistent in-text bookmark marks) only make sense over long-form
+ * scripture prose. Mounting them in this nested route group — rather than the
+ * parent `(app)` layout — keeps them off the home feed, search, profiles,
+ * settings, downloads, Kautilya, etc., so a stray text selection on chrome
+ * text no longer pops the toolbar.
+ *
+ * This is a route group: it adds NO path segment, so every URL underneath is
+ * unchanged (`/books/...`, `/letters/...`, …). All the outer `(app)` chrome
+ * (header, sidebar, footer, bottom nav) still wraps these pages.
+ */
+export default function ReaderLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return (
+    <>
+      {children}
+      <TextSelectionToolbar />
+      <Suspense fallback={null}>
+        <TextHighlighter />
+      </Suspense>
+      <PageBookmarks />
+    </>
+  );
+}