diff --git a/.github/workflows/firebase-hosting-merge.yml b/.github/workflows/firebase-hosting-merge.yml
index b6c15a2..9126330 100644
--- a/.github/workflows/firebase-hosting-merge.yml
+++ b/.github/workflows/firebase-hosting-merge.yml
@@ -128,13 +128,38 @@ jobs:
       - name: Build API
         run: go build -v ./cmd/api
 
+  # ===========================================
+  # Functions: Test (Jest)
+  # ===========================================
+  functions-test:
+    name: Functions - Test (Jest)
+    runs-on: ubuntu-latest
+    defaults:
+      run:
+        working-directory: ./functions
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: ${{ env.NODE_VERSION }}
+          cache: 'npm'
+          cache-dependency-path: functions/package-lock.json
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Run tests
+        run: npm test
+
   # ===========================================
   # Deploy: Firebase Hosting (finalwishes-prod)
   # ===========================================
   deploy-hosting:
     name: Deploy - Firebase Hosting
     runs-on: ubuntu-latest
-    needs: [web-build, api-check]
+    needs: [web-build, api-check, functions-test]
     if: github.ref == 'refs/heads/main' && github.event_name == 'push'
     steps:
       - uses: actions/checkout@v4
@@ -186,7 +211,7 @@ jobs:
   deploy-api:
     name: Deploy - API to Cloud Run
     runs-on: ubuntu-latest
-    needs: [api-check]
+    needs: [api-check, functions-test]
     if: github.ref == 'refs/heads/main' && github.event_name == 'push'
     steps:
       - uses: actions/checkout@v4
@@ -226,7 +251,7 @@ jobs:
   deploy-functions:
     name: Deploy - Firebase Functions
     runs-on: ubuntu-latest
-    needs: [web-build, api-check]
+    needs: [web-build, api-check, functions-test]
     if: github.ref == 'refs/heads/main' && github.event_name == 'push'
     steps:
       - uses: actions/checkout@v4
diff --git a/.github/workflows/firebase-hosting-pull-request.yml b/.github/workflows/firebase-hosting-pull-request.yml
index d9e4344..a615fee 100644
--- a/.github/workflows/firebase-hosting-pull-request.yml
+++ b/.github/workflows/firebase-hosting-pull-request.yml
@@ -70,12 +70,38 @@ jobs:
       - name: Run tests
         run: npm test
 
+  # ===========================================
+  # Functions: Test (Jest)
+  # ===========================================
+  functions-test:
+    name: Functions - Test (Jest)
+    if: ${{ github.event.pull_request.head.repo.full_name == github.repository }}
+    runs-on: ubuntu-latest
+    defaults:
+      run:
+        working-directory: ./functions
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: ${{ env.NODE_VERSION }}
+          cache: 'npm'
+          cache-dependency-path: functions/package-lock.json
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Run tests
+        run: npm test
+
   # ===========================================
   # Web: Build & Deploy Preview
   # ===========================================
   build_and_preview:
     name: Web - Build & Preview
-    needs: [api-check, web-test]
+    needs: [api-check, web-test, functions-test]
     if: ${{ github.event.pull_request.head.repo.full_name == github.repository }}
     runs-on: ubuntu-latest
     steps:
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 9194f77..cec5852 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -9,11 +9,14 @@ Format follows [Keep a Changelog](https://keepachangelog.com/en/1.1.0/) and [Sem
 - **Shared-services signing provider — consume Sirsi first, dissociated fallback (ADR-047)** (`api/internal/opensign/provider.go`, `handler.go`, `webhook.go`) — the OpenSign create flow now goes through a `SigningProvider` that CONSUMES THE SIRSI SIGN SERVICE FIRST (`SERVICES_REGISTRY` endpoint, Bearer/ADR-006 HMAC, tenant-attributed) and falls back to dissociated/self-hosted infra ONLY on a Sirsi-org **availability** failure (transport/timeout/5xx) — never on a clean business rejection (4xx), which is surfaced. Each result records `ServedBy` for consumption observability. Realizes the owner's shared-services model (tenants buy Sirsi services; resilient to Sirsi-org outages) portfolio-wide. The server-side envelope→directive binding + fail-closed webhook are unchanged. Config via `SIRSI_SIGN_*` (primary) + `OPENSIGN_*` (fallback) env/secrets.
 - **Google Photos import — frontend flow (CR-12, ADR-045)** (`web/src/lib/google-photos-import.ts`, `web/src/routes/estates.$estateId.heirlooms.tsx`) — wires the existing backend Picker routes (`/api/v1/heirlooms/{estateId}/google-photos/*`) to the UI: an "Import from Google Photos" button on the Heirloom Registry obtains a Picker-scoped Google OAuth token via Google Identity Services (works for email/password users — no Firebase session disruption), creates a picking session, opens Google's own picker, polls until the user finishes, then triggers the server-side import (download + de-dup + store as heirlooms). Realtime list shows imports automatically. GIS load retries on script error + a 90s token timeout guards a dismissed popup. **OWNER PREREQUISITES (build-time/infra):** enable the Google Photos Picker API on `finalwishes-prod`, add `…/auth/photospicker.mediaitems.readonly` to the OAuth consent screen, and set `VITE_GOOGLE_OAUTH_CLIENT_ID`. Until configured, the button reports "not configured." Full end-to-end verification requires those prereqs.
 - **Legal RAG corpus ingestion pipeline (CR-10, ADR-044)** (`api/cmd/corpus-ingest`, `api/internal/guidance/rag.go`, `docs/legal-corpus/manifest.md`) — an idempotent CLI that loads the Shepherd's legal corpus (`legal_corpus_sources` + `legal_corpus_chunks`, pgvector) from a manifest of **owner-verified, verbatim** statute text. Chunks on blank-line paragraph boundaries (≤~2000 chars, never mid-sentence), embeds each chunk with `gemini-embedding-001`/`RETRIEVAL_DOCUMENT` (new `EmbedDocument` — asymmetric to the retriever's `RETRIEVAL_QUERY`), and upserts by id. `-dry-run` parses+chunks with no DB/Vertex. The pipeline NEVER generates/paraphrases/truncates legal text (Rule 9); engineering owns the pipeline, owner/legal owns sourcing the verified text (IL/MD/MN launch statutes). Built + vetted + dry-run verified; corpus population + the CR-10 evidence run remain the owner/data step.
+- **CI now runs the Cloud Functions Jest suite** (`.github/workflows/firebase-hosting-pull-request.yml`, `.github/workflows/firebase-hosting-merge.yml`) — added a `functions-test` job (ubuntu-latest, Node 22, `working-directory: ./functions`, `npm ci` → `npm test`) to both PR and merge workflows. Previously `functions/index.test.js` (18 tests covering `autoMatchInvitation` backfill, `sendMail` recipient validation, MIME header-injection guards, Guardian inactivity) ran in neither CI workflow and could silently rot while functions were still deployed. The job now gates the PR aggregate (`build_and_preview`) alongside `api-check`/`web-test`, and gates all three merge deploys (`deploy-hosting`, `deploy-api`, `deploy-functions`) so no release ships with red functions tests. Closes the deferred residual from the completion wave (the fix-bucket globs excluded workflow YAML).
 
 ### Changed
+- **OpenSign signer is now the estate PRINCIPAL, not the caller — with a verified-email gate (ADR-047; claude-home signer=principal decision 2026-06-14)** (`api/internal/opensign/handler.go`, `signer.go`, `webhook.go`, `cmd/api/main.go`) — a legal directive/POA must be signed BY the estate principal whose estate it governs; an executor/admin only INITIATES the ceremony. `HandleCreateEnvelope` no longer takes the signer identity from the authenticated caller's token claims. It now resolves the signer SERVER-SIDE from `estates/{id}.principalId` → Firebase Auth (verified email + display name), and **REJECTS with HTTP 403 if the principal's email is not verified** (signing cannot proceed against an unverified address). Missing/empty `principalId` → 400; auth client unavailable → 503; Firebase lookup failure → 502. The caller is recorded only as `initiatedBy` in the server-only `signing_envelopes` audit record (`createdBy` retained for back-compat; `signerEmail` now persisted). `NewWebhookHandler` gains an `*firebaseAuth.Client` param (threaded from `main.go`, declared at outer scope so it is in scope at all 3 call sites). Resolution is fronted by a small `signerResolver` interface (production `firebaseSignerResolver` backed by Firestore+Firebase Auth; a fake in tests) — the auth client cannot be constructed offline. This supersedes the prior "signer = authenticated caller" behavior. `provider.go` untouched.
 - **Soul Log per-recipient narrowing — `sharedWith` UIDs (ADR-046 #1 residual closed)** (`firestore.rules`, `firestore.indexes.json`, `web/src/routes/estates.$estateId.soul-log.lazy.tsx`, `web/src/lib/firestore.ts`, `functions/index.js`, `scripts/migrate-soullog-sharedwith.js`) — a non-owner could read EVERY `shared` Soul Log entry (incl. other heirs'); now a non-owner reads only entries shared WITH THEM. Entries carry `sharedWith` (array of heir UIDs); the read rule + non-owner query gate on `request.auth.uid in resource.data.sharedWith` (array-contains, new composite index). The composer resolves tagged heir names→UIDs at save; `autoMatchInvitation` backfills a heir's UID into `sharedWith` of entries tagged with their name when they accept (so pre-registration sharing resolves). Ships an idempotent DRY-RUN-by-default migration for existing entries (`scripts/migrate-soullog-sharedwith.js` — owner runs `--apply` AFTER review). **Migration must run before the rule deploys, as the rule/query is breaking for un-migrated entries.**
 
 ### Fixed
+- **PR test contract drift — email-only invitations and settings MFA access** (`web/src/lib/invitations.test.ts`, `web/src/lib/persona.test.ts`, `web/src/components/guards/RoleGuard.test.ts`) — aligned Vitest expectations with the documented production contract: invitations remain email-only until a live SMS provider/function exists, so phone input from older callers is ignored rather than persisted or queued; fiduciary/heir access to `settings` remains allowed for MFA/profile security while protected estate surfaces stay blocked.
 - **HIGH — OpenSign signing ceremony now estate-bound (H1 create-side closed; Assiduous pattern)** (`api/internal/opensign/handler.go`, `webhook.go`, `cmd/api/main.go`, `firestore.rules`, `web/src/routes/estates.$estateId.directives.lazy.tsx`) — `CreateEnvelopeHandler` was a standalone func that took `signerEmail`/templateId from the body with **no estate binding**, and the webhook stamped the verified result onto **whatever directive matched the envelopeId across ALL estates** (a client-writable field). Adopted the proven Assiduous `opensign.Service` pattern: the create handler is now a method on the fs-bearing handler, requires `estateId`+`directiveId`, verifies estate **writer** access, and records a **server-only `signing_envelopes/{envelopeId}` → (estate,directive) mapping**; `handleSigningCompleted`/`handleSigningDeclined`/status-poll resolve that mapping with a direct GET and update **only the bound directive** — the signing evidence chain can no longer be redirected to another estate's directive. The signer identity is now forced to the AUTHENTICATED caller (token email claim) — a writer can no longer name an arbitrary signerEmail (claude-home PR #4 review). (The unauthenticated webhook **forge** was already closed separately.) Added `auth.ContextWithUserID` test helper.
 
 ### Added
diff --git a/api/cmd/api/main.go b/api/cmd/api/main.go
index d02eefe..989f1c3 100644
--- a/api/cmd/api/main.go
+++ b/api/cmd/api/main.go
@@ -12,6 +12,7 @@ import (
 	"cloud.google.com/go/firestore"
 	"cloud.google.com/go/storage"
 	firebase "firebase.google.com/go/v4"
+	firebaseAuth "firebase.google.com/go/v4/auth"
 	"github.com/go-chi/chi/v5"
 	"github.com/go-chi/chi/v5/middleware"
 	"github.com/go-chi/cors"
@@ -200,6 +201,12 @@ func main() {
 
 	// Initialize Firebase Admin for auth token verification
 	var authMiddleware func(http.Handler) http.Handler
+	// authClient is also consumed by the OpenSign create-envelope handler to resolve the
+	// estate PRINCIPAL's verified identity (the legal signer is the principal, never the
+	// caller — claude-home signer=principal decision 2026-06-14). Declared at the outer
+	// scope so it is in scope at the NewWebhookHandler call sites below; stays nil in
+	// local dev with no Firebase Auth.
+	var authClient *firebaseAuth.Client
 
 	firebaseApp, err := firebase.NewApp(ctx, nil)
 	if err != nil {
@@ -210,7 +217,7 @@ func main() {
 		log.Warn().Err(err).Msg("Firebase Admin SDK initialization failed — auth middleware disabled (local dev only)")
 		authMiddleware = func(next http.Handler) http.Handler { return next }
 	} else {
-		authClient, err := firebaseApp.Auth(ctx)
+		ac, err := firebaseApp.Auth(ctx)
 		if err != nil {
 			if projectID != "" {
 				log.Fatal().Err(err).Msg("Firebase Auth client initialization failed in production mode")
@@ -218,6 +225,7 @@ func main() {
 			log.Warn().Err(err).Msg("Firebase Auth client initialization failed — auth middleware disabled (local dev only)")
 			authMiddleware = func(next http.Handler) http.Handler { return next }
 		} else {
+			authClient = ac
 			log.Info().Msg("Firebase Admin Auth initialized — token verification active")
 			authMiddleware = auth.Middleware(authClient)
 		}
@@ -335,7 +343,7 @@ func main() {
 	r.Route("/api/v1", func(r chi.Router) {
 		r.Use(authMiddleware)
 		r.Route("/opensign", func(r chi.Router) {
-			oh := opensign.NewWebhookHandler(fs)
+			oh := opensign.NewWebhookHandler(fs, authClient)
 			r.Post("/create-envelope", oh.HandleCreateEnvelope)
 			if fs != nil {
 				r.Get("/status", oh.HandleCheckSigningStatus)
@@ -344,13 +352,13 @@ func main() {
 	})
 	// OpenSign webhook — no auth, uses webhook signature verification
 	if fs != nil {
-		webhookHandler := opensign.NewWebhookHandler(fs)
+		webhookHandler := opensign.NewWebhookHandler(fs, authClient)
 		r.Post("/api/v1/opensign/webhook", webhookHandler.HandleWebhook)
 	}
 
 	r.Group(func(r chi.Router) {
 		r.Use(authMiddleware)
-		r.Post("/api/envelopes", opensign.NewWebhookHandler(fs).HandleCreateEnvelope)
+		r.Post("/api/envelopes", opensign.NewWebhookHandler(fs, authClient).HandleCreateEnvelope)
 	})
 
 	// Guidance routes (The Shepherd v3 — Claude Opus via sirsi-ai, Genkit fallback)
@@ -473,7 +481,6 @@ func main() {
 			r.Post("/death-cert/confirm", probateHandler.HandleConfirmDeathCert)
 			r.Get("/death-cert", probateHandler.HandleGetDeathCertFacts)
 			r.Get("/forms", probateHandler.HandleGetFormTemplates)
-			r.Get("/forms/data", probateHandler.HandleGetFormData)
 			r.Get("/executor/status", probateHandler.HandleGetExecutorStatus)
 			r.Post("/executor/confirm", probateHandler.HandleConfirmExecutorRole)
 			r.Get("/advance-directives", probateHandler.HandleGetAdvanceDirectives)
diff --git a/api/internal/forms/maps/il_small_estate_3606.go b/api/internal/forms/maps/il_small_estate_3606.go
index add7c64..b4d4b4e 100644
--- a/api/internal/forms/maps/il_small_estate_3606.go
+++ b/api/internal/forms/maps/il_small_estate_3606.go
@@ -5,23 +5,32 @@ import "github.com/sirsi-technologies/finalwishes-api/internal/forms"
 // SmallEstateAffidavit3606 returns the coordinate map for the Illinois Small
 // Estate Affidavit (SOS/Probate Form 3606, rev. 1/26), 755 ILCS 5/25-1.
 //
-// The blank is flat (no AcroForm), 4 pages, US Letter. This first-pass map
-// covers the core single-value affidavit fields (affiant + decedent identity,
-// dates, addresses, relationship) and flags the execution block on page 4
-// (signature, date, notary) as Execution=true — never stamped, wet-sign +
-// notarization required.
+// The blank is flat (no AcroForm), 4 pages, US Letter. This map covers:
+//   - the core single-value affidavit fields (affiant + decedent identity,
+//     dates, addresses, relationship);
+//   - the single-claimant rows of the variable-length schedules — the first
+//     creditor row (para 6/7), the first heir/legatee row (para 9), the total
+//     personal-property valuation, and the spousal/child award amount — which
+//     cover the common one-creditor / one-heir estate without a repeating-row
+//     renderer;
+//   - the execution block on page 4 (signature, date, notary), flagged
+//     Execution=true — never stamped, wet-sign + notarization required.
 //
-// NOT YET MAPPED (documented limitation — needs a repeating-row renderer, a
-// future engine extension): the variable-length schedules — creditor Classes
-// 1–7 (paras 6–7), heirs/legatees tables (paras 9–10), and the spousal/child
-// award computations. Those rows vary per estate and cannot be expressed as
-// fixed coordinates. Single-claimant common cases can be added as discrete
-// fields later; multi-row support is tracked separately.
+// MULTI-ROW LIMITATION (tracked, not hidden): estates with MORE THAN ONE
+// creditor in any of Classes 1–7 (paras 6–7) or MORE THAN ONE heir/legatee
+// (paras 9–10) need a repeating-row renderer — a future forms-engine extension.
+// Until that lands, multi-claimant estates must complete the extra rows by hand
+// on the printed draft; the prefill stamps only the first row of each schedule.
+// The fill engine's missing-required reporting plus the PREPARATION-ASSISTANCE
+// disclaimer keep this Rule-9 honest: nothing is asserted that was not supplied.
 //
-// Coordinates are derived from positioned-text extraction (pdftotext -bbox) and
-// marked ConfidenceLow: the affidavit uses dotted/underscore leaders, so the
-// exact blank-start on each line is an estimate to be tuned against the proof
-// raster before this form is treated as production-ready.
+// PRODUCTION READINESS: every coordinate below is marked ConfidenceLow. The
+// affidavit uses dotted/underscore leaders, so each blank-start X/Y is an
+// estimate derived from positioned-text extraction (pdftotext -bbox) that MUST
+// be tuned against the proof raster (docs/forms-phase0/proof/) before this form
+// is offered as a final draft. Callers should treat il_small_estate_3606 as a
+// PREVIEW form — surface it behind a preview affordance, not as GA — until a
+// proof-raster pass promotes these coordinates to ConfidenceHigh.
 func SmallEstateAffidavit3606() *forms.CoordinateMap {
 	return &forms.CoordinateMap{
 		FormID:           "il_small_estate_3606",
@@ -79,6 +88,71 @@ func SmallEstateAffidavit3606() *forms.CoordinateMap {
 				Note:       "After \"before their death was\" (x315), yTop 309.81.",
 			},
 
+			// --- Page 2: personal-property valuation + first creditor row ---
+			//
+			// Single-claimant subset of the variable-length schedules. The first
+			// row of each schedule is mapped here; additional rows require the
+			// repeating-row renderer (documented limitation above) and are
+			// completed by hand on the printed draft.
+			{
+				Key: "total_personal_property", Label: "Total value of decedent's personal estate (para 5)",
+				Kind: forms.FieldText, Page: 2,
+				X: 360, Y: 700.0, MaxWidth: 160,
+				Confidence: forms.ConfidenceLow,
+				Note:       "After \"does not exceed\" / value rule on para 5. Personal property only — real estate excluded per 755 ILCS 5/25-1. ESTIMATE: tune X/Y against proof raster.",
+			},
+			{
+				Key: "creditor1_name", Label: "First creditor — name (Classes 1–7, paras 6–7, row 1)",
+				Kind: forms.FieldText, Page: 2,
+				X: 70, Y: 470.0, MaxWidth: 240,
+				Confidence: forms.ConfidenceLow,
+				Note:       "Row 1 of the creditor schedule. Multi-creditor estates need the repeating-row renderer. ESTIMATE: tune against proof raster.",
+			},
+			{
+				Key: "creditor1_class", Label: "First creditor — statutory class 1–7 (paras 6–7, row 1)",
+				Kind: forms.FieldText, Page: 2,
+				X: 320, Y: 470.0, MaxWidth: 60,
+				Confidence: forms.ConfidenceLow,
+				Note:       "Class column for creditor row 1. ESTIMATE: tune against proof raster.",
+			},
+			{
+				Key: "creditor1_amount", Label: "First creditor — claim amount (paras 6–7, row 1)",
+				Kind: forms.FieldText, Page: 2,
+				X: 400, Y: 470.0, MaxWidth: 120,
+				Confidence: forms.ConfidenceLow,
+				Note:       "Amount column for creditor row 1. ESTIMATE: tune against proof raster.",
+			},
+
+			// --- Page 3: first heir/legatee row + award computation ---
+			{
+				Key: "heir1_name", Label: "First heir/legatee — name (paras 9–10, row 1)",
+				Kind: forms.FieldText, Page: 3,
+				X: 70, Y: 520.0, MaxWidth: 220,
+				Confidence: forms.ConfidenceLow,
+				Note:       "Row 1 of the heirs/legatees schedule. Multi-heir estates need the repeating-row renderer. ESTIMATE: tune against proof raster.",
+			},
+			{
+				Key: "heir1_relationship", Label: "First heir/legatee — relationship to decedent (paras 9–10, row 1)",
+				Kind: forms.FieldText, Page: 3,
+				X: 300, Y: 520.0, MaxWidth: 130,
+				Confidence: forms.ConfidenceLow,
+				Note:       "Relationship column for heir row 1. ESTIMATE: tune against proof raster.",
+			},
+			{
+				Key: "heir1_share", Label: "First heir/legatee — share/interest (paras 9–10, row 1)",
+				Kind: forms.FieldText, Page: 3,
+				X: 440, Y: 520.0, MaxWidth: 90,
+				Confidence: forms.ConfidenceLow,
+				Note:       "Share column for heir row 1 (e.g. \"100%\", \"1/2\"). ESTIMATE: tune against proof raster.",
+			},
+			{
+				Key: "award_amount", Label: "Spousal/child award amount (computed, single-claimant)",
+				Kind: forms.FieldText, Page: 3,
+				X: 360, Y: 300.0, MaxWidth: 140,
+				Confidence: forms.ConfidenceLow,
+				Note:       "Surviving-spouse or child award line. Computation supplied by caller; engine never derives it. ESTIMATE: tune against proof raster.",
+			},
+
 			// --- Page 4: affiant relationship + execution block ---
 			{
 				Key: "affiant_relationship", Label: "Affiant relationship to decedent (para 10.3)",
diff --git a/api/internal/googlephotos/handler.go b/api/internal/googlephotos/handler.go
index 5448682..6193d84 100644
--- a/api/internal/googlephotos/handler.go
+++ b/api/internal/googlephotos/handler.go
@@ -14,7 +14,8 @@ import (
 	"cloud.google.com/go/storage"
 	"github.com/go-chi/chi/v5"
 	"github.com/rs/zerolog/log"
-	"google.golang.org/api/iterator"
+	"google.golang.org/grpc/codes"
+	"google.golang.org/grpc/status"
 
 	"github.com/sirsi-technologies/finalwishes-api/internal/auth"
 )
@@ -28,9 +29,26 @@ type Handler struct {
 	bucket string
 }
 
+// defaultVaultBucket is the dev/default vault bucket name. It MUST stay in sync
+// with the default used by the rest of the vault/storage pipeline (vault,
+// docintell, certmail) so that imported Google Photos heirlooms land in the
+// exact same bucket the signed-URL download path later reads from. If a deploy
+// configures a non-default prod bucket, the caller (cmd/api) must pass it
+// explicitly — falling back to this literal under a non-default prod config
+// would orphan imported photos in a bucket nothing else reads.
+const defaultVaultBucket = "finalwishes-vault"
+
 func NewHandler(fs *firestore.Client, sc *storage.Client, picker *PickerClient, bucket string) *Handler {
 	if bucket == "" {
-		bucket = "finalwishes-vault"
+		// A blank bucket means the vault-bucket env var resolved to empty at
+		// startup. Surface it loudly: a silent literal substitution here is the
+		// exact mechanism by which imports get written to a bucket the download
+		// path never reads. The literal keeps dev working, but the warning makes
+		// a prod misconfiguration visible instead of invisibly orphaning photos.
+		log.Warn().
+			Str("fallback_bucket", defaultVaultBucket).
+			Msg("Google Photos handler received empty vault bucket; falling back to default — verify the vault-bucket env var matches the rest of the vault pipeline in prod")
+		bucket = defaultVaultBucket
 	}
 	return &Handler{fs: fs, sc: sc, picker: picker, bucket: bucket}
 }
@@ -216,10 +234,11 @@ func (h *Handler) hasHash(ctx context.Context, estateID, sha string) (bool, erro
 	if err == nil {
 		return true, nil
 	}
-	if iterator.Done == err {
-		return false, nil
-	}
-	if strings.Contains(err.Error(), "NotFound") || strings.Contains(err.Error(), "not found") {
+	// A Firestore single-doc Get on a missing document returns a gRPC NotFound
+	// status — this is the canonical "no duplicate" signal (the iterator.Done
+	// sentinel only ever comes from iterator.Next(), never Doc().Get()). Match
+	// the repo convention used in payments/handlers.go (status.Code(err)==...).
+	if status.Code(err) == codes.NotFound {
 		return false, nil
 	}
 	// Any other error (transient, permission, config) is NOT "no duplicate" —
diff --git a/api/internal/opensign/handler.go b/api/internal/opensign/handler.go
index dfd98da..79bbf1e 100644
--- a/api/internal/opensign/handler.go
+++ b/api/internal/opensign/handler.go
@@ -68,22 +68,21 @@ func (h *WebhookHandler) HandleCreateEnvelope(w http.ResponseWriter, r *http.Req
 		}
 	}
 
-	// Force the signer identity to the AUTHENTICATED caller — never the body's
-	// signerEmail. Otherwise an estate writer could name an ARBITRARY signer (send the
-	// signing link to anyone / forge "X signed this directive"). The verified email
-	// claim is the only trustworthy signer identity. (claude-home PR #4 review.)
-	signerEmail := ""
-	signerName := req.SignerName
-	if tok := auth.TokenFromContext(ctx); tok != nil {
-		if e, _ := tok.Claims["email"].(string); e != "" {
-			signerEmail = e
-		}
-		if n, _ := tok.Claims["name"].(string); n != "" {
-			signerName = n
-		}
+	// Resolve the signer as the estate PRINCIPAL — NOT the authenticated caller.
+	// A legal directive / POA must be signed BY the principal whose estate it governs;
+	// an executor or admin merely INITIATES the ceremony on the principal's behalf. So
+	// the OpenSign signer identity is resolved server-side from estates/{id}.principalId
+	// → Firebase Auth (verified email/name), and the principal's email MUST be verified
+	// before signing can proceed. The caller is recorded only as initiatedBy in the
+	// audit record below. This supersedes the prior "signer = authenticated caller"
+	// behavior. (claude-home signer=principal decision 2026-06-14; Refs ADR-047.)
+	resolver := h.signerResolver
+	if resolver == nil {
+		resolver = &firebaseSignerResolver{fs: h.fs, authClient: h.authClient}
 	}
-	if signerEmail == "" {
-		http.Error(w, "Signer email could not be determined from your account", http.StatusBadRequest)
+	signerEmail, signerName, status, clientMsg := resolver.resolveSigner(ctx, req.EstateID, req.SignerName)
+	if status != 0 {
+		http.Error(w, clientMsg, status)
 		return
 	}
 
@@ -124,7 +123,12 @@ func (h *WebhookHandler) HandleCreateEnvelope(w http.ResponseWriter, r *http.Req
 			"envelopeId":  envelopeID,
 			"estateId":    req.EstateID,
 			"directiveId": req.DirectiveID,
+			// createdBy kept for back-compat; initiatedBy is the authoritative audit
+			// field — the caller INITIATED the ceremony while the estate PRINCIPAL is
+			// the signer (claude-home signer=principal decision 2026-06-14).
 			"createdBy":   userID,
+			"initiatedBy": userID,
+			"signerEmail": signerEmail,
 			"status":      "sent",
 			"createdAt":   firestore.ServerTimestamp,
 		}); e != nil {
diff --git a/api/internal/opensign/handler_test.go b/api/internal/opensign/handler_test.go
index c992158..122005a 100644
--- a/api/internal/opensign/handler_test.go
+++ b/api/internal/opensign/handler_test.go
@@ -1,6 +1,7 @@
 package opensign
 
 import (
+	"context"
 	"encoding/json"
 	"io"
 	"net/http"
@@ -13,11 +14,13 @@ import (
 	"github.com/sirsi-technologies/finalwishes-api/internal/auth"
 )
 
-// withAuth injects an authenticated user context + token (as the middleware would) so
-// these tests exercise HandleCreateEnvelope past its auth gate and the token-derived
-// signer identity. A nil-fs WebhookHandler skips the estate_users check + the binding
-// write, leaving the OpenSign proxy behavior under test. Bodies include
-// estateId/directiveId (now required).
+// withAuth injects an authenticated CALLER context (as the middleware would) so these
+// tests exercise HandleCreateEnvelope past its auth gate. NOTE: as of the
+// signer=principal change (claude-home 2026-06-14) the caller's token email is NO
+// LONGER the signer — the signer is resolved from the estate principal via the injected
+// signerResolver. The caller is recorded only as initiatedBy. A nil-fs WebhookHandler
+// skips the estate_users check + the binding write, leaving the OpenSign proxy behavior
+// + principal-resolution under test. Bodies include estateId/directiveId (required).
 func withAuth(req *http.Request) *http.Request {
 	ctx := auth.ContextWithUserID(req.Context(), "u1")
 	ctx = auth.ContextWithToken(ctx, &firebaseAuth.Token{Claims: map[string]interface{}{
@@ -27,7 +30,35 @@ func withAuth(req *http.Request) *http.Request {
 	return req.WithContext(ctx)
 }
 
-func openSignTestHandler() *WebhookHandler { return &WebhookHandler{} }
+// fakeSignerResolver is the test double for the principal-resolution seam, standing in
+// for the Firestore+Firebase-Auth-backed firebaseSignerResolver (neither can be built
+// offline). It returns canned signer identity / rejection.
+type fakeSignerResolver struct {
+	email     string
+	name      string
+	status    int
+	clientMsg string
+}
+
+func (f *fakeSignerResolver) resolveSigner(_ context.Context, _, fallbackName string) (string, string, int, string) {
+	if f.status != 0 {
+		return "", "", f.status, f.clientMsg
+	}
+	name := f.name
+	if name == "" {
+		name = fallbackName
+	}
+	return f.email, name, 0, ""
+}
+
+// openSignTestHandler returns a handler whose principal resolves to a VERIFIED estate
+// principal (principal@example.com) — the common case for the provider-proxy tests,
+// which assert behavior AFTER signer resolution succeeds.
+func openSignTestHandler() *WebhookHandler {
+	return &WebhookHandler{
+		signerResolver: &fakeSignerResolver{email: "principal@example.com", name: "Estate Principal"},
+	}
+}
 
 // TestCreateEnvelope_InvalidJSON verifies that malformed request bodies are rejected.
 func TestCreateEnvelope_InvalidJSON(t *testing.T) {
@@ -115,6 +146,18 @@ func TestCreateEnvelope_HappyPath(t *testing.T) {
 		if payload["template_id"] != "t1" {
 			t.Errorf("expected template_id t1, got %v", payload["template_id"])
 		}
+		// Signer is the estate PRINCIPAL resolved server-side — NOT the caller token
+		// (u1@example.com) and NOT the body's signerEmail (cylton@sirsi.ai). The
+		// dissociated provider nests the signer under signers[0].
+		gotSigner := ""
+		if signers, ok := payload["signers"].([]interface{}); ok && len(signers) > 0 {
+			if s0, ok := signers[0].(map[string]interface{}); ok {
+				gotSigner, _ = s0["email"].(string)
+			}
+		}
+		if gotSigner != "principal@example.com" {
+			t.Errorf("expected signer to be the estate principal, got %q", gotSigner)
+		}
 
 		w.Header().Set("Content-Type", "application/json")
 		w.WriteHeader(http.StatusOK)
@@ -277,3 +320,102 @@ func TestCreateEnvelope_NoAPIKeyStillSends(t *testing.T) {
 		t.Errorf("expected no auth header when API key is empty, got %q", receivedAuthHeader)
 	}
 }
+
+// TestCreateEnvelope_SignerIsVerifiedPrincipal verifies the resolved signer is the
+// estate principal (verified), not the caller and not the body's signerEmail.
+func TestCreateEnvelope_SignerIsVerifiedPrincipal(t *testing.T) {
+	var gotSignerEmail string
+	upstream := httptest.NewServer(http.HandlerFunc(func(w http.ResponseWriter, r *http.Request) {
+		var payload map[string]interface{}
+		_ = json.NewDecoder(r.Body).Decode(&payload)
+		if signers, ok := payload["signers"].([]interface{}); ok && len(signers) > 0 {
+			if s0, ok := signers[0].(map[string]interface{}); ok {
+				gotSignerEmail, _ = s0["email"].(string)
+			}
+		}
+		w.Header().Set("Content-Type", "application/json")
+		w.WriteHeader(http.StatusOK)
+		_, _ = io.WriteString(w, `{"id":"env-1","url":"https://sign.example.com/env-1"}`)
+	}))
+	defer upstream.Close()
+
+	t.Setenv("OPENSIGN_CREATE_ENVELOPE_URL", upstream.URL)
+	t.Setenv("OPENSIGN_API_KEY", "k")
+	t.Setenv("OPENSIGN_API_URL", "")
+
+	h := &WebhookHandler{
+		signerResolver: &fakeSignerResolver{email: "principal@example.com", name: "Estate Principal"},
+	}
+
+	// Caller token says u1@example.com; body says imposter@evil.com — both must be ignored.
+	body := `{"estateId":"e1","directiveId":"d1","templateId":"t1","signerName":"Imposter","signerEmail":"imposter@evil.com","redirectUrl":"https://x.com"}`
+	req := httptest.NewRequest(http.MethodPost, "/api/envelopes", strings.NewReader(body))
+	req.Header.Set("Content-Type", "application/json")
+	rr := httptest.NewRecorder()
+	h.HandleCreateEnvelope(rr, withAuth(req))
+
+	if rr.Code != http.StatusOK {
+		t.Fatalf("expected 200, got %d (%s)", rr.Code, rr.Body.String())
+	}
+	if gotSignerEmail != "principal@example.com" {
+		t.Errorf("signer must be the verified estate principal, got %q", gotSignerEmail)
+	}
+}
+
+// TestCreateEnvelope_PrincipalEmailUnverified verifies the required gate: signing is
+// rejected with 403 when the estate principal's email is not verified.
+func TestCreateEnvelope_PrincipalEmailUnverified(t *testing.T) {
+	h := &WebhookHandler{
+		signerResolver: &fakeSignerResolver{
+			status:    http.StatusForbidden,
+			clientMsg: "The estate principal's email is not verified; signing cannot proceed",
+		},
+	}
+
+	body := `{"estateId":"e1","directiveId":"d1","templateId":"t1","redirectUrl":"https://x.com"}`
+	req := httptest.NewRequest(http.MethodPost, "/api/envelopes", strings.NewReader(body))
+	req.Header.Set("Content-Type", "application/json")
+	rr := httptest.NewRecorder()
+	h.HandleCreateEnvelope(rr, withAuth(req))
+
+	if rr.Code != http.StatusForbidden {
+		t.Fatalf("expected 403 for unverified principal, got %d", rr.Code)
+	}
+	if !strings.Contains(rr.Body.String(), "not verified") {
+		t.Errorf("expected unverified-principal message, got %q", rr.Body.String())
+	}
+}
+
+// TestCreateEnvelope_MissingPrincipal verifies a 400 when the estate has no principal
+// on record (e.g. estates/{id}.principalId is empty/missing).
+func TestCreateEnvelope_MissingPrincipal(t *testing.T) {
+	h := &WebhookHandler{
+		signerResolver: &fakeSignerResolver{
+			status:    http.StatusBadRequest,
+			clientMsg: "Estate has no principal on record",
+		},
+	}
+
+	body := `{"estateId":"e1","directiveId":"d1","templateId":"t1","redirectUrl":"https://x.com"}`
+	req := httptest.NewRequest(http.MethodPost, "/api/envelopes", strings.NewReader(body))
+	req.Header.Set("Content-Type", "application/json")
+	rr := httptest.NewRecorder()
+	h.HandleCreateEnvelope(rr, withAuth(req))
+
+	if rr.Code != http.StatusBadRequest {
+		t.Fatalf("expected 400 for missing principal, got %d", rr.Code)
+	}
+	if !strings.Contains(rr.Body.String(), "no principal on record") {
+		t.Errorf("expected missing-principal message, got %q", rr.Body.String())
+	}
+}
+
+// TestFirebaseSignerResolver_UnverifiedAndMissing covers the production resolver's
+// pure-logic branches that don't need a live Firestore client: nil fs / nil auth.
+func TestFirebaseSignerResolver_DefensiveNils(t *testing.T) {
+	r := &firebaseSignerResolver{} // nil fs, nil authClient
+	_, _, status, msg := r.resolveSigner(context.Background(), "e1", "")
+	if status != http.StatusServiceUnavailable {
+		t.Errorf("nil fs should yield 503, got %d (%s)", status, msg)
+	}
+}
diff --git a/api/internal/opensign/signer.go b/api/internal/opensign/signer.go
new file mode 100644
index 0000000..6f1e696
--- /dev/null
+++ b/api/internal/opensign/signer.go
@@ -0,0 +1,77 @@
+package opensign
+
+import (
+	"context"
+	"net/http"
+
+	"cloud.google.com/go/firestore"
+	"github.com/rs/zerolog/log"
+)
+
+// signerResolver resolves the legally-required signer identity (the estate PRINCIPAL)
+// for an envelope. A non-zero httpStatus signals rejection and clientMsg is the
+// safe-to-surface error; httpStatus == 0 means email/name are populated and verified.
+//
+// WHY this is a seam: the signer of a legal directive/POA must be the estate principal,
+// never the authenticated caller (an executor/admin only initiates). Resolution needs a
+// live Firestore client (estates/{id}.principalId) + Firebase Auth (verified email),
+// neither of which can be constructed offline — so tests inject a fake resolver while
+// production uses firebaseSignerResolver. (claude-home signer=principal decision
+// 2026-06-14; Refs ADR-047.)
+type signerResolver interface {
+	resolveSigner(ctx context.Context, estateID, fallbackName string) (email, name string, httpStatus int, clientMsg string)
+}
+
+// firebaseSignerResolver resolves the principal from estates/{id}.principalId via
+// Firestore, then loads the principal's verified identity from Firebase Auth.
+type firebaseSignerResolver struct {
+	fs         *firestore.Client
+	authClient userLookup
+}
+
+func (r *firebaseSignerResolver) resolveSigner(ctx context.Context, estateID, fallbackName string) (string, string, int, string) {
+	// The estate record holds principalId (the principal's Firebase UID) — written at
+	// estate creation (web/src/lib/estate-actions.ts createEstate).
+	if r.fs == nil {
+		return "", "", http.StatusServiceUnavailable, "Signer identity service unavailable"
+	}
+	estateSnap, err := r.fs.Collection("estates").Doc(estateID).Get(ctx)
+	if err != nil || estateSnap == nil || !estateSnap.Exists() {
+		return "", "", http.StatusBadRequest, "Estate has no principal on record"
+	}
+	principalID, _ := estateSnap.Data()["principalId"].(string)
+	if principalID == "" {
+		return "", "", http.StatusBadRequest, "Estate has no principal on record"
+	}
+
+	// Defensive: in production the auth client is always wired; locally it may be nil.
+	if r.authClient == nil {
+		return "", "", http.StatusServiceUnavailable, "Signer identity service unavailable"
+	}
+
+	principal, err := r.authClient.GetUser(ctx, principalID)
+	if err != nil || principal == nil {
+		log.Error().Err(err).Str("estate_id", estateID).Msg("Could not resolve estate principal from Firebase Auth")
+		return "", "", http.StatusBadGateway, "Could not resolve estate principal"
+	}
+
+	// The required gate: a directive cannot be signed against an unverified principal
+	// email — that would let an unverified/unowned address be named as the legal signer.
+	if !principal.EmailVerified {
+		return "", "", http.StatusForbidden, "The estate principal's email is not verified; signing cannot proceed"
+	}
+
+	signerEmail := principal.Email
+	if signerEmail == "" {
+		return "", "", http.StatusBadRequest, "The estate principal has no email on record"
+	}
+
+	signerName := principal.DisplayName
+	if signerName == "" {
+		signerName = fallbackName
+	}
+	if signerName == "" {
+		signerName = signerEmail
+	}
+	return signerEmail, signerName, 0, ""
+}
diff --git a/api/internal/opensign/webhook.go b/api/internal/opensign/webhook.go
index 1d81ef4..c1fd7c8 100644
--- a/api/internal/opensign/webhook.go
+++ b/api/internal/opensign/webhook.go
@@ -13,27 +13,51 @@ import (
 	"time"
 
 	"cloud.google.com/go/firestore"
+	firebaseAuth "firebase.google.com/go/v4/auth"
 	"github.com/rs/zerolog/log"
 
 	"github.com/sirsi-technologies/finalwishes-api/internal/auth"
 )
 
+// userLookup is the narrow slice of the Firebase Auth client that envelope creation
+// needs to resolve the estate principal's verified identity. The real
+// *firebaseAuth.Client satisfies it; tests inject a fake (the concrete client cannot
+// be constructed offline). This is the auth-client test seam.
+type userLookup interface {
+	GetUser(ctx context.Context, uid string) (*firebaseAuth.UserRecord, error)
+}
+
 // WebhookHandler handles OpenSign webhook callbacks, signing status checks, and
 // envelope creation (via the shared-services provider).
 type WebhookHandler struct {
 	fs            *firestore.Client
+	authClient    userLookup
 	webhookSecret string
 	provider      SigningProvider
+
+	// signerResolver lets tests inject a deterministic principal-resolution result
+	// without a live Firestore/Firebase Auth client. nil in production → the handler
+	// uses the default resolver backed by fs + authClient.
+	signerResolver signerResolver
 }
 
 // NewWebhookHandler creates a webhook handler for OpenSign signing events. It builds
 // the shared-services signing provider (Sirsi-first, dissociated fallback — ADR-047).
-func NewWebhookHandler(fs *firestore.Client) *WebhookHandler {
-	return &WebhookHandler{
+// authClient resolves the estate PRINCIPAL's verified identity at envelope creation
+// (the legal signer is the principal, never the caller — claude-home signer=principal
+// decision 2026-06-14). It may be nil in local dev with no Firebase Auth.
+func NewWebhookHandler(fs *firestore.Client, authClient *firebaseAuth.Client) *WebhookHandler {
+	h := &WebhookHandler{
 		fs:            fs,
-		provider:      NewSigningProvider(),
 		webhookSecret: os.Getenv("OPENSIGN_WEBHOOK_SECRET"),
+		provider:      NewSigningProvider(),
+	}
+	// Keep authClient typed-nil safe: only assign when non-nil so the interface field
+	// stays a true nil (a typed-nil *Client would defeat the == nil defensive check).
+	if authClient != nil {
+		h.authClient = authClient
 	}
+	return h
 }
 
 // HandleWebhook processes OpenSign signing completion webhooks.
diff --git a/api/internal/payments/handlers.go b/api/internal/payments/handlers.go
index 48b7ebd..f6f0fd6 100644
--- a/api/internal/payments/handlers.go
+++ b/api/internal/payments/handlers.go
@@ -7,10 +7,12 @@ package payments
 import (
 	"context"
 	"encoding/json"
+	"errors"
 	"fmt"
 	"io"
 	"net/http"
 	"os"
+	"strings"
 	"time"
 
 	"github.com/rs/zerolog/log"
@@ -365,6 +367,16 @@ func (h *Handler) HandleCreatePortalSession(w http.ResponseWriter, r *http.Reque
 	sess, err := portalsession.New(params)
 	if err != nil {
 		log.Error().Err(err).Str("customer_id", customerIDStr).Str("estate_id", req.EstateID).Msg("Stripe portal session creation failed")
+		// The most common cause of a portal-session failure on a live account is the
+		// one-time Customer Portal configuration not yet being saved in the Stripe
+		// Dashboard (Settings > Billing > Customer Portal). Stripe surfaces this as an
+		// invalid_request_error mentioning "configuration". Give the user an actionable
+		// message in that case instead of a bare 500.
+		if isStripePortalNotConfigured(err) {
+			writeError(w, http.StatusServiceUnavailable,
+				"Subscription management isn't available yet. Please contact support and we'll help you update your plan.")
+			return
+		}
 		writeError(w, http.StatusInternalServerError, "Failed to create subscription management session")
 		return
 	}
@@ -376,6 +388,24 @@ func (h *Handler) HandleCreatePortalSession(w http.ResponseWriter, r *http.Reque
 	})
 }
 
+// isStripePortalNotConfigured reports whether a portal-session error is the
+// "Customer Portal not configured in the Dashboard" case. Stripe returns this as an
+// invalid_request_error whose message mentions a missing/default configuration
+// (e.g. "No configuration provided and your test mode default configuration has not
+// been created"). We match defensively on both the structured Stripe error and its
+// message so a Dashboard-config gap reads as a clear "unavailable" rather than a 500.
+func isStripePortalNotConfigured(err error) bool {
+	var serr *stripe.Error
+	if !errors.As(err, &serr) {
+		return false
+	}
+	if serr.Type != stripe.ErrorTypeInvalidRequest {
+		return false
+	}
+	msg := strings.ToLower(serr.Msg)
+	return strings.Contains(msg, "configuration") || strings.Contains(msg, "customer portal")
+}
+
 // HandleWebhook processes Stripe webhook events.
 func (h *Handler) HandleWebhook(w http.ResponseWriter, r *http.Request) {
 	body, err := io.ReadAll(io.LimitReader(r.Body, 65536))
diff --git a/api/internal/probate/forms.go b/api/internal/probate/forms.go
index f47f58c..fbd09c4 100644
--- a/api/internal/probate/forms.go
+++ b/api/internal/probate/forms.go
@@ -2,12 +2,13 @@ package probate
 
 import (
 	"context"
-	"encoding/json"
 	"net/http"
+	"strconv"
+	"strings"
 	"time"
+	"unicode"
 
 	"cloud.google.com/go/firestore"
-	"github.com/rs/zerolog/log"
 
 	"github.com/sirsi-technologies/finalwishes-api/internal/auth"
 )
@@ -87,11 +88,19 @@ func (h *Handler) HandleGetFormTemplates(w http.ResponseWriter, r *http.Request)
 		executorAddress, _ = exData["address"].(string)
 	}
 
-	// Compute total asset value for small estate evaluation
-	var totalAssetValue string
+	// Compute total asset values for the inventory and small-estate templates.
+	//
+	// Rule 9: these strings are stamped into legal-form prefill fields, and the
+	// personal-property total gates small-estate qualification. We therefore
+	// derive a REAL dollar figure from the recorded asset values — never a proxy
+	// like a count. If any recorded value cannot be parsed into a number, the
+	// derived total would be misleading, so we leave the field BLANK for the
+	// affiant to complete by hand rather than assert an unverifiable amount.
+	var totalAssetValue, personalPropertyValue string
 	assetSnaps, err := h.fs.Collection("estates").Doc(estateID).Collection("assets").Documents(ctx).GetAll()
 	if err == nil {
-		totalAssetValue = computeTotalAssets(assetSnaps)
+		totalAssetValue = computeTotalAssets(assetSnaps, false)
+		personalPropertyValue = computeTotalAssets(assetSnaps, true)
 	}
 
 	county := countyOfDeath
@@ -149,7 +158,7 @@ func (h *Handler) HandleGetFormTemplates(w http.ResponseWriter, r *http.Request)
 				"dateOfDeath":           dateOfDeath,
 				"affiantName":           executorName,
 				"affiantAddress":        executorAddress,
-				"totalPersonalProperty": totalAssetValue,
+				"totalPersonalProperty": personalPropertyValue,
 				"threshold":             "$150,000",
 				"waitingPeriod":         "30 days after date of death",
 				"vehiclesExcluded":      "Yes — vehicles do not count toward the $150,000 limit",
@@ -186,50 +195,106 @@ func (h *Handler) HandleGetFormTemplates(w http.ResponseWriter, r *http.Request)
 	})
 }
 
-// computeTotalAssets sums all asset values from Firestore snapshots.
-func computeTotalAssets(snaps []*firestore.DocumentSnapshot) string {
-	// For now, return the count — proper valuation requires parsing value strings
-	if len(snaps) == 0 {
-		return "$0"
-	}
-	return jsonString(len(snaps)) + " assets recorded"
-}
+// realEstateTypes are asset `type` values that represent real property, which
+// is excluded from the Illinois small-estate personal-property threshold
+// (755 ILCS 5/25-1). Matching is case-insensitive and substring-based so that
+// "Real Estate", "real property", and "Residential Real Estate" all qualify.
+var realEstateTypes = []string{"real estate", "real property", "realty", "land"}
 
-func jsonString(v int) string {
-	b, _ := json.Marshal(v)
-	return string(b)
+func isRealProperty(assetType string) bool {
+	t := strings.ToLower(strings.TrimSpace(assetType))
+	for _, re := range realEstateTypes {
+		if strings.Contains(t, re) {
+			return true
+		}
+	}
+	return false
 }
 
-// HandleGetFormData returns pre-filled data for a specific form.
-// GET /api/v1/probate/forms/:formId?estate_id=xxx
-func (h *Handler) HandleGetFormData(w http.ResponseWriter, r *http.Request) {
-	userID, err := auth.RequireUserID(r.Context())
+// parseCurrency converts a recorded asset value string (e.g. "$485,000",
+// "124500.50", "1,200") into a numeric dollar amount. It returns ok=false when
+// the string contains no parseable amount, so callers can fail closed (leave a
+// legal-form field blank) rather than assert a fabricated figure (Rule 9).
+func parseCurrency(s string) (float64, bool) {
+	// Strip currency symbols, thousands separators, and any whitespace
+	// (including non-breaking/thin spaces some locales use as group separators).
+	cleaned := strings.Map(func(r rune) rune {
+		if r == '$' || r == ',' || unicode.IsSpace(r) {
+			return -1
+		}
+		return r
+	}, s)
+	if cleaned == "" {
+		return 0, false
+	}
+	v, err := strconv.ParseFloat(cleaned, 64)
 	if err != nil {
-		writeError(w, http.StatusUnauthorized, "Authentication required")
-		return
+		return 0, false
 	}
+	return v, true
+}
 
-	estateID := r.URL.Query().Get("estate_id")
-	formID := r.URL.Query().Get("form_id")
-	if estateID == "" || formID == "" {
-		writeError(w, http.StatusBadRequest, "estate_id and form_id query parameters are required")
-		return
+// formatCurrency renders a dollar amount with thousands separators, e.g.
+// 609500 -> "$609,500". Whole amounts drop the cents; fractional amounts keep
+// two decimals.
+func formatCurrency(v float64) string {
+	negative := v < 0
+	if negative {
+		v = -v
 	}
+	whole := int64(v)
+	frac := v - float64(whole)
 
-	ctx, cancel := context.WithTimeout(r.Context(), 10*time.Second)
-	defer cancel()
+	digits := strconv.FormatInt(whole, 10)
+	var grouped strings.Builder
+	for i, d := range digits {
+		if i > 0 && (len(digits)-i)%3 == 0 {
+			grouped.WriteByte(',')
+		}
+		grouped.WriteRune(d)
+	}
 
-	if err := h.verifyEstateAccess(ctx, userID, estateID); err != nil {
-		writeError(w, http.StatusForbidden, "You do not have access to this estate")
-		return
+	out := "$" + grouped.String()
+	if frac > 0.0049 {
+		out += strings.TrimPrefix(strconv.FormatFloat(frac, 'f', 2, 64), "0")
+	}
+	if negative {
+		out = "-" + out
 	}
+	return out
+}
 
-	// For now, reuse HandleGetFormTemplates logic and filter by ID
-	// In a full implementation, this would return richer per-form data
-	log.Debug().Str("estate_id", estateID).Str("form_id", formID).Msg("Form data requested")
-	writeJSON(w, http.StatusOK, map[string]interface{}{
-		"formId":     formID,
-		"disclaimer": formDisclaimer,
-		"message":    "Use the /forms endpoint for pre-filled templates",
-	})
+// computeTotalAssets derives a real dollar valuation from recorded asset values.
+//
+// When personalPropertyOnly is true, real-property assets are excluded so the
+// result matches the Illinois small-estate personal-property threshold
+// (755 ILCS 5/25-1). When false, every asset is summed for the general estate
+// inventory.
+//
+// Rule 9: if ANY contributing asset has a value that cannot be parsed into a
+// number, the sum would be unverifiable, so we return "" — the form field is
+// left blank for the affiant to complete rather than stamped with a guess. An
+// estate with zero contributing assets returns "$0" (a fact, not a guess).
+func computeTotalAssets(snaps []*firestore.DocumentSnapshot, personalPropertyOnly bool) string {
+	var total float64
+	var contributing int
+	for _, snap := range snaps {
+		data := snap.Data()
+		assetType, _ := data["type"].(string)
+		if personalPropertyOnly && isRealProperty(assetType) {
+			continue
+		}
+		raw, _ := data["value"].(string)
+		amount, ok := parseCurrency(raw)
+		if !ok {
+			// Unverifiable total — refuse to fabricate a legal figure (Rule 9).
+			return ""
+		}
+		total += amount
+		contributing++
+	}
+	if contributing == 0 {
+		return "$0"
+	}
+	return formatCurrency(total)
 }
diff --git a/api/internal/service/estate/service.go b/api/internal/service/estate/service.go
index 85b9662..7057ae8 100644
--- a/api/internal/service/estate/service.go
+++ b/api/internal/service/estate/service.go
@@ -11,22 +11,40 @@ import (
 	"cloud.google.com/go/firestore"
 	"cloud.google.com/go/storage"
 	"connectrpc.com/connect"
-	"google.golang.org/api/iterator"
-	"google.golang.org/protobuf/types/known/timestamppb"
 
 	"github.com/sirsi-technologies/finalwishes-api/internal/auth"
 	estatev1 "github.com/sirsi-technologies/finalwishes-api/internal/gen/estate/v1"
 	"github.com/sirsi-technologies/finalwishes-api/internal/gen/estate/v1/estatev1connect"
 )
 
-// Server implements the EstateService with Google Cloud integrations
+// Server implements the EstateService with Google Cloud integrations.
+//
+// SURFACE SCOPE (2026-06-14): EstateService intentionally implements ONLY the
+// RPCs the product actually consumes. Today that is GenerateUploadUrl (the
+// signed-URL issuer used by every vault/memoir/obituary/time-capsule uploader —
+// see web/src/lib/client.ts). The estate read/write surface (ListEstates,
+// GetEstateMetadata, ListAssets, AddAsset, ListBeneficiaries, AddBeneficiary,
+// ListVaultDocuments, ListMemoirs, UploadMemoir, GetObituary, SaveObituary,
+// GetAIInsight, GetGovernanceSettings, ListNotifications, RegisterEstate) is
+// served directly from Firestore by the React app, and AI guidance is served by
+// internal/guidance (HandleGetScore -> advisor.GenerateInsight, Claude Opus +
+// RAG). Those proto RPCs therefore have ZERO consumers.
+//
+// Rather than ship handlers that fabricated "34% complete" / "Lockhart Estate" /
+// "Sarah Johnson" demo data — which masked real Firestore failures on the live
+// path and shipped invented AI text — we deliberately do NOT override them here.
+// The embedded UnimplementedEstateServiceHandler answers each unimplemented RPC
+// with a clean connect.CodeUnimplemented ("... is not implemented"), an honest
+// signal instead of fabricated data. When/if any of these become the canonical
+// path, implement the real Firestore-backed handler here (gated by
+// checkEstateAccess) and remove the corresponding direct-Firestore read in web/.
 type Server struct {
 	estatev1connect.UnimplementedEstateServiceHandler
 	fs *firestore.Client
 	sc *storage.Client
 }
 
-// NewServer returns an initialized server
+// NewServer returns an initialized server.
 func NewServer(fs *firestore.Client, sc *storage.Client) *Server {
 	return &Server{
 		fs: fs,
@@ -42,7 +60,9 @@ func (s *Server) checkEstateAccess(ctx context.Context, estateID string, writeRe
 		return connect.NewError(connect.CodeUnauthenticated, fmt.Errorf("authentication required"))
 	}
 	if s.fs == nil {
-		return nil
+		// Without an estate store we cannot prove membership; deny rather than
+		// fall through to an unauthenticated grant.
+		return connect.NewError(connect.CodeFailedPrecondition, fmt.Errorf("estate store not configured"))
 	}
 	docRef := s.fs.Collection("estate_users").Doc(userID + "_" + estateID)
 	doc, err := docRef.Get(ctx)
@@ -60,6 +80,11 @@ func (s *Server) checkEstateAccess(ctx context.Context, estateID string, writeRe
 }
 
 // --- Vault & Storage (Signed URLs) ---
+//
+// GenerateUploadUrl is the only EstateService RPC the product consumes. It
+// issues a short-lived V4 signed PUT URL (and a longer-lived GET URL) for a
+// vault object, with a server-enforced byte cap, after verifying the caller has
+// write access to the estate.
 
 func (s *Server) GenerateUploadUrl(ctx context.Context, req *connect.Request[estatev1.GenerateUploadUrlRequest]) (*connect.Response[estatev1.GenerateUploadUrlResponse], error) {
 	if err := s.checkEstateAccess(ctx, req.Msg.EstateId, true); err != nil {
@@ -113,525 +138,3 @@ func (s *Server) GenerateUploadUrl(ctx context.Context, req *connect.Request[est
 		FinalUrl:  downloadURL,
 	}), nil
 }
-
-// --- Core Estate Management (Firestore) ---
-
-func (s *Server) ListBeneficiaries(ctx context.Context, req *connect.Request[estatev1.ListBeneficiariesRequest]) (*connect.Response[estatev1.ListBeneficiariesResponse], error) {
-	if err := s.checkEstateAccess(ctx, req.Msg.EstateId, false); err != nil {
-		return nil, err
-	}
-
-	if s.fs == nil {
-		return connect.NewResponse(&estatev1.ListBeneficiariesResponse{
-			Beneficiaries: []*estatev1.Beneficiary{
-				{Id: "1", Name: "Sarah Johnson", Relation: "Spouse", Share: "50%", Status: "Verified", Email: "sarah@example.com"},
-			},
-		}), nil
-	}
-
-	var beneficiaries []*estatev1.Beneficiary
-	iter := s.fs.Collection("estates").Doc(req.Msg.EstateId).Collection("beneficiaries").Documents(ctx)
-	for {
-		doc, err := iter.Next()
-		if err == iterator.Done {
-			break
-		}
-		if err != nil {
-			return nil, connect.NewError(connect.CodeInternal, fmt.Errorf("failed to fetch beneficiaries: %w", err))
-		}
-
-		var b estatev1.Beneficiary
-		if err := doc.DataTo(&b); err != nil {
-			continue
-		}
-		b.Id = doc.Ref.ID
-		beneficiaries = append(beneficiaries, &b)
-	}
-
-	return connect.NewResponse(&estatev1.ListBeneficiariesResponse{Beneficiaries: beneficiaries}), nil
-}
-
-func (s *Server) AddBeneficiary(ctx context.Context, req *connect.Request[estatev1.AddBeneficiaryRequest]) (*connect.Response[estatev1.AddBeneficiaryResponse], error) {
-	if err := s.checkEstateAccess(ctx, req.Msg.EstateId, true); err != nil {
-		return nil, err
-	}
-
-	if s.fs == nil {
-		return nil, connect.NewError(connect.CodeUnimplemented, fmt.Errorf("firestore not initialized"))
-	}
-
-	newBene := &estatev1.Beneficiary{
-		Name:     req.Msg.Name,
-		Relation: req.Msg.Relation,
-		Email:    req.Msg.Email,
-		Share:    "TBD",
-		Status:   "Invited",
-	}
-
-	docRef, _, err := s.fs.Collection("estates").Doc(req.Msg.EstateId).Collection("beneficiaries").Add(ctx, map[string]interface{}{
-		"name":     newBene.Name,
-		"relation": newBene.Relation,
-		"email":    newBene.Email,
-		"share":    newBene.Share,
-		"status":   newBene.Status,
-	})
-	if err != nil {
-		return nil, connect.NewError(connect.CodeInternal, fmt.Errorf("failed to add beneficiary: %w", err))
-	}
-
-	newBene.Id = docRef.ID
-	return connect.NewResponse(&estatev1.AddBeneficiaryResponse{Beneficiary: newBene}), nil
-}
-
-func (s *Server) ListEstates(ctx context.Context, req *connect.Request[estatev1.ListEstatesRequest]) (*connect.Response[estatev1.ListEstatesResponse], error) {
-	if s.fs == nil {
-		var estates []*estatev1.EstateSummary
-		if req.Msg.UserId == "user_tameeka" || req.Msg.UserId == "Tameeka116" {
-			estates = []*estatev1.EstateSummary{
-				{Id: "estate_lockhart", Name: "Lockhart Estate", Role: "Owner"},
-				{Id: "trust_lockhart", Name: "Lockhart Dynasty Trust", Role: "Executor"},
-			}
-		} else {
-			estates = []*estatev1.EstateSummary{
-				{Id: "estate-77b", Name: "The Lockhart Estate Shard", Role: "Owner"},
-				{Id: "estate-99c", Name: "The Lockhart Global Trust", Role: "Executor"},
-			}
-		}
-		return connect.NewResponse(&estatev1.ListEstatesResponse{Estates: estates}), nil
-	}
-
-	// Derive the UID from the verified token, NOT req.Msg.UserId — trusting the
-	// client-supplied user_id let any authenticated user enumerate ANOTHER user's
-	// estate IDs (the keystone for reading their obituary/metadata/notifications by ID).
-	userID := auth.UserIDFromContext(ctx)
-	if userID == "" {
-		return nil, connect.NewError(connect.CodeUnauthenticated, fmt.Errorf("authentication required"))
-	}
-
-	var estates []*estatev1.EstateSummary
-	iter := s.fs.Collection("estates").Where("user_id", "==", userID).Documents(ctx)
-	for {
-		doc, err := iter.Next()
-		if err == iterator.Done {
-			break
-		}
-		if err != nil {
-			return nil, connect.NewError(connect.CodeInternal, fmt.Errorf("failed to list estates: %w", err))
-		}
-
-		var summary estatev1.EstateSummary
-		if err := doc.DataTo(&summary); err != nil {
-			continue
-		}
-		summary.Id = doc.Ref.ID
-		estates = append(estates, &summary)
-	}
-
-	return connect.NewResponse(&estatev1.ListEstatesResponse{Estates: estates}), nil
-}
-
-func (s *Server) RegisterEstate(ctx context.Context, req *connect.Request[estatev1.RegisterEstateRequest]) (*connect.Response[estatev1.RegisterEstateResponse], error) {
-	if s.fs == nil {
-		return nil, connect.NewError(connect.CodeUnimplemented, fmt.Errorf("firestore not initialized"))
-	}
-
-	// Derive the UID from the verified token, NOT req.Msg.UserId — persisting a
-	// client-supplied user_id lets an authenticated caller create an estate OWNED
-	// BY ANOTHER USER (planting an estate into someone else's ListEstates, or
-	// orphaning it under a fabricated id). Same trust boundary as ListEstates.
-	userID := auth.UserIDFromContext(ctx)
-	if userID == "" {
-		return nil, connect.NewError(connect.CodeUnauthenticated, fmt.Errorf("authentication required"))
-	}
-
-	docRef, _, err := s.fs.Collection("estates").Add(ctx, map[string]interface{}{
-		"user_id":               userID,
-		"name":                  req.Msg.Name,
-		"type":                  req.Msg.Type,
-		"role":                  "Owner", // Default for creator
-		"status":                "Active",
-		"completion_percentage": 10,
-		"authority_mode":        int32(estatev1.AuthorityMode_AUTHORITY_MODE_OWNER),
-		"next_review_date":      time.Now().AddDate(0, 1, 0),
-	})
-	if err != nil {
-		return nil, connect.NewError(connect.CodeInternal, fmt.Errorf("failed to register estate: %w", err))
-	}
-
-	return connect.NewResponse(&estatev1.RegisterEstateResponse{
-		Estate: &estatev1.EstateSummary{
-			Id:   docRef.ID,
-			Name: req.Msg.Name,
-			Role: "Owner",
-		},
-	}), nil
-}
-
-func (s *Server) GetEstateMetadata(ctx context.Context, req *connect.Request[estatev1.GetEstateMetadataRequest]) (*connect.Response[estatev1.GetEstateMetadataResponse], error) {
-	// Ungated reads of estates/{id} leaked tier + MFA status + last-login for any
-	// estate (targeting recon). Gate on estate membership.
-	if err := s.checkEstateAccess(ctx, req.Msg.EstateId, false); err != nil {
-		return nil, err
-	}
-	if s.fs == nil {
-		name := "Lockhart Estate"
-		completion := int32(100)
-		return connect.NewResponse(&estatev1.GetEstateMetadataResponse{
-			Id:                   req.Msg.EstateId,
-			Name:                 name,
-			Status:               "Active",
-			CompletionPercentage: completion,
-			AuthorityMode:        estatev1.AuthorityMode_AUTHORITY_MODE_OWNER,
-		}), nil
-	}
-
-	doc, err := s.fs.Collection("estates").Doc(req.Msg.EstateId).Get(ctx)
-	if err != nil {
-		// Provide default if not in Firestore yet for demo
-		return connect.NewResponse(&estatev1.GetEstateMetadataResponse{
-			Status:               "Active",
-			CompletionPercentage: 34,
-			AuthorityMode:        estatev1.AuthorityMode_AUTHORITY_MODE_OWNER,
-		}), nil
-	}
-
-	var meta estatev1.GetEstateMetadataResponse
-	if err := doc.DataTo(&meta); err != nil {
-		return nil, connect.NewError(connect.CodeInternal, fmt.Errorf("failed to decode metadata: %w", err))
-	}
-
-	return connect.NewResponse(&meta), nil
-}
-
-func (s *Server) ListAssets(ctx context.Context, req *connect.Request[estatev1.ListAssetsRequest]) (*connect.Response[estatev1.ListAssetsResponse], error) {
-	if err := s.checkEstateAccess(ctx, req.Msg.EstateId, false); err != nil {
-		return nil, err
-	}
-
-	if s.fs == nil {
-		var assets []*estatev1.Asset
-		if req.Msg.EstateId == "estate_lockhart" {
-			assets = []*estatev1.Asset{
-				{Name: "Lockhart Family Residence (Chicago)", Type: "Real Estate", Value: "$1,250,000", Status: "Verified"},
-				{Name: "Lockhart Heritage Investment Fund", Type: "Securities", Value: "$2,450,000", Status: "Verified"},
-				{Name: "Chase Private Client - Savings", Type: "Cash", Value: "$425,000", Status: "Verified"},
-				{Name: "Digital Vault - Rare Collectibles", Type: "Digital Assets", Value: "$85,000", Status: "Verified"},
-			}
-		} else {
-			assets = []*estatev1.Asset{
-				{Name: "Family Home", Type: "Real Estate", Value: "$485,000", Status: "Verified"},
-				{Name: "Savings Account (Chase)", Type: "Cash", Value: "$124,500", Status: "Pending"},
-			}
-		}
-		return connect.NewResponse(&estatev1.ListAssetsResponse{Assets: assets, TotalCount: int32(len(assets))}), nil
-	}
-
-	var assets []*estatev1.Asset
-	iter := s.fs.Collection("estates").Doc(req.Msg.EstateId).Collection("assets").Documents(ctx)
-	for {
-		doc, err := iter.Next()
-		if err == iterator.Done {
-			break
-		}
-		if err != nil {
-			return nil, connect.NewError(connect.CodeInternal, fmt.Errorf("failed to fetch assets: %w", err))
-		}
-
-		var a estatev1.Asset
-		if err := doc.DataTo(&a); err != nil {
-			continue
-		}
-		assets = append(assets, &a)
-	}
-
-	return connect.NewResponse(&estatev1.ListAssetsResponse{Assets: assets, TotalCount: int32(len(assets))}), nil
-}
-
-func (s *Server) AddAsset(ctx context.Context, req *connect.Request[estatev1.AddAssetRequest]) (*connect.Response[estatev1.AddAssetResponse], error) {
-	if err := s.checkEstateAccess(ctx, req.Msg.EstateId, true); err != nil {
-		return nil, err
-	}
-
-	if s.fs == nil {
-		return nil, connect.NewError(connect.CodeUnimplemented, fmt.Errorf("firestore not initialized"))
-	}
-
-	newAsset := &estatev1.Asset{
-		Name:   req.Msg.Name,
-		Type:   req.Msg.Type,
-		Value:  req.Msg.Value,
-		Status: "Verified",
-	}
-
-	_, _, err := s.fs.Collection("estates").Doc(req.Msg.EstateId).Collection("assets").Add(ctx, map[string]interface{}{
-		"name":   newAsset.Name,
-		"type":   newAsset.Type,
-		"value":  newAsset.Value,
-		"status": newAsset.Status,
-	})
-	if err != nil {
-		return nil, connect.NewError(connect.CodeInternal, fmt.Errorf("failed to add asset: %w", err))
-	}
-
-	return connect.NewResponse(&estatev1.AddAssetResponse{Asset: newAsset}), nil
-}
-
-func (s *Server) ListVaultDocuments(ctx context.Context, req *connect.Request[estatev1.ListVaultDocumentsRequest]) (*connect.Response[estatev1.ListVaultDocumentsResponse], error) {
-	if err := s.checkEstateAccess(ctx, req.Msg.EstateId, false); err != nil {
-		return nil, err
-	}
-
-	if s.fs == nil {
-		var docs []*estatev1.VaultDocument
-		if req.Msg.EstateId == "estate_lockhart" {
-			docs = []*estatev1.VaultDocument{
-				{Name: "Lockhart_Master_Trust_2026.pdf", Date: "Feb 10, 2026", Size: "4.2 MB", Category: "Legal"},
-				{Name: "Estate_Tax_Clearance_IL.pdf", Date: "Mar 01, 2026", Size: "1.1 MB", Category: "Tax"},
-				{Name: "Family_Heritage_Deed.pdf", Date: "Jan 15, 2026", Size: "8.5 MB", Category: "Property"},
-				{Name: "Final_Wishes_Protocol_Auth.pdf", Date: "Mar 17, 2026", Size: "0.5 MB", Category: "Protocol"},
-			}
-		} else {
-			docs = []*estatev1.VaultDocument{
-				{Name: "Last_Will_Testament_2025.pdf", Date: "Mar 14, 2025", Size: "2.4 MB", Category: "Legal"},
-			}
-		}
-		return connect.NewResponse(&estatev1.ListVaultDocumentsResponse{Documents: docs}), nil
-	}
-
-	var docs []*estatev1.VaultDocument
-	iter := s.fs.Collection("estates").Doc(req.Msg.EstateId).Collection("vault").Documents(ctx)
-	for {
-		doc, err := iter.Next()
-		if err == iterator.Done {
-			break
-		}
-		if err != nil {
-			return nil, connect.NewError(connect.CodeInternal, fmt.Errorf("failed to fetch vault docs: %w", err))
-		}
-
-		var d estatev1.VaultDocument
-		if err := doc.DataTo(&d); err != nil {
-			continue
-		}
-		docs = append(docs, &d)
-	}
-
-	return connect.NewResponse(&estatev1.ListVaultDocumentsResponse{Documents: docs}), nil
-}
-
-func (s *Server) ListMemoirs(ctx context.Context, req *connect.Request[estatev1.ListMemoirsRequest]) (*connect.Response[estatev1.ListMemoirsResponse], error) {
-	if err := s.checkEstateAccess(ctx, req.Msg.EstateId, false); err != nil {
-		return nil, err
-	}
-
-	if s.fs == nil {
-		var memoirs []*estatev1.Memoir
-		if req.Msg.EstateId == "estate_lockhart" {
-			memoirs = []*estatev1.Memoir{
-				{Id: "mem-1", Title: "Mommy - Legacy Tape 01", Type: "video", Url: "/assets/tameeka/mommy.mp4", DateAdded: "Mar 17, 2026", Visibility: "private"},
-				{Id: "mem-2", Title: "Musical Tribute - Live Session", Type: "video", Url: "/assets/tameeka/musical tribute.mp4", DateAdded: "Mar 17, 2026", Visibility: "all_heirs"},
-				{Id: "mem-3", Title: "Mom Memorial - Heritage Photo", Type: "photo", Url: "/assets/tameeka/mom memorial.jpg", DateAdded: "Feb 10, 2026", Visibility: "private"},
-				{Id: "mem-4", Title: "Mom Dance - Legacy Profile", Type: "photo", Url: "/assets/tameeka/mom dance.jpg", DateAdded: "Jan 15, 2026", Visibility: "private"},
-			}
-		} else {
-			memoirs = []*estatev1.Memoir{
-				{Id: "1", Title: "Legacy Tape 01", Type: "video", Url: "/memoirs/legacy.mp4", DateAdded: "Today", Visibility: "private"},
-			}
-		}
-		return connect.NewResponse(&estatev1.ListMemoirsResponse{Memoirs: memoirs}), nil
-	}
-
-	var memoirs []*estatev1.Memoir
-	iter := s.fs.Collection("estates").Doc(req.Msg.EstateId).Collection("memoirs").Documents(ctx)
-	for {
-		doc, err := iter.Next()
-		if err == iterator.Done {
-			break
-		}
-		if err != nil {
-			return nil, connect.NewError(connect.CodeInternal, fmt.Errorf("failed to fetch memoirs: %w", err))
-		}
-
-		var m estatev1.Memoir
-		if err := doc.DataTo(&m); err != nil {
-			continue
-		}
-		m.Id = doc.Ref.ID
-		memoirs = append(memoirs, &m)
-	}
-
-	return connect.NewResponse(&estatev1.ListMemoirsResponse{Memoirs: memoirs}), nil
-}
-
-func (s *Server) UploadMemoir(ctx context.Context, req *connect.Request[estatev1.UploadMemoirRequest]) (*connect.Response[estatev1.UploadMemoirResponse], error) {
-	if err := s.checkEstateAccess(ctx, req.Msg.EstateId, true); err != nil {
-		return nil, err
-	}
-
-	if s.fs == nil {
-		return nil, connect.NewError(connect.CodeUnimplemented, fmt.Errorf("firestore not initialized"))
-	}
-
-	newMemoir := &estatev1.Memoir{
-		Title:      req.Msg.Title,
-		Type:       req.Msg.Type,
-		Url:        req.Msg.Url,
-		DateAdded:  time.Now().Format("Jan 02, 2006"),
-		Visibility: "private",
-	}
-
-	docRef, _, err := s.fs.Collection("estates").Doc(req.Msg.EstateId).Collection("memoirs").Add(ctx, map[string]interface{}{
-		"title":      newMemoir.Title,
-		"type":       newMemoir.Type,
-		"url":        newMemoir.Url,
-		"date_added": newMemoir.DateAdded,
-		"visibility": newMemoir.Visibility,
-	})
-	if err != nil {
-		return nil, connect.NewError(connect.CodeInternal, fmt.Errorf("failed to save memoir: %w", err))
-	}
-
-	newMemoir.Id = docRef.ID
-	return connect.NewResponse(&estatev1.UploadMemoirResponse{Memoir: newMemoir}), nil
-}
-
-func (s *Server) GetObituary(ctx context.Context, req *connect.Request[estatev1.GetObituaryRequest]) (*connect.Response[estatev1.GetObituaryResponse], error) {
-	// SaveObituary gated writes but this READ did not — any user could read any
-	// estate's obituary (the deceased's life narrative) by ID. Gate it.
-	if err := s.checkEstateAccess(ctx, req.Msg.EstateId, false); err != nil {
-		return nil, err
-	}
-	if s.fs == nil {
-		content := "Marcus Aurelius was a philosopher-king."
-		status := "Draft"
-		if req.Msg.EstateId == "estate_lockhart" {
-			content = "Tameeka Lockhart, the guardian of the Lockhart Legacy, has established this final record as a testament to strength, family, and the enduring spirit of the Lockhart Estate. Her contributions to the community and her family remain indelible."
-			status = "Verified"
-		}
-		return connect.NewResponse(&estatev1.GetObituaryResponse{
-			Content:     content,
-			Status:      status,
-			LastUpdated: timestamppb.Now(),
-		}), nil
-	}
-
-	doc, err := s.fs.Collection("estates").Doc(req.Msg.EstateId).Collection("governance").Doc("obituary").Get(ctx)
-	if err != nil {
-		// If document doesn't exist, return a default draft
-		return connect.NewResponse(&estatev1.GetObituaryResponse{
-			Content:     "",
-			Status:      "None",
-			LastUpdated: timestamppb.Now(),
-		}), nil
-	}
-
-	var obit estatev1.GetObituaryResponse
-	if err := doc.DataTo(&obit); err != nil {
-		return nil, connect.NewError(connect.CodeInternal, fmt.Errorf("failed to decode obituary: %w", err))
-	}
-
-	// Handle timestamp conversion if needed, otherwise firestore stores it
-	return connect.NewResponse(&obit), nil
-}
-
-func (s *Server) SaveObituary(ctx context.Context, req *connect.Request[estatev1.SaveObituaryRequest]) (*connect.Response[estatev1.SaveObituaryResponse], error) {
-	if err := s.checkEstateAccess(ctx, req.Msg.EstateId, true); err != nil {
-		return nil, err
-	}
-
-	if s.fs == nil {
-		return nil, connect.NewError(connect.CodeUnimplemented, fmt.Errorf("firestore not initialized"))
-	}
-
-	_, err := s.fs.Collection("estates").Doc(req.Msg.EstateId).Collection("governance").Doc("obituary").Set(ctx, map[string]interface{}{
-		"content":      req.Msg.Content,
-		"status":       "Draft",
-		"last_updated": timestamppb.Now(),
-	}, firestore.MergeAll)
-	if err != nil {
-		return nil, connect.NewError(connect.CodeInternal, fmt.Errorf("failed to save obituary: %w", err))
-	}
-
-	return connect.NewResponse(&estatev1.SaveObituaryResponse{Success: true}), nil
-}
-
-func (s *Server) GetAIInsight(ctx context.Context, req *connect.Request[estatev1.GetAIInsightRequest]) (*connect.Response[estatev1.GetAIInsightResponse], error) {
-	if err := s.checkEstateAccess(ctx, req.Msg.EstateId, false); err != nil {
-		return nil, err
-	}
-
-	insight := "Heritage Protocol Synchronized. Your estate is 100% complete and secured via the Protocol Ledger. All shards are active and verified."
-	if req.Msg.EstateId != "estate_lockhart" {
-		insight = "Protocol Optimization Required. Your estate is 34% complete. Assigning remaining beneficiary shares will activate the full Guardian Protocol."
-	}
-	return connect.NewResponse(&estatev1.GetAIInsightResponse{
-		Insight:     insight,
-		ActionLabel: "View Ledger",
-		ActionUrl:   "/dashboard/notifications",
-	}), nil
-}
-
-func (s *Server) GetGovernanceSettings(ctx context.Context, req *connect.Request[estatev1.GetGovernanceSettingsRequest]) (*connect.Response[estatev1.GetGovernanceSettingsResponse], error) {
-	if err := s.checkEstateAccess(ctx, req.Msg.EstateId, false); err != nil {
-		return nil, err
-	}
-
-	if s.fs == nil {
-		return connect.NewResponse(&estatev1.GetGovernanceSettingsResponse{
-			Settings: &estatev1.GovernanceSettings{
-				MfaEnabled:             true,
-				BiometricRelease:       false,
-				EmailAlerts:            true,
-				RecoveryKeyStatus:      "Verified",
-				StatusReportsFrequency: "Weekly",
-			},
-		}), nil
-	}
-
-	doc, err := s.fs.Collection("estates").Doc(req.Msg.EstateId).Collection("governance").Doc("settings").Get(ctx)
-	if err != nil {
-		return connect.NewResponse(&estatev1.GetGovernanceSettingsResponse{
-			Settings: &estatev1.GovernanceSettings{MfaEnabled: true},
-		}), nil
-	}
-
-	var settings estatev1.GovernanceSettings
-	if err := doc.DataTo(&settings); err != nil {
-		return nil, connect.NewError(connect.CodeInternal, fmt.Errorf("failed to decode settings: %w", err))
-	}
-
-	return connect.NewResponse(&estatev1.GetGovernanceSettingsResponse{Settings: &settings}), nil
-}
-
-func (s *Server) ListNotifications(ctx context.Context, req *connect.Request[estatev1.ListNotificationsRequest]) (*connect.Response[estatev1.ListNotificationsResponse], error) {
-	// Ungated reads leaked another estate's settlement/Guardian/security notifications.
-	if err := s.checkEstateAccess(ctx, req.Msg.EstateId, false); err != nil {
-		return nil, err
-	}
-	if s.fs == nil {
-		notifications := []*estatev1.Notification{
-			{Title: "Security Active", Time: "10 mins ago", Type: "success", Desc: "Protocols verified."},
-		}
-		return connect.NewResponse(&estatev1.ListNotificationsResponse{Notifications: notifications}), nil
-	}
-
-	var notifications []*estatev1.Notification
-	iter := s.fs.Collection("estates").Doc(req.Msg.EstateId).Collection("notifications").OrderBy("time", firestore.Desc).Limit(10).Documents(ctx)
-	for {
-		doc, err := iter.Next()
-		if err == iterator.Done {
-			break
-		}
-		if err != nil {
-			break // Graceful degradation
-		}
-
-		var n estatev1.Notification
-		if err := doc.DataTo(&n); err != nil {
-			continue
-		}
-		notifications = append(notifications, &n)
-	}
-
-	return connect.NewResponse(&estatev1.ListNotificationsResponse{Notifications: notifications}), nil
-}
diff --git a/api/internal/service/estate/service_test.go b/api/internal/service/estate/service_test.go
index 52e4212..769b213 100644
--- a/api/internal/service/estate/service_test.go
+++ b/api/internal/service/estate/service_test.go
@@ -10,450 +10,150 @@ import (
 	estatev1 "github.com/sirsi-technologies/finalwishes-api/internal/gen/estate/v1"
 )
 
-// --- Helper ---
+// These tests pin the HONEST EstateService contract (2026-06-14): the service
+// implements ONLY GenerateUploadUrl. Every other proto RPC is intentionally not
+// overridden, so the embedded UnimplementedEstateServiceHandler answers it with
+// connect.CodeUnimplemented instead of fabricated "Lockhart Estate" / "Sarah
+// Johnson" / "34% complete" demo data. The previous suite asserted that
+// fabricated data; it has been replaced to assert the real, non-mock behavior.
 
-// newTestServer returns a Server with nil Firestore/Storage clients (demo mode).
+// --- Helpers ---
+
+// newTestServer returns a Server with nil Firestore/Storage clients.
 func newTestServer() *Server {
 	return NewServer(nil, nil)
 }
 
-// testCtx returns a context with a test user ID injected, so checkEstateAccess passes.
+// testCtx returns a context with a test user ID injected.
 func testCtx() context.Context {
 	return auth.InjectUserIDForTest(context.Background(), "test-user")
 }
 
 // =========================================================
-// ListEstates
-// =========================================================
-
-func TestListEstates_DemoMode_KnownUser(t *testing.T) {
-	s := newTestServer()
-	resp, err := s.ListEstates(testCtx(), connect.NewRequest(&estatev1.ListEstatesRequest{
-		UserId: "user_tameeka",
-	}))
-	if err != nil {
-		t.Fatalf("unexpected error: %v", err)
-	}
-	if len(resp.Msg.Estates) != 2 {
-		t.Fatalf("expected 2 estates, got %d", len(resp.Msg.Estates))
-	}
-	if resp.Msg.Estates[0].Name != "Lockhart Estate" {
-		t.Errorf("expected 'Lockhart Estate', got %q", resp.Msg.Estates[0].Name)
-	}
-	if resp.Msg.Estates[1].Role != "Executor" {
-		t.Errorf("expected Executor role for second estate, got %q", resp.Msg.Estates[1].Role)
-	}
-}
-
-func TestListEstates_DemoMode_UnknownUser(t *testing.T) {
-	s := newTestServer()
-	resp, err := s.ListEstates(testCtx(), connect.NewRequest(&estatev1.ListEstatesRequest{
-		UserId: "some_other_user",
-	}))
-	if err != nil {
-		t.Fatalf("unexpected error: %v", err)
-	}
-	if len(resp.Msg.Estates) != 2 {
-		t.Fatalf("expected 2 estates for unknown user, got %d", len(resp.Msg.Estates))
-	}
-	if resp.Msg.Estates[0].Id != "estate-77b" {
-		t.Errorf("expected estate-77b, got %q", resp.Msg.Estates[0].Id)
-	}
-}
-
-// =========================================================
-// GetEstateMetadata
-// =========================================================
-
-func TestGetEstateMetadata_DemoMode(t *testing.T) {
-	s := newTestServer()
-	resp, err := s.GetEstateMetadata(testCtx(), connect.NewRequest(&estatev1.GetEstateMetadataRequest{
-		EstateId: "estate_lockhart",
-	}))
-	if err != nil {
-		t.Fatalf("unexpected error: %v", err)
-	}
-	if resp.Msg.Name != "Lockhart Estate" {
-		t.Errorf("expected 'Lockhart Estate', got %q", resp.Msg.Name)
-	}
-	if resp.Msg.CompletionPercentage != 100 {
-		t.Errorf("expected 100%% completion, got %d", resp.Msg.CompletionPercentage)
-	}
-	if resp.Msg.Status != "Active" {
-		t.Errorf("expected Active status, got %q", resp.Msg.Status)
-	}
-	if resp.Msg.AuthorityMode != estatev1.AuthorityMode_AUTHORITY_MODE_OWNER {
-		t.Errorf("expected OWNER authority mode, got %v", resp.Msg.AuthorityMode)
-	}
-}
-
-func TestGetEstateMetadata_PreservesEstateID(t *testing.T) {
-	s := newTestServer()
-	resp, err := s.GetEstateMetadata(testCtx(), connect.NewRequest(&estatev1.GetEstateMetadataRequest{
-		EstateId: "custom-id-123",
-	}))
-	if err != nil {
-		t.Fatalf("unexpected error: %v", err)
-	}
-	if resp.Msg.Id != "custom-id-123" {
-		t.Errorf("expected estate ID to be echoed back, got %q", resp.Msg.Id)
-	}
-}
-
-// =========================================================
-// ListBeneficiaries
-// =========================================================
-
-func TestListBeneficiaries_DemoMode(t *testing.T) {
-	s := newTestServer()
-	resp, err := s.ListBeneficiaries(testCtx(), connect.NewRequest(&estatev1.ListBeneficiariesRequest{
-		EstateId: "estate_lockhart",
-	}))
-	if err != nil {
-		t.Fatalf("unexpected error: %v", err)
-	}
-	if len(resp.Msg.Beneficiaries) != 1 {
-		t.Fatalf("expected 1 beneficiary, got %d", len(resp.Msg.Beneficiaries))
-	}
-	b := resp.Msg.Beneficiaries[0]
-	if b.Name != "Sarah Johnson" {
-		t.Errorf("expected Sarah Johnson, got %q", b.Name)
-	}
-	if b.Share != "50%" {
-		t.Errorf("expected 50%% share, got %q", b.Share)
-	}
-}
-
-// =========================================================
-// AddBeneficiary — requires Firestore, should fail in demo mode
+// checkEstateAccess — without an estate store, membership cannot be proven,
+// so access is DENIED (FailedPrecondition), never silently granted.
 // =========================================================
 
-func TestAddBeneficiary_DemoMode_FailsGracefully(t *testing.T) {
+func TestCheckEstateAccess_NoStore_Denied(t *testing.T) {
 	s := newTestServer()
-	_, err := s.AddBeneficiary(testCtx(), connect.NewRequest(&estatev1.AddBeneficiaryRequest{
-		EstateId: "estate_lockhart",
-		Name:     "New Heir",
-		Relation: "Child",
-		Email:    "newhier@test.com",
-	}))
+	err := s.checkEstateAccess(testCtx(), "estate_x", false)
 	if err == nil {
-		t.Fatal("expected error when Firestore is nil, got nil")
-	}
-	// Should be an Unimplemented error since fs is nil
-	if connect.CodeOf(err) != connect.CodeUnimplemented {
-		t.Errorf("expected Unimplemented code, got %v", connect.CodeOf(err))
+		t.Fatal("expected error when estate store is not configured")
 	}
-}
-
-// =========================================================
-// ListAssets
-// =========================================================
-
-func TestListAssets_DemoMode_LockhartEstate(t *testing.T) {
-	s := newTestServer()
-	resp, err := s.ListAssets(testCtx(), connect.NewRequest(&estatev1.ListAssetsRequest{
-		EstateId: "estate_lockhart",
-	}))
-	if err != nil {
-		t.Fatalf("unexpected error: %v", err)
-	}
-	if len(resp.Msg.Assets) != 4 {
-		t.Fatalf("expected 4 assets for lockhart, got %d", len(resp.Msg.Assets))
-	}
-	if resp.Msg.TotalCount != 4 {
-		t.Errorf("expected total count 4, got %d", resp.Msg.TotalCount)
-	}
-	// Verify first asset
-	if resp.Msg.Assets[0].Type != "Real Estate" {
-		t.Errorf("expected Real Estate type, got %q", resp.Msg.Assets[0].Type)
-	}
-}
-
-func TestListAssets_DemoMode_OtherEstate(t *testing.T) {
-	s := newTestServer()
-	resp, err := s.ListAssets(testCtx(), connect.NewRequest(&estatev1.ListAssetsRequest{
-		EstateId: "other-estate",
-	}))
-	if err != nil {
-		t.Fatalf("unexpected error: %v", err)
-	}
-	if len(resp.Msg.Assets) != 2 {
-		t.Fatalf("expected 2 assets for other estate, got %d", len(resp.Msg.Assets))
+	if connect.CodeOf(err) != connect.CodeFailedPrecondition {
+		t.Errorf("expected FailedPrecondition, got %v", connect.CodeOf(err))
 	}
 }
 
-// =========================================================
-// AddAsset — requires Firestore
-// =========================================================
-
-func TestAddAsset_DemoMode_FailsGracefully(t *testing.T) {
+func TestCheckEstateAccess_Unauthenticated(t *testing.T) {
 	s := newTestServer()
-	_, err := s.AddAsset(testCtx(), connect.NewRequest(&estatev1.AddAssetRequest{
-		EstateId: "estate_lockhart",
-		Name:     "New Car",
-		Type:     "Vehicle",
-		Value:    "$50,000",
-	}))
+	err := s.checkEstateAccess(context.Background(), "estate_x", false)
 	if err == nil {
-		t.Fatal("expected error when Firestore is nil")
+		t.Fatal("expected error when no user is in context")
 	}
-	if connect.CodeOf(err) != connect.CodeUnimplemented {
-		t.Errorf("expected Unimplemented code, got %v", connect.CodeOf(err))
+	if connect.CodeOf(err) != connect.CodeUnauthenticated {
+		t.Errorf("expected Unauthenticated, got %v", connect.CodeOf(err))
 	}
 }
 
 // =========================================================
-// ListVaultDocuments
+// GenerateUploadUrl — the only implemented RPC. With nil clients it is gated
+// by checkEstateAccess (no store -> FailedPrecondition) before any signing.
 // =========================================================
 
-func TestListVaultDocuments_DemoMode_Lockhart(t *testing.T) {
-	s := newTestServer()
-	resp, err := s.ListVaultDocuments(testCtx(), connect.NewRequest(&estatev1.ListVaultDocumentsRequest{
-		EstateId: "estate_lockhart",
-	}))
-	if err != nil {
-		t.Fatalf("unexpected error: %v", err)
-	}
-	if len(resp.Msg.Documents) != 4 {
-		t.Fatalf("expected 4 documents, got %d", len(resp.Msg.Documents))
-	}
-	// Verify categories
-	categories := map[string]bool{}
-	for _, d := range resp.Msg.Documents {
-		categories[d.Category] = true
-	}
-	for _, expected := range []string{"Legal", "Tax", "Property", "Protocol"} {
-		if !categories[expected] {
-			t.Errorf("expected category %q in documents", expected)
-		}
-	}
-}
-
-func TestListVaultDocuments_DemoMode_Other(t *testing.T) {
+func TestGenerateUploadUrl_NoStore_FailsClosed(t *testing.T) {
 	s := newTestServer()
-	resp, err := s.ListVaultDocuments(testCtx(), connect.NewRequest(&estatev1.ListVaultDocumentsRequest{
-		EstateId: "other-estate",
+	_, err := s.GenerateUploadUrl(testCtx(), connect.NewRequest(&estatev1.GenerateUploadUrlRequest{
+		EstateId:    "estate_x",
+		FileName:    "test.pdf",
+		ContentType: "application/pdf",
 	}))
-	if err != nil {
-		t.Fatalf("unexpected error: %v", err)
+	if err == nil {
+		t.Fatal("expected error when estate store / storage client is nil")
 	}
-	if len(resp.Msg.Documents) != 1 {
-		t.Fatalf("expected 1 document, got %d", len(resp.Msg.Documents))
+	if connect.CodeOf(err) != connect.CodeFailedPrecondition {
+		t.Errorf("expected FailedPrecondition, got %v", connect.CodeOf(err))
 	}
 }
 
-// =========================================================
-// GenerateUploadUrl — requires Storage client
-// =========================================================
-
-func TestGenerateUploadUrl_DemoMode_FailsGracefully(t *testing.T) {
+func TestGenerateUploadUrl_Unauthenticated(t *testing.T) {
 	s := newTestServer()
-	_, err := s.GenerateUploadUrl(testCtx(), connect.NewRequest(&estatev1.GenerateUploadUrlRequest{
-		EstateId:    "estate_lockhart",
+	_, err := s.GenerateUploadUrl(context.Background(), connect.NewRequest(&estatev1.GenerateUploadUrlRequest{
+		EstateId:    "estate_x",
 		FileName:    "test.pdf",
 		ContentType: "application/pdf",
 	}))
 	if err == nil {
-		t.Fatal("expected error when storage client is nil")
+		t.Fatal("expected error when caller is unauthenticated")
 	}
-	if connect.CodeOf(err) != connect.CodeFailedPrecondition {
-		t.Errorf("expected FailedPrecondition code, got %v", connect.CodeOf(err))
+	if connect.CodeOf(err) != connect.CodeUnauthenticated {
+		t.Errorf("expected Unauthenticated, got %v", connect.CodeOf(err))
 	}
 }
 
 // =========================================================
-// ListMemoirs
+// Unimplemented surface — every formerly-mocked RPC now returns Unimplemented
+// (no fabricated data, no hardcoded Lockhart/Sarah-Johnson/percentages).
 // =========================================================
 
-func TestListMemoirs_DemoMode_Lockhart(t *testing.T) {
+func TestUnimplementedRPCs_ReturnUnimplemented(t *testing.T) {
 	s := newTestServer()
-	resp, err := s.ListMemoirs(testCtx(), connect.NewRequest(&estatev1.ListMemoirsRequest{
-		EstateId: "estate_lockhart",
-	}))
-	if err != nil {
-		t.Fatalf("unexpected error: %v", err)
-	}
-	if len(resp.Msg.Memoirs) != 4 {
-		t.Fatalf("expected 4 memoirs, got %d", len(resp.Msg.Memoirs))
-	}
-	// Verify mix of types
-	types := map[string]int{}
-	for _, m := range resp.Msg.Memoirs {
-		types[m.Type]++
-	}
-	if types["video"] != 2 {
-		t.Errorf("expected 2 videos, got %d", types["video"])
-	}
-	if types["photo"] != 2 {
-		t.Errorf("expected 2 photos, got %d", types["photo"])
-	}
-}
+	ctx := testCtx()
 
-func TestListMemoirs_DemoMode_Other(t *testing.T) {
-	s := newTestServer()
-	resp, err := s.ListMemoirs(testCtx(), connect.NewRequest(&estatev1.ListMemoirsRequest{
-		EstateId: "other",
-	}))
-	if err != nil {
-		t.Fatalf("unexpected error: %v", err)
-	}
-	if len(resp.Msg.Memoirs) != 1 {
-		t.Fatalf("expected 1 memoir, got %d", len(resp.Msg.Memoirs))
+	assertUnimplemented := func(t *testing.T, name string, err error) {
+		t.Helper()
+		if err == nil {
+			t.Fatalf("%s: expected Unimplemented error, got nil (fabricated response?)", name)
+		}
+		if connect.CodeOf(err) != connect.CodeUnimplemented {
+			t.Errorf("%s: expected Unimplemented, got %v", name, connect.CodeOf(err))
+		}
 	}
-}
 
-// =========================================================
-// UploadMemoir — requires Firestore
-// =========================================================
+	_, err := s.ListEstates(ctx, connect.NewRequest(&estatev1.ListEstatesRequest{UserId: "user_tameeka"}))
+	assertUnimplemented(t, "ListEstates", err)
 
-func TestUploadMemoir_DemoMode_FailsGracefully(t *testing.T) {
-	s := newTestServer()
-	_, err := s.UploadMemoir(testCtx(), connect.NewRequest(&estatev1.UploadMemoirRequest{
-		EstateId: "estate_lockhart",
-		Title:    "Test Memoir",
-		Type:     "video",
-		Url:      "/test.mp4",
-	}))
-	if err == nil {
-		t.Fatal("expected error when Firestore is nil")
-	}
-	if connect.CodeOf(err) != connect.CodeUnimplemented {
-		t.Errorf("expected Unimplemented code, got %v", connect.CodeOf(err))
-	}
-}
+	_, err = s.RegisterEstate(ctx, connect.NewRequest(&estatev1.RegisterEstateRequest{Name: "X", Type: "Trust"}))
+	assertUnimplemented(t, "RegisterEstate", err)
 
-// =========================================================
-// GetObituary
-// =========================================================
+	_, err = s.GetEstateMetadata(ctx, connect.NewRequest(&estatev1.GetEstateMetadataRequest{EstateId: "estate_lockhart"}))
+	assertUnimplemented(t, "GetEstateMetadata", err)
 
-func TestGetObituary_DemoMode_Lockhart(t *testing.T) {
-	s := newTestServer()
-	resp, err := s.GetObituary(testCtx(), connect.NewRequest(&estatev1.GetObituaryRequest{
-		EstateId: "estate_lockhart",
-	}))
-	if err != nil {
-		t.Fatalf("unexpected error: %v", err)
-	}
-	if resp.Msg.Status != "Verified" {
-		t.Errorf("expected Verified status, got %q", resp.Msg.Status)
-	}
-	if resp.Msg.Content == "" {
-		t.Error("expected non-empty obituary content")
-	}
-	if resp.Msg.LastUpdated == nil {
-		t.Error("expected LastUpdated timestamp")
-	}
-}
+	_, err = s.ListAssets(ctx, connect.NewRequest(&estatev1.ListAssetsRequest{EstateId: "estate_lockhart"}))
+	assertUnimplemented(t, "ListAssets", err)
 
-func TestGetObituary_DemoMode_Other(t *testing.T) {
-	s := newTestServer()
-	resp, err := s.GetObituary(testCtx(), connect.NewRequest(&estatev1.GetObituaryRequest{
-		EstateId: "other",
-	}))
-	if err != nil {
-		t.Fatalf("unexpected error: %v", err)
-	}
-	if resp.Msg.Status != "Draft" {
-		t.Errorf("expected Draft status, got %q", resp.Msg.Status)
-	}
-}
+	_, err = s.AddAsset(ctx, connect.NewRequest(&estatev1.AddAssetRequest{EstateId: "estate_lockhart", Name: "Car"}))
+	assertUnimplemented(t, "AddAsset", err)
 
-// =========================================================
-// SaveObituary — requires Firestore
-// =========================================================
+	_, err = s.ListBeneficiaries(ctx, connect.NewRequest(&estatev1.ListBeneficiariesRequest{EstateId: "estate_lockhart"}))
+	assertUnimplemented(t, "ListBeneficiaries", err)
 
-func TestSaveObituary_DemoMode_FailsGracefully(t *testing.T) {
-	s := newTestServer()
-	_, err := s.SaveObituary(testCtx(), connect.NewRequest(&estatev1.SaveObituaryRequest{
-		EstateId: "estate_lockhart",
-		Content:  "Updated content",
-	}))
-	if err == nil {
-		t.Fatal("expected error when Firestore is nil")
-	}
-	if connect.CodeOf(err) != connect.CodeUnimplemented {
-		t.Errorf("expected Unimplemented code, got %v", connect.CodeOf(err))
-	}
-}
+	_, err = s.AddBeneficiary(ctx, connect.NewRequest(&estatev1.AddBeneficiaryRequest{EstateId: "estate_lockhart", Name: "Heir"}))
+	assertUnimplemented(t, "AddBeneficiary", err)
 
-// =========================================================
-// GetAIInsight
-// =========================================================
+	_, err = s.ListVaultDocuments(ctx, connect.NewRequest(&estatev1.ListVaultDocumentsRequest{EstateId: "estate_lockhart"}))
+	assertUnimplemented(t, "ListVaultDocuments", err)
 
-func TestGetAIInsight_LockhartEstate(t *testing.T) {
-	s := newTestServer()
-	resp, err := s.GetAIInsight(testCtx(), connect.NewRequest(&estatev1.GetAIInsightRequest{
-		EstateId: "estate_lockhart",
-	}))
-	if err != nil {
-		t.Fatalf("unexpected error: %v", err)
-	}
-	if resp.Msg.Insight == "" {
-		t.Error("expected non-empty insight")
-	}
-	if resp.Msg.ActionLabel != "View Ledger" {
-		t.Errorf("expected 'View Ledger', got %q", resp.Msg.ActionLabel)
-	}
-}
+	_, err = s.ListMemoirs(ctx, connect.NewRequest(&estatev1.ListMemoirsRequest{EstateId: "estate_lockhart"}))
+	assertUnimplemented(t, "ListMemoirs", err)
 
-func TestGetAIInsight_OtherEstate(t *testing.T) {
-	s := newTestServer()
-	resp, err := s.GetAIInsight(testCtx(), connect.NewRequest(&estatev1.GetAIInsightRequest{
-		EstateId: "other",
-	}))
-	if err != nil {
-		t.Fatalf("unexpected error: %v", err)
-	}
-	if resp.Msg.Insight == "" {
-		t.Error("expected non-empty insight for other estate")
-	}
-}
+	_, err = s.UploadMemoir(ctx, connect.NewRequest(&estatev1.UploadMemoirRequest{EstateId: "estate_lockhart", Title: "M"}))
+	assertUnimplemented(t, "UploadMemoir", err)
 
-// =========================================================
-// GetGovernanceSettings
-// =========================================================
+	_, err = s.GetObituary(ctx, connect.NewRequest(&estatev1.GetObituaryRequest{EstateId: "estate_lockhart"}))
+	assertUnimplemented(t, "GetObituary", err)
 
-func TestGetGovernanceSettings_DemoMode(t *testing.T) {
-	s := newTestServer()
-	resp, err := s.GetGovernanceSettings(testCtx(), connect.NewRequest(&estatev1.GetGovernanceSettingsRequest{
-		EstateId: "estate_lockhart",
-	}))
-	if err != nil {
-		t.Fatalf("unexpected error: %v", err)
-	}
-	settings := resp.Msg.Settings
-	if settings == nil {
-		t.Fatal("expected non-nil settings")
-	}
-	if !settings.MfaEnabled {
-		t.Error("expected MFA enabled in demo mode")
-	}
-	if !settings.EmailAlerts {
-		t.Error("expected email alerts enabled")
-	}
-	if settings.RecoveryKeyStatus != "Verified" {
-		t.Errorf("expected Verified recovery key, got %q", settings.RecoveryKeyStatus)
-	}
-}
+	_, err = s.SaveObituary(ctx, connect.NewRequest(&estatev1.SaveObituaryRequest{EstateId: "estate_lockhart", Content: "x"}))
+	assertUnimplemented(t, "SaveObituary", err)
 
-// =========================================================
-// ListNotifications
-// =========================================================
+	_, err = s.GetAIInsight(ctx, connect.NewRequest(&estatev1.GetAIInsightRequest{EstateId: "estate_lockhart"}))
+	assertUnimplemented(t, "GetAIInsight", err)
 
-func TestListNotifications_DemoMode(t *testing.T) {
-	s := newTestServer()
-	resp, err := s.ListNotifications(testCtx(), connect.NewRequest(&estatev1.ListNotificationsRequest{
-		EstateId: "estate_lockhart",
-	}))
-	if err != nil {
-		t.Fatalf("unexpected error: %v", err)
-	}
-	if len(resp.Msg.Notifications) != 1 {
-		t.Fatalf("expected 1 notification, got %d", len(resp.Msg.Notifications))
-	}
-	if resp.Msg.Notifications[0].Type != "success" {
-		t.Errorf("expected success type, got %q", resp.Msg.Notifications[0].Type)
-	}
+	_, err = s.GetGovernanceSettings(ctx, connect.NewRequest(&estatev1.GetGovernanceSettingsRequest{EstateId: "estate_lockhart"}))
+	assertUnimplemented(t, "GetGovernanceSettings", err)
+
+	_, err = s.ListNotifications(ctx, connect.NewRequest(&estatev1.ListNotificationsRequest{EstateId: "estate_lockhart"}))
+	assertUnimplemented(t, "ListNotifications", err)
 }
 
 // =========================================================
diff --git a/docs/ADR-INDEX.md b/docs/ADR-INDEX.md
index 8907f66..c02aa9a 100644
--- a/docs/ADR-INDEX.md
+++ b/docs/ADR-INDEX.md
@@ -1,6 +1,6 @@
 # Architecture Decision Records (ADR) Index
 
-This document indexes all Architecture Decision Records for the Sirsi Nexus platform.
+This document indexes all Architecture Decision Records for FinalWishes (The Estate Operating System).
 
 ## What is an ADR?
 
@@ -124,4 +124,4 @@ Each ADR follows this structure:
 
 ---
 
-*Last updated: 2026-04-14*
+*Last updated: 2026-06-14*
diff --git a/docs/REQUIREMENTS_SPECIFICATION.md b/docs/REQUIREMENTS_SPECIFICATION.md
index c5cc780..9e36b98 100644
--- a/docs/REQUIREMENTS_SPECIFICATION.md
+++ b/docs/REQUIREMENTS_SPECIFICATION.md
@@ -108,16 +108,27 @@ Initial launch supports **3 priority jurisdictions**:
 
 ### 2.4 Verify Phase (FR-400)
 
-#### FR-401: Death Certificate Processing — ⏳ Deferred to Tier 3
+#### FR-401: Death Certificate Processing — ✅ Implemented (IL)
 - System SHALL accept death certificate upload
-- System SHALL perform OCR extraction of death certificate data
-- *Not yet implemented. Post-settlement workflow.*
-
-#### FR-402: Executor Activation — ⏳ Deferred to Tier 3
-- System SHALL send notification to designated Executors upon death verification
-- System SHALL require Executor identity re-verification
-- System SHALL provide cooling-off period before asset access
-- *Full activation workflow not yet implemented. Basic executor role assignment exists.*
+- System SHALL extract death certificate facts (decedent name, dates) from the
+  document-intelligence analysis pipeline
+- System SHALL require executor/admin confirmation of the extracted facts
+- **Implementation:** `api/internal/probate/deathcert.go`
+  (`HandleSubmitDeathCertAnalysis` reads the AI analysis already produced by the
+  document-intelligence pipeline; `HandleConfirmDeathCert` records executor
+  confirmation; `HandleGetDeathCertFacts` returns stored facts). Surfaced in the
+  probate route (`web/src/routes/estates.$estateId.probate.tsx` →
+  `getDeathCertFacts` / `confirmDeathCert`).
+
+#### FR-402: Executor Activation — ✅ Implemented (IL)
+- System SHALL allow the designated executor to confirm their role after death verification
+- System SHALL notify estate members upon executor activation
+- System SHALL gate activation on executor/admin estate access
+- **Implementation:** `api/internal/probate/executor.go`
+  (`HandleGetExecutorStatus`, `HandleConfirmExecutorRole`, `notifyEstateMembers`).
+  Surfaced in the probate route via `getExecutorStatus` / `confirmExecutorRole`.
+- *Scope note:* identity re-verification and an explicit cooling-off timer remain
+  future hardening; role assignment, confirmation, and member notification ship.
 
 #### FR-403: Beneficiary Notification — ⏳ Deferred to Tier 3
 - System SHALL notify Heirs of their designation (after Executor activation)
@@ -130,9 +141,19 @@ Initial launch supports **3 priority jurisdictions**:
 - System SHALL support institution templates for launch states (IL, MN, MD)
 - *Not yet implemented.*
 
-#### FR-502: Government Notifications — ⏳ Deferred to Tier 3
+#### FR-502: Probate Guidance & Court Forms — ✅ Implemented (IL)
 - System SHALL provide state-specific probate guidance for launch states
-- *Not yet implemented.*
+- System SHALL surface the correct court form references for the estate's value
+  (full probate vs. small-estate affidavit)
+- **Implementation:** `api/internal/probate/forms.go` returns Illinois / Cook
+  County Probate Division form references — petition for letters (**CCP0315**),
+  oath/bond (**CCP0312/CCP0313**), and the Illinois small-estate-affidavit path
+  (**755 ILCS 5/ Art. XXV**, threshold per **IL Probate Act §14-1**) — each with
+  its official court URL. `directives.go` serves Illinois advance directives;
+  `illinois.go` holds the state ruleset. Surfaced in the probate route alongside
+  `SettlementGantt` and `QuorumPanel`.
+- *Scope note:* generated institution/government notification *letters* (FR-501)
+  remain deferred; this requirement covers guidance + form references, which ship.
 
 #### FR-503: Account Freeze Requests — ⏳ Deferred to Tier 3
 - *Not yet implemented.*
@@ -243,10 +264,16 @@ Initial launch supports **3 priority jurisdictions**:
 - System SHALL create a sacred, emotional moment for the heir
 - **Implementation:** Heir Welcome screen with Owner's legacy content
 
-#### FR-913: SMS Invitation Queue — ✅ Implemented
-- System SHALL support phone number collection for heir invitations
-- System SHALL queue SMS notifications for delivery
-- **Implementation:** SMS invitation queue with phone number input
+#### FR-913: SMS Invitation Notifications — 🔮 Future (email-only at GA)
+- System SHALL notify invitees of estate invitations
+- **Implementation:** Invitation delivery is **email-only** (Gmail API via the
+  `sendMail` Cloud Function). The phone-number/SMS path was **removed** rather
+  than shipped: no SMS provider is wired, so a queued text would never be
+  delivered while the UI reported success. The phone input and `sms_queue` write
+  have been deleted from the invite flow. SMS delivery is deferred until a real
+  provider is adopted (Sirsi Sign shared SMS/MFA rail per ADR-047, or a managed
+  Twilio extension), at which point the delivery function and phone field will be
+  reintroduced together.
 
 ---
 
@@ -397,9 +424,9 @@ Initial launch supports **3 priority jurisdictions**:
 - [x] User can sign documents electronically (OpenSign integration)
 - [x] User can share memorial pages publicly (QR code sharing)
 - [x] AI Shepherd provides guidance, scoring, and obituary drafting
-- [ ] Executor can activate estate after death verification (Tier 3)
-- [ ] System generates notification letters for institutions (Tier 3)
-- [ ] System provides state-specific probate guidance (IL, MN, MD) (Tier 3)
+- [x] Executor can activate estate after death verification (probate engine — IL; FR-401/402)
+- [ ] System generates notification letters for institutions (Tier 3 — FR-501 deferred)
+- [x] System provides state-specific probate guidance + court forms (IL shipped; MN, MD deferred) (FR-502)
 
 ---
 
@@ -417,11 +444,11 @@ Initial launch supports **3 priority jurisdictions**:
 | FR-301 | Document Intelligence | ✅ Implemented |
 | FR-302 | Asset Discovery | ⏳ Deferred (Tier 2) |
 | FR-303 | Contact Import | ⏳ Deferred |
-| FR-401 | Death Certificate Processing | ⏳ Deferred (Tier 3) |
-| FR-402 | Executor Activation | ⏳ Deferred (Tier 3) |
+| FR-401 | Death Certificate Processing | ✅ Implemented (IL) |
+| FR-402 | Executor Activation | ✅ Implemented (IL) |
 | FR-403 | Beneficiary Notification | ⏳ Deferred (Tier 3) |
 | FR-501 | Institution Notification | ⏳ Deferred (Tier 3) |
-| FR-502 | Government Notifications | ⏳ Deferred (Tier 3) |
+| FR-502 | Probate Guidance & Court Forms | ✅ Implemented (IL) |
 | FR-503 | Account Freeze Requests | ⏳ Deferred (Tier 3) |
 | FR-601 | Asset Transfer | ⏳ Deferred (Tier 3) |
 | FR-602 | Final Accounting | 🔮 Future |
@@ -443,7 +470,7 @@ Initial launch supports **3 priority jurisdictions**:
 | FR-910 | Per-Person Content Visibility | ✅ Implemented |
 | FR-911 | Owner Welcome Experience | ✅ Implemented |
 | FR-912 | Heir Welcome Sacred Moment | ✅ Implemented |
-| FR-913 | SMS Invitation Queue | ✅ Implemented |
+| FR-913 | SMS Invitation Notifications | 🔮 Future (email-only at GA — no provider wired) |
 
 ---
 
@@ -454,3 +481,4 @@ Initial launch supports **3 priority jurisdictions**:
 | 1.0.0 | 2025-11-26 | FinalWishes Team | Initial draft |
 | 1.1.0 | 2025-11-26 | Claude | 6-state MVP scope, Firebase/GCP constraints, 4-month timeline |
 | 2.0.0 | 2026-04-17 | Claude | Complete status audit: 8 FRs implemented, 13 deferred/future, 13 new Life Companion requirements (FR-901 through FR-913) added. Integration table updated to reflect actual GCP stack. Geographic scope narrowed to 3 states (IL, MN, MD). Tech constraints updated to reflect Go + React 19 + Vite 8 stack. |
+| 2.1.0 | 2026-06-14 | Claude | Status reconciliation. FR-913 re-statused ✅→🔮 (SMS path removed — email-only delivery; no provider wired). FR-401 (death-cert facts + confirm), FR-402 (executor activation + member notify), FR-502 (IL probate guidance + Cook County court forms) re-statused ⏳ Deferred→✅ Implemented (IL) to match the shipped `api/internal/probate` engine. §6.1 acceptance + Appendix A matrix updated accordingly. |
diff --git a/docs/legal-corpus/build_manifest.py b/docs/legal-corpus/build_manifest.py
new file mode 100644
index 0000000..8723e6d
--- /dev/null
+++ b/docs/legal-corpus/build_manifest.py
@@ -0,0 +1,161 @@
+#!/usr/bin/env python3
+"""Deterministically assemble the CR-10 legal-corpus manifest from raw official
+.gov HTML captures. NO LLM is in the text path (Rule 9): each `text` field is the
+verbatim statute body, sliced between explicit markers from the official page.
+"""
+import re, html, json, sys
+
+def extract(path):
+    h = open(path, encoding='utf-8', errors='replace').read()
+    h = re.sub(r'(?is)<script.*?</script>', '', h)
+    h = re.sub(r'(?is)<style.*?</style>', '', h)
+    h = re.sub(r'(?i)<br\s*/?>', '\n', h)
+    h = re.sub(r'(?i)</p>', '\n\n', h)
+    h = re.sub(r'(?i)</div>', '\n', h)
+    h = re.sub(r'(?i)</tr>', '\n', h)
+    t = re.sub(r'(?s)<[^>]+>', ' ', h)
+    t = html.unescape(t).replace('\xa0', ' ')
+    t = '\n'.join(re.sub(r'[ \t]+', ' ', ln).strip() for ln in t.split('\n'))
+    t = re.sub(r'\n{3,}', '\n\n', t).strip()
+    return t
+
+def slice_body(path, start_pred, end_pred=None, include_end=False):
+    """Return text from the first line satisfying start_pred to the line
+    satisfying end_pred (exclusive unless include_end)."""
+    lines = extract(path).split('\n')
+    si = next(i for i, l in enumerate(lines) if start_pred(l))
+    if end_pred is None:
+        body = lines[si:]
+    else:
+        ei = next(i for i in range(si, len(lines)) if end_pred(lines[i]))
+        body = lines[si:ei + 1] if include_end else lines[si:ei]
+    out = '\n'.join(body)
+    out = re.sub(r'\n{3,}', '\n\n', out).strip()
+    return out
+
+VERIFIED = "2026-06-14T00:00:00Z"
+
+specs = []
+
+# ---- Illinois (ilga.gov documents pages are pure statute, no chrome) ----
+def il_full(path):
+    return extract(path)
+
+specs.append(dict(
+    file='il-5-4-3.html',
+    id='il-755-ilcs-5-4-3',
+    jurisdiction='IL',
+    title='Illinois Probate Act — Will Signing and Attestation',
+    statuteReference='755 ILCS 5/4-3',
+    sourceUrl='https://www.ilga.gov/documents/legislation/ilcs/documents/075500050K4-3.htm',
+    publisher='Illinois General Assembly',
+    licenseNote='U.S. state statute — public domain (Illinois Compiled Statutes)',
+    text=il_full('il-5-4-3.html'),
+))
+specs.append(dict(
+    file='il-45-3-3.html',
+    id='il-755-ilcs-45-3-3',
+    jurisdiction='IL',
+    title='Illinois Power of Attorney Act — Statutory Short Form Power of Attorney for Property',
+    statuteReference='755 ILCS 45/3-3',
+    sourceUrl='https://www.ilga.gov/documents/legislation/ilcs/documents/075500450K3-3.htm',
+    publisher='Illinois General Assembly',
+    licenseNote='U.S. state statute — public domain (Illinois Compiled Statutes)',
+    text=il_full('il-45-3-3.html'),
+))
+specs.append(dict(
+    file='il-45-4-10.html',
+    id='il-755-ilcs-45-4-10',
+    jurisdiction='IL',
+    title='Illinois Power of Attorney Act — Statutory Short Form Power of Attorney for Health Care',
+    statuteReference='755 ILCS 45/4-10',
+    sourceUrl='https://www.ilga.gov/documents/legislation/ilcs/documents/075500450K4-10.htm',
+    publisher='Illinois General Assembly',
+    licenseNote='U.S. state statute — public domain (Illinois Compiled Statutes)',
+    text=il_full('il-45-4-10.html'),
+))
+
+# ---- Maryland (mgaleg page wraps statute in site chrome) ----
+md_body = slice_body(
+    'md-5-603.html',
+    start_pred=lambda l: l.strip().startswith('§5'),
+    end_pred=lambda l: l.strip() == 'Previous Next',
+)
+specs.append(dict(
+    id='md-hg-5-603',
+    jurisdiction='MD',
+    title='Maryland Health-General — Advance Directive Statutory Form',
+    statuteReference='Md. Code, Health-General § 5-603',
+    sourceUrl='https://mgaleg.maryland.gov/mgawebsite/Laws/StatuteText?article=ghg&section=5-603&enactments=false',
+    publisher='Maryland General Assembly (Department of Legislative Services)',
+    licenseNote='U.S. state statute — public domain (Annotated Code of Maryland)',
+    text=md_body,
+))
+
+# ---- Minnesota (revisor.mn.gov; body = heading .. History: inclusive) ----
+mn_507 = slice_body(
+    'mn-507-071.html',
+    start_pred=lambda l: l.strip().startswith('507.071 TRANSFER ON DEATH DEEDS'),
+    end_pred=lambda l: l.strip().startswith('Official Publication of the State of Minnesota'),
+)
+specs.append(dict(
+    id='mn-507-071',
+    jurisdiction='MN',
+    title='Minnesota Statutes — Transfer on Death Deeds',
+    statuteReference='Minn. Stat. § 507.071',
+    sourceUrl='https://www.revisor.mn.gov/statutes/cite/507.071',
+    publisher='Minnesota Office of the Revisor of Statutes',
+    licenseNote='U.S. state statute — public domain (Minnesota Statutes)',
+    text=mn_507,
+))
+mn_145c16 = slice_body(
+    'mn-145c-16.html',
+    start_pred=lambda l: l.strip().startswith('145C.16 SUGGESTED FORM'),
+    end_pred=lambda l: l.strip().startswith('Official Publication of the State of Minnesota'),
+)
+specs.append(dict(
+    id='mn-145c-16',
+    jurisdiction='MN',
+    title='Minnesota Statutes — Health Care Directive Suggested Form',
+    statuteReference='Minn. Stat. § 145C.16',
+    sourceUrl='https://www.revisor.mn.gov/statutes/cite/145C.16',
+    publisher='Minnesota Office of the Revisor of Statutes',
+    licenseNote='U.S. state statute — public domain (Minnesota Statutes)',
+    text=mn_145c16,
+))
+mn_145c05 = slice_body(
+    'mn-145c-05.html',
+    start_pred=lambda l: l.strip().startswith('145C.05 SUGGESTED FORM'),
+    end_pred=lambda l: l.strip().startswith('Official Publication of the State of Minnesota'),
+)
+specs.append(dict(
+    id='mn-145c-05',
+    jurisdiction='MN',
+    title='Minnesota Statutes — Health Care Directive; Provisions That May Be Included',
+    statuteReference='Minn. Stat. § 145C.05',
+    sourceUrl='https://www.revisor.mn.gov/statutes/cite/145C.05',
+    publisher='Minnesota Office of the Revisor of Statutes',
+    licenseNote='U.S. state statute — public domain (Minnesota Statutes)',
+    text=mn_145c05,
+))
+
+sources = []
+for s in specs:
+    s.pop('file', None)
+    txt = s['text']
+    assert txt and len(txt) > 200, f"{s['id']} text too short: {len(txt)}"
+    s['verifiedAt'] = VERIFIED
+    # order keys per schema
+    sources.append({
+        'id': s['id'], 'jurisdiction': s['jurisdiction'], 'title': s['title'],
+        'statuteReference': s['statuteReference'], 'sourceUrl': s['sourceUrl'],
+        'publisher': s['publisher'], 'licenseNote': s['licenseNote'],
+        'verifiedAt': s['verifiedAt'], 'text': txt,
+    })
+
+manifest = {'sources': sources}
+out = json.dumps(manifest, indent=2, ensure_ascii=False)
+open(sys.argv[1], 'w', encoding='utf-8').write(out + '\n')
+for s in sources:
+    print(f"{s['id']:24s} {s['jurisdiction']:3s} {len(s['text']):6d} chars  {s['statuteReference']}")
+print(f"\nWROTE {sys.argv[1]} ({len(out)} bytes, {len(sources)} sources)")
diff --git a/docs/legal-corpus/extract.py b/docs/legal-corpus/extract.py
new file mode 100644
index 0000000..e76e6e7
--- /dev/null
+++ b/docs/legal-corpus/extract.py
@@ -0,0 +1,17 @@
+import re,html,sys
+def extract(path):
+    h=open(path,encoding='utf-8',errors='replace').read()
+    h=re.sub(r'(?is)<script.*?</script>','',h)
+    h=re.sub(r'(?is)<style.*?</style>','',h)
+    h=re.sub(r'(?i)<br\s*/?>','\n',h)
+    h=re.sub(r'(?i)</p>','\n\n',h)
+    h=re.sub(r'(?i)</div>','\n',h)
+    h=re.sub(r'(?i)</tr>','\n',h)
+    t=re.sub(r'(?s)<[^>]+>',' ',h)
+    t=html.unescape(t)
+    t='\n'.join(re.sub(r'[ \t]+',' ',line).strip() for line in t.split('\n'))
+    t=re.sub(r'\n{3,}','\n\n',t).strip()
+    return t
+if __name__=='__main__':
+    t=extract(sys.argv[1])
+    print("LEN",len(t)); print("====="); print(t[:int(sys.argv[2]) if len(sys.argv)>2 else 1200])
diff --git a/docs/legal-corpus/launch-states.json b/docs/legal-corpus/launch-states.json
new file mode 100644
index 0000000..a368e7d
--- /dev/null
+++ b/docs/legal-corpus/launch-states.json
@@ -0,0 +1,81 @@
+{
+  "sources": [
+    {
+      "id": "il-755-ilcs-5-4-3",
+      "jurisdiction": "IL",
+      "title": "Illinois Probate Act — Will Signing and Attestation",
+      "statuteReference": "755 ILCS 5/4-3",
+      "sourceUrl": "https://www.ilga.gov/documents/legislation/ilcs/documents/075500050K4-3.htm",
+      "publisher": "Illinois General Assembly",
+      "licenseNote": "U.S. state statute — public domain (Illinois Compiled Statutes)",
+      "verifiedAt": "2026-06-14T00:00:00Z",
+      "text": "755 ILCS 5/4-3\n\n(755 ILCS 5/4-3) (from Ch. 110 1/2, par. 4-3)\n\nSec. 4-3.\nSigning and attestation.\n\n(a) Every will shall be in writing, signed by the testator or by some\nperson in his presence and by his direction and attested in the presence of\nthe testator by 2 or more credible witnesses.\n\n(b) A will that qualifies as an international will under the Uniform\nInternational Wills Act is considered to meet all the requirements of\nsubsection (a).\n\n(Source: P.A. 86-1291.)"
+    },
+    {
+      "id": "il-755-ilcs-45-3-3",
+      "jurisdiction": "IL",
+      "title": "Illinois Power of Attorney Act — Statutory Short Form Power of Attorney for Property",
+      "statuteReference": "755 ILCS 45/3-3",
+      "sourceUrl": "https://www.ilga.gov/documents/legislation/ilcs/documents/075500450K3-3.htm",
+      "publisher": "Illinois General Assembly",
+      "licenseNote": "U.S. state statute — public domain (Illinois Compiled Statutes)",
+      "verifiedAt": "2026-06-14T00:00:00Z",
+      "text": "755 ILCS 45/3-3\n\n(755 ILCS 45/3-3) (from Ch. 110 1/2, par. 803-3)\n\nSec. 3-3. Statutory short form power of attorney for property.\n(a) The\nform prescribed in this Section may be known as \"statutory property power\" and may be used\nto grant an agent powers with respect to property and financial matters.\nThe \"statutory property power\" consists of the following: (1) Notice to the Individual Signing the Illinois Statutory Short Form Power of Attorney for Property; (2) Illinois Statutory Short Form Power of Attorney for Property; and (3) Notice to Agent. When a power of attorney in substantially the form prescribed in this Section is used,\nincluding all 3 items above, with item (1), the Notice to Individual Signing the Illinois Statutory Short Form Power of Attorney for Property, on a separate sheet (coversheet) in 14-point type and\nthe notarized form of acknowledgment at the end, it shall have the meaning\nand effect prescribed in this Act.\n(b) A power of attorney shall also be deemed to be in substantially the same format as the statutory form if the explanatory language throughout the form (the language following the designation \"NOTE:\") is distinguished in some way from the legal paragraphs in the form, such as the use of boldface or other difference in typeface and font or point size, even if the \"Notice\" paragraphs at the beginning are not on a separate sheet of paper or are not in 14-point type, or if the principal's initials do not appear in the acknowledgement at the end of the \"Notice\" paragraphs.\nThe validity of a power of attorney as\nmeeting the requirements of a statutory property power shall not be\naffected by the fact that one or more of the categories of optional powers\nlisted in the form are struck out or the form includes specific\nlimitations on or additions to the agent's powers, as permitted by the\nform. Nothing in this Article shall invalidate or bar use by the\nprincipal of any other or different form of power of attorney for property.\nNonstatutory property powers (i) must be executed by the principal, (ii) must\ndesignate the agent and the agent's powers, (iii) must be signed by at least one witness to the principal's signature, and (iv) must indicate that the principal has acknowledged his or her signature before a notary public. However, nonstatutory property powers need not\nconform in any other respect to the statutory property power.\n\n(c) The Notice to the Individual Signing the Illinois Statutory Short Form Power of Attorney for Property shall be substantially as follows:\n\"NOTICE TO THE INDIVIDUAL SIGNING THE ILLINOIS STATUTORY SHORT FORM POWER OF ATTORNEY FOR PROPERTY.\nPLEASE READ THIS NOTICE CAREFULLY. The form that you will be signing is a legal document. It is governed by the Illinois Power of Attorney Act. If there is anything about this form that you do not understand, you should ask a lawyer to explain it to you.\nThe purpose of this Power of Attorney is to give your designated \"agent\" broad powers to handle your financial affairs, which may include the power to pledge, sell, or dispose of any of your real or personal property, even without your consent or any advance notice to you. When using the Statutory Short Form, you may name successor agents, but you may not name co-agents.\nThis form does not impose a duty upon your agent to handle your financial affairs, so it is important that you select an agent who will agree to do this for you. It is also important to select an agent whom you trust, since you are giving that agent control over your financial assets and property. Any agent who does act for you has a duty to act in good faith for your benefit and to use due care, competence, and diligence. He or she must also act in accordance with the law and with the directions in this form. Your agent must keep a record of all receipts, disbursements, and significant actions taken as your agent.\nUnless you specifically limit the period of time that this Power of Attorney will be in effect, your agent may exercise the powers given to him or her throughout your lifetime, both before and after you become incapacitated. A court, however, can take away the powers of your agent if it finds that the agent is not acting properly. You may also revoke this Power of Attorney if you wish.\nThis Power\nof Attorney does not authorize your agent to appear in court for you as an attorney-at-law or otherwise to engage in the practice of law unless he or she is a licensed attorney who is authorized to practice law in Illinois.\nThe powers you give your agent are explained more fully in Section 3-4 of the Illinois Power of Attorney Act. This form is a part of that law. The \"NOTE\" paragraphs throughout this form are instructions.\nYou are not required to sign this Power of Attorney, but it will not take effect without your signature. You should not sign this Power of Attorney if you do not understand everything in it, and what your agent will be able to do if you do sign it.\n\nPlease place your initials on the following line indicating that you have read this Notice: .....................\nPrincipal's initials\"\n\n(d) The Illinois Statutory Short Form Power of Attorney for Property shall be substantially as follows:\n\"ILLINOIS STATUTORY SHORT FORM POWER OF ATTORNEY FOR PROPERTY\n\n1. I, ..............., (insert name and address of principal)\nhereby revoke all prior powers of attorney for property executed by me and appoint:\n\n. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .\n(insert name and address of agent)\n\n(NOTE: You may not name co-agents using this form.)\nas my attorney-in-fact (my \"agent\") to act for me and in my name (in any\nway I could act in person) with respect to the following powers, as defined\nin Section 3-4 of the \"Statutory Short Form Power of Attorney for Property Law\"\n(including all amendments), but subject to any limitations on or additions\nto the specified powers inserted in paragraph 2 or 3 below:\n\n(NOTE: You must strike out any one or more of the following categories of\npowers you do not want your agent to have. Failure to strike the title\nof any category will cause the powers described in that category to be\ngranted to the agent. To strike out a category you must draw a line\nthrough the title of that category.)\n\n(a) Real estate transactions.\n\n(b) Financial institution transactions.\n\n(c) Stock and bond transactions.\n\n(d) Tangible personal property transactions.\n\n(e) Safe deposit box transactions.\n\n(f) Insurance and annuity transactions.\n\n(g) Retirement plan transactions.\n\n(h) Social Security, employment and military service benefits.\n\n(i) Tax matters.\n\n(j) Claims and litigation.\n\n(k) Commodity and option transactions.\n\n(l) Business operations.\n\n(m) Borrowing transactions.\n\n(n) Estate transactions.\n\n(o) All other property transactions.\n\n(NOTE: Limitations on and additions to the agent's powers may be included in this power of attorney if they are specifically described below.)\n\n2. The powers granted above shall not include the following powers or\nshall be modified or limited in the following particulars:\n(NOTE: Here you may\ninclude any specific limitations you deem appropriate, such as a\nprohibition or conditions on the sale of particular stock or real estate or\nspecial rules on borrowing by the agent.)\n\n. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .\n. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .\n. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .\n. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .\n. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .\n\n3. In addition to the powers granted above, I grant my agent the\nfollowing powers:\n(NOTE: Here you may add any other delegable powers including,\nwithout limitation, power to make gifts, exercise powers of appointment,\nname or change beneficiaries or joint tenants or revoke or amend any trust\nspecifically referred to below.)\n\n. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .\n. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .\n. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .\n. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .\n. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .\n\n(NOTE: Your agent will have authority to employ other persons as necessary to enable the agent to properly exercise the powers granted in this form, but your agent will have to make all discretionary decisions. If you want to give your agent the right to delegate discretionary decision-making powers to others, you should keep paragraph 4, otherwise it should be struck out.)\n\n4. My agent shall have the right by written instrument to delegate any\nor all of the foregoing powers involving discretionary decision-making to\nany person or persons whom my agent may select, but such delegation may be\namended or revoked by any agent (including any successor) named by me who\nis acting under this power of attorney at the time of reference.\n\n(NOTE: Your agent will be entitled to reimbursement for all reasonable expenses incurred in acting under this power of attorney. Strike out paragraph 5 if you do not want your agent to also be entitled to reasonable compensation for services as agent.)\n\n5. My agent shall be entitled to reasonable compensation for services\nrendered as agent under this power of attorney.\n\n(NOTE: This power of attorney may be amended or revoked by you at any time and in any manner. Absent amendment or revocation, the authority granted in this power of attorney will become effective at the time this power is signed and will continue until your death, unless a limitation on the beginning date or duration is made by initialing and completing one or both of paragraphs 6 and 7:)\n\n6. ( ) This power of attorney shall become effective on\n\n. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .\n\n(NOTE: Insert a future date or event during your lifetime, such as a court\ndetermination of your disability or a written determination by your physician that you are incapacitated, when you want this power to first take effect.)\n\n7. ( ) This power of attorney shall terminate on\n\n. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .\n\n(NOTE: Insert a future date or event, such as a court determination that you are not under a legal disability or a written determination by your physician that you are not incapacitated, if you want this power to terminate prior to your death.)\n\n(NOTE: If you wish to name one or more successor agents, insert the name and address of each successor agent in paragraph 8.)\n\n8. If any agent named by me shall die, become incompetent, resign\nor refuse to accept the office of agent, I name the following\n(each to act alone and successively,\nin the order named) as successor(s) to such agent:\n\n. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .\n. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .\n\nFor purposes of this paragraph 8, a person shall be considered to be\nincompetent if and while the person is a minor or an adjudicated\nincompetent or a person with a disability or the person is unable to give prompt and\nintelligent consideration to business matters, as certified by a licensed physician.\n\n(NOTE: If you wish to, you may name your agent as guardian of your estate if a court decides that one should be appointed. To do this, retain paragraph 9, and the court will appoint your agent if the court finds that this appointment will serve your best interests and welfare. Strike out paragraph 9 if you do not want your agent to act as guardian.)\n\n9. If a guardian of my estate (my property) is to be appointed, I\nnominate the agent acting under this power of attorney as such guardian,\nto serve without bond or security.\n\n10. I am fully informed as to all the contents of this form and\nunderstand the full import of this grant of powers to my agent.\n\n(NOTE: This form does not authorize your agent to appear in court for you as an attorney-at-law or otherwise to engage in the practice of law unless he or she is a licensed attorney who is authorized to practice law in Illinois.)\n11. The Notice to Agent is incorporated by reference and included as part of this form.\nDated: ................\nSigned . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .\n(principal)\n\n(NOTE: This power of attorney will not be effective unless it is signed by at least one witness and your signature is notarized, using the form below. The notary may not also sign as a witness.)\n\nThe undersigned witness certifies that ..............., known to me to be\nthe same person whose name is subscribed as principal to the foregoing power of\nattorney, appeared before me and the notary public and acknowledged signing and\ndelivering the instrument as the free and voluntary act of the principal, for\nthe\nuses and purposes therein set forth. I believe him or her to be of sound mind\nand memory. The undersigned witness also certifies that the witness is not: (a) the attending physician or mental health service provider or a relative of the physician or provider; (b) an owner, operator, or relative of an owner or operator of a health care facility in which the principal is a patient or resident; (c) a parent, sibling, descendant, or any spouse of such parent, sibling, or descendant of either the principal or any agent or successor agent under the foregoing power of attorney, whether such relationship is by blood, marriage, or adoption; or (d) an agent or successor agent under the foregoing power of attorney.\n\nDated: ................\n..............................\n\nWitness\n\n(NOTE: Illinois requires only one witness, but other jurisdictions may require more than one witness. If you wish to have a second witness, have him or her certify and sign here:)\n\n(Second witness) The undersigned witness certifies that ................, known to me to be the same person whose name is subscribed as principal to the foregoing power of attorney, appeared before me and the notary public and acknowledged signing and delivering the instrument as the free and voluntary act of the principal, for the uses and purposes therein set forth. I believe him or her to be of sound mind and memory. The undersigned witness also certifies that the witness is not: (a) the attending physician or mental health service provider or a relative of the physician or provider; (b) an owner, operator, or relative of an owner or operator of a health care facility in which the principal is a patient or resident; (c) a parent, sibling, descendant, or any spouse of such parent, sibling, or descendant of either the principal or any agent or successor agent under the foregoing power of attorney, whether such relationship is by blood, marriage, or adoption; or (d) an agent or successor agent under the foregoing power of attorney.\nDated: ....................... ..............................\nWitness\n\nState of ............)\n) SS.\nCounty of ...........)\n\nThe undersigned, a notary public in and for the above county and state,\ncertifies that ......................., known to me to be the same person\nwhose name is subscribed as principal to the foregoing power of attorney,\nappeared before me and the witness(es) ............. (and ..............) in person and acknowledged\nsigning and delivering the\ninstrument as the free and voluntary act of the principal, for the uses and\npurposes therein set forth (, and certified to the correctness of the\nsignature(s) of the agent(s)).\n\nDated: ................\n..............................\n\nNotary Public\n\nMy commission expires .................\n\n(NOTE: You may, but are not required to, request your agent and successor agents to provide specimen signatures below. If you include specimen signatures in this power of attorney, you must complete the certification opposite the signatures of the agents.)\n\nSpecimen signatures of I certify that the signatures\nagent (and successors) of my agent (and successors)\nare genuine.\n.......................... .............................\n(agent) (principal)\n.......................... .............................\n(successor agent) (principal)\n.......................... .............................\n(successor agent) (principal)\n\n(NOTE: The name, address, and phone number of the person preparing this form or who assisted the principal in completing this form should be inserted below.)\n\nName: .......................\nAddress: ....................\n..............................\n..............................\nPhone: .................... \"\n\n(e) Notice to Agent. The following form may be known as \"Notice to Agent\" and shall be supplied to an agent appointed under a power of attorney for property.\n\"NOTICE TO AGENT When you accept the authority granted under this power of attorney a special legal relationship, known as agency, is created between you and the principal. Agency imposes upon you duties that continue until you resign or the power of attorney is terminated or revoked.\nAs agent you must:\n(1) do what you know the principal reasonably expects\n\nyou to do with the principal's property;\n\n(2) act in good faith for the best interest of the\n\nprincipal, using due care, competence, and diligence;\n\n(3) keep a complete and detailed record of all\n\nreceipts, disbursements, and significant actions conducted for the principal;\n\n(4) attempt to preserve the principal's estate plan,\n\nto the extent actually known by the agent, if preserving the plan is consistent with the principal's best interest; and\n\n(5) cooperate with a person who has authority to make\n\nhealth care decisions for the principal to carry out the principal's reasonable expectations to the extent actually in the principal's best interest.\n\nAs agent you must not do any of the following:\n(1) act so as to create a conflict of interest that\n\nis inconsistent with the other principles in this Notice to Agent;\n\n(2) do any act beyond the authority granted in this\n\npower of attorney;\n\n(3) commingle the principal's funds with your funds;\n(4) borrow funds or other property from the\n\nprincipal, unless otherwise authorized;\n\n(5) continue acting on behalf of the principal if you\n\nlearn of any event that terminates this power of attorney or your authority under this power of attorney, such as the death of the principal, your legal separation from the principal, or the dissolution of your marriage to the principal.\n\nIf you have special skills or expertise, you must use those special skills and expertise when acting for the principal. You must disclose your identity as an agent whenever you act for the principal by writing or printing the name of the principal and signing your own name \"as Agent\" in the following manner:\n\"(Principal's Name) by (Your Name) as Agent\"\nThe meaning of the powers granted to you is contained in Section 3-4 of the Illinois Power of Attorney Act, which is incorporated by reference into the body of the power of attorney for property document.\nIf you violate your duties as agent or act outside the authority granted to you, you may be liable for any damages, including attorney's fees and costs, caused by your violation.\nIf there is anything about this document or your duties that you do not understand, you should seek legal advice from an attorney.\"\n\n(f) The requirement of the signature of a witness in addition to the principal and the notary, imposed by Public Act 91-790, applies only to instruments executed on or after June 9, 2000 (the effective date of that Public Act).\n(NOTE: This amendatory Act of the 96th General Assembly deletes provisions that referred to the one required witness as an \"additional witness\", and it also provides for the signature of an optional \"second witness\".)\n\n(Source: P.A. 99-143, eff. 7-27-15.)"
+    },
+    {
+      "id": "il-755-ilcs-45-4-10",
+      "jurisdiction": "IL",
+      "title": "Illinois Power of Attorney Act — Statutory Short Form Power of Attorney for Health Care",
+      "statuteReference": "755 ILCS 45/4-10",
+      "sourceUrl": "https://www.ilga.gov/documents/legislation/ilcs/documents/075500450K4-10.htm",
+      "publisher": "Illinois General Assembly",
+      "licenseNote": "U.S. state statute — public domain (Illinois Compiled Statutes)",
+      "verifiedAt": "2026-06-14T00:00:00Z",
+      "text": "755 ILCS 45/4-10\n\n(755 ILCS 45/4-10) (from Ch. 110 1/2, par. 804-10)\n\nSec. 4-10. Statutory short form power of attorney for health care.\n\n(a) The form prescribed in this Section (sometimes also referred to in this Act as the\n\"statutory health care power\") may be used to grant an agent powers with\nrespect to the principal's own health care; but the statutory health care\npower is not intended to be exclusive nor to cover delegation of a parent's\npower to control the health care of a minor child, and no provision of this\nArticle shall be construed to invalidate or bar use by the principal of any\nother or\ndifferent form of power of attorney for health care. Nonstatutory health\ncare powers must be\nexecuted by the principal, designate the agent and the agent's powers, and\ncomply with the limitations in Section 4-5 of this Article, but they need not be witnessed or\nconform in any other respect to the statutory health care power.\nNo specific format is required for the statutory health care power of attorney other than the notice must precede the form. The statutory health care power may be included in or\ncombined with any\nother form of power of attorney governing property or other matters.\n\nThe signature and execution requirements set forth in this Article are satisfied by: (i) written signatures or initials; or (ii) electronic signatures or computer-generated signature codes. Electronic documents under this Act may be created, signed, or revoked electronically using a generic, technology-neutral system in which each user is assigned a unique identifier that is securely maintained and in a manner that meets the regulatory requirements for a digital or electronic signature. Compliance with the standards defined in the Uniform Electronic Transactions Act or the implementing rules of the Hospital Licensing Act for medical record entry authentication for author validation of the documentation, content accuracy, and completeness meets this standard.\n(b) The Illinois Statutory Short Form Power of Attorney for Health Care shall be substantially as follows:\nNOTICE TO THE INDIVIDUAL SIGNING THE POWER OF ATTORNEY FOR HEALTH CARE No one can predict when a serious illness or accident might occur. When it does, you may need someone else to speak or make health care decisions for you. If you plan now, you can increase the chances that the medical treatment you get will be the treatment you want.\nIn Illinois, you can choose someone to be your \"health care agent\". Your agent is the person you trust to make health care decisions for you if you are unable or do not want to make them yourself. These decisions should be based on your personal values and wishes.\nIt is important to put your choice of agent in writing. The written form is often called an \"advance directive\". You may use this form or another form, as long as it meets the legal requirements of Illinois. There are many written and online resources to guide you and your loved ones in having a conversation about these issues. You may find it helpful to look at these resources while thinking about and discussing your advance directive.\nWHAT ARE THE THINGS I WANT MY HEALTH CARE AGENT TO KNOW? The selection of your agent should be considered carefully, as your agent will have the ultimate decision-making authority once this document goes into effect, in most instances after you are no longer able to make your own decisions. While the goal is for your agent to make decisions in keeping with your preferences and in the majority of circumstances that is what happens, please know that the law does allow your agent to make decisions to direct or refuse health care interventions or withdraw treatment. Your agent will need to think about conversations you have had, your personality, and how you handled important health care issues in the past. Therefore, it is important to talk with your agent and your family about such things as:\n(i) What is most important to you in your life?\n(ii) How important is it to you to avoid pain and\n\nsuffering?\n\n(iii) If you had to choose, is it more important to\n\nyou to live as long as possible, or to avoid prolonged suffering or disability?\n\n(iv) Would you rather be at home or in a hospital for\n\nthe last days or weeks of your life?\n\n(v) Do you have religious, spiritual, or cultural\n\nbeliefs that you want your agent and others to consider?\n\n(vi) Do you wish to make a significant contribution\n\nto medical science after your death through organ or whole body donation?\n\n(vii) Do you have an existing advance directive, such\n\nas a living will, that contains your specific wishes about health care that is only delaying your death? If you have another advance directive, make sure to discuss with your agent the directive and the treatment decisions contained within that outline your preferences. Make sure that your agent agrees to honor the wishes expressed in your advance directive.\n\nWHAT KIND OF DECISIONS CAN MY AGENT MAKE? If there is ever a period of time when your physician determines that you cannot make your own health care decisions, or if you do not want to make your own decisions, some of the decisions your agent could make are to:\n(i) talk with physicians and other health care\n\nproviders about your condition.\n\n(ii) see medical records and approve who else can see\n\nthem.\n\n(iii) give permission for medical tests, medicines,\n\nsurgery, or other treatments.\n\n(iv) choose where you receive care and which\n\nphysicians and others provide it.\n\n(v) decide to accept, withdraw, or decline treatments\n\ndesigned to keep you alive if you are near death or not likely to recover. You may choose to include guidelines and/or restrictions to your agent's authority.\n\n(vi) agree or decline to donate your organs or your\n\nwhole body if you have not already made this decision yourself. This could include donation for transplant, research, and/or education. You should let your agent know whether you are registered as a donor in the First Person Consent registry maintained by the Illinois Secretary of State or whether you have agreed to donate your whole body for medical research and/or education.\n\n(vii) decide what to do with your remains after you\n\nhave died, if you have not already made plans.\n\n(viii) talk with your other loved ones to help come\n\nto a decision (but your designated agent will have the final say over your other loved ones).\n\nYour agent is not automatically responsible for your health care expenses.\nWHOM SHOULD I CHOOSE TO BE MY HEALTH CARE AGENT? You can pick a family member, but you do not have to. Your agent will have the responsibility to make medical treatment decisions, even if other people close to you might urge a different decision. The selection of your agent should be done carefully, as he or she will have ultimate decision-making authority for your treatment decisions once you are no longer able to voice your preferences. Choose a family member, friend, or other person who:\n(i) is at least 18 years old;\n(ii) knows you well;\n(iii) you trust to do what is best for you and is\n\nwilling to carry out your wishes, even if he or she may not agree with your wishes;\n\n(iv) would be comfortable talking with and\n\nquestioning your physicians and other health care providers;\n\n(v) would not be too upset to carry out your wishes\n\nif you became very sick; and\n\n(vi) can be there for you when you need it and is\n\nwilling to accept this important role.\n\nWHAT IF MY AGENT IS NOT AVAILABLE OR IS UNWILLING TO MAKE DECISIONS FOR ME? If the person who is your first choice is unable to carry out this role, then the second agent you chose will make the decisions; if your second agent is not available, then the third agent you chose will make the decisions. The second and third agents are called your successor agents and they function as back-up agents to your first choice agent and may act only one at a time and in the order you list them.\nWHAT WILL HAPPEN IF I DO NOT CHOOSE A HEALTH CARE AGENT? If you become unable to make your own health care decisions and have not named an agent in writing, your physician and other health care providers will ask a family member, friend, or guardian to make decisions for you. In Illinois, a law directs which of these individuals will be consulted. In that law, each of these individuals is called a \"surrogate\".\nThere are reasons why you may want to name an agent rather than rely on a surrogate:\n(i) The person or people listed by this law may not\n\nbe who you would want to make decisions for you.\n\n(ii) Some family members or friends might not be able\n\nor willing to make decisions as you would want them to.\n\n(iii) Family members and friends may disagree with\n\none another about the best decisions.\n\n(iv) Under some circumstances, a surrogate may not be\n\nable to make the same kinds of decisions that an agent can make.\n\nWHAT IF THERE IS NO ONE AVAILABLE WHOM I TRUST TO BE MY AGENT? In this situation, it is especially important to talk to your physician and other health care providers and create written guidance about what you want or do not want, in case you are ever critically ill and cannot express your own wishes. You can complete a living will. You can also write your wishes down and/or discuss them with your physician or other health care provider and ask him or her to write it down in your chart. You might also want to use written or online resources to guide you through this process.\nWHAT DO I DO WITH THIS FORM ONCE I COMPLETE IT? Follow these instructions after you have completed the form:\n(i) Sign the form in front of a witness. See the\n\nform for a list of who can and cannot witness it.\n\n(ii) Ask the witness to sign it, too.\n(iii) There is no need to have the form notarized.\n(iv) Give a copy to your agent and to each of your\n\nsuccessor agents.\n\n(v) Give another copy to your physician.\n(vi) Take a copy with you when you go to the hospital.\n(vii) Show it to your family and friends and others\n\nwho care for you.\n\nWHAT IF I CHANGE MY MIND? You may change your mind at any time. If you do, tell someone who is at least 18 years old that you have changed your mind, and/or destroy your document and any copies. If you wish, fill out a new form and make sure everyone you gave the old form to has a copy of the new one, including, but not limited to, your agents and your physicians. If you are concerned you may revoke your power of attorney at a time when you may need it the most, you may initial the box at the end of the form to indicate that you would like a 30-day waiting period after you voice your intent to revoke your power of attorney. This means if your agent is making decisions for you during that time, your agent can continue to make decisions on your behalf. This election is purely optional, and you do not have to choose it. If you do not choose this option, you can change your mind and revoke the power of attorney at any time.\nWHAT IF I DO NOT WANT TO USE THIS FORM? In the event you do not want to use the Illinois statutory form provided here, any document you complete must be executed by you, designate an agent who is over 18 years of age and not prohibited from serving as your agent, and state the agent's powers, but it need not be witnessed or conform in any other respect to the statutory health care power.\nIf you have questions about the use of any form, you may want to consult your physician, other health care provider, and/or an attorney.\nMY POWER OF ATTORNEY FOR HEALTH CARE\nTHIS POWER OF ATTORNEY REVOKES ALL PREVIOUS POWERS OF ATTORNEY FOR HEALTH CARE. (You must sign this form and a witness must also sign it before it is valid)\n\nMy name (Print your full name): . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .\nMy address: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .\n\nI WANT THE FOLLOWING PERSON TO BE MY HEALTH CARE AGENT\n(an agent is your personal representative under state and federal law):\n(Agent name) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .\n(Agent address) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .\n(Agent phone number) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .\n\n(Please check box if applicable) .... If a guardian of my person is to be appointed, I nominate the agent acting under this power of attorney as guardian.\n\nSUCCESSOR HEALTH CARE AGENT(S) (optional):\nIf the agent I selected is unable or does not want to make health care decisions for me, then I request the person(s) I name below to be my successor health care agent(s). Only one person at a time can serve as my agent (add another page if you want to add more successor agent names):\n. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .\n(Successor agent #1 name, address and phone number)\n. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .\n(Successor agent #2 name, address and phone number)\n\nMY AGENT CAN MAKE HEALTH CARE DECISIONS FOR ME, INCLUDING:\n(i) Deciding to accept, withdraw, or decline\n\ntreatment for any physical or mental condition of mine, including life-and-death decisions.\n\n(ii) Agreeing to admit me to or discharge me from any\n\nhospital, home, or other institution, including a mental health facility.\n\n(iii) Having complete access to my medical and mental\n\nhealth records, and sharing them with others as needed, including after I die.\n\n(iv) Carrying out the plans I have already made, or,\n\nif I have not done so, making decisions about my body or remains, including organ, tissue or whole body donation, autopsy, cremation, and burial.\n\nThe above grant of power is intended to be as broad as possible so that my agent will have the authority to make any decision I could make to obtain or terminate any type of health care, including withdrawal of nutrition and hydration and other life-sustaining measures.\n\nI AUTHORIZE MY AGENT TO (please check any one box):\n.... Make decisions for me only when I cannot make them\n\nfor myself. The physician(s) taking care of me will determine when I lack this ability.\n\n(If no box is checked, then the box above shall be\n\nimplemented.) OR\n\n.... Make decisions for me only when I cannot make them\n\nfor myself. The physician(s) taking care of me will determine when I lack this ability. Starting now, for the purpose of assisting me with my health care plans and decisions, my agent shall have complete access to my medical and mental health records, the authority to share them with others as needed, and the complete ability to communicate with my personal physician(s) and other health care providers, including the ability to require an opinion of my physician as to whether I lack the ability to make decisions for myself. OR\n\n.... Make decisions for me starting now and continuing\n\nafter I am no longer able to make them for myself. While I am still able to make my own decisions, I can still do so if I want to.\n\nThe subject of life-sustaining treatment is of particular importance. Life-sustaining treatments may include tube feedings or fluids through a tube, breathing machines, and CPR. In general, in making decisions concerning life-sustaining treatment, your agent is instructed to consider the relief of suffering, the quality as well as the possible extension of your life, and your previously expressed wishes. Your agent will weigh the burdens versus benefits of proposed treatments in making decisions on your behalf.\nAdditional statements concerning the withholding or removal of life-sustaining treatment are described below. These can serve as a guide for your agent when making decisions for you. Ask your physician or health care provider if you have any questions about these statements.\n\nSELECT ONLY ONE STATEMENT BELOW THAT BEST EXPRESSES YOUR WISHES (optional):\n.... The quality of my life is more important than the\n\nlength of my life. If I am unconscious and my attending physician believes, in accordance with reasonable medical standards, that I will not wake up or recover my ability to think, communicate with my family and friends, and experience my surroundings, I do not want treatments to prolong my life or delay my death, but I do want treatment or care to make me comfortable and to relieve me of pain.\n\n.... Staying alive is more important to me, no matter how\n\nsick I am, how much I am suffering, the cost of the procedures, or how unlikely my chances for recovery are. I want my life to be prolonged to the greatest extent possible in accordance with reasonable medical standards.\n\nSPECIFIC LIMITATIONS TO MY AGENT'S DECISION-MAKING AUTHORITY:\nThe above grant of power is intended to be as broad as possible so that your agent will have the authority to make any decision you could make to obtain or terminate any type of health care. If you wish to limit the scope of your agent's powers or prescribe special rules or limit the power to authorize autopsy or dispose of remains, you may do so specifically in this form.\n. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .\n. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .\n\nMy signature: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .\nToday's date: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .\nDELAYED REVOCATION .... I elect to delay revocation of this power of attorney for 30 days after I communicate my intent to revoke it.\n.... I elect for the revocation of this power of attorney to take effect immediately if I communicate my intent to revoke it.\n\nHAVE YOUR WITNESS AGREE TO WHAT IS WRITTEN BELOW, AND THEN COMPLETE THE SIGNATURE PORTION:\nI am at least 18 years old. (check one of the options below):\n.... I saw the principal sign this document, or\n.... the principal told me that the signature or mark on\n\nthe principal signature line is his or hers.\n\nI am not the agent or successor agent(s) named in this document. I am not related to the principal, the agent, or the successor agent(s) by blood, marriage, or adoption. I am not the principal's physician, advanced practice registered nurse, dentist, podiatric physician, optometrist, psychologist, or a relative of one of those individuals. I am not an owner or operator (or the relative of an owner or operator) of the health care facility where the principal is a patient or resident.\nWitness printed name: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .\nWitness address: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .\nWitness signature: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .\nToday's date: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .\n\n(c) The statutory short form power of attorney for health care (the\n\"statutory health care power\") authorizes the agent to make any and all\nhealth care decisions on behalf of the principal which the principal could\nmake if present and under no disability, subject to any limitations on the\ngranted powers that appear on the face of the form, to be exercised in such\nmanner as the agent deems consistent with the intent and desires of the\nprincipal. The agent will be under no duty to exercise granted powers or\nto assume control of or responsibility for the principal's health care;\nbut when granted powers are exercised, the agent will be required to use\ndue care to act for the benefit of the principal in accordance with the\nterms of the statutory health care power and will be liable\nfor negligent exercise. The agent may act in person or through others\nreasonably employed by the agent for that purpose\nbut may not delegate authority to make health care decisions. The agent\nmay sign and deliver all instruments, negotiate and enter into all\nagreements, and do all other acts reasonably necessary to implement the\nexercise of the powers granted to the agent. Without limiting the\ngenerality of the foregoing, the statutory health care power shall include\nthe following powers, subject to any limitations appearing on the face of the form:\n\n(1) The agent is authorized to give consent to and\n\nauthorize or refuse, or to withhold or withdraw consent to, any and all types of medical care, treatment, or procedures relating to the physical or mental health of the principal, including any medication program, surgical procedures, life-sustaining treatment, or provision of food and fluids for the principal.\n\n(2) The agent is authorized to admit the principal to\n\nor discharge the principal from any and all types of hospitals, institutions, homes, residential or nursing facilities, treatment centers, and other health care institutions providing personal care or treatment for any type of physical or mental condition. The agent shall have the same right to visit the principal in the hospital or other institution as is granted to a spouse or adult child of the principal, any rule of the institution to the contrary notwithstanding.\n\n(3) The agent is authorized to contract for any and\n\nall types of health care services and facilities in the name of and on behalf of the principal and to bind the principal to pay for all such services and facilities, and to have and exercise those powers over the principal's property as are authorized under the statutory property power, to the extent the agent deems necessary to pay health care costs; and the agent shall not be personally liable for any services or care contracted for on behalf of the principal.\n\n(4) At the principal's expense and subject to\n\nreasonable rules of the health care provider to prevent disruption of the principal's health care, the agent shall have the same right the principal has to examine and copy and consent to disclosure of all the principal's medical records that the agent deems relevant to the exercise of the agent's powers, whether the records relate to mental health or any other medical condition and whether they are in the possession of or maintained by any physician, psychiatrist, psychologist, therapist, hospital, nursing home, or other health care provider. The authority under this paragraph (4) applies to any information governed by the Health Insurance Portability and Accountability Act of 1996 (\"HIPAA\") and regulations thereunder. The agent serves as the principal's personal representative, as that term is defined under HIPAA and regulations thereunder.\n\n(5) The agent is authorized: to direct that an\n\nautopsy be made pursuant to Section 2 of the Autopsy Act; to make a disposition of any part or all of the principal's body pursuant to the Illinois Anatomical Gift Act, as now or hereafter amended; and to direct the disposition of the principal's remains.\n\n(6) At any time during which there is no executor or\n\nadministrator appointed for the principal's estate, the agent is authorized to continue to pursue an application or appeal for government benefits if those benefits were applied for during the life of the principal.\n\n(d) A physician may determine that the principal is unable to make health care decisions for himself or herself only if the principal lacks decisional capacity, as that term is defined in Section 10 of the Health Care Surrogate Act.\n(e) If the principal names the agent as a guardian on the statutory short form, and if a court decides that the appointment of a guardian will serve the principal's best interests and welfare, the court shall appoint the agent to serve without bond or security.\n(f) If the agent presents the statutory short form electronically, an attending physician, emergency medical services personnel as defined by Section 3.5 of the Emergency Medical Services (EMS) Systems Act, or health care provider shall not refuse to give effect to a health care agency if the agent presents an electronic device displaying an electronic copy of an executed form as proof of the health care agency. Any person or entity that provides a statutory short form to the public shall post for a period of 2 years information on its website regarding the changes made by this amendatory Act of the 102nd General Assembly.\n(Source: P.A. 101-81, eff. 7-12-19; 101-163, eff. 1-1-20; 102-38, eff. 6-25-21; 102-181, eff. 7-30-21; 102-794, eff. 1-1-23; 102-813, eff. 5-13-22 .)"
+    },
+    {
+      "id": "md-hg-5-603",
+      "jurisdiction": "MD",
+      "title": "Maryland Health-General — Advance Directive Statutory Form",
+      "statuteReference": "Md. Code, Health-General § 5-603",
+      "sourceUrl": "https://mgaleg.maryland.gov/mgawebsite/Laws/StatuteText?article=ghg&section=5-603&enactments=false",
+      "publisher": "Maryland General Assembly (Department of Legislative Services)",
+      "licenseNote": "U.S. state statute — public domain (Annotated Code of Maryland)",
+      "verifiedAt": "2026-06-14T00:00:00Z",
+      "text": "§5–603.\n\nMaryland Advance Directive:\n\nPlanning for Future Health Care Decisions\n\nBy: Date of Birth: _________________________\n(Print Name) (Month/Day/Year)\n\nUsing this advance directive form to do health care planning is completely optional. Other forms are also valid in Maryland. No matter what form you use, talk to your family and others close to you about your wishes.\n\nThis form has two parts to state your wishes, and a third part for needed signatures. Part I of this form lets you answer this question: If you cannot (or do not want to) make your own health care decisions, who do you want to make them for you? The person you pick is called your health care agent. Make sure you talk to your health care agent (and any back–up agents) about this important role. Part II lets you write your preferences about efforts to extend your life in three situations: terminal condition, persistent vegetative state, and end–stage condition. In addition to your health care planning decisions, you can choose to become an organ donor after your death by filling out the form for that too.\n\nYou can fill out Parts I and II of this form, or only Part I, or only Part II. Use the form to reflect your wishes, then sign in front of two witnesses (Part III). If your wishes change, make a new advance directive.\n\nMake sure you give a copy of the completed form to your health care agent, your doctor, and others who might need it. Keep a copy at home in a place where someone can get it if needed. Review what you have written periodically.\n\nPART I: SELECTION OF HEALTH CARE AGENT\n\nA. Selection of Primary Agent\n\nI select the following individual as my agent to make health care decisions for me:\n\nName:\nAddress:\n\nTelephone Numbers:\n(home and cell)\n\nB. Selection of Back–up Agents\n(Optional; form valid if left blank)\n\n1. If my primary agent cannot be contacted in time or for any reason is unavailable or unable or unwilling to act as my agent, then I select the following person to act in this capacity:\n\nName: _________________________________________________________________________\nAddress: _______________________________________________________________________\n________________________________________________________________________________\nTelephone Numbers:_____________________________________________________________\n(home and cell)\n\n2. If my primary agent and my first back–up agent cannot be contacted in time or for any reason are unavailable or unable or unwilling to act as my agent, then I select the following person to act in this capacity:\n\nName: _________________________________________________________________________\nAddress: _______________________________________________________________________\n________________________________________________________________________________\nTelephone Numbers:_____________________________________________________________\n(home and cell)\n\nC. Powers and Rights of Health Care Agent\n\nI want my agent to have full power to make health care decisions for me, including the power to:\n\n1. Consent or not consent to medical procedures and treatments which my doctors offer, including things that are intended to keep me alive, like ventilators and feeding tubes;\n\n2. Decide who my doctor and other health care providers should be; and\n\n3. Decide where I should be treated, including whether I should be in a hospital, nursing home, other medical care facility, or hospice program.\n\nI also want my agent to:\n\n1. Ride with me in an ambulance if ever I need to be rushed to the hospital; and\n\n2. Be able to visit me if I am in a hospital or any other health care facility.\n\nThis advance directive does not make my agent responsible for any of the costs of my care.\n\nThis power is subject to the following conditions or limitations:\n(Optional; form valid if left blank)\n________________________________________________________________________________\n________________________________________________________________________________\n________________________________________________________________________________\n________________________________________________________________________________\n________________________________________________________________________________\n\nD. How My Agent Is to Decide Specific Issues\n\nI trust my agent’s judgment. My agent should look first to see if there is anything in Part II of this advance directive that helps decide the issue. Then, my agent should think about the conversations we have had, my religious or other beliefs and values, my personality, and how I handled medical and other important issues in the past. If what I would decide is still unclear, then my agent is to make decisions for me that my agent believes are in my best interest. In doing so, my agent should consider the benefits, burdens, and risks of the choices presented by my doctors.\n\nE. People My Agent Should Consult\n(Optional; form valid if left blank)\n\nIn making important decisions on my behalf, I encourage my agent to consult with the following people. By filling this in, I do not intend to limit the number of people with whom my agent might want to consult or my agent’s power to make these decisions.\n\nName(s) Telephone Number(s)\n_____________________________________ ________________________________________\n_____________________________________ ________________________________________\n_____________________________________ ________________________________________\n_____________________________________ ________________________________________\n_____________________________________ ________________________________________\n_____________________________________ ________________________________________\n\nF. In Case of Pregnancy\n(Optional, for women of child–bearing years only; form valid if\nleft blank)\n\nIf I am pregnant, my agent shall follow these specific instructions:\n________________________________________________________________________________\n________________________________________________________________________________\n________________________________________________________________________________\n\nG. Access to My Health Information – Federal Privacy Law (HIPAA)\nAuthorization\n\n1. If, prior to the time the person selected as my agent has power to act under this document, my doctor wants to discuss with that person my capacity to make my own health care decisions, I authorize my doctor to disclose protected health information which relates to that issue.\n\n2. Once my agent has full power to act under this document, my agent may request, receive, and review any information, oral or written, regarding my physical or mental health, including, but not limited to, medical and hospital records and other protected health information, and consent to disclosure of this information.\n\n3. For all purposes related to this document, my agent is my personal representative under the Health Insurance Portability and Accountability Act (HIPAA). My agent may sign, as my personal representative, any release forms or other HIPAA–related materials.\n\nH. Effectiveness of This Part\n(Read both of these statements carefully. Then, initial one only.)\n\nMy agent’s power is in effect:\n\n1. Immediately after I sign this document, subject to my right to make any decision about my health care if I want and am able to.\n\n_____\n\n((or))\n\n2. Whenever I am not able to make informed decisions about my health care, either because the doctor in charge of my care (attending physician) decides that I have lost this ability temporarily, or my attending physician and a consulting doctor agree that I have lost this ability permanently.\n\n_____\n\nIf the only thing you want to do is select a health care agent, skip Part II. Go to Part III to sign and have the advance directive witnessed. If you also want to write your treatment preferences, use Part II. Also consider becoming an organ donor, using the separate form for that.\n\nPART II: TREATMENT PREFERENCES (“LIVING WILL”)\n\nA. Statement of Goals and Values\n(Optional; form valid if left blank)\n\nI want to say something about my goals and values, and especially what’s most important to me during the last part of my life:\n________________________________________________________________________________\n________________________________________________________________________________\n________________________________________________________________________________\n________________________________________________________________________________\n________________________________________________________________________________\n________________________________________________________________________________\n\nB. Preference in Case of Terminal Condition\n(If you want to state your preference, initial one only. If you do not want to state a preference here, cross through the whole section.)\n\nIf my doctors certify that my death from a terminal condition is imminent, even if life–sustaining procedures are used:\n\n1. Keep me comfortable and allow natural death to occur. I do not want any medical interventions used to try to extend my life. I do not want to receive nutrition and fluids by tube or other medical means.\n\n_____\n\n((or))\n\n2. Keep me comfortable and allow natural death to occur. I do not want medical interventions used to try to extend my life. If I am unable to take enough nourishment by mouth, however, I want to receive nutrition and fluids by tube or other medical means.\n\n_____\n\n((or))\n\n3. Try to extend my life for as long as possible, using all available interventions that in reasonable medical judgment would prevent or delay my death. If I am unable to take enough nourishment by mouth, I want to receive nutrition and fluids by tube or other medical means.\n\n_____\n\nC. Preference in Case of Persistent Vegetative State\n(If you want to state your preference, initial one only. If you do not want to state a preference here, cross through the whole section.)\n\nIf my doctors certify that I am in a persistent vegetative state, that is, if I am not conscious and am not aware of myself or my environment or able to interact with others, and there is no reasonable expectation that I will ever regain consciousness:\n\n1. Keep me comfortable and allow natural death to occur. I do not want any medical interventions used to try to extend my life. I do not want to receive nutrition and fluids by tube or other medical means.\n\n_____\n\n((or))\n\n2. Keep me comfortable and allow natural death to occur. I do not want medical interventions used to try to extend my life. If I am unable to take enough nourishment by mouth, however, I want to receive nutrition and fluids by tube or other medical means.\n\n_____\n\n((or))\n\n3. Try to extend my life for as long as possible, using all available interventions that in reasonable medical judgment would prevent or delay my death. If I am unable to take enough nourishment by mouth, I want to receive nutrition and fluids by tube or other medical means.\n\n_____\n\nD. Preference in Case of End–Stage Condition\n(If you want to state your preference, initial one only. If you do not want to state a preference here, cross through the whole section.)\n\nIf my doctors certify that I am in an end–stage condition, that is, an incurable condition that will continue in its course until death and that has already resulted in loss of capacity and complete physical dependency:\n\n1. Keep me comfortable and allow natural death to occur. I do not want any medical interventions used to try to extend my life. I do not want to receive nutrition and fluids by tube or other medical means.\n\n_____\n\n((or))\n\n2. Keep me comfortable and allow natural death to occur. I do not want medical interventions used to try to extend my life. If I am unable to take enough nourishment by mouth, however, I want to receive nutrition and fluids by tube or other medical means.\n\n_____\n\n((or))\n\n3. Try to extend my life for as long as possible, using all available interventions that in reasonable medical judgment would prevent or delay my death. If I am unable to take enough nourishment by mouth, I want to receive nutrition and fluids by tube or other medical means.\n\n_____\n\nE. Pain Relief\n\nNo matter what my condition, give me the medicine or other treatment I need to relieve pain.\n\n_____\n\nF. In Case of Pregnancy\n(Optional, for women of child–bearing years only; form valid if left blank)\n\nIf I am pregnant, my decision concerning life–sustaining procedures shall be modified as follows:\n________________________________________________________________________________\n________________________________________________________________________________\n________________________________________________________________________________\n________________________________________________________________________________\n\nG. Effect of Stated Preferences\n(Read both of these statements carefully. Then, initial one only.)\n\n1. I realize I cannot foresee everything that might happen after I can no longer decide for myself. My stated preferences are meant to guide whoever is making decisions on my behalf and my health care providers, but I authorize them to be flexible in applying these statements if they feel that doing so would be in my best interest.\n\n_____\n\n((or))\n\n2. I realize I cannot foresee everything that might happen after I can no longer decide for myself. Still, I want whoever is making decisions on my behalf and my health care providers to follow my stated preferences exactly as written, even if they think that some alternative is better.\n\n_____\n\nPART III: SIGNATURE AND WITNESSES\n\nBy signing below as the Declarant, I indicate that I am emotionally and mentally competent to make this advance directive and that I understand its purpose and effect. I also understand that this document replaces any similar advance directive I may have completed before this date.\n\n____________________________________________ _________________________________\n(Signature of Declarant) (Date)\n\nThe Declarant signed or acknowledged signing this document in my presence and, based upon personal observation, appears to be emotionally and mentally competent to make this advance directive.\n\n____________________________________________ _________________________________\n(Signature of Witness) (Date)\n____________________________________________\nTelephone Number(s)\n_____________________________________________ ________________________________\n(Signature of Witness) (Date)\n_____________________________________________\nTelephone Number(s)\n\n(Note: Anyone selected as a health care agent in Part I may not be a witness. Also, at least one of the witnesses must be someone who will not knowingly inherit anything from the Declarant or otherwise knowingly gain a financial benefit from the Declarant’s death. Maryland law does not require this document to be notarized.)\n\nAFTER MY DEATH\n\n(This form is optional. Fill out only what reflects your wishes.)\n\nBy:________________________________________ Date of Birth:_______________________\n(Print Name) (Month/Day/Year)\n\nPART I: ORGAN DONATION\n\n(Initial the ones that you want.)\n\nUpon my death I wish to donate:\n\nAny needed organs, tissues, or eyes. _____\n\nOnly the following organs, tissues, or eyes: _____\n\n________________________________________________________________________________\n\n________________________________________________________________________________\n\n________________________________________________________________________________\n\n________________________________________________________________________________\n\nI authorize the use of my organs, tissues, or eyes:\n\nFor transplantation _____\n\nFor therapy _____\n\nFor research _____\n\nFor medical education _____\n\nFor any purpose authorized by law _____\n\nI understand that no vital organ, tissue, or eye may be removed for transplantation until after I have been pronounced dead under legal standards. This document is not intended to change anything about my health care while I am still alive. After death, I authorize any appropriate support measures to maintain the viability for transplantation of my organs, tissues, and eyes until organ, tissue, and eye recovery has been completed. I understand that my estate will not be charged for any costs related to this donation.\n\nPART II: DONATION OF BODY\n\nAfter any organ donation indicated in Part I, I wish my body to be donated for use in a medical study program.\n\n_____\n\nPART III: DISPOSITION OF BODY AND FUNERAL ARRANGEMENTS\n\nI want the following person to make decisions about the disposition of my body and my funeral arrangements:\n\n(Either initial the first or fill in the second.)\n\nThe health care agent who I named in my advance directive. _____\n\n((or))\n\nThis person:\n\nName: _________________________________________________________________________\n\nAddress: _______________________________________________________________________\n\n________________________________________________________________________________\n\n________________________________________________________________________________\n\nTelephone Numbers:_____________________________________________________________\n\n(home and cell)\n\nIf I have written my wishes below, they should be followed. If not, the person I have named should decide based on conversations we have had, my religious or other beliefs and values, my personality, and how I reacted to other peoples’ funeral arrangements. My wishes about the disposition of my body and my funeral arrangements are:\n\n________________________________________________________________________________\n\n________________________________________________________________________________\n\n________________________________________________________________________________\n\n________________________________________________________________________________\n\n________________________________________________________________________________\n\nPART IV: SIGNATURE AND WITNESSES\n\nBy signing below, I indicate that I am emotionally and mentally competent to make this donation and that I understand the purpose and effect of this document.\n\n_________________________________ ________________________________\n(Signature of Donor) (Date)\n\nThe Donor signed or acknowledged signing this donation document in my presence and, based upon personal observation, appears to be emotionally and mentally competent to make this donation.\n\n_________________________________ ________________________________\n(Signature of Witness) (Date)\n\n_________________________________\nTelephone Number(s)\n\n_________________________________ ________________________________\n(Signature of Witness) (Date)\n\n_________________________________\nTelephone Number(s)"
+    },
+    {
+      "id": "mn-507-071",
+      "jurisdiction": "MN",
+      "title": "Minnesota Statutes — Transfer on Death Deeds",
+      "statuteReference": "Minn. Stat. § 507.071",
+      "sourceUrl": "https://www.revisor.mn.gov/statutes/cite/507.071",
+      "publisher": "Minnesota Office of the Revisor of Statutes",
+      "licenseNote": "U.S. state statute — public domain (Minnesota Statutes)",
+      "verifiedAt": "2026-06-14T00:00:00Z",
+      "text": "507.071 TRANSFER ON DEATH DEEDS.\n\n§\nSubdivision 1. Definitions.\nFor the purposes of this section the following terms have the meanings given:\n\n(a) \"Beneficiary\" or \"grantee beneficiary\" means a person or entity named as a grantee beneficiary in a transfer on death deed, including a successor grantee beneficiary.\n\n(b) \"County agency\" means the county department or office designated to recover medical assistance benefits from the estates of decedents.\n\n(c) \"Grantor owner\" means an owner, whether individually, as a joint tenant, or as a tenant in common, named as a grantor in a transfer on death deed upon whose death the conveyance or transfer of the described real property is conditioned. Grantor owner does not include a spouse who joins in a transfer on death deed solely for the purpose of conveying or releasing statutory or other marital interests in the real property to be conveyed or transferred by the transfer on death deed.\n\n(d) \"Owner\" means a person having an ownership or other interest in all or part of the real property to be conveyed or transferred by a transfer on death deed either at the time the deed is executed or at the time the transfer becomes effective. Owner does not include a spouse who joins in a transfer on death deed solely for the purpose of conveying or releasing statutory or other marital interests in the real property to be conveyed or transferred by the transfer on death deed.\n\n(e) \"Property\" and \"interest in real property\" mean any interest in real property located in this state which is transferable on the death of the owner and includes, without limitation, an interest in real property defined in chapter 500, a mortgage, a deed of trust, a security interest in, or a security pledge of, an interest in real property, including the rights to payments of the indebtedness secured by the security instrument, a judgment, a tax lien, both the seller's and purchaser's interest in a contract for deed, land contract, purchase agreement, or earnest money contract for the sale and purchase of real property, including the rights to payments under such contracts, or any other lien on, or interest in, real property.\n\n(f) \"Recorded\" means recorded in the office of the county recorder or registrar of titles, as appropriate for the real property described in the instrument to be recorded.\n\n(g) \"State agency\" means the Department of Human Services or any successor agency or Direct Care and Treatment or any successor agency.\n\n(h) \"Transfer on death deed\" means a deed authorized under this section.\n\n§\nSubd. 2. Effect of transfer on death deed.\nA deed that conveys or assigns an interest in real property, to a grantee beneficiary and that expressly states that the deed is only effective on the death of one or more of the grantor owners, transfers the interest to the grantee beneficiary upon the death of the grantor owner upon whose death the conveyance or transfer is stated to be effective, but subject to the survivorship provisions and requirements of section 524.2-702 . Until a transfer on death deed becomes effective, it has no effect on title to the real property described in the deed, but it does create an insurable interest in the real property in favor of the designated grantee beneficiary or beneficiaries for purposes of insuring the real property against loss or damage that occurs on or after the transfer on death deed becomes effective. A transfer on death deed must comply with all provisions of Minnesota law applicable to deeds of real property including, but not limited to, the provisions of sections 507.02 , 507.24 , 507.34 , 508.48 , and 508A.48 . If a spouse who is neither a grantor owner nor an owner joins in the execution of, or consents in writing to, the transfer on death deed, such joinder or consent shall be conclusive proof that upon the transfer becoming effective, the spouse no longer has or can claim any statutory interest or other marital interest in the interest in real property transferred by the transfer on death deed. However, such transfer shall remain an interest as identified in section 256B.15 for purposes of complying with and satisfying any claim or lien as authorized by subdivision 3.\n\n§\nSubd. 3. Rights of creditors and rights of state and county under sections 246.53 , 256B.15 , 256D.16 , 261.04 , and 514.981 .\nThe interest transferred to a beneficiary under a transfer on death deed after the death of a grantor owner is transferred subject to all effective conveyances, assignments, contracts, mortgages, deeds of trust, liens, security pledges, judgments, tax liens, and any other matters or encumbrances to which the interest was subject on the date of death of the grantor owner, upon whose death the transfer becomes effective including, but not limited to, any claim by a surviving spouse who did not join in the execution of, or consent in writing to, the transfer on death deed, and any claim or lien by the state or county agency authorized by sections 246.53 , 256B.15 , 256D.16 , 261.04 , and 514.981 , if other assets of the deceased grantor's estate are insufficient to pay the amount of any such claim. A beneficiary to whom the interest is transferred after the death of a grantor owner shall be liable to account to the state or county agency with a claim or lien authorized by section 246.53 , 256B.15 , 256D.16 , 261.04 , or 514.981 , to the extent necessary to discharge any such claim remaining unpaid after application of the assets of the deceased grantor owner's estate, but such liability shall be limited to the value of the interest transferred to the beneficiary. To establish compliance with this subdivision and subdivision 23, the beneficiary must record a clearance certificate issued in accordance with subdivision 23 in each county in which the real property described in the transfer on death deed is located.\n\n§\nSubd. 4. Multiple grantee beneficiaries.\nA transfer on death deed may designate multiple grantee beneficiaries to take title as joint tenants, as tenants in common or in any other form of ownership or tenancy that is valid under the laws of this state. If a grantee joint tenant dies before the grantor owner upon whose death the transfer occurs and no successor beneficiary for the deceased grantee is designated in the transfer on death deed, the surviving joint tenants are the successors and no interest lapses.\n\n§\nSubd. 5. Successor grantee beneficiaries.\nA transfer on death deed may designate one or more successor grantee beneficiaries or a class of successor grantee beneficiaries, or both. If the transfer on death deed designates successor grantee beneficiaries or a class of successor grantee beneficiaries, the deed shall state the condition under which the interest of the successor grantee beneficiaries would vest.\n\n§\nSubd. 6. Multiple joint tenant grantors.\nIf an interest in real property is owned as joint tenants, a transfer on death deed executed by all of the owners and, if required by section 507.02 , their respective spouses, if any, that conveys an interest in real property to one or more grantee beneficiaries transfers the interest to the grantee beneficiary or beneficiaries effective only after the death of the last surviving grantor owner. If the last surviving joint tenant owner did not execute the transfer on death deed, the deed is ineffective to transfer any interest and the deed is void. An estate in joint tenancy is not severed or affected by the subsequent execution of a transfer on death deed and the right of a surviving joint tenant owner who did not execute the transfer on death deed shall prevail over a grantee beneficiary named in a transfer on death deed unless the deed specifically states that it severs the joint tenancy ownership.\n\n§\nSubd. 7. Execution by attorney-in-fact.\nA transfer on death deed may be executed by a duly appointed attorney-in-fact pursuant to a power of attorney which grants the attorney-in-fact the authority to execute deeds.\n\n§\nSubd. 8. Recording requirements and authorization.\nA transfer on death deed is valid if the deed is recorded in a county in which at least a part of the real property described in the deed is located and is recorded before the death of the grantor owner upon whose death the conveyance or transfer is effective. Notwithstanding the definition of recorded under subdivision 1, if the real property is registered property, a transfer on death deed that was recorded incorrectly or incompletely is valid if the deed was recorded before the death of the grantor owner in the office of the county recorder or the registrar of titles in a county in which at least part of the real property is located, and is memorialized on the certificate of title after death. A transfer on death deed is not effective for purposes of section 507.34 , 508.47 , or 508A.47 until the deed is properly recorded in the county in which the real property is located. When a transfer on death deed is presented for recording, no certification by the county auditor as to transfer of ownership and current and delinquent taxes shall be required or made and the transfer on death deed shall not be required to be accompanied by a certificate of real estate value. A transfer on death deed that otherwise satisfies all statutory requirements for recording may be recorded and shall be accepted for recording in the county in which the property described in the deed is located. If any part of the property described in the transfer on death deed is registered property, the registrar of titles shall accept the transfer on death deed for recording only if at least one of the grantors who executes the transfer on death deed appears of record to have an ownership interest or other interest in the real property described in the deed. No certification or approval of a transfer on death deed shall be required of the examiner of titles prior to recording of the deed in the office of the registrar of titles.\n\n§\nSubd. 9. Deed to trustee or other entity.\nA transfer on death deed may transfer an interest in real property to the trustee of an inter vivos trust even if the trust is revocable, to the trustee of a testamentary trust or to any other entity legally qualified to hold title to real property under the laws of this state.\n\n§\nSubd. 10. Revocation or modification of transfer on death deed.\n(a) A transfer on death deed may be revoked at any time by the grantor owner or, if there is more than one grantor owner, by any of the grantor owners. A revocation revokes the transfer on death deed in its entirety. To be effective, the revocation must be recorded in a county in which at least a part of the real property is located before the death of the grantor owner or owners who execute the revocation. Notwithstanding the definition of recorded under subdivision 1, if the real property is registered property, a revocation that was recorded incorrectly or incompletely is effective if it was recorded before the death of the grantor owner in the office of the county recorder or the registrar of titles in a county in which at least part of the real property is located, and is memorialized on the certificate of title after death. The revocation is not effective for purposes of section 507.34 , 508.47 , or 508A.47 until the revocation is properly recorded in a county in which the real property is located.\n\n(b) If a grantor owner conveys to a third party, subsequent to the recording of the transfer on death deed, by means other than a transfer on death deed, all or a part of such grantor owner's interest in the property described in the transfer on death deed, no transfer of the conveyed interest shall occur on such grantor owner's death and the transfer on death deed shall be ineffective as to the conveyed or transferred interests, but the transfer on death deed remains effective with respect to the conveyance or transfer on death of any other interests described in the transfer on death deed owned by the grantor owner at the time of the grantor owner's death.\n\n(c) A transfer on death deed is a \"governing instrument\" within the meaning of section 524.2-804 and, except as may otherwise be specifically provided for in the transfer on death deed, is subject to the same provisions as to revocation, revival, and nonrevocation set forth in section 524.2-804 .\n\n§\nSubd. 11. Antilapse; deceased beneficiary; words of survivorship.\n(a) Except when a successor grantee beneficiary is designated in the transfer on death deed for the grantee beneficiary who did not survive the grantor owner, if a grantee beneficiary who is a grandparent or lineal descendant of a grandparent of the grantor owner fails to survive the grantor owner, the issue of the deceased grantee beneficiary who survive the grantor owner take in place of the deceased grantee beneficiary. If they are all of the same degree of kinship to the deceased grantee beneficiary, they take equally. If they are of unequal degree, those of more remote degree take by right of representation.\n\n(b) For the purposes of this subdivision, words of survivorship such as, in a conveyance to an individual, \"if he or she survives me,\" or, in a class gift, to \"my surviving children,\" are a sufficient indication of intent to condition the conveyance or transfer upon the beneficiary surviving the grantor owner.\n\n(c) When issue of a deceased grantee beneficiary or members of a class take in place of the named grantee beneficiary pursuant to subdivision 5 or paragraph (a) or (b) or when a beneficiary dies and has no issue under paragraph (a), an affidavit of survivorship stating the names and shares of the beneficiaries or stating that a deceased beneficiary had no issue is not conclusive and a court order made in accordance with Minnesota probate law determining the beneficiaries and shares must also be recorded.\n\n§\nSubd. 12. Lapse.\nIf all beneficiaries and all successor beneficiaries, if any, designated in a transfer on death deed, and also all successor beneficiaries who would take under the antilapse provisions of subdivision 11, fail to survive the grantor owner or the last survivor of the grantor owners if there are multiple grantor owners, if the beneficiary is a trust which has been revoked prior to the grantor owner's death, or if the beneficiary is an entity no longer in existence at the grantor owner's death, no transfer shall occur and the transfer on death deed is void.\n\n§\nSubd. 13. Multiple transfer on death deeds.\nIf a grantor owner executes and records more than one transfer on death deed conveying the same interest in real property or a greater interest in the real property, or conveying part of the property in the earlier transfer on death deed, the transfer on death deed that has the latest acknowledgment date and that is recorded before the death of the grantor owner upon whose death the conveyance or transfer is conditioned is the effective transfer on death deed and all other transfer on death deeds, if any, executed by the grantor owner or the grantor owners are ineffective to transfer any interest and are void, except that if the later transfer on death deed included only part of the land of the earlier deed, the earlier deed is effective for the lands not included in the subsequent deed, absent language to the contrary in the subsequent deed.\n\n§\nSubd. 14. Nonademption; unpaid proceeds of sale, condemnation, or insurance; sale by conservator or guardian.\nIf at the time of the death of the grantor owner upon whose death the conveyance or transfer is stated to be effective, the grantor owner did not own a part or all of the real property described in the transfer on death deed, no conveyance or transfer to the beneficiary of the nonowned part of the real property shall occur upon the death of the grantor owner and the transfer on death deed is void as to the nonowned part of the real property, but the beneficiary shall have the same rights to unpaid proceeds of sale, condemnation or insurance, and, if sold by a conservator or guardian of the grantor owner during the grantor owner's lifetime, the same rights to a general pecuniary devise, as that of a specific devisee as set forth in section 524.2-606 .\n\n§\nSubd. 15. Nonexoneration.\nExcept as otherwise provided in subdivision 3, a conveyance or transfer under a transfer on death deed passes the described property subject to any mortgage or security interest existing at the date of death of the grantor owner, without right of exoneration, regardless of any statutory obligations to pay the grantor owner's debts upon death and regardless of a general directive in the grantor owner's will to pay debts.\n\n§\nSubd. 16. Disclaimer by beneficiary.\nA grantee beneficiary's interest under a transfer on death deed may be disclaimed as provided in sections 524.2-1101 to 524.2-1116 , or as otherwise provided by law.\n\n§\nSubd. 17. Effect on other conveyances.\nThis section does not prohibit other methods of conveying property that are permitted by law and that have the effect of postponing ownership or enjoyment of an interest in real property until the death of the owner. This section does not invalidate any deed that is not a transfer on death deed and that is otherwise effective to convey title to the interests and estates described in the deed that is not recorded until after the death of the owner.\n\n§\nSubd. 18. Notice, consent, and delivery not required.\nThe signature, consent or agreement of, or notice to, a grantee beneficiary under a transfer on death deed, or delivery of the transfer on death deed to the grantee beneficiary, is not required for any purpose during the lifetime of the grantor owner.\n\n§\nSubd. 19. Nonrevocation by will.\nA transfer on death deed that is executed, acknowledged, and recorded in accordance with this section is not revoked by the provisions of a will.\n\n§\nSubd. 20. Proof of survivorship and clearance from public assistance claims and liens; recording.\nAn affidavit of identity and survivorship with a certified copy of a record of death as an attachment may be combined with a clearance certificate under this section and the combined documents may be recorded separately or as one document in each county in which the real estate described in the clearance certificate is located. The affidavit must include the name and mailing address of the person to whom future property tax statements should be sent. The affidavit, record of death, and clearance certificate, whether combined or separate, shall be prima facie evidence of the facts stated in each, and the registrar of titles may rely on the statements to transfer title to the property described in the clearance certificate, except in cases where a court order is required pursuant to the provisions of subdivision 11, paragraph (c).\n\n§\nSubd. 21. After-acquired property.\nExcept as provided in this subdivision, a transfer on death deed is not effective to transfer any interest in real property acquired by a grantor owner subsequent to the date of signing of a transfer on death deed. A grantor owner may provide by specific language in a transfer on death deed that the transfer on death deed will apply to any interest in the described property acquired by the grantor owner after the signing or recording of the deed.\n\n§\nSubd. 22. Anticipatory alienation prohibited.\nThe interest of a grantee beneficiary under a transfer on death deed which has not yet become effective is not subject to alienation; assignment; encumbrance; appointment or anticipation by the beneficiary; garnishment; attachment; execution or bankruptcy proceedings; claims for alimony, support, or maintenance; payment of other obligations by any person against the beneficiary; or any other transfer, voluntary or involuntary, by or from any beneficiary.\n\n§\nSubd. 23. Clearance for public assistance claims and liens.\nAny person claiming an interest in real property conveyed or transferred by a transfer on death deed, or the person's attorney or other agent, may apply to the county agency in the county in which the real property is located for a clearance certificate for the real property described in the transfer on death deed. The application for a clearance certificate and the clearance certificate must contain the legal description of each parcel of property covered by the clearance certificate. The county agency shall provide a sufficient number of clearance certificates to allow a clearance certificate to be recorded in each county in which the real property described in the transfer on death deed is located. The real property described in the clearance certificate is bound by any conditions or other requirements imposed by the county agency as specified in the clearance certificate. If the real property is registered property, a new certificate of title must not be issued until the clearance certificate is recorded. If the clearance certificate shows the continuation of a medical assistance claim or lien after issuance of the clearance certificate, the real property remains subject to the claim or lien. If the real property is registered property, the clearance certificate must be carried forward as a memorial in any new certificate of title. The application shall contain the same information and shall be submitted, processed, and resolved in the same manner and on the same terms and conditions as provided in section 525.313 for a clearance certificate in a decree of descent proceeding, except that a copy of a notice of hearing does not have to accompany the application. The application may contain a statement that the applicant, after reasonably diligent inquiry, is not aware of the existence of a predeceased spouse or the existence of a claim which could be recovered under section 246.53 , 256B.15 , 256D.16 , 261.04 , or 514.981 . If the county agency determines that a claim or lien exists under section 246.53 , 256B.15 , 256D.16 , 261.04 , or 514.981 , the provisions of section 525.313 shall apply to collection, compromise, and settlement of the claim or lien. A person claiming an interest in real property transferred or conveyed by a transfer on death deed may petition or move the district court, as appropriate, in the county in which the real property is located or in the county in which a probate proceeding affecting the estate of the grantor of the transfer on death deed is pending, for an order allowing sale of the real property free and clear of any public assistance claim or lien but subject to disposition of the sale proceeds as provided in section 525.313 . On a showing of good cause and subject to such notice as the court may require, the court without hearing may issue an order allowing the sale free and clear of any public assistance claim or lien on such terms and conditions as the court deems advisable to protect the interests of the state or county agency.\n\n§\nSubd. 24. Form of transfer on death deed.\nA transfer on death deed may be substantially in the following form:\n\nTransfer on Death Deed\n\nI (we) ................................... (grantor owner or owners and spouses, if any, with marital status designated), grantor(s), hereby convey(s) and quitclaim(s) to .................................. (grantee beneficiary, whether one or more) effective (check only one of the following)\n\n.... on the death of the grantor owner, if only one grantor is named above, or on the death of the last of the grantor owners to die, if more than one grantor owner is named above, or\n\n.... on the death of (name of grantor owner)\n\n........................................... (must be one of the grantor owners named above), the following described real property:\n\n(Legal description)\n\nIf checked, the following optional statement applies:\n\n....When effective, this instrument conveys any and all interests in the described real property acquired by the grantor owner(s) before, on, or after the date of this instrument.\n\n.\n\n(Signature of grantor(s))\n\n(acknowledgment)\n\n§\nSubd. 25. Form of instrument of revocation.\nAn instrument of revocation may be substantially in the following form:\n\nRevocation of Transfer on Death Deed\n\nThe undersigned hereby revokes the transfer on death deed recorded on .........., ...., as Document No. .......... (or in Book .......... of ........., Page .....) in the office of the (County Recorder) (Registrar of Titles) of ............ County, Minnesota, affecting real property legally described as follows:\n\n(legal description)\n\nDated:\n\n.\n\nSignature\n\n(acknowledgment)\n\n§\nSubd. 26. Jurisdiction.\nIn counties where the district court has a probate division, the application of subdivision 11 or other issues of interpretation or validity of the transfer on death deed, and actions to enforce a medical assistance lien or claim against real property described in a transfer on death deed and any matter raised in connection with enforcement shall be determined in the probate division. In other counties, the district court shall have jurisdiction to determine any matter affecting real property purporting to be transferred by a transfer on death deed. Notwithstanding any other law to the contrary, the provisions of section 256B.15 shall apply to any proceeding to enforce a medical assistance lien or claim under chapter 524 or 525.\n\nHistory:\n2008 c 341 art 2 s 5 ; 2009 c 30 art 1 s 1 ,2; 2010 c 382 s 77 ; 2014 c 266 s 4 -9; 2024 c 91 s 1 ; 2025 c 38 art 3 s 74"
+    },
+    {
+      "id": "mn-145c-16",
+      "jurisdiction": "MN",
+      "title": "Minnesota Statutes — Health Care Directive Suggested Form",
+      "statuteReference": "Minn. Stat. § 145C.16",
+      "sourceUrl": "https://www.revisor.mn.gov/statutes/cite/145C.16",
+      "publisher": "Minnesota Office of the Revisor of Statutes",
+      "licenseNote": "U.S. state statute — public domain (Minnesota Statutes)",
+      "verifiedAt": "2026-06-14T00:00:00Z",
+      "text": "145C.16 SUGGESTED FORM.\nThe following is a suggested form of a health care directive and is not a required form.\n\nHEALTH CARE DIRECTIVE\n\nI, ..........................., understand this document allows me to do ONE OR BOTH of the following:\n\nPART I: Name another person (called the health care agent) to make health care decisions for me if I am unable to decide or speak for myself. My health care agent must make health care decisions for me based on the instructions I provide in this document (Part II), if any, the wishes I have made known to him or her, or must act in my best interest if I have not made my health care wishes known.\n\nAND/OR\n\nPART II: Give health care instructions to guide others making health care decisions for me. If I have named a health care agent, these instructions are to be used by the agent. These instructions may also be used by my health care providers, others assisting with my health care and my family, in the event I cannot make decisions for myself.\n\nPART I: APPOINTMENT OF HEALTH CARE AGENT\n\nTHIS IS WHO I WANT TO MAKE HEALTH CARE DECISIONS\n\nFOR ME IF I AM UNABLE TO DECIDE OR SPEAK FOR MYSELF\n\n(I know I can change my agent or alternate agent at any time and I know I do not have to appoint an agent or an alternate agent)\n\nNOTE: If you appoint an agent, you should discuss this health care directive with your agent and give your agent a copy. If you do not wish to appoint an agent, you may leave Part I blank and go to Part II.\n\nWhen I am unable to decide or speak for myself, I trust and appoint .......................... to make health care decisions for me. This person is called my health care agent.\n\nRelationship of my health care agent to me:\n.\n\nTelephone number of my health care agent:\n.\n\nAddress of my health care agent:\n.\n\n(OPTIONAL) APPOINTMENT OF ALTERNATE HEALTH CARE AGENT: If my health care agent is not reasonably available, I trust and appoint .................... to be my health care agent instead.\n\nRelationship of my alternate health care agent to me:\n.\n\nTelephone number of my alternate health care agent:\n.\n\nAddress of my alternate health care agent:\n.\n\nTHIS IS WHAT I WANT MY HEALTH CARE AGENT TO BE ABLE TO\n\nDO IF I AM UNABLE TO DECIDE OR SPEAK FOR MYSELF\n\n(I know I can change these choices)\n\nMy health care agent is automatically given the powers listed below in (A) through (D). My health care agent must follow my health care instructions in this document or any other instructions I have given to my agent. If I have not given health care instructions, then my agent must act in my best interest.\n\nWhenever I am unable to decide or speak for myself, my health care agent has the power to:\n\n(A) Make any health care decision for me. This includes the power to give, refuse, or withdraw consent to any care, treatment, service, or procedures. This includes deciding whether to stop or not start health care that is keeping me or might keep me alive, and deciding about intrusive mental health treatment.\n\n(B) Choose my health care providers.\n\n(C) Choose where I live and receive care and support when those choices relate to my health care needs.\n\n(D) Review my medical records and have the same rights that I would have to give my medical records to other people.\n\nIf I DO NOT want my health care agent to have a power listed above in (A) through (D) OR if I want to LIMIT any power in (A) through (D), I MUST say that here:\n\n.\n\n.\n\n.\n\nMy health care agent is NOT automatically given the powers listed below in (1) and (2). If I WANT my agent to have any of the powers in (1) and (2), I must INITIAL the line in front of the power; then my agent WILL HAVE that power.\n\n.\n\n(1)\n\nTo decide whether to donate any parts of my body, including organs, tissues, and eyes, when I die.\n\n.\n\n(2)\n\nTo decide what will happen with my body when I die (burial, cremation).\n\nIf I want to say anything more about my health care agent's powers or limits on the powers, I can say it here:\n\n.\n\n.\n\n.\n\nPART II: HEALTH CARE INSTRUCTIONS\n\nNOTE: Complete this Part II if you wish to give health care instructions. If you appointed an agent in Part I, completing this Part II is optional but would be very helpful to your agent. However, if you chose not to appoint an agent in Part I, you MUST complete some or all of this Part II if you wish to make a valid health care directive.\n\nThese are instructions for my health care when I am unable to decide or speak for myself. These instructions must be followed (so long as they address my needs).\n\nTHESE ARE MY BELIEFS AND VALUES ABOUT MY HEALTH CARE\n\n(I know I can change these choices or leave any of them blank)\n\nI want you to know these things about me to help you make decisions about my health care:\n\nMy goals for my health care:\n.\n\n.\n\n.\n\nMy fears about my health care:\n.\n\n.\n\n.\n\nMy spiritual or religious beliefs and traditions:\n.\n\n.\n\n.\n\nMy beliefs about when life would be no longer worth living:\n.\n\n.\n\n.\n\nMy thoughts about how my medical condition might affect my family:\n.\n\n.\n\n.\n\nTHIS IS WHAT I WANT AND DO NOT WANT FOR MY HEALTH CARE\n\n(I know I can change these choices or leave any of them blank)\n\nMany medical treatments may be used to try to improve my medical condition or to prolong my life. Examples include artificial breathing by a machine connected to a tube in the lungs, artificial feeding or fluids through tubes, attempts to start a stopped heart, surgeries, dialysis, antibiotics, and blood transfusions. Most medical treatments can be tried for a while and then stopped if they do not help.\n\nI have these views about my health care in these situations:\n\n(Note: You can discuss general feelings, specific treatments, or leave any of them blank)\n\nIf I had a reasonable chance of recovery, and were temporarily unable to decide or speak for myself, I would want:\n.\n\n.\n\n.\n\nIf I were dying and unable to decide or speak for myself, I would want:\n.\n\n.\n\n.\n\nIf I were permanently unconscious and unable to decide or speak for myself, I would want:\n.\n\n.\n\n.\n\nIf I were completely dependent on others for my care and unable to decide or speak for myself, I would want:\n.\n\n.\n\n.\n\nIn all circumstances, my doctors, advanced practice registered nurses, or physician assistants will try to keep me comfortable and reduce my pain. This is how I feel about pain relief if it would affect my alertness or if it could shorten my life:\n.\n\n.\n\n.\n\nThere are other things that I want or do not want for my health care, if possible:\n\nWho I would like to be my doctor, advanced practice registered nurse, or physician assistant:\n.\n\n.\n\n.\n\nWhere I would like to live to receive health care:\n.\n\n.\n\n.\n\nWhere I would like to die and other wishes I have about dying:\n.\n\n.\n\n.\n\nMy wishes about donating parts of my body when I die:\n.\n\n.\n\n.\n\nMy wishes about what happens to my body when I die (cremation, burial):\n.\n\n.\n\n.\n\nAny other things:\n.\n\n.\n\n.\n\nPART III: MAKING THE DOCUMENT LEGAL\n\nThis document must be signed by me. It also must either be verified by a notary public (Option 1) OR witnessed by two witnesses (Option 2). It must be dated when it is verified or witnessed.\n\nI am thinking clearly, I agree with everything that is written in this document, and I have made this document willingly.\n\n.\n\nMy Signature\n\nDate signed:\n\n.\n\nDate of birth:\n\n.\n\nAddress:\n\n.\n\n.\n\nIf I cannot sign my name, I can ask someone to sign this document for me.\n\n.\n\nSignature of the person who I asked to sign this document for me.\n\n.\n\nPrinted name of the person who I asked to sign this document for me.\n\nOption 1: Notary Public\n\nIn my presence on .................... (date), ....................... (name) acknowledged his/her signature on this document or acknowledged that he/she authorized the person signing this document to sign on his/her behalf. I am not named as a health care agent or alternate health care agent in this document.\n\n.\n\n(Signature of Notary)\n(Notary Stamp)\n\nOption 2: Two Witnesses\n\nTwo witnesses must sign. Only one of the two witnesses can be a health care provider or an employee of a health care provider giving direct care to me on the day I sign this document.\n\nWitness One:\n\n(i) In my presence on ............... (date), ............... (name) acknowledged his/her signature on this document or acknowledged that he/she authorized the person signing this document to sign on his/her behalf.\n\n(ii) I am at least 18 years of age.\n\n(iii) I am not named as a health care agent or an alternate health care agent in this document.\n\n(iv) If I am a health care provider or an employee of a health care provider giving direct care to the person listed above in (A), I must initial this box: [ ]\n\nI certify that the information in (i) through (iv) is true and correct.\n\n.\n\n(Signature of Witness One)\n\nAddress:\n\n.\n\n.\n\nWitness Two:\n\n(i) In my presence on .............. (date), ................. (name) acknowledged his/her signature on this document or acknowledged that he/she authorized the person signing this document to sign on his/her behalf.\n\n(ii) I am at least 18 years of age.\n\n(iii) I am not named as a health care agent or an alternate health care agent in this document.\n\n(iv) If I am a health care provider or an employee of a health care provider giving direct care to the person listed above in (A), I must initial this box: [ ]\n\nI certify that the information in (i) through (iv) is true and correct.\n\n.\n\n(Signature of Witness Two)\n\nAddress:\n\n.\n\n.\n\nREMINDER: Keep this document with your personal papers in a safe place (not in a safe deposit box). Give signed copies to your doctors, advanced practice registered nurses, physician assistants, family, close friends, health care agent, and alternate health care agent. Make sure your doctor, advanced practice registered nurse, or physician assistant is willing to follow your wishes. This document should be part of your medical record at your physician's, advanced practice registered nurse's, or physician assistant's office and at the hospital, home care agency, hospice, or nursing facility where you receive your care.\n\nHistory:\n1998 c 399 s 24 ; 1999 c 14 s 1 ; 2020 c 115 art 4 s 72 ; 2022 c 58 s 83"
+    },
+    {
+      "id": "mn-145c-05",
+      "jurisdiction": "MN",
+      "title": "Minnesota Statutes — Health Care Directive; Provisions That May Be Included",
+      "statuteReference": "Minn. Stat. § 145C.05",
+      "sourceUrl": "https://www.revisor.mn.gov/statutes/cite/145C.05",
+      "publisher": "Minnesota Office of the Revisor of Statutes",
+      "licenseNote": "U.S. state statute — public domain (Minnesota Statutes)",
+      "verifiedAt": "2026-06-14T00:00:00Z",
+      "text": "145C.05 SUGGESTED FORM; PROVISIONS THAT MAY BE INCLUDED.\n\n§\nSubdivision 1. Content.\nA health care directive executed pursuant to this chapter may, but need not, be in the form contained in section 145C.16 .\n\n§\nSubd. 2. Provisions that may be included.\n(a) A health care directive may include provisions consistent with this chapter, including, but not limited to:\n\n(1) the designation of one or more alternate health care agents to act if the named health care agent is not reasonably available to serve;\n\n(2) directions to joint health care agents regarding the process or standards by which the health care agents are to reach a health care decision for the principal, and a statement whether joint health care agents may act independently of one another;\n\n(3) limitations, if any, on the right of the health care agent or any alternate health care agents to receive, review, obtain copies of, and consent to the disclosure of the principal's medical records or to visit the principal when the principal is a patient in a health care facility;\n\n(4) limitations, if any, on the nomination of the health care agent as guardian for purposes of sections 524.5-202 , 524.5-211 , 524.5-302 , and 524.5-303 ;\n\n(5) a document of gift for the purpose of making an anatomical gift, as set forth in chapter 525A, or an amendment to, revocation of, or refusal to make an anatomical gift;\n\n(6) a declaration regarding intrusive mental health treatment under section 253B.03, subdivision 6d , or a statement that the health care agent is authorized to give consent for the principal under section 253B.04, subdivision 1a ;\n\n(7) a funeral directive as provided in section 149A.80, subdivision 2 ;\n\n(8) limitations, if any, to the effect of dissolution or annulment of marriage or termination of domestic partnership on the appointment of a health care agent under section 145C.09, subdivision 2 ;\n\n(9) specific reasons why a principal wants a health care provider or an employee of a health care provider attending the principal to be eligible to act as the principal's health care agent;\n\n(10) health care instructions by a woman of child bearing age regarding how she would like her pregnancy, if any, to affect health care decisions made on her behalf;\n\n(11) health care instructions regarding artificially administered nutrition or hydration; and\n\n(12) health care instructions to prohibit administering, dispensing, or prescribing an opioid, except that these instructions must not be construed to limit the administering, dispensing, or prescribing an opioid to treat substance abuse, opioid dependence, or an overdose, unless otherwise prohibited in the health care directive.\n\n(b) A health care directive may include a statement of the circumstances under which the directive becomes effective other than upon the judgment of the principal's attending physician, advanced practice registered nurse, or physician assistant in the following situations:\n\n(1) a principal who in good faith generally selects and depends upon spiritual means or prayer for the treatment or care of disease or remedial care and does not have an attending physician, advanced practice registered nurse, or physician assistant, may include a statement appointing an individual who may determine the principal's decision-making capacity; and\n\n(2) a principal who in good faith does not generally select a physician, advanced practice registered nurse, or physician assistant or a health care facility for the principal's health care needs may include a statement appointing an individual who may determine the principal's decision-making capacity, provided that if the need to determine the principal's capacity arises when the principal is receiving care under the direction of an attending physician, advanced practice registered nurse, or physician assistant in a health care facility, the determination must be made by an attending physician, advanced practice registered nurse, or physician assistant after consultation with the appointed individual.\n\nIf a person appointed under clause (1) or (2) is not reasonably available and the principal is receiving care under the direction of an attending physician, advanced practice registered nurse, or physician assistant in a health care facility, an attending physician, advanced practice registered nurse, or physician assistant shall determine the principal's decision-making capacity.\n\n(c) A health care directive may authorize a health care agent to make health care decisions for a principal even though the principal retains decision-making capacity.\n\nHistory:\n1993 c 312 s 6 ; 1995 c 211 s 2 ; 1998 c 399 s 15 ,16; 2004 c 146 art 3 s 3 ; 2007 c 120 art 2 s 4 ; 2007 c 147 art 9 s 22 ; 2019 c 63 art 2 s 1 ; 2020 c 115 art 4 s 69 ; 2022 c 58 s 80"
+    }
+  ]
+}
diff --git a/docs/legal-corpus/manifest.md b/docs/legal-corpus/manifest.md
index 0d27a5a..4c13124 100644
--- a/docs/legal-corpus/manifest.md
+++ b/docs/legal-corpus/manifest.md
@@ -22,10 +22,42 @@ GA corpus sources must be official statute, regulation, or court-rule publishers
 
 | Jurisdiction | Source family | Status |
 |---|---|---|
-| IL | 755 ILCS 5, 755 ILCS 35, 755 ILCS 45, 760 ILCS 3, Cook County probate rules | pending ingest |
+| IL | 755 ILCS 5, 755 ILCS 35, 755 ILCS 45, 760 ILCS 3, Cook County probate rules | first set sourced (5/4-3, 45/3-3, 45/4-10) — see below |
 | US | 26 USC 2001-2058, HIPAA Privacy Rule, ABA Model Rules excerpts | pending ingest |
-| MD | Health-General 5-601 through 5-618 | pending ingest |
-| MN | Chapter 145C and relevant guardianship/conservatorship references | pending ingest |
+| MD | Health-General 5-601 through 5-618 | first set sourced (HG § 5-603) — see below |
+| MN | Chapter 145C and relevant guardianship/conservatorship references | first set sourced (507.071, 145C.05, 145C.16) — see below |
+
+### Sourced forms — launch states (manifest: `launch-states.json`)
+
+First obvious estate-planning forms for IL/MD/MN, sourced **verbatim** from official
+state legislature / revisor publishers only (Rule 9). Captured via deterministic
+HTML-to-text extraction (no LLM in the text path); each source URL is recorded per
+chunk by the ingestion pipeline. Retrieved/verified **2026-06-14**.
+
+| id | Juris | Citation | Form | Official source | Chunks |
+|---|---|---|---|---|---|
+| `il-755-ilcs-5-4-3` | IL | 755 ILCS 5/4-3 | Probate Act — will signing & attestation | [ilga.gov](https://www.ilga.gov/documents/legislation/ilcs/documents/075500050K4-3.htm) | 1 |
+| `il-755-ilcs-45-3-3` | IL | 755 ILCS 45/3-3 | POA Act — statutory short form POA for **property** | [ilga.gov](https://www.ilga.gov/documents/legislation/ilcs/documents/075500450K3-3.htm) | 13 |
+| `il-755-ilcs-45-4-10` | IL | 755 ILCS 45/4-10 | POA Act — statutory short form POA for **health care** | [ilga.gov](https://www.ilga.gov/documents/legislation/ilcs/documents/075500450K4-10.htm) | 15 |
+| `md-hg-5-603` | MD | Md. Code, Health-General § 5-603 | Advance directive statutory form | [mgaleg.maryland.gov](https://mgaleg.maryland.gov/mgawebsite/Laws/StatuteText?article=ghg&section=5-603&enactments=false) | 10 |
+| `mn-507-071` | MN | Minn. Stat. § 507.071 | Transfer-on-death deed (TODD) + form | [revisor.mn.gov](https://www.revisor.mn.gov/statutes/cite/507.071) | 16 |
+| `mn-145c-05` | MN | Minn. Stat. § 145C.05 | Health care directive — provisions that may be included | [revisor.mn.gov](https://www.revisor.mn.gov/statutes/cite/145C.05) | 3 |
+| `mn-145c-16` | MN | Minn. Stat. § 145C.16 | Health care directive — suggested form | [revisor.mn.gov](https://www.revisor.mn.gov/statutes/cite/145C.16) | 6 |
+
+Dry-run (`go run ./cmd/corpus-ingest -manifest ../docs/legal-corpus/launch-states.json -dry-run`):
+**7 sources, 64 chunks — PASS** (all sources validated; nothing embedded or written).
+
+**Gaps / not yet sourced (Rule 9 — recorded, not invented):**
+- IL has **no fill-in-the-blank statutory will form** in 755 ILCS 5 (unlike CA Prob. Code).
+  Will validity is governed by execution requirements (755 ILCS 5/4-3, sourced). A
+  full self-proving-will template would come from court/forms sources, not a statute —
+  deferred pending owner/legal direction.
+- MN statutory **will** is likewise not a single fill-in form; MN intestacy/will rules
+  live in 524.2-xxx (Uniform Probate Code). Only the TODD + health-care-directive forms
+  are sourced in this first set.
+- MD POA / estates-&-trusts statutory forms (Est. & Trusts Title 17) and MD additional
+  advance-directive variants are not yet sourced — next batch.
+- US federal estate tax (26 USC 2001) and HIPAA excerpts remain pending ingest.
 
 ## Ingestion (`api/cmd/corpus-ingest`)
 
diff --git a/firestore.rules b/firestore.rules
index 04cdb8f..c842f07 100644
--- a/firestore.rules
+++ b/firestore.rules
@@ -39,15 +39,23 @@ service cloud.firestore {
     match /users/{userId} {
       allow read: if isOwner(userId);
       
-      // Registration: user creates own profile with required fields
+      // Registration: user creates own profile with required fields.
+      // Defense-in-depth (invitation-seizure): the profile email MUST equal the
+      // verified token email. The Cloud Function now resolves identity via
+      // admin.auth().getUser, but pinning the email here too prevents a user from
+      // ever persisting a profile email they don't actually own — closing every
+      // downstream code path that still reads users/{uid}.email.
       allow create: if isOwner(userId)
         && request.resource.data.keys().hasAll(['email', 'role', 'createdAt'])
+        && request.resource.data.email == request.auth.token.email
         && request.resource.data.role in ['principal', 'executor', 'heir', 'trustee', 'legal', 'cpa'];
-      
-      // Self-update: cannot change role or createdAt
+
+      // Self-update: cannot change role, createdAt, or email. Email is identity —
+      // it is set once at registration to the verified token email and is never
+      // client-mutable thereafter (an executor/heir role-seizure vector).
       allow update: if (isOwner(userId)
         && !request.resource.data.diff(resource.data).affectedKeys()
-            .hasAny(['role', 'createdAt']))
+            .hasAny(['role', 'createdAt', 'email']))
         || isAdmin();
       
       // Only admins can delete users
diff --git a/functions/index.js b/functions/index.js
index 8d9f42c..212d632 100644
--- a/functions/index.js
+++ b/functions/index.js
@@ -6,9 +6,17 @@
  * that cannot run on Cloud Run.
  *
  * Functions:
- *   1. autoMatchInvitation — Match pending invitations to new users
- *   2. sendMail — Send transactional email via Gmail API (Google-native)
- *   3. sendSMS — Process SMS queue for invitation notifications
+ *   1. autoMatchInvitation     — Match pending invitations to new users (on signup)
+ *   1b. autoMatchOnInvitation  — Link invitees who already have an account (on invite)
+ *   2. sendMail                — Send transactional email via Gmail API (Google-native)
+ *   3. guardianInactivityCheck — Daily Guardian Protocol inactivity sweep (scheduled)
+ *
+ * NOTE: There is intentionally NO SMS function. Invitation delivery is email-only
+ * (the Gmail rail above). A phone-number/SMS path was deliberately removed rather
+ * than ship a stub that silently never delivers a text — the UI must not promise a
+ * channel that does not exist. When a real SMS provider is adopted (Sirsi Sign
+ * shared rail per ADR-047, or a managed Twilio extension), reintroduce a delivery
+ * function here AND re-expose the phone field in InviteTeamMember.tsx together.
  */
 
 const { onDocumentCreated } = require('firebase-functions/v2/firestore');
@@ -112,12 +120,38 @@ exports.autoMatchInvitation = onDocumentCreated(
         const snapshot = event.data;
         if (!snapshot) return;
 
-        const userData = snapshot.data();
         const uid = event.params.uid;
-        const email = (userData.email || '').toLowerCase().trim();
 
+        // CRITICAL — verified identity ONLY. The users/{uid} document is
+        // client-writable, so an attacker can verify an account they control and
+        // then write users/{uid}.email = 'victim-invited@...' to seize the
+        // executor/heir role attached to that invitation. We MUST NOT trust
+        // userData.email. Instead resolve the email from the Firebase Auth record
+        // (admin.auth().getUser) — the identity the user actually proved — and
+        // refuse to grant any estate access until that email is verified. This is
+        // the write-side mirror of the firestore.rules isEstateRole() email_verified
+        // gate; without it the junction is written off a bare email-string match.
+        let rec;
+        try {
+            rec = await admin.auth().getUser(uid);
+        } catch (e) {
+            console.warn(`[autoMatch] admin.auth().getUser(${uid}) failed: ${e.message || e}`);
+            return;
+        }
+
+        const email = (rec.email || '').toLowerCase().trim();
         if (!email) return;
 
+        // Defense-in-depth: never grant estate access off an unverified address.
+        // The attacker can never VERIFY an invited address they don't control, so
+        // gating here makes the seizure path unreachable while a legitimate invitee
+        // is matched the moment they verify (this trigger re-runs on profile create,
+        // and the autoMatchOnInvitation path also covers already-verified users).
+        if (!rec.emailVerified) {
+            console.log(`[autoMatch] Skipping ${email} (uid: ${uid}) — email not verified`);
+            return;
+        }
+
         console.log(`[autoMatch] Checking invitations for ${email} (uid: ${uid})`);
 
         try {
@@ -538,112 +572,7 @@ exports.sendMail = onDocumentCreated(
     }
 );
 
-// ─── 3. Send SMS — Notification Queue ────────────────────────────────────
-//
-// Watches the 'sms_queue' Firestore collection. When a document is created,
-// processes the SMS request and updates delivery status.
-//
-// Document schema (written by web/src/lib/invitations.ts):
-// {
-//   to: "+15551234567",
-//   body: "You've been invited to an estate on FinalWishes...",
-//   invitationId: "abc123",
-//   estateId: "estate456",
-//   status: "pending",
-//   createdBy: "uid789",
-//   createdAt: Timestamp
-// }
-//
-// TODO: Integrate a real SMS provider. Options (Google-first priority):
-//   1. Google Cloud Communication API (when GA) — preferred, native GCP
-//   2. Firebase Extensions: "Send Messages with Twilio" — managed, low-code
-//   3. Direct Twilio SDK — fallback if Google options unavailable
-//
-// Until a provider is configured, this function validates the request,
-// logs the SMS details for manual review, and updates delivery status.
-
-exports.sendSMS = onDocumentCreated(
-    {
-        document: 'sms_queue/{smsId}',
-        memory: '256MiB',
-        timeoutSeconds: 30,
-    },
-    async (event) => {
-        const snapshot = event.data;
-        if (!snapshot) return;
-
-        const smsData = snapshot.data();
-        const smsRef = snapshot.ref;
-
-        // Skip if already processed
-        if (smsData.delivery?.state === 'SUCCESS' || smsData.delivery?.state === 'ERROR') return;
-
-        try {
-            const { to, body, invitationId, estateId, createdBy } = smsData;
-
-            // Validate required fields
-            if (!to || !body) {
-                await smsRef.update({
-                    'delivery.state': 'ERROR',
-                    'delivery.error': 'Missing required fields: to and body are required',
-                    'delivery.endTime': admin.firestore.FieldValue.serverTimestamp(),
-                });
-                return;
-            }
-
-            // Validate phone number format (E.164: +[country][number])
-            const e164Regex = /^\+[1-9]\d{6,14}$/;
-            if (!e164Regex.test(to.replace(/[\s\-()]/g, ''))) {
-                await smsRef.update({
-                    'delivery.state': 'ERROR',
-                    'delivery.error': `Invalid phone number format: ${to}. Expected E.164 format (e.g., +15551234567)`,
-                    'delivery.endTime': admin.firestore.FieldValue.serverTimestamp(),
-                });
-                return;
-            }
-
-            // Validate body length (SMS limit is 160 chars for single segment)
-            if (body.length > 1600) {
-                await smsRef.update({
-                    'delivery.state': 'ERROR',
-                    'delivery.error': `SMS body too long (${body.length} chars). Maximum 1600 characters.`,
-                    'delivery.endTime': admin.firestore.FieldValue.serverTimestamp(),
-                });
-                return;
-            }
-
-            // TODO: Replace this block with actual SMS provider integration.
-            // For now, log the request for manual processing / audit trail.
-            console.log(`[sendSMS] SMS queued for delivery:`, {
-                to,
-                bodyLength: body.length,
-                invitationId: invitationId || 'none',
-                estateId: estateId || 'none',
-                createdBy: createdBy || 'unknown',
-            });
-
-            // Mark as sent (provider pending — update to real delivery once integrated)
-            await smsRef.update({
-                'delivery.state': 'PENDING_PROVIDER',
-                'delivery.info': 'SMS queued successfully. Awaiting SMS provider integration.',
-                'delivery.endTime': admin.firestore.FieldValue.serverTimestamp(),
-                'delivery.leaseExpireTime': null,
-            });
-
-            console.log(`[sendSMS] Queued SMS to ${to} (invitation: ${invitationId || 'N/A'})`);
-        } catch (error) {
-            console.error(`[sendSMS] Error:`, error);
-
-            await smsRef.update({
-                'delivery.state': 'ERROR',
-                'delivery.error': error.message || 'Unknown SMS processing error',
-                'delivery.endTime': admin.firestore.FieldValue.serverTimestamp(),
-            });
-        }
-    }
-);
-
-// ─── 4. Guardian Protocol — Daily Inactivity Check ──────────────────────
+// ─── 3. Guardian Protocol — Daily Inactivity Check ──────────────────────
 // Runs every day at 6 AM EST. Calls the Go API's inactivity check endpoint
 // which escalates estates where the owner has gone silent.
 //
diff --git a/functions/index.test.js b/functions/index.test.js
index 62b058d..7404610 100644
--- a/functions/index.test.js
+++ b/functions/index.test.js
@@ -36,6 +36,11 @@ jest.mock('firebase-admin', () => ({
   })),
 }));
 
+// admin.auth() handles used by sendMail's open-relay defense (getUser) and the
+// guardian scheduler (createCustomToken). getUser is overridable per-test via
+// mockGetUser so a fixture can simulate the createdBy account's own email.
+const mockGetUser = jest.fn().mockResolvedValue({ email: '' });
+
 // Make FieldValue accessible
 jest.mock('firebase-admin', () => {
   const admin = {
@@ -45,6 +50,7 @@ jest.mock('firebase-admin', () => {
     }),
     auth: jest.fn(() => ({
       createCustomToken: jest.fn().mockResolvedValue('mock-custom-token'),
+      getUser: mockGetUser,
     })),
   };
   return admin;
@@ -131,6 +137,11 @@ describe('autoMatchInvitation', () => {
   beforeEach(() => {
     jest.clearAllMocks();
     mockDb.batch.mockReturnValue(mockBatch);
+    // Default identity: a VERIFIED account whose Firebase Auth email is the one we
+    // match invitations against. The handler no longer trusts the client-writable
+    // users/{uid}.email — it resolves identity via admin.auth().getUser(uid). Tests
+    // override mockGetUser to simulate verified/unverified/seizure fixtures.
+    mockGetUser.mockResolvedValue({ email: 'test@example.com', emailVerified: true });
   });
 
   test('skips when no snapshot data', async () => {
@@ -138,13 +149,60 @@ describe('autoMatchInvitation', () => {
     expect(mockCollection).not.toHaveBeenCalled();
   });
 
-  test('skips when user has no email', async () => {
-    const event = makeEvent({ email: '' }, { uid: 'u1' });
+  test('skips when auth record has no email', async () => {
+    mockGetUser.mockResolvedValue({ email: '', emailVerified: false });
+    const event = makeEvent({ email: 'spoofed@victim.com' }, { uid: 'u1' });
+    await handler(event);
+    expect(mockCollection).not.toHaveBeenCalled();
+  });
+
+  test('skips when admin.auth().getUser throws (no fabricated identity)', async () => {
+    mockGetUser.mockRejectedValueOnce(new Error('user not found'));
+    const event = makeEvent({ email: 'spoofed@victim.com' }, { uid: 'u1' });
+    await handler(event);
+    expect(mockCollection).not.toHaveBeenCalled();
+  });
+
+  // ─── CRITICAL: invitation-seizure defense ────────────────────────────────
+  // An attacker verifies an account they control, then writes
+  // users/{uid}.email = 'victim-invited@...' to seize that invitation's role.
+  // The handler must IGNORE userData.email entirely and gate on the VERIFIED
+  // auth email — so an unverified account grants nothing even with a forged
+  // profile email, and a verified account is only ever matched against its OWN
+  // verified address.
+  test('SEIZURE DEFENSE: ignores client profile email when account is unverified', async () => {
+    // Auth record: attacker controls attacker@evil.com but has NOT verified it.
+    mockGetUser.mockResolvedValue({ email: 'attacker@evil.com', emailVerified: false });
+    const event = makeEvent({ email: 'victim-invited@example.com' }, { uid: 'attacker-uid' });
     await handler(event);
+    // No invitation query, no junction write — access denied.
     expect(mockCollection).not.toHaveBeenCalled();
+    expect(mockBatch.commit).not.toHaveBeenCalled();
+  });
+
+  test('SEIZURE DEFENSE: matches the VERIFIED auth email, never the profile email', async () => {
+    // Attacker verified their OWN address but forged the profile email to the
+    // victim's invited address. The handler must query invitations for the
+    // VERIFIED address (attacker@evil.com), NOT the forged victim address.
+    mockGetUser.mockResolvedValue({ email: 'attacker@evil.com', emailVerified: true });
+    mockCollection.mockReturnValue({
+      where: jest.fn().mockReturnThis(),
+      get: jest.fn().mockResolvedValue({ empty: true, size: 0, docs: [] }),
+    });
+
+    const event = makeEvent({ email: 'victim-invited@example.com' }, { uid: 'attacker-uid' });
+    await handler(event);
+
+    const whereCalls = mockCollection().where.mock.calls;
+    expect(whereCalls[0]).toEqual(['email', '==', 'attacker@evil.com']);
+    // The forged victim email must NEVER appear in any query.
+    for (const call of whereCalls) {
+      expect(call).not.toContain('victim-invited@example.com');
+    }
   });
 
   test('skips when no pending invitations found', async () => {
+    mockGetUser.mockResolvedValue({ email: 'test@example.com', emailVerified: true });
     mockCollection.mockReturnValue({
       where: jest.fn().mockReturnThis(),
       get: jest.fn().mockResolvedValue({ empty: true, size: 0, docs: [] }),
@@ -165,6 +223,16 @@ describe('autoMatchInvitation', () => {
 
     const mockWhere = jest.fn().mockReturnThis();
     const mockGetResult = { empty: false, size: 1, docs: [invDoc] };
+    // An empty role/soul-log query result: the handler issues a SECOND query
+    // against estates/<id>/heirs|executors (to flip the subcollection doc to
+    // 'active') and estates/<id>/soul-log (sharedWith backfill). The mock must
+    // return a chainable .where(...).get() that yields no docs so those queries
+    // resolve cleanly instead of throwing "db.collection(...).where is not a
+    // function" (which the handler's try/catch would silently swallow).
+    const emptyQuery = () => ({
+      where: jest.fn().mockReturnThis(),
+      get: jest.fn().mockResolvedValue({ empty: true, size: 0, docs: [], forEach: () => {} }),
+    });
     mockCollection.mockImplementation((collName) => {
       if (collName === 'estate_invitations') {
         return { where: mockWhere, get: jest.fn().mockResolvedValue(mockGetResult) };
@@ -175,6 +243,11 @@ describe('autoMatchInvitation', () => {
       if (collName === 'audit_logs') {
         return { doc: jest.fn(() => ({ id: 'audit-ref' })) };
       }
+      // estates/<id>/heirs, estates/<id>/executors, estates/<id>/soul-log
+      if (typeof collName === 'string' &&
+          (collName.includes('/heirs') || collName.includes('/executors') || collName.includes('/soul-log'))) {
+        return emptyQuery();
+      }
       return { doc: mockDoc };
     });
 
@@ -187,13 +260,15 @@ describe('autoMatchInvitation', () => {
     expect(mockBatch.commit).toHaveBeenCalledTimes(1);
   });
 
-  test('normalizes email to lowercase and trims whitespace', async () => {
+  test('normalizes the VERIFIED auth email to lowercase and trims whitespace', async () => {
+    // Normalization applies to the auth-record email, not the client profile.
+    mockGetUser.mockResolvedValue({ email: '  Test@EXAMPLE.com  ', emailVerified: true });
     mockCollection.mockReturnValue({
       where: jest.fn().mockReturnThis(),
       get: jest.fn().mockResolvedValue({ empty: true, size: 0, docs: [] }),
     });
 
-    const event = makeEvent({ email: '  Test@EXAMPLE.com  ' }, { uid: 'u1' });
+    const event = makeEvent({ email: 'unused-profile@example.com' }, { uid: 'u1' });
     await handler(event);
 
     // The where clause should have been called with lowercase trimmed email
@@ -205,8 +280,47 @@ describe('autoMatchInvitation', () => {
 describe('sendMail', () => {
   const handler = registeredFunctions['mail/{mailId}'];
 
+  // Wire the Firestore mock so the open-relay defense (isRecipientAuthorized)
+  // AUTHORIZES every recipient for `createdBy`, via path (a): the createdBy user
+  // belongs to estate `est-1` (estate_users) and the recipient has a pending
+  // invitation for that same estate (estate_invitations by email). Any test that
+  // expects a successful send must call this first; the production defense is NOT
+  // weakened — the test simply provides the data the defense looks for.
+  function authorizeAllRecipients(estateId = 'est-1') {
+    mockCollection.mockImplementation((collName) => {
+      if (collName === 'estate_users') {
+        return {
+          where: jest.fn().mockReturnThis(),
+          get: jest.fn().mockResolvedValue({
+            docs: [{ data: () => ({ estateId, userId: 'owner-1' }) }],
+          }),
+        };
+      }
+      if (collName === 'estate_invitations') {
+        return {
+          where: jest.fn().mockReturnThis(),
+          get: jest.fn().mockResolvedValue({
+            docs: [{ data: () => ({ estateId, email: 'authorized' }) }],
+          }),
+        };
+      }
+      if (collName === 'email_templates') {
+        return { doc: mockDoc };
+      }
+      // heirs/executors fallback (path c) — not reached when (a) matches first.
+      return {
+        where: jest.fn().mockReturnThis(),
+        limit: jest.fn().mockReturnThis(),
+        get: jest.fn().mockResolvedValue({ empty: true, docs: [] }),
+        doc: mockDoc,
+      };
+    });
+  }
+
   beforeEach(() => {
     jest.clearAllMocks();
+    mockGetUser.mockResolvedValue({ email: '' });
+    authorizeAllRecipients();
   });
 
   test('skips when no snapshot data', async () => {
@@ -264,6 +378,7 @@ describe('sendMail', () => {
         data: () => ({
           to: 'recipient@example.com',
           message: { subject: 'Welcome', html: '<h1>Hello</h1>' },
+          createdBy: 'owner-1',
         }),
         ref,
       },
@@ -297,6 +412,7 @@ describe('sendMail', () => {
         data: () => ({
           to: ['a@b.com', 'c@d.com'],
           message: { subject: 'Multi', html: '<p>Hi all</p>' },
+          createdBy: 'owner-1',
         }),
         ref,
       },
@@ -314,6 +430,8 @@ describe('sendMail', () => {
   test('resolves template from email_templates collection', async () => {
     const ref = { update: jest.fn().mockResolvedValue(undefined) };
 
+    // Authorize the recipient AND serve the template doc from the same mock so
+    // the open-relay lookups (estate_users / estate_invitations) still resolve.
     mockCollection.mockImplementation((collName) => {
       if (collName === 'email_templates') {
         return {
@@ -328,13 +446,35 @@ describe('sendMail', () => {
           })),
         };
       }
-      return { doc: mockDoc };
+      if (collName === 'estate_users') {
+        return {
+          where: jest.fn().mockReturnThis(),
+          get: jest.fn().mockResolvedValue({
+            docs: [{ data: () => ({ estateId: 'est-1', userId: 'owner-1' }) }],
+          }),
+        };
+      }
+      if (collName === 'estate_invitations') {
+        return {
+          where: jest.fn().mockReturnThis(),
+          get: jest.fn().mockResolvedValue({
+            docs: [{ data: () => ({ estateId: 'est-1', email: 'heir@test.com' }) }],
+          }),
+        };
+      }
+      return {
+        where: jest.fn().mockReturnThis(),
+        limit: jest.fn().mockReturnThis(),
+        get: jest.fn().mockResolvedValue({ empty: true, docs: [] }),
+        doc: mockDoc,
+      };
     });
 
     const event = {
       data: {
         data: () => ({
           to: 'heir@test.com',
+          createdBy: 'owner-1',
           template: {
             name: 'invitation',
             data: { name: 'John', estate: 'Collymore Estate' },
@@ -362,6 +502,7 @@ describe('sendMail', () => {
         data: () => ({
           to: 'a@b.com',
           message: { subject: 'Test', html: '<p>Hi</p>' },
+          createdBy: 'owner-1',
         }),
         ref,
       },
@@ -377,149 +518,93 @@ describe('sendMail', () => {
       })
     );
   });
-});
-
-describe('sendSMS', () => {
-  const handler = registeredFunctions['sms_queue/{smsId}'];
 
-  beforeEach(() => {
-    jest.clearAllMocks();
-  });
+  // ─── Open-relay defense (locks in the createdBy-attribution hardening) ─────
 
-  test('skips when no snapshot data', async () => {
-    await handler({ data: null, params: { smsId: 's1' } });
-    expect(mockUpdate).not.toHaveBeenCalled();
-  });
-
-  test('skips already processed', async () => {
-    const event = makeEvent({ delivery: { state: 'SUCCESS' } }, { smsId: 's1' });
-    await handler(event);
-    // Should not have called update since delivery was already SUCCESS
-  });
-
-  test('errors on missing required fields (no phone)', async () => {
-    const ref = { update: jest.fn().mockResolvedValue(undefined) };
-    const event = {
-      data: { data: () => ({ body: 'Hello' }), ref },
-      params: { smsId: 's1' },
-    };
-
-    await handler(event);
-
-    expect(ref.update).toHaveBeenCalledWith(
-      expect.objectContaining({
-        'delivery.state': 'ERROR',
-        'delivery.error': expect.stringContaining('Missing required fields'),
-      })
-    );
-  });
-
-  test('errors on missing required fields (no body)', async () => {
-    const ref = { update: jest.fn().mockResolvedValue(undefined) };
-    const event = {
-      data: { data: () => ({ to: '+15551234567' }), ref },
-      params: { smsId: 's1' },
-    };
-
-    await handler(event);
-
-    expect(ref.update).toHaveBeenCalledWith(
-      expect.objectContaining({
-        'delivery.state': 'ERROR',
-        'delivery.error': expect.stringContaining('Missing required fields'),
-      })
-    );
-  });
-
-  test('errors on invalid phone number format', async () => {
-    const ref = { update: jest.fn().mockResolvedValue(undefined) };
-    const event = {
-      data: {
-        data: () => ({ to: '555-123-4567', body: 'Hello' }),
-        ref,
-      },
-      params: { smsId: 's1' },
-    };
-
-    await handler(event);
-
-    expect(ref.update).toHaveBeenCalledWith(
-      expect.objectContaining({
-        'delivery.state': 'ERROR',
-        'delivery.error': expect.stringContaining('Invalid phone number format'),
-      })
-    );
-  });
-
-  test('errors on body exceeding 1600 characters', async () => {
-    const ref = { update: jest.fn().mockResolvedValue(undefined) };
-    const event = {
-      data: {
-        data: () => ({ to: '+15551234567', body: 'A'.repeat(1601) }),
-        ref,
-      },
-      params: { smsId: 's1' },
-    };
-
-    await handler(event);
-
-    expect(ref.update).toHaveBeenCalledWith(
-      expect.objectContaining({
-        'delivery.state': 'ERROR',
-        'delivery.error': expect.stringContaining('SMS body too long'),
-      })
-    );
-  });
-
-  test('queues valid SMS with PENDING_PROVIDER status', async () => {
+  test('rejects mail with NO createdBy attribution (open-relay defense)', async () => {
     const ref = { update: jest.fn().mockResolvedValue(undefined) };
     const event = {
       data: {
         data: () => ({
-          to: '+15551234567',
-          body: 'You have been invited to an estate.',
-          invitationId: 'inv-1',
-          estateId: 'est-1',
-          createdBy: 'uid-1',
+          to: 'stranger@example.com',
+          message: { subject: 'Phish', html: '<p>Click me</p>' },
+          // createdBy intentionally absent
         }),
         ref,
       },
-      params: { smsId: 's1' },
+      params: { mailId: 'm1' },
     };
 
     await handler(event);
 
+    // Must FAIL CLOSED — never relay an unattributed mail from admin@sirsi.ai.
+    expect(mockGmailSend).not.toHaveBeenCalled();
     expect(ref.update).toHaveBeenCalledWith(
       expect.objectContaining({
-        'delivery.state': 'PENDING_PROVIDER',
-        'delivery.info': expect.stringContaining('SMS queued successfully'),
+        'delivery.state': 'ERROR',
+        'delivery.error': 'recipient not authorized',
+        status: 'rejected',
       })
     );
   });
 
-  test('accepts E.164 phone with spaces/dashes stripped', async () => {
+  test('rejects mail to a recipient the createdBy user is NOT authorized for', async () => {
+    // createdBy belongs to NO estate and the recipient is not their own email →
+    // every authorization path fails and the mail must be rejected.
+    mockGetUser.mockResolvedValue({ email: 'owner@sirsi.ai' });
+    mockCollection.mockImplementation((collName) => {
+      if (collName === 'estate_users') {
+        return {
+          where: jest.fn().mockReturnThis(),
+          get: jest.fn().mockResolvedValue({ docs: [] }), // belongs to no estate
+        };
+      }
+      if (collName === 'users') {
+        return {
+          doc: jest.fn(() => ({
+            get: jest.fn().mockResolvedValue({ exists: false }),
+          })),
+        };
+      }
+      return {
+        where: jest.fn().mockReturnThis(),
+        limit: jest.fn().mockReturnThis(),
+        get: jest.fn().mockResolvedValue({ empty: true, docs: [] }),
+        doc: mockDoc,
+      };
+    });
+
     const ref = { update: jest.fn().mockResolvedValue(undefined) };
     const event = {
       data: {
         data: () => ({
-          to: '+1 (555) 123-4567',
-          body: 'Test message',
+          to: 'victim@example.com',
+          message: { subject: 'Hi', html: '<p>Hi</p>' },
+          createdBy: 'orphan-uid',
         }),
         ref,
       },
-      params: { smsId: 's1' },
+      params: { mailId: 'm1' },
     };
 
     await handler(event);
 
+    expect(mockGmailSend).not.toHaveBeenCalled();
     expect(ref.update).toHaveBeenCalledWith(
       expect.objectContaining({
-        'delivery.state': 'PENDING_PROVIDER',
+        'delivery.state': 'ERROR',
+        'delivery.error': 'recipient not authorized',
+        status: 'rejected',
       })
     );
   });
 });
 
+// NOTE: There is no sendSMS describe block. Invitation delivery is email-only;
+// the SMS queue + stub delivery function were removed (it never delivered a text
+// while the UI reported success). Reinstate tests here only alongside a live SMS
+// provider integration.
+
 describe('guardianInactivityCheck', () => {
   const handler = registeredFunctions['__schedule__'];
 
diff --git a/functions/package.json b/functions/package.json
index 89683f9..448ff49 100644
--- a/functions/package.json
+++ b/functions/package.json
@@ -15,6 +15,7 @@
   "scripts": {
     "lint": "echo 'No lint configured'",
     "test": "jest --verbose",
+    "test:ci": "npm ci && jest --ci --verbose",
     "serve": "firebase emulators:start --only functions",
     "deploy": "firebase deploy --only functions"
   },
diff --git a/package-lock.json b/package-lock.json
index c23574f..80f59b9 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -932,9 +932,9 @@
       }
     },
     "node_modules/@esbuild/aix-ppc64": {
-      "version": "0.27.7",
-      "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.27.7.tgz",
-      "integrity": "sha512-EKX3Qwmhz1eMdEJokhALr0YiD0lhQNwDqkPYyPhiSwKrh7/4KRjQc04sZ8db+5DVVnZ1LmbNDI1uAMPEUBnQPg==",
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.28.1.tgz",
+      "integrity": "sha512-Svl7tq8k/08+p6CXPpRjQ1fKX+1odH/BQbb48fV6fj3CWHhsoIOoY87w1oHXm0qEpkIK3ZfVgp0hed3XBXzXMQ==",
       "cpu": [
         "ppc64"
       ],
@@ -949,9 +949,9 @@
       }
     },
     "node_modules/@esbuild/android-arm": {
-      "version": "0.27.7",
-      "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.27.7.tgz",
-      "integrity": "sha512-jbPXvB4Yj2yBV7HUfE2KHe4GJX51QplCN1pGbYjvsyCZbQmies29EoJbkEc+vYuU5o45AfQn37vZlyXy4YJ8RQ==",
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.28.1.tgz",
+      "integrity": "sha512-0k2F129Xdio1TdJfzJ8sy1Q47vUD2NnwdhiAf7drUN1EBTfPf4hsFCtmMgu/6m8JSzsBrlmVjudMBQqOfG8usQ==",
       "cpu": [
         "arm"
       ],
@@ -966,9 +966,9 @@
       }
     },
     "node_modules/@esbuild/android-arm64": {
-      "version": "0.27.7",
-      "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.27.7.tgz",
-      "integrity": "sha512-62dPZHpIXzvChfvfLJow3q5dDtiNMkwiRzPylSCfriLvZeq0a1bWChrGx/BbUbPwOrsWKMn8idSllklzBy+dgQ==",
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.28.1.tgz",
+      "integrity": "sha512-34EGEbCIAgosYz6goLcopX6Mo7NyGv9tfwEM2/7Ce2VcVRk568iSvniGWcUXIy7wEDR1wzolcxcriFVrWYcwBg==",
       "cpu": [
         "arm64"
       ],
@@ -983,9 +983,9 @@
       }
     },
     "node_modules/@esbuild/android-x64": {
-      "version": "0.27.7",
-      "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.27.7.tgz",
-      "integrity": "sha512-x5VpMODneVDb70PYV2VQOmIUUiBtY3D3mPBG8NxVk5CogneYhkR7MmM3yR/uMdITLrC1ml/NV1rj4bMJuy9MCg==",
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.28.1.tgz",
+      "integrity": "sha512-dbwY7ltSMDWsRatcRpCnES4F+im88OCUgGZjy52shC7GqHRE/cYlxNbB4Z4UpJswpcc4Qxd2oE/ufM0p61IKng==",
       "cpu": [
         "x64"
       ],
@@ -1000,9 +1000,9 @@
       }
     },
     "node_modules/@esbuild/darwin-arm64": {
-      "version": "0.27.7",
-      "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.27.7.tgz",
-      "integrity": "sha512-5lckdqeuBPlKUwvoCXIgI2D9/ABmPq3Rdp7IfL70393YgaASt7tbju3Ac+ePVi3KDH6N2RqePfHnXkaDtY9fkw==",
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.28.1.tgz",
+      "integrity": "sha512-TZbWkQY7kvTAXbXUT7uVACR5cMHsDiSz9z7ZKAX/RTq/WJEk3QyRr0wZpNhBDX+/0CtdqUIJlOiodQcta6tY3Q==",
       "cpu": [
         "arm64"
       ],
@@ -1017,9 +1017,9 @@
       }
     },
     "node_modules/@esbuild/darwin-x64": {
-      "version": "0.27.7",
-      "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.27.7.tgz",
-      "integrity": "sha512-rYnXrKcXuT7Z+WL5K980jVFdvVKhCHhUwid+dDYQpH+qu+TefcomiMAJpIiC2EM3Rjtq0sO3StMV/+3w3MyyqQ==",
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.28.1.tgz",
+      "integrity": "sha512-zfdzgK9ACBNZLI/CyHTOx81SyNbM6YXn7rxSgX97VjyiPl9W1i4Ka4fgKECEoFCKGpvBj5qArWIGgQjOwkgskQ==",
       "cpu": [
         "x64"
       ],
@@ -1034,9 +1034,9 @@
       }
     },
     "node_modules/@esbuild/freebsd-arm64": {
-      "version": "0.27.7",
-      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.27.7.tgz",
-      "integrity": "sha512-B48PqeCsEgOtzME2GbNM2roU29AMTuOIN91dsMO30t+Ydis3z/3Ngoj5hhnsOSSwNzS+6JppqWsuhTp6E82l2w==",
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.28.1.tgz",
+      "integrity": "sha512-wG2EA8ENdEI0qhkSZMjfqrdY+ziCYCPMmtZjjIwOmXFjmyzEHn+UUxk5of+SYsjtfs3VpnlC7QLzSI5hY/rOAw==",
       "cpu": [
         "arm64"
       ],
@@ -1051,9 +1051,9 @@
       }
     },
     "node_modules/@esbuild/freebsd-x64": {
-      "version": "0.27.7",
-      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.27.7.tgz",
-      "integrity": "sha512-jOBDK5XEjA4m5IJK3bpAQF9/Lelu/Z9ZcdhTRLf4cajlB+8VEhFFRjWgfy3M1O4rO2GQ/b2dLwCUGpiF/eATNQ==",
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.28.1.tgz",
+      "integrity": "sha512-i7dZ9vQgnvSCzi/rYCXNgtF/U+eKZNJBzu3eTQbRgHnM7tNSizLOkRFAl3qzVc/Op/u5YkHHa4pf/3DOYHthLQ==",
       "cpu": [
         "x64"
       ],
@@ -1068,9 +1068,9 @@
       }
     },
     "node_modules/@esbuild/linux-arm": {
-      "version": "0.27.7",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.27.7.tgz",
-      "integrity": "sha512-RkT/YXYBTSULo3+af8Ib0ykH8u2MBh57o7q/DAs3lTJlyVQkgQvlrPTnjIzzRPQyavxtPtfg0EopvDyIt0j1rA==",
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.28.1.tgz",
+      "integrity": "sha512-qVXBOHQS+d5Y722GwJzJUtOLlX7km3CraOaGormF1pDtPd2C/l1SHRPgjLunLGe51Sh5YYWKMFDyV4SxgMQYTQ==",
       "cpu": [
         "arm"
       ],
@@ -1085,9 +1085,9 @@
       }
     },
     "node_modules/@esbuild/linux-arm64": {
-      "version": "0.27.7",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.27.7.tgz",
-      "integrity": "sha512-RZPHBoxXuNnPQO9rvjh5jdkRmVizktkT7TCDkDmQ0W2SwHInKCAV95GRuvdSvA7w4VMwfCjUiPwDi0ZO6Nfe9A==",
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.28.1.tgz",
+      "integrity": "sha512-yHs+0uc8+nvEAfAfxrWQKK5peSNzBc4PegcMO0EJ2hT71uA7vB8Ihg2e77R2P7SG5uYjPbHlLLmve4LLLRCf0g==",
       "cpu": [
         "arm64"
       ],
@@ -1102,9 +1102,9 @@
       }
     },
     "node_modules/@esbuild/linux-ia32": {
-      "version": "0.27.7",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.27.7.tgz",
-      "integrity": "sha512-GA48aKNkyQDbd3KtkplYWT102C5sn/EZTY4XROkxONgruHPU72l+gW+FfF8tf2cFjeHaRbWpOYa/uRBz/Xq1Pg==",
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.28.1.tgz",
+      "integrity": "sha512-d1z4ZuP0ajrfz/FhGT4vv278rX8KnPPJx8i5+AtK7TYbx9Le9F1hyzurZpkEyjkGa9dUGhQow4C1NmeGvqxN2w==",
       "cpu": [
         "ia32"
       ],
@@ -1119,9 +1119,9 @@
       }
     },
     "node_modules/@esbuild/linux-loong64": {
-      "version": "0.27.7",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.27.7.tgz",
-      "integrity": "sha512-a4POruNM2oWsD4WKvBSEKGIiWQF8fZOAsycHOt6JBpZ+JN2n2JH9WAv56SOyu9X5IqAjqSIPTaJkqN8F7XOQ5Q==",
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.28.1.tgz",
+      "integrity": "sha512-M5sRjUVZrkm1OAPR3dlOYzNmN+loZKGVi1VUQGrwuqLcbR6qeAz+famMhjASeH3YVKvZz+zT1jlh/keC3Rj/lg==",
       "cpu": [
         "loong64"
       ],
@@ -1136,9 +1136,9 @@
       }
     },
     "node_modules/@esbuild/linux-mips64el": {
-      "version": "0.27.7",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.27.7.tgz",
-      "integrity": "sha512-KabT5I6StirGfIz0FMgl1I+R1H73Gp0ofL9A3nG3i/cYFJzKHhouBV5VWK1CSgKvVaG4q1RNpCTR2LuTVB3fIw==",
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.28.1.tgz",
+      "integrity": "sha512-mRObBZeHh2OxcBFPWE/FjylkRgZdYuiTR3vaTozquCGOH14iP9oN4x4Ge81CoIDYQrXmIxpFumJBu5MtZpnQJQ==",
       "cpu": [
         "mips64el"
       ],
@@ -1153,9 +1153,9 @@
       }
     },
     "node_modules/@esbuild/linux-ppc64": {
-      "version": "0.27.7",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.27.7.tgz",
-      "integrity": "sha512-gRsL4x6wsGHGRqhtI+ifpN/vpOFTQtnbsupUF5R5YTAg+y/lKelYR1hXbnBdzDjGbMYjVJLJTd2OFmMewAgwlQ==",
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.28.1.tgz",
+      "integrity": "sha512-slScBsMAb3GFDcdrCgLwZtPYRoH2H/youv10QiZyRjmsP48fznoveWytSgCI/R0ZcUgpc0ZhIUEx6LHts8yrfQ==",
       "cpu": [
         "ppc64"
       ],
@@ -1170,9 +1170,9 @@
       }
     },
     "node_modules/@esbuild/linux-riscv64": {
-      "version": "0.27.7",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.27.7.tgz",
-      "integrity": "sha512-hL25LbxO1QOngGzu2U5xeXtxXcW+/GvMN3ejANqXkxZ/opySAZMrc+9LY/WyjAan41unrR3YrmtTsUpwT66InQ==",
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.28.1.tgz",
+      "integrity": "sha512-kw0owk1o0GFETUJyW0jc0G4Yzs0BHZn0JDZ8JRT088vjJYX777BAs1fDGxAC+q831qOs2DTC96mNsG2opdfyyQ==",
       "cpu": [
         "riscv64"
       ],
@@ -1187,9 +1187,9 @@
       }
     },
     "node_modules/@esbuild/linux-s390x": {
-      "version": "0.27.7",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.27.7.tgz",
-      "integrity": "sha512-2k8go8Ycu1Kb46vEelhu1vqEP+UeRVj2zY1pSuPdgvbd5ykAw82Lrro28vXUrRmzEsUV0NzCf54yARIK8r0fdw==",
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.28.1.tgz",
+      "integrity": "sha512-/lAIjX8aYFRByhh6L5rYtPEDRqa9de/4V/juOXcta5frjvzXO4/sqEtyytse0g3zZFuWu5cDN0MkLz2qRDD2Ag==",
       "cpu": [
         "s390x"
       ],
@@ -1204,9 +1204,9 @@
       }
     },
     "node_modules/@esbuild/linux-x64": {
-      "version": "0.27.7",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.27.7.tgz",
-      "integrity": "sha512-hzznmADPt+OmsYzw1EE33ccA+HPdIqiCRq7cQeL1Jlq2gb1+OyWBkMCrYGBJ+sxVzve2ZJEVeePbLM2iEIZSxA==",
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.28.1.tgz",
+      "integrity": "sha512-u/anNYF2mmVOEDwLtnQ1wOr3EZ9sTNGLWrsYGYwHWzGA3Si84IOkHXlbWTD1NB+9/1lcnweYKO54uhxZydNzfA==",
       "cpu": [
         "x64"
       ],
@@ -1221,9 +1221,9 @@
       }
     },
     "node_modules/@esbuild/netbsd-arm64": {
-      "version": "0.27.7",
-      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-arm64/-/netbsd-arm64-0.27.7.tgz",
-      "integrity": "sha512-b6pqtrQdigZBwZxAn1UpazEisvwaIDvdbMbmrly7cDTMFnw/+3lVxxCTGOrkPVnsYIosJJXAsILG9XcQS+Yu6w==",
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-arm64/-/netbsd-arm64-0.28.1.tgz",
+      "integrity": "sha512-oks0DYbLwWMmaakTsCb+zL4E+aHRVLom9IJZOAthMQEPiQmydXHkziYEsGYRx0uNV/IjEKGAV941JzH02pflqw==",
       "cpu": [
         "arm64"
       ],
@@ -1238,9 +1238,9 @@
       }
     },
     "node_modules/@esbuild/netbsd-x64": {
-      "version": "0.27.7",
-      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.27.7.tgz",
-      "integrity": "sha512-OfatkLojr6U+WN5EDYuoQhtM+1xco+/6FSzJJnuWiUw5eVcicbyK3dq5EeV/QHT1uy6GoDhGbFpprUiHUYggrw==",
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.28.1.tgz",
+      "integrity": "sha512-aeL6lAnN89Hz43Mlh1G8ARasbuoYvSITDEx0tHh5b7jJnHcssqgjy9Yx430GDpmCa6OyrKoS0aNRjKundRizGg==",
       "cpu": [
         "x64"
       ],
@@ -1255,9 +1255,9 @@
       }
     },
     "node_modules/@esbuild/openbsd-arm64": {
-      "version": "0.27.7",
-      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.27.7.tgz",
-      "integrity": "sha512-AFuojMQTxAz75Fo8idVcqoQWEHIXFRbOc1TrVcFSgCZtQfSdc1RXgB3tjOn/krRHENUB4j00bfGjyl2mJrU37A==",
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.28.1.tgz",
+      "integrity": "sha512-MEFJe5C3R8pwXdZ5Y21oo6m7ePiS0d9pWucn99O/wvyJZChoIQKrQDxKrGeW8F5+T0okTHesAmDeiHDTIq0V/Q==",
       "cpu": [
         "arm64"
       ],
@@ -1272,9 +1272,9 @@
       }
     },
     "node_modules/@esbuild/openbsd-x64": {
-      "version": "0.27.7",
-      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.27.7.tgz",
-      "integrity": "sha512-+A1NJmfM8WNDv5CLVQYJ5PshuRm/4cI6WMZRg1by1GwPIQPCTs1GLEUHwiiQGT5zDdyLiRM/l1G0Pv54gvtKIg==",
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.28.1.tgz",
+      "integrity": "sha512-i/ZLIOafE0Z8cI/XANJAixoJL/uRAoS2xOA3rb0xN+KK0K177cMAsQYkzHtBrtMXAKuAc7HGgcWiZ/sRC1Nxgw==",
       "cpu": [
         "x64"
       ],
@@ -1289,9 +1289,9 @@
       }
     },
     "node_modules/@esbuild/openharmony-arm64": {
-      "version": "0.27.7",
-      "resolved": "https://registry.npmjs.org/@esbuild/openharmony-arm64/-/openharmony-arm64-0.27.7.tgz",
-      "integrity": "sha512-+KrvYb/C8zA9CU/g0sR6w2RBw7IGc5J2BPnc3dYc5VJxHCSF1yNMxTV5LQ7GuKteQXZtspjFbiuW5/dOj7H4Yw==",
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/openharmony-arm64/-/openharmony-arm64-0.28.1.tgz",
+      "integrity": "sha512-ge+Z7EXFNt2BO1oAMsVpiQ8EwndV9i1xXerAeTIK7AtPs3bKFXQM7nlRxDSIUIMeueR1CNXxqztLzdNeReKBJg==",
       "cpu": [
         "arm64"
       ],
@@ -1306,9 +1306,9 @@
       }
     },
     "node_modules/@esbuild/sunos-x64": {
-      "version": "0.27.7",
-      "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.27.7.tgz",
-      "integrity": "sha512-ikktIhFBzQNt/QDyOL580ti9+5mL/YZeUPKU2ivGtGjdTYoqz6jObj6nOMfhASpS4GU4Q/Clh1QtxWAvcYKamA==",
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.28.1.tgz",
+      "integrity": "sha512-BEjgtECkL3vY+SaSQ6nzVfiALUeFxpawyp8Jmf5PtYhf1Ug40N1h/hxlhts+f1FvSvarEigdxS3BlSMI2PJLcQ==",
       "cpu": [
         "x64"
       ],
@@ -1323,9 +1323,9 @@
       }
     },
     "node_modules/@esbuild/win32-arm64": {
-      "version": "0.27.7",
-      "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.27.7.tgz",
-      "integrity": "sha512-7yRhbHvPqSpRUV7Q20VuDwbjW5kIMwTHpptuUzV+AA46kiPze5Z7qgt6CLCK3pWFrHeNfDd1VKgyP4O+ng17CA==",
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.28.1.tgz",
+      "integrity": "sha512-lCv9eK/H6ZJWbE7bh2nw54CZ9M2nupBxJcTsdk/QQnWkdSjKGuxmmH8/GWrlT1eMmZfn4dGcCjRte397WqfQXA==",
       "cpu": [
         "arm64"
       ],
@@ -1340,9 +1340,9 @@
       }
     },
     "node_modules/@esbuild/win32-ia32": {
-      "version": "0.27.7",
-      "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.27.7.tgz",
-      "integrity": "sha512-SmwKXe6VHIyZYbBLJrhOoCJRB/Z1tckzmgTLfFYOfpMAx63BJEaL9ExI8x7v0oAO3Zh6D/Oi1gVxEYr5oUCFhw==",
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.28.1.tgz",
+      "integrity": "sha512-zvb/mB2bSCoJOpoCBgYKKpX6YM6mJBlBUVUtVj41DlZJVEB6/0CKlRYxP5wWl1C1ILiCoAU5wZZ4q1P3qeS6Eg==",
       "cpu": [
         "ia32"
       ],
@@ -1357,9 +1357,9 @@
       }
     },
     "node_modules/@esbuild/win32-x64": {
-      "version": "0.27.7",
-      "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.27.7.tgz",
-      "integrity": "sha512-56hiAJPhwQ1R4i+21FVF7V8kSD5zZTdHcVuRFMW0hn753vVfQN8xlx4uOPT4xoGH0Z/oVATuR82AiqSTDIpaHg==",
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.28.1.tgz",
+      "integrity": "sha512-bm4Mowrv+GXMlpWX++EcXw/iLyd1o3+bJkC2DkWXYVvgZCqD/bSj9ctZeAMC3cIxgjRVR2Dufaiu4YPxr5gW1A==",
       "cpu": [
         "x64"
       ],
@@ -2194,9 +2194,9 @@
       }
     },
     "node_modules/@grpc/grpc-js": {
-      "version": "1.9.15",
-      "resolved": "https://registry.npmjs.org/@grpc/grpc-js/-/grpc-js-1.9.15.tgz",
-      "integrity": "sha512-nqE7Hc0AzI+euzUwDAy0aY5hCp10r734gMGRdU+qOPX0XSceI2ULrcXB5U2xSc5VkWwalCj4M7GzCAygZl2KoQ==",
+      "version": "1.9.16",
+      "resolved": "https://registry.npmjs.org/@grpc/grpc-js/-/grpc-js-1.9.16.tgz",
+      "integrity": "sha512-wE4Ut/olIzfKqp631XrG+wbF0v1vWFN4YL9FyXC2LJiG33DsV7PLzURjrCvY/6je2ntdRkeLpPDluzSRGaVltQ==",
       "license": "Apache-2.0",
       "dependencies": {
         "@grpc/proto-loader": "^0.7.8",
@@ -6894,6 +6894,106 @@
         "dequal": "^2.0.3"
       }
     },
+    "node_modules/array-buffer-byte-length": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/array-buffer-byte-length/-/array-buffer-byte-length-1.0.2.tgz",
+      "integrity": "sha512-LHE+8BuR7RYGDKvnrmcuSq3tDcKv9OFEXQt/HpbZhY7V6h0zlUXutnAD82GiFx9rdieCMjkvtcsPqBwgUl1Iiw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.3",
+        "is-array-buffer": "^3.0.5"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/array-includes": {
+      "version": "3.1.9",
+      "resolved": "https://registry.npmjs.org/array-includes/-/array-includes-3.1.9.tgz",
+      "integrity": "sha512-FmeCCAenzH0KH381SPT5FZmiA/TmpndpcaShhfgEN9eCVjnFBqq3l1xrI42y8+PPLI6hypzou4GXw00WHmPBLQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.4",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.24.0",
+        "es-object-atoms": "^1.1.1",
+        "get-intrinsic": "^1.3.0",
+        "is-string": "^1.1.1",
+        "math-intrinsics": "^1.1.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/array.prototype.flat": {
+      "version": "1.3.3",
+      "resolved": "https://registry.npmjs.org/array.prototype.flat/-/array.prototype.flat-1.3.3.tgz",
+      "integrity": "sha512-rwG/ja1neyLqCuGZ5YYrznA62D4mZXg0i1cIskIUKSiqF3Cje9/wXAls9B9s1Wa2fomMsIv8czB8jZcPmxCXFg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.5",
+        "es-shim-unscopables": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/array.prototype.flatmap": {
+      "version": "1.3.3",
+      "resolved": "https://registry.npmjs.org/array.prototype.flatmap/-/array.prototype.flatmap-1.3.3.tgz",
+      "integrity": "sha512-Y7Wt51eKJSyi80hFrJCePGGNo5ktJCslFuboqJsbf57CCPcm5zztluPlc4/aD8sWsKvlwatezpV4U1efk8kpjg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.5",
+        "es-shim-unscopables": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/arraybuffer.prototype.slice": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/arraybuffer.prototype.slice/-/arraybuffer.prototype.slice-1.0.4.tgz",
+      "integrity": "sha512-BNoCY6SXXPQ7gF2opIP4GBE+Xw7U+pHMYKuzjgCN3GwiaIR09UUeKfheyIry77QtrCBlC0KK0q5/TER/tYh3PQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "array-buffer-byte-length": "^1.0.1",
+        "call-bind": "^1.0.8",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.5",
+        "es-errors": "^1.3.0",
+        "get-intrinsic": "^1.2.6",
+        "is-array-buffer": "^3.0.4"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/assertion-error": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/assertion-error/-/assertion-error-2.0.1.tgz",
@@ -6916,6 +7016,23 @@
         "node": ">=4"
       }
     },
+    "node_modules/ast-types-flow": {
+      "version": "0.0.8",
+      "resolved": "https://registry.npmjs.org/ast-types-flow/-/ast-types-flow-0.0.8.tgz",
+      "integrity": "sha512-OH/2E5Fg20h2aPrbe+QL8JZQFko0YZaF+j4mnQ7BGhfavO7OpSLa8a0y9sBwomHdSbkhTS8TQNayBfnW5DwbvQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/async-function": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/async-function/-/async-function-1.0.0.tgz",
+      "integrity": "sha512-hsU18Ae8CDTR6Kgu9DYf0EbCr/a5iGL0rytQDobUcdpYOKokk8LEjVphnXkDkgpi0wYVsqrXuP0bZxJaTqdgoA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/attr-accept": {
       "version": "2.2.5",
       "resolved": "https://registry.npmjs.org/attr-accept/-/attr-accept-2.2.5.tgz",
@@ -6925,6 +7042,42 @@
         "node": ">=4"
       }
     },
+    "node_modules/available-typed-arrays": {
+      "version": "1.0.7",
+      "resolved": "https://registry.npmjs.org/available-typed-arrays/-/available-typed-arrays-1.0.7.tgz",
+      "integrity": "sha512-wvUjBtSGN7+7SjNpq/9M2Tg350UZD3q62IFZLbRAR1bSMlCo1ZaeW+BJ+D090e4hIIZLBcTDWe4Mh4jvUDajzQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "possible-typed-array-names": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/axe-core": {
+      "version": "4.12.1",
+      "resolved": "https://registry.npmjs.org/axe-core/-/axe-core-4.12.1.tgz",
+      "integrity": "sha512-s7iGf5GaVMxEG0ENN9x+xTr7GFZCb1ZP/1uATUpCEK2X78nDB3RwbtFCo9pGAf9ru+VwoQ464DkaLEeRM08wJA==",
+      "dev": true,
+      "license": "MPL-2.0",
+      "engines": {
+        "node": ">=4"
+      }
+    },
+    "node_modules/axobject-query": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/axobject-query/-/axobject-query-4.1.0.tgz",
+      "integrity": "sha512-qIj0G9wZbMGNLjLmg1PT6v2mE9AH2zlnADJD/2tC6E00hgmhUOfEB6greHPAfLRSufHqROIUTkw6E+M3lH0PTQ==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/babel-dead-code-elimination": {
       "version": "1.0.12",
       "resolved": "https://registry.npmjs.org/babel-dead-code-elimination/-/babel-dead-code-elimination-1.0.12.tgz",
@@ -7121,6 +7274,25 @@
         "node": ">= 0.8"
       }
     },
+    "node_modules/call-bind": {
+      "version": "1.0.9",
+      "resolved": "https://registry.npmjs.org/call-bind/-/call-bind-1.0.9.tgz",
+      "integrity": "sha512-a/hy+pNsFUTR+Iz8TCJvXudKVLAnz/DyeSUo10I5yvFDQJBFU2s9uqQpoSrJlroHUKoKqzg+epxyP9lqFdzfBQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind-apply-helpers": "^1.0.2",
+        "es-define-property": "^1.0.1",
+        "get-intrinsic": "^1.3.0",
+        "set-function-length": "^1.2.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/call-bind-apply-helpers": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/call-bind-apply-helpers/-/call-bind-apply-helpers-1.0.2.tgz",
@@ -7679,6 +7851,13 @@
         "node": ">=12"
       }
     },
+    "node_modules/damerau-levenshtein": {
+      "version": "1.0.8",
+      "resolved": "https://registry.npmjs.org/damerau-levenshtein/-/damerau-levenshtein-1.0.8.tgz",
+      "integrity": "sha512-sdQSFB7+llfUcQHUQO3+B8ERRj0Oa4w9POWMI/puGtuf7gFywGmkaLCElnudfTiKZV+NvHqL0ifzdrI8Ro7ESA==",
+      "dev": true,
+      "license": "BSD-2-Clause"
+    },
     "node_modules/data-uri-to-buffer": {
       "version": "4.0.1",
       "resolved": "https://registry.npmjs.org/data-uri-to-buffer/-/data-uri-to-buffer-4.0.1.tgz",
@@ -7702,6 +7881,60 @@
         "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
       }
     },
+    "node_modules/data-view-buffer": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/data-view-buffer/-/data-view-buffer-1.0.2.tgz",
+      "integrity": "sha512-EmKO5V3OLXh1rtK2wgXRansaK1/mtVdTUEiEI0W8RkvgT05kfxaH29PliLnpLP73yYO6142Q72QNa8Wx/A5CqQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.3",
+        "es-errors": "^1.3.0",
+        "is-data-view": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/data-view-byte-length": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/data-view-byte-length/-/data-view-byte-length-1.0.2.tgz",
+      "integrity": "sha512-tuhGbE6CfTM9+5ANGf+oQb72Ky/0+s3xKUpHvShfiz2RxMFgFPjsXuRLBVMtvMs15awe45SRb83D6wH4ew6wlQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.3",
+        "es-errors": "^1.3.0",
+        "is-data-view": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/inspect-js"
+      }
+    },
+    "node_modules/data-view-byte-offset": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/data-view-byte-offset/-/data-view-byte-offset-1.0.1.tgz",
+      "integrity": "sha512-BS8PfmtDGnrgYdOonGZQdLZslWIeCGFP9tpan0hi1Co2Zr2NKADsvGYA8XxuG/4UWgJ6Cjtv+YJnB6MM69QGlQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.2",
+        "es-errors": "^1.3.0",
+        "is-data-view": "^1.0.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/debug": {
       "version": "4.4.3",
       "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.3.tgz",
@@ -7790,6 +8023,24 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/define-data-property": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/define-data-property/-/define-data-property-1.1.4.tgz",
+      "integrity": "sha512-rBMvIzlpA8v6E+SJZoo++HAYqsLrkg7MSfIinMPFhmkorw7X+dOXVJQs+QT69zGkzMyfDnIMN2Wid1+NbL3T+A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "es-define-property": "^1.0.0",
+        "es-errors": "^1.3.0",
+        "gopd": "^1.0.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/define-lazy-prop": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/define-lazy-prop/-/define-lazy-prop-3.0.0.tgz",
@@ -7802,6 +8053,24 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/define-properties": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/define-properties/-/define-properties-1.2.1.tgz",
+      "integrity": "sha512-8QmQKqEASLd5nx0U1B1okLElbUuuttJ/AnYmRXbbbGDWh6uS208EjD4Xqq/I9wK7u0v6O08XhTWnt5XtEbR6Dg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "define-data-property": "^1.0.1",
+        "has-property-descriptors": "^1.0.0",
+        "object-keys": "^1.1.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/depd": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/depd/-/depd-2.0.0.tgz",
@@ -7990,6 +8259,75 @@
         "is-arrayish": "^0.2.1"
       }
     },
+    "node_modules/es-abstract": {
+      "version": "1.24.2",
+      "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.24.2.tgz",
+      "integrity": "sha512-2FpH9Q5i2RRwyEP1AylXe6nYLR5OhaJTZwmlcP0dL/+JCbgg7yyEo/sEK6HeGZRf3dFpWwThaRHVApXSkW3xeg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "array-buffer-byte-length": "^1.0.2",
+        "arraybuffer.prototype.slice": "^1.0.4",
+        "available-typed-arrays": "^1.0.7",
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.4",
+        "data-view-buffer": "^1.0.2",
+        "data-view-byte-length": "^1.0.2",
+        "data-view-byte-offset": "^1.0.1",
+        "es-define-property": "^1.0.1",
+        "es-errors": "^1.3.0",
+        "es-object-atoms": "^1.1.1",
+        "es-set-tostringtag": "^2.1.0",
+        "es-to-primitive": "^1.3.0",
+        "function.prototype.name": "^1.1.8",
+        "get-intrinsic": "^1.3.0",
+        "get-proto": "^1.0.1",
+        "get-symbol-description": "^1.1.0",
+        "globalthis": "^1.0.4",
+        "gopd": "^1.2.0",
+        "has-property-descriptors": "^1.0.2",
+        "has-proto": "^1.2.0",
+        "has-symbols": "^1.1.0",
+        "hasown": "^2.0.2",
+        "internal-slot": "^1.1.0",
+        "is-array-buffer": "^3.0.5",
+        "is-callable": "^1.2.7",
+        "is-data-view": "^1.0.2",
+        "is-negative-zero": "^2.0.3",
+        "is-regex": "^1.2.1",
+        "is-set": "^2.0.3",
+        "is-shared-array-buffer": "^1.0.4",
+        "is-string": "^1.1.1",
+        "is-typed-array": "^1.1.15",
+        "is-weakref": "^1.1.1",
+        "math-intrinsics": "^1.1.0",
+        "object-inspect": "^1.13.4",
+        "object-keys": "^1.1.1",
+        "object.assign": "^4.1.7",
+        "own-keys": "^1.0.1",
+        "regexp.prototype.flags": "^1.5.4",
+        "safe-array-concat": "^1.1.3",
+        "safe-push-apply": "^1.0.0",
+        "safe-regex-test": "^1.1.0",
+        "set-proto": "^1.0.0",
+        "stop-iteration-iterator": "^1.1.0",
+        "string.prototype.trim": "^1.2.10",
+        "string.prototype.trimend": "^1.0.9",
+        "string.prototype.trimstart": "^1.0.8",
+        "typed-array-buffer": "^1.0.3",
+        "typed-array-byte-length": "^1.0.3",
+        "typed-array-byte-offset": "^1.0.4",
+        "typed-array-length": "^1.0.7",
+        "unbox-primitive": "^1.1.0",
+        "which-typed-array": "^1.1.19"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/es-define-property": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/es-define-property/-/es-define-property-1.0.1.tgz",
@@ -8016,9 +8354,9 @@
       "license": "MIT"
     },
     "node_modules/es-object-atoms": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/es-object-atoms/-/es-object-atoms-1.1.1.tgz",
-      "integrity": "sha512-FGgH2h8zKNim9ljj7dankFPcICIK9Cp5bm+c2gQSYePhpaG5+esrLODihIorn+Pe6FGJzWhXQotPv73jTaldXA==",
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/es-object-atoms/-/es-object-atoms-1.1.2.tgz",
+      "integrity": "sha512-HWcBoN6NileqtSydK2FqHbS/LoDd2pqrnQHLyJzBj4kOp/ky2MWMN694xOfkK8/SnUsW2DH7EfyVlydKCsm1Zw==",
       "license": "MIT",
       "dependencies": {
         "es-errors": "^1.3.0"
@@ -8027,6 +8365,53 @@
         "node": ">= 0.4"
       }
     },
+    "node_modules/es-set-tostringtag": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/es-set-tostringtag/-/es-set-tostringtag-2.1.0.tgz",
+      "integrity": "sha512-j6vWzfrGVfyXxge+O0x5sh6cvxAog0a/4Rdd2K36zCMV5eJ+/+tOAngRO8cODMNWbVRdVlmGZQL2YS3yR8bIUA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0",
+        "get-intrinsic": "^1.2.6",
+        "has-tostringtag": "^1.0.2",
+        "hasown": "^2.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/es-shim-unscopables": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/es-shim-unscopables/-/es-shim-unscopables-1.1.0.tgz",
+      "integrity": "sha512-d9T8ucsEhh8Bi1woXCf+TIKDIROLG5WCkxg8geBCbvk22kzwC5G2OnXVMO6FUsvQlgUUXQ2itephWDLqDzbeCw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "hasown": "^2.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/es-to-primitive": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/es-to-primitive/-/es-to-primitive-1.3.0.tgz",
+      "integrity": "sha512-w+5mJ3GuFL+NjVtJlvydShqE1eN3h3PbI7/5LAsYJP/2qtuMXjfL2LpHSRqo4b4eSF5K/DH1JXKUAHSB2UW50g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "is-callable": "^1.2.7",
+        "is-date-object": "^1.0.5",
+        "is-symbol": "^1.0.4"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/es-toolkit": {
       "version": "1.45.1",
       "resolved": "https://registry.npmjs.org/es-toolkit/-/es-toolkit-1.45.1.tgz",
@@ -8038,9 +8423,9 @@
       ]
     },
     "node_modules/esbuild": {
-      "version": "0.27.7",
-      "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.27.7.tgz",
-      "integrity": "sha512-IxpibTjyVnmrIQo5aqNpCgoACA/dTKLTlhMHihVHhdkxKyPO1uBBthumT0rdHmcsk9uMonIWS0m4FljWzILh3w==",
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.28.1.tgz",
+      "integrity": "sha512-HrJrvZv5ayxBzPfwphOoNzkzOIIlifzk0KJrGK2c8R4+LKpMtpYLQeUdjnwjWv/LZlkH2laZk+4w78pi99D4Vw==",
       "dev": true,
       "hasInstallScript": true,
       "license": "MIT",
@@ -8051,32 +8436,32 @@
         "node": ">=18"
       },
       "optionalDependencies": {
-        "@esbuild/aix-ppc64": "0.27.7",
-        "@esbuild/android-arm": "0.27.7",
-        "@esbuild/android-arm64": "0.27.7",
-        "@esbuild/android-x64": "0.27.7",
-        "@esbuild/darwin-arm64": "0.27.7",
-        "@esbuild/darwin-x64": "0.27.7",
-        "@esbuild/freebsd-arm64": "0.27.7",
-        "@esbuild/freebsd-x64": "0.27.7",
-        "@esbuild/linux-arm": "0.27.7",
-        "@esbuild/linux-arm64": "0.27.7",
-        "@esbuild/linux-ia32": "0.27.7",
-        "@esbuild/linux-loong64": "0.27.7",
-        "@esbuild/linux-mips64el": "0.27.7",
-        "@esbuild/linux-ppc64": "0.27.7",
-        "@esbuild/linux-riscv64": "0.27.7",
-        "@esbuild/linux-s390x": "0.27.7",
-        "@esbuild/linux-x64": "0.27.7",
-        "@esbuild/netbsd-arm64": "0.27.7",
-        "@esbuild/netbsd-x64": "0.27.7",
-        "@esbuild/openbsd-arm64": "0.27.7",
-        "@esbuild/openbsd-x64": "0.27.7",
-        "@esbuild/openharmony-arm64": "0.27.7",
-        "@esbuild/sunos-x64": "0.27.7",
-        "@esbuild/win32-arm64": "0.27.7",
-        "@esbuild/win32-ia32": "0.27.7",
-        "@esbuild/win32-x64": "0.27.7"
+        "@esbuild/aix-ppc64": "0.28.1",
+        "@esbuild/android-arm": "0.28.1",
+        "@esbuild/android-arm64": "0.28.1",
+        "@esbuild/android-x64": "0.28.1",
+        "@esbuild/darwin-arm64": "0.28.1",
+        "@esbuild/darwin-x64": "0.28.1",
+        "@esbuild/freebsd-arm64": "0.28.1",
+        "@esbuild/freebsd-x64": "0.28.1",
+        "@esbuild/linux-arm": "0.28.1",
+        "@esbuild/linux-arm64": "0.28.1",
+        "@esbuild/linux-ia32": "0.28.1",
+        "@esbuild/linux-loong64": "0.28.1",
+        "@esbuild/linux-mips64el": "0.28.1",
+        "@esbuild/linux-ppc64": "0.28.1",
+        "@esbuild/linux-riscv64": "0.28.1",
+        "@esbuild/linux-s390x": "0.28.1",
+        "@esbuild/linux-x64": "0.28.1",
+        "@esbuild/netbsd-arm64": "0.28.1",
+        "@esbuild/netbsd-x64": "0.28.1",
+        "@esbuild/openbsd-arm64": "0.28.1",
+        "@esbuild/openbsd-x64": "0.28.1",
+        "@esbuild/openharmony-arm64": "0.28.1",
+        "@esbuild/sunos-x64": "0.28.1",
+        "@esbuild/win32-arm64": "0.28.1",
+        "@esbuild/win32-ia32": "0.28.1",
+        "@esbuild/win32-x64": "0.28.1"
       }
     },
     "node_modules/escalade": {
@@ -8167,6 +8552,53 @@
         }
       }
     },
+    "node_modules/eslint-plugin-jsx-a11y": {
+      "version": "6.10.2",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-jsx-a11y/-/eslint-plugin-jsx-a11y-6.10.2.tgz",
+      "integrity": "sha512-scB3nz4WmG75pV8+3eRUQOHZlNSUhFNq37xnpgRkCCELU3XMvXAxLk1eqWWyE22Ki4Q01Fnsw9BA3cJHDPgn2Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "aria-query": "^5.3.2",
+        "array-includes": "^3.1.8",
+        "array.prototype.flatmap": "^1.3.2",
+        "ast-types-flow": "^0.0.8",
+        "axe-core": "^4.10.0",
+        "axobject-query": "^4.1.0",
+        "damerau-levenshtein": "^1.0.8",
+        "emoji-regex": "^9.2.2",
+        "hasown": "^2.0.2",
+        "jsx-ast-utils": "^3.3.5",
+        "language-tags": "^1.0.9",
+        "minimatch": "^3.1.2",
+        "object.fromentries": "^2.0.8",
+        "safe-regex-test": "^1.0.3",
+        "string.prototype.includes": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=4.0"
+      },
+      "peerDependencies": {
+        "eslint": "^3 || ^4 || ^5 || ^6 || ^7 || ^8 || ^9"
+      }
+    },
+    "node_modules/eslint-plugin-jsx-a11y/node_modules/aria-query": {
+      "version": "5.3.2",
+      "resolved": "https://registry.npmjs.org/aria-query/-/aria-query-5.3.2.tgz",
+      "integrity": "sha512-COROpnaoap1E2F000S62r6A60uHZnmlvomhfyT2DlTcrY1OrBKn2UhH7qn5wTC9zMvD0AY7csdPSNwKP+7WiQw==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/eslint-plugin-jsx-a11y/node_modules/emoji-regex": {
+      "version": "9.2.2",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-9.2.2.tgz",
+      "integrity": "sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/eslint-plugin-react-hooks": {
       "version": "7.1.1",
       "resolved": "https://registry.npmjs.org/eslint-plugin-react-hooks/-/eslint-plugin-react-hooks-7.1.1.tgz",
@@ -8789,13 +9221,29 @@
         "unicode-trie": "^2.0.0"
       }
     },
-    "node_modules/formdata-polyfill": {
-      "version": "4.0.10",
-      "resolved": "https://registry.npmjs.org/formdata-polyfill/-/formdata-polyfill-4.0.10.tgz",
-      "integrity": "sha512-buewHzMvYL29jdeQTVILecSaZKnt/RJWjoZCF5OW60Z67/GmSLBkOFM7qh1PI3zFNtJbaZL5eQu1vLfazOwj4g==",
+    "node_modules/for-each": {
+      "version": "0.3.5",
+      "resolved": "https://registry.npmjs.org/for-each/-/for-each-0.3.5.tgz",
+      "integrity": "sha512-dKx12eRCVIzqCxFGplyFKJMPvLEWgmNtUrpTiJIR5u97zEhRG8ySrtboPHZXx7daLxQVrl643cTzbab2tkQjxg==",
+      "dev": true,
       "license": "MIT",
       "dependencies": {
-        "fetch-blob": "^3.1.2"
+        "is-callable": "^1.2.7"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/formdata-polyfill": {
+      "version": "4.0.10",
+      "resolved": "https://registry.npmjs.org/formdata-polyfill/-/formdata-polyfill-4.0.10.tgz",
+      "integrity": "sha512-buewHzMvYL29jdeQTVILecSaZKnt/RJWjoZCF5OW60Z67/GmSLBkOFM7qh1PI3zFNtJbaZL5eQu1vLfazOwj4g==",
+      "license": "MIT",
+      "dependencies": {
+        "fetch-blob": "^3.1.2"
       },
       "engines": {
         "node": ">=12.20.0"
@@ -8884,12 +9332,56 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/function.prototype.name": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/function.prototype.name/-/function.prototype.name-1.2.0.tgz",
+      "integrity": "sha512-jObKIik1P2QjPHP5nz5BaOtUlfgS0fWo8IUByNXkM+o+02sJOi94em77GwJKQSJ3gfPHdgzLNrHc1uokV4P/ew==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.9",
+        "call-bound": "^1.0.4",
+        "es-define-property": "^1.0.1",
+        "es-errors": "^1.3.0",
+        "functions-have-names": "^1.2.3",
+        "has-property-descriptors": "^1.0.2",
+        "hasown": "^2.0.4",
+        "is-callable": "^1.2.7",
+        "is-document.all": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/functions-have-names": {
+      "version": "1.2.3",
+      "resolved": "https://registry.npmjs.org/functions-have-names/-/functions-have-names-1.2.3.tgz",
+      "integrity": "sha512-xckBUXyTIqT97tq2x2AMb+g163b5JFysYk0x4qxNFwbfQkmNZoiRHb6sPzI9/QV33WeuvVYBUIiD4NzNIyqaRQ==",
+      "dev": true,
+      "license": "MIT",
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/fuzzysort": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/fuzzysort/-/fuzzysort-3.1.0.tgz",
       "integrity": "sha512-sR9BNCjBg6LNgwvxlBd0sBABvQitkLzoVY9MYYROQVX/FvfJ4Mai9LsGhDgd8qYdds0bY77VzYd5iuB+v5rwQQ==",
       "license": "MIT"
     },
+    "node_modules/generator-function": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/generator-function/-/generator-function-2.0.1.tgz",
+      "integrity": "sha512-SFdFmIJi+ybC0vjlHN0ZGVGHc3lgE0DxPAT0djjVg+kjOnSqclqmj0KQ7ykTOLP6YxoqOvuAODGdcHJn+43q3g==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/gensync": {
       "version": "1.0.0-beta.2",
       "resolved": "https://registry.npmjs.org/gensync/-/gensync-1.0.0-beta.2.tgz",
@@ -8994,17 +9486,22 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
-    "node_modules/get-tsconfig": {
-      "version": "4.14.0",
-      "resolved": "https://registry.npmjs.org/get-tsconfig/-/get-tsconfig-4.14.0.tgz",
-      "integrity": "sha512-yTb+8DXzDREzgvYmh6s9vHsSVCHeC0G3PI5bEXNBHtmshPnO+S5O7qgLEOn0I5QvMy6kpZN8K1NKGyilLb93wA==",
+    "node_modules/get-symbol-description": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/get-symbol-description/-/get-symbol-description-1.1.0.tgz",
+      "integrity": "sha512-w9UMqWwJxHNOvoNzSJ2oPF5wvYcvP7jUvYzhp67yEhTi17ZDBBC1z9pTdGuzjD+EFIqLSYRweZjqfiPzQ06Ebg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "resolve-pkg-maps": "^1.0.0"
+        "call-bound": "^1.0.3",
+        "es-errors": "^1.3.0",
+        "get-intrinsic": "^1.2.6"
+      },
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
-        "url": "https://github.com/privatenumber/get-tsconfig?sponsor=1"
+        "url": "https://github.com/sponsors/ljharb"
       }
     },
     "node_modules/glob-parent": {
@@ -9032,6 +9529,23 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/globalthis": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/globalthis/-/globalthis-1.0.4.tgz",
+      "integrity": "sha512-DpLKbNU4WylpxJykQujfCcwYWiV/Jhm50Goo0wrVILAv5jOr9d+H+UR3PhSCD2rCCEIg0uc+G+muBTwD54JhDQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "define-properties": "^1.2.1",
+        "gopd": "^1.0.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/goober": {
       "version": "2.1.18",
       "resolved": "https://registry.npmjs.org/goober/-/goober-2.1.18.tgz",
@@ -9069,6 +9583,19 @@
         "node": "^12.22.0 || ^14.16.0 || ^16.0.0 || >=17.0.0"
       }
     },
+    "node_modules/has-bigints": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/has-bigints/-/has-bigints-1.1.0.tgz",
+      "integrity": "sha512-R3pbpkcIqv2Pm3dUwgjclDRVmWpTJW2DcMzcIhEXEx1oh/CEMObMm3KLmRJOdvhM7o4uQBnwr8pzRK2sJWIqfg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/has-flag": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
@@ -9079,6 +9606,35 @@
         "node": ">=8"
       }
     },
+    "node_modules/has-property-descriptors": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/has-property-descriptors/-/has-property-descriptors-1.0.2.tgz",
+      "integrity": "sha512-55JNKuIW+vq4Ke1BjOTjM2YctQIvCT7GFzHwmfZPGo5wnrgkid0YQtnAleFSqumZm4az3n2BS+erby5ipJdgrg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "es-define-property": "^1.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/has-proto": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/has-proto/-/has-proto-1.2.0.tgz",
+      "integrity": "sha512-KIL7eQPfHQRC8+XluaIw7BHUwwqL19bQn4hzNgdr+1wXoU0KKj6rufu47lhY7KbJR2C6T6+PfyN0Ea7wkSS+qQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "dunder-proto": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/has-symbols": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.1.0.tgz",
@@ -9091,10 +9647,26 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/has-tostringtag": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/has-tostringtag/-/has-tostringtag-1.0.2.tgz",
+      "integrity": "sha512-NqADB8VjPFLM2V0VvHUewwwsw0ZWBaIdgo+ieHtK3hasLz4qeCRjYcqfB6AQrBggRKppKF8L52/VqdVsO47Dlw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "has-symbols": "^1.0.3"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/hasown": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.3.tgz",
-      "integrity": "sha512-ej4AhfhfL2Q2zpMmLo7U1Uv9+PyhIZpgQLGT1F9miIGmiCJIoCgSmczFdrc97mWT4kVY72KA+WnnhJ5pghSvSg==",
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.4.tgz",
+      "integrity": "sha512-T2UbfbBEF32wiepXIsMlTW9+dDYC6wMh/t/vYA4tuOMKqWz/n3vr1NFSxQiyP+zk2mXsoMA/i/7qV6LKut1t1A==",
       "license": "MIT",
       "dependencies": {
         "function-bind": "^1.1.2"
@@ -9310,6 +9882,21 @@
       "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==",
       "license": "ISC"
     },
+    "node_modules/internal-slot": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/internal-slot/-/internal-slot-1.1.0.tgz",
+      "integrity": "sha512-4gd7VpWNQNB4UKKCFFVcp1AVv+FMOgs9NKzjHKusc8jTMhd5eL1NqQqOpE0KzMds804/yHlglp3uxgluOqAPLw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0",
+        "hasown": "^2.0.2",
+        "side-channel": "^1.1.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/internmap": {
       "version": "2.0.3",
       "resolved": "https://registry.npmjs.org/internmap/-/internmap-2.0.3.tgz",
@@ -9337,12 +9924,66 @@
         "node": ">= 0.10"
       }
     },
+    "node_modules/is-array-buffer": {
+      "version": "3.0.5",
+      "resolved": "https://registry.npmjs.org/is-array-buffer/-/is-array-buffer-3.0.5.tgz",
+      "integrity": "sha512-DDfANUiiG2wC1qawP66qlTugJeL5HyzMpfr8lLK+jMQirGzNod0B12cFB/9q838Ru27sBwfw78/rdoU7RERz6A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.3",
+        "get-intrinsic": "^1.2.6"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/is-arrayish": {
       "version": "0.2.1",
       "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz",
       "integrity": "sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg==",
       "license": "MIT"
     },
+    "node_modules/is-async-function": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/is-async-function/-/is-async-function-2.1.1.tgz",
+      "integrity": "sha512-9dgM/cZBnNvjzaMYHVoxxfPj2QXt22Ev7SuuPrs+xav0ukGB0S6d4ydZdEiM48kLx5kDV+QBPrpVnFyefL8kkQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "async-function": "^1.0.0",
+        "call-bound": "^1.0.3",
+        "get-proto": "^1.0.1",
+        "has-tostringtag": "^1.0.2",
+        "safe-regex-test": "^1.1.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-bigint": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/is-bigint/-/is-bigint-1.1.0.tgz",
+      "integrity": "sha512-n4ZT37wG78iz03xPRKJrHTdZbe3IicyucEtdRsV5yglwc3GyUfbAfpSeD0FJ41NbUNSt5wbhqfp1fS+BgnvDFQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "has-bigints": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/is-binary-path": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz",
@@ -9356,6 +9997,71 @@
         "node": ">=8"
       }
     },
+    "node_modules/is-boolean-object": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/is-boolean-object/-/is-boolean-object-1.2.2.tgz",
+      "integrity": "sha512-wa56o2/ElJMYqjCjGkXri7it5FbebW5usLw/nPmCMs5DeZ7eziSYZhSmPRn0txqeW4LnAmQQU7FgqLpsEFKM4A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.3",
+        "has-tostringtag": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-callable": {
+      "version": "1.2.7",
+      "resolved": "https://registry.npmjs.org/is-callable/-/is-callable-1.2.7.tgz",
+      "integrity": "sha512-1BC0BVFhS/p0qtw6enp8e+8OD0UrK0oFLztSjNzhcKA3WDuJxxAPXzPuPtKkjEY9UUoEWlX/8fgKeu2S8i9JTA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-data-view": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/is-data-view/-/is-data-view-1.0.2.tgz",
+      "integrity": "sha512-RKtWF8pGmS87i2D6gqQu/l7EYRlVdfzemCJN/P3UOs//x1QE7mfhvzHIApBTRf7axvT6DMGwSwBXYCT0nfB9xw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.2",
+        "get-intrinsic": "^1.2.6",
+        "is-typed-array": "^1.1.13"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-date-object": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/is-date-object/-/is-date-object-1.1.0.tgz",
+      "integrity": "sha512-PwwhEakHVKTdRNVOw+/Gyh0+MzlCl4R6qKvkhuvLtPMggI1WAHt9sOwZxQLSGpUaDnrdyDsomoRgNnCfKNSXXg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.2",
+        "has-tostringtag": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/is-docker": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/is-docker/-/is-docker-3.0.0.tgz",
@@ -9371,6 +10077,22 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/is-document.all": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/is-document.all/-/is-document.all-1.0.0.tgz",
+      "integrity": "sha512-+XSoyS05OdBbhFuELhgTCpFNHkpBOJqtsZfUFFpe5QTw+9Sjbh8zitxhQkYAo6wV7e1Vb8cAPvpCk9jGam/82g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.4"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/is-extglob": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
@@ -9380,6 +10102,22 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/is-finalizationregistry": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/is-finalizationregistry/-/is-finalizationregistry-1.1.1.tgz",
+      "integrity": "sha512-1pC6N8qWJbWoPtEjgcL2xyhQOP491EQjeUo3qTKcmV8YSDDJrOepfG8pcC7h/QgnQHYSv0mJ3Z/ZWxmatVrysg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.3"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/is-fullwidth-code-point": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
@@ -9389,6 +10127,26 @@
         "node": ">=8"
       }
     },
+    "node_modules/is-generator-function": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/is-generator-function/-/is-generator-function-1.1.2.tgz",
+      "integrity": "sha512-upqt1SkGkODW9tsGNG5mtXTXtECizwtS2kA161M+gJPc1xdb/Ax629af6YrTwcOeQHbewrPNlE5Dx7kzvXTizA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.4",
+        "generator-function": "^2.0.0",
+        "get-proto": "^1.0.1",
+        "has-tostringtag": "^1.0.2",
+        "safe-regex-test": "^1.1.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/is-glob": {
       "version": "4.0.3",
       "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz",
@@ -9443,6 +10201,32 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/is-map": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/is-map/-/is-map-2.0.3.tgz",
+      "integrity": "sha512-1Qed0/Hr2m+YqxnM09CjA2d/i6YZNfF6R2oRAOj36eUdS6qIV/huPJNSEpKbupewFs+ZsJlxsjjPbc0/afW6Lw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-negative-zero": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/is-negative-zero/-/is-negative-zero-2.0.3.tgz",
+      "integrity": "sha512-5KoIu2Ngpyek75jXodFvnafB6DJgr3u8uuK0LEZJjrU19DrMD3EVERaR8sjz8CCGgpZvxPl9SuE1GMVPFHx1mw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/is-node-process": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/is-node-process/-/is-node-process-1.2.0.tgz",
@@ -9458,6 +10242,23 @@
         "node": ">=0.12.0"
       }
     },
+    "node_modules/is-number-object": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/is-number-object/-/is-number-object-1.1.1.tgz",
+      "integrity": "sha512-lZhclumE1G6VYD8VHe35wFaIif+CTy5SJIi5+3y4psDgWu4wPDoBhF8NxUOinEc7pHgiTsT6MaBb92rKhhD+Xw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.3",
+        "has-tostringtag": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/is-obj": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/is-obj/-/is-obj-3.0.0.tgz",
@@ -9495,6 +10296,25 @@
       "integrity": "sha512-hvpoI6korhJMnej285dSg6nu1+e6uxs7zG3BYAm5byqDsgJNWwxzM6z6iZiAgQR4TJ30JmBTOwqZUw3WlyH3AQ==",
       "license": "MIT"
     },
+    "node_modules/is-regex": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/is-regex/-/is-regex-1.2.1.tgz",
+      "integrity": "sha512-MjYsKHO5O7mCsmRGxWcLWheFqN9DJ/2TmngvjKXihe6efViPqc274+Fx/4fYj/r03+ESvBdTXK0V6tA3rgez1g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.2",
+        "gopd": "^1.2.0",
+        "has-tostringtag": "^1.0.2",
+        "hasown": "^2.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/is-regexp": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/is-regexp/-/is-regexp-3.1.0.tgz",
@@ -9507,6 +10327,35 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/is-set": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/is-set/-/is-set-2.0.3.tgz",
+      "integrity": "sha512-iPAjerrse27/ygGLxw+EBR9agv9Y6uLeYVJMu+QNCoouJ1/1ri0mGrcWpfCqFZuzzx3WjtwxG098X+n4OuRkPg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-shared-array-buffer": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/is-shared-array-buffer/-/is-shared-array-buffer-1.0.4.tgz",
+      "integrity": "sha512-ISWac8drv4ZGfwKl5slpHG9OwPNty4jOWPRIhBpxOoD+hqITiwuipOQ2bNthAzwA3B4fIjO4Nln74N0S9byq8A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.3"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/is-stream": {
       "version": "4.0.1",
       "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-4.0.1.tgz",
@@ -9519,6 +10368,57 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/is-string": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/is-string/-/is-string-1.1.1.tgz",
+      "integrity": "sha512-BtEeSsoaQjlSPBemMQIrY1MY0uM6vnS1g5fmufYOtnxLGUZM2178PKbhsk7Ffv58IX+ZtcvoGwccYsh0PglkAA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.3",
+        "has-tostringtag": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-symbol": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/is-symbol/-/is-symbol-1.1.1.tgz",
+      "integrity": "sha512-9gGx6GTtCQM73BgmHQXfDmLtfjjTUDSyoxTCbp5WtoixAhfgsDirWIcVQ/IHpvI5Vgd5i/J5F7B9cN/WlVbC/w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.2",
+        "has-symbols": "^1.1.0",
+        "safe-regex-test": "^1.1.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-typed-array": {
+      "version": "1.1.15",
+      "resolved": "https://registry.npmjs.org/is-typed-array/-/is-typed-array-1.1.15.tgz",
+      "integrity": "sha512-p3EcsicXjit7SaskXHs1hA91QxgTw46Fv6EFKKGS5DRFLD8yKnohjF3hxoju94b/OcMZoQukzpPpBE9uLVKzgQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "which-typed-array": "^1.1.16"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/is-unicode-supported": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/is-unicode-supported/-/is-unicode-supported-2.1.0.tgz",
@@ -9537,6 +10437,52 @@
       "integrity": "sha512-ITvGim8FhRiYe4IQ5uHSkj7pVaPDrCTkNd3yq3cV7iZAcJdHTUMPMEHcqSOy9xZ9qFenQCvi+2wjH9a1nXqHww==",
       "license": "MIT"
     },
+    "node_modules/is-weakmap": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/is-weakmap/-/is-weakmap-2.0.2.tgz",
+      "integrity": "sha512-K5pXYOm9wqY1RgjpL3YTkF39tni1XajUIkawTLUo9EZEVUFga5gSQJF8nNS7ZwJQ02y+1YCNYcMh+HIf1ZqE+w==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-weakref": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/is-weakref/-/is-weakref-1.1.1.tgz",
+      "integrity": "sha512-6i9mGWSlqzNMEqpCp93KwRS1uUOodk2OJ6b+sq7ZPDSy2WuI5NFIxp/254TytR8ftefexkWn5xNiHUNpPOfSew==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.3"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-weakset": {
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/is-weakset/-/is-weakset-2.0.4.tgz",
+      "integrity": "sha512-mfcwb6IzQyOKTs84CQMrOwW4gQcaTOAWJ0zzJCl2WSPDrWk/OzDaImWFH3djXhb24g4eudZfLRozAvPGw4d9hQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.3",
+        "get-intrinsic": "^1.2.6"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/is-wsl": {
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/is-wsl/-/is-wsl-3.1.1.tgz",
@@ -9745,6 +10691,22 @@
         "graceful-fs": "^4.1.6"
       }
     },
+    "node_modules/jsx-ast-utils": {
+      "version": "3.3.5",
+      "resolved": "https://registry.npmjs.org/jsx-ast-utils/-/jsx-ast-utils-3.3.5.tgz",
+      "integrity": "sha512-ZZow9HBI5O6EPgSJLUb8n2NKgmVWTwCvHGwFuJlMjvLFqlGG6pjirPhtdsseaLZjSibD8eegzmYpUZwoIlj2cQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "array-includes": "^3.1.6",
+        "array.prototype.flat": "^1.3.1",
+        "object.assign": "^4.1.4",
+        "object.values": "^1.1.6"
+      },
+      "engines": {
+        "node": ">=4.0"
+      }
+    },
     "node_modules/jszip": {
       "version": "3.10.1",
       "resolved": "https://registry.npmjs.org/jszip/-/jszip-3.10.1.tgz",
@@ -9776,6 +10738,26 @@
         "node": ">=6"
       }
     },
+    "node_modules/language-subtag-registry": {
+      "version": "0.3.23",
+      "resolved": "https://registry.npmjs.org/language-subtag-registry/-/language-subtag-registry-0.3.23.tgz",
+      "integrity": "sha512-0K65Lea881pHotoGEa5gDlMxt3pctLi2RplBb7Ezh4rRdLEOtgi7n4EwK9lamnUCkKBqaeKRVebTq6BAxSkpXQ==",
+      "dev": true,
+      "license": "CC0-1.0"
+    },
+    "node_modules/language-tags": {
+      "version": "1.0.9",
+      "resolved": "https://registry.npmjs.org/language-tags/-/language-tags-1.0.9.tgz",
+      "integrity": "sha512-MbjN408fEndfiQXbFQ1vnd+1NoLDsnQW41410oQBXiyXDMYH5z505juWa4KUE1LqxRC7DgOgZDbKLxHIwm27hA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "language-subtag-registry": "^0.3.20"
+      },
+      "engines": {
+        "node": ">=0.10"
+      }
+    },
     "node_modules/levn": {
       "version": "0.4.1",
       "resolved": "https://registry.npmjs.org/levn/-/levn-0.4.1.tgz",
@@ -10611,6 +11593,16 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/object-keys": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-1.1.1.tgz",
+      "integrity": "sha512-NuAESUOUMrlIXOfHKzD6bpPu3tYt3xvjNdRIQ+FeT0lNb4K8WR70CaDxhuNguS2XG+GjkyMwOzsN5ZktImfhLA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/object-treeify": {
       "version": "1.1.33",
       "resolved": "https://registry.npmjs.org/object-treeify/-/object-treeify-1.1.33.tgz",
@@ -10620,6 +11612,65 @@
         "node": ">= 10"
       }
     },
+    "node_modules/object.assign": {
+      "version": "4.1.7",
+      "resolved": "https://registry.npmjs.org/object.assign/-/object.assign-4.1.7.tgz",
+      "integrity": "sha512-nK28WOo+QIjBkDduTINE4JkF/UJJKyf2EJxvJKfblDpyg0Q+pkOHNTL0Qwy6NP6FhE/EnzV73BxxqcJaXY9anw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.3",
+        "define-properties": "^1.2.1",
+        "es-object-atoms": "^1.0.0",
+        "has-symbols": "^1.1.0",
+        "object-keys": "^1.1.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/object.fromentries": {
+      "version": "2.0.8",
+      "resolved": "https://registry.npmjs.org/object.fromentries/-/object.fromentries-2.0.8.tgz",
+      "integrity": "sha512-k6E21FzySsSK5a21KRADBd/NGneRegFO5pLHfdQLpRDETUNJueLXs3WCzyQ3tFRDYgbq3KHGXfTbi2bs8WQ6rQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.7",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.2",
+        "es-object-atoms": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/object.values": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/object.values/-/object.values-1.2.1.tgz",
+      "integrity": "sha512-gXah6aZrcUxjWg2zR2MwouP2eHlCBzdV4pygudehaKXSGW4v2AsRQUK+lwwXhii6KFZcunEnmSUoYp5CXibxtA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.3",
+        "define-properties": "^1.2.1",
+        "es-object-atoms": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/obug": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/obug/-/obug-2.1.1.tgz",
@@ -10764,6 +11815,24 @@
       "integrity": "sha512-+Sl2UErvtsoajRDKCE5/dBz4DIvHXQQnAxtQTF04OJxY0+DyZXSo5P5Bb7XYWOh81syohlYL24hbDwxedPUJCA==",
       "license": "MIT"
     },
+    "node_modules/own-keys": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/own-keys/-/own-keys-1.0.1.tgz",
+      "integrity": "sha512-qFOyK5PjiWZd+QQIh+1jhdb9LpxTF0qs7Pm8o5QHYZ0M3vKqSqzsZaEB6oWlxZ+q2sJBMI/Ktgd2N5ZwQoRHfg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "get-intrinsic": "^1.2.6",
+        "object-keys": "^1.1.1",
+        "safe-push-apply": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/p-limit": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-3.1.0.tgz",
@@ -10981,6 +12050,16 @@
         "fflate": "^0.8.2"
       }
     },
+    "node_modules/possible-typed-array-names": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/possible-typed-array-names/-/possible-typed-array-names-1.1.0.tgz",
+      "integrity": "sha512-/+5VFTchJDoVj3bhoqi6UeymcD00DAwb1nJwamzPvHEszJ4FpF6SNNbUbOS8yI56qHzdV8eK0qEfOSiodkTdxg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/postcss": {
       "version": "8.5.15",
       "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.15.tgz",
@@ -11740,6 +12819,50 @@
         "redux": "^5.0.0"
       }
     },
+    "node_modules/reflect.getprototypeof": {
+      "version": "1.0.10",
+      "resolved": "https://registry.npmjs.org/reflect.getprototypeof/-/reflect.getprototypeof-1.0.10.tgz",
+      "integrity": "sha512-00o4I+DVrefhv+nX0ulyi3biSHCPDe+yLv5o/p6d/UVlirijB8E16FtfwSAi4g3tcqrQ4lRAqQSoFEZJehYEcw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.9",
+        "es-errors": "^1.3.0",
+        "es-object-atoms": "^1.0.0",
+        "get-intrinsic": "^1.2.7",
+        "get-proto": "^1.0.1",
+        "which-builtin-type": "^1.2.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/regexp.prototype.flags": {
+      "version": "1.5.4",
+      "resolved": "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.5.4.tgz",
+      "integrity": "sha512-dYqgNSZbDwkaJ2ceRd9ojCGjBq+mOm9LmtXnAnEGyHhN/5R7iDW2TRw3h+o/jCFxus3P2LfWIIiwowAjANm7IA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "define-properties": "^1.2.1",
+        "es-errors": "^1.3.0",
+        "get-proto": "^1.0.1",
+        "gopd": "^1.2.0",
+        "set-function-name": "^2.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/require-directory": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
@@ -11773,16 +12896,6 @@
         "node": ">=4"
       }
     },
-    "node_modules/resolve-pkg-maps": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/resolve-pkg-maps/-/resolve-pkg-maps-1.0.0.tgz",
-      "integrity": "sha512-seS2Tj26TBVOC2NIc2rOe2y2ZO7efxITtLZcGSOnHHNOQ7CkiUBfw0Iw2ck6xkIhPwLhKNLS8BO+hEpngQlqzw==",
-      "dev": true,
-      "license": "MIT",
-      "funding": {
-        "url": "https://github.com/privatenumber/resolve-pkg-maps?sponsor=1"
-      }
-    },
     "node_modules/restore-cursor": {
       "version": "5.1.0",
       "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-5.1.0.tgz",
@@ -11919,12 +13032,81 @@
         "queue-microtask": "^1.2.2"
       }
     },
+    "node_modules/safe-array-concat": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/safe-array-concat/-/safe-array-concat-1.1.4.tgz",
+      "integrity": "sha512-wtZlHyOje6OZTGqAoaDKxFkgRtkF9CnHAVnCHKfuj200wAgL+bSJhdsCD2l0Qx/2ekEXjPWcyKkfGb5CPboslg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.9",
+        "call-bound": "^1.0.4",
+        "get-intrinsic": "^1.3.0",
+        "has-symbols": "^1.1.0",
+        "isarray": "^2.0.5"
+      },
+      "engines": {
+        "node": ">=0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/safe-array-concat/node_modules/isarray": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/isarray/-/isarray-2.0.5.tgz",
+      "integrity": "sha512-xHjhDr3cNBK0BzdUJSPXZntQUx/mwMS5Rw4A7lPJ90XGAO6ISP/ePDNuo0vhqOZU+UD5JoodwCAAoZQd3FeAKw==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/safe-buffer": {
       "version": "5.1.2",
       "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
       "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==",
       "license": "MIT"
     },
+    "node_modules/safe-push-apply": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/safe-push-apply/-/safe-push-apply-1.0.0.tgz",
+      "integrity": "sha512-iKE9w/Z7xCzUMIZqdBsp6pEQvwuEebH4vdpjcDWnyzaI6yl6O9FHvVpmGelvEHNsoY6wGblkxR6Zty/h00WiSA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0",
+        "isarray": "^2.0.5"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/safe-push-apply/node_modules/isarray": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/isarray/-/isarray-2.0.5.tgz",
+      "integrity": "sha512-xHjhDr3cNBK0BzdUJSPXZntQUx/mwMS5Rw4A7lPJ90XGAO6ISP/ePDNuo0vhqOZU+UD5JoodwCAAoZQd3FeAKw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/safe-regex-test": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/safe-regex-test/-/safe-regex-test-1.1.0.tgz",
+      "integrity": "sha512-x/+Cz4YrimQxQccJf5mKEbIa1NzeCRNI5Ecl/ekmlYaampdNLPalVyIcCZNNH3MvmqBugV5TMYZXv0ljslUlaw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.2",
+        "es-errors": "^1.3.0",
+        "is-regex": "^1.2.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/safer-buffer": {
       "version": "2.1.2",
       "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz",
@@ -12031,6 +13213,55 @@
       "integrity": "sha512-kjnC1DXBHcxaOaOXBHBeRtltsDG2nUiUni+jP92M9gYdW12rsmx92UsfpH7o5tDRs7I1ZZPSQJQGv3UaRfCiuw==",
       "license": "MIT"
     },
+    "node_modules/set-function-length": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/set-function-length/-/set-function-length-1.2.2.tgz",
+      "integrity": "sha512-pgRc4hJ4/sNjWCSS9AmnS40x3bNMDTknHgL5UaMBTMyJnU90EgWh1Rz+MC9eFu4BuN/UwZjKQuY/1v3rM7HMfg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "define-data-property": "^1.1.4",
+        "es-errors": "^1.3.0",
+        "function-bind": "^1.1.2",
+        "get-intrinsic": "^1.2.4",
+        "gopd": "^1.0.1",
+        "has-property-descriptors": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/set-function-name": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/set-function-name/-/set-function-name-2.0.2.tgz",
+      "integrity": "sha512-7PGFlmtwsEADb0WYyvCMa1t+yke6daIG4Wirafur5kcf+MhUnPms1UeR0CKQdTZD81yESwMHbtn+TR+dMviakQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "define-data-property": "^1.1.4",
+        "es-errors": "^1.3.0",
+        "functions-have-names": "^1.2.3",
+        "has-property-descriptors": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/set-proto": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/set-proto/-/set-proto-1.0.0.tgz",
+      "integrity": "sha512-RJRdvCo6IAnPdsvP/7m6bsQqNnn1FCBX5ZNtFL98MmFF/4xAIJTIg1YbHW5DC2W5SKZanrC6i4HsJqlajw/dZw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "dunder-proto": "^1.0.1",
+        "es-errors": "^1.3.0",
+        "es-object-atoms": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/setimmediate": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/setimmediate/-/setimmediate-1.0.5.tgz",
@@ -12269,6 +13500,20 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/stop-iteration-iterator": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/stop-iteration-iterator/-/stop-iteration-iterator-1.1.0.tgz",
+      "integrity": "sha512-eLoXW/DHyl62zxY4SCaIgnRhuMr6ri4juEYARS8E6sCEqzKpOiE521Ucofdx+KnDZl5xmvGYaaKCk5FEOxJCoQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0",
+        "internal-slot": "^1.1.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/strict-event-emitter": {
       "version": "0.5.1",
       "resolved": "https://registry.npmjs.org/strict-event-emitter/-/strict-event-emitter-0.5.1.tgz",
@@ -12301,6 +13546,81 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/string.prototype.includes": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/string.prototype.includes/-/string.prototype.includes-2.0.1.tgz",
+      "integrity": "sha512-o7+c9bW6zpAdJHTtujeePODAhkuicdAryFsfVKwA+wGw89wJ4GTY484WTucM9hLtDEOpOvI+aHnzqnC5lHp4Rg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.7",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.3"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/string.prototype.trim": {
+      "version": "1.2.11",
+      "resolved": "https://registry.npmjs.org/string.prototype.trim/-/string.prototype.trim-1.2.11.tgz",
+      "integrity": "sha512-PwvK7BU+CMTJGYQCTZb5RWXIML92lftJLhQz1tBzgKiqGxJaMlBAa48POXaNAC2s4y8jr3EFqrkF9+44neS46w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.9",
+        "call-bound": "^1.0.4",
+        "define-data-property": "^1.1.4",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.24.2",
+        "es-object-atoms": "^1.1.2",
+        "has-property-descriptors": "^1.0.2",
+        "safe-regex-test": "^1.1.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/string.prototype.trimend": {
+      "version": "1.0.10",
+      "resolved": "https://registry.npmjs.org/string.prototype.trimend/-/string.prototype.trimend-1.0.10.tgz",
+      "integrity": "sha512-2+3aDAOmPTmuFwjDnmJG2ctEkQKVki7vOSqaxkv42Mowj1V6PnvuwFCRrR5lChUux1TBskPjfkeTOhqczDMxTw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.9",
+        "call-bound": "^1.0.4",
+        "define-properties": "^1.2.1",
+        "es-object-atoms": "^1.1.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/string.prototype.trimstart": {
+      "version": "1.0.8",
+      "resolved": "https://registry.npmjs.org/string.prototype.trimstart/-/string.prototype.trimstart-1.0.8.tgz",
+      "integrity": "sha512-UXSH262CSZY1tfu3G3Secr6uGLCFVPMhIqHjlgCUtCCcgihYc/xKs9djMTMUOb2j1mVSeU8EU6NWc/iQKU6Gfg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.7",
+        "define-properties": "^1.2.1",
+        "es-object-atoms": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/stringify-object": {
       "version": "5.0.0",
       "resolved": "https://registry.npmjs.org/stringify-object/-/stringify-object-5.0.0.tgz",
@@ -12634,14 +13954,13 @@
       "license": "0BSD"
     },
     "node_modules/tsx": {
-      "version": "4.21.0",
-      "resolved": "https://registry.npmjs.org/tsx/-/tsx-4.21.0.tgz",
-      "integrity": "sha512-5C1sg4USs1lfG0GFb2RLXsdpXqBSEhAaA/0kPL01wxzpMqLILNxIxIOKiILz+cdg/pLnOUxFYOR5yhHU666wbw==",
+      "version": "4.22.4",
+      "resolved": "https://registry.npmjs.org/tsx/-/tsx-4.22.4.tgz",
+      "integrity": "sha512-X8EX+XV4QR5xCsrgxaED954zTDfY8KqlDtskKEL0cHhyS/P8b4IFOvGDQpsC9Q1XnLq915wEfwwY/zzskCtmhg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "esbuild": "~0.27.0",
-        "get-tsconfig": "^4.7.5"
+        "esbuild": "~0.28.0"
       },
       "bin": {
         "tsx": "dist/cli.mjs"
@@ -12737,6 +14056,84 @@
         "node": ">= 0.6"
       }
     },
+    "node_modules/typed-array-buffer": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/typed-array-buffer/-/typed-array-buffer-1.0.3.tgz",
+      "integrity": "sha512-nAYYwfY3qnzX30IkA6AQZjVbtK6duGontcQm1WSG1MD94YLqK0515GNApXkoxKOWMusVssAHWLh9SeaoefYFGw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.3",
+        "es-errors": "^1.3.0",
+        "is-typed-array": "^1.1.14"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/typed-array-byte-length": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/typed-array-byte-length/-/typed-array-byte-length-1.0.3.tgz",
+      "integrity": "sha512-BaXgOuIxz8n8pIq3e7Atg/7s+DpiYrxn4vdot3w9KbnBhcRQq6o3xemQdIfynqSeXeDrF32x+WvfzmOjPiY9lg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "for-each": "^0.3.3",
+        "gopd": "^1.2.0",
+        "has-proto": "^1.2.0",
+        "is-typed-array": "^1.1.14"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/typed-array-byte-offset": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/typed-array-byte-offset/-/typed-array-byte-offset-1.0.4.tgz",
+      "integrity": "sha512-bTlAFB/FBYMcuX81gbL4OcpH5PmlFHqlCCpAl8AlEzMz5k53oNDvN8p1PNOWLEmI2x4orp3raOFB51tv9X+MFQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "available-typed-arrays": "^1.0.7",
+        "call-bind": "^1.0.8",
+        "for-each": "^0.3.3",
+        "gopd": "^1.2.0",
+        "has-proto": "^1.2.0",
+        "is-typed-array": "^1.1.15",
+        "reflect.getprototypeof": "^1.0.9"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/typed-array-length": {
+      "version": "1.0.8",
+      "resolved": "https://registry.npmjs.org/typed-array-length/-/typed-array-length-1.0.8.tgz",
+      "integrity": "sha512-phPGCwqr2+Qo0fwniCE8e4pKnGu/yFb5nD5Y8bf0EEeiI5GklnACYA9GFy/DrAeRrKHXvHn+1SUsOWgJp6RO+g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.9",
+        "for-each": "^0.3.5",
+        "gopd": "^1.2.0",
+        "is-typed-array": "^1.1.15",
+        "possible-typed-array-names": "^1.1.0",
+        "reflect.getprototypeof": "^1.0.10"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/typescript": {
       "version": "5.9.3",
       "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.9.3.tgz",
@@ -12774,6 +14171,25 @@
         "typescript": ">=4.8.4 <6.1.0"
       }
     },
+    "node_modules/unbox-primitive": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/unbox-primitive/-/unbox-primitive-1.1.0.tgz",
+      "integrity": "sha512-nWJ91DjeOkej/TA8pXQ3myruKpKEYgqvpw9lz4OPHj/NWFNluYrjbz9j01CJ8yKQd2g4jFoOkINCTW2I5LEEyw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.3",
+        "has-bigints": "^1.0.2",
+        "has-symbols": "^1.1.0",
+        "which-boxed-primitive": "^1.1.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/undici": {
       "version": "7.25.0",
       "resolved": "https://registry.npmjs.org/undici/-/undici-7.25.0.tgz",
@@ -13320,6 +14736,102 @@
         "node": ">= 8"
       }
     },
+    "node_modules/which-boxed-primitive": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/which-boxed-primitive/-/which-boxed-primitive-1.1.1.tgz",
+      "integrity": "sha512-TbX3mj8n0odCBFVlY8AxkqcHASw3L60jIuF8jFP78az3C2YhmGvqbHBpAjTRH2/xqYunrJ9g1jSyjCjpoWzIAA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "is-bigint": "^1.1.0",
+        "is-boolean-object": "^1.2.1",
+        "is-number-object": "^1.1.1",
+        "is-string": "^1.1.1",
+        "is-symbol": "^1.1.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/which-builtin-type": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/which-builtin-type/-/which-builtin-type-1.2.1.tgz",
+      "integrity": "sha512-6iBczoX+kDQ7a3+YJBnh3T+KZRxM/iYNPXicqk66/Qfm1b93iu+yOImkg0zHbj5LNOcNv1TEADiZ0xa34B4q6Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.2",
+        "function.prototype.name": "^1.1.6",
+        "has-tostringtag": "^1.0.2",
+        "is-async-function": "^2.0.0",
+        "is-date-object": "^1.1.0",
+        "is-finalizationregistry": "^1.1.0",
+        "is-generator-function": "^1.0.10",
+        "is-regex": "^1.2.1",
+        "is-weakref": "^1.0.2",
+        "isarray": "^2.0.5",
+        "which-boxed-primitive": "^1.1.0",
+        "which-collection": "^1.0.2",
+        "which-typed-array": "^1.1.16"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/which-builtin-type/node_modules/isarray": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/isarray/-/isarray-2.0.5.tgz",
+      "integrity": "sha512-xHjhDr3cNBK0BzdUJSPXZntQUx/mwMS5Rw4A7lPJ90XGAO6ISP/ePDNuo0vhqOZU+UD5JoodwCAAoZQd3FeAKw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/which-collection": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/which-collection/-/which-collection-1.0.2.tgz",
+      "integrity": "sha512-K4jVyjnBdgvc86Y6BkaLZEN933SwYOuBFkdmBu9ZfkcAbdVbpITnDmjvZ/aQjRXQrv5EPkTnD1s39GiiqbngCw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "is-map": "^2.0.3",
+        "is-set": "^2.0.3",
+        "is-weakmap": "^2.0.2",
+        "is-weakset": "^2.0.3"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/which-typed-array": {
+      "version": "1.1.22",
+      "resolved": "https://registry.npmjs.org/which-typed-array/-/which-typed-array-1.1.22.tgz",
+      "integrity": "sha512-fvO4ExWMFsqyhG3AiPAObMuY1lxaqgYcxbc49CNdWDDECOJNgQyvsOWVwbZc+qf3rzRtxojBK+CMEv0Ld5CYpw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "available-typed-arrays": "^1.0.7",
+        "call-bind": "^1.0.9",
+        "call-bound": "^1.0.4",
+        "for-each": "^0.3.5",
+        "get-proto": "^1.0.1",
+        "gopd": "^1.2.0",
+        "has-tostringtag": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/why-is-node-running": {
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/why-is-node-running/-/why-is-node-running-2.3.0.tgz",
@@ -13663,6 +15175,7 @@
         "@types/react-dom": "^19",
         "@vitejs/plugin-react": "^6.0.1",
         "eslint": "^9.39.2",
+        "eslint-plugin-jsx-a11y": "^6.10.2",
         "eslint-plugin-react-hooks": "^7.0.1",
         "eslint-plugin-react-refresh": "^0.5.2",
         "globals": "^14.0.0",
diff --git a/scripts/backfill-estate-principalid.js b/scripts/backfill-estate-principalid.js
new file mode 100644
index 0000000..fabbaee
--- /dev/null
+++ b/scripts/backfill-estate-principalid.js
@@ -0,0 +1,68 @@
+#!/usr/bin/env node
+/**
+ * Backfill estates/{id}.principalId for legacy estates created before the field
+ * existed. The OpenSign signer=principal change (PR #10) resolves the signer from
+ * estates/{id}.principalId; an estate missing it now 400s on signing. This sets
+ * principalId from the authoritative role=="principal" estate_users junction.
+ *
+ * DRY RUN by default (read-only: reports counts, writes nothing).
+ * Apply with --apply.
+ *
+ * Usage:
+ *   GOOGLE_APPLICATION_CREDENTIALS=~/.config/gcloud/finalwishes-claude-agent.json \
+ *   GCLOUD_PROJECT=finalwishes-prod node scripts/backfill-estate-principalid.js [--apply]
+ *
+ * Refs: ADR-047, claude-home signer=principal decision 2026-06-14
+ */
+const path = require('path');
+const admin = require(path.join(__dirname, '..', 'functions', 'node_modules', 'firebase-admin'));
+
+const APPLY = process.argv.includes('--apply');
+admin.initializeApp({ projectId: process.env.GCLOUD_PROJECT || 'finalwishes-prod' });
+const db = admin.firestore();
+
+(async () => {
+  const estatesSnap = await db.collection('estates').get();
+  let total = 0, hasField = 0, backfilled = 0, unresolved = 0, ambiguous = 0;
+  const unresolvedIds = [];
+
+  for (const estate of estatesSnap.docs) {
+    total++;
+    const data = estate.data();
+    if (data.principalId) { hasField++; continue; }
+
+    // Resolve the principal from the authoritative junction.
+    const principals = await db.collection('estate_users')
+      .where('estateId', '==', estate.id)
+      .where('role', '==', 'principal')
+      .get();
+
+    if (principals.empty) { unresolved++; unresolvedIds.push(estate.id); continue; }
+    if (principals.size > 1) {
+      // More than one principal junction — ambiguous, do NOT guess.
+      ambiguous++; unresolvedIds.push(estate.id + ' (ambiguous: ' + principals.size + ' principals)'); continue;
+    }
+    const principalId = principals.docs[0].data().userId;
+    if (!principalId) { unresolved++; unresolvedIds.push(estate.id + ' (junction has no userId)'); continue; }
+
+    if (APPLY) {
+      await estate.ref.update({ principalId, updatedAt: admin.firestore.FieldValue.serverTimestamp() });
+    }
+    backfilled++;
+    console.log(`${APPLY ? 'SET' : 'WOULD SET'} estates/${estate.id}.principalId = ${principalId}`);
+  }
+
+  console.log('\n--- backfill summary ---');
+  console.log(`mode:                 ${APPLY ? 'APPLY (writes)' : 'DRY RUN (no writes)'}`);
+  console.log(`estates total:        ${total}`);
+  console.log(`already had field:    ${hasField}`);
+  console.log(`backfilled:           ${backfilled}`);
+  console.log(`unresolved (no junction / no userId): ${unresolved}`);
+  console.log(`ambiguous (>1 principal):            ${ambiguous}`);
+  if (unresolvedIds.length) {
+    console.log('\nEstates needing manual attention:');
+    unresolvedIds.forEach((id) => console.log('  - ' + id));
+  }
+  if (!APPLY && backfilled > 0) console.log('\nRe-run with --apply to write these changes.');
+  process.exit(0);
+})().catch((err) => { console.error('backfill failed:', err); process.exit(1); });
diff --git a/storage.rules b/storage.rules
index 5472586..8cf1a18 100644
--- a/storage.rules
+++ b/storage.rules
@@ -32,11 +32,21 @@ service firebase.storage {
     // authenticated user read ANY estate's files by guessing the path. (The app reads
     // via Go-API signed URLs that bypass these rules, so this is defense-in-depth —
     // but the rule must still be estate-scoped, not merely authenticated.)
+    //
+    // email_verified gate (mirror of firestore.rules isEstateRole()): the
+    // estate_users junction is written by invitation auto-match keyed off an email
+    // string, so an unverified account on an invited-but-unclaimed address must NOT
+    // be honored. The SAME junction firestore refuses to honor for an unverified
+    // user must not be honored by storage for direct downloads. The principal path
+    // (estates.principalId) is identity the owner already proved, but we require a
+    // verified email there too for consistency — a principal verifies at signup.
     function isEstateMember(estateId) {
-      return request.auth != null && (
-        firestore.exists(/databases/(default)/documents/estate_users/$(request.auth.uid + '_' + estateId))
-        || firestore.get(/databases/(default)/documents/estates/$(estateId)).data.principalId == request.auth.uid
-      );
+      return request.auth != null
+        && request.auth.token.email_verified == true
+        && (
+          firestore.exists(/databases/(default)/documents/estate_users/$(request.auth.uid + '_' + estateId))
+          || firestore.get(/databases/(default)/documents/estates/$(estateId)).data.principalId == request.auth.uid
+        );
     }
 
     // ── Estate Document Vault ──
diff --git a/web/.env.production b/web/.env.production
index 37c94a0..17c8765 100644
--- a/web/.env.production
+++ b/web/.env.production
@@ -1 +1,31 @@
 VITE_API_URL=https://finalwishes-api-860699311615.us-central1.run.app
+
+# ─────────────────────────────────────────────────────────────────────────────
+# OPTIONAL INTEGRATION ENV (owner-provisioned, build-time)
+#
+# These power features that are wired in code but stay inert — and HIDE their own
+# entry points — until the owner provisions them. Leaving them unset is safe; the UI
+# degrades gracefully rather than erroring.
+#
+# VITE_GOOGLE_OAUTH_CLIENT_ID — Google Photos import on the Heirlooms page.
+#   When unset, the "Import from Google Photos" button is hidden entirely.
+#   To enable (FR-905 / ADR-045):
+#     1. In Google Cloud Console (project finalwishes-prod) enable the
+#        "Google Photos Picker API".
+#     2. On the OAuth consent screen, add the scope
+#        .../auth/photospicker.mediaitems.readonly
+#     3. Create a Web OAuth client; set Authorized JavaScript origins to
+#        https://finalwishes-prod.web.app and https://finalwishes.app
+#     4. Set the client id below, then rebuild + redeploy the web app:
+#        VITE_GOOGLE_OAUTH_CLIENT_ID=<your-web-oauth-client-id>.apps.googleusercontent.com
+#
+# Server-side integrations are configured on the API (Cloud Run env / Secret Manager),
+# NOT here. For reference, they gate these UI states:
+#   - Document signing (directives "Sign Document" → "E-Signing Coming Soon" badge):
+#     set SIRSI_SIGN_API_KEY and/or SIRSI_SIGN_HMAC_SECRET (ADR-047 shared service,
+#     preferred), OR the dissociated fallback OPENSIGN_API_URL + OPENSIGN_API_KEY;
+#     also set OPENSIGN_WEBHOOK_SECRET so the status-confirmation webhook is accepted.
+#   - Stripe "Manage subscription" portal: one-time enable in the Stripe Dashboard
+#     (Settings → Billing → Customer Portal); until then the API returns a clear
+#     "not available yet — contact support" message instead of a 500.
+# ─────────────────────────────────────────────────────────────────────────────
diff --git a/web/eslint.config.mjs b/web/eslint.config.mjs
index 89817e7..62c9778 100644
--- a/web/eslint.config.mjs
+++ b/web/eslint.config.mjs
@@ -1,5 +1,6 @@
 import js from "@eslint/js";
 import globals from "globals";
+import jsxA11y from "eslint-plugin-jsx-a11y";
 import reactHooks from "eslint-plugin-react-hooks";
 import reactRefresh from "eslint-plugin-react-refresh";
 import tseslint from "typescript-eslint";
@@ -14,11 +15,27 @@ export default tseslint.config(
       globals: globals.browser,
     },
     plugins: {
+      "jsx-a11y": jsxA11y,
       "react-hooks": reactHooks,
       "react-refresh": reactRefresh,
     },
     rules: {
+      // Accessibility (eslint-plugin-jsx-a11y) — INCREMENTAL ADOPTION: surface every
+      // a11y issue (clickable-div, missing-label, unlabeled-icon-button, media captions,
+      // autofocus, …) as a WARNING rather than an error. The plugin was added to guard
+      // against regressions, but the pre-existing codebase has a backlog of a11y debt
+      // that should be burned down in a dedicated sprint — not block the build/deploy in
+      // one shot. Downgrade the whole recommended set to "warn"; promote back to "error"
+      // file-by-file as each area is fixed.
+      ...Object.fromEntries(
+        Object.keys(jsxA11y.flatConfigs.recommended.rules).map((rule) => [rule, "warn"]),
+      ),
       ...reactHooks.configs.recommended.rules,
+      "jsx-a11y/click-events-have-key-events": "warn",
+      "jsx-a11y/no-static-element-interactions": "warn",
+      "jsx-a11y/anchor-has-content": "warn",
+      "jsx-a11y/control-has-associated-label": "warn",
+      "jsx-a11y/label-has-associated-control": "warn",
       // Downgrade pre-existing react-hooks issues to warnings
       // TODO: Fix these properly in a code quality sprint
       "react-hooks/rules-of-hooks": "warn",
diff --git a/web/package.json b/web/package.json
index 4e5d2f4..a52cf26 100644
--- a/web/package.json
+++ b/web/package.json
@@ -57,6 +57,7 @@
     "@types/react-dom": "^19",
     "@vitejs/plugin-react": "^6.0.1",
     "eslint": "^9.39.2",
+    "eslint-plugin-jsx-a11y": "^6.10.2",
     "eslint-plugin-react-hooks": "^7.0.1",
     "eslint-plugin-react-refresh": "^0.5.2",
     "globals": "^14.0.0",
diff --git a/web/src/components/ErrorBoundary.tsx b/web/src/components/ErrorBoundary.tsx
index 67a8931..2e0f40d 100644
--- a/web/src/components/ErrorBoundary.tsx
+++ b/web/src/components/ErrorBoundary.tsx
@@ -39,8 +39,8 @@ export class ErrorBoundary extends Component<Props, State> {
               </svg>
             </div>
             <div>
-              <h2 className="text-xl font-bold text-slate-900 mb-2">Something went wrong</h2>
-              <p className="text-slate-500 text-[14px]">
+              <h2 className="text-xl font-bold text-royal mb-2">Something went wrong</h2>
+              <p className="text-ink-muted text-[14px]">
                 We encountered an error loading this page. This may be a temporary issue with your connection to our servers.
               </p>
             </div>
@@ -51,13 +51,13 @@ export class ErrorBoundary extends Component<Props, State> {
               >
                 Try Again
               </button>
-              <p className="text-[12px] text-slate-400">
+              <p className="text-[12px] text-ink-muted">
                 If this persists, try refreshing the page or contact support.
               </p>
             </div>
             {this.state.error && (
-              <details className="text-left bg-slate-50 rounded-xl p-4 border border-slate-100">
-                <summary className="text-[11px] font-bold text-slate-500 uppercase tracking-widest cursor-pointer">
+              <details className="text-left bg-[var(--neutral-faint)] rounded-xl p-4 border border-[var(--neutral-border)]">
+                <summary className="text-[11px] font-bold text-ink-muted uppercase tracking-widest cursor-pointer">
                   Technical Details
                 </summary>
                 <pre className="mt-3 text-[11px] text-red-600 whitespace-pre-wrap break-all font-mono">
diff --git a/web/src/components/estate/InviteTeamMember.tsx b/web/src/components/estate/InviteTeamMember.tsx
index 4c63990..6498274 100644
--- a/web/src/components/estate/InviteTeamMember.tsx
+++ b/web/src/components/estate/InviteTeamMember.tsx
@@ -30,14 +30,13 @@ const STATUS_BADGES: Record<string, { label: string; color: string; bg: string;
   pending: { label: 'Pending', color: 'text-[var(--gold)]', bg: 'bg-[var(--gold)]/10', border: 'border-[var(--gold)]/20' },
   accepted: { label: 'Active', color: 'text-green-600', bg: 'bg-green-50', border: 'border-green-100' },
   declined: { label: 'Declined', color: 'text-red-500', bg: 'bg-red-50', border: 'border-red-100' },
-  revoked: { label: 'Revoked', color: 'text-slate-400', bg: 'bg-slate-50', border: 'border-slate-100' },
+  revoked: { label: 'Revoked', color: 'text-ink-muted', bg: 'bg-[var(--neutral-faint)]', border: 'border-[var(--neutral-border)]' },
 };
 
 export function InviteTeamMember({ estateId }: InviteTeamMemberProps) {
   const { user, profile } = useAuth();
   const [showForm, setShowForm] = useState(false);
   const [email, setEmail] = useState('');
-  const [phone, setPhone] = useState('');
   const [fullName, setFullName] = useState('');
   const [role, setRole] = useState<'executor' | 'heir' | 'trustee' | 'legal' | 'cpa'>('heir');
   const [sending, setSending] = useState(false);
@@ -81,7 +80,6 @@ export function InviteTeamMember({ estateId }: InviteTeamMemberProps) {
     const result = await inviteTeamMember({
       estateId,
       email: email.trim(),
-      phone: phone.trim() || undefined,
       fullName: fullName.trim(),
       role,
       invitedBy: user.uid,
@@ -92,7 +90,6 @@ export function InviteTeamMember({ estateId }: InviteTeamMemberProps) {
     if (result.success) {
       setSuccess(`Invitation sent to ${fullName || email}`);
       setEmail('');
-      setPhone('');
       setFullName('');
       setShowForm(false);
       refreshInvitations();
@@ -103,9 +100,12 @@ export function InviteTeamMember({ estateId }: InviteTeamMemberProps) {
   };
 
   const handleRevoke = async (invitationId: string) => {
+    setError('');
     const result = await revokeInvitation(invitationId);
     if (result.success) {
       refreshInvitations();
+    } else {
+      setError(result.error || 'Could not revoke this invitation. Please try again.');
     }
   };
 
@@ -259,17 +259,11 @@ export function InviteTeamMember({ estateId }: InviteTeamMemberProps) {
                   className="w-full bg-white border border-royal/10 rounded-xl px-4 py-3 text-[14px] font-semibold text-royal outline-none focus:border-royal transition-all placeholder:text-royal/20"
                 />
               </div>
-              <div className="space-y-1.5">
-                <label className="text-[10px] font-bold text-royal/30 uppercase tracking-widest block">Phone Number <span className="text-royal/15">(Optional — for SMS notification)</span></label>
-                <input
-                  type="tel"
-                  value={phone}
-                  onChange={(e) => setPhone(e.target.value)}
-                  placeholder="+1 (555) 123-4567"
-                  className="w-full bg-white border border-royal/10 rounded-xl px-4 py-3 text-[14px] font-semibold text-royal outline-none focus:border-royal transition-all placeholder:text-royal/20"
-                />
-              </div>
             </div>
+            <p className="text-[10px] font-medium text-royal/25 -mt-2 flex items-center gap-1.5">
+              <svg viewBox="0 0 24 24" className="w-3 h-3 text-royal/20" fill="none" stroke="currentColor" strokeWidth="2"><path d="M4 4h16v16H4z" /><path d="m4 6 8 6 8-6" /></svg>
+              The invitee receives a secure email invitation to join this estate.
+            </p>
 
             <div className="space-y-1.5">
               <label className="text-[10px] font-bold text-royal/30 uppercase tracking-widest block">Role</label>
diff --git a/web/src/components/estate/QuorumPanel.tsx b/web/src/components/estate/QuorumPanel.tsx
index 724fa8c..70b9354 100644
--- a/web/src/components/estate/QuorumPanel.tsx
+++ b/web/src/components/estate/QuorumPanel.tsx
@@ -80,7 +80,7 @@ export function QuorumPanel({ estateId }: QuorumPanelProps) {
     <Card className="border-[var(--gold)]/20">
       <CardHeader className="pb-3">
         <div className="flex items-center justify-between">
-          <CardTitle className="text-lg font-[family-name:var(--font-cinzel)] font-semibold text-slate-900">
+          <CardTitle className="text-lg font-[family-name:var(--font-cinzel)] font-semibold text-royal">
             Executor Quorum
           </CardTitle>
           <div className="flex items-center gap-2">
@@ -99,14 +99,14 @@ export function QuorumPanel({ estateId }: QuorumPanelProps) {
       </CardHeader>
       <CardContent>
         {pendingActions.length === 0 && resolvedActions.length === 0 && (
-          <p className="text-sm text-slate-900/50 text-center py-6">
+          <p className="text-sm text-ink/50 text-center py-6">
             No quorum actions yet. Propose an action that requires multi-executor approval.
           </p>
         )}
 
         {pendingActions.length > 0 && (
           <div className="space-y-3 mb-4">
-            <h4 className="text-xs font-bold text-slate-900/60 uppercase tracking-wider">
+            <h4 className="text-xs font-bold text-ink/60 uppercase tracking-wider">
               Pending Votes
             </h4>
             {pendingActions.map((action) => (
@@ -123,7 +123,7 @@ export function QuorumPanel({ estateId }: QuorumPanelProps) {
 
         {resolvedActions.length > 0 && (
           <div className="space-y-3">
-            <h4 className="text-xs font-bold text-slate-900/60 uppercase tracking-wider">
+            <h4 className="text-xs font-bold text-ink/60 uppercase tracking-wider">
               Resolved
             </h4>
             {resolvedActions.slice(0, 5).map((action) => (
@@ -184,16 +184,16 @@ function ActionCard({
   }
 
   return (
-    <div className={`p-4 rounded-lg border ${STATUS_STYLES[action.status] || 'border-slate-900/10'}`}>
+    <div className={`p-4 rounded-lg border ${STATUS_STYLES[action.status] || 'border-royal/10'}`}>
       <div className="flex items-start justify-between gap-3">
         <div className="flex-1">
           <div className="flex items-center gap-2 mb-1">
-            <span className="font-medium text-sm text-slate-900">{action.description}</span>
+            <span className="font-medium text-sm text-ink">{action.description}</span>
             <Badge variant="outline" className="text-[9px] px-1.5 py-0">
               {ACTION_TYPE_LABELS[action.actionType] || action.actionType}
             </Badge>
           </div>
-          <p className="text-xs text-slate-900/50">
+          <p className="text-xs text-ink/50">
             Proposed by {action.proposedByName} &middot;{' '}
             {new Date(action.proposedAt).toLocaleDateString('en-US', {
               month: 'short',
@@ -284,7 +284,7 @@ function ActionCard({
       )}
 
       {isPending && hasVoted && (
-        <p className="text-xs text-slate-900/40 mt-2 italic">You have already voted on this action</p>
+        <p className="text-xs text-ink/40 mt-2 italic">You have already voted on this action</p>
       )}
     </div>
   )
@@ -328,23 +328,23 @@ function ProposeDialog({
     <Dialog open={open} onOpenChange={onOpenChange}>
       <DialogContent className="sm:max-w-md rounded-2xl">
         <DialogHeader>
-          <DialogTitle className="text-lg font-[family-name:var(--font-cinzel)] font-semibold text-slate-900">
+          <DialogTitle className="text-lg font-[family-name:var(--font-cinzel)] font-semibold text-royal">
             Propose Quorum Action
           </DialogTitle>
-          <DialogDescription className="text-sm text-slate-900/50">
+          <DialogDescription className="text-sm text-ink/50">
             This action requires approval from at least 2 executors before it can proceed.
           </DialogDescription>
         </DialogHeader>
 
         <div className="space-y-4 py-2">
           <div className="space-y-1.5">
-            <label className="text-xs font-semibold text-slate-900/60 uppercase tracking-wider">
+            <label className="text-xs font-semibold text-ink/60 uppercase tracking-wider">
               Action Type
             </label>
             <select
               value={actionType}
               onChange={(e) => setActionType(e.target.value)}
-              className="w-full rounded-lg border border-slate-900/10 px-3 py-2 text-sm"
+              className="w-full rounded-lg border border-royal/10 px-3 py-2 text-sm"
             >
               <option value="phase_transition">Phase Transition</option>
               <option value="asset_distribution">Asset Distribution</option>
@@ -353,7 +353,7 @@ function ProposeDialog({
           </div>
 
           <div className="space-y-1.5">
-            <label className="text-xs font-semibold text-slate-900/60 uppercase tracking-wider">
+            <label className="text-xs font-semibold text-ink/60 uppercase tracking-wider">
               Description
             </label>
             <Textarea
diff --git a/web/src/components/estate/RSVPDialog.tsx b/web/src/components/estate/RSVPDialog.tsx
index 45db449..3d6d721 100644
--- a/web/src/components/estate/RSVPDialog.tsx
+++ b/web/src/components/estate/RSVPDialog.tsx
@@ -53,9 +53,9 @@ interface RSVPDialogProps {
 // ─── Response Pill Button ────────────────────────────────────────────────────
 
 const RESPONSE_OPTIONS: { value: RSVPResponse; label: string; icon: typeof Check; activeClass: string }[] = [
-  { value: 'attending', label: 'Attending', icon: Check, activeClass: 'bg-emerald-600 text-white border-emerald-600' },
+  { value: 'attending', label: 'Attending', icon: Check, activeClass: 'bg-green-600 text-white border-green-600' },
   { value: 'maybe', label: 'Maybe', icon: HelpCircle, activeClass: 'bg-amber-500 text-white border-amber-500' },
-  { value: 'not_attending', label: 'Not Attending', icon: X, activeClass: 'bg-slate-500 text-white border-slate-500' },
+  { value: 'not_attending', label: 'Not Attending', icon: X, activeClass: 'bg-ink-muted text-white border-ink-muted' },
 ]
 
 // ─── Component ───────────────────────────────────────────────────────────────
@@ -131,10 +131,10 @@ export function RSVPDialog({ estateId, eventId, eventTitle, open, onOpenChange }
     <Dialog open={open} onOpenChange={handleClose}>
       <DialogContent className="sm:max-w-lg max-h-[90vh] overflow-y-auto rounded-3xl p-10" showCloseButton={false}>
         <DialogHeader className="mb-6">
-          <DialogTitle className="text-2xl font-[family-name:var(--font-cinzel)] font-bold text-slate-900">
+          <DialogTitle className="text-2xl font-[family-name:var(--font-cinzel)] font-bold text-[var(--royal)]">
             {submitted ? 'RSVP Confirmed' : 'RSVP'}
           </DialogTitle>
-          <DialogDescription className="text-sm text-slate-500 mt-1">
+          <DialogDescription className="text-sm text-[var(--royal)]/60 mt-1">
             {submitted ? `Your response has been recorded for ${eventTitle}.` : `Respond to ${eventTitle}`}
           </DialogDescription>
         </DialogHeader>
@@ -142,10 +142,10 @@ export function RSVPDialog({ estateId, eventId, eventTitle, open, onOpenChange }
         {submitted ? (
           /* ── Confirmation View ── */
           <div className="text-center py-8 space-y-4">
-            <div className="w-16 h-16 rounded-full bg-emerald-50 flex items-center justify-center mx-auto">
-              <Check className="w-8 h-8 text-emerald-600" />
+            <div className="w-16 h-16 rounded-full bg-green-50 flex items-center justify-center mx-auto">
+              <Check className="w-8 h-8 text-green-600" />
             </div>
-            <p className="text-slate-700 text-sm">
+            <p className="text-[var(--royal)]/70 text-sm">
               {form.response === 'attending' && `You're attending with ${form.guests} guest${form.guests !== 1 ? 's' : ''}.`}
               {form.response === 'maybe' && 'You responded as maybe.'}
               {form.response === 'not_attending' && 'You responded as not attending.'}
@@ -175,7 +175,7 @@ export function RSVPDialog({ estateId, eventId, eventTitle, open, onOpenChange }
                         onClick={() => update('response', opt.value)}
                         className={`
                           flex items-center gap-2 px-4 py-2.5 rounded-xl border-2 text-[13px] font-bold transition-all
-                          ${isActive ? opt.activeClass : 'border-slate-200 text-slate-500 hover:border-slate-300'}
+                          ${isActive ? opt.activeClass : 'border-[var(--neutral-border)] text-[var(--royal)]/60 hover:border-gold/50'}
                         `}
                       >
                         <Icon className="w-4 h-4" />
@@ -193,7 +193,7 @@ export function RSVPDialog({ estateId, eventId, eventTitle, open, onOpenChange }
                   value={form.name}
                   onChange={(e) => update('name', e.target.value)}
                   placeholder="Full name"
-                  className="h-auto px-5 py-4 rounded-2xl border-slate-200 text-[14px]"
+                  className="h-auto px-5 py-4 rounded-2xl border-[var(--neutral-border)] text-[14px]"
                 />
               </div>
 
@@ -205,7 +205,7 @@ export function RSVPDialog({ estateId, eventId, eventTitle, open, onOpenChange }
                   value={form.email}
                   onChange={(e) => update('email', e.target.value)}
                   placeholder="your@email.com"
-                  className="h-auto px-5 py-4 rounded-2xl border-slate-200 text-[14px]"
+                  className="h-auto px-5 py-4 rounded-2xl border-[var(--neutral-border)] text-[14px]"
                 />
               </div>
 
@@ -219,9 +219,9 @@ export function RSVPDialog({ estateId, eventId, eventTitle, open, onOpenChange }
                     max={20}
                     value={form.guests}
                     onChange={(e) => update('guests', Math.max(1, Math.min(20, parseInt(e.target.value) || 1)))}
-                    className="h-auto px-5 py-4 rounded-2xl border-slate-200 text-[14px] w-24"
+                    className="h-auto px-5 py-4 rounded-2xl border-[var(--neutral-border)] text-[14px] w-24"
                   />
-                  <p className="text-[11px] text-slate-400">Including yourself</p>
+                  <p className="text-[11px] text-[var(--royal)]/40">Including yourself</p>
                 </div>
               )}
 
@@ -233,16 +233,16 @@ export function RSVPDialog({ estateId, eventId, eventTitle, open, onOpenChange }
                   onChange={(e) => update('message', e.target.value)}
                   placeholder="Any notes or well wishes..."
                   rows={3}
-                  className="px-5 py-4 rounded-2xl border-slate-200 text-[14px] resize-none"
+                  className="px-5 py-4 rounded-2xl border-[var(--neutral-border)] text-[14px] resize-none"
                 />
               </div>
             </div>
 
-            <DialogFooter className="flex-row justify-end gap-4 mt-8 pt-8 border-t border-slate-100">
+            <DialogFooter className="flex-row justify-end gap-4 mt-8 pt-8 border-t border-[var(--neutral-border)]">
               <Button
                 variant="ghost"
                 onClick={() => handleClose(false)}
-                className="px-8 py-4 h-auto rounded-2xl text-[14px] font-bold text-slate-500"
+                className="px-8 py-4 h-auto rounded-2xl text-[14px] font-bold text-[var(--royal)]/60"
               >
                 Cancel
               </Button>
diff --git a/web/src/components/estate/SectionEmptyState.tsx b/web/src/components/estate/SectionEmptyState.tsx
index e0f6f42..4dfaeaf 100644
--- a/web/src/components/estate/SectionEmptyState.tsx
+++ b/web/src/components/estate/SectionEmptyState.tsx
@@ -242,7 +242,7 @@ export function SectionEmptyState({
       </div>
       <h3
         className="text-xl font-bold mb-3 font-[family-name:var(--font-cinzel)]"
-        style={{ color: 'var(--color-slate-900)' }}
+        style={{ color: 'var(--ink)' }}
       >
         {heading || content.heading}
       </h3>
diff --git a/web/src/components/estate/SectionHeader.tsx b/web/src/components/estate/SectionHeader.tsx
index 3927487..5348ec5 100644
--- a/web/src/components/estate/SectionHeader.tsx
+++ b/web/src/components/estate/SectionHeader.tsx
@@ -69,59 +69,64 @@ const SECTION_THEMES: Record<SectionId, SectionTheme> = {
     iconBg: 'rgba(19, 51, 120, 0.10)',
   },
   'memories': {
+    // Re-toned off the magenta firewall → gold (heritage warmth, keepsakes).
     label: 'Memories',
     tagline: 'Moments worth keeping.',
     breadcrumb: 'Memories',
-    accentColor: '#9D174D',
-    accentLight: 'rgba(157, 23, 77, 0.06)',
-    gradientFrom: '#FFF1F2',
-    gradientTo: '#FFE4E6',
+    accentColor: '#B8860B',
+    accentLight: 'rgba(184, 134, 11, 0.06)',
+    gradientFrom: '#FFFBEB',
+    gradientTo: '#FEF3C7',
     icon: <Camera className="w-5 h-5" />,
-    iconBg: 'rgba(157, 23, 77, 0.10)',
+    iconBg: 'rgba(184, 134, 11, 0.10)',
   },
   'letters': {
+    // Re-toned off the green firewall → deep royal (composure, permanence).
     label: 'Letters',
     tagline: 'Words that outlast time.',
     breadcrumb: 'Letters & Directives',
-    accentColor: '#4D7C4D',
-    accentLight: 'rgba(77, 124, 77, 0.06)',
-    gradientFrom: '#F0FDF4',
-    gradientTo: '#DCFCE7',
+    accentColor: '#1E3A5F',
+    accentLight: 'rgba(30, 58, 95, 0.06)',
+    gradientFrom: '#EEF2FF',
+    gradientTo: '#E0E7FF',
     icon: <PenLine className="w-5 h-5" />,
-    iconBg: 'rgba(77, 124, 77, 0.10)',
+    iconBg: 'rgba(30, 58, 95, 0.10)',
   },
   'my-people': {
+    // Re-toned off the teal firewall → heritage royal (trust, lineage).
     label: 'My People',
     tagline: 'The ones who matter most.',
     breadcrumb: 'My People',
-    accentColor: '#0F766E',
-    accentLight: 'rgba(15, 118, 110, 0.06)',
-    gradientFrom: '#F0FDFA',
-    gradientTo: '#CCFBF1',
+    accentColor: '#133378',
+    accentLight: 'rgba(19, 51, 120, 0.06)',
+    gradientFrom: '#EEF2FF',
+    gradientTo: '#E0E7FF',
     icon: <Users className="w-5 h-5" />,
-    iconBg: 'rgba(15, 118, 110, 0.10)',
+    iconBg: 'rgba(19, 51, 120, 0.10)',
   },
   'the-vault': {
+    // Re-toned off the slate firewall → deep royal (security, weight).
     label: 'The Vault',
     tagline: 'Protected. Organized. Ready.',
     breadcrumb: 'The Vault',
-    accentColor: '#334155',
-    accentLight: 'rgba(51, 65, 85, 0.05)',
-    gradientFrom: '#F8FAFC',
-    gradientTo: '#F1F5F9',
+    accentColor: '#1E3A5F',
+    accentLight: 'rgba(30, 58, 95, 0.05)',
+    gradientFrom: '#EEF2FF',
+    gradientTo: '#E0E7FF',
     icon: <Shield className="w-5 h-5" />,
-    iconBg: 'rgba(51, 65, 85, 0.10)',
+    iconBg: 'rgba(30, 58, 95, 0.10)',
   },
   'life-chapters': {
+    // Re-toned off the violet firewall → gold (narrative warmth, chapters).
     label: 'Life Chapters',
     tagline: 'Your life, told in chapters.',
     breadcrumb: 'Your Legacy',
-    accentColor: '#7C3AED',
-    accentLight: 'rgba(124, 58, 237, 0.06)',
-    gradientFrom: '#FAF5FF',
-    gradientTo: '#F3E8FF',
+    accentColor: '#C8A951',
+    accentLight: 'rgba(200, 169, 81, 0.06)',
+    gradientFrom: '#FFFBEB',
+    gradientTo: '#FEF3C7',
     icon: <BookOpen className="w-5 h-5" />,
-    iconBg: 'rgba(124, 58, 237, 0.10)',
+    iconBg: 'rgba(200, 169, 81, 0.10)',
   },
   'events': {
     label: 'Events',
@@ -221,7 +226,7 @@ export function SectionHeader({
             <div className="space-y-1.5">
               <h1
                 className="text-[2rem] md:text-[2.5rem] font-[family-name:var(--font-cinzel)] font-bold leading-tight tracking-tight"
-                style={{ color: 'var(--color-slate-900)' }}
+                style={{ color: 'var(--ink)' }}
               >
                 {title || theme.label}
               </h1>
diff --git a/web/src/components/estate/SettlementGantt.tsx b/web/src/components/estate/SettlementGantt.tsx
index 9af65d6..001ccdd 100644
--- a/web/src/components/estate/SettlementGantt.tsx
+++ b/web/src/components/estate/SettlementGantt.tsx
@@ -100,7 +100,7 @@ export function SettlementGantt({ deadlines, dateOfDeath }: SettlementGanttProps
           <XAxis
             type="number"
             domain={[0, maxDay]}
-            tick={{ fontSize: 11, fill: 'var(--color-slate-500)' }}
+            tick={{ fontSize: 11, fill: '#4A5C7A' }}
             tickFormatter={(day: number) => {
               if (dateOfDeath) {
                 const d = new Date(dateOfDeath)
@@ -109,14 +109,14 @@ export function SettlementGantt({ deadlines, dateOfDeath }: SettlementGanttProps
               }
               return `Day ${day}`
             }}
-            axisLine={{ stroke: 'var(--color-slate-200)' }}
+            axisLine={{ stroke: '#DCE3EE' }}
             tickLine={false}
           />
           <YAxis
             type="category"
             dataKey="name"
             width={160}
-            tick={{ fontSize: 11, fill: 'var(--color-slate-900)' }}
+            tick={{ fontSize: 11, fill: '#142848' }}
             axisLine={false}
             tickLine={false}
           />
@@ -125,12 +125,12 @@ export function SettlementGantt({ deadlines, dateOfDeath }: SettlementGanttProps
               if (!active || !payload?.length) return null
               const d = payload[0].payload as GanttBar
               return (
-                <div className="bg-white border border-slate-900/10 rounded-xl px-4 py-3 shadow-lg text-sm">
-                  <p className="font-semibold text-slate-900">{d.name}</p>
-                  <p className="text-slate-900/60 text-xs mt-1">
+                <div className="bg-white border border-[#142848]/10 rounded-xl px-4 py-3 shadow-lg text-sm">
+                  <p className="font-semibold text-[#142848]">{d.name}</p>
+                  <p className="text-[#142848]/60 text-xs mt-1">
                     Due: {d.dueDate}
                   </p>
-                  <p className={`text-xs mt-0.5 font-medium ${d.overdue ? 'text-red-600' : 'text-slate-900/50'}`}>
+                  <p className={`text-xs mt-0.5 font-medium ${d.overdue ? 'text-red-600' : 'text-[#142848]/50'}`}>
                     {d.overdue
                       ? `${Math.abs(d.daysFromNow)} days overdue`
                       : `${d.daysFromNow} days remaining`}
@@ -165,7 +165,7 @@ export function SettlementGantt({ deadlines, dateOfDeath }: SettlementGanttProps
       </ResponsiveContainer>
 
       {/* Legend */}
-      <div className="flex items-center justify-center gap-4 mt-2 text-[10px] font-medium uppercase tracking-wider text-slate-900/50">
+      <div className="flex items-center justify-center gap-4 mt-2 text-[10px] font-medium uppercase tracking-wider text-[#142848]/50">
         <span className="flex items-center gap-1.5">
           <span className="w-2.5 h-2.5 rounded-sm bg-red-500" /> Overdue
         </span>
diff --git a/web/src/components/estate/SettlementPanel.tsx b/web/src/components/estate/SettlementPanel.tsx
index 546b1a6..86c1e47 100644
--- a/web/src/components/estate/SettlementPanel.tsx
+++ b/web/src/components/estate/SettlementPanel.tsx
@@ -27,8 +27,7 @@ import { Select, SelectTrigger, SelectValue, SelectContent, SelectItem } from '@
 import { Textarea } from '@/components/ui/textarea'
 import { toast } from 'sonner'
 import { auth } from '../../lib/firebase'
-
-const API_BASE = import.meta.env.VITE_API_URL || 'http://localhost:8080'
+import { API_BASE } from '../../lib/client'
 
 interface SettlementPanelProps {
   estateId: string
@@ -105,8 +104,8 @@ export function SettlementPanel({
         <CardContent className="px-10 py-8 space-y-6">
           <div className="flex items-start justify-between">
             <div className="space-y-2">
-              <p className="text-slate-900 font-bold text-lg">This estate is currently in settlement.</p>
-              <p className="text-slate-500 text-[14px] leading-relaxed max-w-lg">
+              <p className="text-ink font-bold text-lg">This estate is currently in settlement.</p>
+              <p className="text-ink-muted text-[14px] leading-relaxed max-w-lg">
                 {settlementType === 'death'
                   ? `The passing of ${ownerName || 'the estate owner'} has been reported. Time capsules and final messages are being delivered to their intended recipients.`
                   : `${ownerName || 'The estate owner'} has been reported as incapacitated. Settlement procedures are in progress.`}
@@ -121,7 +120,7 @@ export function SettlementPanel({
           </div>
 
           {settlementReportedAt && (
-            <p className="text-[12px] text-slate-400 font-medium">
+            <p className="text-[12px] text-ink-muted font-medium">
               Reported on {new Date(settlementReportedAt).toLocaleDateString('en-US', {
                 year: 'numeric',
                 month: 'long',
@@ -131,7 +130,7 @@ export function SettlementPanel({
           )}
 
           <div className="border-t border-amber-200/50 pt-6 space-y-3">
-            <h4 className="text-[11px] font-bold text-slate-400 uppercase tracking-widest">Settlement Checklist</h4>
+            <h4 className="text-[11px] font-bold text-ink-muted uppercase tracking-widest">Settlement Checklist</h4>
             <div className="space-y-2">
               {[
                 'Time capsules with settlement triggers delivered',
@@ -142,7 +141,7 @@ export function SettlementPanel({
               ].map((item, i) => (
                 <label key={i} className="flex items-center gap-3 py-2 px-3 rounded-xl hover:bg-amber-50 transition-colors cursor-pointer">
                   <input type="checkbox" className="w-4 h-4 rounded border-amber-300 text-amber-600 focus:ring-amber-500" />
-                  <span className="text-[14px] text-slate-700 font-medium">{item}</span>
+                  <span className="text-[14px] text-ink font-medium">{item}</span>
                 </label>
               ))}
             </div>
@@ -154,8 +153,8 @@ export function SettlementPanel({
 
   // --- Estate is NOT in settlement — show report option ---
   return (
-    <Card className="rounded-[2.5rem] border-slate-100 shadow-sm py-0 gap-0">
-      <div className="bg-gradient-to-r from-[var(--royal)]/[0.04] to-transparent px-4 py-4 md:px-10 md:py-6 border-b border-slate-100 flex items-center gap-3">
+    <Card className="rounded-[2.5rem] border-[var(--neutral-border)] shadow-sm py-0 gap-0">
+      <div className="bg-gradient-to-r from-[var(--royal)]/[0.04] to-transparent px-4 py-4 md:px-10 md:py-6 border-b border-[var(--neutral-border)] flex items-center gap-3">
         <div className="w-8 h-8 rounded-xl bg-[var(--royal)]/10 flex items-center justify-center">
           <svg viewBox="0 0 24 24" className="w-4 h-4 text-[var(--royal)]" fill="none" stroke="currentColor" strokeWidth="2.5">
             <path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z" />
@@ -165,10 +164,10 @@ export function SettlementPanel({
       </div>
       <CardContent className="px-10 py-8 space-y-6">
         <div className="space-y-2">
-          <p className="text-slate-900 font-bold text-[15px] leading-tight">
+          <p className="text-ink font-bold text-[15px] leading-tight">
             Report a Status Change
           </p>
-          <p className="text-[13px] text-slate-500 font-medium leading-relaxed max-w-lg">
+          <p className="text-[13px] text-ink-muted font-medium leading-relaxed max-w-lg">
             If {ownerName || 'the estate owner'} is no longer able to manage their estate,
             you can begin the settlement process. This will deliver all time capsules with
             settlement triggers and notify beneficiaries.
@@ -186,10 +185,10 @@ export function SettlementPanel({
           </AlertDialogTrigger>
           <AlertDialogContent className="max-w-md">
             <AlertDialogHeader>
-              <AlertDialogTitle className="text-lg font-[family-name:var(--font-cinzel)] font-bold text-slate-900">
+              <AlertDialogTitle className="text-lg font-[family-name:var(--font-cinzel)] font-bold text-royal">
                 Begin Settlement Process
               </AlertDialogTitle>
-              <AlertDialogDescription className="text-[14px] text-slate-500 leading-relaxed space-y-3">
+              <AlertDialogDescription className="text-[14px] text-ink-muted leading-relaxed space-y-3">
                 <span className="block">
                   This action will transition the estate into settlement. The following will happen:
                 </span>
@@ -202,7 +201,7 @@ export function SettlementPanel({
 
             <div className="space-y-4 py-2">
               <div className="space-y-2">
-                <label className="text-[12px] font-bold text-slate-500 uppercase tracking-wider">
+                <label className="text-[12px] font-bold text-ink-muted uppercase tracking-wider">
                   Status Type
                 </label>
                 <Select
@@ -220,7 +219,7 @@ export function SettlementPanel({
               </div>
 
               <div className="space-y-2">
-                <label className="text-[12px] font-bold text-slate-500 uppercase tracking-wider">
+                <label className="text-[12px] font-bold text-ink-muted uppercase tracking-wider">
                   Notes (optional)
                 </label>
                 <Textarea
diff --git a/web/src/components/estate/ShareMemorial.tsx b/web/src/components/estate/ShareMemorial.tsx
index 61c70fe..e994944 100644
--- a/web/src/components/estate/ShareMemorial.tsx
+++ b/web/src/components/estate/ShareMemorial.tsx
@@ -126,10 +126,10 @@ export function ShareMemorial({
     <Dialog open={open} onOpenChange={onOpenChange}>
       <DialogContent className="sm:max-w-md rounded-3xl p-8" showCloseButton={false}>
         <DialogHeader className="mb-4">
-          <DialogTitle className="text-xl font-[family-name:var(--font-cinzel)] font-bold text-slate-900">
+          <DialogTitle className="text-xl font-[family-name:var(--font-cinzel)] font-bold text-royal">
             Share Memorial
           </DialogTitle>
-          <DialogDescription className="text-slate-500 text-sm">
+          <DialogDescription className="text-ink-muted text-sm">
             Create a public memorial page that anyone can view without an account.
           </DialogDescription>
         </DialogHeader>
@@ -137,8 +137,8 @@ export function ShareMemorial({
         {!memorialUrl ? (
           /* Pre-publish state */
           <div className="space-y-4">
-            <div className="bg-slate-50 rounded-2xl p-5 border border-slate-100">
-              <p className="text-sm text-slate-700 leading-relaxed">
+            <div className="bg-[var(--neutral-faint)] rounded-2xl p-5 border border-[var(--neutral-border)]">
+              <p className="text-sm text-ink leading-relaxed">
                 This will create a public page for <span className="font-semibold">{personName}</span> with
                 the obituary{serviceDetails ? ', service details,' : ''} and memorial information.
                 Anyone with the link can view it.
@@ -149,7 +149,7 @@ export function ShareMemorial({
               <Button
                 variant="ghost"
                 onClick={() => onOpenChange(false)}
-                className="px-6 py-3 h-auto rounded-xl text-[13px] font-bold text-slate-500"
+                className="px-6 py-3 h-auto rounded-xl text-[13px] font-bold text-ink-muted"
               >
                 Cancel
               </Button>
@@ -174,14 +174,14 @@ export function ShareMemorial({
                 <Input
                   readOnly
                   value={memorialUrl}
-                  className="h-auto px-4 py-3 rounded-xl border-slate-200 text-[13px] text-slate-900 bg-slate-50"
+                  className="h-auto px-4 py-3 rounded-xl border-[var(--neutral-border)] text-[13px] text-ink bg-[var(--neutral-faint)]"
                 />
                 <Button
                   variant="secondary"
                   onClick={copyLink}
-                  className="px-4 py-3 h-auto rounded-xl bg-slate-100 hover:bg-slate-200"
+                  className="px-4 py-3 h-auto rounded-xl bg-[var(--neutral-faint)] hover:bg-[var(--neutral-border)]"
                 >
-                  {copied ? <Check className="w-4 h-4 text-[#059669]" /> : <Copy className="w-4 h-4 text-slate-500" />}
+                  {copied ? <Check className="w-4 h-4 text-[#059669]" /> : <Copy className="w-4 h-4 text-ink-muted" />}
                 </Button>
               </div>
             </div>
@@ -191,7 +191,7 @@ export function ShareMemorial({
               <label className="text-[11px] font-bold text-[var(--royal)]/60 uppercase tracking-widest">
                 QR Code
               </label>
-              <div className="flex flex-col items-center gap-4 p-6 bg-white rounded-2xl border border-slate-100">
+              <div className="flex flex-col items-center gap-4 p-6 bg-white rounded-2xl border border-[var(--neutral-border)]">
                 <div ref={qrRef}>
                   <QRCodeSVG
                     value={memorialUrl}
@@ -204,7 +204,7 @@ export function ShareMemorial({
                 <Button
                   variant="ghost"
                   onClick={downloadQR}
-                  className="text-[12px] font-bold text-slate-500 hover:text-[var(--royal)] rounded-xl"
+                  className="text-[12px] font-bold text-ink-muted hover:text-[var(--royal)] rounded-xl"
                 >
                   <Download className="w-3.5 h-3.5" />
                   Download QR Code
diff --git a/web/src/components/estate/ShepherdCompanion.tsx b/web/src/components/estate/ShepherdCompanion.tsx
index b9e8255..f8d6316 100644
--- a/web/src/components/estate/ShepherdCompanion.tsx
+++ b/web/src/components/estate/ShepherdCompanion.tsx
@@ -8,7 +8,7 @@
  * spine that turns a grid of tools into a guided process.
  *
  * Design intent: restrained and premium — Cinzel serif heading, royal + a single
- * gold accent, slate neutrals, generous spacing. No rainbow accents.
+ * gold accent, royal-tinted neutrals, generous spacing. No rainbow accents.
  */
 import { useCallback, useMemo, useState, type FormEvent } from 'react'
 import { useLocation, useNavigate } from '@tanstack/react-router'
@@ -244,19 +244,19 @@ export function ShepherdCompanion({
             animate={{ opacity: 1, x: 0 }}
             exit={{ opacity: 0, x: 40 }}
             transition={{ duration: 0.28, ease: [0.25, 0.1, 0.25, 1] }}
-            className="fixed right-0 top-0 z-40 flex h-screen w-[88vw] max-w-[360px] flex-col border-l border-slate-200 bg-white/95 backdrop-blur-sm shadow-2xl shadow-slate-900/5 lg:top-0"
+            className="fixed right-0 top-0 z-40 flex h-screen w-[88vw] max-w-[360px] flex-col border-l border-[var(--neutral-border)] bg-white/95 backdrop-blur-sm shadow-2xl shadow-royal/5 lg:top-0"
           >
             {/* Header */}
-            <div className="flex items-start justify-between gap-3 border-b border-slate-100 px-7 pt-7 pb-5">
+            <div className="flex items-start justify-between gap-3 border-b border-[var(--neutral-border)] px-7 pt-7 pb-5">
               <div className="flex items-center gap-3">
                 <div className="flex h-10 w-10 items-center justify-center rounded-xl bg-[var(--royal)]/8 text-[var(--royal)]">
                   <Compass className="h-5 w-5" strokeWidth={1.75} />
                 </div>
                 <div>
-                  <p className="text-[10px] font-semibold uppercase tracking-[0.22em] text-slate-400">
+                  <p className="text-[10px] font-semibold uppercase tracking-[0.22em] text-[var(--royal)]/40">
                     Shepherd
                   </p>
-                  <h2 className="font-[family-name:var(--font-cinzel)] text-lg font-bold leading-tight text-slate-900">
+                  <h2 className="font-[family-name:var(--font-cinzel)] text-lg font-bold leading-tight text-[var(--royal)]">
                     Good to see you, {firstName}
                   </h2>
                 </div>
@@ -265,7 +265,7 @@ export function ShepherdCompanion({
                 type="button"
                 onClick={onToggle}
                 aria-label="Hide Shepherd"
-                className="rounded-lg p-1.5 text-slate-400 transition-colors hover:bg-slate-100 hover:text-slate-700"
+                className="rounded-lg p-1.5 text-[var(--royal)]/40 transition-colors hover:bg-[var(--neutral-faint)] hover:text-[var(--royal)]/70"
               >
                 <X className="h-4 w-4" />
               </button>
@@ -274,19 +274,19 @@ export function ShepherdCompanion({
             {/* Progress */}
             <div className="px-7 py-6">
               <div className="mb-2 flex items-baseline justify-between">
-                <span className="text-[11px] font-semibold uppercase tracking-[0.18em] text-slate-500">
+                <span className="text-[11px] font-semibold uppercase tracking-[0.18em] text-[var(--royal)]/60">
                   Your plan
                 </span>
-                <span className="text-[13px] font-semibold text-slate-900">
+                <span className="text-[13px] font-semibold text-[var(--royal)]">
                   {percent}%
                   {score ? (
-                    <span className="ml-1.5 font-normal text-slate-400">
+                    <span className="ml-1.5 font-normal text-[var(--royal)]/40">
                       {score.completedSteps}/{score.totalSteps}
                     </span>
                   ) : null}
                 </span>
               </div>
-              <div className="h-1.5 w-full overflow-hidden rounded-full bg-slate-100">
+              <div className="h-1.5 w-full overflow-hidden rounded-full bg-[var(--neutral-faint)]">
                 <motion.div
                   className="h-full rounded-full bg-[var(--gold)]"
                   initial={{ width: 0 }}
@@ -300,35 +300,35 @@ export function ShepherdCompanion({
             <div className="flex-1 overflow-y-auto px-7 pb-7">
               {loading ? (
                 <div className="space-y-3">
-                  <div className="h-3 w-2/3 animate-pulse rounded bg-slate-100" />
-                  <div className="h-24 animate-pulse rounded-2xl bg-slate-100" />
+                  <div className="h-3 w-2/3 animate-pulse rounded bg-[var(--neutral-faint)]" />
+                  <div className="h-24 animate-pulse rounded-2xl bg-[var(--neutral-faint)]" />
                 </div>
               ) : done ? (
                 <div className="rounded-2xl border border-[var(--gold)]/25 bg-[var(--gold)]/5 p-6 text-center">
                   <div className="mx-auto mb-3 flex h-11 w-11 items-center justify-center rounded-full bg-[var(--gold)]/15 text-[var(--gold)]">
                     <Check className="h-5 w-5" strokeWidth={2.25} />
                   </div>
-                  <p className="font-[family-name:var(--font-cinzel)] text-base font-bold text-slate-900">
+                  <p className="font-[family-name:var(--font-cinzel)] text-base font-bold text-[var(--royal)]">
                     Your essentials are in place
                   </p>
-                  <p className="mt-1.5 text-[13px] leading-relaxed text-slate-500">
+                  <p className="mt-1.5 text-[13px] leading-relaxed text-[var(--royal)]/60">
                     {score?.insight || 'Revisit any section any time to refine your plan.'}
                   </p>
                 </div>
               ) : visibleNext ? (
                 <>
-                  <p className="mb-3 text-[11px] font-semibold uppercase tracking-[0.18em] text-slate-400">
+                  <p className="mb-3 text-[11px] font-semibold uppercase tracking-[0.18em] text-[var(--royal)]/40">
                     Your next step
                   </p>
                   <button
                     type="button"
                     onClick={() => goTo(visibleNext.route)}
-                    className="group w-full rounded-2xl border border-slate-200 bg-white p-6 text-left transition-all hover:border-[var(--royal)]/40 hover:shadow-sm"
+                    className="group w-full rounded-2xl border border-[var(--neutral-border)] bg-white p-6 text-left transition-all hover:border-[var(--royal)]/40 hover:shadow-sm"
                   >
-                    <h3 className="font-[family-name:var(--font-cinzel)] text-lg font-bold leading-snug text-slate-900">
+                    <h3 className="font-[family-name:var(--font-cinzel)] text-lg font-bold leading-snug text-[var(--royal)]">
                       {visibleNext.label}
                     </h3>
-                    <p className="mt-2 text-[13px] leading-relaxed text-slate-500">
+                    <p className="mt-2 text-[13px] leading-relaxed text-[var(--royal)]/60">
                       {visibleNext.description}
                     </p>
                     <span className="mt-4 inline-flex items-center gap-1.5 text-[13px] font-semibold text-[var(--royal)]">
@@ -340,7 +340,7 @@ export function ShepherdCompanion({
                   {/* Remaining steps, quietly listed for orientation */}
                   {visibleSteps.filter((s) => s.id !== visibleNext.id).length > 0 && (
                     <div className="mt-7">
-                      <p className="mb-3 text-[11px] font-semibold uppercase tracking-[0.18em] text-slate-400">
+                      <p className="mb-3 text-[11px] font-semibold uppercase tracking-[0.18em] text-[var(--royal)]/40">
                         Also ahead
                       </p>
                       <ul className="space-y-1">
@@ -352,10 +352,10 @@ export function ShepherdCompanion({
                               <button
                                 type="button"
                                 onClick={() => goTo(s.route)}
-                                className="flex w-full items-center justify-between rounded-lg px-3 py-2.5 text-left text-[13px] text-slate-600 transition-colors hover:bg-slate-50"
+                                className="flex w-full items-center justify-between rounded-lg px-3 py-2.5 text-left text-[13px] text-[var(--royal)]/60 transition-colors hover:bg-[var(--neutral-faint)]"
                               >
                                 <span>{s.label}</span>
-                                <ChevronRight className="h-3.5 w-3.5 text-slate-300" />
+                                <ChevronRight className="h-3.5 w-3.5 text-[var(--royal)]/30" />
                               </button>
                             </li>
                           ))}
@@ -364,18 +364,18 @@ export function ShepherdCompanion({
                   )}
                 </>
               ) : (
-                <p className="text-[13px] leading-relaxed text-slate-500">
+                <p className="text-[13px] leading-relaxed text-[var(--royal)]/60">
                   Your guide will appear here as you build your estate plan.
                 </p>
               )}
 
               {/* Route-aware guidance keeps Shepherd next to every CRUD action. */}
               {!loading && currentGuide && (
-                <div className="mt-7 rounded-2xl border border-slate-200 bg-slate-50 p-5">
-                  <p className="mb-1 text-[10px] font-semibold uppercase tracking-[0.2em] text-slate-400">
+                <div className="mt-7 rounded-2xl border border-[var(--neutral-border)] bg-[var(--neutral-faint)] p-5">
+                  <p className="mb-1 text-[10px] font-semibold uppercase tracking-[0.2em] text-[var(--royal)]/40">
                     Shepherd on this page
                   </p>
-                  <h3 className="font-[family-name:var(--font-cinzel)] text-base font-bold text-slate-900">
+                  <h3 className="font-[family-name:var(--font-cinzel)] text-base font-bold text-[var(--royal)]">
                     {currentGuide.title}
                   </h3>
                   <button
@@ -389,7 +389,7 @@ export function ShepherdCompanion({
                   <button
                     type="button"
                     onClick={() => goTo(currentGuide.actionRoute)}
-                    className="ml-4 mt-3 inline-flex items-center gap-1.5 text-[13px] font-semibold text-slate-500 hover:text-slate-800"
+                    className="ml-4 mt-3 inline-flex items-center gap-1.5 text-[13px] font-semibold text-[var(--royal)]/60 hover:text-[var(--royal)]"
                   >
                     {currentGuide.actionLabel}
                     <ChevronRight className="h-3.5 w-3.5" />
@@ -400,8 +400,8 @@ export function ShepherdCompanion({
               {/* Continue where you left off — in-progress work the user can resume.
                   Rendered only when something is genuinely unfinished. */}
               {!loading && visibleResumables.length > 0 && (
-                <div className="mt-7 border-t border-slate-100 pt-6">
-                  <p className="mb-3 text-[11px] font-semibold uppercase tracking-[0.18em] text-slate-400">
+                <div className="mt-7 border-t border-[var(--neutral-border)] pt-6">
+                  <p className="mb-3 text-[11px] font-semibold uppercase tracking-[0.18em] text-[var(--royal)]/40">
                     Continue where you left off
                   </p>
                   <ul className="space-y-1">
@@ -410,12 +410,12 @@ export function ShepherdCompanion({
                         <button
                           type="button"
                           onClick={() => goTo(r.route)}
-                          className="flex w-full items-center justify-between rounded-lg px-3 py-2.5 text-left text-[13px] text-slate-600 transition-colors hover:bg-slate-50"
+                          className="flex w-full items-center justify-between rounded-lg px-3 py-2.5 text-left text-[13px] text-[var(--royal)]/60 transition-colors hover:bg-[var(--neutral-faint)]"
                         >
-                          <span className="truncate font-[family-name:var(--font-cinzel)] text-slate-700">
+                          <span className="truncate font-[family-name:var(--font-cinzel)] text-[var(--royal)]/70">
                             {r.label}
                           </span>
-                          <ChevronRight className="h-3.5 w-3.5 shrink-0 text-slate-300" />
+                          <ChevronRight className="h-3.5 w-3.5 shrink-0 text-[var(--royal)]/30" />
                         </button>
                       </li>
                     ))}
@@ -424,8 +424,8 @@ export function ShepherdCompanion({
               )}
 
               {/* Central chat: available from every estate route, not just the dashboard. */}
-              <div className="mt-7 border-t border-slate-100 pt-6">
-                <p className="mb-3 text-[11px] font-semibold uppercase tracking-[0.18em] text-slate-400">
+              <div className="mt-7 border-t border-[var(--neutral-border)] pt-6">
+                <p className="mb-3 text-[11px] font-semibold uppercase tracking-[0.18em] text-[var(--royal)]/40">
                   Ask Shepherd
                 </p>
                 {messages.length === 0 ? (
@@ -435,21 +435,21 @@ export function ShepherdCompanion({
                         key={opener.label}
                         type="button"
                         onClick={() => ask(opener.prompt)}
-                        className="rounded-full border border-slate-200 px-3 py-1.5 text-[11px] font-semibold text-slate-600 transition-colors hover:border-[var(--royal)]/30 hover:text-[var(--royal)]"
+                        className="rounded-full border border-[var(--neutral-border)] px-3 py-1.5 text-[11px] font-semibold text-[var(--royal)]/60 transition-colors hover:border-[var(--royal)]/30 hover:text-[var(--royal)]"
                       >
                         {opener.label}
                       </button>
                     ))}
                   </div>
                 ) : (
-                  <div className="mb-3 max-h-64 space-y-3 overflow-y-auto rounded-2xl bg-slate-50 p-3">
+                  <div className="mb-3 max-h-64 space-y-3 overflow-y-auto rounded-2xl bg-[var(--neutral-faint)] p-3">
                     {messages.slice(-6).map((message, index) => (
                       <div
                         key={`${message.role}-${index}`}
                         className={`rounded-2xl px-3 py-2 text-[12px] leading-relaxed ${
                           message.role === 'user'
                             ? 'ml-8 bg-[var(--royal)] text-white'
-                            : 'mr-8 border border-slate-200 bg-white text-slate-700'
+                            : 'mr-8 border border-[var(--neutral-border)] bg-white text-[var(--royal)]/70'
                         }`}
                       >
                         {message.content}
@@ -467,7 +467,7 @@ export function ShepherdCompanion({
                     value={draft}
                     onChange={(event) => setDraft(event.target.value)}
                     placeholder="Ask what to do next..."
-                    className="min-w-0 flex-1 rounded-xl border border-slate-200 bg-white px-3 py-2 text-[13px] text-slate-900 outline-none transition-colors placeholder:text-slate-400 focus:border-[var(--royal)]"
+                    className="min-w-0 flex-1 rounded-xl border border-[var(--neutral-border)] bg-white px-3 py-2 text-[13px] text-[var(--royal)] outline-none transition-colors placeholder:text-[var(--royal)]/40 focus:border-[var(--royal)]"
                   />
                   <button
                     type="submit"
diff --git a/web/src/components/estate/ShepherdNudge.tsx b/web/src/components/estate/ShepherdNudge.tsx
index 7e149a2..f51674b 100644
--- a/web/src/components/estate/ShepherdNudge.tsx
+++ b/web/src/components/estate/ShepherdNudge.tsx
@@ -61,7 +61,7 @@ export function ShepherdNudge({ message, ctaLabel, ctaRoute, onDismiss }: Shephe
 
         {/* Content */}
         <div className="flex-1 min-w-0 space-y-2">
-          <p className="text-[13px] text-slate-900/80 leading-relaxed font-medium">
+          <p className="text-[13px] text-ink/80 leading-relaxed font-medium">
             {message}
           </p>
           {ctaLabel && ctaRoute && (
diff --git a/web/src/components/guards/AuthGuard.tsx b/web/src/components/guards/AuthGuard.tsx
index 6693fb6..1f8446b 100644
--- a/web/src/components/guards/AuthGuard.tsx
+++ b/web/src/components/guards/AuthGuard.tsx
@@ -24,7 +24,7 @@ export function AuthGuard({ children }: { children: React.ReactNode }) {
   // Loading state — premium spinner
   if (loading) {
     return (
-      <div className="min-h-screen flex items-center justify-center bg-slate-50">
+      <div className="min-h-screen flex items-center justify-center bg-[var(--neutral-faint)]">
         <div className="flex flex-col items-center gap-4">
           <div className="w-10 h-10 border-3 border-[var(--royal)]/20 border-t-[var(--royal)] rounded-full animate-spin" />
           <p className="text-[var(--royal)]/60 text-sm font-medium tracking-wide">
diff --git a/web/src/components/guards/HeirWelcome.tsx b/web/src/components/guards/HeirWelcome.tsx
index 1ffafa1..6a47be5 100644
--- a/web/src/components/guards/HeirWelcome.tsx
+++ b/web/src/components/guards/HeirWelcome.tsx
@@ -28,7 +28,7 @@ import {
   type TimeCapsule,
   type Heirloom,
 } from '@/lib/firestore'
-import { orderBy, type Timestamp } from 'firebase/firestore'
+import { orderBy, where, type Timestamp } from 'firebase/firestore'
 import { Card, CardContent } from '@/components/ui/card'
 import { Button } from '@/components/ui/button'
 import { Separator } from '@/components/ui/separator'
@@ -46,6 +46,10 @@ interface SoulLogEntry {
   content?: string
   mediaUrl?: string
   taggedPeople: string[]
+  // sharedWith (UIDs) is the security field the Firestore soul-log read rule and the
+  // non-owner query gate on (array-contains). taggedPeople holds display names for the
+  // UI; sharedWith holds the recipient UIDs — see estates.$estateId.soul-log.lazy.tsx.
+  sharedWith?: string[]
   sealedDelivery?: {
     trigger: 'date' | 'on_passing'
     date?: string
@@ -241,10 +245,30 @@ export function HeirWelcome({ estateId, onContinue }: HeirWelcomeProps) {
   // Fetch time capsules addressed to this user
   const { data: allCapsules, loading: capsulesLoading } = useTimeCapsules(estateId)
 
-  // Fetch soul log entries (shared ones that tag this user)
-  const soulLogConstraints = useMemo(() => [orderBy('createdAt', 'desc')], [])
+  // Fetch soul log entries shared specifically with this heir/executor.
+  //
+  // HeirWelcome renders ONLY for non-owner roles (heir/executor — see
+  // shouldShowHeirWelcome). The Firestore soul-log read rule permits a non-owner to
+  // read an entry ONLY when visibility=='shared' && request.auth.uid in sharedWith.
+  // An UNconstrained list query by a non-owner cannot satisfy that resource-data
+  // constraint, so Firestore rejects the ENTIRE query with permission-denied. We
+  // therefore mirror the canonical non-owner constraints from
+  // estates.$estateId.soul-log.lazy.tsx (ADR-046 #1): visibility=='shared' +
+  // sharedWith array-contains this uid. The composite index (visibility ASC,
+  // sharedWith CONTAINS, createdAt DESC) already exists in firestore.indexes.json.
+  //
+  // The query is gated on `profile.uid` (null path until the uid is known) so we never
+  // issue the denied unconstrained read while auth is still resolving.
+  const soulLogConstraints = useMemo(
+    () => [
+      where('visibility', '==', 'shared'),
+      where('sharedWith', 'array-contains', profile?.uid ?? '__none__'),
+      orderBy('createdAt', 'desc'),
+    ],
+    [profile?.uid],
+  )
   const { data: allSoulLogEntries, loading: soulLogLoading } = useCollection<SoulLogEntry>(
-    `estates/${estateId}/soul-log`,
+    profile?.uid ? `estates/${estateId}/soul-log` : null,
     soulLogConstraints,
   )
 
@@ -269,22 +293,18 @@ export function HeirWelcome({ estateId, onContinue }: HeirWelcomeProps) {
     })
   }, [profile, allCapsules])
 
-  // ─── Filter soul log entries tagged for this user ──────────────────────
-
-  const personalEntries = useMemo(() => {
-    if (!profile || !allSoulLogEntries) return []
-    const uid = profile.uid
-    const name = profile.displayName?.toLowerCase()
-    const firstName = profile.firstName?.toLowerCase()
-    return allSoulLogEntries.filter((entry: SoulLogEntry) => {
-      if (entry.visibility !== 'shared') return false
-      if (!entry.taggedPeople || entry.taggedPeople.length === 0) return false
-      return entry.taggedPeople.some((tag: string) => {
-        const t = tag.toLowerCase()
-        return t === uid || t === name || t === firstName
-      })
-    })
-  }, [profile, allSoulLogEntries])
+  // ─── Soul log entries shared with this user ────────────────────────────
+
+  // The Firestore query above already constrains the result set to
+  // visibility=='shared' && sharedWith array-contains this uid — the SAME contract the
+  // security rule enforces. So every returned entry is, by construction, shared with
+  // this heir/executor; no further client-side filtering is needed. (The previous
+  // taggedPeople display-name match was both a schema mismatch with the rule's
+  // sharedWith UID gate and redundant once the query is correctly constrained.)
+  const personalEntries = useMemo(
+    () => allSoulLogEntries ?? [],
+    [allSoulLogEntries],
+  )
 
   // ─── Filter heirlooms for this heir ────────────────────────────────────
 
diff --git a/web/src/components/guards/IdentityGate.tsx b/web/src/components/guards/IdentityGate.tsx
index df4c5cd..fdaddae 100644
--- a/web/src/components/guards/IdentityGate.tsx
+++ b/web/src/components/guards/IdentityGate.tsx
@@ -15,6 +15,7 @@
  */
 
 import React, { useState } from 'react';
+import { Link } from '@tanstack/react-router';
 import { useAuth } from '../../lib/auth';
 import { getMFAStatus } from '../../lib/mfa';
 import { useDocument, type EstateUser } from '../../lib/firestore';
@@ -152,7 +153,7 @@ function IdentityGateInner({ estateId, children, user, profile, profileResolved,
     if (principalGracePeriodActive) {
       return (
         <>
-          <MFAGraceBanner />
+          <MFAGraceBanner estateId={estateId} />
           {children}
         </>
       );
@@ -184,7 +185,7 @@ function IdentityGateInner({ estateId, children, user, profile, profileResolved,
             completed={false}
             active={true}
             actionLabel="Go to Settings"
-            actionHref="/dashboard/settings"
+            actionTo={`/estates/${estateId}/settings`}
           />
         </div>
 
@@ -232,7 +233,7 @@ function IdentityGateInner({ estateId, children, user, profile, profileResolved,
           completed={mfaStatus.enrolled}
           active={!mfaStatus.enrolled}
           actionLabel="Go to Settings"
-          actionHref="/dashboard/settings"
+          actionTo={`/estates/${estateId}/settings`}
         />
 
         {/* Step 2: Attestation */}
@@ -243,7 +244,7 @@ function IdentityGateInner({ estateId, children, user, profile, profileResolved,
           completed={!!attestationVerified}
           active={mfaStatus.enrolled && !attestationVerified}
           actionLabel="Sign Attestation"
-          actionHref={`/estates/${estateId}/attestation`}
+          actionTo={`/estates/${estateId}/attestation`}
         />
       </div>
 
@@ -259,7 +260,10 @@ function IdentityGateInner({ estateId, children, user, profile, profileResolved,
 
 // ── MFA Grace Banner ──
 
-function MFAGraceBanner() {
+function MFAGraceBanner({ estateId }: { estateId: string }) {
+  // Plain string (not the typed-router union) so the interpolated estate path is
+  // accepted, matching RoleGuard's landingTo pattern.
+  const settingsTo: string = `/estates/${estateId}/settings`;
   return (
     <div className="mb-6 mx-auto max-w-4xl">
       <div className="flex items-center justify-between gap-4 px-6 py-4 bg-[var(--gold)]/10 border border-[var(--gold)]/20 rounded-2xl">
@@ -269,16 +273,16 @@ function MFAGraceBanner() {
               <path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z" />
             </svg>
           </div>
-          <p className="text-[13px] font-bold text-slate-900">
+          <p className="text-[13px] font-bold text-royal">
             Secure your account with two-factor authentication
           </p>
         </div>
-        <a
-          href="/dashboard/settings"
+        <Link
+          to={settingsTo}
           className="px-5 py-2 rounded-xl bg-[var(--gold)] hover:bg-[var(--gold)] text-white font-bold text-[11px] uppercase tracking-widest shadow-sm transition-all active:scale-[0.98] inline-block no-underline shrink-0"
         >
           Enroll Now
-        </a>
+        </Link>
       </div>
     </div>
   );
@@ -293,7 +297,7 @@ function VerificationStep({
   completed,
   active,
   actionLabel,
-  actionHref,
+  actionTo,
 }: {
   step: number;
   title: string;
@@ -301,7 +305,10 @@ function VerificationStep({
   completed: boolean;
   active: boolean;
   actionLabel: string;
-  actionHref: string;
+  /** In-app SPA destination (interpolated estate route). Uses TanStack <Link>
+   *  so the click stays inside the estate layout instead of a full navigation
+   *  to a non-existent path. */
+  actionTo: string;
 }) {
   return (
     <div className={`bg-white rounded-[2.5rem] border p-8 flex items-center gap-8 transition-all ${
@@ -353,12 +360,12 @@ function VerificationStep({
             Verified
           </span>
         ) : active ? (
-          <a
-            href={actionHref}
+          <Link
+            to={actionTo}
             className="px-6 py-3 rounded-2xl bg-royal hover:bg-sapphire text-white font-black text-[10px] uppercase tracking-widest shadow-lg transition-all active:scale-[0.98] inline-block no-underline border border-white/10"
           >
             {actionLabel} →
-          </a>
+          </Link>
         ) : (
           <span className="text-[9px] font-black text-royal/15 uppercase tracking-widest">
             Complete Step {step - 1} first
@@ -422,7 +429,7 @@ function EmailVerificationGate({
       </div>
 
       <div className="bg-white rounded-[2.5rem] border border-[var(--royal)]/10 p-8 text-center space-y-6">
-        <p className="text-slate-500 text-sm leading-relaxed">
+        <p className="text-ink-muted text-sm leading-relaxed">
           Email verification protects your estate by ensuring only you can access your account.
           Check your spam folder if you don't see the email.
         </p>
diff --git a/web/src/components/guards/OwnerWelcome.tsx b/web/src/components/guards/OwnerWelcome.tsx
index 0fdc0e0..03cac10 100644
--- a/web/src/components/guards/OwnerWelcome.tsx
+++ b/web/src/components/guards/OwnerWelcome.tsx
@@ -34,7 +34,7 @@ export function OwnerWelcome({ estateId: _estateId, estateName, onContinue }: Ow
   const firstName = profile?.firstName || profile?.displayName?.split(' ')[0] || 'there'
 
   return (
-    <div className="min-h-screen bg-gradient-to-b from-white via-slate-50 to-slate-50 flex items-center justify-center">
+    <div className="min-h-screen bg-gradient-to-b from-white via-[var(--neutral-faint)] to-[var(--neutral-faint)] flex items-center justify-center">
       <div className="max-w-xl mx-auto px-6 py-16 text-center">
 
         {/* Compass icon — The Shepherd's symbol */}
@@ -46,17 +46,17 @@ export function OwnerWelcome({ estateId: _estateId, estateName, onContinue }: Ow
         </div>
 
         {/* Welcome headline */}
-        <h1 className="text-3xl md:text-4xl font-[family-name:var(--font-cinzel)] font-bold text-slate-900 tracking-tight mb-4 leading-tight">
+        <h1 className="text-3xl md:text-4xl font-[family-name:var(--font-cinzel)] font-bold text-royal tracking-tight mb-4 leading-tight">
           Welcome, {firstName}.
         </h1>
 
         {/* The emotional hook — this is NOT a legal tool */}
-        <p className="text-lg text-slate-700 leading-relaxed mb-4 max-w-md mx-auto">
-          You&rsquo;ve just created <span className="font-semibold text-slate-900">{estateName}</span> &mdash;
+        <p className="text-lg text-ink leading-relaxed mb-4 max-w-md mx-auto">
+          You&rsquo;ve just created <span className="font-semibold text-ink">{estateName}</span> &mdash;
           a living record of your life, your wishes, and the people who matter most.
         </p>
 
-        <p className="text-slate-500 leading-relaxed mb-12 max-w-md mx-auto">
+        <p className="text-ink-muted leading-relaxed mb-12 max-w-md mx-auto">
           This isn&rsquo;t a legal form. It&rsquo;s a companion &mdash; a place to
           record your voice, preserve your memories, and organize everything
           the people you love will need someday. At your pace, on your terms.
@@ -113,7 +113,7 @@ export function OwnerWelcome({ estateId: _estateId, estateName, onContinue }: Ow
           Start Building Your Legacy
         </Button>
 
-        <p className="text-xs text-slate-400 mt-6">
+        <p className="text-xs text-ink-muted mt-6">
           The Shepherd is here whenever you need guidance.
         </p>
       </div>
@@ -133,13 +133,13 @@ function WelcomeStep({
   description: string
 }) {
   return (
-    <div className="flex items-start gap-4 p-4 rounded-2xl bg-white/60 border border-slate-100">
+    <div className="flex items-start gap-4 p-4 rounded-2xl bg-white/60 border border-[var(--neutral-border)]">
       <div className="w-10 h-10 rounded-xl bg-[var(--royal)]/5 flex items-center justify-center flex-shrink-0 text-[var(--royal)]/50">
         {icon}
       </div>
       <div>
-        <p className="text-sm font-semibold text-slate-900">{title}</p>
-        <p className="text-xs text-slate-500 mt-0.5">{description}</p>
+        <p className="text-sm font-semibold text-ink">{title}</p>
+        <p className="text-xs text-ink-muted mt-0.5">{description}</p>
       </div>
     </div>
   )
diff --git a/web/src/components/guards/RoleGuard.test.ts b/web/src/components/guards/RoleGuard.test.ts
index 635d457..4d0191c 100644
--- a/web/src/components/guards/RoleGuard.test.ts
+++ b/web/src/components/guards/RoleGuard.test.ts
@@ -42,13 +42,13 @@ describe('direct-URL enforcement — the section a persona must not reach', () =
   it('blocks a heir who direct-URLs owner-only / settlement routes', () => {
     expect(guardBlocks('heir', `/estates/${EST}/vault`)).toBe(true)
     expect(guardBlocks('heir', `/estates/${EST}/lockbox`)).toBe(true)
-    expect(guardBlocks('heir', `/estates/${EST}/settings`)).toBe(true)
     expect(guardBlocks('heir', `/estates/${EST}/probate`)).toBe(true)
     expect(guardBlocks('heir', `/estates/${EST}/forms`)).toBe(true)
   })
 
   it('does NOT block a heir on routes meant for them (incl. their sacred dashboard)', () => {
     expect(guardBlocks('heir', `/estates/${EST}/dashboard`)).toBe(false)
+    expect(guardBlocks('heir', `/estates/${EST}/settings`)).toBe(false)
     expect(guardBlocks('heir', `/estates/${EST}/memoirs`)).toBe(false)
     expect(guardBlocks('heir', `/estates/${EST}/events`)).toBe(false)
     expect(guardBlocks('heir', `/estates/${EST}/obituary`)).toBe(false)
diff --git a/web/src/components/landing/ProductShowcase.tsx b/web/src/components/landing/ProductShowcase.tsx
index fb92fd2..0647489 100644
--- a/web/src/components/landing/ProductShowcase.tsx
+++ b/web/src/components/landing/ProductShowcase.tsx
@@ -114,7 +114,7 @@ export function ProductShowcase() {
               'relative px-4 py-2 rounded-lg text-xs font-bold uppercase tracking-widest transition-all cursor-pointer overflow-hidden',
               activeIndex === i
                 ? 'bg-[var(--gold)] text-[var(--royal)] shadow-[0_0_15px_rgba(200,169,81,0.3)] font-black'
-                : 'bg-white text-slate-700 hover:bg-slate-100 shadow-[0_2px_8px_rgba(0,0,0,0.08)]'
+                : 'bg-white text-ink hover:bg-[var(--neutral-faint)] shadow-[0_2px_8px_rgba(0,0,0,0.08)]'
             )}
           >
             {tab.label}
@@ -134,14 +134,14 @@ export function ProductShowcase() {
         {/* Browser chrome frame */}
         <div className="rounded-xl overflow-hidden border border-white/10 shadow-2xl shadow-black/40">
           {/* Title bar */}
-          <div className="bg-slate-800 flex items-center gap-2 px-4 py-2.5">
+          <div className="bg-royal-blue flex items-center gap-2 px-4 py-2.5">
             <div className="flex gap-1.5">
               <div className="w-3 h-3 rounded-full bg-[#EF4444]/80" />
               <div className="w-3 h-3 rounded-full bg-[#F59E0B]/80" />
               <div className="w-3 h-3 rounded-full bg-[#22C55E]/80" />
             </div>
             <div className="flex-1 ml-4">
-              <div className="bg-slate-900 rounded-md px-3 py-1 text-[10px] text-white/40 font-mono text-center max-w-xs mx-auto">
+              <div className="bg-royal rounded-md px-3 py-1 text-[10px] text-white/40 font-mono text-center max-w-xs mx-auto">
                 finalwishes.app/estates/{active.id === 'beneficiaries' ? 'people' : active.id}
               </div>
             </div>
diff --git a/web/src/components/layout/AdminHeader.tsx b/web/src/components/layout/AdminHeader.tsx
index 6e6920d..e70ba3a 100644
--- a/web/src/components/layout/AdminHeader.tsx
+++ b/web/src/components/layout/AdminHeader.tsx
@@ -3,7 +3,7 @@ import React, { useState, useRef, useEffect, useCallback } from "react";
 import { useAuth } from '../../lib/auth'
 import { useParams, useNavigate } from '@tanstack/react-router'
 import { useEstateSearch, type SearchResult } from '@/lib/search'
-import { SearchResults } from '@/components/search/SearchResults'
+import { SearchResults, SEARCH_LISTBOX_ID, searchOptionId } from '@/components/search/SearchResults'
 import { NotificationBell } from '@/components/layout/NotificationBell'
 import {
   DropdownMenu,
@@ -13,6 +13,8 @@ import {
   DropdownMenuSeparator,
   DropdownMenuTrigger,
 } from '@/components/ui/dropdown-menu'
+import { Dialog, DialogContent, DialogTitle } from '@/components/ui/dialog'
+import { VisuallyHidden } from 'radix-ui'
 
 export function AdminHeader({
   title,
@@ -107,32 +109,24 @@ export function AdminHeader({
       className="sticky top-0 z-50 flex items-center justify-between h-[var(--header-height)] px-4 md:px-8 border-b border-royal/10 relative"
       style={{ background: 'var(--header-bg)' }}
     >
-      {/* Photo Modal */}
-      {showPhotoModal && user?.profilePhotoUrl && (
-        <div
-          className="fixed inset-0 z-[500] flex items-center justify-center bg-royal/10 backdrop-blur-xl p-8 animate-in fade-in duration-500 pointer-events-auto"
-          onClick={() => setShowPhotoModal(false)}
+      {/* Photo Modal — accessible Dialog (focus trap, Escape, focus restoration) */}
+      <Dialog open={showPhotoModal && !!user?.profilePhotoUrl} onOpenChange={setShowPhotoModal}>
+        <DialogContent
+          showCloseButton={true}
+          className="max-w-[90vw] max-h-[90vh] sm:max-w-[90vw] p-0 bg-white border border-royal/20 shadow-2xl overflow-hidden"
         >
-          <div
-            className="relative bg-white overflow-hidden border border-royal/20 shadow-2xl animate-in zoom-in duration-500 max-w-[90vw] max-h-[90vh] flex flex-col"
-            onClick={(e) => e.stopPropagation()}
-          >
+          <VisuallyHidden.Root>
+            <DialogTitle>Profile Photo</DialogTitle>
+          </VisuallyHidden.Root>
+          {user?.profilePhotoUrl && (
             <img
               src={user.profilePhotoUrl}
               className="max-w-full max-h-[80vh] object-contain block mx-auto"
               alt="Full Fidelity Portrait"
             />
-            <div className="absolute top-8 right-8">
-              <button
-                onClick={(e) => { e.stopPropagation(); setShowPhotoModal(false); }}
-                className="w-10 h-10 bg-white border border-royal/20 flex items-center justify-center text-royal hover:bg-royal/5 transition-all shadow-lg"
-              >
-                <svg viewBox="0 0 24 24" className="w-5 h-5" fill="none" stroke="currentColor" strokeWidth="2.5"><path d="M18 6L6 18M6 6l12 12"/></svg>
-              </button>
-            </div>
-          </div>
-        </div>
-      )}
+          )}
+        </DialogContent>
+      </Dialog>
 
       <div className="relative z-10 flex items-center justify-between w-full h-full gap-3 md:gap-0">
         {/* Mobile Hamburger */}
@@ -188,11 +182,22 @@ export function AdminHeader({
             value={searchQuery}
             onChange={(e) => updateSearchQuery(e.target.value)}
             onFocus={() => setSearchFocused(true)}
+            aria-label="Search estate"
+            role="combobox"
+            aria-expanded={showDropdown}
+            aria-controls={SEARCH_LISTBOX_ID}
+            aria-autocomplete="list"
+            aria-activedescendant={
+              showDropdown && activeIndex >= 0 && activeIndex < results.length
+                ? searchOptionId(activeIndex)
+                : undefined
+            }
             className="flex-1 bg-transparent border-none outline-none text-[0.8rem] font-bold text-royal placeholder:text-royal/20"
           />
           {searchQuery && (
             <button
               onClick={() => { updateSearchQuery(''); inputRef.current?.focus(); }}
+              aria-label="Clear search"
               className="text-royal/30 hover:text-royal/60 transition-colors"
             >
               <svg viewBox="0 0 24 24" className="w-3.5 h-3.5" fill="none" stroke="currentColor" strokeWidth="2.5">
@@ -224,10 +229,17 @@ export function AdminHeader({
             <span className="text-[9px] font-black text-royal/70 uppercase tracking-widest leading-none">{mode === 'Owner' ? 'Active Owner' : mode === 'Incapacity' ? 'Incapacity' : 'After Passing'}</span>
           </div>
         </div>
-        <div className="flex items-center gap-1 p-1 bg-white border border-royal/10 rounded-xl">
+        <div
+          role="radiogroup"
+          aria-label="View as authority mode"
+          className="flex items-center gap-1 p-1 bg-white border border-royal/10 rounded-xl"
+        >
           {(['Owner', 'Incapacity', 'Settlement'] as const).map((m) => (
             <button
               key={m}
+              type="button"
+              role="radio"
+              aria-checked={mode === m}
               onClick={() => setMode(m)}
               className={`px-3 py-1.5 rounded-lg text-[9px] font-black transition-all uppercase tracking-widest ${
                 mode === m
diff --git a/web/src/components/layout/NotificationBell.tsx b/web/src/components/layout/NotificationBell.tsx
index 7b78e7b..d27b75d 100644
--- a/web/src/components/layout/NotificationBell.tsx
+++ b/web/src/components/layout/NotificationBell.tsx
@@ -71,14 +71,14 @@ function NotificationRow({
       onSelect={handleClick}
     >
       <div className="flex items-center gap-2 w-full">
-        <span className="text-[13px] font-bold text-slate-900 truncate flex-1">
+        <span className="text-[13px] font-bold text-ink truncate flex-1">
           {notification.title || 'Activity'}
         </span>
         <span className={`px-1.5 py-0.5 rounded text-[9px] font-bold uppercase tracking-wider ${colors}`}>
           {notification.type || 'activity'}
         </span>
       </div>
-      <span className="text-[11px] text-slate-500 font-medium">
+      <span className="text-[11px] text-ink-muted font-medium">
         {timeAgo(createdDate)}
       </span>
     </DropdownMenuItem>
@@ -152,13 +152,13 @@ export function NotificationBell({ estateId }: NotificationBellProps) {
 
         {loading && (
           <div className="px-3 py-6 text-center">
-            <span className="text-[12px] text-slate-500 font-medium">Loading...</span>
+            <span className="text-[12px] text-ink-muted font-medium">Loading...</span>
           </div>
         )}
 
         {!loading && unreadCount === 0 && (
           <div className="px-3 py-6 text-center">
-            <span className="text-[12px] text-slate-500 font-medium">No unread notifications</span>
+            <span className="text-[12px] text-ink-muted font-medium">No unread notifications</span>
           </div>
         )}
 
diff --git a/web/src/components/layout/Sidebar.tsx b/web/src/components/layout/Sidebar.tsx
index 1c3ee20..981bfe1 100644
--- a/web/src/components/layout/Sidebar.tsx
+++ b/web/src/components/layout/Sidebar.tsx
@@ -1,8 +1,17 @@
 import { type ReactNode, useState, useMemo } from "react";
 import { Link, useLocation, useParams, useNavigate } from "@tanstack/react-router";
 import { useAuth } from "../../lib/auth";
+import { useUserEstates, useEstate, type EstateUser } from "../../lib/firestore";
 import { Dialog, DialogContent, DialogTitle } from "@/components/ui/dialog";
 import { Sheet, SheetContent, SheetTitle } from "@/components/ui/sheet";
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuLabel,
+  DropdownMenuSeparator,
+  DropdownMenuTrigger,
+} from "@/components/ui/dropdown-menu";
 import { Button } from "@/components/ui/button";
 import { Badge } from "@/components/ui/badge";
 import { Avatar, AvatarImage, AvatarFallback } from "@/components/ui/avatar";
@@ -27,6 +36,8 @@ import {
   Bell,
   Star,
   Settings,
+  Landmark,
+  Check,
 } from "lucide-react";
 
 /* ─── Navigation Group Types ─── */
@@ -195,7 +206,7 @@ function SidebarNavContent({
     <nav className="py-4">
       {/* Main nav groups */}
       <div className="mb-4">
-        <div className="text-[10px] font-bold text-slate-300 uppercase tracking-[0.2em] px-5 py-2">
+        <div className="text-[10px] font-bold text-ink-muted uppercase tracking-[0.2em] px-5 py-2">
           Your Legacy
         </div>
         {groups.map((group) => {
@@ -212,7 +223,7 @@ function SidebarNavContent({
                   className={`w-full flex items-center gap-3 px-5 py-2.5 text-[0.8rem] cursor-pointer transition-all border-l-[3px] ${
                     groupActive
                       ? "text-[var(--royal)] bg-[var(--royal)]/5 border-l-[var(--royal)] font-bold"
-                      : "text-slate-400 border-l-transparent hover:text-slate-900 hover:bg-slate-50"
+                      : "text-[var(--ink-muted)] border-l-transparent hover:text-[var(--royal)] hover:bg-[var(--neutral-faint)]"
                   }`}
                 >
                   <span
@@ -226,7 +237,7 @@ function SidebarNavContent({
                   <ChevronRight
                     className={`w-3.5 h-3.5 transition-transform duration-200 ${
                       isExpanded ? "rotate-90" : ""
-                    } ${groupActive ? "text-[var(--royal)]" : "text-slate-300"}`}
+                    } ${groupActive ? "text-[var(--royal)]" : "text-ink-muted"}`}
                   />
                 </button>
                 {isExpanded && (
@@ -242,7 +253,7 @@ function SidebarNavContent({
                           className={`flex items-center gap-3 pl-7 pr-5 py-2 text-[0.73rem] cursor-pointer transition-all border-l-[3px] no-underline ${
                             childActive
                               ? "text-[var(--royal)] bg-[var(--royal)]/5 border-l-[var(--royal)] font-bold"
-                              : "text-slate-400 border-l-transparent hover:text-slate-900 hover:bg-slate-50"
+                              : "text-[var(--ink-muted)] border-l-transparent hover:text-[var(--royal)] hover:bg-[var(--neutral-faint)]"
                           }`}
                         >
                           <span className="text-[0.73rem] font-medium">{child.label}</span>
@@ -277,7 +288,7 @@ function SidebarNavContent({
               className={`flex items-center gap-3 px-5 py-2.5 text-[0.8rem] cursor-pointer transition-all border-l-[3px] no-underline ${
                 isActive
                   ? "text-[var(--royal)] bg-[var(--royal)]/5 border-l-[var(--royal)] font-bold"
-                  : "text-slate-400 border-l-transparent hover:text-slate-900 hover:bg-slate-50"
+                  : "text-[var(--ink-muted)] border-l-transparent hover:text-[var(--royal)] hover:bg-[var(--neutral-faint)]"
               }`}
             >
               <span
@@ -304,7 +315,7 @@ function SidebarNavContent({
       {/* Utility items */}
       {utilityItems.length > 0 && (
         <div>
-          <div className="text-[10px] font-bold text-slate-300 uppercase tracking-[0.2em] px-5 py-2">
+          <div className="text-[10px] font-bold text-ink-muted uppercase tracking-[0.2em] px-5 py-2">
             Manage
           </div>
           {utilityItems.map((item) => {
@@ -318,7 +329,7 @@ function SidebarNavContent({
                 className={`flex items-center gap-3 px-5 py-2.5 text-[0.8rem] cursor-pointer transition-all border-l-[3px] no-underline ${
                   isActive
                     ? "text-[var(--royal)] bg-[var(--royal)]/5 border-l-[var(--royal)] font-bold"
-                    : "text-slate-400 border-l-transparent hover:text-slate-900 hover:bg-slate-50"
+                    : "text-[var(--ink-muted)] border-l-transparent hover:text-[var(--royal)] hover:bg-[var(--neutral-faint)]"
                 }`}
               >
                 <span
@@ -338,6 +349,103 @@ function SidebarNavContent({
   );
 }
 
+/* ─── Estate Switcher ─────────────────────────────────────────────────────────
+ * The ONLY in-app affordance for moving between estates a user belongs to, and
+ * the entry point to the (previously orphaned) estate registry. Lists every
+ * estate from useUserEstates(); selecting one navigates to that estate's
+ * dashboard. "Manage estates" deep-links the full registry route.
+ * ──────────────────────────────────────────────────────────────────────────── */
+
+/** One row in the switcher — resolves the estate's real name from Firestore. */
+function EstateSwitcherItem({
+  estateUser,
+  currentEstateId,
+  onSelect,
+}: {
+  estateUser: EstateUser;
+  currentEstateId: string;
+  onSelect: (estateId: string) => void;
+}) {
+  const { data: estate } = useEstate(estateUser.estateId);
+  const isCurrent = estateUser.estateId === currentEstateId;
+  const displayName = estate?.name || 'Estate';
+
+  return (
+    <DropdownMenuItem
+      onClick={() => onSelect(estateUser.estateId)}
+      className={`flex items-center gap-3 cursor-pointer ${isCurrent ? 'bg-[var(--royal)]/5' : ''}`}
+    >
+      <span className={`w-7 h-7 rounded-lg flex items-center justify-center shrink-0 ${isCurrent ? 'bg-[var(--royal)] text-white' : 'bg-[var(--neutral-faint)] text-[var(--royal)]'}`}>
+        <Landmark className="w-3.5 h-3.5" />
+      </span>
+      <span className="min-w-0 flex-1">
+        <span className="block text-[0.8rem] font-bold text-ink truncate">{displayName}</span>
+        <span className="block text-[10px] font-medium text-ink-muted">{personaLabel(estateUser.role)}</span>
+      </span>
+      {isCurrent && <Check className="w-4 h-4 text-[var(--royal)] shrink-0" />}
+    </DropdownMenuItem>
+  );
+}
+
+function EstateSwitcher({
+  estateId,
+  estateName,
+  role,
+}: {
+  estateId: string;
+  estateName: string;
+  role: PersonaRole;
+}) {
+  const navigate = useNavigate();
+  const { profile } = useAuth();
+  const { data: estateUsers } = useUserEstates(profile?.uid || null);
+
+  return (
+    <div className="px-4 py-5 bg-[var(--royal)]/[0.01]">
+      <label className="text-[11px] font-bold text-ink-muted uppercase tracking-widest mb-2 block">Active Estate</label>
+      <DropdownMenu>
+        <DropdownMenuTrigger asChild>
+          <Button
+            variant="outline"
+            className="w-full flex items-center justify-between gap-2 px-3 py-2.5 h-auto bg-white border-[var(--neutral-border)] hover:border-[var(--royal)]/30 rounded-xl text-left overflow-hidden group/button"
+          >
+            <div className="flex-1 truncate text-left">
+              <div className="text-ink text-[0.8rem] font-bold truncate group-hover/button:text-[var(--royal)] transition-colors">{estateName}</div>
+              <div className="text-ink-muted text-[10px] font-medium mt-0.5">{personaLabel(role)}</div>
+            </div>
+            <svg viewBox="0 0 24 24" className="w-4 h-4 text-ink-muted group-hover/button:text-[var(--royal)] transition-all"><path d="M7 10l5 5 5-5" fill="none" stroke="currentColor" strokeWidth="2.5"/></svg>
+          </Button>
+        </DropdownMenuTrigger>
+        <DropdownMenuContent align="start" className="w-[15rem]">
+          <DropdownMenuLabel className="text-[10px] font-bold text-ink-muted uppercase tracking-[0.2em]">
+            Your Estates
+          </DropdownMenuLabel>
+          {(estateUsers || []).map((eu) => (
+            <EstateSwitcherItem
+              key={eu.estateId}
+              estateUser={eu}
+              currentEstateId={estateId}
+              onSelect={(nextId) => {
+                if (nextId !== estateId) navigate({ to: `/estates/${nextId}/dashboard` });
+              }}
+            />
+          ))}
+          <DropdownMenuSeparator />
+          <DropdownMenuItem
+            onClick={() => navigate({ to: `/estates/${estateId}/estates` })}
+            className="flex items-center gap-3 cursor-pointer text-[var(--royal)] font-bold"
+          >
+            <span className="w-7 h-7 rounded-lg flex items-center justify-center shrink-0 bg-[var(--royal)]/10">
+              <Settings className="w-3.5 h-3.5" />
+            </span>
+            <span className="text-[0.8rem]">Manage estates</span>
+          </DropdownMenuItem>
+        </DropdownMenuContent>
+      </DropdownMenu>
+    </div>
+  );
+}
+
 /** Shared hook to compute filtered nav groups and utility items */
 function useFilteredNav(userRole: PersonaRole) {
   return useMemo(() => {
@@ -417,12 +525,12 @@ export function MobileSidebar({
 
         <Separator className="bg-[var(--royal)]/10" />
 
-        {/* Estate Name */}
-        <div className="px-4 py-4">
-          <label className="text-[11px] font-bold text-slate-400 uppercase tracking-widest mb-1 block">Active Estate</label>
-          <div className="text-slate-900 text-[0.8rem] font-bold truncate">{user?.primaryEstateName || "My Estate"}</div>
-          <div className="text-slate-400 text-[10px] font-medium mt-0.5">{personaLabel(userRole)}</div>
-        </div>
+        {/* Estate Switcher */}
+        <EstateSwitcher
+          estateId={estateId}
+          estateName={user?.primaryEstateName || "My Estate"}
+          role={userRole}
+        />
 
         <Separator className="bg-[var(--royal)]/10" />
 
@@ -438,8 +546,8 @@ export function MobileSidebar({
         </ScrollArea>
 
         {/* User Footer */}
-        <Separator className="bg-slate-100" />
-        <div className="p-4 mt-auto bg-slate-50/50">
+        <Separator className="bg-[var(--neutral-faint)]" />
+        <div className="p-4 mt-auto bg-[color-mix(in_srgb,var(--neutral-faint)_50%,transparent)]">
           <div className="flex items-center gap-3 mb-3">
             <Avatar className="w-9 h-9 rounded-xl">
               <AvatarImage src={user?.profilePhotoUrl || undefined} alt="Profile" className="rounded-xl object-cover" />
@@ -448,14 +556,14 @@ export function MobileSidebar({
               </AvatarFallback>
             </Avatar>
             <div className="min-w-0">
-              <div className="text-slate-900 text-[0.8rem] font-bold truncate">{user?.name || "User"}</div>
-              <div className="text-slate-400 text-[10px] font-medium">{personaLabel(userRole)}</div>
+              <div className="text-ink text-[0.8rem] font-bold truncate">{user?.name || "User"}</div>
+              <div className="text-ink-muted text-[10px] font-medium">{personaLabel(userRole)}</div>
             </div>
           </div>
           <Button
             variant="ghost"
             onClick={handleLogout}
-            className="w-full flex items-center justify-center gap-2 px-3 py-2 h-auto bg-white border border-slate-200 rounded-xl text-slate-400 hover:text-red-500 hover:border-red-200 hover:bg-red-50 transition-all text-[11px] font-semibold"
+            className="w-full flex items-center justify-center gap-2 px-3 py-2 h-auto bg-white border border-[var(--neutral-border)] rounded-xl text-ink-muted hover:text-red-500 hover:border-red-200 hover:bg-red-50 transition-all text-[11px] font-semibold"
           >
             <svg viewBox="0 0 24 24" className="w-3.5 h-3.5" fill="none" stroke="currentColor" strokeWidth="2"><path d="M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4"/><polyline points="16 17 21 12 16 7"/><line x1="21" y1="12" x2="9" y2="12"/></svg>
             Sign Out
@@ -551,21 +659,11 @@ export function Sidebar({ effectiveRole }: { effectiveRole?: PersonaRole }) {
       <Separator className="bg-[var(--royal)]/10" />
 
       {/* Estate Switcher */}
-      <div className="px-4 py-5 bg-[var(--royal)]/[0.01]">
-        <label className="text-[11px] font-bold text-slate-400 uppercase tracking-widest mb-2 block">Active Estate</label>
-        <div className="relative">
-          <Button
-            variant="outline"
-            className="w-full flex items-center justify-between gap-2 px-3 py-2.5 h-auto bg-white border-slate-200 hover:border-[var(--royal)]/30 rounded-xl text-left overflow-hidden group"
-          >
-            <div className="flex-1 truncate text-left">
-              <div className="text-slate-900 text-[0.8rem] font-bold truncate group-hover/button:text-[var(--royal)] transition-colors">{user?.primaryEstateName || "My Estate"}</div>
-              <div className="text-slate-400 text-[10px] font-medium mt-0.5">{personaLabel(userRole)}</div>
-            </div>
-            <svg viewBox="0 0 24 24" className="w-4 h-4 text-slate-300 group-hover/button:text-[var(--royal)] transition-all"><path d="M7 10l5 5 5-5" fill="none" stroke="currentColor" strokeWidth="2.5"/></svg>
-          </Button>
-        </div>
-      </div>
+      <EstateSwitcher
+        estateId={estateId}
+        estateName={user?.primaryEstateName || "My Estate"}
+        role={userRole}
+      />
 
       <Separator className="bg-[var(--royal)]/10" />
 
@@ -580,31 +678,43 @@ export function Sidebar({ effectiveRole }: { effectiveRole?: PersonaRole }) {
       </ScrollArea>
 
       {/* User Footer */}
-      <Separator className="bg-slate-100" />
-      <div className="p-4 mt-auto bg-slate-50/50">
+      <Separator className="bg-[var(--neutral-faint)]" />
+      <div className="p-4 mt-auto bg-[color-mix(in_srgb,var(--neutral-faint)_50%,transparent)]">
         <div className="flex items-center gap-3 mb-3">
-          <Avatar
-            className="w-9 h-9 rounded-xl cursor-pointer hover:ring-2 hover:ring-[var(--royal)] transition-all"
-            onClick={() => user?.profilePhotoUrl && setShowPhotoModal(true)}
-          >
-            <AvatarImage
-              src={user?.profilePhotoUrl || undefined}
-              alt="Profile"
-              className="rounded-xl object-cover"
-            />
-            <AvatarFallback className="rounded-xl bg-[var(--royal)] text-white font-bold text-xs">
-              {getInitials(user?.name || 'User')}
-            </AvatarFallback>
-          </Avatar>
+          {user?.profilePhotoUrl ? (
+            <button
+              type="button"
+              aria-label="View profile photo"
+              onClick={() => setShowPhotoModal(true)}
+              className="rounded-xl focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--royal)]"
+            >
+              <Avatar className="w-9 h-9 rounded-xl cursor-pointer hover:ring-2 hover:ring-[var(--royal)] transition-all">
+                <AvatarImage
+                  src={user.profilePhotoUrl}
+                  alt="Profile"
+                  className="rounded-xl object-cover"
+                />
+                <AvatarFallback className="rounded-xl bg-[var(--royal)] text-white font-bold text-xs">
+                  {getInitials(user?.name || 'User')}
+                </AvatarFallback>
+              </Avatar>
+            </button>
+          ) : (
+            <Avatar className="w-9 h-9 rounded-xl">
+              <AvatarFallback className="rounded-xl bg-[var(--royal)] text-white font-bold text-xs">
+                {getInitials(user?.name || 'User')}
+              </AvatarFallback>
+            </Avatar>
+          )}
           <div className="min-w-0">
-            <div className="text-slate-900 text-[0.8rem] font-bold truncate">{user?.name || "User"}</div>
-            <div className="text-slate-400 text-[10px] font-medium">{personaLabel(userRole)}</div>
+            <div className="text-ink text-[0.8rem] font-bold truncate">{user?.name || "User"}</div>
+            <div className="text-ink-muted text-[10px] font-medium">{personaLabel(userRole)}</div>
           </div>
         </div>
         <Button
           variant="ghost"
           onClick={handleLogout}
-          className="w-full flex items-center justify-center gap-2 px-3 py-2 h-auto bg-white border border-slate-200 rounded-xl text-slate-400 hover:text-red-500 hover:border-red-200 hover:bg-red-50 transition-all text-[11px] font-semibold"
+          className="w-full flex items-center justify-center gap-2 px-3 py-2 h-auto bg-white border border-[var(--neutral-border)] rounded-xl text-ink-muted hover:text-red-500 hover:border-red-200 hover:bg-red-50 transition-all text-[11px] font-semibold"
         >
           <svg viewBox="0 0 24 24" className="w-3.5 h-3.5" fill="none" stroke="currentColor" strokeWidth="2"><path d="M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4"/><polyline points="16 17 21 12 16 7"/><line x1="21" y1="12" x2="9" y2="12"/></svg>
           Sign Out
diff --git a/web/src/components/search/SearchResults.tsx b/web/src/components/search/SearchResults.tsx
index 87d2859..0d98f84 100644
--- a/web/src/components/search/SearchResults.tsx
+++ b/web/src/components/search/SearchResults.tsx
@@ -68,6 +68,16 @@ const ICONS: Record<string, React.ReactNode> = {
   ),
 };
 
+// ─── Combobox/listbox identity (shared with AdminHeader) ──────────────────────
+// Stable ids let the search input expose `aria-controls` (the listbox) and
+// `aria-activedescendant` (the highlighted option) so screen readers announce
+// the active result during keyboard navigation.
+
+export const SEARCH_LISTBOX_ID = 'estate-search-listbox';
+
+/** Deterministic option id for a given result index. */
+export const searchOptionId = (index: number) => `estate-search-option-${index}`;
+
 // ─── Props ────────────────────────────────────────────────────────────────────
 
 interface SearchResultsProps {
@@ -129,7 +139,7 @@ export function SearchResults({
   // No results
   if (query.trim().length >= 2 && results.length === 0) {
     return (
-      <DropdownShell>
+      <DropdownShell liveMessage="No results found">
         <div className="px-4 py-8 text-center">
           <p className="text-[11px] font-bold text-royal/30 uppercase tracking-[0.15em]">
             No results found
@@ -156,12 +166,13 @@ export function SearchResults({
   }
 
   return (
-    <DropdownShell>
+    <DropdownShell liveMessage={`${results.length} result${results.length !== 1 ? 's' : ''}`}>
       <ScrollArea className="max-h-[360px]">
         <div ref={listRef} className="py-1">
           {results.map((result, index) => (
             <button
               key={`${result.type}-${result.id}`}
+              id={searchOptionId(index)}
               role="option"
               aria-selected={index === activeIndex}
               data-search-item
@@ -222,10 +233,23 @@ export function SearchResults({
 
 // ─── Shell wrapper ────────────────────────────────────────────────────────────
 
-function DropdownShell({ children }: { children: React.ReactNode }) {
+function DropdownShell({
+  children,
+  liveMessage = '',
+}: {
+  children: React.ReactNode;
+  liveMessage?: string;
+}) {
   return (
-    <div role="listbox" aria-label="Search results" className="absolute top-full left-0 right-0 mt-1 z-[100] bg-white border border-royal/10 shadow-[0_20px_60px_rgba(19,51,120,0.12)] overflow-hidden">
-      <div aria-live="polite" className="sr-only" />
+    <div
+      id={SEARCH_LISTBOX_ID}
+      role="listbox"
+      aria-label="Search results"
+      className="absolute top-full left-0 right-0 mt-1 z-[100] bg-white border border-royal/10 shadow-[0_20px_60px_rgba(19,51,120,0.12)] overflow-hidden"
+    >
+      <div aria-live="polite" role="status" className="sr-only">
+        {liveMessage}
+      </div>
       {children}
     </div>
   );
diff --git a/web/src/components/skeletons/CardGridSkeleton.tsx b/web/src/components/skeletons/CardGridSkeleton.tsx
index f1d953e..668dcf3 100644
--- a/web/src/components/skeletons/CardGridSkeleton.tsx
+++ b/web/src/components/skeletons/CardGridSkeleton.tsx
@@ -15,7 +15,7 @@ export function CardGridSkeleton({ columns = 2, cards = 4, timeline = false }: C
   return (
     <div role="status" aria-label="Loading content" className="max-w-[1240px] mx-auto space-y-10 pb-24 px-6">
       {/* Header */}
-      <div className="flex justify-between items-end border-b border-slate-100 pb-10">
+      <div className="flex justify-between items-end border-b border-[var(--neutral-border)] pb-10">
         <div className="space-y-2">
           <Skeleton className="h-12 w-72 rounded-2xl" />
           <Skeleton className="h-5 w-[420px]" />
@@ -27,7 +27,7 @@ export function CardGridSkeleton({ columns = 2, cards = 4, timeline = false }: C
         /* Timeline variant */
         <div className="space-y-4">
           {Array.from({ length: cards }).map((_, i) => (
-            <div key={i} className="flex items-start gap-5 p-5 bg-white rounded-2xl border border-slate-100">
+            <div key={i} className="flex items-start gap-5 p-5 bg-white rounded-2xl border border-[var(--neutral-border)]">
               <Skeleton className="h-10 w-10 rounded-xl flex-shrink-0" />
               <div className="flex-1 space-y-2">
                 <Skeleton className="h-4 w-3/4" />
@@ -41,7 +41,7 @@ export function CardGridSkeleton({ columns = 2, cards = 4, timeline = false }: C
         /* Card grid variant */
         <div className={`grid grid-cols-1 ${gridCols} gap-6`}>
           {Array.from({ length: cards }).map((_, i) => (
-            <div key={i} className="bg-white p-8 rounded-[2.5rem] border border-slate-100 flex items-center gap-8">
+            <div key={i} className="bg-white p-8 rounded-[2.5rem] border border-[var(--neutral-border)] flex items-center gap-8">
               <Skeleton className="h-16 w-16 rounded-2xl flex-shrink-0" />
               <div className="flex-1 space-y-3">
                 <Skeleton className="h-5 w-3/4" />
@@ -49,7 +49,7 @@ export function CardGridSkeleton({ columns = 2, cards = 4, timeline = false }: C
                   <Skeleton className="h-4 w-16 rounded-lg" />
                   <Skeleton className="h-3 w-32" />
                 </div>
-                <div className="flex items-center justify-between border-t border-slate-50 pt-4">
+                <div className="flex items-center justify-between border-t border-[var(--neutral-faint)] pt-4">
                   <div className="space-y-1">
                     <Skeleton className="h-3 w-20" />
                     <Skeleton className="h-4 w-16" />
diff --git a/web/src/components/skeletons/DashboardSkeleton.tsx b/web/src/components/skeletons/DashboardSkeleton.tsx
index 221504d..23c1515 100644
--- a/web/src/components/skeletons/DashboardSkeleton.tsx
+++ b/web/src/components/skeletons/DashboardSkeleton.tsx
@@ -11,7 +11,7 @@ export function DashboardSkeleton() {
       </div>
 
       {/* Primary Action Card (hero progress area) */}
-      <div className="bg-slate-50 rounded-[3rem] p-16 flex items-center justify-between border border-slate-100">
+      <div className="bg-[var(--neutral-faint)] rounded-[3rem] p-16 flex items-center justify-between border border-[var(--neutral-border)]">
         <div className="flex-1 space-y-10">
           <div className="space-y-3">
             <Skeleton className="h-3 w-32" />
@@ -26,7 +26,7 @@ export function DashboardSkeleton() {
       {/* Stat Grid — 4 cards */}
       <div className="grid grid-cols-1 md:grid-cols-4 gap-12">
         {Array.from({ length: 4 }).map((_, i) => (
-          <div key={i} className="bg-white p-10 rounded-[2.5rem] border border-slate-100 space-y-8">
+          <div key={i} className="bg-white p-10 rounded-[2.5rem] border border-[var(--neutral-border)] space-y-8">
             <Skeleton className="h-16 w-16 rounded-2xl" />
             <div className="space-y-2">
               <Skeleton className="h-3 w-24" />
@@ -39,13 +39,13 @@ export function DashboardSkeleton() {
       {/* Checklist + Quick Actions */}
       <div className="grid grid-cols-1 lg:grid-cols-[1.8fr_1.2fr] gap-16 py-12">
         {/* Checklist */}
-        <div className="bg-white rounded-[3rem] p-16 border border-slate-100 space-y-6">
+        <div className="bg-white rounded-[3rem] p-16 border border-[var(--neutral-border)] space-y-6">
           <div className="flex justify-between items-center mb-4">
             <Skeleton className="h-7 w-40" />
             <Skeleton className="h-6 w-28 rounded-full" />
           </div>
           {Array.from({ length: 6 }).map((_, i) => (
-            <div key={i} className="flex items-center gap-4 px-5 py-4 rounded-2xl bg-slate-50">
+            <div key={i} className="flex items-center gap-4 px-5 py-4 rounded-2xl bg-[var(--neutral-faint)]">
               <Skeleton className="h-6 w-6 rounded-full" />
               <div className="flex-1 space-y-2">
                 <Skeleton className="h-4 w-3/4" />
@@ -57,11 +57,11 @@ export function DashboardSkeleton() {
 
         {/* Quick Actions */}
         <div className="space-y-12">
-          <div className="bg-white rounded-[3rem] p-12 border border-slate-100">
+          <div className="bg-white rounded-[3rem] p-12 border border-[var(--neutral-border)]">
             <Skeleton className="h-6 w-32 mb-10" />
             <div className="grid grid-cols-2 gap-8">
               {Array.from({ length: 4 }).map((_, i) => (
-                <div key={i} className="flex flex-col items-center justify-center gap-6 p-10 bg-slate-50 rounded-3xl border border-slate-100">
+                <div key={i} className="flex flex-col items-center justify-center gap-6 p-10 bg-[var(--neutral-faint)] rounded-3xl border border-[var(--neutral-border)]">
                   <Skeleton className="h-7 w-7 rounded-lg" />
                   <Skeleton className="h-3 w-16" />
                 </div>
diff --git a/web/src/components/skeletons/EditorSkeleton.tsx b/web/src/components/skeletons/EditorSkeleton.tsx
index 7e04573..aa944d4 100644
--- a/web/src/components/skeletons/EditorSkeleton.tsx
+++ b/web/src/components/skeletons/EditorSkeleton.tsx
@@ -26,7 +26,7 @@ export function EditorSkeleton() {
           </div>
 
           {/* Editor body */}
-          <div className="border border-slate-100 rounded-2xl p-6 space-y-4">
+          <div className="border border-[var(--neutral-border)] rounded-2xl p-6 space-y-4">
             <Skeleton className="h-4 w-full" />
             <Skeleton className="h-4 w-5/6" />
             <Skeleton className="h-4 w-full" />
diff --git a/web/src/components/skeletons/README.md b/web/src/components/skeletons/README.md
index 514288c..069da25 100644
--- a/web/src/components/skeletons/README.md
+++ b/web/src/components/skeletons/README.md
@@ -31,7 +31,7 @@ export const pendingComponent = () => <VaultSkeleton />
 - Match the final layout's spacing and proportions (3rem rounded corners, 12px gaps)
 - Use `role="status"` and `aria-label="Loading..."` for accessibility
 - Follow Royal Neo-Deco dimensions (24px/32px cards, wide padding)
-- No color — neutral grays only (`slate-100`, `slate-200`)
+- No color — royal-tinted neutrals only (`neutral-faint`, `neutral-border`)
 
 ## Route ↔ Skeleton Map
 
diff --git a/web/src/components/skeletons/TableSkeleton.tsx b/web/src/components/skeletons/TableSkeleton.tsx
index be4853a..08bc412 100644
--- a/web/src/components/skeletons/TableSkeleton.tsx
+++ b/web/src/components/skeletons/TableSkeleton.tsx
@@ -4,7 +4,7 @@ export function TableSkeleton() {
   return (
     <div role="status" aria-label="Loading content" className="max-w-[1440px] mx-auto p-12 space-y-16 bg-white min-h-screen font-[family-name:var(--font-inter)]">
       {/* Header */}
-      <div className="flex justify-between items-end border-b border-slate-50 pb-16">
+      <div className="flex justify-between items-end border-b border-[var(--neutral-faint)] pb-16">
         <div className="space-y-4">
           <Skeleton className="h-3 w-40" />
           <Skeleton className="h-12 w-64 rounded-2xl" />
@@ -14,9 +14,9 @@ export function TableSkeleton() {
       </div>
 
       {/* Table */}
-      <div className="bg-white rounded-[2.5rem] border border-slate-100 overflow-hidden">
+      <div className="bg-white rounded-[2.5rem] border border-[var(--neutral-border)] overflow-hidden">
         {/* Table header */}
-        <div className="bg-slate-50 px-10 py-6 flex gap-10 border-b border-slate-100">
+        <div className="bg-[var(--neutral-faint)] px-10 py-6 flex gap-10 border-b border-[var(--neutral-border)]">
           <Skeleton className="h-3 w-28" />
           <Skeleton className="h-3 w-24" />
           <Skeleton className="h-3 w-32" />
@@ -25,7 +25,7 @@ export function TableSkeleton() {
         </div>
         {/* Table rows */}
         {Array.from({ length: 5 }).map((_, i) => (
-          <div key={i} className="px-10 py-7 flex items-center gap-10 border-b border-slate-50">
+          <div key={i} className="px-10 py-7 flex items-center gap-10 border-b border-[var(--neutral-faint)]">
             <Skeleton className="h-5 w-40" />
             <Skeleton className="h-6 w-24 rounded-lg" />
             <Skeleton className="h-5 w-28" />
diff --git a/web/src/components/skeletons/VaultSkeleton.tsx b/web/src/components/skeletons/VaultSkeleton.tsx
index 65c3641..11f0f9e 100644
--- a/web/src/components/skeletons/VaultSkeleton.tsx
+++ b/web/src/components/skeletons/VaultSkeleton.tsx
@@ -13,7 +13,7 @@ export function VaultSkeleton() {
       </div>
 
       {/* Dropzone */}
-      <div className="border-2 border-dashed border-slate-200 rounded-[2rem] p-12">
+      <div className="border-2 border-dashed border-[var(--neutral-border)] rounded-[2rem] p-12">
         <div className="flex flex-col items-center gap-4">
           <Skeleton className="h-16 w-16 rounded-2xl" />
           <Skeleton className="h-5 w-64" />
@@ -24,7 +24,7 @@ export function VaultSkeleton() {
       {/* Category Folders — 3 columns */}
       <div className="grid grid-cols-1 md:grid-cols-3 gap-6">
         {Array.from({ length: 3 }).map((_, i) => (
-          <div key={i} className="bg-white p-8 rounded-[2.5rem] border border-slate-100">
+          <div key={i} className="bg-white p-8 rounded-[2.5rem] border border-[var(--neutral-border)]">
             <Skeleton className="h-14 w-14 rounded-2xl mb-6" />
             <Skeleton className="h-5 w-36 mb-2" />
             <div className="flex items-center gap-3">
@@ -36,14 +36,14 @@ export function VaultSkeleton() {
       </div>
 
       {/* File List */}
-      <div className="bg-white rounded-[2.5rem] border border-slate-100 p-10">
+      <div className="bg-white rounded-[2.5rem] border border-[var(--neutral-border)] p-10">
         <div className="flex items-center gap-3 mb-8 px-2">
           <Skeleton className="h-2 w-2 rounded-full" />
           <Skeleton className="h-3 w-48" />
         </div>
         <div className="space-y-3">
           {Array.from({ length: 4 }).map((_, i) => (
-            <div key={i} className="flex items-center justify-between p-5 bg-white border border-slate-100 rounded-2xl">
+            <div key={i} className="flex items-center justify-between p-5 bg-white border border-[var(--neutral-border)] rounded-2xl">
               <div className="flex items-center gap-4 flex-1">
                 <Skeleton className="h-11 w-11 rounded-xl" />
                 <div className="space-y-1.5">
diff --git a/web/src/components/ui/button.tsx b/web/src/components/ui/button.tsx
index 91e32da..9976691 100644
--- a/web/src/components/ui/button.tsx
+++ b/web/src/components/ui/button.tsx
@@ -10,7 +10,8 @@ const buttonVariants = cva(
   {
     variants: {
       variant: {
-        default: "bg-primary text-primary-foreground [a]:hover:bg-primary/80",
+        default:
+          "bg-primary text-primary-foreground shadow-sm hover:bg-primary/90 aria-expanded:bg-primary/90",
         outline:
           "border-border bg-background hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:border-input dark:bg-input/30 dark:hover:bg-input/50",
         secondary:
diff --git a/web/src/components/ui/card.tsx b/web/src/components/ui/card.tsx
index 40cac5f..2fde6eb 100644
--- a/web/src/components/ui/card.tsx
+++ b/web/src/components/ui/card.tsx
@@ -2,17 +2,51 @@ import * as React from "react"
 
 import { cn } from "@/lib/utils"
 
+type CardVariant = "default" | "glass"
+
+/**
+ * Card — Royal Neo-Deco surface primitive.
+ *
+ * The radius scale is owned here (no per-route overrides): cards are
+ * `rounded-3xl` (32px) by default, `rounded-2xl` (24px) at `size="sm"`.
+ * Inner chips should use `rounded-xl` and pills `rounded-full` at the call site.
+ *
+ * Both variants bake in the brand hover/transition (lift + gold border +
+ * gold-tinted shadow) and a gold focus-visible ring, so most cards feel alive
+ * without bespoke per-screen classes.
+ *
+ * - `default` — opaque white surface with a faint royal ring.
+ * - `glass`   — translucent glass panel (backdrop-blur + gold hairline border)
+ *   referencing the `--card-bg` / `--card-shadow-hover` tokens from globals.css.
+ *   Fallbacks are supplied inline so the variant renders correctly on the
+ *   white flagship screens that sit outside the `.glass-theme` scope.
+ */
 function Card({
   className,
   size = "default",
+  variant = "default",
   ...props
-}: React.ComponentProps<"div"> & { size?: "default" | "sm" }) {
+}: React.ComponentProps<"div"> & {
+  size?: "default" | "sm"
+  variant?: CardVariant
+}) {
   return (
     <div
       data-slot="card"
       data-size={size}
+      data-variant={variant}
       className={cn(
-        "group/card flex flex-col gap-4 overflow-hidden rounded-xl bg-card py-4 text-sm text-card-foreground ring-1 ring-foreground/10 has-data-[slot=card-footer]:pb-0 has-[>img:first-child]:pt-0 data-[size=sm]:gap-3 data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl",
+        // Structure + unified radius scale (32px cards / 24px when sm).
+        "group/card flex flex-col gap-4 overflow-hidden rounded-3xl py-4 text-sm",
+        "data-[size=sm]:gap-3 data-[size=sm]:rounded-2xl data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0",
+        "has-data-[slot=card-footer]:pb-0 has-[>img:first-child]:pt-0",
+        "*:[img:first-child]:rounded-t-3xl *:[img:last-child]:rounded-b-3xl",
+        // Brand hover/transition + gold focus ring (both variants).
+        "transition-all duration-300 hover:-translate-y-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--gold)]",
+        // Default: opaque white surface, royal hairline ring → gold on hover.
+        "data-[variant=default]:bg-card data-[variant=default]:text-card-foreground data-[variant=default]:ring-1 data-[variant=default]:ring-foreground/10 data-[variant=default]:hover:ring-[var(--gold)]/40 data-[variant=default]:hover:shadow-[var(--card-shadow-hover,0_4px_12px_rgba(0,0,0,0.08))]",
+        // Glass: translucent panel, gold hairline border + gold-glow on hover.
+        "data-[variant=glass]:bg-[var(--card-bg,#FFFFFF)] data-[variant=glass]:backdrop-blur-md data-[variant=glass]:border data-[variant=glass]:border-[var(--gold)]/15 data-[variant=glass]:text-card-foreground data-[variant=glass]:hover:border-[var(--gold)]/40 data-[variant=glass]:hover:shadow-[var(--card-shadow-hover,0_12px_48px_rgba(0,0,0,0.12),0_0_30px_rgba(200,169,81,0.18))]",
         className
       )}
       {...props}
@@ -25,7 +59,7 @@ function CardHeader({ className, ...props }: React.ComponentProps<"div">) {
     <div
       data-slot="card-header"
       className={cn(
-        "group/card-header @container/card-header grid auto-rows-min items-start gap-1 rounded-t-xl px-4 group-data-[size=sm]/card:px-3 has-data-[slot=card-action]:grid-cols-[1fr_auto] has-data-[slot=card-description]:grid-rows-[auto_auto] [.border-b]:pb-4 group-data-[size=sm]/card:[.border-b]:pb-3",
+        "group/card-header @container/card-header grid auto-rows-min items-start gap-1 rounded-t-3xl px-4 group-data-[size=sm]/card:rounded-t-2xl group-data-[size=sm]/card:px-3 has-data-[slot=card-action]:grid-cols-[1fr_auto] has-data-[slot=card-description]:grid-rows-[auto_auto] [.border-b]:pb-4 group-data-[size=sm]/card:[.border-b]:pb-3",
         className
       )}
       {...props}
@@ -50,7 +84,7 @@ function CardDescription({ className, ...props }: React.ComponentProps<"div">) {
   return (
     <div
       data-slot="card-description"
-      className={cn("text-sm text-muted-foreground", className)}
+      className={cn("text-sm text-[var(--ink-muted)]", className)}
       {...props}
     />
   )
@@ -84,7 +118,7 @@ function CardFooter({ className, ...props }: React.ComponentProps<"div">) {
     <div
       data-slot="card-footer"
       className={cn(
-        "flex items-center rounded-b-xl border-t bg-muted/50 p-4 group-data-[size=sm]/card:p-3",
+        "flex items-center rounded-b-3xl p-4 group-data-[size=sm]/card:rounded-b-2xl group-data-[size=sm]/card:p-3",
         className
       )}
       {...props}
diff --git a/web/src/components/ui/input.tsx b/web/src/components/ui/input.tsx
index d763cd9..9ed815f 100644
--- a/web/src/components/ui/input.tsx
+++ b/web/src/components/ui/input.tsx
@@ -8,7 +8,7 @@ function Input({ className, type, ...props }: React.ComponentProps<"input">) {
       type={type}
       data-slot="input"
       className={cn(
-        "h-8 w-full min-w-0 rounded-lg border border-input bg-transparent px-2.5 py-1 text-base transition-colors outline-none file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:pointer-events-none disabled:cursor-not-allowed disabled:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 md:text-sm dark:bg-input/30 dark:disabled:bg-input/80 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40",
+        "h-8 w-full min-w-0 rounded-lg border border-input bg-transparent px-2.5 py-1 text-base transition-colors outline-none file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:border-[var(--royal-bright)] focus-visible:ring-3 focus-visible:ring-ring/40 disabled:pointer-events-none disabled:cursor-not-allowed disabled:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 md:text-sm dark:bg-input/30 dark:disabled:bg-input/80 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40",
         className
       )}
       {...props}
diff --git a/web/src/components/ui/select-with-other.tsx b/web/src/components/ui/select-with-other.tsx
index 67162c0..d496aea 100644
--- a/web/src/components/ui/select-with-other.tsx
+++ b/web/src/components/ui/select-with-other.tsx
@@ -55,7 +55,7 @@ export function SelectWithOther({
         <SelectTrigger
           className={
             triggerClassName ??
-            'w-full px-6 py-4 h-auto rounded-2xl border-slate-200 bg-slate-50 focus-visible:bg-white focus-visible:border-[var(--royal)] font-semibold text-slate-900 text-base'
+            'w-full px-6 py-4 h-auto rounded-2xl border-[var(--neutral-border)] bg-[var(--neutral-faint)] focus-visible:bg-white focus-visible:border-[var(--royal)] font-semibold text-ink text-base'
           }
         >
           <SelectValue placeholder={placeholder} />
@@ -76,7 +76,7 @@ export function SelectWithOther({
           onChange={(e) => handleOther(e.target.value)}
           placeholder="Please specify…"
           autoFocus
-          className="px-6 py-4 h-auto rounded-2xl border-slate-200 bg-slate-50 focus-visible:bg-white focus-visible:border-[var(--royal)] font-semibold text-slate-900 text-base"
+          className="px-6 py-4 h-auto rounded-2xl border-[var(--neutral-border)] bg-[var(--neutral-faint)] focus-visible:bg-white focus-visible:border-[var(--royal)] font-semibold text-ink text-base"
         />
       )}
 
diff --git a/web/src/components/ui/select.tsx b/web/src/components/ui/select.tsx
index f09dfb4..4d87eed 100644
--- a/web/src/components/ui/select.tsx
+++ b/web/src/components/ui/select.tsx
@@ -44,7 +44,7 @@ function SelectTrigger({
       data-slot="select-trigger"
       data-size={size}
       className={cn(
-        "flex w-fit items-center justify-between gap-1.5 rounded-lg border border-input bg-transparent py-2 pr-2 pl-2.5 text-sm whitespace-nowrap transition-colors outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 data-placeholder:text-muted-foreground data-[size=default]:h-8 data-[size=sm]:h-7 data-[size=sm]:rounded-[min(var(--radius-md),10px)] *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-1.5 dark:bg-input/30 dark:hover:bg-input/50 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        "flex w-fit items-center justify-between gap-1.5 rounded-lg border border-input bg-transparent py-2 pr-2 pl-2.5 text-sm whitespace-nowrap transition-colors outline-none select-none focus-visible:border-[var(--royal-bright)] focus-visible:ring-3 focus-visible:ring-ring/40 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 data-placeholder:text-muted-foreground data-[size=default]:h-8 data-[size=sm]:h-7 data-[size=sm]:rounded-[min(var(--radius-md),10px)] *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-1.5 dark:bg-input/30 dark:hover:bg-input/50 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
         className
       )}
       {...props}
diff --git a/web/src/components/ui/skeleton.tsx b/web/src/components/ui/skeleton.tsx
index fe792fc..72f287f 100644
--- a/web/src/components/ui/skeleton.tsx
+++ b/web/src/components/ui/skeleton.tsx
@@ -1,7 +1,7 @@
 import { cn } from "@/lib/utils"
 
 function Skeleton({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) {
-  return <div className={cn("animate-pulse rounded-xl bg-slate-200/60", className)} {...props} />
+  return <div className={cn("animate-pulse rounded-xl bg-[color-mix(in_srgb,var(--neutral-border)_60%,transparent)]", className)} {...props} />
 }
 
 export { Skeleton }
diff --git a/web/src/components/ui/textarea.tsx b/web/src/components/ui/textarea.tsx
index 04d27f7..ec864b1 100644
--- a/web/src/components/ui/textarea.tsx
+++ b/web/src/components/ui/textarea.tsx
@@ -7,7 +7,7 @@ function Textarea({ className, ...props }: React.ComponentProps<"textarea">) {
     <textarea
       data-slot="textarea"
       className={cn(
-        "flex field-sizing-content min-h-16 w-full rounded-lg border border-input bg-transparent px-2.5 py-2 text-base transition-colors outline-none placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 md:text-sm dark:bg-input/30 dark:disabled:bg-input/80 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40",
+        "flex field-sizing-content min-h-16 w-full rounded-lg border border-input bg-transparent px-2.5 py-2 text-base transition-colors outline-none placeholder:text-muted-foreground focus-visible:border-[var(--royal-bright)] focus-visible:ring-3 focus-visible:ring-ring/40 disabled:cursor-not-allowed disabled:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 md:text-sm dark:bg-input/30 dark:disabled:bg-input/80 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40",
         className
       )}
       {...props}
diff --git a/web/src/lib/README.md b/web/src/lib/README.md
index 1c64401..09085c9 100644
--- a/web/src/lib/README.md
+++ b/web/src/lib/README.md
@@ -4,22 +4,90 @@
 
 ## Files
 
-| File | Purpose |
-|------|---------|
-| `firebase.ts` | Firebase app initialization (Auth, Firestore, Analytics, Performance) |
-| `auth.tsx` | React Auth context/provider — email + username login, MFA support, demo mode |
-| `mfa.ts` | TOTP enrollment and verification (Google Authenticator, 1Password, Authy) |
-| `firestore.ts` | Real-time Firestore hooks via `onSnapshot` (ADR-036) |
-| `estate-actions.ts` | Firestore write operations (createEstate, addAsset, etc.) |
-| `invitations.ts` | Estate invitation system — create, send, auto-match on registration |
-| `analytics.ts` | Firebase Performance + GA4 wrappers for business-critical events |
-| `client.ts` | ConnectRPC transport for Go API (signed URLs, PII operations) |
-| `email.ts` | Email utility functions |
-| `utils.ts` | Shared utility helpers |
+Every non-test module under `web/src/lib` is listed below with its one-line purpose and
+governing ADR (per Rule 30 — shipped modules carry a developer-facing README). The
+`forms.ts` and `email.ts` modules also have dedicated deep-dives in
+[`README-forms.md`](./README-forms.md) and [`README-email.md`](./README-email.md).
+
+### Platform & data transport
+
+| File | Purpose | ADR |
+|------|---------|-----|
+| `firebase.ts` | Firebase app initialization (Auth, Firestore, Analytics, Performance) | ADR-034 |
+| `auth.tsx` | React Auth context/provider — email + username login, MFA support, demo mode | ADR-034 |
+| `mfa.ts` | TOTP enrollment and verification (Google Authenticator, 1Password, Authy) | ADR-034 |
+| `firestore.ts` | Real-time Firestore hooks via `onSnapshot` (client-side direct reads) | ADR-036 |
+| `estate-actions.ts` | Firestore write operations (createEstate, addAsset, etc.) | ADR-036 |
+| `client.ts` | ConnectRPC transport for Go API (signed URLs, PII operations) | ADR-037 |
+
+### Access control & gating
+
+| File | Purpose | ADR |
+|------|---------|-----|
+| `persona.ts` | **Single source of truth for estate-scoped access** — sidebar nav, route guards, the Shepherd companion, and tests all import the persona/role boundary | ADR-046 |
+| `tier-gating.ts` | Client-side tier definitions + React hook that fetches the estate's entitlement tier (Stripe) | ADR-035 |
+| `invitations.ts` | Estate invitation system — create, send, auto-match on registration (email-verified seizure-safe) | ADR-046 |
+
+### Flagship features (full subsystems — see Architecture below)
+
+| File | Purpose | ADR |
+|------|---------|-----|
+| `probate.ts` | Probate API client — drives the pluggable state-machine settlement engine (`/api/v1/probate/*`) | ADR-043 |
+| `shepherd.ts` | **The Shepherd** — client for the live AI guidance engine (`/api/v1/guidance/*`), the voice and heart of FinalWishes | ADR-040 |
+| `shepherd-prompts.ts` | Pure functions that transform estate context into contextual Shepherd prompts | ADR-040 |
+| `useGuidanceScore.ts` | Fetches the Shepherd guidance Score — backend computes a deterministic plan (`api/internal/guidance`) | ADR-040 |
+| `google-photos-import.ts` | Google Photos import via the Picker API — minimal scope, PII-clean, server-mediated media download (CR-12) | ADR-045 |
+| `doc-intelligence.ts` | Document Intelligence — sends uploaded vault documents to the Go API for AI structured analysis | ADR-043 |
+
+### Estate utilities & UX
+
+| File | Purpose | ADR |
+|------|---------|-----|
+| `forms.ts` | Statutory Forms API client — coordinate-overlay fill engine (see `README-forms.md`) | ADR-002 §4 |
+| `search.ts` | Client-side search hook across all estate Firestore subcollections | ADR-036 |
+| `export.ts` | Estate Data Export — generates a ZIP archive of all estate data for compliance/portability | ADR-002 §6 |
+| `wizardDraft.ts` | Estate-creation wizard draft persistence (device-local `localStorage`) | ADR-006 |
+| `useResumables.ts` | Surfaces in-progress work so a returning user can resume exactly where they left off | ADR-038 |
+| `analytics.ts` | Firebase Performance + GA4 wrappers for business-critical events | — |
+| `email-templates.ts` | Royal Neo-Deco HTML email templates with inline CSS | ADR-039 |
+| `email.ts` | Email utility helpers (see `README-email.md`) | ADR-039 |
+| `us-states.ts` | The 50 US states + DC — shared so every "state" field is a complete dropdown | — |
+| `animations.tsx` | Shared motion primitives for the Royal Neo-Deco design system | ADR-033 |
+| `utils.ts` | Shared utility helpers | — |
+
+## Flagship Subsystem Architecture
+
+Three of these modules are not utility helpers — they are the client surfaces of full,
+ADR-backed features. A short orientation for each:
+
+### Persona-Based Access Control (`persona.ts`, ADR-046)
+
+`persona.ts` is the **single source of truth** for who can see and do what in an estate.
+Sidebar navigation, route guards, the Shepherd companion, and the test suite all import
+the persona/role resolver rather than re-deriving access. Estate-scoped roles map to a
+3-layer boundary (UI gate → route guard → Firestore Rules) so that a UI-layer mistake
+cannot leak data — the Firestore boundary is authoritative. Soul Log read-privacy
+(per-recipient `sharedWith` UIDs) is enforced here and in the rules together.
+
+### The Shepherd (`shepherd.ts`, `shepherd-prompts.ts`, `useGuidanceScore.ts`, ADR-040)
+
+The Shepherd is the live AI guidance engine. `shepherd-prompts.ts` builds contextual
+prompts from estate state (pure functions, fully testable), `shepherd.ts` is the transport
+to `/api/v1/guidance/*` (Claude Opus via the `sirsi-ai` shared service per ADR-040), and
+`useGuidanceScore.ts` surfaces the deterministic guidance Score the backend computes
+(`api/internal/guidance/handler.go`). Legal answers are grounded in the RAG corpus
+(ADR-044) with citation abstention — never fabricated (Rule 9).
+
+### Illinois Probate Engine (`probate.ts`, ADR-043)
+
+`probate.ts` is the thin client for the pluggable state-machine probate engine
+(`/api/v1/probate/*`). The state machine itself lives in the Go API; the client drives
+step transitions and renders the settlement workflow. Illinois is the first pluggable
+jurisdiction; the engine is state-agnostic by design.
 
 ## Architecture
 
-Firestore reads happen **client-side** (ADR-036) — no Go API round-trip for dashboard data. Security is enforced by Firestore Rules v3.0.0. The Go API handles Cloud SQL PII, Cloud Storage, and KMS operations only.
+Firestore reads happen **client-side** (ADR-036) — no Go API round-trip for dashboard data. Security is enforced by Firestore Rules v5.0.0 (`firestore.rules`). The Go API handles Cloud SQL PII (ADR-037), Cloud Storage, and KMS operations only.
 
 ## Hooks Reference
 
@@ -74,7 +142,7 @@ All writes go through `estate-actions.ts`. Functions return `{ success, id?, err
 
 ## Security
 
-All reads/writes are protected by Firestore Security Rules v3.0.0 (`firestore.rules`).
+All reads/writes are protected by Firestore Security Rules v5.0.0 (`firestore.rules`).
 Key rules:
 - Only estate principals can write to their estates
 - Estate users can read estates they have access to
diff --git a/web/src/lib/auth.tsx b/web/src/lib/auth.tsx
index 74e4e8b..dd7f3c3 100644
--- a/web/src/lib/auth.tsx
+++ b/web/src/lib/auth.tsx
@@ -33,7 +33,9 @@ import {
   doc,
   getDoc,
   setDoc,
+  updateDoc,
   serverTimestamp,
+  increment,
 } from 'firebase/firestore';
 import { type MultiFactorResolver } from 'firebase/auth';
 import { auth, db } from './firebase';
@@ -309,6 +311,21 @@ export function AuthProvider({ children }: { children: ReactNode }) {
       setUser(credential.user);
       setProfileResolved(true);
 
+      // Record the successful sign-in. IdentityGate expires the principal MFA
+      // grace period only after 24h AND loginCount >= 3 (ADR-035). Counting here
+      // — on an explicit credential sign-in, NOT on every onAuthStateChanged
+      // token refresh — is what makes that enforcement reachable instead of dead
+      // code. Best-effort: a failed write must never block the user from logging
+      // in, so we swallow and log rather than reject the sign-in.
+      try {
+        await updateDoc(doc(db, 'users', credential.user.uid), {
+          loginCount: increment(1),
+          lastLoginAt: serverTimestamp(),
+        });
+      } catch (err) {
+        console.error('[auth] loginCount increment failed (non-blocking):', err);
+      }
+
       return { success: true, profile: userProfile };
     } catch (error: unknown) {
       // Check if this is an MFA challenge
diff --git a/web/src/lib/email.ts b/web/src/lib/email.ts
index 88df9f0..e15ee7d 100644
--- a/web/src/lib/email.ts
+++ b/web/src/lib/email.ts
@@ -13,6 +13,17 @@
  *
  * @see https://extensions.dev/extensions/firebase/firestore-send-email
  * @see docs/ADR-037, SECURITY_COMPLIANCE.md §12
+ *
+ * SECURITY — fail-closed write attribution:
+ *   The `mail` create rule (firestore.rules) requires
+ *   `request.resource.data.createdBy == request.auth.uid`. Every send MUST
+ *   therefore carry the *authenticated* caller's uid — there is no `'system'`
+ *   actor on the client. `userId` is required on all helpers; passing a falsy
+ *   value throws immediately instead of writing a doc the rule will reject
+ *   (which previously failed silently the moment a helper was wired up).
+ *   Unauthenticated sends (e.g. password-reset, where no user is signed in)
+ *   cannot satisfy the rule client-side and must route through the Go API /
+ *   Admin SDK — see `sendPasswordResetNotification` below.
  */
 
 import { addDoc, collection, serverTimestamp } from 'firebase/firestore';
@@ -67,13 +78,24 @@ interface NotificationEmailData {
  * Sends an email by writing to the Firestore `mail` collection.
  * The Firebase Trigger Email extension handles actual delivery.
  *
+ * @param createdBy - The authenticated caller's uid. REQUIRED: the `mail`
+ *   create rule pins `createdBy` to `request.auth.uid`, so a falsy value
+ *   would be silently rejected by Firestore. We throw eagerly instead.
  * @returns The document ID of the mail record (for tracking)
  */
-async function sendEmail(options: EmailOptions, createdBy?: string): Promise<string> {
+async function sendEmail(options: EmailOptions, createdBy: string): Promise<string> {
+  if (!createdBy) {
+    throw new Error(
+      'sendEmail requires the authenticated user uid (createdBy). ' +
+        'The mail create rule pins createdBy to request.auth.uid; ' +
+        'unauthenticated sends must route through the Go API / Admin SDK.',
+    );
+  }
+
   const mailDoc: Record<string, unknown> = {
     to: Array.isArray(options.to) ? options.to : [options.to],
     createdAt: serverTimestamp(),
-    createdBy: createdBy || 'system',
+    createdBy,
   };
 
   // Use template or direct content
@@ -97,7 +119,7 @@ async function sendEmail(options: EmailOptions, createdBy?: string): Promise<str
  * Send an estate invitation email.
  * Called when a principal invites a team member.
  */
-export async function sendInvitationEmail(data: InvitationEmailData, userId?: string): Promise<string> {
+export async function sendInvitationEmail(data: InvitationEmailData, userId: string): Promise<string> {
   const roleLabel = {
     executor: 'Executor',
     heir: 'Beneficiary',
@@ -125,7 +147,7 @@ export async function sendInvitationEmail(data: InvitationEmailData, userId?: st
 /**
  * Send a welcome email after registration.
  */
-export async function sendWelcomeEmail(data: WelcomeEmailData, userId?: string): Promise<string> {
+export async function sendWelcomeEmail(data: WelcomeEmailData, userId: string): Promise<string> {
   return sendEmail({
     to: data.recipientEmail,
     subject: 'Welcome to FinalWishes — Your Estate Operating System',
@@ -143,7 +165,7 @@ export async function sendWelcomeEmail(data: WelcomeEmailData, userId?: string):
 /**
  * Send an estate notification email (deadline, update, etc.)
  */
-export async function sendNotificationEmail(data: NotificationEmailData, userId?: string): Promise<string> {
+export async function sendNotificationEmail(data: NotificationEmailData, userId: string): Promise<string> {
   return sendEmail({
     to: data.recipientEmail,
     subject: `[${data.estateName}] ${data.notificationType} — FinalWishes`,
@@ -163,46 +185,54 @@ export async function sendNotificationEmail(data: NotificationEmailData, userId?
 
 /**
  * Send a password reset confirmation email.
- * Note: Firebase Auth handles the actual reset email — this is
- * a supplemental notification for audit purposes.
+ *
+ * IMPORTANT — server-only: this fires during the password-reset flow, when
+ * NO user is signed in. The `mail` create rule requires
+ * `createdBy == request.auth.uid`, which an unauthenticated client cannot
+ * satisfy, so this notification CANNOT be sent from the browser. It must be
+ * issued server-side via the Go API / Firebase Admin SDK (which bypasses
+ * security rules), keyed to the audited request.
+ *
+ * Firebase Auth already handles the actual reset email; this supplemental
+ * audit notification is intentionally not wired client-side. Calling it from
+ * the browser throws immediately rather than queuing a doc the rule rejects.
+ *
+ * @throws Always — there is no authenticated client path for this send.
  */
-export async function sendPasswordResetNotification(email: string): Promise<string> {
-  return sendEmail({
-    to: email,
-    subject: 'Password Reset Requested — FinalWishes',
-    html: `
-      <div style="font-family: Inter, Arial, sans-serif; max-width: 600px; margin: 0 auto;">
-        <div style="background: linear-gradient(135deg, #1E3A5F, #2563EB); padding: 24px; border-radius: 12px 12px 0 0;">
-          <h1 style="color: #C8A951; font-family: Cinzel, serif; margin: 0; font-size: 24px;">FinalWishes</h1>
-        </div>
-        <div style="padding: 24px; background: #ffffff; border-radius: 0 0 12px 12px; border: 1px solid #e5e7eb;">
-          <p style="color: #1E3A5F; font-size: 16px;">A password reset was requested for your FinalWishes account.</p>
-          <p style="color: #1E3A5F; font-size: 14px;">If you did not request this, please contact support immediately at <a href="mailto:support@finalwishes.app" style="color: #2563EB;">support@finalwishes.app</a>.</p>
-          <hr style="border: none; border-top: 1px solid #e5e7eb; margin: 16px 0;" />
-          <p style="color: #6B7280; font-size: 12px;">This is an automated security notification from FinalWishes.</p>
-        </div>
-      </div>
-    `,
-    text: 'A password reset was requested for your FinalWishes account. If you did not request this, please contact support@finalwishes.app immediately.',
-  });
+export async function sendPasswordResetNotification(_email: string): Promise<never> {
+  throw new Error(
+    'sendPasswordResetNotification must run server-side (Go API / Admin SDK): ' +
+      'the password-reset flow is unauthenticated and cannot satisfy the ' +
+      'fail-closed mail create rule (createdBy == request.auth.uid).',
+  );
 }
 
 /**
  * React hook wrapper for sending emails with the current user's context.
+ *
+ * Every sender resolves the signed-in user's uid for `createdBy`. If no user
+ * is authenticated the send throws (the `mail` rule would reject it anyway),
+ * so callers should gate UI on auth state. Password-reset notifications are
+ * deliberately absent here — they run unauthenticated and are server-only.
  */
 export function useEmailService() {
   const { user } = useAuth();
 
+  const requireUid = (): string => {
+    if (!user?.uid) {
+      throw new Error('Email sends require an authenticated user.');
+    }
+    return user.uid;
+  };
+
   return {
     sendInvitation: (data: InvitationEmailData) =>
-      sendInvitationEmail(data, user?.uid),
+      sendInvitationEmail(data, requireUid()),
 
     sendWelcome: (data: WelcomeEmailData) =>
-      sendWelcomeEmail(data, user?.uid),
+      sendWelcomeEmail(data, requireUid()),
 
     sendNotification: (data: NotificationEmailData) =>
-      sendNotificationEmail(data, user?.uid),
-
-    sendPasswordResetNotification,
+      sendNotificationEmail(data, requireUid()),
   };
 }
diff --git a/web/src/lib/firestore.test.ts b/web/src/lib/firestore.test.ts
index 9f842df..4f2105f 100644
--- a/web/src/lib/firestore.test.ts
+++ b/web/src/lib/firestore.test.ts
@@ -193,6 +193,41 @@ describe('useCollection', () => {
 
     expect(result.current.error).toBe('Quota exceeded')
   })
+
+  // Regression: the dependency key must capture constraint VALUES, not just the
+  // constraint type. A query whose field path is fixed but whose value changes
+  // (e.g. `where('userId','==', X)` as X updates) must re-subscribe; keying on
+  // type alone served a stale list.
+  it('re-subscribes when a constraint value changes on a fixed field path', async () => {
+    const { rerender } = renderHook(
+      ({ value }: { value: string }) =>
+        useCollection('estates/e1/assets', [mockWhere('userId', '==', value) as any]),
+      { initialProps: { value: 'user-a' } }
+    )
+
+    await waitFor(() => expect(mockOnSnapshot).toHaveBeenCalledTimes(1))
+
+    rerender({ value: 'user-b' })
+
+    // New value → new key → new subscription (old one torn down).
+    await waitFor(() => expect(mockOnSnapshot).toHaveBeenCalledTimes(2))
+  })
+
+  it('does not re-subscribe when the constraint value is unchanged', async () => {
+    const { rerender } = renderHook(
+      ({ value }: { value: string }) =>
+        useCollection('estates/e1/assets', [mockWhere('userId', '==', value) as any]),
+      { initialProps: { value: 'user-a' } }
+    )
+
+    await waitFor(() => expect(mockOnSnapshot).toHaveBeenCalledTimes(1))
+
+    rerender({ value: 'user-a' })
+    rerender({ value: 'user-a' })
+
+    // Same value → same key → no extra subscription churn.
+    expect(mockOnSnapshot).toHaveBeenCalledTimes(1)
+  })
 })
 
 // ─── Domain Hooks ────────────────────────────────────────────────────────────
diff --git a/web/src/lib/firestore.ts b/web/src/lib/firestore.ts
index 362ff53..b65b135 100644
--- a/web/src/lib/firestore.ts
+++ b/web/src/lib/firestore.ts
@@ -298,6 +298,52 @@ export function useDocument<T>(path: string | null): FirestoreResult<T> {
   return { data, loading, error };
 }
 
+/**
+ * Build a stable, value-aware key fragment for a single QueryConstraint.
+ *
+ * The Firebase Web SDK keeps a constraint's field path, operator, value,
+ * direction and limit on non-public underscore-prefixed properties. We read
+ * them defensively: if the SDK shape changes (e.g. heavy minification renames
+ * them), we degrade to the constraint's own JSON / string representation rather
+ * than silently dropping the value — never to the type alone, which is the
+ * latent stale-list bug this normalizer exists to prevent.
+ */
+function normalizeConstraint(c: QueryConstraint): unknown {
+  const anyC = c as unknown as Record<string, unknown>;
+  const field = anyC._field;
+  const fieldPath =
+    field && typeof field === 'object'
+      ? String((field as { toString?: () => string }).toString?.() ?? '')
+      : field;
+
+  const projection: Record<string, unknown> = {
+    type: c.type,
+    field: fieldPath,
+    op: anyC._op,
+    value: anyC._value,
+    direction: anyC._direction,
+    limit: anyC._limit,
+  };
+
+  // If none of the discriminating internals were present (minified/renamed),
+  // fall back to a structural serialization so distinct constraints still key
+  // distinctly. JSON first (captures own enumerable props), then String().
+  const hasInternals =
+    fieldPath !== undefined ||
+    anyC._op !== undefined ||
+    anyC._value !== undefined ||
+    anyC._direction !== undefined ||
+    anyC._limit !== undefined;
+
+  if (hasInternals) return projection;
+
+  try {
+    return { type: c.type, raw: JSON.parse(JSON.stringify(c)) };
+  } catch {
+    return { type: c.type, raw: String(c) };
+  }
+}
+
 /**
  * Subscribe to a Firestore collection or subcollection with optional constraints.
  */
@@ -309,9 +355,17 @@ export function useCollection<T>(
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState<string | null>(null);
 
-  // Serialize constraints to a stable key for dependency tracking
+  // Serialize constraints to a stable key for dependency tracking.
+  //
+  // We must key on the FULL constraint — not just `c.type` — otherwise a query
+  // whose field path is fixed but whose value changes (e.g.
+  // `where('userId', '==', userId)` as `userId` updates) would NOT re-subscribe,
+  // serving a stale list. The Firebase SDK does not expose a public serializer,
+  // so we defensively read the well-known internal fields (`_field`, `_op`,
+  // `_value`, `_direction`, `_limit`) and fall back to the constraint's own
+  // JSON / string form when they are absent or minified away.
   const constraintKey = useMemo(
-    () => JSON.stringify(constraints?.map((c) => c.type) || []),
+    () => JSON.stringify((constraints || []).map(normalizeConstraint)),
     [constraints]
   );
 
diff --git a/web/src/lib/google-photos-import.ts b/web/src/lib/google-photos-import.ts
index 964872d..4bbccd6 100644
--- a/web/src/lib/google-photos-import.ts
+++ b/web/src/lib/google-photos-import.ts
@@ -42,6 +42,17 @@ interface GisOAuth2 {
 }
 type GisWindow = Window & { google?: { accounts?: { oauth2?: GisOAuth2 } } }
 
+/**
+ * Whether the Google Photos import is provisioned in this build. Import requires a
+ * build-time Web OAuth client id (`VITE_GOOGLE_OAUTH_CLIENT_ID`); without it every
+ * import attempt throws "not configured", so callers should hide/disable the entry
+ * point rather than letting users click into a guaranteed error. (See the OWNER
+ * PREREQUISITES header — the Picker API + consent-screen scope are the other two
+ * steps, but only the client id is observable at build time on the client.)
+ */
+export const isGooglePhotosImportConfigured = (): boolean =>
+  Boolean(import.meta.env.VITE_GOOGLE_OAUTH_CLIENT_ID)
+
 let gisLoading: Promise<void> | null = null
 
 function loadGis(): Promise<void> {
diff --git a/web/src/lib/invitations.test.ts b/web/src/lib/invitations.test.ts
index 3f979bd..eda7df1 100644
--- a/web/src/lib/invitations.test.ts
+++ b/web/src/lib/invitations.test.ts
@@ -32,6 +32,7 @@ import {
   revokeInvitation,
   ROLE_LABELS,
 } from './invitations'
+import type { InvitationParams } from './invitations'
 
 beforeEach(() => {
   vi.clearAllMocks()
@@ -269,24 +270,26 @@ describe('ROLE_LABELS', () => {
   })
 })
 
-// ─── Phone Number Support ───────────────────────────────────────────────────
+// ─── Email-only invitation delivery ─────────────────────────────────────────
 
 describe('sendEstateInvitation with phone', () => {
-  it('includes phone in invitation document when provided', async () => {
+  it('does not persist phone until SMS delivery is backed by a live provider', async () => {
     mockGetDocs.mockResolvedValue({ empty: true, docs: [] })
 
-    await sendEstateInvitation({
+    const paramsWithLegacyPhone = {
       estateId: 'estate-1',
       email: 'test@example.com',
       phone: '+1-555-123-4567',
       fullName: 'Phone User',
-      role: 'heir',
+      role: 'heir' as const,
       invitedBy: 'user-1',
-    })
+    } satisfies InvitationParams & { phone: string }
+
+    await sendEstateInvitation(paramsWithLegacyPhone)
 
     // First addDoc call is the invitation record
     const invitationData = mockAddDoc.mock.calls[0][1]
-    expect(invitationData.phone).toBe('+1-555-123-4567')
+    expect(invitationData).not.toHaveProperty('phone')
   })
 
   it('does not include phone field when not provided', async () => {
@@ -304,28 +307,26 @@ describe('sendEstateInvitation with phone', () => {
     expect(invitationData).not.toHaveProperty('phone')
   })
 
-  it('queues SMS notification when phone is provided', async () => {
+  it('does not queue SMS notification when phone is provided', async () => {
     mockGetDocs.mockResolvedValue({ empty: true, docs: [] })
 
-    await sendEstateInvitation({
+    const paramsWithLegacyPhone = {
       estateId: 'estate-1',
       email: 'sms@example.com',
       phone: '  +1-555-999-0000  ',
       fullName: 'SMS User',
-      role: 'executor',
+      role: 'executor' as const,
       invitedBy: 'user-1',
       inviterName: 'Cylton',
       estateName: 'Collymore Estate',
       priority: 1,
-    })
+    } satisfies InvitationParams & { phone: string }
 
-    // Without phone: 3 addDoc calls (invitation + executor subcollection + email)
-    // With phone: 4 addDoc calls (+ sms_queue)
-    expect(mockAddDoc).toHaveBeenCalledTimes(4)
+    await sendEstateInvitation(paramsWithLegacyPhone)
 
-    // The last addDoc call is the sms_queue entry
-    const lastCall = mockAddDoc.mock.calls[3]
-    expect(lastCall[1].to).toBe('+1-555-999-0000')
-    expect(lastCall[1].status).toBe('pending')
+    // Phone is accepted by older callers but delivery remains email-only until
+    // an SMS provider/function exists to drain a queue.
+    expect(mockAddDoc).toHaveBeenCalledTimes(3)
+    expect(mockAddDoc.mock.calls.some(([, data]) => data?.to === '+1-555-999-0000')).toBe(false)
   })
 })
diff --git a/web/src/lib/invitations.ts b/web/src/lib/invitations.ts
index 4b5a1c7..94a6c85 100644
--- a/web/src/lib/invitations.ts
+++ b/web/src/lib/invitations.ts
@@ -31,7 +31,6 @@ import { estateInvitationEmail } from './email-templates';
 export interface InvitationParams {
   estateId: string;
   email: string;
-  phone?: string; // Optional phone number for SMS notification
   fullName: string;
   role: 'executor' | 'heir' | 'trustee' | 'legal' | 'cpa';
   relationship?: string;
@@ -60,7 +59,7 @@ interface InvitationResult {
  * 5. If user doesn't exist → Cloud Function autoMatchInvitation handles it on signup
  */
 export async function sendEstateInvitation(params: InvitationParams): Promise<InvitationResult> {
-  const { estateId, email, phone, fullName, role, relationship, invitedBy, inviterName, estateName, priority } = params;
+  const { estateId, email, fullName, role, relationship, invitedBy, inviterName, estateName, priority } = params;
   const normalizedEmail = email.toLowerCase().trim();
 
   try {
@@ -77,7 +76,6 @@ export async function sendEstateInvitation(params: InvitationParams): Promise<In
     const invRef = await addDoc(collection(db, 'estate_invitations'), {
       estateId,
       email: normalizedEmail,
-      ...(phone ? { phone: phone.trim() } : {}),
       fullName,
       role,
       relationship: relationship || '',
@@ -145,23 +143,10 @@ export async function sendEstateInvitation(params: InvitationParams): Promise<In
       console.warn('[sendEstateInvitation] Email send failed (invitation still created):', emailErr);
     }
 
-    // 6. Queue SMS notification if phone number was provided
-    if (phone) {
-      try {
-        const smsBody = `${inviterName || 'Someone'} has invited you to ${estateName || 'an estate'} on FinalWishes. Open the invitation: https://finalwishes-prod.web.app/accept-invite?id=${invRef.id}`;
-        await addDoc(collection(db, 'sms_queue'), {
-          to: phone.trim(),
-          body: smsBody,
-          invitationId: invRef.id,
-          estateId,
-          status: 'pending',
-          createdAt: serverTimestamp(),
-          createdBy: invitedBy,
-        });
-      } catch (smsErr) {
-        console.warn('[sendEstateInvitation] SMS queue failed (invitation still created):', smsErr);
-      }
-    }
+    // NOTE: Invitation delivery is email-only. A phone/SMS path was deliberately
+    // removed rather than ship a queue that no provider drains (the invitee would
+    // never receive a text while the UI reported success). Reintroduce an
+    // `sms_queue` write here only alongside a live SMS delivery function.
 
     return { success: true, invitationId: invRef.id, autoLinked: false };
   } catch (err: unknown) {
diff --git a/web/src/lib/persona.test.ts b/web/src/lib/persona.test.ts
index 4014db8..b8a18a0 100644
--- a/web/src/lib/persona.test.ts
+++ b/web/src/lib/persona.test.ts
@@ -34,7 +34,7 @@ describe('resolveEffectiveRole — estate-scoped role wins', () => {
 describe('heir — the sacred-moment boundary (ETHOS)', () => {
   it('never reaches owner-admin or settlement surfaces', () => {
     const forbidden: SectionId[] = [
-      'vault', 'lockbox', 'forms', 'beneficiaries', 'probate', 'pricing', 'settings',
+      'vault', 'lockbox', 'forms', 'beneficiaries', 'probate', 'pricing',
     ]
     for (const s of forbidden) {
       expect(canAccess('heir', s), `heir must NOT access ${s}`).toBe(false)
@@ -69,11 +69,17 @@ describe('heir — the sacred-moment boundary (ETHOS)', () => {
 
 describe('fiduciaries — settlement only, no living-legacy creation', () => {
   it('executor cannot reach owner living-legacy/creation surfaces', () => {
-    for (const s of ['soul-log', 'life-chapters', 'memoirs', 'heirlooms', 'timecapsule', 'pricing', 'settings', 'forms'] as SectionId[]) {
+    for (const s of ['soul-log', 'life-chapters', 'memoirs', 'heirlooms', 'timecapsule', 'pricing', 'forms'] as SectionId[]) {
       expect(canAccess('executor', s), `executor must NOT access ${s}`).toBe(false)
     }
   })
 
+  it('fiduciaries and heirs can reach settings for MFA/profile security only', () => {
+    for (const role of ['executor', 'trustee', 'heir', 'legal', 'cpa'] as PersonaRole[]) {
+      expect(canAccess(role, 'settings'), `${role} needs settings for MFA enrollment`).toBe(true)
+    }
+  })
+
   it('executor reaches settlement + authorized evidence', () => {
     for (const s of ['probate', 'vault', 'assets', 'directives', 'beneficiaries', 'events', 'obituary'] as SectionId[]) {
       expect(canAccess('executor', s), `executor SHOULD access ${s}`).toBe(true)
diff --git a/web/src/lib/persona.ts b/web/src/lib/persona.ts
index 6d42130..83d17c1 100644
--- a/web/src/lib/persona.ts
+++ b/web/src/lib/persona.ts
@@ -87,32 +87,40 @@ export const PERSONA_ACCESS: Record<PersonaRole, ReadonlySet<SectionId>> = {
   // collection" — credentials). Granting the route here would only route these
   // personas to a permission-denied read. Widening lockbox to fiduciaries
   // (metadata-only) is a future security decision that must change the rule first.
+  // `settings` is granted to every estate persona: the settings page is the ONLY
+  // surface that renders MFAEnrollment, and IdentityGate hard-blocks fiduciaries
+  // until MFA is enrolled. Without settings access an invited heir/executor would
+  // be permanently locked out of the estate they were invited to. The page itself
+  // is internally role-gated (isPrincipalOrAdmin) so fiduciaries see only their
+  // own profile + security (MFA) cards, never estate-preference sections.
   executor: new Set<SectionId>([
     'dashboard', 'assets', 'vault', 'directives', 'beneficiaries',
-    'events', 'obituary', 'probate', 'notifications', 'attestation', 'estates', 'index',
+    'events', 'obituary', 'probate', 'notifications', 'settings', 'attestation', 'estates', 'index',
   ]),
 
   trustee: new Set<SectionId>([
     'dashboard', 'assets', 'vault', 'directives', 'beneficiaries',
-    'probate', 'notifications', 'attestation', 'estates', 'index',
+    'probate', 'notifications', 'settings', 'attestation', 'estates', 'index',
   ]),
 
   // Heir: sacred-moment first. `dashboard` is allowed but is the HEIR-shaped
   // landing (DashboardRouter renders HeirDashboard, never the owner completion
-  // timeline). NO vault, lockbox, forms, beneficiaries, probate, pricing,
-  // settings. Memory/asset sections are assigned/shared only (SCOPED_SECTIONS).
+  // timeline). NO vault, lockbox, forms, beneficiaries, probate, pricing.
+  // `settings` IS granted so heirs can enroll MFA (the IdentityGate requirement)
+  // and manage their own profile/security. Memory/asset sections are
+  // assigned/shared only (SCOPED_SECTIONS).
   heir: new Set<SectionId>([
     'dashboard', 'life-chapters', 'soul-log', 'memoirs', 'heirlooms', 'assets',
-    'directives', 'timecapsule', 'events', 'obituary', 'notifications', 'attestation', 'index',
+    'directives', 'timecapsule', 'events', 'obituary', 'notifications', 'settings', 'attestation', 'index',
   ]),
 
   legal: new Set<SectionId>([
     'dashboard', 'assets', 'vault', 'forms', 'directives', 'notifications',
-    'attestation', 'estates', 'index',
+    'settings', 'attestation', 'estates', 'index',
   ]),
 
   cpa: new Set<SectionId>([
-    'dashboard', 'assets', 'vault', 'notifications', 'attestation',
+    'dashboard', 'assets', 'vault', 'notifications', 'settings', 'attestation',
     'estates', 'index',
   ]),
 };
diff --git a/web/src/lib/tier-gating.ts b/web/src/lib/tier-gating.ts
index 041ab23..230f408 100644
--- a/web/src/lib/tier-gating.ts
+++ b/web/src/lib/tier-gating.ts
@@ -10,10 +10,7 @@
 
 import { useState, useEffect, useCallback } from 'react';
 import { auth } from './firebase';
-
-// ─── Constants ───────────────────────────────────────────────────────────────
-
-const API_BASE = import.meta.env.VITE_API_URL || 'http://localhost:8080';
+import { API_BASE } from './client';
 
 // ─── Types ───────────────────────────────────────────────────────────────────
 
diff --git a/web/src/routeTree.gen.ts b/web/src/routeTree.gen.ts
index 3a2d182..7ea1ec2 100644
--- a/web/src/routeTree.gen.ts
+++ b/web/src/routeTree.gen.ts
@@ -150,7 +150,9 @@ const EstatesEstateIdProbateRoute = EstatesEstateIdProbateRouteImport.update({
   id: '/probate',
   path: '/probate',
   getParentRoute: () => EstatesEstateIdRoute,
-} as any)
+} as any).lazy(() =>
+  import('./routes/estates.$estateId.probate.lazy').then((d) => d.Route),
+)
 const EstatesEstateIdPricingRoute = EstatesEstateIdPricingRouteImport.update({
   id: '/pricing',
   path: '/pricing',
diff --git a/web/src/routes/README.md b/web/src/routes/README.md
index 72ed9b9..e2873a8 100644
--- a/web/src/routes/README.md
+++ b/web/src/routes/README.md
@@ -17,22 +17,32 @@ Routes use TanStack Router's file-based convention. The `estates.$estateId.tsx`
 | `estates.create.tsx` | `/estates/create` | New estate wizard |
 | `estates.$estateId.tsx` | `/estates/:id` | Estate layout (auth + sidebar) |
 | `estates.$estateId.index.tsx` | `/estates/:id/` | Estate overview redirect |
-| `estates.$estateId.dashboard.tsx` | `.../dashboard` | Estate dashboard |
+| `estates.$estateId.dashboard.tsx` ⚡ | `.../dashboard` | Estate dashboard |
 | `estates.$estateId.assets.tsx` | `.../assets` | Asset inventory |
 | `estates.$estateId.beneficiaries.tsx` | `.../beneficiaries` | Heirs + executors |
-| `estates.$estateId.directives.tsx` | `.../directives` | Ethical wills, funeral prefs |
-| `estates.$estateId.vault.tsx` | `.../vault` | Document vault |
-| `estates.$estateId.lockbox.tsx` | `.../lockbox` | Encrypted credentials |
-| `estates.$estateId.memoirs.tsx` | `.../memoirs` | Video/photo memories |
-| `estates.$estateId.timecapsule.tsx` | `.../timecapsule` | Scheduled messages |
-| `estates.$estateId.obituary.tsx` | `.../obituary` | AI-assisted obituary |
+| `estates.$estateId.directives.tsx` ⚡ | `.../directives` | Ethical wills, funeral prefs |
+| `estates.$estateId.vault.tsx` ⚡ | `.../vault` | Document vault |
+| `estates.$estateId.lockbox.tsx` ⚡ | `.../lockbox` | Encrypted credentials |
+| `estates.$estateId.memoirs.tsx` ⚡ | `.../memoirs` | Video/photo memories |
+| `estates.$estateId.timecapsule.tsx` ⚡ | `.../timecapsule` | Scheduled messages |
+| `estates.$estateId.obituary.tsx` ⚡ | `.../obituary` | AI-assisted obituary |
+| `estates.$estateId.soul-log.tsx` ⚡ | `.../soul-log` | Soul Log — per-recipient legacy entries |
+| `estates.$estateId.life-chapters.tsx` | `.../life-chapters` | Life chapters / legacy timeline |
+| `estates.$estateId.probate.tsx` | `.../probate` | Probate / estate settlement workflow |
+| `estates.$estateId.forms.tsx` | `.../forms` | Statutory legal forms (coordinate-overlay fill) |
 | `estates.$estateId.heirlooms.tsx` | `.../heirlooms` | Physical item catalog |
+| `estates.$estateId.events.tsx` | `.../events` | Funeral / memorial / repast pages |
 | `estates.$estateId.notifications.tsx` | `.../notifications` | Activity feed |
 | `estates.$estateId.settings.tsx` | `.../settings` | Estate configuration |
 | `estates.$estateId.pricing.tsx` | `.../pricing` | Stripe checkout |
 | `estates.$estateId.attestation.tsx` | `.../attestation` | Identity verification |
 | `estates.$estateId.estates.tsx` | `.../estates` | Multi-estate management |
 
+> ⚡ = route has a `.lazy.tsx` companion and is code-split (loaded on demand). The eager
+> `.tsx` file holds the route definition + loader; the `.lazy.tsx` file holds the heavy
+> component. Currently code-split: `dashboard`, `directives`, `lockbox`, `memoirs`,
+> `obituary`, `soul-log`, `timecapsule`, `vault`.
+
 ## Guards
 
 - **AuthGuard**: Redirects unauthenticated users to `/login`
@@ -41,4 +51,5 @@ Routes use TanStack Router's file-based convention. The `estates.$estateId.tsx`
 ## Known Limitations
 
 - Demo mode uses query param `?demo=true` with hardcoded `lockhart` estate ID
-- No route-level code splitting yet — all estate routes load with the layout
+- Code splitting is partial: the heaviest routes (see ⚡ above) ship `.lazy.tsx` companions,
+  but lighter estate routes still load eagerly with the layout
diff --git a/web/src/routes/__root.tsx b/web/src/routes/__root.tsx
index dfa1543..ffcb753 100644
--- a/web/src/routes/__root.tsx
+++ b/web/src/routes/__root.tsx
@@ -19,7 +19,7 @@ function NotFound() {
         >
           Page Not Found
         </h2>
-        <p className="text-slate-400 text-[15px] leading-relaxed">
+        <p className="text-white/70 text-[15px] leading-relaxed">
           The page you&apos;re looking for doesn&apos;t exist or has been moved.
         </p>
         <Link
diff --git a/web/src/routes/about.tsx b/web/src/routes/about.tsx
index 718410f..101b0d0 100644
--- a/web/src/routes/about.tsx
+++ b/web/src/routes/about.tsx
@@ -17,8 +17,8 @@ function Stat({ value, label }: { value: string; label: string }) {
 function Value({ title, children }: { title: string; children: React.ReactNode }) {
   return (
     <div className="bg-white rounded-2xl p-6 shadow-[0_4px_30px_rgba(0,0,0,0.08)]">
-      <h3 className="text-slate-900 font-bold text-base mb-2">{title}</h3>
-      <p className="text-slate-600 text-sm leading-relaxed">{children}</p>
+      <h3 className="text-royal font-bold text-base mb-2">{title}</h3>
+      <p className="text-ink-muted text-sm leading-relaxed">{children}</p>
     </div>
   )
 }
@@ -48,15 +48,15 @@ function AboutPage() {
 
       {/* ── Mission ── */}
       <section className="px-6 py-16 max-w-3xl mx-auto">
-        <h2 className="text-2xl md:text-3xl text-slate-900 font-[family-name:var(--font-cinzel)] mb-5">
+        <h2 className="text-2xl md:text-3xl text-royal font-[family-name:var(--font-cinzel)] mb-5">
           Why We <span className="text-[var(--gold)]">Built This</span>
         </h2>
-        <p className="text-slate-600 leading-relaxed mb-4">
+        <p className="text-ink-muted leading-relaxed mb-4">
           Every year, families lose months to probate, scramble for passwords that no longer exist, and
           argue over wishes that were never written down. More than $72 billion in assets sits unclaimed
           nationwide — not because families don&rsquo;t care, but because no one left a map.
         </p>
-        <p className="text-slate-600 leading-relaxed">
+        <p className="text-ink-muted leading-relaxed">
           FinalWishes exists to end that chaos before it starts. We believe estate planning should feel less
           like a filing cabinet and more like a conversation with the people you love — organized, secure,
           and ready the moment it&rsquo;s needed. Not a substitute for your attorney, but the system that
@@ -76,7 +76,7 @@ function AboutPage() {
 
       {/* ── Values ── */}
       <section className="px-6 py-16 max-w-5xl mx-auto">
-        <h2 className="text-2xl md:text-3xl text-slate-900 font-[family-name:var(--font-cinzel)] text-center mb-10">
+        <h2 className="text-2xl md:text-3xl text-royal font-[family-name:var(--font-cinzel)] text-center mb-10">
           What We <span className="text-[var(--gold)]">Stand For</span>
         </h2>
         <div className="grid md:grid-cols-3 gap-5">
@@ -97,21 +97,21 @@ function AboutPage() {
       </section>
 
       {/* ── Backing ── */}
-      <section className="px-6 py-16 max-w-3xl mx-auto border-t border-slate-100">
-        <h2 className="text-2xl md:text-3xl text-slate-900 font-[family-name:var(--font-cinzel)] mb-5">
+      <section className="px-6 py-16 max-w-3xl mx-auto border-t border-[var(--neutral-border)]">
+        <h2 className="text-2xl md:text-3xl text-royal font-[family-name:var(--font-cinzel)] mb-5">
           Built by <span className="text-[var(--gold)]">Sirsi Technologies</span>
         </h2>
-        <p className="text-slate-600 leading-relaxed mb-4">
+        <p className="text-ink-muted leading-relaxed mb-4">
           FinalWishes is operated by Sirsi Technologies, Inc., a Delaware C-Corporation building sovereign,
           security-first software for regulated industries. FinalWishes is our answer to one of the most
           universal — and most underserved — moments in any family&rsquo;s life.
         </p>
-        <p className="text-slate-600 leading-relaxed">
+        <p className="text-ink-muted leading-relaxed">
           Our initial focus markets are Maryland, Illinois, and Minnesota, where we have invested in deep
           compliance knowledge of state-specific estate law. The platform works in all 50 states — estate
           organization is universal.
         </p>
-        <p className="text-slate-600 leading-relaxed mt-4">
+        <p className="text-ink-muted leading-relaxed mt-4">
           Learn more about the company at{' '}
           <a href="https://sirsi.ai" className="text-[var(--royal)] underline font-semibold">sirsi.ai</a>, or
           reach our team at{' '}
diff --git a/web/src/routes/accept-invite.tsx b/web/src/routes/accept-invite.tsx
index 50faf7a..f6d2f8b 100644
--- a/web/src/routes/accept-invite.tsx
+++ b/web/src/routes/accept-invite.tsx
@@ -6,6 +6,7 @@ import {
   doc,
   getDoc,
   updateDoc,
+  onSnapshot,
   serverTimestamp,
 } from 'firebase/firestore'
 import { db } from '../lib/firebase'
@@ -21,7 +22,13 @@ export const Route = createFileRoute('/accept-invite')({
 
 /* eslint-disable @typescript-eslint/no-explicit-any */
 
-type Status = 'loading' | 'accepting' | 'success' | 'error' | 'unauthenticated'
+type Status =
+  | 'loading'
+  | 'accepting'
+  | 'success'
+  | 'pending-grant'
+  | 'error'
+  | 'unauthenticated'
 
 function AcceptInvitePage() {
   const navigate = useNavigate()
@@ -30,6 +37,10 @@ function AcceptInvitePage() {
   const { user, profile, loading: authLoading } = useAuth()
   const [status, setStatus] = useState<Status>('loading')
   const [errorMsg, setErrorMsg] = useState('')
+  // The estate whose server-side access grant we're waiting on. Captured when the
+  // poll times out so the live listener and the "Try Again" action know which doc
+  // to watch without re-fetching the invitation.
+  const [pendingEstateId, setPendingEstateId] = useState('')
 
   useEffect(() => {
     if (authLoading) return
@@ -49,6 +60,31 @@ function AcceptInvitePage() {
   // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [user, authLoading, invitationId])
 
+  // While we're in the pending-grant holding state, attach a live listener to the
+  // estate_users junction doc so the instant the autoMatch Cloud Function lands the
+  // grant — even after the fixed poll window expired — the user is taken straight in.
+  // This turns a cold-start race from a dead end into a self-healing wait.
+  useEffect(() => {
+    if (status !== 'pending-grant' || !user || !pendingEstateId) return
+
+    const euRef = doc(db, 'estate_users', `${user.uid}_${pendingEstateId}`)
+    const unsub = onSnapshot(
+      euRef,
+      (snap) => {
+        if (snap.exists() && snap.data()?.accessGranted) {
+          finalizeAccess(pendingEstateId)
+        }
+      },
+      (err) => {
+        // Listener errors (e.g. transient rules/network) are non-fatal — the user can
+        // still use the manual "Try Again" action. Just log and keep the holding state.
+        console.warn('[accept-invite] grant listener error (non-fatal):', err)
+      },
+    )
+    return () => unsub()
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [status, user, pendingEstateId])
+
   async function acceptInvitation() {
     if (!user || !invitationId) return
     setStatus('accepting')
@@ -102,37 +138,17 @@ function AcceptInvitePage() {
       }
 
       if (!granted) {
-        // The async trigger hasn't landed yet — do NOT hard-fail; the user will get
-        // access shortly. Guide them rather than showing a dead end.
-        setStatus('error')
-        setErrorMsg(
-          "You're almost in — we're finalizing your access to this estate. Please refresh in a moment, or sign in again and you'll be taken straight to it.",
-        )
+        // The async trigger hasn't landed yet — do NOT hard-fail. This is a timing
+        // race on a Cloud Function cold start, not a genuine error. Drop into the
+        // dedicated pending-grant holding state: a live onSnapshot listener (above)
+        // takes the user in the instant the grant lands, and the UI offers an explicit
+        // "Try Again" affordance so they're never stranded.
+        setPendingEstateId(inv.estateId)
+        setStatus('pending-grant')
         return
       }
 
-      // 3. Point the invitee's OWN profile at this estate (allowed by rules: own doc)
-      // so a future login lands them here. Non-fatal.
-      if (!profile?.primaryEstateId) {
-        try {
-          await updateDoc(doc(db, 'users', user.uid), {
-            primaryEstateId: inv.estateId,
-            updatedAt: serverTimestamp(),
-          })
-        } catch (e) {
-          console.warn('[accept-invite] primaryEstateId update skipped (non-fatal):', e)
-        }
-      }
-
-      setStatus('success')
-
-      // 4. Redirect to estate dashboard
-      setTimeout(() => {
-        navigate({
-          to: '/estates/$estateId/dashboard',
-          params: { estateId: inv.estateId },
-        })
-      }, 1500)
+      finalizeAccess(inv.estateId)
     } catch (err) {
       console.error('[accept-invite] Error:', err)
       setStatus('error')
@@ -140,6 +156,34 @@ function AcceptInvitePage() {
     }
   }
 
+  // Commits the local side of a successful grant and routes the user into their estate.
+  // Idempotent-safe: guarded so the live listener and the poll path can't double-fire.
+  async function finalizeAccess(estateId: string) {
+    if (!user) return
+    setStatus('success')
+
+    // Point the invitee's OWN profile at this estate (allowed by rules: own doc) so a
+    // future login lands them here. Non-fatal.
+    if (!profile?.primaryEstateId) {
+      try {
+        await updateDoc(doc(db, 'users', user.uid), {
+          primaryEstateId: estateId,
+          updatedAt: serverTimestamp(),
+        })
+      } catch (e) {
+        console.warn('[accept-invite] primaryEstateId update skipped (non-fatal):', e)
+      }
+    }
+
+    // Redirect to estate dashboard.
+    setTimeout(() => {
+      navigate({
+        to: '/estates/$estateId/dashboard',
+        params: { estateId },
+      })
+    }, 1500)
+  }
+
   // Not logged in — redirect to login with invite param
   if (status === 'unauthenticated') {
     return (
@@ -152,10 +196,10 @@ function AcceptInvitePage() {
             </svg>
           </div>
           <div>
-            <h2 className="text-2xl font-[family-name:var(--font-cinzel)] font-bold text-slate-900 mb-2">
+            <h2 className="text-2xl font-[family-name:var(--font-cinzel)] font-bold text-royal mb-2">
               Estate Invitation
             </h2>
-            <p className="text-slate-500 text-sm font-medium">
+            <p className="text-ink-muted text-sm font-medium">
               You've been invited to join an estate. Sign in or create an account to continue.
             </p>
           </div>
@@ -169,7 +213,7 @@ function AcceptInvitePage() {
             <Button
               variant="outline"
               onClick={() => navigate({ to: '/login', search: { invite: invitationId } } as any)}
-              className="w-full py-4 h-auto rounded-2xl font-bold border-slate-200"
+              className="w-full py-4 h-auto rounded-2xl font-bold border-[var(--neutral-border)]"
             >
               Create Account
             </Button>
@@ -179,6 +223,52 @@ function AcceptInvitePage() {
     )
   }
 
+  // Server-side access grant hasn't landed within the poll window. This is a Cloud
+  // Function cold-start race, NOT an error — a live listener is still watching, and we
+  // give the user explicit recovery actions instead of a dead end.
+  if (status === 'pending-grant') {
+    return (
+      <InviteCard>
+        <div className="text-center space-y-6">
+          <div className="w-16 h-16 mx-auto bg-[var(--gold)]/10 rounded-2xl flex items-center justify-center">
+            <div className="w-8 h-8 border-2 border-[var(--gold)]/30 border-t-[var(--gold)] rounded-full animate-spin" />
+          </div>
+          <div>
+            <h2 className="text-2xl font-[family-name:var(--font-cinzel)] font-bold text-royal mb-2">
+              Almost There
+            </h2>
+            <p className="text-ink-muted text-sm font-medium">
+              We're finalizing your access to this estate. This usually takes just a
+              moment — we'll take you in automatically the instant it's ready.
+            </p>
+          </div>
+          <div className="flex flex-col gap-3">
+            <Button
+              onClick={() => acceptInvitation()}
+              className="w-full bg-[var(--royal)] hover:bg-[var(--royal-blue)] text-white py-4 h-auto rounded-2xl font-bold"
+            >
+              Try Again
+            </Button>
+            <Button
+              variant="outline"
+              onClick={() => window.location.reload()}
+              className="w-full py-4 h-auto rounded-2xl font-bold border-[var(--neutral-border)]"
+            >
+              Refresh
+            </Button>
+            <button
+              type="button"
+              onClick={() => navigate({ to: '/' })}
+              className="text-xs font-semibold text-ink-muted hover:text-ink transition-colors"
+            >
+              Go to Home
+            </button>
+          </div>
+        </div>
+      </InviteCard>
+    )
+  }
+
   if (status === 'error') {
     return (
       <InviteCard>
@@ -191,15 +281,15 @@ function AcceptInvitePage() {
             </svg>
           </div>
           <div>
-            <h2 className="text-2xl font-[family-name:var(--font-cinzel)] font-bold text-slate-900 mb-2">
+            <h2 className="text-2xl font-[family-name:var(--font-cinzel)] font-bold text-royal mb-2">
               Invitation Error
             </h2>
-            <p className="text-slate-500 text-sm font-medium">{errorMsg}</p>
+            <p className="text-ink-muted text-sm font-medium">{errorMsg}</p>
           </div>
           <Button
             onClick={() => navigate({ to: '/' })}
             variant="outline"
-            className="py-4 h-auto rounded-2xl font-bold border-slate-200"
+            className="py-4 h-auto rounded-2xl font-bold border-[var(--neutral-border)]"
           >
             Go to Home
           </Button>
@@ -218,10 +308,10 @@ function AcceptInvitePage() {
             </svg>
           </div>
           <div>
-            <h2 className="text-2xl font-[family-name:var(--font-cinzel)] font-bold text-slate-900 mb-2">
+            <h2 className="text-2xl font-[family-name:var(--font-cinzel)] font-bold text-royal mb-2">
               Welcome to the Estate
             </h2>
-            <p className="text-slate-500 text-sm font-medium">
+            <p className="text-ink-muted text-sm font-medium">
               Your invitation has been accepted. Redirecting to your dashboard...
             </p>
           </div>
@@ -235,7 +325,7 @@ function AcceptInvitePage() {
     <InviteCard>
       <div className="text-center space-y-6">
         <div className="w-10 h-10 mx-auto border-2 border-[var(--royal)]/20 border-t-[var(--royal)] rounded-full animate-spin" />
-        <p className="text-slate-500 text-sm font-medium">
+        <p className="text-ink-muted text-sm font-medium">
           {status === 'accepting' ? 'Accepting your invitation...' : 'Loading invitation...'}
         </p>
       </div>
@@ -245,7 +335,7 @@ function AcceptInvitePage() {
 
 function InviteCard({ children }: { children: React.ReactNode }) {
   return (
-    <div className="min-h-screen flex items-center justify-center p-6 bg-slate-50">
+    <div className="min-h-screen flex items-center justify-center p-6 bg-[var(--neutral-faint)]">
       <div className="fixed inset-0 z-0 pointer-events-none">
         <div className="absolute top-[-10%] right-[-10%] w-[600px] h-[600px] bg-[var(--royal)]/[0.03] blur-[120px] rounded-full" />
         <div className="absolute bottom-[-10%] left-[-10%] w-[600px] h-[600px] bg-[var(--royal)]/[0.05] blur-[120px] rounded-full" />
diff --git a/web/src/routes/dashboard.tsx b/web/src/routes/dashboard.tsx
index f5223c5..dbc6a1a 100644
--- a/web/src/routes/dashboard.tsx
+++ b/web/src/routes/dashboard.tsx
@@ -32,10 +32,10 @@ function DashboardRedirect() {
   }, [navigate, user, profile, profileResolved]);
 
   return (
-    <div className="flex items-center justify-center min-h-screen bg-slate-50">
+    <div className="flex items-center justify-center min-h-screen bg-[var(--neutral-faint)]">
       <div className="flex flex-col items-center gap-4">
         <div className="w-10 h-10 border-2 border-[var(--royal)]/20 border-t-[var(--royal)] rounded-full animate-spin" />
-        <span className="text-[11px] font-semibold text-slate-500 uppercase tracking-[0.2em]">Redirecting...</span>
+        <span className="text-[11px] font-semibold text-ink-muted uppercase tracking-[0.2em]">Redirecting...</span>
       </div>
     </div>
   );
diff --git a/web/src/routes/estates.$estateId.assets.tsx b/web/src/routes/estates.$estateId.assets.tsx
index 29d1e99..5e74e25 100644
--- a/web/src/routes/estates.$estateId.assets.tsx
+++ b/web/src/routes/estates.$estateId.assets.tsx
@@ -62,38 +62,53 @@ function AssetsPage() {
 
   const handleAddAsset = async (vars: { name: string, type: string, value: string }) => {
     setSaving(true);
-    await addAssetAction({
+    const result = await addAssetAction({
       estateId,
       name: vars.name,
       category: vars.type as Asset['category'],
       estimatedValue: parseFloat(vars.value.replace(/[^0-9.]/g, '')) || 0,
     });
     setSaving(false);
-    setModalOpen(false);
-    toast.success(`${vars.name} added to your estate`);
+    if (result.success) {
+      setModalOpen(false);
+      toast.success(`${vars.name} added to your estate`);
+    } else {
+      toast.error(result.error || 'Could not add this asset. Please try again.');
+    }
   };
 
   const handleUpdateAsset = async (data: { name: string; category: string; estimatedValue: string; description: string }) => {
     if (!editingAsset) return;
     setEditSaving(true);
-    await updateAsset(estateId, editingAsset.id, {
+    const result = await updateAsset(estateId, editingAsset.id, {
       name: data.name,
       category: data.category,
       estimatedValue: parseFloat(data.estimatedValue.replace(/[^0-9.]/g, '')) || 0,
       description: data.description,
     });
     setEditSaving(false);
-    setEditingAsset(null);
-    setConfirmArchive(false);
+    if (result.success) {
+      setEditingAsset(null);
+      setConfirmArchive(false);
+      toast.success(`${data.name} updated`);
+    } else {
+      toast.error(result.error || 'Could not save changes. Please try again.');
+    }
   };
 
   const handleArchiveAsset = async () => {
     if (!editingAsset) return;
     setEditSaving(true);
-    await archiveAsset(estateId, editingAsset.id);
+    const archivedName = editingAsset.name;
+    const result = await archiveAsset(estateId, editingAsset.id);
     setEditSaving(false);
-    setEditingAsset(null);
-    setConfirmArchive(false);
+    if (result.success) {
+      setEditingAsset(null);
+      setConfirmArchive(false);
+      toast.success(`${archivedName} archived`);
+    } else {
+      toast.error(result.error || 'Could not archive this asset. Please try again.');
+    }
   };
 
   if (isLoading) {
@@ -113,7 +128,7 @@ function AssetsPage() {
         action={
           <Button
             onClick={() => setModalOpen(true)}
-            className="bg-slate-700 hover:bg-slate-800 text-white px-10 py-5 rounded-2xl font-bold text-[14px] shadow-lg h-auto gap-3"
+            className="bg-[var(--royal)] hover:bg-[var(--royal-blue)] text-white px-10 py-5 rounded-2xl font-bold text-[14px] shadow-lg h-auto gap-3"
           >
             <svg viewBox="0 0 24 24" className="w-5 h-5" fill="none" stroke="currentColor" strokeWidth="2.5"><path d="M12 5v14M5 12h14"/></svg>
             Add Asset
@@ -122,27 +137,27 @@ function AssetsPage() {
       />
 
       {/* -- Asset Table -- */}
-      <div className="bg-white rounded-[2.5rem] border border-slate-100 overflow-hidden overflow-x-auto shadow-sm">
+      <div className="bg-white rounded-[2.5rem] border border-neutral-border overflow-hidden overflow-x-auto shadow-sm">
         <Table>
           <TableHeader>
-            <TableRow className="bg-slate-50 border-b border-slate-100 hover:bg-slate-50">
-              <TableHead className="px-10 py-6 text-[11px] uppercase tracking-widest font-bold text-slate-400">Asset Name</TableHead>
-              <TableHead className="px-10 py-6 text-[11px] uppercase tracking-widest font-bold text-slate-400">Category</TableHead>
-              <TableHead className="px-10 py-6 text-[11px] uppercase tracking-widest font-bold text-slate-400">Estimated Value</TableHead>
-              <TableHead className="px-10 py-6 text-[11px] uppercase tracking-widest font-bold text-slate-400 text-center">Status</TableHead>
-              <TableHead className="px-10 py-6 text-[11px] uppercase tracking-widest font-bold text-slate-400 text-right">Actions</TableHead>
+            <TableRow className="bg-neutral-faint border-b border-neutral-border hover:bg-neutral-faint">
+              <TableHead className="px-10 py-6 text-[11px] uppercase tracking-widest font-bold text-[var(--royal)]/40">Asset Name</TableHead>
+              <TableHead className="px-10 py-6 text-[11px] uppercase tracking-widest font-bold text-[var(--royal)]/40">Category</TableHead>
+              <TableHead className="px-10 py-6 text-[11px] uppercase tracking-widest font-bold text-[var(--royal)]/40">Estimated Value</TableHead>
+              <TableHead className="px-10 py-6 text-[11px] uppercase tracking-widest font-bold text-[var(--royal)]/40 text-center">Status</TableHead>
+              <TableHead className="px-10 py-6 text-[11px] uppercase tracking-widest font-bold text-[var(--royal)]/40 text-right">Actions</TableHead>
             </TableRow>
           </TableHeader>
-          <TableBody className="text-[14px] font-medium text-slate-700">
+          <TableBody className="text-[14px] font-medium text-[var(--royal)]/70">
             {assets.map((a) => (
-              <TableRow key={a.id} className="border-b border-slate-50 hover:bg-slate-50 transition-all group">
-                <TableCell className="px-10 py-7 font-bold text-slate-900 text-[15px]">{a.name}</TableCell>
+              <TableRow key={a.id} className="border-b border-neutral-faint hover:bg-neutral-faint transition-all group">
+                <TableCell className="px-10 py-7 font-bold text-[var(--royal)] text-[15px]">{a.name}</TableCell>
                 <TableCell className="px-10 py-7">
-                  <Badge variant="secondary" className="px-4 py-1.5 bg-slate-100 text-slate-700 font-bold text-[11px] uppercase tracking-widest rounded-lg border border-slate-100">
+                  <Badge variant="secondary" className="px-4 py-1.5 bg-neutral-faint text-[var(--royal)]/70 font-bold text-[11px] uppercase tracking-widest rounded-lg border border-neutral-border">
                     {a.category}
                   </Badge>
                 </TableCell>
-                <TableCell className="px-10 py-7 font-bold text-slate-900 text-lg tabular-nums">{a.estimatedValue ? `$${a.estimatedValue.toLocaleString()}` : '---'}</TableCell>
+                <TableCell className="px-10 py-7 font-bold text-[var(--royal)] text-lg tabular-nums">{a.estimatedValue ? `$${a.estimatedValue.toLocaleString()}` : '---'}</TableCell>
                 <TableCell className="px-10 py-7 text-center">
                   <Badge
                     variant={a.status === 'active' ? 'default' : 'secondary'}
@@ -159,7 +174,7 @@ function AssetsPage() {
                   </Badge>
                 </TableCell>
                 <TableCell className="px-10 py-7 text-right">
-                  <Button variant="outline" onClick={() => setEditingAsset(a)} className="text-[var(--royal)] font-bold text-[12px] bg-slate-50 hover:bg-[var(--royal)] hover:text-white px-5 py-2.5 rounded-xl border border-slate-100 h-auto">
+                  <Button variant="outline" onClick={() => setEditingAsset(a)} className="text-[var(--royal)] font-bold text-[12px] bg-neutral-faint hover:bg-[var(--royal)] hover:text-white px-5 py-2.5 rounded-xl border border-neutral-border h-auto">
                     View Details
                   </Button>
                 </TableCell>
@@ -167,7 +182,7 @@ function AssetsPage() {
             ))}
             {assets.length === 0 && (
               <TableRow>
-                <TableCell colSpan={5} className="px-10 py-32 text-center text-slate-300 font-medium text-sm">No assets have been added to this estate yet.</TableCell>
+                <TableCell colSpan={5} className="px-10 py-32 text-center text-[var(--royal)]/30 font-medium text-sm">No assets have been added to this estate yet.</TableCell>
               </TableRow>
             )}
           </TableBody>
@@ -179,10 +194,10 @@ function AssetsPage() {
 
       {/* -- Add Asset Dialog -- */}
       <Dialog open={modalOpen} onOpenChange={setModalOpen}>
-        <DialogContent className="bg-white rounded-[3rem] p-16 max-w-xl border border-slate-100 shadow-2xl">
+        <DialogContent className="bg-white rounded-[3rem] p-16 max-w-xl border border-neutral-border shadow-2xl">
           <DialogHeader className="space-y-3 mb-12">
-            <DialogTitle className="text-3xl font-bold text-slate-900 tracking-tight">Add New Asset</DialogTitle>
-            <DialogDescription className="text-slate-500 font-medium text-sm">
+            <DialogTitle className="text-3xl font-bold text-[var(--royal)] tracking-tight">Add New Asset</DialogTitle>
+            <DialogDescription className="text-[var(--royal)]/60 font-medium text-sm">
               Enter the details for a new asset entry in your estate ledger.
             </DialogDescription>
           </DialogHeader>
@@ -196,19 +211,19 @@ function AssetsPage() {
             });
           }} className="space-y-10">
             <div className="space-y-3">
-              <Label htmlFor="asset-name" className="text-[11px] font-bold text-slate-400 uppercase tracking-widest pl-1">Asset Name</Label>
+              <Label htmlFor="asset-name" className="text-[11px] font-bold text-[var(--royal)]/40 uppercase tracking-widest pl-1">Asset Name</Label>
               <Input
                 id="asset-name"
                 name="name"
                 required
-                className="w-full px-8 py-5 rounded-2xl border border-slate-100 bg-slate-50/50 focus:bg-white focus:border-[var(--royal)] focus:ring-8 focus:ring-[var(--royal)]/5 outline-none font-bold text-slate-900 placeholder:text-slate-300 text-lg h-auto"
+                className="w-full px-8 py-5 rounded-2xl border border-neutral-border bg-neutral-faint/50 focus:bg-white focus:border-[var(--royal)] focus:ring-8 focus:ring-[var(--royal)]/5 outline-none font-bold text-[var(--royal)] placeholder:text-[var(--royal)]/30 text-lg h-auto"
                 placeholder="e.g. Chase Savings Account"
               />
             </div>
             <div className="space-y-3">
-              <Label className="text-[11px] font-bold text-slate-400 uppercase tracking-widest pl-1">Asset Category</Label>
+              <Label className="text-[11px] font-bold text-[var(--royal)]/40 uppercase tracking-widest pl-1">Asset Category</Label>
               <Select value={assetCategory} onValueChange={setAssetCategory}>
-                <SelectTrigger className="w-full px-8 py-5 rounded-2xl border border-slate-100 bg-slate-50/50 focus:bg-white focus:border-[var(--royal)] font-bold text-slate-900 text-lg h-auto">
+                <SelectTrigger className="w-full px-8 py-5 rounded-2xl border border-neutral-border bg-neutral-faint/50 focus:bg-white focus:border-[var(--royal)] font-bold text-[var(--royal)] text-lg h-auto">
                   <SelectValue placeholder="Select a category" />
                 </SelectTrigger>
                 <SelectContent>
@@ -224,12 +239,12 @@ function AssetsPage() {
               </Select>
             </div>
             <div className="space-y-3">
-              <Label htmlFor="asset-value" className="text-[11px] font-bold text-slate-400 uppercase tracking-widest pl-1">Estimated Value</Label>
+              <Label htmlFor="asset-value" className="text-[11px] font-bold text-[var(--royal)]/40 uppercase tracking-widest pl-1">Estimated Value</Label>
               <Input
                 id="asset-value"
                 name="value"
                 required
-                className="w-full px-8 py-5 rounded-2xl border border-slate-100 bg-slate-50/50 focus:bg-white focus:border-[var(--royal)] focus:ring-8 focus:ring-[var(--royal)]/5 outline-none font-bold text-slate-900 placeholder:text-slate-300 text-lg h-auto"
+                className="w-full px-8 py-5 rounded-2xl border border-neutral-border bg-neutral-faint/50 focus:bg-white focus:border-[var(--royal)] focus:ring-8 focus:ring-[var(--royal)]/5 outline-none font-bold text-[var(--royal)] placeholder:text-[var(--royal)]/30 text-lg h-auto"
                 placeholder="e.g. $125,000"
               />
             </div>
@@ -238,7 +253,7 @@ function AssetsPage() {
                 type="button"
                 variant="ghost"
                 onClick={() => setModalOpen(false)}
-                className="flex-1 py-5 rounded-2xl border border-slate-100 font-bold text-slate-400 text-sm hover:bg-slate-50 h-auto"
+                className="flex-1 py-5 rounded-2xl border border-neutral-border font-bold text-[var(--royal)]/40 text-sm hover:bg-neutral-faint h-auto"
               >
                 Cancel
               </Button>
@@ -256,10 +271,10 @@ function AssetsPage() {
 
       {/* -- Edit Asset Dialog -- */}
       <Dialog open={editingAsset !== null} onOpenChange={(open) => { if (!open) { setEditingAsset(null); setConfirmArchive(false); } }}>
-        <DialogContent className="bg-white rounded-[3rem] p-16 max-w-xl border border-slate-100 shadow-2xl">
+        <DialogContent className="bg-white rounded-[3rem] p-16 max-w-xl border border-neutral-border shadow-2xl">
           <DialogHeader className="space-y-3 mb-12">
-            <DialogTitle className="text-3xl font-bold text-slate-900 tracking-tight font-[family-name:var(--font-cinzel)]">Edit Asset</DialogTitle>
-            <DialogDescription className="text-slate-500 font-medium text-sm">
+            <DialogTitle className="text-3xl font-bold text-[var(--royal)] tracking-tight font-[family-name:var(--font-cinzel)]">Edit Asset</DialogTitle>
+            <DialogDescription className="text-[var(--royal)]/60 font-medium text-sm">
               Update the details for this asset or archive it from your estate ledger.
             </DialogDescription>
           </DialogHeader>
@@ -275,22 +290,22 @@ function AssetsPage() {
               });
             }} className="space-y-10">
               <div className="space-y-3">
-                <Label htmlFor="edit-asset-name" className="text-[11px] font-bold text-slate-400 uppercase tracking-widest pl-1">Asset Name</Label>
+                <Label htmlFor="edit-asset-name" className="text-[11px] font-bold text-[var(--royal)]/40 uppercase tracking-widest pl-1">Asset Name</Label>
                 <Input
                   id="edit-asset-name"
                   name="edit-name"
                   required
                   defaultValue={editingAsset.name}
-                  className="w-full px-8 py-5 rounded-2xl border border-slate-100 bg-slate-50/50 focus:bg-white focus:border-[var(--royal)] focus:ring-8 focus:ring-[var(--royal)]/5 outline-none font-bold text-slate-900 placeholder:text-slate-300 text-lg h-auto"
+                  className="w-full px-8 py-5 rounded-2xl border border-neutral-border bg-neutral-faint/50 focus:bg-white focus:border-[var(--royal)] focus:ring-8 focus:ring-[var(--royal)]/5 outline-none font-bold text-[var(--royal)] placeholder:text-[var(--royal)]/30 text-lg h-auto"
                 />
               </div>
               <div className="space-y-3">
-                <Label htmlFor="edit-asset-category" className="text-[11px] font-bold text-slate-400 uppercase tracking-widest pl-1">Asset Category</Label>
+                <Label htmlFor="edit-asset-category" className="text-[11px] font-bold text-[var(--royal)]/40 uppercase tracking-widest pl-1">Asset Category</Label>
                 <select
                   id="edit-asset-category"
                   name="edit-category"
                   defaultValue={editingAsset.category}
-                  className="w-full px-8 py-5 rounded-2xl border border-slate-100 bg-slate-50/50 focus:bg-white focus:border-[var(--royal)] font-bold text-slate-900 text-lg h-auto appearance-none"
+                  className="w-full px-8 py-5 rounded-2xl border border-neutral-border bg-neutral-faint/50 focus:bg-white focus:border-[var(--royal)] font-bold text-[var(--royal)] text-lg h-auto appearance-none"
                 >
                   <option value="Real Estate">Real Estate</option>
                   <option value="Cash">Cash / Savings</option>
@@ -303,24 +318,24 @@ function AssetsPage() {
                 </select>
               </div>
               <div className="space-y-3">
-                <Label htmlFor="edit-asset-value" className="text-[11px] font-bold text-slate-400 uppercase tracking-widest pl-1">Estimated Value</Label>
+                <Label htmlFor="edit-asset-value" className="text-[11px] font-bold text-[var(--royal)]/40 uppercase tracking-widest pl-1">Estimated Value</Label>
                 <Input
                   id="edit-asset-value"
                   name="edit-value"
                   required
                   defaultValue={editingAsset.estimatedValue ? `$${editingAsset.estimatedValue.toLocaleString()}` : ''}
-                  className="w-full px-8 py-5 rounded-2xl border border-slate-100 bg-slate-50/50 focus:bg-white focus:border-[var(--royal)] focus:ring-8 focus:ring-[var(--royal)]/5 outline-none font-bold text-slate-900 placeholder:text-slate-300 text-lg h-auto"
+                  className="w-full px-8 py-5 rounded-2xl border border-neutral-border bg-neutral-faint/50 focus:bg-white focus:border-[var(--royal)] focus:ring-8 focus:ring-[var(--royal)]/5 outline-none font-bold text-[var(--royal)] placeholder:text-[var(--royal)]/30 text-lg h-auto"
                   placeholder="e.g. $125,000"
                 />
               </div>
               <div className="space-y-3">
-                <Label htmlFor="edit-asset-description" className="text-[11px] font-bold text-slate-400 uppercase tracking-widest pl-1">Description</Label>
+                <Label htmlFor="edit-asset-description" className="text-[11px] font-bold text-[var(--royal)]/40 uppercase tracking-widest pl-1">Description</Label>
                 <Textarea
                   id="edit-asset-description"
                   name="edit-description"
                   defaultValue={editingAsset.description || ''}
                   rows={3}
-                  className="w-full px-8 py-5 rounded-2xl border border-slate-100 bg-slate-50/50 focus:bg-white focus:border-[var(--royal)] focus:ring-8 focus:ring-[var(--royal)]/5 outline-none font-bold text-slate-900 placeholder:text-slate-300 text-base resize-none"
+                  className="w-full px-8 py-5 rounded-2xl border border-neutral-border bg-neutral-faint/50 focus:bg-white focus:border-[var(--royal)] focus:ring-8 focus:ring-[var(--royal)]/5 outline-none font-bold text-[var(--royal)] placeholder:text-[var(--royal)]/30 text-base resize-none"
                   placeholder="Optional notes about this asset"
                 />
               </div>
@@ -350,7 +365,7 @@ function AssetsPage() {
                   type="button"
                   variant="ghost"
                   onClick={() => { setEditingAsset(null); setConfirmArchive(false); }}
-                  className="py-5 rounded-2xl border border-slate-100 font-bold text-slate-400 text-sm hover:bg-slate-50 h-auto px-6"
+                  className="py-5 rounded-2xl border border-neutral-border font-bold text-[var(--royal)]/40 text-sm hover:bg-neutral-faint h-auto px-6"
                 >
                   Cancel
                 </Button>
@@ -405,8 +420,8 @@ function ProbateAvoidanceSection({ estateId, assets }: { estateId: string; asset
     <div className="mt-8 space-y-4">
       <div className="flex items-center justify-between">
         <div>
-          <h2 className="text-lg font-bold text-slate-900">Probate Avoidance</h2>
-          <p className="text-sm text-slate-900/60">
+          <h2 className="text-lg font-bold text-[var(--royal)]">Probate Avoidance</h2>
+          <p className="text-sm text-[var(--royal)]/60">
             {completedCount} of {assetRecommendations.length} assets have beneficiary designations &middot; Assets with designations skip probate
           </p>
         </div>
@@ -421,15 +436,15 @@ function ProbateAvoidanceSection({ estateId, assets }: { estateId: string; asset
             <div
               key={asset.id}
               className={`flex items-center justify-between p-4 rounded-xl border transition-colors ${
-                isComplete ? 'bg-green-50/50 border-green-200/50' : 'bg-white border-slate-100 hover:border-[var(--gold)]/20'
+                isComplete ? 'bg-green-50/50 border-green-200/50' : 'bg-white border-neutral-border hover:border-[var(--gold)]/20'
               }`}
             >
               <div className="flex-1">
                 <div className="flex items-center gap-2">
-                  <span className={`font-medium text-sm ${isComplete ? 'text-green-700' : 'text-slate-900'}`}>
+                  <span className={`font-medium text-sm ${isComplete ? 'text-green-700' : 'text-[var(--royal)]'}`}>
                     {asset.name}
                   </span>
-                  <span className="text-[10px] px-1.5 py-0.5 rounded bg-slate-900/5 text-slate-900/50">
+                  <span className="text-[10px] px-1.5 py-0.5 rounded bg-[var(--royal-subtle)] text-[var(--royal)]/50">
                     {asset.category}
                   </span>
                   {isComplete && (
@@ -438,7 +453,7 @@ function ProbateAvoidanceSection({ estateId, assets }: { estateId: string; asset
                     </span>
                   )}
                 </div>
-                <p className="text-xs text-slate-900/50 mt-0.5">
+                <p className="text-xs text-[var(--royal)]/50 mt-0.5">
                   Recommended: <span className="font-medium">{tool.name}</span>
                   {tool.formNumber && ` (${tool.formNumber})`}
                 </p>
@@ -494,7 +509,7 @@ function ProbateAvoidanceSection({ estateId, assets }: { estateId: string; asset
         })}
       </div>
 
-      <p className="text-[10px] text-slate-900/40 text-center">
+      <p className="text-[10px] text-[var(--royal)]/40 text-center">
         Assets with beneficiary designations transfer directly to named beneficiaries without probate.
       </p>
     </div>
diff --git a/web/src/routes/estates.$estateId.beneficiaries.tsx b/web/src/routes/estates.$estateId.beneficiaries.tsx
index 73b85d8..bd56f1c 100644
--- a/web/src/routes/estates.$estateId.beneficiaries.tsx
+++ b/web/src/routes/estates.$estateId.beneficiaries.tsx
@@ -102,7 +102,7 @@ function BeneficiariesPage() {
       <div className="flex items-center justify-center h-[50vh]">
         <div className="flex flex-col items-center gap-4">
           <div className="w-10 h-10 border-2 border-[var(--royal)]/20 border-t-[var(--royal)] rounded-full animate-spin" />
-          <span className="text-[11px] font-semibold text-slate-500 uppercase tracking-[0.2em]">Loading family members...</span>
+          <span className="text-[11px] font-semibold text-[var(--royal)]/60 uppercase tracking-[0.2em]">Loading family members...</span>
         </div>
       </div>
     );
@@ -246,11 +246,11 @@ function AddBeneficiaryDialog({
 }) {
   return (
     <Dialog open={open} onOpenChange={onOpenChange}>
-      <DialogContent className="rounded-[3rem] p-16 max-w-xl sm:max-w-xl border border-slate-100 shadow-2xl overflow-hidden">
+      <DialogContent className="rounded-[3rem] p-16 max-w-xl sm:max-w-xl border border-neutral-border shadow-2xl overflow-hidden">
         <div className="absolute top-0 left-0 w-full h-1.5 bg-[var(--royal)]" />
         <DialogHeader className="gap-3 mb-4">
-          <DialogTitle className="text-3xl font-[family-name:var(--font-cinzel)] font-bold text-slate-900">Add family member</DialogTitle>
-          <DialogDescription className="text-lg text-slate-500 font-medium">Enter the details for the person you want to add to your estate plan.</DialogDescription>
+          <DialogTitle className="text-3xl font-[family-name:var(--font-cinzel)] font-bold text-[var(--royal)]">Add family member</DialogTitle>
+          <DialogDescription className="text-lg text-[var(--royal)]/60 font-medium">Enter the details for the person you want to add to your estate plan.</DialogDescription>
         </DialogHeader>
 
         <form onSubmit={(e) => {
@@ -265,12 +265,12 @@ function AddBeneficiaryDialog({
           });
         }} className="space-y-8">
           <div className="space-y-2">
-            <Label htmlFor="name" className="text-[11px] font-bold text-slate-400 uppercase tracking-widest pl-2">Full Name</Label>
-            <Input name="name" id="name" required className="px-6 py-4 h-auto rounded-2xl border-slate-200 bg-slate-50 focus-visible:bg-white focus-visible:border-[var(--royal)] focus-visible:ring-[var(--royal)]/5 font-semibold text-slate-900 text-base" placeholder="Jane Doe" />
+            <Label htmlFor="name" className="text-[11px] font-bold text-[var(--royal)]/40 uppercase tracking-widest pl-2">Full Name</Label>
+            <Input name="name" id="name" required className="px-6 py-4 h-auto rounded-2xl border-neutral-border bg-neutral-faint focus-visible:bg-white focus-visible:border-[var(--royal)] focus-visible:ring-[var(--royal)]/5 font-semibold text-[var(--royal)] text-base" placeholder="Jane Doe" />
           </div>
           <div className="grid grid-cols-1 sm:grid-cols-2 gap-4 sm:gap-6">
             <div className="space-y-2">
-              <Label htmlFor="relation" className="text-[11px] font-bold text-slate-400 uppercase tracking-widest pl-2">Relationship</Label>
+              <Label htmlFor="relation" className="text-[11px] font-bold text-[var(--royal)]/40 uppercase tracking-widest pl-2">Relationship</Label>
               <SelectWithOther
                 name="relation"
                 required
@@ -279,9 +279,9 @@ function AddBeneficiaryDialog({
               />
             </div>
             <div className="space-y-2">
-              <Label className="text-[11px] font-bold text-slate-400 uppercase tracking-widest pl-2">Their Role</Label>
+              <Label className="text-[11px] font-bold text-[var(--royal)]/40 uppercase tracking-widest pl-2">Their Role</Label>
               <Select value={roleValue} onValueChange={onRoleChange}>
-                <SelectTrigger className="w-full px-6 py-4 h-auto rounded-2xl border-slate-200 bg-slate-50 focus-visible:bg-white focus-visible:border-[var(--royal)] font-semibold text-slate-900 text-base">
+                <SelectTrigger className="w-full px-6 py-4 h-auto rounded-2xl border-neutral-border bg-neutral-faint focus-visible:bg-white focus-visible:border-[var(--royal)] font-semibold text-[var(--royal)] text-base">
                   <SelectValue placeholder="Select a role" />
                 </SelectTrigger>
                 <SelectContent>
@@ -294,22 +294,22 @@ function AddBeneficiaryDialog({
               </Select>
               {/* Role description */}
               <div className="flex items-start gap-2 pt-1 pl-2">
-                <svg viewBox="0 0 24 24" className="w-3.5 h-3.5 text-slate-500 shrink-0 mt-0.5" fill="none" stroke="currentColor" strokeWidth="2">
+                <svg viewBox="0 0 24 24" className="w-3.5 h-3.5 text-[var(--royal)]/60 shrink-0 mt-0.5" fill="none" stroke="currentColor" strokeWidth="2">
                   <circle cx="12" cy="12" r="10"/><line x1="12" y1="16" x2="12" y2="12"/><line x1="12" y1="8" x2="12.01" y2="8"/>
                 </svg>
-                <p className="text-[12px] italic text-slate-500 leading-relaxed">
+                <p className="text-[12px] italic text-[var(--royal)]/60 leading-relaxed">
                   {ROLE_DESCRIPTIONS[roleValue]}
                 </p>
               </div>
             </div>
           </div>
           <div className="space-y-2">
-            <Label htmlFor="email" className="text-[11px] font-bold text-slate-400 uppercase tracking-widest pl-2">Email Address</Label>
-            <Input name="email" id="email" required type="email" className="px-6 py-4 h-auto rounded-2xl border-slate-200 bg-slate-50 focus-visible:bg-white focus-visible:border-[var(--royal)] font-semibold text-slate-900 text-base" placeholder="jane@example.com" />
+            <Label htmlFor="email" className="text-[11px] font-bold text-[var(--royal)]/40 uppercase tracking-widest pl-2">Email Address</Label>
+            <Input name="email" id="email" required type="email" className="px-6 py-4 h-auto rounded-2xl border-neutral-border bg-neutral-faint focus-visible:bg-white focus-visible:border-[var(--royal)] font-semibold text-[var(--royal)] text-base" placeholder="jane@example.com" />
           </div>
           <div className="space-y-2">
-            <Label htmlFor="phone" className="text-[11px] font-bold text-slate-400 uppercase tracking-widest pl-2">Phone (optional — for SMS notification)</Label>
-            <Input name="phone" id="phone" type="tel" className="px-6 py-4 h-auto rounded-2xl border-slate-200 bg-slate-50 focus-visible:bg-white focus-visible:border-[var(--royal)] font-semibold text-slate-900 text-base" placeholder="+1 (555) 123-4567" />
+            <Label htmlFor="phone" className="text-[11px] font-bold text-[var(--royal)]/40 uppercase tracking-widest pl-2">Phone (optional — for SMS notification)</Label>
+            <Input name="phone" id="phone" type="tel" className="px-6 py-4 h-auto rounded-2xl border-neutral-border bg-neutral-faint focus-visible:bg-white focus-visible:border-[var(--royal)] font-semibold text-[var(--royal)] text-base" placeholder="+1 (555) 123-4567" />
           </div>
 
           {feedback && (
@@ -319,7 +319,7 @@ function AddBeneficiaryDialog({
           )}
 
           <DialogFooter className="flex gap-4 pt-4 mx-0 mb-0 border-0 bg-transparent p-0 flex-row">
-            <Button type="button" variant="outline" onClick={() => onOpenChange(false)} className="flex-1 py-4 h-auto rounded-2xl border-slate-200 font-bold text-slate-500 hover:bg-slate-50 active:scale-95">
+            <Button type="button" variant="outline" onClick={() => onOpenChange(false)} className="flex-1 py-4 h-auto rounded-2xl border-neutral-border font-bold text-[var(--royal)]/60 hover:bg-neutral-faint active:scale-95">
               Cancel
             </Button>
             <Button type="submit" disabled={saving} className="flex-1 py-4 h-auto rounded-2xl bg-[var(--royal)] hover:bg-[var(--sapphire)] text-white font-bold shadow-lg active:scale-95">
@@ -398,25 +398,25 @@ function EditBeneficiaryDialog({
 
   return (
     <Dialog open={open} onOpenChange={(v) => { onOpenChange(v); if (!v) { setConfirmRemove(false); setFeedback(null); } }}>
-      <DialogContent className="rounded-[3rem] p-16 max-w-xl sm:max-w-xl border border-slate-100 shadow-2xl overflow-hidden">
+      <DialogContent className="rounded-[3rem] p-16 max-w-xl sm:max-w-xl border border-neutral-border shadow-2xl overflow-hidden">
         <div className="absolute top-0 left-0 w-full h-1.5 bg-[var(--gold)]" />
         <DialogHeader className="gap-3 mb-4">
-          <DialogTitle className="text-3xl font-[family-name:var(--font-cinzel)] font-bold text-slate-900">Edit Beneficiary</DialogTitle>
-          <DialogDescription className="text-lg text-slate-500 font-medium">Update details and share allocation for {heir.fullName}.</DialogDescription>
+          <DialogTitle className="text-3xl font-[family-name:var(--font-cinzel)] font-bold text-[var(--royal)]">Edit Beneficiary</DialogTitle>
+          <DialogDescription className="text-lg text-[var(--royal)]/60 font-medium">Update details and share allocation for {heir.fullName}.</DialogDescription>
         </DialogHeader>
 
         <form onSubmit={handleSave} className="space-y-8">
           <div className="space-y-2">
-            <Label htmlFor="edit-fullName" className="text-[11px] font-bold text-slate-400 uppercase tracking-widest pl-2">Full Name</Label>
-            <Input name="fullName" id="edit-fullName" defaultValue={heir.fullName} required className="px-6 py-4 h-auto rounded-2xl border-slate-200 bg-slate-50 focus-visible:bg-white focus-visible:border-[var(--royal)] focus-visible:ring-[var(--royal)]/5 font-semibold text-slate-900 text-base" />
+            <Label htmlFor="edit-fullName" className="text-[11px] font-bold text-[var(--royal)]/40 uppercase tracking-widest pl-2">Full Name</Label>
+            <Input name="fullName" id="edit-fullName" defaultValue={heir.fullName} required className="px-6 py-4 h-auto rounded-2xl border-neutral-border bg-neutral-faint focus-visible:bg-white focus-visible:border-[var(--royal)] focus-visible:ring-[var(--royal)]/5 font-semibold text-[var(--royal)] text-base" />
           </div>
           <div className="grid grid-cols-1 sm:grid-cols-2 gap-4 sm:gap-6">
             <div className="space-y-2">
-              <Label htmlFor="edit-relationship" className="text-[11px] font-bold text-slate-400 uppercase tracking-widest pl-2">Relationship</Label>
-              <Input name="relationship" id="edit-relationship" defaultValue={heir.relationship ?? ''} required className="px-6 py-4 h-auto rounded-2xl border-slate-200 bg-slate-50 focus-visible:bg-white focus-visible:border-[var(--royal)] font-semibold text-slate-900 text-base" />
+              <Label htmlFor="edit-relationship" className="text-[11px] font-bold text-[var(--royal)]/40 uppercase tracking-widest pl-2">Relationship</Label>
+              <Input name="relationship" id="edit-relationship" defaultValue={heir.relationship ?? ''} required className="px-6 py-4 h-auto rounded-2xl border-neutral-border bg-neutral-faint focus-visible:bg-white focus-visible:border-[var(--royal)] font-semibold text-[var(--royal)] text-base" />
             </div>
             <div className="space-y-2">
-              <Label htmlFor="edit-share" className="text-[11px] font-bold text-slate-400 uppercase tracking-widest pl-2">Share Percentage</Label>
+              <Label htmlFor="edit-share" className="text-[11px] font-bold text-[var(--royal)]/40 uppercase tracking-widest pl-2">Share Percentage</Label>
               <div className="relative">
                 <Input
                   id="edit-share"
@@ -426,16 +426,16 @@ function EditBeneficiaryDialog({
                   step="1"
                   value={shareValue}
                   onChange={(e) => setShareValue(e.target.value)}
-                  className="px-6 py-4 pr-12 h-auto rounded-2xl border-slate-200 bg-slate-50 focus-visible:bg-white focus-visible:border-[var(--royal)] font-semibold text-slate-900 text-base"
+                  className="px-6 py-4 pr-12 h-auto rounded-2xl border-neutral-border bg-neutral-faint focus-visible:bg-white focus-visible:border-[var(--royal)] font-semibold text-[var(--royal)] text-base"
                   placeholder="0"
                 />
-                <span className="absolute right-5 top-1/2 -translate-y-1/2 text-slate-500 font-bold text-base">%</span>
+                <span className="absolute right-5 top-1/2 -translate-y-1/2 text-[var(--royal)]/60 font-bold text-base">%</span>
               </div>
             </div>
           </div>
           <div className="space-y-2">
-            <Label htmlFor="edit-email" className="text-[11px] font-bold text-slate-400 uppercase tracking-widest pl-2">Email Address</Label>
-            <Input name="email" id="edit-email" defaultValue={heir.email ?? ''} type="email" className="px-6 py-4 h-auto rounded-2xl border-slate-200 bg-slate-50 focus-visible:bg-white focus-visible:border-[var(--royal)] font-semibold text-slate-900 text-base" />
+            <Label htmlFor="edit-email" className="text-[11px] font-bold text-[var(--royal)]/40 uppercase tracking-widest pl-2">Email Address</Label>
+            <Input name="email" id="edit-email" defaultValue={heir.email ?? ''} type="email" className="px-6 py-4 h-auto rounded-2xl border-neutral-border bg-neutral-faint focus-visible:bg-white focus-visible:border-[var(--royal)] font-semibold text-[var(--royal)] text-base" />
           </div>
 
           {feedback && (
@@ -446,7 +446,7 @@ function EditBeneficiaryDialog({
 
           <DialogFooter className="flex flex-col gap-4 pt-4 mx-0 mb-0 border-0 bg-transparent p-0">
             <div className="flex gap-4 w-full">
-              <Button type="button" variant="outline" onClick={() => onOpenChange(false)} className="flex-1 py-4 h-auto rounded-2xl border-slate-200 font-bold text-slate-500 hover:bg-slate-50 active:scale-95">
+              <Button type="button" variant="outline" onClick={() => onOpenChange(false)} className="flex-1 py-4 h-auto rounded-2xl border-neutral-border font-bold text-[var(--royal)]/60 hover:bg-neutral-faint active:scale-95">
                 Cancel
               </Button>
               <Button type="submit" disabled={saving} className="flex-1 py-4 h-auto rounded-2xl bg-[var(--royal)] hover:bg-[var(--sapphire)] text-white font-bold shadow-lg active:scale-95">
@@ -474,7 +474,7 @@ function EditBeneficiaryDialog({
                   Are you sure? This will remove {heir.fullName} from your estate plan.
                 </p>
                 <div className="flex gap-3">
-                  <Button type="button" variant="outline" onClick={() => setConfirmRemove(false)} className="px-6 py-2 h-auto rounded-xl border-slate-200 font-bold text-slate-500 text-sm">
+                  <Button type="button" variant="outline" onClick={() => setConfirmRemove(false)} className="px-6 py-2 h-auto rounded-xl border-neutral-border font-bold text-[var(--royal)]/60 text-sm">
                     Keep
                   </Button>
                   <Button type="button" onClick={handleRemove} disabled={removing} className="px-6 py-2 h-auto rounded-xl bg-red-600 hover:bg-red-700 text-white font-bold text-sm">
@@ -499,13 +499,13 @@ function BeneficiaryCard({ heir, onEdit }: { heir: Heir; onEdit: () => void }) {
   const status = heirStatus === 'active' ? 'Verified' : 'Pending';
 
   return (
-    <Card className="rounded-[2.5rem] border-slate-100 shadow-sm hover:border-slate-200 hover:shadow-md transition-all group relative">
+    <Card className="rounded-[2.5rem] border-neutral-border shadow-sm hover:border-gold/40 hover:shadow-md transition-all group relative">
       <CardContent className="flex items-center gap-8 p-8">
         {/* Edit button -- visible on hover */}
         <button
           type="button"
           onClick={onEdit}
-          className="absolute top-6 right-6 w-9 h-9 rounded-xl bg-white border border-slate-100 flex items-center justify-center opacity-0 group-hover:opacity-100 transition-opacity hover:bg-slate-50 hover:border-[var(--royal)]/20 cursor-pointer"
+          className="absolute top-6 right-6 w-9 h-9 rounded-xl bg-white border border-neutral-border flex items-center justify-center opacity-0 group-hover:opacity-100 transition-opacity hover:bg-neutral-faint hover:border-[var(--royal)]/20 cursor-pointer"
           title="Edit beneficiary"
         >
           <svg viewBox="0 0 24 24" className="w-4 h-4 text-[var(--royal)]" fill="none" stroke="currentColor" strokeWidth="2">
@@ -515,13 +515,13 @@ function BeneficiaryCard({ heir, onEdit }: { heir: Heir; onEdit: () => void }) {
         </button>
 
         <Avatar className="w-16 h-16 rounded-2xl shrink-0 transition-all duration-500 group-hover:bg-[var(--royal)]">
-          <AvatarFallback className="rounded-2xl bg-slate-50 border border-slate-100 text-[var(--royal)] font-bold text-xl group-hover:bg-[var(--royal)] group-hover:text-white transition-all duration-500">
+          <AvatarFallback className="rounded-2xl bg-neutral-faint border border-neutral-border text-[var(--royal)] font-bold text-xl group-hover:bg-[var(--royal)] group-hover:text-white transition-all duration-500">
             {initials}
           </AvatarFallback>
         </Avatar>
         <div className="flex-1 min-w-0 space-y-3">
           <div className="flex justify-between items-start">
-            <h4 className="text-slate-900 font-bold text-xl truncate leading-tight transition-colors group-hover:text-[var(--royal)]">{name}</h4>
+            <h4 className="text-[var(--royal)] font-bold text-xl truncate leading-tight transition-colors group-hover:text-[var(--royal)]">{name}</h4>
           </div>
           <div className="flex items-center gap-3">
             <Badge
@@ -535,19 +535,19 @@ function BeneficiaryCard({ heir, onEdit }: { heir: Heir; onEdit: () => void }) {
               <div className={`w-1.5 h-1.5 rounded-full ${status === 'Verified' ? 'bg-green-500' : 'bg-amber-400 animate-pulse'}`} />
               {status}
             </Badge>
-            <span className="text-[13px] font-medium text-slate-500 truncate">{email || 'No email provided'}</span>
+            <span className="text-[13px] font-medium text-[var(--royal)]/60 truncate">{email || 'No email provided'}</span>
           </div>
-          <div className="flex items-center justify-between border-t border-slate-50 pt-4">
+          <div className="flex items-center justify-between border-t border-neutral-faint pt-4">
             <div className="flex flex-col">
-              <span className="text-[11px] font-bold text-slate-400 uppercase tracking-widest">Relationship</span>
-              <span className="text-[14px] font-semibold text-slate-900">{relation || '\u2014'}</span>
+              <span className="text-[11px] font-bold text-[var(--royal)]/40 uppercase tracking-widest">Relationship</span>
+              <span className="text-[14px] font-semibold text-[var(--royal)]">{relation || '\u2014'}</span>
             </div>
             <div className="flex flex-col items-end gap-1.5">
-              <span className="text-[11px] font-bold text-slate-400 uppercase tracking-widest">Their Share</span>
+              <span className="text-[11px] font-bold text-[var(--royal)]/40 uppercase tracking-widest">Their Share</span>
               {share != null ? (
                 <div className="flex items-center gap-2.5">
                   {/* Mini progress bar */}
-                  <div className="w-16 h-1.5 bg-slate-100 rounded-full overflow-hidden">
+                  <div className="w-16 h-1.5 bg-neutral-faint rounded-full overflow-hidden">
                     <div
                       className="h-full rounded-full transition-all duration-500"
                       style={{
diff --git a/web/src/routes/estates.$estateId.dashboard.lazy.tsx b/web/src/routes/estates.$estateId.dashboard.lazy.tsx
index cf8c8cf..166cec7 100644
--- a/web/src/routes/estates.$estateId.dashboard.lazy.tsx
+++ b/web/src/routes/estates.$estateId.dashboard.lazy.tsx
@@ -21,6 +21,7 @@ import {
 } from '../lib/firestore'
 import { orderBy, type Timestamp, doc, setDoc, serverTimestamp } from 'firebase/firestore'
 import { db } from '../lib/firebase'
+import { API_BASE } from '../lib/client'
 import { Card, CardContent } from '@/components/ui/card'
 import { Button } from '@/components/ui/button'
 import { Progress } from '@/components/ui/progress'
@@ -71,8 +72,6 @@ interface ShepherdScore {
   insight: string
 }
 
-const API_BASE = import.meta.env.VITE_API_URL || 'http://localhost:8080'
-
 // ─── Shepherd Persistence ────────────────────────────────────────────────────
 
 /** Fire-and-forget: save a chat message to Firestore for conversation memory */
@@ -112,7 +111,7 @@ interface TimelineEntry {
 function ShepherdTypingIndicator() {
   return (
     <div className="flex items-start gap-2 mb-3">
-      <div className="bg-slate-50 rounded-2xl rounded-tl-sm px-4 py-3 max-w-[85%]">
+      <div className="bg-neutral-faint rounded-2xl rounded-tl-sm px-4 py-3 max-w-[85%]">
         <div className="flex gap-1.5 items-center h-5">
           <span className="w-2 h-2 bg-[var(--gold)] rounded-full animate-bounce [animation-delay:0ms]" />
           <span className="w-2 h-2 bg-[var(--gold)] rounded-full animate-bounce [animation-delay:150ms]" />
@@ -329,7 +328,7 @@ function ShepherdChat({
                     'rounded-2xl px-4 py-2.5 max-w-[85%] text-sm leading-relaxed',
                     msg.role === 'user'
                       ? 'bg-[var(--royal)] text-white rounded-tr-sm'
-                      : 'bg-slate-50 text-slate-900 rounded-tl-sm border border-slate-100',
+                      : 'bg-neutral-faint text-[var(--royal)] rounded-tl-sm border border-neutral-border',
                   )}
                 >
                   {msg.content}
@@ -358,7 +357,7 @@ function ShepherdChat({
         </div>
 
         {/* Input area */}
-        <div className="border-t border-slate-200 px-4 py-3 bg-white flex-shrink-0">
+        <div className="border-t border-neutral-border px-4 py-3 bg-white flex-shrink-0">
           <div className="flex gap-2">
             <Input
               ref={inputRef}
@@ -809,8 +808,8 @@ function DashboardIndex() {
 
       {/* ── 1. Shepherd Companion Card ── */}
       <Card className={cn(
-        'rounded-3xl border-slate-100 shadow-sm overflow-hidden',
-        totalEntryCount === 0 && 'bg-gradient-to-br from-slate-50 to-slate-100',
+        'rounded-3xl border-neutral-border shadow-sm overflow-hidden',
+        totalEntryCount === 0 && 'bg-gradient-to-br from-neutral-faint to-neutral-faint',
       )}>
         <CardContent className={cn('px-8 py-8', totalEntryCount === 0 && 'py-16')}>
           <div className="flex items-start gap-5">
@@ -822,10 +821,10 @@ function DashboardIndex() {
               </svg>
             </div>
             <div className="flex-1 min-w-0">
-              <h3 className="text-lg font-bold text-slate-900 mb-2 font-[family-name:var(--font-cinzel)]">
+              <h3 className="text-lg font-bold text-[var(--royal)] mb-2 font-[family-name:var(--font-cinzel)]">
                 The Shepherd
               </h3>
-              <p className="text-slate-500 text-base leading-relaxed mb-5">
+              <p className="text-[var(--royal)]/60 text-base leading-relaxed mb-5">
                 {shepherdPrompt}
               </p>
               <div className="flex flex-wrap gap-3">
@@ -874,10 +873,10 @@ function DashboardIndex() {
               <line x1="8" y1="23" x2="16" y2="23" />
             </svg>
           </div>
-          <h3 className="text-xl font-bold text-slate-900/40 font-[family-name:var(--font-cinzel)]">
+          <h3 className="text-xl font-bold text-[var(--royal)]/40 font-[family-name:var(--font-cinzel)]">
             Your Legacy Timeline
           </h3>
-          <p className="text-slate-500 max-w-md mx-auto leading-relaxed">
+          <p className="text-[var(--royal)]/60 max-w-md mx-auto leading-relaxed">
             Every voice memo, photo, document, and heirloom you add will appear here — a living portrait of the life you're preserving.
           </p>
         </div>
@@ -885,7 +884,7 @@ function DashboardIndex() {
         <div className="space-y-2">
           <div className="flex items-center gap-3 text-[11px] font-bold text-[var(--royal)]/30 uppercase tracking-[0.3em] mb-6">
             <span>Legacy Timeline</span>
-            <Badge variant="secondary" className="text-[10px] font-bold text-slate-400 bg-slate-50 px-3 py-1 rounded-full border border-slate-100">
+            <Badge variant="secondary" className="text-[10px] font-bold text-[var(--royal)]/40 bg-neutral-faint px-3 py-1 rounded-full border border-neutral-border">
               {totalEntryCount} {totalEntryCount === 1 ? 'moment' : 'moments'}
             </Badge>
           </div>
@@ -901,7 +900,7 @@ function DashboardIndex() {
                   <div className="w-12 flex justify-center relative z-10">
                     <div className="w-3 h-3 rounded-full bg-[var(--royal)]/20 border-2 border-white" />
                   </div>
-                  <span className="text-sm font-bold text-slate-900 font-[family-name:var(--font-cinzel)] tracking-wide">
+                  <span className="text-sm font-bold text-[var(--royal)] font-[family-name:var(--font-cinzel)] tracking-wide">
                     {group.label}
                   </span>
                 </div>
@@ -922,22 +921,22 @@ function DashboardIndex() {
                       <Link
                         // @ts-expect-error — dynamic route from timeline type
                         to={`/estates/${routeId}/${TIMELINE_TYPE_ROUTES[entry.type]}`}
-                        className="flex-1 flex items-center gap-3 px-4 py-3 rounded-xl hover:bg-slate-50 transition-colors cursor-pointer min-w-0 no-underline"
+                        className="flex-1 flex items-center gap-3 px-4 py-3 rounded-xl hover:bg-neutral-faint transition-colors cursor-pointer min-w-0 no-underline"
                       >
                         <div className="w-8 h-8 rounded-lg bg-[var(--royal)]/5 flex items-center justify-center flex-shrink-0 text-[var(--royal)]/50 group-hover/entry:text-[var(--royal)] group-hover/entry:bg-[var(--royal)]/10 transition-colors">
                           <TimelineIcon type={entry.type} />
                         </div>
                         <div className="flex-1 min-w-0">
-                          <p className="text-sm font-medium text-slate-900 truncate">
+                          <p className="text-sm font-medium text-[var(--royal)] truncate">
                             {entry.title}
                           </p>
                           {entry.subtitle && (
-                            <p className="text-xs text-slate-500 truncate mt-0.5">
+                            <p className="text-xs text-[var(--royal)]/60 truncate mt-0.5">
                               {entry.subtitle}
                             </p>
                           )}
                         </div>
-                        <span className="text-[11px] text-slate-300 flex-shrink-0 tabular-nums">
+                        <span className="text-[11px] text-[var(--royal)]/30 flex-shrink-0 tabular-nums">
                           {entry.date.toLocaleTimeString('en-US', { hour: 'numeric', minute: '2-digit' })}
                         </span>
                       </Link>
@@ -1020,7 +1019,7 @@ function DashboardIndex() {
 
       {/* ── 5. Estate Health Check (Collapsible) ── */}
       <Collapsible open={checklistOpen} onOpenChange={setChecklistOpen}>
-        <Card className="rounded-2xl border-slate-100 shadow-sm">
+        <Card className="rounded-2xl border-neutral-border shadow-sm">
           <CollapsibleTrigger asChild>
             <button className="w-full flex items-center justify-between px-8 py-5 text-left group">
               <div className="flex items-center gap-4">
@@ -1031,8 +1030,8 @@ function DashboardIndex() {
                   </svg>
                 </div>
                 <div>
-                  <span className="text-base font-bold text-slate-900">Estate Health Check</span>
-                  <span className="text-sm text-slate-500 ml-3">
+                  <span className="text-base font-bold text-[var(--royal)]">Estate Health Check</span>
+                  <span className="text-sm text-[var(--royal)]/60 ml-3">
                     {scoreLoading ? '...' : `${percent}% complete`}
                     {score && ` — ${score.completedSteps} of ${score.totalSteps} steps`}
                   </span>
@@ -1041,7 +1040,7 @@ function DashboardIndex() {
               <svg
                 viewBox="0 0 24 24"
                 className={cn(
-                  'w-5 h-5 text-slate-300 transition-transform',
+                  'w-5 h-5 text-[var(--royal)]/30 transition-transform',
                   checklistOpen && 'rotate-180',
                 )}
                 fill="none"
@@ -1056,7 +1055,7 @@ function DashboardIndex() {
             <div className="px-8 pb-8">
               <Progress
                 value={percent}
-                className="w-full h-2 bg-slate-100 mb-8"
+                className="w-full h-2 bg-neutral-faint mb-8"
               />
               {Object.entries(categories).length > 0 ? (
                 <div className="space-y-8">
@@ -1073,12 +1072,12 @@ function DashboardIndex() {
                               'flex items-center gap-3 px-4 py-3 rounded-xl transition-all no-underline group/step',
                               step.complete
                                 ? 'bg-[var(--success)]/5'
-                                : 'bg-slate-50 hover:bg-white hover:shadow-sm',
+                                : 'bg-neutral-faint hover:bg-white hover:shadow-sm',
                             )}
                           >
                             <div className={cn(
                               'w-5 h-5 rounded-full flex items-center justify-center flex-shrink-0',
-                              step.complete ? 'bg-[var(--success)]' : 'border-2 border-slate-200 group-hover/step:border-[var(--royal)]',
+                              step.complete ? 'bg-[var(--success)]' : 'border-2 border-neutral-border group-hover/step:border-[var(--royal)]',
                             )}>
                               {step.complete && (
                                 <svg viewBox="0 0 24 24" className="w-3 h-3 text-white" fill="none" stroke="currentColor" strokeWidth="3">
@@ -1089,14 +1088,14 @@ function DashboardIndex() {
                             <div className="flex-1 min-w-0">
                               <p className={cn(
                                 'text-sm font-semibold transition-colors',
-                                step.complete ? 'text-[var(--success)]' : 'text-slate-900 group-hover/step:text-[var(--royal)]',
+                                step.complete ? 'text-[var(--success)]' : 'text-[var(--royal)] group-hover/step:text-[var(--royal)]',
                               )}>
                                 {step.label}
                               </p>
-                              <p className="text-xs text-slate-500 truncate">{step.description}</p>
+                              <p className="text-xs text-[var(--royal)]/60 truncate">{step.description}</p>
                             </div>
                             {!step.complete && (
-                              <svg viewBox="0 0 24 24" className="w-4 h-4 text-slate-300 group-hover/step:text-[var(--royal)] transition-colors" fill="none" stroke="currentColor" strokeWidth="2">
+                              <svg viewBox="0 0 24 24" className="w-4 h-4 text-[var(--royal)]/30 group-hover/step:text-[var(--royal)] transition-colors" fill="none" stroke="currentColor" strokeWidth="2">
                                 <polyline points="9 18 15 12 9 6" />
                               </svg>
                             )}
@@ -1107,7 +1106,7 @@ function DashboardIndex() {
                   ))}
                 </div>
               ) : (
-                <p className="text-sm text-slate-500">Loading checklist...</p>
+                <p className="text-sm text-[var(--royal)]/60">Loading checklist...</p>
               )}
             </div>
           </CollapsibleContent>
@@ -1131,9 +1130,9 @@ function DashboardIndex() {
 function MiniStat({ label, value }: { label: string; value: string }) {
   return (
     <HoverCard glowColor="rgba(19,51,120,0.1)" tiltDeg={3}>
-      <div className="flex items-center gap-3 px-5 py-4 rounded-xl bg-slate-50 border border-slate-100 transition-all">
-        <div className="text-2xl font-bold text-slate-900 tabular-nums">{value}</div>
-        <div className="text-xs font-semibold text-slate-400 uppercase tracking-wider">{label}</div>
+      <div className="flex items-center gap-3 px-5 py-4 rounded-xl bg-neutral-faint border border-neutral-border transition-all">
+        <div className="text-2xl font-bold text-[var(--royal)] tabular-nums">{value}</div>
+        <div className="text-xs font-semibold text-[var(--royal)]/40 uppercase tracking-wider">{label}</div>
       </div>
     </HoverCard>
   )
@@ -1154,18 +1153,18 @@ function QuickAction({ label, icon, route, primary }: QuickActionProps) {
         'flex items-center gap-3 px-5 py-4 rounded-xl transition-all no-underline group',
         primary
           ? 'bg-[var(--royal)] text-white hover:bg-[var(--sapphire)] shadow-sm'
-          : 'bg-slate-50 border border-slate-100 text-slate-900 hover:border-[var(--royal)]/20 hover:shadow-sm',
+          : 'bg-neutral-faint border border-neutral-border text-[var(--royal)] hover:border-[var(--royal)]/20 hover:shadow-sm',
       )}
     >
       <div className={cn(
         'transition-colors',
-        primary ? 'text-white/70 group-hover:text-white' : 'text-slate-400 group-hover:text-[var(--royal)]',
+        primary ? 'text-white/70 group-hover:text-white' : 'text-[var(--royal)]/40 group-hover:text-[var(--royal)]',
       )}>
         {icon}
       </div>
       <span className={cn(
         'text-sm font-semibold',
-        primary ? 'text-white' : 'text-slate-900 group-hover:text-[var(--royal)]',
+        primary ? 'text-white' : 'text-[var(--royal)] group-hover:text-[var(--royal)]',
       )}>
         {label}
       </span>
diff --git a/web/src/routes/estates.$estateId.directives.lazy.tsx b/web/src/routes/estates.$estateId.directives.lazy.tsx
index 23b7636..44f4442 100644
--- a/web/src/routes/estates.$estateId.directives.lazy.tsx
+++ b/web/src/routes/estates.$estateId.directives.lazy.tsx
@@ -6,7 +6,7 @@ import { useAuth } from '../lib/auth'
 import { addDirective, updateDirective } from '../lib/estate-actions'
 import { API_BASE } from '../lib/client'
 import { toast } from 'sonner'
-import { useEditor, EditorContent } from '@tiptap/react'
+import { useEditor, EditorContent, type Editor } from '@tiptap/react'
 import StarterKit from '@tiptap/starter-kit'
 import {
   Plus,
@@ -32,6 +32,7 @@ import {
   PenTool,
   Users,
   Globe,
+  Info,
 } from 'lucide-react'
 import { Button } from '@/components/ui/button'
 import { Card, CardContent } from '@/components/ui/card'
@@ -121,6 +122,77 @@ function getTypeConfig(value: string) {
   return DIRECTIVE_TYPES.find((t) => t.value === value) || DIRECTIVE_TYPES[0]
 }
 
+// ─── Shared Editor Toolbar ──────────────────────────────────────────────────
+// One accessible toolbar shared by the Directives and Obituary rich-text editors
+// (both editors are identical). Exported so obituary.lazy.tsx can import it.
+//
+// Accessibility:
+//   • Container is a `role="toolbar"` with an aria-label so AT announces it as a
+//     formatting toolbar rather than a bare group of buttons.
+//   • Every icon-only button carries an explicit aria-label (its visible meaning).
+//   • Toggle buttons expose aria-pressed reflecting the live editor state, so the
+//     active/inactive state isn't conveyed by background color alone.
+
+type ToolbarToggle = {
+  kind: 'toggle'
+  label: string
+  icon: typeof Bold
+  isActive: () => boolean
+  run: () => void
+}
+type ToolbarAction = {
+  kind: 'action'
+  label: string
+  icon: typeof Bold
+  run: () => void
+}
+type ToolbarDivider = { kind: 'divider' }
+type ToolbarItem = ToolbarToggle | ToolbarAction | ToolbarDivider
+
+export function EditorToolbar({ editor, className = '' }: { editor: Editor; className?: string }) {
+  const items: ToolbarItem[] = [
+    { kind: 'toggle', label: 'Bold', icon: Bold, isActive: () => editor.isActive('bold'), run: () => editor.chain().focus().toggleBold().run() },
+    { kind: 'toggle', label: 'Italic', icon: Italic, isActive: () => editor.isActive('italic'), run: () => editor.chain().focus().toggleItalic().run() },
+    { kind: 'divider' },
+    { kind: 'toggle', label: 'Heading', icon: Heading2, isActive: () => editor.isActive('heading', { level: 2 }), run: () => editor.chain().focus().toggleHeading({ level: 2 }).run() },
+    { kind: 'toggle', label: 'Bullet list', icon: List, isActive: () => editor.isActive('bulletList'), run: () => editor.chain().focus().toggleBulletList().run() },
+    { kind: 'toggle', label: 'Numbered list', icon: ListOrdered, isActive: () => editor.isActive('orderedList'), run: () => editor.chain().focus().toggleOrderedList().run() },
+    { kind: 'divider' },
+    { kind: 'action', label: 'Undo', icon: Undo2, run: () => editor.chain().focus().undo().run() },
+    { kind: 'action', label: 'Redo', icon: Redo2, run: () => editor.chain().focus().redo().run() },
+  ]
+
+  return (
+    <div
+      role="toolbar"
+      aria-label="Text formatting"
+      className={`flex items-center gap-1 p-3 bg-neutral-faint rounded-2xl border border-neutral-border ${className}`}
+    >
+      {items.map((item, i) => {
+        if (item.kind === 'divider') {
+          return <Separator key={`sep-${i}`} orientation="vertical" className="h-5 mx-1" />
+        }
+        const Icon = item.icon
+        const active = item.kind === 'toggle' ? item.isActive() : false
+        return (
+          <Button
+            key={item.label}
+            type="button"
+            variant="ghost"
+            size="icon"
+            aria-label={item.label}
+            aria-pressed={item.kind === 'toggle' ? active : undefined}
+            onClick={item.run}
+            className={`w-9 h-9 rounded-xl ${active ? 'bg-[var(--royal)] text-white hover:bg-[var(--royal)]/90 hover:text-white' : 'text-ink-muted hover:bg-[var(--neutral-border)]'}`}
+          >
+            <Icon className="w-4 h-4" />
+          </Button>
+        )
+      })}
+    </div>
+  )
+}
+
 // ─── Main Page ──────────────────────────────────────────────────────────────
 
 function DirectivesPage() {
@@ -277,7 +349,7 @@ function DirectivesPage() {
             return (
               <Card
                 key={d.id}
-                className="cursor-pointer rounded-3xl border-slate-100 p-0 hover:border-[var(--royal)]/20 hover:shadow-lg transition-all group"
+                className="cursor-pointer rounded-3xl border-neutral-border p-0 hover:border-[var(--royal)]/20 hover:shadow-lg transition-all group"
                 onClick={() => setEditingId(d.id)}
               >
                 <CardContent className="p-8">
@@ -287,8 +359,8 @@ function DirectivesPage() {
                         <Icon className="w-5 h-5" style={{ color: cfg.color }} />
                       </div>
                       <div>
-                        <h3 className="text-lg font-bold text-slate-900 group-hover:text-[var(--royal)] transition-colors">{d.title}</h3>
-                        <p className="text-[12px] text-slate-500 font-medium">{cfg.label}</p>
+                        <h3 className="text-lg font-bold text-royal group-hover:text-[var(--royal)] transition-colors">{d.title}</h3>
+                        <p className="text-[12px] text-ink-muted font-medium">{cfg.label}</p>
                       </div>
                     </div>
                     <div className="flex items-center gap-2">
@@ -306,13 +378,13 @@ function DirectivesPage() {
                     </div>
                   </div>
                   {d.recipientName && (
-                    <p className="text-[13px] text-slate-700 mb-3">
-                      <span className="text-slate-500">To:</span> {d.recipientName}
-                      {d.recipientRelationship && <span className="text-slate-500"> ({d.recipientRelationship})</span>}
+                    <p className="text-[13px] text-ink mb-3">
+                      <span className="text-ink-muted">To:</span> {d.recipientName}
+                      {d.recipientRelationship && <span className="text-ink-muted"> ({d.recipientRelationship})</span>}
                     </p>
                   )}
                   {d.content && (
-                    <p className="text-[13px] text-slate-500 line-clamp-3">
+                    <p className="text-[13px] text-ink-muted line-clamp-3">
                       {d.content.replace(/<[^>]*>/g, '').slice(0, 200)}
                     </p>
                   )}
@@ -365,7 +437,7 @@ function CreateDirectiveModal({ estateId, open, onOpenChange, onCreated }: { est
     <Dialog open={open} onOpenChange={onOpenChange}>
       <DialogContent className="sm:max-w-2xl max-h-[90vh] overflow-y-auto rounded-3xl p-10" showCloseButton={false}>
         <DialogHeader className="mb-6">
-          <DialogTitle className="text-2xl font-[family-name:var(--font-cinzel)] font-bold text-slate-900">
+          <DialogTitle className="text-2xl font-[family-name:var(--font-cinzel)] font-bold text-royal">
             Create Directive
           </DialogTitle>
           <DialogDescription className="sr-only">
@@ -381,7 +453,7 @@ function CreateDirectiveModal({ estateId, open, onOpenChange, onCreated }: { est
             return (
               <Card
                 key={t.value}
-                className={`cursor-pointer p-0 rounded-2xl border-2 transition-all ${selectedType === t.value ? 'border-[var(--royal)] bg-[var(--royal)]/5' : 'border-slate-100 hover:border-slate-200'}`}
+                className={`cursor-pointer p-0 rounded-2xl border-2 transition-all ${selectedType === t.value ? 'border-[var(--royal)] bg-[var(--royal)]/5' : 'border-neutral-border hover:border-gold/40'}`}
                 onClick={() => setSelectedType(t.value)}
               >
                 <CardContent className="flex items-center gap-4 p-5">
@@ -389,8 +461,8 @@ function CreateDirectiveModal({ estateId, open, onOpenChange, onCreated }: { est
                     <Icon className="w-4 h-4" style={{ color: t.color }} />
                   </div>
                   <div>
-                    <p className="text-[14px] font-bold text-slate-900">{t.label}</p>
-                    <p className="text-[12px] text-slate-500">{t.description}</p>
+                    <p className="text-[14px] font-bold text-ink">{t.label}</p>
+                    <p className="text-[12px] text-ink-muted">{t.description}</p>
                   </div>
                 </CardContent>
               </Card>
@@ -405,7 +477,7 @@ function CreateDirectiveModal({ estateId, open, onOpenChange, onCreated }: { est
             value={title}
             onChange={(e) => setTitle(e.target.value)}
             placeholder="Give this directive a meaningful title..."
-            className="h-auto px-5 py-4 rounded-2xl border-slate-200 text-[14px] text-slate-900 focus-visible:border-[var(--royal)] focus-visible:ring-[var(--royal)]/50"
+            className="h-auto px-5 py-4 rounded-2xl border-neutral-border text-[14px] text-ink focus-visible:border-[var(--royal)] focus-visible:ring-[var(--royal)]/50"
           />
         </div>
 
@@ -418,7 +490,7 @@ function CreateDirectiveModal({ estateId, open, onOpenChange, onCreated }: { est
                 value={recipientName}
                 onChange={(e) => setRecipientName(e.target.value)}
                 placeholder="Who is this for?"
-                className="h-auto px-5 py-4 rounded-2xl border-slate-200 text-[14px] text-slate-900 focus-visible:border-[var(--royal)] focus-visible:ring-[var(--royal)]/50"
+                className="h-auto px-5 py-4 rounded-2xl border-neutral-border text-[14px] text-ink focus-visible:border-[var(--royal)] focus-visible:ring-[var(--royal)]/50"
               />
             </div>
             <div className="space-y-2">
@@ -427,17 +499,17 @@ function CreateDirectiveModal({ estateId, open, onOpenChange, onCreated }: { est
                 value={recipientRelationship}
                 onChange={(e) => setRecipientRelationship(e.target.value)}
                 placeholder="e.g., Son, Daughter, Friend"
-                className="h-auto px-5 py-4 rounded-2xl border-slate-200 text-[14px] text-slate-900 focus-visible:border-[var(--royal)] focus-visible:ring-[var(--royal)]/50"
+                className="h-auto px-5 py-4 rounded-2xl border-neutral-border text-[14px] text-ink focus-visible:border-[var(--royal)] focus-visible:ring-[var(--royal)]/50"
               />
             </div>
           </div>
         )}
 
-        <DialogFooter className="flex-row justify-end gap-4 mt-8 pt-8 border-t border-slate-100 rounded-b-3xl bg-transparent -mx-10 -mb-10 px-10 pb-10">
+        <DialogFooter className="flex-row justify-end gap-4 mt-8 pt-8 border-t border-neutral-border rounded-b-3xl bg-transparent -mx-10 -mb-10 px-10 pb-10">
           <Button
             variant="ghost"
             onClick={() => onOpenChange(false)}
-            className="px-8 py-4 h-auto rounded-2xl text-[14px] font-bold text-slate-500 hover:bg-slate-100"
+            className="px-8 py-4 h-auto rounded-2xl text-[14px] font-bold text-ink-muted hover:bg-neutral-faint"
           >
             Cancel
           </Button>
@@ -509,7 +581,7 @@ function DirectiveEditor({ directive, estateId, onBack }: { directive: Directive
     editable: mode === 'edit' && directive.status !== 'finalized',
     editorProps: {
       attributes: {
-        class: 'prose prose-lg max-w-none min-h-[400px] focus:outline-none p-8 text-slate-900',
+        class: 'prose prose-lg max-w-none min-h-[400px] focus:outline-none p-8 text-ink',
       },
     },
     onUpdate: ({ editor: ed }) => {
@@ -549,6 +621,11 @@ function DirectiveEditor({ directive, estateId, onBack }: { directive: Directive
   }, [editor, estateId, directive.id])
 
   const [signingLoading, setSigningLoading] = useState(false)
+  // Set when the signing provider is not yet provisioned (API returns 503). We keep
+  // the directive fully usable (it can still be exported / printed for wet-ink
+  // signing) but replace the call-to-action with a calm "unavailable" notice instead
+  // of letting the owner re-trigger a guaranteed error toast.
+  const [signingUnavailable, setSigningUnavailable] = useState(false)
   const isSigned = !!directive.signedAt
 
   const handleSign = useCallback(async () => {
@@ -576,6 +653,17 @@ function DirectiveEditor({ directive, estateId, onBack }: { directive: Directive
         }),
       })
 
+      // A 503 means no signing provider credential is configured yet (Sirsi Sign or
+      // the dissociated fallback). Surface a steady "not available yet" state and stop
+      // offering the action rather than treating it as a transient failure.
+      if (res.status === 503) {
+        setSigningUnavailable(true)
+        toast.info('Electronic signing isn’t available yet', {
+          description: 'You can export this directive and sign it by hand. Electronic signing will be enabled soon.',
+        })
+        return
+      }
+
       if (!res.ok) {
         const errText = await res.text()
         throw new Error(errText || `Server error (${res.status})`)
@@ -639,7 +727,7 @@ function DirectiveEditor({ directive, estateId, onBack }: { directive: Directive
         <div className="flex items-center gap-3">
           {/* Auto-save indicator */}
           {directive.status !== 'finalized' && autoSaveStatus !== 'idle' && (
-            <span className={`flex items-center gap-1.5 text-[11px] font-medium mr-1 ${autoSaveStatus === 'error' ? 'text-[#DC2626]' : 'text-slate-500'}`}>
+            <span className={`flex items-center gap-1.5 text-[11px] font-medium mr-1 ${autoSaveStatus === 'error' ? 'text-[#DC2626]' : 'text-ink-muted'}`}>
               {autoSaveStatus === 'saving' && <Loader2 className="w-3 h-3 animate-spin" />}
               {autoSaveStatus === 'saved' && <Check className="w-3 h-3 text-[#059669]" />}
               {autoSaveStatus === 'error' && <AlertCircle className="w-3 h-3 text-[#DC2626]" />}
@@ -651,7 +739,7 @@ function DirectiveEditor({ directive, estateId, onBack }: { directive: Directive
               <Button
                 variant="secondary"
                 onClick={() => setMode(mode === 'edit' ? 'view' : 'edit')}
-                className="px-5 py-2.5 h-auto rounded-xl text-[12px] font-bold uppercase tracking-wider bg-slate-100 text-slate-700 hover:bg-slate-200"
+                className="px-5 py-2.5 h-auto rounded-xl text-[12px] font-bold uppercase tracking-wider bg-neutral-faint text-ink hover:bg-[var(--neutral-border)]"
               >
                 {mode === 'edit' ? <><Eye className="w-3.5 h-3.5" /> Preview</> : <><Pencil className="w-3.5 h-3.5" /> Edit</>}
               </Button>
@@ -671,7 +759,15 @@ function DirectiveEditor({ directive, estateId, onBack }: { directive: Directive
               </Button>
             </>
           )}
-          {directive.status === 'finalized' && !isSigned && (
+          {directive.status === 'finalized' && !isSigned && signingUnavailable && (
+            <span
+              className="flex items-center gap-2 px-5 py-2.5 rounded-xl text-[12px] font-bold uppercase tracking-wider bg-[var(--royal)]/5 text-[var(--royal)] border border-[var(--royal)]/15"
+              title="Electronic signing will be enabled soon. Use Export to sign by hand in the meantime."
+            >
+              <Info className="w-3.5 h-3.5" /> E-Signing Coming Soon
+            </span>
+          )}
+          {directive.status === 'finalized' && !isSigned && !signingUnavailable && (
             <>
               <Button
                 onClick={handleSign}
@@ -685,8 +781,12 @@ function DirectiveEditor({ directive, estateId, onBack }: { directive: Directive
                 <Button
                   variant="outline"
                   onClick={async () => {
-                    await updateDirective(estateId, directive.id, { signedAt: new Date().toISOString() })
-                    toast.success('Document marked as signed')
+                    const result = await updateDirective(estateId, directive.id, { signedAt: new Date().toISOString() })
+                    if (result.success) {
+                      toast.success('Document marked as signed')
+                    } else {
+                      toast.error(result.error || 'Could not mark as signed. Please try again.')
+                    }
                   }}
                   className="px-5 py-2.5 h-auto rounded-xl text-[12px] font-bold uppercase tracking-wider border-[#059669]/30 text-[#059669] hover:bg-[#059669]/5"
                 >
@@ -703,7 +803,7 @@ function DirectiveEditor({ directive, estateId, onBack }: { directive: Directive
           <Button
             variant="secondary"
             onClick={handleExportPDF}
-            className="px-5 py-2.5 h-auto rounded-xl text-[12px] font-bold uppercase tracking-wider bg-slate-100 text-slate-700 hover:bg-slate-200"
+            className="px-5 py-2.5 h-auto rounded-xl text-[12px] font-bold uppercase tracking-wider bg-neutral-faint text-ink hover:bg-[var(--neutral-border)]"
           >
             <Download className="w-3.5 h-3.5" /> Export
           </Button>
@@ -711,7 +811,7 @@ function DirectiveEditor({ directive, estateId, onBack }: { directive: Directive
       </div>
 
       {/* ── Title Section ── */}
-      <div className="mb-10 pb-8 border-b border-slate-100">
+      <div className="mb-10 pb-8 border-b border-neutral-border">
         <div className="flex items-center gap-4 mb-4">
           <div className="w-12 h-12 rounded-2xl flex items-center justify-center" style={{ backgroundColor: `${cfg.color}10` }}>
             <Icon className="w-5 h-5" style={{ color: cfg.color }} />
@@ -728,24 +828,24 @@ function DirectiveEditor({ directive, estateId, onBack }: { directive: Directive
             )}
           </div>
         </div>
-        <h1 className="text-4xl font-[family-name:var(--font-cinzel)] font-bold text-slate-900 tracking-tight">{directive.title}</h1>
+        <h1 className="text-4xl font-[family-name:var(--font-cinzel)] font-bold text-royal tracking-tight">{directive.title}</h1>
         {directive.recipientName && (
-          <p className="text-[15px] text-slate-500 mt-3">
-            To: <span className="text-slate-900 font-medium">{directive.recipientName}</span>
+          <p className="text-[15px] text-ink-muted mt-3">
+            To: <span className="text-ink font-medium">{directive.recipientName}</span>
             {directive.recipientRelationship && <span> ({directive.recipientRelationship})</span>}
           </p>
         )}
 
         {/* Visibility Picker */}
         {directive.status !== 'finalized' && heirs.length > 0 && (
-          <div className="mt-5 pt-5 border-t border-slate-50">
+          <div className="mt-5 pt-5 border-t border-neutral-faint">
             <div className="flex items-center gap-2 mb-3">
               {visibleTo.length === 0 ? (
-                <Globe className="w-3.5 h-3.5 text-slate-500" />
+                <Globe className="w-3.5 h-3.5 text-ink-muted" />
               ) : (
                 <Users className="w-3.5 h-3.5 text-[var(--royal)]" />
               )}
-              <span className="text-[11px] font-bold text-slate-500 uppercase tracking-widest">
+              <span className="text-[11px] font-bold text-ink-muted uppercase tracking-widest">
                 {visibleTo.length === 0 ? 'Visible to all heirs' : `Visible to ${visibleTo.length} selected`}
               </span>
             </div>
@@ -758,7 +858,7 @@ function DirectiveEditor({ directive, estateId, onBack }: { directive: Directive
                 className={`text-xs px-3 py-1.5 rounded-full border transition-all font-medium ${
                   visibleTo.length === 0
                     ? 'border-[var(--royal)] bg-[var(--royal)]/5 text-[var(--royal)]'
-                    : 'border-slate-200 text-slate-500 hover:border-slate-300'
+                    : 'border-neutral-border text-ink-muted hover:border-gold/50'
                 }`}
               >
                 Everyone
@@ -778,7 +878,7 @@ function DirectiveEditor({ directive, estateId, onBack }: { directive: Directive
                     className={`text-xs px-3 py-1.5 rounded-full border transition-all font-medium ${
                       selected
                         ? 'border-[var(--royal)] bg-[var(--royal)]/5 text-[var(--royal)]'
-                        : 'border-slate-200 text-slate-500 hover:border-slate-300'
+                        : 'border-neutral-border text-ink-muted hover:border-gold/50'
                     }`}
                   >
                     {heir.fullName}
@@ -792,21 +892,11 @@ function DirectiveEditor({ directive, estateId, onBack }: { directive: Directive
 
       {/* ── Toolbar ── */}
       {mode === 'edit' && directive.status !== 'finalized' && editor && (
-        <div className="flex items-center gap-1 mb-4 p-3 bg-slate-50 rounded-2xl border border-slate-100">
-          <Button variant="ghost" size="icon" onClick={() => editor.chain().focus().toggleBold().run()} className={`w-9 h-9 rounded-xl ${editor.isActive('bold') ? 'bg-[var(--royal)] text-white hover:bg-[var(--royal)]/90 hover:text-white' : 'text-slate-500 hover:bg-slate-200'}`}><Bold className="w-4 h-4" /></Button>
-          <Button variant="ghost" size="icon" onClick={() => editor.chain().focus().toggleItalic().run()} className={`w-9 h-9 rounded-xl ${editor.isActive('italic') ? 'bg-[var(--royal)] text-white hover:bg-[var(--royal)]/90 hover:text-white' : 'text-slate-500 hover:bg-slate-200'}`}><Italic className="w-4 h-4" /></Button>
-          <Separator orientation="vertical" className="h-5 mx-1" />
-          <Button variant="ghost" size="icon" onClick={() => editor.chain().focus().toggleHeading({ level: 2 }).run()} className={`w-9 h-9 rounded-xl ${editor.isActive('heading', { level: 2 }) ? 'bg-[var(--royal)] text-white hover:bg-[var(--royal)]/90 hover:text-white' : 'text-slate-500 hover:bg-slate-200'}`}><Heading2 className="w-4 h-4" /></Button>
-          <Button variant="ghost" size="icon" onClick={() => editor.chain().focus().toggleBulletList().run()} className={`w-9 h-9 rounded-xl ${editor.isActive('bulletList') ? 'bg-[var(--royal)] text-white hover:bg-[var(--royal)]/90 hover:text-white' : 'text-slate-500 hover:bg-slate-200'}`}><List className="w-4 h-4" /></Button>
-          <Button variant="ghost" size="icon" onClick={() => editor.chain().focus().toggleOrderedList().run()} className={`w-9 h-9 rounded-xl ${editor.isActive('orderedList') ? 'bg-[var(--royal)] text-white hover:bg-[var(--royal)]/90 hover:text-white' : 'text-slate-500 hover:bg-slate-200'}`}><ListOrdered className="w-4 h-4" /></Button>
-          <Separator orientation="vertical" className="h-5 mx-1" />
-          <Button variant="ghost" size="icon" onClick={() => editor.chain().focus().undo().run()} className="w-9 h-9 rounded-xl text-slate-500 hover:bg-slate-200"><Undo2 className="w-4 h-4" /></Button>
-          <Button variant="ghost" size="icon" onClick={() => editor.chain().focus().redo().run()} className="w-9 h-9 rounded-xl text-slate-500 hover:bg-slate-200"><Redo2 className="w-4 h-4" /></Button>
-        </div>
+        <EditorToolbar editor={editor} className="mb-4" />
       )}
 
       {/* ── Editor ── */}
-      <div className="rounded-3xl border border-slate-100 overflow-hidden bg-white min-h-[500px]">
+      <div className="rounded-3xl border border-neutral-border overflow-hidden bg-white min-h-[500px]">
         <EditorContent editor={editor} />
       </div>
     </div>
@@ -856,8 +946,8 @@ function IllinoisAdvanceDirectivesSection({ estateId }: { estateId: string }) {
     <div className="space-y-4">
       <div className="flex items-center justify-between">
         <div>
-          <h2 className="text-lg font-bold text-slate-900">Illinois Legal Advance Directives</h2>
-          <p className="text-sm text-slate-900/60">
+          <h2 className="text-lg font-bold text-royal">Illinois Legal Advance Directives</h2>
+          <p className="text-sm text-ink/60">
             {completedCount} of {directives.length} completed &middot; No lawyer or notary required
           </p>
         </div>
@@ -879,7 +969,7 @@ function IllinoisAdvanceDirectivesSection({ estateId }: { estateId: string }) {
             <Card
               key={d.id}
               className={`rounded-2xl transition-all cursor-pointer ${
-                isComplete ? 'border-green-200 bg-green-50/30' : 'border-slate-100 hover:border-[var(--gold)]/20'
+                isComplete ? 'border-green-200 bg-green-50/30' : 'border-neutral-border hover:border-[var(--gold)]/20'
               }`}
               onClick={() => setExpandedId(isExpanded ? null : d.id)}
             >
@@ -887,7 +977,7 @@ function IllinoisAdvanceDirectivesSection({ estateId }: { estateId: string }) {
                 <div className="flex items-start justify-between gap-3">
                   <div className="flex-1">
                     <div className="flex items-center gap-2 mb-1">
-                      <h3 className={`font-semibold text-sm ${isComplete ? 'text-green-700' : 'text-slate-900'}`}>
+                      <h3 className={`font-semibold text-sm ${isComplete ? 'text-green-700' : 'text-royal'}`}>
                         {d.name}
                       </h3>
                       {isComplete && <Badge className="bg-green-100 text-green-700 text-[10px]">Done</Badge>}
@@ -897,36 +987,36 @@ function IllinoisAdvanceDirectivesSection({ estateId }: { estateId: string }) {
                         </Badge>
                       )}
                       {d.overriddenBy && (
-                        <Badge variant="outline" className="text-[10px] border-slate-300 text-slate-500">
+                        <Badge variant="outline" className="text-[10px] border-neutral-border text-ink-muted">
                           Overridden by HCPOA
                         </Badge>
                       )}
                     </div>
-                    <p className="text-xs text-slate-900/60">{d.description}</p>
+                    <p className="text-xs text-ink/60">{d.description}</p>
                   </div>
                 </div>
 
                 {isExpanded && (
-                  <div className="mt-4 pt-3 border-t border-slate-100 space-y-3">
+                  <div className="mt-4 pt-3 border-t border-neutral-border space-y-3">
                     <div className="text-xs space-y-1">
-                      <p className="text-slate-900/50 font-medium">Requirements:</p>
-                      <p className="text-slate-900/70">
+                      <p className="text-ink/50 font-medium">Requirements:</p>
+                      <p className="text-ink/70">
                         {d.witnessRequired > 0 ? `${d.witnessRequired} witness (18+)` : 'No witnesses'}
                         {d.notaryRequired ? ' + Notary' : ''}
                         {!d.lawyerRequired ? ' · No lawyer needed' : ''}
                       </p>
                     </div>
                     <div className="text-xs space-y-1">
-                      <p className="text-slate-900/50 font-medium">Key points:</p>
+                      <p className="text-ink/50 font-medium">Key points:</p>
                       <ul className="space-y-0.5">
                         {d.keyPoints.map((kp, i) => (
-                          <li key={i} className="text-slate-900/70 pl-3 relative before:content-['·'] before:absolute before:left-0 before:text-[var(--gold)]">
+                          <li key={i} className="text-ink/70 pl-3 relative before:content-['·'] before:absolute before:left-0 before:text-[var(--gold)]">
                             {kp}
                           </li>
                         ))}
                       </ul>
                     </div>
-                    <div className="text-xs text-slate-900/50">
+                    <div className="text-xs text-ink/50">
                       <span className="font-medium">Statute:</span> {d.statute}
                     </div>
                     <Separator />
@@ -967,7 +1057,7 @@ function IllinoisAdvanceDirectivesSection({ estateId }: { estateId: string }) {
         })}
       </div>
 
-      <p className="text-[10px] text-slate-900/40 text-center">
+      <p className="text-[10px] text-ink/40 text-center">
         Forms available from the Illinois Department of Public Health. No lawyer or notary required for most directives.
       </p>
     </div>
diff --git a/web/src/routes/estates.$estateId.estates.tsx b/web/src/routes/estates.$estateId.estates.tsx
index b260117..98133b7 100644
--- a/web/src/routes/estates.$estateId.estates.tsx
+++ b/web/src/routes/estates.$estateId.estates.tsx
@@ -1,9 +1,10 @@
 /* eslint-disable react-refresh/only-export-components */
 import { createFileRoute, useParams, useNavigate } from '@tanstack/react-router'
 import React, { useState } from 'react'
-import { useUserEstates, useEstate } from '../lib/firestore'
+import { useUserEstates, useEstate, type Estate } from '../lib/firestore'
 import { createEstate } from '../lib/estate-actions'
 import { useAuth } from '../lib/auth'
+import { personaLabel, type PersonaRole } from '../lib/persona'
 import { toast } from 'sonner'
 import { Button } from '@/components/ui/button'
 import { Card, CardContent } from '@/components/ui/card'
@@ -35,11 +36,13 @@ function EstatesPage() {
     return <CardGridSkeleton />;
   }
 
-  // Map estate_users junction records to estate summaries
+  // Map estate_users junction records to estate summaries. The persona label is
+  // resolved from the real estate-scoped role (never hardcoded 'Owner', which
+  // would mislabel an heir/executor); name + live status resolve in EstateCard.
   const estates = estateUsers.map(eu => ({
     id: eu.estateId,
     name: eu.estateId, // Will be resolved by EstateCard
-    role: eu.role || 'Owner',
+    role: (eu.role || 'principal') as PersonaRole,
   }));
 
   const handleCreateEstate = async (e: React.FormEvent<HTMLFormElement>) => {
@@ -71,8 +74,8 @@ function EstatesPage() {
             <div className="w-10 h-px bg-[var(--royal)]/20" />
             <span>Estate Registry</span>
           </div>
-          <h2 className="text-3xl md:text-5xl font-[family-name:var(--font-cinzel)] font-bold text-slate-900 tracking-tight">Estate Plans</h2>
-          <p className="text-slate-500 text-lg font-medium max-w-2xl leading-relaxed">
+          <h2 className="text-3xl md:text-5xl font-[family-name:var(--font-cinzel)] font-bold text-royal tracking-tight">Estate Plans</h2>
+          <p className="text-ink-muted text-lg font-medium max-w-2xl leading-relaxed">
             Manage your primary and secondary estate plans from a central vault.
           </p>
         </div>
@@ -83,7 +86,7 @@ function EstatesPage() {
           <svg viewBox="0 0 24 24" className="w-5 h-5" fill="none" stroke="currentColor" strokeWidth="2.5"><path d="M12 5v14M5 12h14"/></svg>
           New Estate
         </Button>
-        <Separator className="absolute left-0 right-0 bottom-0 bg-slate-50" />
+        <Separator className="absolute left-0 right-0 bottom-0 bg-neutral-faint" />
       </div>
 
       {/* ── Estate Cards ── */}
@@ -92,12 +95,12 @@ function EstatesPage() {
           <EstateCard key={e.id} estateId={e.id} role={e.role} routeId={routeId} navigate={navigate} />
         ))}
         {estates.length === 0 && (
-          <Card className="col-span-2 border-2 border-dashed border-slate-100 bg-slate-50 rounded-[2.5rem] ring-0">
+          <Card className="col-span-2 border-2 border-dashed border-neutral-border bg-neutral-faint rounded-[2.5rem] ring-0">
             <CardContent className="text-center py-40 flex flex-col items-center justify-center">
-              <div className="w-20 h-20 bg-white rounded-full flex items-center justify-center mb-8 border border-slate-100 shadow-sm">
-                <svg viewBox="0 0 24 24" className="w-10 h-10 text-slate-300" fill="none" stroke="currentColor" strokeWidth="2"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z" /></svg>
+              <div className="w-20 h-20 bg-white rounded-full flex items-center justify-center mb-8 border border-neutral-border shadow-sm">
+                <svg viewBox="0 0 24 24" className="w-10 h-10 text-ink-muted" fill="none" stroke="currentColor" strokeWidth="2"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z" /></svg>
               </div>
-              <p className="text-slate-400 font-medium text-sm">No active estates found for your account.</p>
+              <p className="text-ink-muted font-medium text-sm">No active estates found for your account.</p>
             </CardContent>
           </Card>
         )}
@@ -105,29 +108,29 @@ function EstatesPage() {
 
       {/* ── New Estate Dialog ── */}
       <Dialog open={modalOpen} onOpenChange={setModalOpen}>
-        <DialogContent className="max-w-xl rounded-[3rem] p-16 border border-slate-100 shadow-2xl">
+        <DialogContent className="max-w-xl rounded-[3rem] p-16 border border-neutral-border shadow-2xl">
           <DialogHeader>
-            <DialogTitle className="text-3xl font-bold text-slate-900 tracking-tight font-[family-name:var(--font-cinzel)]">Add New Plan</DialogTitle>
-            <DialogDescription className="text-slate-500 font-medium text-sm">
+            <DialogTitle className="text-3xl font-bold text-royal tracking-tight font-[family-name:var(--font-cinzel)]">Add New Plan</DialogTitle>
+            <DialogDescription className="text-ink-muted font-medium text-sm">
               Enter the details to create a new estate plan for your family.
             </DialogDescription>
           </DialogHeader>
 
           <form onSubmit={handleCreateEstate} className="space-y-10 mt-4">
             <div className="space-y-3">
-              <Label className="text-[11px] font-bold text-slate-400 uppercase tracking-widest pl-1">Plan Name</Label>
+              <Label className="text-[11px] font-bold text-ink-muted uppercase tracking-widest pl-1">Plan Name</Label>
               <Input
                 value={planName}
                 onChange={(e) => setPlanName(e.target.value)}
                 required
-                className="w-full px-8 py-5 h-auto rounded-2xl border border-slate-100 bg-slate-50/50 focus:bg-white focus:border-[var(--royal)] focus:ring-8 focus:ring-[var(--royal)]/5 outline-none font-bold text-slate-900 transition-all placeholder:text-slate-300 text-lg"
+                className="w-full px-8 py-5 h-auto rounded-2xl border border-neutral-border bg-neutral-faint/50 focus:bg-white focus:border-[var(--royal)] focus:ring-8 focus:ring-[var(--royal)]/5 outline-none font-bold text-ink transition-all placeholder:text-ink-muted text-lg"
                 placeholder="e.g. The Family Dynasty Trust"
               />
             </div>
             <div className="space-y-3">
-              <Label className="text-[11px] font-bold text-slate-400 uppercase tracking-widest pl-1">Plan Type</Label>
+              <Label className="text-[11px] font-bold text-ink-muted uppercase tracking-widest pl-1">Plan Type</Label>
               <Select value={planType} onValueChange={setPlanType}>
-                <SelectTrigger className="w-full px-8 py-5 h-auto rounded-2xl border border-slate-100 bg-slate-50/50 focus:bg-white focus:border-[var(--royal)] outline-none font-bold text-slate-900 text-lg transition-all">
+                <SelectTrigger className="w-full px-8 py-5 h-auto rounded-2xl border border-neutral-border bg-neutral-faint/50 focus:bg-white focus:border-[var(--royal)] outline-none font-bold text-ink text-lg transition-all">
                   <SelectValue placeholder="Select a plan type" />
                 </SelectTrigger>
                 <SelectContent>
@@ -142,7 +145,7 @@ function EstatesPage() {
                 type="button"
                 variant="outline"
                 onClick={() => setModalOpen(false)}
-                className="flex-1 py-5 h-auto rounded-2xl border border-slate-100 font-bold text-slate-400 text-sm hover:bg-slate-50"
+                className="flex-1 py-5 h-auto rounded-2xl border border-neutral-border font-bold text-ink-muted text-sm hover:bg-neutral-faint"
               >
                 Cancel
               </Button>
@@ -161,33 +164,67 @@ function EstatesPage() {
   )
 }
 
-// ── Estate Card — resolves name from Firestore ──
+// ── Estate status presentation — driven by the real Firestore status field ──
+
+const ESTATE_STATUS_PRESENTATION: Record<
+  Estate['status'],
+  { label: string; dot: string; description: string }
+> = {
+  active: {
+    label: 'Active',
+    dot: 'bg-green-500',
+    description: 'The assets and memories for this estate are actively monitored and secured.',
+  },
+  death_reported: {
+    label: 'Passing Reported',
+    dot: 'bg-[var(--gold)]',
+    description: 'A passing has been reported. The estate is awaiting executor confirmation.',
+  },
+  executor_confirmed: {
+    label: 'Executor Confirmed',
+    dot: 'bg-[var(--gold)]',
+    description: 'The executor has been confirmed. Settlement is being prepared.',
+  },
+  in_settlement: {
+    label: 'In Settlement',
+    dot: 'bg-[var(--royal)]',
+    description: 'This estate is in settlement. Designated members are carrying out final wishes.',
+  },
+  closed: {
+    label: 'Closed',
+    dot: 'bg-[var(--neutral-border)]',
+    description: 'This estate has been settled and closed. Records remain securely archived.',
+  },
+};
+
+// ── Estate Card — resolves name + live status from Firestore ──
 
 function EstateCard({ estateId, role, routeId, navigate }: {
-  estateId: string; role: string; routeId: string; navigate: (opts: { to: string }) => void;
+  estateId: string; role: PersonaRole; routeId: string; navigate: (opts: { to: string }) => void;
 }) {
   const { data: estate } = useEstate(estateId);
   const isCurrent = routeId === estateId;
   const displayName = estate?.name || estateId;
+  const status = ESTATE_STATUS_PRESENTATION[estate?.status ?? 'active'] ?? ESTATE_STATUS_PRESENTATION.active;
 
   return (
-    <Card className={`p-12 rounded-[2.5rem] ${isCurrent ? 'border-[var(--royal)]/20 shadow-xl' : 'border-slate-100 shadow-sm'} hover:shadow-2xl hover:border-[var(--royal)]/20 transition-all group overflow-hidden relative cursor-pointer ring-0`}>
+    <Card className={`p-12 rounded-[2.5rem] ${isCurrent ? 'border-[var(--royal)]/20 shadow-xl' : 'border-neutral-border shadow-sm'} hover:shadow-2xl hover:border-[var(--royal)]/20 transition-all group overflow-hidden relative cursor-pointer ring-0`}>
       <CardContent className="p-0">
-        <div className={`w-16 h-16 ${isCurrent ? 'bg-[var(--royal)] text-white' : 'bg-slate-50 text-[var(--royal)]'} rounded-2xl flex items-center justify-center mb-8 border border-slate-100 transition-all duration-500`}>
+        <div className={`w-16 h-16 ${isCurrent ? 'bg-[var(--royal)] text-white' : 'bg-neutral-faint text-[var(--royal)]'} rounded-2xl flex items-center justify-center mb-8 border border-neutral-border transition-all duration-500`}>
           <svg viewBox="0 0 24 24" className="w-8 h-8 transition-transform group-hover:scale-110" fill="none" stroke="currentColor" strokeWidth="2">
             <path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z" />
           </svg>
         </div>
-        <h3 className="text-slate-900 font-bold text-3xl mb-3 tracking-tight group-hover:text-[var(--royal)] transition-colors">{displayName}</h3>
+        <h3 className="text-royal font-bold text-3xl mb-3 tracking-tight group-hover:text-[var(--royal)] transition-colors">{displayName}</h3>
         <div className="flex items-center gap-4 mb-8">
-          <Badge variant="secondary" className="px-4 py-1.5 h-auto bg-slate-100 text-slate-700 font-bold text-[11px] uppercase tracking-widest rounded-lg border border-slate-100">{role}</Badge>
+          <Badge variant="secondary" className="px-4 py-1.5 h-auto bg-neutral-faint text-ink font-bold text-[11px] uppercase tracking-widest rounded-lg border border-neutral-border">{personaLabel(role)}</Badge>
           <div className="flex items-center gap-2">
-            <div className="w-2 h-2 rounded-full bg-green-500" />
-            <span className="text-[11px] font-bold text-slate-400 uppercase tracking-widest">Active</span>
+            <div className={`w-2 h-2 rounded-full ${status.dot}`} />
+            <span className="text-[11px] font-bold text-ink-muted uppercase tracking-widest">{status.label}</span>
           </div>
         </div>
-        <p className="text-slate-500 font-medium text-sm leading-relaxed mb-10">
-          The assets and memories for this estate are actively monitored and secured.
+        <p className="text-ink-muted font-medium text-sm leading-relaxed mb-10">
+          {status.description}
         </p>
         <div className="flex gap-4">
           <Button
@@ -196,7 +233,7 @@ function EstateCard({ estateId, role, routeId, navigate }: {
               const nextId = estateId;
               navigate({ to: `/estates/${nextId}/dashboard` });
             }}
-            className={`flex-1 ${isCurrent ? 'bg-slate-50 text-slate-400 border border-slate-100 cursor-default hover:bg-slate-50' : 'bg-[var(--royal)] text-white hover:bg-[var(--royal-blue)]'} px-8 py-4 h-auto rounded-2xl text-sm font-bold shadow-sm`}
+            className={`flex-1 ${isCurrent ? 'bg-neutral-faint text-ink-muted border border-neutral-border cursor-default hover:bg-neutral-faint' : 'bg-[var(--royal)] text-white hover:bg-[var(--royal-blue)]'} px-8 py-4 h-auto rounded-2xl text-sm font-bold shadow-sm`}
           >
             {isCurrent ? 'Currently Active' : 'Open Estate'}
           </Button>
diff --git a/web/src/routes/estates.$estateId.events.tsx b/web/src/routes/estates.$estateId.events.tsx
index 72439ab..ce53519 100644
--- a/web/src/routes/estates.$estateId.events.tsx
+++ b/web/src/routes/estates.$estateId.events.tsx
@@ -154,7 +154,7 @@ function EventsPage() {
           {/* Past */}
           {past.length > 0 && (
             <div className="space-y-4">
-              <div className="text-[11px] font-bold text-slate-500/40 uppercase tracking-[0.3em]">Past</div>
+              <div className="text-[11px] font-bold text-[var(--royal)]/40 uppercase tracking-[0.3em]">Past</div>
               <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
                 {past.map((event) => (
                   <EventCard key={event.id} event={event} estateId={estateId} onEdit={setEditingEvent} />
@@ -221,7 +221,7 @@ function EventCard({ event, estateId, onEdit }: { event: EstateEvent; estateId:
   }, [event])
 
   return (
-    <Card className="rounded-3xl border-slate-100 p-0 hover:border-[var(--royal)]/20 hover:shadow-lg transition-all">
+    <Card className="rounded-3xl border-neutral-border p-0 hover:border-[var(--royal)]/20 hover:shadow-lg transition-all">
       <CardContent className="p-8">
         <div className="flex items-start justify-between mb-5">
           <div>
@@ -231,7 +231,7 @@ function EventCard({ event, estateId, onEdit }: { event: EstateEvent; estateId:
             >
               {typeLabel}
             </Badge>
-            <h3 className="text-lg font-bold text-slate-900">{event.title}</h3>
+            <h3 className="text-lg font-bold text-[var(--royal)]">{event.title}</h3>
           </div>
           {event.status === 'cancelled' && (
             <Badge variant="secondary" className="bg-red-50 text-red-600 text-[10px] font-bold uppercase tracking-widest px-2.5 py-1 rounded-lg">
@@ -241,22 +241,22 @@ function EventCard({ event, estateId, onEdit }: { event: EstateEvent; estateId:
         </div>
 
         <div className="space-y-3 mb-6">
-          <div className="flex items-center gap-3 text-slate-700 text-sm">
+          <div className="flex items-center gap-3 text-[var(--royal)]/70 text-sm">
             <Calendar className="w-4 h-4 text-[var(--gold)]/60 flex-shrink-0" />
             <span>{event.date}</span>
           </div>
           {event.time && (
-            <div className="flex items-center gap-3 text-slate-700 text-sm">
+            <div className="flex items-center gap-3 text-[var(--royal)]/70 text-sm">
               <Clock className="w-4 h-4 text-[var(--gold)]/60 flex-shrink-0" />
               <span>{event.time}{event.endTime ? ` — ${event.endTime}` : ''}</span>
             </div>
           )}
-          <div className="flex items-center gap-3 text-slate-700 text-sm">
+          <div className="flex items-center gap-3 text-[var(--royal)]/70 text-sm">
             <MapPin className="w-4 h-4 text-[var(--gold)]/60 flex-shrink-0" />
             <span>{event.location}</span>
           </div>
           {event.rsvpEnabled && event.rsvpCount !== undefined && (
-            <div className="flex items-center gap-3 text-slate-700 text-sm">
+            <div className="flex items-center gap-3 text-[var(--royal)]/70 text-sm">
               <Users className="w-4 h-4 text-[var(--gold)]/60 flex-shrink-0" />
               <span>{event.rsvpCount} attending</span>
             </div>
@@ -264,7 +264,7 @@ function EventCard({ event, estateId, onEdit }: { event: EstateEvent; estateId:
         </div>
 
         {event.description && (
-          <p className="text-sm text-slate-500 mb-6 line-clamp-3">{event.description}</p>
+          <p className="text-sm text-[var(--royal)]/60 mb-6 line-clamp-3">{event.description}</p>
         )}
 
         <div className="flex items-center gap-2 flex-wrap">
@@ -280,7 +280,7 @@ function EventCard({ event, estateId, onEdit }: { event: EstateEvent; estateId:
           <Button
             variant="ghost"
             onClick={copyDetails}
-            className="text-[12px] font-bold text-slate-500 hover:text-[var(--royal)] rounded-xl"
+            className="text-[12px] font-bold text-[var(--royal)]/60 hover:text-[var(--royal)] rounded-xl"
           >
             {copied ? <Check className="w-3.5 h-3.5 text-[#059669]" /> : <Copy className="w-3.5 h-3.5" />}
             {copied ? 'Copied' : 'Copy Details'}
@@ -289,7 +289,7 @@ function EventCard({ event, estateId, onEdit }: { event: EstateEvent; estateId:
             <Button
               variant="ghost"
               onClick={() => onEdit(event)}
-              className="text-[12px] font-bold text-slate-500 hover:text-[var(--royal)] rounded-xl"
+              className="text-[12px] font-bold text-[var(--royal)]/60 hover:text-[var(--royal)] rounded-xl"
             >
               <Pencil className="w-3.5 h-3.5" /> Edit
             </Button>
@@ -316,7 +316,7 @@ function EventCard({ event, estateId, onEdit }: { event: EstateEvent; estateId:
 
         {/* View RSVPs — collapsible list (estate owner/executor view) */}
         {event.rsvpEnabled && (
-          <div className="mt-4 pt-4 border-t border-slate-100">
+          <div className="mt-4 pt-4 border-t border-neutral-border">
             <button
               type="button"
               onClick={() => setRsvpListOpen(!rsvpListOpen)}
@@ -329,7 +329,7 @@ function EventCard({ event, estateId, onEdit }: { event: EstateEvent; estateId:
             {rsvpListOpen && (
               <div className="mt-3 space-y-2">
                 {rsvps.length === 0 ? (
-                  <p className="text-[13px] text-slate-400 italic">No RSVPs yet.</p>
+                  <p className="text-[13px] text-[var(--royal)]/40 italic">No RSVPs yet.</p>
                 ) : (
                   rsvps.map((rsvp) => (
                     <RSVPRow key={rsvp.id} rsvp={rsvp} />
@@ -414,17 +414,17 @@ function EventCard({ event, estateId, onEdit }: { event: EstateEvent; estateId:
 // ─── RSVP Row (compact display for the list) ────────────────────────────────
 
 const RESPONSE_BADGES: Record<RSVPResponse, { label: string; className: string }> = {
-  attending: { label: 'Attending', className: 'bg-emerald-50 text-emerald-700' },
+  attending: { label: 'Attending', className: 'bg-green-50 text-green-700' },
   maybe: { label: 'Maybe', className: 'bg-amber-50 text-amber-700' },
-  not_attending: { label: 'Not Attending', className: 'bg-slate-100 text-slate-600' },
+  not_attending: { label: 'Not Attending', className: 'bg-neutral-faint text-[var(--royal)]/60' },
 }
 
 function RSVPRow({ rsvp }: { rsvp: RSVPRecord }) {
   const badge = RESPONSE_BADGES[rsvp.response] || RESPONSE_BADGES.attending
   return (
-    <div className="flex items-center justify-between py-2 px-3 rounded-xl bg-slate-50/50 hover:bg-slate-50 transition-colors">
+    <div className="flex items-center justify-between py-2 px-3 rounded-xl bg-neutral-faint/50 hover:bg-neutral-faint transition-colors">
       <div className="flex items-center gap-3 min-w-0">
-        <span className="text-[13px] font-semibold text-slate-900 truncate">{rsvp.name}</span>
+        <span className="text-[13px] font-semibold text-[var(--royal)] truncate">{rsvp.name}</span>
         <Badge
           variant="secondary"
           className={`text-[10px] font-bold uppercase tracking-widest px-2 py-0.5 rounded-md ${badge.className}`}
@@ -434,12 +434,12 @@ function RSVPRow({ rsvp }: { rsvp: RSVPRecord }) {
       </div>
       <div className="flex items-center gap-2 flex-shrink-0">
         {rsvp.response !== 'not_attending' && rsvp.guests > 0 && (
-          <span className="text-[12px] text-slate-500">
+          <span className="text-[12px] text-[var(--royal)]/60">
             <Users className="w-3 h-3 inline mr-1" />{rsvp.guests}
           </span>
         )}
         {rsvp.message && (
-          <span className="text-[11px] text-slate-400 italic max-w-[120px] truncate" title={rsvp.message}>
+          <span className="text-[11px] text-[var(--royal)]/40 italic max-w-[120px] truncate" title={rsvp.message}>
             "{rsvp.message}"
           </span>
         )}
@@ -520,7 +520,7 @@ function CreateEventModal({
     <Dialog open={open} onOpenChange={onOpenChange}>
       <DialogContent className="sm:max-w-2xl max-h-[90vh] overflow-y-auto rounded-3xl p-10" showCloseButton={false}>
         <DialogHeader className="mb-6">
-          <DialogTitle className="text-2xl font-[family-name:var(--font-cinzel)] font-bold text-slate-900">
+          <DialogTitle className="text-2xl font-[family-name:var(--font-cinzel)] font-bold text-[var(--royal)]">
             Create Event
           </DialogTitle>
           <DialogDescription className="sr-only">
@@ -533,7 +533,7 @@ function CreateEventModal({
           <div className="space-y-2">
             <Label className="text-[11px] font-bold text-[var(--royal)]/60 uppercase tracking-widest">Event Type</Label>
             <Select value={form.type} onValueChange={(v) => update('type', v)}>
-              <SelectTrigger className="h-auto px-5 py-4 rounded-2xl border-slate-200 text-[14px]">
+              <SelectTrigger className="h-auto px-5 py-4 rounded-2xl border-neutral-border text-[14px]">
                 <SelectValue />
               </SelectTrigger>
               <SelectContent>
@@ -551,7 +551,7 @@ function CreateEventModal({
               value={form.title}
               onChange={(e) => update('title', e.target.value)}
               placeholder="e.g., Funeral Service for John Smith"
-              className="h-auto px-5 py-4 rounded-2xl border-slate-200 text-[14px]"
+              className="h-auto px-5 py-4 rounded-2xl border-neutral-border text-[14px]"
             />
           </div>
 
@@ -563,7 +563,7 @@ function CreateEventModal({
                 type="date"
                 value={form.date}
                 onChange={(e) => update('date', e.target.value)}
-                className="h-auto px-5 py-4 rounded-2xl border-slate-200 text-[14px]"
+                className="h-auto px-5 py-4 rounded-2xl border-neutral-border text-[14px]"
               />
             </div>
             <div className="space-y-2">
@@ -572,7 +572,7 @@ function CreateEventModal({
                 type="time"
                 value={form.time}
                 onChange={(e) => update('time', e.target.value)}
-                className="h-auto px-5 py-4 rounded-2xl border-slate-200 text-[14px]"
+                className="h-auto px-5 py-4 rounded-2xl border-neutral-border text-[14px]"
               />
             </div>
             <div className="space-y-2">
@@ -581,7 +581,7 @@ function CreateEventModal({
                 type="time"
                 value={form.endTime}
                 onChange={(e) => update('endTime', e.target.value)}
-                className="h-auto px-5 py-4 rounded-2xl border-slate-200 text-[14px]"
+                className="h-auto px-5 py-4 rounded-2xl border-neutral-border text-[14px]"
               />
             </div>
           </div>
@@ -593,7 +593,7 @@ function CreateEventModal({
               value={form.location}
               onChange={(e) => update('location', e.target.value)}
               placeholder="e.g., St. Matthew's Church"
-              className="h-auto px-5 py-4 rounded-2xl border-slate-200 text-[14px]"
+              className="h-auto px-5 py-4 rounded-2xl border-neutral-border text-[14px]"
             />
           </div>
 
@@ -603,7 +603,7 @@ function CreateEventModal({
               value={form.address}
               onChange={(e) => update('address', e.target.value)}
               placeholder="Full street address"
-              className="h-auto px-5 py-4 rounded-2xl border-slate-200 text-[14px]"
+              className="h-auto px-5 py-4 rounded-2xl border-neutral-border text-[14px]"
             />
           </div>
 
@@ -615,7 +615,7 @@ function CreateEventModal({
               onChange={(e) => update('description', e.target.value)}
               placeholder="Details about the service..."
               rows={3}
-              className="px-5 py-4 rounded-2xl border-slate-200 text-[14px] resize-none"
+              className="px-5 py-4 rounded-2xl border-neutral-border text-[14px] resize-none"
             />
           </div>
 
@@ -626,16 +626,16 @@ function CreateEventModal({
               value={form.dressCode}
               onChange={(e) => update('dressCode', e.target.value)}
               placeholder="e.g., Business formal, Celebration colors welcome"
-              className="h-auto px-5 py-4 rounded-2xl border-slate-200 text-[14px]"
+              className="h-auto px-5 py-4 rounded-2xl border-neutral-border text-[14px]"
             />
           </div>
         </div>
 
-        <DialogFooter className="flex-row justify-end gap-4 mt-8 pt-8 border-t border-slate-100">
+        <DialogFooter className="flex-row justify-end gap-4 mt-8 pt-8 border-t border-neutral-border">
           <Button
             variant="ghost"
             onClick={() => onOpenChange(false)}
-            className="px-8 py-4 h-auto rounded-2xl text-[14px] font-bold text-slate-500"
+            className="px-8 py-4 h-auto rounded-2xl text-[14px] font-bold text-[var(--royal)]/60"
           >
             Cancel
           </Button>
@@ -730,7 +730,7 @@ function EditEventModal({
     <Dialog open={open} onOpenChange={onOpenChange}>
       <DialogContent className="sm:max-w-2xl max-h-[90vh] overflow-y-auto rounded-3xl p-10" showCloseButton={false}>
         <DialogHeader className="mb-6">
-          <DialogTitle className="text-2xl font-[family-name:var(--font-cinzel)] font-bold text-slate-900">
+          <DialogTitle className="text-2xl font-[family-name:var(--font-cinzel)] font-bold text-[var(--royal)]">
             Edit Event
           </DialogTitle>
           <DialogDescription className="sr-only">Edit event details</DialogDescription>
@@ -739,34 +739,34 @@ function EditEventModal({
         <div className="space-y-6">
           <div className="space-y-2">
             <Label className="text-[11px] font-bold text-[var(--royal)]/60 uppercase tracking-widest">Title *</Label>
-            <Input value={form.title} onChange={(e) => update('title', e.target.value)} className="h-auto px-5 py-4 rounded-2xl border-slate-200 text-[14px]" />
+            <Input value={form.title} onChange={(e) => update('title', e.target.value)} className="h-auto px-5 py-4 rounded-2xl border-neutral-border text-[14px]" />
           </div>
           <div className="grid grid-cols-3 gap-4">
             <div className="space-y-2">
               <Label className="text-[11px] font-bold text-[var(--royal)]/60 uppercase tracking-widest">Date *</Label>
-              <Input type="date" value={form.date} onChange={(e) => update('date', e.target.value)} className="h-auto px-5 py-4 rounded-2xl border-slate-200 text-[14px]" />
+              <Input type="date" value={form.date} onChange={(e) => update('date', e.target.value)} className="h-auto px-5 py-4 rounded-2xl border-neutral-border text-[14px]" />
             </div>
             <div className="space-y-2">
               <Label className="text-[11px] font-bold text-[var(--royal)]/60 uppercase tracking-widest">Start Time</Label>
-              <Input type="time" value={form.time} onChange={(e) => update('time', e.target.value)} className="h-auto px-5 py-4 rounded-2xl border-slate-200 text-[14px]" />
+              <Input type="time" value={form.time} onChange={(e) => update('time', e.target.value)} className="h-auto px-5 py-4 rounded-2xl border-neutral-border text-[14px]" />
             </div>
             <div className="space-y-2">
               <Label className="text-[11px] font-bold text-[var(--royal)]/60 uppercase tracking-widest">End Time</Label>
-              <Input type="time" value={form.endTime} onChange={(e) => update('endTime', e.target.value)} className="h-auto px-5 py-4 rounded-2xl border-slate-200 text-[14px]" />
+              <Input type="time" value={form.endTime} onChange={(e) => update('endTime', e.target.value)} className="h-auto px-5 py-4 rounded-2xl border-neutral-border text-[14px]" />
             </div>
           </div>
           <div className="space-y-2">
             <Label className="text-[11px] font-bold text-[var(--royal)]/60 uppercase tracking-widest">Location *</Label>
-            <Input value={form.location} onChange={(e) => update('location', e.target.value)} className="h-auto px-5 py-4 rounded-2xl border-slate-200 text-[14px]" />
+            <Input value={form.location} onChange={(e) => update('location', e.target.value)} className="h-auto px-5 py-4 rounded-2xl border-neutral-border text-[14px]" />
           </div>
           <div className="space-y-2">
             <Label className="text-[11px] font-bold text-[var(--royal)]/60 uppercase tracking-widest">Description</Label>
-            <Textarea value={form.description} onChange={(e) => update('description', e.target.value)} rows={3} className="px-5 py-4 rounded-2xl border-slate-200 text-[14px] resize-none" />
+            <Textarea value={form.description} onChange={(e) => update('description', e.target.value)} rows={3} className="px-5 py-4 rounded-2xl border-neutral-border text-[14px] resize-none" />
           </div>
         </div>
 
-        <DialogFooter className="flex-row justify-end gap-4 mt-8 pt-8 border-t border-slate-100">
-          <Button variant="ghost" onClick={() => onOpenChange(false)} className="px-8 py-4 h-auto rounded-2xl text-[14px] font-bold text-slate-500">Cancel</Button>
+        <DialogFooter className="flex-row justify-end gap-4 mt-8 pt-8 border-t border-neutral-border">
+          <Button variant="ghost" onClick={() => onOpenChange(false)} className="px-8 py-4 h-auto rounded-2xl text-[14px] font-bold text-[var(--royal)]/60">Cancel</Button>
           <Button onClick={handleSave} disabled={saving || !form.title.trim() || !form.date || !form.location.trim()} className="bg-[var(--royal)] hover:bg-[var(--royal-blue)] text-white px-10 py-4 h-auto rounded-2xl font-bold text-[14px]">
             {saving ? 'Saving...' : 'Save Changes'}
           </Button>
diff --git a/web/src/routes/estates.$estateId.heirlooms.tsx b/web/src/routes/estates.$estateId.heirlooms.tsx
index ab42af4..cb7e17a 100644
--- a/web/src/routes/estates.$estateId.heirlooms.tsx
+++ b/web/src/routes/estates.$estateId.heirlooms.tsx
@@ -30,7 +30,7 @@ import {
   Globe,
   Loader2,
 } from 'lucide-react'
-import { importFromGooglePhotos } from '../lib/google-photos-import'
+import { importFromGooglePhotos, isGooglePhotosImportConfigured } from '../lib/google-photos-import'
 
 import { Button } from '@/components/ui/button'
 import { CameraCaptureButton } from '@/components/ui/camera-capture-button'
@@ -88,6 +88,9 @@ function HeirloomsPage() {
   const [modalOpen, setModalOpen] = useState(false)
   const [filterCategory, setFilterCategory] = useState<CategoryValue | 'all'>('all')
   const [importing, setImporting] = useState(false)
+  // Google Photos import is gated on a build-time OAuth client id. When absent the
+  // control is hidden entirely rather than shown-then-erroring on click.
+  const googlePhotosEnabled = isGooglePhotosImportConfigured()
 
   const handleGooglePhotosImport = useCallback(async () => {
     if (importing) return
@@ -136,15 +139,17 @@ function HeirloomsPage() {
         subtitle="Physical assets, family treasures, and sentimental items worth preserving for future generations."
         action={
           <div className="flex flex-col md:flex-row gap-3 w-full md:w-auto">
-            <Button
-              onClick={handleGooglePhotosImport}
-              disabled={importing || (tierUsage ? !tierUsage.canUploadMedia : false)}
-              variant="secondary"
-              className="px-6 py-3 md:px-8 md:py-5 h-auto rounded-2xl font-bold text-[13px] md:text-[14px] bg-slate-100 text-slate-700 hover:bg-slate-200 w-full md:w-auto justify-center disabled:opacity-50 disabled:cursor-not-allowed"
-            >
-              {importing ? <Loader2 className="w-5 h-5 animate-spin" /> : <Image className="w-5 h-5" />}
-              Import from Google Photos
-            </Button>
+            {googlePhotosEnabled && (
+              <Button
+                onClick={handleGooglePhotosImport}
+                disabled={importing || (tierUsage ? !tierUsage.canUploadMedia : false)}
+                variant="secondary"
+                className="px-6 py-3 md:px-8 md:py-5 h-auto rounded-2xl font-bold text-[13px] md:text-[14px] bg-[var(--royal)]/5 text-[var(--ink-muted)] hover:bg-[var(--royal)]/10 w-full md:w-auto justify-center disabled:opacity-50 disabled:cursor-not-allowed"
+              >
+                {importing ? <Loader2 className="w-5 h-5 animate-spin" /> : <Image className="w-5 h-5" />}
+                Import from Google Photos
+              </Button>
+            )}
             <Button
               onClick={() => setModalOpen(true)}
               disabled={tierUsage ? !tierUsage.canUploadMedia : false}
@@ -166,8 +171,8 @@ function HeirloomsPage() {
             </svg>
           </div>
           <div className="flex-1">
-            <p className="text-sm font-bold text-slate-900">{tierUpgradeMessage(tierUsage, 'media')}</p>
-            <p className="text-xs text-slate-500 mt-1">
+            <p className="text-sm font-bold text-[var(--ink)]">{tierUpgradeMessage(tierUsage, 'media')}</p>
+            <p className="text-xs text-[var(--ink-muted)] mt-1">
               {tierUsage.mediaCount} of {tierUsage.limits.maxMedia} uploads used
             </p>
           </div>
@@ -181,15 +186,15 @@ function HeirloomsPage() {
           { label: 'Estimated Value', value: formatCurrency(stats.totalValue), icon: DollarSign },
           { label: 'Categories', value: String(stats.categories), icon: Archive },
         ].map((s) => (
-          <Card key={s.label} className="bg-slate-50 rounded-3xl border-slate-100 py-0">
+          <Card key={s.label} variant="glass" className="py-0">
             <CardContent className="p-8">
               <div className="flex items-center gap-4">
                 <div className="w-12 h-12 bg-[var(--royal)]/5 rounded-2xl flex items-center justify-center">
                   <s.icon className="w-5 h-5 text-[var(--royal)]" />
                 </div>
                 <div>
-                  <p className="text-3xl font-bold text-slate-900">{s.value}</p>
-                  <p className="text-[11px] font-bold text-slate-500 uppercase tracking-widest">{s.label}</p>
+                  <p className="text-3xl font-bold text-[var(--ink)]">{s.value}</p>
+                  <p className="text-[11px] font-bold text-[var(--ink-muted)] uppercase tracking-widest">{s.label}</p>
                 </div>
               </div>
             </CardContent>
@@ -202,7 +207,7 @@ function HeirloomsPage() {
         <Button
           variant={filterCategory === 'all' ? 'default' : 'secondary'}
           onClick={() => setFilterCategory('all')}
-          className={`px-5 py-2.5 h-auto rounded-xl text-[12px] font-bold uppercase tracking-wider ${filterCategory === 'all' ? 'bg-[var(--royal)] text-white hover:bg-[var(--royal-blue)]' : 'bg-slate-100 text-slate-700 hover:bg-slate-200'}`}
+          className={`px-5 py-2.5 h-auto rounded-xl text-[12px] font-bold uppercase tracking-wider ${filterCategory === 'all' ? 'bg-[var(--royal)] text-white hover:bg-[var(--royal-blue)]' : 'bg-[var(--royal)]/5 text-[var(--ink-muted)] hover:bg-[var(--royal)]/10'}`}
         >
           All
         </Button>
@@ -211,7 +216,7 @@ function HeirloomsPage() {
             key={c.value}
             variant={filterCategory === c.value ? 'default' : 'secondary'}
             onClick={() => setFilterCategory(c.value)}
-            className={`px-5 py-2.5 h-auto rounded-xl text-[12px] font-bold uppercase tracking-wider ${filterCategory === c.value ? 'bg-[var(--royal)] text-white hover:bg-[var(--royal-blue)]' : 'bg-slate-100 text-slate-700 hover:bg-slate-200'}`}
+            className={`px-5 py-2.5 h-auto rounded-xl text-[12px] font-bold uppercase tracking-wider ${filterCategory === c.value ? 'bg-[var(--royal)] text-white hover:bg-[var(--royal-blue)]' : 'bg-[var(--royal)]/5 text-[var(--ink-muted)] hover:bg-[var(--royal)]/10'}`}
           >
             <c.icon className="w-3.5 h-3.5" />
             {c.label}
@@ -253,16 +258,35 @@ function HeirloomCard({ item, estateId, heirs }: { item: Heirloom; estateId: str
   const activeHeirs = heirs.filter(h => h.status === 'active')
 
   const handleArchive = useCallback(async () => {
-    await archiveHeirloom(estateId, item.id)
+    const result = await archiveHeirloom(estateId, item.id)
     setConfirming(false)
+    if (!result?.success) {
+      toast.error(result?.error || 'Could not archive. Please try again.')
+      return
+    }
     toast.success('Heirloom archived')
   }, [estateId, item.id])
 
+  // Persist a visibility change with optimistic UI + revert-on-failure.
+  // `prev` is the value to roll back to if the write fails (fire-and-forget
+  // previously swallowed errors, leaving the UI out of sync with Firestore).
+  const persistVisibility = useCallback(
+    async (next: string[], prev: string[]) => {
+      setVisibleTo(next)
+      const result = await updateHeirloom(estateId, item.id, { visibleTo: next })
+      if (!result?.success) {
+        setVisibleTo(prev)
+        toast.error(result?.error || 'Could not update visibility. Please try again.')
+      }
+    },
+    [estateId, item.id],
+  )
+
   return (
-    <Card className="rounded-3xl border-slate-100 hover:border-[var(--royal)]/10 transition-all group py-0 overflow-hidden">
+    <Card variant="glass" className="group py-0">
       <CardContent className="p-0">
         {/* Photo / Placeholder */}
-        <div className="relative h-48 bg-slate-50 flex items-center justify-center overflow-hidden">
+        <div className="relative h-48 bg-[var(--royal)]/5 flex items-center justify-center overflow-hidden">
           {hasPhoto ? (
             <img
               src={item.photoUrls[0]}
@@ -288,7 +312,7 @@ function HeirloomCard({ item, estateId, heirs }: { item: Heirloom; estateId: str
         <div className="p-8">
           {/* Name & Value */}
           <div className="flex items-start justify-between mb-4">
-            <h3 className="text-lg font-bold text-slate-900">{item.name}</h3>
+            <h3 className="text-lg font-bold text-[var(--ink)]">{item.name}</h3>
             {item.estimatedValue != null && item.estimatedValue > 0 && (
               <Badge className="px-3 py-1.5 h-auto bg-[var(--gold)]/10 text-[var(--gold)] text-[11px] font-bold rounded-lg border-transparent">
                 <DollarSign className="w-3 h-3" />
@@ -299,19 +323,19 @@ function HeirloomCard({ item, estateId, heirs }: { item: Heirloom; estateId: str
 
           {/* Description */}
           {item.description && (
-            <p className="text-[13px] text-slate-500 line-clamp-2 mb-4">{item.description}</p>
+            <p className="text-[13px] text-[var(--ink-muted)] line-clamp-2 mb-4">{item.description}</p>
           )}
 
           {/* Meta row */}
           <div className="flex flex-wrap gap-4 mb-4">
             {item.designatedHeir && (
-              <div className="flex items-center gap-1.5 text-[12px] text-slate-700">
+              <div className="flex items-center gap-1.5 text-[12px] text-[var(--ink-muted)]">
                 <User className="w-3.5 h-3.5 text-[var(--royal)]/40" />
                 <span className="font-medium">{item.designatedHeir}</span>
               </div>
             )}
             {item.location && (
-              <div className="flex items-center gap-1.5 text-[12px] text-slate-700">
+              <div className="flex items-center gap-1.5 text-[12px] text-[var(--ink-muted)]">
                 <MapPin className="w-3.5 h-3.5 text-[var(--royal)]/40" />
                 <span className="font-medium">{item.location}</span>
               </div>
@@ -320,9 +344,9 @@ function HeirloomCard({ item, estateId, heirs }: { item: Heirloom; estateId: str
 
           {/* Provenance */}
           {item.provenance && (
-            <div className="bg-slate-50 rounded-2xl p-5 mb-4">
+            <div className="bg-[var(--gold)]/8 rounded-2xl p-5 mb-4">
               <p className="text-[11px] font-bold text-[var(--royal)]/40 uppercase tracking-widest mb-2">Provenance</p>
-              <p className="text-[13px] text-slate-700 line-clamp-3">{item.provenance}</p>
+              <p className="text-[13px] text-[var(--ink-muted)] line-clamp-3">{item.provenance}</p>
             </div>
           )}
 
@@ -331,11 +355,11 @@ function HeirloomCard({ item, estateId, heirs }: { item: Heirloom; estateId: str
             <div className="mb-4 pt-3">
               <div className="flex items-center gap-2 mb-2.5">
                 {visibleTo.length === 0 ? (
-                  <Globe className="w-3.5 h-3.5 text-slate-500" />
+                  <Globe className="w-3.5 h-3.5 text-[var(--ink-muted)]" />
                 ) : (
                   <Users className="w-3.5 h-3.5 text-[var(--royal)]" />
                 )}
-                <span className="text-[11px] font-bold text-slate-500 uppercase tracking-widest">
+                <span className="text-[11px] font-bold text-[var(--ink-muted)] uppercase tracking-widest">
                   {visibleTo.length === 0 ? 'Visible to all heirs' : `Visible to ${visibleTo.length} selected`}
                 </span>
               </div>
@@ -343,13 +367,12 @@ function HeirloomCard({ item, estateId, heirs }: { item: Heirloom; estateId: str
                 <button
                   onClick={(e) => {
                     e.stopPropagation()
-                    setVisibleTo([])
-                    updateHeirloom(estateId, item.id, { visibleTo: [] })
+                    void persistVisibility([], visibleTo)
                   }}
                   className={`text-xs px-3 py-1.5 rounded-full border transition-all font-medium ${
                     visibleTo.length === 0
                       ? 'border-[var(--royal)] bg-[var(--royal)]/5 text-[var(--royal)]'
-                      : 'border-slate-200 text-slate-500 hover:border-slate-300'
+                      : 'border-[var(--royal)]/15 text-[var(--ink-muted)] hover:border-[var(--gold)]/40'
                   }`}
                 >
                   Everyone
@@ -364,13 +387,12 @@ function HeirloomCard({ item, estateId, heirs }: { item: Heirloom; estateId: str
                         const next = selected
                           ? visibleTo.filter((n) => n !== heir.id)
                           : [...visibleTo, heir.id]
-                        setVisibleTo(next)
-                        updateHeirloom(estateId, item.id, { visibleTo: next })
+                        void persistVisibility(next, visibleTo)
                       }}
                       className={`text-xs px-3 py-1.5 rounded-full border transition-all font-medium ${
                         selected
                           ? 'border-[var(--royal)] bg-[var(--royal)]/5 text-[var(--royal)]'
-                          : 'border-slate-200 text-slate-500 hover:border-slate-300'
+                          : 'border-[var(--royal)]/15 text-[var(--ink-muted)] hover:border-[var(--gold)]/40'
                       }`}
                     >
                       {heir.fullName}
@@ -381,7 +403,7 @@ function HeirloomCard({ item, estateId, heirs }: { item: Heirloom; estateId: str
             </div>
           )}
 
-          <Separator className="bg-slate-50 mb-4" />
+          <Separator className="bg-[var(--royal)]/5 mb-4" />
 
           {/* Archive action */}
           <div className="flex justify-end">
@@ -391,7 +413,7 @@ function HeirloomCard({ item, estateId, heirs }: { item: Heirloom; estateId: str
                 <Button variant="destructive" size="xs" onClick={handleArchive} className="text-[12px] font-bold">
                   Yes
                 </Button>
-                <Button variant="ghost" size="xs" onClick={() => setConfirming(false)} className="text-[12px] font-bold text-slate-500">
+                <Button variant="ghost" size="xs" onClick={() => setConfirming(false)} className="text-[12px] font-bold text-[var(--ink-muted)]">
                   No
                 </Button>
               </div>
@@ -402,7 +424,7 @@ function HeirloomCard({ item, estateId, heirs }: { item: Heirloom; estateId: str
                 onClick={() => setConfirming(true)}
                 className="opacity-0 group-hover:opacity-100 transition-opacity"
               >
-                <Archive className="w-4 h-4 text-slate-400 hover:text-[#DC2626]" />
+                <Archive className="w-4 h-4 text-[var(--ink-muted)]/60 hover:text-[#DC2626]" />
               </Button>
             )}
           </div>
@@ -604,7 +626,7 @@ function AddHeirloomModal({ estateId, open, onOpenChange }: { estateId: string;
         className="sm:max-w-2xl max-h-[90vh] overflow-y-auto rounded-3xl p-10"
       >
         <DialogHeader>
-          <DialogTitle className="text-2xl font-[family-name:var(--font-cinzel)] font-bold text-slate-900">
+          <DialogTitle className="text-2xl font-[family-name:var(--font-cinzel)] font-bold text-[var(--ink)]">
             Add Heirloom
           </DialogTitle>
           <DialogDescription>
@@ -622,7 +644,7 @@ function AddHeirloomModal({ estateId, open, onOpenChange }: { estateId: string;
               value={form.name}
               onChange={(e) => setForm((f) => ({ ...f, name: e.target.value }))}
               placeholder="e.g., Grandmother's Diamond Ring, Steinway Grand Piano"
-              className="px-5 py-4 h-auto rounded-2xl border-slate-200 text-[14px] text-slate-900"
+              className="px-5 py-4 h-auto rounded-2xl border-[var(--royal)]/15 text-[14px] text-[var(--ink)]"
             />
           </div>
 
@@ -632,7 +654,7 @@ function AddHeirloomModal({ estateId, open, onOpenChange }: { estateId: string;
               Category
             </Label>
             <Select value={form.category} onValueChange={(v) => setForm((f) => ({ ...f, category: v as CategoryValue }))}>
-              <SelectTrigger className="w-full px-5 py-4 h-auto rounded-2xl border-slate-200 text-[14px] text-slate-900">
+              <SelectTrigger className="w-full px-5 py-4 h-auto rounded-2xl border-[var(--royal)]/15 text-[14px] text-[var(--ink)]">
                 <SelectValue placeholder="Select a category" />
               </SelectTrigger>
               <SelectContent>
@@ -655,7 +677,7 @@ function AddHeirloomModal({ estateId, open, onOpenChange }: { estateId: string;
               onChange={(e) => setForm((f) => ({ ...f, description: e.target.value }))}
               placeholder="Describe the item — materials, condition, distinguishing features..."
               rows={3}
-              className="px-5 py-4 rounded-2xl border-slate-200 text-[14px] text-slate-900 resize-none"
+              className="px-5 py-4 rounded-2xl border-[var(--royal)]/15 text-[14px] text-[var(--ink)] resize-none"
             />
           </div>
 
@@ -670,7 +692,7 @@ function AddHeirloomModal({ estateId, open, onOpenChange }: { estateId: string;
                 value={form.estimatedValue}
                 onChange={(e) => setForm((f) => ({ ...f, estimatedValue: e.target.value }))}
                 placeholder="$0"
-                className="px-5 py-4 h-auto rounded-2xl border-slate-200 text-[14px] text-slate-900"
+                className="px-5 py-4 h-auto rounded-2xl border-[var(--royal)]/15 text-[14px] text-[var(--ink)]"
               />
             </div>
             <div className="space-y-2">
@@ -681,7 +703,7 @@ function AddHeirloomModal({ estateId, open, onOpenChange }: { estateId: string;
                 value={form.designatedHeir}
                 onChange={(e) => setForm((f) => ({ ...f, designatedHeir: e.target.value }))}
                 placeholder="Name of the intended recipient"
-                className="px-5 py-4 h-auto rounded-2xl border-slate-200 text-[14px] text-slate-900"
+                className="px-5 py-4 h-auto rounded-2xl border-[var(--royal)]/15 text-[14px] text-[var(--ink)]"
               />
             </div>
           </div>
@@ -695,7 +717,7 @@ function AddHeirloomModal({ estateId, open, onOpenChange }: { estateId: string;
               value={form.location}
               onChange={(e) => setForm((f) => ({ ...f, location: e.target.value }))}
               placeholder="Where is the item kept? e.g., Master bedroom safe, Storage unit #42"
-              className="px-5 py-4 h-auto rounded-2xl border-slate-200 text-[14px] text-slate-900"
+              className="px-5 py-4 h-auto rounded-2xl border-[var(--royal)]/15 text-[14px] text-[var(--ink)]"
             />
           </div>
 
@@ -709,7 +731,7 @@ function AddHeirloomModal({ estateId, open, onOpenChange }: { estateId: string;
               onChange={(e) => setForm((f) => ({ ...f, provenance: e.target.value }))}
               placeholder="The history and story behind this item — where it came from, who owned it, why it matters..."
               rows={3}
-              className="px-5 py-4 rounded-2xl border-slate-200 text-[14px] text-slate-900 resize-none"
+              className="px-5 py-4 rounded-2xl border-[var(--royal)]/15 text-[14px] text-[var(--ink)] resize-none"
             />
           </div>
 
@@ -725,7 +747,7 @@ function AddHeirloomModal({ estateId, open, onOpenChange }: { estateId: string;
               className={`
                 border-2 border-dashed rounded-2xl p-8 text-center cursor-pointer transition-all
                 ${photoUploads.length >= MAX_IMAGES
-                  ? 'border-slate-200 bg-slate-50 cursor-not-allowed opacity-60'
+                  ? 'border-[var(--royal)]/15 bg-[var(--royal)]/5 cursor-not-allowed opacity-60'
                   : isDragActive
                     ? 'border-[var(--royal)] bg-[var(--royal)]/5 scale-[1.01]'
                     : 'border-[var(--royal)]/20 hover:border-[var(--royal)]/40 hover:bg-[var(--royal)]/[0.02]'
@@ -736,13 +758,13 @@ function AddHeirloomModal({ estateId, open, onOpenChange }: { estateId: string;
               <div className="flex flex-col items-center gap-3">
                 <div
                   className={`w-12 h-12 rounded-2xl flex items-center justify-center transition-all ${
-                    isDragActive ? 'bg-[var(--royal)] text-white' : 'bg-slate-50 text-[var(--royal)] border border-[var(--royal)]/10'
+                    isDragActive ? 'bg-[var(--royal)] text-white' : 'bg-[var(--royal)]/5 text-[var(--royal)] border border-[var(--royal)]/10'
                   }`}
                 >
                   <Upload className="w-5 h-5" />
                 </div>
                 <div>
-                  <p className="text-slate-900 font-bold text-[14px]">
+                  <p className="text-[var(--ink)] font-bold text-[14px]">
                     {photoUploads.length >= MAX_IMAGES
                       ? 'Maximum photos reached'
                       : isDragActive
@@ -767,7 +789,7 @@ function AddHeirloomModal({ estateId, open, onOpenChange }: { estateId: string;
               <div className="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5 gap-2 sm:gap-3">
                 {photoUploads.map((upload, i) => (
                   <div key={`${upload.file.name}-${i}`} className="relative group">
-                    <div className="aspect-square rounded-xl overflow-hidden border border-[var(--royal)]/10 bg-slate-50">
+                    <div className="aspect-square rounded-xl overflow-hidden border border-[var(--royal)]/10 bg-[var(--royal)]/5">
                       <img
                         src={upload.previewUrl}
                         alt={upload.file.name}
@@ -805,7 +827,7 @@ function AddHeirloomModal({ estateId, open, onOpenChange }: { estateId: string;
                     <button
                       type="button"
                       onClick={() => removePhoto(upload.file)}
-                      className="absolute -top-1.5 -right-1.5 w-5 h-5 bg-slate-900 text-white rounded-full flex items-center justify-center opacity-0 group-hover:opacity-100 transition-opacity hover:bg-red-500"
+                      className="absolute -top-1.5 -right-1.5 w-5 h-5 bg-[var(--royal)] text-white rounded-full flex items-center justify-center opacity-0 group-hover:opacity-100 transition-opacity hover:bg-red-500"
                     >
                       <X className="w-3 h-3" />
                     </button>
@@ -815,7 +837,7 @@ function AddHeirloomModal({ estateId, open, onOpenChange }: { estateId: string;
             )}
 
             {/* Manual URL fallback */}
-            <Separator className="bg-slate-100" />
+            <Separator className="bg-[var(--royal)]/10" />
             <div className="space-y-2">
               <p className="text-[11px] font-bold text-[var(--royal)]/40 uppercase tracking-widest">
                 Or paste image URLs directly
@@ -824,19 +846,19 @@ function AddHeirloomModal({ estateId, open, onOpenChange }: { estateId: string;
                 value={form.manualUrls}
                 onChange={(e) => setForm((f) => ({ ...f, manualUrls: e.target.value }))}
                 placeholder="https://example.com/photo1.jpg, https://example.com/photo2.jpg"
-                className="px-5 py-3 h-auto rounded-2xl border-slate-200 text-[13px] text-slate-900"
+                className="px-5 py-3 h-auto rounded-2xl border-[var(--royal)]/15 text-[13px] text-[var(--ink)]"
               />
-              <p className="text-[11px] text-slate-400">Separate multiple URLs with commas.</p>
+              <p className="text-[11px] text-[var(--ink-muted)]/60">Separate multiple URLs with commas.</p>
             </div>
           </div>
         </div>
 
         {/* Actions */}
-        <DialogFooter className="gap-4 pt-8 border-t border-slate-100">
+        <DialogFooter className="gap-4 pt-8 border-t border-[var(--royal)]/10">
           <Button
             variant="ghost"
             onClick={() => onOpenChange(false)}
-            className="px-8 py-4 h-auto rounded-2xl text-[14px] font-bold text-slate-500"
+            className="px-8 py-4 h-auto rounded-2xl text-[14px] font-bold text-[var(--ink-muted)]"
           >
             Cancel
           </Button>
diff --git a/web/src/routes/estates.$estateId.life-chapters.tsx b/web/src/routes/estates.$estateId.life-chapters.tsx
index 66dbaa3..9aef8cb 100644
--- a/web/src/routes/estates.$estateId.life-chapters.tsx
+++ b/web/src/routes/estates.$estateId.life-chapters.tsx
@@ -186,8 +186,12 @@ function LifeChaptersPage() {
     const chapter = chapters.find((c) => c.id === chapterId)
     if (!chapter) return
     const updatedRefs = (chapter.entryRefs || []).filter((e) => e.docId !== docId)
-    await updateLifeChapter(estateId, chapterId, { entryRefs: updatedRefs })
-    toast.success('Entry removed')
+    const result = await updateLifeChapter(estateId, chapterId, { entryRefs: updatedRefs })
+    if (result.success) {
+      toast.success('Entry removed')
+    } else {
+      toast.error(result.error || 'Could not remove entry.')
+    }
   }, [estateId, chapters])
 
   // Available entries not yet assigned to the expanded chapter
@@ -234,7 +238,7 @@ function LifeChaptersPage() {
       <div className="flex items-center justify-center h-[50vh]">
         <div className="flex flex-col items-center gap-4">
           <div className="w-10 h-10 border-2 border-[var(--royal)]/20 border-t-[var(--royal)] rounded-full animate-spin" />
-          <span className="text-[11px] font-semibold text-slate-500 uppercase tracking-[0.2em]">Loading chapters...</span>
+          <span className="text-[11px] font-semibold text-ink-muted uppercase tracking-[0.2em]">Loading chapters...</span>
         </div>
       </div>
     )
@@ -283,7 +287,7 @@ function LifeChaptersPage() {
 
       {/* Delete Confirmation */}
       <AlertDialog open={!!deleteTarget} onOpenChange={(open) => { if (!open) setDeleteTarget(null) }}>
-        <AlertDialogContent className="rounded-3xl border-slate-100">
+        <AlertDialogContent className="rounded-3xl border-neutral-border">
           <AlertDialogHeader>
             <AlertDialogTitle className="font-[family-name:var(--font-cinzel)]">Archive Chapter</AlertDialogTitle>
             <AlertDialogDescription>
@@ -306,10 +310,10 @@ function LifeChaptersPage() {
             <div className="w-24 h-24 bg-[var(--gold)]/5 rounded-3xl flex items-center justify-center mx-auto mb-8">
               <BookOpen className="w-12 h-12 text-[var(--gold)]/30" />
             </div>
-            <h3 className="text-xl font-bold text-slate-900 mb-3 font-[family-name:var(--font-cinzel)]">
+            <h3 className="text-xl font-bold text-royal mb-3 font-[family-name:var(--font-cinzel)]">
               Your Story Begins Here
             </h3>
-            <p className="text-slate-500 max-w-md mx-auto mb-8 leading-relaxed">
+            <p className="text-ink-muted max-w-md mx-auto mb-8 leading-relaxed">
               Organize your life into meaningful chapters — childhood memories, career milestones, parenthood, adventures.
               Each chapter becomes a curated story for the people you love.
             </p>
@@ -334,7 +338,7 @@ function LifeChaptersPage() {
             return (
               <Card
                 key={chapter.id}
-                className="rounded-3xl border-slate-100 shadow-sm overflow-hidden hover:shadow-md transition-shadow"
+                className="rounded-3xl border-neutral-border shadow-sm overflow-hidden hover:shadow-md transition-shadow"
               >
                 {/* Cover Image */}
                 {chapter.coverImageUrl && (
@@ -351,7 +355,7 @@ function LifeChaptersPage() {
                 <button
                   type="button"
                   onClick={() => setExpandedId(isExpanded ? null : chapter.id)}
-                  className="w-full text-left p-6 md:p-8 hover:bg-slate-50/50 transition-colors cursor-pointer"
+                  className="w-full text-left p-6 md:p-8 hover:bg-neutral-faint/50 transition-colors cursor-pointer"
                 >
                   <div className="flex items-start gap-5">
                     {/* Chapter number */}
@@ -363,7 +367,7 @@ function LifeChaptersPage() {
 
                     <div className="flex-1 min-w-0">
                       <div className="flex items-center gap-3 mb-1.5">
-                        <h3 className="text-xl font-bold text-slate-900 font-[family-name:var(--font-cinzel)] tracking-tight">
+                        <h3 className="text-xl font-bold text-royal font-[family-name:var(--font-cinzel)] tracking-tight">
                           {chapter.title}
                         </h3>
                         {dateRange && (
@@ -373,9 +377,9 @@ function LifeChaptersPage() {
                           </Badge>
                         )}
                       </div>
-                      <p className="text-sm text-slate-500 line-clamp-2">{chapter.description}</p>
+                      <p className="text-sm text-ink-muted line-clamp-2">{chapter.description}</p>
                       <div className="flex items-center gap-4 mt-3">
-                        <span className="text-[11px] font-semibold text-slate-500 uppercase tracking-wider">
+                        <span className="text-[11px] font-semibold text-ink-muted uppercase tracking-wider">
                           {entryCount} {entryCount === 1 ? 'entry' : 'entries'}
                         </span>
                       </div>
@@ -388,7 +392,7 @@ function LifeChaptersPage() {
                           <Button
                             variant="ghost"
                             size="icon"
-                            className="h-8 w-8 text-slate-500 hover:text-[var(--royal)] hover:bg-[var(--royal)]/5 rounded-xl"
+                            className="h-8 w-8 text-ink-muted hover:text-[var(--royal)] hover:bg-[var(--royal)]/5 rounded-xl"
                             onClick={(e) => { e.stopPropagation(); setEditingChapter(chapter) }}
                           >
                             <Pencil className="w-4 h-4" />
@@ -396,21 +400,21 @@ function LifeChaptersPage() {
                           <Button
                             variant="ghost"
                             size="icon"
-                            className="h-8 w-8 text-slate-500 hover:text-red-500 hover:bg-red-50 rounded-xl"
+                            className="h-8 w-8 text-ink-muted hover:text-red-500 hover:bg-red-50 rounded-xl"
                             onClick={(e) => { e.stopPropagation(); setDeleteTarget(chapter) }}
                           >
                             <Trash2 className="w-4 h-4" />
                           </Button>
                         </>
                       )}
-                      <ChevronRight className={`w-5 h-5 text-slate-500/40 transition-transform ${isExpanded ? 'rotate-90' : ''}`} />
+                      <ChevronRight className={`w-5 h-5 text-ink-muted/40 transition-transform ${isExpanded ? 'rotate-90' : ''}`} />
                     </div>
                   </div>
                 </button>
 
                 {/* Expanded: entries + add */}
                 {isExpanded && (
-                  <div className="border-t border-slate-50 bg-slate-50/50">
+                  <div className="border-t border-neutral-faint bg-neutral-faint/50">
                     {/* Existing entries */}
                     {entryCount > 0 && (
                       <div className="px-6 md:px-8 py-4 space-y-2">
@@ -421,19 +425,19 @@ function LifeChaptersPage() {
                               key={`${ref.collection}:${ref.docId}`}
                               className="flex items-center gap-3 py-2.5 px-4 rounded-xl hover:bg-white transition-colors group"
                             >
-                              <GripVertical className="w-4 h-4 text-slate-200 group-hover:text-slate-400" />
+                              <GripVertical className="w-4 h-4 text-white/70 group-hover:text-ink-muted" />
                               <div className="w-8 h-8 rounded-lg bg-[var(--gold)]/5 flex items-center justify-center">
                                 <Icon className="w-4 h-4 text-[var(--gold)]/60" />
                               </div>
-                              <span className="flex-1 text-sm text-slate-900 font-medium truncate">{ref.title}</span>
-                              <Badge variant="outline" className="text-[10px] text-slate-500 border-slate-200 rounded-md">
+                              <span className="flex-1 text-sm text-ink font-medium truncate">{ref.title}</span>
+                              <Badge variant="outline" className="text-[10px] text-ink-muted border-neutral-border rounded-md">
                                 {ref.collection.replace('-', ' ')}
                               </Badge>
                               {canEdit && (
                                 <Button
                                   variant="ghost"
                                   size="icon"
-                                  className="h-7 w-7 text-slate-300 hover:text-red-400 opacity-0 group-hover:opacity-100 transition-opacity"
+                                  className="h-7 w-7 text-ink-muted hover:text-red-400 opacity-0 group-hover:opacity-100 transition-opacity"
                                   onClick={() => handleRemoveEntry(chapter.id, ref.docId)}
                                 >
                                   <Trash2 className="w-3.5 h-3.5" />
@@ -446,12 +450,12 @@ function LifeChaptersPage() {
                     )}
 
                     {/* Add entries section — only for editors */}
-                    {canEdit && <div className="px-6 md:px-8 py-4 border-t border-slate-50">
-                      <p className="text-[11px] font-bold text-slate-500 uppercase tracking-[0.15em] mb-3">
+                    {canEdit && <div className="px-6 md:px-8 py-4 border-t border-neutral-faint">
+                      <p className="text-[11px] font-bold text-ink-muted uppercase tracking-[0.15em] mb-3">
                         Add entries to this chapter
                       </p>
                       {availableEntries.length === 0 ? (
-                        <p className="text-sm text-slate-400 py-2">
+                        <p className="text-sm text-ink-muted py-2">
                           No unassigned entries available. Create new entries in Soul Log or Memories first.
                         </p>
                       ) : (
@@ -471,7 +475,7 @@ function LifeChaptersPage() {
                                 className="flex items-center gap-3 py-2.5 px-3 rounded-xl border border-dashed border-[var(--royal)]/15 hover:border-[var(--royal)]/40 hover:bg-[var(--royal)]/5 transition-all text-left cursor-pointer"
                               >
                                 <Icon className="w-4 h-4 text-[var(--gold)]/40" />
-                                <span className="flex-1 text-sm text-slate-500 truncate">{entry.label}</span>
+                                <span className="flex-1 text-sm text-ink-muted truncate">{entry.label}</span>
                                 <Plus className="w-4 h-4 text-[var(--gold)]/30" />
                               </button>
                             )
@@ -606,7 +610,7 @@ function ChapterFormDialog({
 
   return (
     <Dialog open={open} onOpenChange={onOpenChange} key={resetKey}>
-      <DialogContent className="rounded-3xl border-slate-100 max-w-lg">
+      <DialogContent className="rounded-3xl border-neutral-border max-w-lg">
         <DialogHeader>
           <DialogTitle className="text-xl font-[family-name:var(--font-cinzel)]">
             {chapter ? 'Edit Chapter' : 'New Life Chapter'}
@@ -621,7 +625,7 @@ function ChapterFormDialog({
         <div className="space-y-5 py-2">
           {/* Cover Image */}
           <div className="space-y-2">
-            <Label className="text-sm font-semibold text-slate-900">
+            <Label className="text-sm font-semibold text-ink">
               Cover Image (optional)
             </Label>
             <input
@@ -632,7 +636,7 @@ function ChapterFormDialog({
               className="hidden"
             />
             {coverPreview ? (
-              <div className="relative h-32 rounded-xl overflow-hidden border border-slate-200">
+              <div className="relative h-32 rounded-xl overflow-hidden border border-neutral-border">
                 <img src={coverPreview} alt="Cover" className="w-full h-full object-cover" />
                 <Button
                   variant="ghost"
@@ -647,7 +651,7 @@ function ChapterFormDialog({
               <button
                 type="button"
                 onClick={() => fileInputRef.current?.click()}
-                className="w-full h-24 rounded-xl border-2 border-dashed border-[var(--royal)]/15 hover:border-[var(--royal)]/30 bg-slate-50/50 flex items-center justify-center gap-2 text-sm text-[var(--royal)]/50 hover:text-[var(--royal)]/80 transition-colors cursor-pointer"
+                className="w-full h-24 rounded-xl border-2 border-dashed border-[var(--royal)]/15 hover:border-[var(--royal)]/30 bg-neutral-faint/50 flex items-center justify-center gap-2 text-sm text-[var(--royal)]/50 hover:text-[var(--royal)]/80 transition-colors cursor-pointer"
               >
                 <ImagePlus className="w-5 h-5" />
                 Choose a cover photo
@@ -656,7 +660,7 @@ function ChapterFormDialog({
           </div>
 
           <div className="space-y-2">
-            <Label htmlFor="chapter-title" className="text-sm font-semibold text-slate-900">
+            <Label htmlFor="chapter-title" className="text-sm font-semibold text-ink">
               Chapter Title
             </Label>
             <Input
@@ -664,12 +668,12 @@ function ChapterFormDialog({
               value={title}
               onChange={(e) => setTitle(e.target.value)}
               placeholder="e.g., Growing Up in Chicago"
-              className="rounded-xl border-slate-200"
+              className="rounded-xl border-neutral-border"
             />
           </div>
 
           <div className="space-y-2">
-            <Label htmlFor="chapter-desc" className="text-sm font-semibold text-slate-900">
+            <Label htmlFor="chapter-desc" className="text-sm font-semibold text-ink">
               Description
             </Label>
             <Textarea
@@ -677,13 +681,13 @@ function ChapterFormDialog({
               value={description}
               onChange={(e) => setDescription(e.target.value)}
               placeholder="What does this chapter of your life mean to you?"
-              className="rounded-xl border-slate-200 min-h-[80px]"
+              className="rounded-xl border-neutral-border min-h-[80px]"
             />
           </div>
 
           <div className="grid grid-cols-2 gap-4">
             <div className="space-y-2">
-              <Label htmlFor="date-from" className="text-sm font-semibold text-slate-900">
+              <Label htmlFor="date-from" className="text-sm font-semibold text-ink">
                 From
               </Label>
               <Input
@@ -691,11 +695,11 @@ function ChapterFormDialog({
                 type="date"
                 value={dateFrom}
                 onChange={(e) => setDateFrom(e.target.value)}
-                className="rounded-xl border-slate-200"
+                className="rounded-xl border-neutral-border"
               />
             </div>
             <div className="space-y-2">
-              <Label htmlFor="date-to" className="text-sm font-semibold text-slate-900">
+              <Label htmlFor="date-to" className="text-sm font-semibold text-ink">
                 To
               </Label>
               <Input
@@ -703,7 +707,7 @@ function ChapterFormDialog({
                 type="date"
                 value={dateTo}
                 onChange={(e) => setDateTo(e.target.value)}
-                className="rounded-xl border-slate-200"
+                className="rounded-xl border-neutral-border"
               />
             </div>
           </div>
diff --git a/web/src/routes/estates.$estateId.lockbox.lazy.tsx b/web/src/routes/estates.$estateId.lockbox.lazy.tsx
index 2ca8c05..aef25b3 100644
--- a/web/src/routes/estates.$estateId.lockbox.lazy.tsx
+++ b/web/src/routes/estates.$estateId.lockbox.lazy.tsx
@@ -3,6 +3,7 @@ import { createLazyFileRoute, useParams } from '@tanstack/react-router'
 import { useState, useMemo, useCallback, useEffect, useRef } from 'react'
 import { useLockboxItems, type LockboxItem } from '../lib/firestore'
 import { addLockboxItem, archiveLockboxItem, updateLockboxItem } from '../lib/estate-actions'
+import { API_BASE } from '../lib/client'
 import { toast } from 'sonner'
 import { getAuth } from 'firebase/auth'
 import {
@@ -39,8 +40,6 @@ import { Switch } from '@/components/ui/switch'
 import { Badge } from '@/components/ui/badge'
 import { Textarea } from '@/components/ui/textarea'
 
-const API_BASE = import.meta.env.VITE_API_URL || 'http://localhost:8080'
-
 interface DecryptedCredentials {
   username?: string
   password?: string
@@ -169,7 +168,7 @@ function LockboxPage() {
         action={
           <Button
             onClick={() => setModalOpen(true)}
-            className="bg-slate-700 hover:bg-slate-800 text-white px-10 py-5 h-auto rounded-2xl font-bold text-[14px] shadow-lg"
+            className="bg-[var(--royal)] hover:bg-[var(--royal-blue)] text-white px-10 py-5 h-auto rounded-2xl font-bold text-[14px] shadow-lg"
           >
             <Plus className="w-5 h-5" />
             Add Credential
@@ -184,15 +183,15 @@ function LockboxPage() {
           { label: 'Secured', value: stats.secure, icon: ShieldCheck },
           { label: 'Categories', value: stats.categories, icon: CreditCard },
         ].map((s) => (
-          <Card key={s.label} className="bg-slate-50 rounded-3xl border-slate-100 py-0">
+          <Card key={s.label} className="bg-neutral-faint rounded-3xl border-neutral-border py-0">
             <CardContent className="p-8">
               <div className="flex items-center gap-4">
                 <div className="w-12 h-12 bg-[var(--royal)]/5 rounded-2xl flex items-center justify-center">
                   <s.icon className="w-5 h-5 text-[var(--royal)]" />
                 </div>
                 <div>
-                  <p className="text-3xl font-bold text-slate-900">{s.value}</p>
-                  <p className="text-[11px] font-bold text-slate-500 uppercase tracking-widest">{s.label}</p>
+                  <p className="text-3xl font-bold text-[var(--royal)]">{s.value}</p>
+                  <p className="text-[11px] font-bold text-[var(--royal)]/60 uppercase tracking-widest">{s.label}</p>
                 </div>
               </div>
             </CardContent>
@@ -205,7 +204,7 @@ function LockboxPage() {
         <Button
           variant={filterCategory === 'all' ? 'default' : 'secondary'}
           onClick={() => setFilterCategory('all')}
-          className={`px-5 py-2.5 h-auto rounded-xl text-[12px] font-bold uppercase tracking-wider ${filterCategory === 'all' ? 'bg-[var(--royal)] text-white hover:bg-[var(--royal-blue)]' : 'bg-slate-100 text-slate-700 hover:bg-slate-200'}`}
+          className={`px-5 py-2.5 h-auto rounded-xl text-[12px] font-bold uppercase tracking-wider ${filterCategory === 'all' ? 'bg-[var(--royal)] text-white hover:bg-[var(--royal-blue)]' : 'bg-neutral-faint text-[var(--royal)]/70 hover:bg-[var(--neutral-border)]'}`}
         >
           All
         </Button>
@@ -214,7 +213,7 @@ function LockboxPage() {
             key={c.value}
             variant={filterCategory === c.value ? 'default' : 'secondary'}
             onClick={() => setFilterCategory(c.value)}
-            className={`px-5 py-2.5 h-auto rounded-xl text-[12px] font-bold uppercase tracking-wider ${filterCategory === c.value ? 'bg-[var(--royal)] text-white hover:bg-[var(--royal-blue)]' : 'bg-slate-100 text-slate-700 hover:bg-slate-200'}`}
+            className={`px-5 py-2.5 h-auto rounded-xl text-[12px] font-bold uppercase tracking-wider ${filterCategory === c.value ? 'bg-[var(--royal)] text-white hover:bg-[var(--royal-blue)]' : 'bg-neutral-faint text-[var(--royal)]/70 hover:bg-[var(--neutral-border)]'}`}
           >
             <c.icon className="w-3.5 h-3.5" />
             {c.label}
@@ -303,12 +302,17 @@ function LockboxCard({ item, estateId }: { item: LockboxItem; estateId: string }
   }, [])
 
   const handleArchive = useCallback(async () => {
-    await archiveLockboxItem(estateId, item.id)
-    setConfirming(false)
+    const result = await archiveLockboxItem(estateId, item.id)
+    if (result.success) {
+      setConfirming(false)
+      toast.success('Account removed')
+    } else {
+      toast.error(result.error || 'Could not remove. Please try again.')
+    }
   }, [estateId, item.id])
 
   return (
-    <Card className="rounded-3xl border-slate-100 hover:border-[var(--royal)]/10 transition-all group py-0">
+    <Card className="rounded-3xl border-neutral-border hover:border-[var(--royal)]/10 transition-all group py-0">
       <CardContent className="p-8">
         <div className="flex items-start justify-between mb-6">
           <div className="flex items-center gap-4">
@@ -316,8 +320,8 @@ function LockboxCard({ item, estateId }: { item: LockboxItem; estateId: string }
               <Icon className="w-5 h-5" style={{ color: cat.color }} />
             </div>
             <div>
-              <h3 className="text-lg font-bold text-slate-900">{item.accountName}</h3>
-              {item.institution && <p className="text-[13px] text-slate-500 font-medium">{item.institution}</p>}
+              <h3 className="text-lg font-bold text-[var(--royal)]">{item.accountName}</h3>
+              {item.institution && <p className="text-[13px] text-[var(--royal)]/60 font-medium">{item.institution}</p>}
             </div>
           </div>
           <div className="flex items-center gap-2">
@@ -336,20 +340,20 @@ function LockboxCard({ item, estateId }: { item: LockboxItem; estateId: string }
         </div>
 
         {item.accountIdentifier && (
-          <p className="text-[13px] text-slate-700 mb-3">
-            <span className="text-slate-500">Identifier:</span> {item.accountIdentifier}
+          <p className="text-[13px] text-[var(--royal)]/70 mb-3">
+            <span className="text-[var(--royal)]/60">Identifier:</span> {item.accountIdentifier}
           </p>
         )}
 
         {item.transitionInstructions && (
-          <div className="bg-slate-50 rounded-2xl p-5 mb-4">
+          <div className="bg-neutral-faint rounded-2xl p-5 mb-4">
             <p className="text-[11px] font-bold text-[var(--royal)]/40 uppercase tracking-widest mb-2">Transition Instructions</p>
-            <p className="text-[13px] text-slate-700 line-clamp-3">{item.transitionInstructions}</p>
+            <p className="text-[13px] text-[var(--royal)]/70 line-clamp-3">{item.transitionInstructions}</p>
           </div>
         )}
 
         {item.notes && (
-          <p className="text-[13px] text-slate-500 line-clamp-2 mb-4">{item.notes}</p>
+          <p className="text-[13px] text-[var(--royal)]/60 line-clamp-2 mb-4">{item.notes}</p>
         )}
 
         {/* Reveal Credentials Button */}
@@ -388,7 +392,7 @@ function LockboxCard({ item, estateId }: { item: LockboxItem; estateId: string }
                   variant="ghost"
                   size="xs"
                   onClick={handleHideCredentials}
-                  className="text-[11px] text-slate-500 hover:text-[#DC2626] font-bold"
+                  className="text-[11px] text-[var(--royal)]/60 hover:text-[#DC2626] font-bold"
                 >
                   Hide
                 </Button>
@@ -397,27 +401,27 @@ function LockboxCard({ item, estateId }: { item: LockboxItem; estateId: string }
 
             {credentials.username && (
               <div className="flex items-center gap-3">
-                <User className="w-3.5 h-3.5 text-slate-500 shrink-0" />
+                <User className="w-3.5 h-3.5 text-[var(--royal)]/60 shrink-0" />
                 <div>
-                  <p className="text-[10px] font-bold text-slate-500 uppercase tracking-widest">Username</p>
-                  <p className="text-[13px] text-slate-900 font-mono">{credentials.username}</p>
+                  <p className="text-[10px] font-bold text-[var(--royal)]/60 uppercase tracking-widest">Username</p>
+                  <p className="text-[13px] text-[var(--royal)] font-mono">{credentials.username}</p>
                 </div>
               </div>
             )}
 
             {credentials.password && (
               <div className="flex items-center gap-3">
-                <KeyRound className="w-3.5 h-3.5 text-slate-500 shrink-0" />
+                <KeyRound className="w-3.5 h-3.5 text-[var(--royal)]/60 shrink-0" />
                 <div className="flex-1 min-w-0">
-                  <p className="text-[10px] font-bold text-slate-500 uppercase tracking-widest">Password</p>
+                  <p className="text-[10px] font-bold text-[var(--royal)]/60 uppercase tracking-widest">Password</p>
                   <div className="flex items-center gap-2">
-                    <p className="text-[13px] text-slate-900 font-mono truncate">
+                    <p className="text-[13px] text-[var(--royal)] font-mono truncate">
                       {showPassword ? credentials.password : '\u2022'.repeat(Math.min(credentials.password.length, 20))}
                     </p>
                     <button
                       type="button"
                       onClick={() => setShowPassword((v) => !v)}
-                      className="text-slate-500 hover:text-[var(--royal)] transition-colors shrink-0"
+                      className="text-[var(--royal)]/60 hover:text-[var(--royal)] transition-colors shrink-0"
                     >
                       {showPassword ? <EyeOff className="w-3.5 h-3.5" /> : <Eye className="w-3.5 h-3.5" />}
                     </button>
@@ -428,17 +432,17 @@ function LockboxCard({ item, estateId }: { item: LockboxItem; estateId: string }
 
             {credentials.pin && (
               <div className="flex items-center gap-3">
-                <Lock className="w-3.5 h-3.5 text-slate-500 shrink-0" />
+                <Lock className="w-3.5 h-3.5 text-[var(--royal)]/60 shrink-0" />
                 <div className="flex-1 min-w-0">
-                  <p className="text-[10px] font-bold text-slate-500 uppercase tracking-widest">PIN</p>
+                  <p className="text-[10px] font-bold text-[var(--royal)]/60 uppercase tracking-widest">PIN</p>
                   <div className="flex items-center gap-2">
-                    <p className="text-[13px] text-slate-900 font-mono">
+                    <p className="text-[13px] text-[var(--royal)] font-mono">
                       {showPin ? credentials.pin : '\u2022'.repeat(credentials.pin.length)}
                     </p>
                     <button
                       type="button"
                       onClick={() => setShowPin((v) => !v)}
-                      className="text-slate-500 hover:text-[var(--royal)] transition-colors shrink-0"
+                      className="text-[var(--royal)]/60 hover:text-[var(--royal)] transition-colors shrink-0"
                     >
                       {showPin ? <EyeOff className="w-3.5 h-3.5" /> : <Eye className="w-3.5 h-3.5" />}
                     </button>
@@ -449,24 +453,24 @@ function LockboxCard({ item, estateId }: { item: LockboxItem; estateId: string }
 
             {credentials.notes && (
               <div className="flex items-start gap-3">
-                <FileText className="w-3.5 h-3.5 text-slate-500 shrink-0 mt-0.5" />
+                <FileText className="w-3.5 h-3.5 text-[var(--royal)]/60 shrink-0 mt-0.5" />
                 <div>
-                  <p className="text-[10px] font-bold text-slate-500 uppercase tracking-widest">Secure Notes</p>
-                  <p className="text-[13px] text-slate-900 font-mono whitespace-pre-wrap">{credentials.notes}</p>
+                  <p className="text-[10px] font-bold text-[var(--royal)]/60 uppercase tracking-widest">Secure Notes</p>
+                  <p className="text-[13px] text-[var(--royal)] font-mono whitespace-pre-wrap">{credentials.notes}</p>
                 </div>
               </div>
             )}
           </div>
         )}
 
-        <div className="flex justify-end pt-2 border-t border-slate-50">
+        <div className="flex justify-end pt-2 border-t border-neutral-faint">
           {confirming ? (
             <div className="flex items-center gap-3">
               <span className="text-[12px] text-[#DC2626] font-medium">Archive this item?</span>
               <Button variant="destructive" size="xs" onClick={handleArchive} className="text-[12px] font-bold">
                 Yes
               </Button>
-              <Button variant="ghost" size="xs" onClick={() => setConfirming(false)} className="text-[12px] font-bold text-slate-500">
+              <Button variant="ghost" size="xs" onClick={() => setConfirming(false)} className="text-[12px] font-bold text-[var(--royal)]/60">
                 No
               </Button>
             </div>
@@ -478,7 +482,7 @@ function LockboxCard({ item, estateId }: { item: LockboxItem; estateId: string }
                 onClick={() => setEditOpen(true)}
                 aria-label="Edit item"
               >
-                <Pencil className="w-4 h-4 text-slate-400 hover:text-[var(--royal)]" />
+                <Pencil className="w-4 h-4 text-[var(--royal)]/40 hover:text-[var(--royal)]" />
               </Button>
               <Button
                 variant="ghost"
@@ -486,7 +490,7 @@ function LockboxCard({ item, estateId }: { item: LockboxItem; estateId: string }
                 onClick={() => setConfirming(true)}
                 aria-label="Archive item"
               >
-                <Trash2 className="w-4 h-4 text-slate-400 hover:text-[#DC2626]" />
+                <Trash2 className="w-4 h-4 text-[var(--royal)]/40 hover:text-[#DC2626]" />
               </Button>
             </div>
           )}
@@ -542,14 +546,14 @@ function EditLockboxModal({
   }, [form, estateId, item.id, onOpenChange])
 
   const labelCls = 'text-[11px] font-bold text-[var(--royal)]/60 uppercase tracking-widest'
-  const fieldCls = 'px-5 py-4 h-auto rounded-2xl border-slate-200 text-[14px] text-slate-900'
+  const fieldCls = 'px-5 py-4 h-auto rounded-2xl border-neutral-border text-[14px] text-[var(--royal)]'
 
   return (
     <Dialog open={open} onOpenChange={onOpenChange}>
       <DialogContent className="max-w-lg max-h-[85vh] overflow-y-auto rounded-[2rem]">
         <DialogHeader>
-          <DialogTitle className="text-2xl font-bold text-slate-900 font-[family-name:var(--font-cinzel)]">Edit Account</DialogTitle>
-          <DialogDescription className="text-slate-500 text-sm">Update this account's details. Secure credentials are managed separately.</DialogDescription>
+          <DialogTitle className="text-2xl font-bold text-[var(--royal)] font-[family-name:var(--font-cinzel)]">Edit Account</DialogTitle>
+          <DialogDescription className="text-[var(--royal)]/60 text-sm">Update this account's details. Secure credentials are managed separately.</DialogDescription>
         </DialogHeader>
         <div className="space-y-4 py-2">
           <div className="space-y-2">
@@ -695,7 +699,7 @@ function AddLockboxModal({ estateId, open, onOpenChange }: { estateId: string; o
         className="sm:max-w-2xl max-h-[90vh] overflow-y-auto rounded-3xl p-10"
       >
         <DialogHeader>
-          <DialogTitle className="text-2xl font-[family-name:var(--font-cinzel)] font-bold text-slate-900">
+          <DialogTitle className="text-2xl font-[family-name:var(--font-cinzel)] font-bold text-[var(--royal)]">
             Add Credential
           </DialogTitle>
           <DialogDescription>
@@ -713,7 +717,7 @@ function AddLockboxModal({ estateId, open, onOpenChange }: { estateId: string; o
               value={form.accountName}
               onChange={(e) => setForm((f) => ({ ...f, accountName: e.target.value }))}
               placeholder="e.g., Chase Checking, Gmail, Bitcoin Wallet"
-              className="px-5 py-4 h-auto rounded-2xl border-slate-200 text-[14px] text-slate-900"
+              className="px-5 py-4 h-auto rounded-2xl border-neutral-border text-[14px] text-[var(--royal)]"
             />
           </div>
 
@@ -723,7 +727,7 @@ function AddLockboxModal({ estateId, open, onOpenChange }: { estateId: string; o
               Category
             </Label>
             <Select value={form.category} onValueChange={(v) => setForm((f) => ({ ...f, category: v as CategoryValue }))}>
-              <SelectTrigger className="w-full px-5 py-4 h-auto rounded-2xl border-slate-200 text-[14px] text-slate-900">
+              <SelectTrigger className="w-full px-5 py-4 h-auto rounded-2xl border-neutral-border text-[14px] text-[var(--royal)]">
                 <SelectValue placeholder="Select a category" />
               </SelectTrigger>
               <SelectContent>
@@ -745,7 +749,7 @@ function AddLockboxModal({ estateId, open, onOpenChange }: { estateId: string; o
               value={form.institution}
               onChange={(e) => setForm((f) => ({ ...f, institution: e.target.value }))}
               placeholder="e.g., JPMorgan Chase, Google, Coinbase"
-              className="px-5 py-4 h-auto rounded-2xl border-slate-200 text-[14px] text-slate-900"
+              className="px-5 py-4 h-auto rounded-2xl border-neutral-border text-[14px] text-[var(--royal)]"
             />
           </div>
 
@@ -758,7 +762,7 @@ function AddLockboxModal({ estateId, open, onOpenChange }: { estateId: string; o
               value={form.accountIdentifier}
               onChange={(e) => setForm((f) => ({ ...f, accountIdentifier: e.target.value }))}
               placeholder="Last 4 digits, username, or account number hint"
-              className="px-5 py-4 h-auto rounded-2xl border-slate-200 text-[14px] text-slate-900"
+              className="px-5 py-4 h-auto rounded-2xl border-neutral-border text-[14px] text-[var(--royal)]"
             />
           </div>
 
@@ -772,7 +776,7 @@ function AddLockboxModal({ estateId, open, onOpenChange }: { estateId: string; o
               onChange={(e) => setForm((f) => ({ ...f, transitionInstructions: e.target.value }))}
               placeholder="What should your heir do with this account? Close it? Transfer it? Keep it active?"
               rows={3}
-              className="px-5 py-4 rounded-2xl border-slate-200 text-[14px] text-slate-900 resize-none"
+              className="px-5 py-4 rounded-2xl border-neutral-border text-[14px] text-[var(--royal)] resize-none"
             />
           </div>
 
@@ -786,7 +790,7 @@ function AddLockboxModal({ estateId, open, onOpenChange }: { estateId: string; o
               onChange={(e) => setForm((f) => ({ ...f, notes: e.target.value }))}
               placeholder="Any additional details..."
               rows={2}
-              className="px-5 py-4 rounded-2xl border-slate-200 text-[14px] text-slate-900 resize-none"
+              className="px-5 py-4 rounded-2xl border-neutral-border text-[14px] text-[var(--royal)] resize-none"
             />
           </div>
 
@@ -798,8 +802,8 @@ function AddLockboxModal({ estateId, open, onOpenChange }: { estateId: string; o
               className="data-checked:bg-[var(--gold)]"
             />
             <div>
-              <p className="text-[14px] font-bold text-slate-900">Store Secure Credentials</p>
-              <p className="text-[12px] text-slate-500">Passwords and PINs will be encrypted via the PII Vault (Cloud KMS)</p>
+              <p className="text-[14px] font-bold text-[var(--royal)]">Store Secure Credentials</p>
+              <p className="text-[12px] text-[var(--royal)]/60">Passwords and PINs will be encrypted via the PII Vault (Cloud KMS)</p>
             </div>
           </div>
 
@@ -820,7 +824,7 @@ function AddLockboxModal({ estateId, open, onOpenChange }: { estateId: string; o
                   value={form.credUsername}
                   onChange={(e) => setForm((f) => ({ ...f, credUsername: e.target.value }))}
                   placeholder="Account username or email"
-                  className="px-5 py-4 h-auto rounded-2xl border-[var(--gold)]/20 bg-white text-[14px] text-slate-900"
+                  className="px-5 py-4 h-auto rounded-2xl border-[var(--gold)]/20 bg-white text-[14px] text-[var(--royal)]"
                 />
               </div>
 
@@ -835,12 +839,12 @@ function AddLockboxModal({ estateId, open, onOpenChange }: { estateId: string; o
                     value={form.credPassword}
                     onChange={(e) => setForm((f) => ({ ...f, credPassword: e.target.value }))}
                     placeholder="Account password"
-                    className="px-5 py-4 pr-12 h-auto rounded-2xl border-[var(--gold)]/20 bg-white text-[14px] text-slate-900 font-mono"
+                    className="px-5 py-4 pr-12 h-auto rounded-2xl border-[var(--gold)]/20 bg-white text-[14px] text-[var(--royal)] font-mono"
                   />
                   <button
                     type="button"
                     onClick={() => setShowPassword((v) => !v)}
-                    className="absolute right-4 top-1/2 -translate-y-1/2 text-slate-500 hover:text-[var(--royal)] transition-colors"
+                    className="absolute right-4 top-1/2 -translate-y-1/2 text-[var(--royal)]/60 hover:text-[var(--royal)] transition-colors"
                   >
                     {showPassword ? <EyeOff className="w-4 h-4" /> : <Eye className="w-4 h-4" />}
                   </button>
@@ -860,12 +864,12 @@ function AddLockboxModal({ estateId, open, onOpenChange }: { estateId: string; o
                     value={form.credPin}
                     onChange={(e) => setForm((f) => ({ ...f, credPin: e.target.value.replace(/[^0-9]/g, '') }))}
                     placeholder="Numeric PIN (up to 10 digits)"
-                    className="px-5 py-4 pr-12 h-auto rounded-2xl border-[var(--gold)]/20 bg-white text-[14px] text-slate-900 font-mono"
+                    className="px-5 py-4 pr-12 h-auto rounded-2xl border-[var(--gold)]/20 bg-white text-[14px] text-[var(--royal)] font-mono"
                   />
                   <button
                     type="button"
                     onClick={() => setShowPin((v) => !v)}
-                    className="absolute right-4 top-1/2 -translate-y-1/2 text-slate-500 hover:text-[var(--royal)] transition-colors"
+                    className="absolute right-4 top-1/2 -translate-y-1/2 text-[var(--royal)]/60 hover:text-[var(--royal)] transition-colors"
                   >
                     {showPin ? <EyeOff className="w-4 h-4" /> : <Eye className="w-4 h-4" />}
                   </button>
@@ -882,7 +886,7 @@ function AddLockboxModal({ estateId, open, onOpenChange }: { estateId: string; o
                   onChange={(e) => setForm((f) => ({ ...f, credNotes: e.target.value }))}
                   placeholder="Security questions, recovery codes, or other sensitive information..."
                   rows={3}
-                  className="px-5 py-4 rounded-2xl border-[var(--gold)]/20 bg-white text-[14px] text-slate-900 resize-none font-mono"
+                  className="px-5 py-4 rounded-2xl border-[var(--gold)]/20 bg-white text-[14px] text-[var(--royal)] resize-none font-mono"
                 />
               </div>
 
@@ -902,11 +906,11 @@ function AddLockboxModal({ estateId, open, onOpenChange }: { estateId: string; o
         </div>
 
         {/* Actions */}
-        <DialogFooter className="gap-4 pt-8 border-t border-slate-100">
+        <DialogFooter className="gap-4 pt-8 border-t border-neutral-border">
           <Button
             variant="ghost"
             onClick={() => handleOpenChange(false)}
-            className="px-8 py-4 h-auto rounded-2xl text-[14px] font-bold text-slate-500"
+            className="px-8 py-4 h-auto rounded-2xl text-[14px] font-bold text-[var(--royal)]/60"
           >
             Cancel
           </Button>
diff --git a/web/src/routes/estates.$estateId.memoirs.lazy.tsx b/web/src/routes/estates.$estateId.memoirs.lazy.tsx
index c1a822f..0eae1d8 100644
--- a/web/src/routes/estates.$estateId.memoirs.lazy.tsx
+++ b/web/src/routes/estates.$estateId.memoirs.lazy.tsx
@@ -4,15 +4,13 @@ import React, { useState, useRef, useMemo, useCallback } from 'react'
 import { useDropzone } from 'react-dropzone'
 // YouTube embed via native iframe — zero bundle cost (no react-player)
 import { useCollection } from '../lib/firestore'
-import { estateClient } from '../lib/client'
+import { estateClient, API_BASE } from '../lib/client'
 import { useAuth } from '../lib/auth'
 import { collection, addDoc, deleteDoc, updateDoc, doc, serverTimestamp } from 'firebase/firestore'
 import { db, auth as firebaseAuth } from '../lib/firebase'
 import { useTierGating, tierUpgradeMessage } from '../lib/tier-gating'
 import { toast } from 'sonner'
 
-const API_BASE = import.meta.env.VITE_API_URL || 'http://localhost:8080'
-
 import { Button } from '@/components/ui/button'
 import { CameraCaptureButton } from '@/components/ui/camera-capture-button'
 import { Card, CardContent } from '@/components/ui/card'
@@ -258,7 +256,7 @@ function MemoirsPage() {
 
         await new Promise<void>((resolve, reject) => {
           const xhr = new XMLHttpRequest()
-          xhr.open('POST', `${API_BASE}/api/v1/youtube/upload`)
+          xhr.open('POST', `${API_BASE}/api/v1/memoirs/upload-video`)
           xhr.setRequestHeader('Authorization', `Bearer ${token}`)
 
           xhr.upload.addEventListener('progress', (e) => {
@@ -371,7 +369,7 @@ function MemoirsPage() {
             </svg>
           </div>
           <div className="flex-1">
-            <p className="text-sm font-bold text-slate-900">
+            <p className="text-sm font-bold text-ink">
               {!tierUsage.canUploadMedia
                 ? tierUpgradeMessage(tierUsage, 'media')
                 : tierUpgradeMessage(tierUsage, 'video')}
@@ -468,17 +466,17 @@ function MemoirsPage() {
                 <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2" />
               </svg>
             </AlertDialogMedia>
-            <AlertDialogTitle className="text-xl font-bold text-slate-900 text-center">
+            <AlertDialogTitle className="text-xl font-bold text-royal text-center">
               Delete Memory
             </AlertDialogTitle>
             <AlertDialogDescription className="text-[14px] text-[var(--royal)]/50 text-center">
-              <strong className="text-slate-900">{deleteTarget?.title}</strong> will be permanently removed.
+              <strong className="text-ink">{deleteTarget?.title}</strong> will be permanently removed.
             </AlertDialogDescription>
           </AlertDialogHeader>
           <AlertDialogFooter className="flex gap-3 sm:flex-row">
             <AlertDialogCancel
               variant="outline"
-              className="flex-1 py-3 rounded-xl border-[var(--royal)]/10 text-slate-900 font-bold text-[13px]"
+              className="flex-1 py-3 rounded-xl border-[var(--royal)]/10 text-ink font-bold text-[13px]"
             >
               Cancel
             </AlertDialogCancel>
@@ -497,14 +495,14 @@ function MemoirsPage() {
       <Dialog open={!!editTarget} onOpenChange={(open) => { if (!open && !savingEdit) setEditTarget(null) }}>
         <DialogContent className="max-w-md rounded-[2rem] p-8">
           <DialogHeader>
-            <DialogTitle className="text-xl font-bold text-slate-900">Edit Memory</DialogTitle>
+            <DialogTitle className="text-xl font-bold text-royal">Edit Memory</DialogTitle>
             <DialogDescription className="text-[13px] text-[var(--royal)]/50">
               Update the title and who can see this memory.
             </DialogDescription>
           </DialogHeader>
           <div className="space-y-5 py-2">
             <div className="space-y-2">
-              <Label htmlFor="memoir-edit-title" className="text-[12px] font-bold text-slate-900 uppercase tracking-wide">Title</Label>
+              <Label htmlFor="memoir-edit-title" className="text-[12px] font-bold text-ink uppercase tracking-wide">Title</Label>
               <Input
                 id="memoir-edit-title"
                 value={editTitle}
@@ -513,7 +511,7 @@ function MemoirsPage() {
               />
             </div>
             <div className="space-y-2">
-              <Label className="text-[12px] font-bold text-slate-900 uppercase tracking-wide">Visibility</Label>
+              <Label className="text-[12px] font-bold text-ink uppercase tracking-wide">Visibility</Label>
               <Select value={editVisibility} onValueChange={setEditVisibility}>
                 <SelectTrigger><SelectValue /></SelectTrigger>
                 <SelectContent>
@@ -528,7 +526,7 @@ function MemoirsPage() {
               variant="outline"
               onClick={() => setEditTarget(null)}
               disabled={savingEdit}
-              className="flex-1 py-3 rounded-xl border-[var(--royal)]/10 text-slate-900 font-bold text-[13px] h-auto"
+              className="flex-1 py-3 rounded-xl border-[var(--royal)]/10 text-ink font-bold text-[13px] h-auto"
             >
               Cancel
             </Button>
@@ -580,7 +578,7 @@ function CinemaViewer({
               <Button
                 variant="ghost"
                 onClick={() => onOpenChange(false)}
-                className="absolute top-8 right-8 w-12 h-12 rounded-full bg-white/10 backdrop-blur-md border border-white/20 text-white hover:bg-white hover:text-slate-900"
+                className="absolute top-8 right-8 w-12 h-12 rounded-full bg-white/10 backdrop-blur-md border border-white/20 text-white hover:bg-white hover:text-ink"
               >
                 <svg viewBox="0 0 24 24" className="w-5 h-5" fill="none" stroke="currentColor" strokeWidth="2.5">
                   <path d="M18 6L6 18M6 6l12 12" />
@@ -589,7 +587,7 @@ function CinemaViewer({
             </div>
             <div className="p-12 bg-white flex justify-between items-center">
               <div className="space-y-2">
-                <h3 className="text-3xl font-bold text-slate-900 tracking-tight">{memoir.title}</h3>
+                <h3 className="text-3xl font-bold text-royal tracking-tight">{memoir.title}</h3>
                 <div className="flex items-center gap-4 text-[var(--royal)]/40 font-medium">
                   <Badge className="text-[11px] font-bold uppercase tracking-widest bg-[var(--royal)]/10 text-[var(--royal)] border-none">
                     {memoir.type === 'youtube' ? 'YouTube' : memoir.type}
@@ -616,7 +614,7 @@ function CinemaViewer({
                 <Button
                   variant="outline"
                   onClick={() => onOpenChange(false)}
-                  className="px-8 py-3 bg-slate-50 hover:bg-[var(--royal)]/5 rounded-xl text-slate-900 font-bold text-[13px] border-[var(--royal)]/10 h-auto"
+                  className="px-8 py-3 bg-neutral-faint hover:bg-[var(--royal)]/5 rounded-xl text-ink font-bold text-[13px] border-[var(--royal)]/10 h-auto"
                 >
                   Close
                 </Button>
@@ -690,7 +688,7 @@ function UploadModal({
     <Dialog open={open} onOpenChange={onOpenChange}>
       <DialogContent className="max-w-xl sm:max-w-xl rounded-[3rem] p-12 border-[var(--royal)]/10">
         <DialogHeader>
-          <DialogTitle className="text-3xl font-bold text-slate-900 tracking-tight">
+          <DialogTitle className="text-3xl font-bold text-royal tracking-tight">
             Add New Memory
           </DialogTitle>
           <DialogDescription className="text-[var(--royal)]/40 font-medium text-sm">
@@ -704,7 +702,7 @@ function UploadModal({
           onValueChange={(val) => onModeChange(val as 'file' | 'youtube')}
           className="mt-2"
         >
-          <TabsList className="w-full bg-slate-50 p-1.5 rounded-2xl h-auto">
+          <TabsList className="w-full bg-neutral-faint p-1.5 rounded-2xl h-auto">
             <TabsTrigger
               value="file"
               className="flex-1 py-3 rounded-xl text-[12px] font-bold data-active:bg-[var(--royal)] data-active:text-white data-active:shadow-md text-[var(--royal)]/50 hover:text-[var(--royal)]"
@@ -762,7 +760,7 @@ function UploadModal({
               <Input
                 name="title"
                 required
-                className="w-full px-6 py-4 h-auto rounded-2xl border-[var(--royal)]/10 bg-slate-50 focus:bg-white focus-visible:border-[var(--royal)] focus-visible:ring-[var(--royal)]/5 font-bold text-slate-900 placeholder:text-[var(--royal)]/20"
+                className="w-full px-6 py-4 h-auto rounded-2xl border-[var(--royal)]/10 bg-neutral-faint focus:bg-white focus-visible:border-[var(--royal)] focus-visible:ring-[var(--royal)]/5 font-bold text-ink placeholder:text-[var(--royal)]/20"
                 placeholder="e.g. Family Reunion 2025"
               />
             </div>
@@ -774,7 +772,7 @@ function UploadModal({
               <Input
                 value={youtubeUrl}
                 onChange={(e) => setYoutubeUrl(e.target.value)}
-                className="w-full px-6 py-4 h-auto rounded-2xl border-[var(--royal)]/10 bg-slate-50 focus:bg-white focus-visible:border-[var(--royal)] focus-visible:ring-[var(--royal)]/5 font-bold text-slate-900 placeholder:text-[var(--royal)]/20"
+                className="w-full px-6 py-4 h-auto rounded-2xl border-[var(--royal)]/10 bg-neutral-faint focus:bg-white focus-visible:border-[var(--royal)] focus-visible:ring-[var(--royal)]/5 font-bold text-ink placeholder:text-[var(--royal)]/20"
                 placeholder="https://www.youtube.com/watch?v=..."
               />
               {youtubeUrl && extractYouTubeId(youtubeUrl) && (
@@ -794,7 +792,7 @@ function UploadModal({
                   Media Type
                 </Label>
                 <Select value={mediaType} onValueChange={setMediaType}>
-                  <SelectTrigger className="w-full px-6 py-4 h-auto rounded-2xl border-[var(--royal)]/10 bg-slate-50 font-bold text-slate-900">
+                  <SelectTrigger className="w-full px-6 py-4 h-auto rounded-2xl border-[var(--royal)]/10 bg-neutral-faint font-bold text-ink">
                     <SelectValue />
                   </SelectTrigger>
                   <SelectContent>
@@ -812,7 +810,7 @@ function UploadModal({
                   className={`w-full h-36 border-2 border-dashed rounded-[2rem] flex flex-col items-center justify-center transition-all cursor-pointer group ${
                     isDragActive
                       ? 'border-[var(--royal)] bg-[var(--royal)]/5'
-                      : 'border-[var(--royal)]/15 bg-slate-50 hover:bg-white hover:border-[var(--royal)]/30'
+                      : 'border-[var(--royal)]/15 bg-neutral-faint hover:bg-white hover:border-[var(--royal)]/30'
                   }`}
                 >
                   <input {...getInputProps()} />
@@ -857,13 +855,13 @@ function UploadModal({
                       className={`flex flex-col items-center gap-2 p-4 rounded-2xl border-2 transition-all ${
                         uploadDest === 'cloud'
                           ? 'border-[var(--royal)] bg-[var(--royal)]/5'
-                          : 'border-[var(--royal)]/10 bg-slate-50 hover:border-[var(--royal)]/20'
+                          : 'border-[var(--royal)]/10 bg-neutral-faint hover:border-[var(--royal)]/20'
                       }`}
                     >
                       <svg viewBox="0 0 24 24" className="w-6 h-6 text-[var(--royal)]/60" fill="none" stroke="currentColor" strokeWidth="2">
                         <path d="M18 10h-1.26A8 8 0 1 0 9 20h9a5 5 0 0 0 0-10z" />
                       </svg>
-                      <span className="text-[11px] font-bold text-slate-900 uppercase tracking-wider">Cloud Storage</span>
+                      <span className="text-[11px] font-bold text-ink uppercase tracking-wider">Cloud Storage</span>
                       <span className="text-[10px] text-[var(--royal)]/40 font-medium">Max 50MB</span>
                     </button>
                     <button
@@ -872,14 +870,14 @@ function UploadModal({
                       className={`flex flex-col items-center gap-2 p-4 rounded-2xl border-2 transition-all ${
                         uploadDest === 'youtube'
                           ? 'border-red-500 bg-red-50'
-                          : 'border-[var(--royal)]/10 bg-slate-50 hover:border-red-300'
+                          : 'border-[var(--royal)]/10 bg-neutral-faint hover:border-red-300'
                       }`}
                     >
                       <svg viewBox="0 0 24 24" className="w-6 h-6 text-red-500" fill="currentColor">
                         <path d="M23.498 6.186a3.016 3.016 0 0 0-2.122-2.136C19.505 3.545 12 3.545 12 3.545s-7.505 0-9.377.505A3.017 3.017 0 0 0 .502 6.186C0 8.07 0 12 0 12s0 3.93.502 5.814a3.016 3.016 0 0 0 2.122 2.136c1.871.505 9.376.505 9.376.505s7.505 0 9.377-.505a3.015 3.015 0 0 0 2.122-2.136C24 15.93 24 12 24 12s0-3.93-.502-5.814z" />
                         <path d="M9.545 15.568V8.432L15.818 12l-6.273 3.568z" fill="white" />
                       </svg>
-                      <span className="text-[11px] font-bold text-slate-900 uppercase tracking-wider">YouTube</span>
+                      <span className="text-[11px] font-bold text-ink uppercase tracking-wider">YouTube</span>
                       <span className="text-[10px] text-[var(--royal)]/40 font-medium">Max 256MB &middot; Unlisted</span>
                     </button>
                   </div>
@@ -895,7 +893,7 @@ function UploadModal({
                   <Input
                     value={description}
                     onChange={(e) => setDescription(e.target.value)}
-                    className="w-full px-6 py-4 h-auto rounded-2xl border-[var(--royal)]/10 bg-slate-50 focus:bg-white focus-visible:border-[var(--royal)] focus-visible:ring-[var(--royal)]/5 font-bold text-slate-900 placeholder:text-[var(--royal)]/20"
+                    className="w-full px-6 py-4 h-auto rounded-2xl border-[var(--royal)]/10 bg-neutral-faint focus:bg-white focus-visible:border-[var(--royal)] focus-visible:ring-[var(--royal)]/5 font-bold text-ink placeholder:text-[var(--royal)]/20"
                     placeholder="A brief description for this video"
                   />
                 </div>
@@ -916,7 +914,7 @@ function UploadModal({
                 Visibility
               </Label>
               <Select value={visibility} onValueChange={setVisibility}>
-                <SelectTrigger className="w-full px-6 py-4 h-auto rounded-2xl border-[var(--royal)]/10 bg-slate-50 font-bold text-slate-900">
+                <SelectTrigger className="w-full px-6 py-4 h-auto rounded-2xl border-[var(--royal)]/10 bg-neutral-faint font-bold text-ink">
                   <SelectValue />
                 </SelectTrigger>
                 <SelectContent>
@@ -1000,7 +998,12 @@ function VideoCard({
 
   return (
     <Card className="rounded-[2.5rem] border-[var(--royal)]/10 overflow-hidden shadow-sm group hover:border-[var(--royal)]/20 hover:shadow-xl transition-all relative p-0 gap-0">
-      <div className="aspect-video bg-slate-900 relative overflow-hidden cursor-pointer" onClick={onClick}>
+      <button
+        type="button"
+        onClick={onClick}
+        aria-label={`Play ${memoir.title}`}
+        className="block w-full aspect-video bg-royal relative overflow-hidden cursor-pointer text-left focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--royal)] focus-visible:ring-offset-2"
+      >
         {isYouTube && memoir.youtubeUrl ? (
           <YouTubeThumbnail url={memoir.youtubeUrl} />
         ) : memoir.url ? (
@@ -1032,9 +1035,9 @@ function VideoCard({
             YouTube
           </Badge>
         )}
-      </div>
+      </button>
       <CardContent className="p-8 space-y-3">
-        <h4 className="font-bold text-slate-900 text-lg tracking-tight group-hover:text-[var(--royal)] transition-colors cursor-pointer" onClick={onClick}>
+        <h4 className="font-bold text-royal text-lg tracking-tight group-hover:text-[var(--royal)] transition-colors">
           {memoir.title}
         </h4>
         <div className="flex justify-between items-center">
@@ -1070,7 +1073,12 @@ function PhotoCard({
 }) {
   return (
     <Card className="rounded-[2rem] border-[var(--royal)]/10 overflow-hidden shadow-sm group hover:border-[var(--royal)]/20 hover:shadow-xl transition-all relative p-0 gap-0">
-      <div className="aspect-square bg-slate-50 relative overflow-hidden cursor-pointer" onClick={onClick}>
+      <button
+        type="button"
+        onClick={onClick}
+        aria-label={`View ${memoir.title}`}
+        className="block w-full aspect-square bg-neutral-faint relative overflow-hidden cursor-pointer focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--royal)] focus-visible:ring-offset-2"
+      >
         {memoir.url ? (
           <img
             src={memoir.url}
@@ -1086,10 +1094,10 @@ function PhotoCard({
             </svg>
           </div>
         )}
-      </div>
+      </button>
       <CardContent className="p-6 border-t border-[var(--royal)]/5 flex items-center justify-between">
         <div className="min-w-0">
-          <h4 className="font-bold text-slate-900 text-sm truncate group-hover:text-[var(--royal)] transition-colors cursor-pointer" onClick={onClick}>
+          <h4 className="font-bold text-royal text-sm truncate group-hover:text-[var(--royal)] transition-colors">
             {memoir.title}
           </h4>
           <p className="text-[10px] font-bold text-[var(--royal)]/20 uppercase tracking-widest mt-0.5">{memoir.dateAdded}</p>
diff --git a/web/src/routes/estates.$estateId.notifications.tsx b/web/src/routes/estates.$estateId.notifications.tsx
index 0495ccf..32110ca 100644
--- a/web/src/routes/estates.$estateId.notifications.tsx
+++ b/web/src/routes/estates.$estateId.notifications.tsx
@@ -25,7 +25,7 @@ function NotificationsPage() {
       <div className="flex items-center justify-center h-[50vh]">
         <div className="flex flex-col items-center gap-4">
           <div className="w-10 h-10 border-2 border-[var(--royal)]/20 border-t-[var(--royal)] rounded-full animate-spin" />
-          <span className="text-[11px] font-semibold text-slate-500 uppercase tracking-[0.2em]">Loading activity...</span>
+          <span className="text-[11px] font-semibold text-ink-muted uppercase tracking-[0.2em]">Loading activity...</span>
         </div>
       </div>
     );
@@ -61,8 +61,8 @@ function NotificationsPage() {
     <div className="max-w-[1240px] mx-auto space-y-10 pb-20 px-4">
       <div className="flex justify-between items-end pb-10">
         <div className="space-y-2">
-          <h2 className="text-5xl font-[family-name:var(--font-cinzel)] font-bold text-slate-900">Activity History</h2>
-          <p className="text-lg text-slate-500 font-medium">A record of everything that has happened with your estate plan.</p>
+          <h2 className="text-5xl font-[family-name:var(--font-cinzel)] font-bold text-royal">Activity History</h2>
+          <p className="text-lg text-ink-muted font-medium">A record of everything that has happened with your estate plan.</p>
         </div>
         {unreadCount > 0 && (
           <Button
@@ -85,12 +85,12 @@ function NotificationsPage() {
                 <path d="M14.857 17.082a23.848 23.848 0 0 0 5.454-1.31A8.967 8.967 0 0 1 18 9.75V9A6 6 0 0 0 6 9v.75a8.967 8.967 0 0 1-2.312 6.022c1.733.64 3.56 1.085 5.455 1.31m5.714 0a24.255 24.255 0 0 1-5.714 0m5.714 0a3 3 0 1 1-5.714 0" />
               </svg>
             </div>
-            <h3 className="text-xl font-bold text-slate-900 mb-2">No notifications yet</h3>
-            <p className="text-slate-500">Activity in your estate will appear here.</p>
+            <h3 className="text-xl font-bold text-royal mb-2">No notifications yet</h3>
+            <p className="text-ink-muted">Activity in your estate will appear here.</p>
           </CardContent>
         </Card>
       ) : (
-        <Card className="rounded-[2.5rem] border-slate-100 shadow-sm">
+        <Card className="rounded-[2.5rem] border-neutral-border shadow-sm">
           <CardContent className="p-10 space-y-0">
             {notifications.map((n, i) => (
               <NotificationItem
@@ -128,18 +128,18 @@ function NotificationItem({ title, time, type, desc, read, isLast, onMarkRead }:
   const dotClass = dotStyles[type] || dotStyles.activity;
 
   return (
-    <div className={`flex gap-8 group py-8 ${!isLast ? 'border-b border-slate-100' : ''} ${read ? 'opacity-60' : ''}`}>
+    <div className={`flex gap-8 group py-8 ${!isLast ? 'border-b border-neutral-border' : ''} ${read ? 'opacity-60' : ''}`}>
       {/* Timeline dot — solid + ring when unread */}
       <div className="flex flex-col items-center pt-1">
         <div className={`w-3 h-3 rounded-full ${dotClass} shadow-sm ${!read ? 'ring-4 ring-[var(--royal)]/10' : ''}`} />
-        {!isLast && <div className="w-px flex-1 bg-slate-100 mt-2" />}
+        {!isLast && <div className="w-px flex-1 bg-neutral-faint mt-2" />}
       </div>
 
       <div className="flex-1">
         <div className="flex justify-between items-start mb-3">
           <div className="space-y-1">
             <div className="flex items-center gap-3">
-              <h4 className="text-slate-900 font-bold text-lg group-hover:text-[var(--royal)] transition-colors">{title}</h4>
+              <h4 className="text-royal font-bold text-lg group-hover:text-[var(--royal)] transition-colors">{title}</h4>
               <Badge variant="outline" className={`text-[10px] font-bold capitalize ${badgeClass}`}>
                 {type}
               </Badge>
@@ -149,10 +149,10 @@ function NotificationItem({ title, time, type, desc, read, isLast, onMarkRead }:
                 </Badge>
               )}
             </div>
-            <span className="text-[13px] font-medium text-slate-500">{time}</span>
+            <span className="text-[13px] font-medium text-ink-muted">{time}</span>
           </div>
         </div>
-        <p className="text-[15px] text-slate-500 leading-relaxed">{desc}</p>
+        <p className="text-[15px] text-ink-muted leading-relaxed">{desc}</p>
         {!read && (
           <div className="mt-4 flex gap-4 opacity-0 group-hover:opacity-100 transition-all duration-300">
             <Button
diff --git a/web/src/routes/estates.$estateId.obituary.lazy.tsx b/web/src/routes/estates.$estateId.obituary.lazy.tsx
index fe2b2a9..e998b8b 100644
--- a/web/src/routes/estates.$estateId.obituary.lazy.tsx
+++ b/web/src/routes/estates.$estateId.obituary.lazy.tsx
@@ -12,8 +12,9 @@ import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
 import { Badge } from '@/components/ui/badge'
 import { Separator } from '@/components/ui/separator'
 import { toast } from 'sonner'
-import { Download, QrCode, Bold, Italic, List, ListOrdered, Heading2, Undo2, Redo2 } from 'lucide-react'
+import { Download, QrCode } from 'lucide-react'
 import { ShareMemorial } from '@/components/estate/ShareMemorial'
+import { EditorToolbar } from './estates.$estateId.directives.lazy'
 import { useEditor, EditorContent } from '@tiptap/react'
 import StarterKit from '@tiptap/starter-kit'
 
@@ -70,7 +71,7 @@ function ObituaryPage() {
     editable: editing && !isSigned,
     editorProps: {
       attributes: {
-        class: 'prose prose-lg max-w-none min-h-[400px] focus:outline-none p-8 text-slate-900 font-[family-name:var(--font-inter)] leading-relaxed',
+        class: 'prose prose-lg max-w-none min-h-[400px] focus:outline-none p-8 text-ink font-[family-name:var(--font-inter)] leading-relaxed',
       },
     },
   });
@@ -205,15 +206,18 @@ function ObituaryPage() {
         createdBy: user?.uid,
         message: {
           subject: `Obituary: ${userName || 'Estate Record'}`,
+          // NOTE: This HTML is rendered by the recipient's email client, OUTSIDE the
+          // app's CSS scope, so it cannot resolve `var(--color-slate-*)` design tokens.
+          // Colors MUST be literal hex. Royal Neo-Deco ink (#142848) and muted (#4A5C7A).
           html: `
             <div style="font-family: 'Inter', sans-serif; max-width: 600px; margin: 0 auto; padding: 32px;">
-              <h1 style="font-family: 'Cinzel', serif; color: var(--color-slate-900); font-size: 28px; margin-bottom: 8px;">Final Record</h1>
-              <p style="color: var(--color-slate-500); font-size: 14px; margin-bottom: 24px;">Official obituary for the ${userName || 'estate'} record.</p>
-              <div style="background: var(--color-slate-50); border: 1px solid var(--color-slate-200); border-radius: 12px; padding: 24px; white-space: pre-wrap; color: var(--color-slate-900); font-size: 16px; line-height: 1.7;">
+              <h1 style="font-family: 'Cinzel', serif; color: #142848; font-size: 28px; margin-bottom: 8px;">Final Record</h1>
+              <p style="color: #4A5C7A; font-size: 14px; margin-bottom: 24px;">Official obituary for the ${userName || 'estate'} record.</p>
+              <div style="background: #F5F7FA; border: 1px solid #E2E8F0; border-radius: 12px; padding: 24px; white-space: pre-wrap; color: #142848; font-size: 16px; line-height: 1.7;">
                 ${obit.content.replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/\n/g, '<br/>')}
               </div>
               ${isSigned ? `<p style="margin-top: 24px; color: #16a34a; font-weight: bold;">Signed by: ${obit.signature}</p>` : ''}
-              <p style="margin-top: 32px; color: var(--color-slate-400); font-size: 11px;">Sent from FinalWishes Estate Platform</p>
+              <p style="margin-top: 32px; color: #4A5C7A; font-size: 11px;">Sent from FinalWishes Estate Platform</p>
             </div>
           `,
         },
@@ -290,7 +294,7 @@ function ObituaryPage() {
       <div className="flex items-center justify-center h-[50vh]">
         <div className="flex flex-col items-center gap-4">
           <div className="w-10 h-10 border-2 border-[var(--royal)]/20 border-t-[var(--royal)] rounded-full animate-spin" />
-          <span className="text-[11px] font-semibold text-slate-500 uppercase tracking-[0.2em]">Loading record...</span>
+          <span className="text-[11px] font-semibold text-ink-muted uppercase tracking-[0.2em]">Loading record...</span>
         </div>
       </div>
     );
@@ -309,7 +313,7 @@ function ObituaryPage() {
 
       {/* Photo Modal */}
       <Dialog open={showPhotoModal} onOpenChange={setShowPhotoModal}>
-        <DialogContent className="sm:max-w-[90vw] max-h-[90vh] rounded-[2rem] p-0 overflow-hidden border-slate-200" showCloseButton={false}>
+        <DialogContent className="sm:max-w-[90vw] max-h-[90vh] rounded-[2rem] p-0 overflow-hidden border-neutral-border" showCloseButton={false}>
           {profilePhoto ? (
             <img
               src={profilePhoto}
@@ -321,10 +325,10 @@ function ObituaryPage() {
               <span className="text-8xl font-[family-name:var(--font-cinzel)] font-bold text-[var(--royal)]/30">{initials}</span>
             </div>
           )}
-          <div className="w-full p-6 bg-white border-t border-slate-100 flex justify-between items-center">
+          <div className="w-full p-6 bg-white border-t border-neutral-border flex justify-between items-center">
             <div>
-              <h3 className="text-lg font-bold text-slate-900 font-[family-name:var(--font-cinzel)]">Heritage Portrait</h3>
-              <p className="text-[13px] text-slate-500 font-medium">{userName || 'Estate Principal'}</p>
+              <h3 className="text-lg font-bold text-royal font-[family-name:var(--font-cinzel)]">Heritage Portrait</h3>
+              <p className="text-[13px] text-ink-muted font-medium">{userName || 'Estate Principal'}</p>
             </div>
             <Button
               variant="outline"
@@ -339,8 +343,8 @@ function ObituaryPage() {
 
       <div className="flex justify-between items-end pb-8">
         <div className="space-y-2">
-          <h2 className="text-5xl font-[family-name:var(--font-cinzel)] font-bold text-slate-900">Final Record</h2>
-          <p className="text-lg text-slate-500 font-medium">Draft, manage, and distribute the official life story for your estate.</p>
+          <h2 className="text-5xl font-[family-name:var(--font-cinzel)] font-bold text-royal">Final Record</h2>
+          <p className="text-lg text-ink-muted font-medium">Draft, manage, and distribute the official life story for your estate.</p>
         </div>
         <div className="flex gap-3">
           <Button
@@ -370,7 +374,7 @@ function ObituaryPage() {
           {obit?.content && (
             <Button
               onClick={handleExportPDF}
-              className="bg-slate-100 hover:bg-slate-200 text-slate-700 px-6 py-3 h-auto rounded-2xl font-bold text-[13px] shadow-sm active:scale-95"
+              className="bg-neutral-faint hover:bg-[var(--neutral-border)] text-ink px-6 py-3 h-auto rounded-2xl font-bold text-[13px] shadow-sm active:scale-95"
             >
               <Download className="w-4 h-4" />
               Export PDF
@@ -410,7 +414,7 @@ function ObituaryPage() {
         <div className="space-y-6">
           {/* Portrait */}
           <Card
-            className="aspect-[3/4] relative group overflow-hidden shadow-sm cursor-pointer rounded-[2rem] p-0 border-slate-200"
+            className="aspect-[3/4] relative group overflow-hidden shadow-sm cursor-pointer rounded-[2rem] p-0 border-neutral-border"
             onClick={() => setShowPhotoModal(true)}
           >
              {profilePhoto ? (
@@ -421,7 +425,7 @@ function ObituaryPage() {
                </div>
              )}
              <Button
-               className="absolute bottom-4 left-4 right-4 w-[calc(100%-2rem)] py-2.5 bg-white/90 backdrop-blur-md rounded-xl text-slate-900 font-bold text-[12px] translate-y-12 group-hover:translate-y-0 transition-transform shadow-md hover:bg-white/95 h-auto border-none"
+               className="absolute bottom-4 left-4 right-4 w-[calc(100%-2rem)] py-2.5 bg-white/90 backdrop-blur-md rounded-xl text-ink font-bold text-[12px] translate-y-12 group-hover:translate-y-0 transition-transform shadow-md hover:bg-white/95 h-auto border-none"
                onClick={(e) => {
                  e.stopPropagation();
                  fileInputRef.current?.click();
@@ -433,9 +437,9 @@ function ObituaryPage() {
           </Card>
 
           {/* Vital Stats */}
-          <Card className="rounded-[2rem] border-slate-100 shadow-sm">
+          <Card className="rounded-[2rem] border-neutral-border shadow-sm">
             <CardHeader>
-              <CardTitle className="text-[11px] font-bold text-slate-400 uppercase tracking-widest">Details</CardTitle>
+              <CardTitle className="text-[11px] font-bold text-ink-muted uppercase tracking-widest">Details</CardTitle>
             </CardHeader>
             <CardContent>
               <div className="space-y-3">
@@ -449,9 +453,9 @@ function ObituaryPage() {
         </div>
 
         {/* Editor */}
-        <Card className="rounded-[2rem] border-slate-100 shadow-sm flex flex-col min-h-[500px] p-0">
-          <CardHeader className="bg-slate-50 px-6 py-4 flex-row justify-between items-center border-b border-slate-100 rounded-t-[2rem]">
-             <span className="text-[11px] font-bold text-slate-400 uppercase tracking-widest">Obituary Draft</span>
+        <Card className="rounded-[2rem] border-neutral-border shadow-sm flex flex-col min-h-[500px] p-0">
+          <CardHeader className="bg-neutral-faint px-6 py-4 flex-row justify-between items-center border-b border-neutral-border rounded-t-[2rem]">
+             <span className="text-[11px] font-bold text-ink-muted uppercase tracking-widest">Obituary Draft</span>
              {!editing && !isSigned && (
                <Button variant="link" onClick={() => setEditing(true)} className="text-[var(--royal)] font-bold text-[12px] p-0 h-auto">Edit</Button>
              )}
@@ -467,17 +471,7 @@ function ObituaryPage() {
           </CardHeader>
           {/* Toolbar — only visible when editing */}
           {editing && !isSigned && editor && (
-            <div className="flex items-center gap-1 mx-6 mt-4 p-3 bg-slate-50 rounded-2xl border border-slate-100">
-              <Button variant="ghost" size="icon" onClick={() => editor.chain().focus().toggleBold().run()} className={`w-9 h-9 rounded-xl ${editor.isActive('bold') ? 'bg-[var(--royal)] text-white hover:bg-[var(--royal)]/90 hover:text-white' : 'text-slate-500 hover:bg-slate-200'}`}><Bold className="w-4 h-4" /></Button>
-              <Button variant="ghost" size="icon" onClick={() => editor.chain().focus().toggleItalic().run()} className={`w-9 h-9 rounded-xl ${editor.isActive('italic') ? 'bg-[var(--royal)] text-white hover:bg-[var(--royal)]/90 hover:text-white' : 'text-slate-500 hover:bg-slate-200'}`}><Italic className="w-4 h-4" /></Button>
-              <Separator orientation="vertical" className="h-5 mx-1" />
-              <Button variant="ghost" size="icon" onClick={() => editor.chain().focus().toggleHeading({ level: 2 }).run()} className={`w-9 h-9 rounded-xl ${editor.isActive('heading', { level: 2 }) ? 'bg-[var(--royal)] text-white hover:bg-[var(--royal)]/90 hover:text-white' : 'text-slate-500 hover:bg-slate-200'}`}><Heading2 className="w-4 h-4" /></Button>
-              <Button variant="ghost" size="icon" onClick={() => editor.chain().focus().toggleBulletList().run()} className={`w-9 h-9 rounded-xl ${editor.isActive('bulletList') ? 'bg-[var(--royal)] text-white hover:bg-[var(--royal)]/90 hover:text-white' : 'text-slate-500 hover:bg-slate-200'}`}><List className="w-4 h-4" /></Button>
-              <Button variant="ghost" size="icon" onClick={() => editor.chain().focus().toggleOrderedList().run()} className={`w-9 h-9 rounded-xl ${editor.isActive('orderedList') ? 'bg-[var(--royal)] text-white hover:bg-[var(--royal)]/90 hover:text-white' : 'text-slate-500 hover:bg-slate-200'}`}><ListOrdered className="w-4 h-4" /></Button>
-              <Separator orientation="vertical" className="h-5 mx-1" />
-              <Button variant="ghost" size="icon" onClick={() => editor.chain().focus().undo().run()} className="w-9 h-9 rounded-xl text-slate-500 hover:bg-slate-200"><Undo2 className="w-4 h-4" /></Button>
-              <Button variant="ghost" size="icon" onClick={() => editor.chain().focus().redo().run()} className="w-9 h-9 rounded-xl text-slate-500 hover:bg-slate-200"><Redo2 className="w-4 h-4" /></Button>
-            </div>
+            <EditorToolbar editor={editor} className="mx-6 mt-4" />
           )}
           <CardContent className="flex-1 p-0">
             <EditorContent editor={editor} />
@@ -487,23 +481,23 @@ function ObituaryPage() {
 
       {/* Sign Modal */}
       <Dialog open={modalOpen} onOpenChange={setModalOpen}>
-        <DialogContent className="sm:max-w-2xl rounded-[3rem] p-12 border-slate-100 shadow-2xl" showCloseButton={false}>
+        <DialogContent className="sm:max-w-2xl rounded-[3rem] p-12 border-neutral-border shadow-2xl" showCloseButton={false}>
           <DialogHeader className="text-center items-center">
             <div className="w-16 h-16 bg-[var(--royal)] text-white rounded-full flex items-center justify-center mx-auto mb-4 shadow-lg">
               <svg viewBox="0 0 24 24" className="w-8 h-8" fill="none" stroke="currentColor" strokeWidth="2"><path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"/></svg>
             </div>
-            <DialogTitle className="text-3xl font-[family-name:var(--font-cinzel)] font-bold text-slate-900">Review & Sign</DialogTitle>
-            <DialogDescription className="text-slate-500 font-medium max-w-md mx-auto">By signing this document, you are establishing the official record for your estate.</DialogDescription>
+            <DialogTitle className="text-3xl font-[family-name:var(--font-cinzel)] font-bold text-royal">Review & Sign</DialogTitle>
+            <DialogDescription className="text-ink-muted font-medium max-w-md mx-auto">By signing this document, you are establishing the official record for your estate.</DialogDescription>
           </DialogHeader>
 
-          <div className="bg-slate-50 p-6 rounded-2xl mb-4 border border-slate-100 max-h-[200px] overflow-y-auto">
-             <p className="text-slate-500 text-sm italic leading-relaxed">"{obit?.content || 'No content drafted yet...'}"</p>
+          <div className="bg-neutral-faint p-6 rounded-2xl mb-4 border border-neutral-border max-h-[200px] overflow-y-auto">
+             <p className="text-ink-muted text-sm italic leading-relaxed">"{obit?.content || 'No content drafted yet...'}"</p>
           </div>
 
-          <div className="bg-slate-50 p-6 rounded-2xl border border-slate-200 mb-4 text-center">
-             <label className="text-[11px] font-bold text-slate-400 uppercase tracking-widest mb-4 block">Signature</label>
-             <div className="h-20 border-b-2 border-slate-900/30 flex items-center justify-center text-slate-300 font-serif italic text-3xl select-none">
-                {isSigned ? <span className="text-slate-900 font-[family-name:var(--font-cinzel)]">{obit?.signature || userName || 'Legal Guardian'}</span> : 'Sign here'}
+          <div className="bg-neutral-faint p-6 rounded-2xl border border-neutral-border mb-4 text-center">
+             <label className="text-[11px] font-bold text-ink-muted uppercase tracking-widest mb-4 block">Signature</label>
+             <div className="h-20 border-b-2 border-royal/30 flex items-center justify-center text-ink-muted font-serif italic text-3xl select-none">
+                {isSigned ? <span className="text-royal font-[family-name:var(--font-cinzel)]">{obit?.signature || userName || 'Legal Guardian'}</span> : 'Sign here'}
              </div>
           </div>
 
@@ -511,7 +505,7 @@ function ObituaryPage() {
             <Button
               variant="outline"
               onClick={() => setModalOpen(false)}
-              className="flex-1 py-4 h-auto rounded-2xl border-slate-200 font-bold text-slate-500 text-sm hover:bg-slate-50 active:scale-95"
+              className="flex-1 py-4 h-auto rounded-2xl border-neutral-border font-bold text-ink-muted text-sm hover:bg-neutral-faint active:scale-95"
             >
               Cancel
             </Button>
@@ -550,12 +544,12 @@ function StatRow({ label, value, color }: { label: string; value?: string; color
   const badgeStyle = color ? colorMap[color] || '' : '';
 
   return (
-    <div className="flex justify-between items-center py-2.5 border-b border-slate-100 last:border-b-0">
-      <span className="text-[13px] text-slate-500 font-medium">{label}</span>
+    <div className="flex justify-between items-center py-2.5 border-b border-neutral-border last:border-b-0">
+      <span className="text-[13px] text-ink-muted font-medium">{label}</span>
       {color ? (
         <Badge variant="outline" className={`text-[11px] font-bold px-2.5 py-1 rounded-lg h-auto ${badgeStyle}`}>{value}</Badge>
       ) : (
-        <span className="text-[13px] font-bold text-slate-900">{value}</span>
+        <span className="text-[13px] font-bold text-ink">{value}</span>
       )}
     </div>
   );
diff --git a/web/src/routes/estates.$estateId.pricing.tsx b/web/src/routes/estates.$estateId.pricing.tsx
index 6f5a3ca..0125d21 100644
--- a/web/src/routes/estates.$estateId.pricing.tsx
+++ b/web/src/routes/estates.$estateId.pricing.tsx
@@ -5,6 +5,7 @@ import { useAuth } from '../lib/auth'
 import { toast } from 'sonner'
 import { trackCheckoutStarted } from '../lib/analytics'
 import { useEstate } from '../lib/firestore'
+import { API_BASE } from '../lib/client'
 import {
   Crown,
   Shield,
@@ -47,8 +48,6 @@ const TIER_COLORS: Record<string, string> = {
 
 // ─── API Client ─────────────────────────────────────────────────────────────
 
-const API_BASE = import.meta.env.VITE_API_URL || 'http://localhost:8080'
-
 async function fetchTiers(): Promise<{ tiers: Tier[]; publishableKey: string }> {
   const res = await fetch(`${API_BASE}/api/v1/payments/tiers`)
   if (!res.ok) throw new Error('Failed to fetch pricing')
@@ -195,10 +194,10 @@ function PricingPage() {
           <span>Estate Protection Plans</span>
           <div className="w-10 h-px bg-[var(--royal)]/20" />
         </div>
-        <h2 className="text-5xl font-[family-name:var(--font-cinzel)] font-bold text-slate-900 tracking-tight">
+        <h2 className="text-5xl font-[family-name:var(--font-cinzel)] font-bold text-royal tracking-tight">
           Choose Your Plan
         </h2>
-        <p className="text-slate-500 text-lg font-medium max-w-2xl mx-auto leading-relaxed">
+        <p className="text-ink-muted text-lg font-medium max-w-2xl mx-auto leading-relaxed">
           Protect your legacy with the right level of coverage. Upgrade or downgrade anytime.
         </p>
       </div>
@@ -227,7 +226,7 @@ function PricingPage() {
                   ? 'border-[var(--royal)] shadow-[0_20px_60px_rgba(19,51,120,0.15)]'
                   : isPopular
                     ? 'border-[var(--gold)]/50 shadow-lg hover:border-[var(--gold)]'
-                    : 'border-slate-100 hover:border-slate-200 hover:shadow-md'
+                    : 'border-neutral-border hover:border-gold/40 hover:shadow-md'
               }`}
             >
               {/* Popular Badge */}
@@ -251,8 +250,8 @@ function PricingPage() {
                     <Icon className="w-6 h-6" style={{ color }} />
                   </div>
                   <div>
-                    <h3 className="text-xl font-bold text-slate-900">{tier.name}</h3>
-                    <p className="text-[13px] text-slate-500">{tier.description}</p>
+                    <h3 className="text-xl font-bold text-royal">{tier.name}</h3>
+                    <p className="text-[13px] text-ink-muted">{tier.description}</p>
                   </div>
                 </div>
               </CardHeader>
@@ -262,11 +261,11 @@ function PricingPage() {
                 {/* Price */}
                 <div className="mb-8">
                   <div className="flex items-baseline gap-1">
-                    <span className="text-4xl font-bold text-slate-900">
+                    <span className="text-4xl font-bold text-ink">
                       {tier.priceCents === 0 ? 'Free' : `$${(tier.priceCents / 100).toFixed(0)}`}
                     </span>
                     {tier.priceCents > 0 && (
-                      <span className="text-[14px] text-slate-500 font-medium">/{tier.interval}</span>
+                      <span className="text-[14px] text-ink-muted font-medium">/{tier.interval}</span>
                     )}
                   </div>
                 </div>
@@ -276,7 +275,7 @@ function PricingPage() {
                   {tier.features.map((feature) => (
                     <li key={feature} className="flex items-start gap-3">
                       <Check className="w-4 h-4 mt-0.5 flex-shrink-0" style={{ color }} />
-                      <span className="text-[14px] text-slate-700">{feature}</span>
+                      <span className="text-[14px] text-ink">{feature}</span>
                     </li>
                   ))}
                 </ul>
@@ -289,9 +288,9 @@ function PricingPage() {
                   disabled={isCurrent || tier.id === 'free' || isLoading}
                   className={`w-full py-4 h-auto rounded-2xl font-bold text-[14px] transition-all flex items-center justify-center gap-2 border-0 ${
                     isCurrent
-                      ? 'bg-slate-100 text-slate-500 cursor-default hover:bg-slate-100'
+                      ? 'bg-neutral-faint text-ink-muted cursor-default hover:bg-neutral-faint'
                       : tier.id === 'free'
-                        ? 'bg-slate-100 text-slate-500 cursor-default hover:bg-slate-100'
+                        ? 'bg-neutral-faint text-ink-muted cursor-default hover:bg-neutral-faint'
                         : isPopular
                           ? 'bg-[var(--gold)] hover:bg-[var(--gold)] text-white shadow-lg'
                           : 'bg-[var(--royal)] hover:bg-[var(--royal-blue)] text-white'
@@ -315,13 +314,13 @@ function PricingPage() {
 
       {/* ── Footer Note ── */}
       <div className="text-center space-y-2">
-        <p className="text-[13px] text-slate-500">
+        <p className="text-[13px] text-ink-muted">
           Payments processed securely by <span className="font-bold">Stripe</span>. Cancel anytime.
         </p>
         <div className="flex items-center justify-center gap-3 mt-3">
-          <Badge variant="outline" className="text-[12px] text-slate-400 font-normal">SOC 2 Compliant</Badge>
-          <Badge variant="outline" className="text-[12px] text-slate-400 font-normal">Cloud KMS Encryption</Badge>
-          <Badge variant="outline" className="text-[12px] text-slate-400 font-normal">99.9% Uptime SLA</Badge>
+          <Badge variant="outline" className="text-[12px] text-ink-muted font-normal">SOC 2 Compliant</Badge>
+          <Badge variant="outline" className="text-[12px] text-ink-muted font-normal">Cloud KMS Encryption</Badge>
+          <Badge variant="outline" className="text-[12px] text-ink-muted font-normal">99.9% Uptime SLA</Badge>
         </div>
       </div>
     </div>
diff --git a/web/src/routes/estates.$estateId.probate.lazy.tsx b/web/src/routes/estates.$estateId.probate.lazy.tsx
new file mode 100644
index 0000000..8b16898
--- /dev/null
+++ b/web/src/routes/estates.$estateId.probate.lazy.tsx
@@ -0,0 +1,645 @@
+/* eslint-disable react-refresh/only-export-components */
+import { createLazyFileRoute, useParams } from '@tanstack/react-router'
+import { useState, useEffect, useCallback } from 'react'
+import { toast } from 'sonner'
+
+import { SectionHeader } from '@/components/estate/SectionHeader'
+import { SettlementGantt } from '@/components/estate/SettlementGantt'
+import { QuorumPanel } from '@/components/estate/QuorumPanel'
+import { Button } from '@/components/ui/button'
+import { Badge } from '@/components/ui/badge'
+import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
+import { Progress } from '@/components/ui/progress'
+import { Switch } from '@/components/ui/switch'
+
+import {
+  getProbateStatus,
+  getProbateChecklist,
+  updateChecklistItem,
+  getDeathCertFacts,
+  confirmDeathCert,
+  getFormTemplates,
+  getExecutorStatus,
+  confirmExecutorRole,
+  PHASE_LABELS,
+  PHASE_COLORS,
+  type ProbateStatus,
+  type ChecklistResponse,
+  type Deadline,
+  type DeathCertFacts,
+  type FormTemplate,
+  type ExecutorActivation,
+} from '@/lib/probate'
+
+export const Route = createLazyFileRoute('/estates/$estateId/probate')({
+  component: ProbatePage,
+})
+
+function ProbatePage() {
+  const { estateId } = useParams({ from: '/estates/$estateId/probate' })
+  const [status, setStatus] = useState<ProbateStatus | null>(null)
+  const [checklist, setChecklist] = useState<ChecklistResponse | null>(null)
+  const [deathCert, setDeathCert] = useState<DeathCertFacts | null>(null)
+  const [forms, setForms] = useState<FormTemplate[]>([])
+  const [executorActivation, setExecutorActivation] = useState<ExecutorActivation | null>(null)
+  const [confirmingCert, setConfirmingCert] = useState(false)
+  const [confirmingExecutor, setConfirmingExecutor] = useState(false)
+  const [loading, setLoading] = useState(true)
+  const [error, setError] = useState<string | null>(null)
+
+  const fetchData = useCallback(async () => {
+    try {
+      setLoading(true)
+      const [s, c, dc, f, ea] = await Promise.all([
+        getProbateStatus(estateId),
+        getProbateChecklist(estateId),
+        getDeathCertFacts(estateId),
+        getFormTemplates(estateId).catch(() => ({ templates: [], disclaimer: '' })),
+        getExecutorStatus(estateId),
+      ])
+      setStatus(s)
+      setChecklist(c)
+      setDeathCert(dc)
+      setForms(f.templates)
+      setExecutorActivation(ea)
+      setError(null)
+    } catch (err) {
+      setError(err instanceof Error ? err.message : 'Failed to load probate data')
+    } finally {
+      setLoading(false)
+    }
+  }, [estateId])
+
+  useEffect(() => { fetchData() }, [fetchData])
+
+  const handleToggleItem = async (itemId: string, currentValue: boolean) => {
+    const newValue = !currentValue
+    // Optimistic update
+    if (checklist) {
+      setChecklist({
+        ...checklist,
+        completed: { ...checklist.completed, [itemId]: newValue },
+      })
+    }
+    try {
+      await updateChecklistItem(estateId, itemId, newValue)
+      toast.success(newValue ? 'Item marked complete' : 'Item marked incomplete')
+    } catch {
+      // Revert on failure
+      if (checklist) {
+        setChecklist({
+          ...checklist,
+          completed: { ...checklist.completed, [itemId]: currentValue },
+        })
+      }
+      toast.error('Failed to update checklist item')
+    }
+  }
+
+  if (loading) {
+    return (
+      <div className="space-y-6">
+        <SectionHeader section="probate" />
+        <div className="flex items-center justify-center py-20">
+          <div className="animate-spin rounded-full h-8 w-8 border-2 border-[var(--gold)] border-t-transparent" />
+        </div>
+      </div>
+    )
+  }
+
+  if (error) {
+    return (
+      <div className="space-y-6">
+        <SectionHeader section="probate" />
+        <Card className="border-red-200 bg-red-50">
+          <CardContent className="pt-6">
+            <p className="text-red-700">{error}</p>
+            <Button onClick={fetchData} variant="outline" className="mt-4">Retry</Button>
+          </CardContent>
+        </Card>
+      </div>
+    )
+  }
+
+  const completedCount = checklist ? Object.values(checklist.completed).filter(Boolean).length : 0
+  const totalItems = checklist?.items.length || 0
+  const progressPct = totalItems > 0 ? Math.round((completedCount / totalItems) * 100) : 0
+
+  return (
+    <div className="space-y-6">
+      <SectionHeader
+        section="probate"
+        title="Estate Settlement"
+        subtitle="Illinois probate guidance, deadlines, and court forms"
+        action={
+          <Badge
+            className="text-xs px-3 py-1"
+            style={{ backgroundColor: 'rgba(124, 45, 18, 0.1)', color: 'var(--gold)' }}
+          >
+            {status?.stateCode || 'IL'} &middot; {status?.courtSystem || 'Cook County'}
+          </Badge>
+        }
+      />
+
+      {/* ── Phase Status Card ── */}
+      {status && (
+        <Card className="border-[var(--gold)]/20">
+          <CardHeader className="pb-3">
+            <div className="flex items-center justify-between">
+              <CardTitle className="text-lg font-semibold text-royal">
+                Current Phase
+              </CardTitle>
+              <Badge
+                className="text-sm px-3 py-1 font-medium"
+                style={{
+                  backgroundColor: `${PHASE_COLORS[status.currentPhase] || '#6B7280'}20`,
+                  color: PHASE_COLORS[status.currentPhase] || '#6B7280',
+                }}
+              >
+                {PHASE_LABELS[status.currentPhase] || status.currentPhase}
+              </Badge>
+            </div>
+          </CardHeader>
+          <CardContent>
+            <div className="grid grid-cols-1 md:grid-cols-3 gap-4 text-sm">
+              <div>
+                <span className="text-ink/60">Expected Timeline</span>
+                <p className="font-medium text-ink">{status.probableTimeline}</p>
+              </div>
+              <div>
+                <span className="text-ink/60">E-Filing</span>
+                <p className="font-medium text-ink">
+                  {status.eFilingAvailable ? 'Available (Cook County eCourt)' : 'Paper filing required'}
+                </p>
+              </div>
+              <div>
+                <span className="text-ink/60">Progress</span>
+                <div className="flex items-center gap-2 mt-1">
+                  <Progress value={progressPct} className="flex-1 h-2" />
+                  <span className="font-medium text-ink">{progressPct}%</span>
+                </div>
+              </div>
+            </div>
+          </CardContent>
+        </Card>
+      )}
+
+      {/* ── Next Action (non-dead-end dashboard) ── */}
+      {status && (
+        <NextActionCard
+          phase={status.currentPhase}
+          deathCertConfirmed={deathCert?.confirmed || false}
+          executorConfirmed={executorActivation?.status === 'confirmed'}
+          completedCount={completedCount}
+          totalItems={totalItems}
+          hasDeadlines={(status.deadlines?.length || 0) > 0}
+          overdueCount={status.deadlines?.filter(d => d.overdue).length || 0}
+        />
+      )}
+
+      {/* ── Death Certificate Review ── */}
+      {deathCert && !deathCert.confirmed && (
+        <Card className="border-amber-300 bg-amber-50">
+          <CardHeader className="pb-3">
+            <CardTitle className="text-lg font-semibold text-royal">
+              Review Death Certificate Analysis
+            </CardTitle>
+          </CardHeader>
+          <CardContent>
+            <p className="text-sm text-ink/70 mb-4">
+              AI analysis has extracted the following facts from the uploaded death certificate.
+              Please review and confirm before proceeding.
+            </p>
+            <div className="grid grid-cols-1 md:grid-cols-2 gap-3 text-sm mb-4">
+              {deathCert.decedentName && (
+                <div><span className="text-ink/50">Summary</span><p className="font-medium">{deathCert.decedentName}</p></div>
+              )}
+              {deathCert.dateOfDeath && (
+                <div><span className="text-ink/50">Date of Death</span><p className="font-medium">{deathCert.dateOfDeath}</p></div>
+              )}
+              {deathCert.countyOfDeath && (
+                <div><span className="text-ink/50">County/Jurisdiction</span><p className="font-medium">{deathCert.countyOfDeath}</p></div>
+              )}
+              {deathCert.certificateNumber && (
+                <div><span className="text-ink/50">Certificate #</span><p className="font-medium">{deathCert.certificateNumber}</p></div>
+              )}
+            </div>
+            <p className="text-xs text-amber-700 mb-3">
+              This is analysis assistance only. Verify all facts against the original document before confirming.
+            </p>
+            <Button
+              onClick={async () => {
+                setConfirmingCert(true)
+                try {
+                  await confirmDeathCert(estateId)
+                  setDeathCert({ ...deathCert, confirmed: true })
+                  toast.success('Death certificate confirmed')
+                  fetchData()
+                } catch {
+                  toast.error('Failed to confirm death certificate')
+                } finally {
+                  setConfirmingCert(false)
+                }
+              }}
+              disabled={confirmingCert}
+              className="bg-[var(--gold)] hover:bg-[var(--gold)]/90 text-white"
+            >
+              {confirmingCert ? 'Confirming...' : 'Confirm Death Certificate Facts'}
+            </Button>
+          </CardContent>
+        </Card>
+      )}
+
+      {deathCert?.confirmed && (
+        <Card className="border-green-200 bg-green-50/50">
+          <CardContent className="pt-6">
+            <div className="flex items-center gap-2">
+              <Badge className="bg-green-100 text-green-700">Confirmed</Badge>
+              <span className="text-sm text-ink/70">Death certificate verified by executor</span>
+            </div>
+          </CardContent>
+        </Card>
+      )}
+
+      {/* ── Executor Confirmation ── */}
+      {status?.currentPhase === 'death_reported' && !executorActivation?.status && (
+        <Card className="border-blue-300 bg-blue-50">
+          <CardHeader className="pb-3">
+            <CardTitle className="text-lg font-semibold text-royal">
+              Confirm Your Role as Executor
+            </CardTitle>
+          </CardHeader>
+          <CardContent>
+            <p className="text-sm text-ink/70 mb-4">
+              A death has been reported for this estate. As the designated executor, you must confirm your role
+              before probate proceedings can begin. By confirming, you accept responsibility for administering
+              the estate according to Illinois law.
+            </p>
+            <Button
+              onClick={async () => {
+                setConfirmingExecutor(true)
+                try {
+                  await confirmExecutorRole(estateId)
+                  toast.success('Executor role confirmed — you may now proceed with probate')
+                  fetchData()
+                } catch (err) {
+                  toast.error(err instanceof Error ? err.message : 'Failed to confirm executor role')
+                } finally {
+                  setConfirmingExecutor(false)
+                }
+              }}
+              disabled={confirmingExecutor}
+              className="bg-[var(--royal)] hover:bg-[var(--royal)]/90 text-white"
+            >
+              {confirmingExecutor ? 'Confirming...' : 'I Confirm My Role as Executor'}
+            </Button>
+          </CardContent>
+        </Card>
+      )}
+
+      {executorActivation?.status === 'confirmed' && (
+        <Card className="border-green-200 bg-green-50/50">
+          <CardContent className="pt-6">
+            <div className="flex items-center gap-2">
+              <Badge className="bg-green-100 text-green-700">Executor Confirmed</Badge>
+              <span className="text-sm text-ink/70">
+                {executorActivation.executorName || 'Executor'} confirmed their role
+                {executorActivation.confirmedAt && ` on ${new Date(executorActivation.confirmedAt).toLocaleDateString()}`}
+              </span>
+            </div>
+          </CardContent>
+        </Card>
+      )}
+
+      {/* ── Multi-Executor Quorum ── */}
+      <QuorumPanel estateId={estateId} />
+
+      {/* ── Deadlines ── */}
+      {status?.deadlines && status.deadlines.length > 0 && (
+        <Card className="border-[var(--gold)]/20">
+          <CardHeader className="pb-3">
+            <CardTitle className="text-lg font-semibold text-royal">
+              Active Deadlines
+            </CardTitle>
+          </CardHeader>
+          <CardContent>
+            <div className="space-y-3">
+              {status.deadlines.map((d: Deadline) => (
+                <DeadlineRow key={d.id} deadline={d} />
+              ))}
+            </div>
+          </CardContent>
+        </Card>
+      )}
+
+      {/* ── Settlement Timeline (Gantt) ── */}
+      {status?.deadlines && status.deadlines.length > 0 && (
+        <Card className="border-[var(--gold)]/20">
+          <CardHeader className="pb-3">
+            <CardTitle className="text-lg font-semibold text-royal">
+              Settlement Timeline
+            </CardTitle>
+          </CardHeader>
+          <CardContent>
+            <SettlementGantt
+              deadlines={status.deadlines}
+              dateOfDeath={deathCert?.dateOfDeath}
+            />
+          </CardContent>
+        </Card>
+      )}
+
+      {/* ── Checklist ── */}
+      {checklist && (
+        <Card className="border-[var(--gold)]/20">
+          <CardHeader className="pb-3">
+            <div className="flex items-center justify-between">
+              <CardTitle className="text-lg font-semibold text-royal">
+                Probate Checklist
+              </CardTitle>
+              <span className="text-sm text-ink/60">
+                {completedCount} of {totalItems} complete
+              </span>
+            </div>
+          </CardHeader>
+          <CardContent>
+            <div className="space-y-2">
+              {checklist.items.map((item) => {
+                const isComplete = checklist.completed[item.id] || false
+                return (
+                  <div
+                    key={item.id}
+                    className={`flex items-start gap-3 p-3 rounded-lg border transition-colors ${
+                      isComplete
+                        ? 'bg-green-50/50 border-green-200/50'
+                        : 'bg-white border-royal/10 hover:border-[var(--gold)]/30'
+                    }`}
+                  >
+                    <div className="pt-0.5">
+                      <Switch
+                        checked={isComplete}
+                        onCheckedChange={() => handleToggleItem(item.id, isComplete)}
+                      />
+                    </div>
+                    <div className="flex-1 min-w-0">
+                      <div className="flex items-center gap-2">
+                        <span className={`font-medium text-sm ${isComplete ? 'line-through text-ink/40' : 'text-ink'}`}>
+                          {item.order}. {item.title}
+                        </span>
+                        {item.required && (
+                          <Badge variant="outline" className="text-[10px] px-1.5 py-0 border-[var(--gold)]/30 text-[var(--gold)]">
+                            Required
+                          </Badge>
+                        )}
+                        {item.formRef && (
+                          <Badge variant="outline" className="text-[10px] px-1.5 py-0 border-[var(--royal)]/30 text-[var(--royal)]">
+                            {item.formRef}
+                          </Badge>
+                        )}
+                      </div>
+                      <p className={`text-xs mt-1 ${isComplete ? 'text-ink/30' : 'text-ink/60'}`}>
+                        {item.description}
+                      </p>
+                      {item.formUrl && !isComplete && (
+                        <a
+                          href={item.formUrl}
+                          target="_blank"
+                          rel="noopener noreferrer"
+                          className="inline-block mt-1.5 text-xs font-medium text-[var(--royal)] hover:underline"
+                        >
+                          View form &rarr;
+                        </a>
+                      )}
+                    </div>
+                  </div>
+                )
+              })}
+            </div>
+          </CardContent>
+        </Card>
+      )}
+
+      {/* ── Court Forms ── */}
+      {forms.length > 0 && (
+        <Card className="border-[var(--gold)]/20">
+          <CardHeader className="pb-3">
+            <CardTitle className="text-lg font-semibold text-royal">
+              Court Form Preparation
+            </CardTitle>
+          </CardHeader>
+          <CardContent>
+            <p className="text-xs text-amber-700 mb-4 p-2 bg-amber-50 rounded border border-amber-200">
+              These are draft preparation packets only — not legal filings or legal advice. Review all information for accuracy before filing with the court.
+            </p>
+            <div className="grid grid-cols-1 md:grid-cols-2 gap-3">
+              {forms.map((form) => (
+                <div key={form.id} className="p-4 rounded-lg border border-royal/10 hover:border-[var(--gold)]/30 transition-colors">
+                  <div className="flex items-start justify-between gap-2">
+                    <div className="flex-1">
+                      <div className="flex items-center gap-2 mb-1">
+                        <span className="font-medium text-sm text-ink">{form.name}</span>
+                        <Badge variant="outline" className="text-[10px] px-1.5 py-0 border-[var(--royal)]/30 text-[var(--royal)]">
+                          {form.formNumber}
+                        </Badge>
+                      </div>
+                      <p className="text-xs text-ink/60 mb-2">{form.description}</p>
+                      <div className="flex flex-wrap gap-1">
+                        {Object.entries(form.fields).filter(([, v]) => v).slice(0, 3).map(([k, v]) => (
+                          <span key={k} className="text-[10px] px-1.5 py-0.5 rounded bg-[var(--royal-subtle)] text-ink/50">
+                            {k.replace(/([A-Z])/g, ' $1').trim()}: {v}
+                          </span>
+                        ))}
+                      </div>
+                    </div>
+                  </div>
+                  <div className="flex gap-2 mt-3">
+                    <a
+                      href={form.courtUrl}
+                      target="_blank"
+                      rel="noopener noreferrer"
+                      className="text-xs font-medium text-[var(--royal)] hover:underline"
+                    >
+                      Official form &rarr;
+                    </a>
+                  </div>
+                </div>
+              ))}
+            </div>
+          </CardContent>
+        </Card>
+      )}
+
+      {/* ── Legal Disclaimer ── */}
+      <p className="text-xs text-ink/40 text-center px-4">
+        This checklist is preparation assistance only and does not constitute legal advice.
+        Consult a licensed Illinois attorney for advice specific to your situation.
+      </p>
+    </div>
+  )
+}
+
+// ── Next Action Card (non-dead-end per Codex B7) ──
+
+function NextActionCard({ phase, deathCertConfirmed, executorConfirmed, completedCount, totalItems, hasDeadlines, overdueCount }: {
+  phase: string
+  deathCertConfirmed: boolean
+  executorConfirmed: boolean
+  completedCount: number
+  totalItems: number
+  hasDeadlines: boolean
+  overdueCount: number
+}) {
+  const action = getNextAction(phase, deathCertConfirmed, executorConfirmed, completedCount, totalItems, hasDeadlines, overdueCount)
+
+  return (
+    <Card className="border-[var(--royal)]/20 bg-gradient-to-r from-neutral-faint to-neutral-faint">
+      <CardContent className="pt-6">
+        <div className="flex items-start gap-3">
+          <div className="w-8 h-8 rounded-full bg-[var(--royal)]/10 flex items-center justify-center shrink-0">
+            <span className="text-lg">{action.icon}</span>
+          </div>
+          <div>
+            <h3 className="font-semibold text-[var(--royal)] text-sm">{action.title}</h3>
+            <p className="text-sm text-ink/70 mt-1">{action.description}</p>
+            {action.blockedReason && (
+              <p className="text-xs text-amber-700 mt-2 p-2 bg-amber-50 rounded">{action.blockedReason}</p>
+            )}
+          </div>
+        </div>
+      </CardContent>
+    </Card>
+  )
+}
+
+function getNextAction(phase: string, deathCertConfirmed: boolean, executorConfirmed: boolean, completedCount: number, totalItems: number, hasDeadlines: boolean, overdueCount: number) {
+  if (phase === 'active') {
+    return {
+      icon: '🛡️',
+      title: 'Estate is Active',
+      description: 'No probate action needed. This section will guide you through the process when the time comes. For now, focus on completing your estate plan — advance directives, beneficiary designations, and asset inventory.',
+      blockedReason: null,
+    }
+  }
+
+  if (phase === 'death_reported' && !deathCertConfirmed) {
+    return {
+      icon: '📋',
+      title: 'Upload and Confirm Death Certificate',
+      description: 'A death has been reported. Upload the certified death certificate to the document vault, then submit it for AI analysis. Review the extracted facts and confirm them to proceed.',
+      blockedReason: null,
+    }
+  }
+
+  if (phase === 'death_reported' && deathCertConfirmed && !executorConfirmed) {
+    return {
+      icon: '✋',
+      title: 'Confirm Your Executor Role',
+      description: 'The death certificate has been verified. The designated executor must now confirm their role to begin probate proceedings. Scroll down to the executor confirmation section.',
+      blockedReason: null,
+    }
+  }
+
+  if (phase === 'executor_confirmed') {
+    return {
+      icon: '⚖️',
+      title: 'File Petition for Probate',
+      description: 'You are confirmed as executor. The next step is to file the Petition for Probate (CCP0315) with the Cook County Circuit Court. Use the form preparation section below to pre-fill the petition with estate data. Once Letters of Office are received, transition the estate to "In Probate."',
+      blockedReason: null,
+    }
+  }
+
+  if (phase === 'in_probate') {
+    if (overdueCount > 0) {
+      return {
+        icon: '🔴',
+        title: `${overdueCount} Overdue Deadline${overdueCount > 1 ? 's' : ''}`,
+        description: 'You have overdue items that need immediate attention. Check the deadlines section below and address overdue filings as soon as possible.',
+        blockedReason: null,
+      }
+    }
+    if (completedCount < totalItems) {
+      return {
+        icon: '📝',
+        title: `Complete Checklist (${completedCount}/${totalItems})`,
+        description: 'Work through the probate checklist items below. Mark each step as complete as you file documents, pay debts, and distribute assets. All items must be complete before closing the estate.',
+        blockedReason: null,
+      }
+    }
+    return {
+      icon: '✅',
+      title: 'Ready to Close',
+      description: 'All checklist items are complete. Prepare the final accounting, obtain Receipt and Release from all beneficiaries, and file to close the estate with the court.',
+      blockedReason: null,
+    }
+  }
+
+  if (phase === 'probate_complete') {
+    return {
+      icon: '📊',
+      title: 'File Final Accounting and Close',
+      description: 'Probate proceedings are complete. File the final accounting with the court, distribute remaining assets to beneficiaries, and request discharge. Once the court approves, the estate can be formally closed.',
+      blockedReason: null,
+    }
+  }
+
+  if (phase === 'closed') {
+    return {
+      icon: '🏛️',
+      title: 'Estate Closed',
+      description: 'This estate has been formally closed. All distributions are complete and the court has discharged the executor. This record will be preserved for your family\'s reference.',
+      blockedReason: null,
+    }
+  }
+
+  if (phase === 'small_estate') {
+    return {
+      icon: '📄',
+      title: 'Small Estate Affidavit Process',
+      description: 'This estate qualifies for the small estate affidavit ($150K threshold, vehicles excluded). Wait at least 30 days after death, then present the affidavit to institutions holding estate property. No formal probate is required.',
+      blockedReason: null,
+    }
+  }
+
+  return {
+    icon: 'ℹ️',
+    title: 'Estate Settlement',
+    description: 'View the checklist and deadlines below to track progress.',
+    blockedReason: null,
+  }
+}
+
+// ── Deadline Row Component ──
+
+function DeadlineRow({ deadline }: { deadline: Deadline }) {
+  const isOverdue = deadline.overdue
+  const isUrgent = !isOverdue && deadline.daysFromNow <= 7
+
+  return (
+    <div className={`flex items-center justify-between p-3 rounded-lg border ${
+      isOverdue
+        ? 'bg-red-50 border-red-200'
+        : isUrgent
+          ? 'bg-amber-50 border-amber-200'
+          : 'bg-white border-royal/10'
+    }`}>
+      <div className="flex-1">
+        <div className="flex items-center gap-2">
+          <span className="font-medium text-sm text-ink">{deadline.name}</span>
+          {isOverdue && <Badge className="bg-red-100 text-red-700 text-[10px]">Overdue</Badge>}
+          {isUrgent && <Badge className="bg-amber-100 text-amber-700 text-[10px]">Urgent</Badge>}
+        </div>
+        <p className="text-xs text-ink/60 mt-0.5">{deadline.description}</p>
+      </div>
+      <div className="text-right ml-4 shrink-0">
+        <p className={`text-sm font-medium ${isOverdue ? 'text-red-600' : isUrgent ? 'text-amber-600' : 'text-ink'}`}>
+          {isOverdue
+            ? `${Math.abs(deadline.daysFromNow)} days overdue`
+            : `${deadline.daysFromNow} days`}
+        </p>
+        <p className="text-[10px] text-ink/40">
+          {new Date(deadline.dueDate).toLocaleDateString('en-US', { month: 'short', day: 'numeric', year: 'numeric' })}
+        </p>
+      </div>
+    </div>
+  )
+}
diff --git a/web/src/routes/estates.$estateId.probate.tsx b/web/src/routes/estates.$estateId.probate.tsx
index fa02f38..20c972d 100644
--- a/web/src/routes/estates.$estateId.probate.tsx
+++ b/web/src/routes/estates.$estateId.probate.tsx
@@ -1,645 +1,6 @@
-/* eslint-disable react-refresh/only-export-components */
-import { createFileRoute, useParams } from '@tanstack/react-router'
-import { useState, useEffect, useCallback } from 'react'
-import { toast } from 'sonner'
+import { createFileRoute } from '@tanstack/react-router'
 
-import { SectionHeader } from '@/components/estate/SectionHeader'
-import { SettlementGantt } from '@/components/estate/SettlementGantt'
-import { QuorumPanel } from '@/components/estate/QuorumPanel'
-import { Button } from '@/components/ui/button'
-import { Badge } from '@/components/ui/badge'
-import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
-import { Progress } from '@/components/ui/progress'
-import { Switch } from '@/components/ui/switch'
-
-import {
-  getProbateStatus,
-  getProbateChecklist,
-  updateChecklistItem,
-  getDeathCertFacts,
-  confirmDeathCert,
-  getFormTemplates,
-  getExecutorStatus,
-  confirmExecutorRole,
-  PHASE_LABELS,
-  PHASE_COLORS,
-  type ProbateStatus,
-  type ChecklistResponse,
-  type Deadline,
-  type DeathCertFacts,
-  type FormTemplate,
-  type ExecutorActivation,
-} from '@/lib/probate'
-
-export const Route = createFileRoute('/estates/$estateId/probate')({
-  component: ProbatePage,
-})
-
-function ProbatePage() {
-  const { estateId } = useParams({ from: '/estates/$estateId/probate' })
-  const [status, setStatus] = useState<ProbateStatus | null>(null)
-  const [checklist, setChecklist] = useState<ChecklistResponse | null>(null)
-  const [deathCert, setDeathCert] = useState<DeathCertFacts | null>(null)
-  const [forms, setForms] = useState<FormTemplate[]>([])
-  const [executorActivation, setExecutorActivation] = useState<ExecutorActivation | null>(null)
-  const [confirmingCert, setConfirmingCert] = useState(false)
-  const [confirmingExecutor, setConfirmingExecutor] = useState(false)
-  const [loading, setLoading] = useState(true)
-  const [error, setError] = useState<string | null>(null)
-
-  const fetchData = useCallback(async () => {
-    try {
-      setLoading(true)
-      const [s, c, dc, f, ea] = await Promise.all([
-        getProbateStatus(estateId),
-        getProbateChecklist(estateId),
-        getDeathCertFacts(estateId),
-        getFormTemplates(estateId).catch(() => ({ templates: [], disclaimer: '' })),
-        getExecutorStatus(estateId),
-      ])
-      setStatus(s)
-      setChecklist(c)
-      setDeathCert(dc)
-      setForms(f.templates)
-      setExecutorActivation(ea)
-      setError(null)
-    } catch (err) {
-      setError(err instanceof Error ? err.message : 'Failed to load probate data')
-    } finally {
-      setLoading(false)
-    }
-  }, [estateId])
-
-  useEffect(() => { fetchData() }, [fetchData])
-
-  const handleToggleItem = async (itemId: string, currentValue: boolean) => {
-    const newValue = !currentValue
-    // Optimistic update
-    if (checklist) {
-      setChecklist({
-        ...checklist,
-        completed: { ...checklist.completed, [itemId]: newValue },
-      })
-    }
-    try {
-      await updateChecklistItem(estateId, itemId, newValue)
-      toast.success(newValue ? 'Item marked complete' : 'Item marked incomplete')
-    } catch {
-      // Revert on failure
-      if (checklist) {
-        setChecklist({
-          ...checklist,
-          completed: { ...checklist.completed, [itemId]: currentValue },
-        })
-      }
-      toast.error('Failed to update checklist item')
-    }
-  }
-
-  if (loading) {
-    return (
-      <div className="space-y-6">
-        <SectionHeader section="probate" />
-        <div className="flex items-center justify-center py-20">
-          <div className="animate-spin rounded-full h-8 w-8 border-2 border-[var(--gold)] border-t-transparent" />
-        </div>
-      </div>
-    )
-  }
-
-  if (error) {
-    return (
-      <div className="space-y-6">
-        <SectionHeader section="probate" />
-        <Card className="border-red-200 bg-red-50">
-          <CardContent className="pt-6">
-            <p className="text-red-700">{error}</p>
-            <Button onClick={fetchData} variant="outline" className="mt-4">Retry</Button>
-          </CardContent>
-        </Card>
-      </div>
-    )
-  }
-
-  const completedCount = checklist ? Object.values(checklist.completed).filter(Boolean).length : 0
-  const totalItems = checklist?.items.length || 0
-  const progressPct = totalItems > 0 ? Math.round((completedCount / totalItems) * 100) : 0
-
-  return (
-    <div className="space-y-6">
-      <SectionHeader
-        section="probate"
-        title="Estate Settlement"
-        subtitle="Illinois probate guidance, deadlines, and court forms"
-        action={
-          <Badge
-            className="text-xs px-3 py-1"
-            style={{ backgroundColor: 'rgba(124, 45, 18, 0.1)', color: 'var(--gold)' }}
-          >
-            {status?.stateCode || 'IL'} &middot; {status?.courtSystem || 'Cook County'}
-          </Badge>
-        }
-      />
-
-      {/* ── Phase Status Card ── */}
-      {status && (
-        <Card className="border-[var(--gold)]/20">
-          <CardHeader className="pb-3">
-            <div className="flex items-center justify-between">
-              <CardTitle className="text-lg font-semibold text-slate-900">
-                Current Phase
-              </CardTitle>
-              <Badge
-                className="text-sm px-3 py-1 font-medium"
-                style={{
-                  backgroundColor: `${PHASE_COLORS[status.currentPhase] || '#6B7280'}20`,
-                  color: PHASE_COLORS[status.currentPhase] || '#6B7280',
-                }}
-              >
-                {PHASE_LABELS[status.currentPhase] || status.currentPhase}
-              </Badge>
-            </div>
-          </CardHeader>
-          <CardContent>
-            <div className="grid grid-cols-1 md:grid-cols-3 gap-4 text-sm">
-              <div>
-                <span className="text-slate-900/60">Expected Timeline</span>
-                <p className="font-medium text-slate-900">{status.probableTimeline}</p>
-              </div>
-              <div>
-                <span className="text-slate-900/60">E-Filing</span>
-                <p className="font-medium text-slate-900">
-                  {status.eFilingAvailable ? 'Available (Cook County eCourt)' : 'Paper filing required'}
-                </p>
-              </div>
-              <div>
-                <span className="text-slate-900/60">Progress</span>
-                <div className="flex items-center gap-2 mt-1">
-                  <Progress value={progressPct} className="flex-1 h-2" />
-                  <span className="font-medium text-slate-900">{progressPct}%</span>
-                </div>
-              </div>
-            </div>
-          </CardContent>
-        </Card>
-      )}
-
-      {/* ── Next Action (non-dead-end dashboard) ── */}
-      {status && (
-        <NextActionCard
-          phase={status.currentPhase}
-          deathCertConfirmed={deathCert?.confirmed || false}
-          executorConfirmed={executorActivation?.status === 'confirmed'}
-          completedCount={completedCount}
-          totalItems={totalItems}
-          hasDeadlines={(status.deadlines?.length || 0) > 0}
-          overdueCount={status.deadlines?.filter(d => d.overdue).length || 0}
-        />
-      )}
-
-      {/* ── Death Certificate Review ── */}
-      {deathCert && !deathCert.confirmed && (
-        <Card className="border-amber-300 bg-amber-50">
-          <CardHeader className="pb-3">
-            <CardTitle className="text-lg font-semibold text-slate-900">
-              Review Death Certificate Analysis
-            </CardTitle>
-          </CardHeader>
-          <CardContent>
-            <p className="text-sm text-slate-900/70 mb-4">
-              AI analysis has extracted the following facts from the uploaded death certificate.
-              Please review and confirm before proceeding.
-            </p>
-            <div className="grid grid-cols-1 md:grid-cols-2 gap-3 text-sm mb-4">
-              {deathCert.decedentName && (
-                <div><span className="text-slate-900/50">Summary</span><p className="font-medium">{deathCert.decedentName}</p></div>
-              )}
-              {deathCert.dateOfDeath && (
-                <div><span className="text-slate-900/50">Date of Death</span><p className="font-medium">{deathCert.dateOfDeath}</p></div>
-              )}
-              {deathCert.countyOfDeath && (
-                <div><span className="text-slate-900/50">County/Jurisdiction</span><p className="font-medium">{deathCert.countyOfDeath}</p></div>
-              )}
-              {deathCert.certificateNumber && (
-                <div><span className="text-slate-900/50">Certificate #</span><p className="font-medium">{deathCert.certificateNumber}</p></div>
-              )}
-            </div>
-            <p className="text-xs text-amber-700 mb-3">
-              This is analysis assistance only. Verify all facts against the original document before confirming.
-            </p>
-            <Button
-              onClick={async () => {
-                setConfirmingCert(true)
-                try {
-                  await confirmDeathCert(estateId)
-                  setDeathCert({ ...deathCert, confirmed: true })
-                  toast.success('Death certificate confirmed')
-                  fetchData()
-                } catch {
-                  toast.error('Failed to confirm death certificate')
-                } finally {
-                  setConfirmingCert(false)
-                }
-              }}
-              disabled={confirmingCert}
-              className="bg-[var(--gold)] hover:bg-[var(--gold)]/90 text-white"
-            >
-              {confirmingCert ? 'Confirming...' : 'Confirm Death Certificate Facts'}
-            </Button>
-          </CardContent>
-        </Card>
-      )}
-
-      {deathCert?.confirmed && (
-        <Card className="border-green-200 bg-green-50/50">
-          <CardContent className="pt-6">
-            <div className="flex items-center gap-2">
-              <Badge className="bg-green-100 text-green-700">Confirmed</Badge>
-              <span className="text-sm text-slate-900/70">Death certificate verified by executor</span>
-            </div>
-          </CardContent>
-        </Card>
-      )}
-
-      {/* ── Executor Confirmation ── */}
-      {status?.currentPhase === 'death_reported' && !executorActivation?.status && (
-        <Card className="border-blue-300 bg-blue-50">
-          <CardHeader className="pb-3">
-            <CardTitle className="text-lg font-semibold text-slate-900">
-              Confirm Your Role as Executor
-            </CardTitle>
-          </CardHeader>
-          <CardContent>
-            <p className="text-sm text-slate-900/70 mb-4">
-              A death has been reported for this estate. As the designated executor, you must confirm your role
-              before probate proceedings can begin. By confirming, you accept responsibility for administering
-              the estate according to Illinois law.
-            </p>
-            <Button
-              onClick={async () => {
-                setConfirmingExecutor(true)
-                try {
-                  await confirmExecutorRole(estateId)
-                  toast.success('Executor role confirmed — you may now proceed with probate')
-                  fetchData()
-                } catch (err) {
-                  toast.error(err instanceof Error ? err.message : 'Failed to confirm executor role')
-                } finally {
-                  setConfirmingExecutor(false)
-                }
-              }}
-              disabled={confirmingExecutor}
-              className="bg-[var(--royal)] hover:bg-[var(--royal)]/90 text-white"
-            >
-              {confirmingExecutor ? 'Confirming...' : 'I Confirm My Role as Executor'}
-            </Button>
-          </CardContent>
-        </Card>
-      )}
-
-      {executorActivation?.status === 'confirmed' && (
-        <Card className="border-green-200 bg-green-50/50">
-          <CardContent className="pt-6">
-            <div className="flex items-center gap-2">
-              <Badge className="bg-green-100 text-green-700">Executor Confirmed</Badge>
-              <span className="text-sm text-slate-900/70">
-                {executorActivation.executorName || 'Executor'} confirmed their role
-                {executorActivation.confirmedAt && ` on ${new Date(executorActivation.confirmedAt).toLocaleDateString()}`}
-              </span>
-            </div>
-          </CardContent>
-        </Card>
-      )}
-
-      {/* ── Multi-Executor Quorum ── */}
-      <QuorumPanel estateId={estateId} />
-
-      {/* ── Deadlines ── */}
-      {status?.deadlines && status.deadlines.length > 0 && (
-        <Card className="border-[var(--gold)]/20">
-          <CardHeader className="pb-3">
-            <CardTitle className="text-lg font-semibold text-slate-900">
-              Active Deadlines
-            </CardTitle>
-          </CardHeader>
-          <CardContent>
-            <div className="space-y-3">
-              {status.deadlines.map((d: Deadline) => (
-                <DeadlineRow key={d.id} deadline={d} />
-              ))}
-            </div>
-          </CardContent>
-        </Card>
-      )}
-
-      {/* ── Settlement Timeline (Gantt) ── */}
-      {status?.deadlines && status.deadlines.length > 0 && (
-        <Card className="border-[var(--gold)]/20">
-          <CardHeader className="pb-3">
-            <CardTitle className="text-lg font-semibold text-slate-900">
-              Settlement Timeline
-            </CardTitle>
-          </CardHeader>
-          <CardContent>
-            <SettlementGantt
-              deadlines={status.deadlines}
-              dateOfDeath={deathCert?.dateOfDeath}
-            />
-          </CardContent>
-        </Card>
-      )}
-
-      {/* ── Checklist ── */}
-      {checklist && (
-        <Card className="border-[var(--gold)]/20">
-          <CardHeader className="pb-3">
-            <div className="flex items-center justify-between">
-              <CardTitle className="text-lg font-semibold text-slate-900">
-                Probate Checklist
-              </CardTitle>
-              <span className="text-sm text-slate-900/60">
-                {completedCount} of {totalItems} complete
-              </span>
-            </div>
-          </CardHeader>
-          <CardContent>
-            <div className="space-y-2">
-              {checklist.items.map((item) => {
-                const isComplete = checklist.completed[item.id] || false
-                return (
-                  <div
-                    key={item.id}
-                    className={`flex items-start gap-3 p-3 rounded-lg border transition-colors ${
-                      isComplete
-                        ? 'bg-green-50/50 border-green-200/50'
-                        : 'bg-white border-slate-900/10 hover:border-[var(--gold)]/30'
-                    }`}
-                  >
-                    <div className="pt-0.5">
-                      <Switch
-                        checked={isComplete}
-                        onCheckedChange={() => handleToggleItem(item.id, isComplete)}
-                      />
-                    </div>
-                    <div className="flex-1 min-w-0">
-                      <div className="flex items-center gap-2">
-                        <span className={`font-medium text-sm ${isComplete ? 'line-through text-slate-900/40' : 'text-slate-900'}`}>
-                          {item.order}. {item.title}
-                        </span>
-                        {item.required && (
-                          <Badge variant="outline" className="text-[10px] px-1.5 py-0 border-[var(--gold)]/30 text-[var(--gold)]">
-                            Required
-                          </Badge>
-                        )}
-                        {item.formRef && (
-                          <Badge variant="outline" className="text-[10px] px-1.5 py-0 border-[var(--royal)]/30 text-[var(--royal)]">
-                            {item.formRef}
-                          </Badge>
-                        )}
-                      </div>
-                      <p className={`text-xs mt-1 ${isComplete ? 'text-slate-900/30' : 'text-slate-900/60'}`}>
-                        {item.description}
-                      </p>
-                      {item.formUrl && !isComplete && (
-                        <a
-                          href={item.formUrl}
-                          target="_blank"
-                          rel="noopener noreferrer"
-                          className="inline-block mt-1.5 text-xs font-medium text-[var(--royal)] hover:underline"
-                        >
-                          View form &rarr;
-                        </a>
-                      )}
-                    </div>
-                  </div>
-                )
-              })}
-            </div>
-          </CardContent>
-        </Card>
-      )}
-
-      {/* ── Court Forms ── */}
-      {forms.length > 0 && (
-        <Card className="border-[var(--gold)]/20">
-          <CardHeader className="pb-3">
-            <CardTitle className="text-lg font-semibold text-slate-900">
-              Court Form Preparation
-            </CardTitle>
-          </CardHeader>
-          <CardContent>
-            <p className="text-xs text-amber-700 mb-4 p-2 bg-amber-50 rounded border border-amber-200">
-              These are draft preparation packets only — not legal filings or legal advice. Review all information for accuracy before filing with the court.
-            </p>
-            <div className="grid grid-cols-1 md:grid-cols-2 gap-3">
-              {forms.map((form) => (
-                <div key={form.id} className="p-4 rounded-lg border border-slate-900/10 hover:border-[var(--gold)]/30 transition-colors">
-                  <div className="flex items-start justify-between gap-2">
-                    <div className="flex-1">
-                      <div className="flex items-center gap-2 mb-1">
-                        <span className="font-medium text-sm text-slate-900">{form.name}</span>
-                        <Badge variant="outline" className="text-[10px] px-1.5 py-0 border-[var(--royal)]/30 text-[var(--royal)]">
-                          {form.formNumber}
-                        </Badge>
-                      </div>
-                      <p className="text-xs text-slate-900/60 mb-2">{form.description}</p>
-                      <div className="flex flex-wrap gap-1">
-                        {Object.entries(form.fields).filter(([, v]) => v).slice(0, 3).map(([k, v]) => (
-                          <span key={k} className="text-[10px] px-1.5 py-0.5 rounded bg-slate-900/5 text-slate-900/50">
-                            {k.replace(/([A-Z])/g, ' $1').trim()}: {v}
-                          </span>
-                        ))}
-                      </div>
-                    </div>
-                  </div>
-                  <div className="flex gap-2 mt-3">
-                    <a
-                      href={form.courtUrl}
-                      target="_blank"
-                      rel="noopener noreferrer"
-                      className="text-xs font-medium text-[var(--royal)] hover:underline"
-                    >
-                      Official form &rarr;
-                    </a>
-                  </div>
-                </div>
-              ))}
-            </div>
-          </CardContent>
-        </Card>
-      )}
-
-      {/* ── Legal Disclaimer ── */}
-      <p className="text-xs text-slate-900/40 text-center px-4">
-        This checklist is preparation assistance only and does not constitute legal advice.
-        Consult a licensed Illinois attorney for advice specific to your situation.
-      </p>
-    </div>
-  )
-}
-
-// ── Next Action Card (non-dead-end per Codex B7) ──
-
-function NextActionCard({ phase, deathCertConfirmed, executorConfirmed, completedCount, totalItems, hasDeadlines, overdueCount }: {
-  phase: string
-  deathCertConfirmed: boolean
-  executorConfirmed: boolean
-  completedCount: number
-  totalItems: number
-  hasDeadlines: boolean
-  overdueCount: number
-}) {
-  const action = getNextAction(phase, deathCertConfirmed, executorConfirmed, completedCount, totalItems, hasDeadlines, overdueCount)
-
-  return (
-    <Card className="border-[var(--royal)]/20 bg-gradient-to-r from-slate-50 to-slate-100">
-      <CardContent className="pt-6">
-        <div className="flex items-start gap-3">
-          <div className="w-8 h-8 rounded-full bg-[var(--royal)]/10 flex items-center justify-center shrink-0">
-            <span className="text-lg">{action.icon}</span>
-          </div>
-          <div>
-            <h3 className="font-semibold text-[var(--royal)] text-sm">{action.title}</h3>
-            <p className="text-sm text-slate-900/70 mt-1">{action.description}</p>
-            {action.blockedReason && (
-              <p className="text-xs text-amber-700 mt-2 p-2 bg-amber-50 rounded">{action.blockedReason}</p>
-            )}
-          </div>
-        </div>
-      </CardContent>
-    </Card>
-  )
-}
-
-function getNextAction(phase: string, deathCertConfirmed: boolean, executorConfirmed: boolean, completedCount: number, totalItems: number, hasDeadlines: boolean, overdueCount: number) {
-  if (phase === 'active') {
-    return {
-      icon: '🛡️',
-      title: 'Estate is Active',
-      description: 'No probate action needed. This section will guide you through the process when the time comes. For now, focus on completing your estate plan — advance directives, beneficiary designations, and asset inventory.',
-      blockedReason: null,
-    }
-  }
-
-  if (phase === 'death_reported' && !deathCertConfirmed) {
-    return {
-      icon: '📋',
-      title: 'Upload and Confirm Death Certificate',
-      description: 'A death has been reported. Upload the certified death certificate to the document vault, then submit it for AI analysis. Review the extracted facts and confirm them to proceed.',
-      blockedReason: null,
-    }
-  }
-
-  if (phase === 'death_reported' && deathCertConfirmed && !executorConfirmed) {
-    return {
-      icon: '✋',
-      title: 'Confirm Your Executor Role',
-      description: 'The death certificate has been verified. The designated executor must now confirm their role to begin probate proceedings. Scroll down to the executor confirmation section.',
-      blockedReason: null,
-    }
-  }
-
-  if (phase === 'executor_confirmed') {
-    return {
-      icon: '⚖️',
-      title: 'File Petition for Probate',
-      description: 'You are confirmed as executor. The next step is to file the Petition for Probate (CCP0315) with the Cook County Circuit Court. Use the form preparation section below to pre-fill the petition with estate data. Once Letters of Office are received, transition the estate to "In Probate."',
-      blockedReason: null,
-    }
-  }
-
-  if (phase === 'in_probate') {
-    if (overdueCount > 0) {
-      return {
-        icon: '🔴',
-        title: `${overdueCount} Overdue Deadline${overdueCount > 1 ? 's' : ''}`,
-        description: 'You have overdue items that need immediate attention. Check the deadlines section below and address overdue filings as soon as possible.',
-        blockedReason: null,
-      }
-    }
-    if (completedCount < totalItems) {
-      return {
-        icon: '📝',
-        title: `Complete Checklist (${completedCount}/${totalItems})`,
-        description: 'Work through the probate checklist items below. Mark each step as complete as you file documents, pay debts, and distribute assets. All items must be complete before closing the estate.',
-        blockedReason: null,
-      }
-    }
-    return {
-      icon: '✅',
-      title: 'Ready to Close',
-      description: 'All checklist items are complete. Prepare the final accounting, obtain Receipt and Release from all beneficiaries, and file to close the estate with the court.',
-      blockedReason: null,
-    }
-  }
-
-  if (phase === 'probate_complete') {
-    return {
-      icon: '📊',
-      title: 'File Final Accounting and Close',
-      description: 'Probate proceedings are complete. File the final accounting with the court, distribute remaining assets to beneficiaries, and request discharge. Once the court approves, the estate can be formally closed.',
-      blockedReason: null,
-    }
-  }
-
-  if (phase === 'closed') {
-    return {
-      icon: '🏛️',
-      title: 'Estate Closed',
-      description: 'This estate has been formally closed. All distributions are complete and the court has discharged the executor. This record will be preserved for your family\'s reference.',
-      blockedReason: null,
-    }
-  }
-
-  if (phase === 'small_estate') {
-    return {
-      icon: '📄',
-      title: 'Small Estate Affidavit Process',
-      description: 'This estate qualifies for the small estate affidavit ($150K threshold, vehicles excluded). Wait at least 30 days after death, then present the affidavit to institutions holding estate property. No formal probate is required.',
-      blockedReason: null,
-    }
-  }
-
-  return {
-    icon: 'ℹ️',
-    title: 'Estate Settlement',
-    description: 'View the checklist and deadlines below to track progress.',
-    blockedReason: null,
-  }
-}
-
-// ── Deadline Row Component ──
-
-function DeadlineRow({ deadline }: { deadline: Deadline }) {
-  const isOverdue = deadline.overdue
-  const isUrgent = !isOverdue && deadline.daysFromNow <= 7
-
-  return (
-    <div className={`flex items-center justify-between p-3 rounded-lg border ${
-      isOverdue
-        ? 'bg-red-50 border-red-200'
-        : isUrgent
-          ? 'bg-amber-50 border-amber-200'
-          : 'bg-white border-slate-900/10'
-    }`}>
-      <div className="flex-1">
-        <div className="flex items-center gap-2">
-          <span className="font-medium text-sm text-slate-900">{deadline.name}</span>
-          {isOverdue && <Badge className="bg-red-100 text-red-700 text-[10px]">Overdue</Badge>}
-          {isUrgent && <Badge className="bg-amber-100 text-amber-700 text-[10px]">Urgent</Badge>}
-        </div>
-        <p className="text-xs text-slate-900/60 mt-0.5">{deadline.description}</p>
-      </div>
-      <div className="text-right ml-4 shrink-0">
-        <p className={`text-sm font-medium ${isOverdue ? 'text-red-600' : isUrgent ? 'text-amber-600' : 'text-slate-900'}`}>
-          {isOverdue
-            ? `${Math.abs(deadline.daysFromNow)} days overdue`
-            : `${deadline.daysFromNow} days`}
-        </p>
-        <p className="text-[10px] text-slate-900/40">
-          {new Date(deadline.dueDate).toLocaleDateString('en-US', { month: 'short', day: 'numeric', year: 'numeric' })}
-        </p>
-      </div>
-    </div>
-  )
-}
+// Route definition only — the 645-line component (which pulls in recharts via
+// SettlementGantt) lives in estates.$estateId.probate.lazy.tsx so recharts is
+// code-split out of the main entry chunk. See vite.config.ts manualChunks.
+export const Route = createFileRoute('/estates/$estateId/probate')({})
diff --git a/web/src/routes/estates.$estateId.settings.tsx b/web/src/routes/estates.$estateId.settings.tsx
index 85120eb..d7d6560 100644
--- a/web/src/routes/estates.$estateId.settings.tsx
+++ b/web/src/routes/estates.$estateId.settings.tsx
@@ -314,7 +314,7 @@ function SettingsPage() {
       <div className="flex items-center justify-center h-[50vh]">
         <div className="flex flex-col items-center gap-4">
           <div className="w-10 h-10 border-2 border-[var(--royal)]/20 border-t-[var(--royal)] rounded-full animate-spin" />
-          <span className="text-[11px] font-semibold text-slate-500 uppercase tracking-[0.2em]">Loading settings...</span>
+          <span className="text-[11px] font-semibold text-[var(--royal)]/60 uppercase tracking-[0.2em]">Loading settings...</span>
         </div>
       </div>
     );
@@ -328,10 +328,10 @@ function SettingsPage() {
   return (
     <div className="max-w-[1000px] mx-auto space-y-10 pb-20">
       {/* ── Page Header ── */}
-      <div className="flex justify-between items-end border-b border-slate-100 pb-10">
+      <div className="flex justify-between items-end border-b border-neutral-border pb-10">
         <div className="space-y-2">
-          <h2 className="text-5xl font-[family-name:var(--font-cinzel)] font-bold text-slate-900">Settings</h2>
-          <p className="text-lg text-slate-500 font-medium">Manage your profile, security, and estate preferences.</p>
+          <h2 className="text-5xl font-[family-name:var(--font-cinzel)] font-bold text-[var(--royal)]">Settings</h2>
+          <p className="text-lg text-[var(--royal)]/60 font-medium">Manage your profile, security, and estate preferences.</p>
         </div>
         {isPrincipalOrAdmin && <Button
           onClick={handleSave}
@@ -343,7 +343,7 @@ function SettingsPage() {
               ? 'bg-green-600 hover:bg-green-700 text-white border-green-600'
               : hasChanges
                 ? 'bg-[var(--royal)] hover:bg-[var(--royal-blue)] text-white border-[var(--royal)]'
-                : 'bg-slate-100 text-slate-400 cursor-not-allowed shadow-none border-slate-100'
+                : 'bg-neutral-faint text-[var(--royal)]/40 cursor-not-allowed shadow-none border-neutral-border'
           }`}
         >
           {saving ? (
@@ -361,8 +361,8 @@ function SettingsPage() {
       </div>
 
       {/* ── Profile Card ── */}
-      <Card className="rounded-[3rem] border-slate-100 shadow-sm py-0 gap-0">
-        <div className="bg-gradient-to-r from-[var(--royal)]/[0.04] to-transparent px-4 py-4 md:px-10 md:py-6 border-b border-slate-100 flex items-center gap-3">
+      <Card className="rounded-[3rem] border-neutral-border shadow-sm py-0 gap-0">
+        <div className="bg-gradient-to-r from-[var(--royal)]/[0.04] to-transparent px-4 py-4 md:px-10 md:py-6 border-b border-neutral-border flex items-center gap-3">
           <div className="w-8 h-8 rounded-xl bg-[var(--royal)]/10 flex items-center justify-center">
             <svg viewBox="0 0 24 24" className="w-4 h-4 text-[var(--royal)]" fill="none" stroke="currentColor" strokeWidth="2.5">
               <path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2" /><circle cx="12" cy="7" r="4" />
@@ -414,8 +414,8 @@ function SettingsPage() {
           {/* Info */}
           <div className="flex-1 space-y-4">
             <div>
-              <h3 className="text-2xl font-bold text-slate-900 tracking-tight">{profile?.displayName || 'User'}</h3>
-              <p className="text-slate-500 font-medium text-[15px] mt-0.5">{user?.email || ''}</p>
+              <h3 className="text-2xl font-bold text-[var(--royal)] tracking-tight">{profile?.displayName || 'User'}</h3>
+              <p className="text-[var(--royal)]/60 font-medium text-[15px] mt-0.5">{user?.email || ''}</p>
             </div>
             <div className="flex items-center gap-3 flex-wrap">
               <Badge variant="outline" className="px-4 py-1.5 h-auto bg-[var(--royal)]/5 border-[var(--royal)]/10 rounded-xl text-[11px] font-black text-[var(--royal)] uppercase tracking-[0.15em]">
@@ -446,8 +446,8 @@ function SettingsPage() {
 
       {/* ── Guardian Protocol (principal/admin only) ── */}
       {isPrincipalOrAdmin && (
-        <Card className="rounded-[2.5rem] border-slate-100 shadow-sm py-0 gap-0">
-          <div className="bg-gradient-to-r from-[var(--royal)]/[0.04] to-transparent px-4 py-4 md:px-10 md:py-6 border-b border-slate-100 flex items-center gap-3">
+        <Card className="rounded-[2.5rem] border-neutral-border shadow-sm py-0 gap-0">
+          <div className="bg-gradient-to-r from-[var(--royal)]/[0.04] to-transparent px-4 py-4 md:px-10 md:py-6 border-b border-neutral-border flex items-center gap-3">
             <div className="w-8 h-8 rounded-xl bg-[var(--royal)]/10 flex items-center justify-center">
               <svg viewBox="0 0 24 24" className="w-4 h-4 text-[var(--royal)]" fill="none" stroke="currentColor" strokeWidth="2.5">
                 <path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z" />
@@ -455,7 +455,7 @@ function SettingsPage() {
             </div>
             <h3 className="text-[11px] font-black text-[var(--royal)]/60 uppercase tracking-[0.3em] font-[family-name:var(--font-cinzel)]">Guardian Protocol</h3>
           </div>
-          <div className="divide-y divide-slate-100">
+          <div className="divide-y divide-[var(--neutral-border)]">
             <SettingsSelect
               label="Inactivity threshold"
               description={`If you are inactive for this many days, your executor will be notified.`}
@@ -470,10 +470,10 @@ function SettingsPage() {
             />
             {guardianStatus && (
               <>
-                <div className="flex items-center justify-between px-4 py-4 md:px-10 md:py-6 hover:bg-slate-50 transition-all group">
+                <div className="flex items-center justify-between px-4 py-4 md:px-10 md:py-6 hover:bg-neutral-faint transition-all group">
                   <div className="flex flex-col">
-                    <span className="text-slate-900 font-bold text-[15px] leading-tight group-hover:text-[var(--royal)] transition-colors">Days since last activity</span>
-                    <span className="text-[13px] text-slate-500 font-medium mt-1">Based on your last check-in with FinalWishes</span>
+                    <span className="text-[var(--royal)] font-bold text-[15px] leading-tight group-hover:text-[var(--royal)] transition-colors">Days since last activity</span>
+                    <span className="text-[13px] text-[var(--royal)]/60 font-medium mt-1">Based on your last check-in with FinalWishes</span>
                   </div>
                   <Badge
                     variant="secondary"
@@ -519,7 +519,7 @@ function SettingsPage() {
 
       {/* ── Settings Panels (principal/admin only) ── */}
       {isPrincipalOrAdmin && (
-      <Card className="rounded-[2.5rem] border-slate-100 shadow-sm py-0 gap-0">
+      <Card className="rounded-[2.5rem] border-neutral-border shadow-sm py-0 gap-0">
         <SettingsSection title="Security" first>
           <SettingsToggle
             label="Two-factor authentication"
@@ -578,8 +578,8 @@ function SettingsPage() {
 
       {/* ── Subscription Management (principal/admin on paid plans) ── */}
       {isPrincipalOrAdmin && estate?.tier && estate.tier !== 'free' && (
-      <Card className="rounded-[2.5rem] border-slate-100 shadow-sm py-0 gap-0">
-        <div className="bg-gradient-to-r from-[var(--royal)]/[0.04] to-transparent px-4 py-4 md:px-10 md:py-6 border-b border-slate-100 flex items-center gap-3">
+      <Card className="rounded-[2.5rem] border-neutral-border shadow-sm py-0 gap-0">
+        <div className="bg-gradient-to-r from-[var(--royal)]/[0.04] to-transparent px-4 py-4 md:px-10 md:py-6 border-b border-neutral-border flex items-center gap-3">
           <div className="w-8 h-8 rounded-xl bg-[var(--royal)]/10 flex items-center justify-center">
             <svg viewBox="0 0 24 24" className="w-4 h-4 text-[var(--royal)]" fill="none" stroke="currentColor" strokeWidth="2.5">
               <rect x="1" y="4" width="22" height="16" rx="2" ry="2" />
@@ -591,12 +591,12 @@ function SettingsPage() {
         <CardContent className="px-10 py-8 flex items-center justify-between">
           <div>
             <div className="flex items-center gap-3 mb-1">
-              <span className="text-slate-900 font-bold text-[15px] leading-tight">Manage Subscription</span>
+              <span className="text-[var(--royal)] font-bold text-[15px] leading-tight">Manage Subscription</span>
               <Badge variant="outline" className="px-3 py-1 h-auto bg-[var(--royal)]/5 border-[var(--royal)]/10 rounded-lg text-[10px] font-black text-[var(--royal)] uppercase tracking-[0.15em]">
                 {estate.tier === 'white_glove' ? 'White Glove' : estate.tier === 'concierge' ? 'Concierge' : estate.tier}
               </Badge>
             </div>
-            <p className="text-[13px] text-slate-500 font-medium mt-1 max-w-md">
+            <p className="text-[13px] text-[var(--royal)]/60 font-medium mt-1 max-w-md">
               Update your payment method, change your plan, or cancel your subscription via Stripe.
             </p>
           </div>
@@ -627,8 +627,8 @@ function SettingsPage() {
 
       {/* ── Data Export (principal/admin only) ── */}
       {isPrincipalOrAdmin && (
-      <Card className="rounded-[2.5rem] border-slate-100 shadow-sm py-0 gap-0">
-        <div className="bg-gradient-to-r from-[var(--royal)]/[0.04] to-transparent px-4 py-4 md:px-10 md:py-6 border-b border-slate-100 flex items-center gap-3">
+      <Card className="rounded-[2.5rem] border-neutral-border shadow-sm py-0 gap-0">
+        <div className="bg-gradient-to-r from-[var(--royal)]/[0.04] to-transparent px-4 py-4 md:px-10 md:py-6 border-b border-neutral-border flex items-center gap-3">
           <div className="w-8 h-8 rounded-xl bg-[var(--royal)]/10 flex items-center justify-center">
             <svg viewBox="0 0 24 24" className="w-4 h-4 text-[var(--royal)]" fill="none" stroke="currentColor" strokeWidth="2.5">
               <path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" />
@@ -640,8 +640,8 @@ function SettingsPage() {
         </div>
         <CardContent className="px-10 py-8 flex items-center justify-between">
           <div>
-            <span className="text-slate-900 font-bold text-[15px] leading-tight">Export Estate Data</span>
-            <p className="text-[13px] text-slate-500 font-medium mt-1 max-w-md">
+            <span className="text-[var(--royal)] font-bold text-[15px] leading-tight">Export Estate Data</span>
+            <p className="text-[13px] text-[var(--royal)]/60 font-medium mt-1 max-w-md">
               Download a complete ZIP archive of your estate data for compliance and portability.
             </p>
           </div>
@@ -691,8 +691,8 @@ function SettingsPage() {
         </div>
         <CardContent className="px-10 py-8 flex items-center justify-between gap-6">
           <div>
-            <span className="text-slate-900 font-bold text-[15px] leading-tight">Delete Account</span>
-            <p className="text-[13px] text-slate-500 font-medium mt-1 max-w-md">
+            <span className="text-[var(--royal)] font-bold text-[15px] leading-tight">Delete Account</span>
+            <p className="text-[13px] text-[var(--royal)]/60 font-medium mt-1 max-w-md">
               This will permanently delete your account, all estates you own, and all associated data. This cannot be undone.
             </p>
           </div>
@@ -737,7 +737,7 @@ function SettingsPage() {
             value={deleteConfirmText}
             onChange={(e) => setDeleteConfirmText(e.target.value)}
             placeholder="Type DELETE to confirm"
-            className="rounded-xl border-slate-200 focus:border-red-400 focus:ring-red-200 font-mono text-center"
+            className="rounded-xl border-neutral-border focus:border-red-400 focus:ring-red-200 font-mono text-center"
             autoComplete="off"
           />
           <AlertDialogFooter>
@@ -772,10 +772,10 @@ function SettingsPage() {
 function SettingsSection({ title, children, first }: { title: string; children: React.ReactNode; first?: boolean }) {
   return (
     <div>
-      <div className={`bg-slate-50 px-10 py-5 ${first ? '' : ''}border-b border-slate-100`}>
-        <h3 className="text-[11px] font-bold text-slate-400 uppercase tracking-widest">{title}</h3>
+      <div className={`bg-neutral-faint px-10 py-5 ${first ? '' : ''}border-b border-neutral-border`}>
+        <h3 className="text-[11px] font-bold text-[var(--royal)]/40 uppercase tracking-widest">{title}</h3>
       </div>
-      <div className="divide-y divide-slate-100">{children}</div>
+      <div className="divide-y divide-[var(--neutral-border)]">{children}</div>
     </div>
   );
 }
@@ -784,10 +784,10 @@ function SettingsToggle({ label, description, checked, onChange, disabled }: {
   label: string; description: string; checked: boolean; onChange?: () => void; disabled?: boolean;
 }) {
   return (
-    <div className="flex items-center justify-between px-4 py-4 md:px-10 md:py-6 hover:bg-slate-50 transition-all group">
+    <div className="flex items-center justify-between px-4 py-4 md:px-10 md:py-6 hover:bg-neutral-faint transition-all group">
       <div className="flex flex-col">
-        <span className="text-slate-900 font-bold text-[15px] leading-tight group-hover:text-[var(--royal)] transition-colors">{label}</span>
-        <span className="text-[13px] text-slate-500 font-medium mt-1">{description}</span>
+        <span className="text-[var(--royal)] font-bold text-[15px] leading-tight group-hover:text-[var(--royal)] transition-colors">{label}</span>
+        <span className="text-[13px] text-[var(--royal)]/60 font-medium mt-1">{description}</span>
       </div>
       <Switch
         checked={!!checked}
@@ -801,10 +801,10 @@ function SettingsToggle({ label, description, checked, onChange, disabled }: {
 
 function SettingsStatus({ label, description, value }: { label: string; description: string; value: string }) {
   return (
-    <div className="flex items-center justify-between px-4 py-4 md:px-10 md:py-6 hover:bg-slate-50 transition-all group">
+    <div className="flex items-center justify-between px-4 py-4 md:px-10 md:py-6 hover:bg-neutral-faint transition-all group">
       <div className="flex flex-col">
-        <span className="text-slate-900 font-bold text-[15px] leading-tight group-hover:text-[var(--royal)] transition-colors">{label}</span>
-        <span className="text-[13px] text-slate-500 font-medium mt-1">{description}</span>
+        <span className="text-[var(--royal)] font-bold text-[15px] leading-tight group-hover:text-[var(--royal)] transition-colors">{label}</span>
+        <span className="text-[13px] text-[var(--royal)]/60 font-medium mt-1">{description}</span>
       </div>
       <Badge variant="secondary" className="h-auto px-3 py-1.5 bg-green-50 border border-green-200 rounded-lg text-[11px] font-bold text-green-600 flex items-center gap-2">
         <div className="w-1.5 h-1.5 rounded-full bg-green-400" />
@@ -818,13 +818,13 @@ function SettingsSelect({ label, description, value, options, onChange }: {
   label: string; description: string; value: string; options: string[]; onChange: (v: string) => void;
 }) {
   return (
-    <div className="flex items-center justify-between px-4 py-4 md:px-10 md:py-6 hover:bg-slate-50 transition-all group">
+    <div className="flex items-center justify-between px-4 py-4 md:px-10 md:py-6 hover:bg-neutral-faint transition-all group">
       <div className="flex flex-col">
-        <span className="text-slate-900 font-bold text-[15px] leading-tight group-hover:text-[var(--royal)] transition-colors">{label}</span>
-        <span className="text-[13px] text-slate-500 font-medium mt-1">{description}</span>
+        <span className="text-[var(--royal)] font-bold text-[15px] leading-tight group-hover:text-[var(--royal)] transition-colors">{label}</span>
+        <span className="text-[13px] text-[var(--royal)]/60 font-medium mt-1">{description}</span>
       </div>
       <Select value={value} onValueChange={onChange}>
-        <SelectTrigger className="text-[13px] text-[var(--royal)] font-bold bg-transparent border-slate-200 rounded-lg px-3 py-1.5 h-auto focus:border-[var(--royal)] cursor-pointer">
+        <SelectTrigger className="text-[13px] text-[var(--royal)] font-bold bg-transparent border-neutral-border rounded-lg px-3 py-1.5 h-auto focus:border-[var(--royal)] cursor-pointer">
           <SelectValue />
         </SelectTrigger>
         <SelectContent>
diff --git a/web/src/routes/estates.$estateId.soul-log.lazy.tsx b/web/src/routes/estates.$estateId.soul-log.lazy.tsx
index b40db56..5060fa6 100644
--- a/web/src/routes/estates.$estateId.soul-log.lazy.tsx
+++ b/web/src/routes/estates.$estateId.soul-log.lazy.tsx
@@ -171,7 +171,7 @@ function generateTitle(): string {
 function getVisibilityConfig(v: Visibility) {
   switch (v) {
     case 'private':
-      return { icon: Lock, label: 'Private', color: 'bg-slate-100 text-slate-600 border-slate-200' }
+      return { icon: Lock, label: 'Private', color: 'bg-[var(--royal)]/5 text-[var(--ink-muted)] border-[var(--royal)]/15' }
     case 'shared':
       return { icon: Users, label: 'Shared', color: 'bg-blue-50 text-blue-600 border-blue-200' }
     case 'sealed':
@@ -360,7 +360,7 @@ function SoulLogPage() {
       <div className="max-w-3xl mx-auto px-4 py-12">
         <div className="space-y-4">
           {[1, 2, 3].map((i) => (
-            <div key={i} className="h-32 rounded-3xl bg-slate-50 animate-pulse" />
+            <div key={i} className="h-32 rounded-3xl bg-[var(--royal)]/5 animate-pulse" />
           ))}
         </div>
       </div>
@@ -375,7 +375,7 @@ function SoulLogPage() {
         action={
           entries.length > 0 ? (
             <div className="relative w-64">
-              <Search className="absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-slate-900/30" />
+              <Search className="absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-[var(--ink)]/30" />
               <Input
                 value={searchQuery}
                 onChange={(e) => setSearchQuery(e.target.value)}
@@ -426,8 +426,8 @@ function SoulLogPage() {
         <EmptyState onRecord={() => setComposerOpen(true)} />
       ) : filteredEntries.length === 0 ? (
         <div className="text-center py-12">
-          <Search className="w-8 h-8 text-slate-900/20 mx-auto mb-3" />
-          <p className="text-sm text-slate-900/40">No entries match your search.</p>
+          <Search className="w-8 h-8 text-[var(--ink)]/20 mx-auto mb-3" />
+          <p className="text-sm text-[var(--ink)]/40">No entries match your search.</p>
         </div>
       ) : (
         <div className="space-y-4">
@@ -516,7 +516,7 @@ function EditEntryDialog({
     content: '',
     editorProps: {
       attributes: {
-        class: 'prose prose-sm max-w-none min-h-[160px] px-4 py-3 focus:outline-none text-slate-900/80 leading-relaxed',
+        class: 'prose prose-sm max-w-none min-h-[160px] px-4 py-3 focus:outline-none text-[var(--ink)]/80 leading-relaxed',
       },
     },
   })
@@ -558,7 +558,7 @@ function EditEntryDialog({
         </DialogHeader>
         <div className="space-y-4 py-2">
           <div className="space-y-2">
-            <Label htmlFor="soul-edit-title" className="text-xs font-semibold uppercase tracking-wide text-slate-900/60">Title</Label>
+            <Label htmlFor="soul-edit-title" className="text-xs font-semibold uppercase tracking-wide text-[var(--ink)]/60">Title</Label>
             <Input
               id="soul-edit-title"
               value={title}
@@ -568,12 +568,12 @@ function EditEntryDialog({
           </div>
           {isText && (
             <div className="space-y-2">
-              <Label className="text-xs font-semibold uppercase tracking-wide text-slate-900/60">Reflection</Label>
+              <Label className="text-xs font-semibold uppercase tracking-wide text-[var(--ink)]/60">Reflection</Label>
               <div className="rounded-xl border border-[var(--royal)]/10 overflow-hidden">
                 <div className="flex items-center gap-1 border-b border-[var(--royal)]/5 px-2 py-1.5">
-                  <button type="button" onClick={() => editor?.chain().focus().toggleBold().run()} className="p-1.5 rounded hover:bg-slate-100" aria-label="Bold"><Bold className="w-4 h-4 text-slate-700" /></button>
-                  <button type="button" onClick={() => editor?.chain().focus().toggleItalic().run()} className="p-1.5 rounded hover:bg-slate-100" aria-label="Italic"><Italic className="w-4 h-4 text-slate-700" /></button>
-                  <button type="button" onClick={() => editor?.chain().focus().toggleBulletList().run()} className="p-1.5 rounded hover:bg-slate-100" aria-label="Bullet list"><List className="w-4 h-4 text-slate-700" /></button>
+                  <button type="button" onClick={() => editor?.chain().focus().toggleBold().run()} className="p-1.5 rounded hover:bg-[var(--royal)]/5" aria-label="Bold"><Bold className="w-4 h-4 text-[var(--ink-muted)]" /></button>
+                  <button type="button" onClick={() => editor?.chain().focus().toggleItalic().run()} className="p-1.5 rounded hover:bg-[var(--royal)]/5" aria-label="Italic"><Italic className="w-4 h-4 text-[var(--ink-muted)]" /></button>
+                  <button type="button" onClick={() => editor?.chain().focus().toggleBulletList().run()} className="p-1.5 rounded hover:bg-[var(--royal)]/5" aria-label="Bullet list"><List className="w-4 h-4 text-[var(--ink-muted)]" /></button>
                 </div>
                 <EditorContent editor={editor} />
               </div>
@@ -603,7 +603,7 @@ function ShepherdCard({
   onRecord: () => void
 }) {
   return (
-    <Card className="rounded-3xl border-[var(--gold)]/20 bg-gradient-to-br from-[var(--gold)]/5 to-[var(--gold)]/10 shadow-sm overflow-hidden">
+    <Card variant="glass" className="border-[var(--gold)]/20 bg-gradient-to-br from-[var(--gold)]/5 to-[var(--gold)]/10">
       <CardContent className="p-6 md:p-8">
         <div className="flex items-start gap-4">
           <div className="w-10 h-10 rounded-2xl bg-[var(--gold)]/10 flex items-center justify-center flex-shrink-0 mt-0.5">
@@ -612,20 +612,20 @@ function ShepherdCard({
           <div className="flex-1 space-y-2">
             {!hasEntries ? (
               <>
-                <p className="text-slate-900 text-sm leading-relaxed font-medium">
+                <p className="text-[var(--ink)] text-sm leading-relaxed font-medium">
                   What&apos;s on your mind today?
                 </p>
-                <p className="text-slate-900/60 text-sm leading-relaxed">
+                <p className="text-[var(--ink)]/60 text-sm leading-relaxed">
                   You can record a video, leave a voice memo, or write a reflection.
                   Everything you capture here becomes part of your legacy.
                 </p>
               </>
             ) : (
               <>
-                <p className="text-slate-900/50 text-xs font-semibold uppercase tracking-wider mb-1">
+                <p className="text-[var(--ink)]/50 text-xs font-semibold uppercase tracking-wider mb-1">
                   Today&apos;s prompt
                 </p>
-                <p className="text-slate-900 text-sm leading-relaxed italic">
+                <p className="text-[var(--ink)] text-sm leading-relaxed italic">
                   &ldquo;{prompt}&rdquo;
                 </p>
               </>
@@ -662,8 +662,8 @@ function EmptyState({ onRecord }: { onRecord: () => void }) {
         </div>
       </div>
       <div className="space-y-2 max-w-sm mx-auto">
-        <h3 className="text-lg font-semibold text-slate-900 font-[family-name:var(--font-cinzel)]">Your story starts here</h3>
-        <p className="text-sm text-slate-900/50 leading-relaxed">
+        <h3 className="text-lg font-semibold text-[var(--ink)] font-[family-name:var(--font-cinzel)]">Your story starts here</h3>
+        <p className="text-sm text-[var(--ink)]/50 leading-relaxed">
           Record a thought, share a memory, or write a reflection. Everything you capture
           becomes part of your legacy.
         </p>
@@ -702,12 +702,12 @@ function EntryCard({
   const VisIcon = visConfig.icon
 
   return (
-    <Card className="rounded-3xl border-[var(--royal)]/5 bg-slate-50 hover:border-[var(--royal)]/10 hover:shadow-md transition-all duration-300 overflow-hidden">
+    <Card variant="glass">
       <CardContent className="p-0">
         {/* Video Thumbnail */}
         {entry.type === 'video' && entry.mediaUrl && (
           <div
-            className="aspect-video bg-slate-900 relative overflow-hidden cursor-pointer group"
+            className="aspect-video bg-royal relative overflow-hidden cursor-pointer group"
             onClick={onViewVideo}
           >
             <video
@@ -739,13 +739,13 @@ function EntryCard({
                 <TypeIcon className={`w-4 h-4 ${typeConfig.color}`} />
               </div>
               <div className="flex-1 min-w-0">
-                <h3 className="text-sm font-semibold text-slate-900 truncate">
+                <h3 className="text-sm font-semibold text-[var(--ink)] truncate">
                   {entry.title || 'Untitled Entry'}
                 </h3>
-                <div className="flex items-center gap-2 text-xs text-slate-900/40 mt-0.5">
+                <div className="flex items-center gap-2 text-xs text-[var(--ink)]/40 mt-0.5">
                   <Calendar className="w-3 h-3" />
                   <span>{formatTimestamp(entry.createdAt)}</span>
-                  <span className="text-slate-900/20">|</span>
+                  <span className="text-[var(--ink)]/20">|</span>
                   <Clock className="w-3 h-3" />
                   <span>{formatTime(entry.createdAt)}</span>
                 </div>
@@ -762,7 +762,7 @@ function EntryCard({
               <button
                 type="button"
                 onClick={(e) => { e.stopPropagation(); onEdit() }}
-                className="p-1.5 rounded-lg text-slate-900/25 hover:text-[var(--royal)] hover:bg-[var(--royal)]/5 transition-colors"
+                className="p-1.5 rounded-lg text-[var(--ink)]/25 hover:text-[var(--royal)] hover:bg-[var(--royal)]/5 transition-colors"
                 aria-label="Edit entry"
               >
                 <Pencil className="w-4 h-4" />
@@ -770,15 +770,15 @@ function EntryCard({
               <button
                 type="button"
                 onClick={(e) => { e.stopPropagation(); onDelete() }}
-                className="p-1.5 rounded-lg text-slate-900/25 hover:text-red-600 hover:bg-red-50 transition-colors"
+                className="p-1.5 rounded-lg text-[var(--ink)]/25 hover:text-red-600 hover:bg-red-50 transition-colors"
                 aria-label="Delete entry"
               >
                 <Trash2 className="w-4 h-4" />
               </button>
               {expanded ? (
-                <ChevronUp className="w-4 h-4 text-slate-900/30" />
+                <ChevronUp className="w-4 h-4 text-[var(--ink)]/30" />
               ) : (
-                <ChevronDown className="w-4 h-4 text-slate-900/30" />
+                <ChevronDown className="w-4 h-4 text-[var(--ink)]/30" />
               )}
             </div>
           </div>
@@ -813,14 +813,14 @@ function EntryCard({
 
           {/* Preview */}
           {!expanded && entry.type === 'text' && entry.content && (
-            <p className="text-sm text-slate-900/50 line-clamp-2 leading-relaxed">
+            <p className="text-sm text-[var(--ink)]/50 line-clamp-2 leading-relaxed">
               {stripHtml(entry.content).slice(0, 120)}
               {stripHtml(entry.content).length > 120 ? '...' : ''}
             </p>
           )}
 
           {!expanded && entry.type === 'audio' && (
-            <div className="flex items-center gap-3 text-sm text-slate-900/40">
+            <div className="flex items-center gap-3 text-sm text-[var(--ink)]/40">
               <Mic className="w-4 h-4" />
               <span>Voice memo</span>
               {entry.duration != null && entry.duration > 0 && (
@@ -832,8 +832,8 @@ function EntryCard({
           {/* Transcript preview (when not expanded) */}
           {!expanded && entry.transcript && entry.transcriptStatus === 'complete' && (
             <div className="flex items-start gap-2 mt-1">
-              <FileText className="w-3.5 h-3.5 text-slate-900/25 mt-0.5 flex-shrink-0" />
-              <p className="text-xs text-slate-900/40 line-clamp-2 leading-relaxed italic">
+              <FileText className="w-3.5 h-3.5 text-[var(--ink)]/25 mt-0.5 flex-shrink-0" />
+              <p className="text-xs text-[var(--ink)]/40 line-clamp-2 leading-relaxed italic">
                 {entry.transcript.slice(0, 150)}
                 {entry.transcript.length > 150 ? '...' : ''}
               </p>
@@ -866,7 +866,7 @@ function ExpandedContent({
     editable: false,
     editorProps: {
       attributes: {
-        class: 'prose prose-sm max-w-none text-slate-900/70 leading-relaxed focus:outline-none',
+        class: 'prose prose-sm max-w-none text-[var(--ink)]/70 leading-relaxed focus:outline-none',
       },
     },
   })
@@ -874,7 +874,7 @@ function ExpandedContent({
   return (
     <div className="pt-2 space-y-4" onClick={(e) => e.stopPropagation()}>
       {entry.type === 'text' && entry.content && (
-        <div className="rounded-2xl bg-white p-4 border border-slate-50">
+        <div className="rounded-2xl bg-white p-4 border border-[var(--royal)]/10">
           <EditorContent editor={textEditor} />
         </div>
       )}
@@ -897,7 +897,7 @@ function ExpandedContent({
 
       {entry.taggedPeople.length > 0 && (
         <div className="flex items-center gap-2 flex-wrap">
-          <Users className="w-3.5 h-3.5 text-slate-900/30" />
+          <Users className="w-3.5 h-3.5 text-[var(--ink)]/30" />
           {entry.taggedPeople.map((person, i) => (
             <Badge key={i} variant="outline" className="text-[10px] bg-blue-50/50 border-blue-100 text-blue-600">
               {person}
@@ -908,12 +908,12 @@ function ExpandedContent({
 
       {/* Transcript (full, in expanded view) */}
       {entry.transcript && entry.transcriptStatus === 'complete' && (
-        <div className="rounded-2xl bg-slate-50/80 p-4 border border-slate-100 space-y-1.5">
-          <div className="flex items-center gap-1.5 text-[10px] font-semibold text-slate-900/40 uppercase tracking-wider">
+        <div className="rounded-2xl bg-[var(--royal)]/5 p-4 border border-[var(--royal)]/10 space-y-1.5">
+          <div className="flex items-center gap-1.5 text-[10px] font-semibold text-[var(--ink)]/40 uppercase tracking-wider">
             <FileText className="w-3 h-3" />
             Transcript
           </div>
-          <p className="text-sm text-slate-900/60 leading-relaxed whitespace-pre-wrap">
+          <p className="text-sm text-[var(--ink)]/60 leading-relaxed whitespace-pre-wrap">
             {entry.transcript}
           </p>
         </div>
@@ -1115,17 +1115,17 @@ function VideoViewer({
               <Button
                 variant="ghost"
                 onClick={() => onOpenChange(false)}
-                className="absolute top-6 right-6 w-10 h-10 rounded-full bg-white/10 backdrop-blur-md border border-white/20 text-white hover:bg-white hover:text-slate-900"
+                className="absolute top-6 right-6 w-10 h-10 rounded-full bg-white/10 backdrop-blur-md border border-white/20 text-white hover:bg-white hover:text-[var(--ink)]"
               >
                 <X className="w-4 h-4" />
               </Button>
             </div>
             <div className="p-6 space-y-2">
               <DialogHeader>
-                <DialogTitle className="text-lg font-semibold text-slate-900">
+                <DialogTitle className="text-lg font-semibold text-[var(--ink)]">
                   {entry.title || 'Untitled Entry'}
                 </DialogTitle>
-                <DialogDescription className="text-sm text-slate-900/50">
+                <DialogDescription className="text-sm text-[var(--ink)]/50">
                   {formatTimestamp(entry.createdAt)} at {formatTime(entry.createdAt)}
                 </DialogDescription>
               </DialogHeader>
@@ -1449,7 +1449,7 @@ function ComposerDialog({
             <DialogTitle className="text-xl font-bold text-[var(--royal)] font-[family-name:var(--font-cinzel)] uppercase tracking-wide">
               New Soul Log Entry
             </DialogTitle>
-            <DialogDescription className="text-sm text-slate-900/50">
+            <DialogDescription className="text-sm text-[var(--ink)]/50">
               Record a thought, share a memory, or write a reflection.
             </DialogDescription>
           </DialogHeader>
@@ -1462,7 +1462,7 @@ function ComposerDialog({
               setEntryType(v as EntryType)
             }}
           >
-            <TabsList className="w-full rounded-2xl bg-slate-50 p-1 h-auto">
+            <TabsList className="w-full rounded-2xl bg-[var(--royal)]/5 p-1 h-auto">
               <TabsTrigger value="video" className="flex-1 rounded-xl py-2.5 data-[state=active]:bg-white data-[state=active]:shadow-sm gap-2">
                 <Video className="w-4 h-4" />
                 Video
@@ -1531,7 +1531,7 @@ function ComposerDialog({
           <div className="space-y-4">
             {/* Title */}
             <div className="space-y-1.5">
-              <Label className="text-xs font-semibold text-slate-900/60 uppercase tracking-wider">
+              <Label className="text-xs font-semibold text-[var(--ink)]/60 uppercase tracking-wider">
                 Title (optional)
               </Label>
               <Input
@@ -1545,7 +1545,7 @@ function ComposerDialog({
             {/* Visibility + Mood Row */}
             <div className="grid grid-cols-2 gap-4">
               <div className="space-y-1.5">
-                <Label className="text-xs font-semibold text-slate-900/60 uppercase tracking-wider">
+                <Label className="text-xs font-semibold text-[var(--ink)]/60 uppercase tracking-wider">
                   Visibility
                 </Label>
                 <Select value={visibility} onValueChange={(v) => setVisibility(v as Visibility)}>
@@ -1573,7 +1573,7 @@ function ComposerDialog({
               </div>
 
               <div className="space-y-1.5">
-                <Label className="text-xs font-semibold text-slate-900/60 uppercase tracking-wider">
+                <Label className="text-xs font-semibold text-[var(--ink)]/60 uppercase tracking-wider">
                   Mood
                 </Label>
                 <div className="flex flex-wrap gap-1.5">
@@ -1584,7 +1584,7 @@ function ComposerDialog({
                       className={`w-8 h-8 rounded-lg text-lg flex items-center justify-center transition-all ${
                         mood === emoji
                           ? 'bg-[var(--royal)]/10 ring-2 ring-[var(--royal)]/30 scale-110'
-                          : 'hover:bg-slate-100'
+                          : 'hover:bg-[var(--royal)]/5'
                       }`}
                       title={label}
                       type="button"
@@ -1625,7 +1625,7 @@ function ComposerDialog({
             {/* Tagged People */}
             {(visibility === 'shared' || visibility === 'sealed') && heirs.length > 0 && (
               <div className="space-y-1.5">
-                <Label className="text-xs font-semibold text-slate-900/60 uppercase tracking-wider">
+                <Label className="text-xs font-semibold text-[var(--ink)]/60 uppercase tracking-wider">
                   Tag People
                 </Label>
                 <div className="flex flex-wrap gap-2">
@@ -1647,7 +1647,7 @@ function ComposerDialog({
                         className={`px-3 py-1.5 rounded-full text-xs font-medium transition-all ${
                           tagged
                             ? 'bg-[var(--royal)] text-white'
-                            : 'bg-slate-100 text-slate-900/60 hover:bg-slate-200'
+                            : 'bg-[var(--royal)]/5 text-[var(--ink)]/60 hover:bg-[var(--royal)]/10'
                         }`}
                         type="button"
                       >
@@ -1665,7 +1665,7 @@ function ComposerDialog({
             <Button
               variant="outline"
               onClick={() => onOpenChange(false)}
-              className="flex-1 rounded-xl border-[var(--royal)]/10 text-slate-900 font-semibold"
+              className="flex-1 rounded-xl border-[var(--royal)]/10 text-[var(--ink)] font-semibold"
             >
               Cancel
             </Button>
@@ -1712,10 +1712,10 @@ function TierGatePrompt({
         </svg>
       </div>
       <div className="space-y-1">
-        <p className="text-sm font-bold text-slate-900">
+        <p className="text-sm font-bold text-[var(--ink)]">
           {message || 'You have reached your upload limit for this plan.'}
         </p>
-        <p className="text-xs text-slate-500">
+        <p className="text-xs text-[var(--ink-muted)]">
           Written reflections are always free. Upgrade your plan for video and audio recording.
         </p>
       </div>
@@ -1756,11 +1756,11 @@ function VideoRecorder({
 }) {
   if (permissionDenied) {
     return (
-      <div className="aspect-video rounded-2xl bg-slate-50 border border-dashed border-slate-200 flex items-center justify-center">
+      <div className="aspect-video rounded-2xl bg-[var(--royal)]/5 border border-dashed border-[var(--royal)]/15 flex items-center justify-center">
         <div className="text-center p-6 space-y-2">
-          <Video className="w-8 h-8 text-slate-300 mx-auto" />
-          <p className="text-sm text-slate-900/50">Camera access denied</p>
-          <p className="text-xs text-slate-900/30">Check your browser settings and try again.</p>
+          <Video className="w-8 h-8 text-[var(--ink-muted)]/50 mx-auto" />
+          <p className="text-sm text-[var(--ink)]/50">Camera access denied</p>
+          <p className="text-xs text-[var(--ink)]/30">Check your browser settings and try again.</p>
           <Button variant="outline" size="sm" onClick={onStart} className="rounded-xl mt-2 text-xs">
             Try again
           </Button>
@@ -1776,7 +1776,7 @@ function VideoRecorder({
           <video src={recordedUrl} controls className="w-full h-full object-contain" />
         </div>
         <div className="flex items-center justify-between">
-          <span className="text-xs text-slate-900/40 font-mono">
+          <span className="text-xs text-[var(--ink)]/40 font-mono">
             Duration: {formatDuration(recordDuration)}
           </span>
           <Button variant="outline" size="sm" onClick={onRetake} className="rounded-xl text-xs border-[var(--royal)]/10">
@@ -1789,7 +1789,7 @@ function VideoRecorder({
 
   return (
     <div className="space-y-4">
-      <div className="aspect-video rounded-2xl overflow-hidden bg-slate-900 relative">
+      <div className="aspect-video rounded-2xl overflow-hidden bg-royal relative">
         <video
           ref={videoPreviewRef}
           muted
@@ -1939,11 +1939,11 @@ function AudioRecorder({
 
   if (permissionDenied) {
     return (
-      <div className="rounded-2xl bg-slate-50 border border-dashed border-slate-200 p-8 flex items-center justify-center">
+      <div className="rounded-2xl bg-[var(--royal)]/5 border border-dashed border-[var(--royal)]/15 p-8 flex items-center justify-center">
         <div className="text-center space-y-2">
-          <Mic className="w-8 h-8 text-slate-300 mx-auto" />
-          <p className="text-sm text-slate-900/50">Microphone access denied</p>
-          <p className="text-xs text-slate-900/30">Check your browser settings and try again.</p>
+          <Mic className="w-8 h-8 text-[var(--ink-muted)]/50 mx-auto" />
+          <p className="text-sm text-[var(--ink)]/50">Microphone access denied</p>
+          <p className="text-xs text-[var(--ink)]/30">Check your browser settings and try again.</p>
           <Button variant="outline" size="sm" onClick={onStart} className="rounded-xl mt-2 text-xs">
             Try again
           </Button>
@@ -1959,7 +1959,7 @@ function AudioRecorder({
           <audio src={recordedUrl} controls className="w-full" />
         </div>
         <div className="flex items-center justify-between">
-          <span className="text-xs text-slate-900/40 font-mono">
+          <span className="text-xs text-[var(--ink)]/40 font-mono">
             Duration: {formatDuration(recordDuration)}
           </span>
           <Button variant="outline" size="sm" onClick={onRetake} className="rounded-xl text-xs border-[var(--royal)]/20 text-[var(--royal)]">
@@ -1983,7 +1983,7 @@ function AudioRecorder({
             />
             <div className="absolute top-3 right-3 flex items-center gap-2 bg-white/80 backdrop-blur-sm rounded-full px-3 py-1">
               <div className="w-2 h-2 rounded-full bg-red-500 animate-pulse" />
-              <span className="text-xs font-mono text-slate-900/70">{formatDuration(recordDuration)}</span>
+              <span className="text-xs font-mono text-[var(--ink)]/70">{formatDuration(recordDuration)}</span>
             </div>
           </>
         ) : (
@@ -2033,7 +2033,7 @@ function WrittenEditor({
     content: content || '',
     editorProps: {
       attributes: {
-        class: 'prose prose-sm max-w-none min-h-[200px] px-5 py-4 focus:outline-none text-slate-900/80 leading-relaxed',
+        class: 'prose prose-sm max-w-none min-h-[200px] px-5 py-4 focus:outline-none text-[var(--ink)]/80 leading-relaxed',
       },
     },
     onUpdate: ({ editor: e }) => {
@@ -2045,13 +2045,13 @@ function WrittenEditor({
     <div className="space-y-2">
       {/* Toolbar */}
       {editor && (
-        <div className="flex items-center gap-1 p-2 bg-slate-50 rounded-xl border border-slate-100">
+        <div className="flex items-center gap-1 p-2 bg-[var(--royal)]/5 rounded-xl border border-[var(--royal)]/10">
           <Button
             variant="ghost"
             size="icon"
             type="button"
             onClick={() => editor.chain().focus().toggleBold().run()}
-            className={`w-8 h-8 rounded-lg ${editor.isActive('bold') ? 'bg-[var(--royal)] text-white hover:bg-[var(--royal)]/90 hover:text-white' : 'text-slate-500 hover:bg-slate-200'}`}
+            className={`w-8 h-8 rounded-lg ${editor.isActive('bold') ? 'bg-[var(--royal)] text-white hover:bg-[var(--royal)]/90 hover:text-white' : 'text-[var(--ink-muted)] hover:bg-[var(--royal)]/10'}`}
           >
             <Bold className="w-3.5 h-3.5" />
           </Button>
@@ -2060,7 +2060,7 @@ function WrittenEditor({
             size="icon"
             type="button"
             onClick={() => editor.chain().focus().toggleItalic().run()}
-            className={`w-8 h-8 rounded-lg ${editor.isActive('italic') ? 'bg-[var(--royal)] text-white hover:bg-[var(--royal)]/90 hover:text-white' : 'text-slate-500 hover:bg-slate-200'}`}
+            className={`w-8 h-8 rounded-lg ${editor.isActive('italic') ? 'bg-[var(--royal)] text-white hover:bg-[var(--royal)]/90 hover:text-white' : 'text-[var(--ink-muted)] hover:bg-[var(--royal)]/10'}`}
           >
             <Italic className="w-3.5 h-3.5" />
           </Button>
@@ -2070,7 +2070,7 @@ function WrittenEditor({
             size="icon"
             type="button"
             onClick={() => editor.chain().focus().toggleHeading({ level: 2 }).run()}
-            className={`w-8 h-8 rounded-lg ${editor.isActive('heading', { level: 2 }) ? 'bg-[var(--royal)] text-white hover:bg-[var(--royal)]/90 hover:text-white' : 'text-slate-500 hover:bg-slate-200'}`}
+            className={`w-8 h-8 rounded-lg ${editor.isActive('heading', { level: 2 }) ? 'bg-[var(--royal)] text-white hover:bg-[var(--royal)]/90 hover:text-white' : 'text-[var(--ink-muted)] hover:bg-[var(--royal)]/10'}`}
           >
             <Heading2 className="w-3.5 h-3.5" />
           </Button>
@@ -2079,7 +2079,7 @@ function WrittenEditor({
             size="icon"
             type="button"
             onClick={() => editor.chain().focus().toggleBulletList().run()}
-            className={`w-8 h-8 rounded-lg ${editor.isActive('bulletList') ? 'bg-[var(--royal)] text-white hover:bg-[var(--royal)]/90 hover:text-white' : 'text-slate-500 hover:bg-slate-200'}`}
+            className={`w-8 h-8 rounded-lg ${editor.isActive('bulletList') ? 'bg-[var(--royal)] text-white hover:bg-[var(--royal)]/90 hover:text-white' : 'text-[var(--ink-muted)] hover:bg-[var(--royal)]/10'}`}
           >
             <List className="w-3.5 h-3.5" />
           </Button>
@@ -2089,7 +2089,7 @@ function WrittenEditor({
             size="icon"
             type="button"
             onClick={() => editor.chain().focus().undo().run()}
-            className="w-8 h-8 rounded-lg text-slate-500 hover:bg-slate-200"
+            className="w-8 h-8 rounded-lg text-[var(--ink-muted)] hover:bg-[var(--royal)]/10"
           >
             <Undo2 className="w-3.5 h-3.5" />
           </Button>
@@ -2098,7 +2098,7 @@ function WrittenEditor({
             size="icon"
             type="button"
             onClick={() => editor.chain().focus().redo().run()}
-            className="w-8 h-8 rounded-lg text-slate-500 hover:bg-slate-200"
+            className="w-8 h-8 rounded-lg text-[var(--ink-muted)] hover:bg-[var(--royal)]/10"
           >
             <Redo2 className="w-3.5 h-3.5" />
           </Button>
@@ -2106,7 +2106,7 @@ function WrittenEditor({
       )}
 
       {/* Editor */}
-      <div className="rounded-2xl border border-slate-100 overflow-hidden bg-white">
+      <div className="rounded-2xl border border-[var(--royal)]/10 overflow-hidden bg-white">
         <EditorContent editor={editor} />
       </div>
     </div>
diff --git a/web/src/routes/estates.$estateId.timecapsule.lazy.tsx b/web/src/routes/estates.$estateId.timecapsule.lazy.tsx
index 553bf37..26dc82d 100644
--- a/web/src/routes/estates.$estateId.timecapsule.lazy.tsx
+++ b/web/src/routes/estates.$estateId.timecapsule.lazy.tsx
@@ -147,7 +147,7 @@ function StatusBadge({ status }: { status: TimeCapsule['status'] }) {
   const config = {
     pending: { label: 'Pending', className: 'bg-[var(--royal)]/5 text-[var(--royal)] border-[var(--royal)]/10', Icon: Hourglass },
     delivered: { label: 'Delivered', className: 'bg-green-50 text-green-600 border-green-200', Icon: CheckCircle2 },
-    cancelled: { label: 'Cancelled', className: 'bg-slate-50 text-slate-400 border-slate-200', Icon: XCircle },
+    cancelled: { label: 'Cancelled', className: 'bg-neutral-faint text-ink-muted border-neutral-border', Icon: XCircle },
   }
   const c = config[status]
 
@@ -183,7 +183,7 @@ function DeliveryPreview({ capsule }: { capsule: TimeCapsule }) {
   const previewText = cfg.previewTemplate(capsule.recipientName, dateLabel)
 
   return (
-    <div className="flex items-center gap-2.5 text-[12px] text-slate-500 leading-snug">
+    <div className="flex items-center gap-2.5 text-[12px] text-ink-muted leading-snug">
       <Icon className="w-3.5 h-3.5 flex-shrink-0" style={{ color: cfg.color }} />
       <span className="italic">{previewText}</span>
     </div>
@@ -218,7 +218,7 @@ function VoiceMemoCard({ url }: { url: string }) {
       >
         {playing ? <Pause className="w-3.5 h-3.5" /> : <Play className="w-3.5 h-3.5" />}
       </Button>
-      <span className="text-[12px] font-medium text-slate-500">Voice message attached</span>
+      <span className="text-[12px] font-medium text-ink-muted">Voice message attached</span>
     </div>
   )
 }
@@ -249,9 +249,9 @@ function CapsuleCard({
       {/* Card Header */}
       <CardHeader className="p-8 pb-0">
         <CardTitle className="text-lg tracking-tight leading-snug">
-          <span className="text-[13px] font-medium text-slate-500">For</span>
+          <span className="text-[13px] font-medium text-ink-muted">For</span>
           <br />
-          <span className="font-bold text-slate-900 group-hover:text-[var(--royal)] transition-colors">
+          <span className="font-bold text-ink group-hover:text-[var(--royal)] transition-colors">
             {capsule.recipientName}
           </span>
         </CardTitle>
@@ -262,10 +262,10 @@ function CapsuleCard({
 
       <CardContent className="px-8 space-y-4">
         {/* Title */}
-        <p className="text-[15px] font-semibold text-slate-900">{capsule.title}</p>
+        <p className="text-[15px] font-semibold text-ink">{capsule.title}</p>
 
         {/* Message preview */}
-        <p className="text-[13px] text-slate-500 leading-relaxed line-clamp-3">
+        <p className="text-[13px] text-ink-muted leading-relaxed line-clamp-3">
           {messagePreview}
         </p>
 
@@ -323,8 +323,8 @@ function EmptyState({ onAdd }: { onAdd: () => void }) {
         <div className="w-20 h-20 rounded-full bg-[var(--gold)]/10 flex items-center justify-center mb-6">
           <Send className="w-10 h-10 text-[var(--gold)]/40" />
         </div>
-        <h3 className="text-2xl font-[family-name:var(--font-cinzel)] font-bold text-slate-900 mb-3 tracking-tight">No letters yet</h3>
-        <p className="text-slate-500 font-medium max-w-lg mb-8 leading-relaxed">
+        <h3 className="text-2xl font-[family-name:var(--font-cinzel)] font-bold text-royal mb-3 tracking-tight">No letters yet</h3>
+        <p className="text-ink-muted font-medium max-w-lg mb-8 leading-relaxed">
           A time capsule is a gift — a message sealed today, delivered when it matters most.
           Who would you like to write to?
         </p>
@@ -480,7 +480,7 @@ function VoiceRecorderPanel({
         >
           {playing ? <Pause className="w-4 h-4" /> : <Play className="w-4 h-4" />}
         </Button>
-        <span className="text-[13px] font-medium text-slate-500 flex-1">
+        <span className="text-[13px] font-medium text-ink-muted flex-1">
           Voice message {recordedBlob ? 'recorded' : 'attached'}
         </span>
         <Button
@@ -522,7 +522,7 @@ function VoiceRecorderPanel({
       type="button"
       variant="outline"
       onClick={startRecording}
-      className="gap-2 rounded-xl border-[var(--gold)]/20 text-slate-500 hover:border-[var(--gold)]/40 hover:bg-[var(--gold-dim)] h-auto py-3"
+      className="gap-2 rounded-xl border-[var(--gold)]/20 text-ink-muted hover:border-[var(--gold)]/40 hover:bg-[var(--gold-dim)] h-auto py-3"
     >
       <Mic className="w-4 h-4 text-[var(--gold)]" />
       <span className="text-[13px] font-medium">Attach Voice Memo</span>
@@ -585,7 +585,7 @@ function PhotoAttachments({
         type="button"
         variant="outline"
         onClick={() => inputRef.current?.click()}
-        className="gap-2 rounded-xl border-[var(--gold)]/20 text-slate-500 hover:border-[var(--gold)]/40 hover:bg-[var(--gold-dim)] h-auto py-3"
+        className="gap-2 rounded-xl border-[var(--gold)]/20 text-ink-muted hover:border-[var(--gold)]/40 hover:bg-[var(--gold-dim)] h-auto py-3"
       >
         <ImagePlus className="w-4 h-4 text-[var(--gold)]" />
         <span className="text-[13px] font-medium">Attach Photo</span>
@@ -689,7 +689,7 @@ function LetterToolbar({ editor }: { editor: ReturnType<typeof useEditor> }) {
         variant="ghost"
         size="icon"
         onClick={() => editor.chain().focus().toggleBold().run()}
-        className={`w-8 h-8 rounded-lg ${editor.isActive('bold') ? 'bg-[var(--royal)] text-white hover:bg-[var(--royal)]/90 hover:text-white' : 'text-slate-500 hover:bg-slate-200'}`}
+        className={`w-8 h-8 rounded-lg ${editor.isActive('bold') ? 'bg-[var(--royal)] text-white hover:bg-[var(--royal)]/90 hover:text-white' : 'text-ink-muted hover:bg-[var(--neutral-border)]'}`}
       >
         <Bold className="w-4 h-4" />
       </Button>
@@ -698,7 +698,7 @@ function LetterToolbar({ editor }: { editor: ReturnType<typeof useEditor> }) {
         variant="ghost"
         size="icon"
         onClick={() => editor.chain().focus().toggleItalic().run()}
-        className={`w-8 h-8 rounded-lg ${editor.isActive('italic') ? 'bg-[var(--royal)] text-white hover:bg-[var(--royal)]/90 hover:text-white' : 'text-slate-500 hover:bg-slate-200'}`}
+        className={`w-8 h-8 rounded-lg ${editor.isActive('italic') ? 'bg-[var(--royal)] text-white hover:bg-[var(--royal)]/90 hover:text-white' : 'text-ink-muted hover:bg-[var(--neutral-border)]'}`}
       >
         <Italic className="w-4 h-4" />
       </Button>
@@ -708,7 +708,7 @@ function LetterToolbar({ editor }: { editor: ReturnType<typeof useEditor> }) {
         variant="ghost"
         size="icon"
         onClick={() => editor.chain().focus().toggleHeading({ level: 2 }).run()}
-        className={`w-8 h-8 rounded-lg ${editor.isActive('heading', { level: 2 }) ? 'bg-[var(--royal)] text-white hover:bg-[var(--royal)]/90 hover:text-white' : 'text-slate-500 hover:bg-slate-200'}`}
+        className={`w-8 h-8 rounded-lg ${editor.isActive('heading', { level: 2 }) ? 'bg-[var(--royal)] text-white hover:bg-[var(--royal)]/90 hover:text-white' : 'text-ink-muted hover:bg-[var(--neutral-border)]'}`}
       >
         <Heading2 className="w-4 h-4" />
       </Button>
@@ -717,7 +717,7 @@ function LetterToolbar({ editor }: { editor: ReturnType<typeof useEditor> }) {
         variant="ghost"
         size="icon"
         onClick={() => editor.chain().focus().toggleBulletList().run()}
-        className={`w-8 h-8 rounded-lg ${editor.isActive('bulletList') ? 'bg-[var(--royal)] text-white hover:bg-[var(--royal)]/90 hover:text-white' : 'text-slate-500 hover:bg-slate-200'}`}
+        className={`w-8 h-8 rounded-lg ${editor.isActive('bulletList') ? 'bg-[var(--royal)] text-white hover:bg-[var(--royal)]/90 hover:text-white' : 'text-ink-muted hover:bg-[var(--neutral-border)]'}`}
       >
         <List className="w-4 h-4" />
       </Button>
@@ -786,7 +786,7 @@ function CreateModal({
     content: '',
     editorProps: {
       attributes: {
-        class: 'prose prose-lg max-w-none min-h-[200px] focus:outline-none px-6 py-5 text-slate-900 leading-[1.8]',
+        class: 'prose prose-lg max-w-none min-h-[200px] focus:outline-none px-6 py-5 text-ink leading-[1.8]',
       },
     },
   })
@@ -920,10 +920,10 @@ function CreateModal({
           style={{ background: 'var(--gold-dim)' }}
         >
           <DialogHeader>
-            <DialogTitle className="text-3xl font-[family-name:var(--font-cinzel)] font-bold text-slate-900 tracking-tight">
+            <DialogTitle className="text-3xl font-[family-name:var(--font-cinzel)] font-bold text-royal tracking-tight">
               Write a Letter
             </DialogTitle>
-            <DialogDescription className="text-slate-500 font-medium text-sm">
+            <DialogDescription className="text-ink-muted font-medium text-sm">
               A message sealed today, delivered when it matters most.
             </DialogDescription>
           </DialogHeader>
@@ -942,7 +942,7 @@ function CreateModal({
               <Input
                 name="title"
                 required
-                className="h-auto px-6 py-4 rounded-2xl border-[var(--gold)]/15 bg-white focus-visible:bg-white focus-visible:border-[var(--gold)] focus-visible:ring-[var(--gold)]/10 font-bold text-slate-900 placeholder:text-[var(--royal)]/20"
+                className="h-auto px-6 py-4 rounded-2xl border-[var(--gold)]/15 bg-white focus-visible:bg-white focus-visible:border-[var(--gold)] focus-visible:ring-[var(--gold)]/10 font-bold text-ink placeholder:text-[var(--royal)]/20"
                 placeholder="e.g. A Letter for Your Wedding Day"
               />
             </div>
@@ -956,7 +956,7 @@ function CreateModal({
                 <Input
                   name="recipientName"
                   required
-                  className="h-auto px-6 py-4 rounded-2xl border-[var(--gold)]/15 bg-white focus-visible:bg-white focus-visible:border-[var(--gold)] focus-visible:ring-[var(--gold)]/10 font-bold text-slate-900 placeholder:text-[var(--royal)]/20"
+                  className="h-auto px-6 py-4 rounded-2xl border-[var(--gold)]/15 bg-white focus-visible:bg-white focus-visible:border-[var(--gold)] focus-visible:ring-[var(--gold)]/10 font-bold text-ink placeholder:text-[var(--royal)]/20"
                   placeholder="Full name"
                 />
               </div>
@@ -968,7 +968,7 @@ function CreateModal({
                   name="recipientEmail"
                   type="email"
                   required
-                  className="h-auto px-6 py-4 rounded-2xl border-[var(--gold)]/15 bg-white focus-visible:bg-white focus-visible:border-[var(--gold)] focus-visible:ring-[var(--gold)]/10 font-bold text-slate-900 placeholder:text-[var(--royal)]/20"
+                  className="h-auto px-6 py-4 rounded-2xl border-[var(--gold)]/15 bg-white focus-visible:bg-white focus-visible:border-[var(--gold)] focus-visible:ring-[var(--gold)]/10 font-bold text-ink placeholder:text-[var(--royal)]/20"
                   placeholder="email@example.com"
                 />
               </div>
@@ -979,7 +979,7 @@ function CreateModal({
               <Label className="text-[11px] font-bold text-[var(--royal)]/40 uppercase tracking-widest">Relationship (optional)</Label>
               <Input
                 name="recipientRelationship"
-                className="h-auto px-6 py-4 rounded-2xl border-[var(--gold)]/15 bg-white focus-visible:bg-white focus-visible:border-[var(--gold)] focus-visible:ring-[var(--gold)]/10 font-bold text-slate-900 placeholder:text-[var(--royal)]/20"
+                className="h-auto px-6 py-4 rounded-2xl border-[var(--gold)]/15 bg-white focus-visible:bg-white focus-visible:border-[var(--gold)] focus-visible:ring-[var(--gold)]/10 font-bold text-ink placeholder:text-[var(--royal)]/20"
                 placeholder="e.g. Daughter, Best Friend, Spouse"
               />
             </div>
@@ -1035,12 +1035,12 @@ function CreateModal({
                     >
                       <CardContent className="p-4 px-0">
                         <div className="flex items-center gap-3 mb-1.5">
-                          <Icon className="w-4 h-4" style={{ color: selected ? 'var(--gold)' : 'var(--color-slate-400)' }} />
-                          <span className={`text-[12px] font-bold ${selected ? 'text-[var(--gold)]' : 'text-slate-900'}`}>
+                          <Icon className="w-4 h-4" style={{ color: selected ? 'var(--gold)' : 'var(--ink-muted)' }} />
+                          <span className={`text-[12px] font-bold ${selected ? 'text-[var(--gold)]' : 'text-ink'}`}>
                             {dt.label}
                           </span>
                         </div>
-                        <p className="text-[11px] text-slate-500 leading-snug">{dt.description}</p>
+                        <p className="text-[11px] text-ink-muted leading-snug">{dt.description}</p>
                       </CardContent>
                     </Card>
                   )
@@ -1056,7 +1056,7 @@ function CreateModal({
                   name="scheduledDate"
                   type="date"
                   min={new Date().toISOString().split('T')[0]}
-                  className="h-auto px-6 py-4 rounded-2xl border-[var(--gold)]/15 bg-white focus-visible:bg-white focus-visible:border-[var(--gold)] focus-visible:ring-[var(--gold)]/10 font-bold text-slate-900"
+                  className="h-auto px-6 py-4 rounded-2xl border-[var(--gold)]/15 bg-white focus-visible:bg-white focus-visible:border-[var(--gold)] focus-visible:ring-[var(--gold)]/10 font-bold text-ink"
                 />
               </div>
             )}
@@ -1067,7 +1067,7 @@ function CreateModal({
                 <div className="space-y-2">
                   <Label className="text-[11px] font-bold text-[var(--royal)]/40 uppercase tracking-widest">Month *</Label>
                   <Select value={anniversaryMonth} onValueChange={setAnniversaryMonth}>
-                    <SelectTrigger className="w-full h-auto px-6 py-4 rounded-2xl border-[var(--gold)]/15 bg-white font-bold text-slate-900">
+                    <SelectTrigger className="w-full h-auto px-6 py-4 rounded-2xl border-[var(--gold)]/15 bg-white font-bold text-ink">
                       <SelectValue placeholder="Select month" />
                     </SelectTrigger>
                     <SelectContent>
@@ -1080,7 +1080,7 @@ function CreateModal({
                 <div className="space-y-2">
                   <Label className="text-[11px] font-bold text-[var(--royal)]/40 uppercase tracking-widest">Day *</Label>
                   <Select value={anniversaryDay} onValueChange={setAnniversaryDay}>
-                    <SelectTrigger className="w-full h-auto px-6 py-4 rounded-2xl border-[var(--gold)]/15 bg-white font-bold text-slate-900">
+                    <SelectTrigger className="w-full h-auto px-6 py-4 rounded-2xl border-[var(--gold)]/15 bg-white font-bold text-ink">
                       <SelectValue placeholder="Select day" />
                     </SelectTrigger>
                     <SelectContent>
@@ -1099,7 +1099,7 @@ function CreateModal({
                 type="button"
                 variant="outline"
                 onClick={() => onOpenChange(false)}
-                className="flex-1 py-4 h-auto rounded-2xl border-[var(--gold)]/15 font-bold text-slate-500 text-sm hover:bg-white"
+                className="flex-1 py-4 h-auto rounded-2xl border-[var(--gold)]/15 font-bold text-ink-muted text-sm hover:bg-white"
               >
                 Cancel
               </Button>
@@ -1179,20 +1179,20 @@ function TimeCapsulePage() {
         {/* Stats */}
         {capsules.length > 0 && (
           <div className="flex items-center gap-6">
-            <Badge variant="secondary" className="gap-2 h-auto py-1.5 px-3 rounded-lg bg-[var(--gold)]/10 text-slate-900 border-none">
+            <Badge variant="secondary" className="gap-2 h-auto py-1.5 px-3 rounded-lg bg-[var(--gold)]/10 text-ink border-none">
               <Hourglass className="w-4 h-4 text-[var(--gold)]" />
               <span className="text-[13px] font-bold">{pendingCount}</span>
-              <span className="text-[13px] text-slate-500 font-normal">sealed</span>
+              <span className="text-[13px] text-ink-muted font-normal">sealed</span>
             </Badge>
-            <Badge variant="secondary" className="gap-2 h-auto py-1.5 px-3 rounded-lg bg-green-50 text-slate-900 border-none">
+            <Badge variant="secondary" className="gap-2 h-auto py-1.5 px-3 rounded-lg bg-green-50 text-ink border-none">
               <CheckCircle2 className="w-4 h-4 text-green-500" />
               <span className="text-[13px] font-bold">{deliveredCount}</span>
-              <span className="text-[13px] text-slate-500 font-normal">delivered</span>
+              <span className="text-[13px] text-ink-muted font-normal">delivered</span>
             </Badge>
-            <Badge variant="secondary" className="gap-2 h-auto py-1.5 px-3 rounded-lg bg-[var(--gold)]/5 text-slate-900 border-none">
+            <Badge variant="secondary" className="gap-2 h-auto py-1.5 px-3 rounded-lg bg-[var(--gold)]/5 text-ink border-none">
               <Send className="w-4 h-4 text-[var(--gold)]/60" />
               <span className="text-[13px] font-bold">{capsules.length}</span>
-              <span className="text-[13px] text-slate-500 font-normal">total</span>
+              <span className="text-[13px] text-ink-muted font-normal">total</span>
             </Badge>
           </div>
         )}
@@ -1224,17 +1224,17 @@ function TimeCapsulePage() {
             <AlertDialogMedia className="w-14 h-14 rounded-2xl bg-red-50 text-red-500 mx-auto">
               <XCircle className="w-7 h-7" />
             </AlertDialogMedia>
-            <AlertDialogTitle className="text-xl font-[family-name:var(--font-cinzel)] font-bold text-slate-900 text-center">
+            <AlertDialogTitle className="text-xl font-[family-name:var(--font-cinzel)] font-bold text-royal text-center">
               Cancel This Letter
             </AlertDialogTitle>
-            <AlertDialogDescription className="text-[14px] text-slate-500 text-center">
-              <strong className="text-slate-900">{cancelTarget?.title}</strong> will be cancelled and the letter will never be delivered to {cancelTarget?.recipientName}.
+            <AlertDialogDescription className="text-[14px] text-ink-muted text-center">
+              <strong className="text-ink">{cancelTarget?.title}</strong> will be cancelled and the letter will never be delivered to {cancelTarget?.recipientName}.
             </AlertDialogDescription>
           </AlertDialogHeader>
           <AlertDialogFooter className="flex gap-3 sm:flex-row">
             <AlertDialogCancel
               variant="outline"
-              className="flex-1 py-3 h-auto rounded-xl border-[var(--gold)]/15 text-slate-900 font-bold text-[13px] hover:bg-[var(--gold-dim)]"
+              className="flex-1 py-3 h-auto rounded-xl border-[var(--gold)]/15 text-ink font-bold text-[13px] hover:bg-[var(--gold-dim)]"
             >
               Keep It
             </AlertDialogCancel>
@@ -1279,7 +1279,7 @@ function EditCapsuleDialog({
     content: '',
     editorProps: {
       attributes: {
-        class: 'prose prose-sm max-w-none min-h-[180px] px-5 py-4 focus:outline-none text-slate-900/80 leading-relaxed',
+        class: 'prose prose-sm max-w-none min-h-[180px] px-5 py-4 focus:outline-none text-ink/80 leading-relaxed',
       },
     },
   })
@@ -1307,8 +1307,8 @@ function EditCapsuleDialog({
     <Dialog open={!!capsule} onOpenChange={(open) => { if (!open && !saving) onClose() }}>
       <DialogContent className="max-w-2xl max-h-[85vh] overflow-y-auto rounded-[2rem]">
         <DialogHeader>
-          <DialogTitle className="text-2xl font-[family-name:var(--font-cinzel)] font-bold text-slate-900">Edit Letter</DialogTitle>
-          <DialogDescription className="text-slate-500 text-sm">
+          <DialogTitle className="text-2xl font-[family-name:var(--font-cinzel)] font-bold text-royal">Edit Letter</DialogTitle>
+          <DialogDescription className="text-ink-muted text-sm">
             Update the title and message. Delivery timing and recipient stay as sealed.
           </DialogDescription>
         </DialogHeader>
@@ -1319,12 +1319,12 @@ function EditCapsuleDialog({
               value={title}
               onChange={(e) => setTitle(e.target.value)}
               placeholder="A letter for…"
-              className="px-5 py-4 h-auto rounded-2xl border-slate-200 text-[14px] text-slate-900"
+              className="px-5 py-4 h-auto rounded-2xl border-neutral-border text-[14px] text-ink"
             />
           </div>
           <div className="space-y-2">
             <Label className="text-[11px] font-bold text-[var(--royal)]/60 uppercase tracking-widest">Message</Label>
-            <div className="rounded-2xl border border-slate-200 overflow-hidden">
+            <div className="rounded-2xl border border-neutral-border overflow-hidden">
               <LetterToolbar editor={editor} />
               <EditorContent editor={editor} />
             </div>
diff --git a/web/src/routes/estates.$estateId.tsx b/web/src/routes/estates.$estateId.tsx
index 0330708..63fa699 100644
--- a/web/src/routes/estates.$estateId.tsx
+++ b/web/src/routes/estates.$estateId.tsx
@@ -14,6 +14,7 @@ import { EmailVerificationBanner } from '../components/identity/EmailVerificatio
 import { ErrorBoundary } from '../components/ErrorBoundary'
 import { useAuth } from '../lib/auth'
 import { useEstate, useDocument, type EstateUser } from '../lib/firestore'
+import { API_BASE } from '../lib/client'
 import { useEffect, useRef } from 'react'
 import { auth as firebaseAuth } from '../lib/firebase'
 import { personaLabel, resolveEffectiveRole } from '../lib/persona'
@@ -61,7 +62,6 @@ function EstateLayout() {
     const isPrincipalOrAdmin = effectiveRole === 'principal' || effectiveRole === 'admin';
     if (!isPrincipalOrAdmin || !estateId) return;
     checkedIn.current = true;
-    const API_BASE = import.meta.env.VITE_API_URL || 'http://localhost:8080';
     (async () => {
       try {
         const token = await firebaseAuth.currentUser?.getIdToken();
diff --git a/web/src/routes/estates.$estateId.vault.lazy.tsx b/web/src/routes/estates.$estateId.vault.lazy.tsx
index c856446..56d3e38 100644
--- a/web/src/routes/estates.$estateId.vault.lazy.tsx
+++ b/web/src/routes/estates.$estateId.vault.lazy.tsx
@@ -444,6 +444,7 @@ function VaultPage() {
         window.open(downloadUrl, '_blank')
       } catch (err) {
         console.error('Download error:', err)
+        toast.error('Could not download this document. Please try again.')
       }
     },
     [],
@@ -457,6 +458,8 @@ function VaultPage() {
       if (result.success) {
         setDeleteConfirm(null)
         toast.success('Document archived')
+      } else {
+        toast.error(result.error || 'Could not archive document. Please try again.')
       }
     },
     [estateId],
@@ -525,7 +528,7 @@ function VaultPage() {
         <button
           type="button"
           onClick={() => setChecklistOpen((o) => !o)}
-          className="w-full flex items-center justify-between p-8 pb-6 text-left hover:bg-slate-50/50 transition-colors"
+          className="w-full flex items-center justify-between p-8 pb-6 text-left hover:bg-neutral-faint/50 transition-colors"
         >
           <div className="flex items-center gap-4 min-w-0">
             <div className="w-12 h-12 rounded-2xl bg-[var(--royal)] flex items-center justify-center text-white flex-shrink-0">
@@ -535,7 +538,7 @@ function VaultPage() {
               </svg>
             </div>
             <div>
-              <h3 className="text-xl font-[family-name:var(--font-cinzel)] font-bold text-slate-900">
+              <h3 className="text-xl font-[family-name:var(--font-cinzel)] font-bold text-[var(--royal)]">
                 Documents Your Estate Needs
               </h3>
               <p className="text-[13px] text-[var(--royal)]/50 font-medium mt-0.5">
@@ -589,13 +592,13 @@ function VaultPage() {
                   <div key={catKey}>
                     {/* Category sub-heading */}
                     <div className="flex items-center gap-3 mb-4">
-                      <div className="w-8 h-8 rounded-xl bg-slate-50 border border-[var(--royal)]/10 flex items-center justify-center text-[var(--royal)]/60">
+                      <div className="w-8 h-8 rounded-xl bg-neutral-faint border border-[var(--royal)]/10 flex items-center justify-center text-[var(--royal)]/60">
                         {catInfo.icon}
                       </div>
                       <span className="text-[12px] font-bold text-[var(--royal)]/50 uppercase tracking-widest">
                         {catInfo.label}
                       </span>
-                      <Badge className="bg-slate-50 text-[var(--royal)]/40 border border-[var(--royal)]/10 text-[11px] font-bold h-auto py-0.5 px-2 rounded-lg">
+                      <Badge className="bg-neutral-faint text-[var(--royal)]/40 border border-[var(--royal)]/10 text-[11px] font-bold h-auto py-0.5 px-2 rounded-lg">
                         {catUploaded}/{items.length}
                       </Badge>
                     </div>
@@ -614,7 +617,7 @@ function VaultPage() {
                             className={`flex items-start gap-3 p-4 rounded-2xl border text-left transition-all ${
                               isUploaded
                                 ? 'bg-[var(--gold)]/5 border-[var(--gold)]/30'
-                                : 'bg-white border-[var(--royal)]/10 hover:border-[var(--royal)]/25 hover:bg-slate-50 cursor-pointer'
+                                : 'bg-white border-[var(--royal)]/10 hover:border-[var(--royal)]/25 hover:bg-neutral-faint cursor-pointer'
                             }`}
                           >
                             {/* Status indicator */}
@@ -634,7 +637,7 @@ function VaultPage() {
                             <div className="min-w-0">
                               <span
                                 className={`text-[14px] font-bold block ${
-                                  isUploaded ? 'text-[var(--gold)]' : 'text-slate-900'
+                                  isUploaded ? 'text-[var(--gold)]' : 'text-[var(--royal)]'
                                 }`}
                               >
                                 {item.name}
@@ -674,8 +677,8 @@ function VaultPage() {
             </svg>
           </div>
           <div className="flex-1">
-            <p className="text-sm font-bold text-slate-900">{tierUpgradeMessage(tierUsage, 'media')}</p>
-            <p className="text-xs text-slate-500 mt-1">
+            <p className="text-sm font-bold text-[var(--royal)]">{tierUpgradeMessage(tierUsage, 'media')}</p>
+            <p className="text-xs text-[var(--royal)]/60 mt-1">
               {tierUsage.mediaCount} of {tierUsage.limits.maxMedia} uploads used
             </p>
             <Link
@@ -696,7 +699,7 @@ function VaultPage() {
         className={`
           border-2 border-dashed rounded-[2rem] p-12 text-center cursor-pointer transition-all
           ${tierUsage && !tierUsage.canUploadMedia
-            ? 'border-slate-500/20 opacity-50 pointer-events-none'
+            ? 'border-ink-muted/20 opacity-50 pointer-events-none'
             : isDragActive
               ? 'border-[var(--royal)] bg-[var(--royal)]/5 scale-[1.01]'
               : 'border-[var(--royal)]/20 hover:border-[var(--royal)]/40 hover:bg-[var(--royal)]/[0.02]'
@@ -707,7 +710,7 @@ function VaultPage() {
         <div className="flex flex-col items-center gap-4">
           <div
             className={`w-16 h-16 rounded-2xl flex items-center justify-center transition-all ${
-              isDragActive ? 'bg-[var(--royal)] text-white' : 'bg-slate-50 text-[var(--royal)] border border-[var(--royal)]/10'
+              isDragActive ? 'bg-[var(--royal)] text-white' : 'bg-neutral-faint text-[var(--royal)] border border-[var(--royal)]/10'
             }`}
           >
             <svg viewBox="0 0 24 24" className="w-8 h-8" fill="none" stroke="currentColor" strokeWidth="2">
@@ -717,7 +720,7 @@ function VaultPage() {
             </svg>
           </div>
           <div>
-            <p className="text-slate-900 font-bold text-lg">
+            <p className="text-[var(--royal)] font-bold text-lg">
               {isDragActive ? 'Drop files here' : 'Drag & drop files, or click to browse'}
             </p>
             <p className="text-[13px] text-[var(--royal)]/40 mt-1">
@@ -795,7 +798,7 @@ function VaultPage() {
               />
             ))}
             {documents.length === 0 && (
-              <div className="text-center py-24 bg-slate-50 rounded-2xl border border-[var(--royal)]/10">
+              <div className="text-center py-24 bg-neutral-faint rounded-2xl border border-[var(--royal)]/10">
                 <p className="text-[var(--royal)]/50 font-medium">
                   {activeCategory
                     ? `No ${CATEGORY_MAP[activeCategory]?.label.toLowerCase() || 'files'} yet.`
@@ -854,7 +857,7 @@ function UploadProgress({ upload }: { upload: UploadState }) {
           ? 'bg-red-50 border-red-200'
           : isDone
             ? 'bg-green-50 border-green-200'
-            : 'bg-slate-50 border-[var(--royal)]/10'
+            : 'bg-neutral-faint border-[var(--royal)]/10'
       }`}
     >
       <div className="w-10 h-10 rounded-xl bg-white flex items-center justify-center border border-[var(--royal)]/10">
@@ -873,7 +876,7 @@ function UploadProgress({ upload }: { upload: UploadState }) {
       </div>
       <div className="flex-1 min-w-0">
         <div className="flex justify-between items-center mb-1.5">
-          <span className="text-[13px] font-bold text-slate-900 truncate">{upload.file.name}</span>
+          <span className="text-[13px] font-bold text-[var(--royal)] truncate">{upload.file.name}</span>
           <span
             className={`text-[11px] font-semibold ${
               isError ? 'text-red-600' : isDone ? 'text-green-600' : 'text-[var(--royal)]'
@@ -922,7 +925,7 @@ function VaultFolder({
           className={`w-14 h-14 rounded-2xl flex items-center justify-center mb-6 transition-all duration-500 ${
             active
               ? 'bg-white/20 text-white'
-              : 'bg-slate-50 border border-[var(--royal)]/10 text-[var(--royal)] group-hover:bg-[var(--royal)] group-hover:text-white'
+              : 'bg-neutral-faint border border-[var(--royal)]/10 text-[var(--royal)] group-hover:bg-[var(--royal)] group-hover:text-white'
           }`}
         >
           <svg viewBox="0 0 24 24" className="w-7 h-7" fill="none" stroke="currentColor" strokeWidth="2">
@@ -931,7 +934,7 @@ function VaultFolder({
         </div>
         <h4
           className={`font-[family-name:var(--font-cinzel)] font-bold text-lg mb-2 transition-colors ${
-            active ? 'text-white' : 'text-slate-900 group-hover:text-[var(--royal)]'
+            active ? 'text-white' : 'text-[var(--royal)] group-hover:text-[var(--royal)]'
           }`}
         >
           {name}
@@ -991,13 +994,18 @@ function DocItem({
 
   return (
     <div className="rounded-2xl border border-[var(--royal)]/10 overflow-hidden transition-all group">
-      <div className="flex items-center justify-between p-5 bg-white hover:bg-slate-50 transition-all">
-        <div className="flex items-center gap-4 min-w-0 flex-1 cursor-pointer" onClick={isPreviewable ? onPreview : onDownload}>
-          <div className="w-11 h-11 rounded-xl bg-slate-50 flex items-center justify-center text-[var(--royal)]/30 group-hover:bg-[var(--royal)] group-hover:text-white transition-all duration-500 border border-[var(--royal)]/10 flex-shrink-0">
+      <div className="flex items-center justify-between p-5 bg-white hover:bg-neutral-faint transition-all">
+        <button
+          type="button"
+          onClick={isPreviewable ? onPreview : onDownload}
+          aria-label={`Open ${doc.displayName || doc.originalName}`}
+          className="flex items-center gap-4 min-w-0 flex-1 cursor-pointer text-left bg-transparent border-none p-0 rounded-xl focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--royal)]/40"
+        >
+          <div className="w-11 h-11 rounded-xl bg-neutral-faint flex items-center justify-center text-[var(--royal)]/30 group-hover:bg-[var(--royal)] group-hover:text-white transition-all duration-500 border border-[var(--royal)]/10 flex-shrink-0">
             <FileIcon mimeType={doc.mimeType} />
           </div>
           <div className="min-w-0">
-            <div className="text-slate-900 font-bold text-[15px] mb-0.5 group-hover:text-[var(--royal)] transition-colors truncate">
+            <div className="text-[var(--royal)] font-bold text-[15px] mb-0.5 group-hover:text-[var(--royal)] transition-colors truncate">
               {doc.displayName || doc.originalName}
             </div>
             <div className="flex items-center gap-3 text-[12px] font-medium text-[var(--royal)]/40 flex-wrap">
@@ -1051,7 +1059,7 @@ function DocItem({
               )}
             </div>
           </div>
-        </div>
+        </button>
         <div className="flex items-center gap-2 flex-shrink-0 ml-4">
           {heirs.length > 0 && (
             <Button
@@ -1124,10 +1132,10 @@ function DocItem({
 
       {/* Visibility Picker — collapsible */}
       {visibilityOpen && heirs.length > 0 && (
-        <div className="border-t border-[var(--royal)]/10 bg-slate-50 px-6 py-4">
+        <div className="border-t border-[var(--royal)]/10 bg-neutral-faint px-6 py-4">
           <div className="flex items-center gap-2 mb-3">
             {visibleTo.length === 0 ? (
-              <svg viewBox="0 0 24 24" className="w-3.5 h-3.5 text-slate-500" fill="none" stroke="currentColor" strokeWidth="2">
+              <svg viewBox="0 0 24 24" className="w-3.5 h-3.5 text-[var(--royal)]/60" fill="none" stroke="currentColor" strokeWidth="2">
                 <circle cx="12" cy="12" r="10" />
                 <line x1="2" y1="12" x2="22" y2="12" />
                 <path d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z" />
@@ -1140,20 +1148,25 @@ function DocItem({
                 <path d="M16 3.13a4 4 0 0 1 0 7.75" />
               </svg>
             )}
-            <span className="text-[11px] font-bold text-slate-500 uppercase tracking-widest">
+            <span className="text-[11px] font-bold text-[var(--royal)]/60 uppercase tracking-widest">
               {visibleTo.length === 0 ? 'Visible to all heirs' : `Visible to ${visibleTo.length} selected`}
             </span>
           </div>
           <div className="flex flex-wrap gap-2">
             <button
-              onClick={() => {
+              onClick={async () => {
+                const prev = visibleTo
                 setVisibleTo([])
-                updateVaultDocument(estateId, doc.id, { visibleTo: [] })
+                const result = await updateVaultDocument(estateId, doc.id, { visibleTo: [] })
+                if (!result.success) {
+                  setVisibleTo(prev)
+                  toast.error('Could not update who can see this document')
+                }
               }}
               className={`text-xs px-3 py-1.5 rounded-full border transition-all font-medium ${
                 visibleTo.length === 0
                   ? 'border-[var(--royal)] bg-[var(--royal)]/5 text-[var(--royal)]'
-                  : 'border-slate-200 text-slate-500 hover:border-slate-300'
+                  : 'border-neutral-border text-[var(--royal)]/60 hover:border-gold/50'
               }`}
             >
               Everyone
@@ -1163,17 +1176,22 @@ function DocItem({
               return (
                 <button
                   key={heir.id}
-                  onClick={() => {
+                  onClick={async () => {
+                    const prev = visibleTo
                     const next = selected
                       ? visibleTo.filter((n) => n !== heir.id)
                       : [...visibleTo, heir.id]
                     setVisibleTo(next)
-                    updateVaultDocument(estateId, doc.id, { visibleTo: next })
+                    const result = await updateVaultDocument(estateId, doc.id, { visibleTo: next })
+                    if (!result.success) {
+                      setVisibleTo(prev)
+                      toast.error('Could not update who can see this document')
+                    }
                   }}
                   className={`text-xs px-3 py-1.5 rounded-full border transition-all font-medium ${
                     selected
                       ? 'border-[var(--royal)] bg-[var(--royal)]/5 text-[var(--royal)]'
-                      : 'border-slate-200 text-slate-500 hover:border-slate-300'
+                      : 'border-neutral-border text-[var(--royal)]/60 hover:border-gold/50'
                   }`}
                 >
                   {heir.fullName}
@@ -1242,7 +1260,7 @@ function PreviewModalContent({
       <DialogHeader className="p-6 border-b border-[var(--royal)]/10">
         <div className="flex items-center justify-between">
           <div className="min-w-0 flex-1">
-            <DialogTitle className="text-lg font-[family-name:var(--font-cinzel)] font-bold text-slate-900 truncate">
+            <DialogTitle className="text-lg font-[family-name:var(--font-cinzel)] font-bold text-[var(--royal)] truncate">
               {doc.displayName || doc.originalName}
             </DialogTitle>
             <DialogDescription className="text-[12px] text-[var(--royal)]/40 font-medium mt-0.5">
@@ -1260,7 +1278,7 @@ function PreviewModalContent({
       </DialogHeader>
 
       {/* Content */}
-      <div className="p-6 overflow-auto max-h-[70vh] flex items-center justify-center bg-slate-50">
+      <div className="p-6 overflow-auto max-h-[70vh] flex items-center justify-center bg-neutral-faint">
         {loading ? (
           <div className="w-10 h-10 border-2 border-[var(--royal)]/20 border-t-[var(--royal)] rounded-full animate-spin" />
         ) : previewUrl ? (
@@ -1297,16 +1315,16 @@ function DeleteModalContent({
             <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2" />
           </svg>
         </AlertDialogMedia>
-        <AlertDialogTitle className="text-xl font-[family-name:var(--font-cinzel)] font-bold text-slate-900 text-center">
+        <AlertDialogTitle className="text-xl font-[family-name:var(--font-cinzel)] font-bold text-[var(--royal)] text-center">
           Archive Document
         </AlertDialogTitle>
         <AlertDialogDescription className="text-[14px] text-[var(--royal)]/50 text-center">
-          <strong className="text-slate-900">{doc.displayName || doc.originalName}</strong> will be archived.
+          <strong className="text-[var(--royal)]">{doc.displayName || doc.originalName}</strong> will be archived.
           It can be restored later if needed.
         </AlertDialogDescription>
       </AlertDialogHeader>
       <AlertDialogFooter className="flex gap-3 mt-4 sm:flex-row border-t-0 bg-transparent mx-0 mb-0 p-0 rounded-none">
-        <AlertDialogCancel className="flex-1 py-3 rounded-xl border-[var(--royal)]/10 text-slate-900 font-bold text-[13px] hover:bg-slate-50 h-auto">
+        <AlertDialogCancel className="flex-1 py-3 rounded-xl border-[var(--royal)]/10 text-[var(--royal)] font-bold text-[13px] hover:bg-neutral-faint h-auto">
           Cancel
         </AlertDialogCancel>
         <AlertDialogAction
@@ -1353,7 +1371,7 @@ function AIInsightsPanel({
   )
 
   return (
-    <div className="border-t border-[var(--royal)]/10 bg-slate-50 px-6 py-5 space-y-4">
+    <div className="border-t border-[var(--royal)]/10 bg-neutral-faint px-6 py-5 space-y-4">
       {/* Header */}
       <div className="flex items-center gap-2">
         <svg viewBox="0 0 24 24" className="w-4 h-4 text-[var(--royal)]" fill="none" stroke="currentColor" strokeWidth="2">
@@ -1365,7 +1383,7 @@ function AIInsightsPanel({
       </div>
 
       {/* Summary */}
-      <p className="text-[14px] text-slate-900/80 leading-relaxed">
+      <p className="text-[14px] text-[var(--royal)]/80 leading-relaxed">
         {analysis.summary}
       </p>
 
@@ -1374,13 +1392,13 @@ function AIInsightsPanel({
         {analysis.signingDate && (
           <div className="flex items-center gap-2 text-[13px]">
             <span className="text-[var(--royal)]/40 font-medium">Signed:</span>
-            <span className="text-slate-900 font-semibold">{analysis.signingDate}</span>
+            <span className="text-[var(--royal)] font-semibold">{analysis.signingDate}</span>
           </div>
         )}
         {analysis.jurisdiction && (
           <div className="flex items-center gap-2 text-[13px]">
             <span className="text-[var(--royal)]/40 font-medium">Jurisdiction:</span>
-            <span className="text-slate-900 font-semibold">{analysis.jurisdiction}</span>
+            <span className="text-[var(--royal)] font-semibold">{analysis.jurisdiction}</span>
           </div>
         )}
         {analysis.notarized !== null && (
@@ -1394,7 +1412,7 @@ function AIInsightsPanel({
         {analysis.namedExecutor && (
           <div className="flex items-center gap-2 text-[13px]">
             <span className="text-[var(--royal)]/40 font-medium">Executor:</span>
-            <span className="text-slate-900 font-semibold">{analysis.namedExecutor}</span>
+            <span className="text-[var(--royal)] font-semibold">{analysis.namedExecutor}</span>
             {heirNames.has(analysis.namedExecutor.toLowerCase().trim()) ? (
               <svg viewBox="0 0 24 24" className="w-4 h-4 text-green-500 flex-shrink-0" fill="none" stroke="currentColor" strokeWidth="2.5">
                 <polyline points="20 6 9 17 4 12" />
@@ -1409,7 +1427,7 @@ function AIInsightsPanel({
         {analysis.namedTrustee && (
           <div className="flex items-center gap-2 text-[13px]">
             <span className="text-[var(--royal)]/40 font-medium">Trustee:</span>
-            <span className="text-slate-900 font-semibold">{analysis.namedTrustee}</span>
+            <span className="text-[var(--royal)] font-semibold">{analysis.namedTrustee}</span>
           </div>
         )}
       </div>
@@ -1459,7 +1477,7 @@ function AIInsightsPanel({
             {analysis.assetsMentioned.map((asset, i) => (
               <Badge
                 key={i}
-                className="bg-slate-50 text-[var(--royal)]/60 border border-[var(--royal)]/10 text-[12px] font-medium h-auto py-1 px-3 rounded-xl"
+                className="bg-neutral-faint text-[var(--royal)]/60 border border-[var(--royal)]/10 text-[12px] font-medium h-auto py-1 px-3 rounded-xl"
               >
                 {asset}
               </Badge>
diff --git a/web/src/routes/estates.create.tsx b/web/src/routes/estates.create.tsx
index 40a5143..9e6f325 100644
--- a/web/src/routes/estates.create.tsx
+++ b/web/src/routes/estates.create.tsx
@@ -255,7 +255,7 @@ function CreateEstatePage() {
   if (!profileResolved || profile?.primaryEstateId) {
     return (
       <AuthGuard>
-        <div className="min-h-screen flex items-center justify-center bg-slate-50">
+        <div className="min-h-screen flex items-center justify-center bg-[var(--neutral-faint)]">
           <div className="w-10 h-10 border-2 border-[var(--royal)]/20 border-t-[var(--royal)] rounded-full animate-spin" />
         </div>
       </AuthGuard>
@@ -264,7 +264,7 @@ function CreateEstatePage() {
 
   return (
     <AuthGuard>
-      <div className="min-h-screen bg-gradient-to-br from-slate-50 via-white to-slate-100 flex items-center justify-center p-6 font-[family-name:var(--font-inter)]">
+      <div className="min-h-screen bg-gradient-to-br from-neutral-faint via-white to-neutral-faint flex items-center justify-center p-6 font-[family-name:var(--font-inter)]">
         {/* Background decoration */}
         <div className="fixed inset-0 pointer-events-none overflow-hidden">
           <div className="absolute top-[-200px] right-[-200px] w-[600px] h-[600px] rounded-full bg-[var(--royal)]/[0.03] blur-3xl" />
@@ -281,14 +281,14 @@ function CreateEstatePage() {
                   <path d="M3.05 13A9 9 0 1 0 6 5.3L3 8" />
                   <path d="M12 7v5l3 3" />
                 </svg>
-                <p className="text-sm font-semibold text-slate-900 truncate">
+                <p className="text-sm font-semibold text-[var(--ink)] truncate">
                   We saved your progress on this device. Resume where you left off.
                 </p>
               </div>
               <Button
                 variant="ghost"
                 onClick={handleStartOver}
-                className="flex-shrink-0 h-auto px-3 py-1.5 text-sm font-bold text-slate-500 hover:text-[var(--royal)] hover:bg-transparent"
+                className="flex-shrink-0 h-auto px-3 py-1.5 text-sm font-bold text-[var(--ink-muted)] hover:text-[var(--royal)] hover:bg-transparent"
               >
                 Start over
               </Button>
@@ -304,10 +304,10 @@ function CreateEstatePage() {
                     <path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z" />
                   </svg>
                 </div>
-                <h1 className="text-5xl font-[family-name:var(--font-cinzel)] font-bold text-slate-900 mb-6 tracking-tight leading-tight">
+                <h1 className="text-5xl font-[family-name:var(--font-cinzel)] font-bold text-[var(--ink)] mb-6 tracking-tight leading-tight">
                   Welcome{firstName ? `, ${firstName}` : ''}.
                 </h1>
-                <p className="text-xl text-slate-500 font-medium max-w-lg mx-auto leading-relaxed">
+                <p className="text-xl text-[var(--ink-muted)] font-medium max-w-lg mx-auto leading-relaxed">
                   Let's set up your estate plan. This is the first step toward protecting
                   everything you've worked for — and the people who matter most.
                 </p>
@@ -341,7 +341,7 @@ function CreateEstatePage() {
                 Create My Estate Plan
               </Button>
 
-              <p className="text-center mt-8 text-sm text-slate-400 font-medium">
+              <p className="text-center mt-8 text-sm text-[var(--ink-muted)] font-medium">
                 Your data is protected with AES-256 encryption and enterprise-grade security infrastructure.
               </p>
             </div>
@@ -354,7 +354,7 @@ function CreateEstatePage() {
               <Button
                 variant="ghost"
                 onClick={() => setStep(step - 1)}
-                className="flex items-center gap-2 text-slate-500 hover:text-[var(--royal)] font-semibold text-sm mb-8 transition-colors px-0 hover:bg-transparent"
+                className="flex items-center gap-2 text-[var(--ink-muted)] hover:text-[var(--royal)] font-semibold text-sm mb-8 transition-colors px-0 hover:bg-transparent"
               >
                 <svg viewBox="0 0 24 24" className="w-4 h-4" fill="none" stroke="currentColor" strokeWidth="2.5">
                   <path d="M19 12H5m7-7-7 7 7 7" />
@@ -373,7 +373,7 @@ function CreateEstatePage() {
                             ? 'bg-[var(--gold)] text-white'
                             : i + 1 === step
                               ? 'bg-[var(--royal)] text-white shadow-lg shadow-[var(--royal)]/20'
-                              : 'bg-slate-100 text-slate-400'
+                              : 'bg-[var(--neutral-faint)] text-[var(--ink-muted)]'
                         }`}
                       >
                         {i + 1 < step ? (
@@ -385,19 +385,19 @@ function CreateEstatePage() {
                         )}
                       </div>
                       <span className={`text-[10px] font-semibold tracking-wide ${
-                        i + 1 === step ? 'text-[var(--royal)]' : 'text-slate-400'
+                        i + 1 === step ? 'text-[var(--royal)]' : 'text-[var(--ink-muted)]'
                       }`}>
                         {label}
                       </span>
                     </div>
                   ))}
                 </div>
-                <Progress value={(step / 5) * 100} className="h-1.5 bg-slate-100 [&>[data-slot=progress-indicator]]:bg-[var(--royal)]" />
+                <Progress value={(step / 5) * 100} className="h-1.5 bg-[var(--neutral-faint)] [&>[data-slot=progress-indicator]]:bg-[var(--royal)]" />
               </div>
 
               {/* ─── Step 1: Your Situation ─── */}
               {step === 1 && (
-                <Card className="rounded-[2.5rem] p-12 border-slate-100 shadow-[0_20px_80px_rgba(15,23,42,0.04)] bg-white">
+                <Card className="rounded-[2.5rem] p-12 border-[var(--neutral-border)] shadow-[0_20px_80px_rgba(15,23,42,0.04)] bg-white">
                   <CardHeader className="p-0 mb-10">
                     <div className="flex items-center gap-3 mb-4">
                       <div className="w-8 h-px bg-[var(--royal)]/20" />
@@ -405,10 +405,10 @@ function CreateEstatePage() {
                         Step 1 of 5
                       </Badge>
                     </div>
-                    <CardTitle className="text-3xl font-[family-name:var(--font-cinzel)] font-bold text-slate-900 mb-3 tracking-tight">
+                    <CardTitle className="text-3xl font-[family-name:var(--font-cinzel)] font-bold text-[var(--ink)] mb-3 tracking-tight">
                       What brings you here?
                     </CardTitle>
-                    <CardDescription className="text-lg text-slate-500 font-medium leading-relaxed">
+                    <CardDescription className="text-lg text-[var(--ink-muted)] font-medium leading-relaxed">
                       There's no wrong answer. We'll tailor your experience based on where you are right now.
                     </CardDescription>
                   </CardHeader>
@@ -421,7 +421,7 @@ function CreateEstatePage() {
                       className={`w-full text-left p-6 rounded-[2rem] border-2 transition-all ${
                         wizardData.situation === 'planning'
                           ? 'border-[var(--royal)] bg-[var(--royal)]/[0.03] shadow-lg shadow-[var(--royal)]/10'
-                          : 'border-slate-200 hover:border-[var(--royal)]/30 hover:bg-slate-50'
+                          : 'border-[var(--neutral-border)] hover:border-[var(--royal)]/30 hover:bg-[var(--neutral-faint)]'
                       }`}
                     >
                       <div className="flex items-start gap-5">
@@ -435,8 +435,8 @@ function CreateEstatePage() {
                           </svg>
                         </div>
                         <div>
-                          <h3 className="text-lg font-bold text-slate-900 mb-1">Planning Ahead</h3>
-                          <p className="text-slate-500 font-medium leading-relaxed">
+                          <h3 className="text-lg font-bold text-[var(--ink)] mb-1">Planning Ahead</h3>
+                          <p className="text-[var(--ink-muted)] font-medium leading-relaxed">
                             I want to organize my estate while I'm able — so my family is protected no matter what.
                           </p>
                         </div>
@@ -459,7 +459,7 @@ function CreateEstatePage() {
                       className={`w-full text-left p-6 rounded-[2rem] border-2 transition-all ${
                         wizardData.situation === 'after-loss'
                           ? 'border-[var(--gold)] bg-[var(--gold)]/[0.03] shadow-lg shadow-[var(--gold)]/10'
-                          : 'border-slate-200 hover:border-[var(--gold)]/30 hover:bg-slate-50'
+                          : 'border-[var(--neutral-border)] hover:border-[var(--gold)]/30 hover:bg-[var(--neutral-faint)]'
                       }`}
                     >
                       <div className="flex items-start gap-5">
@@ -473,8 +473,8 @@ function CreateEstatePage() {
                           </svg>
                         </div>
                         <div>
-                          <h3 className="text-lg font-bold text-slate-900 mb-1">After a Loss</h3>
-                          <p className="text-slate-500 font-medium leading-relaxed">
+                          <h3 className="text-lg font-bold text-[var(--ink)] mb-1">After a Loss</h3>
+                          <p className="text-[var(--ink-muted)] font-medium leading-relaxed">
                             I'm settling the estate of someone who has passed. I need help organizing and managing everything.
                           </p>
                         </div>
@@ -508,7 +508,7 @@ function CreateEstatePage() {
 
               {/* ─── Step 2: About You ─── */}
               {step === 2 && (
-                <Card className="rounded-[2.5rem] p-12 border-slate-100 shadow-[0_20px_80px_rgba(15,23,42,0.04)] bg-white">
+                <Card className="rounded-[2.5rem] p-12 border-[var(--neutral-border)] shadow-[0_20px_80px_rgba(15,23,42,0.04)] bg-white">
                   <CardHeader className="p-0 mb-10">
                     <div className="flex items-center gap-3 mb-4">
                       <div className="w-8 h-px bg-[var(--royal)]/20" />
@@ -516,10 +516,10 @@ function CreateEstatePage() {
                         Step 2 of 5
                       </Badge>
                     </div>
-                    <CardTitle className="text-3xl font-[family-name:var(--font-cinzel)] font-bold text-slate-900 mb-3 tracking-tight">
+                    <CardTitle className="text-3xl font-[family-name:var(--font-cinzel)] font-bold text-[var(--ink)] mb-3 tracking-tight">
                       About You
                     </CardTitle>
-                    <CardDescription className="text-lg text-slate-500 font-medium leading-relaxed">
+                    <CardDescription className="text-lg text-[var(--ink-muted)] font-medium leading-relaxed">
                       A few basics help us personalize your estate plan and ensure it meets your state's requirements.
                     </CardDescription>
                   </CardHeader>
@@ -527,7 +527,7 @@ function CreateEstatePage() {
                   <CardContent className="p-0 space-y-6">
                     {/* Full Name */}
                     <div className="space-y-2">
-                      <Label className="text-[11px] font-bold text-slate-400 uppercase tracking-widest pl-2">
+                      <Label className="text-[11px] font-bold text-[var(--ink-muted)] uppercase tracking-widest pl-2">
                         Full Legal Name
                       </Label>
                       <Input
@@ -535,21 +535,21 @@ function CreateEstatePage() {
                         value={wizardData.fullName}
                         onChange={(e) => update({ fullName: e.target.value })}
                         placeholder="Your full name"
-                        className="w-full px-6 py-4 h-auto rounded-2xl border-slate-200 bg-slate-50 focus:bg-white focus-visible:border-[var(--royal)] focus-visible:ring-8 focus-visible:ring-[var(--royal)]/5 font-semibold text-slate-900 text-base transition-all placeholder:text-slate-300 placeholder:font-medium"
+                        className="w-full px-6 py-4 h-auto rounded-2xl border-[var(--neutral-border)] bg-[var(--neutral-faint)] focus:bg-white focus-visible:border-[var(--royal)] focus-visible:ring-8 focus-visible:ring-[var(--royal)]/5 font-semibold text-[var(--ink)] text-base transition-all placeholder:text-ink-muted placeholder:font-medium"
                         autoFocus
                       />
                     </div>
 
                     {/* State of Residence */}
                     <div className="space-y-2">
-                      <Label className="text-[11px] font-bold text-slate-400 uppercase tracking-widest pl-2">
+                      <Label className="text-[11px] font-bold text-[var(--ink-muted)] uppercase tracking-widest pl-2">
                         State of Residence
                       </Label>
                       <Select
                         value={wizardData.stateOfResidence}
                         onValueChange={(val) => update({ stateOfResidence: val })}
                       >
-                        <SelectTrigger className="w-full px-6 py-4 h-auto rounded-2xl border-slate-200 bg-slate-50 font-semibold text-base text-slate-900 [&>span]:text-slate-300 data-[state=open]:border-[var(--royal)] data-[state=open]:ring-8 data-[state=open]:ring-[var(--royal)]/5">
+                        <SelectTrigger className="w-full px-6 py-4 h-auto rounded-2xl border-[var(--neutral-border)] bg-[var(--neutral-faint)] font-semibold text-base text-[var(--ink)] [&>span]:text-ink-muted data-[state=open]:border-[var(--royal)] data-[state=open]:ring-8 data-[state=open]:ring-[var(--royal)]/5">
                           <SelectValue placeholder="Select your state" />
                         </SelectTrigger>
                         <SelectContent className="rounded-xl max-h-72">
@@ -562,7 +562,7 @@ function CreateEstatePage() {
 
                     {/* Marital Status */}
                     <div className="space-y-2">
-                      <Label className="text-[11px] font-bold text-slate-400 uppercase tracking-widest pl-2">
+                      <Label className="text-[11px] font-bold text-[var(--ink-muted)] uppercase tracking-widest pl-2">
                         Marital Status
                       </Label>
                       <Select
@@ -572,7 +572,7 @@ function CreateEstatePage() {
                           update({ maritalStatus: val, hasSpouse })
                         }}
                       >
-                        <SelectTrigger className="w-full px-6 py-4 h-auto rounded-2xl border-slate-200 bg-slate-50 font-semibold text-base text-slate-900 [&>span]:text-slate-300 data-[state=open]:border-[var(--royal)] data-[state=open]:ring-8 data-[state=open]:ring-[var(--royal)]/5">
+                        <SelectTrigger className="w-full px-6 py-4 h-auto rounded-2xl border-[var(--neutral-border)] bg-[var(--neutral-faint)] font-semibold text-base text-[var(--ink)] [&>span]:text-ink-muted data-[state=open]:border-[var(--royal)] data-[state=open]:ring-8 data-[state=open]:ring-[var(--royal)]/5">
                           <SelectValue placeholder="Select marital status" />
                         </SelectTrigger>
                         <SelectContent className="rounded-xl">
@@ -589,7 +589,7 @@ function CreateEstatePage() {
                     <Button
                       variant="outline"
                       onClick={() => setStep(1)}
-                      className="flex-1 py-5 h-auto rounded-2xl border-slate-200 font-bold text-slate-500 hover:bg-slate-50 transition-all active:scale-[0.98]"
+                      className="flex-1 py-5 h-auto rounded-2xl border-[var(--neutral-border)] font-bold text-[var(--ink-muted)] hover:bg-[var(--neutral-faint)] transition-all active:scale-[0.98]"
                     >
                       Back
                     </Button>
@@ -609,7 +609,7 @@ function CreateEstatePage() {
 
               {/* ─── Step 3: Family ─── */}
               {step === 3 && (
-                <Card className="rounded-[2.5rem] p-12 border-slate-100 shadow-[0_20px_80px_rgba(15,23,42,0.04)] bg-white">
+                <Card className="rounded-[2.5rem] p-12 border-[var(--neutral-border)] shadow-[0_20px_80px_rgba(15,23,42,0.04)] bg-white">
                   <CardHeader className="p-0 mb-10">
                     <div className="flex items-center gap-3 mb-4">
                       <div className="w-8 h-px bg-[var(--royal)]/20" />
@@ -617,20 +617,20 @@ function CreateEstatePage() {
                         Step 3 of 5
                       </Badge>
                     </div>
-                    <CardTitle className="text-3xl font-[family-name:var(--font-cinzel)] font-bold text-slate-900 mb-3 tracking-tight">
+                    <CardTitle className="text-3xl font-[family-name:var(--font-cinzel)] font-bold text-[var(--ink)] mb-3 tracking-tight">
                       Your Family
                     </CardTitle>
-                    <CardDescription className="text-lg text-slate-500 font-medium leading-relaxed">
+                    <CardDescription className="text-lg text-[var(--ink-muted)] font-medium leading-relaxed">
                       Understanding your family helps us suggest the right protections and designations.
                     </CardDescription>
                   </CardHeader>
 
                   <CardContent className="p-0 space-y-6">
                     {/* Spouse/Partner */}
-                    <div className="flex items-center justify-between p-5 rounded-2xl bg-slate-50 border border-slate-100">
+                    <div className="flex items-center justify-between p-5 rounded-2xl bg-[var(--neutral-faint)] border border-[var(--neutral-border)]">
                       <div>
-                        <p className="font-bold text-slate-900">Spouse or partner?</p>
-                        <p className="text-sm text-slate-500 mt-0.5">Do you currently have a spouse or domestic partner?</p>
+                        <p className="font-bold text-[var(--ink)]">Spouse or partner?</p>
+                        <p className="text-sm text-[var(--ink-muted)] mt-0.5">Do you currently have a spouse or domestic partner?</p>
                       </div>
                       <Switch
                         checked={wizardData.hasSpouse}
@@ -639,13 +639,13 @@ function CreateEstatePage() {
                       />
                     </div>
 
-                    <Separator className="bg-slate-100" />
+                    <Separator className="bg-[var(--neutral-faint)]" />
 
                     {/* Children */}
-                    <div className="flex items-center justify-between p-5 rounded-2xl bg-slate-50 border border-slate-100">
+                    <div className="flex items-center justify-between p-5 rounded-2xl bg-[var(--neutral-faint)] border border-[var(--neutral-border)]">
                       <div>
-                        <p className="font-bold text-slate-900">Children?</p>
-                        <p className="text-sm text-slate-500 mt-0.5">Do you have any children or dependents?</p>
+                        <p className="font-bold text-[var(--ink)]">Children?</p>
+                        <p className="text-sm text-[var(--ink-muted)] mt-0.5">Do you have any children or dependents?</p>
                       </div>
                       <Switch
                         checked={wizardData.hasChildren}
@@ -665,7 +665,7 @@ function CreateEstatePage() {
                     {wizardData.hasChildren && (
                       <div className="pl-2 space-y-4 animate-in fade-in slide-in-from-top-2 duration-300">
                         <div className="space-y-2">
-                          <Label className="text-[11px] font-bold text-slate-400 uppercase tracking-widest pl-2">
+                          <Label className="text-[11px] font-bold text-[var(--ink-muted)] uppercase tracking-widest pl-2">
                             How many children?
                           </Label>
                           <Input
@@ -674,15 +674,15 @@ function CreateEstatePage() {
                             max={20}
                             value={wizardData.numberOfChildren}
                             onChange={(e) => update({ numberOfChildren: Math.max(1, parseInt(e.target.value) || 1) })}
-                            className="w-32 px-6 py-3 h-auto rounded-2xl border-slate-200 bg-slate-50 focus:bg-white focus-visible:border-[var(--royal)] focus-visible:ring-8 focus-visible:ring-[var(--royal)]/5 font-semibold text-slate-900 text-base transition-all"
+                            className="w-32 px-6 py-3 h-auto rounded-2xl border-[var(--neutral-border)] bg-[var(--neutral-faint)] focus:bg-white focus-visible:border-[var(--royal)] focus-visible:ring-8 focus-visible:ring-[var(--royal)]/5 font-semibold text-[var(--ink)] text-base transition-all"
                           />
                         </div>
 
                         {/* Minor children */}
-                        <div className="flex items-center justify-between p-5 rounded-2xl bg-slate-50 border border-slate-100">
+                        <div className="flex items-center justify-between p-5 rounded-2xl bg-[var(--neutral-faint)] border border-[var(--neutral-border)]">
                           <div>
-                            <p className="font-bold text-slate-900">Any minor children?</p>
-                            <p className="text-sm text-slate-500 mt-0.5">Children under 18 may need a guardian designation.</p>
+                            <p className="font-bold text-[var(--ink)]">Any minor children?</p>
+                            <p className="text-sm text-[var(--ink-muted)] mt-0.5">Children under 18 may need a guardian designation.</p>
                           </div>
                           <Switch
                             checked={wizardData.hasMinorChildren}
@@ -698,7 +698,7 @@ function CreateEstatePage() {
                     <Button
                       variant="outline"
                       onClick={() => setStep(2)}
-                      className="flex-1 py-5 h-auto rounded-2xl border-slate-200 font-bold text-slate-500 hover:bg-slate-50 transition-all active:scale-[0.98]"
+                      className="flex-1 py-5 h-auto rounded-2xl border-[var(--neutral-border)] font-bold text-[var(--ink-muted)] hover:bg-[var(--neutral-faint)] transition-all active:scale-[0.98]"
                     >
                       Back
                     </Button>
@@ -717,7 +717,7 @@ function CreateEstatePage() {
 
               {/* ─── Step 4: Key Assets ─── */}
               {step === 4 && (
-                <Card className="rounded-[2.5rem] p-12 border-slate-100 shadow-[0_20px_80px_rgba(15,23,42,0.04)] bg-white">
+                <Card className="rounded-[2.5rem] p-12 border-[var(--neutral-border)] shadow-[0_20px_80px_rgba(15,23,42,0.04)] bg-white">
                   <CardHeader className="p-0 mb-10">
                     <div className="flex items-center gap-3 mb-4">
                       <div className="w-8 h-px bg-[var(--royal)]/20" />
@@ -725,10 +725,10 @@ function CreateEstatePage() {
                         Step 4 of 5
                       </Badge>
                     </div>
-                    <CardTitle className="text-3xl font-[family-name:var(--font-cinzel)] font-bold text-slate-900 mb-3 tracking-tight">
+                    <CardTitle className="text-3xl font-[family-name:var(--font-cinzel)] font-bold text-[var(--ink)] mb-3 tracking-tight">
                       Key Assets
                     </CardTitle>
-                    <CardDescription className="text-lg text-slate-500 font-medium leading-relaxed">
+                    <CardDescription className="text-lg text-[var(--ink-muted)] font-medium leading-relaxed">
                       Select any that apply — this helps us set up the right categories in your estate. You can always add more later.
                     </CardDescription>
                   </CardHeader>
@@ -745,17 +745,17 @@ function CreateEstatePage() {
                             className={`flex items-center gap-4 p-4 rounded-2xl border-2 text-left transition-all ${
                               selected
                                 ? 'border-[var(--royal)] bg-[var(--royal)]/[0.03]'
-                                : 'border-slate-100 hover:border-slate-200 hover:bg-slate-50'
+                                : 'border-[var(--neutral-border)] hover:border-gold/40 hover:bg-[var(--neutral-faint)]'
                             }`}
                           >
                             <div className={`w-10 h-10 rounded-xl flex items-center justify-center flex-shrink-0 transition-all ${
-                              selected ? 'bg-[var(--royal)] text-white' : 'bg-slate-100 text-slate-400'
+                              selected ? 'bg-[var(--royal)] text-white' : 'bg-[var(--neutral-faint)] text-[var(--ink-muted)]'
                             }`}>
                               <svg viewBox="0 0 24 24" className="w-5 h-5" fill="none" stroke="currentColor" strokeWidth="1.5">
                                 <path d={asset.icon} />
                               </svg>
                             </div>
-                            <span className={`font-semibold transition-colors ${selected ? 'text-slate-900' : 'text-slate-500'}`}>
+                            <span className={`font-semibold transition-colors ${selected ? 'text-[var(--ink)]' : 'text-[var(--ink-muted)]'}`}>
                               {asset.label}
                             </span>
                             {selected && (
@@ -777,7 +777,7 @@ function CreateEstatePage() {
                     <Button
                       variant="outline"
                       onClick={() => setStep(3)}
-                      className="flex-1 py-5 h-auto rounded-2xl border-slate-200 font-bold text-slate-500 hover:bg-slate-50 transition-all active:scale-[0.98]"
+                      className="flex-1 py-5 h-auto rounded-2xl border-[var(--neutral-border)] font-bold text-[var(--ink-muted)] hover:bg-[var(--neutral-faint)] transition-all active:scale-[0.98]"
                     >
                       Back
                     </Button>
@@ -802,7 +802,7 @@ function CreateEstatePage() {
 
               {/* ─── Step 5: Name Your Estate ─── */}
               {step === 5 && (
-                <Card className="rounded-[2.5rem] p-12 border-slate-100 shadow-[0_20px_80px_rgba(15,23,42,0.04)] bg-white">
+                <Card className="rounded-[2.5rem] p-12 border-[var(--neutral-border)] shadow-[0_20px_80px_rgba(15,23,42,0.04)] bg-white">
                   <CardHeader className="p-0 mb-10">
                     <div className="flex items-center gap-3 mb-4">
                       <div className="w-8 h-px bg-[var(--royal)]/20" />
@@ -810,10 +810,10 @@ function CreateEstatePage() {
                         Step 5 of 5
                       </Badge>
                     </div>
-                    <CardTitle className="text-3xl font-[family-name:var(--font-cinzel)] font-bold text-slate-900 mb-3 tracking-tight">
+                    <CardTitle className="text-3xl font-[family-name:var(--font-cinzel)] font-bold text-[var(--ink)] mb-3 tracking-tight">
                       Name Your Estate
                     </CardTitle>
-                    <CardDescription className="text-lg text-slate-500 font-medium leading-relaxed">
+                    <CardDescription className="text-lg text-[var(--ink-muted)] font-medium leading-relaxed">
                       Almost there. Give your estate a name — you can always change this later.
                     </CardDescription>
                   </CardHeader>
@@ -821,7 +821,7 @@ function CreateEstatePage() {
                   <CardContent className="p-0 space-y-8">
                     {/* Estate Name */}
                     <div className="space-y-2">
-                      <Label className="text-[11px] font-bold text-slate-400 uppercase tracking-widest pl-2">
+                      <Label className="text-[11px] font-bold text-[var(--ink-muted)] uppercase tracking-widest pl-2">
                         Estate Name
                       </Label>
                       <Input
@@ -829,7 +829,7 @@ function CreateEstatePage() {
                         value={wizardData.estateName}
                         onChange={(e) => update({ estateName: e.target.value })}
                         placeholder={suggestedEstateName}
-                        className="w-full px-8 py-6 h-auto rounded-2xl border-slate-200 bg-slate-50 focus:bg-white focus-visible:border-[var(--royal)] focus-visible:ring-8 focus-visible:ring-[var(--royal)]/5 font-bold text-slate-900 text-xl transition-all placeholder:text-slate-300 placeholder:font-medium"
+                        className="w-full px-8 py-6 h-auto rounded-2xl border-[var(--neutral-border)] bg-[var(--neutral-faint)] focus:bg-white focus-visible:border-[var(--royal)] focus-visible:ring-8 focus-visible:ring-[var(--royal)]/5 font-bold text-[var(--ink)] text-xl transition-all placeholder:text-ink-muted placeholder:font-medium"
                         autoFocus
                         onKeyDown={(e) => {
                           if (e.key === 'Enter' && wizardData.estateName.trim()) handleCreate()
@@ -838,8 +838,8 @@ function CreateEstatePage() {
                     </div>
 
                     {/* Summary */}
-                    <div className="rounded-2xl bg-slate-50 border border-slate-100 p-6 space-y-4">
-                      <h4 className="text-xs font-bold text-slate-400 uppercase tracking-widest">Your Intake Summary</h4>
+                    <div className="rounded-2xl bg-[var(--neutral-faint)] border border-[var(--neutral-border)] p-6 space-y-4">
+                      <h4 className="text-xs font-bold text-[var(--ink-muted)] uppercase tracking-widest">Your Intake Summary</h4>
                       <div className="grid grid-cols-2 gap-4 text-sm">
                         <SummaryItem
                           label="Situation"
@@ -880,7 +880,7 @@ function CreateEstatePage() {
                     <Button
                       variant="outline"
                       onClick={() => setStep(4)}
-                      className="flex-1 py-5 h-auto rounded-2xl border-slate-200 font-bold text-slate-500 hover:bg-slate-50 transition-all active:scale-[0.98]"
+                      className="flex-1 py-5 h-auto rounded-2xl border-[var(--neutral-border)] font-bold text-[var(--ink-muted)] hover:bg-[var(--neutral-faint)] transition-all active:scale-[0.98]"
                     >
                       Back
                     </Button>
@@ -909,21 +909,21 @@ function CreateEstatePage() {
 
               {/* Security badges */}
               <div className="flex items-center justify-center gap-6 mt-10">
-                <Badge variant="outline" className="text-[13px] text-slate-400 font-medium border-0 bg-transparent gap-2 h-auto">
+                <Badge variant="outline" className="text-[13px] text-[var(--ink-muted)] font-medium border-0 bg-transparent gap-2 h-auto">
                   <svg viewBox="0 0 24 24" className="w-4 h-4" fill="none" stroke="currentColor" strokeWidth="2">
                     <path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z" />
                   </svg>
                   AES-256 Encrypted
                 </Badge>
-                <div className="w-1 h-1 rounded-full bg-slate-300" />
-                <Badge variant="outline" className="text-[13px] text-slate-400 font-medium border-0 bg-transparent gap-2 h-auto">
+                <div className="w-1 h-1 rounded-full bg-[var(--neutral-border)]" />
+                <Badge variant="outline" className="text-[13px] text-[var(--ink-muted)] font-medium border-0 bg-transparent gap-2 h-auto">
                   <svg viewBox="0 0 24 24" className="w-4 h-4" fill="none" stroke="currentColor" strokeWidth="2">
                     <rect x="3" y="11" width="18" height="11" rx="2" ry="2" /><path d="M7 11V7a5 5 0 0 1 10 0v4" />
                   </svg>
                   SOC 2 Architecture
                 </Badge>
-                <div className="w-1 h-1 rounded-full bg-slate-300" />
-                <Badge variant="outline" className="text-[13px] text-slate-400 font-medium border-0 bg-transparent gap-2 h-auto">
+                <div className="w-1 h-1 rounded-full bg-[var(--neutral-border)]" />
+                <Badge variant="outline" className="text-[13px] text-[var(--ink-muted)] font-medium border-0 bg-transparent gap-2 h-auto">
                   <svg viewBox="0 0 24 24" className="w-4 h-4" fill="none" stroke="currentColor" strokeWidth="2">
                     <path d="M22 11.08V12a10 10 0 1 1-5.93-9.14" /><polyline points="22 4 12 14.01 9 11.01" />
                   </svg>
@@ -942,15 +942,15 @@ function CreateEstatePage() {
 
 function FeatureCard({ icon, title, desc }: { icon: React.ReactNode; title: string; desc: string }) {
   return (
-    <Card className="rounded-[2rem] p-8 border-slate-100 shadow-[0_2px_30px_rgba(15,23,42,0.02)] text-center group hover:border-[var(--royal)]/20 hover:shadow-lg transition-all hover:-translate-y-1 bg-white ring-0">
+    <Card className="rounded-[2rem] p-8 border-[var(--neutral-border)] shadow-[0_2px_30px_rgba(15,23,42,0.02)] text-center group hover:border-[var(--royal)]/20 hover:shadow-lg transition-all hover:-translate-y-1 bg-white ring-0">
       <CardContent className="p-0">
-        <div className="w-14 h-14 mx-auto rounded-2xl bg-slate-50 border border-slate-100 flex items-center justify-center text-[var(--royal)] mb-5 group-hover:bg-[var(--royal)] group-hover:text-white transition-all duration-500">
+        <div className="w-14 h-14 mx-auto rounded-2xl bg-[var(--neutral-faint)] border border-[var(--neutral-border)] flex items-center justify-center text-[var(--royal)] mb-5 group-hover:bg-[var(--royal)] group-hover:text-white transition-all duration-500">
           <svg viewBox="0 0 24 24" className="w-7 h-7" fill="none" stroke="currentColor" strokeWidth="1.5">
             {icon}
           </svg>
         </div>
-        <h3 className="font-bold text-slate-900 text-lg mb-2 group-hover:text-[var(--royal)] transition-colors">{title}</h3>
-        <p className="text-sm text-slate-500 font-medium leading-relaxed">{desc}</p>
+        <h3 className="font-bold text-[var(--ink)] text-lg mb-2 group-hover:text-[var(--royal)] transition-colors">{title}</h3>
+        <p className="text-sm text-[var(--ink-muted)] font-medium leading-relaxed">{desc}</p>
       </CardContent>
     </Card>
   )
@@ -959,8 +959,8 @@ function FeatureCard({ icon, title, desc }: { icon: React.ReactNode; title: stri
 function SummaryItem({ label, value }: { label: string; value: string }) {
   return (
     <div>
-      <p className="text-[10px] font-bold text-slate-400 uppercase tracking-widest mb-1">{label}</p>
-      <p className="font-semibold text-slate-900">{value}</p>
+      <p className="text-[10px] font-bold text-[var(--ink-muted)] uppercase tracking-widest mb-1">{label}</p>
+      <p className="font-semibold text-[var(--ink)]">{value}</p>
     </div>
   )
 }
diff --git a/web/src/routes/index.tsx b/web/src/routes/index.tsx
index 747c057..69edf3e 100644
--- a/web/src/routes/index.tsx
+++ b/web/src/routes/index.tsx
@@ -159,10 +159,10 @@ function Home() {
 
         <div className="flex flex-col justify-center px-8 md:px-12 py-10">
           <ScrollReveal direction="right" className="max-w-lg mx-auto">
-            <h2 className="text-3xl md:text-4xl text-slate-900 mb-6 leading-tight font-[family-name:var(--font-cinzel)]">
+            <h2 className="text-3xl md:text-4xl text-royal mb-6 leading-tight font-[family-name:var(--font-cinzel)]">
               The Cost of <span className="text-[var(--gold)]">Not Being Ready</span>
             </h2>
-            <p className="text-base md:text-lg text-slate-600 leading-relaxed mb-6">
+            <p className="text-base md:text-lg text-ink-muted leading-relaxed mb-6">
               When someone passes without a plan, families face frozen accounts, lost passwords, missing documents, and legal battles that can last years. FinalWishes eliminates that chaos — before it starts.
             </p>
             <div className="grid grid-cols-3 gap-3">
@@ -256,10 +256,10 @@ function Home() {
       <section className="py-20 relative z-10 section-light">
         <div className="max-w-6xl mx-auto px-5">
           <ScrollReveal className="text-center mb-14">
-            <h2 className="text-4xl md:text-5xl lg:text-6xl text-slate-900 mb-4 font-[family-name:var(--font-cinzel)]">
+            <h2 className="text-4xl md:text-5xl lg:text-6xl text-royal mb-4 font-[family-name:var(--font-cinzel)]">
               Three Steps. <span className="text-[var(--gold)]">Fifteen Minutes.</span>
             </h2>
-            <p className="text-slate-500 text-lg max-w-xl mx-auto">That&apos;s all it takes to protect everything you&apos;ve built.</p>
+            <p className="text-ink-muted text-lg max-w-xl mx-auto">That&apos;s all it takes to protect everything you&apos;ve built.</p>
           </ScrollReveal>
 
           <StaggerList className="grid md:grid-cols-3 gap-6">
@@ -316,13 +316,13 @@ function Home() {
         <div className="max-w-6xl mx-auto px-5 grid md:grid-cols-2 gap-12 items-center relative z-10">
           <ScrollReveal direction="left">
             <p className="text-[var(--gold)] text-xs font-bold uppercase tracking-[0.25em] mb-3">AI-Powered Guidance</p>
-            <h2 className="text-3xl md:text-4xl text-slate-900 mb-6 font-[family-name:var(--font-cinzel)]">
+            <h2 className="text-3xl md:text-4xl text-royal mb-6 font-[family-name:var(--font-cinzel)]">
               The Shepherd <span className="text-[var(--gold)]">Guides You</span>
             </h2>
-            <p className="text-slate-600 text-base leading-relaxed mb-6">
+            <p className="text-ink-muted text-base leading-relaxed mb-6">
               Not sure where to start? Our AI engine analyzes your estate and tells you exactly what&apos;s missing, what&apos;s urgent, and what to do next. It&apos;s like having a personal estate advisor — available 24/7.
             </p>
-            <ul className="space-y-3 text-slate-600 text-sm">
+            <ul className="space-y-3 text-ink-muted text-sm">
               <li className="flex gap-3"><span className="text-[var(--gold)] text-lg">✓</span> Personalized completion checklist</li>
               <li className="flex gap-3"><span className="text-[var(--gold)] text-lg">✓</span> Daily prompts to capture your story</li>
               <li className="flex gap-3"><span className="text-[var(--gold)] text-lg">✓</span> Obituary drafting assistance</li>
@@ -378,8 +378,8 @@ function Home() {
               <Card key={item.label} className="bg-white rounded-xl border-0 ring-0 py-0 shadow-[0_4px_20px_rgba(0,0,0,0.1)]">
                 <CardContent className="p-5 text-center">
                   <div className="status-dot mx-auto mb-3" />
-                  <div className="text-slate-900 font-bold text-xs uppercase tracking-widest mb-1">{item.label}</div>
-                  <div className="text-slate-500 text-xs">{item.desc}</div>
+                  <div className="text-ink font-bold text-xs uppercase tracking-widest mb-1">{item.label}</div>
+                  <div className="text-ink-muted text-xs">{item.desc}</div>
                 </CardContent>
               </Card>
             ))}
@@ -391,7 +391,7 @@ function Home() {
       <section className="py-16 relative z-10 section-light">
         <div className="max-w-6xl mx-auto px-5">
           <ScrollReveal className="text-center mb-10">
-            <h2 className="text-2xl md:text-3xl text-slate-900 mb-3 font-[family-name:var(--font-cinzel)]">
+            <h2 className="text-2xl md:text-3xl text-royal mb-3 font-[family-name:var(--font-cinzel)]">
               Built for <span className="text-[var(--gold)]">Real Families</span>
             </h2>
           </ScrollReveal>
@@ -446,17 +446,17 @@ function Home() {
               <CardContent className="p-6 flex flex-col h-full">
                 <div className="flex items-center gap-2 mb-3">
                   <div className="status-dot" />
-                  <div className="text-[0.6rem] tracking-[0.15em] text-slate-400 uppercase">Guardian</div>
+                  <div className="text-[0.6rem] tracking-[0.15em] text-ink-muted uppercase">Guardian</div>
                 </div>
-                <div className="text-3xl text-slate-900 mb-1 font-[family-name:var(--font-cinzel)]">FREE</div>
-                <div className="text-sm text-slate-400 uppercase tracking-widest mb-4">Forever</div>
-                <ul className="space-y-2 text-sm text-slate-600 mb-5 flex-grow">
+                <div className="text-3xl text-royal mb-1 font-[family-name:var(--font-cinzel)]">FREE</div>
+                <div className="text-sm text-ink-muted uppercase tracking-widest mb-4">Forever</div>
+                <ul className="space-y-2 text-sm text-ink-muted mb-5 flex-grow">
                   <li className="flex gap-2"><span className="text-[var(--gold)]">✓</span> 1 estate plan</li>
                   <li className="flex gap-2"><span className="text-[var(--gold)]">✓</span> 5 document uploads</li>
                   <li className="flex gap-2"><span className="text-[var(--gold)]">✓</span> Basic asset inventory</li>
                   <li className="flex gap-2"><span className="text-[var(--gold)]">✓</span> Heir invitations</li>
                 </ul>
-                <Button variant="outline" onClick={openLogin} className="w-full py-3 border-2 border-slate-300 bg-transparent text-slate-700 hover:bg-slate-100 text-[0.6rem] font-bold uppercase tracking-widest rounded-lg h-auto">
+                <Button variant="outline" onClick={openLogin} className="w-full py-3 border-2 border-[var(--neutral-border)] bg-transparent text-ink hover:bg-[var(--neutral-faint)] text-[0.6rem] font-bold uppercase tracking-widest rounded-lg h-auto">
                   Start Free
                 </Button>
               </CardContent>
@@ -472,9 +472,9 @@ function Home() {
                   </div>
                   <Badge className="bg-gold text-black text-[0.55rem] font-bold uppercase rounded border-none">Popular</Badge>
                 </div>
-                <div className="text-3xl text-slate-900 mb-1 font-[family-name:var(--font-cinzel)]">$29<span className="text-lg text-slate-400">/mo</span></div>
-                <div className="text-sm text-slate-400 uppercase tracking-widest mb-4">Cancel Anytime</div>
-                <ul className="space-y-2 text-sm text-slate-600 mb-5 flex-grow">
+                <div className="text-3xl text-royal mb-1 font-[family-name:var(--font-cinzel)]">$29<span className="text-lg text-ink-muted">/mo</span></div>
+                <div className="text-sm text-ink-muted uppercase tracking-widest mb-4">Cancel Anytime</div>
+                <ul className="space-y-2 text-sm text-ink-muted mb-5 flex-grow">
                   <li className="flex gap-2"><span className="text-[var(--gold)]">✓</span> Unlimited documents</li>
                   <li className="flex gap-2"><span className="text-[var(--gold)]">✓</span> PII encryption vault</li>
                   <li className="flex gap-2"><span className="text-[var(--gold)]">✓</span> Video &amp; audio memoirs</li>
@@ -492,11 +492,11 @@ function Home() {
               <CardContent className="p-6 flex flex-col h-full">
                 <div className="flex items-center gap-2 mb-3">
                   <div className="status-dot" />
-                  <div className="text-[0.6rem] tracking-[0.15em] text-slate-400 uppercase">White Glove</div>
+                  <div className="text-[0.6rem] tracking-[0.15em] text-ink-muted uppercase">White Glove</div>
                 </div>
-                <div className="text-3xl text-slate-900 mb-1 font-[family-name:var(--font-cinzel)]">$99<span className="text-lg text-slate-400">/mo</span></div>
-                <div className="text-sm text-slate-400 uppercase tracking-widest mb-4">Cancel Anytime</div>
-                <ul className="space-y-2 text-sm text-slate-600 mb-5 flex-grow">
+                <div className="text-3xl text-royal mb-1 font-[family-name:var(--font-cinzel)]">$99<span className="text-lg text-ink-muted">/mo</span></div>
+                <div className="text-sm text-ink-muted uppercase tracking-widest mb-4">Cancel Anytime</div>
+                <ul className="space-y-2 text-sm text-ink-muted mb-5 flex-grow">
                   <li className="flex gap-2"><span className="text-[var(--gold)]">✓</span> Everything in Concierge</li>
                   <li className="flex gap-2"><span className="text-[var(--gold)]">✓</span> AI Shepherd guidance</li>
                   <li className="flex gap-2"><span className="text-[var(--gold)]">✓</span> Legal document review</li>
@@ -504,7 +504,7 @@ function Home() {
                   <li className="flex gap-2"><span className="text-[var(--gold)]">✓</span> Probate preparation</li>
                   <li className="flex gap-2"><span className="text-[var(--gold)]">✓</span> Phone support</li>
                 </ul>
-                <Button variant="outline" onClick={openLogin} className="w-full py-3 border-2 border-slate-300 bg-transparent text-slate-700 hover:bg-slate-100 text-[0.6rem] font-bold uppercase tracking-widest rounded-lg h-auto">
+                <Button variant="outline" onClick={openLogin} className="w-full py-3 border-2 border-[var(--neutral-border)] bg-transparent text-ink hover:bg-[var(--neutral-faint)] text-[0.6rem] font-bold uppercase tracking-widest rounded-lg h-auto">
                   Get Started
                 </Button>
               </CardContent>
@@ -517,7 +517,7 @@ function Home() {
       <section id="faq" className="py-16 relative z-10 section-light">
         <div className="max-w-4xl mx-auto px-5">
           <ScrollReveal className="text-center mb-10">
-            <h2 className="text-2xl md:text-3xl text-slate-900 mb-3 font-[family-name:var(--font-cinzel)]">
+            <h2 className="text-2xl md:text-3xl text-royal mb-3 font-[family-name:var(--font-cinzel)]">
               Common <span className="text-[var(--gold)]">Questions</span>
             </h2>
           </ScrollReveal>
@@ -799,7 +799,7 @@ function LoginModal({ open, onOpenChange, invite }: { open: boolean; onOpenChang
           <h2 aria-hidden="true" className="text-2xl font-[family-name:var(--font-cinzel)] font-bold text-[var(--royal)] mb-2">
             {mode === 'signin' ? 'Sign In' : mode === 'signup' ? 'Create Account' : mode === 'forgot' ? 'Reset Password' : 'Verification Required'}
           </h2>
-          <p className="text-slate-500 text-sm font-medium max-w-[260px] mx-auto leading-relaxed">
+          <p className="text-ink-muted text-sm font-medium max-w-[260px] mx-auto leading-relaxed">
             {mode === 'signin'
               ? 'Secure access to the Estate Operating System'
               : mode === 'signup'
@@ -816,13 +816,13 @@ function LoginModal({ open, onOpenChange, invite }: { open: boolean; onOpenChang
             <form className="space-y-6" onSubmit={handleSignIn}>
               <div className="space-y-2">
                 <Label htmlFor="modal-identifier" className="text-[11px] font-bold text-[var(--royal)]/40 uppercase tracking-widest pl-1">Email or Username</Label>
-                <Input id="modal-identifier" type="text" value={identifier} onChange={(e) => setIdentifier(e.target.value)} placeholder="e.g. jane@example.com" autoComplete="username" className="h-auto bg-slate-50 border-slate-200 hover:border-[var(--royal)]/30 rounded-2xl px-6 py-4 font-semibold text-[14px] text-slate-900 placeholder:text-slate-300 focus-visible:bg-white focus-visible:border-[var(--royal)] focus-visible:ring-0 focus-visible:shadow-sm" />
+                <Input id="modal-identifier" type="text" value={identifier} onChange={(e) => setIdentifier(e.target.value)} placeholder="e.g. jane@example.com" autoComplete="username" className="h-auto bg-[var(--neutral-faint)] border-[var(--neutral-border)] hover:border-[var(--royal)]/30 rounded-2xl px-6 py-4 font-semibold text-[14px] text-ink placeholder:text-ink-muted focus-visible:bg-white focus-visible:border-[var(--royal)] focus-visible:ring-0 focus-visible:shadow-sm" />
               </div>
               <div className="space-y-2">
                 <Label htmlFor="modal-password" className="text-[11px] font-bold text-[var(--royal)]/40 uppercase tracking-widest pl-1">Password</Label>
                 <div className="relative">
-                  <Input id="modal-password" type={showPassword ? "text" : "password"} value={password} onChange={(e) => setPassword(e.target.value)} placeholder="••••••••" autoComplete="current-password" className="h-auto bg-slate-50 border-slate-200 hover:border-[var(--royal)]/30 rounded-2xl px-6 py-4 pr-14 font-semibold text-[14px] text-slate-900 placeholder:text-slate-300 focus-visible:bg-white focus-visible:border-[var(--royal)] focus-visible:ring-0 focus-visible:shadow-sm" />
-                  <Button type="button" variant="ghost" size="icon" onClick={() => setShowPassword(!showPassword)} className="absolute right-3 top-1/2 -translate-y-1/2 text-slate-300 hover:text-[var(--royal)] z-10 h-8 w-8">
+                  <Input id="modal-password" type={showPassword ? "text" : "password"} value={password} onChange={(e) => setPassword(e.target.value)} placeholder="••••••••" autoComplete="current-password" className="h-auto bg-[var(--neutral-faint)] border-[var(--neutral-border)] hover:border-[var(--royal)]/30 rounded-2xl px-6 py-4 pr-14 font-semibold text-[14px] text-ink placeholder:text-ink-muted focus-visible:bg-white focus-visible:border-[var(--royal)] focus-visible:ring-0 focus-visible:shadow-sm" />
+                  <Button type="button" variant="ghost" size="icon" aria-label={showPassword ? 'Hide password' : 'Show password'} aria-pressed={showPassword} onClick={() => setShowPassword(!showPassword)} className="absolute right-3 top-1/2 -translate-y-1/2 text-ink-muted hover:text-[var(--royal)] z-10 h-8 w-8">
                     {showPassword ? (
                       <svg viewBox="0 0 24 24" className="w-5 h-5" fill="none" stroke="currentColor" strokeWidth="2.5"><path d="M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24"/><line x1="1" y1="1" x2="23" y2="23"/></svg>
                     ) : (
@@ -836,8 +836,8 @@ function LoginModal({ open, onOpenChange, invite }: { open: boolean; onOpenChang
                 {isSubmitting ? <span className="flex items-center justify-center gap-2"><span className="w-4 h-4 border-2 border-white/30 border-t-white rounded-full animate-spin" />Signing in...</span> : 'Sign In'}
               </Button>
               <div className="flex items-center justify-between text-xs px-1 pt-2">
-                <Button type="button" variant="link" onClick={() => { setMode('forgot'); setError(''); setResetSent(false); setResetEmail(identifier.includes('@') ? identifier : ''); }} className="text-slate-500 hover:text-[var(--royal)] font-medium text-xs p-0 h-auto no-underline hover:no-underline">Forgot password?</Button>
-                <Button type="button" variant="link" onClick={() => { setMode('signup'); setError(''); }} className="text-slate-500 hover:text-[var(--royal)] font-medium text-xs p-0 h-auto no-underline hover:no-underline">Create account</Button>
+                <Button type="button" variant="link" onClick={() => { setMode('forgot'); setError(''); setResetSent(false); setResetEmail(identifier.includes('@') ? identifier : ''); }} className="text-ink-muted hover:text-[var(--royal)] font-medium text-xs p-0 h-auto no-underline hover:no-underline">Forgot password?</Button>
+                <Button type="button" variant="link" onClick={() => { setMode('signup'); setError(''); }} className="text-ink-muted hover:text-[var(--royal)] font-medium text-xs p-0 h-auto no-underline hover:no-underline">Create account</Button>
               </div>
             </form>
           ) : mode === 'signup' ? (
@@ -845,27 +845,27 @@ function LoginModal({ open, onOpenChange, invite }: { open: boolean; onOpenChang
               <div className="grid grid-cols-2 gap-3">
                 <div className="space-y-1.5">
                   <Label htmlFor="modal-firstname" className="text-[11px] font-bold text-[var(--royal)]/40 uppercase tracking-widest pl-1">First Name</Label>
-                  <Input id="modal-firstname" type="text" value={firstName} onChange={(e) => setFirstName(e.target.value)} placeholder="Jane" autoComplete="given-name" className="h-auto bg-slate-50 border-slate-200 hover:border-[var(--royal)]/30 rounded-2xl px-4 py-3.5 font-semibold text-[14px] text-slate-900 placeholder:text-slate-300 focus-visible:bg-white focus-visible:border-[var(--royal)] focus-visible:ring-0 focus-visible:shadow-sm" />
+                  <Input id="modal-firstname" type="text" value={firstName} onChange={(e) => setFirstName(e.target.value)} placeholder="Jane" autoComplete="given-name" className="h-auto bg-[var(--neutral-faint)] border-[var(--neutral-border)] hover:border-[var(--royal)]/30 rounded-2xl px-4 py-3.5 font-semibold text-[14px] text-ink placeholder:text-ink-muted focus-visible:bg-white focus-visible:border-[var(--royal)] focus-visible:ring-0 focus-visible:shadow-sm" />
                 </div>
                 <div className="space-y-1.5">
                   <Label htmlFor="modal-lastname" className="text-[11px] font-bold text-[var(--royal)]/40 uppercase tracking-widest pl-1">Last Name</Label>
-                  <Input id="modal-lastname" type="text" value={lastName} onChange={(e) => setLastName(e.target.value)} placeholder="Doe" autoComplete="family-name" className="h-auto bg-slate-50 border-slate-200 hover:border-[var(--royal)]/30 rounded-2xl px-4 py-3.5 font-semibold text-[14px] text-slate-900 placeholder:text-slate-300 focus-visible:bg-white focus-visible:border-[var(--royal)] focus-visible:ring-0 focus-visible:shadow-sm" />
+                  <Input id="modal-lastname" type="text" value={lastName} onChange={(e) => setLastName(e.target.value)} placeholder="Doe" autoComplete="family-name" className="h-auto bg-[var(--neutral-faint)] border-[var(--neutral-border)] hover:border-[var(--royal)]/30 rounded-2xl px-4 py-3.5 font-semibold text-[14px] text-ink placeholder:text-ink-muted focus-visible:bg-white focus-visible:border-[var(--royal)] focus-visible:ring-0 focus-visible:shadow-sm" />
                 </div>
               </div>
               <div className="space-y-1.5">
                 <Label htmlFor="modal-username" className="text-[11px] font-bold text-[var(--royal)]/40 uppercase tracking-widest pl-1">Username</Label>
-                <Input id="modal-username" type="text" value={username} onChange={(e) => setUsername(e.target.value)} placeholder="e.g. janedoe" autoComplete="username" className="h-auto bg-slate-50 border-slate-200 hover:border-[var(--royal)]/30 rounded-2xl px-6 py-3.5 font-semibold text-[14px] text-slate-900 placeholder:text-slate-300 focus-visible:bg-white focus-visible:border-[var(--royal)] focus-visible:ring-0 focus-visible:shadow-sm" />
-                <p className="text-[10px] text-slate-400 pl-1">Letters, numbers, underscores only. Min 3 characters.</p>
+                <Input id="modal-username" type="text" value={username} onChange={(e) => setUsername(e.target.value)} placeholder="e.g. janedoe" autoComplete="username" className="h-auto bg-[var(--neutral-faint)] border-[var(--neutral-border)] hover:border-[var(--royal)]/30 rounded-2xl px-6 py-3.5 font-semibold text-[14px] text-ink placeholder:text-ink-muted focus-visible:bg-white focus-visible:border-[var(--royal)] focus-visible:ring-0 focus-visible:shadow-sm" />
+                <p className="text-[10px] text-ink-muted pl-1">Letters, numbers, underscores only. Min 3 characters.</p>
               </div>
               <div className="space-y-1.5">
                 <Label htmlFor="modal-email" className="text-[11px] font-bold text-[var(--royal)]/40 uppercase tracking-widest pl-1">Email</Label>
-                <Input id="modal-email" type="email" value={email} onChange={(e) => setEmail(e.target.value)} placeholder="e.g. jane@example.com" autoComplete="email" className="h-auto bg-slate-50 border-slate-200 hover:border-[var(--royal)]/30 rounded-2xl px-6 py-3.5 font-semibold text-[14px] text-slate-900 placeholder:text-slate-300 focus-visible:bg-white focus-visible:border-[var(--royal)] focus-visible:ring-0 focus-visible:shadow-sm" />
+                <Input id="modal-email" type="email" value={email} onChange={(e) => setEmail(e.target.value)} placeholder="e.g. jane@example.com" autoComplete="email" className="h-auto bg-[var(--neutral-faint)] border-[var(--neutral-border)] hover:border-[var(--royal)]/30 rounded-2xl px-6 py-3.5 font-semibold text-[14px] text-ink placeholder:text-ink-muted focus-visible:bg-white focus-visible:border-[var(--royal)] focus-visible:ring-0 focus-visible:shadow-sm" />
               </div>
               <div className="space-y-1.5">
                 <Label htmlFor="modal-signup-pw" className="text-[11px] font-bold text-[var(--royal)]/40 uppercase tracking-widest pl-1">Password</Label>
                 <div className="relative">
-                  <Input id="modal-signup-pw" type={showPassword ? "text" : "password"} value={password} onChange={(e) => setPassword(e.target.value)} placeholder="••••••••" autoComplete="new-password" className="h-auto bg-slate-50 border-slate-200 hover:border-[var(--royal)]/30 rounded-2xl px-6 py-3.5 pr-14 font-semibold text-[14px] text-slate-900 placeholder:text-slate-300 focus-visible:bg-white focus-visible:border-[var(--royal)] focus-visible:ring-0 focus-visible:shadow-sm" />
-                  <Button type="button" variant="ghost" size="icon" onClick={() => setShowPassword(!showPassword)} className="absolute right-3 top-1/2 -translate-y-1/2 text-slate-300 hover:text-[var(--royal)] z-10 h-8 w-8">
+                  <Input id="modal-signup-pw" type={showPassword ? "text" : "password"} value={password} onChange={(e) => setPassword(e.target.value)} placeholder="••••••••" autoComplete="new-password" className="h-auto bg-[var(--neutral-faint)] border-[var(--neutral-border)] hover:border-[var(--royal)]/30 rounded-2xl px-6 py-3.5 pr-14 font-semibold text-[14px] text-ink placeholder:text-ink-muted focus-visible:bg-white focus-visible:border-[var(--royal)] focus-visible:ring-0 focus-visible:shadow-sm" />
+                  <Button type="button" variant="ghost" size="icon" aria-label={showPassword ? 'Hide password' : 'Show password'} aria-pressed={showPassword} onClick={() => setShowPassword(!showPassword)} className="absolute right-3 top-1/2 -translate-y-1/2 text-ink-muted hover:text-[var(--royal)] z-10 h-8 w-8">
                     {showPassword ? (
                       <svg viewBox="0 0 24 24" className="w-5 h-5" fill="none" stroke="currentColor" strokeWidth="2.5"><path d="M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24"/><line x1="1" y1="1" x2="23" y2="23"/></svg>
                     ) : (
@@ -878,7 +878,7 @@ function LoginModal({ open, onOpenChange, invite }: { open: boolean; onOpenChang
               <Button type="submit" disabled={isSubmitting} className="w-full bg-[var(--royal)] hover:bg-[var(--royal-blue)] disabled:opacity-60 text-white py-4 h-auto rounded-2xl font-bold text-sm shadow-[0_4px_16px_rgba(19,51,120,0.2)] hover:shadow-[0_12px_32px_rgba(15,82,186,0.3)] transition-all active:scale-95 mt-6">
                 {isSubmitting ? <span className="flex items-center justify-center gap-2"><span className="w-4 h-4 border-2 border-white/30 border-t-white rounded-full animate-spin" />Creating account...</span> : 'Create Account'}
               </Button>
-              <div className="text-center text-xs text-slate-500 pt-2">
+              <div className="text-center text-xs text-ink-muted pt-2">
                 <span>Already have an account? </span>
                 <Button type="button" variant="link" onClick={() => { setMode('signin'); setError(''); }} className="text-[var(--royal)] hover:text-[var(--royal)] font-bold text-xs p-0 h-auto">Sign in</Button>
               </div>
@@ -912,14 +912,14 @@ function LoginModal({ open, onOpenChange, invite }: { open: boolean; onOpenChang
                 }}>
                   <div className="space-y-2">
                     <Label htmlFor="modal-reset-email" className="text-[11px] font-bold text-[var(--royal)]/40 uppercase tracking-widest pl-1">Email Address</Label>
-                    <Input id="modal-reset-email" type="email" value={resetEmail} onChange={(e) => setResetEmail(e.target.value)} placeholder="you@example.com" autoComplete="email" autoFocus required className="h-auto bg-slate-50 border-slate-200 hover:border-[var(--royal)]/30 rounded-2xl px-6 py-4 font-semibold text-[14px] text-slate-900 placeholder:text-slate-300 focus-visible:bg-white focus-visible:border-[var(--royal)] focus-visible:ring-0 focus-visible:shadow-sm" />
+                    <Input id="modal-reset-email" type="email" value={resetEmail} onChange={(e) => setResetEmail(e.target.value)} placeholder="you@example.com" autoComplete="email" autoFocus required className="h-auto bg-[var(--neutral-faint)] border-[var(--neutral-border)] hover:border-[var(--royal)]/30 rounded-2xl px-6 py-4 font-semibold text-[14px] text-ink placeholder:text-ink-muted focus-visible:bg-white focus-visible:border-[var(--royal)] focus-visible:ring-0 focus-visible:shadow-sm" />
                   </div>
                   {error && <div className="text-sm text-red-500 font-medium text-center bg-red-50 p-3 rounded-xl border border-red-100">{error}</div>}
                   <Button type="submit" disabled={isSubmitting || !resetEmail.includes('@')} className="w-full bg-[var(--gold)] hover:bg-[var(--gold)] disabled:opacity-60 text-white py-4 h-auto rounded-2xl font-bold text-sm shadow-[0_4px_16px_rgba(200,169,81,0.2)] hover:shadow-[0_12px_32px_rgba(200,169,81,0.3)] transition-all active:scale-95">
                     {isSubmitting ? <span className="flex items-center justify-center gap-2"><span className="w-4 h-4 border-2 border-white/30 border-t-white rounded-full animate-spin" />Sending...</span> : 'Send Reset Link'}
                   </Button>
                   <div className="text-center text-xs pt-2">
-                    <Button type="button" variant="link" onClick={() => { setMode('signin'); setError(''); }} className="text-slate-500 hover:text-[var(--royal)] font-medium text-xs p-0 h-auto no-underline hover:no-underline">&larr; Back to sign in</Button>
+                    <Button type="button" variant="link" onClick={() => { setMode('signin'); setError(''); }} className="text-ink-muted hover:text-[var(--royal)] font-medium text-xs p-0 h-auto no-underline hover:no-underline">&larr; Back to sign in</Button>
                   </div>
                 </form>
               )}
@@ -933,14 +933,14 @@ function LoginModal({ open, onOpenChange, invite }: { open: boolean; onOpenChang
               </div>
               <div className="space-y-2">
                 <Label htmlFor="modal-mfa" className="text-[11px] font-bold text-[var(--royal)]/40 uppercase tracking-widest pl-1">Authenticator Code</Label>
-                <Input id="modal-mfa" type="text" inputMode="numeric" pattern="[0-9]*" maxLength={6} value={totpCode} onChange={(e) => setTotpCode(e.target.value.replace(/\D/g, '').slice(0, 6))} placeholder="000000" autoComplete="one-time-code" autoFocus className="h-auto bg-slate-50 border-slate-200 hover:border-[var(--royal)]/30 rounded-2xl px-6 py-4 font-mono font-bold text-[24px] text-center text-slate-900 placeholder:text-slate-200 focus-visible:bg-white focus-visible:border-[var(--royal)] focus-visible:ring-0 focus-visible:shadow-sm tracking-[0.5em]" />
+                <Input id="modal-mfa" type="text" inputMode="numeric" pattern="[0-9]*" maxLength={6} value={totpCode} onChange={(e) => setTotpCode(e.target.value.replace(/\D/g, '').slice(0, 6))} placeholder="000000" autoComplete="one-time-code" autoFocus className="h-auto bg-[var(--neutral-faint)] border-[var(--neutral-border)] hover:border-[var(--royal)]/30 rounded-2xl px-6 py-4 font-mono font-bold text-[24px] text-center text-ink placeholder:text-ink-muted focus-visible:bg-white focus-visible:border-[var(--royal)] focus-visible:ring-0 focus-visible:shadow-sm tracking-[0.5em]" />
               </div>
               {error && <div className="text-sm text-red-500 font-medium text-center bg-red-50 p-3 rounded-xl border border-red-100">{error}</div>}
               <Button type="submit" disabled={isSubmitting || totpCode.length !== 6} className="w-full bg-[var(--royal)] hover:bg-[var(--royal-blue)] disabled:opacity-60 text-white py-4 h-auto rounded-2xl font-bold text-sm shadow-[0_4px_16px_rgba(19,51,120,0.2)] hover:shadow-[0_12px_32px_rgba(15,82,186,0.3)] transition-all active:scale-95 mt-8">
                 {isSubmitting ? <span className="flex items-center justify-center gap-2"><span className="w-4 h-4 border-2 border-white/30 border-t-white rounded-full animate-spin" />Verifying...</span> : 'Verify'}
               </Button>
               <div className="text-center text-xs pt-2">
-                <Button type="button" variant="link" onClick={() => { setMode('signin'); setError(''); setTotpCode(''); setMfaResolver(null); }} className="text-slate-500 hover:text-[var(--royal)] font-medium text-xs p-0 h-auto no-underline hover:no-underline">&larr; Back to sign in</Button>
+                <Button type="button" variant="link" onClick={() => { setMode('signin'); setError(''); setTotpCode(''); setMfaResolver(null); }} className="text-ink-muted hover:text-[var(--royal)] font-medium text-xs p-0 h-auto no-underline hover:no-underline">&larr; Back to sign in</Button>
               </div>
             </form>
           ) : null}
@@ -948,7 +948,7 @@ function LoginModal({ open, onOpenChange, invite }: { open: boolean; onOpenChang
 
         {/* Footer */}
         <div className="mt-8 mx-10 px-0 pt-0 pb-10">
-          <Separator className="mb-6 bg-slate-100" />
+          <Separator className="mb-6 bg-[var(--neutral-border)]" />
           <div className="flex items-center justify-center gap-6 w-full">
             <div className="flex items-center gap-2">
               <div className="w-1.5 h-1.5 rounded-full bg-green-400" />
@@ -1060,8 +1060,8 @@ function ScenarioCard({ emoji, title, description, cta, image, openLogin }: { em
         </div>
       </div>
       <CardContent className="p-6 flex flex-col flex-grow">
-        <h3 className="text-slate-900 font-bold text-base mb-2">{title}</h3>
-        <p className="text-slate-600 text-sm leading-relaxed flex-grow mb-4">{description}</p>
+        <h3 className="text-royal font-bold text-base mb-2">{title}</h3>
+        <p className="text-ink-muted text-sm leading-relaxed flex-grow mb-4">{description}</p>
         <Button variant="ghost" onClick={openLogin} className="text-[var(--gold)] text-xs font-bold uppercase tracking-widest p-0 h-auto hover:text-[var(--gold)] hover:bg-transparent self-start">
           {cta} &rarr;
         </Button>
@@ -1080,10 +1080,10 @@ function CapabilityCard({ icon, title, items, accent, image }: { icon: string; t
       </div>
       <CardContent className="p-7 flex flex-col flex-grow">
         <div className="text-3xl mb-3">{icon}</div>
-        <h3 className={`font-bold text-xl mb-4 ${accent ? 'text-[var(--gold)]' : 'text-slate-900'}`}>{title}</h3>
+        <h3 className={`font-bold text-xl mb-4 ${accent ? 'text-[var(--gold)]' : 'text-royal'}`}>{title}</h3>
         <ul className="space-y-3 flex-grow">
           {items.map((item) => (
-            <li key={item} className="flex gap-2.5 text-[15px] text-slate-700 leading-snug">
+            <li key={item} className="flex gap-2.5 text-[15px] text-ink leading-snug">
               <span className="text-[var(--gold)] shrink-0 text-lg">✓</span>
               {item}
             </li>
@@ -1126,14 +1126,14 @@ function FaqItem({ q, a }: { q: string; a: string }) {
     <ScrollReveal delay={0}>
       <button
         onClick={() => setOpen(!open)}
-        className="w-full text-left bg-slate-50 border border-slate-200 rounded-xl px-6 py-5 transition-all hover:bg-slate-100 cursor-pointer"
+        className="w-full text-left bg-[var(--neutral-faint)] border border-[var(--neutral-border)] rounded-xl px-6 py-5 transition-all hover:bg-[var(--neutral-faint)] cursor-pointer"
       >
         <div className="flex items-center justify-between gap-4">
-          <h3 className="text-slate-900 font-bold text-sm">{q}</h3>
+          <h3 className="text-royal font-bold text-sm">{q}</h3>
           <span className={`text-[var(--gold)] text-lg transition-transform ${open ? 'rotate-45' : ''}`}>+</span>
         </div>
         {open && (
-          <p className="text-slate-600 text-sm leading-relaxed mt-3 pr-8">{a}</p>
+          <p className="text-ink-muted text-sm leading-relaxed mt-3 pr-8">{a}</p>
         )}
       </button>
     </ScrollReveal>
diff --git a/web/src/routes/memoir-upload-contract.test.ts b/web/src/routes/memoir-upload-contract.test.ts
new file mode 100644
index 0000000..745e191
--- /dev/null
+++ b/web/src/routes/memoir-upload-contract.test.ts
@@ -0,0 +1,25 @@
+import { describe, it, expect } from 'vitest'
+import { readFileSync } from 'node:fs'
+import { fileURLToPath } from 'node:url'
+import { dirname, join } from 'node:path'
+
+// Contract guard: the memoir video upload must POST to the route the API
+// actually registers — `/api/v1/memoirs/upload-video`
+// (see api/cmd/api/main.go: r.Route("/api/v1/memoirs") … Post("/upload-video")).
+// It previously posted to an unregistered `/api/v1/youtube/upload`, which always
+// 404'd and silently broke the white-glove video-memoir feature.
+describe('memoir video upload contract', () => {
+  const here = dirname(fileURLToPath(import.meta.url))
+  const memoirsSrc = readFileSync(
+    join(here, 'estates.$estateId.memoirs.lazy.tsx'),
+    'utf8'
+  )
+
+  it('posts to the registered /api/v1/memoirs/upload-video route', () => {
+    expect(memoirsSrc).toContain('/api/v1/memoirs/upload-video')
+  })
+
+  it('does not post to the unregistered /api/v1/youtube/upload route', () => {
+    expect(memoirsSrc).not.toContain('/api/v1/youtube/upload')
+  })
+})
diff --git a/web/src/routes/memorial.$memorialId.tsx b/web/src/routes/memorial.$memorialId.tsx
index efa8328..f1eb5be 100644
--- a/web/src/routes/memorial.$memorialId.tsx
+++ b/web/src/routes/memorial.$memorialId.tsx
@@ -72,7 +72,7 @@ function PublicMemorialPage() {
       <div className="min-h-screen flex items-center justify-center bg-gradient-to-b from-[var(--gold-dim)] via-[var(--gold-dim)] to-white">
         <div className="flex flex-col items-center gap-4">
           <div className="w-10 h-10 border-2 border-[var(--gold)]/30 border-t-[var(--gold)] rounded-full animate-spin" />
-          <p className="text-sm text-slate-500/60 font-medium">Loading memorial...</p>
+          <p className="text-sm text-ink-muted/60 font-medium">Loading memorial...</p>
         </div>
       </div>
     )
@@ -85,10 +85,10 @@ function PublicMemorialPage() {
           <div className="w-16 h-16 mx-auto rounded-full bg-[var(--gold)]/10 flex items-center justify-center mb-6">
             <Heart className="w-7 h-7 text-[var(--gold)]/40" />
           </div>
-          <h1 className="text-2xl font-[family-name:var(--font-cinzel)] font-bold text-slate-900 mb-3">
+          <h1 className="text-2xl font-[family-name:var(--font-cinzel)] font-bold text-royal mb-3">
             Memorial Not Found
           </h1>
-          <p className="text-slate-500/60 leading-relaxed">
+          <p className="text-ink-muted/60 leading-relaxed">
             This memorial page may have been removed or the link is no longer valid.
           </p>
         </div>
@@ -130,12 +130,12 @@ function PublicMemorialPage() {
             )}
           </div>
 
-          <h1 className="text-3xl md:text-4xl font-[family-name:var(--font-cinzel)] font-bold text-slate-900 tracking-tight mb-3">
+          <h1 className="text-3xl md:text-4xl font-[family-name:var(--font-cinzel)] font-bold text-royal tracking-tight mb-3">
             {memorial.personName}
           </h1>
 
           {dateSpan && (
-            <p className="text-lg text-slate-500/70 font-light tracking-wide">
+            <p className="text-lg text-ink-muted/70 font-light tracking-wide">
               {dateSpan}
             </p>
           )}
@@ -153,7 +153,7 @@ function PublicMemorialPage() {
             <Card className="rounded-3xl border-0 shadow-[0_4px_24px_rgba(200,169,81,0.08)] bg-white/80 backdrop-blur-sm">
               <CardContent className="p-8 md:p-12">
                 <div
-                  className="text-slate-700 text-[16px] leading-[1.85] font-light prose prose-sm max-w-none"
+                  className="text-ink text-[16px] leading-[1.85] font-light prose prose-sm max-w-none"
                   dangerouslySetInnerHTML={{ __html: sanitizedObituary }}
                 />
               </CardContent>
@@ -166,7 +166,7 @@ function PublicMemorialPage() {
           <section className="mb-16">
             <div className="flex items-center gap-3 mb-6">
               <Calendar className="w-4 h-4 text-[var(--gold)]/50" />
-              <h2 className="text-sm font-bold text-slate-500/50 uppercase tracking-[0.15em]">
+              <h2 className="text-sm font-bold text-ink-muted/50 uppercase tracking-[0.15em]">
                 Service Information
               </h2>
             </div>
@@ -174,29 +174,29 @@ function PublicMemorialPage() {
             <Card className="rounded-3xl border-0 shadow-[0_4px_24px_rgba(200,169,81,0.08)] bg-white/80 backdrop-blur-sm">
               <CardContent className="p-8 md:p-10 space-y-4">
                 {memorial.serviceDetails.type && (
-                  <p className="text-sm font-semibold text-slate-900 uppercase tracking-wide">
+                  <p className="text-sm font-semibold text-ink uppercase tracking-wide">
                     {memorial.serviceDetails.type}
                   </p>
                 )}
                 {memorial.serviceDetails.date && (
-                  <div className="flex items-center gap-3 text-slate-700">
+                  <div className="flex items-center gap-3 text-ink">
                     <Calendar className="w-4 h-4 text-[var(--gold)]/60 flex-shrink-0" />
                     <span className="text-[15px]">{memorial.serviceDetails.date}</span>
                   </div>
                 )}
                 {memorial.serviceDetails.time && (
-                  <div className="flex items-center gap-3 text-slate-700">
+                  <div className="flex items-center gap-3 text-ink">
                     <Clock className="w-4 h-4 text-[var(--gold)]/60 flex-shrink-0" />
                     <span className="text-[15px]">{memorial.serviceDetails.time}</span>
                   </div>
                 )}
                 {memorial.serviceDetails.location && (
-                  <div className="flex items-center gap-3 text-slate-700">
+                  <div className="flex items-center gap-3 text-ink">
                     <MapPin className="w-4 h-4 text-[var(--gold)]/60 flex-shrink-0" />
                     <div>
                       <span className="text-[15px]">{memorial.serviceDetails.location}</span>
                       {memorial.serviceDetails.address && (
-                        <p className="text-sm text-slate-500/60 mt-0.5">{memorial.serviceDetails.address}</p>
+                        <p className="text-sm text-ink-muted/60 mt-0.5">{memorial.serviceDetails.address}</p>
                       )}
                     </div>
                   </div>
@@ -204,7 +204,7 @@ function PublicMemorialPage() {
                 {memorial.serviceDetails.notes && (
                   <>
                     <Separator className="bg-[var(--gold)]/10" />
-                    <p className="text-sm text-slate-700/70 leading-relaxed italic">
+                    <p className="text-sm text-ink/70 leading-relaxed italic">
                       {memorial.serviceDetails.notes}
                     </p>
                   </>
@@ -217,7 +217,7 @@ function PublicMemorialPage() {
         {/* Footer */}
         <section className="text-center pt-8 pb-16">
           <Separator className="bg-[var(--gold)]/10 mb-10" />
-          <p className="text-xs text-slate-500/40 mb-4">
+          <p className="text-xs text-ink-muted/40 mb-4">
             This memorial was created with love using FinalWishes.
           </p>
           <Button
diff --git a/web/src/routes/privacy.tsx b/web/src/routes/privacy.tsx
index b90da93..966b28f 100644
--- a/web/src/routes/privacy.tsx
+++ b/web/src/routes/privacy.tsx
@@ -8,7 +8,7 @@ export const Route = createFileRoute('/privacy')({
 function Section({ title, children }: { title: string; children: React.ReactNode }) {
   return (
     <section className="mb-10">
-      <h2 className="text-xl font-semibold text-slate-900 mb-4 font-[family-name:var(--font-cinzel)]">{title}</h2>
+      <h2 className="text-xl font-semibold text-royal mb-4 font-[family-name:var(--font-cinzel)]">{title}</h2>
       {children}
     </section>
   )
@@ -17,16 +17,16 @@ function Section({ title, children }: { title: string; children: React.ReactNode
 function PrivacyPage() {
   return (
     <div className="min-h-screen bg-white px-6 py-20 max-w-3xl mx-auto font-[family-name:var(--font-inter)]">
-      <h1 className="text-3xl font-bold text-slate-900 mb-4 font-[family-name:var(--font-cinzel)]">Privacy Policy</h1>
-      <p className="text-sm text-slate-500 mb-10">Effective Date: April 17, 2026 &middot; Last Updated: April 17, 2026</p>
+      <h1 className="text-3xl font-bold text-royal mb-4 font-[family-name:var(--font-cinzel)]">Privacy Policy</h1>
+      <p className="text-sm text-ink-muted mb-10">Effective Date: April 17, 2026 &middot; Last Updated: April 17, 2026</p>
 
-      <p className="text-slate-700 leading-relaxed mb-8">
+      <p className="text-ink leading-relaxed mb-8">
         FinalWishes (&ldquo;we,&rdquo; &ldquo;us,&rdquo; or &ldquo;our&rdquo;) is operated by Sirsi Technologies, Inc., a Delaware C-Corporation. This Privacy Policy describes how we collect, use, store, and protect your personal information when you use the FinalWishes platform (&ldquo;Service&rdquo;). By using the Service, you consent to the practices described below.
       </p>
 
       <Section title="1. Information We Collect">
-        <p className="text-slate-700 leading-relaxed mb-3">We collect information in the following categories:</p>
-        <ul className="list-disc pl-6 space-y-2 text-slate-700 leading-relaxed">
+        <p className="text-ink leading-relaxed mb-3">We collect information in the following categories:</p>
+        <ul className="list-disc pl-6 space-y-2 text-ink leading-relaxed">
           <li><strong>Account Information:</strong> Name, email address, phone number, and authentication credentials when you create an account.</li>
           <li><strong>Estate Planning Data:</strong> Asset inventories, beneficiary designations, directive documents, funeral preferences, care instructions, and related estate planning information you voluntarily provide.</li>
           <li><strong>Uploaded Documents:</strong> Wills, trusts, insurance policies, deeds, financial statements, and other files you upload to your vault.</li>
@@ -37,7 +37,7 @@ function PrivacyPage() {
       </Section>
 
       <Section title="2. How We Use Your Information">
-        <ul className="list-disc pl-6 space-y-2 text-slate-700 leading-relaxed">
+        <ul className="list-disc pl-6 space-y-2 text-ink leading-relaxed">
           <li>Provide, maintain, and improve the FinalWishes estate planning platform.</li>
           <li>Process payments and manage your subscription.</li>
           <li>Send transactional communications (account verification, invitation notifications, security alerts).</li>
@@ -48,10 +48,10 @@ function PrivacyPage() {
       </Section>
 
       <Section title="3. Data Security &amp; Encryption">
-        <p className="text-slate-700 leading-relaxed mb-3">
+        <p className="text-ink leading-relaxed mb-3">
           Estate planning data is among the most sensitive information a person can entrust to a platform. We treat security as a foundational requirement, not an afterthought.
         </p>
-        <ul className="list-disc pl-6 space-y-2 text-slate-700 leading-relaxed">
+        <ul className="list-disc pl-6 space-y-2 text-ink leading-relaxed">
           <li><strong>Encryption at Rest:</strong> All personally identifiable information (PII) and estate documents are encrypted using AES-256-GCM envelope encryption via Google Cloud Key Management Service (Cloud KMS). Each estate has its own additional authenticated data (AAD) scope.</li>
           <li><strong>Encryption in Transit:</strong> All data transmitted between your device and our servers is protected by TLS 1.2 or higher.</li>
           <li><strong>Authentication:</strong> Multi-factor authentication (MFA) via TOTP is available and recommended for all accounts. We use Firebase Authentication for identity management.</li>
@@ -61,43 +61,43 @@ function PrivacyPage() {
       </Section>
 
       <Section title="4. Third-Party Services">
-        <p className="text-slate-700 leading-relaxed mb-3">We use the following third-party services to operate the platform:</p>
+        <p className="text-ink leading-relaxed mb-3">We use the following third-party services to operate the platform:</p>
         <div className="overflow-x-auto">
-          <table className="w-full text-sm text-slate-700 border border-slate-200 rounded-lg">
+          <table className="w-full text-sm text-ink border border-[var(--neutral-border)] rounded-lg">
             <thead>
-              <tr className="bg-slate-50">
-                <th className="text-left px-4 py-2 font-semibold border-b border-slate-200">Service</th>
-                <th className="text-left px-4 py-2 font-semibold border-b border-slate-200">Provider</th>
-                <th className="text-left px-4 py-2 font-semibold border-b border-slate-200">Purpose</th>
+              <tr className="bg-[var(--neutral-faint)]">
+                <th className="text-left px-4 py-2 font-semibold border-b border-[var(--neutral-border)]">Service</th>
+                <th className="text-left px-4 py-2 font-semibold border-b border-[var(--neutral-border)]">Provider</th>
+                <th className="text-left px-4 py-2 font-semibold border-b border-[var(--neutral-border)]">Purpose</th>
               </tr>
             </thead>
             <tbody>
-              <tr className="border-b border-slate-100">
+              <tr className="border-b border-[var(--neutral-border)]">
                 <td className="px-4 py-2">Authentication</td>
                 <td className="px-4 py-2">Google (Firebase Auth)</td>
                 <td className="px-4 py-2">User identity &amp; MFA</td>
               </tr>
-              <tr className="border-b border-slate-100">
+              <tr className="border-b border-[var(--neutral-border)]">
                 <td className="px-4 py-2">Payments</td>
                 <td className="px-4 py-2">Stripe, Inc.</td>
                 <td className="px-4 py-2">Subscription billing</td>
               </tr>
-              <tr className="border-b border-slate-100">
+              <tr className="border-b border-[var(--neutral-border)]">
                 <td className="px-4 py-2">Hosting &amp; Storage</td>
                 <td className="px-4 py-2">Google Cloud Platform</td>
                 <td className="px-4 py-2">Application hosting, encrypted file storage</td>
               </tr>
-              <tr className="border-b border-slate-100">
+              <tr className="border-b border-[var(--neutral-border)]">
                 <td className="px-4 py-2">Encryption</td>
                 <td className="px-4 py-2">Google Cloud KMS</td>
                 <td className="px-4 py-2">Key management for PII encryption</td>
               </tr>
-              <tr className="border-b border-slate-100">
+              <tr className="border-b border-[var(--neutral-border)]">
                 <td className="px-4 py-2">E-Signing</td>
                 <td className="px-4 py-2">Sirsi Sign (OpenSign)</td>
                 <td className="px-4 py-2">Document signing ceremonies</td>
               </tr>
-              <tr className="border-b border-slate-100">
+              <tr className="border-b border-[var(--neutral-border)]">
                 <td className="px-4 py-2">AI Engine</td>
                 <td className="px-4 py-2">Anthropic (Claude)</td>
                 <td className="px-4 py-2">Estate completion guidance</td>
@@ -110,13 +110,13 @@ function PrivacyPage() {
             </tbody>
           </table>
         </div>
-        <p className="text-slate-700 leading-relaxed mt-3">
+        <p className="text-ink leading-relaxed mt-3">
           Each third-party provider is bound by their own privacy policies and applicable data protection agreements. We do not sell your personal information to any third party.
         </p>
       </Section>
 
       <Section title="5. Data Retention">
-        <ul className="list-disc pl-6 space-y-2 text-slate-700 leading-relaxed">
+        <ul className="list-disc pl-6 space-y-2 text-ink leading-relaxed">
           <li><strong>Active Accounts:</strong> Your data is retained for as long as your account is active and your subscription is current.</li>
           <li><strong>Account Deletion:</strong> Upon account deletion, your personal data and uploaded documents are permanently deleted within 30 days. Anonymized analytics data may be retained.</li>
           <li><strong>Estate Settlement:</strong> If your account enters estate settlement mode (triggered by an authorized heir or executor), your data is retained for the duration of the settlement process, subject to applicable law.</li>
@@ -125,10 +125,10 @@ function PrivacyPage() {
       </Section>
 
       <Section title="6. Your Rights">
-        <p className="text-slate-700 leading-relaxed mb-3">
+        <p className="text-ink leading-relaxed mb-3">
           Depending on your jurisdiction, you may have the following rights regarding your personal information:
         </p>
-        <ul className="list-disc pl-6 space-y-2 text-slate-700 leading-relaxed">
+        <ul className="list-disc pl-6 space-y-2 text-ink leading-relaxed">
           <li><strong>Access:</strong> Request a copy of the personal information we hold about you.</li>
           <li><strong>Correction:</strong> Request correction of inaccurate or incomplete personal information.</li>
           <li><strong>Deletion:</strong> Request deletion of your personal information, subject to legal retention requirements.</li>
@@ -136,46 +136,46 @@ function PrivacyPage() {
           <li><strong>Opt-Out:</strong> Opt out of non-essential communications at any time via your account settings.</li>
         </ul>
 
-        <h3 className="text-lg font-semibold text-slate-900 mt-6 mb-3">California Residents (CCPA/CPRA)</h3>
-        <p className="text-slate-700 leading-relaxed mb-3">
+        <h3 className="text-lg font-semibold text-royal mt-6 mb-3">California Residents (CCPA/CPRA)</h3>
+        <p className="text-ink leading-relaxed mb-3">
           If you are a California resident, you have additional rights under the California Consumer Privacy Act (CCPA) and the California Privacy Rights Act (CPRA):
         </p>
-        <ul className="list-disc pl-6 space-y-2 text-slate-700 leading-relaxed">
+        <ul className="list-disc pl-6 space-y-2 text-ink leading-relaxed">
           <li>Right to know what personal information is collected, used, shared, or sold.</li>
           <li>Right to delete personal information held by us and by our service providers.</li>
           <li>Right to opt-out of the sale of personal information. <strong>We do not sell personal information.</strong></li>
           <li>Right to non-discrimination for exercising your privacy rights.</li>
         </ul>
 
-        <h3 className="text-lg font-semibold text-slate-900 mt-6 mb-3">Maryland, Illinois &amp; Minnesota Residents</h3>
-        <p className="text-slate-700 leading-relaxed">
+        <h3 className="text-lg font-semibold text-royal mt-6 mb-3">Maryland, Illinois &amp; Minnesota Residents</h3>
+        <p className="text-ink leading-relaxed">
           FinalWishes operates in compliance with applicable state privacy laws in Maryland, Illinois, and Minnesota. Illinois residents should be aware that we do not collect biometric information. If you have questions about your state-specific rights, contact us at the address below.
         </p>
       </Section>
 
       <Section title="7. Cookies &amp; Tracking">
-        <p className="text-slate-700 leading-relaxed">
+        <p className="text-ink leading-relaxed">
           We use essential cookies required for authentication and session management. We do not use third-party advertising cookies or cross-site tracking technologies. Analytics data is collected in aggregate form and does not identify individual users.
         </p>
       </Section>
 
       <Section title="8. Children&rsquo;s Privacy">
-        <p className="text-slate-700 leading-relaxed">
+        <p className="text-ink leading-relaxed">
           FinalWishes is not intended for use by individuals under the age of 18. We do not knowingly collect personal information from minors. If we become aware that a minor has provided us with personal information, we will take steps to delete such information.
         </p>
       </Section>
 
       <Section title="9. Changes to This Policy">
-        <p className="text-slate-700 leading-relaxed">
+        <p className="text-ink leading-relaxed">
           We may update this Privacy Policy from time to time. Material changes will be communicated via email or an in-app notification. Your continued use of the Service after changes are posted constitutes acceptance of the updated policy.
         </p>
       </Section>
 
       <Section title="10. Contact Us">
-        <p className="text-slate-700 leading-relaxed">
+        <p className="text-ink leading-relaxed">
           If you have questions about this Privacy Policy or wish to exercise your privacy rights, contact us at:
         </p>
-        <div className="mt-4 p-4 bg-slate-50 rounded-lg text-slate-700 leading-relaxed">
+        <div className="mt-4 p-4 bg-[var(--neutral-faint)] rounded-lg text-ink leading-relaxed">
           <p className="font-semibold">Sirsi Technologies, Inc.</p>
           <p>Email: <a href="mailto:privacy@sirsi.ai" className="text-[var(--royal)] underline">privacy@sirsi.ai</a></p>
           <p>Web: <a href="https://finalwishes.app" className="text-[var(--royal)] underline">finalwishes.app</a></p>
diff --git a/web/src/routes/terms.tsx b/web/src/routes/terms.tsx
index 22622b7..0c2e458 100644
--- a/web/src/routes/terms.tsx
+++ b/web/src/routes/terms.tsx
@@ -8,7 +8,7 @@ export const Route = createFileRoute('/terms')({
 function Section({ title, children }: { title: string; children: React.ReactNode }) {
   return (
     <section className="mb-10">
-      <h2 className="text-xl font-semibold text-slate-900 mb-4 font-[family-name:var(--font-cinzel)]">{title}</h2>
+      <h2 className="text-xl font-semibold text-royal mb-4 font-[family-name:var(--font-cinzel)]">{title}</h2>
       {children}
     </section>
   )
@@ -17,18 +17,18 @@ function Section({ title, children }: { title: string; children: React.ReactNode
 function TermsPage() {
   return (
     <div className="min-h-screen bg-white px-6 py-20 max-w-3xl mx-auto font-[family-name:var(--font-inter)]">
-      <h1 className="text-3xl font-bold text-slate-900 mb-4 font-[family-name:var(--font-cinzel)]">Terms of Service</h1>
-      <p className="text-sm text-slate-500 mb-10">Effective Date: April 17, 2026 &middot; Last Updated: April 17, 2026</p>
+      <h1 className="text-3xl font-bold text-royal mb-4 font-[family-name:var(--font-cinzel)]">Terms of Service</h1>
+      <p className="text-sm text-ink-muted mb-10">Effective Date: April 17, 2026 &middot; Last Updated: April 17, 2026</p>
 
-      <p className="text-slate-700 leading-relaxed mb-8">
+      <p className="text-ink leading-relaxed mb-8">
         These Terms of Service (&ldquo;Terms&rdquo;) govern your access to and use of the FinalWishes platform (&ldquo;Service&rdquo;), operated by Sirsi Technologies, Inc., a Delaware C-Corporation (&ldquo;Company,&rdquo; &ldquo;we,&rdquo; &ldquo;us,&rdquo; or &ldquo;our&rdquo;). By creating an account or using the Service, you agree to be bound by these Terms. If you do not agree, do not use the Service.
       </p>
 
       <Section title="1. Description of Service">
-        <p className="text-slate-700 leading-relaxed mb-3">
+        <p className="text-ink leading-relaxed mb-3">
           FinalWishes is a digital estate planning and settlement platform that helps individuals organize their assets, documents, beneficiary designations, and end-of-life preferences. The Service includes:
         </p>
-        <ul className="list-disc pl-6 space-y-2 text-slate-700 leading-relaxed">
+        <ul className="list-disc pl-6 space-y-2 text-ink leading-relaxed">
           <li>Secure document storage (the &ldquo;Vault&rdquo;) with AES-256-GCM encryption</li>
           <li>Asset inventory and beneficiary designation management</li>
           <li>Directive creation (ethical wills, funeral preferences, final messages, care instructions)</li>
@@ -41,20 +41,20 @@ function TermsPage() {
 
       <Section title="2. Not Legal Advice">
         <div className="p-4 bg-amber-50 border border-amber-200 rounded-lg mb-4">
-          <p className="text-slate-800 leading-relaxed font-medium">
+          <p className="text-ink leading-relaxed font-medium">
             FinalWishes is not a law firm, financial advisor, tax advisor, or insurance broker. The Service does not provide legal, financial, tax, or insurance advice.
           </p>
         </div>
-        <p className="text-slate-700 leading-relaxed mb-3">
+        <p className="text-ink leading-relaxed mb-3">
           The platform is an organizational and documentation tool. It helps you collect and structure your estate planning information, but it does not replace the professional judgment of a licensed attorney, financial planner, CPA, or other qualified professional.
         </p>
-        <p className="text-slate-700 leading-relaxed">
+        <p className="text-ink leading-relaxed">
           You are solely responsible for ensuring that your estate plan complies with applicable federal, state, and local laws. We strongly recommend consulting with qualified legal counsel, particularly regarding wills, trusts, powers of attorney, and advance healthcare directives.
         </p>
       </Section>
 
       <Section title="3. Account Registration &amp; Security">
-        <ul className="list-disc pl-6 space-y-2 text-slate-700 leading-relaxed">
+        <ul className="list-disc pl-6 space-y-2 text-ink leading-relaxed">
           <li>You must be at least 18 years of age to create an account.</li>
           <li>You must provide accurate and complete information during registration.</li>
           <li>You are responsible for maintaining the confidentiality of your account credentials.</li>
@@ -65,7 +65,7 @@ function TermsPage() {
       </Section>
 
       <Section title="4. Subscription &amp; Payments">
-        <ul className="list-disc pl-6 space-y-2 text-slate-700 leading-relaxed">
+        <ul className="list-disc pl-6 space-y-2 text-ink leading-relaxed">
           <li>FinalWishes offers tiered subscription plans. Features and storage limits vary by tier.</li>
           <li>Payments are processed by Stripe, Inc. By subscribing, you also agree to <a href="https://stripe.com/legal" className="text-[var(--royal)] underline" target="_blank" rel="noopener noreferrer">Stripe&rsquo;s Terms of Service</a>.</li>
           <li>Subscriptions renew automatically unless canceled before the renewal date.</li>
@@ -76,7 +76,7 @@ function TermsPage() {
       </Section>
 
       <Section title="5. Your Content &amp; Data">
-        <ul className="list-disc pl-6 space-y-2 text-slate-700 leading-relaxed">
+        <ul className="list-disc pl-6 space-y-2 text-ink leading-relaxed">
           <li><strong>Ownership:</strong> You retain full ownership of all content you upload or create on the platform, including documents, directives, and asset records.</li>
           <li><strong>License:</strong> You grant us a limited license to store, process, display, and transmit your content solely for the purpose of providing the Service to you.</li>
           <li><strong>Accuracy:</strong> You are responsible for the accuracy and completeness of the information you provide. We do not verify the legal validity of documents you upload or create.</li>
@@ -86,10 +86,10 @@ function TermsPage() {
       </Section>
 
       <Section title="6. Estate Settlement &amp; Heir Access">
-        <p className="text-slate-700 leading-relaxed mb-3">
+        <p className="text-ink leading-relaxed mb-3">
           FinalWishes includes features that allow designated heirs and executors to access estate information under specific conditions:
         </p>
-        <ul className="list-disc pl-6 space-y-2 text-slate-700 leading-relaxed">
+        <ul className="list-disc pl-6 space-y-2 text-ink leading-relaxed">
           <li>Access is granted only to individuals explicitly invited by the estate owner through the platform.</li>
           <li>Heir and executor access levels are controlled by the estate owner and may be modified at any time while the owner&rsquo;s account is active.</li>
           <li>Estate settlement mode may be initiated by an authorized heir or executor upon presentation of required documentation (e.g., death certificate).</li>
@@ -99,10 +99,10 @@ function TermsPage() {
       </Section>
 
       <Section title="7. AI-Assisted Features">
-        <p className="text-slate-700 leading-relaxed mb-3">
+        <p className="text-ink leading-relaxed mb-3">
           The Service includes AI-powered features (the &ldquo;Shepherd&rdquo;) that provide guidance and suggestions:
         </p>
-        <ul className="list-disc pl-6 space-y-2 text-slate-700 leading-relaxed">
+        <ul className="list-disc pl-6 space-y-2 text-ink leading-relaxed">
           <li>AI-generated suggestions are informational only and do not constitute professional advice.</li>
           <li>AI features may use your estate data to provide personalized guidance. This data is processed in accordance with our <a href="/privacy" className="text-[var(--royal)] underline">Privacy Policy</a>.</li>
           <li>AI outputs should be reviewed for accuracy before relying on them for estate planning decisions.</li>
@@ -111,8 +111,8 @@ function TermsPage() {
       </Section>
 
       <Section title="8. Acceptable Use">
-        <p className="text-slate-700 leading-relaxed mb-3">You agree not to:</p>
-        <ul className="list-disc pl-6 space-y-2 text-slate-700 leading-relaxed">
+        <p className="text-ink leading-relaxed mb-3">You agree not to:</p>
+        <ul className="list-disc pl-6 space-y-2 text-ink leading-relaxed">
           <li>Use the Service for any unlawful purpose or in violation of any applicable law.</li>
           <li>Attempt to gain unauthorized access to other users&rsquo; accounts or data.</li>
           <li>Interfere with or disrupt the Service or its infrastructure.</li>
@@ -124,11 +124,11 @@ function TermsPage() {
       </Section>
 
       <Section title="9. Limitation of Liability">
-        <div className="p-4 bg-slate-50 border border-slate-200 rounded-lg">
-          <p className="text-slate-700 leading-relaxed mb-3">
+        <div className="p-4 bg-[var(--neutral-faint)] border border-[var(--neutral-border)] rounded-lg">
+          <p className="text-ink leading-relaxed mb-3">
             TO THE MAXIMUM EXTENT PERMITTED BY APPLICABLE LAW, SIRSI TECHNOLOGIES, INC. AND ITS OFFICERS, DIRECTORS, EMPLOYEES, AND AGENTS SHALL NOT BE LIABLE FOR ANY INDIRECT, INCIDENTAL, SPECIAL, CONSEQUENTIAL, OR PUNITIVE DAMAGES, INCLUDING BUT NOT LIMITED TO:
           </p>
-          <ul className="list-disc pl-6 space-y-2 text-slate-700 leading-relaxed">
+          <ul className="list-disc pl-6 space-y-2 text-ink leading-relaxed">
             <li>Loss of profits, data, or goodwill</li>
             <li>Cost of procurement of substitute services</li>
             <li>Any matter beyond our reasonable control</li>
@@ -136,20 +136,20 @@ function TermsPage() {
             <li>Disputes between estate owners, heirs, executors, or other parties</li>
             <li>Legal insufficiency of documents created or stored on the platform</li>
           </ul>
-          <p className="text-slate-700 leading-relaxed mt-3">
+          <p className="text-ink leading-relaxed mt-3">
             OUR TOTAL AGGREGATE LIABILITY FOR ALL CLAIMS ARISING FROM OR RELATED TO THE SERVICE SHALL NOT EXCEED THE AMOUNT YOU PAID TO US IN THE TWELVE (12) MONTHS PRECEDING THE CLAIM.
           </p>
         </div>
       </Section>
 
       <Section title="10. Indemnification">
-        <p className="text-slate-700 leading-relaxed">
+        <p className="text-ink leading-relaxed">
           You agree to indemnify and hold harmless Sirsi Technologies, Inc. and its officers, directors, employees, and agents from and against any claims, liabilities, damages, losses, and expenses (including reasonable attorneys&rsquo; fees) arising out of or in any way connected with: (a) your access to or use of the Service; (b) your violation of these Terms; (c) your violation of any third-party rights; or (d) disputes arising from your estate planning activities or the content you provide through the Service.
         </p>
       </Section>
 
       <Section title="11. Termination">
-        <ul className="list-disc pl-6 space-y-2 text-slate-700 leading-relaxed">
+        <ul className="list-disc pl-6 space-y-2 text-ink leading-relaxed">
           <li>You may terminate your account at any time through your account settings or by contacting support.</li>
           <li>We may suspend or terminate your account if you violate these Terms or engage in conduct that we reasonably believe is harmful to the Service or other users.</li>
           <li>Upon termination, your data will be handled in accordance with our <a href="/privacy" className="text-[var(--royal)] underline">Privacy Policy</a> (30-day deletion window).</li>
@@ -158,13 +158,13 @@ function TermsPage() {
       </Section>
 
       <Section title="12. Modifications to Terms">
-        <p className="text-slate-700 leading-relaxed">
+        <p className="text-ink leading-relaxed">
           We may modify these Terms at any time. Material changes will be communicated via email or in-app notification at least 30 days before taking effect. Your continued use of the Service after changes become effective constitutes acceptance. If you disagree with modified Terms, you must stop using the Service and delete your account.
         </p>
       </Section>
 
       <Section title="13. Dispute Resolution">
-        <ul className="list-disc pl-6 space-y-2 text-slate-700 leading-relaxed">
+        <ul className="list-disc pl-6 space-y-2 text-ink leading-relaxed">
           <li><strong>Governing Law:</strong> These Terms are governed by the laws of the State of Delaware, without regard to conflict-of-law principles.</li>
           <li><strong>Informal Resolution:</strong> Before filing any formal proceeding, you agree to attempt to resolve disputes informally by contacting <a href="mailto:legal@sirsi.ai" className="text-[var(--royal)] underline">legal@sirsi.ai</a>. We will attempt to resolve the dispute within 30 days.</li>
           <li><strong>Arbitration:</strong> If informal resolution fails, disputes shall be resolved by binding arbitration under the rules of the American Arbitration Association (AAA). Arbitration shall take place in the State of Delaware.</li>
@@ -174,7 +174,7 @@ function TermsPage() {
       </Section>
 
       <Section title="14. General Provisions">
-        <ul className="list-disc pl-6 space-y-2 text-slate-700 leading-relaxed">
+        <ul className="list-disc pl-6 space-y-2 text-ink leading-relaxed">
           <li><strong>Entire Agreement:</strong> These Terms, together with our Privacy Policy, constitute the entire agreement between you and Sirsi Technologies, Inc. regarding the Service.</li>
           <li><strong>Severability:</strong> If any provision of these Terms is found unenforceable, the remaining provisions remain in full force and effect.</li>
           <li><strong>Waiver:</strong> Our failure to enforce any right or provision does not constitute a waiver of that right or provision.</li>
@@ -183,10 +183,10 @@ function TermsPage() {
       </Section>
 
       <Section title="15. Contact Us">
-        <p className="text-slate-700 leading-relaxed">
+        <p className="text-ink leading-relaxed">
           If you have questions about these Terms, contact us at:
         </p>
-        <div className="mt-4 p-4 bg-slate-50 rounded-lg text-slate-700 leading-relaxed">
+        <div className="mt-4 p-4 bg-[var(--neutral-faint)] rounded-lg text-ink leading-relaxed">
           <p className="font-semibold">Sirsi Technologies, Inc.</p>
           <p>Email: <a href="mailto:legal@sirsi.ai" className="text-[var(--royal)] underline">legal@sirsi.ai</a></p>
           <p>Web: <a href="https://finalwishes.app" className="text-[var(--royal)] underline">finalwishes.app</a></p>
diff --git a/web/src/styles/globals.css b/web/src/styles/globals.css
index 6276cf6..33a4361 100644
--- a/web/src/styles/globals.css
+++ b/web/src/styles/globals.css
@@ -22,6 +22,30 @@
   --gold-bright: #D4AF37;
   --gold-dim: #F0E6D2;
 
+  /* Ink — on-brand body/secondary text (replaces grayscale --muted-foreground).
+     Royal-tinted near-black so default + muted text reads as part of the Royal
+     Neo-Deco system instead of generic slate/grey (Rule 27). */
+  --ink: #142848;           /* Primary ink — deep royal-tinted near-black */
+  --ink-muted: #4A5C7A;     /* Muted ink — royal-tinted secondary text */
+
+  /* On-brand neutrals — replace generic slate/grey for borders & faint fills.
+     Royal-tinted so panels read as part of the Royal Neo-Deco system (Rule 27). */
+  --neutral-border: #DCE3EE;   /* hairline borders / axis lines */
+  --neutral-faint: #F4F6FB;    /* faint panel / track fills */
+
+  /* ── Glass Card System (root defaults) ──
+     The luminous glass tokens live per-context in .royal-theme / .dashboard-theme,
+     but we anchor sensible light-mode defaults at :root so .glass-card and the
+     ui/card variant (owned by the design-cards-heirlooms bucket) resolve even
+     outside a themed surface. Themed contexts override these. */
+  --card-bg: #FFFFFF;
+  --card-border: var(--neutral-border);
+  --card-shadow: 0 1px 3px rgba(19, 51, 120, 0.06);
+  --card-shadow-hover: 0 12px 40px rgba(19, 51, 120, 0.12), 0 0 28px rgba(200, 169, 81, 0.22);
+  --card-backdrop: none;
+  /* Reusable gold halo — the Royal Neo-Deco hover/focus glow. */
+  --gold-glow: 0 0 28px rgba(200, 169, 81, 0.30);
+
   /* Semantic */
   --success: #10B981;
   --warning: #F59E0B;
@@ -40,18 +64,22 @@
   --card-foreground: oklch(0.145 0 0);
   --popover: oklch(1 0 0);
   --popover-foreground: oklch(0.145 0 0);
-  --primary: oklch(0.205 0 0);
-  --primary-foreground: oklch(0.985 0 0);
+  /* Brand-wired primitives: default shadcn components are on-brand by
+     construction. --primary = Royal Blue (not near-black), --ring = Gold so
+     focus halos are the Royal Neo-Deco accent, and muted text is royal-tinted
+     ink instead of grayscale grey (Rule 27). */
+  --primary: var(--royal);
+  --primary-foreground: #FFFFFF;
   --secondary: oklch(0.97 0 0);
-  --secondary-foreground: oklch(0.205 0 0);
+  --secondary-foreground: var(--royal);
   --muted: oklch(0.97 0 0);
-  --muted-foreground: oklch(0.556 0 0);
+  --muted-foreground: var(--ink-muted);
   --accent: oklch(0.97 0 0);
-  --accent-foreground: oklch(0.205 0 0);
+  --accent-foreground: var(--royal);
   --destructive: oklch(0.577 0.245 27.325);
   --border: oklch(0.922 0 0);
   --input: oklch(0.922 0 0);
-  --ring: oklch(0.708 0 0);
+  --ring: var(--gold);
   --chart-1: oklch(0.87 0 0);
   --chart-2: oklch(0.556 0 0);
   --chart-3: oklch(0.439 0 0);
@@ -60,12 +88,12 @@
   --radius: 0.625rem;
   --sidebar: oklch(0.985 0 0);
   --sidebar-foreground: oklch(0.145 0 0);
-  --sidebar-primary: oklch(0.205 0 0);
-  --sidebar-primary-foreground: oklch(0.985 0 0);
+  --sidebar-primary: var(--royal);
+  --sidebar-primary-foreground: #FFFFFF;
   --sidebar-accent: oklch(0.97 0 0);
-  --sidebar-accent-foreground: oklch(0.205 0 0);
+  --sidebar-accent-foreground: var(--royal);
   --sidebar-border: oklch(0.922 0 0);
-  --sidebar-ring: oklch(0.708 0 0);
+  --sidebar-ring: var(--gold);
 }
 
 /* ── TailwindCSS v4 Theme Tokens ── */
@@ -76,6 +104,8 @@
   --color-gold: var(--gold);
   --color-gold-bright: var(--gold-bright);
   --color-gold-dim: var(--gold-dim);
+  --color-ink: var(--ink);
+  --color-ink-muted: var(--ink-muted);
   --color-success: var(--success);
   --color-warning: var(--warning);
   --color-danger: var(--danger);
@@ -348,6 +378,18 @@ input::-webkit-contacts-auto-fill-button {
   box-shadow: var(--card-shadow-hover);
 }
 
+/* ── Gold Glow — reusable Royal Neo-Deco halo (cards/heirlooms flagship) ── */
+.gold-glow {
+  box-shadow: var(--gold-glow);
+}
+.gold-glow-hover {
+  transition: box-shadow 0.4s cubic-bezier(0.4, 0, 0.2, 1), border-color 0.4s ease;
+}
+.gold-glow-hover:hover {
+  border-color: rgba(200, 169, 81, 0.6);
+  box-shadow: var(--gold-glow);
+}
+
 /* ── Glass Panel ── */
 .glass-panel {
   background: var(--bg-secondary);
@@ -409,18 +451,18 @@ input::-webkit-contacts-auto-fill-button {
   50% { transform: translateY(-20px) translateX(-10px); }
 }
 
-/* ── Status Pulse ── */
+/* ── Status Pulse — Gold accent (Royal Neo-Deco firewall: never emerald/green) ── */
 @keyframes pulse-status {
-  0%, 100% { opacity: 1; box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.4); }
-  50% { opacity: 0.8; box-shadow: 0 0 0 6px rgba(16, 185, 129, 0); }
+  0%, 100% { opacity: 1; box-shadow: 0 0 0 0 rgba(200, 169, 81, 0.4); }
+  50% { opacity: 0.8; box-shadow: 0 0 0 6px rgba(200, 169, 81, 0); }
 }
 .status-dot {
   width: 6px;
   height: 6px;
-  background: var(--success);
+  background: var(--gold);
   border-radius: 50%;
   animation: pulse-status 2s ease-in-out infinite;
-  box-shadow: 0 0 8px rgba(16, 185, 129, 0.4);
+  box-shadow: 0 0 8px rgba(200, 169, 81, 0.4);
 }
 
 /* ── Reveal Animations ── */
@@ -471,108 +513,6 @@ input::-webkit-contacts-auto-fill-button {
   color: var(--text-primary);
 }
 
-/* ── Industrial Light Panel — Sharp Edge Commercial Utility ── */
-.sirsi-card {
-  background: #FFFFFF;
-  border: 1px solid #E2E8F0;
-  border-radius: 0;
-  padding: 1.25rem;
-  box-shadow: none;
-}
-.sirsi-card:hover {
-  border-color: #CBD5E1;
-}
-
-.sirsi-metric-card {
-  display: flex;
-  flex-direction: column;
-  gap: 0;
-  padding: 1rem;
-  background: #FFFFFF;
-  border-left: 3px solid var(--royal);
-}
-.sirsi-metric-title {
-  font-family: var(--font-inter);
-  font-size: 9px;
-  font-weight: 700;
-  text-transform: uppercase;
-  letter-spacing: 0.15em;
-  color: #64748B;
-  margin-bottom: 0.5rem;
-}
-.sirsi-metric-value {
-  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
-  font-size: 1.75rem;
-  font-weight: 700;
-  color: #0F172A;
-  line-height: 1;
-}
-.sirsi-metric-unit {
-  font-size: 0.65rem;
-  font-weight: 700;
-  color: #94A3B8;
-  margin-left: 0.5rem;
-  text-transform: uppercase;
-}
-.sirsi-metric-trend {
-  font-family: ui-monospace, monospace;
-  font-size: 0.65rem;
-  font-weight: 600;
-  display: flex;
-  align-items: center;
-  gap: 0.25rem;
-  margin-top: 0.75rem;
-  color: #94A3B8;
-}
-
-.sirsi-status-led {
-  width: 6px;
-  height: 6px;
-  border-radius: 0;
-  display: inline-block;
-}
-.sirsi-status-led-emerald { background: #10b981; }
-.sirsi-status-led-amber { background: #f59e0b; }
-.sirsi-status-led-red { background: #ef4444; }
-
-.sirsi-progress-track {
-  height: 6px;
-  width: 100%;
-  background: #F1F5F9;
-  border: 1px solid #E2E8F0;
-  border-radius: 0;
-  overflow: hidden;
-}
-.sirsi-progress-fill {
-  height: 100%;
-  border-radius: 0;
-  transition: width 0.4s cubic-bezier(0.4, 0, 0.2, 1);
-}
-
-.sirsi-table-header {
-  font-family: var(--font-inter);
-  font-size: 9px;
-  font-weight: 700;
-  text-transform: uppercase;
-  letter-spacing: 0.12em;
-  color: #64748B;
-  background: #F8FAFC;
-  border-bottom: 1px solid #E2E8F0;
-  padding: 0.5rem 0.75rem;
-  text-align: left;
-}
-.sirsi-table-row {
-  border-bottom: 1px solid #F1F5F9;
-}
-.sirsi-table-row:hover {
-  background: #F8FAFC;
-}
-.sirsi-table-cell {
-  padding: 0.6rem 0.75rem;
-  font-size: 0.8rem;
-  color: #334155;
-}
-
 .dark {
   --background: oklch(0.145 0 0);
   --foreground: oklch(0.985 0 0);
@@ -580,18 +520,20 @@ input::-webkit-contacts-auto-fill-button {
   --card-foreground: oklch(0.985 0 0);
   --popover: oklch(0.205 0 0);
   --popover-foreground: oklch(0.985 0 0);
-  --primary: oklch(0.922 0 0);
-  --primary-foreground: oklch(0.205 0 0);
+  /* Dark surfaces keep a luminous brand identity: primary buttons stay Royal
+     Bright (legible on dark) and focus rings stay Gold (Rule 27). */
+  --primary: var(--royal-bright);
+  --primary-foreground: #FFFFFF;
   --secondary: oklch(0.269 0 0);
   --secondary-foreground: oklch(0.985 0 0);
   --muted: oklch(0.269 0 0);
-  --muted-foreground: oklch(0.708 0 0);
+  --muted-foreground: oklch(0.78 0 0);
   --accent: oklch(0.269 0 0);
   --accent-foreground: oklch(0.985 0 0);
   --destructive: oklch(0.704 0.191 22.216);
   --border: oklch(1 0 0 / 10%);
   --input: oklch(1 0 0 / 15%);
-  --ring: oklch(0.556 0 0);
+  --ring: var(--gold);
   --chart-1: oklch(0.87 0 0);
   --chart-2: oklch(0.556 0 0);
   --chart-3: oklch(0.439 0 0);
@@ -599,12 +541,12 @@ input::-webkit-contacts-auto-fill-button {
   --chart-5: oklch(0.269 0 0);
   --sidebar: oklch(0.205 0 0);
   --sidebar-foreground: oklch(0.985 0 0);
-  --sidebar-primary: oklch(0.488 0.243 264.376);
-  --sidebar-primary-foreground: oklch(0.985 0 0);
+  --sidebar-primary: var(--royal-bright);
+  --sidebar-primary-foreground: #FFFFFF;
   --sidebar-accent: oklch(0.269 0 0);
   --sidebar-accent-foreground: oklch(0.985 0 0);
   --sidebar-border: oklch(1 0 0 / 10%);
-  --sidebar-ring: oklch(0.556 0 0);
+  --sidebar-ring: var(--gold);
 }
 
 /* ── Directive Template Guidance ── */
diff --git a/web/vite.config.ts b/web/vite.config.ts
index 94abe7a..4d26f30 100644
--- a/web/vite.config.ts
+++ b/web/vite.config.ts
@@ -19,6 +19,40 @@ export default defineConfig({
       plugins: [tailwindcss()],
     },
   },
+  build: {
+    // Vendor code is large and stable; carve it out of the app entry so it
+    // caches independently and the 1.22MB index chunk slims down. Charts,
+    // motion, the editor, and the PDF renderer are heavy and route-scoped —
+    // splitting them keeps them off the eager entry. (probate route is also
+    // .lazy-split so recharts is demand-loaded.)
+    chunkSizeWarningLimit: 900,
+    rollupOptions: {
+      output: {
+        manualChunks(id) {
+          if (!id.includes('node_modules')) return undefined
+          if (/[\\/]node_modules[\\/](react|react-dom|scheduler|react-router|@tanstack[\\/]react-router|@tanstack[\\/]react-query|@tanstack[\\/]router-core|@tanstack[\\/]history)[\\/]/.test(id)) {
+            return 'vendor-react'
+          }
+          if (/[\\/]node_modules[\\/](firebase|@firebase)[\\/]/.test(id)) {
+            return 'vendor-firebase'
+          }
+          if (/[\\/]node_modules[\\/](recharts|d3-[^\\/]+|victory-vendor|internmap)[\\/]/.test(id)) {
+            return 'vendor-charts'
+          }
+          if (/[\\/]node_modules[\\/](framer-motion|motion-dom|motion-utils|@motionone)[\\/]/.test(id)) {
+            return 'vendor-motion'
+          }
+          if (/[\\/]node_modules[\\/](@tiptap|prosemirror-[^\\/]+)[\\/]/.test(id)) {
+            return 'vendor-editor'
+          }
+          if (/[\\/]node_modules[\\/](@react-pdf|pdfjs-dist|fontkit|@swc[\\/]helpers|yoga-layout)[\\/]/.test(id)) {
+            return 'vendor-pdf'
+          }
+          return undefined
+        },
+      },
+    },
+  },
   server: {
     port: 3000,
   },