); } // ═══════════════════════════════════════════════════════════════════════════════ // ANIMATION 1: LexiDraft — Discovery Production // Story: Chaotic uploads → AI classifies → Attorney reviews → Clean production packet // ═══════════════════════════════════════════════════════════════════════════════ function LexiDraftAnimation() { const { useTime, Sprite, Stage, interpolate, Easing } = window; const t = useTime(); const DURATION = 22; // Scene 1: 0–5s — Chaotic uploads arriving // Scene 2: 5–11s — AI classification in progress // Scene 3: 11–16s — Attorney privilege review // Scene 4: 16–22s — Final production packet const docs = [ { name: 'Bank_Statement_Jan.pdf', cat: 'Financial Records', conf: 97, bates: 'SMITH_0001', status: 'produced' }, { name: 'Tax_Return_2024.pdf', cat: 'Financial Records', conf: 94, bates: 'SMITH_0002', status: 'produced' }, { name: 'Email_Thread_Mar2025.pdf', cat: 'Communications', conf: 81, bates: 'SMITH_0003', status: 'review' }, { name: 'Paycheck_Stub_Q1.pdf', cat: 'Employment Records', conf: 96, bates: 'SMITH_0004', status: 'produced' }, { name: 'Attorney_Notes_Privileged.pdf', cat: 'Privileged — Withheld', conf: 99, bates: '—', status: 'privilege' }, { name: 'Property_Appraisal_2025.pdf', cat: 'Real Property', conf: 91, bates: 'SMITH_0005', status: 'produced' }, ]; const statusColor = { produced: C.greenText, review: C.amberText, privilege: C.purpleText }; const statusBg = { produced: C.greenBg, review: C.amberBg, privilege: C.purpleBg }; const statusLabel = { produced: 'Produced', review: 'Review', privilege: 'Privilege' }; // Upload animation const uploadFiles = ['chaos_emails.zip', 'scans_mixed.pdf', 'photos_20imgs.zip', 'bank_stmts.pdf', 'misc_docs.docx']; return ( {/* ── SCENE 1: Upload chaos (0–5s) ── */}

Step 1 — Client Upload

Documents arrive in any order,
any format.

{uploadFiles.map((f, i) => (

{f}

))}

47 documents — 14 file types — uploaded via secure link

{/* ── SCENE 2: AI Classification (5–11s) ── */}

{/* Left panel — incoming docs */}

Documents

{docs.map((d, i) => { const rowT = fadeT(t, 5.3 + i * 0.35, 0.45); return (

{d.name}

); })}

{/* Right panel — classification results */}

Step 2 — AI Classification

Each document mapped to your RFP categories.

{/* Classification rows */}

{docs.map((d, i) => { const rowT = fadeT(t, 5.8 + i * 0.4, 0.4); const confColor = d.conf >= 90 ? C.greenText : C.amberText; return (

{d.name} {d.cat} {d.conf}% {statusLabel[d.status]}

); })}

{/* Processing indicator */}

Classification progress {Math.min(100, Math.round((t - 5.5) / 5 * 100))}%

{/* ── SCENE 3: Privilege Review (11–16s) ── */}

Step 3 — Attorney Privilege Review

Attorney sign-off required before production.

{/* Privilege queue */}

{/* Left: flagged items */}

Privilege Queue

{[ { name: 'Attorney_Notes_Privileged.pdf', flag: 'Attorney-client comm.', decision: 'withheld' }, { name: 'Email_Thread_Mar2025.pdf', flag: 'Possible work product', decision: 'review' }, ].map((item, i) => { const show = fadeT(t, 11.4 + i * 0.5, 0.4); const decided = t > 13.5 + i * 0.7; return (

{item.name}

Flag: {item.flag}

{decided && ( {item.decision === 'withheld' ? 'Withheld' : 'Produced'} )}

{!decided && (

Withhold

Produce

)}

); })}

{/* Right: attorney approval gate */}

Production Gate

