Develop a role-based frontend app for tracking Microsoft workshops using HTML, CSS, and JavaScript. The app should feature login capabilities, user-specific access based on roles, a workshop workflow tracker with statuses and expiry automation, and backend rate card logic. Details are as follows:

User Login and Role Selection:
Create a login screen that identifies users by email, welcoming them with role options as per their profile:
Roles: Account Management, Engagement Management, and Super (requires password Delphi@123).
Profiles such as Krishna, Muhammad, Pranjal, etc., each with role options.
Profiles and Roles:
<PRESIDIO_ANONYMIZED_EMAIL_ADDRESS> - "Welcome Krishna Arangath"
Roles Available: Account Management, Engagement Management
<PRESIDIO_ANONYMIZED_EMAIL_ADDRESS> - "Welcome Muhammad Tariq"
Roles Available: Account Management, Engagement Management, Super 🔒 (password required: Delphi@123)
<PRESIDIO_ANONYMIZED_EMAIL_ADDRESS> - "Welcome Pranjal Pant"
Roles Available: Account Management, Engagement Management, Super 🔒 (password required: Delphi@123)
<PRESIDIO_ANONYMIZED_EMAIL_ADDRESS> - "Welcome Anmol Singhal"
Roles Available: Account Management, Engagement Management
<PRESIDIO_ANONYMIZED_EMAIL_ADDRESS> - "Welcome Spandana Kamatham"
Roles Available: Account Management, Engagement Management
<PRESIDIO_ANONYMIZED_EMAIL_ADDRESS> - "Welcome Husain Chitalwala"
Roles Available: Account Management, Engagement Management
<PRESIDIO_ANONYMIZED_EMAIL_ADDRESS> - "Welcome Mohammed Affan Shaikh"
Roles Available: Account Management, Engagement Management
<PRESIDIO_ANONYMIZED_EMAIL_ADDRESS> - "Welcome Murad Abushaikha"
Roles Available: Account Management, Engagement Management
<PRESIDIO_ANONYMIZED_EMAIL_ADDRESS> - "Welcome Ankit Bhutani"
Roles Available: Account Management, Engagement Management
<PRESIDIO_ANONYMIZED_EMAIL_ADDRESS> - "Welcome Abdul Haseeb Khan"
Roles Available: Account Management, Engagement Management, Super 🔒 (password required: Delphi@123)
Super Role Access:
Users selecting the "Super" role (Muhammad Tariq, Pranjal Pant, or Abdul Haseeb Khan) must enter the password Delphi@123.
Super Access Permissions: Super users can access and manage all accounts across teams, view all engagements, and monitor pending expirations across teams. Super users have unrestricted visibility and editing capabilities across all teams.
Nomination Modal for Account Managers:
Allow Account Managers to nominate customers, capturing:
Customer Information: Organization name, Point of Contact (name, email, job role).
Identifier Type and Value: Dropdown selection for identifier type (Domain Name, Tenant ID, TPID, Azure Subscription ID, Opportunity ID). Show corresponding hint text and validation:
Domain Name: Format like contoso.com.
Tenant ID/Azure Subscription ID: Validate as UUID format.
TPID: Numeric, 6-10 digits.
Opportunity ID: Must start with a letter.
Additional Identifiers: If “Yes” is selected, a checklist allows for multiple identifiers, each with validation.
Additional Comments: Optional field for additional details.
Submit and Clear buttons: Save submission to the tracker, auto-logging date and time of nomination.
Dashboard and Tracker Views:
Dashboard: A personalized dashboard view, displaying an overview of active nominations, approaching deadlines, recent activities, and filtering options.
Tracker View:
Shows all relevant workshop details in an intuitive layout, with color indicators for status (e.g., Green for on-track, Yellow for upcoming, Red for overdue).
Export tracker data as CSV or Excel.
Role-Specific Permissions and Actions:
Account Managers:
Nominate customers, view personal dashboards, track engagements, and delete nominations (with reasons, stored in a "Trash" view).
CRM-style view of customer details: list of customers, activities, closed engagements.
Engagement Managers:
Check customer eligibility, view dashboards, track engagements, and delete nominations (mirrored in Trash view visible to team).
If permissions allow, switch to Account Management role.
Eligibility checks restricted to Engagement Management role.
Eligibility Check Modal:
Engagement Managers check eligibility by customer ID, marking engagements as eligible based on:
Eligibility Type: Partner Center or CSI (multi-select checklist).
If Partner Center is chosen, a second checklist appears with options: Modern Work and Security, Azure, Business Applications.
Modern Work and Security Details:
When "Modern Work and Security" is selected, dynamically show the following checklist with tickable items (dont show days):
Microsoft Intune Suite Proof of Value: 90 days
Microsoft Sentinel Migrate & Modernize (Large): 260 days
Microsoft Sentinel Migrate & Modernize (Medium): 200 days
Microsoft Sentinel Migration & Modernization (Small): 120 days
Secure Productivity Proof of Value: 90 days
Threat Protection Engagement: 90 days
Windows in the Cloud Assessment - Large: 90 days
Windows in the Cloud Assessment - Small: 90 days
Copilot Deployment & Adoption Accelerator (L): 90 days
Copilot Deployment & Adoption Accelerator (XL): 90 days
Copilot Proof of Value (Small): 90 days
Copilot Proof of Value (Medium): 90 days
Copilot Role-Based Deployment & Adoption Accelerator: 90 days
Copilot Role-Based Vision & Value: 90 days
Copilot Studio Vision & Value: 90 days
Copilot Vision & Value: 90 days
CSP Deployment & Adoption Accelerator for ME3/5: 90 days
For each item selected, an adjacent dropdown appears to choose Eligible or Claimed. If Claimed is selected, an input field appears to enter a Claim ID.
Workshop Status Workflow with Expiry Tracking:
Define engagement statuses, each updating automatically and initiating specific expiration timers as follows:
Nominated: AM identifies and nominates a customer.
Eligible: EM confirms customer eligibility.
Not Eligible: EM determines the customer is not eligible.
Sent for Consent: Consent request email sent.
Customer Consent Received: Consent received, starting POE submission deadline.
Customer Consent Expired: No consent from customer within 30-day window.
Submitted: POE documents submitted.
Approved: Claim approved.
Action Required: Microsoft requests additional info on POE.
Disputed: Partner disputes rejection.
Rejected: Claim rejected.
Not Submitted Expired: POE documentation not submitted in time.
Disputed Expired: No update within 30 days of dispute.
Automated Expiry Tracking and Notifications:
Expiration conditions trigger automatic status updates and notifications:
Customer Claimed: Initiates a 30-day countdown for consent.
Consent Received: Initiates POE submission deadline.
Triggered alerts for expiring or overdue engagements, with visibility for super users and team-specific engagement managers.
Days Remaining Logic:
Customer Claimed: Initiates a 30-day countdown for consent.
Consent Received: Refer to the following timeline for days remaining to expire:
Data Security Engagement: 90 days
Microsoft Intune Suite Proof of Value: 90 days
Microsoft Sentinel Migrate & Modernize (Large): 260 days
Microsoft Sentinel Migrate & Modernize (Medium): 200 days
Microsoft Sentinel Migration & Modernization (Small): 120 days
Secure Productivity Proof of Value: 90 days
Threat Protection Engagement: 90 days
Windows in the Cloud Assessment - Large: 90 days
Windows in the Cloud Assessment - Small: 90 days
Copilot Deployment & Adoption Accelerator (L): 90 days
Copilot Deployment & Adoption Accelerator (XL): 90 days
Copilot Proof of Value (Small): 90 days
Copilot Proof of Value (Medium): 90 days
Copilot Role-Based Deployment & Adoption Accelerator: 90 days
Copilot Role-Based Vision & Value: 90 days
Copilot Studio Vision & Value: 90 days
Copilot Vision & Value: 90 days
CSP Deployment & Adoption Accelerator for ME3/5: 90 days
Tracking Mapped to Delivery:
Engagement Managers should be able to update whether an engagement has been mapped to delivery for their specific concerned account manager. This should be a separate field in the tracker that can be toggled on or off.
Notifications and Responsive UI:
Notifications: Alerts for upcoming expirations and overdue items.
Responsive Design: Optimized for desktops and mobile.
Validation and Cross-functional Views: Super users can see all engagements and pending expirations.
make sure to implement options for -

a. Detailed Engagement History

Activity Log: Detailed log of all actions taken on an engagement, including who made the change and when.
Audit Trail: Comprehensive audit trail for tracking changes and ensuring accountability.
b. Reporting and Analytics

Custom Reports: Generate custom reports based on various metrics and criteria.
Dashboard Analytics: Visual analytics and charts to provide insights into engagement statuses, deadlines, and performance.
c. Integration with External Systems

Data Import/Export: Ability to import data from external sources and export data in various formats (e.g., CSV, Excel, PDF).
d. Customer Relationship Management (CRM) Features

Customer Profiles: Detailed customer profiles with contact information, engagement history, and notes.
Activity Tracking: Track all interactions and activities related to a customer, including calls, emails, and meetings.
Design the app with modular, extensible code and ensure all role-specific features, tracker updates, and expiration criteria are mapped accurately. use ant design ui and smooth animations. we are limited to using notepad (1 file paste only) output the untruncated full code. if you stop midway, i shall ask you to continue where you left off. but dont insert any placeholders or truncate any parts of the code.