## Overview Build a secure, multi-tenant B2B customer portal for Pioneer Innovation with distinct Admin and Customer user experiences. Admins have full control over portal customization, while customers access only their organization's data, manage team invites, and operate with role-based permissions. ## Branding & Theme - Header Font: Aileron Bold (fallback: Montserrat SemiBold; allow custom upload) - Body Font: Aileron Regular (fallback: Montserrat Regular) - Body Color: #3e1c55 - Header Color: #94278d - Background: #fcf7ea - Buttons: Fill #94278d, label #FFFFFF, medium radius, subtle shadow - Consistent focus states, accessible contrast (WCAG AA+) ## Users/Roles - Internal Admins (Pioneer staff) - Customer Users (per org): Customer Admin, Editor, Viewer - Invitation: Customer Admins invite users within their org, assign roles on invite - Permissions: - Viewer: read-only - Editor: create/upload docs, update allowed fields - Customer Admin: Editor+manage invites/roles/company profile - Internal Admin: full system access ## Navigation (Dashboard) 1. R&D Projects 2. Open Orders 3. Billing 4. Document Center 5. Quality - Add global search, filters, org scoping, unread badges ## Header "Bento" Cards - R&D Project Kick Off (intake form) - Place an Order (upload PO) - Launch Lab Membership (URL) - Shop Private Label (URL) - Shop Ready 2 Launch (URL) - Ask Ruby (Wiki/FAQ) ## Integrations - Airtable (primary DB) - Stripe (invoices/payments) - HubSpot (activity logging) - ClickUp (tasks) - WordPress (content/KB) - Fishbowl ERP (orders/inventory) - MAKE, Zapier - Prefer native integrations; else Make/Zapier/webhooks - Use org_id/external_id for sync ## Pages/Components 1. Login/Onboarding wizard 2. Dashboard: nav + Bento cards + KPIs 3. R&D Projects: Kanban, table, detail drawer 4. Open Orders: table, details 5. Billing: invoices, receipts, Stripe link 6. Document Center: contracts, quotes, expiration tags 7. Quality: reports, event kickoff 8. Ask Ruby: wiki/FAQ 9. Launch Lab Resource Center (URL) 10. Admin Console: branding, content editor, workflow rules, integrations, permissions manager ## Automations & Workflows - R&D Project Kick Off → Airtable, ClickUp, HubSpot, email - Place Order → Orders, Fishbowl, HubSpot, status sync - Document expiration → nightly tags, email reminders - Quality Event → Quality_Tickets, ClickUp, Slack/email - Membership gating via WordPress ## Security - Enforce org scoping on all views - File access: org users only, signed URLs - Audit log - GDPR/CCPA: export/delete endpoints ## UX Details - Mobile responsive - Sticky/collapsible nav - Empty states with "Add" CTAs - Inline toasts - Global search ## Acceptance Criteria - Admin can customize branding/content/workflow - Customer Admin: invite/role mgmt - Org-filtered data in all sections - Document Center: correct tags/sorting - Bento actions trigger integrations - "Ask Ruby" search, org/public scope