feat(interface-design): add comprehensive interface design skill documentation and references

- Introduced SKILL.md outlining the principles and processes for effective interface design.
- Added critique.md for evaluating design outputs and ensuring craft over correctness.
- Created example.md to illustrate the application of subtle layering principles in design decisions.
- Developed principles.md detailing core craft principles for consistent design quality.
- Implemented validation.md for memory management and pattern reuse in the design system.
- Established system.md for the Playzer design system, defining direction, domain concepts, and design decisions.
- Added StatusBadge component for displaying booking statuses with appropriate styles and labels.
- Updated skills-lock.json to include the new interface-design skill.

apps/backend/test/support/prisma.mock.ts

@@ -5,14 +5,16 @@ import type { PrismaClient } from '@/generated/prisma/client';
 import type { PrismaClientMock } from 'bun-mock-prisma';
 
 export const prismaMock = createPrismaMock<PrismaClient>() as PrismaClientMock<PrismaClient>;
-export const sendMailMock = mock(async (_input: {
-  to: string;
-  subject: string;
-  html: string;
-  text: string;
-}) => undefined);
-export const transactionMock = mock(async <T>(fn: (tx: PrismaClientMock<PrismaClient>) => Promise<T>) =>
-  fn(prismaMock)
+export const sendMailMock = mock(
+  async (_input: {
+    to: string;
+    subject: string;
+    html: string;
+    text: string;
+  }) => undefined
+);
+export const transactionMock = mock(
+  async <T>(fn: (tx: PrismaClientMock<PrismaClient>) => Promise<T>) => fn(prismaMock)
 );
 export const dbMock = {
   complexUser: prismaMock.complexUser,