feat: initialize monorepo structure with Bun and Turborepo

- Add package.json for the root with workspace configuration and scripts
- Create @gruperly/config package with TypeScript configuration
- Establish shared package @gruperly/shared with Zod schemas for validation
- Implement group, student, and payment schemas using Zod
- Set up TypeScript configuration for shared package
- Document stack architecture and technical specifications in stack.md
- Configure Turborepo with build, dev, lint, and typecheck tasks

apps/web/src/components/ui/avatar.tsx

@@ -0,0 +1,40 @@
+import { forwardRef, type HTMLAttributes } from 'react'
+import { cn } from '../../lib/utils'
+
+export type AvatarProps = HTMLAttributes<HTMLDivElement> & {
+  name?: string
+  src?: string
+}
+
+function initials(name?: string) {
+  if (!name) return '?'
+  return name
+    .split(/\s+/)
+    .filter(Boolean)
+    .slice(0, 2)
+    .map((part) => part[0]?.toUpperCase() ?? '')
+    .join('')
+}
+
+export const Avatar = forwardRef<HTMLDivElement, AvatarProps>(
+  ({ className, name, src, ...props }, ref) => {
+    return (
+      <div
+        ref={ref}
+        className={cn(
+          'flex size-9 shrink-0 items-center justify-center overflow-hidden rounded-xl bg-accent text-sm font-semibold text-white',
+          className,
+        )}
+        {...props}
+      >
+        {src ? (
+          <img src={src} alt={name ?? 'avatar'} className="size-full object-cover" />
+        ) : (
+          initials(name)
+        )}
+      </div>
+    )
+  },
+)
+
+Avatar.displayName = 'Avatar'