feat: architectural grid editor fullPage + slash commands + doc info panel + AI title

memento-note/components/ui/toast.tsx

@@ -5,24 +5,34 @@ import { Toaster as SonnerToaster, toast as sonnerToast } from 'sonner'
 // Re-export toast functions from Sonner
 export const toast = sonnerToast
 
-// Toaster component with custom styles
+// Toaster component — styled for Memento paper/ink design system
 export function Toaster() {
   return (
     <SonnerToaster
       position="bottom-right"
       expand={false}
-      richColors
+      richColors={false}
       closeButton
-      duration={3000}
-      className="toaster"
+      duration={3500}
+      className="toaster font-sans"
       toastOptions={{
         classNames: {
-          toast: 'toast pointer-events-auto',
-          description: 'toast-description',
-          actionButton: 'toast-action-button',
-          closeButton: 'toast-close-button',
+          toast: [
+            'toast pointer-events-auto',
+            '!bg-[#1C1C1C] !text-[#F2F0E9] !border !border-white/10',
+            '!rounded-xl !shadow-xl !shadow-black/30',
+            '!text-[13px] !font-medium !py-3 !px-4',
+          ].join(' '),
+          description: '!text-[#F2F0E9]/70 !text-[12px]',
+          actionButton: '!bg-[#F2F0E9] !text-[#1C1C1C] !text-[11px] !font-bold !rounded-lg !px-3 !py-1',
+          closeButton: '!bg-white/10 !text-[#F2F0E9]/70 !border-white/10 hover:!bg-white/20',
+          success: '!border-l-4 !border-l-emerald-400/70',
+          error: '!border-l-4 !border-l-red-400/70',
+          warning: '!border-l-4 !border-l-amber-400/70',
+          info: '!border-l-4 !border-l-sky-400/70',
         },
       }}
     />
   )
 }
+