Angular

Create a new Angular 20 application (standalone components, routing, SCSS) and connect it to Firebase with AngularFire: Auth, Firestore, Storage, and Cloud Functions, with environment files for the config. Then create a CLAUDE.md with these project conventions and follow them in all code you write: standalone components only (never set standalone: true explicitly), signals for state and computed() for derived state, ChangeDetectionStrategy.OnPush on every component, inject() instead of constructor injection, input()/output() functions instead of decorators, native control flow (@if/@for/@switch), reactive forms, no ngClass/ngStyle (use class/style bindings), services with providedIn: 'root'.

App shell

Build an app shell: a top bar with the app name and a placeholder user menu, a router outlet, and a light/dark theme implemented as CSS custom properties on :root with a ThemeService that toggles a data-theme attribute and persists the choice in localStorage. Add a simple /login page and a route guard skeleton. Verify the app builds and runs.

Authentication

Implement authentication and workspaces. Auth: email/password and Google sign-in on /login, plus a helper ensureSignedIn() that signs a visitor in anonymously with Firebase anonymous auth when no user exists (public share links will use this later). Create an AuthService exposing the current user and an activeWorkspaceId as reactive state.

Data layer

Data: a workspaces collection { id, name, ownerId, createdAt } and a members subcollection or memberIds array so a user can belong to several workspaces. On first sign-in, auto-create a personal workspace. Add a workspace switcher to the top bar. Every feature we build next stores a workspaceId on its documents and queries by it, and all queries must re-run when the active workspace changes. Also create users/{uid} profile docs { displayName, email, language } written on sign-in - a Cloud Function will later read emails from here, so clients never need to store emails on shared documents.