PaperTrail AI

Your compliance. On autopilot.

Intelligent document automation for Indian SMEs, CAs, and tax consultants. PaperTrail AI reads your GST invoices, fills your government forms, and keeps your CA in sync — automatically.

Live URLs

• Landing Page: Production URL
• App Showcase: /app
• Waitlist API: /api/waitlist (POST with { "email": "..." })

Project Structure

webapp/
├── src/index.tsx              # Hono server: landing page + API routes
├── ecosystem.config.cjs       # PM2 config
├── papertrail-app/            # React Native + Expo mobile app
│   ├── app/                   # Expo Router screens
│   │   ├── _layout.tsx        # Root navigation (Stack)
│   │   ├── onboarding.tsx     # 3-slide onboarding with SVG illustrations
│   │   ├── auth.tsx           # Login/Signup with floating labels
│   │   ├── upload.tsx         # Document upload + AI field extraction
│   │   ├── autofill.tsx       # Smart form autofill for govt forms
│   │   ├── collaboration.tsx  # CA workspace with iMessage-style threads
│   │   ├── audit.tsx          # Blockchain audit trail with verification
│   │   └── (tabs)/            # Bottom tab navigation
│   │       ├── _layout.tsx    # Tab bar config (icon-only)
│   │       ├── index.tsx      # Home/Dashboard
│   │       ├── documents.tsx  # Document list with filters
│   │       ├── compliance.tsx # Compliance calendar
│   │       └── profile.tsx    # Profile & settings
│   ├── components/            # 7 reusable components
│   │   ├── StatusBadge.tsx    # Processed/Pending/Flagged badges
│   │   ├── DeadlineCard.tsx   # Horizontal scroll deadline cards
│   │   ├── DocumentRow.tsx    # Document list rows
│   │   ├── ComplianceRing.tsx # Animated circular progress ring
│   │   ├── AnomalyBanner.tsx  # Warning/error banner
│   │   ├── BottomSheet.tsx    # Modal bottom sheet
│   │   ├── Buttons.tsx        # PrimaryButton + OutlineButton
│   │   └── FloatingActionButton.tsx
│   ├── store/useAppStore.ts   # Zustand state management
│   ├── constants/colors.ts    # Design system tokens
│   ├── utils/api.ts           # API layer with mock data
│   ├── app.json               # Expo config
│   ├── package.json           # RN dependencies
│   └── tsconfig.json          # TypeScript config
└── public/                    # Static assets

Features

Landing Page (11 Sections)

• Premium dark-mode design (Linear.app aesthetic)
• Floating phone mockup with live dashboard preview
• Animated counter (300M+ hours stat)
• 6 feature cards with hover effects
• 3-step "How It Works" flow
• Live demo preview with field extraction animation
• Pricing toggle (Monthly/Annual) with 3 tiers
• Testimonial cards with glassmorphism
• Email waitlist with API integration
• Fully responsive (375px+), scroll-triggered animations

Mobile App (9 Screens)

1. Onboarding — 3-slide with SVG illustrations, pagination dots, skip
2. Auth — Login/Signup toggle, animated floating labels, Google OAuth
3. Dashboard — Compliance score ring, deadline cards, recent docs, quick actions, FAB
4. Documents — Search, filter chips, stats row, document list
5. Upload — Upload zone, AI processing animation, staggered field extraction, anomaly detection
6. Autofill — Government form list (GST-1, GST-3B, MSME, EPFO, MCA AOC-4, GSTR-9), pre-filled fields
7. Compliance Calendar — Custom month view, color-coded dots, bottom sheet with penalties
8. Collaboration — CA workspace, split view, iMessage bubbles, action chips
9. Audit Trail — Vertical timeline, hash fingerprints, blockchain verification modal

Reusable Components

• StatusBadge — Processed/Pending/Flagged pill badges
• DeadlineCard — Urgency-coded horizontal scroll cards
• DocumentRow — File type icon, name, date, status
• ComplianceRing — Animated SVG circular progress
• AnomalyBanner — Dismissible warning/error/info banners
• BottomSheet — Spring-animated modal sheet
• PrimaryButton / OutlineButton — Full-width pill buttons
• FloatingActionButton — Animated scale-on-press FAB

Design System

Token	Value
Background	#FFFFFF
Text Primary	#1A1A1A
Accent (Ink Blue)	#0A2540
Surface	#F5F5F7
Border	rgba(0,0,0,0.06)
Success	#22C55E
Warning	#F59E0B
Error	#EF4444
Radius (cards)	16px
Radius (pills)	50px
Shadow	0 2px 12px rgba(0,0,0,0.06)

Tech Stack

Landing Page

• Hono framework on Cloudflare Workers
• Pure HTML + CSS + Vanilla JS (single inline file)
• DM Sans + JetBrains Mono from Google Fonts
• CSS Intersection Observer animations
• Zero external dependencies

Mobile App

• React Native 0.73 + Expo SDK 50
• Expo Router v3 (file-based routing)
• Zustand for state management
• React Native Reanimated 3
• React Native SVG
• TypeScript

Running Locally

Landing Page

cd webapp
npm run build
npm run dev:sandbox

Mobile App

cd webapp/papertrail-app
npm install
npx expo start

Deployment

• Platform: Cloudflare Pages
• Tech: Hono + Vite + Wrangler
• Status: Active
• Last Updated: 2026-06-09