@cyber-dash-tech/revela 0.19.8 → 0.20.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +37 -54
- package/README.zh-CN.md +36 -53
- package/designs/lucent/DESIGN.md +2 -0
- package/designs/lucent/design.css +43 -7
- package/designs/lucent-dark/DESIGN.md +2 -0
- package/designs/lucent-dark/design.css +55 -14
- package/designs/monet/DESIGN.md +2 -0
- package/designs/monet/design.css +79 -13
- package/designs/starter/DESIGN.md +2 -0
- package/designs/starter/design.css +51 -12
- package/designs/summit/DESIGN.md +2 -0
- package/designs/summit/design.css +75 -11
- package/lib/deck-html/foundation.ts +16 -2
- package/lib/design/designs.ts +13 -1
- package/lib/page-templates/built-in-preview.html +102 -41
- package/lib/page-templates/render.ts +123 -8
- package/lib/page-templates/templates/free.ts +3 -0
- package/lib/page-templates/templates/index.ts +2 -0
- package/lib/page-templates/templates/team.ts +3 -0
- package/lib/page-templates/vocabulary.ts +15 -0
- package/lib/runtime/index.ts +95 -3
- package/lib/runtime/open-deck.ts +190 -0
- package/package.json +1 -1
- package/plugins/revela/.codex-plugin/plugin.json +4 -3
- package/plugins/revela/mcp/revela-server.ts +17 -6
- package/plugins/revela/skills/revela/SKILL.md +1 -1
- package/plugins/revela/skills/revela-design/SKILL.md +5 -4
- package/plugins/revela/skills/revela-helper/SKILL.md +1 -1
- package/plugins/revela/skills/revela-review/SKILL.md +57 -0
package/README.md
CHANGED
|
@@ -2,30 +2,31 @@
|
|
|
2
2
|
|
|
3
3
|
**English** | [中文](README.zh-CN.md)
|
|
4
4
|
|
|
5
|
-
[](https://www.npmjs.com/package/@cyber-dash-tech/revela) [](LICENSE) [](https://www.npmjs.com/package/@cyber-dash-tech/revela) [](LICENSE) [](tests/) [](https://github.com/openai/codex) [](https://bun.sh)
|
|
6
6
|
|
|
7
7
|
<p align="center">
|
|
8
8
|
<img src="assets/img/logo-wordmark.png" alt="Revela" width="320" />
|
|
9
9
|
</p>
|
|
10
10
|
|
|
11
|
-
Revela is a Codex plugin for turning source materials, research, data, and intent into trusted, traceable, presentation-ready decision
|
|
11
|
+
Revela is a Codex plugin for turning source materials, research, data, and intent into trusted, traceable, presentation-ready decision decks.
|
|
12
12
|
|
|
13
|
-
In
|
|
13
|
+
In a local workspace, Revela helps a Codex agent clarify the ask, organize source material, write `deck-plan.md`, render `decks/*.html`, open the deck in Codex Browser for review, and export PDF/PPTX/PNG.
|
|
14
14
|
|
|
15
15
|
## Install
|
|
16
16
|
|
|
17
17
|
### Codex
|
|
18
18
|
|
|
19
|
+
This section is for a Codex agent helping a user install or refresh Revela in an environment where Codex plugin commands are available.
|
|
20
|
+
|
|
19
21
|
Requirements:
|
|
20
22
|
|
|
21
|
-
-
|
|
22
|
-
-
|
|
23
|
+
- Codex is installed and can install plugins from a Git marketplace.
|
|
24
|
+
- The environment can run `bun`; the Revela plugin starts its MCP server with `bun ./mcp/revela-server.ts` from the installed plugin cache.
|
|
23
25
|
|
|
24
26
|
Optional preflight:
|
|
25
27
|
|
|
26
28
|
```bash
|
|
27
|
-
codex --
|
|
28
|
-
codex exec --help
|
|
29
|
+
codex plugin --help
|
|
29
30
|
bun --version
|
|
30
31
|
```
|
|
31
32
|
|
|
@@ -36,20 +37,20 @@ sudo chown -R "$(id -u):$(id -g)" ~/.npm
|
|
|
36
37
|
npm_config_cache=/tmp/revela-npm-cache bun run smoke:mcp-pack
|
|
37
38
|
```
|
|
38
39
|
|
|
39
|
-
Install Revela
|
|
40
|
+
Install the latest Revela plugin from the Git marketplace:
|
|
40
41
|
|
|
41
42
|
```bash
|
|
42
|
-
codex plugin marketplace add https://github.com/cyber-dash-tech/revela
|
|
43
|
+
codex plugin marketplace add https://github.com/cyber-dash-tech/revela
|
|
43
44
|
codex plugin add revela@revela
|
|
44
45
|
```
|
|
45
46
|
|
|
46
|
-
The Git marketplace install provides the Codex plugin shell, skills, hooks, and MCP configuration. When Codex starts
|
|
47
|
+
The Git marketplace install provides the Codex plugin shell, skills, hooks, and MCP configuration. When Codex starts Revela, it runs `bun ./mcp/revela-server.ts` from the installed plugin cache and resolves the marketplace runtime.
|
|
47
48
|
|
|
48
49
|
You do not need to run `bun install` inside the Codex marketplace clone.
|
|
49
50
|
|
|
50
51
|
Start a new Codex thread after installing so Codex loads the Revela skills, MCP tools, and hooks.
|
|
51
52
|
|
|
52
|
-
Codex uses
|
|
53
|
+
Codex uses nine Revela skills: `revela` for routing the next workflow step, `revela-spec` for writing root-level `spec.md`, `revela-helper` for status and active design/domain, `revela-design` for custom design creation/validation/activation, `revela-domain` for custom narrative domain creation/validation/activation, `revela-research` for material review, saved findings, and the `deck-plan.md` handoff, `revela-make-deck` for rendering HTML decks, `revela-review` for opening HTML decks directly in Codex Browser, and `revela-export` for PDF/PPTX/PNG.
|
|
53
54
|
|
|
54
55
|
For release-aligned local validation, run `bun run smoke:mcp-pack`. It packs the current checkout to a temporary npm tarball, extracts it, and starts the MCP server through the packaged Codex plugin launcher path without requiring a registry publish.
|
|
55
56
|
|
|
@@ -57,7 +58,7 @@ For release-aligned local validation, run `bun run smoke:mcp-pack`. It packs the
|
|
|
57
58
|
|
|
58
59
|
In Codex, ask Revela to check the current runtime version; the plugin calls `revela_doctor` and reports the running `version`.
|
|
59
60
|
|
|
60
|
-
|
|
61
|
+
To pin a specific release, reinstall from that tag:
|
|
61
62
|
|
|
62
63
|
```bash
|
|
63
64
|
codex plugin remove revela@revela
|
|
@@ -121,70 +122,52 @@ Revela includes built-in deck designs. Design previews are generated from the bu
|
|
|
121
122
|
|
|
122
123
|
To switch designs in Codex, ask:
|
|
123
124
|
|
|
124
|
-
>
|
|
125
|
+
> Use Revela to switch to the summit design.
|
|
126
|
+
|
|
127
|
+
In Codex, ask Revela to list or switch designs; the plugin uses the active design when making new decks. For an existing deck, name the file so Revela can refresh that deck's local design snapshot without rewriting slide content:
|
|
125
128
|
|
|
126
|
-
|
|
129
|
+
> Use Revela to switch @decks/<file>.html to the summit design.
|
|
127
130
|
|
|
128
131
|
## Domains
|
|
129
132
|
|
|
130
133
|
Domains add topic-specific communication guidance, such as consulting, product, or investor communication. Use them when you want Revela to adapt deck framing to a specific context.
|
|
131
134
|
|
|
132
|
-
>
|
|
135
|
+
> Use Revela to list available domains.
|
|
133
136
|
|
|
134
|
-
In Codex, ask Revela to list or switch domains; the active domain guides
|
|
137
|
+
In Codex, ask Revela to list or switch domains; the active domain guides spec writing, planning, and deck framing.
|
|
135
138
|
|
|
136
139
|
## Quick Start
|
|
137
140
|
|
|
138
|
-
Use these prompts in Codex from the workspace that contains
|
|
139
|
-
|
|
140
|
-
1. Choose the narrative domain before authoring so Revela frames the audience, decision, risks, and objections for your context.
|
|
141
|
-
|
|
142
|
-
> [$revela:revela](/Users/mengdigao/.codex/plugins/cache/revela/revela/0.19.8/skills/revela/SKILL.md), use consulting as the domain.
|
|
143
|
-
|
|
144
|
-
2. Choose the deck design before rendering so generated artifacts use the intended visual language.
|
|
145
|
-
|
|
146
|
-
> [$revela:revela](/Users/mengdigao/.codex/plugins/cache/revela/revela/0.19.8/skills/revela/SKILL.md), use summit as the design.
|
|
147
|
-
|
|
148
|
-
3. Create a custom design when you want a different visual direction.
|
|
149
|
-
|
|
150
|
-
> [$revela:revela](/Users/mengdigao/.codex/plugins/cache/revela/revela/0.19.8/skills/revela/SKILL.md), create a new design named neon-finance with a crisp financial-dashboard style: dark surfaces, precise grids, and bright green accents.
|
|
151
|
-
|
|
152
|
-
Revela may ask for references or constraints, then creates a workspace draft with `DESIGN.md`, `design.css`, and any local `assets/**`. It generates a preview from the built-in page-template fixture plus that CSS so you can review cover, agenda, timelines, charts, tables, cards, and visual slots before installing. When it is ready, switch to it:
|
|
153
|
-
|
|
154
|
-
> [$revela:revela](/Users/mengdigao/.codex/plugins/cache/revela/revela/0.19.8/skills/revela/SKILL.md), use neon-finance as the design.
|
|
155
|
-
|
|
156
|
-
4. Initialize local material intake. Init scans, extracts, and reviews workspace sources; it does not create a Narrative Vault.
|
|
157
|
-
|
|
158
|
-
> [$revela:revela](/Users/mengdigao/.codex/plugins/cache/revela/revela/0.19.8/skills/revela/SKILL.md), help me init this workspace from the local materials.
|
|
159
|
-
|
|
160
|
-
5. Research source-linked deck inputs and save findings.
|
|
141
|
+
Use these prompts in Codex from the workspace that contains the user's source materials.
|
|
161
142
|
|
|
162
|
-
|
|
143
|
+
1. **Spec**: capture the ask, audience, output, constraints, language, design preference, and acceptance criteria in `spec.md`.
|
|
163
144
|
|
|
164
|
-
|
|
145
|
+
> Use Revela to turn this goal into a spec.md for a decision deck. Inspect the workspace, ask only for missing high-impact details, and recommend the next step.
|
|
165
146
|
|
|
166
|
-
|
|
147
|
+
2. **Plan**: review the materials, save source-linked findings, and produce `deck-plan.md`.
|
|
167
148
|
|
|
168
|
-
|
|
149
|
+
> Use Revela to review the materials, save useful findings, and produce deck-plan.md for this deck.
|
|
169
150
|
|
|
170
|
-
|
|
151
|
+
3. **Render Deck**: generate `decks/*.html` from the plan.
|
|
171
152
|
|
|
172
|
-
|
|
153
|
+
> Use Revela to render the deck from deck-plan.md.
|
|
173
154
|
|
|
174
|
-
|
|
155
|
+
4. **Review**: open the HTML deck directly in Codex Browser. Replace `@decks/<file>.html` with the actual generated file path.
|
|
175
156
|
|
|
176
|
-
|
|
157
|
+
> Use Revela to review @decks/<file>.html in Codex Browser.
|
|
177
158
|
|
|
178
|
-
|
|
159
|
+
Use Review to inspect copy, argument flow, hierarchy, spacing, charts, tables, visuals, and export readiness. If you want a diagnostic report, ask Revela to diagnose or QA the same deck file.
|
|
179
160
|
|
|
180
|
-
|
|
161
|
+
5. **Export**: export the reviewed HTML deck. Replace `@decks/<file>.html` with the actual generated file path.
|
|
181
162
|
|
|
182
|
-
>
|
|
163
|
+
> Use Revela to export @decks/<file>.html as PDF.
|
|
183
164
|
|
|
184
|
-
|
|
165
|
+
> Use Revela to export @decks/<file>.html as editable PPTX.
|
|
185
166
|
|
|
186
|
-
>
|
|
167
|
+
> Use Revela to export @decks/<file>.html as per-slide PNG files.
|
|
187
168
|
|
|
188
|
-
|
|
169
|
+
Optional setup:
|
|
189
170
|
|
|
190
|
-
|
|
171
|
+
- Use Revela to switch to the consulting domain.
|
|
172
|
+
- Use Revela to switch to the summit design.
|
|
173
|
+
- Use Revela to create a custom design named neon-finance with a crisp financial-dashboard style.
|
package/README.zh-CN.md
CHANGED
|
@@ -2,30 +2,31 @@
|
|
|
2
2
|
|
|
3
3
|
[English](README.md) | **中文**
|
|
4
4
|
|
|
5
|
-
[](https://www.npmjs.com/package/@cyber-dash-tech/revela) [](LICENSE) [](https://www.npmjs.com/package/@cyber-dash-tech/revela) [](LICENSE) [](tests/) [](https://github.com/openai/codex) [](https://bun.sh)
|
|
6
6
|
|
|
7
7
|
<p align="center">
|
|
8
8
|
<img src="assets/img/logo-wordmark.png" alt="Revela" width="320" />
|
|
9
9
|
</p>
|
|
10
10
|
|
|
11
|
-
Revela 是 Codex plugin，用来把来源材料、调研、数据和用户意图转成可信、可追踪、可直接用于决策沟通的 deck
|
|
11
|
+
Revela 是 Codex plugin，用来把来源材料、调研、数据和用户意图转成可信、可追踪、可直接用于决策沟通的 deck。
|
|
12
12
|
|
|
13
|
-
|
|
13
|
+
在本地 workspace 中，Revela 帮 Codex agent 明确目标、整理材料、写 `deck-plan.md`、生成 `decks/*.html`、在 Codex Browser 中打开 deck 供用户审阅，并导出 PDF/PPTX/PNG。
|
|
14
14
|
|
|
15
15
|
## 安装
|
|
16
16
|
|
|
17
17
|
### Codex
|
|
18
18
|
|
|
19
|
+
这部分是给 Codex agent 看的安装说明：用户已经在 Codex 环境中，agent 负责安装或引导安装 Revela plugin。
|
|
20
|
+
|
|
19
21
|
环境要求：
|
|
20
22
|
|
|
21
|
-
-
|
|
22
|
-
-
|
|
23
|
+
- Codex 可以从 Git marketplace 安装 plugin。
|
|
24
|
+
- 环境中可以执行 `bun`；Revela plugin 会从已安装的 plugin cache 中运行 `bun ./mcp/revela-server.ts` 来启动 MCP server。
|
|
23
25
|
|
|
24
26
|
可选的安装前检查：
|
|
25
27
|
|
|
26
28
|
```bash
|
|
27
|
-
codex --
|
|
28
|
-
codex exec --help
|
|
29
|
+
codex plugin --help
|
|
29
30
|
bun --version
|
|
30
31
|
```
|
|
31
32
|
|
|
@@ -36,20 +37,20 @@ sudo chown -R "$(id -u):$(id -g)" ~/.npm
|
|
|
36
37
|
npm_config_cache=/tmp/revela-npm-cache bun run smoke:mcp-pack
|
|
37
38
|
```
|
|
38
39
|
|
|
39
|
-
|
|
40
|
+
从 Codex Git marketplace 安装最新版 Revela：
|
|
40
41
|
|
|
41
42
|
```bash
|
|
42
|
-
codex plugin marketplace add https://github.com/cyber-dash-tech/revela
|
|
43
|
+
codex plugin marketplace add https://github.com/cyber-dash-tech/revela
|
|
43
44
|
codex plugin add revela@revela
|
|
44
45
|
```
|
|
45
46
|
|
|
46
|
-
Git marketplace 安装的是 Codex plugin 壳、skills、hooks 和 MCP 配置。Codex 启动 Revela
|
|
47
|
+
Git marketplace 安装的是 Codex plugin 壳、skills、hooks 和 MCP 配置。Codex 启动 Revela 时，会从已安装的 plugin cache 中运行 `bun ./mcp/revela-server.ts`，并解析 marketplace runtime。
|
|
47
48
|
|
|
48
49
|
不需要在 Codex marketplace clone 里运行 `bun install`。
|
|
49
50
|
|
|
50
51
|
安装后开启一个新的 Codex thread，让 Codex 加载 Revela 的 skills、MCP tools 和 hooks。
|
|
51
52
|
|
|
52
|
-
Codex
|
|
53
|
+
Codex 使用九个 Revela skills：`revela` 路由下一步 workflow，`revela-spec` 写根目录 `spec.md`，`revela-helper` 查看状态和 active design/domain，`revela-design` 创建、验证、激活 custom design，`revela-domain` 创建、验证、激活 custom narrative domain，`revela-research` 审阅材料、保存 findings、交付 `deck-plan.md`，`revela-make-deck` 生成 HTML deck，`revela-review` 在 Codex Browser 中直接打开 HTML deck，`revela-export` 导出 PDF/PPTX/PNG。
|
|
53
54
|
|
|
54
55
|
如果要按发布路径做本地验证，运行 `bun run smoke:mcp-pack`。它会把当前 checkout 打成临时 npm tarball，解包后通过打包出的 Codex plugin launcher 路径启动 MCP server，不需要先发布到 registry。
|
|
55
56
|
|
|
@@ -121,70 +122,52 @@ Revela 内置多个 deck design。Design preview 由内置 page-template preview
|
|
|
121
122
|
|
|
122
123
|
在 Codex 中切换 design，可以这样问：
|
|
123
124
|
|
|
124
|
-
>
|
|
125
|
+
> 使用 Revela 切换到 summit design。
|
|
126
|
+
|
|
127
|
+
在 Codex 中，可以直接让 Revela 列出或切换 design；新生成的 deck 会使用 active design。已有 deck 要带上文件路径，这样 Revela 会刷新该 deck 的本地 design snapshot，不重写 slide 内容：
|
|
125
128
|
|
|
126
|
-
|
|
129
|
+
> 使用 Revela 将 @decks/<file>.html 切换到 summit design。
|
|
127
130
|
|
|
128
131
|
## Domains
|
|
129
132
|
|
|
130
133
|
Domain 提供特定场景的沟通 guidance，例如 consulting、product 或 investor communication。需要让 Revela 按具体沟通场景调整 deck framing 时使用。
|
|
131
134
|
|
|
132
|
-
>
|
|
135
|
+
> 使用 Revela 列出 available domains。
|
|
133
136
|
|
|
134
|
-
在 Codex 中，可以直接让 Revela 列出或切换 domain；active domain 会用于
|
|
137
|
+
在 Codex 中，可以直接让 Revela 列出或切换 domain；active domain 会用于 spec、plan 和 deck framing。
|
|
135
138
|
|
|
136
139
|
## Quick Start
|
|
137
140
|
|
|
138
|
-
在包含来源材料的 workspace 中打开 Codex
|
|
139
|
-
|
|
140
|
-
1. 先选择 domain，让 Revela 按你的沟通场景 framing 受众、决策、风险和潜在质疑。
|
|
141
|
-
|
|
142
|
-
> [$revela:revela](/Users/mengdigao/.codex/plugins/cache/revela/revela/0.19.8/skills/revela/SKILL.md)，use consulting as domain.
|
|
143
|
-
|
|
144
|
-
2. 再选择 design，让后续生成的 deck 使用指定视觉风格。
|
|
145
|
-
|
|
146
|
-
> [$revela:revela](/Users/mengdigao/.codex/plugins/cache/revela/revela/0.19.8/skills/revela/SKILL.md)，use summit as design.
|
|
147
|
-
|
|
148
|
-
3. 如果需要不同的视觉方向，可以创建一个自定义 design。
|
|
149
|
-
|
|
150
|
-
> [$revela:revela](/Users/mengdigao/.codex/plugins/cache/revela/revela/0.19.8/skills/revela/SKILL.md)，创建一个名为 neon-finance 的新 design：金融仪表盘风格，深色界面、精密网格、亮绿色重点色。
|
|
151
|
-
|
|
152
|
-
Revela 可能会继续询问参考图、风格约束或禁忌项，然后在 workspace draft 中创建 `DESIGN.md`、`design.css` 和需要的本地 `assets/**`。它会用内置 page-template fixture 加上这份 CSS 生成 preview，让你在 install 前先检查 cover、agenda、timeline、chart、table、card 和 visual slot。创建完成后再切换使用：
|
|
153
|
-
|
|
154
|
-
> [$revela:revela](/Users/mengdigao/.codex/plugins/cache/revela/revela/0.19.8/skills/revela/SKILL.md)，使用 neon-finance 作为 design。
|
|
155
|
-
|
|
156
|
-
4. 初始化本地 material intake。Init 会扫描、抽取并审阅 workspace source；它不会创建 Narrative Vault。
|
|
157
|
-
|
|
158
|
-
> [$revela:revela](/Users/mengdigao/.codex/plugins/cache/revela/revela/0.19.8/skills/revela/SKILL.md)，帮我 init 这个 workspace，先读本地材料。
|
|
159
|
-
|
|
160
|
-
5. 针对 deck 所需输入做 research，并保存带来源的 findings。
|
|
141
|
+
在包含来源材料的 workspace 中打开 Codex，然后按下面流程推进。
|
|
161
142
|
|
|
162
|
-
|
|
143
|
+
1. **Spec**：确认目标、受众、输出形式、约束、语言、设计偏好和验收标准，并写入 `spec.md`。
|
|
163
144
|
|
|
164
|
-
|
|
145
|
+
> 使用 Revela 把这个目标整理成用于决策 deck 的 spec.md。先检查 workspace，只询问真正影响结果的缺失信息，并推荐下一步。
|
|
165
146
|
|
|
166
|
-
|
|
147
|
+
2. **Plan**：审阅材料、保存带来源的 findings，并产出 `deck-plan.md`。
|
|
167
148
|
|
|
168
|
-
|
|
149
|
+
> 使用 Revela 审阅材料，保存有用 findings，并为这个 deck 生成 deck-plan.md。
|
|
169
150
|
|
|
170
|
-
|
|
151
|
+
3. **Render Deck**：基于 `deck-plan.md` 生成 `decks/*.html`。
|
|
171
152
|
|
|
172
|
-
|
|
153
|
+
> 使用 Revela 根据 deck-plan.md render deck。
|
|
173
154
|
|
|
174
|
-
|
|
155
|
+
4. **Review**：在 Codex Browser 中直接打开 HTML deck。把 `@decks/<file>.html` 替换为实际生成的文件路径。
|
|
175
156
|
|
|
176
|
-
|
|
157
|
+
> 使用 Revela 在 Codex Browser 中 review @decks/<file>.html。
|
|
177
158
|
|
|
178
|
-
|
|
159
|
+
Review 时检查文案、论证节奏、层级、间距、图表、表格、视觉和导出前问题。如果需要诊断报告，再让 Revela 对同一个 deck 文件做 diagnose 或 QA。
|
|
179
160
|
|
|
180
|
-
|
|
161
|
+
5. **Export**：导出审阅后的 HTML deck。把 `@decks/<file>.html` 替换为实际生成的文件路径。
|
|
181
162
|
|
|
182
|
-
>
|
|
163
|
+
> 使用 Revela 导出 @decks/<file>.html 为 PDF。
|
|
183
164
|
|
|
184
|
-
|
|
165
|
+
> 使用 Revela 导出 @decks/<file>.html 为可编辑 PPTX。
|
|
185
166
|
|
|
186
|
-
>
|
|
167
|
+
> 使用 Revela 导出 @decks/<file>.html 为逐页 PNG。
|
|
187
168
|
|
|
188
|
-
|
|
169
|
+
可选前置设置：
|
|
189
170
|
|
|
190
|
-
|
|
171
|
+
- 使用 Revela 切换到 consulting domain。
|
|
172
|
+
- 使用 Revela 切换到 summit design。
|
|
173
|
+
- 使用 Revela 创建一个名为 neon-finance 的 custom design，风格是金融仪表盘、深色界面、精密网格和亮绿色重点色。
|
package/designs/lucent/DESIGN.md
CHANGED
|
@@ -260,11 +260,13 @@ Lucent skins Revela built-in page templates without owning their semantic struct
|
|
|
260
260
|
- `cover`, `section-divider`, `closing`: use full-bleed hero treatment with Lucent package assets.
|
|
261
261
|
- `agenda`, `executive-summary`, `problem-context`, `key-message-evidence`, `claim-supporting-visual`: use report-story/card-grid language with quiet surfaces.
|
|
262
262
|
- Agenda typography follows design tokens: title and numbers use `--font-display`; item labels and footer use `--font-body`.
|
|
263
|
+
- `team`: use luminous portrait-led member cards with one photo, name, role, two concise highlights, and one education line. Prefer 3-4 members per page.
|
|
263
264
|
- `metric-highlight`, `chart-takeaways`, `table`, `table-comparison`: use data-forward Lucent panels with explicit interpretation regions.
|
|
264
265
|
- Text panels use explicit variants: `template-text-panel--clear` is transparent with no border or background, `template-text-panel--plain` is theme-neutral, and `template-text-panel--color` is the multicolor emphasis treatment used by chart and timeline reading panels.
|
|
265
266
|
- `milestone`: map to the horizontal roadmap visual system. Dots remain milestone anchors inside each milestone item; do not absolutely position detached decorative dots.
|
|
266
267
|
- `timeline`: map to the vertical timeline visual system. Dots remain event anchors inside each timeline item; do not absolutely position detached decorative dots.
|
|
267
268
|
- `process-steps`, `recommendation-decision`, `risks-tradeoffs`: use recommendation and steps surfaces with no nested card-in-card framing.
|
|
269
|
+
- `free`: use a plain title plus one semantic placeholder region; the agent may later replace that region with multiple images, charts, text blocks, tables, or mixed content.
|
|
268
270
|
|
|
269
271
|
<!-- @design:page-templates:end -->
|
|
270
272
|
|
|
@@ -99,24 +99,24 @@ body { margin: 0; background: var(--bg-frame, #07111f); color: var(--text-primar
|
|
|
99
99
|
linear-gradient(135deg, #07111f, #101a2b 62%, #243a73);
|
|
100
100
|
}
|
|
101
101
|
|
|
102
|
-
.template-slide[data-
|
|
102
|
+
.template-slide[data-template="cover"] .slide-canvas {
|
|
103
103
|
background:
|
|
104
104
|
linear-gradient(90deg, rgba(7,17,31,0.82), rgba(7,17,31,0.42) 52%, rgba(7,17,31,0.24)),
|
|
105
105
|
url("./assets/cover-background.jpg") center center / cover no-repeat;
|
|
106
106
|
}
|
|
107
|
-
.template-slide[data-
|
|
107
|
+
.template-slide[data-template="agenda"] .slide-canvas {
|
|
108
108
|
background:
|
|
109
109
|
linear-gradient(90deg, rgba(7,17,31,0.86), rgba(7,17,31,0.58) 52%, rgba(7,17,31,0.32)),
|
|
110
110
|
url("./assets/cover-background.jpg") center center / cover no-repeat;
|
|
111
111
|
}
|
|
112
|
-
.template-slide[data-
|
|
112
|
+
.template-slide[data-template="section-divider"] .slide-canvas {
|
|
113
113
|
background:
|
|
114
114
|
linear-gradient(90deg, rgba(7,17,31,0.86), rgba(16,26,43,0.62) 58%, rgba(36,58,115,0.36)),
|
|
115
115
|
url("./assets/cover-background.jpg") center center / cover no-repeat;
|
|
116
116
|
}
|
|
117
117
|
.template-slide[data-template="closing"] .slide-canvas { background: linear-gradient(135deg, #07111f, #315eea 58%, #18a8d8); }
|
|
118
118
|
|
|
119
|
-
.template-slide[data-
|
|
119
|
+
.template-slide[data-template="closing"] .slide-canvas {
|
|
120
120
|
background:
|
|
121
121
|
linear-gradient(90deg, rgba(7,17,31,0.82), rgba(49,94,234,0.42) 58%, rgba(24,168,216,0.24)),
|
|
122
122
|
url("./assets/closing-background.jpg") center center / cover no-repeat;
|
|
@@ -162,10 +162,13 @@ body { margin: 0; background: var(--bg-frame, #07111f); color: var(--text-primar
|
|
|
162
162
|
.text-panel-formula-fallback { display: block; white-space: normal; overflow-wrap: anywhere; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 0.82em; line-height: 1.35; color: inherit; }
|
|
163
163
|
.text-panel-formula-caption { margin: 0; font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-muted); }
|
|
164
164
|
.template-chart-takeaway-list { display: grid; gap: 22px; width: 100%; }
|
|
165
|
-
.template-chart-takeaway-item { display: grid; gap: 7px; padding-top: 18px; border-top: 1px solid
|
|
165
|
+
.template-chart-takeaway-item { display: grid; gap: 7px; padding-top: 18px; border-top: 1px solid var(--line); }
|
|
166
|
+
.template-text-panel--color .template-chart-takeaway-item { border-top-color: rgba(255,255,255,0.24); }
|
|
166
167
|
.template-chart-takeaway-item:first-child { padding-top: 0; border-top: 0; }
|
|
167
|
-
.template-chart-takeaway-item h3 { margin: 0; font-size: 25px; line-height: 1.24; color:
|
|
168
|
-
.template-chart-takeaway-item
|
|
168
|
+
.template-chart-takeaway-item h3 { margin: 0; font-size: 25px; line-height: 1.24; color: var(--text-primary); }
|
|
169
|
+
.template-text-panel--color .template-chart-takeaway-item h3 { color: white; }
|
|
170
|
+
.template-chart-takeaway-item p { margin: 0; font-size: 20px; line-height: 1.46; color: var(--text-secondary); }
|
|
171
|
+
.template-text-panel--color .template-chart-takeaway-item p { color: rgba(255,255,255,0.78); }
|
|
169
172
|
.template-bar { flex: 1; background: linear-gradient(180deg, var(--accent-primary), var(--accent-cyan)); min-height: 80px; }
|
|
170
173
|
.template-table-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 34px; height: 100%; align-items: stretch; }
|
|
171
174
|
.template-table-layout .template-side-panel { grid-column: 1; grid-row: 1; }
|
|
@@ -223,6 +226,25 @@ body { margin: 0; background: var(--bg-frame, #07111f); color: var(--text-primar
|
|
|
223
226
|
.template-timeline--vertical .template-timeline-item:nth-child(even) .template-timeline-copy { grid-column: 3; text-align: left; align-self: center; }
|
|
224
227
|
.template-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; }
|
|
225
228
|
.template-step-number { font-size: 48px; color: var(--accent-primary); font-weight: 800; margin-bottom: 30px; }
|
|
229
|
+
.template-team-grid { height: 100%; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; align-items: stretch; }
|
|
230
|
+
.template-team-card { min-width: 0; min-height: 0; display: grid; grid-template-rows: 330px minmax(0, 1fr); overflow: hidden; background: rgba(255,255,255,0.86); border: 1px solid var(--line); border-radius: var(--surface-radius); box-shadow: 0 18px 44px var(--shadow-soft); }
|
|
231
|
+
.template-team-photo { margin: 0; width: 100%; height: 100%; overflow: hidden; background: linear-gradient(135deg, var(--accent-soft), rgba(24,168,216,0.16)); display: grid; place-items: center; }
|
|
232
|
+
.template-team-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
|
|
233
|
+
.template-team-photo span { font-family: var(--font-display); font-size: 72px; line-height: 1; color: var(--accent-primary); font-weight: 800; }
|
|
234
|
+
.template-team-copy { min-height: 0; display: flex; flex-direction: column; gap: 12px; padding: 26px; }
|
|
235
|
+
.template-team-name { margin: 0; font-size: 30px; line-height: 1.18; color: var(--text-primary); padding-bottom: 3px; overflow: visible; }
|
|
236
|
+
.template-team-role { margin: 0; font-size: 15px; line-height: 1.35; letter-spacing: 0.1em; text-transform: uppercase; color: var(--accent-primary); font-weight: 800; }
|
|
237
|
+
.template-team-highlights { margin: 4px 0 0; padding: 0; list-style: none; display: grid; gap: 9px; }
|
|
238
|
+
.template-team-highlights li { position: relative; padding-left: 18px; font-size: 17px; line-height: 1.36; color: var(--text-secondary); }
|
|
239
|
+
.template-team-highlights li::before { content: ""; position: absolute; left: 0; top: 9px; width: 6px; height: 6px; background: var(--accent-primary); border-radius: 999px; }
|
|
240
|
+
.template-team-education { margin: auto 0 0; padding-top: 14px; border-top: 1px solid var(--line); font-size: 14px; line-height: 1.35; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-muted); font-weight: 800; }
|
|
241
|
+
.template-free-stage { height: 100%; display: grid; grid-template-columns: minmax(0, 1fr); }
|
|
242
|
+
.template-free-placeholder { min-width: 0; min-height: 0; display: flex; flex-direction: column; justify-content: flex-end; gap: 16px; padding: 42px; border: 1px dashed var(--line-strong); border-radius: var(--surface-radius); background: linear-gradient(135deg, rgba(49,94,234,0.06), rgba(24,168,216,0.07)); overflow: hidden; }
|
|
243
|
+
.template-free-placeholder-label { align-self: flex-start; font-size: 13px; line-height: 1; letter-spacing: 0.14em; text-transform: uppercase; color: var(--accent-primary); font-weight: 800; }
|
|
244
|
+
.template-free-placeholder h2 { margin: 0; font-size: 38px; line-height: 1.18; color: var(--text-primary); padding-bottom: 4px; overflow: visible; }
|
|
245
|
+
.template-free-placeholder p { margin: 0; max-width: 980px; font-size: 23px; line-height: 1.42; color: var(--text-secondary); }
|
|
246
|
+
.template-free-placeholder-hints { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 6px; }
|
|
247
|
+
.template-free-placeholder-hint { display: inline-flex; align-items: center; min-height: 32px; padding: 7px 12px; border: 1px solid var(--line); border-radius: 999px; font-size: 13px; line-height: 1; letter-spacing: 0.1em; text-transform: uppercase; color: var(--text-muted); font-weight: 800; background: rgba(255,255,255,0.58); }
|
|
226
248
|
.template-image-card { width: 100%; margin: 18px 0 0; display: grid; gap: 8px; }
|
|
227
249
|
.template-image-frame { width: 100%; height: 128px; border-radius: var(--surface-radius); overflow: hidden; background: var(--surface-tint, #f1f6fc); border: 1px solid var(--line); }
|
|
228
250
|
.template-image-frame img { display: block; width: 100%; height: 100%; object-fit: cover; }
|
|
@@ -302,6 +324,20 @@ body { margin: 0; background: var(--bg-frame, #07111f); color: var(--text-primar
|
|
|
302
324
|
.template-frame--catalog .template-timeline-copy p:last-child { font-size: 15px; line-height: 1.24; }
|
|
303
325
|
.template-frame--catalog .template-steps { gap: 16px; }
|
|
304
326
|
.template-frame--catalog .template-step-number { font-size: 40px; margin-bottom: 20px; }
|
|
327
|
+
.template-frame--catalog .template-team-grid { gap: 16px; }
|
|
328
|
+
.template-frame--catalog .template-team-card { grid-template-rows: 230px minmax(0, 1fr); }
|
|
329
|
+
.template-frame--catalog .template-team-copy { padding: 18px; gap: 8px; }
|
|
330
|
+
.template-frame--catalog .template-team-name { font-size: 22px; line-height: 1.14; }
|
|
331
|
+
.template-frame--catalog .template-team-role { font-size: 11px; line-height: 1.25; }
|
|
332
|
+
.template-frame--catalog .template-team-highlights { gap: 6px; }
|
|
333
|
+
.template-frame--catalog .template-team-highlights li { font-size: 13px; line-height: 1.25; padding-left: 14px; }
|
|
334
|
+
.template-frame--catalog .template-team-highlights li::before { top: 7px; width: 5px; height: 5px; }
|
|
335
|
+
.template-frame--catalog .template-team-education { font-size: 10px; line-height: 1.25; padding-top: 9px; }
|
|
336
|
+
.template-frame--catalog .template-free-placeholder { padding: 28px; gap: 10px; }
|
|
337
|
+
.template-frame--catalog .template-free-placeholder-label { font-size: 10px; }
|
|
338
|
+
.template-frame--catalog .template-free-placeholder h2 { font-size: 28px; line-height: 1.16; }
|
|
339
|
+
.template-frame--catalog .template-free-placeholder p { font-size: 17px; line-height: 1.3; }
|
|
340
|
+
.template-frame--catalog .template-free-placeholder-hint { min-height: 26px; padding: 6px 9px; font-size: 10px; }
|
|
305
341
|
.template-frame--catalog .template-image-frame { height: 86px; }
|
|
306
342
|
.template-frame--catalog .template-image-caption { font-size: 11px; }
|
|
307
343
|
.template-frame--catalog .template-visual-placeholder-frame { height: 110px; }
|
|
@@ -260,11 +260,13 @@ Lucent skins Revela built-in page templates without owning their semantic struct
|
|
|
260
260
|
- `cover`, `section-divider`, `closing`: use full-bleed hero treatment with Lucent package assets.
|
|
261
261
|
- `agenda`, `executive-summary`, `problem-context`, `key-message-evidence`, `claim-supporting-visual`: use report-story/card-grid language with quiet surfaces.
|
|
262
262
|
- Agenda typography follows design tokens: title and numbers use `--font-display`; item labels and footer use `--font-body`.
|
|
263
|
+
- `team`: use dark luminous portrait-led member cards with one photo, name, role, two concise highlights, and one education line. Prefer 3-4 members per page.
|
|
263
264
|
- `metric-highlight`, `chart-takeaways`, `table`, `table-comparison`: use data-forward Lucent panels with explicit interpretation regions.
|
|
264
265
|
- Text panels use explicit variants: `template-text-panel--clear` is transparent with no border or background, `template-text-panel--plain` is theme-neutral, and `template-text-panel--color` is the multicolor emphasis treatment used by chart and timeline reading panels.
|
|
265
266
|
- `milestone`: map to the horizontal roadmap visual system. Dots remain milestone anchors inside each milestone item; do not absolutely position detached decorative dots.
|
|
266
267
|
- `timeline`: map to the vertical timeline visual system. Dots remain event anchors inside each timeline item; do not absolutely position detached decorative dots.
|
|
267
268
|
- `process-steps`, `recommendation-decision`, `risks-tradeoffs`: use recommendation and steps surfaces with no nested card-in-card framing.
|
|
269
|
+
- `free`: use a plain title plus one semantic placeholder region; the agent may later replace that region with multiple images, charts, text blocks, tables, or mixed content.
|
|
268
270
|
|
|
269
271
|
<!-- @design:page-templates:end -->
|
|
270
272
|
|
|
@@ -99,24 +99,24 @@ body { margin: 0; background: var(--bg-frame, #07111f); color: var(--text-primar
|
|
|
99
99
|
linear-gradient(135deg, #07111f, #101a2b 62%, #243a73);
|
|
100
100
|
}
|
|
101
101
|
|
|
102
|
-
.template-slide[data-
|
|
102
|
+
.template-slide[data-template="cover"] .slide-canvas {
|
|
103
103
|
background:
|
|
104
104
|
linear-gradient(90deg, rgba(7,17,31,0.82), rgba(7,17,31,0.42) 52%, rgba(7,17,31,0.24)),
|
|
105
105
|
url("./assets/cover-background.jpg") center center / cover no-repeat;
|
|
106
106
|
}
|
|
107
|
-
.template-slide[data-
|
|
107
|
+
.template-slide[data-template="agenda"] .slide-canvas {
|
|
108
108
|
background:
|
|
109
109
|
linear-gradient(90deg, rgba(7,17,31,0.86), rgba(7,17,31,0.58) 52%, rgba(7,17,31,0.32)),
|
|
110
110
|
url("./assets/cover-background.jpg") center center / cover no-repeat;
|
|
111
111
|
}
|
|
112
|
-
.template-slide[data-
|
|
112
|
+
.template-slide[data-template="section-divider"] .slide-canvas {
|
|
113
113
|
background:
|
|
114
114
|
linear-gradient(90deg, rgba(7,17,31,0.86), rgba(16,26,43,0.62) 58%, rgba(36,58,115,0.36)),
|
|
115
115
|
url("./assets/cover-background.jpg") center center / cover no-repeat;
|
|
116
116
|
}
|
|
117
117
|
.template-slide[data-template="closing"] .slide-canvas { background: linear-gradient(135deg, #07111f, #315eea 58%, #18a8d8); }
|
|
118
118
|
|
|
119
|
-
.template-slide[data-
|
|
119
|
+
.template-slide[data-template="closing"] .slide-canvas {
|
|
120
120
|
background:
|
|
121
121
|
linear-gradient(90deg, rgba(7,17,31,0.82), rgba(49,94,234,0.42) 58%, rgba(24,168,216,0.24)),
|
|
122
122
|
url("./assets/closing-background.jpg") center center / cover no-repeat;
|
|
@@ -162,10 +162,13 @@ body { margin: 0; background: var(--bg-frame, #07111f); color: var(--text-primar
|
|
|
162
162
|
.text-panel-formula-fallback { display: block; white-space: normal; overflow-wrap: anywhere; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 0.82em; line-height: 1.35; color: inherit; }
|
|
163
163
|
.text-panel-formula-caption { margin: 0; font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-muted); }
|
|
164
164
|
.template-chart-takeaway-list { display: grid; gap: 22px; width: 100%; }
|
|
165
|
-
.template-chart-takeaway-item { display: grid; gap: 7px; padding-top: 18px; border-top: 1px solid
|
|
165
|
+
.template-chart-takeaway-item { display: grid; gap: 7px; padding-top: 18px; border-top: 1px solid var(--line); }
|
|
166
|
+
.template-text-panel--color .template-chart-takeaway-item { border-top-color: rgba(255,255,255,0.24); }
|
|
166
167
|
.template-chart-takeaway-item:first-child { padding-top: 0; border-top: 0; }
|
|
167
|
-
.template-chart-takeaway-item h3 { margin: 0; font-size: 25px; line-height: 1.24; color:
|
|
168
|
-
.template-chart-takeaway-item
|
|
168
|
+
.template-chart-takeaway-item h3 { margin: 0; font-size: 25px; line-height: 1.24; color: var(--text-primary); }
|
|
169
|
+
.template-text-panel--color .template-chart-takeaway-item h3 { color: white; }
|
|
170
|
+
.template-chart-takeaway-item p { margin: 0; font-size: 20px; line-height: 1.46; color: var(--text-secondary); }
|
|
171
|
+
.template-text-panel--color .template-chart-takeaway-item p { color: rgba(255,255,255,0.78); }
|
|
169
172
|
.template-bar { flex: 1; background: linear-gradient(180deg, var(--accent-primary), var(--accent-cyan)); min-height: 80px; }
|
|
170
173
|
.template-table-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 34px; height: 100%; align-items: stretch; }
|
|
171
174
|
.template-table-layout .template-side-panel { grid-column: 1; grid-row: 1; }
|
|
@@ -223,6 +226,25 @@ body { margin: 0; background: var(--bg-frame, #07111f); color: var(--text-primar
|
|
|
223
226
|
.template-timeline--vertical .template-timeline-item:nth-child(even) .template-timeline-copy { grid-column: 3; text-align: left; align-self: center; }
|
|
224
227
|
.template-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; }
|
|
225
228
|
.template-step-number { font-size: 48px; color: var(--accent-primary); font-weight: 800; margin-bottom: 30px; }
|
|
229
|
+
.template-team-grid { height: 100%; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; align-items: stretch; }
|
|
230
|
+
.template-team-card { min-width: 0; min-height: 0; display: grid; grid-template-rows: 330px minmax(0, 1fr); overflow: hidden; background: rgba(255,255,255,0.86); border: 1px solid var(--line); border-radius: var(--surface-radius); box-shadow: 0 18px 44px var(--shadow-soft); }
|
|
231
|
+
.template-team-photo { margin: 0; width: 100%; height: 100%; overflow: hidden; background: linear-gradient(135deg, var(--accent-soft), rgba(24,168,216,0.16)); display: grid; place-items: center; }
|
|
232
|
+
.template-team-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
|
|
233
|
+
.template-team-photo span { font-family: var(--font-display); font-size: 72px; line-height: 1; color: var(--accent-primary); font-weight: 800; }
|
|
234
|
+
.template-team-copy { min-height: 0; display: flex; flex-direction: column; gap: 12px; padding: 26px; }
|
|
235
|
+
.template-team-name { margin: 0; font-size: 30px; line-height: 1.18; color: var(--text-primary); padding-bottom: 3px; overflow: visible; }
|
|
236
|
+
.template-team-role { margin: 0; font-size: 15px; line-height: 1.35; letter-spacing: 0.1em; text-transform: uppercase; color: var(--accent-primary); font-weight: 800; }
|
|
237
|
+
.template-team-highlights { margin: 4px 0 0; padding: 0; list-style: none; display: grid; gap: 9px; }
|
|
238
|
+
.template-team-highlights li { position: relative; padding-left: 18px; font-size: 17px; line-height: 1.36; color: var(--text-secondary); }
|
|
239
|
+
.template-team-highlights li::before { content: ""; position: absolute; left: 0; top: 9px; width: 6px; height: 6px; background: var(--accent-primary); border-radius: 999px; }
|
|
240
|
+
.template-team-education { margin: auto 0 0; padding-top: 14px; border-top: 1px solid var(--line); font-size: 14px; line-height: 1.35; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-muted); font-weight: 800; }
|
|
241
|
+
.template-free-stage { height: 100%; display: grid; grid-template-columns: minmax(0, 1fr); }
|
|
242
|
+
.template-free-placeholder { min-width: 0; min-height: 0; display: flex; flex-direction: column; justify-content: flex-end; gap: 16px; padding: 42px; border: 1px dashed var(--line-strong); border-radius: var(--surface-radius); background: linear-gradient(135deg, rgba(49,94,234,0.06), rgba(24,168,216,0.07)); overflow: hidden; }
|
|
243
|
+
.template-free-placeholder-label { align-self: flex-start; font-size: 13px; line-height: 1; letter-spacing: 0.14em; text-transform: uppercase; color: var(--accent-primary); font-weight: 800; }
|
|
244
|
+
.template-free-placeholder h2 { margin: 0; font-size: 38px; line-height: 1.18; color: var(--text-primary); padding-bottom: 4px; overflow: visible; }
|
|
245
|
+
.template-free-placeholder p { margin: 0; max-width: 980px; font-size: 23px; line-height: 1.42; color: var(--text-secondary); }
|
|
246
|
+
.template-free-placeholder-hints { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 6px; }
|
|
247
|
+
.template-free-placeholder-hint { display: inline-flex; align-items: center; min-height: 32px; padding: 7px 12px; border: 1px solid var(--line); border-radius: 999px; font-size: 13px; line-height: 1; letter-spacing: 0.1em; text-transform: uppercase; color: var(--text-muted); font-weight: 800; background: rgba(255,255,255,0.58); }
|
|
226
248
|
.template-image-card { width: 100%; margin: 18px 0 0; display: grid; gap: 8px; }
|
|
227
249
|
.template-image-frame { width: 100%; height: 128px; border-radius: var(--surface-radius); overflow: hidden; background: var(--surface-tint, #f1f6fc); border: 1px solid var(--line); }
|
|
228
250
|
.template-image-frame img { display: block; width: 100%; height: 100%; object-fit: cover; }
|
|
@@ -302,6 +324,20 @@ body { margin: 0; background: var(--bg-frame, #07111f); color: var(--text-primar
|
|
|
302
324
|
.template-frame--catalog .template-timeline-copy p:last-child { font-size: 15px; line-height: 1.24; }
|
|
303
325
|
.template-frame--catalog .template-steps { gap: 16px; }
|
|
304
326
|
.template-frame--catalog .template-step-number { font-size: 40px; margin-bottom: 20px; }
|
|
327
|
+
.template-frame--catalog .template-team-grid { gap: 16px; }
|
|
328
|
+
.template-frame--catalog .template-team-card { grid-template-rows: 230px minmax(0, 1fr); }
|
|
329
|
+
.template-frame--catalog .template-team-copy { padding: 18px; gap: 8px; }
|
|
330
|
+
.template-frame--catalog .template-team-name { font-size: 22px; line-height: 1.14; }
|
|
331
|
+
.template-frame--catalog .template-team-role { font-size: 11px; line-height: 1.25; }
|
|
332
|
+
.template-frame--catalog .template-team-highlights { gap: 6px; }
|
|
333
|
+
.template-frame--catalog .template-team-highlights li { font-size: 13px; line-height: 1.25; padding-left: 14px; }
|
|
334
|
+
.template-frame--catalog .template-team-highlights li::before { top: 7px; width: 5px; height: 5px; }
|
|
335
|
+
.template-frame--catalog .template-team-education { font-size: 10px; line-height: 1.25; padding-top: 9px; }
|
|
336
|
+
.template-frame--catalog .template-free-placeholder { padding: 28px; gap: 10px; }
|
|
337
|
+
.template-frame--catalog .template-free-placeholder-label { font-size: 10px; }
|
|
338
|
+
.template-frame--catalog .template-free-placeholder h2 { font-size: 28px; line-height: 1.16; }
|
|
339
|
+
.template-frame--catalog .template-free-placeholder p { font-size: 17px; line-height: 1.3; }
|
|
340
|
+
.template-frame--catalog .template-free-placeholder-hint { min-height: 26px; padding: 6px 9px; font-size: 10px; }
|
|
305
341
|
.template-frame--catalog .template-image-frame { height: 86px; }
|
|
306
342
|
.template-frame--catalog .template-image-caption { font-size: 11px; }
|
|
307
343
|
.template-frame--catalog .template-visual-placeholder-frame { height: 110px; }
|
|
@@ -339,11 +375,16 @@ body { background: var(--bg-frame); color: var(--text-primary); }
|
|
|
339
375
|
.template-card,
|
|
340
376
|
.template-table,
|
|
341
377
|
.template-insight-panel,
|
|
342
|
-
.template-catalog-panel
|
|
378
|
+
.template-catalog-panel,
|
|
379
|
+
.template-team-card {
|
|
343
380
|
background: rgba(12, 22, 40, 0.82);
|
|
344
381
|
border-color: var(--line);
|
|
345
382
|
box-shadow: 0 22px 58px rgba(0, 0, 0, 0.34);
|
|
346
383
|
}
|
|
384
|
+
.template-team-photo { background: linear-gradient(135deg, rgba(117,167,255,0.18), rgba(53,214,242,0.12)); }
|
|
385
|
+
.template-team-photo img { filter: saturate(0.9) contrast(1.08) brightness(0.86); }
|
|
386
|
+
.template-free-placeholder { background: linear-gradient(135deg, rgba(117,167,255,0.12), rgba(53,214,242,0.06)), rgba(12, 22, 40, 0.7); border-color: var(--line-strong); }
|
|
387
|
+
.template-free-placeholder-hint { background: rgba(16, 27, 49, 0.82); }
|
|
347
388
|
.template-card h2,
|
|
348
389
|
.template-card h3,
|
|
349
390
|
.template-title,
|
|
@@ -425,22 +466,22 @@ body { background: var(--bg-frame); color: var(--text-primary); }
|
|
|
425
466
|
box-shadow: 0 24px 66px rgba(35, 83, 190, 0.32);
|
|
426
467
|
}
|
|
427
468
|
.template-text-panel--color .template-text-panel-title,
|
|
428
|
-
.template-chart-takeaway-item h3,
|
|
469
|
+
.template-text-panel--color .template-chart-takeaway-item h3,
|
|
429
470
|
.template-timeline-layout .template-text-panel--color .template-text-panel-title {
|
|
430
471
|
color: white;
|
|
431
472
|
}
|
|
432
|
-
.template-chart-takeaway-item p,
|
|
473
|
+
.template-text-panel--color .template-chart-takeaway-item p,
|
|
433
474
|
.template-timeline-layout .template-text-panel--color .template-text-panel-body {
|
|
434
475
|
color: rgba(255, 255, 255, 0.78);
|
|
435
476
|
}
|
|
436
|
-
.template-slide[data-
|
|
437
|
-
.template-slide[data-
|
|
438
|
-
.template-slide[data-
|
|
477
|
+
.template-slide[data-template="cover"] .slide-canvas,
|
|
478
|
+
.template-slide[data-template="agenda"] .slide-canvas,
|
|
479
|
+
.template-slide[data-template="section-divider"] .slide-canvas {
|
|
439
480
|
background:
|
|
440
481
|
linear-gradient(90deg, rgba(2,8,21,0.9), rgba(2,8,21,0.62) 52%, rgba(2,8,21,0.36)),
|
|
441
482
|
url("./assets/cover-background.jpg") center center / cover no-repeat;
|
|
442
483
|
}
|
|
443
|
-
.template-slide[data-
|
|
484
|
+
.template-slide[data-template="closing"] .slide-canvas {
|
|
444
485
|
background:
|
|
445
486
|
linear-gradient(90deg, rgba(2,8,21,0.86), rgba(49,94,234,0.42) 58%, rgba(24,168,216,0.24)),
|
|
446
487
|
url("./assets/closing-background.jpg") center center / cover no-repeat;
|