System/Context:

I want to build a functional React prototype for a white-label digital estate vault. Estate firms embed this into their service to manage clients' digital assets (passwords, crypto, docs) and securely release them to beneficiaries upon verified death.

Design System & Aesthetic (CRITICAL):

The app MUST use a strict "Editorial/Print" aesthetic. Ignore modern UI conventions (no rounded corners out of the box, no drop shadows, no soft gray backgrounds).

• Colors: Use a custom theme of "Paper" (Background: #f9f7f2) and "Ink" (Text/Borders: #1a1a1a).
• Typography: Import Google Fonts Playfair Display (Serif, heavily used for large headings, names, and numbers, often italicized) and Inter (Sans-serif, heavily used for tiny, uppercase, ultra-spaced UI labels).
• Structure: Rely entirely on hard borders (border-[#1a1a1a]), flexbox, and grid lines to separate content, similar to a newspaper layout.
• Accents: Use CSS writing-mode: vertical-rl; transform: rotate(180deg); for vertical navigational accents on the extreme left and right edges.

Data Architecture (Mock Data):

Initialize the app with this mock data state:

1. Clients: Array of objects ({ id, name, email, status: 'onboarding'|'active'|'review_due'|'deceased', vaultProgress: 0-100, lastReview }). Include at least one client in each status state.
2. Assets: Array of objects ({ id, category: 'password'|'crypto'|'document'|'subscription', title, details, beneficiaries: [array of ids] }).
3. Beneficiaries: Array of objects ({ id, name, email, relationship }).

Core Application Architecture:

Create a top-level App component that holds a "Demo Perspective Switcher" at the very top of the screen (a dark bar prompting the user to toggle between "Firm Dashboard" view and "Client Vault" view).

View 1: Firm Dashboard

This is the estate manager's view.

• Layout: A left narrow sidebar (with vertical text "FIRM DASHBOARD" and 3 dots as a decorative element). The main area contains a massive serif header ("Smith & Co. Estate Partners").
• Stats Bar: A 3-column grid separated by hard right borders showing "Active Book" (count), "Secured Vaults" (count), and "Reviews Pending" (count in red).
• Roster Table: Do not use standard HTML tables. Use CSS Grid for the rows. Columns should be: Client (Name + Email), Status (use distinct sharp-edged badges like dotted border for deceased, filled black for active, red text for review), Vault Progress (percentage number + a thin black line representing a progress bar), Last Review Date, and Actions.