{[ { label: '44 documents', sub: 'Approved for production', done: true }, { label: '1 document', sub: 'Withheld — privilege', done: t > 13.5 }, { label: '1 document', sub: 'Produced after review', done: t > 14.2 }, ].map((item, i) => (

{item.label}

{item.sub}

))}

BATES RANGE

SMITH_0001–SMITH_0045

{/* ── SCENE 4: Final Package (16–22s) ── */}

Step 4 — Production Package

Court-ready. Bates-stamped. Reviewed.

{[ { icon: '📄', label: 'Bates-Stamped Documents', detail: 'SMITH_0001–SMITH_0045', color: C.blue300, delay: 16.4 }, { icon: '📋', label: 'Production Index', detail: '45 entries, organized by RFP', color: C.teal400, delay: 16.7 }, { icon: '🛡', label: 'Privilege Log', detail: '1 entry — attorney withheld', color: C.purpleText, delay: 17.0 }, { icon: '📝', label: 'Draft Response to RFP', detail: 'Ready for attorney edits', color: C.amberText, delay: 17.3 }, ].map((item, i) => { const cardT = fadeT(t, item.delay, 0.5); return (

{item.label}

{item.detail}

); })}

Production complete — attorney-approved

SMITH_0001–SMITH_0045

{/* Scene labels */}

{t < 5 ? 'Scene 1 — Client Upload' : t < 11 ? 'Scene 2 — AI Classification' : t < 16 ? 'Scene 3 — Privilege Review' : 'Scene 4 — Production Package'}

); } // ═══════════════════════════════════════════════════════════════════════════════ // ANIMATION 2: AI Revenue Recovery // Story: Aging invoice → automated follow-up sequence → payment link → collected // ═══════════════════════════════════════════════════════════════════════════════ function RevenueRecoveryAnimation() { const { useTime, Sprite, Stage } = window; const t = useTime(); const DURATION = 20; const invoices = [ { client: 'Martinez, D.', matter: 'Martinez Dissolution', amount: '$4,250', age: '67 days', status: 'overdue' }, { client: 'Chen, R.', matter: 'Chen Custody Mod.', amount: '$1,875', age: '45 days', status: 'overdue' }, { client: 'Patel, S.', matter: 'Patel Property Div.', amount: '$6,100', age: '31 days', status: 'overdue' }, ]; const messages = [ { day: 'Day 1', type: 'email', subject: 'Invoice Reminder — Martinez Dissolution', preview: 'A balance of $4,250 remains outstanding on your account. A payment link is included below for your convenience.', time: '9:02 AM' }, { day: 'Day 7', type: 'text', subject: 'SMS Follow-up sent', preview: 'Hi David, this is a reminder from [Firm]. Your invoice of $4,250 is past due. Pay securely: [link]', time: '10:15 AM' }, { day: 'Day 14', type: 'email', subject: 'Second Notice — Action Required', preview: 'Your account balance remains unpaid. Please contact the office or use the secure payment link to resolve the balance.', time: '9:00 AM' }, ]; return ( {/* ── SCENE 1: AR Dashboard showing overdue (0–6s) ── */}

AI Revenue Recovery

Outstanding receivables — 3 matters

{/* Stat row */}

{[ { label: 'Total Outstanding', val: '$12,225', color: C.amberText }, { label: 'Avg. Days Overdue', val: '47 days', color: C.red }, { label: 'Matters Affected', val: '3', color: C.white }, ].map((s, i) => (

{s.label}

{s.val}

))}

{/* Invoice table */}

{['Client', 'Matter', 'Amount', 'Age', 'Status'].map(h => (

{h}

))}

{invoices.map((inv, i) => (

{inv.client}

{inv.matter}

{inv.amount}

{inv.age}

Overdue

))}

{/* ── SCENE 2: Automated outreach sequence (6–13s) ── */}

{/* Left: sequence timeline */}

Automated Sequence

Martinez, D. — $4,250
Triggered on 30-day mark

{messages.map((msg, i) => { const show = fadeT(t, 6.5 + i * 1.2, 0.4); const active = t > 6.5 + i * 1.2 && t < 6.5 + (i + 1) * 1.2; return (

{msg.day} {msg.type === 'email' ? 'Email' : 'SMS'}

{i < 2 &&

}

); })}

