Move UI to BoardUI with slate + salmon theme; add PDF plan export

- Adopt BoardUI (Pro init): theme tokens, Inter, .dark mode, Button,
  SegmentedControl, Meter, Skeleton and ThemeToggle; remap the app's
  color aliases onto BoardUI tokens and swap lucide for Remix icons
- Retint BoardUI's neutral ramp to cool slate with a salmon accent;
  drop the dotted background; raise muted text contrast
- Simplify the landing page and remove the overlap explorer
- Planner: explicit "I have this" toggle on grocery lines, pantry panel
  above the menu with the staples list spelled out, sticky aisle
  header fix, and a "Download PDF" plan export (jsPDF, lazy-loaded)
- Recipes: replace the family cabbage soup with Cade's Cabbage Soup
  (adds Bone-In Ham Steak to the catalog); remove Ham, Bean & Cabbage Soup
- Remove unused BoardUI components, dependencies and exports

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

app/components/PlannerDashboard.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { AlertCircle, RotateCcw, ShoppingBag, X } from "lucide-react";
+import { RiErrorWarningLine as AlertCircle, RiResetLeftLine as RotateCcw, RiShoppingBag3Line as ShoppingBag, RiCloseLine as X } from "@remixicon/react";
 import { useCallback, useEffect, useMemo, useState, useTransition } from "react";
 import { generateMealPlanAction } from "@/app/actions";
 import { Cart, buildGroceryList } from "@/app/lib/grocery";
@@ -17,6 +17,7 @@ import { MealGrid } from "./MealGrid";
 import { MealSelectorModal } from "./MealSelectorModal";
 import { Navbar } from "./Navbar";
 import { RecipeDialog } from "./RecipeDialog";
+import { Button } from "@/components/base/buttons/button";
 
 interface UndoSnapshot {
   message: string;
@@ -99,7 +100,7 @@ export default function PlannerDashboard() {
 
       <main className="mx-auto max-w-7xl px-4 pt-6 pb-28 sm:px-6 lg:pb-12">
         <div className="grid grid-cols-1 gap-6 lg:grid-cols-3">
-          {/* Left: compact control bar -> immediate MealGrid -> Pantry below */}
+          {/* Left: control bar -> pantry & exclusions -> MealGrid */}
           <div className="space-y-6 lg:col-span-2">
             <ConfigPanel
               state={state}
@@ -133,6 +134,8 @@ export default function PlannerDashboard() {
               </div>
             )}
 
+            <IngredientPanel state={state} dispatch={dispatch} />
+
             <div className={isGenerating ? "pointer-events-none opacity-60 transition-opacity" : "transition-opacity"}>
               <MealGrid
                 state={state}
@@ -143,13 +146,11 @@ export default function PlannerDashboard() {
                 onRemoveSlot={handleRemoveSlot}
               />
             </div>
-
-            <IngredientPanel state={state} dispatch={dispatch} />
           </div>
 
           {/* Right: persistent Market Receipt summary (desktop) */}
           <aside className="hidden lg:block">
-            <div className="sticky top-20 max-h-[calc(100dvh-6rem)] overflow-y-auto rounded-xl border border-line bg-surface p-5">
+            <div className="sticky top-20 max-h-[calc(100dvh-6rem)] overflow-y-auto rounded-3xl border border-border-button-default bg-surface p-5">
               <h2 className="mb-3 font-serif text-xl font-semibold">Market receipt</h2>
               <GrocerySummaryPanel
                 summary={summary}
@@ -170,14 +171,9 @@ export default function PlannerDashboard() {
           className="fixed bottom-20 left-1/2 z-40 flex -translate-x-1/2 items-center gap-3 rounded-xl border border-line-strong bg-surface px-4 py-2.5 text-sm shadow-lg lg:bottom-6"
         >
           <span className="text-ink">{undo.message}</span>
-          <button
-            type="button"
-            onClick={handleUndo}
-            className="trim-cap inline-flex min-h-8 items-center gap-1.5 rounded-lg bg-brand-600 px-3 py-1 text-xs font-semibold text-on-accent hover:bg-brand-500"
-          >
-            <RotateCcw className="size-3.5" aria-hidden />
+          <Button size="small" leadingIcon={RotateCcw} onClick={handleUndo}>
             Undo
-          </button>
+          </Button>
           <button
             type="button"
             onClick={() => setUndo(null)}
@@ -195,14 +191,9 @@ export default function PlannerDashboard() {
           <div className="flex-1">
             <BudgetMeter spent={summary.checkoutTotal} budget={state.targetBudget} compact />
           </div>
-          <button
-            type="button"
-            onClick={() => setGroceriesOpen(true)}
-            className="trim-cap inline-flex min-h-10 shrink-0 items-center gap-2 rounded-lg bg-brand-600 px-4 py-2 text-sm font-semibold text-on-accent shadow-2xs hover:bg-brand-500"
-          >
-            <ShoppingBag className="size-4" strokeWidth={2} aria-hidden />
+          <Button className="shrink-0" leadingIcon={ShoppingBag} onClick={() => setGroceriesOpen(true)}>
             Receipt ({summary.lines.length})
-          </button>
+          </Button>
         </div>
         <p className="sr-only" aria-live="polite">
           {mealCount} meals planned, estimated checkout {summary.checkoutTotal.toFixed(2)} dollars