feat: add shared @sexy.pivoine.art/types package and fix type safety across frontend/backend

- Create packages/types with shared TypeScript domain model interfaces (User, Video, Model, Article, Comment, Recording, etc.)
- Wire both frontend and backend packages to use @sexy.pivoine.art/types via workspace:*
- Update backend Pothos objectRef types to use shared interfaces instead of inline types
- Update frontend $lib/types.ts to re-export from shared package
- Fix all type errors introduced by more accurate nullable types (avatar/banner as string|null UUIDs, author nullable, events/device_info as object[])
- Add artist_name to comment user select in backend resolver
- Widen utility function signatures (getAssetUrl, getUserInitials, calcReadingTime) to accept null/undefined

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

packages/frontend/src/lib/components/header/header.svelte

@@ -128,7 +128,7 @@
               user={{
                 name:
                   authStatus.user!.artist_name || authStatus.user!.email.split("@")[0] || "User",
-                avatar: getAssetUrl(authStatus.user!.avatar?.id, "mini")!,
+                avatar: getAssetUrl(authStatus.user!.avatar, "mini")!,
                 email: authStatus.user!.email,
               }}
               onLogout={handleLogout}
@@ -171,7 +171,7 @@
               <div class="relative flex items-center gap-4">
                 <Avatar class="h-14 w-14 ring-2 ring-primary/30">
                   <AvatarImage
-                    src={getAssetUrl(authStatus.user!.avatar?.id, "mini")}
+                    src={getAssetUrl(authStatus.user!.avatar, "mini")}
                     alt={authStatus.user!.artist_name}
                   />
                   <AvatarFallback

packages/frontend/src/lib/components/meta/meta.svelte

@@ -4,7 +4,7 @@
 
   interface Props {
     title: string;
-    description: string;
+    description: string | null | undefined;
     image?: string;
   }
 

packages/frontend/src/lib/components/recording-card/recording-card.svelte

@@ -2,7 +2,7 @@
   import { _ } from "svelte-i18n";
   import { Card, CardContent, CardHeader } from "$lib/components/ui/card";
   import { Button } from "$lib/components/ui/button";
-  import type { Recording } from "$lib/types";
+  import type { Recording, DeviceInfo } from "$lib/types";
   import { cn } from "$lib/utils";
 
   interface Props {
@@ -68,18 +68,18 @@
       <div class="flex flex-col items-center p-3 rounded-lg bg-muted/30 border border-border/30">
         <span class="icon-[ri--pulse-line] w-4 h-4 text-accent mb-1"></span>
         <span class="text-xs text-muted-foreground">{$_("recording_card.events")}</span>
-        <span class="font-medium text-sm">{recording.events.length}</span>
+        <span class="font-medium text-sm">{recording.events?.length ?? 0}</span>
       </div>
       <div class="flex flex-col items-center p-3 rounded-lg bg-muted/30 border border-border/30">
         <span class="icon-[ri--gamepad-line] w-4 h-4 text-primary mb-1"></span>
         <span class="text-xs text-muted-foreground">{$_("recording_card.devices")}</span>
-        <span class="font-medium text-sm">{recording.device_info.length}</span>
+        <span class="font-medium text-sm">{recording.device_info?.length ?? 0}</span>
       </div>
     </div>
 
     <!-- Device Info -->
     <div class="space-y-1">
-      {#each recording.device_info.slice(0, 2) as device (device.name)}
+      {#each ((recording.device_info ?? []) as DeviceInfo[]).slice(0, 2) as device (device.name)}
         <div
           class="flex items-center gap-2 text-xs text-muted-foreground bg-muted/20 rounded px-2 py-1"
         >
@@ -88,9 +88,9 @@
           <span class="text-xs opacity-60">• {device.capabilities.join(", ")}</span>
         </div>
       {/each}
-      {#if recording.device_info.length > 2}
+      {#if (recording.device_info?.length ?? 0) > 2}
         <div class="text-xs text-muted-foreground/60 px-2">
-          +{recording.device_info.length - 2} more device{recording.device_info.length - 2 > 1
+          +{(recording.device_info?.length ?? 0) - 2} more device{(recording.device_info?.length ?? 0) - 2 > 1
             ? "s"
             : ""}
         </div>