feat: add subscription UI, plan-based nav gating, and client subscription page

- Add plan field to UserInfo shared type
- Subscription API client and React Query hooks
- Client subscription page with status + payment history
- Sidebar navigation filtered by tenant plan features
- Subscription link added to navigation

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

apps/web/lib/api/subscription.ts

@@ -0,0 +1,44 @@
+import { apiClient } from './client';
+
+export interface Subscription {
+  id: string;
+  tenantId: string;
+  plan: string;
+  status: string;
+  amount: string;
+  frequency: string;
+  mpPreapprovalId: string | null;
+  createdAt: string;
+}
+
+export interface Payment {
+  id: string;
+  tenantId: string;
+  subscriptionId: string | null;
+  mpPaymentId: string | null;
+  amount: string;
+  status: string;
+  paymentMethod: string | null;
+  paidAt: string | null;
+  createdAt: string;
+}
+
+export async function getSubscription(tenantId: string): Promise<Subscription> {
+  const response = await apiClient.get<Subscription>(`/subscriptions/${tenantId}`);
+  return response.data;
+}
+
+export async function generatePaymentLink(tenantId: string): Promise<{ paymentUrl: string }> {
+  const response = await apiClient.post<{ paymentUrl: string }>(`/subscriptions/${tenantId}/generate-link`);
+  return response.data;
+}
+
+export async function markAsPaid(tenantId: string, amount: number): Promise<Payment> {
+  const response = await apiClient.post<Payment>(`/subscriptions/${tenantId}/mark-paid`, { amount });
+  return response.data;
+}
+
+export async function getPaymentHistory(tenantId: string): Promise<Payment[]> {
+  const response = await apiClient.get<Payment[]>(`/subscriptions/${tenantId}/payments`);
+  return response.data;
+}