All messages reviewed and approved by attorney before sending.

{/* Right: message preview */}

Step 2 — Compliant Follow-up

Each message includes a secure payment link.

{messages.map((msg, i) => { const show = fadeT(t, 6.8 + i * 1.2, 0.5); return (

{msg.subject}

{msg.time}

{msg.preview}

Secure payment link

); })}

{/* ── SCENE 3: Payment received (13–20s) ── */}

Result — Payment Collected

$4,250 collected. No collection calls.

{[ { label: 'Payment received', val: '$4,250.00', detail: 'Martinez, D.', color: C.greenText, delay: 13.5 }, { label: 'Days to collect', val: '9 days', detail: 'vs. 47-day avg', color: C.blue300, delay: 13.8 }, { label: 'Staff time spent', val: '0 calls', detail: 'Fully automated', color: C.teal400, delay: 14.1 }, ].map((item, i) => { const cardT = fadeT(t, item.delay, 0.5); return (

{item.label}

{item.val}

{item.detail}

); })}

Remaining 2 matters — sequences active

Chen, R. and Patel, S. follow-up messages scheduled. No staff action required.

{t < 6 ? 'AR Dashboard — Overdue Matters' : t < 13 ? 'Automated Follow-up Sequence' : 'Payment Collected'}

); } // ═══════════════════════════════════════════════════════════════════════════════ // ANIMATION 3: AI Intake System // Story: Prospect calls at 10pm → bot captures → structured lead in attorney inbox // ═══════════════════════════════════════════════════════════════════════════════ function IntakeSystemAnimation() { const { useTime, Sprite, Stage } = window; const t = useTime(); const DURATION = 20; const conversation = [ { from: 'bot', text: 'Thank you for reaching out. I can help get your information to the right attorney. Are you seeking representation for yourself?', time: '10:07 PM' }, { from: 'user', text: 'Yes, it\'s about a divorce. We have two kids.', time: '10:08 PM' }, { from: 'bot', text: 'Understood. To help us prepare for your consultation, could you share your spouse\'s approximate income and whether you have a prenuptial agreement?', time: '10:08 PM' }, { from: 'user', text: 'He makes around $120k. No prenup.', time: '10:09 PM' }, { from: 'bot', text: 'Got it. The next available consultation is Thursday at 2 PM or Friday at 10 AM. Which works better for you?', time: '10:09 PM' }, ]; return ( {/* ── SCENE 1: After-hours call (0–5s) ── */}

AI Intake System

10:07 PM — Prospect contacts the firm.

The office is closed. No staff is available.

Call — Missed

→

Web Chat — Active

{/* ── SCENE 2: Conversation (5–14s) ── */}

Step 2 — Structured Intake Conversation

Every question asked. Every answer captured.

{conversation.map((msg, i) => { const show = fadeT(t, 5.5 + i * 1.5, 0.4); const isBot = msg.from === 'bot'; return (

{msg.text}

{isBot ? 'REVCO Intake' : 'Prospect'} · {msg.time}

); })}

{/* Right: captured data */}

Captured Data

{[ { label: 'Matter Type', val: 'Divorce', delay: 7.2 }, { label: 'Children', val: '2 minor children', delay: 8.7 }, { label: 'Spouse Income', val: '~$120,000/yr', delay: 10.2 }, { label: 'Prenup', val: 'None', delay: 10.8 }, { label: 'Consultation', val: 'Thursday 2 PM', delay: 13.0 }, ].map((field, i) => { const show = fadeT(t, field.delay, 0.4); return (

{field.label}

{field.val}

); })}

{/* ── SCENE 3: Structured lead in attorney inbox (14–20s) ── */}

Result — Attorney Inbox, 8:00 AM

Structured intake ready for consultation.

New Intake — Consultation Thursday 2 PM

Captured: Last night 10:07–10:12 PM · Web chat

Consultation Booked

