Add growth assets and tighten project metadata

.npmrc

@@ -1,3 +1,4 @@
 registry=https://registry.npmjs.org/
 fund=false
 audit=true
+save-exact=true

docs/DEMO.md

@@ -0,0 +1,55 @@
+# OpenCompress demo recording guide
+
+A short real workflow GIF/video is the highest-value visual asset still missing from the repository.
+
+## Target
+
+Record a **15–25 second**, silent demo at **1280×720** or **1440×900**. Keep the UI large enough to read on a GitHub README.
+
+## Storyboard
+
+1. Start on an empty OpenCompress screen for ~1 second.
+2. Drag 8–20 mixed product images into the drop zone.
+3. Select **Auto Best local**.
+4. Briefly show the WooCommerce preset or WebP output settings.
+5. Click **Compress images**.
+6. Show the completed batch summary and visible savings.
+7. Drag the Before/After slider once.
+8. Show the candidate comparison for one image.
+9. End with the **Download ZIP** button and the savings summary visible.
+
+## What the demo must communicate
+
+The viewer should understand these four things without reading captions:
+
+- batch workflow
+- local/private processing
+- visible before/after comparison
+- one-click ZIP export
+
+## Recording rules
+
+- Use non-confidential sample images.
+- Hide personal paths, browser profiles and unrelated tabs.
+- Do not show reSmush.it in the main demo; the strongest differentiator is local-first processing.
+- Keep mouse movement deliberate and avoid idle time.
+- Prefer a real recording over a mocked animation.
+- Crop out browser chrome if it distracts from the app.
+
+## Suggested filename
+
+```text
+docs/opencompress-demo.gif
+```
+
+For better quality and smaller GitHub payloads, also keep an MP4/WebM source outside the repository and export the README GIF at roughly 12–15 FPS.
+
+## README placement
+
+Once the real GIF exists, replace the static preview line near the top of `README.md` with:
+
+```markdown
+![OpenCompress Studio demo](docs/opencompress-demo.gif)
+```
+
+Keep `docs/screenshot.svg` as a lightweight fallback/social asset source.

docs/SOCIAL_PREVIEW.md

@@ -0,0 +1,70 @@
+# GitHub social preview specification
+
+Use this as the source brief for the repository's GitHub Social Preview image.
+
+## Canvas
+
+- Size: **1280 × 640 px**
+- Keep all important text inside the central safe area.
+- Dark background matching the current OpenCompress UI.
+- High contrast and readable at small card sizes.
+
+## Primary copy
+
+```text
+OpenCompress Studio
+Private-by-default batch image compression
+```
+
+## Secondary copy
+
+```text
+Local • Batch • WebP/JPG/PNG • Before/After • ZIP export
+```
+
+## Visual hierarchy
+
+1. OpenCompress Studio wordmark/title
+2. Short privacy-first promise
+3. Simplified app frame with a visible Before/After split
+4. A compact savings card, for example `2.4 MB → 680 KB · 72% smaller`
+5. Small feature strip: `Local • Batch • Auto Best • ZIP`
+
+## Avoid
+
+- Tiny feature lists
+- Fake benchmark claims
+- Third-party logos as the main visual
+- Screenshots containing personal filenames or browser chrome
+- Text such as "free forever" unless that is intentionally guaranteed
+
+## Suggested GitHub topics
+
+Copy these into **About → Topics**:
+
+```text
+image-compression
+image-optimizer
+batch-image-processing
+webp
+sharp
+react
+vite
+ecommerce
+woocommerce
+privacy-first
+local-first
+image-converter
+```
+
+## Repository description
+
+Recommended GitHub description:
+
+```text
+Private-by-default batch image compressor for shops and creators. Local WebP/JPG/PNG optimization, resize, target size, SEO rename, before/after preview and ZIP export.
+```
+
+## Social Preview upload
+
+After exporting the final artwork as PNG or JPG, open the repository settings and set it under **Social preview**. GitHub does not use a repository file automatically for this field.

package.json

@@ -29,7 +29,7 @@
     "typescript": "latest"
   },
   "engines": {
-    "node": ">=20.0.0",
+    "node": "^20.19.0 || >=22.12.0",
     "npm": ">=10.0.0"
   }
 }