design: finalize logo and update Pastel to palette icon

Logo Updates:
- Using authentic Lucide brush and wrench icons
- Wrench vertical, brush horizontal (90° rotation)
- Aligned bottom edges for visual balance
- Scaled up to 5x for better visibility
- Removed center dot for cleaner look

Pastel Icon:
- Changed from paintbrush to proper palette icon
- Palette with thumb hole and color dots
- Better represents color manipulation tool

Visual improvements:
- Clean, professional crossed tools design
- Proper alignment and spacing
- Large, visible icons at all sizes
- Consistent with Lucide icon library

🤖 Generated with [Claude Code](https://claude.com/claude-code)

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

components/Logo.tsx

@@ -15,9 +15,9 @@ export default function Logo({ className = '', size = 120 }: { className?: strin
       animate={{ opacity: 1, scale: 1 }}
       transition={{ duration: 0.6, ease: 'easeOut' }}
     >
-      {/* Wrench (Lucide) - rotated 45 degrees, bottom-left to top-right */}
+      {/* Wrench (Lucide) - vertical */}
       <motion.g
-        transform="translate(100, 100) rotate(45) translate(-12, -12)"
+        transform="translate(100, 100) rotate(0) scale(5) translate(-12, -12)"
         initial={{ pathLength: 0, opacity: 0 }}
         animate={{ pathLength: 1, opacity: 1 }}
         transition={{ duration: 1.2, ease: 'easeInOut' }}
@@ -33,15 +33,15 @@ export default function Logo({ className = '', size = 120 }: { className?: strin
         />
       </motion.g>
 
-      {/* Brush (Lucide) - rotated -45 degrees, top-left to bottom-right */}
+      {/* Brush (Lucide) - horizontal flipped */}
       <motion.g
-        transform="translate(100, 100) rotate(-45) translate(-12, -12)"
+        transform="translate(100, 97) rotate(90) scale(5) translate(-12, -12)"
         initial={{ pathLength: 0, opacity: 0 }}
         animate={{ pathLength: 1, opacity: 1 }}
         transition={{ duration: 1.2, delay: 0.3, ease: 'easeInOut' }}
       >
         <motion.path
-          d="m9.06 11.9 8.07-8.06a2.85 2.85 0 1 1 4.03 4.03l-8.06 8.08"
+          d="m11 10l3 3m-7.5 8A3.5 3.5 0 1 0 3 17.5a2.62 2.62 0 0 1-.708 1.792A1 1 0 0 0 3 21z"
           stroke="url(#brushGradient)"
           strokeWidth="1.5"
           strokeLinecap="round"
@@ -50,27 +50,16 @@ export default function Logo({ className = '', size = 120 }: { className?: strin
           vectorEffect="non-scaling-stroke"
         />
         <motion.path
-          d="M7.07 14.94c-1.66 0-3 1.35-3 3.02 0 1.33-2.5 1.52-2 2.02 1.08 1.1 2.49 2.02 4 2.02 2.2 0 4-1.8 4-4.04a3.01 3.01 0 0 0-3-3.02z"
+          d="M9.969 17.031L21.378 5.624a1 1 0 0 0-3.002-3.002L6.967 14.031"
           stroke="url(#brushGradient)"
           strokeWidth="1.5"
           strokeLinecap="round"
           strokeLinejoin="round"
-          fill="url(#brushFill)"
+          fill="none"
           vectorEffect="non-scaling-stroke"
         />
       </motion.g>
 
-      {/* Center circle */}
-      <motion.circle
-        cx="100"
-        cy="100"
-        r="8"
-        fill="url(#centerGradient)"
-        initial={{ scale: 0 }}
-        animate={{ scale: 1 }}
-        transition={{ duration: 0.5, delay: 0.8, type: 'spring', stiffness: 200 }}
-      />
-
       {/* Gradient definitions */}
       <defs>
         <linearGradient id="wrenchGradient" x1="0%" y1="0%" x2="100%" y2="100%">
@@ -81,14 +70,6 @@ export default function Logo({ className = '', size = 120 }: { className?: strin
           <stop offset="0%" stopColor="#f59e0b" />
           <stop offset="100%" stopColor="#ec4899" />
         </linearGradient>
-        <linearGradient id="brushFill" x1="0%" y1="0%" x2="100%" y2="100%">
-          <stop offset="0%" stopColor="#10b981" stopOpacity="0.3" />
-          <stop offset="100%" stopColor="#06b6d4" stopOpacity="0.3" />
-        </linearGradient>
-        <linearGradient id="centerGradient" x1="0%" y1="0%" x2="100%" y2="100%">
-          <stop offset="0%" stopColor="#a855f7" />
-          <stop offset="100%" stopColor="#06b6d4" />
-        </linearGradient>
       </defs>
     </motion.svg>
   );