Add Milestones 1 & 2: full-stack POS foundation with admin UI

- Node/Express/TypeScript API under /api/v1 with JWT auth (login, refresh, logout, /me)
- Prisma schema: vendors, users, roles, products, categories, taxes, transactions
- SQLite for local dev; Postgres via docker-compose for production
- Full CRUD routes for vendors, users, categories, taxes, products with Zod validation and RBAC
- Paginated list endpoints scoped per vendor; refresh token rotation
- React/TypeScript admin SPA (Vite): login, protected routing, sidebar layout
- Pages: Dashboard, Catalog (tabbed Products/Categories/Taxes), Users, Vendor Settings
- Shared UI: Table, Modal, FormField, Btn, PageHeader components
- Multi-stage Dockerfile; docker-compose with Postgres healthcheck
- Seed script with demo vendor and owner account
- INSTRUCTIONS.md, ROADMAP.md, .claude/launch.json for dev server config

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

client/src/components/FormField.tsx

@@ -0,0 +1,77 @@
+import React from "react";
+
+interface FormFieldProps {
+  label: string;
+  error?: string;
+  children: React.ReactNode;
+  required?: boolean;
+}
+
+export function FormField({ label, error, children, required }: FormFieldProps) {
+  return (
+    <div style={s.field}>
+      <label style={s.label}>
+        {label}{required && <span style={s.req}> *</span>}
+      </label>
+      {children}
+      {error && <span style={s.error}>{error}</span>}
+    </div>
+  );
+}
+
+export const inputStyle: React.CSSProperties = {
+  width: "100%",
+  border: "1px solid var(--color-border)",
+  borderRadius: "var(--radius)",
+  padding: "8px 10px",
+  fontSize: 14,
+  outline: "none",
+  boxSizing: "border-box",
+};
+
+export function Btn({
+  children,
+  variant = "primary",
+  type = "button",
+  disabled,
+  onClick,
+  style,
+}: {
+  children: React.ReactNode;
+  variant?: "primary" | "danger" | "ghost";
+  type?: "button" | "submit" | "reset";
+  disabled?: boolean;
+  onClick?: () => void;
+  style?: React.CSSProperties;
+}) {
+  const base: React.CSSProperties = {
+    border: "none",
+    borderRadius: "var(--radius)",
+    padding: "8px 16px",
+    fontWeight: 600,
+    fontSize: 13,
+    cursor: disabled ? "not-allowed" : "pointer",
+    opacity: disabled ? 0.6 : 1,
+  };
+  const variants = {
+    primary: { background: "var(--color-primary)", color: "#fff" },
+    danger: { background: "var(--color-danger)", color: "#fff" },
+    ghost: {
+      background: "none",
+      color: "var(--color-text-muted)",
+      border: "1px solid var(--color-border)",
+    },
+  };
+  return (
+    <button type={type} style={{ ...base, ...variants[variant], ...style }} disabled={disabled} onClick={onClick}>
+      {children}
+    </button>
+  );
+}
+
+const s: Record<string, React.CSSProperties> = {
+  field: { display: "flex", flexDirection: "column", gap: 4, marginBottom: 16 },
+  label: { fontWeight: 500, fontSize: 13 },
+  req: { color: "var(--color-danger)" },
+  error: { color: "var(--color-danger)", fontSize: 12 },
+};