feat: apply canvas dot-grid background to sign-in and sign-up pages

Replace the plain body background on auth pages with the product's canvas
aesthetic — the same canvasBg colour and radial dot-grid used by the
canvas editor, toggling correctly between dark and light themes.

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

packages/app/src/app/sign-in/[[...sign-in]]/page.tsx

@@ -1,8 +1,26 @@
+'use client';
+
 import { SignIn } from '@clerk/nextjs';
+import { useCanvasTheme } from '@/store/canvasTheme';
 
 export default function SignInPage() {
+  const T = useCanvasTheme();
+
   return (
-    <main style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', minHeight: '100vh' }}>
+    <main
+      style={{
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'center',
+        minHeight: '100vh',
+        // Use the exact canvas background tokens so this page matches the
+        // product's dark / light canvas aesthetic.
+        background: T.canvasBg,
+        backgroundImage: `radial-gradient(circle, ${T.dotColor} 1px, transparent 1px)`,
+        backgroundSize: '24px 24px',
+        transition: 'background 0.2s',
+      }}
+    >
       <SignIn />
     </main>
   );

packages/app/src/app/sign-up/[[...sign-up]]/page.tsx

@@ -1,8 +1,26 @@
+'use client';
+
 import { SignUp } from '@clerk/nextjs';
+import { useCanvasTheme } from '@/store/canvasTheme';
 
 export default function SignUpPage() {
+  const T = useCanvasTheme();
+
   return (
-    <main style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', minHeight: '100vh' }}>
+    <main
+      style={{
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'center',
+        minHeight: '100vh',
+        // Use the exact canvas background tokens so this page matches the
+        // product's dark / light canvas aesthetic.
+        background: T.canvasBg,
+        backgroundImage: `radial-gradient(circle, ${T.dotColor} 1px, transparent 1px)`,
+        backgroundSize: '24px 24px',
+        transition: 'background 0.2s',
+      }}
+    >
       <SignUp />
     </main>
   );