{[ { label: 'Matter Type', val: 'Divorce — contested' }, { label: 'Minor Children', val: '2' }, { label: 'Approx. Assets', val: 'Home, retirement accts' }, { label: 'Spouse Income', val: '~$120,000 / yr' }, { label: 'Prenup', val: 'None' }, { label: 'Urgency', val: 'Not immediate' }, ].map((f, i) => { const show = fadeT(t, 14.8 + i * 0.2, 0.35); return (

{f.label}

{f.val}

); })}

Transcript, contact details, and consultation confirmation delivered to attorney — before the office opened.

{t < 5 ? 'After-hours contact' : t < 14 ? 'Structured intake conversation' : 'Structured lead delivered'}

); } // ═══════════════════════════════════════════════════════════════════════════════ // ANIMATION 4: AI Client Status Assistant // Story: Client texts "what's happening?" → system checks attorney-approved response library → structured update sent // ═══════════════════════════════════════════════════════════════════════════════ function ClientStatusAnimation() { const { useTime, Sprite, Stage } = window; const t = useTime(); const DURATION = 18; return ( {/* ── SCENE 1: Client message arrives (0–5s) ── */}

AI Client Status Assistant

Client sends a routine status question.

{/* SMS thread */}

Today, 2:34 PM

Hi, I haven't heard anything in 3 weeks. Is there any update on my case? When is my next hearing?

Client: Martinez, D. · 2:34 PM

Routing to AI Client Status Assistant...

{/* ── SCENE 2: System checks approved library + composes response (5–12s) ── */}

Step 2 — Checking Matter Record

System queries the case record against attorney-approved response guardrails.

{[ { check: 'Client identity verified', val: 'Martinez, D. — Matter #2024-1182', done: t > 5.6 }, { check: 'Hearing date on record', val: 'Next hearing: June 12, 2026 @ 9:00 AM', done: t > 6.4 }, { check: 'Last communication', val: 'Attorney note filed April 28, 2026', done: t > 7.2 }, { check: 'Response template', val: 'Status Update — No sensitive content', done: t > 8.0 }, { check: 'Attorney guardrail check', val: 'No restricted topics detected', done: t > 8.8 }, ].map((item, i) => (

5.4 + i * 0.6 ? 1 : 0.3, transition: 'opacity 0.4s', }}>

{item.check}

{item.val}

))}

Guardrail Status

{[ { label: 'Legal advice', status: 'blocked', color: C.purpleText, bg: C.purpleBg }, { label: 'Settlement terms', status: 'blocked', color: C.purpleText, bg: C.purpleBg }, { label: 'Strategy discussion', status: 'blocked', color: C.purpleText, bg: C.purpleBg }, { label: 'Hearing dates', status: 'allowed', color: C.greenText, bg: C.greenBg }, { label: 'Office contact info', status: 'allowed', color: C.greenText, bg: C.greenBg }, ].map((g, i) => (

7 + i * 0.3 ? 1 : 0.2, transition: 'opacity 0.4s' }}> {g.label} {g.status}

))}

{/* ── SCENE 3: Response sent (12–18s) ── */}

Result — Response Sent

Client received an accurate, guardrail-compliant update.

{/* SMS preview */}

Today, 2:35 PM

Hi, I haven't heard anything in 3 weeks. Is there any update on my case?

Hi David — your next hearing is scheduled for June 12, 2026 at 9:00 AM. Your attorney filed a status note on April 28. For anything beyond scheduling, please call the office at (512) 555-0110.

REVCO Client Status Assistant · 2:35 PM

{/* Right: what didn't happen */}

What wasn't required

{[ 'Attorney interrupted', 'Staff callback scheduled', 'Paralegal pulled file', 'Voicemail left for client', ].map((item, i) => (

13 + i * 0.3 ? 1 : 0, transition: 'opacity 0.4s' }}> {item}

))}

