feat: Add PWA assets and metadata for iOS Safari installation

- Generate app icons in multiple sizes (192x192, 512x512, 180x180, 32x32)
- Create favicon and apple-touch-icon SVG files
- Add comprehensive PWA meta tags in app layout
- Configure theme color (#3B82F6) and background color
- Update manifest.json with icon references (PNG and SVG)
- Create icon generation scripts (SVG and PNG conversion)
- Add browser-based PNG icon generator (HTML)
- Create comprehensive PWA testing guide
- Add icon setup documentation

Requirements: 4.1, 4.2
Task: 13. Add PWA assets and metadata

scripts/convert-with-sharp.js

@@ -0,0 +1,59 @@
+// SVG to PNG converter using sharp library
+// Run: npm install --save-dev sharp
+// Then: node scripts/convert-with-sharp.js
+
+const fs = require('fs');
+const path = require('path');
+
+async function convertIcons() {
+  try {
+    const sharp = require('sharp');
+    console.log('Converting SVG icons to PNG using sharp...\n');
+
+    const publicDir = path.join(__dirname, '..', 'public');
+    
+    const conversions = [
+      { input: 'icon-192.svg', output: 'icon-192.png', size: 192 },
+      { input: 'icon-512.svg', output: 'icon-512.png', size: 512 },
+      { input: 'apple-touch-icon.svg', output: 'apple-touch-icon.png', size: 180 },
+      { input: 'favicon.svg', output: 'favicon-32.png', size: 32 }
+    ];
+
+    for (const conv of conversions) {
+      const inputPath = path.join(publicDir, conv.input);
+      const outputPath = path.join(publicDir, conv.output);
+      
+      if (!fs.existsSync(inputPath)) {
+        console.log(`⚠️  ${conv.input} not found, skipping...`);
+        continue;
+      }
+
+      await sharp(inputPath)
+        .resize(conv.size, conv.size)
+        .png()
+        .toFile(outputPath);
+      
+      console.log(`✓ Created ${conv.output} (${conv.size}x${conv.size})`);
+    }
+
+    console.log('\n✓ All PNG icons generated successfully!');
+    console.log('\nNext steps:');
+    console.log('  1. Update manifest.json to reference PNG icons');
+    console.log('  2. Update app/layout.tsx to use PNG apple-touch-icon');
+    console.log('  3. Test "Add to Home Screen" on iOS Safari');
+
+  } catch (error) {
+    if (error.code === 'MODULE_NOT_FOUND') {
+      console.error('❌ Sharp is not installed.');
+      console.log('\nTo install sharp, run:');
+      console.log('  npm install --save-dev sharp');
+      console.log('\nOr use alternative conversion methods:');
+      console.log('  node scripts/svg-to-png.js');
+    } else {
+      console.error('Error converting icons:', error.message);
+    }
+    process.exit(1);
+  }
+}
+
+convertIcons();