Restore Space README frontmatter (fix CONFIG_ERROR)

README.md

@@ -1,182 +1,34 @@
-# Eldouma Graphics
-
-**Turn a script into a finished motion-graphics video — free, open-source, and AI-powered.**
-
-[![License: AGPL-3.0](https://img.shields.io/badge/License-AGPL--3.0-blue.svg)](./LICENSE)
-[![PRs welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg)](./CONTRIBUTING.md)
-
-Give it a script — in **English or Arabic** — and Eldouma Graphics turns it into a broadcast-quality
-motion-graphics video. A built-in **AI agent** reads what you want in plain language and picks, fills,
-and even generates animated scenes for you. Under the hood is a large library of animated **scene
-templates** (titles, stats, charts, lower-thirds, logo stings, and a bold full-screen **"Impact"**
-style), a **timeline editor** for arranging and fine-tuning, and **MP4 export**.
-
-It runs entirely on your machine as a Vite + React single-page app plus a small Node API server.
-
-> **Free by default.** Run without any of the optional keys and there is **no login, no credits, no
-> billing** — just the editor. You only need **one AI key** for the agent + transcription to light up.
-
----
-
-## ✨ Quick start (let Claude install it for you)
-
-The easiest way in: hand this repo to **Claude** (in [Claude Code](https://claude.com/claude-code) or on
-[claude.ai](https://claude.ai)) and let it do the setup. Copy the repo URL, paste the prompt below, and
-Claude clones it, installs the dependencies, wires up your `.env`, starts the dev server, and hands you
-back a local URL to open.
-
-**Copy-paste this to Claude:**
-
-> Clone https://github.com/MoeEldouma/eldouma-graphics, follow its README to install it, create the
-> `.env` from `.env.example` with my AI key, run `npm run dev`, and give me the local URL to open.
-
-Have your one AI key ready (see [Connect your own AI](#-connect-your-own-ai)) and Claude will drop it in
-for you.
-
 ---
-
-## 🛠 Manual install
-
-Prerequisites: **Node.js >= 20**.
-
-```bash
-# 1. Clone
-git clone https://github.com/MoeEldouma/eldouma-graphics
-cd eldouma-graphics
-
-# 2. Create your env file and add ONE AI key
-cp .env.example .env
-#    then open .env and set KIMI_API_KEY=...  (see the section below for where to get a key)
-
-# 3. Install
-npm install
-
-# 4. Run (starts the web app + the API together)
-npm run dev
-```
-
-Then open **http://localhost:5173**.
-
-`npm run dev` uses `concurrently` to start the **Vite web app on http://localhost:5173** and the **Node
-API server** (default port `4600`) side by side. Server code does not hot-reload — restart `npm run dev`
-after editing `.env` or anything under `server/`.
-
-Get a free key to paste into `.env`:
-
-- **Kimi / Moonshot (recommended):** https://platform.moonshot.ai — set `KIMI_API_KEY`.
-- Or **DeepInfra:** https://deepinfra.com — set `DEEPINFRA_API_KEY`.
-- Or **Groq** (speech only): https://console.groq.com — set `GROQ_API_KEY`.
-
-One key is enough to start. To build for production instead: `npm run build`, then `npm start`.
-
+title: Eldouma Graphics
+emoji: 🎬
+colorFrom: yellow
+colorTo: purple
+sdk: docker
+app_port: 7860
+pinned: false
+license: agpl-3.0
+short_description: Free AI motion-graphics studio (bring your own AI key)
 ---
 
-## 🔌 Connect your own AI
+# 🎬 Eldouma Graphics — live demo
 
-Eldouma Graphics is **provider-agnostic** — bring whichever key you have. Every provider is
-OpenAI-compatible, and a model only appears in the app when its key is present, so the in-app **model
-switcher** lets you pick freely.
+A **free, open-source AI motion-graphics studio**: describe a video in plain words and an AI agent
+builds it scene-by-scene from a large library of animated templates (including a bold "Impact" style),
+in **English or Arabic**, then exports it to MP4.
 
-| Provider | Env var | What it powers | Get a key |
-| --- | --- | --- | --- |
-| **Kimi (Moonshot)** | `KIMI_API_KEY` | The **primary LLM** — the agent, scene generation, and script writing. No per-token cap. | [platform.moonshot.ai](https://platform.moonshot.ai) |
-| **DeepInfra** | `DEEPINFRA_API_KEY` | Cheap pay-per-token open models (Llama / Qwen) for the agent + scene generation, and Whisper **speech-to-text**. | [deepinfra.com](https://deepinfra.com) |
-| **Groq** | `GROQ_API_KEY` | Whisper **speech-to-text** (word-level timestamps) and **text-to-speech** narration. | [console.groq.com](https://console.groq.com) |
+## ▶️ How to use this demo
 
-**You only need one to start.** With just `KIMI_API_KEY`, the agent, scene generation, and script
-writing all work. Add `DEEPINFRA_API_KEY` or `GROQ_API_KEY` when you want transcription/narration or the
-cheaper open models. Remove a key and its models simply disappear from the switcher — no code change.
-
-Default model choices: `Kimi Standard` for reliable tool-calling day to day, and a `Reasoning` Kimi model
-for the deeper agentic scene-building. Switch anytime from the model picker in the app.
-
----
-
-## 🎬 Generate new motion graphics with AI
-
-You are not limited to filling in the built-in templates — you can **describe a scene in plain language**
-and let AI build it:
-
-1. Open the **AI panel** in the editor.
-2. Describe what you want — a topic, a style, an accent color, the text, the mood ("a bold full-screen
-   stat that slams a big number onto an orange slab", "a glass lower-third for the speaker's intro").
-3. The agent picks the closest scene template, fills it with your copy, sets theme/accent/font, and adds
-   it to your timeline. For overlays it can **anchor** a graphic to the exact line in your transcript so
-   it lands on the right moment.
-
-You can drive this with the built-in agent, or use **Claude / any model** the same way. Prefer working in
-your own words and let the agent translate them into scenes; then fine-tune by dragging, resizing, and
-tweaking in the inspector.
-
-Want a brand-new reusable look? **Contributors add scene templates to the library** so everyone can use
-them — see [Contributing](#-contributing). The single biggest way to grow Eldouma Graphics is more
-scenes.
-
----
-
-## 🤖 Agentic AI workflow
-
-Eldouma Graphics is, at its core, a **reference implementation of an agentic AI workflow** — not a single
-prompt-in / clip-out call, but an AI **agent that plans, acts through tools, observes the result, and
-iterates** until a whole video is built. If you want to see a real, end-to-end agentic system you can read
-and run, this is one.
-
-**The loop**
-
-1. **Perceive** — you give it natural language (a sentence, a full script, or a chat instruction), optionally with audio / video / an image.
-2. **Plan** — it breaks the input into beats and, for each beat, decides the *content shape* (a number → a stat scene, a list → chips, a process → steps, a comparison → compare, an AI/data concept → a concept scene) and picks a matching scene from a **279-template library**.
-3. **Act — tool calls** — it calls tools in a loop, each mutating the shared timeline state:
-   - `add_motion_scene` — generate, **art-direct** (theme / accent / font / background) and **place** one scene (anchored to a transcript line or an explicit time)
-   - `fill_scene` / `edit` — write or rewrite a scene's copy
-   - `set_section_status` — drive the visible plan checklist (active → done)
-   - `translate`, `analyze` — localize (EN / العربية) or shot-detect footage
-4. **Observe & iterate** — it reads the timeline back, marks each planned section done, and keeps going turn-by-turn until the video is built — then **refines on further plain-language asks** (create → edit → manage).
-
-**Why it's a good agentic reference**
-
-- **Tool-calling over a shared state**, not one-shot generation — the hallmark of an agent.
-- **Model-agnostic** — the loop is provider-agnostic; connect Kimi / Claude / GPT / Gemini / DeepInfra or any OpenAI-compatible endpoint (see [Connect your own AI](#-connect-your-own-ai)). Swap the brain, keep the workflow.
-- **A visible trace** — the AI panel shows the agent's live plan (each scene lights up *active → done*) and a "what it's doing now" line, so the autonomy is legible, not a black box.
-- **Human-in-the-loop** — every step is inspectable and editable; the agent proposes, you dispose.
-
-**Read the code**
-
-| Piece | Where |
-|---|---|
-| The agent loop, system prompt & tool schema | [`src/lib/agent.ts`](src/lib/agent.ts) |
-| The streaming tool-calling endpoint | [`server/index.mjs`](server/index.mjs) → `/api/chat/stream` |
-| The tool "menu" — 279 scenes the agent can call, with prop schemas + a selection playbook | [`src/remotion/mg/catalog.mjs`](src/remotion/mg/catalog.mjs) |
-| The provider-agnostic model client (bring your own key) | [`packages/ai/client.mjs`](packages/ai/client.mjs) |
-| The visible agent trace (plan checklist + live status) | [`src/components/AIPanel.tsx`](src/components/AIPanel.tsx) |
-
-> **See it with zero setup:** on the live demo, click **Open a sample** for a bold *Impact*-style showcase this pipeline produces — then connect a key and watch the agent build a new one from a single sentence.
-
----
-
-## 🤝 Contributing
-
-PRs are very welcome under AGPL-3.0. The **highest-leverage contribution is a new scene template** — a
-new animated look immediately becomes available to the picker and to the AI agent for everyone.
-
-See **[CONTRIBUTING.md](./CONTRIBUTING.md)** for the dev setup, where scenes live, the shape of a scene,
-and the PR flow.
-
----
-
-## 📜 License
-
-**AGPL-3.0** — free forever. You can use, study, modify, and share it. The one rule that matters: if you
-**modify or host** Eldouma Graphics (including as a network service), you must make your source available
-under the same license. Full text in **[LICENSE](./LICENSE)**.
-
----
+This is a **bring-your-own-key** sandbox — it costs the host nothing, and your key never leaves your browser:
 
-## Credits
+1. Click **Connect AI** (top bar).
+2. Paste your own API key — [Kimi / Moonshot](https://platform.moonshot.ai) (recommended),
+   DeepInfra, Groq, or any OpenAI-compatible endpoint.
+3. Describe a video and start generating. Projects here are **temporary** and reset when the Space restarts.
 
-Eldouma Graphics ships with freely-licensed assets. Thank you to their creators:
+> 🔒 Your key is stored only in your browser (localStorage) and sent as a request header — it is
+> never saved on the server or in logs. Heavy 4K exports may be slow on the free CPU tier.
 
-- **Fonts** — bundled under the SIL Open Font License 1.1. See [`public/fonts/NOTICES.md`](./public/fonts/NOTICES.md).
-- **Music** — original, procedurally-synthesized tracks (effectively CC0). See [`public/music/CREDITS.md`](./public/music/CREDITS.md).
-- **Sound effects** — original designed sound set (effectively CC0). See [`public/sfx/CREDITS.md`](./public/sfx/CREDITS.md).
+## 🏠 Run it yourself (free, forever)
 
-Built with [Remotion](https://remotion.dev), React, and Vite.
+Full source + install guide: **https://github.com/MoeEldouma/eldouma-graphics** — licensed **AGPL-3.0**.
+Clone it, add one AI key, `npm install`, `npm run dev`, done. PRs (especially new scene templates) welcome!