{t < 5 ? 'Client message arrives' : t < 12 ? 'System checks approved guardrails' : 'Compliant response sent'}

); } // ═══════════════════════════════════════════════════════════════════════════════ // ANIMATION 5: Case Intelligence Assistant // Story: Raw case file → AI structures timeline + summary → attorney-ready brief // ═══════════════════════════════════════════════════════════════════════════════ function CaseIntelligenceAnimation() { const { useTime, Sprite, Stage } = window; const t = useTime(); const DURATION = 20; const events = [ { date: 'Jan 14, 2023', label: 'Marriage', type: 'milestone' }, { date: 'Mar 2, 2024', label: 'Separation — parties stopped residing together', type: 'event' }, { date: 'Jul 19, 2024', label: 'Divorce petition filed — Travis County District Court', type: 'filing' }, { date: 'Oct 8, 2024', label: 'Temporary orders hearing — custody arrangement set', type: 'hearing' }, { date: 'Feb 3, 2025', label: 'Discovery served — Respondent\'s RFP No. 1', type: 'discovery' }, { date: 'Jun 12, 2026', label: 'Next scheduled hearing', type: 'upcoming' }, ]; const typeColor = { milestone: C.teal400, event: C.blue300, filing: C.amberText, hearing: C.purpleText, discovery: C.blue400, upcoming: C.greenText }; const typeBg = { milestone: 'rgba(18,160,156,0.15)', event: 'rgba(77,154,245,0.12)', filing: C.amberBg, hearing: C.purpleBg, discovery: 'rgba(29,108,216,0.15)', upcoming: C.greenBg }; return ( {/* ── SCENE 1: Raw case file (0–5s) ── */}

Case Intelligence Assistant

A 3-year matter. Hundreds of documents. No structured summary.

{['Petition_July2024.pdf', 'TempOrders_Oct2024.pdf', 'RFP_Feb2025.pdf', 'Financial_Disclosures.pdf', 'Email_Correspondence_x47.pdf', 'Property_Appraisal.pdf', 'Custody_Eval_Report.pdf', 'Depo_Transcript.pdf'].map((f, i) => (

{f}

))}

{/* ── SCENE 2: AI structures timeline (5–13s) ── */}

Step 2 — Building Matter Timeline

Events extracted and ordered chronologically.

{events.map((ev, i) => { const show = fadeT(t, 5.5 + i * 0.9, 0.45); return (

{ev.date}

{ev.label}

{ev.type}

); })}

Extracting from {Math.min(8, Math.floor((t - 5) / 1))} of 8 documents...

{/* ── SCENE 3: Attorney-ready brief (13–20s) ── */}

Result — Matter Intelligence Brief

Attorney review — prepared, not produced.

Martinez Dissolution — Matter Summary

{[ { label: 'Filing date', val: 'July 19, 2024 — Travis County' }, { label: 'Separation date', val: 'March 2, 2024' }, { label: 'Minor children', val: '2 — temporary custody order in place' }, { label: 'Discovery status', val: 'RFP No. 1 served Feb 2025. Production pending.' }, { label: 'Next hearing', val: 'June 12, 2026 — status conference' }, { label: 'Open items', val: '3 — financial disclosure gaps identified' }, ].map((f, i) => { const show = fadeT(t, 13.7 + i * 0.3, 0.35); return (

{f.label}

{f.val}

); })}

Attorney Controls

{[ 'Export to PDF', 'Add to case file', 'Flag discrepancy', 'Request update', ].map((action, i) => (

15 + i * 0.4 ? 1 : 0, transition: 'opacity 0.4s', cursor: 'pointer', }}> {action}

))}

16.5 ? 1 : 0, transition: 'opacity 0.4s' }}>

Open items flagged

3 financial disclosure gaps need resolution before next hearing.

{t < 5 ? 'Raw matter documents' : t < 13 ? 'AI builds matter timeline' : 'Attorney-ready brief'}

); } // ═══════════════════════════════════════════════════════════════════════════════ // Export all animations to window // ═══════════════════════════════════════════════════════════════════════════════ Object.assign(window, { LexiDraftAnimation, RevenueRecoveryAnimation, IntakeSystemAnimation, ClientStatusAnimation, CaseIntelligenceAnimation, });