From f219b26f71196fca56228c4c09c9f77993c94119 Mon Sep 17 00:00:00 2001
From: Iqbal <iqbaldev3@gmail.com>
Date: Fri, 23 Oct 2026 10:42:12 +0700
Subject: [PATCH] Initial commit: Learning Lab Express

Includes fixes found while reviewing the app:
- Results: open each result by a type+agent+id key, so a video and a
  material draft with the same id no longer open each other's popup
- AuthGate: clear the query cache during render, before pages build their
  queries, and remount pages on organization switch (pages no longer stay
  on skeletons for up to a minute after sign-in or refresh)
- Instruction: keep only failed rules after a partial approve, so retrying
  does not create the successful schedules twice; drop the monthly note
  once count or frequency is edited
- Parser/schedules: never schedule a count below one
- Audio: ignore the end event of a cancelled utterance when changing speed
- Downloads: revoke the object URL later so Safari/Firefox can read it
- Results: refetch SCORM content when any part's revision changes; show a
  failed video as failed instead of "still rendering"

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 .claude/launch.json            |    6 +
 .gitignore                     |    4 +
 README.md                      |   38 +
 index.html                     |   35 +
 mockup.html                    |  615 +++++++++
 package-lock.json              | 2328 ++++++++++++++++++++++++++++++++
 package.json                   |   30 +
 prototype/README.md            |   27 +
 prototype/engine.js            |  192 +++
 prototype/index.html           |  333 +++++
 prototype/server.mjs           |   52 +
 src/App.tsx                    |   28 +
 src/api/client.ts              |   78 ++
 src/api/engine.ts              |  193 +++
 src/auth/AuthGate.tsx          |   77 ++
 src/components/AppLayout.tsx   |  121 ++
 src/components/AudioPlayer.tsx |  114 ++
 src/components/Icon.tsx        |   51 +
 src/components/Page.tsx        |   71 +
 src/components/Toast.tsx       |   28 +
 src/express/parse.test.ts      |   80 ++
 src/express/parse.ts           |  179 +++
 src/express/results.test.ts    |   54 +
 src/express/results.ts         |  331 +++++
 src/express/schedules.test.ts  |   88 ++
 src/express/schedules.ts       |  316 +++++
 src/express/scorm.test.ts      |   78 ++
 src/express/scorm.ts           |  265 ++++
 src/i18n.ts                    |  717 ++++++++++
 src/main.tsx                   |   49 +
 src/pages/Brain.tsx            |  250 ++++
 src/pages/Instruction.tsx      |  194 +++
 src/pages/Results.tsx          |  423 ++++++
 src/pages/Schedule.tsx         |  222 +++
 src/styles/app.css             |  128 ++
 src/styles/mockup.css          |   36 +
 src/styles/theme.css           |  260 ++++
 tsconfig.app.json              |   24 +
 tsconfig.json                  |    4 +
 tsconfig.node.json             |   19 +
 vite.config.ts                 |   34 +
 41 files changed, 8172 insertions(+)
 create mode 100644 .claude/launch.json
 create mode 100644 .gitignore
 create mode 100644 README.md
 create mode 100644 index.html
 create mode 100644 mockup.html
 create mode 100644 package-lock.json
 create mode 100644 package.json
 create mode 100644 prototype/README.md
 create mode 100644 prototype/engine.js
 create mode 100644 prototype/index.html
 create mode 100644 prototype/server.mjs
 create mode 100644 src/App.tsx
 create mode 100644 src/api/client.ts
 create mode 100644 src/api/engine.ts
 create mode 100644 src/auth/AuthGate.tsx
 create mode 100644 src/components/AppLayout.tsx
 create mode 100644 src/components/AudioPlayer.tsx
 create mode 100644 src/components/Icon.tsx
 create mode 100644 src/components/Page.tsx
 create mode 100644 src/components/Toast.tsx
 create mode 100644 src/express/parse.test.ts
 create mode 100644 src/express/parse.ts
 create mode 100644 src/express/results.test.ts
 create mode 100644 src/express/results.ts
 create mode 100644 src/express/schedules.test.ts
 create mode 100644 src/express/schedules.ts
 create mode 100644 src/express/scorm.test.ts
 create mode 100644 src/express/scorm.ts
 create mode 100644 src/i18n.ts
 create mode 100644 src/main.tsx
 create mode 100644 src/pages/Brain.tsx
 create mode 100644 src/pages/Instruction.tsx
 create mode 100644 src/pages/Results.tsx
 create mode 100644 src/pages/Schedule.tsx
 create mode 100644 src/styles/app.css
 create mode 100644 src/styles/mockup.css
 create mode 100644 src/styles/theme.css
 create mode 100644 tsconfig.app.json
 create mode 100644 tsconfig.json
 create mode 100644 tsconfig.node.json
 create mode 100644 vite.config.ts

diff --git a/.claude/launch.json b/.claude/launch.json
new file mode 100644
index 0000000..27fcb90
--- /dev/null
+++ b/.claude/launch.json
@@ -0,0 +1,6 @@
+{
+  "version": "0.0.1",
+  "configurations": [
+    { "name": "express", "runtimeExecutable": "npm", "runtimeArgs": ["run", "dev"], "port": 5174 }
+  ]
+}
diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..b1640b5
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,4 @@
+node_modules
+dist
+.env
+.env.local
diff --git a/README.md b/README.md
new file mode 100644
index 0000000..60cd888
--- /dev/null
+++ b/README.md
@@ -0,0 +1,38 @@
+# Learning Lab Express
+
+Express Mode untuk learning-lab: UI sederhana di mana tim L&D mengunggah materi ke **Brain**, memberi satu **Instruction** ("bikin 3 video per minggu"), lalu AI menjadwalkan dan terus membuat konten yang tampil di **Results**. Semua logika AI ada di engine **learning-lab** (FastAPI, `/api/v1`); app ini hanya klien.
+
+Stack: React 19, Vite 7, TypeScript, React Router 7, TanStack Query, Clerk (instance yang sama dengan learning-lab). Gaya diambil apa adanya dari `mockup.html` (`src/styles/mockup.css`).
+
+```bash
+# 1. jalankan engine: cd ../learning-lab && docker compose up   → http://localhost:8000
+# 2. jalankan Express
+npm install
+npm run dev        # http://localhost:5174
+npm test           # tes parser, jadwal, SCORM, dan ekspor (Vitest)
+```
+
+- `/api/*` di-proxy oleh Vite ke `ENGINE_URL` (default `http://localhost:8000`), jadi engine tidak perlu CORS.
+- Clerk key dibaca dari `VITE_CLERK_PUBLISHABLE_KEY`, atau otomatis dari `../learning-lab/backend/.env`.
+- Tombol "Open in Learning Studio" di Results membuka `VITE_STUDIO_URL` (default `http://localhost:5173`).
+- Dua bahasa: English (default) dan Indonesia, lewat tombol EN/ID di topbar dan halaman login. Teks ada di `src/i18n.ts`; pilihan disimpan per perangkat.
+- Login wajib memakai akun Clerk dengan organisasi aktif: agents, jadwal, dan kredit semuanya per organisasi.
+
+| Folder | Isi |
+|---|---|
+| `src/api/` | `client.ts` (fetch + token Clerk), `engine.ts` (dokumen, compose, agents) |
+| `src/auth/` | Gerbang login dan pemilihan organisasi |
+| `src/pages/` | Brain (`/brain`), Instruction (`/instruction`), Schedule (`/schedule`), Results (`/results`) |
+| `src/express/` | Parser instruksi (EN/ID), pembuat jadwal di atas Agents engine, hasil, dan ekspor SCORM (`scorm.ts`) |
+| `src/components/` | Layout dengan panduan alur, toast, pemutar audio |
+| `prototype/` | Prototipe HTML satu file sebelumnya (referensi alur) |
+
+Status: semua fase sudah dikerjakan.
+
+- **Fase 0–3 dan 6**: kerangka, auth, Brain, Instruction → jadwal, Schedule dengan "Produce now", dan Results.
+- **Fase 4 · Audio**: jadwal konten `summary` dengan brief naskah narasi. Results memutarnya dengan suara perangkat (Web Speech API) dan mengunduh naskahnya (.txt). Belum ada MP3, karena engine belum punya keluaran audio untuk agen; yang ada hanya TTS di dalam Video Studio.
+- **Fase 5 · Video**: agen dengan `studio.create_video` dan `run_schedule`. Setiap proses membuat satu video (4 adegan, 40 detik), jadi pilihannya hanya 1 per hari atau 1 per minggu. Batas kredit diambil dari `agents/video-quote`. Video yang sudah siap bisa diputar, disetujui atau ditolak, dan diunduh sebagai MP4. Ada juga tombol "Buat video sekarang" di Schedule.
+- **Fase 7 · SCORM**: jadwal konten dengan dua keluaran (`summary` + `quiz` 10 soal) per item, digabung menjadi satu modul di Results. Setiap hasil teks bisa diunduh sebagai paket SCORM 1.2 (.zip) yang dibuat di browser. Paket ini melaporkan selesai, atau nilai dan lulus/tidak (batas lulus 70%), ke LMS.
+- **Pemantapan**: toast menggantikan `alert()`, ada panduan alur di sidebar, dan ada tes Vitest.
+
+Produksi konten otomatis di engine baru jalan bila harga `agent.content.plan` > 0 (admin Learning Studio → Pricing).
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..ed58648
--- /dev/null
+++ b/index.html
@@ -0,0 +1,35 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width,initial-scale=1" />
+    <meta name="description" content="Learning Lab Express by Bawana: Express Mode for learning-lab." />
+    <title>Learning Lab Express</title>
+    <link rel="preconnect" href="https://fonts.googleapis.com" />
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+    <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400..800&display=swap" />
+    <!-- Loading screen styles live here, not in theme.css, so they paint before the app bundle loads. -->
+    <style>
+      body{margin:0;background:#f5f8ff}
+      .boot{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;font-family:'Plus Jakarta Sans',system-ui,-apple-system,"Segoe UI",sans-serif;color:#101828;background:radial-gradient(600px 400px at 50% 38%,rgba(46,144,250,.18),rgba(46,144,250,0) 70%),#f5f8ff;animation:boot-in .3s ease-out}
+      .boot-mark{position:relative;display:grid;place-items:center;width:64px;height:64px;border-radius:20px;color:#fff;background:linear-gradient(140deg,#53b1fd,#2e90fa 45%,#1570ef);box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 14px 30px -10px rgba(21,112,239,.7)}
+      .boot-mark svg{width:32px;height:32px}
+      .boot-mark::before,.boot-mark::after{content:"";position:absolute;inset:-2px;border-radius:22px;border:2px solid rgba(46,144,250,.45);animation:boot-ring 1.8s ease-out infinite}
+      .boot-mark::after{animation-delay:.9s}
+      .boot-name{font-size:17px;font-weight:600;letter-spacing:-.02em}
+      .boot-name b{font-weight:800;color:#1570ef}
+      .boot-bar{position:relative;width:160px;height:4px;border-radius:4px;background:#d1e9ff;overflow:hidden}
+      .boot-bar i{position:absolute;inset:0 auto 0 0;width:40%;border-radius:4px;background:linear-gradient(90deg,#2e90fa,#1570ef);animation:boot-slide 1.1s ease-in-out infinite}
+      .boot-text{font-size:13px;color:#667085}
+      @keyframes boot-ring{from{transform:scale(1);opacity:1}to{transform:scale(1.55);opacity:0}}
+      @keyframes boot-slide{from{transform:translateX(-100%)}to{transform:translateX(250%)}}
+      @keyframes boot-in{from{opacity:0}}
+      @media (prefers-reduced-motion:reduce){.boot,.boot-mark::before,.boot-mark::after,.boot-bar i{animation:none}.boot-bar i{width:100%}}
+    </style>
+  </head>
+  <body>
+    <!-- Shown until React mounts; AuthGate renders the same screen while Clerk loads. -->
+    <div id="root"><div class="boot" role="status"><span class="boot-mark"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M3 5c3-1 6 0 9 2 3-2 6-3 9-2v14c-3-1-6 0-9 2-3-2-6-3-9-2z"/><path d="M12 7v14M6 9l3 1M15 10l3-1"/></svg></span><span class="boot-name">Learning Lab <b>Express</b></span><span class="boot-bar"><i></i></span></div></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>
diff --git a/mockup.html b/mockup.html
new file mode 100644
index 0000000..5bcdbd5
--- /dev/null
+++ b/mockup.html
@@ -0,0 +1,615 @@
+<!DOCTYPE html>
+<html lang="id">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width,initial-scale=1">
+  <meta name="description" content="Learning Lab Express by Bawana. Prototipe pembuatan modul pelatihan dari materi yang sudah ada.">
+  <title>Learning Lab Express · by Bawana</title>
+  <style>:root{--blue:#2563eb;--blue-dark:#194dcc;--navy:#142d50;--ink:#1b2c46;--muted:#768399;--line:#e6ebf2;--bg:#f7f9fc;--light:#eef5ff;--green:#14866b;--radius:14px;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);font-size:14px}
+.admin-menu{margin-top:26px;border-top:1px solid var(--line);padding-top:16px}.admin-menu summary{list-style:none;display:flex;align-items:center;justify-content:space-between;padding:12px;color:var(--muted);font-size:11px;cursor:pointer}.admin-menu summary::-webkit-details-marker{display:none}.admin-menu summary svg{width:14px}.admin-menu[open] summary svg{transform:rotate(180deg)}.auto-hero-note{display:flex;align-items:center;gap:7px;font-size:10px;color:#6c83a3;margin-top:18px}.auto-hero-note svg{width:14px;height:14px;color:var(--blue)}.auto-flow{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:22px 0 18px;padding:0 3px;color:#607594;font-size:11px}.auto-flow>span{display:flex;align-items:center;gap:9px}.auto-flow b{color:var(--blue);background:#eaf2ff;border-radius:50%;display:grid;place-items:center;width:27px;height:27px;font-size:10px}.auto-flow>svg{width:15px;color:#9eafc7}.upload-box.upload-compact{display:flex;align-items:center;gap:18px;text-align:left;padding:25px 28px;margin-bottom:25px}.upload-compact .upload-symbol{margin:0;width:45px;height:45px;flex-shrink:0}.upload-compact>div{flex:1}.upload-compact h3{font-size:14px}.upload-compact p{font-size:11px;margin:6px 0}.upload-compact small{font-size:9px}.upload-compact .btn{flex-shrink:0}
+@media(max-width:600px){.auto-flow{flex-direction:column;align-items:flex-start;gap:12px;margin:18px 0}.auto-flow>svg{display:none}.upload-box.upload-compact{flex-wrap:wrap;padding:20px;gap:13px}.upload-compact>div{flex-basis:calc(100% - 60px)}.upload-compact .btn{width:100%}.auto-hero-note{line-height:1.6}.admin-menu{margin-top:0;padding-top:0;border:0}.admin-menu summary{padding:10px 6px;font-size:10px}}
+*{box-sizing:border-box}body{margin:0;background:var(--bg)}button,input,select,textarea{font:inherit}button,a,input,select,textarea{outline-offset:4px}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.48}a{color:inherit;text-decoration:none}button{color:inherit}button:focus-visible,a:focus-visible{outline:3px solid #9dbfff}svg{width:20px;height:20px;flex-shrink:0;vertical-align:middle}p{line-height:1.7;margin:0;color:var(--muted)}h1,h2,h3,h4{margin:0;letter-spacing:-.035em}h1{font-size:29px;line-height:1.25}h2{font-size:23px}h3{font-size:16px;letter-spacing:-.02em}h4{font-size:14px}small{font-size:11px;color:var(--muted)}[hidden]{display:none!important}
+.brand{display:flex;align-items:center;gap:10px;line-height:1.15;font-size:16px;font-weight:750;letter-spacing:-.5px;white-space:nowrap}.brand b{font-weight:500;display:block;font-size:14px;margin-top:4px;letter-spacing:.1px}.brand small{display:block;font-size:9px;letter-spacing:1.5px;text-transform:uppercase;margin-top:7px;font-weight:600;color:#8493aa}.brand-mark{width:40px;height:42px;background:var(--blue);border-radius:11px;display:flex;align-items:center;justify-content:center;color:#fff;box-shadow:0 5px 10px #2563eb16}.brand-mark svg{width:24px;height:24px}
+.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;padding:10px 17px;border-radius:8px;border:1px solid #dce3ee;background:white;font-size:12px;font-weight:650;white-space:nowrap;transition:background .15s,transform .15s}.btn:hover{background:#f5f8fd}.btn.primary{color:#fff;background:var(--blue);border-color:var(--blue);box-shadow:0 3px 6px #2563eb12}.btn.primary:hover{background:var(--blue-dark)}.btn.light{background:var(--light);border-color:#dfebff;color:var(--blue)}.btn.small{min-height:34px;padding:7px 11px;font-size:11px}.btn svg{width:16px;height:16px}.btn.danger{color:#b64747}.wide{width:100%}.icon-btn{display:inline-flex;align-items:center;justify-content:center;background:transparent;border:0;border-radius:7px;padding:7px;color:#8290a5}.icon-btn:hover{background:var(--light);color:var(--blue)}.icon-btn svg{width:18px;height:18px}.text-btn{border:0;background:transparent;padding:0;color:var(--blue);font-size:12px;font-weight:600;display:inline-flex;align-items:center;gap:6px}.text-btn svg{width:15px;height:15px}.badge,.status{display:inline-flex;align-items:center;gap:5px;border-radius:5px;padding:5px 8px;font-size:10px;font-weight:650;line-height:1;white-space:nowrap}.badge.neutral{background:#eff3f8;color:#718098}.badge.blue{color:#2563eb;background:#edf4ff}.badge.purple{color:#8063bb;background:#f3effb}.badge.amber{color:#a78126;background:#fff7df}.status.ready{color:var(--green);background:#e9f7f2}.status.draft{color:#9a7a37;background:#fff6df}.dot{width:5px;height:5px;background:currentColor;border-radius:50%}
+label{display:block;font-size:12px;font-weight:650;margin:0 0 8px}input:not([type=checkbox]):not([type=radio]):not([type=file]),select,textarea{width:100%;border:1px solid #dce3ed;padding:12px 13px;border-radius:8px;background:white;min-height:43px;color:var(--ink);transition:border-color .15s;outline-color:var(--blue)}input:focus,select:focus,textarea:focus{border-color:var(--blue)}input::placeholder,textarea::placeholder{color:#a3adbc}textarea{resize:vertical;line-height:1.65}input[type=checkbox]{accent-color:var(--blue);width:15px;height:15px;flex-shrink:0;cursor:pointer}.check-label{display:flex;align-items:center;gap:7px;font-weight:500;margin:0;line-height:1.6}.field{margin-bottom:22px}.field small{display:block;line-height:1.6;margin-top:7px}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}.error{color:#c35252;font-size:12px;margin-top:10px}.inline-note{display:flex;gap:9px;padding:13px 15px;background:#f5f8fc;border-radius:8px;font-size:11px;line-height:1.75;color:var(--muted)}.inline-note svg{width:16px;height:16px;flex-shrink:0;margin-top:2px;color:var(--blue)}
+.login-layout{min-height:100vh;display:grid;grid-template-columns:55% 45%;background:white}.login-story{padding:44px 8%;background:#f0f6ff;display:flex;flex-direction:column;position:relative;overflow:hidden}.login-story:after{content:"";position:absolute;right:-260px;bottom:-370px;width:720px;height:720px;border:1px solid #dce9fc;border-radius:50%;pointer-events:none}.login-copy{margin:auto 0;padding:54px 0 45px;position:relative;z-index:1}.eyebrow{font-size:9px;font-weight:750;color:var(--blue);letter-spacing:1.6px}.login-copy h1{font-size:42px;line-height:1.22;letter-spacing:-1.6px;margin:22px 0}.login-copy>p{font-size:14px;max-width:420px;color:#74849b}.login-diagram{margin:35px 0 28px;width:390px;max-width:100%;position:relative}.mini-source,.mini-output{display:flex;align-items:center;gap:13px;padding:16px 18px;background:white;border:1px solid #e3ebf8;border-radius:11px;box-shadow:0 5px 10px #24457604;font-weight:650;font-size:12px}.mini-source{margin-right:30px}.mini-output{margin-left:30px}.mini-source small,.mini-output small{display:block;margin-top:5px;font-size:10px;font-weight:450}.mini-check{margin-left:auto;color:#31a287;background:#ecf8f3;width:22px;height:22px;text-align:center;border-radius:50%;line-height:22px}.connector{height:43px;display:flex;align-items:center;justify-content:center;gap:12px;color:var(--blue)}.connector i{display:block;width:1px;height:11px;background:#b3c8ee}.connector svg{width:24px;height:24px}.output-icon{background:#ebf3ff;border-radius:8px;padding:10px;color:var(--blue)}.mini-output .status{margin-left:auto}.login-benefits{display:flex;flex-direction:column;gap:13px;color:#607594;font-size:11px}.login-benefits>span{display:flex;align-items:center;gap:9px}.login-benefits svg{width:16px;height:16px;color:#6b8cc4}.login-footer{position:relative;z-index:1;font-size:8px;color:#8ba0bc;letter-spacing:1px;display:flex;justify-content:space-between;gap:12px}.login-footer span{letter-spacing:0}.login-panel{display:flex;align-items:center;justify-content:center;padding:45px}.login-form-wrap{width:360px;max-width:100%}.login-form-wrap h2{font-size:26px;margin-top:22px;line-height:1.3}.login-form-wrap>p{font-size:12px;margin:12px 0 30px}.login-form-wrap form>label{margin-top:20px}.password-field{position:relative}.password-field input{padding-right:45px!important}.password-field button{position:absolute;right:5px;top:6px;background:none;border:0;padding:6px;color:#929eaf}.password-field svg{width:18px;height:18px}.login-small{display:flex;align-items:center;justify-content:space-between;font-size:10px;color:#8e9aad;margin:18px 0 26px}.login-small label{font-size:10px;font-weight:500}.login-small input{width:13px;height:13px}.demo-login{margin-top:26px;display:flex;gap:10px;border:1px solid var(--line);border-radius:9px;padding:14px}.demo-login>svg{color:var(--blue);width:17px;height:17px;flex-shrink:0;margin-top:2px}.demo-login p{font-size:10px;line-height:1.8;color:#8390a2}.login-form-wrap .login-bottom{margin-top:46px;font-size:10px;text-align:center;color:#a3adbc}.login-bottom span{margin-left:6px;color:#6c86ad}
+.app{display:flex;min-height:100vh}.sidebar{width:238px;flex-shrink:0;background:white;position:fixed;inset:0 auto 0 0;border-right:1px solid var(--line);padding:29px 18px 14px;display:flex;flex-direction:column;z-index:5}.sidebar>.brand{margin:0 13px 26px;font-size:14px}.sidebar .brand b{font-size:12px}.sidebar .brand-mark{width:35px;height:38px;border-radius:9px}.sidebar .brand small{font-size:8px}.workspace{display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:9px;padding:11px 10px;margin-bottom:30px;font-size:11px;font-weight:650}.workspace-icon{display:flex;align-items:center;justify-content:center;background:#eef3fa;border-radius:7px;width:29px;height:29px;color:#7086a6}.workspace small{display:block;font-weight:450;font-size:9px;margin-top:3px}.workspace>svg{width:13px;height:13px;margin-left:auto;color:#94a1b4}.nav-label{font-size:8px;font-weight:700;color:#a0aabc;letter-spacing:1.5px;margin:0 12px 14px}nav{display:flex;flex-direction:column;gap:5px}nav button{display:flex;align-items:center;gap:11px;padding:13px 13px;border:0;background:none;border-radius:8px;color:#7b879b;font-size:12px;text-align:left;font-weight:550;width:100%}nav button svg{width:18px;height:18px;color:#8995a9}nav button:hover{background:#f6f9fe}nav button.active{background:#edf4ff;color:#2563eb;font-weight:650}nav button.active svg{color:#2563eb}.nav-count{font-size:9px;background:#eef2f7;padding:3px 6px;border-radius:4px;margin-left:auto;color:#8895a9}.active .nav-count{background:#dceaff;color:#2563eb}.sidebar-help{margin: auto 0 16px;border:1px solid #e5edf9;background:#f8fbff;border-radius:10px;padding:16px 13px}.sidebar-help>svg{color:#7091c2;width:18px;height:18px;display:block;margin-bottom:11px}.sidebar-help b{font-size:11px;font-weight:650}.sidebar-help p{font-size:10px;line-height:1.7;margin:8px 0 12px}.sidebar-help button{display:flex;align-items:center;gap:7px;color:var(--blue);font-size:10px;font-weight:650;border:0;padding:0;background:none}.sidebar-help button svg{width:13px;height:13px}.profile{display:flex;gap:9px;align-items:center;padding:14px 5px 0;border-top:1px solid var(--line)}.avatar{height:32px;width:32px;background:#edf3ff;color:#527fc8;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:650}.profile b{font-size:11px;font-weight:650}.profile small{display:block;font-size:9px;margin-top:4px}.profile>.icon-btn{margin-left:auto}
+.workspace-main{margin-left:238px;width:calc(100% - 238px);min-height:100vh;display:flex;flex-direction:column}.topbar{height:72px;display:flex;justify-content:space-between;align-items:center;background:white;border-bottom:1px solid var(--line);padding:0 34px;gap:15px}.breadcrumb{font-size:11px;color:#94a0b1;white-space:nowrap}.breadcrumb span{margin:0 10px;color:#c1c9d5}.breadcrumb b{color:#64738a;font-weight:550}.topbar-right{display:flex;align-items:center;gap:19px;font-size:10px;color:#8b97a9}.demo-indicator{display:flex;align-items:center;gap:6px}.demo-indicator i{width:5px;height:5px;border-radius:50%;background:#d6a34b}.demo-strip{display:flex;align-items:center;gap:9px;margin:23px 34px 0;padding:10px 13px;border:1px solid #e1ebfb;background:#f0f6ff;border-radius:7px;font-size:10px;color:#7b91b2;line-height:1.5}.demo-strip svg{width:14px;height:14px;color:#7193c6}.demo-strip-tag{margin-left:auto;font-size:8px;letter-spacing:1px;font-weight:700;color:#7b96be}.app main{padding:28px 34px 30px;width:100%;max-width:1500px;align-self:center}.page-head{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:25px}.page-head p{font-size:12px;margin-top:8px}.head-actions{display:flex;gap:9px;align-items:center}.app-footer{display:flex;gap:9px;align-items:center;flex-wrap:wrap;margin: auto 34px 0;padding:18px 0;border-top:1px solid var(--line);font-size:9px;color:#99a4b5}.app-footer>span:first-child{color:#7493c3}.app-footer>span:last-child{margin-left:auto;font-size:8px}.card{background:white;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}.card-head{padding:21px 23px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:10px}.card-head h3{font-size:14px}.card-head p{font-size:10px;margin-top:5px}.card-body{padding:23px}.hero{position:relative;display:grid;grid-template-columns:1.1fr 1fr;background:#edf4ff;border:1px solid #dfeaff;border-radius:14px;padding:30px 30px 29px;align-items:center;gap:15px;min-height:245px;margin-bottom:23px}.hero .eyebrow{font-size:8px;letter-spacing:1.4px}.hero h2{font-size:31px;line-height:1.23;letter-spacing:-1px;margin:15px 0 10px}.hero p{font-size:11px;max-width:375px;color:#7e91ad}.hero .head-actions{margin-top:21px}.hero-art{position:relative;justify-self:center;width:310px;max-width:100%}.hero-art .mini-source{font-size:10px;padding:13px;max-width:230px;transform:rotate(-3deg);margin-right:0}.hero-art .mini-source+.mini-source{position:relative;margin-top:8px;margin-left:25px;transform:rotate(1deg)}.hero-art .mini-source small{font-size:8px}.hero-art .file-icon{width:29px;height:34px;font-size:8px}.hero-art .connector{height:30px;margin-left:80px}.hero-art .mini-output{margin-left:45px;padding:13px;font-size:10px;position:relative;z-index:2;box-shadow:0 7px 15px #2563eb08}.hero-art .mini-output small{font-size:8px}.hero-art .output-icon{padding:8px}.hero-art .output-icon svg{width:17px;height:17px}.hero-art:before{content:"";position:absolute;border:1px dashed #c3d6f4;border-radius:50%;height:245px;width:245px;top:-10px;right:10px}
+.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:23px}.metric{background:white;border:1px solid var(--line);border-radius:11px;padding:19px 19px 16px;position:relative}.metric>span{font-size:10px;color:#8c98aa}.metric strong{display:block;font-size:27px;letter-spacing:-1px;font-weight:650;margin:10px 0 8px}.metric small{font-size:9px;color:#9aa5b5}.metric i{position:absolute;right:16px;top:16px;background:#f2f6fc;border-radius:8px;padding:8px;color:#7f9bc5}.metric i svg{width:16px;height:16px}.setup-row{padding:17px 21px;display:flex;align-items:center;gap:24px;margin-bottom:23px}.setup-row>b{font-size:11px;white-space:nowrap}.steps{display:flex;justify-content:space-between;width:100%;gap:12px}.step{display:flex;align-items:center;gap:9px;font-size:10px;color:#8a98ac;background:none;border:0;padding:0;text-align:left}.step>i{height:25px;width:25px;display:flex;align-items:center;justify-content:center;border:1px solid #dfe7f3;border-radius:50%;font-size:9px;font-style:normal;color:#8b9cb6;background:#fafcff}.step.done>i{background:#ebf8f1;color:#3b9a77;border-color:#d9efdf}.step small{font-size:8px;display:block;margin-top:4px}.step-arrow{color:#c2cddd;font-size:15px}.dashboard-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:21px;margin-bottom:23px}.empty{display:flex;flex-direction:column;align-items:center;text-align:center;padding:36px 25px;color:#8090a6}.empty-icon{color:#8da9d6;background:#f2f7fe;width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;margin-bottom:14px}.empty-icon svg{width:24px;height:24px}.empty h3{font-size:13px;color:#596d8b;margin-bottom:8px}.empty p{font-size:10px;max-width:310px;margin-bottom:18px}.schedule-mini{padding:22px}.schedule-mini .clock-circle{background:#edf4ff;color:#7499ce;display:inline-flex;padding:11px;border-radius:50%;margin-bottom:17px}.schedule-mini h3{font-size:14px;margin-bottom:8px}.schedule-mini p{font-size:10px;line-height:1.75}.schedule-mini>.btn{margin-top:18px}.schedule-meta{border-top:1px solid var(--line);margin-top:17px;padding-top:15px;display:flex;justify-content:space-between;font-size:10px;color:#8491a5}.schedule-meta b{font-size:10px;color:#566e91;font-weight:600}.section-heading{display:flex;justify-content:space-between;align-items:center;margin:26px 0 15px;gap:12px}.section-heading p{font-size:10px;margin-top:6px}.section-heading h3{font-size:14px}.match-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.match-card{padding:18px}.match-card .pair-names{display:flex;flex-direction:column;gap:10px;font-size:11px;line-height:1.5;font-weight:600}.pair-names span{display:flex;align-items:center;gap:8px}.pair-names svg{width:15px;height:15px;color:#93a7c5}.match-tags{display:flex;gap:5px;flex-wrap:wrap;margin:15px 0}.tag{display:inline-block;font-size:9px;color:#8493a8;background:#f4f6fa;border-radius:4px;padding:4px 6px}.match-card .match-footer{display:flex;justify-content:space-between;align-items:center;gap:8px;border-top:1px solid var(--line);padding-top:13px}.match-footer small{font-size:9px}
+.file-icon{width:34px;height:40px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:6px;background:#eef2f7;font-size:9px;font-weight:700;color:#8290a4;border:1px solid #e6ebf3}.file-icon.pdf{color:#d47c7c;background:#fff2f2;border-color:#fae8e8}.file-icon.pptx{color:#c58e5d;background:#fff5ea;border-color:#f8eadb}.file-icon.docx{color:#6e94d6;background:#f0f5ff;border-color:#e2eafb}.file-icon.txt,.file-icon.md{color:#689d86;background:#eef9f3;border-color:#def0e5}.upload-box{border:1.5px dashed #c9d9ef;border-radius:12px;background:#f9fbff;text-align:center;padding:31px 24px;margin-bottom:18px;transition:background .15s}.upload-box.drag{background:#eaf2ff;border-color:var(--blue)}.upload-symbol{display:inline-flex;padding:12px;background:#eaf2ff;border:1px solid #deebff;color:#7299d5;border-radius:12px;margin-bottom:14px}.upload-box h3{font-size:14px;margin-bottom:8px}.upload-box p{font-size:10px;margin-bottom:17px}.upload-box .upload-limit{font-size:9px;margin:11px 0 0}.toolbar{padding:17px 21px;display:flex;justify-content:space-between;gap:15px;align-items:center;border-bottom:1px solid var(--line)}.toolbar h3{font-size:13px}.toolbar .toolbar-controls{display:flex;gap:10px;max-width:520px;width:55%}.search{position:relative;width:100%;max-width:280px}.search>svg{position:absolute;left:11px;top:11px;width:15px;height:15px;color:#9aa7ba}.search input{padding:9px 12px 9px 34px!important;font-size:10px;min-height:35px!important}.toolbar select{padding:8px 11px;font-size:10px;min-height:35px;width:155px}.table-wrap{overflow:auto}table{border-collapse:collapse;width:100%;text-align:left}th{font-size:9px;font-weight:650;color:#9aa6b7;background:#fbfcfe;padding:13px 21px;border-bottom:1px solid var(--line);white-space:nowrap}td{padding:17px 21px;border-bottom:1px solid #eff2f7;font-size:10px;color:#8390a4;vertical-align:middle}tbody tr:last-child td{border-bottom:0}.file-name{display:flex;gap:12px;align-items:center;min-width:200px}.file-name b{font-size:11px;display:block;font-weight:600;color:#455a78;line-height:1.5;max-width:280px;overflow-wrap:anywhere}.file-name small{font-size:9px;display:block;margin-top:5px}.table-actions{white-space:nowrap;text-align:right}.table-note{border-top:1px solid var(--line);font-size:9px;color:#9aa7ba;padding:13px 21px}.notice-row{display:flex;align-items:center;gap:10px;font-size:10px;color:#8396b2;background:#edf4ff;border:1px solid #e0eafb;border-radius:8px;padding:12px 15px;margin-bottom:20px}.notice-row svg{width:15px;height:15px;flex-shrink:0}.notice-row button{margin-left:auto;white-space:nowrap;font-size:10px}.two-column{display:grid;grid-template-columns:1.55fr 1fr;align-items:start;gap:23px}.form-card .card-body{padding:25px}.form-section-title{font-size:11px;font-weight:700;color:#4c6280;margin-bottom:21px}.form-footer{border-top:1px solid var(--line);padding:17px 25px;display:flex;justify-content:space-between;align-items:center;gap:15px}.form-footer small{font-size:9px;line-height:1.6}.side-card{padding:23px}.side-card h3{font-size:13px;margin-bottom:12px}.side-card p{font-size:11px;margin-bottom:18px}.side-list{margin:0;padding:0;list-style:none;counter-reset:steps}.side-list li{counter-increment:steps;display:flex;align-items:flex-start;gap:11px;font-size:11px;color:#7c8da5;padding:12px 0;border-bottom:1px solid #f0f3f8;line-height:1.7}.side-list li:before{content:counter(steps);font-size:9px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:#edf4ff;color:#7b9ac7;flex-shrink:0;width:22px;height:22px}.side-list li:last-child{border-bottom:0}.mode-box{display:flex;gap:12px;background:#f7faff;border:1px solid #e3ecfa;border-radius:10px;padding:16px;margin-bottom:26px}.mode-box>span{background:#e9f2ff;color:#6d95d1;border-radius:8px;padding:9px;height:38px}.mode-box b{font-size:11px}.mode-box p{font-size:10px;line-height:1.7;margin-top:5px}.mode-box .badge{margin-left:auto;height:22px;font-size:8px}.output-checks{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:16px;border:1px solid var(--line);border-radius:8px}.output-checks label{font-size:11px}.switch-row{display:flex;justify-content:space-between;align-items:center;padding:18px;background:#f8fbff;border:1px solid #e6eefb;border-radius:9px;margin-bottom:25px}.switch-row b{font-size:12px}.switch-row p{font-size:10px;margin-top:5px}.switch{width:35px;height:20px;position:relative;display:inline-flex}.switch input{width:100%;height:100%;opacity:0;position:absolute;z-index:1;margin:0}.switch i{position:absolute;inset:0;background:#d7dfeb;border-radius:20px;transition:background .2s}.switch i:after{content:"";height:14px;width:14px;background:white;border-radius:50%;position:absolute;left:3px;top:3px;transition:transform .2s}.switch input:checked+i{background:var(--blue)}.switch input:checked+i:after{transform:translateX(15px)}.next-run{margin:19px 0;padding:16px;border:1px solid #dfebfb;background:#f4f8ff;border-radius:9px}.next-run small{font-size:9px}.next-run strong{display:block;font-size:12px;line-height:1.7;color:#5a78a2;margin-top:7px}.schedule-tip{padding:16px;background:#fafbfd;border:1px solid var(--line);border-radius:8px;font-size:10px;line-height:1.8;color:#8b98ab}
+.results-summary{display:flex;gap:7px;margin-top:13px}.result-list{padding:0 21px}.result-row{display:flex;align-items:center;gap:15px;padding:21px 0;border-bottom:1px solid var(--line)}.result-row:last-child{border:0}.result-cover{width:46px;height:52px;background:#edf5ff;border:1px solid #e3edfc;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0;color:#7297ce}.result-main{flex:1;min-width:0}.result-title{font-size:12px;color:#455a79;font-weight:650;background:none;border:0;padding:0;text-align:left;line-height:1.55}.result-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:7px;color:#98a4b5;font-size:9px}.result-meta .tag{padding:3px 5px;font-size:8px}.result-actions{display:flex;gap:7px;align-items:center}.mini-result{display:flex;align-items:center;gap:11px;padding:18px 22px;border-bottom:1px solid #f0f3f8}.mini-result:last-child{border:0}.mini-result .result-cover{width:35px;height:40px}.mini-result .result-cover svg{width:18px;height:18px}.mini-result button{border:0;background:transparent;font-size:11px;text-align:left;padding:0;font-weight:600;line-height:1.5;color:#526986}.mini-result small{font-size:9px;display:block;margin-top:5px}.mini-result .status{margin-left:auto;font-size:8px}.mini-result>div:nth-child(2){min-width:0}
+dialog{padding:0;border:1px solid #e6ebf2;border-radius:15px;box-shadow:0 28px 95px #142d5038;width:740px;max-width:calc(100vw - 30px);max-height:92vh;color:var(--ink);overflow:hidden;background:white}dialog::backdrop{background:#142d5070;backdrop-filter:blur(3px)}dialog.preview{width:1030px}.modal-head{padding:23px 25px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:15px;align-items:flex-start}.modal-head h2{font-size:20px;letter-spacing:-.5px}.modal-head p{font-size:10px;line-height:1.7;margin-top:7px}.modal-body{padding:24px 25px;max-height:65vh;overflow:auto}.modal-foot{display:flex;align-items:center;justify-content:flex-end;gap:9px;border-top:1px solid var(--line);padding:16px 25px;background:#fff}.modal-foot>small{margin-right:auto;font-size:9px;line-height:1.5}.source-choices{display:flex;flex-direction:column;gap:8px;margin:14px 0 20px}.source-choice{display:flex;align-items:center;gap:11px;padding:13px;border:1px solid var(--line);border-radius:8px;margin:0;font-weight:500;cursor:pointer}.source-choice:has(input:checked){border-color:#a6c4f5;background:#f8fbff}.source-choice.disabled{opacity:.5;cursor:default}.source-choice>div{flex:1;font-size:11px;line-height:1.7}.source-choice b{font-weight:600;display:block}.source-choice small{font-size:9px}.source-choice .file-icon{width:28px;height:33px;font-size:8px}.generate-summary{display:flex;align-items:center;gap:18px;padding:14px 15px;border-radius:8px;background:#f7faff;color:#91a0b7;font-size:10px}.generate-summary span{display:flex;align-items:center;gap:6px}.generate-summary svg{width:15px;height:15px}.progress-state{padding:55px 30px 45px;text-align:center}.progress-orb{display:inline-flex;width:64px;height:64px;align-items:center;justify-content:center;color:var(--blue);background:#edf5ff;border-radius:18px;margin-bottom:22px}.progress-orb svg{width:30px;height:30px;animation:pulse 1.3s ease-in-out infinite}.progress-state h3{font-size:19px;margin-bottom:12px}.progress-state p{font-size:11px}.progress-track{width:290px;max-width:90%;height:5px;background:#edf1f8;border-radius:5px;overflow:hidden;margin:25px auto 16px}.progress-track i{display:block;background:var(--blue);height:100%;width:5%;transition:width .4s;border-radius:5px}.progress-state small{font-size:9px}@keyframes pulse{50%{transform:scale(.87);opacity:.6}}
+.preview-top{display:flex;align-items:center;gap:7px;font-size:10px;color:#96a2b4;margin-bottom:12px}.preview-layout{display:grid;grid-template-columns:1fr 226px;gap:27px}.prose h1{font-size:25px;margin-bottom:18px;line-height:1.35}.prose h2{font-size:15px;margin:25px 0 10px;letter-spacing:-.2px}.prose p,.prose li{font-size:12px;color:#6f819b;line-height:1.9;white-space:pre-line;overflow-wrap:anywhere}.prose ul,.prose ol{padding-left:19px}.prose .ref-line{font-size:9px;color:#a3afbe;margin-top:8px}.quiz-item{border:1px solid var(--line);padding:14px;border-radius:8px;margin:12px 0}.quiz-item strong{font-size:11px;display:block;font-weight:600;line-height:1.7}.quiz-item ol{list-style:upper-alpha;font-size:11px}.quiz-item li{font-size:11px}.quiz-item details{font-size:10px;color:#668e7e;margin-top:8px}.preview-side{padding:17px;background:#f8faff;border:1px solid #e4ecf9;border-radius:10px;height:max-content;position:sticky;top:0}.preview-side h3{font-size:11px;margin-bottom:15px}.preview-side .detail-label{font-size:8px;color:#a0adbd;margin:17px 0 5px;letter-spacing:.5px;text-transform:uppercase}.preview-side b{font-size:10px;font-weight:600;display:block;line-height:1.7;overflow-wrap:anywhere}.preview-source{padding:9px 0;border-bottom:1px solid #e8eef8;font-size:10px;line-height:1.7;color:#7f93af}.preview-source:last-child{border:0}.preview-source svg{width:13px;height:13px;margin-right:5px}.preview-tabs{display:flex;gap:17px;border-bottom:1px solid var(--line);margin-bottom:21px}.preview-tabs button{padding:0 0 11px;background:none;border:0;font-size:11px;color:#8e9bb0;border-bottom:2px solid transparent}.preview-tabs button.active{color:var(--blue);border-color:var(--blue);font-weight:650}.edit-area{font-size:12px!important;min-height:360px}.help-steps{display:flex;flex-direction:column;gap:22px}.help-step{display:flex;gap:14px}.help-step>span{background:#edf4ff;color:#5787d1;width:29px;height:29px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:12px}.help-step h3{font-size:12px;margin-bottom:5px}.help-step p{font-size:11px}.toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,20px);opacity:0;pointer-events:none;z-index:30;background:#203b62;color:white;box-shadow:0 7px 25px #142d5020;border-radius:9px;padding:14px 19px;max-width:calc(100vw - 35px);font-size:12px;line-height:1.6;transition:opacity .18s,transform .18s}.toast.show{opacity:1;transform:translate(-50%,0)}.toast.error{background:#9f4747}.muted{color:var(--muted)}.spacer{height:20px}.source-text{white-space:pre-wrap;font-size:12px;line-height:1.9;color:#6a7d98;background:#f8faff;padding:19px;border:1px solid #e4ecf9;border-radius:8px;max-height:350px;overflow:auto;overflow-wrap:anywhere}
+@media(min-width:1600px){.app main{padding-top:36px}.hero{min-height:280px}.hero h2{font-size:35px}.metrics{gap:20px}}
+@media(max-width:1120px){.sidebar{width:210px;padding-left:13px;padding-right:13px}.workspace-main{margin-left:210px;width:calc(100% - 210px)}.topbar{padding:0 24px}.demo-strip{margin-left:24px;margin-right:24px}.app main{padding-left:24px;padding-right:24px}.hero{padding:25px;grid-template-columns:1.2fr 1fr}.hero h2{font-size:27px}.hero-art{width:260px}.hero-art .mini-output{margin-left:20px}.hero .btn{padding:9px 11px;font-size:10px}.metric{padding:17px 14px}.metric i{right:11px;top:13px;padding:6px}.metrics{gap:11px}.setup-row{gap:14px;padding:16px}.step{font-size:9px}.step small{font-size:8px}.dashboard-grid{grid-template-columns:1.3fr 1fr;gap:16px}.two-column{grid-template-columns:1.5fr 1fr;gap:16px}.card-body,.form-card .card-body{padding:21px}.toolbar .toolbar-controls{width:65%}.page-head h1{font-size:26px}.login-copy h1{font-size:36px}.login-panel{padding:35px}.preview-layout{grid-template-columns:1fr 200px}}
+@media(max-width:900px){.hero-art{display:none}.hero{display:block}.hero p{max-width:470px}.metrics{grid-template-columns:1fr 1fr}.dashboard-grid,.two-column{grid-template-columns:1fr}.setup-row{align-items:flex-start;flex-direction:column}.setup-row>b{margin-bottom:7px}.schedule-mini .btn{width:100%}.match-grid{grid-template-columns:1fr}.topbar-right>#header-date{display:none}.preview-layout{grid-template-columns:1fr}.preview-side{position:static;display:none}.login-layout{grid-template-columns:1fr 1fr}.login-copy h1{font-size:30px}.login-story{padding:35px 30px}.login-footer span{display:none}.login-copy>p{font-size:12px}.login-benefits{font-size:10px}}
+@media(max-width:700px){.sidebar{position:static;width:100%;padding:15px 17px 0;display:block;border-right:0;border-bottom:1px solid var(--line)}.sidebar>.brand{margin:0 0 16px;font-size:14px}.sidebar .brand b{display:inline;margin-left:3px}.sidebar .brand small{margin-top:4px;letter-spacing:1px}.sidebar .brand-mark{width:31px;height:34px}.workspace,.nav-label,.sidebar-help,.profile{display:none}.sidebar nav{flex-direction:row;overflow:auto;gap:4px;margin:0 -3px;padding-bottom:9px}.sidebar nav button{font-size:9px;gap:5px;padding:10px;white-space:nowrap;width:auto}.sidebar nav svg{width:14px;height:14px}.nav-count{display:none}.app{display:block}.workspace-main{margin:0;width:100%}.topbar{height:50px;padding:0 19px}.breadcrumb{font-size:10px}.topbar-right{gap:10px;font-size:9px}.demo-strip{margin:17px 17px 0;font-size:9px;padding:9px 10px}.demo-strip-tag{display:none}.app main{padding:23px 17px}.page-head{flex-direction:column;gap:15px;margin-bottom:21px}.page-head h1{font-size:26px}.page-head p{font-size:11px}.page-head .head-actions{width:100%}.page-head .head-actions .btn{flex:1}.hero{padding:23px}.hero h2{font-size:27px}.hero p{font-size:10px}.metric strong{font-size:25px}.metric small{font-size:8px}.setup-row{padding:16px}.step-arrow{display:none}.steps{gap:8px}.step{align-items:flex-start;gap:6px}.step>i{width:21px;height:21px;flex-shrink:0}.step small{font-size:7px}.app-footer{margin-left:17px;margin-right:17px;font-size:8px}.app-footer>span:last-child{display:none}.toolbar{padding:16px;flex-direction:column;align-items:stretch;gap:12px}.toolbar .toolbar-controls{width:100%;max-width:none}.search{max-width:none}.result-list{padding:0 16px}.result-row{gap:10px;flex-wrap:wrap}.result-main{min-width:200px}.result-actions{margin-left:56px}.field-grid{grid-template-columns:1fr}.output-checks{grid-template-columns:1fr}.form-footer{padding:16px 20px;align-items:flex-start;flex-direction:column}.form-footer .btn{width:100%}.modal-head{padding:20px}.modal-head h2{font-size:19px}.modal-body{padding:20px;max-height:63vh}.modal-foot{padding:15px 20px;flex-wrap:wrap}.modal-foot>small{width:100%;margin-bottom:5px}.modal-foot .btn{flex:1;font-size:10px;padding:9px}.generate-summary{gap:10px;flex-wrap:wrap;font-size:9px}.login-layout{display:flex;flex-direction:column}.login-story{padding:22px 25px;background:#f3f7ff}.login-copy{padding:26px 0 16px}.login-copy h1{font-size:28px;margin:13px 0}.login-copy h1 br:last-child{display:none}.login-copy>p{font-size:11px}.login-diagram,.login-benefits,.login-footer{display:none}.login-story .brand b{display:inline;font-size:14px;margin-left:3px}.login-story .brand small{font-size:8px}.login-story .brand-mark{width:33px;height:36px}.eyebrow{font-size:7px}.login-panel{padding:30px 25px}.login-form-wrap{width:100%;max-width:400px}.login-form-wrap h2{font-size:23px;margin-top:16px}.login-form-wrap>p{margin-bottom:22px}.login-form-wrap .login-bottom{margin-top:30px}}
+@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
+@media(max-width:700px){.sidebar nav{flex-wrap:wrap;overflow:visible;align-items:flex-start}.sidebar nav>button{flex:1;justify-content:center}.sidebar nav .admin-menu{width:100%;margin:3px 0 0;padding:4px 0 0;border-top:1px solid var(--line)}.sidebar nav .admin-menu summary{padding:7px 10px;justify-content:flex-start;gap:8px;font-size:9px}.sidebar nav .admin-menu button{display:inline-flex;width:auto;padding:8px 10px;font-size:9px}.sidebar nav .admin-menu summary svg{width:12px;height:12px}}
+/* Content library and format-specific previews. */
+@media(max-width:600px){.overview-banner{display:grid!important;grid-template-columns:42px minmax(0,1fr);align-items:start!important}.overview-banner>div{min-width:0}.overview-banner>.status{grid-column:2;margin:0!important;justify-self:start}}
+.overview-banner{display:flex;align-items:center;gap:20px;background:#edf4ff;border:1px solid #dfeaff;border-radius:14px;padding:26px 28px;margin-bottom:24px}.overview-symbol{display:grid;place-items:center;width:55px;height:55px;border-radius:15px;color:var(--blue);background:white;flex-shrink:0}.overview-symbol svg{width:27px;height:27px}.overview-banner h2{font-size:23px;margin:9px 0 6px}.overview-banner p{font-size:11px}.overview-banner>.status{margin-left:auto}.metric strong.date-metric{font-size:21px;letter-spacing:-.7px;margin-top:16px}.summary-metrics{margin-bottom:26px}.format-summary{display:flex;justify-content:center;flex-wrap:wrap;gap:28px;padding:22px 0 4px;font-size:10px;color:var(--muted)}.format-summary>span{display:flex;align-items:center;gap:8px}.format-summary b{color:var(--ink);margin-left:4px}.type-badge{display:inline-flex;align-items:center;gap:5px;padding:5px 7px;border-radius:5px;font-size:9px;font-weight:650;white-space:nowrap;background:#edf4ff;color:#4872bd}.type-badge svg{width:12px;height:12px}.type-badge.pdf{background:#fff0ee;color:#c77b72}.type-badge.scorm{background:#f1edfc;color:#8a6dc0}.type-badge.audio{background:#eaf6f3;color:#518e80}.content-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;padding:22px}.content-card{border:1px solid var(--line);border-radius:11px;overflow:hidden;min-width:0;background:white}.content-cover{height:122px;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;background:#ecf3ff;color:#5d85c5}.content-cover>svg{width:30px;height:30px;stroke-width:1.3}.content-cover>span{font-size:11px;font-weight:650}.content-cover>small{position:absolute;top:11px;left:12px;font-size:7px;letter-spacing:1.2px;color:inherit;opacity:.65}.content-cover.pdf{background:#fbf1ef;color:#bd867d}.content-cover.audio{background:#edf7f4;color:#679b8d}.content-cover.scorm{background:#f2effa;color:#9a82bb}.content-card-body{padding:15px}.content-card-top{display:flex;align-items:center;justify-content:space-between;gap:5px;margin-bottom:12px}.content-card-top .status{font-size:8px;padding:5px 6px}.content-title{display:block;text-align:left;border:0;padding:0;background:none;font-weight:650;font-size:13px;line-height:1.55;letter-spacing:-.2px;min-height:61px;color:var(--ink);overflow-wrap:anywhere}.content-title:hover{color:var(--blue)}.content-card-body>p{font-size:9px;margin:9px 0 15px}.content-card-foot{border-top:1px solid var(--line);padding-top:13px;display:flex;align-items:center;justify-content:space-between;gap:8px}.content-card-foot>span{font-size:8px;color:#a0aabd}.content-card-foot .text-btn{font-size:10px}.content-card-foot svg{width:12px;height:12px}.supported-formats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:20px}.supported-formats>div{display:flex;align-items:center;gap:12px;border:1px solid var(--line);border-radius:10px;padding:17px;background:white}.supported-formats b{font-size:12px}.supported-formats small{display:block;font-size:9px;margin-top:6px}.format-icon{display:grid;place-items:center;width:38px;height:40px;border-radius:8px;background:#edf4ff;color:#5d85c5;flex-shrink:0}.format-icon.scorm{color:#8a6dc0;background:#f1edfc}.format-icon.audio{color:#518e80;background:#eaf6f3}.format-icon.pdf{color:#c77b72;background:#fff0ee}.file-icon.scorm{font-size:7px;background:#f1edfc;color:#8a6dc0}.file-icon.mp4,.file-icon.webm,.file-icon.mov,.file-icon.m4v{color:#5d85c5;background:#edf4ff}.file-icon.mp3,.file-icon.wav,.file-icon.m4a,.file-icon.ogg,.file-icon.aac,.file-icon.flac{background:#eaf6f3;color:#518e80}.preview-notice{display:flex;gap:9px;padding:12px 14px;background:#eef5ff;border-radius:7px;color:#6d86a8;font-size:11px;line-height:1.7;margin-bottom:18px}.preview-notice.concept{background:#fff8e9;color:#a88c55}.preview-notice svg{width:16px;height:16px;margin-top:2px}.storyboard-screen{padding:25px;background:#eef4ff;border:1px solid #dae7fa;border-radius:12px;min-height:290px;display:flex;flex-direction:column;align-items:center;text-align:center;justify-content:center;color:#3f659c}.storyboard-screen>span{font-size:8px;letter-spacing:1.6px}.storyboard-screen>div{margin:21px 0 13px}.storyboard-screen svg{width:38px;height:38px;stroke-width:1.3}.storyboard-screen h2{font-size:22px}.storyboard-screen p{font-size:11px;max-width:460px;margin:13px 0;color:#7c92b1}.storyboard-screen>small{font-size:8px;margin-top:16px}.scene-list{display:flex;gap:8px;overflow:auto;padding:14px 0 6px}.scene-list button{padding:11px;text-align:left;flex:0 0 128px;font-size:9px;line-height:1.6;background:white;border:1px solid var(--line);border-radius:7px;color:#8b98ab}.scene-list button b{display:block;margin-bottom:6px;font-size:8px}.scene-list button.active{border-color:#a7c4fa;background:#f3f7ff;color:var(--blue)}.script-details>summary{font-size:12px;color:var(--blue);cursor:pointer;margin-bottom:20px}.audio-preview{text-align:center;padding:26px;background:#f1f8f6;border-radius:12px;border:1px solid #e0efea}.audio-orb{display:grid;place-items:center;background:white;color:#619d89;border-radius:50%;height:58px;width:58px;margin:0 auto 18px}.audio-orb svg{width:27px;height:27px}.waveform{display:flex;justify-content:center;gap:4px;height:60px;align-items:center;margin:0 auto 20px;max-width:100%;overflow:hidden}.waveform i{width:3px;border-radius:4px;flex-shrink:0;background:#9bc7b8}.audio-preview h2{font-size:20px}.audio-preview p{font-size:11px;margin:12px auto 20px}.audio-preview .head-actions{justify-content:center}.audio-preview>small{display:block;font-size:9px;margin-top:15px}.scorm-preview-head{display:flex;gap:11px;align-items:center;padding:15px;background:#f3effb;color:#9377b8;border-radius:8px;margin-bottom:23px;font-size:12px}.scorm-preview-head svg{width:26px;height:26px}.scorm-preview-head small{display:block;font-size:9px;margin-top:5px}.scorm-preview>h2{font-size:23px}.scorm-preview>p{font-size:11px;margin:10px 0 20px}.chapter{border:1px solid var(--line);border-radius:8px;margin:10px 0;overflow:hidden}.chapter summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:11px;padding:15px;font-size:12px;font-weight:600;background:#fafbfe}.chapter summary>span{font-size:9px;background:#f0edf8;color:#9a83ba;padding:7px;border-radius:5px}.chapter>p{font-size:12px;padding:17px;white-space:pre-wrap}.source-player{display:block;width:100%;max-height:350px;margin:0 auto 20px;border-radius:8px}.upload-issues{font-size:12px;line-height:1.9;color:#b47a6a}
+@media(max-width:1250px){.content-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.content-title{min-height:42px}.supported-formats{gap:10px}.supported-formats>div{padding:12px;gap:8px}.supported-formats small{font-size:8px}.overview-banner h2{font-size:20px}}
+@media(max-width:900px){.overview-banner{align-items:flex-start;flex-wrap:wrap;padding:22px}.overview-banner>.status{margin:0 0 0 75px}.supported-formats{grid-template-columns:repeat(2,1fr)}.toolbar-controls{flex-wrap:wrap!important;gap:8px!important}.toolbar-controls>.search{flex-basis:100%}.toolbar-controls>select{flex:1}.format-summary{gap:14px}}
+@media(max-width:600px){.overview-banner{gap:14px;padding:19px}.overview-symbol{width:42px;height:44px}.overview-banner>div{flex:1}.overview-banner h2{font-size:19px;line-height:1.4}.overview-banner .eyebrow{font-size:6px;letter-spacing:1px}.overview-banner p{font-size:9px}.overview-banner>.status{margin:0 0 0 56px;font-size:9px}.content-grid{grid-template-columns:1fr;padding:16px;gap:17px}.content-cover{height:130px}.content-title{min-height:0;font-size:14px}.content-card-top .status{font-size:9px}.content-card-body{padding:17px}.format-summary{justify-content:flex-start}.format-summary>span{width:calc(50% - 14px);font-size:9px}.supported-formats>div{padding:12px}.supported-formats small{font-size:8px}.metric strong.date-metric{font-size:17px}.audio-preview{padding:22px 16px}.audio-preview .head-actions{flex-wrap:wrap}.audio-preview h2{font-size:19px}.storyboard-screen{min-height:290px;padding:24px 18px}.storyboard-screen h2{font-size:20px}.waveform{gap:3px}.upload-limit{line-height:1.9!important}.card-head{flex-wrap:wrap}.content-grid .text-btn{font-size:11px}}
+/* Brain and the L&D assistant workflow. */
+.journey-strip{display:flex;gap:15px;justify-content:space-between;flex-wrap:wrap;margin:0 0 24px;padding:0 3px;font-size:11px;color:#7a8ba5}.journey-strip>span{display:flex;align-items:center;gap:9px}.journey-strip b{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#eaf2ff;color:var(--blue);font-size:9px}.brain-banner{display:flex;align-items:center;gap:23px;padding:29px;background:#edf4ff;border:1px solid #dfeaff;border-radius:14px;margin-bottom:20px}.brain-symbol{height:76px;width:76px;border-radius:20px;background:white;color:var(--blue);display:grid;place-items:center;flex-shrink:0}.brain-symbol svg{width:42px;height:42px;stroke-width:1.25}.brain-banner h2{font-size:25px;margin:11px 0 9px}.brain-banner p{font-size:11px}.brain-formats{display:flex;gap:7px;margin-top:15px}.brain-context{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:22px 0}.brain-context>div{display:flex;align-items:center;gap:12px;padding:5px 3px;color:#7192be}.brain-context b{display:block;font-size:12px;color:#4a6285}.brain-context small{display:block;font-size:10px;margin-top:5px;line-height:1.7}.brain-selection{padding:13px 23px;background:#fbfcfe;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:15px;font-size:10px;color:var(--muted)}.brain-selection label{font-size:11px}.brain-topics{margin:26px 0 3px}.brain-topics h3{font-size:14px}.brain-topics p{font-size:10px;margin:7px 0 14px}.brain-topics>div{display:flex;flex-wrap:wrap;gap:7px}.upload-success{display:flex;align-items:center;gap:17px;padding:23px;margin-bottom:20px}.upload-success>span{padding:10px;background:#eaf6f2;color:#559a84;border-radius:50%}.upload-success h3{font-size:14px}.upload-success p{font-size:11px;margin-top:7px}.upload-success .btn{margin-left:auto}.ai-workspace{display:grid;grid-template-columns:1.05fr 1fr;gap:23px;align-items:start}.assistant-title{display:flex;gap:12px;align-items:center}.assistant-title>span{display:grid;place-items:center;width:38px;height:40px;border-radius:9px;background:#edf4ff;color:var(--blue)}.ai-messages{padding:24px 22px;max-height:450px;overflow:auto;min-height:215px}.ai-message{display:flex;align-items:flex-start;gap:10px;margin-bottom:18px}.ai-message:last-child{margin-bottom:0}.ai-message>span{display:grid;place-items:center;flex-shrink:0;width:25px;height:27px;border-radius:7px;background:#eaf2ff;color:#6f91c5}.ai-message svg{width:14px;height:14px}.ai-message p{background:#f5f8fd;border-radius:0 10px 10px;padding:14px;font-size:11px;line-height:1.85;color:#788da9;white-space:pre-wrap}.ai-message.user{flex-direction:row-reverse}.ai-message.user p{border-radius:10px 0 10px 10px;background:#eef4ff;color:#587cb2}.prompt-chips{display:flex;gap:7px;flex-wrap:wrap;padding:0 22px 20px}.prompt-chips button{font-size:9px;padding:8px 10px;border:1px solid #dfe9f8;border-radius:20px;background:white;color:#7390b7}.prompt-chips button:hover{background:#f0f6ff;color:var(--blue)}#ai-request-form{padding:20px 22px;border-top:1px solid var(--line);background:#fcfdff}#ai-request-form textarea{font-size:12px;min-height:110px}.ai-compose-footer{display:flex;gap:15px;align-items:center;justify-content:space-between;margin-top:14px}.ai-compose-footer small{font-size:9px;line-height:1.7}.ai-compose-footer .btn{font-size:11px;flex-shrink:0}.ai-disclosure{display:flex;align-items:flex-start;gap:8px;padding:17px 22px;font-size:9px;line-height:1.8;color:#9ba8bb;border-top:1px solid var(--line)}.ai-disclosure svg{width:13px;height:13px;margin-top:3px;flex-shrink:0}.ai-plan .card-body{padding:23px}.ai-plan label{font-size:11px}.ai-plan .field{margin-bottom:20px}.ai-plan .field-grid{gap:0 14px}.plan-source{display:flex;align-items:center;gap:10px;padding:14px;background:#f1f6ff;border-radius:8px;margin-bottom:21px}.plan-source>span{display:grid;place-items:center;width:33px;height:34px;border-radius:8px;background:white;color:#7c9bcc}.plan-source b{font-size:11px}.plan-source small{display:block;font-size:8px;line-height:1.6;margin-top:4px}.plan-source .text-btn{margin-left:auto;font-size:10px}.plan-actions{display:flex;gap:9px}.plan-actions .btn{flex:1;padding:10px;font-size:11px}.ai-plan .switch-row{padding:16px 0 20px;margin-top:0}.result-tabs{display:flex;gap:7px;border-bottom:1px solid #e5ebf4;margin-bottom:20px}.result-tabs button{background:none;border:0;border-bottom:2px solid transparent;font-size:12px;padding:11px 17px 14px;color:#92a0b6}.result-tabs button.active{color:var(--blue);border-color:var(--blue)}.result-tabs b{font-size:9px;background:#edf3ff;color:#85a0c7;padding:3px 5px;border-radius:4px;margin-left:5px}.research-list{padding:0 22px}.research-row{display:flex;align-items:center;gap:16px;padding:22px 0;border-bottom:1px solid var(--line)}.research-row:last-child{border-bottom:0}.research-row>span{display:grid;place-items:center;height:43px;width:43px;background:#f0f5fd;color:#819cc4;border-radius:9px;flex-shrink:0}.research-row h3{font-size:13px;margin-top:10px;line-height:1.6;overflow-wrap:anywhere}.research-row p{font-size:9px;margin-top:7px}.research-row>.btn{margin-left:auto;flex-shrink:0}.content-cover.text{background:#edf3fa;color:#849bb7}.type-badge.text{background:#edf3fa;color:#7993b7}.format-icon.text{background:#edf3fa;color:#849bb7}
+@media(max-width:1100px){.ai-workspace{grid-template-columns:1fr}.ai-messages{min-height:150px}.ai-plan .field-grid{grid-template-columns:1fr 1fr}.brain-banner h2{font-size:22px}}
+@media(max-width:700px){.sidebar nav{gap:4px}.sidebar nav>button{flex:1 0 auto;padding:9px;font-size:9px}.ai-workspace{gap:20px}.brain-context{grid-template-columns:1fr;gap:12px}.brain-selection{align-items:flex-start;flex-direction:column;gap:8px;padding:13px 17px}.brain-banner{padding:22px;gap:17px;align-items:flex-start}.brain-symbol{width:48px;height:50px;border-radius:12px}.brain-symbol svg{width:29px;height:29px}.brain-banner h2{font-size:21px;line-height:1.4}.brain-banner p{font-size:10px}.brain-banner .eyebrow{font-size:6px;letter-spacing:1.1px}.brain-formats{flex-wrap:wrap;gap:5px}.brain-banner>div{min-width:0}.journey-strip{display:grid;grid-template-columns:1fr 1fr;gap:14px;font-size:10px}.upload-success{flex-wrap:wrap;gap:13px;padding:20px}.upload-success>div{flex:1;min-width:180px}.upload-success .btn{width:100%;margin-left:0}.ai-plan .field-grid{grid-template-columns:1fr}.ai-messages{padding:20px 17px;max-height:340px}.ai-message p{font-size:11px;padding:12px}.prompt-chips{padding:0 17px 18px}#ai-request-form{padding:20px 17px}.ai-compose-footer{align-items:flex-start;flex-direction:column;gap:12px}.ai-compose-footer .btn{width:100%}.ai-disclosure{padding:17px}.plan-actions{flex-direction:column}.plan-actions .btn{width:100%}.ai-plan .card-body{padding:20px}.research-row{align-items:flex-start;flex-wrap:wrap;gap:12px}.research-row>div{flex:1;min-width:170px}.research-row>.btn{margin-left:55px}.research-list{padding:0 17px}.research-row h3{font-size:12px}.plan-source{gap:8px}.plan-source small{font-size:8px}.assistant-title{gap:8px}.assistant-title h3{font-size:13px}}
+/* Three simple screens: upload, the combined Brain and AI workspace, results. */
+.unified-workspace{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:22px;align-items:start}.compact-brain .card-head,.simple-ai .card-head{padding:19px 20px}.compact-brain .card-head>svg{color:#8ca6cd}.compact-brain .badge{margin-left:5px}.compact-brain-search{padding:17px 19px}.compact-brain-search .search{width:100%;max-width:none}.compact-brain .brain-selection{padding:12px 19px;font-size:9px}.compact-brain .brain-selection label{font-size:10px}.compact-source-list{max-height:450px;overflow:auto;padding:0 17px}.compact-source-row{display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--line);padding:15px 0;min-height:74px}.compact-source-row:last-child{border-bottom:0}.compact-source-row>input{margin:0;width:14px;height:14px}.compact-source-row .file-icon{width:30px;height:35px;font-size:7px;flex-shrink:0}.compact-source-name{min-width:0;flex:1}.compact-source-name b{display:block;font-size:11px;line-height:1.5;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.compact-source-name small{display:block;font-size:8px;margin-top:5px}.compact-source-row .icon-btn{padding:4px}.compact-source-row .icon-btn svg{width:14px;height:14px}.simple-ai #ai-request-form{padding:19px 20px;background:white;border:0}.simple-ai #ai-request-form textarea{min-height:85px;font-size:12px}.simple-ai .ai-compose-footer{margin-top:12px;gap:10px}.simple-ai .prompt-chips{padding:0;gap:6px}.simple-ai .prompt-chips button{padding:6px 9px;font-size:8px}.simple-ai .ai-compose-footer>.btn{min-height:32px;padding:7px 14px;font-size:10px}.compact-ai-reply{display:flex;gap:9px;padding:12px 15px;margin:0 20px 17px;background:#f3f7ff;border-radius:8px;color:#849cc0}.compact-ai-reply svg{width:14px;height:14px;margin-top:3px}.compact-ai-reply p{font-size:10px;line-height:1.8;color:#8195b3}.simple-plan{padding:17px 20px 18px;border-top:1px solid var(--line)}.simple-plan-row{display:grid;grid-template-columns:minmax(0,1fr) 100px;gap:13px}.simple-plan .field{margin-bottom:14px}.simple-plan label{font-size:10px}.simple-plan input:not([type=checkbox]),.simple-plan select,.simple-plan textarea{font-size:11px;min-height:38px;padding:10px 11px}.simple-plan #ai-count-help{font-size:8px;line-height:1.7;display:block;margin-top:-4px}.simple-options{margin:14px 0 0}.simple-options>summary{font-size:10px;color:#8a9cb7;cursor:pointer;padding:5px 0 11px}.simple-options[open]>summary{margin-bottom:7px}.simple-options small{font-size:8px}.simple-schedule-toggle{display:flex;justify-content:space-between;align-items:center;padding:13px 0 17px;border-top:1px solid #eff2f7;margin-top:6px}.simple-schedule-toggle label{font-size:11px;color:#647f9f}.simple-schedule-toggle>span{font-size:8px;color:#a3afbf}.simple-plan #schedule-fields{padding:0 0 7px}.simple-plan .field-grid{gap:13px}.simple-plan .plan-actions{gap:9px}.simple-plan .plan-actions .btn{font-size:11px;min-height:39px}.simple-saved-status{font-size:8px;color:#9aaac0;line-height:1.8;margin-top:12px}.simple-ai>.table-note,.compact-brain>.table-note{font-size:8px;line-height:1.8;padding:13px 19px}.sidebar .profile{margin-top:auto}
+@media(max-width:1000px){.unified-workspace{grid-template-columns:1fr}.compact-source-list{max-height:280px}.compact-source-row{min-height:65px;padding:12px 0}.simple-ai .ai-compose-footer{flex-direction:row;align-items:center}.simple-plan-row{grid-template-columns:minmax(0,1fr) 110px}.simple-plan .field-grid{grid-template-columns:1fr 1fr}}
+@media(max-width:700px){.sidebar nav>button{flex:1 0 0;justify-content:center}.unified-workspace{gap:18px}.compact-brain .card-head,.simple-ai .card-head{padding:17px}.compact-brain .brain-selection{flex-direction:row;gap:9px;padding:11px 17px}.compact-source-row{gap:8px}.compact-source-row .file-icon{width:27px;height:32px;font-size:6px}.compact-source-name b{font-size:10px}.compact-source-name small{font-size:7px}.simple-ai #ai-request-form{padding:17px}.simple-plan{padding:17px}.simple-ai .ai-compose-footer{align-items:flex-start;gap:8px}.simple-ai .ai-compose-footer>.btn{width:auto;flex-shrink:0}.simple-ai .prompt-chips{flex-direction:column;align-items:flex-start}.simple-plan-row{grid-template-columns:minmax(0,1fr) 90px}.simple-plan .plan-actions{flex-direction:row}.simple-plan .plan-actions .btn{font-size:10px;padding:9px 8px}.compact-ai-reply{margin-left:17px;margin-right:17px}.compact-ai-reply p{font-size:9px}.simple-plan .field-grid{grid-template-columns:1fr 1fr}}
+</style>
+</head>
+<body>
+<section id="login-view" class="login-layout">
+  <div class="login-story">
+    <a class="brand" href="#" aria-label="Learning Lab Express"><span class="brand-mark" data-icon="book"></span><span>Learning Lab <b>Express</b><small>by Bawana</small></span></a>
+    <div class="login-copy"><span class="eyebrow">BELAJAR BARU, TANPA MULAI DARI NOL</span><h1>Pengetahuan tim.<br>Ide baru.<br>Pembelajaran tanpa henti.</h1><p>Satukan materi dalam Brain, lalu minta AI mengembangkannya menjadi banyak konten pelatihan dan rencana riset.</p>
+      <div class="login-diagram" aria-hidden="true"><div class="mini-source"><span class="file-icon pdf">PDF</span><div>Materi pelatihan<small>Knowledge base · Brain</small></div><span class="mini-check">✓</span></div><div class="connector"><i></i><span data-icon="spark"></span><i></i></div><div class="mini-output"><span class="output-icon" data-icon="book"></span><div>Konten pembelajaran baru<small>Terstruktur · Relevan · Siap ditinjau</small></div><span class="status ready">Baru</span></div></div>
+      <div class="login-benefits"><span><i data-icon="upload"></i> Text, video, audio, dan SCORM</span><span><i data-icon="clock"></i> Jadwalkan konten & riset</span><span><i data-icon="download"></i> Buka dan download hasilnya</span></div>
+    </div>
+    <div class="login-footer">LEARNING LAB EXPRESS <span>Pengetahuan Anda. Kemungkinan baru.</span></div>
+  </div>
+  <div class="login-panel"><div class="login-form-wrap"><span class="badge neutral">Prototipe interaktif</span><h2>Selamat datang kembali</h2><p>Masuk untuk mengelola materi dan membuat modul pelatihan.</p>
+    <form id="login-form"><label for="login-email">Email</label><input id="login-email" type="email" autocomplete="username" value="wulan@perusahaan.id" required>
+    <label for="login-password">Password</label><div class="password-field"><input id="login-password" type="password" autocomplete="off" value="demo12345" minlength="4" required><button type="button" data-action="toggle-password" aria-label="Tampilkan password"><span data-icon="eye"></span></button></div>
+    <div class="login-small"><label class="check-label"><input type="checkbox" checked> Ingat sesi demo ini</label><span>Mode demo</span></div>
+    <button class="btn primary wide" type="submit">Masuk ke Learning Lab <span data-icon="arrow-right"></span></button><p id="login-error" class="error" role="alert"></p></form>
+    <div class="demo-login"><span data-icon="info"></span><p>Akun contoh sudah terisi. Klik <b>Masuk</b> untuk mencoba alurnya. Login dan proses AI pada prototipe ini berupa simulasi.</p></div>
+    <p class="login-bottom">Learning Lab Express <span>by Bawana</span></p>
+  </div></div>
+</section>
+<div id="app" class="app" hidden>
+  <aside class="sidebar">
+    <a class="brand" href="#" data-nav="sources"><span class="brand-mark" data-icon="book"></span><span>Learning Lab <b>Express</b><small>by Bawana</small></span></a>
+    <div class="workspace"><span class="workspace-icon">L</span><div>Ruang belajar<small>Workspace perusahaan</small></div><span data-icon="chevron"></span></div>
+    <div class="nav-label">RUANG KERJA</div>
+    <nav aria-label="Navigasi utama">
+      <button data-nav="sources"><span data-icon="upload"></span>Upload materi</button>
+      <button data-nav="brain"><span data-icon="brain"></span>Brain & AI<span class="nav-count" id="source-count">0</span></button>
+      <button data-nav="results"><span data-icon="book"></span>Hasil<span class="nav-count" id="module-count">0</span></button>
+    </nav>
+    <div class="profile"><span class="avatar">W</span><div><b id="profile-name">Wulan</b><small>Ruang belajar · Demo</small></div><button data-action="logout" class="icon-btn" aria-label="Keluar"><span data-icon="logout"></span></button></div>
+  </aside>
+  <div class="workspace-main">
+    <header class="topbar"><div class="breadcrumb">Ruang kerja <span>/</span> <b id="breadcrumb">Upload materi</b></div><div class="topbar-right"><span class="demo-indicator"><i></i> Mode demo</span><span id="header-date"></span><button class="icon-btn" data-action="help" aria-label="Panduan"><span data-icon="help"></span></button></div></header>
+    <div class="demo-strip"><span data-icon="info"></span><span>Anda sedang mencoba prototipe. Proses AI dan jadwal disimulasikan; data tersimpan di browser ini.</span><span class="demo-strip-tag">DEMO</span></div>
+    <main id="view-content" tabindex="-1"></main>
+    <footer class="app-footer">Learning Lab Express <span>by Bawana</span><span>Ruang kerja untuk pengetahuan yang terus berkembang.</span></footer>
+  </div>
+</div>
+<dialog id="modal" aria-labelledby="modal-title"><div id="modal-content"></div></dialog>
+<div id="toast" class="toast" role="status" aria-live="polite"></div>
+<input id="file-input" type="file" accept=".zip,.mp4,.webm,.mov,.m4v,.mp3,.wav,.m4a,.ogg,.aac,.flac,.pdf,.docx,.pptx,.txt,.md" multiple hidden>
+<script>(function(root){
+  const Core = {};
+  Core.escape=s=>String(s??'').replace(/[&<>"']/g,c=>({'&':'&amp;','<':'&lt;','>':'&gt;','"':'&quot;',"'":'&#39;'}[c]));
+  const stop=new Set('yang dan untuk dengan dalam pada adalah ini itu dari atau sebagai dapat agar akan oleh ke di kita anda harus setiap materi panduan pelatihan modul proses suatu lebih melalui serta saat secara semua tersebut menjadi juga tentang the and with for this that from into your you are dalam menggunakan gunakan membantu memiliki merupakan sesuai berdasarkan'.split(' '));
+  function words(s){return [...new Set((String(s).toLowerCase().match(/[a-zà-ž]{4,}/g)||[]).filter(w=>!stop.has(w)))];}
+  Core.matchSources=function(sources){
+    const readable=sources.filter(s=>s.text?.trim()); const pairs=[];
+    for(let i=0;i<readable.length;i++)for(let j=i+1;j<readable.length;j++){
+      const a=readable[i],b=readable[j],aw=new Set(words(a.title+' '+a.text)),shared=words(b.title+' '+b.text).filter(w=>aw.has(w));
+      const tags=(a.tags||[]).filter(t=>(b.tags||[]).includes(t));
+      if(shared.length||tags.length)pairs.push({a:a.id,b:b.id,shared:[...new Set([...tags,...shared])],score:shared.length+tags.length*3});
+    }
+    return pairs.sort((a,b)=>b.score-a.score);
+  };
+  Core.autoSources=function(sources,preferredIDs=[],iteration=0){
+    const readable=sources.filter(s=>s.text?.trim());
+    const actual=readable.filter(s=>!s.sample),pool=actual.length?actual:readable;
+    if(!pool.length)return [];
+    const preferred=pool.filter(s=>preferredIDs.includes(s.id));
+    const pairs=Core.matchSources(pool).filter(p=>!preferred.length||preferredIDs.includes(p.a)||preferredIDs.includes(p.b));
+    if(pairs.length){const pair=pairs[iteration%pairs.length];return pool.filter(s=>s.id===pair.a||s.id===pair.b);}
+    return [preferred[0]||pool[iteration%pool.length]];
+  };
+  Core.contentType=function(source){
+    const name=typeof source==='string'?source:source.originalName||source.format||'';
+    const ext=name.toLowerCase().split('.').pop();
+    if(['zip','scorm'].includes(ext))return 'scorm';
+    if(['mp4','webm','mov','m4v','video'].includes(ext))return 'video';
+    if(['mp3','wav','m4a','ogg','aac','flac','audio'].includes(ext))return 'audio';
+    if(['pdf','docx','pptx','txt','md'].includes(ext))return 'pdf';
+    return null;
+  };
+  Core.contentJobs=function(sources,preferredIDs=[],iteration=0){
+    const actual=sources.filter(s=>!s.sample),pool=actual.length?actual:sources;
+    const groups=new Map();
+    pool.forEach(s=>{const type=Core.contentType(s);if(type){if(!groups.has(type))groups.set(type,[]);groups.get(type).push(s);}});
+    return [...groups].filter(([,group])=>!preferredIDs.length||group.some(s=>preferredIDs.includes(s.id))).map(([type,group])=>{
+      const preferred=group.filter(s=>preferredIDs.includes(s.id));
+      const anchor=preferred[0]||group[iteration%group.length];
+      const selected=anchor.text?.trim()?Core.autoSources(group.filter(s=>s.text?.trim()),[anchor.id],iteration):[anchor];
+      return {type,sources:selected};
+    });
+  };
+  Core.createContent=function(sources,settings={},iteration=0){
+    if(!sources.length)throw new Error('Tambahkan materi terlebih dahulu.');
+    const outputType=Core.contentType(sources[0]);
+    if(!outputType)throw new Error('Format materi belum didukung.');
+    const basis=sources.every(s=>s.text?.trim())?'text':'filename';
+    const prepared=sources.map(s=>s.text?.trim()?s:{...s,text:`Konsep pembelajaran untuk “${s.title}”. Ini contoh kerangka berdasarkan nama berkas; isi sumber belum dibaca. Tentukan tujuan belajar, rangkum konsep dari materi asli, lalu lengkapi contoh penerapan dan pertanyaan evaluasi setelah isi sumber tersedia.`});
+    const m=Core.createModule(prepared,settings,iteration);
+    return {...m,outputType,basis,notice:basis==='filename'?'Konsep demo berdasarkan nama berkas. Isi sumber belum dibaca atau dianalisis.':'Hasil simulasi dari teks materi. Tinjau sebelum digunakan.'};
+  };
+  Core.brainSources=function(sources){const own=sources.filter(s=>!s.sample);return own.length?own:sources;};
+  Core.planBrainBatch=function(sources,options={},iteration=0){
+    const count=Number(options.count??20);
+    if(!Number.isInteger(count)||count<1||count>50)throw new Error('Jumlah konten harus 1–50 per proses demo.');
+    const pool=Core.brainSources(sources).filter(s=>Core.contentType(s)&&(!options.sourceIDs?.length||options.sourceIDs.includes(s.id)));
+    if(!pool.length)throw new Error('Pilih materi yang masih tersedia di Brain.');
+    const formats=[...new Set(pool.map(s=>Core.contentType(s)==='pdf'?'text':Core.contentType(s)))];
+    const angles=['Panduan pemula','Studi kasus kerja','Checklist penerapan','Latihan pemahaman','Kesalahan yang perlu dihindari','Simulasi situasi kerja','Ringkasan konsep','Pertanyaan refleksi','Panduan diskusi tim','Tantangan praktik'];
+    return Array.from({length:count},(_,i)=>{const n=iteration+i,angle=angles[n%angles.length];return {type:formats[n%formats.length],sources:pool,angle,title:(options.topic||'Pembelajaran dari Brain')+': '+angle+' · '+(n+1)};});
+  };
+  Core.createBrainContent=function(job,settings={},iteration=0){
+    const m=Core.createContent(job.sources,{...settings,title:job.title},iteration);
+    m.outputType=job.type;m.angle=job.angle;
+    m.sections.push({title:'Fokus pengembangan: '+job.angle,body:'Gunakan konsep dari sumber-sumber di Brain untuk menyusun '+job.angle.toLowerCase()+'. Catat langkah, contoh, dan pertanyaan yang perlu ditinjau bersama pemilik materi. Kerangka ini merupakan simulasi dan perlu dikembangkan lebih lanjut.',sourceIds:m.sources.map(s=>s.id)});
+    if(m.basis==='filename')m.notice='Konsep demo dari Brain. Sebagian atau seluruh isi berkas belum dibaca; daftar sumber menunjukkan materi yang dipilih, bukan bukti analisis isi.';
+    return m;
+  };
+  Core.parseAIRequest=function(prompt,defaults={}){
+    const p=String(prompt).toLowerCase(),number=p.match(/(\d+)\s*(?:konten|materi|topik|ide|modul|draft)/),time=p.match(/(?:pukul|jam|at)\s*(\d{1,2})[:.](\d{2})/);
+    const research=/riset|research/.test(p),generate=/buat|generate|susun/.test(p);
+    const days=['minggu','senin','selasa','rabu','kamis','jumat','sabtu'];
+    const day=days.findIndex(d=>new RegExp(d==='minggu'?'setiap hari minggu':'setiap (?:hari )?'+d).test(p));
+    const frequency=/bulan/.test(p)?'monthly':/hari kerja/.test(p)?'workdays':day>=0||/mingguan|setiap minggu/.test(p)?'weekly':'daily';
+    return {...defaults,scope:/seluruh|semua/.test(p)?'all':defaults.scope||'all',prompt:String(prompt).trim(),count:number?Number(number[1]):/sebanyak/.test(p)?50:Number(defaults.count)||20,mode:research?(generate?'both':'research'):'generate',enabled:/setiap|jadwal|otomatis/.test(p),frequency,weekday:day>=0?day:Number(defaults.weekday??1),time:time?time[1].padStart(2,'0')+':'+time[2]:defaults.time||'09:00'};
+  };
+  Core.researchBrief=function(options,sources,iteration=0){
+    const topic=String(options.topic||'Pengembangan materi pelatihan'),angles=['Kebutuhan belajar','Praktik dan contoh penerapan','Perkembangan topik','Pertanyaan yang belum terjawab','Perbandingan pendekatan'];
+    const urls=String(options.researchURLs||'').split(/\s+/).filter(Boolean).filter(s=>{try{return ['https:','http:'].includes(new URL(s).protocol);}catch{return false;}});
+    return {id:'research-'+Date.now().toString(36)+'-'+iteration,title:topic+': '+angles[iteration%angles.length]+' · '+(iteration+1),topic,prompt:options.prompt||'',status:'planned',verified:false,findings:[],sources:sources.map(s=>({id:s.id,title:s.title})),queries:[topic+' '+angles[iteration%angles.length].toLowerCase(),topic+' studi kasus pelatihan'],requestedURLs:urls,notice:'Rencana riset demo. Pencarian web belum dijalankan dan belum ada temuan atau referensi terverifikasi.',createdAt:new Date().toISOString()};
+  };
+  Core.isSCORM=function(bytes){
+    const b=bytes instanceof Uint8Array?bytes:new Uint8Array(bytes),v=new DataView(b.buffer,b.byteOffset,b.byteLength);
+    for(let i=b.length-22;i>=Math.max(0,b.length-65557);i--){
+      if(v.getUint32(i,true)!==0x06054b50)continue;
+      let offset=v.getUint32(i+16,true);const count=v.getUint16(i+10,true);
+      for(let n=0;n<count;n++){
+        if(offset+46>b.length||v.getUint32(offset,true)!==0x02014b50)return false;
+        const length=v.getUint16(offset+28,true),extra=v.getUint16(offset+30,true),comment=v.getUint16(offset+32,true);
+        if(offset+46+length>b.length)return false;
+        if(new TextDecoder().decode(b.subarray(offset+46,offset+46+length)).toLowerCase()==='imsmanifest.xml')return true;
+        offset+=46+length+extra+comment;
+      }return false;
+    }return false;
+  };
+  Core.nextRun=function(schedule,now=new Date()){
+    const local=new Date(now.getTime()+7*3600000), y=local.getUTCFullYear(),m=local.getUTCMonth(),d=local.getUTCDate();
+    const [h,min]=(/^\d\d:\d\d$/.test(schedule.time||'')?schedule.time:'09:00').split(':').map(Number);
+    let out=new Date(Date.UTC(y,m,d,h-7,min));
+    const addDay=()=>out=new Date(out.getTime()+86400000);
+    if(schedule.frequency==='weekly'){
+      const weekday=Number(schedule.weekday??1),today=local.getUTCDay();
+      out=new Date(out.getTime()+((weekday-today+7)%7)*86400000);if(out<=now)out=new Date(out.getTime()+7*86400000);
+    }else if(schedule.frequency==='monthly'){
+      const day=Math.min(28,Math.max(1,Number(schedule.monthday)||1));out=new Date(Date.UTC(y,m,day,h-7,min));
+      if(out<=now)out=new Date(Date.UTC(y,m+1,day,h-7,min));
+    }else{
+      if(out<=now)addDay();
+      if(schedule.frequency==='workdays')while([0,6].includes(new Date(out.getTime()+7*3600000).getUTCDay()))addDay();
+    }
+    return out;
+  };
+  Core.createModule=function(sources,settings={},iteration=0){
+    const usable=sources.filter(s=>s.text?.trim());if(!usable.length)throw new Error('Tambahkan materi yang teksnya tersedia.');
+    const pair=Core.matchSources(usable)[0],shared=pair?.shared||[];
+    const topic=String(settings.topic||usable[0].title||shared[0]||'Pembelajaran terpadu').trim();
+    const single=usable.length===1;
+    const angles=['Panduan praktis','Dari konsep ke penerapan','Belajar melalui studi kasus'];
+    const title=String(settings.title||`${topic}: ${angles[iteration%angles.length]}`);
+    const audience=settings.audience||'Seluruh karyawan';
+    const refs=usable.map(s=>({id:s.id,title:s.title,format:s.format||'TXT',text:s.text.trim()}));
+    const sections=[{title:'Pengantar',body:`Modul ini disusun untuk ${audience.toLowerCase()} dengan ${single?'mengembangkan pembelajaran dari':'menghubungkan materi'} ${refs.map(r=>'“'+r.title+'”').join(' dan ')}. Fokus pembelajaran: ${topic.toLowerCase()}. Baca tiap bagian, pahami konsepnya, lalu gunakan latihan untuk merumuskan penerapan.`,sourceIds:refs.map(r=>r.id)}];
+    refs.forEach((r,i)=>sections.push({title:`${i+1}. ${r.title}`,body:r.text.slice(0,1600),sourceIds:[r.id]}));
+    sections.push({title:single?'Dari materi ke praktik':'Menghubungkan materi',body:single?`Pilih satu konsep penting dari “${refs[0].title}”. Jelaskan kembali dengan bahasa Anda sendiri, berikan contoh situasi kerja, lalu uraikan langkah penerapannya. Gunakan isi sumber sebagai acuan dan catat hal yang perlu dikonfirmasi kepada pemilik materi.`:shared.length?`Topik yang menghubungkan sumber ini adalah ${shared.slice(0,4).join(', ')}. Bandingkan konsep dari tiap sumber. Susun satu alur tindakan yang mengambil langkah relevan dari sumber-sumber tersebut, lalu catat informasi yang perlu dikonfirmasi kepada pemilik materi.`:'Bandingkan ruang lingkup tiap sumber. Catat hubungan yang dapat digunakan bersama dan konfirmasikan perbedaan kepada pemilik materi sebelum diterapkan.',sourceIds:refs.map(r=>r.id)});
+    if(settings.exercise!==false)sections.push({title:'Latihan penerapan',body:`Pilih satu situasi kerja yang berkaitan dengan ${topic.toLowerCase()}.\n1. Jelaskan masalah dan kebutuhan pihak yang terlibat.\n2. Ambil minimal satu prinsip dari setiap materi sumber.\n3. Susun tiga langkah tindakan dan alasan pemilihannya.\n4. Jelaskan cara mengevaluasi hasil tindakan tersebut.`,sourceIds:refs.map(r=>r.id)});
+    sections.push({title:'Ringkasan & refleksi',body:`Tuliskan tiga hal yang Anda pelajari dari ${topic.toLowerCase()}. Tentukan satu tindakan yang akan dicoba di pekerjaan dan sumber yang mendasarinya. Bila ada perbedaan informasi, gunakan catatan sumber sebagai bahan review bersama pemilik materi.`,sourceIds:refs.map(r=>r.id)});
+    const q1=refs[0].text.split(/(?<=[.!?])\s+/)[0];
+    const quiz=settings.quiz===false?[]:[
+      {q:`Pernyataan mana yang sesuai dengan materi “${refs[0].title}”?`,options:[q1,'Mengambil keputusan tanpa acuan materi.','Mengabaikan kebutuhan pihak terkait.','Mengikuti kebiasaan tanpa evaluasi.'],answer:0},
+      {q:single?'Apa tujuan mengembangkan materi menjadi modul pelatihan?':'Apa tujuan menggabungkan materi sumber dalam modul ini?',options:['Menghilangkan seluruh informasi asal.','Menghubungkan konsep untuk membantu penerapannya.','Mengganti ketentuan perusahaan secara otomatis.','Membuat semua sumber memiliki isi yang sama.'],answer:1},
+      {q:'Apa yang perlu dilakukan saat menemukan informasi yang belum jelas?',options:['Mengabaikan informasi tersebut.','Memilih informasi secara acak.','Mencatat dan mengonfirmasi kepada pemilik materi.','Menganggap seluruh informasi tidak berlaku.'],answer:2}
+    ];
+    return {id:'mod-'+Date.now().toString(36)+'-'+iteration,title,topic,audience,duration:Number(settings.duration)||10,language:settings.language||'Bahasa Indonesia',tone:settings.tone||'Profesional & mudah dipahami',objectives:[`Menjelaskan konsep utama ${topic.toLowerCase()} dari materi sumber.`,`Menghubungkan prinsip dari ${refs.length} materi untuk kebutuhan ${audience.toLowerCase()}.`,'Menyusun langkah penerapan dan mengevaluasi hasilnya.'],sections,quiz,sources:refs.map(({text,...r})=>r),status:'draft',createdAt:new Date().toISOString(),origin:'manual',editedText:''};
+  };
+  Core.moduleText=function(m){
+    if(m.editedText)return m.title+'\n\n'+m.editedText;
+    const parts=[m.title,`Audiens: ${m.audience} | Estimasi: ${m.duration} menit`,`Tujuan pembelajaran\n${m.objectives.map((x,i)=>(i+1)+'. '+x).join('\n')}`,...m.sections.map(s=>s.title+'\n'+s.body)];
+    if(m.quiz.length)parts.push('Kuis pemahaman\n'+m.quiz.map((q,i)=>`${i+1}. ${q.q}\n${q.options.map((o,j)=>'ABCD'[j]+'. '+o).join('\n')}\nKunci: ${'ABCD'[q.answer]}`).join('\n\n'));
+    parts.push('Sumber materi\n'+m.sources.map((s,i)=>(i+1)+'. '+s.title).join('\n'),'Modul simulasi Learning Lab Express. Tinjau kembali sebelum digunakan.');return parts.join('\n\n');
+  };
+  Core.makeSCORM=function(m){
+    const E=Core.escape;
+    const manifest=`<?xml version="1.0" encoding="UTF-8"?><manifest identifier="LLE-DEMO" version="1.0" xmlns="http://www.imsproject.org/xsd/imscp_rootv1p1p2" xmlns:adlcp="http://www.adlnet.org/xsd/adlcp_rootv1p2"><metadata><schema>ADL SCORM</schema><schemaversion>1.2</schemaversion></metadata><organizations default="ORG"><organization identifier="ORG"><title>${E(m.title)}</title><item identifier="ITEM" identifierref="RES"><title>${E(m.title)}</title></item></organization></organizations><resources><resource identifier="RES" type="webcontent" adlcp:scormtype="sco" href="index.html"><file href="index.html"/></resource></resources></manifest>`;
+    const content='<!doctype html><html lang="id"><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>'+E(m.title)+'</title><style>body{font:16px/1.8 system-ui;background:#f5f8fd;color:#20334e;margin:0}main{max-width:800px;margin:40px auto;padding:32px;background:white;border-radius:16px}h1,h2{line-height:1.3}p{white-space:pre-wrap}.note{padding:16px;background:#eef4ff;font-size:13px}button{padding:14px 22px;background:#2563eb;color:white;border:0;border-radius:8px;cursor:pointer}</style><main><small>LEARNING LAB EXPRESS · SCORM 1.2 · DEMO</small><h1>'+E(m.title)+'</h1><p class="note">'+E(m.notice||'Modul simulasi. Tinjau sebelum digunakan.')+'</p><h2>Tujuan belajar</h2><ol>'+m.objectives.map(o=>'<li>'+E(o)+'</li>').join('')+'</ol>'+(m.editedText?'<p>'+E(m.editedText)+'</p>':m.sections.map(s=>'<section><h2>'+E(s.title)+'</h2><p>'+E(s.body)+'</p></section>').join(''))+'<h2>Refleksi</h2><p>Tuliskan satu penerapan yang akan Anda coba setelah mempelajari materi ini.</p><h2>Sumber</h2><ul>'+m.sources.map(s=>'<li>'+E(s.title)+'</li>').join('')+'</ul><button id="finish">Selesaikan pembelajaran</button><p id="completion" role="status"></p></main><script>let api=null;try{let w=window;for(let i=0;i<10;i++){if(w.API){api=w.API;break}if(w.parent===w)break;w=w.parent}if(!api&&window.opener)api=window.opener.API;if(api){api.LMSInitialize("");if(["not attempted",""].includes(api.LMSGetValue("cmi.core.lesson_status")))api.LMSSetValue("cmi.core.lesson_status","incomplete")}}catch(e){}document.getElementById("finish").onclick=function(){try{if(api){api.LMSSetValue("cmi.core.lesson_status","completed");api.LMSCommit("")}}catch(e){}this.disabled=true;document.getElementById("completion").textContent="Pembelajaran selesai."};addEventListener("pagehide",()=>{try{if(api)api.LMSFinish("")}catch(e){}});<\/script></html>';
+    const files=[['imsmanifest.xml',manifest],['index.html',content]],enc=new TextEncoder(),parts=[],central=[];let offset=0;
+    const crc=data=>{let c=0xffffffff;for(const x of data){c^=x;for(let k=0;k<8;k++)c=(c>>>1)^((c&1)?0xedb88320:0);}return (c^0xffffffff)>>>0;};
+    for(const [name,text] of files){
+      const n=enc.encode(name),data=enc.encode(text),checksum=crc(data),header=new Uint8Array(30+n.length),h=new DataView(header.buffer);
+      h.setUint32(0,0x04034b50,true);h.setUint16(4,20,true);h.setUint16(6,0x800,true);h.setUint32(14,checksum,true);h.setUint32(18,data.length,true);h.setUint32(22,data.length,true);h.setUint16(26,n.length,true);header.set(n,30);
+      const c=new Uint8Array(46+n.length),v=new DataView(c.buffer);v.setUint32(0,0x02014b50,true);v.setUint16(4,20,true);v.setUint16(6,20,true);v.setUint16(8,0x800,true);v.setUint32(16,checksum,true);v.setUint32(20,data.length,true);v.setUint32(24,data.length,true);v.setUint16(28,n.length,true);v.setUint32(42,offset,true);c.set(n,46);
+      parts.push(header,data);central.push(c);offset+=header.length+data.length;
+    }
+    const end=new Uint8Array(22),ev=new DataView(end.buffer),size=central.reduce((n,p)=>n+p.length,0);ev.setUint32(0,0x06054b50,true);ev.setUint16(8,files.length,true);ev.setUint16(10,files.length,true);ev.setUint32(12,size,true);ev.setUint32(16,offset,true);
+    const out=new Uint8Array(offset+size+22);let cursor=0;for(const part of [...parts,...central,end]){out.set(part,cursor);cursor+=part.length;}return out;
+  };
+  Core.makePDF=function(text){
+    const clean=String(text).replace(/[“”]/g,'"').replace(/[‘’]/g,"'").replace(/[–—]/g,'-').replace(/•/g,'-').normalize('NFKD').replace(/[\u0300-\u036f]/g,'').replace(/[^\x20-\x7E\n\r\t]/g,'?');
+    const lines=[];const cw=c=>('ilI.,:;!|\'`'.includes(c)?2.5:('mwMW@'.includes(c)?9.2:(' '.includes(c)?3.05:5.7)));
+    for(const paragraph of clean.split('\n')){
+      if(!paragraph.trim()){lines.push('');continue;}let current='';
+      for(const word of paragraph.split(/\s+/)){
+        const pieces=word.match(/.{1,48}/g)||[''];for(const piece of pieces){const next=current?current+' '+piece:piece;
+          if([...next].reduce((a,c)=>a+cw(c),0)>485&&current){lines.push(current);current=piece;}else current=next;
+        }
+      }if(current)lines.push(current);
+    }
+    const pages=[];for(let i=0;i<lines.length;i+=46)pages.push(lines.slice(i,i+46));if(!pages.length)pages.push(['']);
+    const objects=[];objects[1]='<< /Type /Catalog /Pages 2 0 R >>';objects[3]='<< /Type /Font /Subtype /Type1 /BaseFont /Helvetica >>';
+    const kids=[];const esc=s=>s.replace(/([\\()])/g,'\\$1');
+    pages.forEach((page,i)=>{const pageID=4+i*2,streamID=pageID+1;kids.push(pageID+' 0 R');
+      const commands=['BT /F1 11 Tf 15 TL 52 790 Td',...page.flatMap((s,j)=>[(j?'T* ':'')+'('+esc(s)+') Tj']),'ET',`BT /F1 8 Tf 52 35 Td (Learning Lab Express - Modul simulasi | ${i+1}/${pages.length}) Tj ET`].join('\n');
+      objects[pageID]=`<< /Type /Page /Parent 2 0 R /MediaBox [0 0 595.28 841.89] /Resources << /Font << /F1 3 0 R >> >> /Contents ${streamID} 0 R >>`;
+      objects[streamID]=`<< /Length ${commands.length} >>\nstream\n${commands}\nendstream`;
+    });
+    objects[2]=`<< /Type /Pages /Count ${pages.length} /Kids [${kids.join(' ')}] >>`;
+    let result='%PDF-1.4\n';const offsets=[0];for(let i=1;i<objects.length;i++){offsets[i]=result.length;result+=i+' 0 obj\n'+objects[i]+'\nendobj\n';}
+    const xref=result.length;result+=`xref\n0 ${objects.length}\n0000000000 65535 f \n`;
+    for(let i=1;i<objects.length;i++)result+=String(offsets[i]).padStart(10,'0')+' 00000 n \n';
+    result+=`trailer\n<< /Size ${objects.length} /Root 1 0 R >>\nstartxref\n${xref}\n%%EOF`;
+    return Uint8Array.from(result,c=>c.charCodeAt(0));
+  };
+  if(typeof module!=='undefined' && module.exports) module.exports=Core;
+  root.ContentCore=Core;
+})(typeof globalThis!=='undefined'?globalThis:this);
+</script>
+<script>(function(){
+  'use strict';
+  const C=window.ContentCore,E=C.escape,$=s=>document.querySelector(s),KEY='learning-lab-express-v1';
+  const icons={
+    book:'<path d="M3 5c3-1 6 0 9 2 3-2 6-3 9-2v14c-3-1-6 0-9 2-3-2-6-3-9-2z"/><path d="M12 7v14M6 9l3 1M15 10l3-1"/>',
+    home:'<path d="m3 10 9-7 9 7v10H3z"/><path d="M9 20v-7h6v7"/>',
+    folder:'<path d="M3 6h6l2 2h10v12H3z"/><path d="M3 6V4h6l2 2h9v2"/>',
+    spark:'<path d="m12 3 2.5 6.5L21 12l-6.5 2.5L12 21l-2.5-6.5L3 12l6.5-2.5z"/><path d="m20 2 .5 1.5L22 4l-1.5.5L20 6l-.5-1.5L18 4l1.5-.5z"/>',
+    calendar:'<rect x="3" y="5" width="18" height="16" rx="2"/><path d="M7 3v4M17 3v4M3 11h18M7 15h3M14 15h3"/>',
+    clock:'<circle cx="12" cy="12" r="9"/><path d="M12 7v6l4 2"/>',
+    layers:'<path d="m12 3 10 5-10 5L2 8zM2 12l10 5 10-5M2 16l10 5 10-5"/>',
+    download:'<path d="M12 3v12m-5-5 5 5 5-5M4 16v5h16v-5"/>',
+    upload:'<path d="M12 16V4m-5 5 5-5 5 5M4 16v5h16v-5"/>',
+    file:'<path d="M5 3h9l5 5v13H5zM14 3v6h5M8 13h8M8 17h6"/>',
+    'arrow-right':'<path d="M4 12h16m-6-6 6 6-6 6"/>',
+    chevron:'<path d="m7 10 5 5 5-5"/>',
+    search:'<circle cx="10" cy="10" r="6"/><path d="m15 15 5 5"/>',
+    eye:'<path d="M2 12s4-7 10-7 10 7 10 7-4 7-10 7S2 12 2 12z"/><circle cx="12" cy="12" r="3"/>',
+    trash:'<path d="M3 6h18M9 3h6l1 3M6 6l1 15h10l1-15M10 10v7M14 10v7"/>',
+    close:'<path d="m6 6 12 12M18 6 6 18"/>',
+    info:'<circle cx="12" cy="12" r="9"/><path d="M12 11v6M12 7v.2"/>',
+    help:'<circle cx="12" cy="12" r="9"/><path d="M9 9a3 3 0 0 1 6 0c0 2-3 2-3 4M12 17v.2"/>',
+    check:'<path d="m5 12 4 4L19 6"/>',
+    edit:'<path d="m15 4 5 5M4 20l5-1L21 7l-4-4L5 15z"/>',
+    logout:'<path d="M10 4H4v16h6M10 12h11m-4-4 4 4-4 4"/>',
+    plus:'<path d="M12 4v16M4 12h16"/>'
+  };
+  icons.video='<rect x="3" y="5" width="18" height="14" rx="3"/><path d="m10 9 5 3-5 3z"/>';
+  icons.audio='<path d="M4 13v-2a8 8 0 0 1 16 0v2"/><rect x="3" y="11" width="4" height="8" rx="2"/><rect x="17" y="11" width="4" height="8" rx="2"/>';
+  icons.scorm='<path d="m12 3 9 5-9 5-9-5zM3 8v9l9 5 9-5V8M12 13v9"/>';
+  const types={pdf:{label:'PDF',icon:'file',hint:'Dokumen pembelajaran',file:'PDF'},video:{label:'Video',icon:'video',hint:'Video pembelajaran',file:'MP4 / WEBM'},audio:{label:'Audio',icon:'audio',hint:'Audio pembelajaran',file:'MP3 / WAV'},scorm:{label:'SCORM',icon:'scorm',hint:'Modul interaktif',file:'ZIP'}};
+  types.text={label:'Text',icon:'file',hint:'Artikel, modul & panduan',file:'PDF / DOCX / PPTX / TXT'};
+  const visibleTypes=['text','video','audio','scorm'];
+  icons.brain='<path d="M12 5c-3-4-8-1-7 3-4 2-3 7 0 8-1 4 5 6 7 2M12 5c3-4 8-1 7 3 4 2 3 7 0 8 1 4-5 6-7 2M12 5v15M7 9l3 2M17 9l-3 2M6 15l3-1M18 15l-3-1"/>';
+  const sourceURLs=new Map();
+  function I(name){return '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">'+(icons[name]||icons.file)+'</svg>';}
+  function fillIcons(root=document){root.querySelectorAll('[data-icon]').forEach(el=>el.innerHTML=I(el.dataset.icon));}
+  const now=()=>new Date().toISOString();
+  function sampleSources(){
+    return [
+      {id:'sample-service',title:'Panduan Layanan Pelanggan',format:'PDF',tags:['layanan','pelanggan','empati'],sample:true,createdAt:now(),text:'Mulai layanan dengan menyapa pelanggan secara ramah dan memperkenalkan diri. Dengarkan kebutuhan pelanggan tanpa menyela, lalu konfirmasikan kembali kebutuhan tersebut dengan bahasa yang jelas.\n\nGunakan empati untuk memahami sudut pandang pelanggan. Jelaskan pilihan solusi secara terbuka dan hindari menjanjikan sesuatu di luar kewenangan. Jika perlu eskalasi, sampaikan pihak yang akan membantu dan perkiraan tindak lanjut sesuai prosedur perusahaan.\n\nTutup interaksi dengan merangkum solusi dan memastikan pelanggan memahami langkah berikutnya. Dokumentasikan kebutuhan, solusi, serta tindak lanjut agar kualitas layanan tetap konsisten.'},
+      {id:'sample-communication',title:'Komunikasi Efektif di Tempat Kerja',format:'MP4',tags:['komunikasi','pelanggan','empati'],sample:true,createdAt:now(),text:'Komunikasi efektif dimulai dengan mendengarkan secara aktif. Fokus pada pesan yang disampaikan dan ajukan pertanyaan terbuka untuk memperjelas kebutuhan pelanggan maupun rekan kerja.\n\nGunakan bahasa yang ringkas, jelas, dan sesuai dengan penerima pesan. Tunjukkan empati melalui respons yang menghargai perasaan lawan bicara. Hindari jargon dan pastikan pesan penting dipahami dengan meminta konfirmasi.\n\nDalam komunikasi tertulis, jelaskan tujuan, konteks, tindakan yang dibutuhkan, dan batas waktu secara berurutan. Setelah diskusi, rangkum kesepakatan dan pemilik tindak lanjut agar tidak terjadi perbedaan pemahaman.'},
+      {id:'sample-complaints',title:'Menangani Keluhan dengan Empati',format:'MP3',tags:['keluhan','pelanggan','empati'],sample:true,createdAt:now(),text:'Saat menerima keluhan pelanggan, dengarkan hingga selesai dan jaga sikap tenang. Sampaikan bahwa Anda memahami ketidaknyamanan yang dialami, lalu klarifikasi fakta tanpa menyalahkan pihak lain.\n\nCatat kebutuhan pelanggan, dampak masalah, dan solusi yang diharapkan. Periksa informasi yang tersedia sebelum menawarkan solusi. Komunikasi harus jelas dan berempati; jangan menjanjikan keputusan yang berada di luar kewenangan Anda.\n\nJika masalah membutuhkan penanganan lanjutan, eskalasikan sesuai prosedur perusahaan dan berikan pembaruan secara berkala. Dokumentasikan penyelesaian serta pembelajaran dari keluhan untuk memperbaiki kualitas layanan.'},
+      {id:'sample-scorm',title:'Dasar Layanan Prima',format:'SCORM',tags:['layanan','pelanggan'],sample:true,createdAt:now(),text:'Kenali kebutuhan pelanggan sebelum memberikan solusi. Dengarkan secara aktif dan gunakan bahasa yang jelas. Konfirmasikan tindak lanjut dan dokumentasikan hasil layanan. Lengkapi pembelajaran dengan latihan situasi kerja dan evaluasi pemahaman.'},
+      {id:'sample-omnichannel',title:'Studi Kasus Layanan Omnichannel',format:'TXT',tags:['layanan','pelanggan','komunikasi'],sample:true,createdAt:now(),text:'Pastikan informasi pelanggan konsisten saat berpindah dari kanal chat ke telepon. Rangkum kebutuhan dan tindak lanjut agar pelanggan tidak perlu mengulang penjelasan. Gunakan komunikasi yang jelas, empati, dan dokumentasi layanan untuk koordinasi antar tim.'}
+    ];
+  }
+  function fresh(){return {schema:4,user:null,remember:true,sources:sampleSources(),modules:[],settings:{topic:'',audience:'Seluruh karyawan',duration:10,tone:'Profesional & mudah dipahami',language:'Bahasa Indonesia',exercise:true,quiz:true,saved:false},automation:{count:20,mode:'generate',topic:'',prompt:'',researchURLs:'',scope:'all',sourceIDs:[]},chat:[],research:[],lastUploadIDs:[],schedule:{enabled:false,frequency:'daily',time:'09:00',weekday:1,monthday:1,nextRun:null,lastRun:null}};}
+  let state;try{const saved=JSON.parse(localStorage.getItem(KEY)||'null');state=saved&&Array.isArray(saved.sources)&&Array.isArray(saved.modules)?Object.assign(fresh(),saved):fresh();if(saved)state.schema=saved.schema||1;}catch{state=fresh();}
+  if(state.schema<2){state.schedule=fresh().schedule;if(!state.settings.saved)state.settings.topic='';}
+  if(state.schema<3){sampleSources().forEach(sample=>{const old=state.sources.find(s=>s.id===sample.id&&s.sample);if(old)old.format=sample.format;else if(!state.sources.some(s=>s.id===sample.id))state.sources.push(sample);});state.schema=3;}
+  if(state.schema<4){sampleSources().forEach(sample=>{if(!state.sources.some(s=>s.id===sample.id))state.sources.push(sample);});state.schema=4;}
+  state.automation=Object.assign(fresh().automation,state.automation||{});state.chat=state.chat||[];state.research=state.research||[];
+  state.modules.forEach(m=>{m.outputType=m.outputType==='pdf'||!m.outputType?'text':m.outputType;m.basis=m.basis||'text';});
+  if(state.schedule.enabled&&!state.schedule.nextRun)state.schedule.nextRun=C.nextRun(state.schedule).toISOString();
+  let view='sources',sourceQuery='',resultQuery='',resultStatus='all',resultType='all',resultTab='content',selectedBrain=new Set(state.automation.scope==='selected'?state.automation.sourceIDs:[]),aiDraft=null,busy=false,previewID=null,toastTimer;
+  function persist(){try{localStorage.setItem(KEY,JSON.stringify(Object.assign({},state,{user:state.remember?state.user:null})));}catch{toast('Penyimpanan browser penuh. Perubahan tersedia selama halaman ini terbuka.',true);}}
+  function toast(message,error=false){const t=$('#toast');t.textContent=message;t.className='toast show'+(error?' error':'');clearTimeout(toastTimer);toastTimer=setTimeout(()=>t.classList.remove('show'),4200);}
+  const names={sources:'Upload materi',brain:'Brain & AI',results:'Hasil'};
+  function typeOf(m){const t=m.outputType||C.contentType(m)||'text';return t==='pdf'?'text':t;}
+  function brainSources(){return C.brainSources(state.sources);}
+  function typeBadge(type){return '<span class="type-badge '+type+'">'+I(types[type].icon)+types[type].label+'</span>';}
+  function readable(){return state.sources.filter(s=>s.text&&s.text.trim());}
+  function dt(value,long=false){try{return new Intl.DateTimeFormat('id-ID',{dateStyle:long?'full':'medium',...(long?{timeStyle:'short'}:{}),timeZone:'Asia/Jakarta'}).format(new Date(value));}catch{return '-';}}
+  function bytes(n){return n>1048576?(n/1048576).toFixed(1)+' MB':Math.max(1,Math.round(n/1024))+' KB';}
+  function fileIcon(s){return '<span class="file-icon '+E(s.format.toLowerCase())+'">'+E(s.format)+'</span>';}
+  function status(m){return '<span class="status '+(m.status==='ready'?'ready':'draft')+'"><i class="dot"></i>'+(m.status==='ready'?'Sudah ditinjau':m.basis==='filename'?'Konsep demo':'Draft')+'</span>';}
+  function button(text,action,style='primary',icon='plus',extra=''){return '<button type="button" class="btn '+style+'" data-action="'+action+'" '+extra+'>'+I(icon)+text+'</button>';}
+  function head(title,description,actions=''){return '<div class="page-head"><div><h1>'+title+'</h1><p>'+description+'</p></div><div class="head-actions">'+actions+'</div></div>';}
+  function empty(title,text,action='',label='Buat modul baru'){return '<div class="empty"><span class="empty-icon">'+I('book')+'</span><h3>'+title+'</h3><p>'+text+'</p>'+(action?button(label,action,'light','plus'):'')+'</div>';}
+  function render(){
+    $('#login-view').hidden=!!state.user;$('#app').hidden=!state.user;fillIcons();
+    if(!state.user)return;
+    $('#profile-name').textContent=state.user.name||'Wulan';
+    $('#header-date').textContent=dt(new Date());
+    $('#breadcrumb').textContent=names[view];
+    $('#source-count').textContent=brainSources().length;$('#module-count').textContent=state.modules.length;
+    document.querySelectorAll('nav [data-nav]').forEach(b=>{b.classList.toggle('active',b.dataset.nav===view);b.setAttribute('aria-current',b.dataset.nav===view?'page':'false');});
+    $('#view-content').innerHTML=({sources:sourcesView,brain:brainView,results:resultsView}[view])();
+    fillIcons($('#view-content'));bindView();
+  }
+  function go(next){stopSpeech();view=['sources','brain','results'].includes(next)?next:'brain';render();window.scrollTo({top:0,behavior:'instant'});}
+  function heroArt(){return '<div class="hero-art" aria-hidden="true"><div class="mini-source"><span class="file-icon pdf">PDF</span><div>Materi layanan pelanggan<small>Perpustakaan materi</small></div></div><div class="mini-source"><span class="file-icon pptx">PPT</span><div>Komunikasi efektif<small>Topik yang saling berkaitan</small></div></div><div class="connector">'+I('spark')+'</div><div class="mini-output"><span class="output-icon">'+I('book')+'</span><div>Modul pelatihan baru<small>Lengkap dengan latihan & kuis</small></div><span class="status ready">Draft</span></div></div>';}
+  function scheduleLabel(){return ({daily:'Setiap hari',workdays:'Setiap hari kerja',weekly:'Setiap minggu',monthly:'Setiap bulan'}[state.schedule.frequency]||'Setiap hari')+' · '+state.schedule.time.replace(':','.')+' WIB';}
+  function pairCard(pair){
+    const a=state.sources.find(s=>s.id===pair.a),b=state.sources.find(s=>s.id===pair.b);
+    return '<div class="card match-card"><div class="pair-names"><span>'+I('file')+E(a.title)+'</span><span>'+I('file')+E(b.title)+'</span></div><div class="match-tags">'+pair.shared.slice(0,3).map(t=>'<span class="tag">'+E(t)+'</span>').join('')+'</div><div class="match-footer"><small>Topik berkaitan · 2 sumber</small><button class="text-btn" data-action="pair" data-pair="'+E(pair.a+','+pair.b)+'">Buat modul '+I('arrow-right')+'</button></div></div>';
+  }
+  function contentCard(m){
+    const type=typeOf(m);
+    return '<article class="content-card"><div class="content-cover '+type+'">'+I(types[type].icon)+'<span>'+types[type].label+'</span><small>'+ (m.sample?'CONTOH':m.basis==='filename'?'KONSEP DEMO':'DRAFT BARU')+'</small></div><div class="content-card-body"><div class="content-card-top">'+typeBadge(type)+status(m)+'</div><button class="content-title" data-action="preview" data-id="'+E(m.id)+'">'+E(m.title)+'</button><p>'+m.sources.length+' materi sumber · '+E(dt(m.createdAt))+'</p><div class="content-card-foot"><span>'+(m.origin==='scheduled'?'Terjadwal':m.origin==='sample'?'Contoh':'Permintaan AI')+'</span><button class="text-btn" data-action="preview" data-id="'+E(m.id)+'">Buka konten '+I('arrow-right')+'</button></div></div></article>';
+  }
+  function sourceRows(){
+    const list=brainSources().filter(s=>(s.title+' '+(s.tags||[]).join(' ')).toLowerCase().includes(sourceQuery.toLowerCase()));
+    if(!list.length)return empty('Belum ada materi yang cocok','Coba kata kunci lain atau tambahkan materi.');
+    return list.map(s=>'<div class="compact-source-row"><input class="brain-source-check" type="checkbox" aria-label="Pilih '+E(s.title)+'" value="'+E(s.id)+'" '+(selectedBrain.has(s.id)?'checked':'')+'>'+fileIcon(s)+'<div class="compact-source-name"><b title="'+E(s.title)+'">'+E(s.title)+'</b><small>'+E(s.format)+' · '+(s.sample?'Contoh':s.text?'Teks tersedia':'Belum dianalisis')+'</small></div><button class="icon-btn" data-action="source-preview" data-id="'+E(s.id)+'" aria-label="Lihat '+E(s.title)+'">'+I('eye')+'</button><button class="icon-btn" data-action="source-delete" data-id="'+E(s.id)+'" aria-label="Hapus '+E(s.title)+'">'+I('trash')+'</button></div>').join('');
+  }
+  function sourcesView(){
+    const last=(state.lastUploadIDs||[]).map(id=>state.sources.find(s=>s.id===id)).filter(Boolean);
+    return head('Upload materi','Tambahkan pengetahuan ke Brain. Anda bisa mengupload beberapa berkas sekaligus.')+
+    '<div id="drop-zone" class="upload-box"><span class="upload-symbol">'+I('upload')+'</span><h3>Mulai dari materi yang sudah Anda miliki</h3><p>Upload satu atau beberapa materi. Semuanya akan tersimpan di Brain.</p>'+button('Pilih berkas','upload','primary','plus')+'<p class="upload-limit">PDF, DOCX, PPTX, TXT, MD · MP4, WEBM, MOV · MP3, WAV, M4A, OGG, AAC, FLAC · SCORM ZIP<br>Maks. 200 MB per berkas · SCORM ZIP memiliki imsmanifest.xml</p></div>'+
+    (last.length?'<section class="card upload-success"><span>'+I('check')+'</span><div><h3>'+last.length+' materi ditambahkan ke Brain</h3><p>Materi tersimpan sebagai sumber pengetahuan. Pembuatan konten dimulai saat Anda meminta AI.</p></div><button class="btn primary" data-nav="brain">Lihat Brain '+I('arrow-right')+'</button></section>':'')+
+    '<div class="notice-row">'+I('info')+'<span>Demo membaca TXT/MD. Berkas lainnya terdaftar di Brain, tetapi isinya belum dianalisis.</span><button class="text-btn" data-action="load-brain-demo">Coba Brain dengan 5 contoh</button></div>';
+  }
+  function brainView(){
+    const pool=brainSources();selectedBrain=new Set([...selectedBrain].filter(id=>pool.some(s=>s.id===id)));
+    if(!aiDraft)aiDraft={...state.automation,...state.schedule,scope:selectedBrain.size?'selected':'all',sourceIDs:[...selectedBrain]};
+    if(aiDraft.scope==='all')selectedBrain.clear();else{aiDraft.sourceIDs=[...selectedBrain];if(!selectedBrain.size)aiDraft.scope='all';}
+    const count=selectedBrain.size||pool.length;
+    return head('Brain & AI','Pilih materi, tulis kebutuhan, lalu buat konten atau atur jadwal di sini.')+
+      '<div class="unified-workspace"><section class="card compact-brain"><div class="card-head"><div><h3>Brain <span class="badge neutral">'+pool.length+' materi</span></h3><p>Knowledge base tim Anda.</p></div>'+I('brain')+'</div><div class="compact-brain-search"><div class="search">'+I('search')+'<input id="source-search" aria-label="Cari materi di Brain" placeholder="Cari materi..." value="'+E(sourceQuery)+'"></div></div><div class="brain-selection"><label class="check-label"><input id="brain-select-all" type="checkbox" '+(pool.length&&pool.every(s=>selectedBrain.has(s.id))?'checked':'')+'> Pilih semua</label><span id="brain-selection-label">'+(selectedBrain.size?selectedBrain.size+' dipilih':'Seluruh Brain digunakan')+'</span></div><div id="source-rows" class="compact-source-list">'+sourceRows()+'</div><div class="table-note">'+(pool.some(s=>!s.sample)?'Sumber pilihan menjadi acuan AI.':'Anda sedang memakai materi contoh.')+' Kosongkan pilihan untuk seluruh Brain.</div></section>'+assistantView(count)+'</div>';
+  }
+  function assistantView(count){
+    const o=aiDraft||{...state.automation,...state.schedule},saved=state.schedule.plan||state.automation;
+    const message=[...state.chat].reverse().find(m=>m.role==='assistant');
+    return '<section class="card simple-ai"><div class="card-head"><div class="assistant-title"><span>'+I('spark')+'</span><div><h3>AI & jadwal</h3><p id="plan-source-label">'+count+' materi menjadi sumber AI</p></div></div><span class="badge blue">Demo</span></div><form id="ai-request-form"><label for="ai-prompt">Apa yang ingin dibuat?</label><textarea id="ai-prompt" rows="3" maxlength="1600" required placeholder="Buat 20 konten dari materi ini setiap hari pukul 09.00...">'+E(o.prompt||'')+'</textarea><div class="ai-compose-footer"><div class="prompt-chips"><button type="button" data-action="prompt-example" data-prompt="Buat 20 konten dari seluruh Brain sekarang">20 konten</button><button type="button" data-action="prompt-example" data-prompt="Riset 5 topik setiap Senin pukul 08.00">Riset mingguan</button></div><button class="btn light" type="submit">Terapkan</button></div></form>'+
+      (message?'<div class="compact-ai-reply">'+I('spark')+'<p>'+E(message.text)+'</p></div>':'')+
+      '<form id="schedule-form" class="simple-plan"><select id="ai-scope" hidden><option value="all" '+(o.scope!=='selected'?'selected':'')+'>Seluruh Brain</option><option value="selected" '+(o.scope==='selected'?'selected':'')+'>Materi terpilih</option></select><div class="simple-plan-row"><div class="field"><label for="ai-mode">Aktivitas</label><select id="ai-mode">'+[['generate','Buat konten'],['research','Riset topik'],['both','Konten + riset']].map(([v,l])=>'<option value="'+v+'" '+(o.mode===v?'selected':'')+'>'+l+'</option>').join('')+'</select></div><div class="field"><label for="ai-count">Jumlah</label><input id="ai-count" type="number" min="1" max="50" step="1" required value="'+o.count+'"></div></div><small id="ai-count-help">1–50 per proses demo. '+(o.mode==='both'?'Untuk konten dan brief masing-masing.':'')+'</small><details class="simple-options"><summary>Opsi tambahan</summary><div class="field"><label for="ai-topic">Fokus topik (opsional)</label><input id="ai-topic" maxlength="100" value="'+E(o.topic||'')+'" placeholder="Contoh: layanan pelanggan"></div><div id="research-options" '+(o.mode==='generate'?'hidden':'')+'><div class="field"><label for="research-urls">Referensi riset (opsional)</label><textarea id="research-urls" rows="2" maxlength="1200" placeholder="https://...">'+E(o.researchURLs||'')+'</textarea><small>Tautan belum diakses dalam demo.</small></div></div></details><div class="simple-schedule-toggle"><label class="check-label"><input id="schedule-enabled" type="checkbox" aria-label="Jadwalkan otomatis" '+(o.enabled?'checked':'')+'> Jadwalkan otomatis</label><span>WIB</span></div><div id="schedule-fields" '+(o.enabled?'':'hidden')+'><div class="field-grid"><div class="field"><label for="schedule-frequency">Frekuensi</label><select id="schedule-frequency">'+[['daily','Setiap hari'],['workdays','Hari kerja'],['weekly','Setiap minggu'],['monthly','Setiap bulan']].map(([v,l])=>'<option value="'+v+'" '+(o.frequency===v?'selected':'')+'>'+l+'</option>').join('')+'</select></div><div class="field"><label for="schedule-time">Waktu</label><input id="schedule-time" type="time" value="'+E(o.time)+'" required></div></div><div class="field" id="weekday-field" '+(o.frequency==='weekly'?'':'hidden')+'><label for="schedule-weekday">Hari</label><select id="schedule-weekday">'+['Minggu','Senin','Selasa','Rabu','Kamis','Jumat','Sabtu'].map((d,i)=>'<option value="'+i+'" '+(Number(o.weekday)===i?'selected':'')+'>'+d+'</option>').join('')+'</select></div><div class="field" id="monthday-field" '+(o.frequency==='monthly'?'':'hidden')+'><label for="schedule-monthday">Tanggal</label><select id="schedule-monthday">'+Array.from({length:28},(_,i)=>'<option '+(Number(o.monthday)===i+1?'selected':'')+'>'+(i+1)+'</option>').join('')+'</select></div></div><p id="plan-error" class="error" role="alert"></p><div class="plan-actions"><button class="btn primary" type="submit" data-intent="run">'+I('spark')+'Buat sekarang</button><button class="btn" type="submit" data-intent="save">'+I('calendar')+'Simpan jadwal</button></div><div class="simple-saved-status">'+(state.schedule.enabled?'Jadwal aktif: '+saved.count+' '+(saved.mode==='research'?'brief riset':'draft')+' · '+E(scheduleLabel()):'Belum ada jadwal aktif.')+'</div></form><div class="table-note">AI dan riset disimulasikan. Video/audio berupa konsep dan naskah. Jadwal berjalan selama halaman terbuka.</div></section>';
+  }
+  function syncBrainSelection(){
+    if(view!=='brain'||!$('#ai-scope'))return;
+    let o;try{o=readAIPlan();}catch{o=aiDraft||{...state.automation,...state.schedule};}
+    aiDraft={...o,scope:selectedBrain.size?'selected':'all',sourceIDs:[...selectedBrain]};
+    $('#ai-scope').value=aiDraft.scope;
+    $('#plan-source-label').textContent=(selectedBrain.size||brainSources().length)+' materi menjadi sumber AI';
+    $('#brain-selection-label').textContent=selectedBrain.size?selectedBrain.size+' dipilih':'Seluruh Brain digunakan';
+    $('#brain-select-all').checked=brainSources().length>0&&brainSources().every(s=>selectedBrain.has(s.id));
+    document.querySelectorAll('.brain-source-check').forEach(c=>{c.checked=selectedBrain.has(c.value);});
+  }
+  function readAIPlan(){
+    const base=aiDraft||{...state.automation,...state.schedule};
+    const o={...base,count:Number($('#ai-count').value),mode:$('#ai-mode').value,topic:$('#ai-topic').value.trim(),researchURLs:$('#research-urls').value.trim(),scope:$('#ai-scope').value,sourceIDs:base.sourceIDs||[],enabled:$('#schedule-enabled').checked,frequency:$('#schedule-frequency').value,time:$('#schedule-time').value,weekday:Number($('#schedule-weekday').value),monthday:Number($('#schedule-monthday').value)};
+    if(!Number.isInteger(o.count)||o.count<1||o.count>50)throw new Error('Jumlah harus 1–50 per proses demo.');
+    if(o.scope==='selected'&&!brainSources().some(s=>o.sourceIDs.includes(s.id)))throw new Error('Pilih materi pada daftar Brain terlebih dahulu.');
+    const urls=o.researchURLs.split(/\s+/).filter(Boolean);if(urls.some(s=>{try{return !['http:','https:'].includes(new URL(s).protocol);}catch{return true;}}))throw new Error('Gunakan tautan http:// atau https:// untuk referensi riset.');
+    return o;
+  }
+  function resultRows(){
+    if(resultTab==='research')return researchRows();
+    const filtered=state.modules.filter(m=>m.title.toLowerCase().includes(resultQuery.toLowerCase())&&(resultStatus==='all'||m.status===resultStatus)&&(resultType==='all'||typeOf(m)===resultType));
+    if(!filtered.length)return empty(state.modules.length?'Tidak ada konten yang cocok':'Konten baru Anda akan muncul di sini',state.modules.length?'Coba kata kunci, tipe, atau status lain.':'Tambahkan materi melalui halaman Upload materi untuk mulai.');
+    return '<div class="content-grid">'+filtered.map(contentCard).join('')+'</div>';
+  }
+  function resultsView(){
+    return head('Hasil','Konten dan brief riset yang sudah dibuat.')+'<div class="result-tabs"><button class="'+(resultTab==='content'?'active':'')+'" data-action="result-tab" data-tab="content">Konten <b>'+state.modules.length+'</b></button><button class="'+(resultTab==='research'?'active':'')+'" data-action="result-tab" data-tab="research">Riset <b>'+state.research.length+'</b></button></div>'+
+    '<section class="card"><div class="toolbar"><h3>'+(resultTab==='research'?'Brief riset':'Semua konten')+' <span class="badge neutral">'+(resultTab==='research'?state.research.length:state.modules.length)+'</span></h3><div class="toolbar-controls"><div class="search">'+I('search')+'<input id="result-search" aria-label="Cari konten" placeholder="Cari judul konten..." value="'+E(resultQuery)+'"></div><select id="result-type" aria-label="Filter tipe konten"><option value="all">Semua tipe</option>'+visibleTypes.map(k=>{const t=types[k];return '<option value="'+k+'" '+(resultType===k?'selected':'')+'>'+t.label+'</option>';}).join('')+'</select><select id="result-status" aria-label="Filter status">'+[['all','Semua status'],['draft','Draft / konsep'],['ready','Sudah ditinjau']].map(x=>'<option value="'+x[0]+'" '+(resultStatus===x[0]?'selected':'')+'>'+x[1]+'</option>').join('')+'</select></div></div><div id="result-rows">'+resultRows()+'</div><div class="table-note">Text dapat diunduh sebagai TXT/PDF, SCORM sebagai ZIP demo. Video/audio berupa konsep dan naskah. Brief riset belum berisi temuan terverifikasi.</div></section>';
+  }
+  function modalHead(title,sub=''){return '<div class="modal-head"><div><h2 id="modal-title">'+title+'</h2>'+(sub?'<p>'+sub+'</p>':'')+'</div><button class="icon-btn" data-action="close" aria-label="Tutup dialog">'+I('close')+'</button></div>';}
+  function openModal(content,preview=false){const modal=$('#modal');modal.classList.toggle('preview',preview);$('#modal-content').innerHTML=content;fillIcons(modal);if(!modal.open)modal.showModal();}
+  function openGenerate(ids){
+    if(busy){toast('Pembuatan modul sebelumnya masih berlangsung.');return;}
+    const pairs=C.matchSources(state.sources);const selected=ids||(pairs[0]?[pairs[0].a,pairs[0].b]:readable().slice(0,2).map(s=>s.id));
+    openModal(modalHead('Buat modul baru','Opsional: pilih sendiri materi untuk modul tambahan.')+'<form id="generate-form"><div class="modal-body"><div class="field"><label for="generate-title">Judul modul <span class="muted">(opsional)</span></label><input id="generate-title" placeholder="Biarkan kosong untuk judul otomatis" maxlength="140"></div><label>Materi yang dipadukan <span class="muted">· minimal 1</span></label><div class="source-choices">'+state.sources.map(s=>'<label class="source-choice '+(!s.text?'disabled':'')+'"><input type="checkbox" name="generate-sources" value="'+E(s.id)+'" '+(selected.includes(s.id)&&s.text?'checked':'')+' '+(!s.text?'disabled':'')+'>'+fileIcon(s)+'<div><b>'+E(s.title)+'</b><small>'+(s.text?(s.sample?'Materi contoh · ':'')+'Teks tersedia':'Isi belum dibaca dalam demo')+'</small></div></label>').join('')+'</div><div class="generate-summary"><span>'+I('layers')+'Gabungkan materi terpilih</span><span>'+I('clock')+'Target '+state.settings.duration+' menit</span><span>'+I('book')+'Modul & '+(state.settings.quiz?'kuis':'ringkasan')+'</span></div><p id="generate-error" class="error" role="alert"></p>'+(readable().length<1?'<div class="spacer"></div><div class="inline-note">'+I('info')+'Upload satu materi TXT/MD, atau coba materi contoh.</div>':'')+'</div><div class="modal-foot"><small>Mode demo · Hasil akan disimpan sebagai draft.</small><button class="btn" type="button" data-action="close">Batal</button><button class="btn primary" type="submit" '+(readable().length<1?'disabled':'')+'>'+I('spark')+'Generate modul</button></div></form>');
+  }
+  const delay=ms=>new Promise(r=>setTimeout(r,ms));
+  async function generate(ids=[],origin='manual',customTitle='',options=null){
+    if(busy)return;
+    const o={...state.automation,...(options||{})},pool=origin==='sample'?state.sources.filter(s=>s.sample):brainSources();
+    const chosen=ids.length?ids:o.scope==='selected'?o.sourceIDs:[];
+    if(o.scope==='selected'&&!pool.some(s=>(chosen||[]).includes(s.id))){toast('Sumber pilihan tidak lagi tersedia. Pilih ulang materi di Brain.',true);return;}
+    let jobs=[];
+    try{if(o.mode!=='research')jobs=C.planBrainBatch(pool,{count:o.count,sourceIDs:chosen,topic:o.topic},state.modules.length);if(!Number.isInteger(Number(o.count))||o.count<1||o.count>50)throw new Error('Jumlah harus 1–50.');}catch(e){toast(e.message,true);return;}
+    const refs=pool.filter(s=>!chosen.length||chosen.includes(s.id));
+    if(o.mode==='research'&&!refs.length&&!o.topic){toast('Tambahkan materi ke Brain atau isi fokus topik untuk riset.',true);return;}
+    busy=true;
+    openModal(modalHead('Mengembangkan pengetahuan dari Brain','Menyusun banyak draft dengan sumber yang dapat ditelusuri.')+'<div class="progress-state"><span class="progress-orb">'+I('brain')+'</span><h3 id="progress-label">Menyiapkan '+refs.length+' sumber pengetahuan</h3><p>'+Number(o.count)+' '+(o.mode==='both'?'draft konten + '+o.count+' brief riset':o.mode==='research'?'brief riset':'draft konten')+' dalam proses demo ini.</p><div class="progress-track"><i id="progress-bar"></i></div><small>Simulasi AI · Tidak ada pencarian web atau produksi media asli</small></div>');
+    try{
+      await delay(350);if($('#progress-bar'))$('#progress-bar').style.width='40%';if($('#progress-label'))$('#progress-label').textContent='Memetakan sudut pembelajaran dan format hasil';
+      await delay(450);if($('#progress-bar'))$('#progress-bar').style.width='80%';await delay(350);
+      const made=jobs.map((job,i)=>{const m=C.createBrainContent(job,state.settings,state.modules.length+i);m.origin=origin;m.sample=refs.every(s=>s.sample);return m;});
+      const briefs=o.mode==='generate'?[]:Array.from({length:Number(o.count)},(_,i)=>({...C.researchBrief(o,refs,state.research.length+i),origin}));
+      state.modules.unshift(...made);state.research.unshift(...briefs);
+      if(origin==='scheduled'){state.schedule.lastRun=now();state.schedule.nextRun=C.nextRun(state.schedule).toISOString();}
+      state.lastBatch={contents:made.length,research:briefs.length,sources:refs.length,createdAt:now()};
+      if(origin==='manual')state.chat.push({role:'assistant',text:'Proses demo selesai: '+made.length+' draft konten dan '+briefs.length+' brief riset dari '+refs.length+' sumber Brain. Hasil dapat dibuka di Hasil konten. Draft dan brief masih perlu ditinjau; riset web belum dijalankan.'});
+      persist();view='results';resultTab=made.length?'content':'research';resultType='all';resultQuery='';resultStatus='all';render();$('#modal').close();
+      toast((made.length?made.length+' draft konten':'')+(made.length&&briefs.length?' dan ':'')+(briefs.length?briefs.length+' brief riset demo':'')+' tersedia.');
+    }catch(e){$('#modal').close();toast(e.message||'Proses belum berhasil.',true);}finally{busy=false;}
+  }
+  function researchRows(){
+    const list=state.research.filter(r=>r.title.toLowerCase().includes(resultQuery.toLowerCase()));
+    if(!list.length)return empty('Belum ada rencana riset','Minta AI merencanakan riset melalui AI & jadwal.');
+    return '<div class="research-list">'+list.map(r=>'<article class="research-row"><span>'+I('search')+'</span><div><span class="badge amber">Rencana riset · Demo</span><h3>'+E(r.title)+'</h3><p>'+r.sources.length+' sumber Brain · '+E(dt(r.createdAt))+' · Belum ada temuan terverifikasi</p></div><button class="btn small" data-action="research-preview" data-id="'+E(r.id)+'">Lihat brief</button></article>').join('')+'</div>';
+  }
+  function researchPreview(id){
+    const r=state.research.find(x=>x.id===id);if(!r)return;
+    openModal(modalHead('Brief riset','Rencana pencarian, belum merupakan hasil riset.')+'<div class="modal-body"><div class="preview-notice concept">'+I('info')+'<span>'+E(r.notice)+'</span></div><div class="prose"><h1>'+E(r.title)+'</h1><h2>Permintaan</h2><p>'+E(r.prompt||r.topic)+'</p><h2>Kata kunci pencarian yang disarankan</h2><ul>'+r.queries.map(q=>'<li>'+E(q)+'</li>').join('')+'</ul><h2>Referensi yang diminta</h2><ul>'+(r.requestedURLs.length?r.requestedURLs.map(u=>'<li>'+E(u)+' · belum diakses</li>').join(''):'<li>Belum ditentukan.</li>')+'</ul><h2>Sumber internal Brain</h2><ul>'+r.sources.map(s=>'<li>'+E(s.title)+'</li>').join('')+'</ul><h2>Temuan</h2><p>Belum tersedia. Pencarian web dan verifikasi sumber memerlukan koneksi layanan riset pada sistem produksi.</p></div></div><div class="modal-foot">'+button('Unduh brief TXT','download-research','primary','download','data-id="'+E(id)+'"')+'</div>');
+  }
+  function prose(m){
+    if(m.editedText)return '<div class="prose"><h1>'+E(m.title)+'</h1><p>'+E(m.editedText)+'</p></div>';
+    return '<article class="prose"><h1>'+E(m.title)+'</h1><h2>Tujuan pembelajaran</h2><ol>'+m.objectives.map(o=>'<li>'+E(o)+'</li>').join('')+'</ol>'+
+    m.sections.map(s=>'<h2>'+E(s.title)+'</h2><p>'+E(s.body)+'</p><p class="ref-line">Sumber: '+s.sourceIds.map(id=>E(m.sources.find(r=>r.id===id)?.title||'Materi sumber')).join(' · ')+'</p>').join('')+
+    (m.quiz.length?'<h2>Kuis pemahaman</h2>'+m.quiz.map((q,i)=>'<div class="quiz-item"><strong>'+(i+1)+'. '+E(q.q)+'</strong><ol>'+q.options.map(o=>'<li>'+E(o)+'</li>').join('')+'</ol><details><summary>Lihat kunci jawaban</summary><p>Jawaban: '+E('ABCD'[q.answer])+'. '+E(q.options[q.answer])+'</p></details></div>').join(''):'')+'</article>';
+  }
+  function contentSections(m){return m.editedText?[{title:'Naskah revisi',body:m.editedText,sourceIds:m.sources.map(s=>s.id)}]:m.sections;}
+  function typePreview(m){
+    const type=typeOf(m),sections=contentSections(m);
+    if(type==='video')return '<div class="video-preview"><div class="storyboard-screen" id="storyboard-screen"><span>STORYBOARD · ADEGAN 1</span><div>'+I('video')+'</div><h2>'+E(sections[0].title)+'</h2><p>'+E(sections[0].body.slice(0,240))+'</p><small>Pratinjau adegan · Belum berupa file video</small></div><div class="scene-list">'+sections.map((s,i)=>'<button class="'+(i===0?'active':'')+'" data-action="scene" data-index="'+i+'"><b>'+String(i+1).padStart(2,'0')+'</b>'+E(s.title)+'</button>').join('')+'</div></div><div class="spacer"></div><details class="script-details"><summary>Lihat naskah lengkap</summary>'+prose(m)+'</details>';
+    if(type==='audio')return '<div class="audio-preview"><span class="audio-orb">'+I('audio')+'</span><div class="waveform" aria-hidden="true">'+Array.from({length:36},(_,i)=>'<i style="height:'+([16,29,45,22,37,56,31,19,43][i%9])+'px"></i>').join('')+'</div><h2>'+E(m.title)+'</h2><p>Pratinjau naskah dengan suara perangkat. Belum berupa file audio.</p><div class="head-actions">'+button('Dengarkan naskah','speak','primary','audio')+button('Hentikan','stop-speech','','close')+'</div><small id="speech-status" role="status">Tekan dengarkan untuk memulai.</small></div><div class="spacer"></div>'+prose(m);
+    if(type==='scorm')return '<div class="scorm-preview"><div class="scorm-preview-head">'+I('scorm')+'<div><b>Modul interaktif</b><small>SCORM 1.2 · '+sections.length+' bagian · Paket ZIP demo</small></div></div><h2>'+E(m.title)+'</h2><p>Pilih bagian untuk membuka materi.</p>'+sections.map((s,i)=>'<details class="chapter" '+(i===0?'open':'')+'><summary><span>'+String(i+1).padStart(2,'0')+'</span>'+E(s.title)+'</summary><p>'+E(s.body)+'</p></details>').join('')+'</div>';
+    return prose(m);
+  }
+  function stopSpeech(){if('speechSynthesis' in window)window.speechSynthesis.cancel();}
+  function preview(id,editing=false){
+    stopSpeech();
+    const m=state.modules.find(x=>x.id===id);if(!m)return;previewID=id;
+    const type=typeOf(m),media=type==='video'||type==='audio';
+    const side='<aside class="preview-side"><h3>Informasi konten</h3>'+typeBadge(type)+'<div class="detail-label">Status</div>'+status(m)+'<div class="detail-label">Audiens</div><b>'+E(m.audience)+'</b><div class="detail-label">Target durasi</div><b>'+m.duration+' menit</b><div class="detail-label">Pembuatan</div><b>'+(m.origin==='scheduled'?'Sesuai jadwal':m.sample?'Materi contoh':'Setelah upload')+'</b><div class="detail-label">Materi sumber</div>'+m.sources.map(s=>'<div class="preview-source">'+I('file')+E(s.title)+'</div>').join('')+'</aside>';
+    const body=editing?'<form id="edit-form"><div class="field"><label for="edit-title">Judul konten</label><input id="edit-title" maxlength="140" required value="'+E(m.title)+'"></div><div class="field"><label for="edit-text">Isi / naskah konten</label><textarea id="edit-text" class="edit-area" required>'+E(m.editedText||C.moduleText(m).split('\n').slice(1).join('\n').trim())+'</textarea></div><button class="btn primary" type="submit">'+I('check')+'Simpan revisi</button></form>':typePreview(m);
+    const exportAction=media?button('Unduh naskah TXT','download-txt','','download','data-id="'+E(id)+'"'):button(type==='scorm'?'Unduh SCORM ZIP':'Unduh PDF',type==='scorm'?'download-scorm':'download-pdf','primary','download','data-id="'+E(id)+'"');
+    openModal(modalHead('Pratinjau '+types[type].label,'Format hasil mengikuti jenis materi sumber.')+'<div class="modal-body"><div class="preview-notice '+(m.basis==='filename'?'concept':'')+'">'+I('info')+'<span>'+E(m.notice||'Hasil simulasi. Tinjau sebelum digunakan.')+(media?' Ekspor file '+types[type].label.toLowerCase()+' asli belum tersedia dalam demo.':'')+'</span></div><div class="preview-tabs"><button data-action="preview-tab" data-editing="no" class="'+(!editing?'active':'')+'">Pratinjau '+types[type].label+'</button><button data-action="preview-tab" data-editing="yes" class="'+(editing?'active':'')+'">Sunting '+(media?'naskah':'isi')+'</button></div><div class="preview-layout"><div>'+body+'</div>'+side+'</div></div><div class="modal-foot"><small>'+(media?'Pratinjau konsep · Ekspor media pada versi produksi':'File demo · Tinjau sebelum digunakan')+'</small>'+(type==='text'?button('Unduh Text TXT','download-txt','','download','data-id="'+E(id)+'"'):'')+exportAction+button(m.status==='ready'?'Sudah ditinjau':'Tandai sudah ditinjau','approve','','check','data-id="'+E(id)+'" '+(m.status==='ready'?'disabled':''))+'</div>',true);
+  }
+  function download(id,type){
+    const m=state.modules.find(x=>x.id===id);if(!m)return;
+    const text=C.moduleText(m),data=type==='scorm'?C.makeSCORM(m):type==='pdf'?C.makePDF(text):text,extension=type==='scorm'?'zip':type;
+    const blob=new Blob([data],{type:type==='scorm'?'application/zip':type==='pdf'?'application/pdf':'text/plain;charset=utf-8'}),url=URL.createObjectURL(blob),a=document.createElement('a');
+    a.href=url;a.download=m.title.toLowerCase().replace(/[^a-z0-9]+/g,'-').replace(/^-|-$/g,'')+'.'+extension;document.body.appendChild(a);a.click();a.remove();setTimeout(()=>URL.revokeObjectURL(url),1500);toast('Unduhan '+type.toUpperCase()+' disiapkan.');
+  }
+  function showHelp(){
+    const steps=[['Upload materi','Setelah login, tambahkan dokumen, video, audio, atau SCORM. Materi masuk ke Brain.'],['Brain & AI','Daftar sumber, permintaan AI, jumlah draft, dan jadwal ada dalam satu halaman. Pilih materi atau kosongkan pilihan untuk seluruh Brain. Tulis permintaan, terapkan rencana, lalu buat sekarang atau simpan jadwal.'],['Hasil','Buka draft konten dan brief riset. Text dan SCORM demo dapat diunduh. Video/audio berupa konsep dan naskah; riset belum berisi temuan terverifikasi.']];
+    openModal(modalHead('Alur Learning Lab Express','Upload materi → Brain & AI → Hasil.')+'<div class="modal-body"><div class="help-steps">'+steps.map((x,i)=>'<div class="help-step"><span>'+(i+1)+'</span><div><h3>'+x[0]+'</h3><p>'+x[1]+'</p></div></div>').join('')+'</div><div class="spacer"></div><div class="inline-note">'+I('info')+'Proses AI dan jadwal adalah simulasi. Demo membaca TXT/MD; format lain belum dianalisis. Jadwal hanya berjalan selama halaman terbuka. Jumlah demo 1–50 draft/brief per proses.</div></div><div class="modal-foot">'+button('Mulai mencoba','close','primary','arrow-right')+'</div>');
+  }
+  async function uploadFiles(files){
+    if(busy){toast('Konten sedang disiapkan. Tambahkan materi lagi setelah proses selesai.');return;}
+    if(!files.length)return;
+    busy=true;
+    const issues=[],addedIDs=[];
+    try{
+      for(const f of files){
+        const ext=f.name.split('.').pop().toLowerCase(),type=C.contentType(f.name);
+        if(!type){issues.push(f.name+': format belum didukung');continue;}
+        if(f.size>200*1024*1024){issues.push(f.name+': melebihi 200 MB');continue;}
+        if(!f.size){issues.push(f.name+': berkas kosong');continue;}
+        if(state.sources.some(s=>s.originalName===f.name&&s.bytes===f.size)){issues.push(f.name+': sudah terdaftar');continue;}
+        if(state.sources.length>=100){issues.push('Maksimal 100 materi untuk demo ini.');break;}
+        if(type==='scorm'&&!C.isSCORM(new Uint8Array(await f.arrayBuffer()))){issues.push(f.name+': ZIP harus berisi imsmanifest.xml di folder utama');continue;}
+        let text='';if(ext==='txt'||ext==='md')text=(await f.text()).slice(0,25000).trim();
+        if((ext==='txt'||ext==='md')&&!text){issues.push(f.name+': isi teks kosong');continue;}
+        const id='src-'+(crypto.randomUUID?crypto.randomUUID():Date.now()+'-'+Math.random().toString(36).slice(2));
+        state.sources.unshift({id,title:f.name.replace(/\.[^.]+$/,''),originalName:f.name,format:type==='scorm'?'SCORM':ext.toUpperCase(),tags:[],text,bytes:f.size,createdAt:now(),sample:false});
+        if(type==='video'||type==='audio')sourceURLs.set(id,URL.createObjectURL(f));
+        addedIDs.push(id);
+      }
+    }catch(e){issues.push('Berkas belum dapat dibaca: '+e.message);}
+    finally{busy=false;$('#file-input').value='';}
+    state.lastUploadIDs=addedIDs;selectedBrain.clear();aiDraft={...state.automation,...state.schedule,scope:'all',sourceIDs:[]};persist();view='sources';render();
+    if(issues.length)openModal(modalHead('Sebagian materi belum ditambahkan')+'<div class="modal-body"><ul class="upload-issues">'+issues.map(x=>'<li>'+E(x)+'</li>').join('')+'</ul><p>Materi lain yang berhasil ditambahkan tetap tersimpan.</p></div><div class="modal-foot">'+(addedIDs.length?button('Lihat '+addedIDs.length+' materi di Brain','continue-upload','primary','spark','data-ids="'+E(addedIDs.join(','))+'"'):button('Tutup','close','','close'))+'</div>');
+    else if(addedIDs.length){go('brain');toast(addedIDs.length+' materi ditambahkan ke Brain. Minta AI untuk mulai membuat konten.');}
+  }
+  function bindView(){
+    const messages=$('.ai-messages');if(messages)messages.scrollTop=messages.scrollHeight;
+    const sourceSearch=$('#source-search');if(sourceSearch)sourceSearch.addEventListener('input',e=>{sourceQuery=e.target.value;$('#source-rows').innerHTML=sourceRows();});
+    const resultSearch=$('#result-search');if(resultSearch)resultSearch.addEventListener('input',e=>{resultQuery=e.target.value;$('#result-rows').innerHTML=resultRows();});
+    const filter=$('#result-status');if(filter)filter.addEventListener('change',e=>{resultStatus=e.target.value;$('#result-rows').innerHTML=resultRows();});
+    const typeFilter=$('#result-type');if(typeFilter)typeFilter.addEventListener('change',e=>{resultType=e.target.value;$('#result-rows').innerHTML=resultRows();});
+    const mode=$('#ai-mode');if(mode)mode.addEventListener('change',()=>{$('#research-options').hidden=mode.value==='generate';$('#ai-count-help').textContent='1–50 per proses demo. '+(mode.value==='both'?'Jumlah berlaku untuk konten dan brief masing-masing.':'');});
+    if(view==='results'&&resultTab==='research'){$('#result-type').hidden=true;$('#result-status').hidden=true;}
+    const frequency=$('#schedule-frequency');if(frequency)frequency.addEventListener('change',e=>{$('#weekday-field').hidden=e.target.value!=='weekly';$('#monthday-field').hidden=e.target.value!=='monthly';});
+    const drop=$('#drop-zone');if(drop){
+      ['dragenter','dragover'].forEach(t=>drop.addEventListener(t,e=>{e.preventDefault();drop.classList.add('drag');}));
+      ['dragleave','drop'].forEach(t=>drop.addEventListener(t,e=>{e.preventDefault();drop.classList.remove('drag');}));
+      drop.addEventListener('drop',e=>uploadFiles([...e.dataTransfer.files]));
+    }
+  }
+  document.addEventListener('click',e=>{
+    const nav=e.target.closest('[data-nav]');if(nav){e.preventDefault();go(nav.dataset.nav);return;}
+    const el=e.target.closest('[data-action]');if(!el||el.disabled)return;e.preventDefault();
+    const action=el.dataset.action,id=el.dataset.id;
+    if(action==='toggle-password'){const input=$('#login-password');input.type=input.type==='password'?'text':'password';el.setAttribute('aria-label',input.type==='password'?'Tampilkan password':'Sembunyikan password');}
+    else if(action==='logout'){stopSpeech();view='sources';state.user=null;persist();render();}
+    else if(action==='help')showHelp();
+    else if(action==='close'){stopSpeech();$('#modal').close();}
+    else if(action==='to-sources')go('sources');
+    else if(action==='to-schedule')go('brain');
+    else if(action==='upload'){if(view!=='sources')go('sources');$('#file-input').click();}
+    else if(action==='generate')go('brain');
+    else if(action==='brain-to-ai')go('brain');
+    else if(action==='load-brain-demo'){sampleSources().forEach(s=>{if(!state.sources.some(x=>x.id===s.id))state.sources.push(s);});persist();go('brain');}
+    else if(action==='prompt-example'){$('#ai-prompt').value=el.dataset.prompt;$('#ai-prompt').focus();}
+    else if(action==='result-tab'){resultTab=el.dataset.tab;resultQuery='';render();}
+    else if(action==='research-preview')researchPreview(id);
+    else if(action==='download-research'){const r=state.research.find(x=>x.id===id);if(r){const text=[r.title,r.notice,r.prompt,...r.queries,...r.requestedURLs,...r.sources.map(s=>s.title)].join('\n\n'),url=URL.createObjectURL(new Blob([text],{type:'text/plain;charset=utf-8'})),a=document.createElement('a');a.href=url;a.download='brief-riset-'+r.id+'.txt';a.click();setTimeout(()=>URL.revokeObjectURL(url),1500);}}
+    else if(action==='pair')openGenerate(el.dataset.pair.split(','));
+    else if(action==='preview')preview(id);
+    else if(action==='preview-tab')preview(previewID,el.dataset.editing==='yes');
+    else if(action==='download-pdf')download(id,'pdf');
+    else if(action==='download-txt')download(id,'txt');
+    else if(action==='download-scorm')download(id,'scorm');
+    else if(action==='continue-upload'){$('#modal').close();go('brain');}
+    else if(action==='scene'){
+      const m=state.modules.find(x=>x.id===previewID),index=Number(el.dataset.index),scene=m?contentSections(m)[index]:null;if(scene){$('#storyboard-screen').innerHTML='<span>STORYBOARD · ADEGAN '+(index+1)+'</span><div>'+I('video')+'</div><h2>'+E(scene.title)+'</h2><p>'+E(scene.body.slice(0,240))+'</p><small>Pratinjau adegan · Belum berupa file video</small>';document.querySelectorAll('.scene-list button').forEach(b=>b.classList.toggle('active',b===el));}
+    }
+    else if(action==='speak'){
+      const m=state.modules.find(x=>x.id===previewID);if(!m)return;
+      if(!('speechSynthesis' in window)){toast('Perangkat ini belum mendukung pratinjau suara. Naskah tetap dapat dibaca dan diunduh.',true);return;}
+      stopSpeech();const utterance=new SpeechSynthesisUtterance(m.editedText||m.sections.map(s=>s.title+'. '+s.body).join('\n'));
+      utterance.lang='id-ID';const voice=speechSynthesis.getVoices().find(v=>v.lang.startsWith('id'));if(voice)utterance.voice=voice;
+      utterance.onstart=()=>{if($('#speech-status'))$('#speech-status').textContent='Membacakan naskah dengan suara perangkat…';};utterance.onend=()=>{if($('#speech-status'))$('#speech-status').textContent='Pratinjau selesai.';};utterance.onerror=()=>{if($('#speech-status'))$('#speech-status').textContent='Pratinjau suara tidak tersedia. Anda tetap bisa mengunduh naskah.';};speechSynthesis.speak(utterance);
+    }
+    else if(action==='stop-speech'){stopSpeech();if($('#speech-status'))$('#speech-status').textContent='Pratinjau dihentikan.';}
+    else if(action==='approve'){const m=state.modules.find(x=>x.id===id);if(m){m.status='ready';persist();render();preview(id);toast('Modul ditandai siap digunakan.');}}
+    else if(action==='try-auto'){const samples=sampleSources();samples.forEach(s=>{if(!state.sources.some(x=>x.id===s.id))state.sources.push(s);});persist();generate(samples.map(s=>s.id),'sample');}
+    else if(action==='samples'){let n=0;sampleSources().forEach(s=>{if(!state.sources.some(x=>x.id===s.id)){state.sources.push(s);n++;}});persist();render();toast(n?n+' materi contoh ditambahkan.':'Tiga materi contoh sudah tersedia.');}
+    else if(action==='source-preview'){
+      const s=state.sources.find(x=>x.id===id);if(s){const type=C.contentType(s),url=sourceURLs.get(id);const player=url&&type==='video'?'<video class="source-player" controls src="'+E(url)+'"></video>':url&&type==='audio'?'<audio class="source-player" controls src="'+E(url)+'"></audio>':'';openModal(modalHead(E(s.title),(s.sample?'Materi contoh · ':'')+E(s.format)+' · '+types[type==='pdf'?'text':type||'text'].label)+'<div class="modal-body">'+player+(s.text?'<div class="source-text">'+E(s.text)+'</div>':'<div class="inline-note">'+I('info')+'Berkas asli terdaftar. Isi belum dianalisis dalam demo; hasil baru berupa konsep dari nama berkas. Pratinjau media asli tersedia selama sesi upload.</div>')+'</div><div class="modal-foot">'+button('Tutup','close','','close')+'</div>');}
+    }
+    else if(action==='source-delete'){
+      const s=state.sources.find(x=>x.id===id);if(s)openModal(modalHead('Hapus materi dari perpustakaan?')+'<div class="modal-body"><p style="font-size:12px">Materi <b>'+E(s.title)+'</b> akan dihapus dari demo ini. Modul yang sudah terbentuk tetap tersimpan beserta catatan sumbernya.</p></div><div class="modal-foot">'+button('Batal','close','','close')+button('Hapus materi','source-delete-confirm','danger','trash','data-id="'+E(id)+'"')+'</div>');
+    }
+    else if(action==='source-delete-confirm'){state.sources=state.sources.filter(s=>s.id!==id);if(sourceURLs.has(id)){URL.revokeObjectURL(sourceURLs.get(id));sourceURLs.delete(id);}persist();$('#modal').close();render();toast('Materi dihapus dari perpustakaan demo.');}
+    else if(action==='simulate'){
+      generate([],'scheduled');
+    }
+  });
+  document.addEventListener('change',e=>{
+    if(e.target.matches('.brain-source-check')){if(e.target.checked)selectedBrain.add(e.target.value);else selectedBrain.delete(e.target.value);syncBrainSelection();}
+    if(e.target.id==='brain-select-all'){selectedBrain=e.target.checked?new Set(brainSources().map(s=>s.id)):new Set();syncBrainSelection();}
+    if(e.target.id==='schedule-enabled')$('#schedule-fields').hidden=!e.target.checked;
+  });
+  document.addEventListener('submit',e=>{
+    const form=e.target;
+    if(form.id==='login-form'){e.preventDefault();const email=$('#login-email').value.trim();if(!email||!$('#login-password').value){$('#login-error').textContent='Lengkapi email dan password.';return;}const raw=email.split('@')[0].split(/[._-]/)[0];state.user={email,name:raw.charAt(0).toUpperCase()+raw.slice(1)};state.remember=!!$('#login-form input[type=checkbox]').checked;persist();render();}
+    else if(form.id==='settings-form'){e.preventDefault();state.settings={topic:$('#setting-topic').value.trim(),audience:$('#setting-audience').value.trim()||'Seluruh karyawan',duration:Number($('#setting-duration').value),tone:$('#setting-tone').value,language:'Bahasa Indonesia',exercise:$('#setting-exercise').checked,quiz:$('#setting-quiz').checked,saved:true};persist();render();toast('Pengaturan modul AI disimpan.');}
+    else if(form.id==='ai-request-form'){
+      e.preventDefault();try{const current=readAIPlan(),prompt=$('#ai-prompt').value.trim();if(!prompt)return;const proposal=C.parseAIRequest(prompt,current);aiDraft=proposal;state.chat.push({role:'user',text:prompt},{role:'assistant',text:'Rencana: '+proposal.count+' '+(proposal.mode==='research'?'brief riset':proposal.mode==='both'?'draft konten dan '+proposal.count+' brief riset':'draft konten')+' dari Brain. '+(proposal.enabled?'Jadwal yang diusulkan: '+({daily:'setiap hari',workdays:'hari kerja',weekly:'setiap minggu',monthly:'setiap bulan'}[proposal.frequency])+' pukul '+proposal.time+' WIB. ':'Dijalankan saat Anda meminta. ')+'Atur jumlah dan jadwal di bawah, lalu buat sekarang atau simpan jadwal. Ini simulasi AI dan riset.'});persist();render();}catch(error){$('#plan-error').textContent=error.message;}
+    }
+    else if(form.id==='schedule-form'){
+      e.preventDefault();try{const o=readAIPlan();state.automation={count:o.count,mode:o.mode,topic:o.topic,prompt:o.prompt||'',researchURLs:o.researchURLs,scope:o.scope,sourceIDs:o.sourceIDs};aiDraft=o;
+        if(e.submitter?.dataset.intent==='run'){persist();generate([],'manual','',o);}
+        else{state.schedule={...state.schedule,enabled:o.enabled,frequency:o.frequency,time:o.time,weekday:o.weekday,monthday:o.monthday,plan:{...state.automation,sourceIDs:[...state.automation.sourceIDs]}};state.schedule.nextRun=o.enabled?C.nextRun(state.schedule).toISOString():null;aiDraft=null;persist();render();toast(o.enabled?'Jadwal AI disimpan. Proses demo berjalan selama halaman terbuka.':'Rencana disimpan, jadwal otomatis nonaktif.');}
+      }catch(error){$('#plan-error').textContent=error.message;}
+    }
+    else if(form.id==='generate-form'){e.preventDefault();const ids=[...form.querySelectorAll('input[name=generate-sources]:checked')].map(x=>x.value);if(!ids.length){$('#generate-error').textContent='Pilih minimal satu materi.';return;}generate(ids,'manual',$('#generate-title').value.trim());}
+    else if(form.id==='edit-form'){e.preventDefault();const m=state.modules.find(x=>x.id===previewID);if(m){m.title=$('#edit-title').value.trim();m.editedText=$('#edit-text').value.trim();m.status='draft';persist();render();preview(m.id);toast('Revisi modul disimpan sebagai draft.');}}
+  });
+  $('#file-input').addEventListener('change',e=>uploadFiles([...e.target.files]));
+  $('#modal').addEventListener('click',e=>{if(e.target===$('#modal'))$('#modal').close();});
+  $('#modal').addEventListener('close',stopSpeech);
+  setInterval(()=>{if(!state.user||busy||!state.schedule.enabled||!state.schedule.nextRun||Date.now()<new Date(state.schedule.nextRun).getTime())return;state.schedule.nextRun=C.nextRun(state.schedule).toISOString();persist();generate([],'scheduled','',state.schedule.plan||state.automation);},15000);
+  render();
+})();
+</script>
+</body>
+</html>
diff --git a/package-lock.json b/package-lock.json
new file mode 100644
index 0000000..75e5bde
--- /dev/null
+++ b/package-lock.json
@@ -0,0 +1,2328 @@
+{
+  "name": "learning-lab-express",
+  "version": "0.1.0",
+  "lockfileVersion": 3,
+  "requires": true,
+  "packages": {
+    "": {
+      "name": "learning-lab-express",
+      "version": "0.1.0",
+      "dependencies": {
+        "@clerk/localizations": "^4.24.0",
+        "@clerk/react": "^6.2.0",
+        "@tanstack/react-query": "^5.90.0",
+        "react": "^19.2.0",
+        "react-dom": "^19.2.0",
+        "react-router-dom": "^7.9.6"
+      },
+      "devDependencies": {
+        "@types/node": "^24.10.1",
+        "@types/react": "^19.2.5",
+        "@types/react-dom": "^19.2.3",
+        "@vitejs/plugin-react": "^5.1.1",
+        "typescript": "~5.9.3",
+        "vite": "^7.2.4",
+        "vitest": "^5.0.5"
+      }
+    },
+    "node_modules/@babel/code-frame": {
+      "version": "7.29.7",
+      "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.29.7.tgz",
+      "integrity": "sha512-Aup7aUOfpbAUg2ROOJN6Iw5f9DMBlzu0mIkm/malLQFN/YQgO48wCj0Kxa3sEHJvPVFg7siR+qRInwXd2qhQKw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/helper-validator-identifier": "^7.29.7",
+        "js-tokens": "^4.0.0",
+        "picocolors": "^1.1.1"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/compat-data": {
+      "version": "7.29.7",
+      "resolved": "https://registry.npmjs.org/@babel/compat-data/-/compat-data-7.29.7.tgz",
+      "integrity": "sha512-locTkQyKvwIEgBzVrn8693ebc97F2U8ZHjbXwDXJ5Fn2TCpNwTlKcaKLkdHop5c/icOFE7qt7Q9JC5hnKNa6Gg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/core": {
+      "version": "7.29.7",
+      "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.29.7.tgz",
+      "integrity": "sha512-RgHBCvtjbOK2gXSNBNIkNoEc9qoVEtau3hj8gEqKQuL3HZAibKarWFEI3Lfm6EYKkLalOh8eSrj9b+ch9H/VBA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/code-frame": "^7.29.7",
+        "@babel/generator": "^7.29.7",
+        "@babel/helper-compilation-targets": "^7.29.7",
+        "@babel/helper-module-transforms": "^7.29.7",
+        "@babel/helpers": "^7.29.7",
+        "@babel/parser": "^7.29.7",
+        "@babel/template": "^7.29.7",
+        "@babel/traverse": "^7.29.7",
+        "@babel/types": "^7.29.7",
+        "@jridgewell/remapping": "^2.3.5",
+        "convert-source-map": "^2.0.0",
+        "debug": "^4.1.0",
+        "gensync": "^1.0.0-beta.2",
+        "json5": "^2.2.3",
+        "semver": "^6.3.1"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/babel"
+      }
+    },
+    "node_modules/@babel/generator": {
+      "version": "7.29.8",
+      "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.29.8.tgz",
+      "integrity": "sha512-gZbepsdh3WDtgZKWL+vTPh71LSBrm/Y4/QDZBVCcYfmeTEEuoOYwlSy+G1StfJg+/Zy550u/3TATbm7qDbbMtg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/parser": "^7.29.8",
+        "@babel/types": "^7.29.8",
+        "@jridgewell/gen-mapping": "^0.3.12",
+        "@jridgewell/trace-mapping": "^0.3.28",
+        "jsesc": "^3.0.2"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helper-compilation-targets": {
+      "version": "7.29.7",
+      "resolved": "https://registry.npmjs.org/@babel/helper-compilation-targets/-/helper-compilation-targets-7.29.7.tgz",
+      "integrity": "sha512-wem6WaBj4NaVYVdNhLPPVacES6ZJ+KBBfSkTMD3YZxbP3rm3Di85tJU5ljaUNhaOynt+Aj0xruhYuzQBt8n71g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/compat-data": "^7.29.7",
+        "@babel/helper-validator-option": "^7.29.7",
+        "browserslist": "^4.24.0",
+        "lru-cache": "^5.1.1",
+        "semver": "^6.3.1"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helper-globals": {
+      "version": "7.29.7",
+      "resolved": "https://registry.npmjs.org/@babel/helper-globals/-/helper-globals-7.29.7.tgz",
+      "integrity": "sha512-3nQVUAtvkKH9zahfWgw96Jc/uFOmjACE1kQz82E2lqWmHBgjzbNlsC22nuQTfahmWeQtTq5nQ/4Nnd2A1wj4zA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helper-module-imports": {
+      "version": "7.29.7",
+      "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.29.7.tgz",
+      "integrity": "sha512-ejHwrQQYcm9xnTivShn2IDOlIzInN34AXskvq9QicvCtEzq1Vzclu/tKF8Jq1Cg8JG2GL6/EmjgsCT7lXepE3g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/traverse": "^7.29.7",
+        "@babel/types": "^7.29.7"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helper-module-transforms": {
+      "version": "7.29.7",
+      "resolved": "https://registry.npmjs.org/@babel/helper-module-transforms/-/helper-module-transforms-7.29.7.tgz",
+      "integrity": "sha512-UPUVSyXbOh627KiCIGQSgwWzGeBKLkaJ9PJEdrngIwMSzxLR4jS4+f1f1jb7VzBbg8nFLaYotvVPFCTqdrmTAg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/helper-module-imports": "^7.29.7",
+        "@babel/helper-validator-identifier": "^7.29.7",
+        "@babel/traverse": "^7.29.7"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      },
+      "peerDependencies": {
+        "@babel/core": "^7.0.0"
+      }
+    },
+    "node_modules/@babel/helper-plugin-utils": {
+      "version": "7.29.7",
+      "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.29.7.tgz",
+      "integrity": "sha512-G7sHYigPY17oO5SYWnfD/0MTBwVR781S/JI643e/JhUYgVgWE/61SoW3NH9KWUKyKq5LVh3npif99Wkt6j86Jw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helper-string-parser": {
+      "version": "7.29.7",
+      "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-7.29.7.tgz",
+      "integrity": "sha512-Pb5ijPrZ89GDH8223L4UP8i6QApWxs04RbPQJTeWDV0/keR2E36MeKnyr6LYmUUvqRRI+Iv87SuF1W6ErINzYw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helper-validator-identifier": {
+      "version": "7.29.7",
+      "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.29.7.tgz",
+      "integrity": "sha512-qehxGkRj55h/ff8EMaJ+cYhyaKlHIxqYDn682wQD7RNp9UujOQsHog2uS0r2vzr4pW+sXf90NeeayjcNaX3fFg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helper-validator-option": {
+      "version": "7.29.7",
+      "resolved": "https://registry.npmjs.org/@babel/helper-validator-option/-/helper-validator-option-7.29.7.tgz",
+      "integrity": "sha512-N9ZErrD+yW5geCDtBqnOoxmR8+tNKiGuxKlDpuJxfsqpa2dFcexaziGAE/qoHLiDDreVNMupxGmSoNlyvsA3gw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helpers": {
+      "version": "7.29.10",
+      "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.29.10.tgz",
+      "integrity": "sha512-EMCx3AGZ3WfAl6ht7AyQoPm2Lh+BGYEMdc4Q6Hf7uSCDOZFuLq44qNwL+iaim8VlyYhRAo4X43+weadK8ZB4Yg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/template": "^7.29.7",
+        "@babel/types": "^7.29.8"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/parser": {
+      "version": "7.29.9",
+      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.29.9.tgz",
+      "integrity": "sha512-CjXrNHTnvqBVqHgdBysY3vk2T8tpJHb5/RMeHJBTyVa9xgugCB0CJTx/3oO8RV2QRQP391RWpB7D6hLjm8V9uA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/types": "^7.29.8"
+      },
+      "bin": {
+        "parser": "bin/babel-parser.js"
+      },
+      "engines": {
+        "node": ">=6.0.0"
+      }
+    },
+    "node_modules/@babel/plugin-transform-react-jsx-self": {
+      "version": "7.29.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx-self/-/plugin-transform-react-jsx-self-7.29.7.tgz",
+      "integrity": "sha512-TL0hMc9xzy86VD31nUiwzd5otRAcyEPcsegCxolO0PvcXuH1v0kECe/UIznYFihpkvU5wg/jk4v0TTEFfm53fw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/helper-plugin-utils": "^7.29.7"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      },
+      "peerDependencies": {
+        "@babel/core": "^7.0.0-0"
+      }
+    },
+    "node_modules/@babel/plugin-transform-react-jsx-source": {
+      "version": "7.29.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx-source/-/plugin-transform-react-jsx-source-7.29.7.tgz",
+      "integrity": "sha512-06IyK09H3wi4cGbhDBwp5gUGo0IKtnYa8tyTiephirPCK6fbobVGiXMMI5zLQ4aKEYP3wZ3ArU44o+8KMrSG/Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/helper-plugin-utils": "^7.29.7"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      },
+      "peerDependencies": {
+        "@babel/core": "^7.0.0-0"
+      }
+    },
+    "node_modules/@babel/template": {
+      "version": "7.29.7",
+      "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.29.7.tgz",
+      "integrity": "sha512-puq+Gf35oI24FeN11LkoUQFqv9uwNeWpxXZi/Ji3rRIoKAzKnxRaZ+Gkj0vKS9ZCiTESfng1N9LyOyXvo+m+Gg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/code-frame": "^7.29.7",
+        "@babel/parser": "^7.29.7",
+        "@babel/types": "^7.29.7"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/traverse": {
+      "version": "7.29.10",
+      "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.29.10.tgz",
+      "integrity": "sha512-B3lYAs2nkKskbgQ1nfy8Ma9ao9Q1rntTAQHrzzyDuj+TSO+X3le6PfWwqDvodsb+OumE10eMFfuMCTQSQ5iuIQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/code-frame": "^7.29.7",
+        "@babel/generator": "^7.29.8",
+        "@babel/helper-globals": "^7.29.7",
+        "@babel/parser": "^7.29.9",
+        "@babel/template": "^7.29.7",
+        "@babel/types": "^7.29.8",
+        "debug": "^4.3.1"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/types": {
+      "version": "7.29.8",
+      "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.29.8.tgz",
+      "integrity": "sha512-Vj1jF3cPfxg7OAfoI7QnVKLoILlm2JF9pnVHrX8qx7AHMiYWT+NDAA7jChlNgRS4WTLc/fD1lXLmPixluj+3Gg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/helper-string-parser": "^7.29.7",
+        "@babel/helper-validator-identifier": "^7.29.7"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@clerk/localizations": {
+      "version": "4.24.0",
+      "resolved": "https://registry.npmjs.org/@clerk/localizations/-/localizations-4.24.0.tgz",
+      "integrity": "sha512-eodTZgzv+ANC+eHPcT2r805C8OYAbvoMcQ40w1WUiMRibUSf5GfUECGDeoV+Lo+dy4v55TCEJL9VrObxwe4fZA==",
+      "license": "MIT",
+      "dependencies": {
+        "@clerk/shared": "^4.41.0"
+      },
+      "engines": {
+        "node": ">=20.9.0"
+      }
+    },
+    "node_modules/@clerk/react": {
+      "version": "6.18.0",
+      "resolved": "https://registry.npmjs.org/@clerk/react/-/react-6.18.0.tgz",
+      "integrity": "sha512-MmLhXGtrGByt0ZJjLyh88rP7uESxONji4FFVFKe7U11DIGRVdvgRs/mWfLsNa1R23knxeTw3HMEVLIjQ6v5DgQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@clerk/shared": "^4.41.0",
+        "tslib": "2.8.1"
+      },
+      "engines": {
+        "node": ">=20.9.0"
+      },
+      "peerDependencies": {
+        "react": "^18.0.0 || ~19.0.3 || ~19.1.4 || ~19.2.3 || ~19.3.0-0",
+        "react-dom": "^18.0.0 || ~19.0.3 || ~19.1.4 || ~19.2.3 || ~19.3.0-0"
+      }
+    },
+    "node_modules/@clerk/shared": {
+      "version": "4.41.0",
+      "resolved": "https://registry.npmjs.org/@clerk/shared/-/shared-4.41.0.tgz",
+      "integrity": "sha512-zLdeVxfPBOwmiDqHh3Z2y3ub/4u84zOSlEUKPDpFAibMdW1OyboPw+DIU/seH9UXDpCQCNHl6lfKUE9LLIBvfw==",
+      "license": "MIT",
+      "dependencies": {
+        "@tanstack/query-core": "^5.101.4",
+        "dequal": "2.0.3",
+        "glob-to-regexp": "0.4.1",
+        "js-cookie": "3.0.8"
+      },
+      "engines": {
+        "node": ">=20.9.0"
+      },
+      "peerDependencies": {
+        "react": "^18.0.0 || ~19.0.3 || ~19.1.4 || ~19.2.3 || ~19.3.0-0",
+        "react-dom": "^18.0.0 || ~19.0.3 || ~19.1.4 || ~19.2.3 || ~19.3.0-0"
+      },
+      "peerDependenciesMeta": {
+        "react": {
+          "optional": true
+        },
+        "react-dom": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@esbuild/aix-ppc64": {
+      "version": "0.28.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.28.2.tgz",
+      "integrity": "sha512-XExcO+dvLKvVtNTibSTBej1NCAbaGhWn9Ww1ZPx80qsahhPFe/8jgWP0IchNe0F3HwkU7n8ejhH8bjonqht8mQ==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "aix"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/android-arm": {
+      "version": "0.28.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.28.2.tgz",
+      "integrity": "sha512-kXXoiPVVGQcnIYGOeaovwOURpniDBpSq4A03qkQ+BMQqtGG6HYap3xne9C1O1yo4TR3qxlCX5IqqmX6fFo2Lqg==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/android-arm64": {
+      "version": "0.28.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.28.2.tgz",
+      "integrity": "sha512-5YfKeeI8qWfBZIX+u2xZC3Zlb3Os/gLS2sbEKM+I4ZOcsWmHS2WLysCcQZDAFRslDUU5Oiq44gf6PYN1vGwG5A==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/android-x64": {
+      "version": "0.28.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.28.2.tgz",
+      "integrity": "sha512-O387ite7SzUyCcy3JQX4P4bLtEA7bLLkx+esve5JHnyYfNTxcVpXZo9jhdB0lTKN44gztELTdU7nS8Nr16Fs1Q==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/darwin-arm64": {
+      "version": "0.28.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.28.2.tgz",
+      "integrity": "sha512-n4KqkOQrraxHJcgjM1RvwbigfQKIKJVpM7xp+KsxiyUSrRdIXnt73VhrPAx0fV44hgfmIVKjxMN9J1t5jySVkw==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/darwin-x64": {
+      "version": "0.28.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.28.2.tgz",
+      "integrity": "sha512-uq6suIWYP37qzGddBKPw5QEQPi6HiLGsO7UmkpfyaYNQ3D+rN6w6WfwH+nuqcGXWvawGwxOEroO4YGnFh95azw==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/freebsd-arm64": {
+      "version": "0.28.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.28.2.tgz",
+      "integrity": "sha512-n+I0BTSRIoy+d6RPKnEVwql5UwBJolytvY4mAOIEJorKlqgPII8ix6slVVrfZ5Tnj7glIZvloylbB/EJPMWEXw==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/freebsd-x64": {
+      "version": "0.28.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.28.2.tgz",
+      "integrity": "sha512-78XJTJkvPs0kz2w61301PJjXl4g7q3JqiYMZ/M/yVI73EHBrCRTgkhu9oqG7vPqq+a/yadEW8aD+agKlk5xrmg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-arm": {
+      "version": "0.28.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.28.2.tgz",
+      "integrity": "sha512-XlDnu2q5yoqems+xay6wSAcg9DDD7K9RLKZEBOMZm3ckNpJBvOX20tSfby8KfrrhINDyv9V2YVZKY/SpoGJI8w==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-arm64": {
+      "version": "0.28.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.28.2.tgz",
+      "integrity": "sha512-pW4AC0P3it8c7do9MVM4p51FzHzdM/TZrerurgRcHJ2WTa1VQ1CIq18xncfpBJw4ojkiZZrKW2yIBWBP92j6Ug==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-ia32": {
+      "version": "0.28.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.28.2.tgz",
+      "integrity": "sha512-CYbnj78HsIeA+DhgUKgFCfvNsTHFhMMrinUrMZpDXJXKN8T3XViTZ/+wtHeVxEWY8ewSzTFN+nRmSwO2tZaLUQ==",
+      "cpu": [
+        "ia32"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-loong64": {
+      "version": "0.28.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.28.2.tgz",
+      "integrity": "sha512-buwkd8nsph4R+ajRvw0qM5Hja/TXQow3ptzWO2EbG/cqcIkHloRrdlBtQlshyYGTNFvfkfJ5tpPLVkY4DtsPfQ==",
+      "cpu": [
+        "loong64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-mips64el": {
+      "version": "0.28.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.28.2.tgz",
+      "integrity": "sha512-ZVykbDyk7519VwiNb9Lcj9m8XM6v5V9uKPvrEMkkEedVewf+0itkhahp4HDpgERXhwLRpWFypsGbG/J8s0QjJA==",
+      "cpu": [
+        "mips64el"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-ppc64": {
+      "version": "0.28.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.28.2.tgz",
+      "integrity": "sha512-CAXl+Dtd9UUuJd8pKKdwh6MLm3MUMiqMPmhZ3tTSXPqfyQ3vDl6R5hZdZ/kYojK4ofXtdfSv1tFq8XzWx3heNQ==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-riscv64": {
+      "version": "0.28.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.28.2.tgz",
+      "integrity": "sha512-GeXCej4IQtU1B+QlDV8W/RRvbzI3O/Stss+/bCXv4lZls5WGRtu2a+3JkA3i4qIUlMXpcHebWpF8AkJhATowuA==",
+      "cpu": [
+        "riscv64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-s390x": {
+      "version": "0.28.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.28.2.tgz",
+      "integrity": "sha512-3H1weTYZPxt/WOhByszQZybS9w5lKzUn1FDMsgEChbHWQwHYQQRfBxgCcZvPhjHfKyJjIievvMmEUawJrdY9Dg==",
+      "cpu": [
+        "s390x"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-x64": {
+      "version": "0.28.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.28.2.tgz",
+      "integrity": "sha512-4xTZr1FUmSoQW4XIWmit3tzQrUTZM+N3P0XV8xROKYF50XfI7xeO90+1bZvNwxIufQ9hDQVRJH5YhgPVF8A/HQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/netbsd-arm64": {
+      "version": "0.28.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-arm64/-/netbsd-arm64-0.28.2.tgz",
+      "integrity": "sha512-sSATRjPeDBg3pdgHoQfoYBob11Kk1FGa9lui5RIHZCoCkJa9QKlvl3/vKz2usCmYYjs7ymJR/2Nnsqe+Hjt5nw==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "netbsd"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/netbsd-x64": {
+      "version": "0.28.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.28.2.tgz",
+      "integrity": "sha512-lqnzCV+mM0gIADaKihiCg6ifgfU2L3h5E33rNQBN1Y4MaVGnzryzmvvf7UHxprpQdE8hpqLolJ9Rl+SkIRDpyw==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "netbsd"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/openbsd-arm64": {
+      "version": "0.28.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.28.2.tgz",
+      "integrity": "sha512-AL2qJILH7lNjrDmCQDvdxMfAUIv8KMNZOvrwAQ8i8//ntL9FflhOyMJ8OZSMBb8/AWXe3/5v5S20y3zCoZWKoQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "openbsd"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/openbsd-x64": {
+      "version": "0.28.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.28.2.tgz",
+      "integrity": "sha512-QtiuPytchRyC4rwUKhexJdQKvDuZ6hWloi3igqPQNUJCS1/v9EiO3UTOXR6A3FoMo4fnAKbWJdqaIwhOzh8qEw==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "openbsd"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/openharmony-arm64": {
+      "version": "0.28.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/openharmony-arm64/-/openharmony-arm64-0.28.2.tgz",
+      "integrity": "sha512-WkhYDmpTjLvGlScA1rwjRUmhl4k8oXR3cIbtqWmELgU/dFeHHlEllxDvdWcNJV9rbzCexB5vz8gtNewWLgCT7Q==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "openharmony"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/sunos-x64": {
+      "version": "0.28.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.28.2.tgz",
+      "integrity": "sha512-GPMSkTOtMnv2U2F8gxe4Io6qmVs+YKyp832Etqqxr0hFngmXQ3rzwytelm3GIn7T4VviRUlf3sOgBOiTdvaf7g==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "sunos"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/win32-arm64": {
+      "version": "0.28.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.28.2.tgz",
+      "integrity": "sha512-PIhhEkE9uPBleRBrQEJpUn7MBnibZzbGzYWPmY3x+YoVg/95zbjB4CxPPOQ8l5tYYM4mMaCthF8/1DIfBQQyWQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/win32-ia32": {
+      "version": "0.28.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.28.2.tgz",
+      "integrity": "sha512-YmJbfTlvU7Sdn9BB+4PRES4oB6pxgS37MAONj+hBr/cpXS1aBPKXxNnDbu+QCWPj0o9dgyxeq79g6c5P8KeuYA==",
+      "cpu": [
+        "ia32"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/win32-x64": {
+      "version": "0.28.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.28.2.tgz",
+      "integrity": "sha512-5ebpxr3nWMzrL/rnUI755Jkuee0bHL/Gq0WTF9lvcpv73wAp5eu8MfBUgWK9bhWvZjj7yX8etf/8tI8Ney695g==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@jridgewell/gen-mapping": {
+      "version": "0.3.13",
+      "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.13.tgz",
+      "integrity": "sha512-2kkt/7niJ6MgEPxF0bYdQ6etZaA+fQvDcLKckhy1yIQOzaoKjBBjSj63/aLVjYE3qhRt5dvM+uUyfCg6UKCBbA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@jridgewell/sourcemap-codec": "^1.5.0",
+        "@jridgewell/trace-mapping": "^0.3.24"
+      }
+    },
+    "node_modules/@jridgewell/remapping": {
+      "version": "2.3.5",
+      "resolved": "https://registry.npmjs.org/@jridgewell/remapping/-/remapping-2.3.5.tgz",
+      "integrity": "sha512-LI9u/+laYG4Ds1TDKSJW2YPrIlcVYOwi2fUC6xB43lueCjgxV4lffOCZCtYFiH6TNOX+tQKXx97T4IKHbhyHEQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@jridgewell/gen-mapping": "^0.3.5",
+        "@jridgewell/trace-mapping": "^0.3.24"
+      }
+    },
+    "node_modules/@jridgewell/resolve-uri": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/@jridgewell/resolve-uri/-/resolve-uri-3.1.2.tgz",
+      "integrity": "sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.0.0"
+      }
+    },
+    "node_modules/@jridgewell/sourcemap-codec": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.6.0.tgz",
+      "integrity": "sha512-T7jf+5zgsZHwNJ4lvQ7/aezbyk0nNX+zJVWpmHA7VYsEx7a7qr5Rg5IbtJFqkgze5Y2sruq1RUY8Q837Od7iFw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@jridgewell/trace-mapping": {
+      "version": "0.3.31",
+      "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.31.tgz",
+      "integrity": "sha512-zzNR+SdQSDJzc8joaeP8QQoCQr8NuYx2dIIytl1QeBEZHJ9uW6hebsrYgbz8hJwUQao3TWCMtmfV8Nu1twOLAw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@jridgewell/resolve-uri": "^3.1.0",
+        "@jridgewell/sourcemap-codec": "^1.4.14"
+      }
+    },
+    "node_modules/@napi-rs/lzma-linux-x64-gnu": {
+      "version": "1.5.1",
+      "resolved": "https://registry.npmjs.org/@napi-rs/lzma-linux-x64-gnu/-/lzma-linux-x64-gnu-1.5.1.tgz",
+      "integrity": "sha512-oTXEIha4SsuXdTA4Iyskj0kpdx2yVXdhd75c2v3xGrHFfVMsbhTPZU/nMPL4sWKo4pBHm3aucLaqGlF696dTyQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "libc": [
+        "glibc"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": "^22.20 || ^24.12 || >=25"
+      }
+    },
+    "node_modules/@rolldown/pluginutils": {
+      "version": "1.0.0-rc.3",
+      "resolved": "https://registry.npmjs.org/@rolldown/pluginutils/-/pluginutils-1.0.0-rc.3.tgz",
+      "integrity": "sha512-eybk3TjzzzV97Dlj5c+XrBFW57eTNhzod66y9HrBlzJ6NsCrWCp/2kaPS3K9wJmurBC0Tdw4yPjXKZqlznim3Q==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@rollup/rollup-android-arm-eabi": {
+      "version": "4.65.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.65.0.tgz",
+      "integrity": "sha512-t2AnVba25baFdq7gczzS13JyVcdubLVbFX1X04mxrggDrTQPUXNv3XM0k9H1hr5tqvg7AVvtQ720QHAj0iYqhg==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ]
+    },
+    "node_modules/@rollup/rollup-android-arm64": {
+      "version": "4.65.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.65.0.tgz",
+      "integrity": "sha512-dNONUaEwPGhl/nuO2KV8VABWlcjYyU6KtZGN8dQv5OS5JU7JSCxPijVNKXbRJd0iuTzTiJ4TjPt/4bbvDRNiMQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ]
+    },
+    "node_modules/@rollup/rollup-darwin-arm64": {
+      "version": "4.65.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.65.0.tgz",
+      "integrity": "sha512-zWQqUH+9zavr2Bxuzfpuv2SIF3X31cr58TvSQC9o1GhpOvkqRwr60GkZdQcudyT/BEgdpdSafjgd2I13MbTL7g==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ]
+    },
+    "node_modules/@rollup/rollup-darwin-x64": {
+      "version": "4.65.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.65.0.tgz",
+      "integrity": "sha512-RQYreBFWtO4//hIuOaZkYUnF/lPU4lz35dveDimDshWCJvVisVtJ/shmT9bkXK8wFJY+FJF89X6F3Cq1qI3LCw==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ]
+    },
+    "node_modules/@rollup/rollup-freebsd-arm64": {
+      "version": "4.65.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-arm64/-/rollup-freebsd-arm64-4.65.0.tgz",
+      "integrity": "sha512-A0NfMj6Cuh/9BE5k3awJKv6HoxFVXIcLAb6SZqAMoxUHPA1ZNNK4RsGuUPD/vL7nEAm9LG+ZzXWWTrnC0XtkpA==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ]
+    },
+    "node_modules/@rollup/rollup-freebsd-x64": {
+      "version": "4.65.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-x64/-/rollup-freebsd-x64-4.65.0.tgz",
+      "integrity": "sha512-BI6/H7q3aP0I7S7GOrjyxTjgEJlSnovXE38+bdxBpuKN6z+d//uF+T+VQ3Q7ltJL/71p17ufartARX9Ja5gOGQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-arm-gnueabihf": {
+      "version": "4.65.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.65.0.tgz",
+      "integrity": "sha512-W1vUprf09RWaVWnsFP1vlUkEWJzTZlpObOEAYZXt9Fq0UVAOYEkeGr7wBX7McKqqIQskXdBnpiOMgwPujordgA==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "libc": [
+        "glibc"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-arm-musleabihf": {
+      "version": "4.65.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.65.0.tgz",
+      "integrity": "sha512-s8QTcZWgrl9haFzEGIqyE5BWyo89pFDGLMBFZ752WYxk8DJwNU/O1X6pZgPw829d9/sm6CCHyrMP3aurt76p1Q==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "libc": [
+        "musl"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-arm64-gnu": {
+      "version": "4.65.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.65.0.tgz",
+      "integrity": "sha512-ke1f6dLRzkqveyjjF2fkEwQYZvxHtNNwjegY8nJrwcO0Bdqr8CzFO/pKE0Bns13cx0qz2Ba2Y0Hs3dSwMdnHxA==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "libc": [
+        "glibc"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-arm64-musl": {
+      "version": "4.65.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.65.0.tgz",
+      "integrity": "sha512-926SMeUcy4y18Rz/w2aJiUKOnyAnm6czg72bXkQEaeemsll+Wr0hnsjb2BGRpHvWgwAMYy5ACJCotbvfLCfj0A==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "libc": [
+        "musl"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-loong64-gnu": {
+      "version": "4.65.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-loong64-gnu/-/rollup-linux-loong64-gnu-4.65.0.tgz",
+      "integrity": "sha512-6T7JNRP1hc4hqF2dUsEoVLOt9K8tmODoCLldtQRYnrddGGQY8Gqe2pM/qMMUo7EMowpP7oa2N95k0/8sYK/ipw==",
+      "cpu": [
+        "loong64"
+      ],
+      "dev": true,
+      "libc": [
+        "glibc"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-loong64-musl": {
+      "version": "4.65.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-loong64-musl/-/rollup-linux-loong64-musl-4.65.0.tgz",
+      "integrity": "sha512-SImGFl1Je5kpyAgOCPONVT7h6ASV8mAUwGRjY7eZvVjPg//PfHOXgI+P241RF/+HqsA4PP3qD527ysWFKNQyhQ==",
+      "cpu": [
+        "loong64"
+      ],
+      "dev": true,
+      "libc": [
+        "musl"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-ppc64-gnu": {
+      "version": "4.65.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-ppc64-gnu/-/rollup-linux-ppc64-gnu-4.65.0.tgz",
+      "integrity": "sha512-XeDTbmPF1Yu5asfXGPrMkWoxTDhgryQbmw5Q1+R582O51VNCk23J6f2pDrsAp5YkneBVBwtExx6ZGOb9D2aQ6A==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "libc": [
+        "glibc"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-ppc64-musl": {
+      "version": "4.65.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-ppc64-musl/-/rollup-linux-ppc64-musl-4.65.0.tgz",
+      "integrity": "sha512-VS55JUI/1nsljmV/jfqNkLZXFw8uMO8nNlfoHmSevNf6fO3neuhyDvx9dv3c/Ytt8r/431SL8Qax1dpYvOMZTg==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "libc": [
+        "musl"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-riscv64-gnu": {
+      "version": "4.65.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.65.0.tgz",
+      "integrity": "sha512-Vblw84TbX7RS4la1Y4+yQ7aore/oSyaNtFbppuBr5Vs/4LfBeXKq9dIfoExw6zOvRERqd2rRAjnZRaMhH/0x5w==",
+      "cpu": [
+        "riscv64"
+      ],
+      "dev": true,
+      "libc": [
+        "glibc"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-riscv64-musl": {
+      "version": "4.65.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-musl/-/rollup-linux-riscv64-musl-4.65.0.tgz",
+      "integrity": "sha512-7+gHjtONvKgwR9InTKFaLq53f6YzBJkgeMRBENdWTsQr+spahGqQm8HF5aXpq8i4JaRrOqYyv6Zn1WltDTxaZQ==",
+      "cpu": [
+        "riscv64"
+      ],
+      "dev": true,
+      "libc": [
+        "musl"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-s390x-gnu": {
+      "version": "4.65.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.65.0.tgz",
+      "integrity": "sha512-KvNDC0J6s4vVHhtJ6KrDXU0Er0au/hmRIBq/+1maCV8TseGupeKizq0bWcrbp2HE1T8xoknvN0Q/KZ/YF0qX3w==",
+      "cpu": [
+        "s390x"
+      ],
+      "dev": true,
+      "libc": [
+        "glibc"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-x64-gnu": {
+      "version": "4.65.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.65.0.tgz",
+      "integrity": "sha512-GExdD15WPvu/x/drELjVam7vX8EsPgvTMOa/iJL/p/4m/oOqzbb7JXZg8fXR4hlXtg/sF2zyTZ3bR0AEtEMlhQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "libc": [
+        "glibc"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-x64-musl": {
+      "version": "4.65.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.65.0.tgz",
+      "integrity": "sha512-8sT9PemIZfIMED4Vd4KGoOXVDj5CMSWNcGdbheRUx9TYS03yOWdT2Q0lXPyEyNBB9YTilwewIQKNIBk6Nxi0Kg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "libc": [
+        "musl"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-openbsd-x64": {
+      "version": "4.65.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-openbsd-x64/-/rollup-openbsd-x64-4.65.0.tgz",
+      "integrity": "sha512-pO6Ehi0jo5yE0R6PltKhJhv9mlIiyzBJk5N5NUF2OF6xtVKI+1bdXxj/rb0jGXy3hck1ELVT0QPY3tzkAm360w==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "openbsd"
+      ]
+    },
+    "node_modules/@rollup/rollup-openharmony-arm64": {
+      "version": "4.65.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-openharmony-arm64/-/rollup-openharmony-arm64-4.65.0.tgz",
+      "integrity": "sha512-vo7N3/+cjjPDYr8vtxC+qSNgWa9sDvJ7g8N8R5SWqFY4WiNH1ULcAU70SKVyHeiIZOYYwNP9pTipmhN5sl1NPw==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "openharmony"
+      ]
+    },
+    "node_modules/@rollup/rollup-win32-arm64-msvc": {
+      "version": "4.65.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.65.0.tgz",
+      "integrity": "sha512-ArwvgFAbjKcDM7qqotZ4OVYf+UMT9xH2YzkCzK4+AuZSDihMlz1Ekoe4INwBVXzn2mnJzuIYOcSx07iTBijGRQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ]
+    },
+    "node_modules/@rollup/rollup-win32-ia32-msvc": {
+      "version": "4.65.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.65.0.tgz",
+      "integrity": "sha512-QGMmK4/cxKE/36FoLMSHQBCyymv/eFTnsCvvsBF0rgmOvVbvX78VWZRerL3dHa77f4pM6Xcc2iGDhJ10w/svKQ==",
+      "cpu": [
+        "ia32"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ]
+    },
+    "node_modules/@rollup/rollup-win32-x64-gnu": {
+      "version": "4.65.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-gnu/-/rollup-win32-x64-gnu-4.65.0.tgz",
+      "integrity": "sha512-XfKYFWHIPs4HPODIMsGF1IKlS3H1e3WokUZIgpmn4+uNnZBlnRDDHEylNyazbQXwhMKZre68OjtRYbKqb5+j8w==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ]
+    },
+    "node_modules/@rollup/rollup-win32-x64-msvc": {
+      "version": "4.65.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.65.0.tgz",
+      "integrity": "sha512-wPWi++K4Bs1VR4XihOhfGi4IGX6Cub7FlerTf8X2v+2BtDHddgSqWCXwGD+h2yAe4/niIhNDwAltioOC+wEogQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ]
+    },
+    "node_modules/@tanstack/query-core": {
+      "version": "5.104.5",
+      "resolved": "https://registry.npmjs.org/@tanstack/query-core/-/query-core-5.104.5.tgz",
+      "integrity": "sha512-Q94gI8Opd+CbdVNOdj8ZCyV8WqLYitrDq1t96Xc8WZT6lY0r5iRnJLXYDxMex7EEf2v+mXvn4FcjaBKSxXZQ9A==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/tannerlinsley"
+      }
+    },
+    "node_modules/@tanstack/react-query": {
+      "version": "5.104.5",
+      "resolved": "https://registry.npmjs.org/@tanstack/react-query/-/react-query-5.104.5.tgz",
+      "integrity": "sha512-RORgFe052U+93weaNuqg7qHq7vNVNzXN/VrXqD4bbAuQCWUqOl2lV5Ui9flWk5CVvMyL/Bh27QWhzwH0aaOx9g==",
+      "license": "MIT",
+      "dependencies": {
+        "@tanstack/query-core": "5.104.5"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/tannerlinsley"
+      },
+      "peerDependencies": {
+        "@types/react": "^18 || ^19",
+        "react": "^18 || ^19"
+      },
+      "peerDependenciesMeta": {
+        "@types/react": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@types/babel__core": {
+      "version": "7.20.5",
+      "resolved": "https://registry.npmjs.org/@types/babel__core/-/babel__core-7.20.5.tgz",
+      "integrity": "sha512-qoQprZvz5wQFJwMDqeseRXWv3rqMvhgpbXFfVyWhbx9X47POIA6i/+dXefEmZKoAgOaTdaIgNSMqMIU61yRyzA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/parser": "^7.20.7",
+        "@babel/types": "^7.20.7",
+        "@types/babel__generator": "*",
+        "@types/babel__template": "*",
+        "@types/babel__traverse": "*"
+      }
+    },
+    "node_modules/@types/babel__generator": {
+      "version": "7.27.0",
+      "resolved": "https://registry.npmjs.org/@types/babel__generator/-/babel__generator-7.27.0.tgz",
+      "integrity": "sha512-ufFd2Xi92OAVPYsy+P4n7/U7e68fex0+Ee8gSG9KX7eo084CWiQ4sdxktvdl0bOPupXtVJPY19zk6EwWqUQ8lg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/types": "^7.0.0"
+      }
+    },
+    "node_modules/@types/babel__template": {
+      "version": "7.4.4",
+      "resolved": "https://registry.npmjs.org/@types/babel__template/-/babel__template-7.4.4.tgz",
+      "integrity": "sha512-h/NUaSyG5EyxBIp8YRxo4RMe2/qQgvyowRwVMzhYhBCONbW8PUsg4lkFMrhgZhUe5z3L3MiLDuvyJ/CaPa2A8A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/parser": "^7.1.0",
+        "@babel/types": "^7.0.0"
+      }
+    },
+    "node_modules/@types/babel__traverse": {
+      "version": "7.28.0",
+      "resolved": "https://registry.npmjs.org/@types/babel__traverse/-/babel__traverse-7.28.0.tgz",
+      "integrity": "sha512-8PvcXf70gTDZBgt9ptxJ8elBeBjcLOAcOtoO/mPJjtji1+CdGbHgm77om1GrsPxsiE+uXIpNSK64UYaIwQXd4Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/types": "^7.28.2"
+      }
+    },
+    "node_modules/@types/chai": {
+      "version": "5.2.3",
+      "resolved": "https://registry.npmjs.org/@types/chai/-/chai-5.2.3.tgz",
+      "integrity": "sha512-Mw558oeA9fFbv65/y4mHtXDs9bPnFMZAL/jxdPFUpOHHIXX91mcgEHbS5Lahr+pwZFR8A7GQleRWeI6cGFC2UA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@types/deep-eql": "*",
+        "assertion-error": "^2.0.1"
+      }
+    },
+    "node_modules/@types/deep-eql": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/@types/deep-eql/-/deep-eql-4.0.2.tgz",
+      "integrity": "sha512-c9h9dVVMigMPc4bwTvC5dxqtqJZwQPePsWjPlpSOnojbor6pGqdk541lfA7AqFQr5pB1BRdq0juY9db81BwyFw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@types/estree": {
+      "version": "1.0.9",
+      "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.9.tgz",
+      "integrity": "sha512-GhdPgy1el4/ImP05X05Uw4cw2/M93BCUmnEvWZNStlCzEKME4Fkk+YpoA5OiHNQmoS7Cafb8Xa3Pya8m1Qrzeg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@types/node": {
+      "version": "24.19.2",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-24.19.2.tgz",
+      "integrity": "sha512-93d49wCWJkCyN87MxLpNN6KXPCwFw7bVUg79mGUV1OS40JGWwVCr8n61DXCSqz7CV6/VfPkb7xec7uP2M+QHWQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "undici-types": ">=7.24.0 <7.24.7"
+      }
+    },
+    "node_modules/@types/react": {
+      "version": "19.3.0",
+      "resolved": "https://registry.npmjs.org/@types/react/-/react-19.3.0.tgz",
+      "integrity": "sha512-N0rFCuH9YoxG9/m61l9MfpJKfmLOVU0em7ipIz6TRgSSkvReLB9vL85GB+yr8Bs5leqpvg96JSwF4ZS1s4viQg==",
+      "devOptional": true,
+      "license": "MIT",
+      "dependencies": {
+        "csstype": "^3.2.2"
+      }
+    },
+    "node_modules/@types/react-dom": {
+      "version": "19.3.0",
+      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-19.3.0.tgz",
+      "integrity": "sha512-ZI7bU42mZXXKHn/qNLEw2IrbiINU7X5+vfgdixBHkCNpYWXjKgfQ/P+uyGb5CjOLB9UcnTeg3rylQtV2hym44Q==",
+      "dev": true,
+      "license": "MIT",
+      "peerDependencies": {
+        "@types/react": "^19.3.0"
+      }
+    },
+    "node_modules/@vitejs/plugin-react": {
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/@vitejs/plugin-react/-/plugin-react-5.2.0.tgz",
+      "integrity": "sha512-YmKkfhOAi3wsB1PhJq5Scj3GXMn3WvtQ/JC0xoopuHoXSdmtdStOpFrYaT1kie2YgFBcIe64ROzMYRjCrYOdYw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/core": "^7.29.0",
+        "@babel/plugin-transform-react-jsx-self": "^7.27.1",
+        "@babel/plugin-transform-react-jsx-source": "^7.27.1",
+        "@rolldown/pluginutils": "1.0.0-rc.3",
+        "@types/babel__core": "^7.20.5",
+        "react-refresh": "^0.18.0"
+      },
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      },
+      "peerDependencies": {
+        "vite": "^4.2.0 || ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0"
+      }
+    },
+    "node_modules/@vitest/mocker": {
+      "version": "5.0.5",
+      "resolved": "https://registry.npmjs.org/@vitest/mocker/-/mocker-5.0.5.tgz",
+      "integrity": "sha512-xLL3lkDegJZw+MGoGaCCsFayDZthGgpAtr3Vziyfc4p7xH89K7KRPcRBBh/kEYm0Aqkt5DtTmkYpBtRV/FrHZg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@jridgewell/trace-mapping": "0.3.31",
+        "@vitest/spy": "5.0.5",
+        "estree-walker": "^3.0.3",
+        "magic-string": "^1.4.3"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      },
+      "peerDependencies": {
+        "msw": "^2.4.9 || ^3.0.0",
+        "vite": "^6.0.0 || ^7.0.0 || ^8.0.0"
+      },
+      "peerDependenciesMeta": {
+        "msw": {
+          "optional": true
+        },
+        "vite": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@vitest/spy": {
+      "version": "5.0.5",
+      "resolved": "https://registry.npmjs.org/@vitest/spy/-/spy-5.0.5.tgz",
+      "integrity": "sha512-lwJRExuH417257Q5wv9QYugN9IMJkoxcrKrYxGPQkBzl7wlNpTUxD/5yNX4ESKVUIShKPgkGchYPFMWOOk0wzw==",
+      "dev": true,
+      "license": "MIT",
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      }
+    },
+    "node_modules/assertion-error": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/assertion-error/-/assertion-error-2.0.1.tgz",
+      "integrity": "sha512-Izi8RQcffqCeNVgFigKli1ssklIbpHnCYc6AknXGYoB6grJqyeby7jv12JUQgmTAnIDnbck1uxksT4dzN3PWBA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/baseline-browser-mapping": {
+      "version": "2.11.30",
+      "resolved": "https://registry.npmjs.org/baseline-browser-mapping/-/baseline-browser-mapping-2.11.30.tgz",
+      "integrity": "sha512-YJs6Pz17RMNv8HoyKREtCY38E3BV1nPkWVmIb+XN1uHC1Vqt3KZCH/uJH9ZKRoiKb/icZ6tvehyee6RZNbFfRA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "bin": {
+        "baseline-browser-mapping": "dist/cli.cjs"
+      },
+      "engines": {
+        "node": ">=6.0.0"
+      }
+    },
+    "node_modules/browserslist": {
+      "version": "4.29.4",
+      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.29.4.tgz",
+      "integrity": "sha512-2TcbbiwXEq+N0kD36tykpCfyyQigUXmuwNQbnPp4Xk4PX9JOqVIKjJlIDjpH7uY6tmRGoAd+apeT1p60T8wsdA==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/browserslist"
+        },
+        {
+          "type": "tidelift",
+          "url": "https://tidelift.com/funding/github/npm/browserslist"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "baseline-browser-mapping": "^2.11.29",
+        "caniuse-lite": "^1.0.30001816",
+        "electron-to-chromium": "^1.5.459",
+        "node-releases": "^2.0.59",
+        "update-browserslist-db": "^1.3.4"
+      },
+      "bin": {
+        "browserslist": "cli.js"
+      },
+      "engines": {
+        "node": "^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7"
+      }
+    },
+    "node_modules/caniuse-lite": {
+      "version": "1.0.30001819",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001819.tgz",
+      "integrity": "sha512-LFUqIIAwpzsIuevnKnsR9qnStBcgzPShTX61lBwN9uFkkf8o8zLiebEjbW8AYtZiF+1YKDWfdt/pWDtMuG8Xwg==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/browserslist"
+        },
+        {
+          "type": "tidelift",
+          "url": "https://tidelift.com/funding/github/npm/caniuse-lite"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "CC-BY-4.0"
+    },
+    "node_modules/chai": {
+      "version": "6.3.0",
+      "resolved": "https://registry.npmjs.org/chai/-/chai-6.3.0.tgz",
+      "integrity": "sha512-XWAtwJ6OHO+tj0EKCs0Y2UamnyOxseZWltU4x2U2wh8g4AigdjwvtUjvLP2tqkA/avxHEtzxNaqGq/YGNwckKg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/convert-source-map": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-2.0.0.tgz",
+      "integrity": "sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/cookie": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/cookie/-/cookie-1.1.1.tgz",
+      "integrity": "sha512-ei8Aos7ja0weRpFzJnEA9UHJ/7XQmqglbRwnf2ATjcB9Wq874VKH9kfjjirM6UhU2/E5fFYadylyhFldcqSidQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/csstype": {
+      "version": "3.2.3",
+      "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.2.3.tgz",
+      "integrity": "sha512-z1HGKcYy2xA8AGQfwrn0PAy+PB7X/GSj3UVJW9qKyn43xWa+gl5nXmU4qqLMRzWVLFC8KusUX8T/0kCiOYpAIQ==",
+      "devOptional": true,
+      "license": "MIT"
+    },
+    "node_modules/debug": {
+      "version": "4.4.3",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.3.tgz",
+      "integrity": "sha512-RGwwWnwQvkVfavKVt22FGLw+xYSdzARwm0ru6DhTVA3umU5hZc28V3kO4stgYryrTlLpuvgI9GiijltAjNbcqA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ms": "^2.1.3"
+      },
+      "engines": {
+        "node": ">=6.0"
+      },
+      "peerDependenciesMeta": {
+        "supports-color": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/dequal": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/dequal/-/dequal-2.0.3.tgz",
+      "integrity": "sha512-0je+qPKHEMohvfRTCEo3CrPG6cAzAYgmzKyxRiYSSDkS6eGJdyVJm7WaYA5ECaAD9wLB2T4EEeymA5aFVcYXCA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/electron-to-chromium": {
+      "version": "1.5.463",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.463.tgz",
+      "integrity": "sha512-nVWNU6ltFjopvOdD44J4zoBkgO0M+WZiFKKFV7EjebOH9z0KNphk6bCEjplXtJofL21ARIuuwWOCsFkBVklm6w==",
+      "dev": true,
+      "license": "ISC"
+    },
+    "node_modules/es-module-lexer": {
+      "version": "2.3.2",
+      "resolved": "https://registry.npmjs.org/es-module-lexer/-/es-module-lexer-2.3.2.tgz",
+      "integrity": "sha512-poHGpORABojJJucnV9KbOavETW8lBVnphkW77ER5/BQ5Fz7oXSoCNek7IH3vR5nRjdsEz926ibFYX8KtLQmdyw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/esbuild": {
+      "version": "0.28.2",
+      "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.28.2.tgz",
+      "integrity": "sha512-HKVLS8dvII+xoKW9kmqxbRKrnWEXfJJr/FZhhJmiqIB0e053QNYFqOBouTMO/k5sID4MvCiUCvv8b9M4h32wIA==",
+      "dev": true,
+      "hasInstallScript": true,
+      "license": "MIT",
+      "bin": {
+        "esbuild": "bin/esbuild"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "optionalDependencies": {
+        "@esbuild/aix-ppc64": "0.28.2",
+        "@esbuild/android-arm": "0.28.2",
+        "@esbuild/android-arm64": "0.28.2",
+        "@esbuild/android-x64": "0.28.2",
+        "@esbuild/darwin-arm64": "0.28.2",
+        "@esbuild/darwin-x64": "0.28.2",
+        "@esbuild/freebsd-arm64": "0.28.2",
+        "@esbuild/freebsd-x64": "0.28.2",
+        "@esbuild/linux-arm": "0.28.2",
+        "@esbuild/linux-arm64": "0.28.2",
+        "@esbuild/linux-ia32": "0.28.2",
+        "@esbuild/linux-loong64": "0.28.2",
+        "@esbuild/linux-mips64el": "0.28.2",
+        "@esbuild/linux-ppc64": "0.28.2",
+        "@esbuild/linux-riscv64": "0.28.2",
+        "@esbuild/linux-s390x": "0.28.2",
+        "@esbuild/linux-x64": "0.28.2",
+        "@esbuild/netbsd-arm64": "0.28.2",
+        "@esbuild/netbsd-x64": "0.28.2",
+        "@esbuild/openbsd-arm64": "0.28.2",
+        "@esbuild/openbsd-x64": "0.28.2",
+        "@esbuild/openharmony-arm64": "0.28.2",
+        "@esbuild/sunos-x64": "0.28.2",
+        "@esbuild/win32-arm64": "0.28.2",
+        "@esbuild/win32-ia32": "0.28.2",
+        "@esbuild/win32-x64": "0.28.2"
+      }
+    },
+    "node_modules/escalade": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.2.0.tgz",
+      "integrity": "sha512-WUj2qlxaQtO4g6Pq5c29GTcWGDyd8itL8zTlipgECz3JesAiiOKotd8JU6otB3PACgG6xkJUyVhboMS+bje/jA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/estree-walker": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-3.0.3.tgz",
+      "integrity": "sha512-7RUKfXgSMMkzt6ZuXmqapOurLGPPfgj6l9uRZ7lRGolvk0y2yocc35LdcxKC5PQZdn2DMqioAQ2NoWcrTKmm6g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@types/estree": "^1.0.0"
+      }
+    },
+    "node_modules/expect-type": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/expect-type/-/expect-type-1.4.0.tgz",
+      "integrity": "sha512-KfYbmpRm0VbLjEvVa9yGwCi9GI34xvi7A/HXYWQO65CSD2u3MczUJSuwXKFIxlGsgBQizV9q5J9NHj4VG0n+pA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=12.0.0"
+      }
+    },
+    "node_modules/fdir": {
+      "version": "6.5.0",
+      "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.5.0.tgz",
+      "integrity": "sha512-tIbYtZbucOs0BRGqPJkshJUYdL+SDH7dVM8gjy+ERp3WAUjLEFJE+02kanyHtwjWOnwrKYBiwAmM0p4kLJAnXg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12.0.0"
+      },
+      "peerDependencies": {
+        "picomatch": "^3 || ^4"
+      },
+      "peerDependenciesMeta": {
+        "picomatch": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/fsevents": {
+      "version": "2.3.3",
+      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
+      "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==",
+      "dev": true,
+      "hasInstallScript": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
+      }
+    },
+    "node_modules/gensync": {
+      "version": "1.0.0-beta.2",
+      "resolved": "https://registry.npmjs.org/gensync/-/gensync-1.0.0-beta.2.tgz",
+      "integrity": "sha512-3hN7NaskYvMDLQY55gnW3NQ+mesEAepTqlg+VEbj7zzqEMBVNhzcGYYeqFo/TlYz6eQiFcp1HcsCZO+nGgS8zg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/glob-to-regexp": {
+      "version": "0.4.1",
+      "resolved": "https://registry.npmjs.org/glob-to-regexp/-/glob-to-regexp-0.4.1.tgz",
+      "integrity": "sha512-lkX1HJXwyMcprw/5YUZc2s7DrpAiHB21/V+E1rHUrVNokkvB6bqMzT0VfV6/86ZNabt1k14YOIaT7nDvOX3Iiw==",
+      "license": "BSD-2-Clause"
+    },
+    "node_modules/js-cookie": {
+      "version": "3.0.8",
+      "resolved": "https://registry.npmjs.org/js-cookie/-/js-cookie-3.0.8.tgz",
+      "integrity": "sha512-yeJd4aNAdYZQjaon2bpD/Gb0B/omw7HQOsynXXcOiWVCacbBcPlgn8S/d1X6blFSaHao7ozqtW7NZW19xpCtIw==",
+      "license": "MIT"
+    },
+    "node_modules/js-tokens": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
+      "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/jsesc": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-3.1.0.tgz",
+      "integrity": "sha512-/sM3dO2FOzXjKQhJuo0Q173wf2KOo8t4I8vHy6lF9poUp7bKT0/NHE8fPX23PwfhnykfqnC2xRxOnVw5XuGIaA==",
+      "dev": true,
+      "license": "MIT",
+      "bin": {
+        "jsesc": "bin/jsesc"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/json5": {
+      "version": "2.2.3",
+      "resolved": "https://registry.npmjs.org/json5/-/json5-2.2.3.tgz",
+      "integrity": "sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg==",
+      "dev": true,
+      "license": "MIT",
+      "bin": {
+        "json5": "lib/cli.js"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/lru-cache": {
+      "version": "5.1.1",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz",
+      "integrity": "sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "yallist": "^3.0.2"
+      }
+    },
+    "node_modules/magic-string": {
+      "version": "1.4.3",
+      "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-1.4.3.tgz",
+      "integrity": "sha512-z12OxmaPGE0F4xlpGdjuAUckipLpQlTAuAmyGhNoD7ODpYUzvDfvtxUbjM/jwznyP178oju/KDdyi220wNJ0RQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@jridgewell/sourcemap-codec": "^1.6.0"
+      }
+    },
+    "node_modules/ms": {
+      "version": "2.1.3",
+      "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz",
+      "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/nanoid": {
+      "version": "3.3.20",
+      "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.20.tgz",
+      "integrity": "sha512-uKdg2G3GNCKQn9byYOpxbGqrT2fGO5KRt5J/8b3pok8rT6qxGWF6hxMyJiEYtAf+FVyYuD9hRaDqX5uPFYJ4ZQ==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "MIT",
+      "bin": {
+        "nanoid": "bin/nanoid.cjs"
+      },
+      "engines": {
+        "node": "^10 || ^12 || ^13.7 || ^14 || >=15.0.1"
+      }
+    },
+    "node_modules/node-releases": {
+      "version": "2.0.60",
+      "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.60.tgz",
+      "integrity": "sha512-OmO8+GM1JUZqXET720VrJCwkjUCXmCMQm0Z3UDDRbfNLHS4NEAvY60j5jiFv0tkKw2PNNlqOLhahVmwJIOLDIQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/obug": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/obug/-/obug-3.0.0.tgz",
+      "integrity": "sha512-5vvB5+W7ePv+p3uqxi+RcW1XAzLW0/hxt3/4X4Lc4qHudzOhmBiBwOY6DRob4WnanAEGvNcLjF+KNOufrUoEQw==",
+      "dev": true,
+      "funding": [
+        "https://github.com/sponsors/sxzz",
+        "https://opencollective.com/debug"
+      ],
+      "license": "MIT",
+      "engines": {
+        "node": ">=12.20.0"
+      }
+    },
+    "node_modules/picocolors": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.1.1.tgz",
+      "integrity": "sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==",
+      "dev": true,
+      "license": "ISC"
+    },
+    "node_modules/picomatch": {
+      "version": "4.0.7",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.7.tgz",
+      "integrity": "sha512-qcJu88Q2IWqJsDD529JKMdwGm/dvInW4HvQnRwiH9JtihJvzGOscDtHE3x1pBKeUOTysQ8kVmLnJ2kJu7yhcGA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/jonschlinkert"
+      }
+    },
+    "node_modules/postcss": {
+      "version": "8.5.31",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.31.tgz",
+      "integrity": "sha512-YUbWYCgErwnMAVkjUnYa+KlMBzGpHwiIt/DE7f0G33AuX2LH9UcTk6KgWxd3zRU+pN3u/C+Xl3EnMLM4Hea7Sg==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/postcss/"
+        },
+        {
+          "type": "tidelift",
+          "url": "https://tidelift.com/funding/github/npm/postcss"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "nanoid": "^3.3.20",
+        "picocolors": "^1.1.1",
+        "source-map-js": "^1.2.2"
+      },
+      "engines": {
+        "node": "^10 || ^12 || >=14"
+      }
+    },
+    "node_modules/react": {
+      "version": "19.3.1",
+      "resolved": "https://registry.npmjs.org/react/-/react-19.3.1.tgz",
+      "integrity": "sha512-QNhWdt7nrgVWWQG58QuGsAR3jv3Hbe4mb4vz7w2csnHavciZJgda1CPNaldF6eVxv90ud3jUXpKlHL69gO38yw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/react-dom": {
+      "version": "19.3.1",
+      "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.3.1.tgz",
+      "integrity": "sha512-Y0bARz53lhEC1NMCASs0/j+faB/zqt3R8hpvg1e8+61ZVJ4UL0UdC4cBbXfZMcIuhrfgeILTLe+ZeBCavQPtKQ==",
+      "license": "MIT",
+      "dependencies": {
+        "scheduler": "^0.28.0"
+      },
+      "peerDependencies": {
+        "react": "^19.3.1"
+      }
+    },
+    "node_modules/react-refresh": {
+      "version": "0.18.0",
+      "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.18.0.tgz",
+      "integrity": "sha512-QgT5//D3jfjJb6Gsjxv0Slpj23ip+HtOpnNgnb2S5zU3CB26G/IDPGoy4RJB42wzFE46DRsstbW6tKHoKbhAxw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/react-router": {
+      "version": "7.18.4",
+      "resolved": "https://registry.npmjs.org/react-router/-/react-router-7.18.4.tgz",
+      "integrity": "sha512-PUPQcMhMGRAslLcvtlPz/kmzBEWPhLdgLFrL7pLNepBL6dX0lWj4WD2cUYVgYCuT3jxvghYFg81cDTj44DhetQ==",
+      "license": "MIT",
+      "dependencies": {
+        "cookie": "^1.0.1",
+        "set-cookie-parser": "^2.6.0"
+      },
+      "engines": {
+        "node": ">=20.0.0"
+      },
+      "peerDependencies": {
+        "react": ">=18",
+        "react-dom": ">=18"
+      },
+      "peerDependenciesMeta": {
+        "react-dom": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/react-router-dom": {
+      "version": "7.18.4",
+      "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-7.18.4.tgz",
+      "integrity": "sha512-yrfmJHIpDG7taCpqKjT1G5B6q3O2K+RN8/fgNf0lTjCwiPbQ0ei6vXX9ZjQR+7ld8Tr7Z5xmyMnZ8YJrphWQUw==",
+      "license": "MIT",
+      "dependencies": {
+        "react-router": "7.18.4"
+      },
+      "engines": {
+        "node": ">=20.0.0"
+      },
+      "peerDependencies": {
+        "react": ">=18",
+        "react-dom": ">=18"
+      }
+    },
+    "node_modules/rollup": {
+      "version": "4.65.0",
+      "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.65.0.tgz",
+      "integrity": "sha512-QVCvQUTGDN6JRwi3jVGCY3H4aTHvi9rX0LyoBMkGUvdh/Z6O51CzcLz85BWZaTCDGhl6ySGqYZs+xI1jmPqGcw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@types/estree": "1.0.9"
+      },
+      "bin": {
+        "rollup": "dist/bin/rollup"
+      },
+      "engines": {
+        "node": ">=18.0.0",
+        "npm": ">=8.0.0"
+      },
+      "optionalDependencies": {
+        "@napi-rs/lzma-linux-x64-gnu": "1.5.1",
+        "@rollup/rollup-android-arm-eabi": "4.65.0",
+        "@rollup/rollup-android-arm64": "4.65.0",
+        "@rollup/rollup-darwin-arm64": "4.65.0",
+        "@rollup/rollup-darwin-x64": "4.65.0",
+        "@rollup/rollup-freebsd-arm64": "4.65.0",
+        "@rollup/rollup-freebsd-x64": "4.65.0",
+        "@rollup/rollup-linux-arm-gnueabihf": "4.65.0",
+        "@rollup/rollup-linux-arm-musleabihf": "4.65.0",
+        "@rollup/rollup-linux-arm64-gnu": "4.65.0",
+        "@rollup/rollup-linux-arm64-musl": "4.65.0",
+        "@rollup/rollup-linux-loong64-gnu": "4.65.0",
+        "@rollup/rollup-linux-loong64-musl": "4.65.0",
+        "@rollup/rollup-linux-ppc64-gnu": "4.65.0",
+        "@rollup/rollup-linux-ppc64-musl": "4.65.0",
+        "@rollup/rollup-linux-riscv64-gnu": "4.65.0",
+        "@rollup/rollup-linux-riscv64-musl": "4.65.0",
+        "@rollup/rollup-linux-s390x-gnu": "4.65.0",
+        "@rollup/rollup-linux-x64-gnu": "4.65.0",
+        "@rollup/rollup-linux-x64-musl": "4.65.0",
+        "@rollup/rollup-openbsd-x64": "4.65.0",
+        "@rollup/rollup-openharmony-arm64": "4.65.0",
+        "@rollup/rollup-win32-arm64-msvc": "4.65.0",
+        "@rollup/rollup-win32-ia32-msvc": "4.65.0",
+        "@rollup/rollup-win32-x64-gnu": "4.65.0",
+        "@rollup/rollup-win32-x64-msvc": "4.65.0",
+        "fsevents": "~2.3.2"
+      }
+    },
+    "node_modules/scheduler": {
+      "version": "0.28.0",
+      "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.28.0.tgz",
+      "integrity": "sha512-juorfCmIkIw8tT+p5BXSm6PJjQF/ycEYmKyzURCIt/RaZIhL+PulbQ9Yu2z1HdOJDdqDTlxA1+xKBmHXJsczAw==",
+      "license": "MIT"
+    },
+    "node_modules/semver": {
+      "version": "6.3.1",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
+      "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
+      "dev": true,
+      "license": "ISC",
+      "bin": {
+        "semver": "bin/semver.js"
+      }
+    },
+    "node_modules/set-cookie-parser": {
+      "version": "2.7.2",
+      "resolved": "https://registry.npmjs.org/set-cookie-parser/-/set-cookie-parser-2.7.2.tgz",
+      "integrity": "sha512-oeM1lpU/UvhTxw+g3cIfxXHyJRc/uidd3yK1P242gzHds0udQBYzs3y8j4gCCW+ZJ7ad0yctld8RYO+bdurlvw==",
+      "license": "MIT"
+    },
+    "node_modules/source-map-js": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.2.tgz",
+      "integrity": "sha512-KGj/8Y43x35aZVDtt+J4mK1hoLGHULMYfSkODJNQjNDC3oW1PqPoxMwo0pLUsWM/UEGzON/NxeHywEfNXNP3Vw==",
+      "dev": true,
+      "license": "BSD-3-Clause",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/std-env": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/std-env/-/std-env-4.3.0.tgz",
+      "integrity": "sha512-OtU/EgQ1kIm5KwqQpBC6ZEMXrZRui11w8zgfTWp8cdO9B8OaPsbA8bTHO2P+HNo1VlUTGMVBwPhydu6poeXiag==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/tinybench": {
+      "version": "6.2.2",
+      "resolved": "https://registry.npmjs.org/tinybench/-/tinybench-6.2.2.tgz",
+      "integrity": "sha512-nIZ2N2dFpjBsg2hgitKu7mA+FvsIJuGJOwysRngmVRRmWgR/UyPjwJj8c/fT/dhm8EkHnF5EOogRf+0Z2qrimA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=20.0.0"
+      }
+    },
+    "node_modules/tinyexec": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/tinyexec/-/tinyexec-1.3.1.tgz",
+      "integrity": "sha512-GCvB3aoys96IuDFBMcTB46JOR6mdMtAToqwiW8JlWhsoh1mhHi/xn9ss/Dg7N555GiJyEt2qzoG/NHCwM6h1EA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/tinyglobby": {
+      "version": "0.2.17",
+      "resolved": "https://registry.npmjs.org/tinyglobby/-/tinyglobby-0.2.17.tgz",
+      "integrity": "sha512-wXR/dYpcqKmfWpEdZjiKJOwCNFndD0DMnrW/cYjVGttEkBfVgcLFHoNrlj47mjOVic9yyNu65alsgF4NQyTa2g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "fdir": "^6.5.0",
+        "picomatch": "^4.0.4"
+      },
+      "engines": {
+        "node": ">=12.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/SuperchupuDev"
+      }
+    },
+    "node_modules/tslib": {
+      "version": "2.8.1",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz",
+      "integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==",
+      "license": "0BSD"
+    },
+    "node_modules/typescript": {
+      "version": "5.9.3",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.9.3.tgz",
+      "integrity": "sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "bin": {
+        "tsc": "bin/tsc",
+        "tsserver": "bin/tsserver"
+      },
+      "engines": {
+        "node": ">=14.17"
+      }
+    },
+    "node_modules/undici-types": {
+      "version": "7.24.6",
+      "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-7.24.6.tgz",
+      "integrity": "sha512-WRNW+sJgj5OBN4/0JpHFqtqzhpbnV0GuB+OozA9gCL7a993SmU+1JBZCzLNxYsbMfIeDL+lTsphD5jN5N+n0zg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/update-browserslist-db": {
+      "version": "1.3.4",
+      "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.3.4.tgz",
+      "integrity": "sha512-t8wonIOdQyOjtPd2VktlBu6QjTVTks6v8bSi7kd0r2Vll8TK1JYDZtRRdbmCHOAMphkZgrzK+L+vXK4pyZ8t4A==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/browserslist"
+        },
+        {
+          "type": "tidelift",
+          "url": "https://tidelift.com/funding/github/npm/browserslist"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "escalade": "^3.2.0",
+        "picocolors": "^1.1.1"
+      },
+      "bin": {
+        "update-browserslist-db": "cli.js"
+      },
+      "peerDependencies": {
+        "browserslist": ">= 4.21.0"
+      }
+    },
+    "node_modules/vite": {
+      "version": "7.3.7",
+      "resolved": "https://registry.npmjs.org/vite/-/vite-7.3.7.tgz",
+      "integrity": "sha512-AHEzTORMbi7/7aXp7w7KZ5+DCUdSeLsJz0grY8xHpc9DHdYb0vQu6DqJfm2tOw3gDExNgPgnJTXxM6syYFHaCA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "esbuild": "^0.27.0 || ^0.28.0",
+        "fdir": "^6.5.0",
+        "picomatch": "^4.0.3",
+        "postcss": "^8.5.6",
+        "rollup": "^4.43.0",
+        "tinyglobby": "^0.2.15"
+      },
+      "bin": {
+        "vite": "bin/vite.js"
+      },
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      },
+      "funding": {
+        "url": "https://github.com/vitejs/vite?sponsor=1"
+      },
+      "optionalDependencies": {
+        "fsevents": "~2.3.3"
+      },
+      "peerDependencies": {
+        "@types/node": "^20.19.0 || >=22.12.0",
+        "jiti": ">=1.21.0",
+        "less": "^4.0.0",
+        "lightningcss": "^1.21.0",
+        "sass": "^1.70.0",
+        "sass-embedded": "^1.70.0",
+        "stylus": ">=0.54.8",
+        "sugarss": "^5.0.0",
+        "terser": "^5.16.0",
+        "tsx": "^4.8.1",
+        "yaml": "^2.4.2"
+      },
+      "peerDependenciesMeta": {
+        "@types/node": {
+          "optional": true
+        },
+        "jiti": {
+          "optional": true
+        },
+        "less": {
+          "optional": true
+        },
+        "lightningcss": {
+          "optional": true
+        },
+        "sass": {
+          "optional": true
+        },
+        "sass-embedded": {
+          "optional": true
+        },
+        "stylus": {
+          "optional": true
+        },
+        "sugarss": {
+          "optional": true
+        },
+        "terser": {
+          "optional": true
+        },
+        "tsx": {
+          "optional": true
+        },
+        "yaml": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/vitest": {
+      "version": "5.0.5",
+      "resolved": "https://registry.npmjs.org/vitest/-/vitest-5.0.5.tgz",
+      "integrity": "sha512-cPODOMF8YnkiiYtDdHo6n4wWmBrOBBbOIYH2d33M4l3CdNn72h+qMmO6uXffUN6A5AZFXNND/d+krS9mgkXRfg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@types/chai": "^5.2.2",
+        "@vitest/mocker": "5.0.5",
+        "chai": "^6.3.0",
+        "es-module-lexer": "^2.3.2",
+        "expect-type": "^1.4.0",
+        "magic-string": "^1.4.3",
+        "obug": "^3.0.0",
+        "picomatch": "^4.0.7",
+        "std-env": "^4.3.0",
+        "tinybench": "^6.2.2",
+        "tinyexec": "^1.3.1",
+        "tinyglobby": "^0.2.17",
+        "why-is-node-running": "3.2.1"
+      },
+      "bin": {
+        "vitest": "vitest.mjs"
+      },
+      "engines": {
+        "node": "^22.12.0 || ^24.0.0 || >=26.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      },
+      "peerDependencies": {
+        "@edge-runtime/vm": "*",
+        "@opentelemetry/api": "^1.9.0",
+        "@types/node": "^22.0.0 || >=24.0.0",
+        "@vitest/browser-playwright": "5.0.5",
+        "@vitest/browser-preview": "5.0.5",
+        "@vitest/browser-webdriverio": "^5.0.0-beta.5 || >=5.0.0",
+        "@vitest/coverage-istanbul": "5.0.5",
+        "@vitest/coverage-v8": "5.0.5",
+        "@vitest/ui": "5.0.5",
+        "happy-dom": "*",
+        "jsdom": "*",
+        "vite": "^6.4.0 || ^7.0.0 || ^8.0.0"
+      },
+      "peerDependenciesMeta": {
+        "@edge-runtime/vm": {
+          "optional": true
+        },
+        "@opentelemetry/api": {
+          "optional": true
+        },
+        "@types/node": {
+          "optional": true
+        },
+        "@vitest/browser-playwright": {
+          "optional": true
+        },
+        "@vitest/browser-preview": {
+          "optional": true
+        },
+        "@vitest/browser-webdriverio": {
+          "optional": true
+        },
+        "@vitest/coverage-istanbul": {
+          "optional": true
+        },
+        "@vitest/coverage-v8": {
+          "optional": true
+        },
+        "@vitest/ui": {
+          "optional": true
+        },
+        "happy-dom": {
+          "optional": true
+        },
+        "jsdom": {
+          "optional": true
+        },
+        "vite": {
+          "optional": false
+        }
+      }
+    },
+    "node_modules/why-is-node-running": {
+      "version": "3.2.1",
+      "resolved": "https://registry.npmjs.org/why-is-node-running/-/why-is-node-running-3.2.1.tgz",
+      "integrity": "sha512-Tb2FUhB4vUsGQlfSquQLYkApkuPAFQXGFzxWKHHumVz2dK+X1RUm/HnID4+TfIGYJ1kTcwOaCk/buYCEJr6YjQ==",
+      "dev": true,
+      "license": "MIT",
+      "bin": {
+        "why-is-node-running": "cli.js"
+      },
+      "engines": {
+        "node": ">=20.11"
+      }
+    },
+    "node_modules/yallist": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/yallist/-/yallist-3.1.1.tgz",
+      "integrity": "sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g==",
+      "dev": true,
+      "license": "ISC"
+    }
+  }
+}
diff --git a/package.json b/package.json
new file mode 100644
index 0000000..dba344a
--- /dev/null
+++ b/package.json
@@ -0,0 +1,30 @@
+{
+  "name": "learning-lab-express",
+  "private": true,
+  "version": "0.1.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "tsc -b && vite build",
+    "typecheck": "tsc -b",
+    "preview": "vite preview",
+    "test": "vitest run"
+  },
+  "dependencies": {
+    "@clerk/localizations": "^4.24.0",
+    "@clerk/react": "^6.2.0",
+    "@tanstack/react-query": "^5.90.0",
+    "react": "^19.2.0",
+    "react-dom": "^19.2.0",
+    "react-router-dom": "^7.9.6"
+  },
+  "devDependencies": {
+    "@types/node": "^24.10.1",
+    "@types/react": "^19.2.5",
+    "@types/react-dom": "^19.2.3",
+    "@vitejs/plugin-react": "^5.1.1",
+    "typescript": "~5.9.3",
+    "vite": "^7.2.4",
+    "vitest": "^5.0.5"
+  }
+}
diff --git a/prototype/README.md b/prototype/README.md
new file mode 100644
index 0000000..3cd483b
--- /dev/null
+++ b/prototype/README.md
@@ -0,0 +1,27 @@
+# Learning Lab Express
+
+UI fase development (`index.html`, satu file, tanpa dependensi) dengan desain yang sama dengan `mockup.html` (CSS dipakai apa adanya) tetapi isi/alurnya memakai data engine yang terhubung ke engine **learning-lab** (FastAPI, `/api/v1`).
+
+```bash
+# 1. jalankan engine di ../learning-lab (docker compose up) → http://localhost:8000
+# 2. jalankan Express
+node server.mjs          # http://localhost:3000 ; ENGINE_URL / PORT dapat diubah
+```
+
+`server.mjs` menyajikan file statis dan mem-proxy `/api/*` ke engine (tanpa CORS).
+`engine.js` adalah client engine.
+
+| Alur | Engine |
+|---|---|
+| Login / logout / refresh token | `/auth/login`, `/auth/refresh`, `/auth/logout` |
+| Upload materi → Brain | `/upload/`, `/upload/list`, `DELETE /upload/{id}` |
+| Knowledge base (Brain) | `/upload/{id}/knowledge/build` (memakai kredit workspace) |
+| Login Clerk (akun organisasi) | `clerk-js` dari instance Clerk milik engine (key dibaca dari `../learning-lab/backend/.env`, atau `CLERK_PUBLISHABLE_KEY`) |
+| Riset konten | agen "Learning Lab Express" di `/organizations/current/agents` → `runs` → `source-drafts` |
+| Jadwal riset | `PATCH agents/{id}` `run_schedule` (harian/mingguan; bulanan & hari kerja dijalankan harian) |
+| Generate Text | `/compose/sets` + `/compose/sets/{id}/generate/summary` |
+
+Agents API hanya berjalan dalam konteks organisasi, jadi riset dan jadwal memerlukan tombol **Masuk dengan Clerk** dengan akun yang menjadi owner organisasi. Dengan login email/password biasa, riset tetap simulasi.
+Agen dibuat otomatis (budget 50 kredit/run, 1000/bulan; ubah di `Engine.ensureAgent`).
+
+Belum ada: video, audio, dan SCORM. Hanya format yang didukung engine yang bisa diunggah.
diff --git a/prototype/engine.js b/prototype/engine.js
new file mode 100644
index 0000000..b61a15a
--- /dev/null
+++ b/prototype/engine.js
@@ -0,0 +1,192 @@
+// Client for the learning-lab engine (FastAPI, /api/v1).
+// Auth, document upload/Brain and text generation go through the real backend.
+(function (root) {
+  const BASE = '/api/v1', KEY = 'lle-engine-tokens';
+  const Engine = {};
+
+  let tokens = null;
+  try { tokens = JSON.parse(localStorage.getItem(KEY) || 'null'); } catch { tokens = null; }
+  const save = t => { tokens = t; try { t ? localStorage.setItem(KEY, JSON.stringify(t)) : localStorage.removeItem(KEY); } catch {} };
+
+  class EngineError extends Error { constructor(message, status) { super(message); this.status = status; } }
+  const detail = d => typeof d === 'string' ? d : Array.isArray(d) ? d.map(x => x.msg || JSON.stringify(x)).join('; ') : (d && d.message) || 'Permintaan ke engine gagal.';
+
+  // ── Clerk: the only source of organization-scoped tokens (needed by the agents API) ──
+  let clerk = null;
+  Engine.initClerk = async () => {
+    const key = root.LLE_CONFIG?.clerkKey;
+    if (!key) return false;
+    if (clerk) return true;
+    const domain = atob(key.split('_')[2]).replace(/\$$/, '');
+    await new Promise((ok, fail) => {
+      const s = document.createElement('script');
+      s.src = `https://${domain}/npm/@clerk/clerk-js@5/dist/clerk.browser.js`;
+      s.async = true; s.crossOrigin = 'anonymous'; s.setAttribute('data-clerk-publishable-key', key);
+      s.onload = ok; s.onerror = () => fail(new EngineError('Clerk tidak dapat dimuat.', 0));
+      document.head.appendChild(s);
+    });
+    await root.Clerk.load();
+    clerk = root.Clerk;
+    return true;
+  };
+  Engine.clerkEnabled = () => !!clerk;
+  Engine.clerkUser = () => clerk?.user && { email: clerk.user.primaryEmailAddress?.emailAddress, name: clerk.user.fullName || clerk.user.firstName };
+  Engine.onClerkChange = cb => clerk?.addListener(() => cb());
+  Engine.clerkSignIn = () => clerk.openSignIn({});
+  // Agents belong to an organization: make sure one is active on the session before asking for a token.
+  Engine.ensureOrg = async () => {
+    if (!clerk?.session) return null;
+    if (!clerk.organization) {
+      const memberships = (await clerk.user.getOrganizationMemberships()).data || [];
+      if (!memberships.length) return null;
+      await clerk.setActive({ organization: memberships[0].organization.id });
+    }
+    return clerk.organization;
+  };
+
+  async function accessToken() {
+    if (clerk?.session) return clerk.session.getToken();
+    return tokens?.access;
+  }
+
+  async function raw(path, opts = {}) {
+    const headers = { ...(opts.headers || {}) };
+    const access = await accessToken();
+    if (access) headers.Authorization = 'Bearer ' + access;
+    if (opts.json !== undefined) { headers['Content-Type'] = 'application/json'; opts = { ...opts, body: JSON.stringify(opts.json) }; }
+    let res;
+    try { res = await fetch(BASE + path, { ...opts, headers }); }
+    catch { throw new EngineError('Engine learning-lab tidak dapat dihubungi.', 0); }
+    return res;
+  }
+
+  let refreshing = null;
+  async function refresh() {
+    if (!tokens?.refresh) return false;
+    refreshing ||= (async () => {
+      const res = await fetch(BASE + '/auth/refresh', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ refresh_token: tokens.refresh }) });
+      if (!res.ok) { save(null); return false; }
+      const body = await res.json();
+      save({ access: body.access_token, refresh: body.refresh_token || tokens.refresh });
+      return true;
+    })().finally(() => { refreshing = null; });
+    return refreshing;
+  }
+
+  async function call(path, opts = {}) {
+    let res = await raw(path, opts);
+    if (res.status === 401 && !path.startsWith('/auth/') && await refresh()) res = await raw(path, opts);
+    if (res.status === 204) return null;
+    const body = await res.json().catch(() => null);
+    if (!res.ok) throw new EngineError(detail(body?.detail), res.status);
+    return body;
+  }
+
+  Engine.hasSession = () => !!(clerk?.session || tokens?.access);
+  Engine.login = async (email, password) => {
+    const res = await raw('/auth/login', { method: 'POST', json: { email, password } });
+    const body = await res.json().catch(() => null);
+    if (!res.ok) throw new EngineError(res.status === 401 ? 'Email atau password salah.' : detail(body?.detail), res.status);
+    save({ access: body.access_token, refresh: body.refresh_token });
+    return body.user;
+  };
+  Engine.me = () => call('/auth/me');
+  Engine.logout = async () => {
+    try { if (tokens?.refresh) await call('/auth/logout', { method: 'POST', json: { refresh_token: tokens.refresh } }); } catch {}
+    save(null);
+    if (clerk?.session) await clerk.signOut();
+  };
+
+  let formats = null;
+  Engine.supportedExtensions = async () => (formats ||= call('/upload/supported-formats').then(f => new Set(f.extensions)).catch(() => { formats = null; return new Set(); }));
+
+  const asSource = d => ({
+    id: 'doc-' + d.id, docId: d.id, remote: true, sample: false,
+    title: (d.original_filename || d.filename).replace(/\.[^.]+$/, ''), originalName: d.original_filename || d.filename,
+    format: (d.file_type || (d.original_filename || '').split('.').pop() || '').toUpperCase(), tags: [], text: '',
+    createdAt: d.created_at, status: d.status, knowledge: d.knowledge_status, progress: d.progress_percentage, stage: d.processing_stage,
+  });
+  Engine.listDocuments = async () => (await call('/upload/list')).map(asSource);
+  Engine.documentStatus = async id => call('/upload/' + id);
+  Engine.upload = async file => {
+    const form = new FormData(); form.append('file', file, file.name);
+    const body = await call('/upload/', { method: 'POST', body: form });
+    return { id: body.id ?? body.document_id, raw: body };
+  };
+  Engine.deleteDocument = id => call('/upload/' + id, { method: 'DELETE' });
+
+  // Building a knowledge base spends workspace credits; a 402 surfaces as an EngineError with the shortfall.
+  const BUILDABLE = new Set(['not_built', 'awaiting_confirmation', 'needs_credits', 'failed']);
+  Engine.buildKnowledge = async id => {
+    const s = await Engine.documentStatus(id);
+    if (!BUILDABLE.has(s.knowledge_status)) return s;
+    try { await call(`/upload/${id}/knowledge/build`, { method: 'POST' }); }
+    catch (e) { throw e.status === 402 ? new EngineError('Kredit tidak cukup untuk membangun knowledge base: ' + e.message, 402) : e; }
+    return s;
+  };
+
+  // Polls until the document's knowledge base is built (what generation needs).
+  Engine.waitReady = async (id, onProgress, { timeoutMs = 10 * 60 * 1000 } = {}) => {
+    const t0 = Date.now();
+    for (;;) {
+      const s = await Engine.documentStatus(id);
+      onProgress?.(s);
+      if (s.error || s.status === 'failed') throw new EngineError(s.error || 'Dokumen gagal diproses.', 422);
+      if (s.knowledge_status === 'ready') return s;
+      if (Date.now() - t0 > timeoutMs) throw new EngineError('Pemrosesan dokumen melebihi batas waktu.', 408);
+      await new Promise(r => setTimeout(r, 2500));
+    }
+  };
+
+  // Text content: a compose set over whole documents, then a generated summary.
+  Engine.generateText = async (docIds, name) => {
+    const set = await call('/compose/sets', { method: 'POST', json: { name, mode: 'knowledge_documents', source_document_ids: docIds } });
+    const summary = await call(`/compose/sets/${set.id}/generate/summary`, { method: 'POST', json: { operation_key: `lle-${set.id}-${Date.now()}` } });
+    return { setId: set.id, summary };
+  };
+  Engine.generateQuiz = (setId, n = 5) => call(`/compose/sets/${setId}/generate/quiz`, { method: 'POST', json: { num_questions: n, question_type: 'mixed', operation_key: `lle-q-${setId}-${Date.now()}` } });
+
+  // ── Agents (organization-scoped): research runs and the recurring schedule ──
+  const AGENTS = '/organizations/current/agents', AGENT_NAME = 'Learning Lab Express';
+  Engine.agentsAvailable = async () => !!(await Engine.ensureOrg());
+  let agentCache = null;
+  Engine.ensureAgent = async () => {
+    if (agentCache) return agentCache;
+    let agent = (await call(AGENTS)).find(a => a.name === AGENT_NAME && a.status !== 'archived');
+    agent ||= await call(AGENTS, { method: 'POST', json: {
+      name: AGENT_NAME, goal: 'Riset topik pembelajaran dan temukan sumber publik baru untuk Brain tim LND.',
+      enabled_tools: ['knowledge.retrieve', 'compose.graph.retrieve', 'browse.search', 'library.add_url'],
+      research_options: { max_results: 5 }, timezone: 'Asia/Jakarta', run_budget: 50, monthly_budget: 1000,
+    } });
+    if (agent.status !== 'active') agent = await call(`${AGENTS}/${agent.id}/activate`, { method: 'POST' });
+    return (agentCache = agent);
+  };
+  Engine.attachSources = async (agentId, docIds) => {
+    for (const id of docIds) { try { await call(`${AGENTS}/${agentId}/knowledge-sources`, { method: 'PUT', json: { kind: 'document', source_id: id } }); } catch (e) { if (e.status !== 404) throw e; } }
+  };
+  // Server-side recurring run. weekday: UI uses 0=Sunday, the engine 0=Monday.
+  Engine.setSchedule = async ({ enabled, frequency, time, weekday }) => {
+    const agent = await Engine.ensureAgent(), [hour, minute] = String(time || '09:00').split(':').map(Number);
+    const cadence = !enabled ? 'off' : frequency === 'weekly' ? 'weekly' : 'daily';
+    agentCache = await call(`${AGENTS}/${agent.id}`, { method: 'PATCH', json: { run_schedule: { cadence, hour, minute, weekday: (Number(weekday) + 6) % 7 } } });
+    return agentCache;
+  };
+  Engine.research = async ({ topic, prompt, urls = [], docIds = [] }, onStatus) => {
+    const agent = await Engine.ensureAgent();
+    await Engine.attachSources(agent.id, docIds);
+    const focus = [topic && `Topik: ${topic}`, prompt, urls.length && `Referensi: ${urls.join(' ')}`].filter(Boolean).join('\n');
+    await call(`${AGENTS}/${agent.id}`, { method: 'PATCH', json: { goal: (topic ? `Riset topik: ${topic}` : agent.goal).slice(0, 4000), instructions: focus || null } });
+    const run = await call(`${AGENTS}/${agent.id}/runs`, { method: 'POST', headers: { 'Idempotency-Key': `lle-${agent.id}-${Date.now()}-${Math.random().toString(36).slice(2, 8)}` }, json: {} });
+    for (let detail = run; ; ) {
+      onStatus?.(detail);
+      if (['completed', 'failed', 'cancelled'].includes(detail.status)) { if (detail.status !== 'completed') throw new EngineError('Riset gagal dijalankan (' + (detail.safe_error_code || detail.status) + ').', 422); break; }
+      await new Promise(r => setTimeout(r, 3000));
+      detail = await call(`${AGENTS}/${agent.id}/runs/${run.id}`);
+    }
+    const detail = await call(`${AGENTS}/${agent.id}/runs/${run.id}`);
+    const drafts = (await call(`${AGENTS}/${agent.id}/source-drafts`)).filter(d => d.run_id === run.id);
+    return { run: detail, drafts };
+  };
+
+  root.Engine = Engine; root.EngineError = EngineError;
+})(window);
diff --git a/prototype/index.html b/prototype/index.html
new file mode 100644
index 0000000..216be48
--- /dev/null
+++ b/prototype/index.html
@@ -0,0 +1,333 @@
+<!DOCTYPE html>
+<html lang="id">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width,initial-scale=1">
+  <meta name="description" content="Learning Lab Express by Bawana. Konsol development terhubung ke engine learning-lab.">
+  <title>Learning Lab Express · DEV</title>
+  <style>:root{--blue:#2563eb;--blue-dark:#194dcc;--navy:#142d50;--ink:#1b2c46;--muted:#768399;--line:#e6ebf2;--bg:#f7f9fc;--light:#eef5ff;--green:#14866b;--radius:14px;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);font-size:14px}
+.admin-menu{margin-top:26px;border-top:1px solid var(--line);padding-top:16px}.admin-menu summary{list-style:none;display:flex;align-items:center;justify-content:space-between;padding:12px;color:var(--muted);font-size:11px;cursor:pointer}.admin-menu summary::-webkit-details-marker{display:none}.admin-menu summary svg{width:14px}.admin-menu[open] summary svg{transform:rotate(180deg)}.auto-hero-note{display:flex;align-items:center;gap:7px;font-size:10px;color:#6c83a3;margin-top:18px}.auto-hero-note svg{width:14px;height:14px;color:var(--blue)}.auto-flow{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:22px 0 18px;padding:0 3px;color:#607594;font-size:11px}.auto-flow>span{display:flex;align-items:center;gap:9px}.auto-flow b{color:var(--blue);background:#eaf2ff;border-radius:50%;display:grid;place-items:center;width:27px;height:27px;font-size:10px}.auto-flow>svg{width:15px;color:#9eafc7}.upload-box.upload-compact{display:flex;align-items:center;gap:18px;text-align:left;padding:25px 28px;margin-bottom:25px}.upload-compact .upload-symbol{margin:0;width:45px;height:45px;flex-shrink:0}.upload-compact>div{flex:1}.upload-compact h3{font-size:14px}.upload-compact p{font-size:11px;margin:6px 0}.upload-compact small{font-size:9px}.upload-compact .btn{flex-shrink:0}
+@media(max-width:600px){.auto-flow{flex-direction:column;align-items:flex-start;gap:12px;margin:18px 0}.auto-flow>svg{display:none}.upload-box.upload-compact{flex-wrap:wrap;padding:20px;gap:13px}.upload-compact>div{flex-basis:calc(100% - 60px)}.upload-compact .btn{width:100%}.auto-hero-note{line-height:1.6}.admin-menu{margin-top:0;padding-top:0;border:0}.admin-menu summary{padding:10px 6px;font-size:10px}}
+*{box-sizing:border-box}body{margin:0;background:var(--bg)}button,input,select,textarea{font:inherit}button,a,input,select,textarea{outline-offset:4px}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.48}a{color:inherit;text-decoration:none}button{color:inherit}button:focus-visible,a:focus-visible{outline:3px solid #9dbfff}svg{width:20px;height:20px;flex-shrink:0;vertical-align:middle}p{line-height:1.7;margin:0;color:var(--muted)}h1,h2,h3,h4{margin:0;letter-spacing:-.035em}h1{font-size:29px;line-height:1.25}h2{font-size:23px}h3{font-size:16px;letter-spacing:-.02em}h4{font-size:14px}small{font-size:11px;color:var(--muted)}[hidden]{display:none!important}
+.brand{display:flex;align-items:center;gap:10px;line-height:1.15;font-size:16px;font-weight:750;letter-spacing:-.5px;white-space:nowrap}.brand b{font-weight:500;display:block;font-size:14px;margin-top:4px;letter-spacing:.1px}.brand small{display:block;font-size:9px;letter-spacing:1.5px;text-transform:uppercase;margin-top:7px;font-weight:600;color:#8493aa}.brand-mark{width:40px;height:42px;background:var(--blue);border-radius:11px;display:flex;align-items:center;justify-content:center;color:#fff;box-shadow:0 5px 10px #2563eb16}.brand-mark svg{width:24px;height:24px}
+.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;padding:10px 17px;border-radius:8px;border:1px solid #dce3ee;background:white;font-size:12px;font-weight:650;white-space:nowrap;transition:background .15s,transform .15s}.btn:hover{background:#f5f8fd}.btn.primary{color:#fff;background:var(--blue);border-color:var(--blue);box-shadow:0 3px 6px #2563eb12}.btn.primary:hover{background:var(--blue-dark)}.btn.light{background:var(--light);border-color:#dfebff;color:var(--blue)}.btn.small{min-height:34px;padding:7px 11px;font-size:11px}.btn svg{width:16px;height:16px}.btn.danger{color:#b64747}.wide{width:100%}.icon-btn{display:inline-flex;align-items:center;justify-content:center;background:transparent;border:0;border-radius:7px;padding:7px;color:#8290a5}.icon-btn:hover{background:var(--light);color:var(--blue)}.icon-btn svg{width:18px;height:18px}.text-btn{border:0;background:transparent;padding:0;color:var(--blue);font-size:12px;font-weight:600;display:inline-flex;align-items:center;gap:6px}.text-btn svg{width:15px;height:15px}.badge,.status{display:inline-flex;align-items:center;gap:5px;border-radius:5px;padding:5px 8px;font-size:10px;font-weight:650;line-height:1;white-space:nowrap}.badge.neutral{background:#eff3f8;color:#718098}.badge.blue{color:#2563eb;background:#edf4ff}.badge.purple{color:#8063bb;background:#f3effb}.badge.amber{color:#a78126;background:#fff7df}.status.ready{color:var(--green);background:#e9f7f2}.status.draft{color:#9a7a37;background:#fff6df}.dot{width:5px;height:5px;background:currentColor;border-radius:50%}
+label{display:block;font-size:12px;font-weight:650;margin:0 0 8px}input:not([type=checkbox]):not([type=radio]):not([type=file]),select,textarea{width:100%;border:1px solid #dce3ed;padding:12px 13px;border-radius:8px;background:white;min-height:43px;color:var(--ink);transition:border-color .15s;outline-color:var(--blue)}input:focus,select:focus,textarea:focus{border-color:var(--blue)}input::placeholder,textarea::placeholder{color:#a3adbc}textarea{resize:vertical;line-height:1.65}input[type=checkbox]{accent-color:var(--blue);width:15px;height:15px;flex-shrink:0;cursor:pointer}.check-label{display:flex;align-items:center;gap:7px;font-weight:500;margin:0;line-height:1.6}.field{margin-bottom:22px}.field small{display:block;line-height:1.6;margin-top:7px}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}.error{color:#c35252;font-size:12px;margin-top:10px}.inline-note{display:flex;gap:9px;padding:13px 15px;background:#f5f8fc;border-radius:8px;font-size:11px;line-height:1.75;color:var(--muted)}.inline-note svg{width:16px;height:16px;flex-shrink:0;margin-top:2px;color:var(--blue)}
+.login-layout{min-height:100vh;display:grid;grid-template-columns:55% 45%;background:white}.login-story{padding:44px 8%;background:#f0f6ff;display:flex;flex-direction:column;position:relative;overflow:hidden}.login-story:after{content:"";position:absolute;right:-260px;bottom:-370px;width:720px;height:720px;border:1px solid #dce9fc;border-radius:50%;pointer-events:none}.login-copy{margin:auto 0;padding:54px 0 45px;position:relative;z-index:1}.eyebrow{font-size:9px;font-weight:750;color:var(--blue);letter-spacing:1.6px}.login-copy h1{font-size:42px;line-height:1.22;letter-spacing:-1.6px;margin:22px 0}.login-copy>p{font-size:14px;max-width:420px;color:#74849b}.login-diagram{margin:35px 0 28px;width:390px;max-width:100%;position:relative}.mini-source,.mini-output{display:flex;align-items:center;gap:13px;padding:16px 18px;background:white;border:1px solid #e3ebf8;border-radius:11px;box-shadow:0 5px 10px #24457604;font-weight:650;font-size:12px}.mini-source{margin-right:30px}.mini-output{margin-left:30px}.mini-source small,.mini-output small{display:block;margin-top:5px;font-size:10px;font-weight:450}.mini-check{margin-left:auto;color:#31a287;background:#ecf8f3;width:22px;height:22px;text-align:center;border-radius:50%;line-height:22px}.connector{height:43px;display:flex;align-items:center;justify-content:center;gap:12px;color:var(--blue)}.connector i{display:block;width:1px;height:11px;background:#b3c8ee}.connector svg{width:24px;height:24px}.output-icon{background:#ebf3ff;border-radius:8px;padding:10px;color:var(--blue)}.mini-output .status{margin-left:auto}.login-benefits{display:flex;flex-direction:column;gap:13px;color:#607594;font-size:11px}.login-benefits>span{display:flex;align-items:center;gap:9px}.login-benefits svg{width:16px;height:16px;color:#6b8cc4}.login-footer{position:relative;z-index:1;font-size:8px;color:#8ba0bc;letter-spacing:1px;display:flex;justify-content:space-between;gap:12px}.login-footer span{letter-spacing:0}.login-panel{display:flex;align-items:center;justify-content:center;padding:45px}.login-form-wrap{width:360px;max-width:100%}.login-form-wrap h2{font-size:26px;margin-top:22px;line-height:1.3}.login-form-wrap>p{font-size:12px;margin:12px 0 30px}.login-form-wrap form>label{margin-top:20px}.password-field{position:relative}.password-field input{padding-right:45px!important}.password-field button{position:absolute;right:5px;top:6px;background:none;border:0;padding:6px;color:#929eaf}.password-field svg{width:18px;height:18px}.login-small{display:flex;align-items:center;justify-content:space-between;font-size:10px;color:#8e9aad;margin:18px 0 26px}.login-small label{font-size:10px;font-weight:500}.login-small input{width:13px;height:13px}.demo-login{margin-top:26px;display:flex;gap:10px;border:1px solid var(--line);border-radius:9px;padding:14px}.demo-login>svg{color:var(--blue);width:17px;height:17px;flex-shrink:0;margin-top:2px}.demo-login p{font-size:10px;line-height:1.8;color:#8390a2}.login-form-wrap .login-bottom{margin-top:46px;font-size:10px;text-align:center;color:#a3adbc}.login-bottom span{margin-left:6px;color:#6c86ad}
+.app{display:flex;min-height:100vh}.sidebar{width:238px;flex-shrink:0;background:white;position:fixed;inset:0 auto 0 0;border-right:1px solid var(--line);padding:29px 18px 14px;display:flex;flex-direction:column;z-index:5}.sidebar>.brand{margin:0 13px 26px;font-size:14px}.sidebar .brand b{font-size:12px}.sidebar .brand-mark{width:35px;height:38px;border-radius:9px}.sidebar .brand small{font-size:8px}.workspace{display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:9px;padding:11px 10px;margin-bottom:30px;font-size:11px;font-weight:650}.workspace-icon{display:flex;align-items:center;justify-content:center;background:#eef3fa;border-radius:7px;width:29px;height:29px;color:#7086a6}.workspace small{display:block;font-weight:450;font-size:9px;margin-top:3px}.workspace>svg{width:13px;height:13px;margin-left:auto;color:#94a1b4}.nav-label{font-size:8px;font-weight:700;color:#a0aabc;letter-spacing:1.5px;margin:0 12px 14px}nav{display:flex;flex-direction:column;gap:5px}nav button{display:flex;align-items:center;gap:11px;padding:13px 13px;border:0;background:none;border-radius:8px;color:#7b879b;font-size:12px;text-align:left;font-weight:550;width:100%}nav button svg{width:18px;height:18px;color:#8995a9}nav button:hover{background:#f6f9fe}nav button.active{background:#edf4ff;color:#2563eb;font-weight:650}nav button.active svg{color:#2563eb}.nav-count{font-size:9px;background:#eef2f7;padding:3px 6px;border-radius:4px;margin-left:auto;color:#8895a9}.active .nav-count{background:#dceaff;color:#2563eb}.sidebar-help{margin: auto 0 16px;border:1px solid #e5edf9;background:#f8fbff;border-radius:10px;padding:16px 13px}.sidebar-help>svg{color:#7091c2;width:18px;height:18px;display:block;margin-bottom:11px}.sidebar-help b{font-size:11px;font-weight:650}.sidebar-help p{font-size:10px;line-height:1.7;margin:8px 0 12px}.sidebar-help button{display:flex;align-items:center;gap:7px;color:var(--blue);font-size:10px;font-weight:650;border:0;padding:0;background:none}.sidebar-help button svg{width:13px;height:13px}.profile{display:flex;gap:9px;align-items:center;padding:14px 5px 0;border-top:1px solid var(--line)}.avatar{height:32px;width:32px;background:#edf3ff;color:#527fc8;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:650}.profile b{font-size:11px;font-weight:650}.profile small{display:block;font-size:9px;margin-top:4px}.profile>.icon-btn{margin-left:auto}
+.workspace-main{margin-left:238px;width:calc(100% - 238px);min-height:100vh;display:flex;flex-direction:column}.topbar{height:72px;display:flex;justify-content:space-between;align-items:center;background:white;border-bottom:1px solid var(--line);padding:0 34px;gap:15px}.breadcrumb{font-size:11px;color:#94a0b1;white-space:nowrap}.breadcrumb span{margin:0 10px;color:#c1c9d5}.breadcrumb b{color:#64738a;font-weight:550}.topbar-right{display:flex;align-items:center;gap:19px;font-size:10px;color:#8b97a9}.demo-indicator{display:flex;align-items:center;gap:6px}.demo-indicator i{width:5px;height:5px;border-radius:50%;background:#d6a34b}.demo-strip{display:flex;align-items:center;gap:9px;margin:23px 34px 0;padding:10px 13px;border:1px solid #e1ebfb;background:#f0f6ff;border-radius:7px;font-size:10px;color:#7b91b2;line-height:1.5}.demo-strip svg{width:14px;height:14px;color:#7193c6}.demo-strip-tag{margin-left:auto;font-size:8px;letter-spacing:1px;font-weight:700;color:#7b96be}.app main{padding:28px 34px 30px;width:100%;max-width:1500px;align-self:center}.page-head{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:25px}.page-head p{font-size:12px;margin-top:8px}.head-actions{display:flex;gap:9px;align-items:center}.app-footer{display:flex;gap:9px;align-items:center;flex-wrap:wrap;margin: auto 34px 0;padding:18px 0;border-top:1px solid var(--line);font-size:9px;color:#99a4b5}.app-footer>span:first-child{color:#7493c3}.app-footer>span:last-child{margin-left:auto;font-size:8px}.card{background:white;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}.card-head{padding:21px 23px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:10px}.card-head h3{font-size:14px}.card-head p{font-size:10px;margin-top:5px}.card-body{padding:23px}.hero{position:relative;display:grid;grid-template-columns:1.1fr 1fr;background:#edf4ff;border:1px solid #dfeaff;border-radius:14px;padding:30px 30px 29px;align-items:center;gap:15px;min-height:245px;margin-bottom:23px}.hero .eyebrow{font-size:8px;letter-spacing:1.4px}.hero h2{font-size:31px;line-height:1.23;letter-spacing:-1px;margin:15px 0 10px}.hero p{font-size:11px;max-width:375px;color:#7e91ad}.hero .head-actions{margin-top:21px}.hero-art{position:relative;justify-self:center;width:310px;max-width:100%}.hero-art .mini-source{font-size:10px;padding:13px;max-width:230px;transform:rotate(-3deg);margin-right:0}.hero-art .mini-source+.mini-source{position:relative;margin-top:8px;margin-left:25px;transform:rotate(1deg)}.hero-art .mini-source small{font-size:8px}.hero-art .file-icon{width:29px;height:34px;font-size:8px}.hero-art .connector{height:30px;margin-left:80px}.hero-art .mini-output{margin-left:45px;padding:13px;font-size:10px;position:relative;z-index:2;box-shadow:0 7px 15px #2563eb08}.hero-art .mini-output small{font-size:8px}.hero-art .output-icon{padding:8px}.hero-art .output-icon svg{width:17px;height:17px}.hero-art:before{content:"";position:absolute;border:1px dashed #c3d6f4;border-radius:50%;height:245px;width:245px;top:-10px;right:10px}
+.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:23px}.metric{background:white;border:1px solid var(--line);border-radius:11px;padding:19px 19px 16px;position:relative}.metric>span{font-size:10px;color:#8c98aa}.metric strong{display:block;font-size:27px;letter-spacing:-1px;font-weight:650;margin:10px 0 8px}.metric small{font-size:9px;color:#9aa5b5}.metric i{position:absolute;right:16px;top:16px;background:#f2f6fc;border-radius:8px;padding:8px;color:#7f9bc5}.metric i svg{width:16px;height:16px}.setup-row{padding:17px 21px;display:flex;align-items:center;gap:24px;margin-bottom:23px}.setup-row>b{font-size:11px;white-space:nowrap}.steps{display:flex;justify-content:space-between;width:100%;gap:12px}.step{display:flex;align-items:center;gap:9px;font-size:10px;color:#8a98ac;background:none;border:0;padding:0;text-align:left}.step>i{height:25px;width:25px;display:flex;align-items:center;justify-content:center;border:1px solid #dfe7f3;border-radius:50%;font-size:9px;font-style:normal;color:#8b9cb6;background:#fafcff}.step.done>i{background:#ebf8f1;color:#3b9a77;border-color:#d9efdf}.step small{font-size:8px;display:block;margin-top:4px}.step-arrow{color:#c2cddd;font-size:15px}.dashboard-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:21px;margin-bottom:23px}.empty{display:flex;flex-direction:column;align-items:center;text-align:center;padding:36px 25px;color:#8090a6}.empty-icon{color:#8da9d6;background:#f2f7fe;width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;margin-bottom:14px}.empty-icon svg{width:24px;height:24px}.empty h3{font-size:13px;color:#596d8b;margin-bottom:8px}.empty p{font-size:10px;max-width:310px;margin-bottom:18px}.schedule-mini{padding:22px}.schedule-mini .clock-circle{background:#edf4ff;color:#7499ce;display:inline-flex;padding:11px;border-radius:50%;margin-bottom:17px}.schedule-mini h3{font-size:14px;margin-bottom:8px}.schedule-mini p{font-size:10px;line-height:1.75}.schedule-mini>.btn{margin-top:18px}.schedule-meta{border-top:1px solid var(--line);margin-top:17px;padding-top:15px;display:flex;justify-content:space-between;font-size:10px;color:#8491a5}.schedule-meta b{font-size:10px;color:#566e91;font-weight:600}.section-heading{display:flex;justify-content:space-between;align-items:center;margin:26px 0 15px;gap:12px}.section-heading p{font-size:10px;margin-top:6px}.section-heading h3{font-size:14px}.match-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.match-card{padding:18px}.match-card .pair-names{display:flex;flex-direction:column;gap:10px;font-size:11px;line-height:1.5;font-weight:600}.pair-names span{display:flex;align-items:center;gap:8px}.pair-names svg{width:15px;height:15px;color:#93a7c5}.match-tags{display:flex;gap:5px;flex-wrap:wrap;margin:15px 0}.tag{display:inline-block;font-size:9px;color:#8493a8;background:#f4f6fa;border-radius:4px;padding:4px 6px}.match-card .match-footer{display:flex;justify-content:space-between;align-items:center;gap:8px;border-top:1px solid var(--line);padding-top:13px}.match-footer small{font-size:9px}
+.file-icon{width:34px;height:40px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:6px;background:#eef2f7;font-size:9px;font-weight:700;color:#8290a4;border:1px solid #e6ebf3}.file-icon.pdf{color:#d47c7c;background:#fff2f2;border-color:#fae8e8}.file-icon.pptx{color:#c58e5d;background:#fff5ea;border-color:#f8eadb}.file-icon.docx{color:#6e94d6;background:#f0f5ff;border-color:#e2eafb}.file-icon.txt,.file-icon.md{color:#689d86;background:#eef9f3;border-color:#def0e5}.upload-box{border:1.5px dashed #c9d9ef;border-radius:12px;background:#f9fbff;text-align:center;padding:31px 24px;margin-bottom:18px;transition:background .15s}.upload-box.drag{background:#eaf2ff;border-color:var(--blue)}.upload-symbol{display:inline-flex;padding:12px;background:#eaf2ff;border:1px solid #deebff;color:#7299d5;border-radius:12px;margin-bottom:14px}.upload-box h3{font-size:14px;margin-bottom:8px}.upload-box p{font-size:10px;margin-bottom:17px}.upload-box .upload-limit{font-size:9px;margin:11px 0 0}.toolbar{padding:17px 21px;display:flex;justify-content:space-between;gap:15px;align-items:center;border-bottom:1px solid var(--line)}.toolbar h3{font-size:13px}.toolbar .toolbar-controls{display:flex;gap:10px;max-width:520px;width:55%}.search{position:relative;width:100%;max-width:280px}.search>svg{position:absolute;left:11px;top:11px;width:15px;height:15px;color:#9aa7ba}.search input{padding:9px 12px 9px 34px!important;font-size:10px;min-height:35px!important}.toolbar select{padding:8px 11px;font-size:10px;min-height:35px;width:155px}.table-wrap{overflow:auto}table{border-collapse:collapse;width:100%;text-align:left}th{font-size:9px;font-weight:650;color:#9aa6b7;background:#fbfcfe;padding:13px 21px;border-bottom:1px solid var(--line);white-space:nowrap}td{padding:17px 21px;border-bottom:1px solid #eff2f7;font-size:10px;color:#8390a4;vertical-align:middle}tbody tr:last-child td{border-bottom:0}.file-name{display:flex;gap:12px;align-items:center;min-width:200px}.file-name b{font-size:11px;display:block;font-weight:600;color:#455a78;line-height:1.5;max-width:280px;overflow-wrap:anywhere}.file-name small{font-size:9px;display:block;margin-top:5px}.table-actions{white-space:nowrap;text-align:right}.table-note{border-top:1px solid var(--line);font-size:9px;color:#9aa7ba;padding:13px 21px}.notice-row{display:flex;align-items:center;gap:10px;font-size:10px;color:#8396b2;background:#edf4ff;border:1px solid #e0eafb;border-radius:8px;padding:12px 15px;margin-bottom:20px}.notice-row svg{width:15px;height:15px;flex-shrink:0}.notice-row button{margin-left:auto;white-space:nowrap;font-size:10px}.two-column{display:grid;grid-template-columns:1.55fr 1fr;align-items:start;gap:23px}.form-card .card-body{padding:25px}.form-section-title{font-size:11px;font-weight:700;color:#4c6280;margin-bottom:21px}.form-footer{border-top:1px solid var(--line);padding:17px 25px;display:flex;justify-content:space-between;align-items:center;gap:15px}.form-footer small{font-size:9px;line-height:1.6}.side-card{padding:23px}.side-card h3{font-size:13px;margin-bottom:12px}.side-card p{font-size:11px;margin-bottom:18px}.side-list{margin:0;padding:0;list-style:none;counter-reset:steps}.side-list li{counter-increment:steps;display:flex;align-items:flex-start;gap:11px;font-size:11px;color:#7c8da5;padding:12px 0;border-bottom:1px solid #f0f3f8;line-height:1.7}.side-list li:before{content:counter(steps);font-size:9px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:#edf4ff;color:#7b9ac7;flex-shrink:0;width:22px;height:22px}.side-list li:last-child{border-bottom:0}.mode-box{display:flex;gap:12px;background:#f7faff;border:1px solid #e3ecfa;border-radius:10px;padding:16px;margin-bottom:26px}.mode-box>span{background:#e9f2ff;color:#6d95d1;border-radius:8px;padding:9px;height:38px}.mode-box b{font-size:11px}.mode-box p{font-size:10px;line-height:1.7;margin-top:5px}.mode-box .badge{margin-left:auto;height:22px;font-size:8px}.output-checks{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:16px;border:1px solid var(--line);border-radius:8px}.output-checks label{font-size:11px}.switch-row{display:flex;justify-content:space-between;align-items:center;padding:18px;background:#f8fbff;border:1px solid #e6eefb;border-radius:9px;margin-bottom:25px}.switch-row b{font-size:12px}.switch-row p{font-size:10px;margin-top:5px}.switch{width:35px;height:20px;position:relative;display:inline-flex}.switch input{width:100%;height:100%;opacity:0;position:absolute;z-index:1;margin:0}.switch i{position:absolute;inset:0;background:#d7dfeb;border-radius:20px;transition:background .2s}.switch i:after{content:"";height:14px;width:14px;background:white;border-radius:50%;position:absolute;left:3px;top:3px;transition:transform .2s}.switch input:checked+i{background:var(--blue)}.switch input:checked+i:after{transform:translateX(15px)}.next-run{margin:19px 0;padding:16px;border:1px solid #dfebfb;background:#f4f8ff;border-radius:9px}.next-run small{font-size:9px}.next-run strong{display:block;font-size:12px;line-height:1.7;color:#5a78a2;margin-top:7px}.schedule-tip{padding:16px;background:#fafbfd;border:1px solid var(--line);border-radius:8px;font-size:10px;line-height:1.8;color:#8b98ab}
+.results-summary{display:flex;gap:7px;margin-top:13px}.result-list{padding:0 21px}.result-row{display:flex;align-items:center;gap:15px;padding:21px 0;border-bottom:1px solid var(--line)}.result-row:last-child{border:0}.result-cover{width:46px;height:52px;background:#edf5ff;border:1px solid #e3edfc;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0;color:#7297ce}.result-main{flex:1;min-width:0}.result-title{font-size:12px;color:#455a79;font-weight:650;background:none;border:0;padding:0;text-align:left;line-height:1.55}.result-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:7px;color:#98a4b5;font-size:9px}.result-meta .tag{padding:3px 5px;font-size:8px}.result-actions{display:flex;gap:7px;align-items:center}.mini-result{display:flex;align-items:center;gap:11px;padding:18px 22px;border-bottom:1px solid #f0f3f8}.mini-result:last-child{border:0}.mini-result .result-cover{width:35px;height:40px}.mini-result .result-cover svg{width:18px;height:18px}.mini-result button{border:0;background:transparent;font-size:11px;text-align:left;padding:0;font-weight:600;line-height:1.5;color:#526986}.mini-result small{font-size:9px;display:block;margin-top:5px}.mini-result .status{margin-left:auto;font-size:8px}.mini-result>div:nth-child(2){min-width:0}
+dialog{padding:0;border:1px solid #e6ebf2;border-radius:15px;box-shadow:0 28px 95px #142d5038;width:740px;max-width:calc(100vw - 30px);max-height:92vh;color:var(--ink);overflow:hidden;background:white}dialog::backdrop{background:#142d5070;backdrop-filter:blur(3px)}dialog.preview{width:1030px}.modal-head{padding:23px 25px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:15px;align-items:flex-start}.modal-head h2{font-size:20px;letter-spacing:-.5px}.modal-head p{font-size:10px;line-height:1.7;margin-top:7px}.modal-body{padding:24px 25px;max-height:65vh;overflow:auto}.modal-foot{display:flex;align-items:center;justify-content:flex-end;gap:9px;border-top:1px solid var(--line);padding:16px 25px;background:#fff}.modal-foot>small{margin-right:auto;font-size:9px;line-height:1.5}.source-choices{display:flex;flex-direction:column;gap:8px;margin:14px 0 20px}.source-choice{display:flex;align-items:center;gap:11px;padding:13px;border:1px solid var(--line);border-radius:8px;margin:0;font-weight:500;cursor:pointer}.source-choice:has(input:checked){border-color:#a6c4f5;background:#f8fbff}.source-choice.disabled{opacity:.5;cursor:default}.source-choice>div{flex:1;font-size:11px;line-height:1.7}.source-choice b{font-weight:600;display:block}.source-choice small{font-size:9px}.source-choice .file-icon{width:28px;height:33px;font-size:8px}.generate-summary{display:flex;align-items:center;gap:18px;padding:14px 15px;border-radius:8px;background:#f7faff;color:#91a0b7;font-size:10px}.generate-summary span{display:flex;align-items:center;gap:6px}.generate-summary svg{width:15px;height:15px}.progress-state{padding:55px 30px 45px;text-align:center}.progress-orb{display:inline-flex;width:64px;height:64px;align-items:center;justify-content:center;color:var(--blue);background:#edf5ff;border-radius:18px;margin-bottom:22px}.progress-orb svg{width:30px;height:30px;animation:pulse 1.3s ease-in-out infinite}.progress-state h3{font-size:19px;margin-bottom:12px}.progress-state p{font-size:11px}.progress-track{width:290px;max-width:90%;height:5px;background:#edf1f8;border-radius:5px;overflow:hidden;margin:25px auto 16px}.progress-track i{display:block;background:var(--blue);height:100%;width:5%;transition:width .4s;border-radius:5px}.progress-state small{font-size:9px}@keyframes pulse{50%{transform:scale(.87);opacity:.6}}
+.preview-top{display:flex;align-items:center;gap:7px;font-size:10px;color:#96a2b4;margin-bottom:12px}.preview-layout{display:grid;grid-template-columns:1fr 226px;gap:27px}.prose h1{font-size:25px;margin-bottom:18px;line-height:1.35}.prose h2{font-size:15px;margin:25px 0 10px;letter-spacing:-.2px}.prose p,.prose li{font-size:12px;color:#6f819b;line-height:1.9;white-space:pre-line;overflow-wrap:anywhere}.prose ul,.prose ol{padding-left:19px}.prose .ref-line{font-size:9px;color:#a3afbe;margin-top:8px}.quiz-item{border:1px solid var(--line);padding:14px;border-radius:8px;margin:12px 0}.quiz-item strong{font-size:11px;display:block;font-weight:600;line-height:1.7}.quiz-item ol{list-style:upper-alpha;font-size:11px}.quiz-item li{font-size:11px}.quiz-item details{font-size:10px;color:#668e7e;margin-top:8px}.preview-side{padding:17px;background:#f8faff;border:1px solid #e4ecf9;border-radius:10px;height:max-content;position:sticky;top:0}.preview-side h3{font-size:11px;margin-bottom:15px}.preview-side .detail-label{font-size:8px;color:#a0adbd;margin:17px 0 5px;letter-spacing:.5px;text-transform:uppercase}.preview-side b{font-size:10px;font-weight:600;display:block;line-height:1.7;overflow-wrap:anywhere}.preview-source{padding:9px 0;border-bottom:1px solid #e8eef8;font-size:10px;line-height:1.7;color:#7f93af}.preview-source:last-child{border:0}.preview-source svg{width:13px;height:13px;margin-right:5px}.preview-tabs{display:flex;gap:17px;border-bottom:1px solid var(--line);margin-bottom:21px}.preview-tabs button{padding:0 0 11px;background:none;border:0;font-size:11px;color:#8e9bb0;border-bottom:2px solid transparent}.preview-tabs button.active{color:var(--blue);border-color:var(--blue);font-weight:650}.edit-area{font-size:12px!important;min-height:360px}.help-steps{display:flex;flex-direction:column;gap:22px}.help-step{display:flex;gap:14px}.help-step>span{background:#edf4ff;color:#5787d1;width:29px;height:29px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:12px}.help-step h3{font-size:12px;margin-bottom:5px}.help-step p{font-size:11px}.toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,20px);opacity:0;pointer-events:none;z-index:30;background:#203b62;color:white;box-shadow:0 7px 25px #142d5020;border-radius:9px;padding:14px 19px;max-width:calc(100vw - 35px);font-size:12px;line-height:1.6;transition:opacity .18s,transform .18s}.toast.show{opacity:1;transform:translate(-50%,0)}.toast.error{background:#9f4747}.muted{color:var(--muted)}.spacer{height:20px}.source-text{white-space:pre-wrap;font-size:12px;line-height:1.9;color:#6a7d98;background:#f8faff;padding:19px;border:1px solid #e4ecf9;border-radius:8px;max-height:350px;overflow:auto;overflow-wrap:anywhere}
+@media(min-width:1600px){.app main{padding-top:36px}.hero{min-height:280px}.hero h2{font-size:35px}.metrics{gap:20px}}
+@media(max-width:1120px){.sidebar{width:210px;padding-left:13px;padding-right:13px}.workspace-main{margin-left:210px;width:calc(100% - 210px)}.topbar{padding:0 24px}.demo-strip{margin-left:24px;margin-right:24px}.app main{padding-left:24px;padding-right:24px}.hero{padding:25px;grid-template-columns:1.2fr 1fr}.hero h2{font-size:27px}.hero-art{width:260px}.hero-art .mini-output{margin-left:20px}.hero .btn{padding:9px 11px;font-size:10px}.metric{padding:17px 14px}.metric i{right:11px;top:13px;padding:6px}.metrics{gap:11px}.setup-row{gap:14px;padding:16px}.step{font-size:9px}.step small{font-size:8px}.dashboard-grid{grid-template-columns:1.3fr 1fr;gap:16px}.two-column{grid-template-columns:1.5fr 1fr;gap:16px}.card-body,.form-card .card-body{padding:21px}.toolbar .toolbar-controls{width:65%}.page-head h1{font-size:26px}.login-copy h1{font-size:36px}.login-panel{padding:35px}.preview-layout{grid-template-columns:1fr 200px}}
+@media(max-width:900px){.hero-art{display:none}.hero{display:block}.hero p{max-width:470px}.metrics{grid-template-columns:1fr 1fr}.dashboard-grid,.two-column{grid-template-columns:1fr}.setup-row{align-items:flex-start;flex-direction:column}.setup-row>b{margin-bottom:7px}.schedule-mini .btn{width:100%}.match-grid{grid-template-columns:1fr}.topbar-right>#header-date{display:none}.preview-layout{grid-template-columns:1fr}.preview-side{position:static;display:none}.login-layout{grid-template-columns:1fr 1fr}.login-copy h1{font-size:30px}.login-story{padding:35px 30px}.login-footer span{display:none}.login-copy>p{font-size:12px}.login-benefits{font-size:10px}}
+@media(max-width:700px){.sidebar{position:static;width:100%;padding:15px 17px 0;display:block;border-right:0;border-bottom:1px solid var(--line)}.sidebar>.brand{margin:0 0 16px;font-size:14px}.sidebar .brand b{display:inline;margin-left:3px}.sidebar .brand small{margin-top:4px;letter-spacing:1px}.sidebar .brand-mark{width:31px;height:34px}.workspace,.nav-label,.sidebar-help,.profile{display:none}.sidebar nav{flex-direction:row;overflow:auto;gap:4px;margin:0 -3px;padding-bottom:9px}.sidebar nav button{font-size:9px;gap:5px;padding:10px;white-space:nowrap;width:auto}.sidebar nav svg{width:14px;height:14px}.nav-count{display:none}.app{display:block}.workspace-main{margin:0;width:100%}.topbar{height:50px;padding:0 19px}.breadcrumb{font-size:10px}.topbar-right{gap:10px;font-size:9px}.demo-strip{margin:17px 17px 0;font-size:9px;padding:9px 10px}.demo-strip-tag{display:none}.app main{padding:23px 17px}.page-head{flex-direction:column;gap:15px;margin-bottom:21px}.page-head h1{font-size:26px}.page-head p{font-size:11px}.page-head .head-actions{width:100%}.page-head .head-actions .btn{flex:1}.hero{padding:23px}.hero h2{font-size:27px}.hero p{font-size:10px}.metric strong{font-size:25px}.metric small{font-size:8px}.setup-row{padding:16px}.step-arrow{display:none}.steps{gap:8px}.step{align-items:flex-start;gap:6px}.step>i{width:21px;height:21px;flex-shrink:0}.step small{font-size:7px}.app-footer{margin-left:17px;margin-right:17px;font-size:8px}.app-footer>span:last-child{display:none}.toolbar{padding:16px;flex-direction:column;align-items:stretch;gap:12px}.toolbar .toolbar-controls{width:100%;max-width:none}.search{max-width:none}.result-list{padding:0 16px}.result-row{gap:10px;flex-wrap:wrap}.result-main{min-width:200px}.result-actions{margin-left:56px}.field-grid{grid-template-columns:1fr}.output-checks{grid-template-columns:1fr}.form-footer{padding:16px 20px;align-items:flex-start;flex-direction:column}.form-footer .btn{width:100%}.modal-head{padding:20px}.modal-head h2{font-size:19px}.modal-body{padding:20px;max-height:63vh}.modal-foot{padding:15px 20px;flex-wrap:wrap}.modal-foot>small{width:100%;margin-bottom:5px}.modal-foot .btn{flex:1;font-size:10px;padding:9px}.generate-summary{gap:10px;flex-wrap:wrap;font-size:9px}.login-layout{display:flex;flex-direction:column}.login-story{padding:22px 25px;background:#f3f7ff}.login-copy{padding:26px 0 16px}.login-copy h1{font-size:28px;margin:13px 0}.login-copy h1 br:last-child{display:none}.login-copy>p{font-size:11px}.login-diagram,.login-benefits,.login-footer{display:none}.login-story .brand b{display:inline;font-size:14px;margin-left:3px}.login-story .brand small{font-size:8px}.login-story .brand-mark{width:33px;height:36px}.eyebrow{font-size:7px}.login-panel{padding:30px 25px}.login-form-wrap{width:100%;max-width:400px}.login-form-wrap h2{font-size:23px;margin-top:16px}.login-form-wrap>p{margin-bottom:22px}.login-form-wrap .login-bottom{margin-top:30px}}
+@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
+@media(max-width:700px){.sidebar nav{flex-wrap:wrap;overflow:visible;align-items:flex-start}.sidebar nav>button{flex:1;justify-content:center}.sidebar nav .admin-menu{width:100%;margin:3px 0 0;padding:4px 0 0;border-top:1px solid var(--line)}.sidebar nav .admin-menu summary{padding:7px 10px;justify-content:flex-start;gap:8px;font-size:9px}.sidebar nav .admin-menu button{display:inline-flex;width:auto;padding:8px 10px;font-size:9px}.sidebar nav .admin-menu summary svg{width:12px;height:12px}}
+/* Content library and format-specific previews. */
+@media(max-width:600px){.overview-banner{display:grid!important;grid-template-columns:42px minmax(0,1fr);align-items:start!important}.overview-banner>div{min-width:0}.overview-banner>.status{grid-column:2;margin:0!important;justify-self:start}}
+.overview-banner{display:flex;align-items:center;gap:20px;background:#edf4ff;border:1px solid #dfeaff;border-radius:14px;padding:26px 28px;margin-bottom:24px}.overview-symbol{display:grid;place-items:center;width:55px;height:55px;border-radius:15px;color:var(--blue);background:white;flex-shrink:0}.overview-symbol svg{width:27px;height:27px}.overview-banner h2{font-size:23px;margin:9px 0 6px}.overview-banner p{font-size:11px}.overview-banner>.status{margin-left:auto}.metric strong.date-metric{font-size:21px;letter-spacing:-.7px;margin-top:16px}.summary-metrics{margin-bottom:26px}.format-summary{display:flex;justify-content:center;flex-wrap:wrap;gap:28px;padding:22px 0 4px;font-size:10px;color:var(--muted)}.format-summary>span{display:flex;align-items:center;gap:8px}.format-summary b{color:var(--ink);margin-left:4px}.type-badge{display:inline-flex;align-items:center;gap:5px;padding:5px 7px;border-radius:5px;font-size:9px;font-weight:650;white-space:nowrap;background:#edf4ff;color:#4872bd}.type-badge svg{width:12px;height:12px}.type-badge.pdf{background:#fff0ee;color:#c77b72}.type-badge.scorm{background:#f1edfc;color:#8a6dc0}.type-badge.audio{background:#eaf6f3;color:#518e80}.content-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;padding:22px}.content-card{border:1px solid var(--line);border-radius:11px;overflow:hidden;min-width:0;background:white}.content-cover{height:122px;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;background:#ecf3ff;color:#5d85c5}.content-cover>svg{width:30px;height:30px;stroke-width:1.3}.content-cover>span{font-size:11px;font-weight:650}.content-cover>small{position:absolute;top:11px;left:12px;font-size:7px;letter-spacing:1.2px;color:inherit;opacity:.65}.content-cover.pdf{background:#fbf1ef;color:#bd867d}.content-cover.audio{background:#edf7f4;color:#679b8d}.content-cover.scorm{background:#f2effa;color:#9a82bb}.content-card-body{padding:15px}.content-card-top{display:flex;align-items:center;justify-content:space-between;gap:5px;margin-bottom:12px}.content-card-top .status{font-size:8px;padding:5px 6px}.content-title{display:block;text-align:left;border:0;padding:0;background:none;font-weight:650;font-size:13px;line-height:1.55;letter-spacing:-.2px;min-height:61px;color:var(--ink);overflow-wrap:anywhere}.content-title:hover{color:var(--blue)}.content-card-body>p{font-size:9px;margin:9px 0 15px}.content-card-foot{border-top:1px solid var(--line);padding-top:13px;display:flex;align-items:center;justify-content:space-between;gap:8px}.content-card-foot>span{font-size:8px;color:#a0aabd}.content-card-foot .text-btn{font-size:10px}.content-card-foot svg{width:12px;height:12px}.supported-formats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:20px}.supported-formats>div{display:flex;align-items:center;gap:12px;border:1px solid var(--line);border-radius:10px;padding:17px;background:white}.supported-formats b{font-size:12px}.supported-formats small{display:block;font-size:9px;margin-top:6px}.format-icon{display:grid;place-items:center;width:38px;height:40px;border-radius:8px;background:#edf4ff;color:#5d85c5;flex-shrink:0}.format-icon.scorm{color:#8a6dc0;background:#f1edfc}.format-icon.audio{color:#518e80;background:#eaf6f3}.format-icon.pdf{color:#c77b72;background:#fff0ee}.file-icon.scorm{font-size:7px;background:#f1edfc;color:#8a6dc0}.file-icon.mp4,.file-icon.webm,.file-icon.mov,.file-icon.m4v{color:#5d85c5;background:#edf4ff}.file-icon.mp3,.file-icon.wav,.file-icon.m4a,.file-icon.ogg,.file-icon.aac,.file-icon.flac{background:#eaf6f3;color:#518e80}.preview-notice{display:flex;gap:9px;padding:12px 14px;background:#eef5ff;border-radius:7px;color:#6d86a8;font-size:11px;line-height:1.7;margin-bottom:18px}.preview-notice.concept{background:#fff8e9;color:#a88c55}.preview-notice svg{width:16px;height:16px;margin-top:2px}.storyboard-screen{padding:25px;background:#eef4ff;border:1px solid #dae7fa;border-radius:12px;min-height:290px;display:flex;flex-direction:column;align-items:center;text-align:center;justify-content:center;color:#3f659c}.storyboard-screen>span{font-size:8px;letter-spacing:1.6px}.storyboard-screen>div{margin:21px 0 13px}.storyboard-screen svg{width:38px;height:38px;stroke-width:1.3}.storyboard-screen h2{font-size:22px}.storyboard-screen p{font-size:11px;max-width:460px;margin:13px 0;color:#7c92b1}.storyboard-screen>small{font-size:8px;margin-top:16px}.scene-list{display:flex;gap:8px;overflow:auto;padding:14px 0 6px}.scene-list button{padding:11px;text-align:left;flex:0 0 128px;font-size:9px;line-height:1.6;background:white;border:1px solid var(--line);border-radius:7px;color:#8b98ab}.scene-list button b{display:block;margin-bottom:6px;font-size:8px}.scene-list button.active{border-color:#a7c4fa;background:#f3f7ff;color:var(--blue)}.script-details>summary{font-size:12px;color:var(--blue);cursor:pointer;margin-bottom:20px}.audio-preview{text-align:center;padding:26px;background:#f1f8f6;border-radius:12px;border:1px solid #e0efea}.audio-orb{display:grid;place-items:center;background:white;color:#619d89;border-radius:50%;height:58px;width:58px;margin:0 auto 18px}.audio-orb svg{width:27px;height:27px}.waveform{display:flex;justify-content:center;gap:4px;height:60px;align-items:center;margin:0 auto 20px;max-width:100%;overflow:hidden}.waveform i{width:3px;border-radius:4px;flex-shrink:0;background:#9bc7b8}.audio-preview h2{font-size:20px}.audio-preview p{font-size:11px;margin:12px auto 20px}.audio-preview .head-actions{justify-content:center}.audio-preview>small{display:block;font-size:9px;margin-top:15px}.scorm-preview-head{display:flex;gap:11px;align-items:center;padding:15px;background:#f3effb;color:#9377b8;border-radius:8px;margin-bottom:23px;font-size:12px}.scorm-preview-head svg{width:26px;height:26px}.scorm-preview-head small{display:block;font-size:9px;margin-top:5px}.scorm-preview>h2{font-size:23px}.scorm-preview>p{font-size:11px;margin:10px 0 20px}.chapter{border:1px solid var(--line);border-radius:8px;margin:10px 0;overflow:hidden}.chapter summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:11px;padding:15px;font-size:12px;font-weight:600;background:#fafbfe}.chapter summary>span{font-size:9px;background:#f0edf8;color:#9a83ba;padding:7px;border-radius:5px}.chapter>p{font-size:12px;padding:17px;white-space:pre-wrap}.source-player{display:block;width:100%;max-height:350px;margin:0 auto 20px;border-radius:8px}.upload-issues{font-size:12px;line-height:1.9;color:#b47a6a}
+@media(max-width:1250px){.content-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.content-title{min-height:42px}.supported-formats{gap:10px}.supported-formats>div{padding:12px;gap:8px}.supported-formats small{font-size:8px}.overview-banner h2{font-size:20px}}
+@media(max-width:900px){.overview-banner{align-items:flex-start;flex-wrap:wrap;padding:22px}.overview-banner>.status{margin:0 0 0 75px}.supported-formats{grid-template-columns:repeat(2,1fr)}.toolbar-controls{flex-wrap:wrap!important;gap:8px!important}.toolbar-controls>.search{flex-basis:100%}.toolbar-controls>select{flex:1}.format-summary{gap:14px}}
+@media(max-width:600px){.overview-banner{gap:14px;padding:19px}.overview-symbol{width:42px;height:44px}.overview-banner>div{flex:1}.overview-banner h2{font-size:19px;line-height:1.4}.overview-banner .eyebrow{font-size:6px;letter-spacing:1px}.overview-banner p{font-size:9px}.overview-banner>.status{margin:0 0 0 56px;font-size:9px}.content-grid{grid-template-columns:1fr;padding:16px;gap:17px}.content-cover{height:130px}.content-title{min-height:0;font-size:14px}.content-card-top .status{font-size:9px}.content-card-body{padding:17px}.format-summary{justify-content:flex-start}.format-summary>span{width:calc(50% - 14px);font-size:9px}.supported-formats>div{padding:12px}.supported-formats small{font-size:8px}.metric strong.date-metric{font-size:17px}.audio-preview{padding:22px 16px}.audio-preview .head-actions{flex-wrap:wrap}.audio-preview h2{font-size:19px}.storyboard-screen{min-height:290px;padding:24px 18px}.storyboard-screen h2{font-size:20px}.waveform{gap:3px}.upload-limit{line-height:1.9!important}.card-head{flex-wrap:wrap}.content-grid .text-btn{font-size:11px}}
+/* Brain and the L&D assistant workflow. */
+.journey-strip{display:flex;gap:15px;justify-content:space-between;flex-wrap:wrap;margin:0 0 24px;padding:0 3px;font-size:11px;color:#7a8ba5}.journey-strip>span{display:flex;align-items:center;gap:9px}.journey-strip b{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#eaf2ff;color:var(--blue);font-size:9px}.brain-banner{display:flex;align-items:center;gap:23px;padding:29px;background:#edf4ff;border:1px solid #dfeaff;border-radius:14px;margin-bottom:20px}.brain-symbol{height:76px;width:76px;border-radius:20px;background:white;color:var(--blue);display:grid;place-items:center;flex-shrink:0}.brain-symbol svg{width:42px;height:42px;stroke-width:1.25}.brain-banner h2{font-size:25px;margin:11px 0 9px}.brain-banner p{font-size:11px}.brain-formats{display:flex;gap:7px;margin-top:15px}.brain-context{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:22px 0}.brain-context>div{display:flex;align-items:center;gap:12px;padding:5px 3px;color:#7192be}.brain-context b{display:block;font-size:12px;color:#4a6285}.brain-context small{display:block;font-size:10px;margin-top:5px;line-height:1.7}.brain-selection{padding:13px 23px;background:#fbfcfe;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:15px;font-size:10px;color:var(--muted)}.brain-selection label{font-size:11px}.brain-topics{margin:26px 0 3px}.brain-topics h3{font-size:14px}.brain-topics p{font-size:10px;margin:7px 0 14px}.brain-topics>div{display:flex;flex-wrap:wrap;gap:7px}.upload-success{display:flex;align-items:center;gap:17px;padding:23px;margin-bottom:20px}.upload-success>span{padding:10px;background:#eaf6f2;color:#559a84;border-radius:50%}.upload-success h3{font-size:14px}.upload-success p{font-size:11px;margin-top:7px}.upload-success .btn{margin-left:auto}.ai-workspace{display:grid;grid-template-columns:1.05fr 1fr;gap:23px;align-items:start}.assistant-title{display:flex;gap:12px;align-items:center}.assistant-title>span{display:grid;place-items:center;width:38px;height:40px;border-radius:9px;background:#edf4ff;color:var(--blue)}.ai-messages{padding:24px 22px;max-height:450px;overflow:auto;min-height:215px}.ai-message{display:flex;align-items:flex-start;gap:10px;margin-bottom:18px}.ai-message:last-child{margin-bottom:0}.ai-message>span{display:grid;place-items:center;flex-shrink:0;width:25px;height:27px;border-radius:7px;background:#eaf2ff;color:#6f91c5}.ai-message svg{width:14px;height:14px}.ai-message p{background:#f5f8fd;border-radius:0 10px 10px;padding:14px;font-size:11px;line-height:1.85;color:#788da9;white-space:pre-wrap}.ai-message.user{flex-direction:row-reverse}.ai-message.user p{border-radius:10px 0 10px 10px;background:#eef4ff;color:#587cb2}.prompt-chips{display:flex;gap:7px;flex-wrap:wrap;padding:0 22px 20px}.prompt-chips button{font-size:9px;padding:8px 10px;border:1px solid #dfe9f8;border-radius:20px;background:white;color:#7390b7}.prompt-chips button:hover{background:#f0f6ff;color:var(--blue)}#ai-request-form{padding:20px 22px;border-top:1px solid var(--line);background:#fcfdff}#ai-request-form textarea{font-size:12px;min-height:110px}.ai-compose-footer{display:flex;gap:15px;align-items:center;justify-content:space-between;margin-top:14px}.ai-compose-footer small{font-size:9px;line-height:1.7}.ai-compose-footer .btn{font-size:11px;flex-shrink:0}.ai-disclosure{display:flex;align-items:flex-start;gap:8px;padding:17px 22px;font-size:9px;line-height:1.8;color:#9ba8bb;border-top:1px solid var(--line)}.ai-disclosure svg{width:13px;height:13px;margin-top:3px;flex-shrink:0}.ai-plan .card-body{padding:23px}.ai-plan label{font-size:11px}.ai-plan .field{margin-bottom:20px}.ai-plan .field-grid{gap:0 14px}.plan-source{display:flex;align-items:center;gap:10px;padding:14px;background:#f1f6ff;border-radius:8px;margin-bottom:21px}.plan-source>span{display:grid;place-items:center;width:33px;height:34px;border-radius:8px;background:white;color:#7c9bcc}.plan-source b{font-size:11px}.plan-source small{display:block;font-size:8px;line-height:1.6;margin-top:4px}.plan-source .text-btn{margin-left:auto;font-size:10px}.plan-actions{display:flex;gap:9px}.plan-actions .btn{flex:1;padding:10px;font-size:11px}.ai-plan .switch-row{padding:16px 0 20px;margin-top:0}.result-tabs{display:flex;gap:7px;border-bottom:1px solid #e5ebf4;margin-bottom:20px}.result-tabs button{background:none;border:0;border-bottom:2px solid transparent;font-size:12px;padding:11px 17px 14px;color:#92a0b6}.result-tabs button.active{color:var(--blue);border-color:var(--blue)}.result-tabs b{font-size:9px;background:#edf3ff;color:#85a0c7;padding:3px 5px;border-radius:4px;margin-left:5px}.research-list{padding:0 22px}.research-row{display:flex;align-items:center;gap:16px;padding:22px 0;border-bottom:1px solid var(--line)}.research-row:last-child{border-bottom:0}.research-row>span{display:grid;place-items:center;height:43px;width:43px;background:#f0f5fd;color:#819cc4;border-radius:9px;flex-shrink:0}.research-row h3{font-size:13px;margin-top:10px;line-height:1.6;overflow-wrap:anywhere}.research-row p{font-size:9px;margin-top:7px}.research-row>.btn{margin-left:auto;flex-shrink:0}.content-cover.text{background:#edf3fa;color:#849bb7}.type-badge.text{background:#edf3fa;color:#7993b7}.format-icon.text{background:#edf3fa;color:#849bb7}
+@media(max-width:1100px){.ai-workspace{grid-template-columns:1fr}.ai-messages{min-height:150px}.ai-plan .field-grid{grid-template-columns:1fr 1fr}.brain-banner h2{font-size:22px}}
+@media(max-width:700px){.sidebar nav{gap:4px}.sidebar nav>button{flex:1 0 auto;padding:9px;font-size:9px}.ai-workspace{gap:20px}.brain-context{grid-template-columns:1fr;gap:12px}.brain-selection{align-items:flex-start;flex-direction:column;gap:8px;padding:13px 17px}.brain-banner{padding:22px;gap:17px;align-items:flex-start}.brain-symbol{width:48px;height:50px;border-radius:12px}.brain-symbol svg{width:29px;height:29px}.brain-banner h2{font-size:21px;line-height:1.4}.brain-banner p{font-size:10px}.brain-banner .eyebrow{font-size:6px;letter-spacing:1.1px}.brain-formats{flex-wrap:wrap;gap:5px}.brain-banner>div{min-width:0}.journey-strip{display:grid;grid-template-columns:1fr 1fr;gap:14px;font-size:10px}.upload-success{flex-wrap:wrap;gap:13px;padding:20px}.upload-success>div{flex:1;min-width:180px}.upload-success .btn{width:100%;margin-left:0}.ai-plan .field-grid{grid-template-columns:1fr}.ai-messages{padding:20px 17px;max-height:340px}.ai-message p{font-size:11px;padding:12px}.prompt-chips{padding:0 17px 18px}#ai-request-form{padding:20px 17px}.ai-compose-footer{align-items:flex-start;flex-direction:column;gap:12px}.ai-compose-footer .btn{width:100%}.ai-disclosure{padding:17px}.plan-actions{flex-direction:column}.plan-actions .btn{width:100%}.ai-plan .card-body{padding:20px}.research-row{align-items:flex-start;flex-wrap:wrap;gap:12px}.research-row>div{flex:1;min-width:170px}.research-row>.btn{margin-left:55px}.research-list{padding:0 17px}.research-row h3{font-size:12px}.plan-source{gap:8px}.plan-source small{font-size:8px}.assistant-title{gap:8px}.assistant-title h3{font-size:13px}}
+/* Three simple screens: upload, the combined Brain and AI workspace, results. */
+.unified-workspace{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:22px;align-items:start}.compact-brain .card-head,.simple-ai .card-head{padding:19px 20px}.compact-brain .card-head>svg{color:#8ca6cd}.compact-brain .badge{margin-left:5px}.compact-brain-search{padding:17px 19px}.compact-brain-search .search{width:100%;max-width:none}.compact-brain .brain-selection{padding:12px 19px;font-size:9px}.compact-brain .brain-selection label{font-size:10px}.compact-source-list{max-height:450px;overflow:auto;padding:0 17px}.compact-source-row{display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--line);padding:15px 0;min-height:74px}.compact-source-row:last-child{border-bottom:0}.compact-source-row>input{margin:0;width:14px;height:14px}.compact-source-row .file-icon{width:30px;height:35px;font-size:7px;flex-shrink:0}.compact-source-name{min-width:0;flex:1}.compact-source-name b{display:block;font-size:11px;line-height:1.5;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.compact-source-name small{display:block;font-size:8px;margin-top:5px}.compact-source-row .icon-btn{padding:4px}.compact-source-row .icon-btn svg{width:14px;height:14px}.simple-ai #ai-request-form{padding:19px 20px;background:white;border:0}.simple-ai #ai-request-form textarea{min-height:85px;font-size:12px}.simple-ai .ai-compose-footer{margin-top:12px;gap:10px}.simple-ai .prompt-chips{padding:0;gap:6px}.simple-ai .prompt-chips button{padding:6px 9px;font-size:8px}.simple-ai .ai-compose-footer>.btn{min-height:32px;padding:7px 14px;font-size:10px}.compact-ai-reply{display:flex;gap:9px;padding:12px 15px;margin:0 20px 17px;background:#f3f7ff;border-radius:8px;color:#849cc0}.compact-ai-reply svg{width:14px;height:14px;margin-top:3px}.compact-ai-reply p{font-size:10px;line-height:1.8;color:#8195b3}.simple-plan{padding:17px 20px 18px;border-top:1px solid var(--line)}.simple-plan-row{display:grid;grid-template-columns:minmax(0,1fr) 100px;gap:13px}.simple-plan .field{margin-bottom:14px}.simple-plan label{font-size:10px}.simple-plan input:not([type=checkbox]),.simple-plan select,.simple-plan textarea{font-size:11px;min-height:38px;padding:10px 11px}.simple-plan #ai-count-help{font-size:8px;line-height:1.7;display:block;margin-top:-4px}.simple-options{margin:14px 0 0}.simple-options>summary{font-size:10px;color:#8a9cb7;cursor:pointer;padding:5px 0 11px}.simple-options[open]>summary{margin-bottom:7px}.simple-options small{font-size:8px}.simple-schedule-toggle{display:flex;justify-content:space-between;align-items:center;padding:13px 0 17px;border-top:1px solid #eff2f7;margin-top:6px}.simple-schedule-toggle label{font-size:11px;color:#647f9f}.simple-schedule-toggle>span{font-size:8px;color:#a3afbf}.simple-plan #schedule-fields{padding:0 0 7px}.simple-plan .field-grid{gap:13px}.simple-plan .plan-actions{gap:9px}.simple-plan .plan-actions .btn{font-size:11px;min-height:39px}.simple-saved-status{font-size:8px;color:#9aaac0;line-height:1.8;margin-top:12px}.simple-ai>.table-note,.compact-brain>.table-note{font-size:8px;line-height:1.8;padding:13px 19px}.sidebar .profile{margin-top:auto}
+@media(max-width:1000px){.unified-workspace{grid-template-columns:1fr}.compact-source-list{max-height:280px}.compact-source-row{min-height:65px;padding:12px 0}.simple-ai .ai-compose-footer{flex-direction:row;align-items:center}.simple-plan-row{grid-template-columns:minmax(0,1fr) 110px}.simple-plan .field-grid{grid-template-columns:1fr 1fr}}
+@media(max-width:700px){.sidebar nav>button{flex:1 0 0;justify-content:center}.unified-workspace{gap:18px}.compact-brain .card-head,.simple-ai .card-head{padding:17px}.compact-brain .brain-selection{flex-direction:row;gap:9px;padding:11px 17px}.compact-source-row{gap:8px}.compact-source-row .file-icon{width:27px;height:32px;font-size:6px}.compact-source-name b{font-size:10px}.compact-source-name small{font-size:7px}.simple-ai #ai-request-form{padding:17px}.simple-plan{padding:17px}.simple-ai .ai-compose-footer{align-items:flex-start;gap:8px}.simple-ai .ai-compose-footer>.btn{width:auto;flex-shrink:0}.simple-ai .prompt-chips{flex-direction:column;align-items:flex-start}.simple-plan-row{grid-template-columns:minmax(0,1fr) 90px}.simple-plan .plan-actions{flex-direction:row}.simple-plan .plan-actions .btn{font-size:10px;padding:9px 8px}.compact-ai-reply{margin-left:17px;margin-right:17px}.compact-ai-reply p{font-size:9px}.simple-plan .field-grid{grid-template-columns:1fr 1fr}}
+</style>
+</head>
+<body>
+<section id="login-view" class="login-layout">
+  <div class="login-story">
+    <a class="brand" href="#" aria-label="Learning Lab Express"><span class="brand-mark" data-icon="book"></span><span>Learning Lab <b>Express</b><small>by Bawana</small></span></a>
+    <div class="login-copy"><span class="eyebrow">BELAJAR BARU, TANPA MULAI DARI NOL</span><h1>Pengetahuan tim.<br>Ide baru.<br>Pembelajaran tanpa henti.</h1><p>Satukan materi dalam Brain, lalu minta AI mengembangkannya menjadi konten pelatihan dan riset topik.</p>
+      <div class="login-diagram" aria-hidden="true"><div class="mini-source"><span class="file-icon pdf">PDF</span><div>Materi pelatihan<small>Knowledge base · Brain</small></div><span class="mini-check">✓</span></div><div class="connector"><i></i><span data-icon="spark"></span><i></i></div><div class="mini-output"><span class="output-icon" data-icon="book"></span><div>Konten pembelajaran baru<small>Terstruktur · Relevan · Siap ditinjau</small></div><span class="status ready">Baru</span></div></div>
+      <div class="login-benefits"><span><i data-icon="upload"></i> Upload materi ke Brain</span><span><i data-icon="clock"></i> Jadwalkan riset topik</span><span><i data-icon="download"></i> Buka dan download hasilnya</span></div>
+    </div>
+    <div class="login-footer">LEARNING LAB EXPRESS <span>Pengetahuan Anda. Kemungkinan baru.</span></div>
+  </div>
+  <div class="login-panel"><div class="login-form-wrap"><span class="badge neutral">Development</span><h2>Selamat datang kembali</h2><p>Masuk dengan akun learning-lab untuk mengelola materi dan membuat konten.</p>
+    <form id="login-form"><label for="login-email">Email</label><input id="login-email" type="email" autocomplete="username" required>
+    <label for="login-password">Password</label><div class="password-field"><input id="login-password" type="password" autocomplete="current-password" required><button type="button" data-action="toggle-password" aria-label="Tampilkan password"><span data-icon="eye"></span></button></div>
+    <button class="btn primary wide" type="submit" style="margin-top:18px">Masuk ke Learning Lab <span data-icon="arrow-right"></span></button>
+    <button class="btn wide" type="button" id="clerk-login" data-action="clerk-login" hidden style="margin-top:10px">Masuk dengan Clerk (akun organisasi)</button>
+    <p id="login-error" class="error" role="alert"></p></form>
+    <div class="demo-login"><span data-icon="info"></span><p>Email/password untuk Brain dan konten teks. Riset dan jadwal agen memerlukan <b>Clerk</b> dengan akun organisasi.</p></div>
+    <p class="login-bottom">Learning Lab Express <span>by Bawana</span></p>
+  </div></div>
+</section>
+<div id="app" class="app" hidden>
+  <aside class="sidebar">
+    <a class="brand" href="#" data-nav="sources"><span class="brand-mark" data-icon="book"></span><span>Learning Lab <b>Express</b><small>by Bawana</small></span></a>
+    <div class="workspace"><span class="workspace-icon">L</span><div>Ruang belajar<small id="workspace-name">Akun pribadi</small></div></div>
+    <div class="nav-label">RUANG KERJA</div>
+    <nav aria-label="Navigasi utama">
+      <button data-nav="sources"><span data-icon="upload"></span>Upload materi</button>
+      <button data-nav="brain"><span data-icon="brain"></span>Brain & AI<span class="nav-count" id="source-count">0</span></button>
+      <button data-nav="results"><span data-icon="book"></span>Hasil<span class="nav-count" id="module-count">0</span></button>
+    </nav>
+    <div class="profile"><span class="avatar" id="avatar">U</span><div><b id="profile-name">-</b><small id="profile-sub">Development</small></div><button data-action="logout" class="icon-btn" aria-label="Keluar"><span data-icon="logout"></span></button></div>
+  </aside>
+  <div class="workspace-main">
+    <header class="topbar"><div class="breadcrumb">Ruang kerja <span>/</span> <b id="breadcrumb">Upload materi</b></div><div class="topbar-right"><span class="demo-indicator"><i></i> Engine learning-lab</span><span id="header-date"></span></div></header>
+    <div class="demo-strip"><span data-icon="info"></span><span>Fase development: terhubung ke engine learning-lab. Hasil AI perlu ditinjau sebelum dipakai.</span><span class="demo-strip-tag">DEV</span></div>
+    <main id="view-content" tabindex="-1"></main>
+    <footer class="app-footer">Learning Lab Express <span>by Bawana</span><span>Ruang kerja untuk pengetahuan yang terus berkembang.</span></footer>
+  </div>
+</div>
+<dialog id="modal" aria-labelledby="modal-title"><div id="modal-content"></div></dialog>
+<div id="toast" class="toast" role="status" aria-live="polite"></div>
+<input id="file-input" type="file" multiple hidden>
+<script src="/config.js"></script>
+<script src="engine.js"></script>
+<script>(function(){
+  'use strict';
+  const $=s=>document.querySelector(s),E=s=>String(s??'').replace(/[&<>"']/g,c=>({'&':'&amp;','<':'&lt;','>':'&gt;','"':'&quot;',"'":'&#39;'}[c])),KEY='lle-results';
+  const icons={
+    book:'<path d="M3 5c3-1 6 0 9 2 3-2 6-3 9-2v14c-3-1-6 0-9 2-3-2-6-3-9-2z"/><path d="M12 7v14M6 9l3 1M15 10l3-1"/>',
+    home:'<path d="m3 10 9-7 9 7v10H3z"/><path d="M9 20v-7h6v7"/>',
+    folder:'<path d="M3 6h6l2 2h10v12H3z"/><path d="M3 6V4h6l2 2h9v2"/>',
+    spark:'<path d="m12 3 2.5 6.5L21 12l-6.5 2.5L12 21l-2.5-6.5L3 12l6.5-2.5z"/><path d="m20 2 .5 1.5L22 4l-1.5.5L20 6l-.5-1.5L18 4l1.5-.5z"/>',
+    calendar:'<rect x="3" y="5" width="18" height="16" rx="2"/><path d="M7 3v4M17 3v4M3 11h18M7 15h3M14 15h3"/>',
+    clock:'<circle cx="12" cy="12" r="9"/><path d="M12 7v6l4 2"/>',
+    layers:'<path d="m12 3 10 5-10 5L2 8zM2 12l10 5 10-5M2 16l10 5 10-5"/>',
+    download:'<path d="M12 3v12m-5-5 5 5 5-5M4 16v5h16v-5"/>',
+    upload:'<path d="M12 16V4m-5 5 5-5 5 5M4 16v5h16v-5"/>',
+    file:'<path d="M5 3h9l5 5v13H5zM14 3v6h5M8 13h8M8 17h6"/>',
+    'arrow-right':'<path d="M4 12h16m-6-6 6 6-6 6"/>',
+    chevron:'<path d="m7 10 5 5 5-5"/>',
+    search:'<circle cx="10" cy="10" r="6"/><path d="m15 15 5 5"/>',
+    eye:'<path d="M2 12s4-7 10-7 10 7 10 7-4 7-10 7S2 12 2 12z"/><circle cx="12" cy="12" r="3"/>',
+    trash:'<path d="M3 6h18M9 3h6l1 3M6 6l1 15h10l1-15M10 10v7M14 10v7"/>',
+    close:'<path d="m6 6 12 12M18 6 6 18"/>',
+    info:'<circle cx="12" cy="12" r="9"/><path d="M12 11v6M12 7v.2"/>',
+    help:'<circle cx="12" cy="12" r="9"/><path d="M9 9a3 3 0 0 1 6 0c0 2-3 2-3 4M12 17v.2"/>',
+    check:'<path d="m5 12 4 4L19 6"/>',
+    edit:'<path d="m15 4 5 5M4 20l5-1L21 7l-4-4L5 15z"/>',
+    logout:'<path d="M10 4H4v16h6M10 12h11m-4-4 4 4-4 4"/>',
+    plus:'<path d="M12 4v16M4 12h16"/>'
+  };
+  icons.video='<rect x="3" y="5" width="18" height="14" rx="3"/><path d="m10 9 5 3-5 3z"/>';
+  icons.audio='<path d="M4 13v-2a8 8 0 0 1 16 0v2"/><rect x="3" y="11" width="4" height="8" rx="2"/><rect x="17" y="11" width="4" height="8" rx="2"/>';
+  icons.scorm='<path d="m12 3 9 5-9 5-9-5zM3 8v9l9 5 9-5V8M12 13v9"/>';
+  icons.brain='<path d="M12 5c-3-4-8-1-7 3-4 2-3 7 0 8-1 4 5 6 7 2M12 5c3-4 8-1 7 3 4 2 3 7 0 8 1 4-5 6-7 2M12 5v15M7 9l3 2M17 9l-3 2M6 15l3-1M18 15l-3-1"/>';
+  function I(name){return '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">'+(icons[name]||icons.file)+'</svg>';}
+  function fillIcons(root=document){root.querySelectorAll('[data-icon]').forEach(el=>el.innerHTML=I(el.dataset.icon));}
+  const types={text:{label:'Text',icon:'file'}};
+  const names={sources:'Upload materi',brain:'Brain & AI',results:'Hasil'};
+  let view='sources',tab='content',res={content:[],research:[]},docs=[],selected=new Set(),exts=new Set(),lastUpload=[],user=null,org=null,busy=false,pollT,toastTimer,query='';
+  let draft={mode:'generate',topic:'',prompt:'',urls:'',enabled:false,frequency:'daily',time:'09:00',weekday:1};
+  try{res=Object.assign(res,JSON.parse(localStorage.getItem(KEY)||'{}'));}catch{}
+  const save=()=>{try{localStorage.setItem(KEY,JSON.stringify({content:res.content.slice(0,50),research:res.research.slice(0,50)}));}catch{}};
+  const dt=v=>{try{return new Intl.DateTimeFormat('id-ID',{dateStyle:'medium',timeZone:'Asia/Jakarta'}).format(new Date(v));}catch{return '-';}};
+  function toast(m,error=false){const t=$('#toast');t.textContent=m;t.className='toast show'+(error?' error':'');clearTimeout(toastTimer);toastTimer=setTimeout(()=>t.classList.remove('show'),5000);}
+  const button=(text,action,style='primary',icon='plus',extra='')=>'<button type="button" class="btn '+style+'" data-action="'+action+'" '+extra+'>'+I(icon)+text+'</button>';
+  const head=(title,description,actions='')=>'<div class="page-head"><div><h1>'+title+'</h1><p>'+description+'</p></div><div class="head-actions">'+actions+'</div></div>';
+  const empty=(title,text)=>'<div class="empty"><span class="empty-icon">'+I('book')+'</span><h3>'+title+'</h3><p>'+text+'</p></div>';
+  const fileIcon=d=>'<span class="file-icon '+E(d.format.toLowerCase())+'">'+E(d.format.slice(0,4))+'</span>';
+  const statusOf=d=>d.status==='failed'?['draft','Gagal diproses']:d.status!=='completed'?['draft','Memproses '+(d.progress||0)+'%']:d.knowledge==='ready'?['ready','Knowledge base siap']:d.knowledge==='needs_credits'?['draft','Butuh kredit']:d.knowledge==='building'?['draft','Membangun KB']:['draft','Teks siap'];
+  const pool=()=>docs.filter(d=>!selected.size||selected.has(d.docId));
+
+  // ── modal ──
+  const modalHead=(title,sub='')=>'<div class="modal-head"><div><h2 id="modal-title">'+title+'</h2>'+(sub?'<p>'+sub+'</p>':'')+'</div><button class="icon-btn" data-action="close" aria-label="Tutup dialog">'+I('close')+'</button></div>';
+  function openModal(content,preview=false){const m=$('#modal');m.classList.toggle('preview',preview);$('#modal-content').innerHTML=content;fillIcons(m);if(!m.open)m.showModal();}
+  function progress(title,sub){openModal(modalHead(title,sub)+'<div class="progress-state"><span class="progress-orb">'+I('brain')+'</span><h3 id="progress-label">Menyiapkan…</h3><div class="progress-track"><i id="progress-bar"></i></div><small>Diproses oleh engine learning-lab</small></div>');}
+  const step=(text,pct)=>{if($('#progress-label'))$('#progress-label').textContent=text;if($('#progress-bar')&&pct!=null)$('#progress-bar').style.width=pct+'%';};
+
+  // ── views ──
+  function sourcesView(){
+    const last=lastUpload.map(id=>docs.find(d=>d.docId===id)).filter(Boolean);
+    return head('Upload materi','Tambahkan pengetahuan ke Brain. Anda bisa mengupload beberapa berkas sekaligus.')+
+    '<div id="drop-zone" class="upload-box"><span class="upload-symbol">'+I('upload')+'</span><h3>Mulai dari materi yang sudah Anda miliki</h3><p>Upload satu atau beberapa materi. Semuanya diproses engine dan tersimpan di Brain.</p>'+button('Pilih berkas','upload','primary','plus')+'<p class="upload-limit">'+(exts.size?[...exts].map(x=>x.slice(1).toUpperCase()).join(', '):'Memuat format…')+'<br>Maks. 200 MB per berkas</p></div>'+
+    (last.length?'<section class="card upload-success"><span>'+I('check')+'</span><div><h3>'+last.length+' materi ditambahkan ke Brain</h3><p>Engine sedang membaca isi materi. Knowledge base dibangun saat Anda meminta AI membuat konten.</p></div><button class="btn primary" data-nav="brain">Lihat Brain '+I('arrow-right')+'</button></section>':'')+
+    '<div class="notice-row">'+I('info')+'<span>Video, audio, dan SCORM belum tersedia di engine; format di atas adalah yang didukung saat ini.</span></div>';
+  }
+  function rows(){
+    const list=docs.filter(d=>(d.title+' '+d.format).toLowerCase().includes(query.toLowerCase()));
+    if(!list.length)return empty(docs.length?'Belum ada materi yang cocok':'Brain masih kosong','Tambahkan materi melalui halaman Upload materi.');
+    return list.map(d=>{const [cls,label]=statusOf(d);return '<div class="compact-source-row"><input class="brain-source-check" type="checkbox" aria-label="Pilih '+E(d.title)+'" value="'+d.docId+'" '+(selected.has(d.docId)?'checked':'')+'>'+fileIcon(d)+'<div class="compact-source-name"><b title="'+E(d.title)+'">'+E(d.title)+'</b><small><span class="status '+cls+'"><i class="dot"></i>'+E(label)+'</span></small></div><button class="icon-btn" data-action="source-delete" data-id="'+d.docId+'" aria-label="Hapus '+E(d.title)+'">'+I('trash')+'</button></div>';}).join('');
+  }
+  const opt=(list,cur)=>list.map(([v,l])=>'<option value="'+v+'" '+(String(cur)===String(v)?'selected':'')+'>'+l+'</option>').join('');
+  function brainView(){
+    const o=draft,n=pool().length;
+    return head('Brain & AI','Pilih materi, tentukan kebutuhan, lalu buat konten atau atur jadwal riset.')+
+    '<div class="unified-workspace"><section class="card compact-brain"><div class="card-head"><div><h3>Brain <span class="badge neutral">'+docs.length+' materi</span></h3><p>Knowledge base tim Anda.</p></div>'+I('brain')+'</div><div class="compact-brain-search"><div class="search">'+I('search')+'<input id="source-search" aria-label="Cari materi di Brain" placeholder="Cari materi..." value="'+E(query)+'"></div></div><div class="brain-selection"><label class="check-label"><input id="brain-select-all" type="checkbox" '+(docs.length&&docs.every(d=>selected.has(d.docId))?'checked':'')+'> Pilih semua</label><span id="brain-selection-label">'+(selected.size?selected.size+' dipilih':'Seluruh Brain digunakan')+'</span></div><div id="source-rows" class="compact-source-list">'+rows()+'</div><div class="table-note">Sumber pilihan menjadi acuan AI. Kosongkan pilihan untuk seluruh Brain.</div></section>'+
+    '<section class="card simple-ai"><div class="card-head"><div class="assistant-title"><span>'+I('spark')+'</span><div><h3>AI & jadwal</h3><p id="plan-source-label">'+n+' materi menjadi sumber AI</p></div></div><span class="badge blue">Engine</span></div>'+
+    '<form id="plan-form" class="simple-plan"><div class="field"><label for="ai-mode">Aktivitas</label><select id="ai-mode">'+opt([['generate','Buat konten teks'],['research','Riset topik (agen)']],o.mode)+'</select></div>'+
+    '<div class="field"><label for="ai-topic">Fokus topik</label><input id="ai-topic" maxlength="100" value="'+E(o.topic)+'" placeholder="Contoh: layanan pelanggan"></div>'+
+    '<div id="research-options" '+(o.mode==='generate'?'hidden':'')+'><div class="field"><label for="ai-prompt">Instruksi riset (opsional)</label><textarea id="ai-prompt" rows="2" maxlength="1600" placeholder="Apa yang perlu dicari?">'+E(o.prompt)+'</textarea></div><div class="field"><label for="research-urls">Referensi riset (opsional)</label><textarea id="research-urls" rows="2" maxlength="1200" placeholder="https://...">'+E(o.urls)+'</textarea></div></div>'+
+    '<div class="simple-schedule-toggle"><label class="check-label"><input id="schedule-enabled" type="checkbox" '+(o.enabled?'checked':'')+'> Jadwalkan riset otomatis</label><span>WIB</span></div>'+
+    '<div id="schedule-fields" '+(o.enabled?'':'hidden')+'><div class="field-grid"><div class="field"><label for="schedule-frequency">Frekuensi</label><select id="schedule-frequency">'+opt([['daily','Setiap hari'],['weekly','Setiap minggu']],o.frequency)+'</select></div><div class="field"><label for="schedule-time">Waktu</label><input id="schedule-time" type="time" value="'+E(o.time)+'" required></div></div><div class="field" id="weekday-field" '+(o.frequency==='weekly'?'':'hidden')+'><label for="schedule-weekday">Hari</label><select id="schedule-weekday">'+opt([[1,'Senin'],[2,'Selasa'],[3,'Rabu'],[4,'Kamis'],[5,'Jumat'],[6,'Sabtu'],[0,'Minggu']],o.weekday)+'</select></div></div>'+
+    '<div class="head-actions" style="margin-top:14px">'+button('Jalankan sekarang','run','primary','spark')+button('Simpan jadwal','save-schedule','light','calendar')+'</div><small>Konten teks memakai kredit workspace untuk membangun knowledge base. Riset dan jadwal memerlukan login Clerk dengan organisasi.</small></form></section></div>';
+  }
+  function contentCard(m){
+    return '<article class="content-card"><div class="content-cover text">'+I('file')+'<span>Text</span><small>DRAFT AI</small></div><div class="content-card-body"><div class="content-card-top"><span class="type-badge text">'+I('file')+'Text</span><span class="status draft"><i class="dot"></i>Draft</span></div><button class="content-title" data-action="open-content" data-id="'+m.id+'">'+E(m.title)+'</button><p>'+m.sources.length+' materi sumber · '+E(dt(m.createdAt))+'</p><div class="content-card-foot"><span>Permintaan AI</span><button class="text-btn" data-action="open-content" data-id="'+m.id+'">Buka konten '+I('arrow-right')+'</button></div></div></article>';
+  }
+  function researchRows(){
+    if(!res.research.length)return empty('Belum ada riset','Jalankan riset dari Brain & AI (perlu login Clerk dengan organisasi).');
+    return '<div class="research-list">'+res.research.map(r=>'<article class="research-row"><span>'+I('search')+'</span><div><span class="badge blue">Hasil riset agen</span><h3>'+E(r.title)+'</h3><p>'+r.sources.length+' sumber Brain · '+E(dt(r.createdAt))+' · '+r.findings.length+' temuan draf</p></div><button class="btn small" data-action="open-research" data-id="'+r.id+'">Lihat hasil</button></article>').join('')+'</div>';
+  }
+  function resultsView(){
+    const list=res.content.filter(m=>m.title.toLowerCase().includes(query.toLowerCase()));
+    return head('Hasil','Konten dan hasil riset yang sudah dibuat.')+'<div class="result-tabs"><button class="'+(tab==='content'?'active':'')+'" data-action="result-tab" data-tab="content">Konten <b>'+res.content.length+'</b></button><button class="'+(tab==='research'?'active':'')+'" data-action="result-tab" data-tab="research">Riset <b>'+res.research.length+'</b></button></div>'+
+    '<section class="card"><div class="toolbar"><h3>'+(tab==='research'?'Hasil riset':'Semua konten')+' <span class="badge neutral">'+(tab==='research'?res.research.length:res.content.length)+'</span></h3>'+(tab==='content'?'<div class="toolbar-controls"><div class="search">'+I('search')+'<input id="result-search" aria-label="Cari konten" placeholder="Cari judul konten..." value="'+E(query)+'"></div></div>':'')+'</div><div id="result-rows">'+(tab==='research'?researchRows():list.length?'<div class="content-grid">'+list.map(contentCard).join('')+'</div>':empty(res.content.length?'Tidak ada konten yang cocok':'Konten baru Anda akan muncul di sini','Buat konten dari Brain & AI.'))+'</div><div class="table-note">Hasil tersimpan di browser ini. Temuan riset berupa draf sumber yang perlu ditinjau.</div></section>';
+  }
+  function render(){
+    $('#login-view').hidden=!!user;$('#app').hidden=!user;fillIcons();
+    if(!user)return;
+    $('#profile-name').textContent=user.name||user.email||'-';$('#avatar').textContent=(user.name||user.email||'U')[0].toUpperCase();
+    $('#profile-sub').textContent=org?'Organisasi · '+(org.name||''):'Akun pribadi';$('#workspace-name').textContent=org?org.name:'Akun pribadi';
+    $('#header-date').textContent=dt(new Date());$('#breadcrumb').textContent=names[view];
+    $('#source-count').textContent=docs.length;$('#module-count').textContent=res.content.length;
+    document.querySelectorAll('nav [data-nav]').forEach(b=>{b.classList.toggle('active',b.dataset.nav===view);b.setAttribute('aria-current',b.dataset.nav===view?'page':'false');});
+    $('#view-content').innerHTML=({sources:sourcesView,brain:brainView,results:resultsView}[view])();fillIcons($('#view-content'));
+  }
+  function go(next){view=next;query='';render();window.scrollTo({top:0});}
+
+  // ── data ──
+  async function refresh(){
+    clearTimeout(pollT);
+    try{docs=await Engine.listDocuments();}catch(e){if(e.status===401)return signOut();return toast(e.message,true);}
+    selected=new Set([...selected].filter(id=>docs.some(d=>d.docId===id)));
+    $('#source-count').textContent=docs.length;
+    if(view==='brain'&&$('#source-rows')){$('#source-rows').innerHTML=rows();fillIcons($('#source-rows'));syncSel();}
+    if(docs.some(d=>d.status!=='completed'&&d.status!=='failed'))pollT=setTimeout(refresh,4000);
+  }
+  function syncSel(){
+    if(!$('#brain-selection-label'))return;
+    $('#brain-selection-label').textContent=selected.size?selected.size+' dipilih':'Seluruh Brain digunakan';
+    $('#plan-source-label').textContent=pool().length+' materi menjadi sumber AI';
+    $('#brain-select-all').checked=docs.length>0&&docs.every(d=>selected.has(d.docId));
+  }
+  function readForm(){
+    if(!$('#ai-mode'))return;
+    draft={mode:$('#ai-mode').value,topic:$('#ai-topic').value.trim(),prompt:$('#ai-prompt').value.trim(),urls:$('#research-urls').value.trim(),enabled:$('#schedule-enabled').checked,frequency:$('#schedule-frequency').value,time:$('#schedule-time').value||'09:00',weekday:Number($('#schedule-weekday').value)};
+  }
+  async function guarded(fn){
+    if(busy)return toast('Proses sebelumnya masih berlangsung.');
+    busy=true;
+    try{await fn();}catch(e){const m=$('#modal');if(m.open)m.close();toast(e.message||'Proses belum berhasil.',true);if(e.status===401)signOut();}
+    finally{busy=false;}
+  }
+  async function upload(files){
+    if(!files.length)return;
+    await guarded(async()=>{
+      if(!exts.size)exts=await Engine.supportedExtensions();
+      const ok=[],issues=[];
+      for(const f of files){
+        const ext='.'+f.name.split('.').pop().toLowerCase();
+        if(!exts.has(ext)){issues.push(f.name+': format tidak didukung');continue;}
+        if(!f.size){issues.push(f.name+': berkas kosong');continue;}
+        if(f.size>200*1024*1024){issues.push(f.name+': melebihi 200 MB');continue;}
+        try{ok.push((await Engine.upload(f)).id);}catch(e){issues.push(f.name+': '+e.message);}
+      }
+      lastUpload=ok;await refresh();
+      if(issues.length)openModal(modalHead('Sebagian materi belum ditambahkan')+'<div class="modal-body"><ul class="upload-issues">'+issues.map(x=>'<li>'+E(x)+'</li>').join('')+'</ul></div><div class="modal-foot">'+(ok.length?button('Lihat Brain','close-brain','primary','spark'):button('Tutup','close','','close'))+'</div>');
+      else if(ok.length){go('brain');toast(ok.length+' materi ditambahkan ke Brain.');}
+    });
+  }
+  async function runText(){
+    const sel=pool();if(!sel.length)throw new Error('Upload materi terlebih dahulu.');
+    progress('Membuat konten teks','Engine membaca materi lalu menyusun ringkasan terstruktur.');
+    for(const [i,d] of sel.entries()){
+      step('Menyiapkan “'+d.title+'” (knowledge base memakai kredit)',10+i*40/sel.length);
+      await Engine.buildKnowledge(d.docId);
+      await Engine.waitReady(d.docId,s=>step('Membaca “'+d.title+'” · '+(s.processing_stage||s.knowledge_status)));
+    }
+    step('Menyusun konten teks',60);
+    const {summary}=await Engine.generateText(sel.map(d=>d.docId),draft.topic||'Konten '+dt(new Date()));
+    const sc=summary.structured_content||{},sections=[];
+    if(sc.executive_summary)sections.push({title:'Ringkasan',body:sc.executive_summary});
+    (sc.sections||[]).forEach(s=>sections.push({title:s.title,body:[s.summary,...(s.key_points||[]).map(p=>'• '+p)].filter(Boolean).join('\n')}));
+    if(!sections.length)sections.push({title:summary.title||'Ringkasan',body:summary.content});
+    res.content.unshift({id:'c'+Date.now(),title:summary.title||draft.topic||'Konten teks',sources:sel.map(d=>({id:d.docId,title:d.title})),sections,createdAt:new Date().toISOString()});
+    save();tab='content';$('#modal').close();go('results');toast('Konten teks selesai dibuat.');
+  }
+  async function needOrg(){if(!Engine.clerkEnabled()||!(await Engine.agentsAvailable()))throw new Error('Riset dan jadwal memerlukan login Clerk dengan akun yang tergabung dalam organisasi.');}
+  async function runResearch(){
+    await needOrg();
+    const sel=pool(),urls=draft.urls.split(/\s+/).filter(Boolean);
+    progress('Menjalankan riset','Agen learning-lab mencari sumber untuk topik Anda.');step('Menyiapkan agen',10);
+    const {run,drafts}=await Engine.research({topic:draft.topic,prompt:draft.prompt,urls,docIds:sel.map(d=>d.docId)},r=>step('Agen riset · '+r.status,50));
+    res.research.unshift({id:'r'+run.id,runId:run.id,title:'Riset: '+(draft.topic||'umum'),topic:draft.topic,prompt:draft.prompt,urls,sources:sel.map(d=>({id:d.docId,title:d.title})),findings:drafts.map(d=>({title:d.title,url:d.source_url,preview:d.preview})),note:'Run #'+run.id+' · '+run.status+(run.source_outcome?' · '+run.source_outcome:''),createdAt:run.created_at||new Date().toISOString()});
+    save();tab='research';$('#modal').close();go('results');toast('Riset selesai: '+drafts.length+' temuan.');
+  }
+  async function saveSchedule(){
+    await needOrg();
+    const a=await Engine.setSchedule({enabled:draft.enabled,frequency:draft.frequency,time:draft.time,weekday:draft.weekday});
+    toast(draft.enabled?'Jadwal riset tersimpan'+(a.next_run_at?' · berikutnya '+new Date(a.next_run_at).toLocaleString('id-ID'):'')+'.':'Jadwal riset dinonaktifkan.');
+  }
+  function openContent(id){
+    const m=res.content.find(x=>x.id===id);if(!m)return;
+    openModal(modalHead('Pratinjau Text','Hasil engine learning-lab. Tinjau sebelum digunakan.')+'<div class="modal-body"><article class="prose"><h1>'+E(m.title)+'</h1>'+m.sections.map(s=>'<h2>'+E(s.title)+'</h2><p style="white-space:pre-wrap">'+E(s.body)+'</p>').join('')+'<p class="ref-line">Sumber: '+m.sources.map(s=>E(s.title)).join(' · ')+'</p></article></div><div class="modal-foot">'+button('Unduh TXT','download','primary','download','data-id="'+m.id+'"')+'</div>',true);
+  }
+  function openResearch(id){
+    const r=res.research.find(x=>x.id===id);if(!r)return;
+    openModal(modalHead('Hasil riset',E(r.note||''))+'<div class="modal-body"><div class="prose"><h1>'+E(r.title)+'</h1>'+(r.prompt?'<h2>Instruksi</h2><p>'+E(r.prompt)+'</p>':'')+'<h2>Sumber internal Brain</h2><ul>'+(r.sources.map(s=>'<li>'+E(s.title)+'</li>').join('')||'<li>Seluruh Brain</li>')+'</ul><h2>Temuan</h2>'+(r.findings.length?'<ul>'+r.findings.map(f=>'<li><b>'+E(f.title)+'</b>'+(f.url?' · '+E(f.url):'')+(f.preview?'<br><small>'+E(f.preview)+'</small>':'')+'</li>').join('')+'</ul>':'<p>Agen tidak menemukan sumber baru untuk topik ini.</p>')+'</div></div>',true);
+  }
+  function download(id){
+    const m=res.content.find(x=>x.id===id);if(!m)return;
+    const url=URL.createObjectURL(new Blob([m.title+'\n\n'+m.sections.map(s=>s.title+'\n'+s.body).join('\n\n')],{type:'text/plain'})),a=document.createElement('a');
+    a.href=url;a.download=m.title.replace(/[^\w-]+/g,'-').slice(0,60)+'.txt';a.click();URL.revokeObjectURL(url);
+  }
+
+  // ── auth ──
+  function setUser(u){user=u;if(u){render();refresh();Engine.supportedExtensions().then(x=>{exts=x;if(view==='sources')render();});}else render();}
+  async function signOut(){clearTimeout(pollT);await Engine.logout();org=null;docs=[];user=null;view='sources';render();}
+  function onClerk(){
+    const u=Engine.clerkUser();if(!u)return;
+    if(!user||user.email!==u.email)setUser({email:u.email,name:u.name});
+    Engine.ensureOrg().then(o=>{org=o;render();if(!o)toast('Akun Clerk ini belum tergabung dalam organisasi; riset dan jadwal belum aktif.',true);}).catch(e=>toast(e.message,true));
+  }
+
+  // ── events ──
+  document.addEventListener('click',e=>{
+    const nav=e.target.closest('[data-nav]');if(nav){e.preventDefault();$('#modal').open&&$('#modal').close();return go(nav.dataset.nav);}
+    const b=e.target.closest('[data-action]');if(!b)return;
+    const a=b.dataset.action,id=b.dataset.id;
+    if(a==='close')$('#modal').close();
+    else if(a==='close-brain'){$('#modal').close();go('brain');}
+    else if(a==='logout')signOut();
+    else if(a==='clerk-login')Engine.clerkSignIn();
+    else if(a==='toggle-password'){const i=$('#login-password');i.type=i.type==='password'?'text':'password';}
+    else if(a==='upload')$('#file-input').click();
+    else if(a==='source-delete'){const d=docs.find(x=>x.docId===Number(id));if(d&&confirm('Hapus “'+d.title+'” dari Brain?'))guarded(async()=>{await Engine.deleteDocument(d.docId);selected.delete(d.docId);await refresh();render();toast('Materi dihapus.');});}
+    else if(a==='run'){readForm();guarded(draft.mode==='research'?runResearch:runText);}
+    else if(a==='save-schedule'){readForm();guarded(saveSchedule);}
+    else if(a==='result-tab'){tab=b.dataset.tab;query='';render();}
+    else if(a==='open-content')openContent(id);
+    else if(a==='open-research')openResearch(id);
+    else if(a==='download')download(id);
+  });
+  document.addEventListener('change',e=>{
+    if(e.target.id==='file-input'){const f=[...e.target.files];e.target.value='';upload(f);}
+    else if(e.target.classList.contains('brain-source-check')){const id=Number(e.target.value);e.target.checked?selected.add(id):selected.delete(id);syncSel();}
+    else if(e.target.id==='brain-select-all'){selected=e.target.checked?new Set(docs.map(d=>d.docId)):new Set();document.querySelectorAll('.brain-source-check').forEach(c=>{c.checked=selected.has(Number(c.value));});syncSel();}
+    else if(e.target.closest('#plan-form')){readForm();$('#research-options').hidden=draft.mode==='generate';$('#schedule-fields').hidden=!draft.enabled;$('#weekday-field').hidden=draft.frequency!=='weekly';}
+  });
+  document.addEventListener('input',e=>{
+    if(e.target.id==='source-search'){query=e.target.value;$('#source-rows').innerHTML=rows();fillIcons($('#source-rows'));}
+    else if(e.target.id==='result-search'){query=e.target.value;render();$('#result-search').focus();}
+  });
+  document.addEventListener('submit',e=>{
+    e.preventDefault();
+    if(e.target.id!=='login-form')return;
+    $('#login-error').textContent='';
+    Engine.login($('#login-email').value.trim(),$('#login-password').value).then(u=>setUser({email:u.email,name:u.full_name})).catch(err=>{$('#login-error').textContent=err.message;});
+  });
+  $('#modal').addEventListener('click',e=>{if(e.target===$('#modal'))$('#modal').close();});
+
+  // ── boot ──
+  render();
+  Engine.initClerk().then(ok=>{if(!ok)return;$('#clerk-login').hidden=false;Engine.onClerkChange(onClerk);onClerk();}).catch(err=>console.warn(err.message));
+  if(!user&&Engine.hasSession())Engine.me().then(u=>setUser({email:u.email,name:u.full_name})).catch(()=>{});
+})();
+</script>
+</body>
+</html>
diff --git a/prototype/server.mjs b/prototype/server.mjs
new file mode 100644
index 0000000..1541837
--- /dev/null
+++ b/prototype/server.mjs
@@ -0,0 +1,52 @@
+// Static host for Learning Lab Express. Proxies /api to the learning-lab engine
+// so the browser stays same-origin (no CORS setup needed on the engine).
+import http from 'node:http';
+import { readFile } from 'node:fs/promises';
+import { extname, join, normalize } from 'node:path';
+import { fileURLToPath } from 'node:url';
+
+const ROOT = fileURLToPath(new URL('.', import.meta.url));
+const PORT = Number(process.env.PORT || 3000);
+const ENGINE = new URL(process.env.ENGINE_URL || 'http://localhost:8000');
+const TYPES = { '.html': 'text/html; charset=utf-8', '.js': 'text/javascript; charset=utf-8', '.css': 'text/css', '.svg': 'image/svg+xml' };
+
+function proxy(req, res) {
+  const upstream = http.request({
+    host: ENGINE.hostname, port: ENGINE.port, path: req.url, method: req.method,
+    headers: { ...req.headers, host: ENGINE.host },
+  }, up => { res.writeHead(up.statusCode, up.headers); up.pipe(res); });
+  upstream.on('error', () => {
+    res.writeHead(502, { 'content-type': 'application/json' });
+    res.end(JSON.stringify({ detail: `Engine learning-lab tidak dapat dihubungi di ${ENGINE.origin}` }));
+  });
+  req.pipe(upstream);
+}
+
+// Clerk publishable keys are public; default to the engine's own dev key so both share one Clerk instance.
+async function clerkKey() {
+  if (process.env.CLERK_PUBLISHABLE_KEY) return process.env.CLERK_PUBLISHABLE_KEY;
+  try {
+    const env = await readFile(join(ROOT, '../../learning-lab/backend/.env'), 'utf8');
+    return env.match(/^VITE_CLERK_PUBLISHABLE_KEY=["']?([^"'\s]+)/m)?.[1] || '';
+  } catch { return ''; }
+}
+
+async function serve(req, res) {
+  const path = new URL(req.url, 'http://x').pathname;
+  if (path === '/config.js') {
+    res.writeHead(200, { 'content-type': TYPES['.js'] });
+    return res.end(`window.LLE_CONFIG=${JSON.stringify({ clerkKey: await clerkKey() })};`);
+  }
+  const name = path === '/' ? 'index.html' : normalize(path).replace(/^([/\\])+/, '');
+  if (name.startsWith('..')) { res.writeHead(403); return res.end(); }
+  try {
+    const body = await readFile(join(ROOT, name));
+    res.writeHead(200, { 'content-type': TYPES[extname(name)] || 'application/octet-stream' });
+    res.end(body);
+  } catch {
+    res.writeHead(404); res.end('Not found');
+  }
+}
+
+http.createServer((req, res) => (req.url.startsWith('/api/') ? proxy(req, res) : serve(req, res)))
+  .listen(PORT, () => console.log(`Learning Lab Express: http://localhost:${PORT}  →  engine ${ENGINE.origin}`));
diff --git a/src/App.tsx b/src/App.tsx
new file mode 100644
index 0000000..70405e3
--- /dev/null
+++ b/src/App.tsx
@@ -0,0 +1,28 @@
+import { Navigate, Route, Routes } from 'react-router-dom'
+import { AuthGate } from './auth/AuthGate'
+import { AppLayout } from './components/AppLayout'
+import { BrainPage } from './pages/Brain'
+import { InstructionPage } from './pages/Instruction'
+import { SchedulePage } from './pages/Schedule'
+import { ResultsPage } from './pages/Results'
+
+export default function App() {
+  return (
+    <AuthGate>
+      <Routes>
+        <Route element={<AppLayout />}>
+          <Route path="/brain" element={<BrainPage />} />
+          <Route path="/instruction" element={<InstructionPage />} />
+          <Route path="/schedule" element={<SchedulePage />} />
+          <Route path="/results" element={<ResultsPage />} />
+        </Route>
+        {/* Indonesian paths from before the routes were renamed, so old links keep working. */}
+        <Route path="/otak" element={<Navigate replace to="/brain" />} />
+        <Route path="/perintah" element={<Navigate replace to="/instruction" />} />
+        <Route path="/jadwal" element={<Navigate replace to="/schedule" />} />
+        <Route path="/hasil" element={<Navigate replace to="/results" />} />
+        <Route path="*" element={<Navigate replace to="/brain" />} />
+      </Routes>
+    </AuthGate>
+  )
+}
diff --git a/src/api/client.ts b/src/api/client.ts
new file mode 100644
index 0000000..ec9ddb0
--- /dev/null
+++ b/src/api/client.ts
@@ -0,0 +1,78 @@
+import { t } from '../i18n'
+
+// HTTP client for the learning-lab engine (FastAPI, /api/v1).
+// Auth is a Clerk session token: Express Mode runs on organization-scoped APIs (agents, credits).
+const BASE = '/api/v1'
+
+export class EngineError extends Error {
+  status: number
+  /** The engine's error body, e.g. `required`/`balance` on a 402. */
+  data: Record<string, unknown> | null
+  constructor(message: string, status: number, data: Record<string, unknown> | null = null) {
+    super(message)
+    this.status = status
+    this.data = data
+  }
+}
+
+// A 402 from any credit-spending call; the engine includes what was needed and what the wallet has.
+export function creditMessage(e: EngineError): string {
+  const { required, balance } = e.data ?? {}
+  return typeof required === 'number' && typeof balance === 'number'
+    ? t('err.credits', { required, balance })
+    : t('err.creditsShort')
+}
+
+type TokenGetter = () => Promise<string | null>
+let getToken: TokenGetter = async () => null
+
+export function setTokenGetter(getter: TokenGetter) {
+  getToken = getter
+}
+
+function detail(d: unknown): string {
+  if (typeof d === 'string') return d
+  if (Array.isArray(d)) return d.map(x => (x && typeof x === 'object' && 'msg' in x ? String(x.msg) : JSON.stringify(x))).join('; ')
+  if (d && typeof d === 'object' && 'message' in d) return String(d.message)
+  return t('err.generic')
+}
+
+export interface RequestOptions extends Omit<RequestInit, 'body'> {
+  json?: unknown
+  body?: BodyInit
+  /** 'blob' for file downloads; errors still come back as JSON. */
+  as?: 'json' | 'blob'
+}
+
+export async function request<T>(path: string, { json, headers, as = 'json', ...opts }: RequestOptions = {}): Promise<T> {
+  const h = new Headers(headers)
+  const token = await getToken()
+  if (token) h.set('Authorization', `Bearer ${token}`)
+  let body = opts.body
+  if (json !== undefined) {
+    h.set('Content-Type', 'application/json')
+    body = JSON.stringify(json)
+  }
+
+  let res: Response
+  try {
+    res = await fetch(BASE + path, { ...opts, headers: h, body })
+  } catch {
+    throw new EngineError(t('err.unreachable'), 0)
+  }
+  if (res.status === 204) return null as T
+  if (as === 'blob' && res.ok) return (await res.blob()) as T
+  const data = await res.json().catch(() => null)
+  if (!res.ok) {
+    if (res.status === 502 || res.status === 504) throw new EngineError(t('err.unreachable'), res.status)
+    const err = new EngineError(detail(data?.detail), res.status, data && typeof data === 'object' ? data : null)
+    if (res.status === 402) err.message = creditMessage(err)
+    throw err
+  }
+  return data as T
+}
+
+// Idempotency keys for operations that spend credits, so a retried click is not billed twice.
+export const opKey = (prefix: string) => `lle-${prefix}-${Date.now()}-${Math.random().toString(36).slice(2, 8)}`
+
+export const sleep = (ms: number) => new Promise(r => setTimeout(r, ms))
diff --git a/src/api/engine.ts b/src/api/engine.ts
new file mode 100644
index 0000000..f1c3503
--- /dev/null
+++ b/src/api/engine.ts
@@ -0,0 +1,193 @@
+// Typed engine calls used by Express Mode. Ported from prototype/engine.js.
+import { EngineError, opKey, request, sleep } from './client'
+import { t } from '../i18n'
+
+// ── Documents (Brain) ──
+
+export type KnowledgeStatus = 'not_built' | 'awaiting_confirmation' | 'needs_credits' | 'building' | 'ready' | 'failed' | string
+
+export interface EngineDocument {
+  id: number
+  filename: string
+  original_filename?: string | null
+  file_type?: string | null
+  status: string
+  knowledge_status?: KnowledgeStatus | null
+  progress_percentage?: number | null
+  processing_stage?: string | null
+  error?: string | null
+  created_at: string
+}
+
+export interface Source {
+  docId: number
+  title: string
+  originalName: string
+  format: string
+  createdAt: string
+  status: string
+  knowledge: KnowledgeStatus | null
+  progress: number | null
+  stage: string | null
+}
+
+function asSource(d: EngineDocument): Source {
+  const name = d.original_filename || d.filename
+  return {
+    docId: d.id,
+    title: name.replace(/\.[^.]+$/, ''),
+    originalName: name,
+    format: (d.file_type || name.split('.').pop() || '').toUpperCase(),
+    createdAt: d.created_at,
+    status: d.status,
+    knowledge: d.knowledge_status ?? null,
+    progress: d.progress_percentage ?? null,
+    stage: d.processing_stage ?? null,
+  }
+}
+
+export const listDocuments = async () => (await request<EngineDocument[]>('/upload/list')).map(asSource)
+export const documentStatus = (id: number) => request<EngineDocument>(`/upload/${id}`)
+export const deleteDocument = (id: number) => request<null>(`/upload/${id}`, { method: 'DELETE' })
+
+export async function supportedExtensions(): Promise<Set<string>> {
+  const f = await request<{ extensions: string[] }>('/upload/supported-formats')
+  return new Set(f.extensions)
+}
+
+export async function uploadDocument(file: File): Promise<number> {
+  const form = new FormData()
+  form.append('file', file, file.name)
+  const body = await request<{ id?: number; document_id?: number }>('/upload/', { method: 'POST', body: form })
+  return (body.id ?? body.document_id)!
+}
+
+// After processing, the engine builds the knowledge base itself when the price is small.
+// Otherwise it stops in one of these states and waits for the user.
+export const NEEDS_ANSWER = new Set(['not_built', 'awaiting_confirmation', 'needs_credits', 'awaiting_version_answer', 'failed'])
+
+export interface KnowledgeDetail {
+  status: KnowledgeStatus
+  document_status: string
+  stage: string | null
+  quote: { credits: number; activity_key: string } | null
+  candidate: { id: number; filename: string; created_at: string | null } | null
+  error: string | null
+}
+
+export const knowledgeDetail = (id: number) => request<KnowledgeDetail>(`/upload/${id}/knowledge`)
+
+// Agree to the quoted price, build after a top-up, or retry a failed build. Spends workspace credits (402 when short).
+export const buildKnowledge = (id: number) => request<{ status: string }>(`/upload/${id}/knowledge/build`, { method: 'POST' })
+
+// The engine asks whether an upload is the next version of a similar document before building it.
+export const answerVersion = (id: number, isNewVersion: boolean) =>
+  request<{ status: string }>(`/upload/${id}/versions/${isNewVersion ? 'link' : 'decline'}`, { method: 'POST', json: isNewVersion ? {} : undefined })
+
+// Polls until the document's knowledge base is built (what generation needs).
+export async function waitReady(id: number, onProgress?: (d: EngineDocument) => void, timeoutMs = 10 * 60 * 1000) {
+  const t0 = Date.now()
+  for (;;) {
+    const s = await documentStatus(id)
+    onProgress?.(s)
+    if (s.error || s.status === 'failed') throw new EngineError(s.error || t('err.docFailed'), 422)
+    if (s.knowledge_status === 'ready') return s
+    if (Date.now() - t0 > timeoutMs) throw new EngineError(t('err.timeout'), 408)
+    await sleep(2500)
+  }
+}
+
+// ── Compose (text content) ──
+
+export interface ComposeSet { id: number; name: string }
+
+export async function generateText(docIds: number[], name: string) {
+  const set = await request<ComposeSet>('/compose/sets', { method: 'POST', json: { name, mode: 'knowledge_documents', source_document_ids: docIds } })
+  const summary = await request<unknown>(`/compose/sets/${set.id}/generate/summary`, { method: 'POST', json: { operation_key: opKey(`s-${set.id}`) } })
+  return { setId: set.id, summary }
+}
+
+export const generateQuiz = (setId: number, n = 5) =>
+  request<unknown>(`/compose/sets/${setId}/generate/quiz`, { method: 'POST', json: { num_questions: n, question_type: 'mixed', operation_key: opKey(`q-${setId}`) } })
+
+// ── Agents (organization-scoped): research runs and recurring schedule ──
+
+const AGENTS = '/organizations/current/agents'
+export const AGENT_NAME = 'Learning Lab Express'
+
+export interface RunSchedule { cadence: 'off' | 'daily' | 'weekly'; hour?: number; minute?: number; weekday?: number }
+
+export interface Agent {
+  id: number
+  name: string
+  goal: string
+  status: string
+  instructions?: string | null
+  run_schedule?: RunSchedule | null
+}
+
+export interface AgentRun { id: number; status: string; safe_error_code?: string | null }
+export interface SourceDraft { id: number; run_id: number; [key: string]: unknown }
+
+let agentCache: Agent | null = null
+export const resetAgentCache = () => { agentCache = null }
+
+export async function ensureAgent(): Promise<Agent> {
+  if (agentCache) return agentCache
+  let agent = (await request<Agent[]>(AGENTS)).find(a => a.name === AGENT_NAME && a.status !== 'archived')
+  agent ??= await request<Agent>(AGENTS, {
+    method: 'POST',
+    json: {
+      name: AGENT_NAME,
+      goal: 'Riset topik pembelajaran dan temukan sumber publik baru untuk Brain tim LND.',
+      enabled_tools: ['knowledge.retrieve', 'compose.graph.retrieve', 'browse.search', 'library.add_url'],
+      research_options: { max_results: 5 },
+      timezone: 'Asia/Jakarta',
+      run_budget: 50,
+      monthly_budget: 1000,
+    },
+  })
+  if (agent.status !== 'active') agent = await request<Agent>(`${AGENTS}/${agent.id}/activate`, { method: 'POST' })
+  return (agentCache = agent)
+}
+
+export async function attachSources(agentId: number, docIds: number[]) {
+  for (const id of docIds) {
+    try {
+      await request(`${AGENTS}/${agentId}/knowledge-sources`, { method: 'PUT', json: { kind: 'document', source_id: id } })
+    } catch (e) {
+      if (!(e instanceof EngineError && e.status === 404)) throw e
+    }
+  }
+}
+
+// Server-side recurring run. weekday follows the engine: 0 = Monday.
+export async function setSchedule(schedule: RunSchedule) {
+  const agent = await ensureAgent()
+  agentCache = await request<Agent>(`${AGENTS}/${agent.id}`, { method: 'PATCH', json: { run_schedule: schedule } })
+  return agentCache
+}
+
+export async function research(
+  { topic, prompt, urls = [], docIds = [] }: { topic?: string; prompt?: string; urls?: string[]; docIds?: number[] },
+  onStatus?: (run: AgentRun) => void,
+) {
+  const agent = await ensureAgent()
+  await attachSources(agent.id, docIds)
+  const focus = [topic && `Topik: ${topic}`, prompt, urls.length && `Referensi: ${urls.join(' ')}`].filter(Boolean).join('\n')
+  await request(`${AGENTS}/${agent.id}`, {
+    method: 'PATCH',
+    json: { goal: (topic ? `Riset topik: ${topic}` : agent.goal).slice(0, 4000), instructions: focus || null },
+  })
+  const run = await request<AgentRun>(`${AGENTS}/${agent.id}/runs`, { method: 'POST', headers: { 'Idempotency-Key': opKey(`run-${agent.id}`) }, json: {} })
+  let detail = run
+  for (;;) {
+    onStatus?.(detail)
+    if (['completed', 'failed', 'cancelled'].includes(detail.status)) break
+    await sleep(3000)
+    detail = await request<AgentRun>(`${AGENTS}/${agent.id}/runs/${run.id}`)
+  }
+  if (detail.status !== 'completed') throw new EngineError(t('err.researchFailed', { code: detail.safe_error_code || detail.status }), 422)
+  const drafts = (await request<SourceDraft[]>(`${AGENTS}/${agent.id}/source-drafts`)).filter(d => d.run_id === run.id)
+  return { run: detail, drafts }
+}
diff --git a/src/auth/AuthGate.tsx b/src/auth/AuthGate.tsx
new file mode 100644
index 0000000..e8631c3
--- /dev/null
+++ b/src/auth/AuthGate.tsx
@@ -0,0 +1,77 @@
+import { Fragment, useRef, type ReactNode } from 'react'
+import { OrganizationList, SignIn, useAuth } from '@clerk/react'
+import { useQueryClient } from '@tanstack/react-query'
+import { setTokenGetter } from '../api/client'
+import { resetAgentCache } from '../api/engine'
+import { LanguageSwitch } from '../components/AppLayout'
+import { Brand, Icon } from '../components/Icon'
+import { t, useLang } from '../i18n'
+
+// Express Mode only runs inside an organization: agents, schedules and credits are all org-scoped.
+export function AuthGate({ children }: { children: ReactNode }) {
+  useLang()
+  const { isLoaded, isSignedIn, orgId, getToken } = useAuth()
+  const queryClient = useQueryClient()
+
+  // Set during render, not in an effect: child queries fire before a parent's effects run.
+  setTokenGetter(() => getToken())
+
+  // Cached engine data belongs to one organization. Cleared during render, before the pages build
+  // their queries: in an effect it would run after the pages' first fetch and orphan their queries.
+  const lastOrg = useRef(orgId)
+  if (lastOrg.current !== orgId) {
+    lastOrg.current = orgId
+    queryClient.clear()
+    resetAgentCache()
+  }
+
+  if (!isLoaded) return <LoadingScreen />
+  if (!isSignedIn) return <AuthScreen><SignIn routing="hash" /></AuthScreen>
+  if (!orgId) {
+    return (
+      <AuthScreen>
+        <div>
+          <h2>{t('auth.pickOrg')}</h2>
+          <p>{t('auth.pickOrgCopy')}</p>
+          <OrganizationList hidePersonal afterSelectOrganizationUrl="/brain" afterCreateOrganizationUrl="/brain" />
+        </div>
+      </AuthScreen>
+    )
+  }
+  // Keyed by organization so a switch remounts the pages with fresh queries.
+  return <Fragment key={orgId}>{children}</Fragment>
+}
+
+// Same screen as the boot markup in index.html (styles there), so a refresh doesn't flicker between two loaders.
+function LoadingScreen() {
+  return (
+    <div className="boot" role="status">
+      <span className="boot-mark"><Icon name="book" /></span>
+      <span className="boot-name">Learning Lab <b>Express</b></span>
+      <span className="boot-bar"><i></i></span>
+      <span className="boot-text">{t('auth.loading')}</span>
+    </div>
+  )
+}
+
+function AuthScreen({ children }: { children: ReactNode }) {
+  return (
+    <section className="login-layout">
+      <div className="login-story">
+        <div className="login-top"><Brand /><LanguageSwitch /></div>
+        <div className="login-copy">
+          <span className="eyebrow">{t('auth.eyebrow')}</span>
+          <h1>{t('auth.headline1')}<br />{t('auth.headline2')}<br />{t('auth.headline3')}</h1>
+          <p>{t('auth.copy')}</p>
+          <div className="login-benefits">
+            <span><i><Icon name="upload" /></i> {t('auth.benefitUpload')}</span>
+            <span><i><Icon name="clock" /></i> {t('auth.benefitSchedule')}</span>
+            <span><i><Icon name="download" /></i> {t('auth.benefitDownload')}</span>
+          </div>
+        </div>
+        <div className="login-footer">LEARNING LAB EXPRESS <span>{t('auth.footer')}</span></div>
+      </div>
+      <div className="login-panel"><div className="login-form-wrap">{children}</div></div>
+    </section>
+  )
+}
diff --git a/src/components/AppLayout.tsx b/src/components/AppLayout.tsx
new file mode 100644
index 0000000..7c6215f
--- /dev/null
+++ b/src/components/AppLayout.tsx
@@ -0,0 +1,121 @@
+import { useEffect, useRef, useState } from 'react'
+import { useClerk, useOrganization, useUser } from '@clerk/react'
+import { NavLink, Outlet, useLocation } from 'react-router-dom'
+import { LANGS, locale, setLang, t, useLang, type Key } from '../i18n'
+import { Brand, Icon, type IconName } from './Icon'
+import { Toaster } from './Toast'
+
+// Express Mode has four doors: feed the Brain, give an instruction, watch the schedule, collect results.
+export const NAV: { to: string; label: Key; icon: IconName }[] = [
+  { to: '/brain', label: 'nav.brain', icon: 'brain' },
+  { to: '/instruction', label: 'nav.instruction', icon: 'spark' },
+  { to: '/schedule', label: 'nav.schedule', icon: 'calendar' },
+  { to: '/results', label: 'nav.results', icon: 'layers' },
+]
+
+export function LanguageSwitch() {
+  const lang = useLang()
+  return (
+    <div className="lang-switch" role="group" aria-label={t('layout.language')}>
+      {LANGS.map(l => (
+        <button key={l.code} type="button" aria-pressed={lang === l.code} className={lang === l.code ? 'active' : undefined}
+          onClick={() => setLang(l.code)}>{l.label}</button>
+      ))}
+    </div>
+  )
+}
+
+// The four steps of Express, from the mockup's "how it works" guide.
+const HELP_STEPS: { icon: IconName; title: Key; body: Key }[] = [
+  { icon: 'brain', title: 'help.brainTitle', body: 'help.brainBody' },
+  { icon: 'spark', title: 'help.instructionTitle', body: 'help.instructionBody' },
+  { icon: 'calendar', title: 'help.scheduleTitle', body: 'help.scheduleBody' },
+  { icon: 'layers', title: 'help.resultsTitle', body: 'help.resultsBody' },
+]
+
+function HelpDialog({ onClose }: { onClose: () => void }) {
+  const ref = useRef<HTMLDialogElement>(null)
+  // Same pattern as the Results preview: open once, let the dialog's own close event unmount it.
+  useEffect(() => { if (ref.current && !ref.current.open) ref.current.showModal() }, [])
+  return (
+    <dialog ref={ref} aria-labelledby="help-title" onClose={onClose} onClick={e => e.target === ref.current && ref.current.close()}>
+      <div className="modal-head">
+        <div><h2 id="help-title">{t('help.title')}</h2><p>{t('help.subtitle')}</p></div>
+        <button className="icon-btn" aria-label={t('res.close')} onClick={() => ref.current?.close()}><Icon name="close" /></button>
+      </div>
+      <div className="modal-body">
+        <div className="help-steps">
+          {HELP_STEPS.map((s, i) => (
+            <div key={s.title} className="help-step"><span>{i + 1}</span><div><h3>{t(s.title)}</h3><p>{t(s.body)}</p></div></div>
+          ))}
+        </div>
+        <div className="spacer" />
+        <div className="inline-note"><Icon name="info" />{t('help.note')}</div>
+      </div>
+      <div className="modal-foot"><button className="btn primary" onClick={() => ref.current?.close()}>{t('help.done')}<Icon name="arrow-right" /></button></div>
+    </dialog>
+  )
+}
+
+export function AppLayout() {
+  useLang()
+  const [help, setHelp] = useState(false)
+  const { user } = useUser()
+  const { organization } = useOrganization()
+  const { signOut } = useClerk()
+  const { pathname } = useLocation()
+  const current = NAV.find(n => pathname.startsWith(n.to))
+  const name = user?.fullName || user?.primaryEmailAddress?.emailAddress || '-'
+  const today = new Intl.DateTimeFormat(locale(), { weekday: 'long', day: 'numeric', month: 'long', year: 'numeric' })
+
+  return (
+    <div className="app">
+      <aside className="sidebar">
+        <NavLink to="/brain"><Brand /></NavLink>
+        <div className="workspace">
+          <span className="workspace-icon">{(organization?.name || 'L').charAt(0).toUpperCase()}</span>
+          <div>{t('layout.learningSpace')}<small>{organization?.name ?? '-'}</small></div>
+        </div>
+        <div className="nav-label">{t('nav.workspace')}</div>
+        <nav aria-label={t('layout.mainNav')}>
+          {NAV.map(n => (
+            <NavLink key={n.to} to={n.to} className={({ isActive }) => (isActive ? 'active' : undefined)}>
+              <Icon name={n.icon} />{t(n.label)}
+            </NavLink>
+          ))}
+        </nav>
+        <div className="sidebar-help">
+          <Icon name="info" />
+          <b>{t('help.boxTitle')}</b>
+          <p>{t('help.boxBody')}</p>
+          <button type="button" onClick={() => setHelp(true)}>{t('help.open')} <Icon name="arrow-right" /></button>
+        </div>
+        <div className="profile">
+          <span className="avatar">{name.charAt(0).toUpperCase()}</span>
+          <div><b>{name}</b><small>{user?.primaryEmailAddress?.emailAddress}</small></div>
+          <button className="icon-btn" aria-label={t('layout.signOut')} onClick={() => signOut({ redirectUrl: '/' })}><Icon name="logout" /></button>
+        </div>
+      </aside>
+      <div className="workspace-main">
+        <header className="topbar">
+          <div className="breadcrumb">{t('layout.breadcrumb')} <span>/</span> <b>{current ? t(current.label) : ''}</b></div>
+          <div className="topbar-right">
+            <span className="demo-indicator"><i></i> {t('layout.engine')}</span>
+            <span>{today.format(new Date())}</span>
+            <LanguageSwitch />
+          </div>
+        </header>
+        <div className="demo-strip">
+          <Icon name="info" />
+          <span>{t('layout.devStrip')}</span>
+          <span className="demo-strip-tag">DEV</span>
+        </div>
+        {/* Keyed by route so each page plays the fade-in from theme.css. */}
+        <main tabIndex={-1} key={pathname}><Outlet /></main>
+        <footer className="app-footer">Learning Lab Express <span>by Bawana</span><span>{t('layout.footer')}</span></footer>
+      </div>
+      {help && <HelpDialog onClose={() => setHelp(false)} />}
+      <Toaster />
+    </div>
+  )
+}
diff --git a/src/components/AudioPlayer.tsx b/src/components/AudioPlayer.tsx
new file mode 100644
index 0000000..0a0907f
--- /dev/null
+++ b/src/components/AudioPlayer.tsx
@@ -0,0 +1,114 @@
+// Plays an audio lesson's narration script with the device's own voice (Web Speech API).
+// The engine has no audio output for agents yet, so there is no MP3: the script is the deliverable,
+// read aloud here and downloadable as text for recording or a TTS tool.
+import { useEffect, useMemo, useRef, useState } from 'react'
+import { t } from '../i18n'
+import { Icon } from './Icon'
+
+// Long utterances stop silently in some browsers (Chrome after ~15 s), so the script is read
+// one sentence at a time.
+export function sentencesOf(text: string): string[] {
+  return text
+    .replace(/^\s*(?:#{1,6}|[-*•>]|\d+[.)])\s+/gm, '') // headings, bullets, numbered items, quotes
+    .replace(/[*_`]+/g, '')
+    .split(/(?<=[.!?…])\s+|\n+/)
+    .map(s => s.replace(/\s+/g, ' ').trim())
+    .filter(s => /\p{L}/u.test(s))
+}
+
+// The script's language decides the voice; the UI language may differ from the content's.
+const ID_WORDS = /\b(yang|dan|dengan|untuk|adalah|ini|itu|kita|anda|tidak|dalam|akan|bisa|dari)\b/gi
+const EN_WORDS = /\b(the|and|with|for|is|this|that|we|you|not|in|will|can|from)\b/gi
+export const scriptLang = (text: string) => ((text.match(ID_WORDS)?.length ?? 0) > (text.match(EN_WORDS)?.length ?? 0) ? 'id' : 'en')
+
+const supported = typeof window !== 'undefined' && 'speechSynthesis' in window
+
+const BARS = [16, 29, 45, 22, 37, 56, 31, 19, 43]
+
+export function AudioPlayer({ title, text }: { title: string; text: string }) {
+  const sentences = useMemo(() => sentencesOf(text), [text])
+  const lang = useMemo(() => scriptLang(text), [text])
+  const [state, setState] = useState<'idle' | 'playing' | 'paused'>('idle')
+  const [index, setIndex] = useState(0)
+  const [rate, setRate] = useState(1)
+  // The sentence to speak next; a ref so the utterance callbacks see the latest value.
+  const at = useRef(0)
+  const playing = useRef(false)
+  // The utterance being spoken: cancel() also fires "end" on the one it stops, which must not advance.
+  const current = useRef<SpeechSynthesisUtterance | null>(null)
+
+  const voice = () => speechSynthesis.getVoices().find(v => v.lang.toLowerCase().startsWith(lang)) ?? null
+
+  function speak(i: number) {
+    if (i >= sentences.length) { stop(); return }
+    at.current = i
+    setIndex(i)
+    const u = new SpeechSynthesisUtterance(sentences[i])
+    u.lang = lang === 'id' ? 'id-ID' : 'en-US'
+    u.voice = voice()
+    u.rate = rate
+    u.onend = () => { if (playing.current && current.current === u) speak(at.current + 1) }
+    current.current = u
+    speechSynthesis.speak(u)
+  }
+
+  function play() {
+    if (state === 'paused') { speechSynthesis.resume(); setState('playing'); playing.current = true; return }
+    current.current = null
+    speechSynthesis.cancel()
+    playing.current = true
+    setState('playing')
+    speak(at.current)
+  }
+  function pause() { speechSynthesis.pause(); playing.current = false; setState('paused') }
+  function stop() {
+    playing.current = false
+    current.current = null
+    speechSynthesis.cancel()
+    at.current = 0
+    setIndex(0)
+    setState('idle')
+  }
+
+  // Leaving the preview must not leave the device talking.
+  useEffect(() => () => { playing.current = false; if (supported) speechSynthesis.cancel() }, [])
+
+  // A new speed applies from the current sentence.
+  useEffect(() => {
+    if (!playing.current) return
+    current.current = null
+    speechSynthesis.cancel()
+    speak(at.current)
+  }, [rate])
+
+  const progress = sentences.length ? Math.round(((index + (state === 'idle' ? 0 : 1)) / sentences.length) * 100) : 0
+
+  return (
+    <div className="audio-preview">
+      <span className="audio-orb"><Icon name="audio" /></span>
+      <div className={`waveform${state === 'playing' ? ' playing' : ''}`} aria-hidden="true">
+        {Array.from({ length: 36 }, (_, i) => <i key={i} style={{ height: BARS[i % BARS.length], animationDelay: `${(i % 9) * 0.08}s` }} />)}
+      </div>
+      <h2>{title}</h2>
+      <p>{supported ? t('audio.copy') : t('audio.unsupported')}</p>
+      {supported && sentences.length > 0 && (
+        <>
+          <div className="head-actions">
+            {state === 'playing'
+              ? <button className="btn primary" onClick={pause}>{t('audio.pause')}</button>
+              : <button className="btn primary" onClick={play}><Icon name="audio" />{state === 'paused' ? t('audio.resume') : t('audio.play')}</button>}
+            <button className="btn" disabled={state === 'idle'} onClick={stop}><Icon name="close" />{t('audio.stop')}</button>
+            <select aria-label={t('audio.speed')} value={rate} onChange={e => setRate(Number(e.target.value))} className="audio-rate">
+              {[0.85, 1, 1.15, 1.3].map(r => <option key={r} value={r}>{r}×</option>)}
+            </select>
+          </div>
+          <div className="audio-progress"><i style={{ width: `${progress}%` }} /></div>
+          <small role="status">
+            {state === 'idle' ? t('audio.ready', { n: sentences.length }) : t('audio.sentence', { n: index + 1, total: sentences.length })}
+          </small>
+          {state !== 'idle' && <blockquote className="audio-now">{sentences[index]}</blockquote>}
+        </>
+      )}
+    </div>
+  )
+}
diff --git a/src/components/Icon.tsx b/src/components/Icon.tsx
new file mode 100644
index 0000000..fb08cd6
--- /dev/null
+++ b/src/components/Icon.tsx
@@ -0,0 +1,51 @@
+import type { ContentKind, Rule } from '../express/parse'
+
+// Line icons from the mockup (24×24, stroke = currentColor).
+const paths: Record<string, string> = {
+  book: '<path d="M3 5c3-1 6 0 9 2 3-2 6-3 9-2v14c-3-1-6 0-9 2-3-2-6-3-9-2z"/><path d="M12 7v14M6 9l3 1M15 10l3-1"/>',
+  home: '<path d="m3 10 9-7 9 7v10H3z"/><path d="M9 20v-7h6v7"/>',
+  spark: '<path d="m12 3 2.5 6.5L21 12l-6.5 2.5L12 21l-2.5-6.5L3 12l6.5-2.5z"/><path d="m20 2 .5 1.5L22 4l-1.5.5L20 6l-.5-1.5L18 4l1.5-.5z"/>',
+  calendar: '<rect x="3" y="5" width="18" height="16" rx="2"/><path d="M7 3v4M17 3v4M3 11h18M7 15h3M14 15h3"/>',
+  clock: '<circle cx="12" cy="12" r="9"/><path d="M12 7v6l4 2"/>',
+  layers: '<path d="m12 3 10 5-10 5L2 8zM2 12l10 5 10-5M2 16l10 5 10-5"/>',
+  download: '<path d="M12 3v12m-5-5 5 5 5-5M4 16v5h16v-5"/>',
+  upload: '<path d="M12 16V4m-5 5 5-5 5 5M4 16v5h16v-5"/>',
+  file: '<path d="M5 3h9l5 5v13H5zM14 3v6h5M8 13h8M8 17h6"/>',
+  'arrow-right': '<path d="M4 12h16m-6-6 6 6-6 6"/>',
+  close: '<path d="M6 6l12 12M18 6 6 18"/>',
+  search: '<circle cx="10" cy="10" r="6"/><path d="m15 15 5 5"/>',
+  info: '<circle cx="12" cy="12" r="9"/><path d="M12 11v6M12 7v.2"/>',
+  check: '<path d="m5 12 4 4L19 6"/>',
+  logout: '<path d="M10 4H4v16h6M10 12h11m-4-4 4 4-4 4"/>',
+  plus: '<path d="M12 4v16M4 12h16"/>',
+  trash: '<path d="M3 6h18M9 3h6l1 3M6 6l1 15h10l1-15M10 10v7M14 10v7"/>',
+  video: '<rect x="3" y="5" width="18" height="14" rx="3"/><path d="m10 9 5 3-5 3z"/>',
+  audio: '<path d="M4 13v-2a8 8 0 0 1 16 0v2"/><rect x="3" y="11" width="4" height="8" rx="2"/><rect x="17" y="11" width="4" height="8" rx="2"/>',
+  scorm: '<path d="m12 3 9 5-9 5-9-5zM3 8v9l9 5 9-5V8M12 13v9"/>',
+  brain: '<path d="M12 5c-3-4-8-1-7 3-4 2-3 7 0 8-1 4 5 6 7 2M12 5c3-4 8-1 7 3 4 2 3 7 0 8 1 4-5 6-7 2M12 5v15M7 9l3 2M17 9l-3 2M6 15l3-1M18 15l-3-1"/>',
+}
+
+export type IconName = keyof typeof paths
+
+export const KIND_ICON: Record<ContentKind, IconName> = {
+  summary: 'file', quiz: 'check', flashcards: 'layers', roleplay: 'spark', simulator: 'spark', slide_deck: 'layers',
+  video: 'video', audio: 'audio', scorm: 'scorm',
+}
+
+export const ruleIcon = (rule: Rule): IconName => (rule.type === 'research' ? 'search' : KIND_ICON[rule.kind])
+
+export function Icon({ name }: { name: IconName }) {
+  return (
+    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth={1.7} strokeLinecap="round" strokeLinejoin="round" aria-hidden="true"
+      dangerouslySetInnerHTML={{ __html: paths[name] ?? paths.file }} />
+  )
+}
+
+export function Brand() {
+  return (
+    <span className="brand">
+      <span className="brand-mark"><Icon name="book" /></span>
+      <span>Learning Lab <b>Express</b><small>by Bawana</small></span>
+    </span>
+  )
+}
diff --git a/src/components/Page.tsx b/src/components/Page.tsx
new file mode 100644
index 0000000..e50f04b
--- /dev/null
+++ b/src/components/Page.tsx
@@ -0,0 +1,71 @@
+import type { ReactNode } from 'react'
+import { Icon, type IconName } from './Icon'
+
+export function PageHead({ title, description, actions }: { title: string; description: string; actions?: ReactNode }) {
+  return (
+    <div className="page-head">
+      <div><h1>{title}</h1><p>{description}</p></div>
+      {actions && <div className="head-actions">{actions}</div>}
+    </div>
+  )
+}
+
+// Shimmer placeholders shaped like the content they stand in for, so a page keeps its layout while loading.
+export function Skeleton({ w, h, className }: { w?: number | string; h?: number | string; className?: string }) {
+  return <span className={className ? `skel ${className}` : 'skel'} style={{ width: w, height: h }} aria-hidden="true" />
+}
+
+const LINE_WIDTHS = ['62%', '48%', '70%', '55%']
+
+export function SkeletonRows({ count = 3, label }: { count?: number; label: string }) {
+  return (
+    <div className="result-list" role="status" aria-label={label}>
+      {Array.from({ length: count }, (_, i) => (
+        <div key={i} className="result-row skel-row">
+          <Skeleton className="skel-cover" />
+          <div className="result-main">
+            <Skeleton w={LINE_WIDTHS[i % LINE_WIDTHS.length]} h={14} />
+            <Skeleton w="34%" h={11} />
+          </div>
+          <Skeleton className="skel-pill" />
+        </div>
+      ))}
+    </div>
+  )
+}
+
+export function SkeletonCards({ count = 4, label }: { count?: number; label: string }) {
+  return (
+    <div className="content-grid" role="status" aria-label={label}>
+      {Array.from({ length: count }, (_, i) => (
+        <div key={i} className="content-card">
+          <Skeleton className="skel-block" />
+          <div className="content-card-body skel-stack">
+            <Skeleton w="40%" h={20} className="skel-pill" />
+            <Skeleton w="90%" h={14} />
+            <Skeleton w={LINE_WIDTHS[i % LINE_WIDTHS.length]} h={14} />
+            <Skeleton w="50%" h={11} />
+          </div>
+        </div>
+      ))}
+    </div>
+  )
+}
+
+export function SkeletonLines({ count = 2, label }: { count?: number; label: string }) {
+  return (
+    <div className="skel-stack" role="status" aria-label={label}>
+      {Array.from({ length: count }, (_, i) => <Skeleton key={i} w={LINE_WIDTHS[i % LINE_WIDTHS.length]} h={12} />)}
+    </div>
+  )
+}
+
+export function Empty({ icon = 'book', title, children }: { icon?: IconName; title: string; children?: ReactNode }) {
+  return (
+    <div className="empty">
+      <span className="empty-icon"><Icon name={icon} /></span>
+      <h3>{title}</h3>
+      {children && <p>{children}</p>}
+    </div>
+  )
+}
diff --git a/src/components/Toast.tsx b/src/components/Toast.tsx
new file mode 100644
index 0000000..ea01da0
--- /dev/null
+++ b/src/components/Toast.tsx
@@ -0,0 +1,28 @@
+// Short notices at the bottom of the screen (styles from the mockup's .toast), instead of alert().
+// A module-level store, so mutations can report from anywhere without a context provider.
+import { useSyncExternalStore } from 'react'
+
+interface Notice { id: number; text: string; error: boolean }
+
+let current: Notice | null = null
+let nextId = 1
+let timer: ReturnType<typeof setTimeout> | undefined
+const listeners = new Set<() => void>()
+const emit = () => listeners.forEach(l => l())
+
+export function toast(text: string, { error = false } = {}) {
+  current = { id: nextId++, text, error }
+  clearTimeout(timer)
+  // Errors stay a little longer: they usually need reading.
+  timer = setTimeout(() => { current = null; emit() }, error ? 7000 : 3500)
+  emit()
+}
+
+export function Toaster() {
+  const notice = useSyncExternalStore(cb => { listeners.add(cb); return () => listeners.delete(cb) }, () => current)
+  return (
+    <div className={`toast${notice ? ' show' : ''}${notice?.error ? ' error' : ''}`} role={notice?.error ? 'alert' : 'status'} aria-live="polite">
+      {notice?.text}
+    </div>
+  )
+}
diff --git a/src/express/parse.test.ts b/src/express/parse.test.ts
new file mode 100644
index 0000000..997c31c
--- /dev/null
+++ b/src/express/parse.test.ts
@@ -0,0 +1,80 @@
+import { describe, expect, it } from 'vitest'
+import { parseInstruction, videoCadence, weeklyTarget, type ContentRule } from './parse'
+
+const content = (text: string) => parseInstruction(text).rules as ContentRule[]
+
+describe('parseInstruction', () => {
+  it('reads several English content rules with a shared topic', () => {
+    const { rules, unknown } = parseInstruction('make 2 summaries per day and 1 quiz per week about leadership')
+    expect(unknown).toEqual([])
+    expect(rules).toEqual([
+      { type: 'content', kind: 'summary', count: 2, per: 'day', topic: 'leadership' },
+      { type: 'content', kind: 'quiz', count: 1, per: 'week', topic: 'leadership' },
+    ])
+  })
+
+  it('reads Indonesian rules, number words and research', () => {
+    const { rules } = parseInstruction('bikin tiga kuis per minggu soal negosiasi, riset internet tiap hari soal sales')
+    expect(rules[0]).toMatchObject({ type: 'content', kind: 'quiz', count: 3, per: 'week', topic: 'negosiasi' })
+    expect(rules[1]).toMatchObject({ type: 'research', cadence: 'daily', topic: 'sales', autoApprove: true })
+  })
+
+  it('reads a weekday for weekly research', () => {
+    const [rule] = parseInstruction('riset tiap hari minggu soal tren HR').rules
+    expect(rule).toMatchObject({ type: 'research', cadence: 'weekly', weekday: 6 })
+  })
+
+  it('keeps "and" inside a topic', () => {
+    const [rule] = content('3 flashcards per week about sales and marketing')
+    expect(rule).toMatchObject({ kind: 'flashcards', count: 3, topic: 'sales and marketing' })
+  })
+
+  it('turns a monthly count into a weekly one and remembers it', () => {
+    const [rule] = content('8 summaries per month')
+    expect(rule).toMatchObject({ count: 2, per: 'week', monthly: 8 })
+  })
+
+  it('recognises video, audio and SCORM requests', () => {
+    const rules = content('1 video per week, 2 podcasts per week and 1 SCORM module per week about onboarding')
+    expect(rules.map(r => [r.kind, r.count, r.per, r.topic])).toEqual([
+      ['video', 1, 'week', 'onboarding'],
+      ['audio', 2, 'week', 'onboarding'],
+      ['scorm', 1, 'week', 'onboarding'],
+    ])
+  })
+
+  it('treats a SCORM module with a quiz as SCORM', () => {
+    expect(content('1 modul scorm dengan kuis per minggu')[0].kind).toBe('scorm')
+  })
+
+  it('reports clauses it did not understand', () => {
+    const { rules, unknown } = parseInstruction('2 summaries per day. hello there')
+    expect(rules).toHaveLength(1)
+    expect(unknown).toEqual(['hello there'])
+  })
+})
+
+describe('videoCadence', () => {
+  const video = (count: number, per: 'day' | 'week'): ContentRule => ({ type: 'content', kind: 'video', count, per, topic: '' })
+
+  it('maps one per day and one per week to the engine cadences', () => {
+    expect(videoCadence(video(1, 'day'))).toBe('daily')
+    expect(videoCadence(video(7, 'week'))).toBe('daily')
+    expect(videoCadence(video(1, 'week'))).toBe('weekly')
+  })
+
+  it('has no cadence for other counts', () => {
+    expect(videoCadence(video(3, 'week'))).toBeNull()
+    expect(videoCadence(video(2, 'day'))).toBeNull()
+  })
+
+  it('counts daily rules as seven a week', () => {
+    expect(weeklyTarget(video(2, 'day'))).toBe(14)
+  })
+})
+
+describe('counts', () => {
+  it('never parses a count below one', () => {
+    expect(parseInstruction('buat 0 ringkasan per minggu').rules[0]).toMatchObject({ kind: 'summary', count: 1 })
+  })
+})
diff --git a/src/express/parse.ts b/src/express/parse.ts
new file mode 100644
index 0000000..f7373b6
--- /dev/null
+++ b/src/express/parse.ts
@@ -0,0 +1,179 @@
+// Turns an everyday instruction (English or Indonesian) into schedule rules, e.g.
+// "make 2 summaries per day and 1 quiz per week about leadership, research the internet daily about sales"
+// "bikin 2 summary per hari dan 1 kuis per minggu soal leadership, riset internet tiap hari soal sales".
+// Deterministic on purpose: the user always sees and can correct the result before anything is created.
+import { t, type Key } from '../i18n'
+
+export type ContentKind = 'summary' | 'quiz' | 'flashcards' | 'roleplay' | 'simulator' | 'slide_deck' | 'video' | 'audio' | 'scorm'
+
+export const KINDS: ContentKind[] = ['summary', 'quiz', 'flashcards', 'roleplay', 'simulator', 'slide_deck', 'video', 'audio', 'scorm']
+
+// Every kind runs on the engine's agents, in one of two ways:
+// - recurring content production (content_goal): the six Compose kinds, plus audio (a narration
+//   script, played and downloaded in Express) and SCORM (a lesson + quiz pair packaged in Express);
+// - one scheduled run per day or week (run_schedule): video, since the engine renders one video per run.
+export const SCHEDULABLE: ReadonlySet<ContentKind> = new Set(KINDS)
+
+export const kindLabel = (kind: ContentKind) => t(`kind.${kind}` as Key)
+
+// Checked in order; the first match wins, so multi-word phrases come before their parts.
+const KIND_WORDS: [ContentKind, RegExp][] = [
+  // SCORM first: a SCORM module includes a quiz, so "SCORM module with a quiz" is still SCORM.
+  ['scorm', /\b(scorm|skorm|skong|e-?learning)\b/],
+  ['flashcards', /\b(flash ?cards?|kartu (belajar|hafalan))\b/],
+  ['quiz', /\b(kuis|quiz|quizzes|soal latihan|tes|tests?|ujian|exams?)\b/],
+  ['roleplay', /\b(role ?-?plays?|bermain peran)\b/],
+  ['simulator', /\b(simulasi|simulations?|simulators?|skenario|scenarios?)\b/],
+  ['slide_deck', /\b(slides?|presentasi|presentations?|decks?|ppt)\b/],
+  ['video', /\b(videos?)\b/],
+  ['audio', /\b(audio|podcasts?|siniar|narasi|narrations?)\b/],
+  ['summary', /\b(summary|summaries|ringkasan|rangkuman|artikel|articles?|teks|texts?)\b/],
+]
+
+const NUMBER_WORDS: Record<string, number> = {
+  satu: 1, se: 1, sebuah: 1, dua: 2, tiga: 3, empat: 4, lima: 5, enam: 6, tujuh: 7, delapan: 8, sembilan: 9, sepuluh: 10,
+  a: 1, an: 1, one: 1, two: 2, three: 3, four: 4, five: 5, six: 6, seven: 7, eight: 8, nine: 9, ten: 10,
+}
+
+// Monday = 0, as the engine counts.
+const WEEKDAYS: [RegExp, number][] = [
+  [/\b(senin|monday)\b/, 0], [/\b(selasa|tuesday)\b/, 1], [/\b(rabu|wednesday)\b/, 2], [/\b(kamis|thursday)\b/, 3],
+  [/\b(jum'?at|friday)\b/, 4], [/\b(sabtu|saturday)\b/, 5],
+  // "minggu" is both Sunday and "week", so Indonesian Sunday needs "hari minggu".
+  [/\b(hari minggu|sunday)\b/, 6],
+]
+
+export type Per = 'day' | 'week'
+
+export interface ContentRule {
+  type: 'content'
+  kind: ContentKind
+  count: number
+  per: Per
+  topic: string
+  /** The monthly count the instruction asked for, when it had to be turned into a weekly one. */
+  monthly?: number
+}
+
+export interface ResearchRule {
+  type: 'research'
+  cadence: 'daily' | 'weekly'
+  weekday: number
+  topic: string
+  autoApprove: boolean
+}
+
+export type Rule = ContentRule | ResearchRule
+
+export interface ParseResult {
+  rules: Rule[]
+  /** Clauses that said something but matched no rule, so the user can rephrase them. */
+  unknown: string[]
+}
+
+const TOPIC = /\b(?:soal|tentang|mengenai|seputar|terkait|topik|bertema|perihal|about|regarding|covering|related to|on the topic of|topic)\s+(?!latihan\b)(.+)$/
+const FREQUENCY_TAIL = /\b(tiap|setiap|per|sehari|seminggu|every|each|daily|weekly|monthly|a day|a week|a month)\b.*$/
+
+function topicOf(clause: string): string {
+  return clause.match(TOPIC)?.[1].replace(FREQUENCY_TAIL, '').replace(/[\s,]+$/, '').trim() ?? ''
+}
+
+function countOf(clause: string, kindAt: number): number {
+  const before = clause.slice(0, kindAt)
+  const digits = before.match(/(\d+)\s*(?:buah|x|kali|new)?\s*$/)
+  // "0" schedules nothing; the preview shows 1, which the user can still change.
+  if (digits) return Math.max(1, Number(digits[1]))
+  const word = before.match(/(\p{L}+)\s*(?:buah|new)?\s*$/u)?.[1]
+  return (word && NUMBER_WORDS[word]) || 1
+}
+
+function perOf(clause: string): Per | 'month' {
+  if (/\b(per ?hari|tiap hari|setiap hari|sehari|harian|per day|a day|every day|each day|daily)\b/.test(clause)) return 'day'
+  if (/\b(per ?bulan|tiap bulan|setiap bulan|sebulan|bulanan|per month|a month|every month|each month|monthly)\b/.test(clause)) return 'month'
+  return 'week'
+}
+
+function weekdayOf(clause: string): number | null {
+  for (const [re, day] of WEEKDAYS) if (re.test(clause)) return day
+  return null
+}
+
+const CONNECTORS = 'dan|lalu|serta|terus|kemudian|juga|and|then|also|plus'
+// A connector or comma starts a new rule only when a new request follows; "about sales and marketing" stays one topic.
+const NEXT_REQUEST = String.raw`(?=(?:\d|satu|dua|tiga|empat|lima|enam|tujuh|delapan|sembilan|sepuluh|se(?:buah)?\s|one|two|three|four|five|six|seven|eight|nine|ten|an?\s|riset|research|bikin|buat|cari|telusuri|pantau|make|create|generate|search|monitor|tiap|setiap|every|each))`
+const SPLIT = new RegExp(String.raw`[\n.;]+|\s*,\s*(?:(?:${CONNECTORS})\s+)?${NEXT_REQUEST}|\s+(?:${CONNECTORS})\s+${NEXT_REQUEST}`)
+
+function parseClause(clause: string): Rule | null {
+  if (/\b(riset|research|telusuri|cari(?:kan)?|pantau|look up|search|monitor)\b/.test(clause)) {
+    const per = perOf(clause)
+    const day = weekdayOf(clause)
+    const cadence = per === 'day' && day === null ? 'daily' : 'weekly'
+    return { type: 'research', cadence, weekday: day ?? 0, topic: topicOf(clause), autoApprove: true }
+  }
+  for (const [kind, re] of KIND_WORDS) {
+    const m = re.exec(clause)
+    if (!m) continue
+    const count = countOf(clause, m.index)
+    const per = perOf(clause)
+    if (per === 'month') {
+      return { type: 'content', kind, count: Math.max(1, Math.round(count / 4)), per: 'week', topic: topicOf(clause), monthly: count }
+    }
+    return { type: 'content', kind, count, per, topic: topicOf(clause) }
+  }
+  return null
+}
+
+export function parseInstruction(text: string): ParseResult {
+  const clauses = text
+    .toLowerCase()
+    .replace(/[“”"]/g, '')
+    .split(SPLIT)
+    .map(s => s.trim())
+    .filter(Boolean)
+
+  const rules: Rule[] = []
+  const unknown: string[] = []
+  let shared = ''
+  for (const clause of clauses) {
+    const rule = parseClause(clause)
+    if (rule) rules.push(rule)
+    // A clause that only names a topic ("about leadership") applies to the rules around it.
+    else if (topicOf(clause) || /^(soal|tentang|topik|about|topic)\b/.test(clause)) shared = topicOf(clause) || clause.replace(/^\S+\s*/, '')
+    else if (!/^(tolong|bikin|buat|buatkan|ya|please|make|create|ok)$/.test(clause)) unknown.push(clause)
+  }
+
+  // One topic mentioned anywhere also covers rules that did not name their own.
+  const topics = new Set(rules.map(r => r.topic).filter(Boolean))
+  const fallback = shared || (topics.size === 1 ? [...topics][0] : '')
+  for (const r of rules) if (!r.topic) r.topic = fallback
+  return { rules, unknown }
+}
+
+export function weeklyTarget(rule: ContentRule): number {
+  return rule.per === 'day' ? rule.count * 7 : rule.count
+}
+
+/** A video schedule is one engine run per day or per week; other counts have no matching cadence. */
+export function videoCadence(rule: ContentRule): 'daily' | 'weekly' | null {
+  const target = weeklyTarget(rule)
+  return target === 7 ? 'daily' : target === 1 ? 'weekly' : null
+}
+
+export const dayName = (weekday: number) => t(`day.${weekday >= 0 && weekday <= 6 ? weekday : 0}` as Key)
+
+export function describeRule(rule: Rule): string {
+  const about = rule.topic ? t('rule.about', { topic: rule.topic }) : ''
+  if (rule.type === 'research') {
+    const when = rule.cadence === 'daily' ? t('rule.everyDay') : t('rule.everyWeekday', { day: dayName(rule.weekday) })
+    return t('rule.research', { when, about })
+  }
+  return t('rule.content', {
+    kind: kindLabel(rule.kind),
+    count: rule.count,
+    per: t(rule.per === 'day' ? 'ins.perDay' : 'ins.perWeek'),
+    about: about || t('rule.wholeBrain'),
+  })
+}
+
+export const monthNote = (rule: ContentRule) =>
+  rule.monthly ? t('rule.monthNote', { count: rule.monthly, weekly: rule.count }) : null
diff --git a/src/express/results.test.ts b/src/express/results.test.ts
new file mode 100644
index 0000000..64fcd4b
--- /dev/null
+++ b/src/express/results.test.ts
@@ -0,0 +1,54 @@
+import { describe, expect, it } from 'vitest'
+import { correctIndex, questionsOf, toMarkdown, type Material } from './results'
+import { sentencesOf, scriptLang } from '../components/AudioPlayer'
+
+describe('correctIndex', () => {
+  const options = ['Listen first', 'Interrupt', 'Leave']
+
+  it('finds the answer as option text, letter or index', () => {
+    expect(correctIndex(options, 'listen first')).toBe(0)
+    expect(correctIndex(options, 'B')).toBe(1)
+    expect(correctIndex(options, 'C. Leave')).toBe(2)
+    expect(correctIndex(options, '1')).toBe(1)
+  })
+
+  it('returns -1 for an answer outside the options', () => {
+    expect(correctIndex(options, 'D')).toBe(-1)
+    expect(correctIndex([], 'An essay answer')).toBe(-1)
+  })
+})
+
+describe('questionsOf', () => {
+  it('reads the engine’s question shapes', () => {
+    const [q] = questionsOf({ questions: [{ text: 'Q', choices: [{ text: 'x' }, { label: 'y' }], correct_answer: 'y', explanation: 'because' }] })
+    expect(q).toEqual({ question: 'Q', options: ['x', 'y'], answer: 'y', explanation: 'because', correct: 1 })
+  })
+})
+
+describe('toMarkdown', () => {
+  const material = (kind: Material['kind']): Material => ({
+    id: 1, agentId: 1, kind, status: 'ready', revision: 1, parts: [], planTitle: 'Onboarding', composeSetId: null,
+    sources: ['Handbook'], createdAt: '2026-10-01T00:00:00Z', rule: { type: 'content', kind, count: 1, per: 'week', topic: '' },
+  })
+
+  it('writes a SCORM module as the lesson followed by its quiz', () => {
+    const md = toMarkdown(material('scorm'), { title: 'Onboarding', text: 'Welcome.', questions: [{ question: 'Q?', options: ['a', 'b'], answer: 'b' }] })
+    expect(md).toMatch(/^# Onboarding\n\nWelcome\.\n\n## Quiz\n\n1\. Q\?\n {3}- a\n {3}- b\n/)
+    expect(md).toContain('Sources: Handbook')
+  })
+
+  it('writes an audio lesson as its script', () => {
+    expect(toMarkdown(material('audio'), { text: 'Hello team.' })).toBe('# Onboarding\n\nHello team.\n\n---\nSources: Handbook\n')
+  })
+})
+
+describe('audio script helpers', () => {
+  it('splits a script into sentences without Markdown', () => {
+    expect(sentencesOf('# Intro\nHello **team**. Ready? Let’s go!\n\n- one')).toEqual(['Intro', 'Hello team.', 'Ready?', 'Let’s go!', 'one'])
+  })
+
+  it('guesses the script language for the voice', () => {
+    expect(scriptLang('Ini adalah pelajaran yang penting untuk kita semua dan tim.')).toBe('id')
+    expect(scriptLang('This is the lesson that we will share with the team.')).toBe('en')
+  })
+})
diff --git a/src/express/results.ts b/src/express/results.ts
new file mode 100644
index 0000000..79f8d17
--- /dev/null
+++ b/src/express/results.ts
@@ -0,0 +1,331 @@
+// Results = everything the Express agents produced: Compose materials (material-drafts, titled by the
+// content plan item that ordered them), rendered videos (video-drafts) and web sources found by
+// research (source-drafts). Audio and SCORM are Express kinds built from Compose outputs: an audio
+// lesson is a narration summary, a SCORM module is the summary + quiz pair one plan item produced.
+import { request } from '../api/client'
+import { t } from '../i18n'
+import { kindLabel, type ContentKind, type Rule } from './parse'
+import { expressAgents, PLAN_ACTIVE, productionStatus, type Schedule } from './schedules'
+
+const AGENTS = '/organizations/current/agents'
+
+export type MaterialStatus = 'preparing' | 'generating' | 'ready' | 'failed' | 'accepted' | 'rejected'
+
+interface RawMaterial {
+  id: number
+  agent_id: number
+  run_id: number
+  output_kind: ContentKind
+  status: MaterialStatus
+  revision: number
+  compose_set_id: number | null
+  sources: { document_id: number; title: string }[]
+  created_at: string
+}
+
+/** One engine draft behind a result; a SCORM module has two (lesson and quiz). */
+export interface Part { id: number; revision: number; kind: ContentKind; status: MaterialStatus }
+
+export interface Material {
+  id: number
+  agentId: number
+  /** What the user asked for, which for audio and SCORM is not the engine's output kind. */
+  kind: ContentKind
+  status: MaterialStatus
+  revision: number
+  parts: Part[]
+  planTitle: string | null
+  composeSetId: number | null
+  sources: string[]
+  createdAt: string
+  rule: Rule
+  video?: { url: string | null; progress: number; credits: number | null }
+}
+
+// Labels are resolved at render time so they follow the UI language.
+export const titleOf = (m: Material) => m.planTitle ?? [kindLabel(m.kind), m.rule.topic].filter(Boolean).join(' · ')
+
+// Ids come from separate engine tables (material drafts, video drafts, plan items) and repeat across them.
+export const materialKey = (m: Material) => `${m.kind === 'video' ? 'video' : 'material'}-${m.agentId}-${m.id}`
+
+export type MaterialContent = Record<string, unknown>
+
+export interface FoundSource {
+  id: number
+  agentId: number
+  title: string
+  url: string | null
+  status: 'pending' | 'accepted' | 'rejected' | string
+  revision: number
+  preview: string
+  documentId: number | null
+  createdAt: string
+  rule: Rule
+}
+
+interface RawSource {
+  id: number
+  agent_id: number
+  title: string
+  source_url: string | null
+  status: string
+  revision: number
+  preview: string
+  document_id: number | null
+  captured_at: string
+}
+
+// The least finished part decides: a module is ready only when both its lesson and quiz are.
+const ORDER: MaterialStatus[] = ['failed', 'rejected', 'preparing', 'generating', 'ready', 'accepted']
+const combined = (parts: Part[]) => ORDER.find(s => parts.some(p => p.status === s)) ?? 'preparing'
+
+async function materialsOf(schedule: Schedule): Promise<Material[]> {
+  if (schedule.rule.type === 'content' && schedule.rule.kind === 'video') return videosOf(schedule)
+  const { agent, rule } = schedule
+  const kind = rule.type === 'content' ? rule.kind : 'summary'
+  const [drafts, status] = await Promise.all([
+    request<RawMaterial[]>(`${AGENTS}/${agent.id}/material-drafts`),
+    productionStatus(agent.id).catch(() => null),
+  ])
+  const titles = new Map<number, string>()
+  for (const plan of status?.plans ?? []) {
+    for (const item of plan.items ?? []) if (item.run_id) titles.set(item.run_id, item.title)
+  }
+  // One run makes one result; its drafts are its parts (one, or the lesson + quiz of a SCORM module).
+  const byRun = new Map<number, RawMaterial[]>()
+  for (const d of drafts) byRun.set(d.run_id, [...(byRun.get(d.run_id) ?? []), d])
+  const made = [...byRun.values()].map((group): Material => {
+    // The lesson comes first: it carries the title, sources and Compose set of the whole module.
+    group.sort((a, b) => Number(b.output_kind === 'summary') - Number(a.output_kind === 'summary'))
+    const [d] = group
+    const parts = group.map(g => ({ id: g.id, revision: g.revision, kind: g.output_kind, status: g.status }))
+    return {
+      id: d.id, agentId: agent.id, kind: kind === 'audio' || kind === 'scorm' ? kind : d.output_kind,
+      status: combined(parts), revision: d.revision, parts,
+      planTitle: titles.get(d.run_id) ?? null,
+      composeSetId: d.compose_set_id, sources: d.sources.map(s => s.title), createdAt: d.created_at, rule,
+    }
+  })
+  // Planned pieces have no draft until generation starts; show them as in progress so a running
+  // production is visible here from the moment the topics are chosen.
+  const started = new Set(drafts.map(d => d.run_id))
+  const planned = (status?.plans ?? []).filter(p => PLAN_ACTIVE.has(p.status)).flatMap(p => p.items)
+    .filter(i => ['proposed', 'approved', 'queued', 'generating'].includes(i.status) && !(i.run_id && started.has(i.run_id)))
+    .map((i): Material => ({
+      id: -i.id, agentId: agent.id, kind, status: 'preparing', revision: 0, parts: [],
+      planTitle: i.title, composeSetId: null, sources: [], createdAt: new Date().toISOString(), rule,
+    }))
+  return [...planned, ...made]
+}
+
+interface RawVideo {
+  id: number
+  run_id: number
+  status: string
+  title: string | null
+  progress_percentage: number
+  video_url: string | null
+  sources: { document_id: number; title: string }[]
+  actual_credits: number | null
+  created_at: string
+}
+
+// Video drafts move through script, storyboard, clips and render before they are ready to review.
+function videoStatus(s: string): MaterialStatus {
+  if (s === 'ready' || s === 'accepted' || s === 'rejected') return s
+  if (s === 'failed' || s === 'cancelled') return 'failed'
+  return 'generating'
+}
+
+async function videosOf({ agent, rule }: Schedule): Promise<Material[]> {
+  const drafts = await request<RawVideo[]>(`${AGENTS}/${agent.id}/video-drafts`)
+  return drafts.map(d => {
+    const status = videoStatus(d.status)
+    return {
+      id: d.id, agentId: agent.id, kind: 'video', status, revision: 0,
+      parts: [{ id: d.id, revision: 0, kind: 'video', status }],
+      planTitle: d.title, composeSetId: null, sources: d.sources.map(s => s.title), createdAt: d.created_at, rule,
+      video: { url: d.video_url, progress: d.progress_percentage, credits: d.actual_credits },
+    }
+  })
+}
+
+async function sourcesOf({ agent, rule }: Schedule): Promise<FoundSource[]> {
+  const drafts = await request<RawSource[]>(`${AGENTS}/${agent.id}/source-drafts`)
+  return drafts.map(d => ({
+    id: d.id, agentId: agent.id, title: d.title, url: d.source_url, status: d.status, revision: d.revision,
+    preview: d.preview, documentId: d.document_id, createdAt: d.captured_at, rule,
+  }))
+}
+
+export async function listResults(): Promise<{ materials: Material[]; sources: FoundSource[] }> {
+  const schedules = await expressAgents({ archived: true })
+  const [materials, sources] = await Promise.all([
+    Promise.all(schedules.filter(s => s.rule.type === 'content').map(materialsOf)),
+    Promise.all(schedules.filter(s => s.rule.type === 'research').map(sourcesOf)),
+  ])
+  const newest = <T extends { createdAt: string }>(a: T, b: T) => b.createdAt.localeCompare(a.createdAt)
+  return { materials: materials.flat().sort(newest), sources: sources.flat().sort(newest) }
+}
+
+const draftContent = (m: Material, id: number) =>
+  request<{ content?: MaterialContent; output_id?: number }>(`${AGENTS}/${m.agentId}/material-drafts/${id}`)
+
+// outputId is the generated Compose output (e.g. the SlideDeck id), which owns the file exports.
+// A SCORM module merges its parts: the lesson's title and text with the quiz's questions.
+export async function materialContent(m: Material): Promise<{ content: MaterialContent | null; outputId: number | null }> {
+  if (m.kind === 'video') return { content: { title: m.planTitle ?? '' }, outputId: null }
+  const [first, ...rest] = await Promise.all(m.parts.map(p => draftContent(m, p.id)))
+  if (!first?.content) return { content: null, outputId: null }
+  const content = { ...first.content }
+  for (const r of rest) if (r.content?.questions) content.questions = r.content.questions
+  return { content, outputId: first.output_id ?? null }
+}
+
+// The engine renders slide decks to PPTX itself; other kinds have no file export there.
+export const exportPptx = (deckId: number) => request<Blob>(`/slide-deck/${deckId}/export`, { method: 'POST', as: 'blob' })
+
+// Every part waiting for review gets the same decision, so a SCORM module is approved as one.
+export async function decideMaterial(m: Material, decision: 'accept' | 'reject') {
+  for (const p of m.parts.filter(p => p.status === 'ready')) {
+    if (m.kind === 'video') await request(`${AGENTS}/${m.agentId}/video-drafts/${p.id}/review`, { method: 'POST', json: { decision } })
+    else await request(`${AGENTS}/${m.agentId}/material-drafts/${p.id}/decision`, { method: 'POST', json: { expected_revision: p.revision, decision } })
+  }
+}
+
+// Accepting a source only adds it to the Library; its knowledge build is confirmed on the Brain page.
+export const reviewSource = (s: FoundSource, decision: 'accept' | 'reject') =>
+  request(`${AGENTS}/${s.agentId}/source-drafts/${s.id}/review`, { method: 'POST', json: { expected_revision: s.revision, decision } })
+
+export const isWorking = (m: Material) => m.status === 'preparing' || m.status === 'generating'
+
+// ── Export ──
+
+const str = (v: unknown) => (typeof v === 'string' ? v : v == null ? '' : JSON.stringify(v))
+const list = (v: unknown): unknown[] => (Array.isArray(v) ? v : v == null || v === '' ? [] : [v])
+
+export interface Question {
+  question: string
+  options: string[]
+  answer: string
+  explanation: string
+  /** Index of the correct option, or -1 when the answer is not one of the options (an essay). */
+  correct: number
+}
+
+// The engine gives the answer as the option text, its letter ("B", "B. …") or its index.
+export function correctIndex(options: string[], answer: string): number {
+  const exact = options.findIndex(o => o.trim().toLowerCase() === answer.trim().toLowerCase())
+  if (exact >= 0) return exact
+  const letter = answer.trim().match(/^([A-Ha-h])(?:[.)\s:]|$)/)?.[1]
+  if (letter) {
+    const i = letter.toUpperCase().charCodeAt(0) - 65
+    if (i < options.length) return i
+  }
+  const index = /^\d+$/.test(answer.trim()) ? Number(answer) : -1
+  return index >= 0 && index < options.length ? index : -1
+}
+
+export function questionsOf(content: MaterialContent): Question[] {
+  return list(content.questions).map(raw => {
+    const q = (raw ?? {}) as Record<string, unknown>
+    const options = list(q.options ?? q.choices).map(o => (typeof o === 'object' && o ? str((o as Record<string, unknown>).text ?? (o as Record<string, unknown>).label) : str(o)))
+    const answer = str(q.correct_answer ?? q.answer)
+    return { question: str(q.question ?? q.text ?? q.prompt), options, answer, explanation: str(q.explanation), correct: correctIndex(options, answer) }
+  })
+}
+
+export interface Slide { title: string; bullets: string[]; notes: string }
+
+export function slidesOf(content: MaterialContent): Slide[] {
+  return list(content.slides).map(raw => {
+    const s = (raw ?? {}) as Record<string, unknown>
+    const c = ((s.content ?? s) as Record<string, unknown>) ?? {}
+    return { title: str(c.title ?? s.title), bullets: list(c.bullets).map(str), notes: str(s.speaker_notes ?? s.notes) }
+  })
+}
+
+export const textOf = str
+export const listOf = list
+
+export function toMarkdown(m: Material, content: MaterialContent): string {
+  const out = [`# ${str(content.title) || titleOf(m)}`, '']
+  if (m.kind === 'scorm') out.push(str(content.text), '', `## ${t('res.quiz')}`, '')
+  if (m.kind === 'summary' || m.kind === 'audio') out.push(str(content.text))
+  else if (m.kind === 'quiz' || m.kind === 'scorm') {
+    questionsOf(content).forEach((q, i) => {
+      out.push(`${i + 1}. ${q.question}`, ...q.options.map(o => `   - ${o}`))
+      if (q.answer) out.push(`   ${t('res.answer')}: ${q.answer}`)
+      if (q.explanation) out.push(`   ${q.explanation}`)
+      out.push('')
+    })
+  } else if (m.kind === 'flashcards') {
+    for (const c of list(content.cards) as Record<string, unknown>[]) out.push(`**${str(c.front)}**`, str(c.back), '')
+  } else if (m.kind === 'slide_deck') {
+    if (content.description) out.push(str(content.description), '')
+    slidesOf(content).forEach((s, i) => out.push(`## ${i + 1}. ${s.title}`, ...s.bullets.map(b => `- ${b}`), ''))
+  } else {
+    for (const [key, value] of Object.entries(content)) {
+      if (key === 'title') continue
+      out.push(`## ${key.replace(/_/g, ' ')}`, ...list(value).map(v => (Array.isArray(value) ? `- ${str(v)}` : str(v))), '')
+    }
+  }
+  if (m.sources.length) out.push('', '---', `${t('res.sources')}: ${m.sources.join(', ')}`)
+  return out.join('\n').trim() + '\n'
+}
+
+export function download(name: string, data: string | Blob) {
+  const url = URL.createObjectURL(typeof data === 'string' ? new Blob([data], { type: 'text/markdown;charset=utf-8' }) : data)
+  const a = Object.assign(document.createElement('a'), { href: url, download: name })
+  a.click()
+  // Revoked later: Safari and Firefox may not have started reading the file when click() returns.
+  setTimeout(() => URL.revokeObjectURL(url), 60_000)
+}
+
+export const fileName = (m: Material, ext: 'md' | 'pptx' | 'txt' | 'zip' | 'mp4') =>
+  `${titleOf(m).toLowerCase().replace(/[^a-z0-9]+/g, '-').replace(/^-|-$/g, '').slice(0, 60) || m.kind}.${ext}`
+
+// PDF without a PDF library: print a standalone page from a hidden iframe, so the browser's own
+// "Save as PDF" lays out the text (real, selectable text with proper fonts and page breaks).
+export function printPdf(title: string, bodyHtml: string) {
+  const frame = Object.assign(document.createElement('iframe'), { title: 'print' })
+  frame.style.cssText = 'position:fixed;right:0;bottom:0;width:0;height:0;border:0'
+  document.body.append(frame)
+  const doc = frame.contentDocument!
+  doc.open()
+  doc.write(`<!doctype html><html><head><meta charset="utf-8"><title>${escapeHtml(title)}</title><style>${PRINT_CSS}</style></head><body>${bodyHtml}</body></html>`)
+  doc.close()
+  const win = frame.contentWindow!
+  // Remove the frame once the print dialog is done; the timeout covers browsers without afterprint.
+  const cleanup = () => setTimeout(() => frame.remove(), 500)
+  win.addEventListener('afterprint', cleanup, { once: true })
+  setTimeout(() => { win.focus(); win.print(); cleanup() }, 100)
+}
+
+const escapeHtml = (s: string) => s.replace(/[&<>"]/g, c => ({ '&': '&amp;', '<': '&lt;', '>': '&gt;', '"': '&quot;' })[c]!)
+
+const PRINT_CSS = `
+@page{size:A4;margin:18mm 16mm}
+*{box-sizing:border-box}
+body{font:11pt/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:#1d2a3b;margin:0}
+header{border-bottom:2px solid #2563eb;padding-bottom:10px;margin-bottom:18px}
+header small{display:block;font-size:8.5pt;letter-spacing:.08em;text-transform:uppercase;color:#2563eb;font-weight:600}
+header p{margin:6px 0 0;font-size:9pt;color:#6b7a90}
+h1{font-size:20pt;line-height:1.3;margin:4px 0 0}
+article>h1{display:none}
+h2{font-size:13pt;margin:18px 0 6px;break-after:avoid}
+p{margin:0 0 9px}
+ul,ol{margin:0 0 10px;padding-left:20px}
+li{margin-bottom:4px}
+.quiz-list>li{margin-bottom:14px;break-inside:avoid}
+.quiz-list li.correct{font-weight:600;color:#127a55}
+.quiz-list li.correct:after{content:" ✓"}
+.muted{color:#6b7a90;font-size:10pt}
+.flashcards{display:grid;grid-template-columns:1fr 1fr;gap:10px}
+.flashcard{border:1px solid #d9e2ef;border-radius:8px;padding:10px 12px;break-inside:avoid;display:flex;flex-direction:column;gap:6px}
+.flashcard span{color:#4d5d73}
+.slide-preview{border:1px solid #d9e2ef;border-radius:8px;padding:12px 14px;margin-bottom:10px;break-inside:avoid}
+.slide-preview small{font-size:8pt;letter-spacing:.08em;text-transform:uppercase;color:#8a97a8}
+.slide-preview h2{margin-top:2px}
+footer{margin-top:24px;padding-top:8px;border-top:1px solid #e3e9f2;font-size:8.5pt;color:#8a97a8}
+`
diff --git a/src/express/schedules.test.ts b/src/express/schedules.test.ts
new file mode 100644
index 0000000..cef1129
--- /dev/null
+++ b/src/express/schedules.test.ts
@@ -0,0 +1,88 @@
+import { describe, expect, it } from 'vitest'
+import type { ContentRule, ResearchRule } from './parse'
+import { budgetFor, canSchedule, configFor, ruleOf, VIDEO, type ExpressAgent } from './schedules'
+
+const rule = (kind: ContentRule['kind'], count = 2, per: ContentRule['per'] = 'week', topic = 'onboarding'): ContentRule =>
+  ({ type: 'content', kind, count, per, topic })
+
+// What the engine sends back for an agent created from configFor.
+function agentFrom(config: ReturnType<typeof configFor>): ExpressAgent {
+  const c = config as Record<string, unknown>
+  return {
+    id: 1, status: 'active', next_run_at: null, created_at: '2026-10-01T00:00:00Z', auto_approve_sources: false,
+    name: c.name as string, goal: c.goal as string,
+    enabled_tools: c.enabled_tools as string[],
+    material_outputs: (c.material_outputs as ExpressAgent['material_outputs']) ?? [],
+    content_goal: (c.content_goal as ExpressAgent['content_goal']) ?? null,
+    video_options: (c.video_options as ExpressAgent['video_options']) ?? null,
+    run_schedule: (c.run_schedule as ExpressAgent['run_schedule']) ?? null,
+    run_budget: c.run_budget as number, monthly_budget: c.monthly_budget as number,
+  }
+}
+
+describe('configFor', () => {
+  it('makes an audio schedule a narration summary', () => {
+    const config = configFor(rule('audio')) as Record<string, unknown>
+    expect(config.material_outputs).toEqual([{ kind: 'summary', options: {} }])
+    expect(config.instructions).toMatch(/narration script/)
+    expect(config.name).toBe('Express · 2 audio per week · onboarding')
+  })
+
+  it('makes a SCORM schedule a lesson + quiz pair', () => {
+    const config = configFor(rule('scorm')) as Record<string, unknown>
+    expect((config.material_outputs as { kind: string }[]).map(o => o.kind)).toEqual(['summary', 'quiz'])
+  })
+
+  it('makes a video schedule a run-scheduled Video Studio agent', () => {
+    const config = configFor(rule('video', 1, 'day'), 100) as Record<string, unknown>
+    expect(config.enabled_tools).toContain('studio.create_video')
+    expect(config).not.toHaveProperty('content_goal')
+    expect(config.run_schedule).toMatchObject({ cadence: 'daily' })
+    expect(config.video_options).toMatchObject({ max_scenes: VIDEO.scenes, max_duration_seconds: VIDEO.seconds })
+    expect(config.run_budget).toBe(110)
+    expect(config.monthly_budget).toBe(110 * 31)
+  })
+
+  it('keeps budgets ordered run ≤ weekly ≤ monthly', () => {
+    for (const kind of ['summary', 'quiz', 'audio', 'scorm'] as const) {
+      for (const count of [1, 5, 50]) {
+        const b = budgetFor(rule(kind, count))
+        expect(b.run).toBeLessThanOrEqual(b.weekly!)
+        expect(b.weekly!).toBeLessThanOrEqual(b.monthly)
+      }
+    }
+  })
+})
+
+describe('ruleOf', () => {
+  it.each([
+    rule('summary', 3),
+    rule('audio', 2),
+    rule('scorm', 1),
+    rule('quiz', 1, 'day'),
+    rule('video', 1, 'week'),
+    rule('video', 1, 'day'),
+  ])('reads back the rule a schedule was created from: $count $kind per $per', r => {
+    expect(ruleOf(agentFrom(configFor(r, 50)))).toEqual(r)
+  })
+
+  it('reads back a research rule', () => {
+    const r: ResearchRule = { type: 'research', cadence: 'weekly', weekday: 2, topic: 'sales', autoApprove: true }
+    const agent = { ...agentFrom(configFor(r)), auto_approve_sources: true }
+    expect(ruleOf(agent)).toEqual(r)
+  })
+})
+
+describe('canSchedule', () => {
+  it('accepts every kind within limits', () => {
+    expect(canSchedule(rule('audio', 5))).toBe(true)
+    expect(canSchedule(rule('scorm', 2))).toBe(true)
+    expect(canSchedule(rule('video', 1))).toBe(true)
+  })
+
+  it('rejects video counts without a cadence and production over 50 a week', () => {
+    expect(canSchedule(rule('video', 3))).toBe(false)
+    expect(canSchedule(rule('summary', 8, 'day'))).toBe(false)
+    expect(canSchedule(rule('summary', 0))).toBe(false)
+  })
+})
diff --git a/src/express/schedules.ts b/src/express/schedules.ts
new file mode 100644
index 0000000..77e5bbb
--- /dev/null
+++ b/src/express/schedules.ts
@@ -0,0 +1,316 @@
+// Each Express schedule is one engine agent. Content rules use the engine's recurring production
+// (content_goal: weekly plans with novelty checks, started automatically); research and video rules
+// use run_schedule (one run per day or week; a video run renders one video).
+import { opKey, request } from '../api/client'
+import { listDocuments, type Agent, type RunSchedule } from '../api/engine'
+import { getLang } from '../i18n'
+import { KINDS, SCHEDULABLE, videoCadence, weeklyTarget, type ContentKind, type ContentRule, type Per, type ResearchRule, type Rule } from './parse'
+
+const AGENTS = '/organizations/current/agents'
+export const PREFIX = 'Express · '
+const TIMEZONE = 'Asia/Jakarta'
+
+export interface ContentGoal {
+  enabled: boolean
+  weekly_target: number
+  execution_mode: 'automatic' | 'review'
+  production_cadence: 'spread' | 'weekly' | 'manual'
+  production_hour: number
+  production_minute: number
+  production_weekday: number
+  weekly_budget: number
+}
+
+export interface VideoOptions {
+  max_scenes: number
+  max_duration_seconds: number
+  art_style: 'realistic' | 'cartoon' | 'anime' | 'watercolor' | '3d'
+  language: 'English' | 'Bahasa Indonesia'
+}
+
+export interface ExpressAgent extends Agent {
+  next_run_at: string | null
+  enabled_tools: string[]
+  material_outputs: { kind: ContentKind; options: Record<string, unknown> }[]
+  content_goal: ContentGoal | null
+  video_options: VideoOptions | null
+  auto_approve_sources: boolean
+  run_budget: number
+  monthly_budget: number
+  created_at: string
+}
+
+export interface Schedule {
+  agent: ExpressAgent
+  rule: Rule
+  active: boolean
+}
+
+// The per-day/per-week wording is not part of the engine config, so it travels in the agent name.
+// Names stay in English whatever the UI language, so they parse the same for every viewer.
+function scheduleName(rule: Rule): string {
+  const topic = rule.topic ? ` · ${rule.topic}` : ''
+  if (rule.type === 'research') return `${PREFIX}Research ${rule.cadence}${topic}`.slice(0, 120)
+  return `${PREFIX}${rule.count} ${rule.kind} per ${rule.per}${topic}`.slice(0, 120)
+}
+
+const isKind = (k: string | undefined): k is ContentKind => KINDS.includes(k as ContentKind)
+
+export function ruleOf(agent: ExpressAgent): Rule {
+  const topic = agent.name.split(' · ').slice(2).join(' · ')
+  if (agent.enabled_tools.includes('studio.create_video')) {
+    const daily = agent.run_schedule?.cadence === 'daily'
+    return { type: 'content', kind: 'video', count: 1, per: daily ? 'day' : 'week', topic }
+  }
+  if (agent.content_goal?.enabled && agent.material_outputs[0]) {
+    // " per hari" comes from schedules created before names were in English.
+    const per: Per = / per (day|hari)\b/.test(agent.name) ? 'day' : 'week'
+    const target = agent.content_goal.weekly_target
+    // Audio and SCORM are Express kinds made of Compose outputs, so the name carries the kind.
+    const named = agent.name.match(/^Express · \d+ (\w+) per /)?.[1]
+    const kind = isKind(named) ? named : agent.material_outputs[0].kind
+    return { type: 'content', kind, per, count: per === 'day' ? Math.max(1, Math.round(target / 7)) : target, topic }
+  }
+  const s = agent.run_schedule ?? { cadence: 'off' }
+  return { type: 'research', cadence: s.cadence === 'weekly' ? 'weekly' : 'daily', weekday: s.weekday ?? 0, topic, autoApprove: agent.auto_approve_sources }
+}
+
+// Archived schedules are gone from the Schedule page, but what they produced still belongs on Results.
+export async function expressAgents({ archived = false } = {}): Promise<Schedule[]> {
+  const agents = await request<ExpressAgent[]>(AGENTS)
+  return agents
+    .filter(a => a.name.startsWith(PREFIX) && (archived || a.status !== 'archived'))
+    .sort((a, b) => b.created_at.localeCompare(a.created_at))
+    .map(agent => ({ agent, rule: ruleOf(agent), active: agent.status === 'active' }))
+}
+
+export const listSchedules = () => expressAgents()
+
+/** Schedules made of one engine run per slot (research, video), rather than weekly production plans. */
+export const isRunSchedule = (rule: Rule) => rule.type === 'research' || rule.kind === 'video'
+
+// Video length is fixed per schedule: 4 scenes, 40 seconds in all (the engine allows 4–15 s per scene).
+export const VIDEO = { scenes: 4, seconds: 40 }
+
+export interface VideoQuote { max_scenes: number; max_total_seconds: number; max_credits: number }
+
+/** The current price ceiling of one video; the engine pins and rechecks it when a run starts. */
+export const videoQuote = () =>
+  request<VideoQuote>(`${AGENTS}/video-quote?scenes=${VIDEO.scenes}&duration_seconds=${VIDEO.seconds}`)
+
+// Credit limits. The engine requires run ≤ weekly ≤ monthly; a run is one planned item, one research
+// pass, or one video. A SCORM item is two Compose outputs (lesson + quiz), so it gets twice the room.
+export function budgetFor(rule: Rule, videoCredits = 0) {
+  if (rule.type === 'research') {
+    const run = 50
+    return { run, weekly: null, monthly: rule.cadence === 'daily' ? run * 31 : run * 5 }
+  }
+  if (rule.kind === 'video') {
+    // A little headroom over today's quote, so a small price change does not stop the schedule.
+    const run = Math.max(1, Math.ceil((videoCredits * 11) / 10))
+    return { run, weekly: null, monthly: videoCadence(rule) === 'daily' ? run * 31 : run * 5 }
+  }
+  const perItem = rule.kind === 'scorm' ? 40 : 20
+  const weekly = Math.max(rule.kind === 'scorm' ? 120 : 60, weeklyTarget(rule) * perItem)
+  return { run: Math.min(rule.kind === 'scorm' ? 60 : 30, weekly), weekly, monthly: weekly * 5 }
+}
+
+const KIND_TEXT: Record<ContentKind, string> = {
+  summary: 'summaries', quiz: 'quizzes', flashcards: 'flashcard sets', roleplay: 'roleplay scenarios',
+  simulator: 'simulations', slide_deck: 'slide decks', video: 'short explainer videos', audio: 'audio lessons',
+  scorm: 'e-learning modules (a lesson with a quiz that checks it)',
+}
+
+// What each Express kind asks of the engine's Compose outputs.
+const KIND_BRIEF: Partial<Record<ContentKind, string>> = {
+  audio: 'Each summary is the narration script of an audio lesson of about 3 to 5 minutes. Write it to be read aloud: '
+    + 'conversational, short sentences, a friendly opening and a short recap at the end. No headings, bullet points, tables or Markdown.',
+  scorm: 'Each lesson summary and its quiz form one e-learning module: the quiz checks exactly what the summary teaches.',
+  video: 'Each video explains one practical idea from the Brain in plain language for employees.',
+}
+
+function outputsFor(kind: ContentKind): ExpressAgent['material_outputs'] {
+  if (kind === 'audio') return [{ kind: 'summary', options: {} }]
+  if (kind === 'scorm') return [{ kind: 'summary', options: {} }, { kind: 'quiz', options: { question_count: 10, question_type: 'multiple_choice_only' } }]
+  return [{ kind, options: {} }]
+}
+
+// The agent's brief is in English; the content language follows the UI language at creation time.
+function goalText(rule: Rule): string {
+  const about = rule.topic ? ` about ${rule.topic}` : ''
+  if (rule.type === 'research') {
+    return `Research the public internet${about || ' for learning topics relevant to the L&D team'} and add new, relevant public sources to the team's Brain.`
+  }
+  return `Create new learning ${KIND_TEXT[rule.kind]}${about} from the L&D team's Brain, without repeating content that already exists.`
+}
+
+function instructionsFor(rule: Rule): string {
+  const language = getLang() === 'id' ? 'Write all content in Bahasa Indonesia.' : 'Write all content in English.'
+  const brief = rule.type === 'content' ? KIND_BRIEF[rule.kind] : undefined
+  return [rule.topic && `Focus on the topic: ${rule.topic}.`, brief, language].filter(Boolean).join(' ')
+}
+
+export function configFor(rule: Rule, videoCredits = 0) {
+  const budget = budgetFor(rule, videoCredits)
+  const common = {
+    name: scheduleName(rule),
+    goal: goalText(rule),
+    instructions: instructionsFor(rule),
+    timezone: TIMEZONE,
+    run_budget: budget.run,
+    monthly_budget: budget.monthly,
+  }
+  if (rule.type === 'research') {
+    return {
+      ...common,
+      enabled_tools: ['knowledge.retrieve', 'compose.graph.retrieve', 'browse.search', 'library.add_url'],
+      research_options: { max_results: 5 },
+      // Express is hands-off: accepted sources go straight into the Brain unless the user unticks this.
+      auto_approve_sources: rule.autoApprove,
+      run_schedule: researchSchedule(rule),
+    }
+  }
+  if (rule.kind === 'video') {
+    return {
+      ...common,
+      enabled_tools: ['knowledge.retrieve', 'compose.graph.retrieve', 'studio.create_video'],
+      video_options: {
+        max_scenes: VIDEO.scenes,
+        max_duration_seconds: VIDEO.seconds,
+        art_style: 'realistic',
+        language: getLang() === 'id' ? 'Bahasa Indonesia' : 'English',
+      } satisfies VideoOptions,
+      run_schedule: { cadence: videoCadence(rule) ?? 'weekly', hour: 9, minute: 0, weekday: 0 } satisfies RunSchedule,
+    }
+  }
+  return {
+    ...common,
+    enabled_tools: ['knowledge.retrieve', 'compose.graph.retrieve', 'compose.create_material'],
+    material_outputs: outputsFor(rule.kind),
+    content_goal: {
+      enabled: true,
+      weekly_target: weeklyTarget(rule),
+      execution_mode: 'automatic',
+      // "spread": the engine picks delivery days; a daily rule (target ≥ 7) produces every day.
+      production_cadence: 'spread',
+      production_hour: 9,
+      production_minute: 0,
+      weekly_budget: budget.weekly!,
+    } satisfies Partial<ContentGoal>,
+  }
+}
+
+const researchSchedule = (rule: ResearchRule): RunSchedule =>
+  ({ cadence: rule.cadence, hour: 7, minute: 0, weekday: rule.weekday })
+
+export function canSchedule(rule: Rule): rule is ResearchRule | ContentRule {
+  if (rule.type === 'research') return true
+  if (rule.count < 1) return false
+  if (rule.kind === 'video') return videoCadence(rule) !== null
+  return SCHEDULABLE.has(rule.kind) && weeklyTarget(rule) <= 50
+}
+
+// The production corpus is the agent's own sources, so every ready Brain document is attached.
+async function attachBrain(agentId: number) {
+  const docs = (await listDocuments()).filter(d => d.knowledge === 'ready')
+  for (const d of docs) {
+    await request(`${AGENTS}/${agentId}/knowledge-sources`, { method: 'PUT', json: { kind: 'document', source_id: d.docId } })
+      .catch(() => undefined) // a document someone else cannot share is skipped, not fatal
+  }
+  return docs.length
+}
+
+export async function createSchedule(rule: Rule): Promise<ExpressAgent> {
+  // A video schedule's run budget is today's price of one video, so it is fetched first.
+  const credits = rule.type === 'content' && rule.kind === 'video' ? (await videoQuote()).max_credits : 0
+  const agent = await request<ExpressAgent>(AGENTS, { method: 'POST', json: configFor(rule, credits) })
+  await attachBrain(agent.id)
+  // Activating approves the production rules as they stand; until then nothing runs.
+  return request<ExpressAgent>(`${AGENTS}/${agent.id}/activate`, { method: 'POST' })
+}
+
+/** Changing a rule changes what was approved, so the agent is re-activated right after. */
+export async function updateTopic(schedule: Schedule, topic: string): Promise<ExpressAgent> {
+  const rule = { ...schedule.rule, topic: topic.trim() }
+  const { name, goal, instructions } = configFor(rule)
+  await request(`${AGENTS}/${schedule.agent.id}`, { method: 'PATCH', json: { name, goal, instructions } })
+  await attachBrain(schedule.agent.id)
+  return request<ExpressAgent>(`${AGENTS}/${schedule.agent.id}/${schedule.active ? 'activate' : 'pause'}`, { method: 'POST' })
+}
+
+export const pauseSchedule = (id: number) => request<ExpressAgent>(`${AGENTS}/${id}/pause`, { method: 'POST' })
+export async function resumeSchedule(id: number) {
+  await attachBrain(id)
+  return request<ExpressAgent>(`${AGENTS}/${id}/activate`, { method: 'POST' })
+}
+export const archiveSchedule = (id: number) => request<ExpressAgent>(`${AGENTS}/${id}/archive`, { method: 'POST' })
+
+/** Starts one run of a research or video schedule now, outside its daily or weekly slot. */
+export const runNow = (id: number) =>
+  request<{ id: number; status: string }>(`${AGENTS}/${id}/runs`, { method: 'POST', headers: { 'Idempotency-Key': opKey(`run-${id}`) }, json: {} })
+
+// ── Status and history ──
+
+export interface ProductionStatus {
+  enabled: boolean
+  goal_status: string | null
+  planning_available: boolean
+  period: { week_start: string; target: number; ready: number; claimed: number; failed: number; shortfall: number; spent_credits: number } | null
+  plans: ContentPlan[]
+}
+
+export interface ContentPlan {
+  id: number
+  revision: number
+  status: 'quoted' | 'planning' | 'review' | 'approved' | 'running' | 'completed' | 'paused' | 'failed' | 'cancelled'
+  target: number
+  error_code: string | null
+  planning_quote: { credits: number | null }
+  items: PlanItem[]
+}
+
+export interface PlanItem {
+  id: number
+  status: 'proposed' | 'approved' | 'queued' | 'generating' | 'ready' | 'blocked' | 'failed' | 'skipped' | 'cancelled' | 'rejected'
+  run_id: number | null
+  title: string
+  required_outputs: { kind: ContentKind }[]
+}
+
+const DROPPED = new Set<PlanItem['status']>(['skipped', 'cancelled', 'rejected'])
+
+// One plan's progress, for the Schedule row and the Results banner.
+export function planProgress(plan: ContentPlan) {
+  const items = plan.items.filter(i => !DROPPED.has(i.status))
+  return {
+    total: items.length,
+    ready: items.filter(i => i.status === 'ready').length,
+    failed: items.filter(i => i.status === 'failed' || i.status === 'blocked').length,
+    // The engine may find fewer new topics than asked for; the rest is a shortfall, not an error.
+    shortfall: plan.status === 'planning' ? 0 : Math.max(0, plan.target - items.length),
+  }
+}
+
+export const productionStatus = (id: number) => request<ProductionStatus>(`${AGENTS}/${id}/content`)
+
+// Produce now = the same plan the 09:00 tick would create, just earlier. The engine's tick then
+// approves and starts it within a minute because Express schedules run in automatic mode.
+export const quoteProduction = (id: number, target: number) =>
+  request<ContentPlan>(`${AGENTS}/${id}/content/planning-quotes`, { method: 'POST', headers: { 'Idempotency-Key': opKey(`produce-${id}`) }, json: { target } })
+
+export const confirmProduction = (id: number, plan: ContentPlan) =>
+  request<ContentPlan>(`${AGENTS}/${id}/content/plans/${plan.id}/confirm-planning`, { method: 'POST', json: { revision: plan.revision } })
+
+export const PLAN_ACTIVE = new Set<ContentPlan['status']>(['planning', 'review', 'approved', 'running'])
+
+export interface RunSummary {
+  id: number
+  status: string
+  trigger_kind: string
+  safe_error_code: string | null
+  budget_spent: number | null
+  created_at: string
+  finished_at: string | null
+}
+
+export const listRuns = (id: number) => request<RunSummary[]>(`${AGENTS}/${id}/runs`)
diff --git a/src/express/scorm.test.ts b/src/express/scorm.test.ts
new file mode 100644
index 0000000..cd2a9be
--- /dev/null
+++ b/src/express/scorm.test.ts
@@ -0,0 +1,78 @@
+import { describe, expect, it } from 'vitest'
+import { crc32, manifest, MASTERY, scoHtml, zip, type ScormLabels } from './scorm'
+import type { Question } from './results'
+
+const labels: ScormLabels = {
+  quiz: 'Quiz', submit: 'Check', retry: 'Retry', complete: 'Complete', completed: 'Done', score: 'Score: {score}%.',
+  passed: 'Passed', failed: 'Failed', answerAll: 'Answer all', noLms: 'No LMS',
+}
+
+const question = (q: Partial<Question>): Question =>
+  ({ question: 'Q?', options: ['A', 'B'], answer: 'B', explanation: '', correct: 1, ...q })
+
+// Reads a stored ZIP back through its central directory, as an LMS importer would.
+function unzip(bytes: Uint8Array): Record<string, string> {
+  const view = new DataView(bytes.buffer, bytes.byteOffset, bytes.byteLength)
+  const end = bytes.length - 22
+  expect(view.getUint32(end, true)).toBe(0x06054b50)
+  const count = view.getUint16(end + 10, true)
+  let at = view.getUint32(end + 16, true)
+  const files: Record<string, string> = {}
+  const dec = new TextDecoder()
+  for (let i = 0; i < count; i++) {
+    expect(view.getUint32(at, true)).toBe(0x02014b50)
+    const size = view.getUint32(at + 24, true)
+    const nameLength = view.getUint16(at + 28, true)
+    const offset = view.getUint32(at + 42, true)
+    const name = dec.decode(bytes.subarray(at + 46, at + 46 + nameLength))
+    expect(view.getUint32(offset, true)).toBe(0x04034b50)
+    const dataStart = offset + 30 + view.getUint16(offset + 26, true)
+    const data = bytes.subarray(dataStart, dataStart + size)
+    expect(crc32(data)).toBe(view.getUint32(at + 16, true))
+    files[name] = dec.decode(data)
+    at += 46 + nameLength
+  }
+  return files
+}
+
+describe('crc32', () => {
+  it('matches the standard check value', () => {
+    expect(crc32(new TextEncoder().encode('123456789'))).toBe(0xcbf43926)
+  })
+})
+
+describe('zip', () => {
+  it('round-trips files, including UTF-8 names and content', () => {
+    const files = unzip(zip([{ name: 'a.txt', data: 'hello' }, { name: 'é/b.html', data: '<p>Ringkasan ✓</p>' }]))
+    expect(files).toEqual({ 'a.txt': 'hello', 'é/b.html': '<p>Ringkasan ✓</p>' })
+  })
+})
+
+describe('manifest', () => {
+  it('declares one SCO and the mastery score only when there is a quiz', () => {
+    const withQuiz = manifest('Kepemimpinan & Tim', true, 'm1')
+    expect(withQuiz).toContain('adlcp:scormtype="sco" href="index.html"')
+    expect(withQuiz).toContain(`<adlcp:masteryscore>${MASTERY}</adlcp:masteryscore>`)
+    expect(withQuiz).toContain('<title>Kepemimpinan &amp; Tim</title>')
+    expect(manifest('Lesson', false)).not.toContain('masteryscore')
+  })
+})
+
+describe('scoHtml', () => {
+  it('keeps only scorable questions and cannot break out of its data script', () => {
+    const html = scoHtml({
+      title: 'T', lessonHtml: '<p>x</p>', lang: 'id', labels,
+      questions: [question({ question: '</script><b>' }), question({ options: [], correct: -1, answer: 'essay' })],
+    })
+    const data = JSON.parse(html.match(/<script type="application\/json" id="sco-data">(.*?)<\/script>/s)![1])
+    expect(data.quiz).toEqual([{ q: '</script><b>', o: ['A', 'B'], c: 1, e: '' }])
+    expect(data.mastery).toBe(MASTERY)
+    expect(html).toContain('id="quiz-form"')
+  })
+
+  it('offers a completion button when there is no quiz', () => {
+    const html = scoHtml({ title: 'T', lessonHtml: '', questions: [], lang: 'en', labels })
+    expect(html).toContain('id="complete"')
+    expect(html).not.toContain('id="quiz-form"')
+  })
+})
diff --git a/src/express/scorm.ts b/src/express/scorm.ts
new file mode 100644
index 0000000..6b55624
--- /dev/null
+++ b/src/express/scorm.ts
@@ -0,0 +1,265 @@
+// SCORM 1.2 export of a finished result: one self-contained SCO (index.html) that reports completion,
+// and for content with a quiz also the score and pass/fail, to any SCORM 1.2 LMS.
+// Built in the browser because the engine has no SCORM export; the ZIP writer below has no dependencies.
+import type { Question } from './results'
+
+export interface ScormLesson {
+  title: string
+  /** Static HTML of the lesson (already escaped by React's renderer); empty for a quiz-only package. */
+  lessonHtml: string
+  questions: Question[]
+  lang: 'en' | 'id'
+  labels: ScormLabels
+}
+
+export interface ScormLabels {
+  quiz: string
+  submit: string
+  retry: string
+  complete: string
+  completed: string
+  score: string
+  passed: string
+  failed: string
+  answerAll: string
+  noLms: string
+}
+
+/** Share of correct answers needed to pass, in percent (adlcp:masteryscore). */
+export const MASTERY = 70
+
+const escapeXml = (s: string) => s.replace(/[&<>"']/g, c => ({ '&': '&amp;', '<': '&lt;', '>': '&gt;', '"': '&quot;', "'": '&apos;' })[c]!)
+
+export function manifest(title: string, hasQuiz: boolean, id = `lle-${Date.now().toString(36)}`): string {
+  const t = escapeXml(title)
+  return `<?xml version="1.0" encoding="UTF-8"?>
+<manifest identifier="${id}" version="1.0"
+  xmlns="http://www.imsproject.org/xsd/imscp_rootv1p1p2"
+  xmlns:adlcp="http://www.adlnet.org/xsd/adlcp_rootv1p2"
+  xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
+  xsi:schemaLocation="http://www.imsproject.org/xsd/imscp_rootv1p1p2 imscp_rootv1p1p2.xsd http://www.imsglobal.org/xsd/imsmd_rootv1p2p1 imsmd_rootv1p2p1.xsd http://www.adlnet.org/xsd/adlcp_rootv1p2 adlcp_rootv1p2.xsd">
+  <metadata><schema>ADL SCORM</schema><schemaversion>1.2</schemaversion></metadata>
+  <organizations default="org">
+    <organization identifier="org">
+      <title>${t}</title>
+      <item identifier="item" identifierref="sco" isvisible="true">
+        <title>${t}</title>${hasQuiz ? `\n        <adlcp:masteryscore>${MASTERY}</adlcp:masteryscore>` : ''}
+      </item>
+    </organization>
+  </organizations>
+  <resources>
+    <resource identifier="sco" type="webcontent" adlcp:scormtype="sco" href="index.html">
+      <file href="index.html"/>
+    </resource>
+  </resources>
+</manifest>
+`
+}
+
+// Inside <script>, "</" would end the element early; < keeps the JSON intact.
+const jsonForScript = (v: unknown) => JSON.stringify(v).replace(/</g, '\\u003c')
+
+export function scoHtml({ title, lessonHtml, questions, lang, labels }: ScormLesson): string {
+  // Only multiple-choice questions can be scored; essay questions stay out of the package's quiz.
+  const quiz = questions.filter(q => q.options.length > 1 && q.correct >= 0)
+    .map(q => ({ q: q.question, o: q.options, c: q.correct, e: q.explanation }))
+  return `<!doctype html>
+<html lang="${lang}">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<title>${escapeXml(title)}</title>
+<style>${SCO_CSS}</style>
+</head>
+<body>
+<main>
+<h1>${escapeXml(title)}</h1>
+${lessonHtml}
+${quiz.length ? `<section id="quiz"><h2>${escapeXml(labels.quiz)}</h2><form id="quiz-form"></form><p id="quiz-result" role="status"></p></section>` : `<p class="end"><button id="complete" type="button">${escapeXml(labels.complete)}</button></p>`}
+<p id="lms-note" class="note" hidden>${escapeXml(labels.noLms)}</p>
+</main>
+<script type="application/json" id="sco-data">${jsonForScript({ quiz, labels, mastery: MASTERY })}</script>
+<script>${SCO_JS}</script>
+</body>
+</html>
+`
+}
+
+const SCO_CSS = `
+*{box-sizing:border-box}
+body{margin:0;background:#f5f8fc;color:#1d2a3b;font:16px/1.7 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
+main{max-width:760px;margin:0 auto;padding:32px 20px 60px;background:#fff;min-height:100vh}
+h1{font-size:28px;line-height:1.3;margin:0 0 20px}
+article>h1{display:none}
+h2{font-size:20px;margin:28px 0 10px}
+ul,ol{padding-left:22px}
+.muted,.note{color:#6b7a90;font-size:14px}
+.flashcards{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}
+.flashcard{border:1px solid #d9e2ef;border-radius:8px;padding:12px;display:flex;flex-direction:column;gap:6px}
+.slide-preview{border:1px solid #d9e2ef;border-radius:8px;padding:12px 16px;margin-bottom:10px}
+.slide-preview small{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#8a97a8}
+fieldset{border:1px solid #d9e2ef;border-radius:10px;padding:14px 16px;margin:0 0 14px}
+legend{font-weight:600;padding:0 6px}
+label{display:flex;gap:10px;align-items:flex-start;padding:6px 4px;border-radius:6px;cursor:pointer}
+label.correct{background:#e8f7f0}
+label.wrong{background:#fdecec}
+.explain{font-size:14px;color:#4d5d73;margin:6px 0 0}
+button{font:inherit;border:0;border-radius:8px;padding:10px 18px;background:#2563eb;color:#fff;cursor:pointer}
+button:disabled{opacity:.5;cursor:default}
+#quiz-result{font-weight:600}
+.end{margin-top:32px}
+`
+
+// SCORM 1.2 runtime: find the LMS's API object, mark the lesson incomplete on open, and report
+// completion (no quiz) or score + passed/failed (quiz). Works without an LMS too, for a preview.
+const SCO_JS = `
+(function(){
+  var data=JSON.parse(document.getElementById('sco-data').textContent),L=data.labels,start=Date.now(),api=null,done=false;
+  function find(w){for(var n=0;w&&n<12;n++){if(w.API)return w.API;if(!w.parent||w.parent===w)break;w=w.parent}return null}
+  api=find(window)||(window.opener?find(window.opener):null);
+  function set(k,v){if(api)api.LMSSetValue(k,String(v))}
+  function commit(){if(api)api.LMSCommit('')}
+  function pad(n,w){n=String(n);while(n.length<w)n='0'+n;return n}
+  function elapsed(){var s=Math.round((Date.now()-start)/1000);return pad(Math.floor(s/3600),4)+':'+pad(Math.floor(s/60)%60,2)+':'+pad(s%60,2)}
+  if(api){
+    api.LMSInitialize('');
+    var status=api.LMSGetValue('cmi.core.lesson_status');
+    if(!status||status==='not attempted')set('cmi.core.lesson_status','incomplete');
+    commit();
+  }else document.getElementById('lms-note').hidden=false;
+  function finish(){if(!api||done)return;done=true;set('cmi.core.session_time',elapsed());set('cmi.core.exit','');commit();api.LMSFinish('')}
+  window.addEventListener('pagehide',finish);
+  window.addEventListener('beforeunload',finish);
+
+  var complete=document.getElementById('complete');
+  if(complete)complete.onclick=function(){set('cmi.core.lesson_status','completed');commit();complete.disabled=true;complete.textContent=L.completed};
+
+  var form=document.getElementById('quiz-form');
+  if(!form)return;
+  data.quiz.forEach(function(q,i){
+    var f=document.createElement('fieldset'),lg=document.createElement('legend');
+    lg.textContent=(i+1)+'. '+q.q;f.appendChild(lg);
+    q.o.forEach(function(o,j){
+      var l=document.createElement('label'),r=document.createElement('input'),s=document.createElement('span');
+      r.type='radio';r.name='q'+i;r.value=j;s.textContent=o;l.appendChild(r);l.appendChild(s);f.appendChild(l);
+    });
+    form.appendChild(f);
+  });
+  var submit=document.createElement('button');submit.type='submit';submit.textContent=L.submit;form.appendChild(submit);
+  var result=document.getElementById('quiz-result');
+  form.onsubmit=function(e){
+    e.preventDefault();
+    if(submit.dataset.retry){form.reset();form.querySelectorAll('label').forEach(function(l){l.className=''});
+      form.querySelectorAll('.explain').forEach(function(x){x.remove()});form.querySelectorAll('input').forEach(function(x){x.disabled=false});
+      delete submit.dataset.retry;submit.textContent=L.submit;result.textContent='';return}
+    var answers=data.quiz.map(function(q,i){var c=form.querySelector('input[name=q'+i+']:checked');return c?Number(c.value):-1});
+    if(answers.indexOf(-1)>=0){result.textContent=L.answerAll;return}
+    var right=0;
+    data.quiz.forEach(function(q,i){
+      var set_=form.querySelectorAll('fieldset')[i],labels=set_.querySelectorAll('label');
+      labels[q.c].className='correct';if(answers[i]!==q.c)labels[answers[i]].className='wrong';else right++;
+      if(q.e){var p=document.createElement('p');p.className='explain';p.textContent=q.e;set_.appendChild(p)}
+      set_.querySelectorAll('input').forEach(function(x){x.disabled=true});
+    });
+    var score=Math.round(right/data.quiz.length*100),passed=score>=data.mastery;
+    set('cmi.core.score.min',0);set('cmi.core.score.max',100);set('cmi.core.score.raw',score);
+    set('cmi.core.lesson_status',passed?'passed':'failed');commit();
+    result.textContent=L.score.replace('{score}',score)+' '+(passed?L.passed:L.failed);
+    submit.dataset.retry='1';submit.textContent=L.retry;
+  };
+})();
+`
+
+// ── ZIP (stored, no compression: the package is small text) ──
+
+const CRC_TABLE = (() => {
+  const table = new Uint32Array(256)
+  for (let n = 0; n < 256; n++) {
+    let c = n
+    for (let k = 0; k < 8; k++) c = c & 1 ? 0xedb88320 ^ (c >>> 1) : c >>> 1
+    table[n] = c >>> 0
+  }
+  return table
+})()
+
+export function crc32(bytes: Uint8Array): number {
+  let c = 0xffffffff
+  for (const b of bytes) c = CRC_TABLE[(c ^ b) & 0xff] ^ (c >>> 8)
+  return (c ^ 0xffffffff) >>> 0
+}
+
+function dosDateTime(d: Date) {
+  return {
+    time: (d.getHours() << 11) | (d.getMinutes() << 5) | (d.getSeconds() >> 1),
+    date: ((d.getFullYear() - 1980) << 9) | ((d.getMonth() + 1) << 5) | d.getDate(),
+  }
+}
+
+export function zip(files: { name: string; data: string | Uint8Array }[], now = new Date()): Uint8Array {
+  const enc = new TextEncoder()
+  const { time, date } = dosDateTime(now)
+  const locals: Uint8Array[] = []
+  const centrals: Uint8Array[] = []
+  let offset = 0
+  for (const f of files) {
+    const name = enc.encode(f.name)
+    const data = typeof f.data === 'string' ? enc.encode(f.data) : f.data
+    const crc = crc32(data)
+    const local = new Uint8Array(30 + name.length + data.length)
+    const lv = new DataView(local.buffer)
+    lv.setUint32(0, 0x04034b50, true)
+    lv.setUint16(4, 20, true) // version needed
+    lv.setUint16(6, 0x0800, true) // UTF-8 names
+    lv.setUint16(8, 0, true) // stored
+    lv.setUint16(10, time, true)
+    lv.setUint16(12, date, true)
+    lv.setUint32(14, crc, true)
+    lv.setUint32(18, data.length, true)
+    lv.setUint32(22, data.length, true)
+    lv.setUint16(26, name.length, true)
+    local.set(name, 30)
+    local.set(data, 30 + name.length)
+
+    const central = new Uint8Array(46 + name.length)
+    const cv = new DataView(central.buffer)
+    cv.setUint32(0, 0x02014b50, true)
+    cv.setUint16(4, 20, true)
+    cv.setUint16(6, 20, true)
+    cv.setUint16(8, 0x0800, true)
+    cv.setUint16(10, 0, true)
+    cv.setUint16(12, time, true)
+    cv.setUint16(14, date, true)
+    cv.setUint32(16, crc, true)
+    cv.setUint32(20, data.length, true)
+    cv.setUint32(24, data.length, true)
+    cv.setUint16(28, name.length, true)
+    cv.setUint32(42, offset, true)
+    central.set(name, 46)
+
+    locals.push(local)
+    centrals.push(central)
+    offset += local.length
+  }
+  const centralSize = centrals.reduce((n, c) => n + c.length, 0)
+  const end = new Uint8Array(22)
+  const ev = new DataView(end.buffer)
+  ev.setUint32(0, 0x06054b50, true)
+  ev.setUint16(8, files.length, true)
+  ev.setUint16(10, files.length, true)
+  ev.setUint32(12, centralSize, true)
+  ev.setUint32(16, offset, true)
+
+  const out = new Uint8Array(offset + centralSize + end.length)
+  let at = 0
+  for (const part of [...locals, ...centrals, end]) { out.set(part, at); at += part.length }
+  return out
+}
+
+export function scormPackage(lesson: ScormLesson): Blob {
+  const hasQuiz = lesson.questions.some(q => q.options.length > 1 && q.correct >= 0)
+  const bytes = zip([
+    { name: 'imsmanifest.xml', data: manifest(lesson.title, hasQuiz) },
+    { name: 'index.html', data: scoHtml(lesson) },
+  ])
+  return new Blob([bytes as BlobPart], { type: 'application/zip' })
+}
diff --git a/src/i18n.ts b/src/i18n.ts
new file mode 100644
index 0000000..8cf5139
--- /dev/null
+++ b/src/i18n.ts
@@ -0,0 +1,717 @@
+// UI language: English by default, Indonesian on request. A module-level store so API helpers
+// and the instruction parser can translate too, not just components.
+import { useSyncExternalStore } from 'react'
+
+export type Lang = 'en' | 'id'
+export const LANGS: { code: Lang; label: string }[] = [{ code: 'en', label: 'EN' }, { code: 'id', label: 'ID' }]
+
+const en = {
+  // Layout
+  'nav.brain': 'Brain',
+  'nav.instruction': 'Instruction',
+  'nav.schedule': 'Schedule',
+  'nav.results': 'Results',
+  'nav.workspace': 'WORKSPACE',
+  'layout.learningSpace': 'Learning space',
+  'layout.breadcrumb': 'Workspace',
+  'layout.signOut': 'Sign out',
+  'layout.engine': 'learning-lab engine',
+  'layout.devStrip': 'Development phase: connected to the learning-lab engine. Review AI output before using it.',
+  'layout.footer': 'A workspace for knowledge that keeps growing.',
+  'layout.mainNav': 'Main navigation',
+  'layout.language': 'Language',
+
+  // Auth
+  'auth.loading': 'Loading…',
+  'auth.eyebrow': 'NEW LEARNING, WITHOUT STARTING FROM SCRATCH',
+  'auth.headline1': 'Team knowledge.',
+  'auth.headline2': 'New ideas.',
+  'auth.headline3': 'Learning that never stops.',
+  'auth.copy': 'Upload material to the Brain, give one instruction, and AI keeps creating new learning content on schedule.',
+  'auth.benefitUpload': 'Upload material to the Brain',
+  'auth.benefitSchedule': 'Schedule research and content',
+  'auth.benefitDownload': 'Open and download the results',
+  'auth.footer': 'Your knowledge. New possibilities.',
+  'auth.pickOrg': 'Choose an organization',
+  'auth.pickOrgCopy': 'Express Mode runs inside an organization so the Brain, schedules, and credits are shared with your team.',
+
+  // Shared
+  'common.loading': 'Loading…',
+  'common.save': 'Save',
+  'common.cancel': 'Cancel',
+  'common.retry': 'Try again',
+  'common.credits': '{n} credits',
+
+  // Brain
+  'brain.title': 'Brain',
+  'brain.description': 'All team material is processed into one Brain that keeps growing. New content the AI creates goes in here too.',
+  'brain.metricMaterial': 'Material',
+  'brain.metricMaterialSub': 'documents in the workspace',
+  'brain.metricReady': 'In the Brain',
+  'brain.metricReadySub': 'knowledge base ready',
+  'brain.metricAction': 'Needs action',
+  'brain.metricActionSub': 'waiting for your approval',
+  'brain.listTitle': 'Material',
+  'brain.loading': 'Loading material…',
+  'brain.engineDown': 'Cannot reach the engine',
+  'brain.empty': 'No material yet',
+  'brain.emptyCopy': 'Upload documents to start filling the Brain.',
+  'brain.uploadTitle': 'Upload material to the Brain',
+  'brain.uploadCopy': 'Drag files anywhere on this page, or choose them from your computer. The engine reads them and adds them to the Brain.',
+  'brain.formats': 'Formats: {list}',
+  'brain.formatsLoading': 'Loading supported formats…',
+  'brain.chooseFiles': 'Choose files',
+  'brain.uploading': 'Uploading…',
+  'brain.uploaded': 'Uploaded',
+  'brain.unsupported': 'Unsupported format',
+  'brain.dropHere': 'Drop files to upload them to the Brain',
+  'brain.statusReady': 'In the Brain',
+  'brain.statusBuilding': 'Building Brain',
+  'brain.statusProcessing': 'Processing',
+  'brain.statusAnswer': 'Needs action',
+  'brain.statusFailed': 'Failed',
+  'brain.queued': 'Waiting in queue…',
+  'brain.versionWithCandidate': 'Looks like “{name}”. Is this a new version of it?',
+  'brain.versionGeneric': 'Is this a new version of an existing document?',
+  'brain.versionYes': 'Yes, new version',
+  'brain.versionNo': 'No, keep separate',
+  'brain.needsCredits': 'Not enough credits to add this to the Brain{need}. Top up, then try again.',
+  'brain.needsCreditsNeed': ' (needs {credits})',
+  'brain.failed': 'Could not add this to the Brain.',
+  'brain.retryWith': 'Try again ({credits})',
+  'brain.confirmCopy': 'Adding this document to the Brain uses {credits} from the workspace.',
+  'brain.confirmCreditsFallback': 'credits',
+  'brain.addToBrain': 'Add to Brain',
+  'brain.delete': 'Delete {name}',
+  'brain.deleteConfirm': 'Delete “{name}” from the Brain?',
+
+  // Instruction
+  'ins.title': 'Instruction',
+  'ins.description': 'Write a plain instruction. The AI turns it into research and content schedules that keep running until you stop them.',
+  'ins.cardTitle': 'What should be created?',
+  'ins.label': 'Instruction',
+  'ins.placeholder': 'Example: make 3 quizzes per week and 2 summaries per day about leadership',
+  'ins.hint': 'Name the content type, how many, how often (per day / per week), and the topic. Internet research can be scheduled too.',
+  'ins.compose': 'Build schedule',
+  'ins.ex1': 'Make 2 summaries per day and 1 quiz per week about leadership',
+  'ins.ex2': 'Research the internet every day about leadership',
+  'ins.ex3': '3 roleplays per week about negotiating with customers',
+  'ins.ex4': 'Research every Monday about sales trends, then make 5 flashcards per week',
+  'ins.ex5': '1 video per week, 2 podcasts per week and 1 SCORM module per week about onboarding',
+  'ins.previewTitle': 'Schedules to create',
+  'ins.readyCount': '{n} ready',
+  'ins.notUnderstood': 'Instruction not understood',
+  'ins.notUnderstoodCopy': 'Try naming the content type and how often, e.g. “2 summaries per day”.',
+  'ins.skipped': 'Not understood and skipped: {parts}',
+  'ins.approveNote': 'Once approved, schedules start right away. Content is created from the Brain without repeating existing content, using workspace credits within the limits above.',
+  'ins.approve': 'Approve {n} schedules',
+  'ins.approving': 'Creating schedules…',
+  'ins.active': 'Active',
+  'ins.failed': 'Failed',
+  'ins.viewSchedule': 'View in Schedule',
+  'ins.kind': 'Content type',
+  'ins.count': 'Count',
+  'ins.frequency': 'Frequency',
+  'ins.perDay': 'per day',
+  'ins.perWeek': 'per week',
+  'ins.researchFrequency': 'Research frequency',
+  'ins.everyDay': 'Every day',
+  'ins.everyWeek': 'Every week',
+  'ins.weekday': 'Day',
+  'ins.topic': 'Topic',
+  'ins.topicPlaceholder': 'Topic (empty = whole Brain)',
+  'ins.autoApprove': 'New sources go straight into the Brain (no review first)',
+  'ins.notCreated': 'This schedule will not be created yet.',
+  'ins.tooMany': 'At most 50 items per week for one schedule.',
+  'ins.budget': 'Credit limit: {first}, {monthly} per month.',
+  'ins.budgetWeekly': '{n} per week',
+  'ins.budgetRun': '{n} per research run',
+  'ins.removeRule': 'Remove from list',
+
+  // Rules (parser output)
+  'rule.everyDay': 'Every day',
+  'rule.everyWeekday': 'Every {day}',
+  'rule.research': '{when}: internet research{about}',
+  'rule.about': ' about {topic}',
+  'rule.wholeBrain': ' from the whole Brain',
+  'rule.content': '{kind}: {count} {per}{about}',
+  'rule.monthNote': '{count} per month is scheduled as {weekly} per week.',
+  'kind.summary': 'Summary',
+  'kind.quiz': 'Quiz',
+  'kind.flashcards': 'Flashcards',
+  'kind.roleplay': 'Roleplay',
+  'kind.simulator': 'Simulation',
+  'kind.slide_deck': 'Slides',
+  'kind.video': 'Video',
+  'kind.audio': 'Audio',
+  'kind.scorm': 'SCORM',
+  'day.0': 'Monday', 'day.1': 'Tuesday', 'day.2': 'Wednesday', 'day.3': 'Thursday', 'day.4': 'Friday', 'day.5': 'Saturday', 'day.6': 'Sunday',
+
+  // Schedule
+  'sch.title': 'Schedule',
+  'sch.description': 'Research and content schedules that are running. Change the topic any time; the next content follows the new topic.',
+  'sch.newInstruction': 'New instruction',
+  'sch.cardTitle': 'Schedules',
+  'sch.loading': 'Loading schedules…',
+  'sch.loadFailed': 'Could not load schedules',
+  'sch.empty': 'No schedules yet',
+  'sch.emptyCopy': 'Give an instruction like “2 summaries per day about leadership” to start.',
+  'sch.nextResearch': 'Next research: {when}',
+  'sch.paused': 'Paused',
+  'sch.active': 'Active',
+  'sch.newTopic': 'New topic',
+  'sch.changeTopic': 'Change topic',
+  'sch.pause': 'Pause',
+  'sch.resume': 'Resume',
+  'sch.runNow': 'Run now',
+  'sch.history': 'History',
+  'sch.hideHistory': 'Hide history',
+  'sch.delete': 'Delete',
+  'sch.deleteConfirm': 'Delete the schedule “{name}”? Content already created stays.',
+  'sch.loadingProgress': 'Loading progress…',
+  'sch.planningOff': 'Automatic production is off in the engine: an admin needs to set a price for “agent.content.plan”.',
+  'sch.produceNow': 'Produce now',
+  'prod.runningTitle': 'Producing {n} new pieces',
+  'prod.lastTitle': 'Last production',
+  'prod.count': '{ready} of {total} ready',
+  'prod.stepTopics': 'AI chooses new topics',
+  'prod.stepStart': 'Starting',
+  'prod.stepCreate': 'Creating content ({ready}/{total})',
+  'prod.stepDone': 'Done',
+  'prod.failed': 'Production failed ({code}).',
+  'prod.someFailed': '{n} failed.',
+  'prod.shortfall': 'The Brain had new material for fewer pieces than asked ({n} short); add documents for more topics.',
+  'prod.viewResults': 'View in Results',
+  'sch.produceHowMany': 'How many pieces now? (up to {max} left this week)',
+  'sch.checkPrice': 'Check price',
+  'sch.checkingPrice': 'Checking…',
+  'sch.produceQuote': 'Planning {n} pieces costs {credits} credits. Each piece is then charged as it is created, within this schedule’s weekly limit of {budget} credits. Production starts within about a minute.',
+  'sch.startProduction': 'Start production',
+  'sch.starting': 'Starting…',
+  'sch.alreadyProducing': 'This schedule is already producing. Wait for it to finish first.',
+  'sch.weekFull': 'This week’s target is already used up. The next pieces come with next week’s schedule.',
+  'sch.thisWeek': 'This week: {ready} of {target} ready{failed}',
+  'sch.thisWeekFailed': ', {n} failed',
+  'sch.waitingFirst': 'Waiting for the first production slot',
+  'sch.loadingHistory': 'Loading history…',
+  'sch.neverRan': 'Has not run yet.',
+  'sch.scheduled': 'Scheduled',
+  'sch.manual': 'Manual',
+  'run.queued': 'Queued', 'run.planning': 'Planning', 'run.running': 'Running', 'run.completed': 'Completed', 'run.failed': 'Failed', 'run.cancelled': 'Cancelled',
+
+  // Results
+  'res.title': 'Results',
+  'res.description': 'Everything Express creates: text, quizzes, roleplays, video, audio, and SCORM.',
+  'res.empty': 'No results yet',
+  'res.emptyCopy': 'Content and sources from your schedules appear here. Give an instruction to start a schedule.',
+  'res.tabContent': 'Content',
+  'res.tabResearch': 'Research',
+  'res.pendingCount': '{n} to review',
+  'res.allContent': 'All content',
+  'res.foundSources': 'Sources found by research',
+  'res.search': 'Search titles…',
+  'res.filterKind': 'Filter by type',
+  'res.filterStatus': 'Filter by status',
+  'res.allKinds': 'All types',
+  'res.status.all': 'All statuses',
+  'res.status.review': 'Needs review',
+  'res.status.approved': 'Approved',
+  'res.status.working': 'In progress',
+  'res.status.failed': 'Failed or rejected',
+  'res.state.preparing': 'Preparing',
+  'res.state.generating': 'Generating',
+  'res.state.ready': 'Needs review',
+  'res.state.accepted': 'Approved',
+  'res.state.failed': 'Failed',
+  'res.state.rejected': 'Rejected',
+  'res.source.pending': 'Needs review',
+  'res.source.accepted': 'Added to Library',
+  'res.source.rejected': 'Rejected',
+  'res.loadFailed': 'Results could not be loaded',
+  'res.noMatch': 'Nothing matches',
+  'res.noMatchCopy': 'Try another keyword, type, or status.',
+  'res.noteContent': 'Download as PDF, Markdown or SCORM; slide decks also as PowerPoint, videos as MP4, audio scripts as text. Roleplay and simulation run interactively in Learning Studio.',
+  'res.noteResearch': 'Research finds web sources. Add the useful ones to the Library, then build their knowledge on the Brain page.',
+  'res.sourceCount': '{n} sources',
+  'res.sourceOne': '1 source',
+  'res.working': 'Being created…',
+  'res.open': 'Open',
+  'res.close': 'Close',
+  'res.reviewNotice': 'AI-generated draft. Check it, then approve it or reject it.',
+  'res.noContent': 'No content to show',
+  'res.noContentCopy': 'This item has not finished or its output is no longer available.',
+  'res.info': 'Content details',
+  'res.statusLabel': 'Status',
+  'res.schedule': 'Schedule',
+  'res.created': 'Created',
+  'res.sources': 'Sources',
+  'res.footNote': 'Created by Express from your Brain.',
+  'res.openStudio': 'Open in Learning Studio',
+  'res.download': 'Download',
+  'res.preparingFile': 'Preparing file…',
+  'res.pdfHint': 'Opens the print dialog: choose “Save as PDF”',
+  'res.pptxHint': 'Slides rendered by Learning Studio',
+  'res.mdHint': 'Plain text with headings, for editing',
+  'res.accept': 'Approve',
+  'res.reject': 'Reject',
+  'res.addToBrain': 'Add to Library',
+  'res.inBrain': 'see Brain',
+  'res.answer': 'Answer',
+  'res.slide': 'Slide {n}',
+  'res.field.description': 'Description',
+  'res.field.topic': 'Topic',
+  'res.field.objective': 'Objective',
+  'res.field.learning_objectives': 'Learning objectives',
+  'res.field.user_role': 'Learner role',
+  'res.field.ai_character': 'AI character',
+  'res.field.difficulty': 'Difficulty',
+  'res.field.context': 'Context',
+
+  // Media and SCORM (Phases 4, 5, 7)
+  'ins.noteVideo': 'One video per run, about {seconds} seconds in {scenes} scenes, made by Video Studio. Each video waits for your review in Results.',
+  'ins.noteAudio': 'Written as a narration script. Results plays it with the device voice and downloads it as text (no MP3 yet: the engine has no audio service for agents).',
+  'ins.noteScorm': 'Each module is a lesson with a 10-question quiz, downloaded from Results as a SCORM 1.2 package for your LMS.',
+  'ins.videoCadence': 'A video schedule makes one video per run: choose 1 per day or 1 per week.',
+  'ins.videoQuoteFailed': 'The video price could not be checked: {message}',
+  'ins.budgetVideo': '{n} per video',
+  'sch.nextVideo': 'Next video: {when}',
+  'sch.videoNow': 'Make a video now',
+  'sch.videoStarted': 'Video started. It shows in Results while it is being made.',
+  'sch.runStarted': 'Research started.',
+  'sch.deleted': 'Schedule deleted.',
+  'res.videoProgress': 'Rendering… {n}%',
+  'res.videoNotReady': 'The video is not ready yet',
+  'res.videoFailed': 'The video could not be made',
+  'res.videoFailedCopy': 'Rendering stopped before the video was finished.',
+  'res.downloadVideo': 'Download video (MP4)',
+  'res.creditsUsed': 'Credits used',
+  'res.accepted': 'Approved.',
+  'res.rejected': 'Rejected.',
+  'res.audioNotice': 'Played with this device’s voice, which can differ between devices. Download the script to record it or use it in a TTS tool.',
+  'res.fullScript': 'Show the full script',
+  'res.scriptTxt': 'Script (.txt)',
+  'res.scriptHint': 'Narration text, for recording or a TTS tool',
+  'res.quiz': 'Quiz',
+  'res.quizPending': 'The quiz is not ready yet.',
+  'res.scormModule': 'SCORM 1.2 module',
+  'res.scormMeta': 'Lesson + {n} questions · pass mark {mastery}%',
+  'res.scormHint': 'For an LMS: the lesson, marked complete when finished',
+  'res.scormQuizHint': 'For an LMS: lesson and quiz, reports score and pass/fail',
+  'res.scormReady': 'SCORM package downloaded. Upload the .zip to your LMS.',
+  'scorm.submit': 'Check answers',
+  'scorm.retry': 'Try again',
+  'scorm.complete': 'Mark as complete',
+  'scorm.completed': 'Completed ✓',
+  'scorm.score': 'Score: {score}%.',
+  'scorm.passed': 'Passed (pass mark {n}%).',
+  'scorm.failed': 'Not passed yet (pass mark {n}%).',
+  'scorm.answerAll': 'Answer every question first.',
+  'scorm.noLms': 'Opened outside an LMS: progress is not saved.',
+  'audio.copy': 'The narration script, read aloud by this device.',
+  'audio.unsupported': 'This browser cannot read text aloud. Download the script instead.',
+  'audio.play': 'Listen',
+  'audio.pause': 'Pause',
+  'audio.resume': 'Resume',
+  'audio.stop': 'Stop',
+  'audio.speed': 'Speed',
+  'audio.ready': '{n} sentences · press Listen to start',
+  'audio.sentence': 'Sentence {n} of {total}',
+  'brain.deleted': '“{name}” deleted.',
+
+  // Guide
+  'help.boxTitle': 'How Express works',
+  'help.boxBody': 'Four steps from your material to finished content.',
+  'help.open': 'View the guide',
+  'help.title': 'How Learning Lab Express works',
+  'help.subtitle': 'Brain → Instruction → Schedule → Results',
+  'help.brainTitle': 'Brain',
+  'help.brainBody': 'Upload your training material. Once its knowledge is built, the AI creates everything from it.',
+  'help.instructionTitle': 'Instruction',
+  'help.instructionBody': 'Say what you need in one sentence, e.g. “3 quizzes per week and 1 video per week about leadership”. Check the schedules, then approve them.',
+  'help.scheduleTitle': 'Schedule',
+  'help.scheduleBody': 'Schedules run on their own. Pause them, change the topic, or produce now; each stays within its credit limit.',
+  'help.resultsTitle': 'Results',
+  'help.resultsBody': 'Review what was made, approve or reject it, and download it: PDF, Markdown, PowerPoint, MP4, audio script, or SCORM for your LMS.',
+  'help.note': 'Content is AI-generated: always review it before using it. Credits come from your organization’s workspace.',
+  'help.done': 'Got it',
+
+  // Errors from the engine client
+  'err.unreachable': 'Cannot reach the learning-lab engine.',
+  'err.generic': 'The request to the engine failed.',
+  'err.credits': 'Not enough credits: needs {required}, balance {balance}.',
+  'err.creditsShort': 'Not enough credits.',
+  'err.docFailed': 'The document could not be processed.',
+  'err.timeout': 'Document processing took too long.',
+  'err.researchFailed': 'Research could not run ({code}).',
+} as const
+
+export type Key = keyof typeof en
+
+const id: Record<Key, string> = {
+  'nav.brain': 'Otak',
+  'nav.instruction': 'Perintah',
+  'nav.schedule': 'Jadwal',
+  'nav.results': 'Hasil',
+  'nav.workspace': 'RUANG KERJA',
+  'layout.learningSpace': 'Ruang belajar',
+  'layout.breadcrumb': 'Ruang kerja',
+  'layout.signOut': 'Keluar',
+  'layout.engine': 'Engine learning-lab',
+  'layout.devStrip': 'Fase development: terhubung ke engine learning-lab. Hasil AI perlu ditinjau sebelum dipakai.',
+  'layout.footer': 'Ruang kerja untuk pengetahuan yang terus berkembang.',
+  'layout.mainNav': 'Navigasi utama',
+  'layout.language': 'Bahasa',
+
+  'auth.loading': 'Memuat…',
+  'auth.eyebrow': 'BELAJAR BARU, TANPA MULAI DARI NOL',
+  'auth.headline1': 'Pengetahuan tim.',
+  'auth.headline2': 'Ide baru.',
+  'auth.headline3': 'Pembelajaran tanpa henti.',
+  'auth.copy': 'Unggah materi ke Otak, beri satu perintah, dan AI terus membuat konten pembelajaran baru sesuai jadwal.',
+  'auth.benefitUpload': 'Unggah materi ke Otak',
+  'auth.benefitSchedule': 'Jadwalkan riset dan konten',
+  'auth.benefitDownload': 'Buka dan unduh hasilnya',
+  'auth.footer': 'Pengetahuan Anda. Kemungkinan baru.',
+  'auth.pickOrg': 'Pilih organisasi',
+  'auth.pickOrgCopy': 'Express Mode berjalan di dalam organisasi agar Otak, jadwal, dan kredit dipakai bersama tim.',
+
+  'common.loading': 'Memuat…',
+  'common.save': 'Simpan',
+  'common.cancel': 'Batal',
+  'common.retry': 'Coba lagi',
+  'common.credits': '{n} kredit',
+
+  'brain.title': 'Otak',
+  'brain.description': 'Semua materi tim diproses menjadi satu Otak yang terus bertambah. Konten baru yang dihasilkan juga masuk ke sini.',
+  'brain.metricMaterial': 'Materi',
+  'brain.metricMaterialSub': 'dokumen di ruang kerja',
+  'brain.metricReady': 'Masuk Otak',
+  'brain.metricReadySub': 'knowledge base siap',
+  'brain.metricAction': 'Perlu tindakan',
+  'brain.metricActionSub': 'menunggu persetujuan Anda',
+  'brain.listTitle': 'Materi',
+  'brain.loading': 'Memuat materi…',
+  'brain.engineDown': 'Engine tidak dapat dihubungi',
+  'brain.empty': 'Belum ada materi',
+  'brain.emptyCopy': 'Unggah dokumen untuk mulai mengisi Otak.',
+  'brain.uploadTitle': 'Unggah materi ke Otak',
+  'brain.uploadCopy': 'Tarik file ke mana saja di halaman ini, atau pilih dari komputer. Engine membaca isinya lalu menambahkannya ke Otak.',
+  'brain.formats': 'Format: {list}',
+  'brain.formatsLoading': 'Memuat format yang didukung…',
+  'brain.chooseFiles': 'Pilih file',
+  'brain.uploading': 'Mengunggah…',
+  'brain.uploaded': 'Terunggah',
+  'brain.unsupported': 'Format tidak didukung',
+  'brain.dropHere': 'Lepaskan file untuk diunggah ke Otak',
+  'brain.statusReady': 'Masuk Otak',
+  'brain.statusBuilding': 'Membangun Otak',
+  'brain.statusProcessing': 'Diproses',
+  'brain.statusAnswer': 'Perlu tindakan',
+  'brain.statusFailed': 'Gagal',
+  'brain.queued': 'Menunggu antrean…',
+  'brain.versionWithCandidate': 'Mirip dengan “{name}”. Apakah ini versi barunya?',
+  'brain.versionGeneric': 'Apakah ini versi baru dari dokumen yang sudah ada?',
+  'brain.versionYes': 'Ya, versi baru',
+  'brain.versionNo': 'Bukan, simpan terpisah',
+  'brain.needsCredits': 'Kredit tidak cukup untuk memasukkan ke Otak{need}. Isi ulang kredit, lalu coba lagi.',
+  'brain.needsCreditsNeed': ' (butuh {credits})',
+  'brain.failed': 'Gagal memasukkan ke Otak.',
+  'brain.retryWith': 'Coba lagi ({credits})',
+  'brain.confirmCopy': 'Memasukkan dokumen ini ke Otak memakai {credits} dari ruang kerja.',
+  'brain.confirmCreditsFallback': 'kredit',
+  'brain.addToBrain': 'Masukkan ke Otak',
+  'brain.delete': 'Hapus {name}',
+  'brain.deleteConfirm': 'Hapus “{name}” dari Otak?',
+
+  'ins.title': 'Perintah',
+  'ins.description': 'Tulis instruksi biasa. AI menyusunnya menjadi jadwal riset dan pembuatan konten, lalu terus berjalan sampai Anda menghentikannya.',
+  'ins.cardTitle': 'Apa yang perlu dibuat?',
+  'ins.label': 'Instruksi',
+  'ins.placeholder': 'Contoh: bikin 3 kuis per minggu dan 2 ringkasan per hari soal leadership',
+  'ins.hint': 'Sebut jenis konten, jumlah, frekuensi (per hari / per minggu), dan topiknya. Riset internet juga bisa dijadwalkan.',
+  'ins.compose': 'Susun jadwal',
+  'ins.ex1': 'Bikin 2 ringkasan per hari dan 1 kuis per minggu soal leadership',
+  'ins.ex2': 'Riset internet tiap hari soal leadership',
+  'ins.ex3': '3 roleplay per minggu tentang negosiasi dengan pelanggan',
+  'ins.ex4': 'Riset tiap Senin soal tren sales, lalu buat 5 flashcard per minggu',
+  'ins.ex5': '1 video per minggu, 2 podcast per minggu dan 1 modul SCORM per minggu soal onboarding',
+  'ins.previewTitle': 'Jadwal yang akan dibuat',
+  'ins.readyCount': '{n} siap',
+  'ins.notUnderstood': 'Instruksi belum dipahami',
+  'ins.notUnderstoodCopy': 'Coba sebut jenis konten dan frekuensinya, misalnya “2 ringkasan per hari”.',
+  'ins.skipped': 'Bagian ini belum dipahami dan dilewati: {parts}',
+  'ins.approveNote': 'Setelah disetujui, jadwal langsung aktif. Konten dibuat dari materi di Otak tanpa mengulang yang sudah ada, dan memakai kredit ruang kerja sesuai batas di atas.',
+  'ins.approve': 'Setujui {n} jadwal',
+  'ins.approving': 'Membuat jadwal…',
+  'ins.active': 'Aktif',
+  'ins.failed': 'Gagal',
+  'ins.viewSchedule': 'Lihat di Jadwal',
+  'ins.kind': 'Jenis konten',
+  'ins.count': 'Jumlah',
+  'ins.frequency': 'Frekuensi',
+  'ins.perDay': 'per hari',
+  'ins.perWeek': 'per minggu',
+  'ins.researchFrequency': 'Frekuensi riset',
+  'ins.everyDay': 'Setiap hari',
+  'ins.everyWeek': 'Setiap minggu',
+  'ins.weekday': 'Hari',
+  'ins.topic': 'Topik',
+  'ins.topicPlaceholder': 'Topik (kosong = seluruh Otak)',
+  'ins.autoApprove': 'Sumber baru langsung masuk ke Otak (tanpa ditinjau dulu)',
+  'ins.notCreated': 'Jadwal ini belum dibuat.',
+  'ins.tooMany': 'Maksimal 50 konten per minggu untuk satu jadwal.',
+  'ins.budget': 'Batas kredit: {first}, {monthly} per bulan.',
+  'ins.budgetWeekly': '{n} per minggu',
+  'ins.budgetRun': '{n} per riset',
+  'ins.removeRule': 'Hapus dari daftar',
+
+  'rule.everyDay': 'Setiap hari',
+  'rule.everyWeekday': 'Setiap {day}',
+  'rule.research': '{when}: riset internet{about}',
+  'rule.about': ' tentang {topic}',
+  'rule.wholeBrain': ' dari seluruh Otak',
+  'rule.content': '{kind}: {count} {per}{about}',
+  'rule.monthNote': '{count} per bulan dijadwalkan sebagai {weekly} per minggu.',
+  'kind.summary': 'Ringkasan',
+  'kind.quiz': 'Kuis',
+  'kind.flashcards': 'Flashcard',
+  'kind.roleplay': 'Roleplay',
+  'kind.simulator': 'Simulasi',
+  'kind.slide_deck': 'Slide',
+  'kind.video': 'Video',
+  'kind.audio': 'Audio',
+  'kind.scorm': 'SCORM',
+  'day.0': 'Senin', 'day.1': 'Selasa', 'day.2': 'Rabu', 'day.3': 'Kamis', 'day.4': 'Jumat', 'day.5': 'Sabtu', 'day.6': 'Minggu',
+
+  'sch.title': 'Jadwal',
+  'sch.description': 'Jadwal riset dan pembuatan konten yang sedang berjalan. Ubah topik kapan saja; konten berikutnya mengikuti topik baru.',
+  'sch.newInstruction': 'Perintah baru',
+  'sch.cardTitle': 'Jadwal',
+  'sch.loading': 'Memuat jadwal…',
+  'sch.loadFailed': 'Jadwal tidak dapat dimuat',
+  'sch.empty': 'Belum ada jadwal',
+  'sch.emptyCopy': 'Beri perintah seperti “2 ringkasan per hari soal leadership” untuk mulai.',
+  'sch.nextResearch': 'Riset berikutnya: {when}',
+  'sch.paused': 'Dijeda',
+  'sch.active': 'Aktif',
+  'sch.newTopic': 'Topik baru',
+  'sch.changeTopic': 'Ganti topik',
+  'sch.pause': 'Jeda',
+  'sch.resume': 'Lanjutkan',
+  'sch.runNow': 'Jalankan sekarang',
+  'sch.history': 'Riwayat',
+  'sch.hideHistory': 'Sembunyikan riwayat',
+  'sch.delete': 'Hapus',
+  'sch.deleteConfirm': 'Hapus jadwal “{name}”? Konten yang sudah dibuat tetap ada.',
+  'sch.loadingProgress': 'Memuat progres…',
+  'sch.planningOff': 'Produksi otomatis belum aktif di engine: admin perlu mengatur harga “agent.content.plan”.',
+  'sch.produceNow': 'Produksi sekarang',
+  'prod.runningTitle': 'Memproduksi {n} konten baru',
+  'prod.lastTitle': 'Produksi terakhir',
+  'prod.count': '{ready} dari {total} siap',
+  'prod.stepTopics': 'AI memilih topik baru',
+  'prod.stepStart': 'Memulai',
+  'prod.stepCreate': 'Membuat konten ({ready}/{total})',
+  'prod.stepDone': 'Selesai',
+  'prod.failed': 'Produksi gagal ({code}).',
+  'prod.someFailed': '{n} gagal.',
+  'prod.shortfall': 'Brain hanya punya materi baru untuk lebih sedikit konten dari yang diminta (kurang {n}); tambah dokumen untuk topik lain.',
+  'prod.viewResults': 'Lihat di Results',
+  'sch.produceHowMany': 'Berapa konten sekarang? (sisa {max} untuk minggu ini)',
+  'sch.checkPrice': 'Cek harga',
+  'sch.checkingPrice': 'Mengecek…',
+  'sch.produceQuote': 'Merencanakan {n} konten memakai {credits} kredit. Setiap konten lalu dipotong kreditnya saat dibuat, dalam batas mingguan jadwal ini sebesar {budget} kredit. Produksi mulai dalam sekitar satu menit.',
+  'sch.startProduction': 'Mulai produksi',
+  'sch.starting': 'Memulai…',
+  'sch.alreadyProducing': 'Jadwal ini sedang berproduksi. Tunggu sampai selesai dulu.',
+  'sch.weekFull': 'Target minggu ini sudah terpakai. Konten berikutnya ikut jadwal minggu depan.',
+  'sch.thisWeek': 'Minggu ini: {ready} dari {target} siap{failed}',
+  'sch.thisWeekFailed': ', {n} gagal',
+  'sch.waitingFirst': 'Menunggu jadwal produksi pertama',
+  'sch.loadingHistory': 'Memuat riwayat…',
+  'sch.neverRan': 'Belum pernah berjalan.',
+  'sch.scheduled': 'Terjadwal',
+  'sch.manual': 'Manual',
+  'run.queued': 'Antre', 'run.planning': 'Merencanakan', 'run.running': 'Berjalan', 'run.completed': 'Selesai', 'run.failed': 'Gagal', 'run.cancelled': 'Dibatalkan',
+
+  'res.title': 'Hasil',
+  'res.description': 'Semua konten yang dihasilkan Express: teks, kuis, roleplay, video, audio, dan SCORM.',
+  'res.empty': 'Belum ada hasil',
+  'res.emptyCopy': 'Konten dan sumber dari jadwal Anda tampil di sini. Beri perintah untuk memulai jadwal.',
+  'res.tabContent': 'Konten',
+  'res.tabResearch': 'Riset',
+  'res.pendingCount': '{n} perlu ditinjau',
+  'res.allContent': 'Semua konten',
+  'res.foundSources': 'Sumber hasil riset',
+  'res.search': 'Cari judul…',
+  'res.filterKind': 'Filter jenis',
+  'res.filterStatus': 'Filter status',
+  'res.allKinds': 'Semua jenis',
+  'res.status.all': 'Semua status',
+  'res.status.review': 'Perlu ditinjau',
+  'res.status.approved': 'Disetujui',
+  'res.status.working': 'Sedang dibuat',
+  'res.status.failed': 'Gagal atau ditolak',
+  'res.state.preparing': 'Menyiapkan',
+  'res.state.generating': 'Membuat',
+  'res.state.ready': 'Perlu ditinjau',
+  'res.state.accepted': 'Disetujui',
+  'res.state.failed': 'Gagal',
+  'res.state.rejected': 'Ditolak',
+  'res.source.pending': 'Perlu ditinjau',
+  'res.source.accepted': 'Masuk Library',
+  'res.source.rejected': 'Ditolak',
+  'res.loadFailed': 'Hasil tidak dapat dimuat',
+  'res.noMatch': 'Tidak ada yang cocok',
+  'res.noMatchCopy': 'Coba kata kunci, jenis, atau status lain.',
+  'res.noteContent': 'Unduh sebagai PDF, Markdown, atau SCORM; slide deck juga sebagai PowerPoint, video sebagai MP4, naskah audio sebagai teks. Roleplay dan simulasi dijalankan secara interaktif di Learning Studio.',
+  'res.noteResearch': 'Riset menemukan sumber dari web. Masukkan yang berguna ke Library, lalu bangun pengetahuannya di halaman Brain.',
+  'res.sourceCount': '{n} sumber',
+  'res.sourceOne': '1 sumber',
+  'res.working': 'Sedang dibuat…',
+  'res.open': 'Buka',
+  'res.close': 'Tutup',
+  'res.reviewNotice': 'Draft buatan AI. Periksa dulu, lalu setujui atau tolak.',
+  'res.noContent': 'Tidak ada konten untuk ditampilkan',
+  'res.noContentCopy': 'Item ini belum selesai atau hasilnya sudah tidak tersedia.',
+  'res.info': 'Informasi konten',
+  'res.statusLabel': 'Status',
+  'res.schedule': 'Jadwal',
+  'res.created': 'Dibuat',
+  'res.sources': 'Sumber',
+  'res.footNote': 'Dibuat oleh Express dari Brain Anda.',
+  'res.openStudio': 'Buka di Learning Studio',
+  'res.download': 'Unduh',
+  'res.preparingFile': 'Menyiapkan file…',
+  'res.pdfHint': 'Membuka dialog cetak: pilih “Save as PDF” / “Simpan sebagai PDF”',
+  'res.pptxHint': 'Slide dari Learning Studio',
+  'res.mdHint': 'Teks dengan judul, untuk disunting',
+  'res.accept': 'Setujui',
+  'res.reject': 'Tolak',
+  'res.addToBrain': 'Masukkan ke Library',
+  'res.inBrain': 'lihat Brain',
+  'res.answer': 'Jawaban',
+  'res.slide': 'Slide {n}',
+  'res.field.description': 'Deskripsi',
+  'res.field.topic': 'Topik',
+  'res.field.objective': 'Tujuan',
+  'res.field.learning_objectives': 'Tujuan pembelajaran',
+  'res.field.user_role': 'Peran peserta',
+  'res.field.ai_character': 'Karakter AI',
+  'res.field.difficulty': 'Tingkat kesulitan',
+  'res.field.context': 'Konteks',
+
+  // Media dan SCORM (Fase 4, 5, 7)
+  'ins.noteVideo': 'Satu video per proses, sekitar {seconds} detik dalam {scenes} adegan, dibuat oleh Video Studio. Setiap video menunggu tinjauan Anda di Hasil.',
+  'ins.noteAudio': 'Dibuat sebagai naskah narasi. Hasil memutarnya dengan suara perangkat dan mengunduhnya sebagai teks (belum MP3: engine belum punya layanan audio untuk agen).',
+  'ins.noteScorm': 'Setiap modul berisi materi dan kuis 10 soal, diunduh dari Hasil sebagai paket SCORM 1.2 untuk LMS Anda.',
+  'ins.videoCadence': 'Jadwal video membuat satu video per proses: pilih 1 per hari atau 1 per minggu.',
+  'ins.videoQuoteFailed': 'Harga video tidak bisa dicek: {message}',
+  'ins.budgetVideo': '{n} per video',
+  'sch.nextVideo': 'Video berikutnya: {when}',
+  'sch.videoNow': 'Buat video sekarang',
+  'sch.videoStarted': 'Video mulai dibuat. Video tampil di Hasil selama proses berjalan.',
+  'sch.runStarted': 'Riset dimulai.',
+  'sch.deleted': 'Jadwal dihapus.',
+  'res.videoProgress': 'Merender… {n}%',
+  'res.videoNotReady': 'Video belum siap',
+  'res.videoFailed': 'Video gagal dibuat',
+  'res.videoFailedCopy': 'Proses render berhenti sebelum video selesai.',
+  'res.downloadVideo': 'Unduh video (MP4)',
+  'res.creditsUsed': 'Kredit terpakai',
+  'res.accepted': 'Disetujui.',
+  'res.rejected': 'Ditolak.',
+  'res.audioNotice': 'Diputar dengan suara perangkat ini, yang bisa berbeda antarperangkat. Unduh naskahnya untuk direkam atau dipakai di alat TTS.',
+  'res.fullScript': 'Lihat naskah lengkap',
+  'res.scriptTxt': 'Naskah (.txt)',
+  'res.scriptHint': 'Teks narasi, untuk direkam atau alat TTS',
+  'res.quiz': 'Kuis',
+  'res.quizPending': 'Kuisnya belum siap.',
+  'res.scormModule': 'Modul SCORM 1.2',
+  'res.scormMeta': 'Materi + {n} soal · nilai lulus {mastery}%',
+  'res.scormHint': 'Untuk LMS: materi, ditandai selesai setelah dibaca',
+  'res.scormQuizHint': 'Untuk LMS: materi dan kuis, melaporkan nilai dan lulus/tidak',
+  'res.scormReady': 'Paket SCORM terunduh. Unggah file .zip ke LMS Anda.',
+  'scorm.submit': 'Periksa jawaban',
+  'scorm.retry': 'Coba lagi',
+  'scorm.complete': 'Tandai selesai',
+  'scorm.completed': 'Selesai ✓',
+  'scorm.score': 'Nilai: {score}%.',
+  'scorm.passed': 'Lulus (nilai lulus {n}%).',
+  'scorm.failed': 'Belum lulus (nilai lulus {n}%).',
+  'scorm.answerAll': 'Jawab semua soal terlebih dahulu.',
+  'scorm.noLms': 'Dibuka di luar LMS: progres tidak disimpan.',
+  'audio.copy': 'Naskah narasi, dibacakan oleh perangkat ini.',
+  'audio.unsupported': 'Browser ini tidak bisa membacakan teks. Unduh naskahnya saja.',
+  'audio.play': 'Dengarkan',
+  'audio.pause': 'Jeda',
+  'audio.resume': 'Lanjutkan',
+  'audio.stop': 'Hentikan',
+  'audio.speed': 'Kecepatan',
+  'audio.ready': '{n} kalimat · tekan Dengarkan untuk mulai',
+  'audio.sentence': 'Kalimat {n} dari {total}',
+  'brain.deleted': '“{name}” dihapus.',
+
+  // Panduan
+  'help.boxTitle': 'Cara kerja Express',
+  'help.boxBody': 'Empat langkah dari materi sampai konten jadi.',
+  'help.open': 'Lihat panduan',
+  'help.title': 'Cara kerja Learning Lab Express',
+  'help.subtitle': 'Otak → Perintah → Jadwal → Hasil',
+  'help.brainTitle': 'Otak',
+  'help.brainBody': 'Unggah materi pelatihan. Setelah pengetahuannya dibangun, AI membuat semua konten dari situ.',
+  'help.instructionTitle': 'Perintah',
+  'help.instructionBody': 'Tulis kebutuhan Anda dalam satu kalimat, misalnya “3 kuis per minggu dan 1 video per minggu soal leadership”. Periksa jadwalnya, lalu setujui.',
+  'help.scheduleTitle': 'Jadwal',
+  'help.scheduleBody': 'Jadwal berjalan sendiri. Jeda, ganti topik, atau produksi sekarang; masing-masing tetap dalam batas kreditnya.',
+  'help.resultsTitle': 'Hasil',
+  'help.resultsBody': 'Tinjau hasilnya, setujui atau tolak, lalu unduh: PDF, Markdown, PowerPoint, MP4, naskah audio, atau SCORM untuk LMS.',
+  'help.note': 'Konten dibuat AI: selalu tinjau sebelum dipakai. Kredit diambil dari ruang kerja organisasi Anda.',
+  'help.done': 'Mengerti',
+
+  'err.unreachable': 'Engine learning-lab tidak dapat dihubungi.',
+  'err.generic': 'Permintaan ke engine gagal.',
+  'err.credits': 'Kredit tidak cukup: butuh {required}, saldo {balance}.',
+  'err.creditsShort': 'Kredit tidak cukup.',
+  'err.docFailed': 'Dokumen gagal diproses.',
+  'err.timeout': 'Pemrosesan dokumen melebihi batas waktu.',
+  'err.researchFailed': 'Riset gagal dijalankan ({code}).',
+}
+
+const dictionaries: Record<Lang, Record<Key, string>> = { en, id }
+const STORAGE = 'lle-lang'
+
+function initial(): Lang {
+  try {
+    const saved = localStorage.getItem(STORAGE)
+    if (saved === 'en' || saved === 'id') return saved
+  } catch { /* storage blocked: fall back to the default */ }
+  return 'en'
+}
+
+let lang: Lang = initial()
+const listeners = new Set<() => void>()
+if (typeof document !== 'undefined') document.documentElement.lang = lang
+
+export const getLang = () => lang
+
+export function setLang(next: Lang) {
+  if (next === lang) return
+  lang = next
+  if (typeof document !== 'undefined') document.documentElement.lang = next
+  try { localStorage.setItem(STORAGE, next) } catch { /* per-device preference only */ }
+  listeners.forEach(l => l())
+}
+
+export function t(key: Key, vars?: Record<string, string | number>): string {
+  const text = dictionaries[lang][key] ?? en[key]
+  return vars ? text.replace(/\{(\w+)\}/g, (m, k) => (k in vars ? String(vars[k]) : m)) : text
+}
+
+/** Re-renders the component when the language changes; returns the active language. */
+export function useLang(): Lang {
+  return useSyncExternalStore(cb => { listeners.add(cb); return () => listeners.delete(cb) }, getLang)
+}
+
+/** BCP 47 locale for dates and numbers. */
+export const locale = () => (lang === 'id' ? 'id-ID' : 'en-US')
diff --git a/src/main.tsx b/src/main.tsx
new file mode 100644
index 0000000..1f2f6c5
--- /dev/null
+++ b/src/main.tsx
@@ -0,0 +1,49 @@
+import { StrictMode } from 'react'
+import { createRoot } from 'react-dom/client'
+import { ClerkProvider } from '@clerk/react'
+import { enUS, idID } from '@clerk/localizations'
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
+import { BrowserRouter } from 'react-router-dom'
+import { EngineError } from './api/client'
+import App from './App'
+import { useLang } from './i18n'
+import './styles/mockup.css'
+import './styles/app.css'
+import './styles/theme.css'
+
+const clerkPubKey = import.meta.env.VITE_CLERK_PUBLISHABLE_KEY
+if (!clerkPubKey) {
+  throw new Error('Missing VITE_CLERK_PUBLISHABLE_KEY (set it, or keep ../learning-lab/backend/.env available)')
+}
+
+const queryClient = new QueryClient({
+  defaultOptions: {
+    // Retrying a 4xx (auth, credits, validation) only repeats the same answer.
+    queries: { retry: (n, e) => n < 2 && !(e instanceof EngineError && e.status >= 400 && e.status < 500) },
+  },
+})
+
+// Clerk's sign-in and organization screens match the theme in styles/theme.css.
+const clerkAppearance = {
+  variables: { colorPrimary: '#1570ef', colorText: '#101828', fontFamily: "'Plus Jakarta Sans', system-ui, sans-serif", borderRadius: '12px' },
+}
+
+// Clerk's own sign-in and organization screens follow the app language.
+function Root() {
+  const lang = useLang()
+  return (
+    <ClerkProvider publishableKey={clerkPubKey} afterSignOutUrl="/" localization={lang === 'id' ? idID : enUS} appearance={clerkAppearance}>
+      <QueryClientProvider client={queryClient}>
+        <BrowserRouter>
+          <App />
+        </BrowserRouter>
+      </QueryClientProvider>
+    </ClerkProvider>
+  )
+}
+
+createRoot(document.getElementById('root')!).render(
+  <StrictMode>
+    <Root />
+  </StrictMode>,
+)
diff --git a/src/pages/Brain.tsx b/src/pages/Brain.tsx
new file mode 100644
index 0000000..529dec6
--- /dev/null
+++ b/src/pages/Brain.tsx
@@ -0,0 +1,250 @@
+import { useEffect, useRef, useState, type ReactNode } from 'react'
+import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'
+import {
+  answerVersion, buildKnowledge, deleteDocument, knowledgeDetail, listDocuments, NEEDS_ANSWER, supportedExtensions, uploadDocument,
+  type Source,
+} from '../api/engine'
+import { Icon } from '../components/Icon'
+import { Empty, PageHead, Skeleton, SkeletonLines, SkeletonRows } from '../components/Page'
+import { toast } from '../components/Toast'
+import { locale, t } from '../i18n'
+
+type Phase = 'ready' | 'working' | 'answer' | 'failed'
+
+function phaseOf(s: Source): Phase {
+  if (s.status === 'failed' || s.knowledge === 'failed') return 'failed'
+  if (s.knowledge === 'ready') return 'ready'
+  if (s.knowledge === 'building' || s.status !== 'completed') return 'working'
+  return NEEDS_ANSWER.has(s.knowledge ?? '') ? 'answer' : 'working'
+}
+
+const extOf = (name: string) => '.' + (name.split('.').pop() ?? '').toLowerCase()
+
+export function BrainPage() {
+  const docs = useQuery({
+    queryKey: ['documents'],
+    queryFn: listDocuments,
+    // Poll quickly while anything is processing or building; slowly otherwise (colleagues may upload too).
+    refetchInterval: q => (q.state.data?.some(d => phaseOf(d) === 'working') ? 3000 : 20_000),
+  })
+  const ready = docs.data?.filter(d => phaseOf(d) === 'ready').length ?? 0
+  const waiting = docs.data?.filter(d => phaseOf(d) === 'answer').length ?? 0
+
+  return (
+    <>
+      <PageHead title={t('brain.title')} description={t('brain.description')} />
+      <div className="metrics">
+        <div className="metric"><span>{t('brain.metricMaterial')}</span>{docs.data ? <strong>{docs.data.length}</strong> : <Skeleton className="skel-num" />}<small>{t('brain.metricMaterialSub')}</small></div>
+        <div className="metric"><span>{t('brain.metricReady')}</span>{docs.data ? <strong>{ready}</strong> : <Skeleton className="skel-num" />}<small>{t('brain.metricReadySub')}</small></div>
+        <div className="metric"><span>{t('brain.metricAction')}</span>{docs.data ? <strong>{waiting}</strong> : <Skeleton className="skel-num" />}<small>{t('brain.metricActionSub')}</small></div>
+      </div>
+      <UploadBox />
+      <div className="card">
+        <div className="card-head"><h3>{t('brain.listTitle')}</h3><Icon name="brain" /></div>
+        {docs.isPending && <SkeletonRows label={t('brain.loading')} />}
+        {docs.isError && <Empty icon="info" title={t('brain.engineDown')}>{docs.error.message}</Empty>}
+        {docs.data?.length === 0 && <Empty icon="upload" title={t('brain.empty')}>{t('brain.emptyCopy')}</Empty>}
+        {!!docs.data?.length && <div className="result-list">{docs.data.map(d => <DocumentRow key={d.docId} doc={d} />)}</div>}
+      </div>
+    </>
+  )
+}
+
+interface UploadItem { id: number; name: string; state: 'uploading' | 'done' | 'error'; message?: string }
+
+let nextUploadId = 1
+const hasFiles = (e: globalThis.DragEvent) => !!e.dataTransfer?.types.includes('Files')
+
+function UploadBox() {
+  const queryClient = useQueryClient()
+  const input = useRef<HTMLInputElement>(null)
+  const [drag, setDrag] = useState(false)
+  const [items, setItems] = useState<UploadItem[]>([])
+  const exts = useQuery({ queryKey: ['supported-extensions'], queryFn: supportedExtensions, staleTime: Infinity })
+  const accept = exts.data ? [...exts.data].join(',') : undefined
+  const update = (id: number, patch: Partial<UploadItem>) => setItems(prev => prev.map(it => (it.id === id ? { ...it, ...patch } : it)))
+
+  async function upload(files: File[]) {
+    if (!files.length) return
+    const allowed = exts.data
+    const batch: UploadItem[] = files.map(f => (allowed && !allowed.has(extOf(f.name))
+      ? { id: nextUploadId++, name: f.name, state: 'error', message: t('brain.unsupported') }
+      : { id: nextUploadId++, name: f.name, state: 'uploading' }))
+    // Appended, so files dropped while an earlier batch is still uploading keep their own rows.
+    setItems(prev => [...prev.filter(it => it.state === 'uploading'), ...batch])
+    // One at a time: each upload enqueues a processing job, and the list refreshes after each.
+    for (const [i, file] of files.entries()) {
+      if (batch[i].state === 'error') continue
+      try {
+        await uploadDocument(file)
+        update(batch[i].id, { state: 'done' })
+      } catch (e) {
+        update(batch[i].id, { state: 'error', message: (e as Error).message })
+      }
+      await queryClient.invalidateQueries({ queryKey: ['documents'] })
+    }
+  }
+  const uploadRef = useRef(upload)
+  uploadRef.current = upload
+
+  // The whole page is the drop target, and a file dropped anywhere is uploaded instead of the
+  // browser opening it and leaving the app. The counter absorbs dragenter/leave from child elements.
+  useEffect(() => {
+    let depth = 0
+    const enter = (e: globalThis.DragEvent) => { if (hasFiles(e)) { depth++; setDrag(true) } }
+    const leave = (e: globalThis.DragEvent) => { if (hasFiles(e) && --depth <= 0) { depth = 0; setDrag(false) } }
+    const over = (e: globalThis.DragEvent) => { if (hasFiles(e)) { e.preventDefault(); e.dataTransfer!.dropEffect = 'copy' } }
+    const drop = (e: globalThis.DragEvent) => {
+      if (!hasFiles(e)) return
+      e.preventDefault()
+      depth = 0
+      setDrag(false)
+      uploadRef.current([...e.dataTransfer!.files])
+    }
+    window.addEventListener('dragenter', enter)
+    window.addEventListener('dragleave', leave)
+    window.addEventListener('dragover', over)
+    window.addEventListener('drop', drop)
+    return () => {
+      window.removeEventListener('dragenter', enter)
+      window.removeEventListener('dragleave', leave)
+      window.removeEventListener('dragover', over)
+      window.removeEventListener('drop', drop)
+    }
+  }, [])
+
+  const busy = items.some(i => i.state === 'uploading')
+  return (
+    <div className={`upload-box upload-compact${drag ? ' drag' : ''}`}>
+      {drag && (
+        <div className="drop-overlay" aria-hidden="true">
+          <div><Icon name="upload" /><b>{t('brain.dropHere')}</b></div>
+        </div>
+      )}
+      <span className="upload-symbol"><Icon name="upload" /></span>
+      <div>
+        <h3>{t('brain.uploadTitle')}</h3>
+        <p>{t('brain.uploadCopy')}</p>
+        <small>{exts.data ? t('brain.formats', { list: [...exts.data].map(x => x.slice(1).toUpperCase()).join(', ') }) : t('brain.formatsLoading')}</small>
+        {items.length > 0 && (
+          <ul className="upload-progress">
+            {items.map(it => (
+              <li key={it.id}>
+                <b>{it.name}</b>{' '}
+                {it.state === 'uploading' && <span className="status draft">{t('brain.uploading')}</span>}
+                {it.state === 'done' && <span className="status ready">{t('brain.uploaded')}</span>}
+                {it.state === 'error' && <span className="error">{it.message}</span>}
+              </li>
+            ))}
+          </ul>
+        )}
+      </div>
+      <button className="btn primary" disabled={busy} onClick={() => input.current?.click()}>
+        <Icon name="plus" />{busy ? t('brain.uploading') : t('brain.chooseFiles')}
+      </button>
+      <input ref={input} type="file" multiple hidden accept={accept}
+        onChange={e => { upload([...(e.target.files ?? [])]); e.target.value = '' }} />
+    </div>
+  )
+}
+
+function DocumentRow({ doc }: { doc: Source }) {
+  const phase = phaseOf(doc)
+  return (
+    <div className="result-row">
+      <span className={`file-icon ${doc.format.toLowerCase()}`}>{doc.format.slice(0, 4)}</span>
+      <div style={{ minWidth: 0, flex: 1 }}>
+        <b>{doc.title}</b>
+        <div><small>{new Date(doc.createdAt).toLocaleDateString(locale())}</small></div>
+        {phase === 'working' && <Progress doc={doc} />}
+        {(phase === 'answer' || phase === 'failed') && <KnowledgeAction doc={doc} />}
+      </div>
+      <StatusBadge doc={doc} phase={phase} />
+      <DeleteButton doc={doc} />
+    </div>
+  )
+}
+
+function StatusBadge({ doc, phase }: { doc: Source; phase: Phase }) {
+  const label = {
+    ready: t('brain.statusReady'),
+    working: doc.knowledge === 'building' ? t('brain.statusBuilding') : t('brain.statusProcessing'),
+    answer: t('brain.statusAnswer'),
+    failed: t('brain.statusFailed'),
+  }[phase]
+  return <span className={`status ${phase === 'ready' ? 'ready' : 'draft'}`}><i className="dot"></i>{label}</span>
+}
+
+function Progress({ doc }: { doc: Source }) {
+  const pct = Math.max(5, Math.min(100, doc.progress ?? 5))
+  return (
+    <div className="doc-progress">
+      <div className="progress-track"><i style={{ width: `${pct}%` }} /></div>
+      <small>{doc.stage || t('brain.queued')}</small>
+    </div>
+  )
+}
+
+// Each stop the engine can make before building, with the one answer it needs.
+function KnowledgeAction({ doc }: { doc: Source }) {
+  const queryClient = useQueryClient()
+  const detail = useQuery({ queryKey: ['knowledge', doc.docId, doc.knowledge], queryFn: () => knowledgeDetail(doc.docId) })
+  const refresh = () => queryClient.invalidateQueries({ queryKey: ['documents'] })
+  const build = useMutation({ mutationFn: () => buildKnowledge(doc.docId), onSuccess: refresh })
+  const version = useMutation({ mutationFn: (link: boolean) => answerVersion(doc.docId, link), onSuccess: refresh })
+  const error = build.error ?? version.error
+  const busy = build.isPending || version.isPending
+
+  const d = detail.data
+  if (detail.isPending) return <div className="doc-action"><SkeletonLines label={t('common.loading')} /></div>
+  if (!d) return <div className="doc-action"><span className="error">{detail.error?.message}</span></div>
+
+  const credits = d.quote ? t('common.credits', { n: d.quote.credits }) : null
+  let text: string
+  let actions: ReactNode = null
+  switch (d.status) {
+    case 'awaiting_version_answer':
+      text = d.candidate ? t('brain.versionWithCandidate', { name: d.candidate.filename }) : t('brain.versionGeneric')
+      actions = (
+        <>
+          <button className="btn small" disabled={busy} onClick={() => version.mutate(true)}>{t('brain.versionYes')}</button>
+          <button className="btn small" disabled={busy} onClick={() => version.mutate(false)}>{t('brain.versionNo')}</button>
+        </>
+      )
+      break
+    case 'needs_credits':
+      text = t('brain.needsCredits', { need: credits ? t('brain.needsCreditsNeed', { credits }) : '' })
+      actions = <button className="btn small" disabled={busy} onClick={() => build.mutate()}>{t('common.retry')}</button>
+      break
+    case 'failed':
+      text = d.error || t('brain.failed')
+      if (d.quote) actions = <button className="btn small" disabled={busy} onClick={() => build.mutate()}>{t('brain.retryWith', { credits: credits ?? '' })}</button>
+      break
+    default:
+      text = t('brain.confirmCopy', { credits: credits ?? t('brain.confirmCreditsFallback') })
+      actions = <button className="btn small primary" disabled={busy} onClick={() => build.mutate()}>{t('brain.addToBrain')}{credits && ` · ${credits}`}</button>
+  }
+
+  return (
+    <div className="doc-action">
+      <small>{text}</small>
+      {actions && <div className="doc-action-buttons">{actions}</div>}
+      {error && <span className="error">{error.message}</span>}
+    </div>
+  )
+}
+
+function DeleteButton({ doc }: { doc: Source }) {
+  const queryClient = useQueryClient()
+  const del = useMutation({
+    mutationFn: () => deleteDocument(doc.docId),
+    onSuccess: () => { toast(t('brain.deleted', { name: doc.title })); queryClient.invalidateQueries({ queryKey: ['documents'] }) },
+    onError: e => toast(e.message, { error: true }),
+  })
+  return (
+    <button className="icon-btn" aria-label={t('brain.delete', { name: doc.title })} disabled={del.isPending}
+      onClick={() => confirm(t('brain.deleteConfirm', { name: doc.title })) && del.mutate()}>
+      <Icon name="trash" />
+    </button>
+  )
+}
diff --git a/src/pages/Instruction.tsx b/src/pages/Instruction.tsx
new file mode 100644
index 0000000..f032ac4
--- /dev/null
+++ b/src/pages/Instruction.tsx
@@ -0,0 +1,194 @@
+import { useState } from 'react'
+import { Link } from 'react-router-dom'
+import { useQuery, useQueryClient } from '@tanstack/react-query'
+import { Icon, ruleIcon } from '../components/Icon'
+import { PageHead } from '../components/Page'
+import {
+  dayName, describeRule, kindLabel, KINDS, monthNote, parseInstruction, videoCadence, weeklyTarget,
+  type ContentKind, type ContentRule, type ResearchRule, type Rule,
+} from '../express/parse'
+import { t, type Key } from '../i18n'
+import { budgetFor, canSchedule, createSchedule, VIDEO, videoQuote } from '../express/schedules'
+
+const EXAMPLES: Key[] = ['ins.ex1', 'ins.ex2', 'ins.ex3', 'ins.ex4', 'ins.ex5']
+
+// How the kinds that are not a plain Compose output are made, shown under the rule.
+const KIND_NOTE: Partial<Record<ContentKind, Key>> = { video: 'ins.noteVideo', audio: 'ins.noteAudio', scorm: 'ins.noteScorm' }
+
+type Outcome = { rule: Rule; ok: boolean; message?: string }
+
+export function InstructionPage() {
+  const queryClient = useQueryClient()
+  const [text, setText] = useState('')
+  const [rules, setRules] = useState<Rule[] | null>(null)
+  const [unknown, setUnknown] = useState<string[]>([])
+  const [saving, setSaving] = useState(false)
+  const [outcomes, setOutcomes] = useState<Outcome[] | null>(null)
+
+  function compose() {
+    const result = parseInstruction(text)
+    setRules(result.rules)
+    setUnknown(result.unknown)
+    setOutcomes(null)
+  }
+
+  // A count or frequency typed in by hand replaces the monthly request it was derived from.
+  const update = (i: number, patch: Partial<ContentRule> | Partial<ResearchRule>) =>
+    setRules(rs => rs!.map((r, j) => (j === i
+      ? ({ ...r, ...patch, ...('count' in patch || 'per' in patch ? { monthly: undefined } : {}) } as Rule)
+      : r)))
+  const remove = (i: number) => setRules(rs => rs!.filter((_, j) => j !== i))
+
+  const ready = rules?.filter(canSchedule) ?? []
+
+  async function approve() {
+    setSaving(true)
+    const done: Outcome[] = []
+    // One at a time so a failure (e.g. not an organization owner) is reported per schedule.
+    for (const rule of ready) {
+      try {
+        await createSchedule(rule)
+        done.push({ rule, ok: true })
+      } catch (e) {
+        done.push({ rule, ok: false, message: (e as Error).message })
+      }
+      setOutcomes([...done])
+    }
+    setSaving(false)
+    await queryClient.invalidateQueries({ queryKey: ['schedules'] })
+    if (done.every(o => o.ok)) { setRules(null); setText('') }
+    // Only the failed rules stay, so approving again does not create the others twice.
+    else setRules(rs => rs!.filter(r => !done.some(o => o.ok && o.rule === r)))
+  }
+
+  return (
+    <>
+      <PageHead title={t('ins.title')} description={t('ins.description')} />
+
+      <div className="card">
+        <div className="card-head"><h3>{t('ins.cardTitle')}</h3><Icon name="spark" /></div>
+        <div style={{ padding: '20px 22px 8px' }}>
+          <label htmlFor="instruction">{t('ins.label')}</label>
+          <textarea id="instruction" rows={3} value={text} placeholder={t('ins.placeholder')}
+            onChange={e => setText(e.target.value)}
+            onKeyDown={e => { if (e.key === 'Enter' && (e.metaKey || e.ctrlKey) && text.trim()) compose() }} />
+          <div className="ai-compose-footer">
+            <small>{t('ins.hint')}</small>
+            <button className="btn primary" disabled={!text.trim()} onClick={compose}><Icon name="calendar" />{t('ins.compose')}</button>
+          </div>
+        </div>
+        <div className="prompt-chips" style={{ paddingTop: 12 }}>
+          {EXAMPLES.map(key => <button key={key} onClick={() => { setText(t(key)); setRules(null); setOutcomes(null) }}>{t(key)}</button>)}
+        </div>
+      </div>
+
+      {rules && (
+        <div className="card" style={{ marginTop: 22 }}>
+          <div className="card-head"><h3>{t('ins.previewTitle')}</h3><span className="badge neutral">{t('ins.readyCount', { n: ready.length })}</span></div>
+          {rules.length === 0 && (
+            <div className="empty"><h3>{t('ins.notUnderstood')}</h3><p>{t('ins.notUnderstoodCopy')}</p></div>
+          )}
+          <div className="rule-list">
+            {rules.map((rule, i) => <RuleCard key={i} rule={rule} onChange={p => update(i, p)} onRemove={() => remove(i)} />)}
+          </div>
+          {unknown.length > 0 && (
+            <div className="notice-row" style={{ margin: '0 22px 18px' }}>
+              <Icon name="info" /><span>{t('ins.skipped', { parts: unknown.map(u => `“${u}”`).join(', ') })}</span>
+            </div>
+          )}
+          {ready.length > 0 && (
+            <div className="rule-approve">
+              <small>{t('ins.approveNote')}</small>
+              <button className="btn primary" disabled={saving} onClick={approve}>
+                <Icon name="check" />{saving ? t('ins.approving') : t('ins.approve', { n: ready.length })}
+              </button>
+            </div>
+          )}
+          {outcomes && (
+            <ul className="rule-outcomes">
+              {outcomes.map((o, i) => (
+                <li key={i}>
+                  <span className={`status ${o.ok ? 'ready' : 'draft'}`}><i className="dot"></i>{o.ok ? t('ins.active') : t('ins.failed')}</span>
+                  <span>{describeRule(o.rule)}</span>
+                  {o.message && <span className="error">{o.message}</span>}
+                </li>
+              ))}
+              {outcomes.some(o => o.ok) && <li><Link className="btn small" to="/schedule">{t('ins.viewSchedule')} <Icon name="arrow-right" /></Link></li>}
+            </ul>
+          )}
+        </div>
+      )}
+    </>
+  )
+}
+
+function RuleCard({ rule, onChange, onRemove }: {
+  rule: Rule
+  onChange: (patch: Partial<ContentRule> | Partial<ResearchRule>) => void
+  onRemove: () => void
+}) {
+  const video = rule.type === 'content' && rule.kind === 'video'
+  const badCadence = video && videoCadence(rule) === null
+  const tooMany = rule.type === 'content' && !video && weeklyTarget(rule) > 50
+  // A video's credit limit follows today's price of one video.
+  const quote = useQuery({ queryKey: ['video-quote'], queryFn: videoQuote, enabled: video, staleTime: 5 * 60_000 })
+  const budget = canSchedule(rule) && (!video || quote.data) ? budgetFor(rule, quote.data?.max_credits) : null
+
+  return (
+    <div className={`rule-card${badCadence ? ' muted' : ''}`}>
+      <span className="rule-icon"><Icon name={ruleIcon(rule)} /></span>
+      <div className="rule-body">
+        <b>{describeRule(rule)}</b>
+        <div className="rule-fields">
+          {rule.type === 'content' ? (
+            <>
+              <select aria-label={t('ins.kind')} value={rule.kind} onChange={e => onChange({ kind: e.target.value as ContentKind })}>
+                {KINDS.map(k => <option key={k} value={k}>{kindLabel(k)}</option>)}
+              </select>
+              <input aria-label={t('ins.count')} type="number" min={1} max={50} value={rule.count}
+                onChange={e => onChange({ count: Math.max(1, Number(e.target.value) || 1) })} />
+              <select aria-label={t('ins.frequency')} value={rule.per} onChange={e => onChange({ per: e.target.value as ContentRule['per'] })}>
+                <option value="day">{t('ins.perDay')}</option>
+                <option value="week">{t('ins.perWeek')}</option>
+              </select>
+            </>
+          ) : (
+            <>
+              <select aria-label={t('ins.researchFrequency')} value={rule.cadence} onChange={e => onChange({ cadence: e.target.value as ResearchRule['cadence'] })}>
+                <option value="daily">{t('ins.everyDay')}</option>
+                <option value="weekly">{t('ins.everyWeek')}</option>
+              </select>
+              {rule.cadence === 'weekly' && (
+                <select aria-label={t('ins.weekday')} value={rule.weekday} onChange={e => onChange({ weekday: Number(e.target.value) })}>
+                  {[0, 1, 2, 3, 4, 5, 6].map(d => <option key={d} value={d}>{dayName(d)}</option>)}
+                </select>
+              )}
+            </>
+          )}
+          <input aria-label={t('ins.topic')} className="rule-topic" value={rule.topic} placeholder={t('ins.topicPlaceholder')}
+            onChange={e => onChange({ topic: e.target.value })} />
+        </div>
+        {rule.type === 'research' && (
+          <label className="rule-check">
+            <input type="checkbox" checked={rule.autoApprove} onChange={e => onChange({ autoApprove: e.target.checked })} />
+            {t('ins.autoApprove')}
+          </label>
+        )}
+        {rule.type === 'content' && KIND_NOTE[rule.kind] && <small className="rule-note">{t(KIND_NOTE[rule.kind]!, { seconds: VIDEO.seconds, scenes: VIDEO.scenes })}</small>}
+        {badCadence && <small className="error">{t('ins.videoCadence')} {t('ins.notCreated')}</small>}
+        {video && quote.isError && <small className="error">{t('ins.videoQuoteFailed', { message: quote.error.message })}</small>}
+        {tooMany && <small className="error">{t('ins.tooMany')}</small>}
+        {rule.type === 'content' && rule.monthly && <small className="rule-note">{monthNote(rule)}</small>}
+        {budget && (
+          <small className="rule-note">
+            {t('ins.budget', {
+              first: budget.weekly ? t('ins.budgetWeekly', { n: budget.weekly }) : t(video ? 'ins.budgetVideo' : 'ins.budgetRun', { n: budget.run }),
+              monthly: budget.monthly,
+            })}
+          </small>
+        )}
+      </div>
+      <button className="icon-btn" aria-label={t('ins.removeRule')} onClick={onRemove}><Icon name="trash" /></button>
+    </div>
+  )
+}
diff --git a/src/pages/Results.tsx b/src/pages/Results.tsx
new file mode 100644
index 0000000..117d6e2
--- /dev/null
+++ b/src/pages/Results.tsx
@@ -0,0 +1,423 @@
+import { useEffect, useMemo, useRef, useState, type ReactNode } from 'react'
+import { renderToStaticMarkup } from 'react-dom/server'
+import { Link } from 'react-router-dom'
+import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'
+import { AudioPlayer } from '../components/AudioPlayer'
+import { Icon, KIND_ICON, type IconName } from '../components/Icon'
+import { Empty, PageHead, SkeletonCards, SkeletonLines, SkeletonRows } from '../components/Page'
+import { toast } from '../components/Toast'
+import { describeRule, kindLabel, type ContentKind } from '../express/parse'
+import {
+  decideMaterial, download, exportPptx, fileName, isWorking, printPdf, listOf, listResults, materialContent, materialKey, questionsOf, reviewSource, slidesOf, textOf,
+  titleOf, toMarkdown, type FoundSource, type Material, type MaterialContent, type MaterialStatus,
+} from '../express/results'
+import { MASTERY, scormPackage } from '../express/scorm'
+import { getLang, locale, t, type Key } from '../i18n'
+
+const STUDIO_URL: string = import.meta.env.VITE_STUDIO_URL
+
+// Setup fields of roleplay and simulator content, in display order.
+const FIELDS = ['description', 'topic', 'objective', 'learning_objectives', 'user_role', 'ai_character', 'difficulty', 'context'] as const
+
+type StatusFilter = 'all' | 'review' | 'approved' | 'working' | 'failed'
+const STATUS_GROUP: Record<MaterialStatus, StatusFilter> = {
+  preparing: 'working', generating: 'working', ready: 'review', accepted: 'approved', failed: 'failed', rejected: 'failed',
+}
+
+const fmt = (iso: string) => new Intl.DateTimeFormat(locale(), { day: 'numeric', month: 'short', year: 'numeric', hour: '2-digit', minute: '2-digit' }).format(new Date(iso))
+
+export function ResultsPage() {
+  const results = useQuery({
+    queryKey: ['results'],
+    queryFn: listResults,
+    refetchInterval: q => (q.state.data?.materials.some(isWorking) ? 10_000 : 60_000),
+  })
+  const [tab, setTab] = useState<'content' | 'research'>('content')
+  const [query, setQuery] = useState('')
+  const [kind, setKind] = useState<ContentKind | 'all'>('all')
+  const [status, setStatus] = useState<StatusFilter>('all')
+  const [openId, setOpenId] = useState<string | null>(null)
+
+  const materials = results.data?.materials ?? []
+  const sources = results.data?.sources ?? []
+  const kinds = useMemo(() => [...new Set(materials.map(m => m.kind))], [materials])
+  const needle = query.trim().toLowerCase()
+  const shownMaterials = materials.filter(m => (kind === 'all' || m.kind === kind) && (status === 'all' || STATUS_GROUP[m.status] === status)
+    && (!needle || titleOf(m).toLowerCase().includes(needle)))
+  const shownSources = sources.filter(s => !needle || s.title.toLowerCase().includes(needle) || s.url?.toLowerCase().includes(needle))
+  const open = materials.find(m => materialKey(m) === openId) ?? null
+  const pending = sources.filter(s => s.status === 'pending').length
+
+  return (
+    <>
+      <PageHead title={t('res.title')} description={t('res.description')} />
+      <div className="result-tabs" role="tablist">
+        <button role="tab" aria-selected={tab === 'content'} className={tab === 'content' ? 'active' : undefined} onClick={() => setTab('content')}>
+          {t('res.tabContent')} <b>{materials.length}</b>
+        </button>
+        <button role="tab" aria-selected={tab === 'research'} className={tab === 'research' ? 'active' : undefined} onClick={() => setTab('research')}>
+          {t('res.tabResearch')} <b>{pending ? t('res.pendingCount', { n: pending }) : sources.length}</b>
+        </button>
+      </div>
+      <section className="card">
+        <div className="toolbar">
+          <h3>{tab === 'content' ? t('res.allContent') : t('res.foundSources')} <span className="badge neutral">{tab === 'content' ? shownMaterials.length : shownSources.length}</span></h3>
+          <div className="toolbar-controls">
+            <div className="search"><Icon name="search" />
+              <input aria-label={t('res.search')} placeholder={t('res.search')} value={query} onChange={e => setQuery(e.target.value)} />
+            </div>
+            {tab === 'content' && (
+              <>
+                <select aria-label={t('res.filterKind')} value={kind} onChange={e => setKind(e.target.value as ContentKind | 'all')}>
+                  <option value="all">{t('res.allKinds')}</option>
+                  {kinds.map(k => <option key={k} value={k}>{kindLabel(k)}</option>)}
+                </select>
+                <select aria-label={t('res.filterStatus')} value={status} onChange={e => setStatus(e.target.value as StatusFilter)}>
+                  {(['all', 'review', 'approved', 'working', 'failed'] as const).map(s => <option key={s} value={s}>{t(`res.status.${s}` as Key)}</option>)}
+                </select>
+              </>
+            )}
+          </div>
+        </div>
+        {results.isPending && (tab === 'content' ? <SkeletonCards label={t('common.loading')} /> : <SkeletonRows label={t('common.loading')} />)}
+        {results.isError && !results.data && <Empty icon="info" title={t('res.loadFailed')}>{results.error.message}</Empty>}
+        {results.data && tab === 'content' && (
+          shownMaterials.length
+            ? <div className="content-grid">{shownMaterials.map(m => <ContentCard key={materialKey(m)} material={m} onOpen={() => setOpenId(materialKey(m))} />)}</div>
+            : <NoResults filtered={materials.length > 0} icon="layers" />
+        )}
+        {results.data && tab === 'research' && (
+          shownSources.length
+            ? <div className="research-list">{shownSources.map(s => <SourceRow key={`${s.agentId}-${s.id}`} source={s} />)}</div>
+            : <NoResults filtered={sources.length > 0} icon="search" />
+        )}
+        <div className="table-note">{tab === 'content' ? t('res.noteContent') : t('res.noteResearch')}</div>
+      </section>
+      {open && <Preview material={open} onClose={() => setOpenId(null)} />}
+    </>
+  )
+}
+
+function NoResults({ filtered, icon }: { filtered: boolean; icon: IconName }) {
+  if (filtered) return <Empty icon="search" title={t('res.noMatch')}>{t('res.noMatchCopy')}</Empty>
+  return (
+    <div className="empty">
+      <span className="empty-icon"><Icon name={icon} /></span>
+      <h3>{t('res.empty')}</h3>
+      <p>{t('res.emptyCopy')}</p>
+      <Link className="btn light" to="/instruction"><Icon name="plus" />{t('sch.newInstruction')}</Link>
+    </div>
+  )
+}
+
+function StatusBadge({ status }: { status: MaterialStatus }) {
+  const group = STATUS_GROUP[status]
+  const tone = group === 'approved' ? 'ready' : group === 'failed' ? 'failed' : 'draft'
+  return <span className={`status ${tone}`}><i className="dot"></i>{t(`res.state.${status}` as Key)}</span>
+}
+
+function ContentCard({ material: m, onOpen }: { material: Material; onOpen: () => void }) {
+  const working = isWorking(m)
+  return (
+    <article className="content-card">
+      <div className={`content-cover kind-${m.kind}`}>
+        <Icon name={KIND_ICON[m.kind]} /><span>{kindLabel(m.kind)}</span>
+        <small>{m.rule.topic ? m.rule.topic.toUpperCase() : 'EXPRESS'}</small>
+      </div>
+      <div className="content-card-body">
+        <div className="content-card-top"><span className="type-badge"><Icon name={KIND_ICON[m.kind]} />{kindLabel(m.kind)}</span><StatusBadge status={m.status} /></div>
+        <button className="content-title" disabled={working} onClick={onOpen}>{titleOf(m)}</button>
+        <p>{t(m.sources.length === 1 ? 'res.sourceOne' : 'res.sourceCount', { n: m.sources.length })} · {fmt(m.createdAt)}</p>
+        <div className="content-card-foot">
+          <span title={describeRule(m.rule)}>{describeRule(m.rule)}</span>
+          {working
+            ? <span>{m.video ? t('res.videoProgress', { n: m.video.progress }) : t('res.working')}</span>
+            : <button className="text-btn" onClick={onOpen}>{t('res.open')} <Icon name="arrow-right" /></button>}
+        </div>
+      </div>
+    </article>
+  )
+}
+
+function Preview({ material: m, onClose }: { material: Material; onClose: () => void }) {
+  const ref = useRef<HTMLDialogElement>(null)
+  const queryClient = useQueryClient()
+  // Every part's revision, so a SCORM module refetches when only its quiz changes.
+  const content = useQuery({ queryKey: ['material', materialKey(m), m.parts.map(p => p.revision).join('.')], queryFn: () => materialContent(m) })
+  const decide = useMutation({
+    mutationFn: (decision: 'accept' | 'reject') => decideMaterial(m, decision),
+    onSuccess: (_, decision) => {
+      toast(t(decision === 'accept' ? 'res.accepted' : 'res.rejected'))
+      queryClient.invalidateQueries({ queryKey: ['results'] })
+    },
+  })
+
+  // No close() on cleanup: its async "close" event would call onClose, and StrictMode's
+  // mount → cleanup → mount in dev would then shut the dialog right after it opened.
+  // Unmounting removes the dialog element, which ends the modal anyway.
+  useEffect(() => {
+    if (ref.current && !ref.current.open) ref.current.showModal()
+  }, [])
+
+  return (
+    <dialog ref={ref} className="preview" aria-labelledby="preview-title" onClose={onClose}
+      onClick={e => e.target === ref.current && ref.current.close()}>
+      <div className="modal-head">
+        <div><h2 id="preview-title">{titleOf(m)}</h2><p>{describeRule(m.rule)}</p></div>
+        <button className="icon-btn" aria-label={t('res.close')} onClick={() => ref.current?.close()}><Icon name="close" /></button>
+      </div>
+      <div className="modal-body">
+        {m.status === 'ready' && <div className="preview-notice"><Icon name="info" /><span>{t('res.reviewNotice')}</span></div>}
+        {m.kind === 'audio' && <div className="preview-notice concept"><Icon name="info" /><span>{t('res.audioNotice')}</span></div>}
+        <div className="preview-layout">
+          <div>
+            {content.isPending && <SkeletonLines count={6} label={t('common.loading')} />}
+            {content.isError && <Empty icon="info" title={t('res.loadFailed')}>{content.error.message}</Empty>}
+            {content.isSuccess && (content.data.content ? <Body material={m} content={content.data.content} /> : <Empty icon="info" title={t('res.noContent')}>{t('res.noContentCopy')}</Empty>)}
+          </div>
+          <aside className="preview-side">
+            <h3>{t('res.info')}</h3>
+            <span className="type-badge"><Icon name={KIND_ICON[m.kind]} />{kindLabel(m.kind)}</span>
+            <div className="detail-label">{t('res.statusLabel')}</div><StatusBadge status={m.status} />
+            <div className="detail-label">{t('res.schedule')}</div><b>{describeRule(m.rule)}</b>
+            <div className="detail-label">{t('res.created')}</div><b>{fmt(m.createdAt)}</b>
+            {m.video?.credits != null && m.video.credits > 0 && <><div className="detail-label">{t('res.creditsUsed')}</div><b>{t('common.credits', { n: m.video.credits })}</b></>}
+            <div className="detail-label">{t('res.sources')}</div>
+            {m.sources.length ? m.sources.map(s => <div key={s} className="preview-source"><Icon name="file" />{s}</div>) : <b>–</b>}
+          </aside>
+        </div>
+      </div>
+      <div className="modal-foot">
+        {decide.error ? <small className="error">{decide.error.message}</small> : <small>{t('res.footNote')}</small>}
+        {m.composeSetId && <a className="btn" href={`${STUDIO_URL}/compose/${m.composeSetId}`} target="_blank" rel="noreferrer">{t('res.openStudio')}</a>}
+        {content.data?.content && <DownloadMenu material={m} content={content.data.content} outputId={content.data.outputId} />}
+        {m.status === 'ready' && (
+          <>
+            <button className="btn danger" disabled={decide.isPending} onClick={() => decide.mutate('reject')}>{t('res.reject')}</button>
+            <button className="btn primary" disabled={decide.isPending} onClick={() => decide.mutate('accept')}><Icon name="check" />{t('res.accept')}</button>
+          </>
+        )}
+      </div>
+    </dialog>
+  )
+}
+
+// What a learner sees in a SCORM package: the lesson without the answer key (the quiz is interactive there).
+function lessonHtml(m: Material, content: MaterialContent): string {
+  if (m.kind === 'quiz') return ''
+  if (m.kind === 'summary' || m.kind === 'audio' || m.kind === 'scorm') {
+    return renderToStaticMarkup(<article className="prose"><Paragraphs text={summaryText(m, content)} /></article>)
+  }
+  return renderToStaticMarkup(<Body material={m} content={content} />)
+}
+
+function scorm(m: Material, content: MaterialContent) {
+  const blob = scormPackage({
+    title: textOf(content.title) || titleOf(m),
+    lessonHtml: lessonHtml(m, content),
+    questions: m.kind === 'quiz' || m.kind === 'scorm' ? questionsOf(content) : [],
+    lang: getLang(),
+    labels: {
+      quiz: t('res.quiz'), submit: t('scorm.submit'), retry: t('scorm.retry'), complete: t('scorm.complete'),
+      completed: t('scorm.completed'), score: t('scorm.score'), passed: t('scorm.passed', { n: MASTERY }),
+      failed: t('scorm.failed', { n: MASTERY }), answerAll: t('scorm.answerAll'), noLms: t('scorm.noLms'),
+    },
+  })
+  download(fileName(m, 'zip'), blob)
+  toast(t('res.scormReady'))
+}
+
+function DownloadMenu({ material: m, content, outputId }: { material: Material; content: MaterialContent; outputId: number | null }) {
+  const ref = useRef<HTMLDetailsElement>(null)
+  const pptx = useMutation({
+    mutationFn: () => exportPptx(outputId!),
+    onSuccess: blob => download(fileName(m, 'pptx'), blob),
+    onError: e => toast(e.message, { error: true }),
+  })
+  const close = () => ref.current?.removeAttribute('open')
+
+  if (m.kind === 'video') {
+    return m.video?.url
+      ? <a className="btn" href={m.video.url} download={fileName(m, 'mp4')}><Icon name="download" />{t('res.downloadVideo')}</a>
+      : null
+  }
+
+  const scormItem = (
+    <button role="menuitem" onClick={() => { close(); scorm(m, content) }}>
+      <b>SCORM 1.2 (.zip)</b><small>{t(m.kind === 'scorm' || m.kind === 'quiz' ? 'res.scormQuizHint' : 'res.scormHint')}</small>
+    </button>
+  )
+
+  const pdf = () => {
+    const title = textOf(content.title) || titleOf(m)
+    const meta = [describeRule(m.rule), fmt(m.createdAt)].join(' · ')
+    const html = renderToStaticMarkup(
+      <>
+        <header><small>Learning Lab Express</small><h1>{title}</h1><p>{meta}</p></header>
+        {/* The audio player is for the screen; on paper the script is the lesson. */}
+        {m.kind === 'audio' ? <article className="prose"><Paragraphs text={summaryText(m, content)} /></article> : <Body material={m} content={content} />}
+        {!!m.sources.length && <footer>{t('res.sources')}: {m.sources.join(', ')}</footer>}
+      </>,
+    )
+    printPdf(title, html)
+  }
+
+  return (
+    <details className="download-menu" ref={ref}>
+      <summary className="btn"><Icon name="download" />{pptx.isPending ? t('res.preparingFile') : t('res.download')}</summary>
+      <div role="menu">
+        {m.kind === 'scorm' && scormItem}
+        {m.kind === 'audio' && (
+          <button role="menuitem" onClick={() => { close(); download(fileName(m, 'txt'), new Blob([summaryText(m, content)], { type: 'text/plain;charset=utf-8' })) }}>
+            <b>{t('res.scriptTxt')}</b><small>{t('res.scriptHint')}</small>
+          </button>
+        )}
+        <button role="menuitem" onClick={() => { close(); pdf() }}><b>PDF</b><small>{t('res.pdfHint')}</small></button>
+        {m.kind === 'slide_deck' && outputId && (
+          <button role="menuitem" disabled={pptx.isPending} onClick={() => { close(); pptx.mutate() }}><b>PowerPoint (.pptx)</b><small>{t('res.pptxHint')}</small></button>
+        )}
+        <button role="menuitem" onClick={() => { close(); download(fileName(m, 'md'), toMarkdown(m, content)) }}><b>Markdown (.md)</b><small>{t('res.mdHint')}</small></button>
+        {m.kind !== 'scorm' && scormItem}
+      </div>
+    </details>
+  )
+}
+
+function Paragraphs({ text }: { text: string }) {
+  // Generated text is light Markdown: headings, bullets and paragraphs are enough to read it.
+  const blocks: ReactNode[] = []
+  let bullets: string[] = []
+  const flush = () => { if (bullets.length) blocks.push(<ul key={blocks.length}>{bullets.map((b, i) => <li key={i}>{b}</li>)}</ul>); bullets = [] }
+  for (const line of text.split('\n').map(l => l.trim())) {
+    if (/^[-*•]\s+/.test(line)) { bullets.push(line.replace(/^[-*•]\s+/, '').replace(/\*\*/g, '')); continue }
+    flush()
+    if (!line) continue
+    const heading = line.match(/^#{1,6}\s+(.*)/)
+    blocks.push(heading ? <h2 key={blocks.length}>{heading[1]}</h2> : <p key={blocks.length}>{line.replace(/\*\*/g, '')}</p>)
+  }
+  flush()
+  return <>{blocks}</>
+}
+
+// Generated summaries usually open with their own title as a heading; it is already the h1.
+function summaryText(m: Material, content: MaterialContent) {
+  const title = textOf(content.title) || titleOf(m)
+  return textOf(content.text).replace(/^\s*#{1,6}\s+(.+)\n/, (line, heading: string) =>
+    heading.trim().toLowerCase() === title.trim().toLowerCase() ? '' : line)
+}
+
+function QuizList({ content }: { content: MaterialContent }) {
+  return (
+    <ol className="quiz-list">
+      {questionsOf(content).map((q, i) => (
+        <li key={i}><b>{q.question}</b>
+          {!!q.options.length && <ul>{q.options.map((o, j) => <li key={j} className={j === q.correct ? 'correct' : undefined}>{o}</li>)}</ul>}
+          {q.answer && q.correct < 0 && <p><b>{t('res.answer')}:</b> {q.answer}</p>}
+          {q.explanation && <p className="muted">{q.explanation}</p>}
+        </li>
+      ))}
+    </ol>
+  )
+}
+
+function Body({ material: m, content }: { material: Material; content: MaterialContent }) {
+  const title = textOf(content.title) || titleOf(m)
+  if (m.kind === 'video') {
+    if (m.video?.url) return <article className="prose"><h1>{title}</h1><video className="source-player" controls preload="metadata" src={m.video.url} /></article>
+    if (m.status === 'failed') return <Empty icon="video" title={t('res.videoFailed')}>{t('res.videoFailedCopy')}</Empty>
+    return <Empty icon="video" title={t('res.videoNotReady')}>{t('res.videoProgress', { n: m.video?.progress ?? 0 })}</Empty>
+  }
+  if (m.kind === 'summary') {
+    return <article className="prose"><h1>{title}</h1><Paragraphs text={summaryText(m, content)} /></article>
+  }
+  if (m.kind === 'audio') {
+    const text = summaryText(m, content)
+    return (
+      <>
+        <AudioPlayer title={title} text={text} />
+        <details className="script-details" style={{ marginTop: 20 }}><summary>{t('res.fullScript')}</summary>
+          <article className="prose"><Paragraphs text={text} /></article>
+        </details>
+      </>
+    )
+  }
+  if (m.kind === 'scorm') {
+    const questions = questionsOf(content).length
+    return (
+      <article className="prose scorm-preview">
+        <div className="scorm-preview-head"><Icon name="scorm" /><div><b>{t('res.scormModule')}</b><small>{t('res.scormMeta', { n: questions, mastery: MASTERY })}</small></div></div>
+        <h1>{title}</h1>
+        <Paragraphs text={summaryText(m, content)} />
+        <h2>{t('res.quiz')}</h2>
+        {questions ? <QuizList content={content} /> : <p className="muted">{t('res.quizPending')}</p>}
+      </article>
+    )
+  }
+  if (m.kind === 'quiz') {
+    return <article className="prose"><h1>{title}</h1><QuizList content={content} /></article>
+  }
+  if (m.kind === 'flashcards') {
+    return (
+      <article className="prose"><h1>{title}</h1>
+        <div className="flashcards">
+          {(listOf(content.cards) as Record<string, unknown>[]).map((c, i) => (
+            <div key={i} className="flashcard"><b>{textOf(c.front)}</b><span>{textOf(c.back)}</span></div>
+          ))}
+        </div>
+      </article>
+    )
+  }
+  if (m.kind === 'slide_deck') {
+    return (
+      <article className="prose"><h1>{title}</h1>
+        {!!content.description && <p>{textOf(content.description)}</p>}
+        {slidesOf(content).map((s, i) => (
+          <section key={i} className="slide-preview"><small>{t('res.slide', { n: i + 1 })}</small><h2>{s.title}</h2>
+            {!!s.bullets.length && <ul>{s.bullets.map((b, j) => <li key={j}>{b}</li>)}</ul>}
+          </section>
+        ))}
+      </article>
+    )
+  }
+  // Roleplay and simulator: show their setup fields; the interactive versions live in Learning Studio.
+  return (
+    <article className="prose"><h1>{title}</h1>
+      {FIELDS.map(k => [k, content[k]] as const).filter(([, v]) => v != null && v !== '').map(([k, v]) => (
+        <div key={k}><h2>{t(`res.field.${k}`)}</h2>
+          {Array.isArray(v) ? <ul>{v.map((x, i) => <li key={i}>{textOf(x)}</li>)}</ul> : <Paragraphs text={textOf(v)} />}
+        </div>
+      ))}
+    </article>
+  )
+}
+
+function SourceRow({ source: s }: { source: FoundSource }) {
+  const queryClient = useQueryClient()
+  const review = useMutation({
+    mutationFn: (decision: 'accept' | 'reject') => reviewSource(s, decision),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ['results'] })
+      queryClient.invalidateQueries({ queryKey: ['documents'] })
+    },
+  })
+  const tone = s.status === 'accepted' ? 'ready' : s.status === 'pending' ? 'draft' : 'failed'
+  const label = ['pending', 'accepted', 'rejected'].includes(s.status) ? t(`res.source.${s.status}` as Key) : s.status
+  return (
+    <article className="research-row">
+      <span><Icon name="search" /></span>
+      <div>
+        <span className={`status ${tone}`}><i className="dot"></i>{label}</span>
+        <h3>{s.url ? <a href={s.url} target="_blank" rel="noreferrer">{s.title}</a> : s.title}</h3>
+        <p>{describeRule(s.rule)} · {fmt(s.createdAt)}{s.status === 'accepted' && <> · <Link to="/brain">{t('res.inBrain')}</Link></>}</p>
+        {s.preview && <p className="source-preview">{s.preview}</p>}
+        {review.error && <span className="error">{review.error.message}</span>}
+      </div>
+      {s.status === 'pending' && (
+        <div className="research-actions">
+          <button className="btn small danger" disabled={review.isPending} onClick={() => review.mutate('reject')}>{t('res.reject')}</button>
+          <button className="btn small primary" disabled={review.isPending} onClick={() => review.mutate('accept')}>{t('res.addToBrain')}</button>
+        </div>
+      )}
+    </article>
+  )
+}
diff --git a/src/pages/Schedule.tsx b/src/pages/Schedule.tsx
new file mode 100644
index 0000000..e4e88be
--- /dev/null
+++ b/src/pages/Schedule.tsx
@@ -0,0 +1,222 @@
+import { useState } from 'react'
+import { Link } from 'react-router-dom'
+import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'
+import { Icon, ruleIcon } from '../components/Icon'
+import { Empty, PageHead, SkeletonLines, SkeletonRows } from '../components/Page'
+import { toast } from '../components/Toast'
+import { describeRule } from '../express/parse'
+import { locale, t, type Key } from '../i18n'
+import {
+  archiveSchedule, confirmProduction, isRunSchedule, listRuns, listSchedules, pauseSchedule, PLAN_ACTIVE, productionStatus, quoteProduction, resumeSchedule,
+  planProgress, runNow as startRun, updateTopic, type ContentPlan, type Schedule,
+} from '../express/schedules'
+
+const fmt = (iso: string | null | undefined) => (iso
+  ? new Intl.DateTimeFormat(locale(), { weekday: 'short', day: 'numeric', month: 'short', hour: '2-digit', minute: '2-digit' }).format(new Date(iso))
+  : '–')
+
+const RUN_STATUSES = new Set(['queued', 'planning', 'running', 'completed', 'failed', 'cancelled'])
+const runStatus = (s: string) => (RUN_STATUSES.has(s) ? t(`run.${s}` as Key) : s)
+
+export function SchedulePage() {
+  const schedules = useQuery({ queryKey: ['schedules'], queryFn: listSchedules, refetchInterval: 30_000 })
+
+  return (
+    <>
+      <PageHead title={t('sch.title')} description={t('sch.description')}
+        actions={<Link className="btn primary" to="/instruction"><Icon name="plus" />{t('sch.newInstruction')}</Link>} />
+      <div className="card">
+        <div className="card-head"><h3>{t('sch.cardTitle')}</h3><Icon name="calendar" /></div>
+        {schedules.isPending && <SkeletonRows label={t('sch.loading')} />}
+        {schedules.isError && <Empty icon="info" title={t('sch.loadFailed')}>{schedules.error.message}</Empty>}
+        {schedules.data?.length === 0 && <Empty icon="calendar" title={t('sch.empty')}>{t('sch.emptyCopy')}</Empty>}
+        {!!schedules.data?.length && <div className="result-list">{schedules.data.map(s => <ScheduleRow key={s.agent.id} schedule={s} />)}</div>}
+      </div>
+    </>
+  )
+}
+
+function ScheduleRow({ schedule }: { schedule: Schedule }) {
+  const { agent, rule, active } = schedule
+  const queryClient = useQueryClient()
+  const [editing, setEditing] = useState(false)
+  const [topic, setTopic] = useState(rule.topic)
+  const [open, setOpen] = useState(false)
+  const [producing, setProducing] = useState(false)
+  const refresh = () => queryClient.invalidateQueries({ queryKey: ['schedules'] })
+  const video = rule.type === 'content' && rule.kind === 'video'
+  // Content kinds run as weekly production plans; research and video as one run per slot.
+  const production = !isRunSchedule(rule)
+
+  const toggle = useMutation({ mutationFn: () => (active ? pauseSchedule(agent.id) : resumeSchedule(agent.id)), onSuccess: refresh })
+  const retopic = useMutation({ mutationFn: () => updateTopic(schedule, topic), onSuccess: () => { setEditing(false); refresh() } })
+  const archive = useMutation({ mutationFn: () => archiveSchedule(agent.id), onSuccess: () => { toast(t('sch.deleted')); refresh() } })
+  const runNow = useMutation({
+    mutationFn: () => startRun(agent.id),
+    onSuccess: () => {
+      toast(t(video ? 'sch.videoStarted' : 'sch.runStarted'))
+      setOpen(true)
+      queryClient.invalidateQueries({ queryKey: ['runs', agent.id] })
+      queryClient.invalidateQueries({ queryKey: ['results'] })
+    },
+  })
+  const error = toggle.error ?? retopic.error ?? archive.error ?? runNow.error
+  const busy = toggle.isPending || retopic.isPending || archive.isPending || runNow.isPending
+
+  return (
+    <div className="schedule-row">
+      <div className="result-row">
+        <span className="rule-icon"><Icon name={ruleIcon(rule)} /></span>
+        <div style={{ minWidth: 0, flex: 1 }}>
+          <b>{describeRule(rule)}</b>
+          <div><small>{production
+            ? <ProductionLine agentId={agent.id} active={active} />
+            : t(video ? 'sch.nextVideo' : 'sch.nextResearch', { when: active ? fmt(agent.next_run_at) : t('sch.paused') })}</small></div>
+          {editing && (
+            <form className="topic-edit" onSubmit={e => { e.preventDefault(); retopic.mutate() }}>
+              <input aria-label={t('sch.newTopic')} value={topic} placeholder={t('ins.topicPlaceholder')} autoFocus onChange={e => setTopic(e.target.value)} />
+              <button className="btn small primary" disabled={busy}>{t('common.save')}</button>
+              <button type="button" className="btn small" onClick={() => { setEditing(false); setTopic(rule.topic) }}>{t('common.cancel')}</button>
+            </form>
+          )}
+          {error && <span className="error">{error.message}</span>}
+        </div>
+        <span className={`status ${active ? 'ready' : 'draft'}`}><i className="dot"></i>{active ? t('sch.active') : t('sch.paused')}</span>
+      </div>
+      <div className="schedule-actions">
+        {!editing && <button className="btn small" disabled={busy} onClick={() => setEditing(true)}>{t('sch.changeTopic')}</button>}
+        <button className="btn small" disabled={busy} onClick={() => toggle.mutate()}>{active ? t('sch.pause') : t('sch.resume')}</button>
+        {!production && active && <button className="btn small" disabled={busy} onClick={() => runNow.mutate()}>{t(video ? 'sch.videoNow' : 'sch.runNow')}</button>}
+        {production && active && !producing && <button className="btn small" disabled={busy} onClick={() => setProducing(true)}>{t('sch.produceNow')}</button>}
+        <button className="btn small" onClick={() => setOpen(o => !o)}>{open ? t('sch.hideHistory') : t('sch.history')}</button>
+        <button className="btn small danger" disabled={busy}
+          onClick={() => confirm(t('sch.deleteConfirm', { name: describeRule(rule) })) && archive.mutate()}>{t('sch.delete')}</button>
+      </div>
+      {production && !producing && <ProductionProgress agentId={agent.id} />}
+      {producing && production && <ProducePanel schedule={schedule} onClose={() => setProducing(false)} />}
+      {open && <RunHistory agentId={agent.id} />}
+    </div>
+  )
+}
+
+// Content schedules report this week's progress from the engine's production period.
+const useProduction = (agentId: number) => useQuery({
+  queryKey: ['production', agentId],
+  queryFn: () => productionStatus(agentId),
+  refetchInterval: q => (q.state.data?.plans.some(p => PLAN_ACTIVE.has(p.status)) ? 5000 : 60_000),
+})
+
+function ProductionLine({ agentId, active }: { agentId: number; active: boolean }) {
+  const status = useProduction(agentId)
+  const s = status.data
+  if (!s) return <>{status.isError ? status.error.message : t('sch.loadingProgress')}</>
+  if (!s.planning_available) {
+    return <span className="error">{t('sch.planningOff')}</span>
+  }
+  if (!active) return <>{t('sch.paused')}</>
+  const p = s.period
+  return <>{p ? t('sch.thisWeek', { ready: p.ready, target: p.target, failed: p.failed ? t('sch.thisWeekFailed', { n: p.failed }) : '' }) : t('sch.waitingFirst')}</>
+}
+
+// Starts this week's production early: quote the planning step, show its price, then confirm it.
+// The latest production of this schedule, step by step: topics → creating → done.
+function ProductionProgress({ agentId }: { agentId: number }) {
+  const plan = useProduction(agentId).data?.plans[0]
+  if (!plan || plan.status === 'quoted' || plan.status === 'cancelled') return null
+  const { total, ready, failed, shortfall } = planProgress(plan)
+  const step = plan.status === 'planning' ? 0 : plan.status === 'running' || plan.status === 'paused' ? 2 : plan.status === 'completed' ? 3 : 1
+  const steps = [t('prod.stepTopics'), t('prod.stepStart'), t('prod.stepCreate', { ready, total }), t('prod.stepDone')]
+  const finished = plan.status === 'completed' || plan.status === 'failed'
+
+  return (
+    <div className={`production-progress${finished ? ' finished' : ''}`} role="status" aria-live="polite">
+      <div className="production-head">
+        {!finished && <span className="spinner" aria-hidden="true" />}
+        <b>{finished ? t('prod.lastTitle') : t('prod.runningTitle', { n: plan.target })}</b>
+        {plan.status !== 'planning' && total > 0 && <span className="production-count">{t('prod.count', { ready, total })}</span>}
+      </div>
+      {plan.status === 'failed' ? (
+        <span className="error">{t('prod.failed', { code: plan.error_code ?? '–' })}</span>
+      ) : (
+        <ol className="production-steps">
+          {steps.map((label, i) => (
+            <li key={i} className={i < step ? 'done' : i === step ? (finished ? 'done' : 'current') : undefined}>{label}</li>
+          ))}
+        </ol>
+      )}
+      {!!total && plan.status !== 'planning' && <div className="production-bar"><i style={{ width: `${Math.round(((ready + failed) / total) * 100)}%` }} /></div>}
+      {(failed > 0 || (shortfall > 0 && plan.status !== 'planning')) && (
+        <small>{[failed ? t('prod.someFailed', { n: failed }) : '', shortfall ? t('prod.shortfall', { n: shortfall }) : ''].filter(Boolean).join(' ')}</small>
+      )}
+      {(ready > 0 || plan.status === 'running') && <Link className="text-btn" to="/results">{t('prod.viewResults')} <Icon name="arrow-right" /></Link>}
+    </div>
+  )
+}
+
+function ProducePanel({ schedule: { agent, rule }, onClose }: { schedule: Schedule; onClose: () => void }) {
+  const queryClient = useQueryClient()
+  const status = useProduction(agent.id)
+  const period = status.data?.period
+  const remaining = period ? Math.max(0, period.target - period.claimed) : agent.content_goal?.weekly_target ?? 0
+  const [count, setCount] = useState(rule.type === 'content' ? rule.count : 1)
+  const n = Math.min(Math.max(1, count), Math.max(1, remaining))
+  const quote = useMutation({ mutationFn: () => quoteProduction(agent.id, n) })
+  const start = useMutation({
+    mutationFn: (plan: ContentPlan) => confirmProduction(agent.id, plan),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ['production', agent.id] })
+      queryClient.invalidateQueries({ queryKey: ['results'] })
+      onClose()
+    },
+  })
+  const error = quote.error ?? start.error
+  const running = status.data?.plans.some(p => PLAN_ACTIVE.has(p.status))
+
+  if (status.isPending) return <div className="produce-panel"><SkeletonLines label={t('sch.loadingProgress')} /></div>
+  return (
+    <div className="produce-panel">
+      {running ? (
+        <p>{t('sch.alreadyProducing')}</p>
+      ) : remaining === 0 ? (
+        <p>{t('sch.weekFull')}</p>
+      ) : quote.data ? (
+        <p>{t('sch.produceQuote', { n: quote.data.target, credits: quote.data.planning_quote.credits ?? 0, budget: agent.content_goal?.weekly_budget ?? 0 })}</p>
+      ) : (
+        <label>{t('sch.produceHowMany', { max: remaining })}
+          <input type="number" min={1} max={remaining} value={n} onChange={e => setCount(Number(e.target.value) || 1)} />
+        </label>
+      )}
+      {error && <span className="error">{error.message}</span>}
+      <div className="produce-actions">
+        {!running && remaining > 0 && (quote.data
+          ? <button className="btn small primary" disabled={start.isPending} onClick={() => start.mutate(quote.data)}>{start.isPending ? t('sch.starting') : t('sch.startProduction')}</button>
+          : <button className="btn small primary" disabled={quote.isPending} onClick={() => quote.mutate()}>{quote.isPending ? t('sch.checkingPrice') : t('sch.checkPrice')}</button>)}
+        <button className="btn small" onClick={onClose}>{running || remaining === 0 ? t('res.close') : t('common.cancel')}</button>
+      </div>
+    </div>
+  )
+}
+
+function RunHistory({ agentId }: { agentId: number }) {
+  const runs = useQuery({
+    queryKey: ['runs', agentId],
+    queryFn: () => listRuns(agentId),
+    refetchInterval: q => (q.state.data?.some(r => ['queued', 'planning', 'running'].includes(r.status)) ? 3000 : false),
+  })
+  if (runs.isPending) return <div className="run-history"><SkeletonLines count={3} label={t('sch.loadingHistory')} /></div>
+  if (runs.isError) return <div className="run-history"><span className="error">{runs.error.message}</span></div>
+  if (!runs.data.length) return <div className="run-history"><small>{t('sch.neverRan')}</small></div>
+  return (
+    <ul className="run-history">
+      {runs.data.slice(0, 8).map(r => (
+        <li key={r.id}>
+          <span>{fmt(r.created_at)}</span>
+          <span>{r.trigger_kind === 'scheduled' ? t('sch.scheduled') : t('sch.manual')}</span>
+          <span className={`status ${r.status === 'completed' ? 'ready' : 'draft'}`}><i className="dot"></i>{runStatus(r.status)}</span>
+          {r.budget_spent != null && <span>{t('common.credits', { n: r.budget_spent })}</span>}
+          {r.safe_error_code && <span className="error">{r.safe_error_code}</span>}
+        </li>
+      ))}
+    </ul>
+  )
+}
diff --git a/src/styles/app.css b/src/styles/app.css
new file mode 100644
index 0000000..4bc53f4
--- /dev/null
+++ b/src/styles/app.css
@@ -0,0 +1,128 @@
+/* Express additions on top of the mockup styles. */
+.upload-progress{list-style:none;padding:0;margin:12px 0 0;display:grid;gap:6px;font-size:11px}
+.upload-progress li{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
+.upload-progress .error{margin:0;font-size:11px}
+.upload-progress .status{margin-left:0}
+.doc-progress{margin-top:8px;max-width:360px}
+.doc-progress .progress-track{width:100%;max-width:none;margin:0 0 5px}
+.doc-progress small,.doc-action small{font-size:10px;color:#7a8ba5}
+.doc-action{margin-top:8px;display:grid;gap:7px;max-width:520px}
+.doc-action-buttons{display:flex;gap:7px;flex-wrap:wrap}
+.doc-action .error{margin:0;font-size:11px}
+.result-row b{overflow-wrap:anywhere}
+.drop-overlay{position:fixed;inset:0;z-index:50;display:grid;place-items:center;background:#142d5059;backdrop-filter:blur(2px);pointer-events:none}
+.drop-overlay>div{display:flex;flex-direction:column;align-items:center;gap:12px;padding:34px 46px;border:2px dashed var(--blue);border-radius:16px;background:white;color:var(--blue);font-size:14px}
+.drop-overlay svg{width:34px;height:34px}
+textarea{resize:vertical;line-height:1.6}
+.rule-list{padding:6px 22px}
+.rule-card{display:flex;gap:14px;align-items:flex-start;padding:16px 0;border-bottom:1px solid var(--line)}
+.rule-card:last-child{border-bottom:0}
+.rule-card.muted .rule-body>b{color:#9aa5b5}
+.rule-icon{display:grid;place-items:center;width:38px;height:38px;border-radius:10px;background:#edf4ff;color:var(--blue);flex-shrink:0}
+.rule-icon svg{width:18px;height:18px}
+.rule-body{flex:1;min-width:0;display:grid;gap:8px}
+.rule-body>b{font-size:13px}
+.rule-fields{display:flex;gap:8px;flex-wrap:wrap}
+.rule-fields select,.rule-fields input{width:auto!important;min-height:36px!important;padding:7px 10px!important;font-size:12px}
+.rule-fields input[type=number]{width:72px!important}
+.rule-fields .rule-topic{flex:1;min-width:180px}
+.rule-check{display:flex;align-items:center;gap:8px;font-weight:500;font-size:11px;margin:0;color:#6f819b}
+.rule-note{font-size:10px;color:#7a8ba5}
+.rule-body .error{margin:0;font-size:11px}
+.rule-approve{display:flex;gap:16px;align-items:center;justify-content:space-between;padding:16px 22px;border-top:1px solid var(--line);background:#fafbfd}
+.rule-approve small{font-size:10px;color:#7a8ba5;line-height:1.7}
+.rule-outcomes{list-style:none;margin:0;padding:12px 22px 18px;display:grid;gap:8px;font-size:12px}
+.rule-outcomes li{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
+.rule-outcomes .status{margin-left:0}
+.rule-outcomes .error{margin:0;font-size:11px}
+.schedule-row{border-bottom:1px solid var(--line);padding-bottom:14px}
+.schedule-row:last-child{border-bottom:0}
+.schedule-row .result-row{border-bottom:0;padding-bottom:10px}
+.schedule-row .error{display:block;margin-top:6px;font-size:11px}
+.schedule-actions{display:flex;gap:7px;flex-wrap:wrap;padding-left:61px}
+.topic-edit{display:flex;gap:7px;margin-top:9px;max-width:520px}
+.topic-edit input{min-height:34px!important;padding:6px 10px!important;font-size:12px}
+.run-history{list-style:none;margin:12px 0 0 61px;padding:10px 14px;background:#fafbfd;border:1px solid var(--line);border-radius:8px;display:grid;gap:7px;font-size:11px;color:#6f819b}
+.run-history li{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
+.run-history .status{margin-left:0}
+.run-history .error{margin:0;font-size:11px}
+@media(max-width:700px){.schedule-actions,.run-history{padding-left:0;margin-left:0}.rule-approve{flex-direction:column;align-items:stretch}}
+.lang-switch{display:inline-flex;border:1px solid var(--line);border-radius:7px;overflow:hidden;background:white}
+.lang-switch button{border:0;background:transparent;padding:5px 9px;font-size:10px;font-weight:650;color:#8b97a9}
+.lang-switch button.active{background:#edf4ff;color:var(--blue)}
+.login-top{display:flex;align-items:center;justify-content:space-between;gap:12px;position:relative;z-index:1}
+/* hidden still allows programmatic scroll (e.g. focusing the language switch); clip does not. */
+.login-story{overflow:clip}
+/* Results */
+.status.failed{color:#b64747;background:#fdeeee}
+.content-cover.kind-quiz,.content-cover.kind-flashcards{background:#eef7f3;color:#5f9a86}
+.content-cover.kind-roleplay,.content-cover.kind-simulator{background:#f2effa;color:#8f78b8}
+.content-cover.kind-slide_deck{background:#fff6e8;color:#b48a45}
+.content-cover>small{max-width:calc(100% - 24px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
+.content-title:disabled{cursor:default;color:#8b97a9}
+.content-card-foot>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
+.research-row .status{margin-left:0}
+.research-row h3 a{color:var(--ink)}
+.research-row h3 a:hover{color:var(--blue)}
+.research-row p a{color:var(--blue)}
+.research-row .error{display:block;margin-top:6px;font-size:11px}
+.source-preview{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;color:#7a879b;line-height:1.7}
+.research-actions{display:flex;gap:7px;flex-shrink:0}
+.quiz-list{padding-left:20px;display:grid;gap:16px}
+.quiz-list ul{margin-top:7px;padding-left:18px}
+.quiz-list li.correct{color:var(--green);font-weight:650}
+.flashcards{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}
+.flashcard{border:1px solid var(--line);border-radius:10px;padding:14px;display:grid;gap:8px;font-size:12px;line-height:1.6}
+.flashcard span{color:#6f819b}
+.slide-preview{border:1px solid var(--line);border-radius:10px;padding:14px 16px;margin-bottom:12px}
+.slide-preview small{font-size:9px;letter-spacing:.8px;text-transform:uppercase;color:#a0adbd}
+.slide-preview h2{margin-top:4px}
+.modal-foot .error{margin-right:auto;font-size:11px}
+@media(max-width:700px){.research-row{flex-wrap:wrap}.research-actions{width:100%}.research-actions .btn{flex:1}}
+.produce-panel{margin:12px 0 0 61px;padding:12px 14px;background:#f5f9ff;border:1px solid #dfeaff;border-radius:8px;display:grid;gap:10px;font-size:12px;color:#5f7290;max-width:620px}
+.produce-panel label{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
+.produce-panel input{width:90px!important;flex:none;min-height:32px!important;padding:5px 9px!important}
+.produce-panel p{line-height:1.7}
+.produce-panel .error{font-size:11px}
+.produce-actions{display:flex;gap:7px}
+@media(max-width:700px){.produce-panel{margin-left:0}}
+.production-progress{margin:6px 0 4px 61px;padding:13px 15px;background:#f5f9ff;border:1px solid #dfeaff;border-radius:9px;display:grid;gap:10px;font-size:12px;color:#5f7290;max-width:620px}
+.production-progress.finished{background:#f7faf9;border-color:#e1efe9}
+.production-head{display:flex;align-items:center;gap:9px;color:var(--ink)}
+.production-count{margin-left:auto;font-size:11px;color:#6f819b}
+.production-steps{display:flex;flex-wrap:wrap;gap:6px 16px;list-style:none;padding:0;margin:0;font-size:11px}
+.production-steps li{display:flex;align-items:center;gap:6px;color:#a0adbd}
+.production-steps li:before{content:"";width:8px;height:8px;border-radius:50%;border:1.5px solid currentColor}
+.production-steps li.done{color:var(--green)}
+.production-steps li.done:before{background:currentColor}
+.production-steps li.current{color:var(--blue);font-weight:650}
+.production-steps li.current:before{background:currentColor;box-shadow:0 0 0 3px #dbe7ff}
+.production-bar{height:5px;border-radius:5px;background:#e5edf9;overflow:hidden}
+.production-bar i{display:block;height:100%;background:var(--blue);transition:width .4s}
+.production-progress.finished .production-bar i{background:var(--green)}
+.production-progress .text-btn{justify-self:start;font-size:11px}
+.production-progress .text-btn svg{width:12px;height:12px}
+.spinner{width:13px;height:13px;border-radius:50%;border:2px solid #cddcf5;border-top-color:var(--blue);animation:spin .8s linear infinite;flex-shrink:0}
+@keyframes spin{to{transform:rotate(360deg)}}
+@media(max-width:700px){.production-progress{margin-left:0}}
+.download-menu{position:relative}
+.download-menu>summary{list-style:none;cursor:pointer}
+.download-menu>summary::-webkit-details-marker{display:none}
+.download-menu>div{position:absolute;right:0;bottom:calc(100% + 6px);z-index:5;min-width:250px;background:white;border:1px solid var(--line);border-radius:10px;box-shadow:0 14px 40px #142d5026;padding:5px;display:grid}
+.download-menu>div button{display:grid;gap:2px;text-align:left;background:none;border:0;border-radius:7px;padding:9px 11px;font-size:12px;color:var(--ink);cursor:pointer}
+.download-menu>div button:hover:not(:disabled){background:#f2f6fd}
+.download-menu>div small{font-size:10px;color:#8b97a9}
+.download-menu>.error{position:absolute;right:0;bottom:calc(100% + 6px);white-space:nowrap;font-size:11px}
+@media(max-width:700px){.download-menu{flex:1}.download-menu>summary{width:100%;justify-content:center}.download-menu>div{left:0;right:auto}}
+/* Audio lesson player (Phase 4) */
+.audio-preview .audio-rate{width:auto;min-height:38px;padding:7px 10px;font-size:12px}
+.audio-progress{height:4px;max-width:320px;margin:18px auto 10px;background:#dcece6;border-radius:4px;overflow:hidden}
+.audio-progress i{display:block;height:100%;background:#619d89;transition:width .3s}
+.audio-now{margin:16px auto 0;max-width:520px;font-size:13px;line-height:1.7;color:#43695c;font-style:italic}
+.waveform.playing i{animation:wave 1s ease-in-out infinite alternate}
+@keyframes wave{to{transform:scaleY(.35)}}
+@media (prefers-reduced-motion:reduce){.waveform.playing i{animation:none}}
+.content-cover.kind-video{background:#ecf3ff;color:#4f7bc4}
+.content-cover.kind-audio{background:#edf7f4;color:#679b8d}
+.content-cover.kind-scorm{background:#f2effa;color:#9a82bb}
+.scorm-preview .scorm-preview-head b{font-size:12px}
diff --git a/src/styles/mockup.css b/src/styles/mockup.css
new file mode 100644
index 0000000..032ad77
--- /dev/null
+++ b/src/styles/mockup.css
@@ -0,0 +1,36 @@
+/* Copied from mockup.html. Only change: sidebar nav rules also match <a> (router links). */
+:root{--blue:#2563eb;--blue-dark:#194dcc;--navy:#142d50;--ink:#1b2c46;--muted:#768399;--line:#e6ebf2;--bg:#f7f9fc;--light:#eef5ff;--green:#14866b;--radius:14px;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);font-size:14px}
+.admin-menu{margin-top:26px;border-top:1px solid var(--line);padding-top:16px}.admin-menu summary{list-style:none;display:flex;align-items:center;justify-content:space-between;padding:12px;color:var(--muted);font-size:11px;cursor:pointer}.admin-menu summary::-webkit-details-marker{display:none}.admin-menu summary svg{width:14px}.admin-menu[open] summary svg{transform:rotate(180deg)}.auto-hero-note{display:flex;align-items:center;gap:7px;font-size:10px;color:#6c83a3;margin-top:18px}.auto-hero-note svg{width:14px;height:14px;color:var(--blue)}.auto-flow{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:22px 0 18px;padding:0 3px;color:#607594;font-size:11px}.auto-flow>span{display:flex;align-items:center;gap:9px}.auto-flow b{color:var(--blue);background:#eaf2ff;border-radius:50%;display:grid;place-items:center;width:27px;height:27px;font-size:10px}.auto-flow>svg{width:15px;color:#9eafc7}.upload-box.upload-compact{display:flex;align-items:center;gap:18px;text-align:left;padding:25px 28px;margin-bottom:25px}.upload-compact .upload-symbol{margin:0;width:45px;height:45px;flex-shrink:0}.upload-compact>div{flex:1}.upload-compact h3{font-size:14px}.upload-compact p{font-size:11px;margin:6px 0}.upload-compact small{font-size:9px}.upload-compact .btn{flex-shrink:0}
+@media(max-width:600px){.auto-flow{flex-direction:column;align-items:flex-start;gap:12px;margin:18px 0}.auto-flow>svg{display:none}.upload-box.upload-compact{flex-wrap:wrap;padding:20px;gap:13px}.upload-compact>div{flex-basis:calc(100% - 60px)}.upload-compact .btn{width:100%}.auto-hero-note{line-height:1.6}.admin-menu{margin-top:0;padding-top:0;border:0}.admin-menu summary{padding:10px 6px;font-size:10px}}
+*{box-sizing:border-box}body{margin:0;background:var(--bg)}button,input,select,textarea{font:inherit}button,a,input,select,textarea{outline-offset:4px}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.48}a{color:inherit;text-decoration:none}button{color:inherit}button:focus-visible,a:focus-visible{outline:3px solid #9dbfff}svg{width:20px;height:20px;flex-shrink:0;vertical-align:middle}p{line-height:1.7;margin:0;color:var(--muted)}h1,h2,h3,h4{margin:0;letter-spacing:-.035em}h1{font-size:29px;line-height:1.25}h2{font-size:23px}h3{font-size:16px;letter-spacing:-.02em}h4{font-size:14px}small{font-size:11px;color:var(--muted)}[hidden]{display:none!important}
+.brand{display:flex;align-items:center;gap:10px;line-height:1.15;font-size:16px;font-weight:750;letter-spacing:-.5px;white-space:nowrap}.brand b{font-weight:500;display:block;font-size:14px;margin-top:4px;letter-spacing:.1px}.brand small{display:block;font-size:9px;letter-spacing:1.5px;text-transform:uppercase;margin-top:7px;font-weight:600;color:#8493aa}.brand-mark{width:40px;height:42px;background:var(--blue);border-radius:11px;display:flex;align-items:center;justify-content:center;color:#fff;box-shadow:0 5px 10px #2563eb16}.brand-mark svg{width:24px;height:24px}
+.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;padding:10px 17px;border-radius:8px;border:1px solid #dce3ee;background:white;font-size:12px;font-weight:650;white-space:nowrap;transition:background .15s,transform .15s}.btn:hover{background:#f5f8fd}.btn.primary{color:#fff;background:var(--blue);border-color:var(--blue);box-shadow:0 3px 6px #2563eb12}.btn.primary:hover{background:var(--blue-dark)}.btn.light{background:var(--light);border-color:#dfebff;color:var(--blue)}.btn.small{min-height:34px;padding:7px 11px;font-size:11px}.btn svg{width:16px;height:16px}.btn.danger{color:#b64747}.wide{width:100%}.icon-btn{display:inline-flex;align-items:center;justify-content:center;background:transparent;border:0;border-radius:7px;padding:7px;color:#8290a5}.icon-btn:hover{background:var(--light);color:var(--blue)}.icon-btn svg{width:18px;height:18px}.text-btn{border:0;background:transparent;padding:0;color:var(--blue);font-size:12px;font-weight:600;display:inline-flex;align-items:center;gap:6px}.text-btn svg{width:15px;height:15px}.badge,.status{display:inline-flex;align-items:center;gap:5px;border-radius:5px;padding:5px 8px;font-size:10px;font-weight:650;line-height:1;white-space:nowrap}.badge.neutral{background:#eff3f8;color:#718098}.badge.blue{color:#2563eb;background:#edf4ff}.badge.purple{color:#8063bb;background:#f3effb}.badge.amber{color:#a78126;background:#fff7df}.status.ready{color:var(--green);background:#e9f7f2}.status.draft{color:#9a7a37;background:#fff6df}.dot{width:5px;height:5px;background:currentColor;border-radius:50%}
+label{display:block;font-size:12px;font-weight:650;margin:0 0 8px}input:not([type=checkbox]):not([type=radio]):not([type=file]),select,textarea{width:100%;border:1px solid #dce3ed;padding:12px 13px;border-radius:8px;background:white;min-height:43px;color:var(--ink);transition:border-color .15s;outline-color:var(--blue)}input:focus,select:focus,textarea:focus{border-color:var(--blue)}input::placeholder,textarea::placeholder{color:#a3adbc}textarea{resize:vertical;line-height:1.65}input[type=checkbox]{accent-color:var(--blue);width:15px;height:15px;flex-shrink:0;cursor:pointer}.check-label{display:flex;align-items:center;gap:7px;font-weight:500;margin:0;line-height:1.6}.field{margin-bottom:22px}.field small{display:block;line-height:1.6;margin-top:7px}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}.error{color:#c35252;font-size:12px;margin-top:10px}.inline-note{display:flex;gap:9px;padding:13px 15px;background:#f5f8fc;border-radius:8px;font-size:11px;line-height:1.75;color:var(--muted)}.inline-note svg{width:16px;height:16px;flex-shrink:0;margin-top:2px;color:var(--blue)}
+.login-layout{min-height:100vh;display:grid;grid-template-columns:55% 45%;background:white}.login-story{padding:44px 8%;background:#f0f6ff;display:flex;flex-direction:column;position:relative;overflow:hidden}.login-story:after{content:"";position:absolute;right:-260px;bottom:-370px;width:720px;height:720px;border:1px solid #dce9fc;border-radius:50%;pointer-events:none}.login-copy{margin:auto 0;padding:54px 0 45px;position:relative;z-index:1}.eyebrow{font-size:9px;font-weight:750;color:var(--blue);letter-spacing:1.6px}.login-copy h1{font-size:42px;line-height:1.22;letter-spacing:-1.6px;margin:22px 0}.login-copy>p{font-size:14px;max-width:420px;color:#74849b}.login-diagram{margin:35px 0 28px;width:390px;max-width:100%;position:relative}.mini-source,.mini-output{display:flex;align-items:center;gap:13px;padding:16px 18px;background:white;border:1px solid #e3ebf8;border-radius:11px;box-shadow:0 5px 10px #24457604;font-weight:650;font-size:12px}.mini-source{margin-right:30px}.mini-output{margin-left:30px}.mini-source small,.mini-output small{display:block;margin-top:5px;font-size:10px;font-weight:450}.mini-check{margin-left:auto;color:#31a287;background:#ecf8f3;width:22px;height:22px;text-align:center;border-radius:50%;line-height:22px}.connector{height:43px;display:flex;align-items:center;justify-content:center;gap:12px;color:var(--blue)}.connector i{display:block;width:1px;height:11px;background:#b3c8ee}.connector svg{width:24px;height:24px}.output-icon{background:#ebf3ff;border-radius:8px;padding:10px;color:var(--blue)}.mini-output .status{margin-left:auto}.login-benefits{display:flex;flex-direction:column;gap:13px;color:#607594;font-size:11px}.login-benefits>span{display:flex;align-items:center;gap:9px}.login-benefits svg{width:16px;height:16px;color:#6b8cc4}.login-footer{position:relative;z-index:1;font-size:8px;color:#8ba0bc;letter-spacing:1px;display:flex;justify-content:space-between;gap:12px}.login-footer span{letter-spacing:0}.login-panel{display:flex;align-items:center;justify-content:center;padding:45px}.login-form-wrap{width:360px;max-width:100%}.login-form-wrap h2{font-size:26px;margin-top:22px;line-height:1.3}.login-form-wrap>p{font-size:12px;margin:12px 0 30px}.login-form-wrap form>label{margin-top:20px}.password-field{position:relative}.password-field input{padding-right:45px!important}.password-field button{position:absolute;right:5px;top:6px;background:none;border:0;padding:6px;color:#929eaf}.password-field svg{width:18px;height:18px}.login-small{display:flex;align-items:center;justify-content:space-between;font-size:10px;color:#8e9aad;margin:18px 0 26px}.login-small label{font-size:10px;font-weight:500}.login-small input{width:13px;height:13px}.demo-login{margin-top:26px;display:flex;gap:10px;border:1px solid var(--line);border-radius:9px;padding:14px}.demo-login>svg{color:var(--blue);width:17px;height:17px;flex-shrink:0;margin-top:2px}.demo-login p{font-size:10px;line-height:1.8;color:#8390a2}.login-form-wrap .login-bottom{margin-top:46px;font-size:10px;text-align:center;color:#a3adbc}.login-bottom span{margin-left:6px;color:#6c86ad}
+.app{display:flex;min-height:100vh}.sidebar{width:238px;flex-shrink:0;background:white;position:fixed;inset:0 auto 0 0;border-right:1px solid var(--line);padding:29px 18px 14px;display:flex;flex-direction:column;z-index:5}.sidebar>.brand{margin:0 13px 26px;font-size:14px}.sidebar .brand b{font-size:12px}.sidebar .brand-mark{width:35px;height:38px;border-radius:9px}.sidebar .brand small{font-size:8px}.workspace{display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:9px;padding:11px 10px;margin-bottom:30px;font-size:11px;font-weight:650}.workspace-icon{display:flex;align-items:center;justify-content:center;background:#eef3fa;border-radius:7px;width:29px;height:29px;color:#7086a6}.workspace small{display:block;font-weight:450;font-size:9px;margin-top:3px}.workspace>svg{width:13px;height:13px;margin-left:auto;color:#94a1b4}.nav-label{font-size:8px;font-weight:700;color:#a0aabc;letter-spacing:1.5px;margin:0 12px 14px}nav{display:flex;flex-direction:column;gap:5px}nav :is(button,a){display:flex;align-items:center;gap:11px;padding:13px 13px;border:0;background:none;border-radius:8px;color:#7b879b;font-size:12px;text-align:left;font-weight:550;width:100%}nav :is(button,a) svg{width:18px;height:18px;color:#8995a9}nav :is(button,a):hover{background:#f6f9fe}nav :is(button,a).active{background:#edf4ff;color:#2563eb;font-weight:650}nav :is(button,a).active svg{color:#2563eb}.nav-count{font-size:9px;background:#eef2f7;padding:3px 6px;border-radius:4px;margin-left:auto;color:#8895a9}.active .nav-count{background:#dceaff;color:#2563eb}.sidebar-help{margin: auto 0 16px;border:1px solid #e5edf9;background:#f8fbff;border-radius:10px;padding:16px 13px}.sidebar-help>svg{color:#7091c2;width:18px;height:18px;display:block;margin-bottom:11px}.sidebar-help b{font-size:11px;font-weight:650}.sidebar-help p{font-size:10px;line-height:1.7;margin:8px 0 12px}.sidebar-help button{display:flex;align-items:center;gap:7px;color:var(--blue);font-size:10px;font-weight:650;border:0;padding:0;background:none}.sidebar-help button svg{width:13px;height:13px}.profile{display:flex;gap:9px;align-items:center;padding:14px 5px 0;border-top:1px solid var(--line)}.avatar{height:32px;width:32px;background:#edf3ff;color:#527fc8;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:650}.profile b{font-size:11px;font-weight:650}.profile small{display:block;font-size:9px;margin-top:4px}.profile>.icon-btn{margin-left:auto}
+.workspace-main{margin-left:238px;width:calc(100% - 238px);min-height:100vh;display:flex;flex-direction:column}.topbar{height:72px;display:flex;justify-content:space-between;align-items:center;background:white;border-bottom:1px solid var(--line);padding:0 34px;gap:15px}.breadcrumb{font-size:11px;color:#94a0b1;white-space:nowrap}.breadcrumb span{margin:0 10px;color:#c1c9d5}.breadcrumb b{color:#64738a;font-weight:550}.topbar-right{display:flex;align-items:center;gap:19px;font-size:10px;color:#8b97a9}.demo-indicator{display:flex;align-items:center;gap:6px}.demo-indicator i{width:5px;height:5px;border-radius:50%;background:#d6a34b}.demo-strip{display:flex;align-items:center;gap:9px;margin:23px 34px 0;padding:10px 13px;border:1px solid #e1ebfb;background:#f0f6ff;border-radius:7px;font-size:10px;color:#7b91b2;line-height:1.5}.demo-strip svg{width:14px;height:14px;color:#7193c6}.demo-strip-tag{margin-left:auto;font-size:8px;letter-spacing:1px;font-weight:700;color:#7b96be}.app main{padding:28px 34px 30px;width:100%;max-width:1500px;align-self:center}.page-head{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:25px}.page-head p{font-size:12px;margin-top:8px}.head-actions{display:flex;gap:9px;align-items:center}.app-footer{display:flex;gap:9px;align-items:center;flex-wrap:wrap;margin: auto 34px 0;padding:18px 0;border-top:1px solid var(--line);font-size:9px;color:#99a4b5}.app-footer>span:first-child{color:#7493c3}.app-footer>span:last-child{margin-left:auto;font-size:8px}.card{background:white;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}.card-head{padding:21px 23px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:10px}.card-head h3{font-size:14px}.card-head p{font-size:10px;margin-top:5px}.card-body{padding:23px}.hero{position:relative;display:grid;grid-template-columns:1.1fr 1fr;background:#edf4ff;border:1px solid #dfeaff;border-radius:14px;padding:30px 30px 29px;align-items:center;gap:15px;min-height:245px;margin-bottom:23px}.hero .eyebrow{font-size:8px;letter-spacing:1.4px}.hero h2{font-size:31px;line-height:1.23;letter-spacing:-1px;margin:15px 0 10px}.hero p{font-size:11px;max-width:375px;color:#7e91ad}.hero .head-actions{margin-top:21px}.hero-art{position:relative;justify-self:center;width:310px;max-width:100%}.hero-art .mini-source{font-size:10px;padding:13px;max-width:230px;transform:rotate(-3deg);margin-right:0}.hero-art .mini-source+.mini-source{position:relative;margin-top:8px;margin-left:25px;transform:rotate(1deg)}.hero-art .mini-source small{font-size:8px}.hero-art .file-icon{width:29px;height:34px;font-size:8px}.hero-art .connector{height:30px;margin-left:80px}.hero-art .mini-output{margin-left:45px;padding:13px;font-size:10px;position:relative;z-index:2;box-shadow:0 7px 15px #2563eb08}.hero-art .mini-output small{font-size:8px}.hero-art .output-icon{padding:8px}.hero-art .output-icon svg{width:17px;height:17px}.hero-art:before{content:"";position:absolute;border:1px dashed #c3d6f4;border-radius:50%;height:245px;width:245px;top:-10px;right:10px}
+.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:23px}.metric{background:white;border:1px solid var(--line);border-radius:11px;padding:19px 19px 16px;position:relative}.metric>span{font-size:10px;color:#8c98aa}.metric strong{display:block;font-size:27px;letter-spacing:-1px;font-weight:650;margin:10px 0 8px}.metric small{font-size:9px;color:#9aa5b5}.metric i{position:absolute;right:16px;top:16px;background:#f2f6fc;border-radius:8px;padding:8px;color:#7f9bc5}.metric i svg{width:16px;height:16px}.setup-row{padding:17px 21px;display:flex;align-items:center;gap:24px;margin-bottom:23px}.setup-row>b{font-size:11px;white-space:nowrap}.steps{display:flex;justify-content:space-between;width:100%;gap:12px}.step{display:flex;align-items:center;gap:9px;font-size:10px;color:#8a98ac;background:none;border:0;padding:0;text-align:left}.step>i{height:25px;width:25px;display:flex;align-items:center;justify-content:center;border:1px solid #dfe7f3;border-radius:50%;font-size:9px;font-style:normal;color:#8b9cb6;background:#fafcff}.step.done>i{background:#ebf8f1;color:#3b9a77;border-color:#d9efdf}.step small{font-size:8px;display:block;margin-top:4px}.step-arrow{color:#c2cddd;font-size:15px}.dashboard-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:21px;margin-bottom:23px}.empty{display:flex;flex-direction:column;align-items:center;text-align:center;padding:36px 25px;color:#8090a6}.empty-icon{color:#8da9d6;background:#f2f7fe;width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;margin-bottom:14px}.empty-icon svg{width:24px;height:24px}.empty h3{font-size:13px;color:#596d8b;margin-bottom:8px}.empty p{font-size:10px;max-width:310px;margin-bottom:18px}.schedule-mini{padding:22px}.schedule-mini .clock-circle{background:#edf4ff;color:#7499ce;display:inline-flex;padding:11px;border-radius:50%;margin-bottom:17px}.schedule-mini h3{font-size:14px;margin-bottom:8px}.schedule-mini p{font-size:10px;line-height:1.75}.schedule-mini>.btn{margin-top:18px}.schedule-meta{border-top:1px solid var(--line);margin-top:17px;padding-top:15px;display:flex;justify-content:space-between;font-size:10px;color:#8491a5}.schedule-meta b{font-size:10px;color:#566e91;font-weight:600}.section-heading{display:flex;justify-content:space-between;align-items:center;margin:26px 0 15px;gap:12px}.section-heading p{font-size:10px;margin-top:6px}.section-heading h3{font-size:14px}.match-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.match-card{padding:18px}.match-card .pair-names{display:flex;flex-direction:column;gap:10px;font-size:11px;line-height:1.5;font-weight:600}.pair-names span{display:flex;align-items:center;gap:8px}.pair-names svg{width:15px;height:15px;color:#93a7c5}.match-tags{display:flex;gap:5px;flex-wrap:wrap;margin:15px 0}.tag{display:inline-block;font-size:9px;color:#8493a8;background:#f4f6fa;border-radius:4px;padding:4px 6px}.match-card .match-footer{display:flex;justify-content:space-between;align-items:center;gap:8px;border-top:1px solid var(--line);padding-top:13px}.match-footer small{font-size:9px}
+.file-icon{width:34px;height:40px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:6px;background:#eef2f7;font-size:9px;font-weight:700;color:#8290a4;border:1px solid #e6ebf3}.file-icon.pdf{color:#d47c7c;background:#fff2f2;border-color:#fae8e8}.file-icon.pptx{color:#c58e5d;background:#fff5ea;border-color:#f8eadb}.file-icon.docx{color:#6e94d6;background:#f0f5ff;border-color:#e2eafb}.file-icon.txt,.file-icon.md{color:#689d86;background:#eef9f3;border-color:#def0e5}.upload-box{border:1.5px dashed #c9d9ef;border-radius:12px;background:#f9fbff;text-align:center;padding:31px 24px;margin-bottom:18px;transition:background .15s}.upload-box.drag{background:#eaf2ff;border-color:var(--blue)}.upload-symbol{display:inline-flex;padding:12px;background:#eaf2ff;border:1px solid #deebff;color:#7299d5;border-radius:12px;margin-bottom:14px}.upload-box h3{font-size:14px;margin-bottom:8px}.upload-box p{font-size:10px;margin-bottom:17px}.upload-box .upload-limit{font-size:9px;margin:11px 0 0}.toolbar{padding:17px 21px;display:flex;justify-content:space-between;gap:15px;align-items:center;border-bottom:1px solid var(--line)}.toolbar h3{font-size:13px}.toolbar .toolbar-controls{display:flex;gap:10px;max-width:520px;width:55%}.search{position:relative;width:100%;max-width:280px}.search>svg{position:absolute;left:11px;top:11px;width:15px;height:15px;color:#9aa7ba}.search input{padding:9px 12px 9px 34px!important;font-size:10px;min-height:35px!important}.toolbar select{padding:8px 11px;font-size:10px;min-height:35px;width:155px}.table-wrap{overflow:auto}table{border-collapse:collapse;width:100%;text-align:left}th{font-size:9px;font-weight:650;color:#9aa6b7;background:#fbfcfe;padding:13px 21px;border-bottom:1px solid var(--line);white-space:nowrap}td{padding:17px 21px;border-bottom:1px solid #eff2f7;font-size:10px;color:#8390a4;vertical-align:middle}tbody tr:last-child td{border-bottom:0}.file-name{display:flex;gap:12px;align-items:center;min-width:200px}.file-name b{font-size:11px;display:block;font-weight:600;color:#455a78;line-height:1.5;max-width:280px;overflow-wrap:anywhere}.file-name small{font-size:9px;display:block;margin-top:5px}.table-actions{white-space:nowrap;text-align:right}.table-note{border-top:1px solid var(--line);font-size:9px;color:#9aa7ba;padding:13px 21px}.notice-row{display:flex;align-items:center;gap:10px;font-size:10px;color:#8396b2;background:#edf4ff;border:1px solid #e0eafb;border-radius:8px;padding:12px 15px;margin-bottom:20px}.notice-row svg{width:15px;height:15px;flex-shrink:0}.notice-row button{margin-left:auto;white-space:nowrap;font-size:10px}.two-column{display:grid;grid-template-columns:1.55fr 1fr;align-items:start;gap:23px}.form-card .card-body{padding:25px}.form-section-title{font-size:11px;font-weight:700;color:#4c6280;margin-bottom:21px}.form-footer{border-top:1px solid var(--line);padding:17px 25px;display:flex;justify-content:space-between;align-items:center;gap:15px}.form-footer small{font-size:9px;line-height:1.6}.side-card{padding:23px}.side-card h3{font-size:13px;margin-bottom:12px}.side-card p{font-size:11px;margin-bottom:18px}.side-list{margin:0;padding:0;list-style:none;counter-reset:steps}.side-list li{counter-increment:steps;display:flex;align-items:flex-start;gap:11px;font-size:11px;color:#7c8da5;padding:12px 0;border-bottom:1px solid #f0f3f8;line-height:1.7}.side-list li:before{content:counter(steps);font-size:9px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:#edf4ff;color:#7b9ac7;flex-shrink:0;width:22px;height:22px}.side-list li:last-child{border-bottom:0}.mode-box{display:flex;gap:12px;background:#f7faff;border:1px solid #e3ecfa;border-radius:10px;padding:16px;margin-bottom:26px}.mode-box>span{background:#e9f2ff;color:#6d95d1;border-radius:8px;padding:9px;height:38px}.mode-box b{font-size:11px}.mode-box p{font-size:10px;line-height:1.7;margin-top:5px}.mode-box .badge{margin-left:auto;height:22px;font-size:8px}.output-checks{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:16px;border:1px solid var(--line);border-radius:8px}.output-checks label{font-size:11px}.switch-row{display:flex;justify-content:space-between;align-items:center;padding:18px;background:#f8fbff;border:1px solid #e6eefb;border-radius:9px;margin-bottom:25px}.switch-row b{font-size:12px}.switch-row p{font-size:10px;margin-top:5px}.switch{width:35px;height:20px;position:relative;display:inline-flex}.switch input{width:100%;height:100%;opacity:0;position:absolute;z-index:1;margin:0}.switch i{position:absolute;inset:0;background:#d7dfeb;border-radius:20px;transition:background .2s}.switch i:after{content:"";height:14px;width:14px;background:white;border-radius:50%;position:absolute;left:3px;top:3px;transition:transform .2s}.switch input:checked+i{background:var(--blue)}.switch input:checked+i:after{transform:translateX(15px)}.next-run{margin:19px 0;padding:16px;border:1px solid #dfebfb;background:#f4f8ff;border-radius:9px}.next-run small{font-size:9px}.next-run strong{display:block;font-size:12px;line-height:1.7;color:#5a78a2;margin-top:7px}.schedule-tip{padding:16px;background:#fafbfd;border:1px solid var(--line);border-radius:8px;font-size:10px;line-height:1.8;color:#8b98ab}
+.results-summary{display:flex;gap:7px;margin-top:13px}.result-list{padding:0 21px}.result-row{display:flex;align-items:center;gap:15px;padding:21px 0;border-bottom:1px solid var(--line)}.result-row:last-child{border:0}.result-cover{width:46px;height:52px;background:#edf5ff;border:1px solid #e3edfc;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0;color:#7297ce}.result-main{flex:1;min-width:0}.result-title{font-size:12px;color:#455a79;font-weight:650;background:none;border:0;padding:0;text-align:left;line-height:1.55}.result-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:7px;color:#98a4b5;font-size:9px}.result-meta .tag{padding:3px 5px;font-size:8px}.result-actions{display:flex;gap:7px;align-items:center}.mini-result{display:flex;align-items:center;gap:11px;padding:18px 22px;border-bottom:1px solid #f0f3f8}.mini-result:last-child{border:0}.mini-result .result-cover{width:35px;height:40px}.mini-result .result-cover svg{width:18px;height:18px}.mini-result button{border:0;background:transparent;font-size:11px;text-align:left;padding:0;font-weight:600;line-height:1.5;color:#526986}.mini-result small{font-size:9px;display:block;margin-top:5px}.mini-result .status{margin-left:auto;font-size:8px}.mini-result>div:nth-child(2){min-width:0}
+dialog{padding:0;border:1px solid #e6ebf2;border-radius:15px;box-shadow:0 28px 95px #142d5038;width:740px;max-width:calc(100vw - 30px);max-height:92vh;color:var(--ink);overflow:hidden;background:white}dialog::backdrop{background:#142d5070;backdrop-filter:blur(3px)}dialog.preview{width:1030px}.modal-head{padding:23px 25px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:15px;align-items:flex-start}.modal-head h2{font-size:20px;letter-spacing:-.5px}.modal-head p{font-size:10px;line-height:1.7;margin-top:7px}.modal-body{padding:24px 25px;max-height:65vh;overflow:auto}.modal-foot{display:flex;align-items:center;justify-content:flex-end;gap:9px;border-top:1px solid var(--line);padding:16px 25px;background:#fff}.modal-foot>small{margin-right:auto;font-size:9px;line-height:1.5}.source-choices{display:flex;flex-direction:column;gap:8px;margin:14px 0 20px}.source-choice{display:flex;align-items:center;gap:11px;padding:13px;border:1px solid var(--line);border-radius:8px;margin:0;font-weight:500;cursor:pointer}.source-choice:has(input:checked){border-color:#a6c4f5;background:#f8fbff}.source-choice.disabled{opacity:.5;cursor:default}.source-choice>div{flex:1;font-size:11px;line-height:1.7}.source-choice b{font-weight:600;display:block}.source-choice small{font-size:9px}.source-choice .file-icon{width:28px;height:33px;font-size:8px}.generate-summary{display:flex;align-items:center;gap:18px;padding:14px 15px;border-radius:8px;background:#f7faff;color:#91a0b7;font-size:10px}.generate-summary span{display:flex;align-items:center;gap:6px}.generate-summary svg{width:15px;height:15px}.progress-state{padding:55px 30px 45px;text-align:center}.progress-orb{display:inline-flex;width:64px;height:64px;align-items:center;justify-content:center;color:var(--blue);background:#edf5ff;border-radius:18px;margin-bottom:22px}.progress-orb svg{width:30px;height:30px;animation:pulse 1.3s ease-in-out infinite}.progress-state h3{font-size:19px;margin-bottom:12px}.progress-state p{font-size:11px}.progress-track{width:290px;max-width:90%;height:5px;background:#edf1f8;border-radius:5px;overflow:hidden;margin:25px auto 16px}.progress-track i{display:block;background:var(--blue);height:100%;width:5%;transition:width .4s;border-radius:5px}.progress-state small{font-size:9px}@keyframes pulse{50%{transform:scale(.87);opacity:.6}}
+.preview-top{display:flex;align-items:center;gap:7px;font-size:10px;color:#96a2b4;margin-bottom:12px}.preview-layout{display:grid;grid-template-columns:1fr 226px;gap:27px}.prose h1{font-size:25px;margin-bottom:18px;line-height:1.35}.prose h2{font-size:15px;margin:25px 0 10px;letter-spacing:-.2px}.prose p,.prose li{font-size:12px;color:#6f819b;line-height:1.9;white-space:pre-line;overflow-wrap:anywhere}.prose ul,.prose ol{padding-left:19px}.prose .ref-line{font-size:9px;color:#a3afbe;margin-top:8px}.quiz-item{border:1px solid var(--line);padding:14px;border-radius:8px;margin:12px 0}.quiz-item strong{font-size:11px;display:block;font-weight:600;line-height:1.7}.quiz-item ol{list-style:upper-alpha;font-size:11px}.quiz-item li{font-size:11px}.quiz-item details{font-size:10px;color:#668e7e;margin-top:8px}.preview-side{padding:17px;background:#f8faff;border:1px solid #e4ecf9;border-radius:10px;height:max-content;position:sticky;top:0}.preview-side h3{font-size:11px;margin-bottom:15px}.preview-side .detail-label{font-size:8px;color:#a0adbd;margin:17px 0 5px;letter-spacing:.5px;text-transform:uppercase}.preview-side b{font-size:10px;font-weight:600;display:block;line-height:1.7;overflow-wrap:anywhere}.preview-source{padding:9px 0;border-bottom:1px solid #e8eef8;font-size:10px;line-height:1.7;color:#7f93af}.preview-source:last-child{border:0}.preview-source svg{width:13px;height:13px;margin-right:5px}.preview-tabs{display:flex;gap:17px;border-bottom:1px solid var(--line);margin-bottom:21px}.preview-tabs button{padding:0 0 11px;background:none;border:0;font-size:11px;color:#8e9bb0;border-bottom:2px solid transparent}.preview-tabs button.active{color:var(--blue);border-color:var(--blue);font-weight:650}.edit-area{font-size:12px!important;min-height:360px}.help-steps{display:flex;flex-direction:column;gap:22px}.help-step{display:flex;gap:14px}.help-step>span{background:#edf4ff;color:#5787d1;width:29px;height:29px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:12px}.help-step h3{font-size:12px;margin-bottom:5px}.help-step p{font-size:11px}.toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,20px);opacity:0;pointer-events:none;z-index:30;background:#203b62;color:white;box-shadow:0 7px 25px #142d5020;border-radius:9px;padding:14px 19px;max-width:calc(100vw - 35px);font-size:12px;line-height:1.6;transition:opacity .18s,transform .18s}.toast.show{opacity:1;transform:translate(-50%,0)}.toast.error{background:#9f4747}.muted{color:var(--muted)}.spacer{height:20px}.source-text{white-space:pre-wrap;font-size:12px;line-height:1.9;color:#6a7d98;background:#f8faff;padding:19px;border:1px solid #e4ecf9;border-radius:8px;max-height:350px;overflow:auto;overflow-wrap:anywhere}
+@media(min-width:1600px){.app main{padding-top:36px}.hero{min-height:280px}.hero h2{font-size:35px}.metrics{gap:20px}}
+@media(max-width:1120px){.sidebar{width:210px;padding-left:13px;padding-right:13px}.workspace-main{margin-left:210px;width:calc(100% - 210px)}.topbar{padding:0 24px}.demo-strip{margin-left:24px;margin-right:24px}.app main{padding-left:24px;padding-right:24px}.hero{padding:25px;grid-template-columns:1.2fr 1fr}.hero h2{font-size:27px}.hero-art{width:260px}.hero-art .mini-output{margin-left:20px}.hero .btn{padding:9px 11px;font-size:10px}.metric{padding:17px 14px}.metric i{right:11px;top:13px;padding:6px}.metrics{gap:11px}.setup-row{gap:14px;padding:16px}.step{font-size:9px}.step small{font-size:8px}.dashboard-grid{grid-template-columns:1.3fr 1fr;gap:16px}.two-column{grid-template-columns:1.5fr 1fr;gap:16px}.card-body,.form-card .card-body{padding:21px}.toolbar .toolbar-controls{width:65%}.page-head h1{font-size:26px}.login-copy h1{font-size:36px}.login-panel{padding:35px}.preview-layout{grid-template-columns:1fr 200px}}
+@media(max-width:900px){.hero-art{display:none}.hero{display:block}.hero p{max-width:470px}.metrics{grid-template-columns:1fr 1fr}.dashboard-grid,.two-column{grid-template-columns:1fr}.setup-row{align-items:flex-start;flex-direction:column}.setup-row>b{margin-bottom:7px}.schedule-mini .btn{width:100%}.match-grid{grid-template-columns:1fr}.topbar-right>#header-date{display:none}.preview-layout{grid-template-columns:1fr}.preview-side{position:static;display:none}.login-layout{grid-template-columns:1fr 1fr}.login-copy h1{font-size:30px}.login-story{padding:35px 30px}.login-footer span{display:none}.login-copy>p{font-size:12px}.login-benefits{font-size:10px}}
+@media(max-width:700px){.sidebar{position:static;width:100%;padding:15px 17px 0;display:block;border-right:0;border-bottom:1px solid var(--line)}.sidebar>.brand{margin:0 0 16px;font-size:14px}.sidebar .brand b{display:inline;margin-left:3px}.sidebar .brand small{margin-top:4px;letter-spacing:1px}.sidebar .brand-mark{width:31px;height:34px}.workspace,.nav-label,.sidebar-help,.profile{display:none}.sidebar nav{flex-direction:row;overflow:auto;gap:4px;margin:0 -3px;padding-bottom:9px}.sidebar nav :is(button,a){font-size:9px;gap:5px;padding:10px;white-space:nowrap;width:auto}.sidebar nav svg{width:14px;height:14px}.nav-count{display:none}.app{display:block}.workspace-main{margin:0;width:100%}.topbar{height:50px;padding:0 19px}.breadcrumb{font-size:10px}.topbar-right{gap:10px;font-size:9px}.demo-strip{margin:17px 17px 0;font-size:9px;padding:9px 10px}.demo-strip-tag{display:none}.app main{padding:23px 17px}.page-head{flex-direction:column;gap:15px;margin-bottom:21px}.page-head h1{font-size:26px}.page-head p{font-size:11px}.page-head .head-actions{width:100%}.page-head .head-actions .btn{flex:1}.hero{padding:23px}.hero h2{font-size:27px}.hero p{font-size:10px}.metric strong{font-size:25px}.metric small{font-size:8px}.setup-row{padding:16px}.step-arrow{display:none}.steps{gap:8px}.step{align-items:flex-start;gap:6px}.step>i{width:21px;height:21px;flex-shrink:0}.step small{font-size:7px}.app-footer{margin-left:17px;margin-right:17px;font-size:8px}.app-footer>span:last-child{display:none}.toolbar{padding:16px;flex-direction:column;align-items:stretch;gap:12px}.toolbar .toolbar-controls{width:100%;max-width:none}.search{max-width:none}.result-list{padding:0 16px}.result-row{gap:10px;flex-wrap:wrap}.result-main{min-width:200px}.result-actions{margin-left:56px}.field-grid{grid-template-columns:1fr}.output-checks{grid-template-columns:1fr}.form-footer{padding:16px 20px;align-items:flex-start;flex-direction:column}.form-footer .btn{width:100%}.modal-head{padding:20px}.modal-head h2{font-size:19px}.modal-body{padding:20px;max-height:63vh}.modal-foot{padding:15px 20px;flex-wrap:wrap}.modal-foot>small{width:100%;margin-bottom:5px}.modal-foot .btn{flex:1;font-size:10px;padding:9px}.generate-summary{gap:10px;flex-wrap:wrap;font-size:9px}.login-layout{display:flex;flex-direction:column}.login-story{padding:22px 25px;background:#f3f7ff}.login-copy{padding:26px 0 16px}.login-copy h1{font-size:28px;margin:13px 0}.login-copy h1 br:last-child{display:none}.login-copy>p{font-size:11px}.login-diagram,.login-benefits,.login-footer{display:none}.login-story .brand b{display:inline;font-size:14px;margin-left:3px}.login-story .brand small{font-size:8px}.login-story .brand-mark{width:33px;height:36px}.eyebrow{font-size:7px}.login-panel{padding:30px 25px}.login-form-wrap{width:100%;max-width:400px}.login-form-wrap h2{font-size:23px;margin-top:16px}.login-form-wrap>p{margin-bottom:22px}.login-form-wrap .login-bottom{margin-top:30px}}
+@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
+@media(max-width:700px){.sidebar nav{flex-wrap:wrap;overflow:visible;align-items:flex-start}.sidebar nav>:is(button,a){flex:1;justify-content:center}.sidebar nav .admin-menu{width:100%;margin:3px 0 0;padding:4px 0 0;border-top:1px solid var(--line)}.sidebar nav .admin-menu summary{padding:7px 10px;justify-content:flex-start;gap:8px;font-size:9px}.sidebar nav .admin-menu button{display:inline-flex;width:auto;padding:8px 10px;font-size:9px}.sidebar nav .admin-menu summary svg{width:12px;height:12px}}
+/* Content library and format-specific previews. */
+@media(max-width:600px){.overview-banner{display:grid!important;grid-template-columns:42px minmax(0,1fr);align-items:start!important}.overview-banner>div{min-width:0}.overview-banner>.status{grid-column:2;margin:0!important;justify-self:start}}
+.overview-banner{display:flex;align-items:center;gap:20px;background:#edf4ff;border:1px solid #dfeaff;border-radius:14px;padding:26px 28px;margin-bottom:24px}.overview-symbol{display:grid;place-items:center;width:55px;height:55px;border-radius:15px;color:var(--blue);background:white;flex-shrink:0}.overview-symbol svg{width:27px;height:27px}.overview-banner h2{font-size:23px;margin:9px 0 6px}.overview-banner p{font-size:11px}.overview-banner>.status{margin-left:auto}.metric strong.date-metric{font-size:21px;letter-spacing:-.7px;margin-top:16px}.summary-metrics{margin-bottom:26px}.format-summary{display:flex;justify-content:center;flex-wrap:wrap;gap:28px;padding:22px 0 4px;font-size:10px;color:var(--muted)}.format-summary>span{display:flex;align-items:center;gap:8px}.format-summary b{color:var(--ink);margin-left:4px}.type-badge{display:inline-flex;align-items:center;gap:5px;padding:5px 7px;border-radius:5px;font-size:9px;font-weight:650;white-space:nowrap;background:#edf4ff;color:#4872bd}.type-badge svg{width:12px;height:12px}.type-badge.pdf{background:#fff0ee;color:#c77b72}.type-badge.scorm{background:#f1edfc;color:#8a6dc0}.type-badge.audio{background:#eaf6f3;color:#518e80}.content-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;padding:22px}.content-card{border:1px solid var(--line);border-radius:11px;overflow:hidden;min-width:0;background:white}.content-cover{height:122px;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;background:#ecf3ff;color:#5d85c5}.content-cover>svg{width:30px;height:30px;stroke-width:1.3}.content-cover>span{font-size:11px;font-weight:650}.content-cover>small{position:absolute;top:11px;left:12px;font-size:7px;letter-spacing:1.2px;color:inherit;opacity:.65}.content-cover.pdf{background:#fbf1ef;color:#bd867d}.content-cover.audio{background:#edf7f4;color:#679b8d}.content-cover.scorm{background:#f2effa;color:#9a82bb}.content-card-body{padding:15px}.content-card-top{display:flex;align-items:center;justify-content:space-between;gap:5px;margin-bottom:12px}.content-card-top .status{font-size:8px;padding:5px 6px}.content-title{display:block;text-align:left;border:0;padding:0;background:none;font-weight:650;font-size:13px;line-height:1.55;letter-spacing:-.2px;min-height:61px;color:var(--ink);overflow-wrap:anywhere}.content-title:hover{color:var(--blue)}.content-card-body>p{font-size:9px;margin:9px 0 15px}.content-card-foot{border-top:1px solid var(--line);padding-top:13px;display:flex;align-items:center;justify-content:space-between;gap:8px}.content-card-foot>span{font-size:8px;color:#a0aabd}.content-card-foot .text-btn{font-size:10px}.content-card-foot svg{width:12px;height:12px}.supported-formats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:20px}.supported-formats>div{display:flex;align-items:center;gap:12px;border:1px solid var(--line);border-radius:10px;padding:17px;background:white}.supported-formats b{font-size:12px}.supported-formats small{display:block;font-size:9px;margin-top:6px}.format-icon{display:grid;place-items:center;width:38px;height:40px;border-radius:8px;background:#edf4ff;color:#5d85c5;flex-shrink:0}.format-icon.scorm{color:#8a6dc0;background:#f1edfc}.format-icon.audio{color:#518e80;background:#eaf6f3}.format-icon.pdf{color:#c77b72;background:#fff0ee}.file-icon.scorm{font-size:7px;background:#f1edfc;color:#8a6dc0}.file-icon.mp4,.file-icon.webm,.file-icon.mov,.file-icon.m4v{color:#5d85c5;background:#edf4ff}.file-icon.mp3,.file-icon.wav,.file-icon.m4a,.file-icon.ogg,.file-icon.aac,.file-icon.flac{background:#eaf6f3;color:#518e80}.preview-notice{display:flex;gap:9px;padding:12px 14px;background:#eef5ff;border-radius:7px;color:#6d86a8;font-size:11px;line-height:1.7;margin-bottom:18px}.preview-notice.concept{background:#fff8e9;color:#a88c55}.preview-notice svg{width:16px;height:16px;margin-top:2px}.storyboard-screen{padding:25px;background:#eef4ff;border:1px solid #dae7fa;border-radius:12px;min-height:290px;display:flex;flex-direction:column;align-items:center;text-align:center;justify-content:center;color:#3f659c}.storyboard-screen>span{font-size:8px;letter-spacing:1.6px}.storyboard-screen>div{margin:21px 0 13px}.storyboard-screen svg{width:38px;height:38px;stroke-width:1.3}.storyboard-screen h2{font-size:22px}.storyboard-screen p{font-size:11px;max-width:460px;margin:13px 0;color:#7c92b1}.storyboard-screen>small{font-size:8px;margin-top:16px}.scene-list{display:flex;gap:8px;overflow:auto;padding:14px 0 6px}.scene-list button{padding:11px;text-align:left;flex:0 0 128px;font-size:9px;line-height:1.6;background:white;border:1px solid var(--line);border-radius:7px;color:#8b98ab}.scene-list button b{display:block;margin-bottom:6px;font-size:8px}.scene-list button.active{border-color:#a7c4fa;background:#f3f7ff;color:var(--blue)}.script-details>summary{font-size:12px;color:var(--blue);cursor:pointer;margin-bottom:20px}.audio-preview{text-align:center;padding:26px;background:#f1f8f6;border-radius:12px;border:1px solid #e0efea}.audio-orb{display:grid;place-items:center;background:white;color:#619d89;border-radius:50%;height:58px;width:58px;margin:0 auto 18px}.audio-orb svg{width:27px;height:27px}.waveform{display:flex;justify-content:center;gap:4px;height:60px;align-items:center;margin:0 auto 20px;max-width:100%;overflow:hidden}.waveform i{width:3px;border-radius:4px;flex-shrink:0;background:#9bc7b8}.audio-preview h2{font-size:20px}.audio-preview p{font-size:11px;margin:12px auto 20px}.audio-preview .head-actions{justify-content:center}.audio-preview>small{display:block;font-size:9px;margin-top:15px}.scorm-preview-head{display:flex;gap:11px;align-items:center;padding:15px;background:#f3effb;color:#9377b8;border-radius:8px;margin-bottom:23px;font-size:12px}.scorm-preview-head svg{width:26px;height:26px}.scorm-preview-head small{display:block;font-size:9px;margin-top:5px}.scorm-preview>h2{font-size:23px}.scorm-preview>p{font-size:11px;margin:10px 0 20px}.chapter{border:1px solid var(--line);border-radius:8px;margin:10px 0;overflow:hidden}.chapter summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:11px;padding:15px;font-size:12px;font-weight:600;background:#fafbfe}.chapter summary>span{font-size:9px;background:#f0edf8;color:#9a83ba;padding:7px;border-radius:5px}.chapter>p{font-size:12px;padding:17px;white-space:pre-wrap}.source-player{display:block;width:100%;max-height:350px;margin:0 auto 20px;border-radius:8px}.upload-issues{font-size:12px;line-height:1.9;color:#b47a6a}
+@media(max-width:1250px){.content-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.content-title{min-height:42px}.supported-formats{gap:10px}.supported-formats>div{padding:12px;gap:8px}.supported-formats small{font-size:8px}.overview-banner h2{font-size:20px}}
+@media(max-width:900px){.overview-banner{align-items:flex-start;flex-wrap:wrap;padding:22px}.overview-banner>.status{margin:0 0 0 75px}.supported-formats{grid-template-columns:repeat(2,1fr)}.toolbar-controls{flex-wrap:wrap!important;gap:8px!important}.toolbar-controls>.search{flex-basis:100%}.toolbar-controls>select{flex:1}.format-summary{gap:14px}}
+@media(max-width:600px){.overview-banner{gap:14px;padding:19px}.overview-symbol{width:42px;height:44px}.overview-banner>div{flex:1}.overview-banner h2{font-size:19px;line-height:1.4}.overview-banner .eyebrow{font-size:6px;letter-spacing:1px}.overview-banner p{font-size:9px}.overview-banner>.status{margin:0 0 0 56px;font-size:9px}.content-grid{grid-template-columns:1fr;padding:16px;gap:17px}.content-cover{height:130px}.content-title{min-height:0;font-size:14px}.content-card-top .status{font-size:9px}.content-card-body{padding:17px}.format-summary{justify-content:flex-start}.format-summary>span{width:calc(50% - 14px);font-size:9px}.supported-formats>div{padding:12px}.supported-formats small{font-size:8px}.metric strong.date-metric{font-size:17px}.audio-preview{padding:22px 16px}.audio-preview .head-actions{flex-wrap:wrap}.audio-preview h2{font-size:19px}.storyboard-screen{min-height:290px;padding:24px 18px}.storyboard-screen h2{font-size:20px}.waveform{gap:3px}.upload-limit{line-height:1.9!important}.card-head{flex-wrap:wrap}.content-grid .text-btn{font-size:11px}}
+/* Brain and the L&D assistant workflow. */
+.journey-strip{display:flex;gap:15px;justify-content:space-between;flex-wrap:wrap;margin:0 0 24px;padding:0 3px;font-size:11px;color:#7a8ba5}.journey-strip>span{display:flex;align-items:center;gap:9px}.journey-strip b{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#eaf2ff;color:var(--blue);font-size:9px}.brain-banner{display:flex;align-items:center;gap:23px;padding:29px;background:#edf4ff;border:1px solid #dfeaff;border-radius:14px;margin-bottom:20px}.brain-symbol{height:76px;width:76px;border-radius:20px;background:white;color:var(--blue);display:grid;place-items:center;flex-shrink:0}.brain-symbol svg{width:42px;height:42px;stroke-width:1.25}.brain-banner h2{font-size:25px;margin:11px 0 9px}.brain-banner p{font-size:11px}.brain-formats{display:flex;gap:7px;margin-top:15px}.brain-context{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:22px 0}.brain-context>div{display:flex;align-items:center;gap:12px;padding:5px 3px;color:#7192be}.brain-context b{display:block;font-size:12px;color:#4a6285}.brain-context small{display:block;font-size:10px;margin-top:5px;line-height:1.7}.brain-selection{padding:13px 23px;background:#fbfcfe;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:15px;font-size:10px;color:var(--muted)}.brain-selection label{font-size:11px}.brain-topics{margin:26px 0 3px}.brain-topics h3{font-size:14px}.brain-topics p{font-size:10px;margin:7px 0 14px}.brain-topics>div{display:flex;flex-wrap:wrap;gap:7px}.upload-success{display:flex;align-items:center;gap:17px;padding:23px;margin-bottom:20px}.upload-success>span{padding:10px;background:#eaf6f2;color:#559a84;border-radius:50%}.upload-success h3{font-size:14px}.upload-success p{font-size:11px;margin-top:7px}.upload-success .btn{margin-left:auto}.ai-workspace{display:grid;grid-template-columns:1.05fr 1fr;gap:23px;align-items:start}.assistant-title{display:flex;gap:12px;align-items:center}.assistant-title>span{display:grid;place-items:center;width:38px;height:40px;border-radius:9px;background:#edf4ff;color:var(--blue)}.ai-messages{padding:24px 22px;max-height:450px;overflow:auto;min-height:215px}.ai-message{display:flex;align-items:flex-start;gap:10px;margin-bottom:18px}.ai-message:last-child{margin-bottom:0}.ai-message>span{display:grid;place-items:center;flex-shrink:0;width:25px;height:27px;border-radius:7px;background:#eaf2ff;color:#6f91c5}.ai-message svg{width:14px;height:14px}.ai-message p{background:#f5f8fd;border-radius:0 10px 10px;padding:14px;font-size:11px;line-height:1.85;color:#788da9;white-space:pre-wrap}.ai-message.user{flex-direction:row-reverse}.ai-message.user p{border-radius:10px 0 10px 10px;background:#eef4ff;color:#587cb2}.prompt-chips{display:flex;gap:7px;flex-wrap:wrap;padding:0 22px 20px}.prompt-chips button{font-size:9px;padding:8px 10px;border:1px solid #dfe9f8;border-radius:20px;background:white;color:#7390b7}.prompt-chips button:hover{background:#f0f6ff;color:var(--blue)}#ai-request-form{padding:20px 22px;border-top:1px solid var(--line);background:#fcfdff}#ai-request-form textarea{font-size:12px;min-height:110px}.ai-compose-footer{display:flex;gap:15px;align-items:center;justify-content:space-between;margin-top:14px}.ai-compose-footer small{font-size:9px;line-height:1.7}.ai-compose-footer .btn{font-size:11px;flex-shrink:0}.ai-disclosure{display:flex;align-items:flex-start;gap:8px;padding:17px 22px;font-size:9px;line-height:1.8;color:#9ba8bb;border-top:1px solid var(--line)}.ai-disclosure svg{width:13px;height:13px;margin-top:3px;flex-shrink:0}.ai-plan .card-body{padding:23px}.ai-plan label{font-size:11px}.ai-plan .field{margin-bottom:20px}.ai-plan .field-grid{gap:0 14px}.plan-source{display:flex;align-items:center;gap:10px;padding:14px;background:#f1f6ff;border-radius:8px;margin-bottom:21px}.plan-source>span{display:grid;place-items:center;width:33px;height:34px;border-radius:8px;background:white;color:#7c9bcc}.plan-source b{font-size:11px}.plan-source small{display:block;font-size:8px;line-height:1.6;margin-top:4px}.plan-source .text-btn{margin-left:auto;font-size:10px}.plan-actions{display:flex;gap:9px}.plan-actions .btn{flex:1;padding:10px;font-size:11px}.ai-plan .switch-row{padding:16px 0 20px;margin-top:0}.result-tabs{display:flex;gap:7px;border-bottom:1px solid #e5ebf4;margin-bottom:20px}.result-tabs button{background:none;border:0;border-bottom:2px solid transparent;font-size:12px;padding:11px 17px 14px;color:#92a0b6}.result-tabs button.active{color:var(--blue);border-color:var(--blue)}.result-tabs b{font-size:9px;background:#edf3ff;color:#85a0c7;padding:3px 5px;border-radius:4px;margin-left:5px}.research-list{padding:0 22px}.research-row{display:flex;align-items:center;gap:16px;padding:22px 0;border-bottom:1px solid var(--line)}.research-row:last-child{border-bottom:0}.research-row>span{display:grid;place-items:center;height:43px;width:43px;background:#f0f5fd;color:#819cc4;border-radius:9px;flex-shrink:0}.research-row h3{font-size:13px;margin-top:10px;line-height:1.6;overflow-wrap:anywhere}.research-row p{font-size:9px;margin-top:7px}.research-row>.btn{margin-left:auto;flex-shrink:0}.content-cover.text{background:#edf3fa;color:#849bb7}.type-badge.text{background:#edf3fa;color:#7993b7}.format-icon.text{background:#edf3fa;color:#849bb7}
+@media(max-width:1100px){.ai-workspace{grid-template-columns:1fr}.ai-messages{min-height:150px}.ai-plan .field-grid{grid-template-columns:1fr 1fr}.brain-banner h2{font-size:22px}}
+@media(max-width:700px){.sidebar nav{gap:4px}.sidebar nav>:is(button,a){flex:1 0 auto;padding:9px;font-size:9px}.ai-workspace{gap:20px}.brain-context{grid-template-columns:1fr;gap:12px}.brain-selection{align-items:flex-start;flex-direction:column;gap:8px;padding:13px 17px}.brain-banner{padding:22px;gap:17px;align-items:flex-start}.brain-symbol{width:48px;height:50px;border-radius:12px}.brain-symbol svg{width:29px;height:29px}.brain-banner h2{font-size:21px;line-height:1.4}.brain-banner p{font-size:10px}.brain-banner .eyebrow{font-size:6px;letter-spacing:1.1px}.brain-formats{flex-wrap:wrap;gap:5px}.brain-banner>div{min-width:0}.journey-strip{display:grid;grid-template-columns:1fr 1fr;gap:14px;font-size:10px}.upload-success{flex-wrap:wrap;gap:13px;padding:20px}.upload-success>div{flex:1;min-width:180px}.upload-success .btn{width:100%;margin-left:0}.ai-plan .field-grid{grid-template-columns:1fr}.ai-messages{padding:20px 17px;max-height:340px}.ai-message p{font-size:11px;padding:12px}.prompt-chips{padding:0 17px 18px}#ai-request-form{padding:20px 17px}.ai-compose-footer{align-items:flex-start;flex-direction:column;gap:12px}.ai-compose-footer .btn{width:100%}.ai-disclosure{padding:17px}.plan-actions{flex-direction:column}.plan-actions .btn{width:100%}.ai-plan .card-body{padding:20px}.research-row{align-items:flex-start;flex-wrap:wrap;gap:12px}.research-row>div{flex:1;min-width:170px}.research-row>.btn{margin-left:55px}.research-list{padding:0 17px}.research-row h3{font-size:12px}.plan-source{gap:8px}.plan-source small{font-size:8px}.assistant-title{gap:8px}.assistant-title h3{font-size:13px}}
+/* Three simple screens: upload, the combined Brain and AI workspace, results. */
+.unified-workspace{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:22px;align-items:start}.compact-brain .card-head,.simple-ai .card-head{padding:19px 20px}.compact-brain .card-head>svg{color:#8ca6cd}.compact-brain .badge{margin-left:5px}.compact-brain-search{padding:17px 19px}.compact-brain-search .search{width:100%;max-width:none}.compact-brain .brain-selection{padding:12px 19px;font-size:9px}.compact-brain .brain-selection label{font-size:10px}.compact-source-list{max-height:450px;overflow:auto;padding:0 17px}.compact-source-row{display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--line);padding:15px 0;min-height:74px}.compact-source-row:last-child{border-bottom:0}.compact-source-row>input{margin:0;width:14px;height:14px}.compact-source-row .file-icon{width:30px;height:35px;font-size:7px;flex-shrink:0}.compact-source-name{min-width:0;flex:1}.compact-source-name b{display:block;font-size:11px;line-height:1.5;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.compact-source-name small{display:block;font-size:8px;margin-top:5px}.compact-source-row .icon-btn{padding:4px}.compact-source-row .icon-btn svg{width:14px;height:14px}.simple-ai #ai-request-form{padding:19px 20px;background:white;border:0}.simple-ai #ai-request-form textarea{min-height:85px;font-size:12px}.simple-ai .ai-compose-footer{margin-top:12px;gap:10px}.simple-ai .prompt-chips{padding:0;gap:6px}.simple-ai .prompt-chips button{padding:6px 9px;font-size:8px}.simple-ai .ai-compose-footer>.btn{min-height:32px;padding:7px 14px;font-size:10px}.compact-ai-reply{display:flex;gap:9px;padding:12px 15px;margin:0 20px 17px;background:#f3f7ff;border-radius:8px;color:#849cc0}.compact-ai-reply svg{width:14px;height:14px;margin-top:3px}.compact-ai-reply p{font-size:10px;line-height:1.8;color:#8195b3}.simple-plan{padding:17px 20px 18px;border-top:1px solid var(--line)}.simple-plan-row{display:grid;grid-template-columns:minmax(0,1fr) 100px;gap:13px}.simple-plan .field{margin-bottom:14px}.simple-plan label{font-size:10px}.simple-plan input:not([type=checkbox]),.simple-plan select,.simple-plan textarea{font-size:11px;min-height:38px;padding:10px 11px}.simple-plan #ai-count-help{font-size:8px;line-height:1.7;display:block;margin-top:-4px}.simple-options{margin:14px 0 0}.simple-options>summary{font-size:10px;color:#8a9cb7;cursor:pointer;padding:5px 0 11px}.simple-options[open]>summary{margin-bottom:7px}.simple-options small{font-size:8px}.simple-schedule-toggle{display:flex;justify-content:space-between;align-items:center;padding:13px 0 17px;border-top:1px solid #eff2f7;margin-top:6px}.simple-schedule-toggle label{font-size:11px;color:#647f9f}.simple-schedule-toggle>span{font-size:8px;color:#a3afbf}.simple-plan #schedule-fields{padding:0 0 7px}.simple-plan .field-grid{gap:13px}.simple-plan .plan-actions{gap:9px}.simple-plan .plan-actions .btn{font-size:11px;min-height:39px}.simple-saved-status{font-size:8px;color:#9aaac0;line-height:1.8;margin-top:12px}.simple-ai>.table-note,.compact-brain>.table-note{font-size:8px;line-height:1.8;padding:13px 19px}.sidebar .profile{margin-top:auto}
+@media(max-width:1000px){.unified-workspace{grid-template-columns:1fr}.compact-source-list{max-height:280px}.compact-source-row{min-height:65px;padding:12px 0}.simple-ai .ai-compose-footer{flex-direction:row;align-items:center}.simple-plan-row{grid-template-columns:minmax(0,1fr) 110px}.simple-plan .field-grid{grid-template-columns:1fr 1fr}}
+@media(max-width:700px){.sidebar nav>:is(button,a){flex:1 0 0;justify-content:center}.unified-workspace{gap:18px}.compact-brain .card-head,.simple-ai .card-head{padding:17px}.compact-brain .brain-selection{flex-direction:row;gap:9px;padding:11px 17px}.compact-source-row{gap:8px}.compact-source-row .file-icon{width:27px;height:32px;font-size:6px}.compact-source-name b{font-size:10px}.compact-source-name small{font-size:7px}.simple-ai #ai-request-form{padding:17px}.simple-plan{padding:17px}.simple-ai .ai-compose-footer{align-items:flex-start;gap:8px}.simple-ai .ai-compose-footer>.btn{width:auto;flex-shrink:0}.simple-ai .prompt-chips{flex-direction:column;align-items:flex-start}.simple-plan-row{grid-template-columns:minmax(0,1fr) 90px}.simple-plan .plan-actions{flex-direction:row}.simple-plan .plan-actions .btn{font-size:10px;padding:9px 8px}.compact-ai-reply{margin-left:17px;margin-right:17px}.compact-ai-reply p{font-size:9px}.simple-plan .field-grid{grid-template-columns:1fr 1fr}}
diff --git a/src/styles/theme.css b/src/styles/theme.css
new file mode 100644
index 0000000..ad054a7
--- /dev/null
+++ b/src/styles/theme.css
@@ -0,0 +1,260 @@
+/* Modern theme from the "Learning Lab Express Redesign" canvas: light sidebar, bright blue
+   accent, Plus Jakarta Sans, softer radii and layered shadows. Loaded last, so it only overrides. */
+:root{
+  --blue:#1570ef;--blue-dark:#175cd3;--navy:#101828;--ink:#101828;--muted:#667085;--line:#e4e7ec;--bg:#f5f8ff;--light:#eff8ff;--green:#067647;--radius:18px;
+  --glow:#2e90fa;--soft:#d1e9ff;--deep:#194185;
+  --shadow-card:0 1px 2px rgba(16,24,40,.04),0 10px 30px -14px rgba(21,94,239,.16);
+  --shadow-btn:inset 0 1px 0 rgba(255,255,255,.22),0 8px 18px -8px rgba(21,112,239,.7);
+  font-family:'Plus Jakarta Sans',system-ui,-apple-system,"Segoe UI",sans-serif;font-size:14px;
+  -webkit-font-smoothing:antialiased;
+}
+button:focus-visible,a:focus-visible{outline:2px solid var(--glow);outline-offset:2px}
+p{color:var(--muted)}
+h1,h2,h3,h4{letter-spacing:-.03em}
+small{color:var(--muted)}
+
+/* Brand */
+.brand-mark{background:linear-gradient(140deg,#53b1fd,#2e90fa 45%,#1570ef);border-radius:12px;box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 8px 20px -6px rgba(46,144,250,.6)}
+.brand{font-weight:800;letter-spacing:-.02em}
+
+/* Buttons and controls */
+.btn{min-height:40px;padding:9px 16px;border-radius:12px;border-color:var(--line);font-size:13.5px;font-weight:600;transition:background .15s,transform .15s,box-shadow .15s}
+.btn:hover{background:#f5f8ff;border-color:#d0d5dd}
+.btn.primary{background:var(--blue);border-color:var(--blue);box-shadow:var(--shadow-btn)}
+.btn.primary:hover{background:var(--blue-dark);transform:translateY(-1px)}
+.btn.primary:disabled{transform:none;box-shadow:none}
+.btn.light{background:var(--light);border-color:var(--soft);color:var(--blue-dark)}
+.btn.small{min-height:34px;padding:7px 12px;font-size:12.5px;border-radius:10px}
+.btn.danger{color:#b91c1c}
+.icon-btn{border-radius:10px;color:var(--muted)}
+.icon-btn:hover{background:var(--light);color:var(--blue)}
+.text-btn{color:var(--blue-dark);font-size:13px}
+.badge,.status,.type-badge{border-radius:999px;padding:5px 10px;font-size:11.5px;font-weight:600}
+.badge.blue{color:var(--blue-dark);background:var(--light)}
+.badge.neutral{background:#f2f4f7;color:#475467}
+.status.ready{color:#047857;background:#ecfdf5}
+.status.draft{color:#b45309;background:#fffbeb}
+.status.failed{color:#b91c1c;background:#fef2f2}
+.type-badge{background:var(--light);color:var(--blue-dark)}
+
+label{font-size:13px;font-weight:600}
+input:not([type=checkbox]):not([type=radio]):not([type=file]),select,textarea{border-color:#d0d5dd;border-radius:12px;font-size:14px;outline-color:var(--blue);transition:border-color .15s,box-shadow .15s}
+input:focus,select:focus,textarea:focus{border-color:var(--blue);box-shadow:0 0 0 4px rgba(21,112,239,.14)}
+input::placeholder,textarea::placeholder{color:#98a2b3}
+.inline-note,.preview-notice{background:#f5faff;border:1px solid var(--soft);border-radius:14px;color:#475467;font-size:12.5px}
+.inline-note svg,.preview-notice svg{color:var(--blue)}
+.error{color:#b91c1c}
+
+/* Sidebar: light, bright blue active state */
+.sidebar{width:264px;background:#fff;border-right:1px solid var(--line);padding:24px 16px 16px;color:var(--ink);overflow:hidden}
+.sidebar::before{content:"";position:absolute;left:-120px;top:-140px;width:360px;height:360px;border-radius:50%;background:radial-gradient(closest-side,rgba(46,144,250,.16),rgba(46,144,250,0));pointer-events:none}
+.sidebar>*{position:relative}
+.sidebar>a:first-child{display:block}
+.sidebar>a>.brand{margin:0 4px 24px;font-size:16px}
+.sidebar .brand-mark{width:38px;height:38px;border-radius:12px}
+.workspace{border:1px solid var(--line);background:#f8faff;border-radius:14px;padding:10px;margin-bottom:26px;font-size:13.5px}
+.workspace small{font-size:12px}
+.workspace-icon{background:var(--light);color:var(--blue-dark);border-radius:9px;width:30px;height:30px;font-weight:800}
+.nav-label{color:var(--muted);font-size:11px;letter-spacing:.08em;text-transform:uppercase;margin:0 12px 10px}
+.sidebar nav{gap:4px}
+.sidebar nav :is(button,a){position:relative;padding:11px 12px;border-radius:12px;color:#475467;font-size:14px;font-weight:550;transition:background .15s,color .15s}
+.sidebar nav :is(button,a) svg{color:#98a2b3}
+.sidebar nav :is(button,a):hover{background:#f2f7ff;color:var(--ink)}
+.sidebar nav :is(button,a).active{background:linear-gradient(90deg,#1570ef,#2e90fa);color:#fff;font-weight:650;box-shadow:0 8px 18px -10px rgba(21,112,239,.8)}
+.sidebar nav :is(button,a).active svg{color:#fff}
+.sidebar-help{border:1px solid var(--soft);background:linear-gradient(160deg,#eff8ff,#fff);border-radius:16px;padding:16px 14px}
+.sidebar-help>svg{color:var(--blue)}
+.sidebar-help b{font-size:13px}
+.sidebar-help p{font-size:12px}
+.sidebar-help button{color:var(--blue-dark);font-size:12.5px}
+.profile{border-top:1px solid var(--line);padding:14px 4px 0}
+.profile b{font-size:13px}
+.profile small{font-size:11.5px}
+.avatar{background:linear-gradient(140deg,#2e90fa,#1570ef);color:#fff;width:34px;height:34px;font-weight:700;box-shadow:0 0 0 2px #fff,0 0 0 3.5px rgba(46,144,250,.5);flex-shrink:0}
+
+/* Main column: glass top bar and a soft blue glow at the top */
+.workspace-main{margin-left:264px;width:calc(100% - 264px);background:radial-gradient(900px 420px at 85% -120px,rgba(46,144,250,.18),rgba(124,92,255,0) 70%),radial-gradient(700px 360px at 10% -160px,rgba(125,215,255,.22),rgba(190,242,100,0) 70%) no-repeat}
+.topbar{position:sticky;top:0;z-index:4;height:64px;padding:0 36px;background:rgba(255,255,255,.7);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid #eaecf0}
+.breadcrumb{font-size:13.5px;color:var(--muted)}
+.breadcrumb span{color:#d0d5dd}
+.breadcrumb b{color:var(--ink);font-weight:600}
+.topbar-right{font-size:13px;color:var(--muted);gap:16px}
+.demo-indicator{height:30px;padding:0 12px;border:1px solid var(--line);border-radius:999px;background:#fff;font-size:12.5px;font-weight:550;color:#344054}
+.demo-indicator i{width:7px;height:7px;background:#059669;box-shadow:0 0 0 3px #d1fae5}
+.lang-switch{border:0;border-radius:999px;background:#f2f4f7;padding:3px}
+.lang-switch button{border-radius:999px;padding:5px 11px;font-size:12px;color:#475467}
+.lang-switch button.active{background:#fff;color:var(--ink);box-shadow:0 1px 3px rgba(16,24,40,.12)}
+.demo-strip{margin:24px 36px 0;padding:8px 10px 8px 16px;border:1px solid rgba(46,144,250,.25);border-radius:999px;background:rgba(255,255,255,.75);box-shadow:0 6px 20px -12px rgba(21,112,239,.35);color:var(--deep);font-size:13px}
+.demo-strip svg{color:var(--blue)}
+.demo-strip-tag{font-size:11px;letter-spacing:.06em;font-weight:700;color:#fff;background:var(--blue);border-radius:999px;padding:4px 10px}
+.app main{padding:28px 36px 32px}
+.page-head{margin-bottom:28px}
+.page-head h1{font-size:38px;line-height:1.08;font-weight:800;letter-spacing:-.04em}
+.page-head p{font-size:15px;margin-top:8px;max-width:720px}
+.app-footer{margin:auto 36px 0;padding:20px 0;border-top:1px solid var(--line);font-size:12.5px;color:var(--muted)}
+.app-footer>span:first-child{color:var(--blue-dark)}
+.app-footer>span:last-child{font-size:12.5px}
+
+/* Cards and sections */
+.card{border-color:var(--line);border-radius:var(--radius);box-shadow:var(--shadow-card)}
+.card-head{padding:18px 22px}
+.card-head h3{font-size:16px;font-weight:700}
+.card-head p{font-size:13px}
+.card-body{padding:22px}
+.section-heading h3,.toolbar h3{font-size:16px;font-weight:700}
+.section-heading p{font-size:13px}
+
+/* Metrics: bento tiles, the first one dark */
+.metrics{gap:16px;margin-bottom:24px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
+.metric{border-color:var(--line);border-radius:18px;padding:20px 22px;box-shadow:var(--shadow-card);overflow:hidden}
+.metric>span{font-size:13px;font-weight:600;color:#475467}
+.metric strong{font-size:38px;font-weight:800;letter-spacing:-.045em;line-height:1.05;margin:10px 0 6px;font-variant-numeric:tabular-nums}
+.metric small{font-size:12.5px}
+.metric:first-child{background:linear-gradient(140deg,#175cd3,#1570ef);border-color:#1570ef;color:#fff;box-shadow:0 18px 40px -18px rgba(21,112,239,.7)}
+.metric:first-child::after{content:"";position:absolute;right:-60px;top:-80px;width:220px;height:220px;border-radius:50%;background:radial-gradient(closest-side,rgba(255,255,255,.35),rgba(255,255,255,0));pointer-events:none}
+.metric:first-child>span{color:#eff8ff}
+.metric:first-child small{color:#eff8ff}
+.metric i{border-radius:12px;background:var(--light);color:var(--blue)}
+
+/* Upload */
+.upload-box{border:1.5px dashed #84caff;border-radius:20px;background:linear-gradient(135deg,#f5faff,#fff 60%);padding:32px 24px}
+.upload-box.drag{background:var(--soft);border-color:var(--blue);box-shadow:0 0 0 4px rgba(21,112,239,.12)}
+.upload-symbol{background:#fff;border:1px solid #b2ddff;color:var(--blue);border-radius:14px}
+.upload-box h3{font-size:17px;font-weight:700}
+.upload-box p{font-size:14px;color:#475467}
+.upload-box .upload-limit{font-size:12px;color:var(--muted)}
+.drop-overlay{background:rgba(16,24,40,.4);backdrop-filter:blur(4px)}
+.drop-overlay>div{border-radius:20px;border-color:var(--blue);color:var(--blue-dark)}
+
+/* Tables and lists */
+.toolbar{padding:16px 22px}
+.search>svg{color:var(--muted);top:12px}
+.search input{font-size:13px;min-height:38px!important;border-radius:12px}
+th{font-size:12px;font-weight:600;color:var(--muted);background:#f9fafb;padding:12px 22px}
+td{font-size:13px;color:#475467;padding:16px 22px;border-bottom-color:#eaecf0}
+tbody tr{transition:background .12s}
+tbody tr:hover{background:#f9fafb}
+.file-name b{font-size:14px;color:var(--ink)}
+.file-name small{font-size:12px}
+.file-icon{border-radius:10px}
+.table-note{font-size:12px;color:var(--muted)}
+.notice-row{background:var(--light);border-color:var(--soft);border-radius:14px;color:var(--deep);font-size:13px}
+.result-row{padding:18px 0}
+.result-title{font-size:14.5px;color:var(--ink);font-weight:700}
+.result-meta{font-size:12px;color:var(--muted)}
+.result-cover,.rule-icon{background:var(--light);border-color:var(--soft);color:var(--blue);border-radius:12px}
+.rule-body>b{font-size:14.5px}
+.rule-note,.rule-check,.rule-approve small{font-size:12.5px;color:var(--muted)}
+.rule-approve,.run-history{background:#f9fafb}
+.run-history,.produce-panel,.production-progress{border-radius:14px}
+.produce-panel,.production-progress{background:#f5faff;border-color:var(--soft);color:#475467}
+.production-steps li.current:before{box-shadow:0 0 0 3px var(--soft)}
+.production-bar,.progress-track{background:#ecebf3}
+.spinner{border-color:var(--soft);border-top-color:var(--blue)}
+
+/* Results */
+.content-grid{gap:18px}
+.content-card{border-radius:18px;box-shadow:var(--shadow-card);transition:transform .15s,box-shadow .15s}
+.content-card:hover{transform:translateY(-2px);box-shadow:0 1px 2px rgba(16,24,40,.04),0 18px 36px -16px rgba(21,94,239,.25)}
+.content-cover{background:linear-gradient(140deg,#eff8ff,#d1e9ff);color:var(--blue)}
+.content-cover>span{font-size:13px}
+.content-title{font-size:14.5px;font-weight:700}
+.content-title:hover{color:var(--blue)}
+.content-card-body>p{font-size:12px}
+.content-card-foot>span{font-size:11.5px;color:var(--muted)}
+.content-card-foot .text-btn{font-size:12.5px}
+.preview-tabs button{font-size:13px}
+.preview-tabs button.active{color:var(--blue-dark);border-color:var(--blue)}
+.preview-side{background:#f9fafb;border-color:var(--line);border-radius:14px}
+.prose p,.prose li{font-size:14px;color:#344054}
+.quiz-item,.flashcard,.slide-preview,.chapter{border-radius:14px}
+
+/* Empty states */
+.empty{color:var(--muted)}
+.empty-icon{background:var(--light);color:var(--blue);border-radius:14px}
+.empty h3{font-size:16px;color:var(--ink)}
+.empty p{font-size:13.5px}
+
+/* Dialogs and toast */
+dialog{border:1px solid var(--line);border-radius:22px;box-shadow:0 30px 80px -20px rgba(16,24,40,.45)}
+dialog::backdrop{background:rgba(16,24,40,.45);backdrop-filter:blur(4px)}
+.modal-head h2{font-size:22px;font-weight:800}
+.modal-head p{font-size:13px}
+.help-step>span{background:var(--light);color:var(--blue-dark);border-radius:10px;font-weight:700}
+.help-step h3{font-size:14.5px}
+.help-step p{font-size:13px}
+.toast{background:var(--ink);border-radius:14px;font-size:13.5px;box-shadow:0 18px 40px -16px rgba(16,24,40,.6)}
+.toast.error{background:#991b1b}
+.progress-orb{background:var(--light);color:var(--blue);border-radius:20px}
+
+/* Sign in: bright blue story panel with dot grid and light glow */
+.login-story{background:linear-gradient(150deg,#175cd3,#1570ef 55%,#2e90fa);color:#fff;padding:48px 64px}
+.login-story::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.16) 1px,transparent 1.2px);background-size:22px 22px;pointer-events:none}
+.login-story::after{right:-260px;top:-240px;bottom:auto;width:720px;height:720px;border:0;background:radial-gradient(closest-side,rgba(255,255,255,.28),rgba(255,255,255,0))}
+.login-story .brand,.login-story .brand b{color:#fff}
+.login-story .brand small{color:#d1e9ff}
+.login-story .brand-mark{background:#fff;color:#1570ef}
+.login-story .lang-switch{background:rgba(255,255,255,.16)}
+.login-story .lang-switch button{color:#fff}
+.login-story .lang-switch button.active{background:#fff;color:var(--blue-dark)}
+.eyebrow{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:999px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.25);color:#fff;font-size:12px;letter-spacing:.04em}
+.eyebrow::before{content:"NEW";padding:2px 8px;border-radius:999px;background:#fff;color:var(--blue-dark);font-size:10.5px;font-weight:800}
+.login-copy h1{font-size:60px;line-height:1.03;font-weight:800;letter-spacing:-.04em;color:#fff}
+.login-copy>p{font-size:17px;line-height:1.6;color:#eff8ff;max-width:520px}
+.login-benefits{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:32px;color:#fff;font-size:14px;font-weight:600}
+.login-benefits>span{flex-direction:column;align-items:flex-start;gap:14px;padding:16px;border-radius:18px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22);line-height:1.35;backdrop-filter:blur(6px)}
+.login-benefits i{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:#fff}
+.login-benefits svg{color:#1570ef}
+.login-footer{font-size:12px;letter-spacing:.06em;color:#d1e9ff}
+.login-panel{background:#fff}
+.login-form-wrap h2{font-size:28px;font-weight:800;letter-spacing:-.035em}
+.login-form-wrap>div>p{font-size:14px;margin:8px 0 20px}
+
+@media(max-width:1120px){
+  .sidebar{width:230px}
+  .workspace-main{margin-left:230px;width:calc(100% - 230px)}
+  .topbar{padding:0 24px}.demo-strip{margin-left:24px;margin-right:24px}.app main{padding-left:24px;padding-right:24px}.app-footer{margin-left:24px;margin-right:24px}
+  .login-copy h1{font-size:46px}.login-story{padding:40px}
+}
+@media(max-width:900px){
+  .login-benefits{grid-template-columns:1fr}
+  .login-copy h1{font-size:36px}
+}
+@media(max-width:700px){
+  .sidebar{width:100%;padding:16px 16px 4px}
+  .sidebar>a>.brand{margin:0 0 14px}
+  .sidebar nav :is(button,a){font-size:12.5px;padding:10px}
+  .sidebar nav :is(button,a).active::before{display:none}
+  .workspace-main{margin:0;width:100%}
+  .topbar{position:static;height:auto;min-height:56px;padding:10px 16px;flex-wrap:wrap}
+  .topbar-right{gap:10px}
+  .topbar-right>span:not(.demo-indicator){display:none}
+  .demo-strip{margin:16px 16px 0;border-radius:16px;font-size:12px}
+  .app main{padding:22px 16px}
+  .app-footer{margin-left:16px;margin-right:16px}
+  .page-head h1{font-size:30px}
+  .page-head p{font-size:14px}
+  .metric strong{font-size:32px}
+  .login-story{padding:28px 20px}
+}
+@media (prefers-reduced-motion:reduce){
+  .btn,.content-card,.sidebar nav :is(button,a){transition:none}
+  .btn.primary:hover,.content-card:hover{transform:none}
+}
+
+/* Skeletons: a soft blue shimmer in the shape of the content that is loading */
+.skel{display:block;border-radius:8px;background:linear-gradient(90deg,#eaf2ff 0%,#f5f9ff 40%,#eaf2ff 80%) 0 0/300% 100%;animation:skel-shimmer 1.4s ease-in-out infinite}
+.skel-stack{display:grid;gap:10px}
+.skel-row{align-items:center}
+.skel-row .result-main{display:grid;gap:9px}
+.skel-cover{width:46px;height:52px;border-radius:12px;flex-shrink:0}
+.skel-pill{width:78px;height:24px;border-radius:999px;flex-shrink:0}
+.skel-block{height:122px;border-radius:0}
+.skel-num{display:block;width:56px;height:38px;margin:10px 0 6px;border-radius:10px}
+.metric:first-child .skel{background:linear-gradient(90deg,rgba(255,255,255,.18) 0%,rgba(255,255,255,.38) 40%,rgba(255,255,255,.18) 80%) 0 0/300% 100%}
+@keyframes skel-shimmer{from{background-position:100% 0}to{background-position:-50% 0}}
+
+/* Each route fades in instead of snapping, which hides the swap between pages */
+.app main{animation:page-in .28s ease-out}
+@keyframes page-in{from{opacity:0;transform:translateY(6px)}}
+@media (prefers-reduced-motion:reduce){.skel,.app main{animation:none}}
diff --git a/tsconfig.app.json b/tsconfig.app.json
new file mode 100644
index 0000000..2877c21
--- /dev/null
+++ b/tsconfig.app.json
@@ -0,0 +1,24 @@
+{
+  "compilerOptions": {
+    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
+    "target": "ES2022",
+    "useDefineForClassFields": true,
+    "lib": ["ES2022", "DOM", "DOM.Iterable"],
+    "module": "ESNext",
+    "types": ["vite/client"],
+    "skipLibCheck": true,
+    "moduleResolution": "bundler",
+    "allowImportingTsExtensions": true,
+    "verbatimModuleSyntax": true,
+    "moduleDetection": "force",
+    "noEmit": true,
+    "jsx": "react-jsx",
+    "strict": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "erasableSyntaxOnly": true,
+    "noFallthroughCasesInSwitch": true,
+    "noUncheckedSideEffectImports": true
+  },
+  "include": ["src"]
+}
diff --git a/tsconfig.json b/tsconfig.json
new file mode 100644
index 0000000..d32ff68
--- /dev/null
+++ b/tsconfig.json
@@ -0,0 +1,4 @@
+{
+  "files": [],
+  "references": [{ "path": "./tsconfig.app.json" }, { "path": "./tsconfig.node.json" }]
+}
diff --git a/tsconfig.node.json b/tsconfig.node.json
new file mode 100644
index 0000000..83be3d5
--- /dev/null
+++ b/tsconfig.node.json
@@ -0,0 +1,19 @@
+{
+  "compilerOptions": {
+    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
+    "target": "ES2023",
+    "lib": ["ES2023"],
+    "module": "ESNext",
+    "types": ["node"],
+    "skipLibCheck": true,
+    "moduleResolution": "bundler",
+    "allowImportingTsExtensions": true,
+    "verbatimModuleSyntax": true,
+    "moduleDetection": "force",
+    "noEmit": true,
+    "strict": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true
+  },
+  "include": ["vite.config.ts"]
+}
diff --git a/vite.config.ts b/vite.config.ts
new file mode 100644
index 0000000..219b0f0
--- /dev/null
+++ b/vite.config.ts
@@ -0,0 +1,34 @@
+import { readFileSync } from 'node:fs'
+import { fileURLToPath } from 'node:url'
+import { defineConfig, loadEnv } from 'vite'
+import react from '@vitejs/plugin-react'
+
+// Clerk publishable keys are public. Default to the engine's own key so Express
+// and learning-lab share one Clerk instance (same users, organizations, credits).
+function engineClerkKey(): string {
+  try {
+    const env = readFileSync(fileURLToPath(new URL('../learning-lab/backend/.env', import.meta.url)), 'utf8')
+    return env.match(/^VITE_CLERK_PUBLISHABLE_KEY=["']?([^"'\s]+)/m)?.[1] ?? ''
+  } catch {
+    return ''
+  }
+}
+
+export default defineConfig(({ mode }) => {
+  const env = loadEnv(mode, process.cwd(), '')
+  const engineUrl = env.ENGINE_URL || 'http://localhost:8000'
+  const clerkKey = env.VITE_CLERK_PUBLISHABLE_KEY || engineClerkKey()
+  // Learning Studio (learning-lab/frontend), where a result opens in Compose for full editing.
+  const studioUrl = env.VITE_STUDIO_URL || 'http://localhost:5173'
+
+  return {
+    plugins: [react()],
+    define: {
+      'import.meta.env.VITE_CLERK_PUBLISHABLE_KEY': JSON.stringify(clerkKey),
+      'import.meta.env.VITE_STUDIO_URL': JSON.stringify(studioUrl),
+    },
+    // Same-origin /api keeps the engine free of CORS setup, as in production behind one domain.
+    server: { port: 5174, proxy: { '/api': { target: engineUrl, changeOrigin: true } } },
+    preview: { port: 5174, proxy: { '/api': { target: engineUrl, changeOrigin: true } } },
+  }
+})