fix: tighten sharing and shadcn composition

src/app/d/[slug]/page.tsx

@@ -11,6 +11,7 @@ import { DashboardSwitcher } from "@/components/dashboard-switcher";
 import { DashboardTab } from "@/components/dashboard-tab";
 import { DashboardGreeting } from "@/components/dashboard-greeting";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import { Skeleton } from "@/components/ui/skeleton";
 import { auth } from "@/lib/auth";
 import { db } from "@/lib/db";
 import { dashboards } from "@/modules/_core/schema";
@@ -113,10 +114,10 @@ export default async function DashboardPage({
                 <CardContent>
                   <Suspense
                     fallback={
-                      <div className="animate-pulse space-y-2">
-                        <div className="h-3 w-3/4 rounded bg-muted" />
-                        <div className="h-3 w-1/2 rounded bg-muted" />
-                        <div className="h-3 w-2/3 rounded bg-muted" />
+                      <div className="space-y-3">
+                        <Skeleton className="h-4 w-3/4" />
+                        <Skeleton className="h-4 w-1/2" />
+                        <Skeleton className="h-4 w-2/3" />
                       </div>
                     }
                   >

src/app/globals.css

@@ -67,6 +67,7 @@
   --radius-md: var(--r-md);
   --radius-lg: var(--r-lg);
   --radius-xl: var(--r-xl);
+  --color-ok-dark: var(--c-success);
 }
 
 /* ── Paper-and-ink primitives (shared across all palettes) ────────── */
@@ -98,7 +99,7 @@
   --ok: #4f7a3f;
   --warn: #c99a3f;
   --bad: #b05246;
-
+  --c-success: var(--ok);
   /* Density (regular by default; overridden via [data-density]) */
   --row: 48px;
   --pad: 14px;
@@ -342,6 +343,7 @@
   --ok: #82b070;
   --warn: #dcb46a;
   --bad: #d8746a;
+  --c-success: var(--ok);
 
   --background: var(--paper);
   --foreground: var(--ink);

src/app/layout.tsx

@@ -15,6 +15,7 @@ import { CommandPalette } from "@/components/command-palette";
 import { PwaRegister } from "@/components/pwa-register";
 import { InstallPrompt } from "@/components/install-prompt";
 import { AppShell } from "@/components/app-shell";
+import { AppToaster } from "@/components/app-toaster";
 import { DEFAULT_THEME, navStyleToDataNav } from "@/modules/_core/themes";
 import type { Palette, ThemeMode, FontPair, Density, NavStyle } from "@/modules/_core/themes";
 
@@ -169,6 +170,7 @@ export default async function RootLayout({ children }: { children: React.ReactNo
           <CommandPalette />
           <InstallPrompt />
           <PwaRegister />
+          <AppToaster position="bottom-right" />
         </QuickAddProvider>
       </body>
     </html>

src/app/s/[token]/page.tsx

@@ -38,7 +38,9 @@ export default async function SharePage({ params }: { params: Promise<{ token: s
     return <ShareError message="This content type cannot be shared." />;
   }
 
-  const data = await entityReg.loadForShare(resolved.entityId);
+  const data = await entityReg.loadForShare(resolved.entityId, {
+    householdId: resolved.householdId,
+  });
   if (!data) {
     recordFailure(rlKey);
     return <ShareError />;

src/app/settings/page.tsx

@@ -9,6 +9,7 @@ import { PushOptIn } from "@/components/push-opt-in";
 import { NotifyChannelToggles } from "@/components/notify-channel-toggles";
 import { ResponsiveSidebar } from "@/components/settings-section";
 import type { SectionId } from "@/components/settings-section";
+import { AvatarFallbackWithName } from "@/components/avatar-fallback";
 import { revokeShareLinkAction } from "./actions";
 import { listCalendars } from "@/modules/calendar/server/queries";
 import { listLists } from "@/modules/lists/server/queries";
@@ -43,7 +44,7 @@ export default async function SettingsPage({
     <div className="grid gap-5 sm:grid-cols-[220px_1fr]">
       <ResponsiveSidebar active={section} />
       <div className="space-y-4">
-        {section === "household" && <HouseholdSection household={household} userName={user.name} />}
+        {section === "household" && <HouseholdSection household={household} user={user} />}
         {section === "sharing" && <SharingSection />}
         {section === "notifications" && (
           <NotificationsSection user={user} vapidKey={vapidKey} ntfyConfigured={ntfyConfigured} />
@@ -58,10 +59,10 @@ export default async function SettingsPage({
 
 function HouseholdSection({
   household,
-  userName,
+  user,
 }: {
   household: { id: string; name: string };
-  userName: string | null;
+  user: { name: string | null; image: string | null };
 }) {
   return (
     <>
@@ -91,11 +92,9 @@ function HouseholdSection({
         </CardHeader>
         <CardContent>
           <div className="set-row" style={{ borderBottom: "0", padding: 0 }}>
-            <span className="avatar avatar-lg" style={{ background: "var(--c-household)" }}>
-              {(userName ?? "?").trim()[0]?.toUpperCase()}
-            </span>
+            <AvatarFallbackWithName name={user.name ?? undefined} image={user.image} />
             <div className="label">
-              <div className="t">{userName ?? "Anonymous"}</div>
+              <div className="t">{user.name ?? "Anonymous"}</div>
               <div className="d">Signed in via Authentik</div>
             </div>
           </div>