@cyber-dash-tech/revela 0.19.8 → 0.19.9

package/designs/starter/design.css

@@ -99,24 +99,24 @@ body { margin: 0; background: var(--bg-frame, #07111f); color: var(--text-primar
     linear-gradient(135deg, #07111f, #101a2b 62%, #243a73);
 }
 
-.template-slide[data-design="starter"][data-template="cover"] .slide-canvas {
+.template-slide[data-template="cover"] .slide-canvas {
   background:
     linear-gradient(90deg, rgba(7,17,31,0.82), rgba(7,17,31,0.42) 52%, rgba(7,17,31,0.24)),
     url("./assets/cover-background.jpg") center center / cover no-repeat;
 }
-.template-slide[data-design="starter"][data-template="agenda"] .slide-canvas {
+.template-slide[data-template="agenda"] .slide-canvas {
   background:
     linear-gradient(90deg, rgba(7,17,31,0.86), rgba(7,17,31,0.58) 52%, rgba(7,17,31,0.32)),
     url("./assets/cover-background.jpg") center center / cover no-repeat;
 }
-.template-slide[data-design="starter"][data-template="section-divider"] .slide-canvas {
+.template-slide[data-template="section-divider"] .slide-canvas {
   background:
     linear-gradient(90deg, rgba(7,17,31,0.86), rgba(16,26,43,0.62) 58%, rgba(36,58,115,0.36)),
     url("./assets/cover-background.jpg") center center / cover no-repeat;
 }
 .template-slide[data-template="closing"] .slide-canvas { background: linear-gradient(135deg, #07111f, #315eea 58%, #18a8d8); }
 
-.template-slide[data-design="starter"][data-template="closing"] .slide-canvas {
+.template-slide[data-template="closing"] .slide-canvas {
   background:
     linear-gradient(90deg, rgba(7,17,31,0.82), rgba(49,94,234,0.42) 58%, rgba(24,168,216,0.24)),
     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
 .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; }
 .text-panel-formula-caption { margin: 0; font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-muted); }
 .template-chart-takeaway-list { display: grid; gap: 22px; width: 100%; }
-.template-chart-takeaway-item { display: grid; gap: 7px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,0.24); }
+.template-chart-takeaway-item { display: grid; gap: 7px; padding-top: 18px; border-top: 1px solid var(--line); }
+.template-text-panel--color .template-chart-takeaway-item { border-top-color: rgba(255,255,255,0.24); }
 .template-chart-takeaway-item:first-child { padding-top: 0; border-top: 0; }
-.template-chart-takeaway-item h3 { margin: 0; font-size: 25px; line-height: 1.24; color: white; }
-.template-chart-takeaway-item p { margin: 0; font-size: 20px; line-height: 1.46; color: rgba(255,255,255,0.78); }
+.template-chart-takeaway-item h3 { margin: 0; font-size: 25px; line-height: 1.24; color: var(--text-primary); }
+.template-text-panel--color .template-chart-takeaway-item h3 { color: white; }
+.template-chart-takeaway-item p { margin: 0; font-size: 20px; line-height: 1.46; color: var(--text-secondary); }
+.template-text-panel--color .template-chart-takeaway-item p { color: rgba(255,255,255,0.78); }
 .template-bar { flex: 1; background: linear-gradient(180deg, var(--accent-primary), var(--accent-cyan)); min-height: 80px; }
 .template-table-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 34px; height: 100%; align-items: stretch; }
 .template-table-layout .template-side-panel { grid-column: 1; grid-row: 1; }
@@ -333,14 +336,14 @@ body { margin: 0; background: var(--bg-frame, #07111f); color: var(--text-primar
 .template-table,
 .template-insight-panel,
 .template-catalog-panel { box-shadow: none; }
-.template-slide[data-design="starter"][data-template="cover"] .slide-canvas,
-.template-slide[data-design="starter"][data-template="agenda"] .slide-canvas,
-.template-slide[data-design="starter"][data-template="section-divider"] .slide-canvas {
+.template-slide[data-template="cover"] .slide-canvas,
+.template-slide[data-template="agenda"] .slide-canvas,
+.template-slide[data-template="section-divider"] .slide-canvas {
   background:
     linear-gradient(90deg, rgba(16,19,22,0.82), rgba(16,19,22,0.42) 52%, rgba(16,19,22,0.18)),
     url("./assets/cover-background.jpg") center center / cover no-repeat;
 }
-.template-slide[data-design="starter"][data-template="closing"] .slide-canvas {
+.template-slide[data-template="closing"] .slide-canvas {
   background:
     linear-gradient(90deg, rgba(16,19,22,0.72), rgba(47,115,218,0.34) 58%, rgba(43,159,195,0.22)),
     url("./assets/closing-background.jpg") center center / cover no-repeat;

package/designs/summit/design.css

@@ -99,24 +99,24 @@ body { margin: 0; background: var(--bg-frame, #07111f); color: var(--text-primar
     linear-gradient(135deg, #07111f, #101a2b 62%, #243a73);
 }
 
-.template-slide[data-design="summit"][data-template="cover"] .slide-canvas {
+.template-slide[data-template="cover"] .slide-canvas {
   background:
     linear-gradient(90deg, rgba(7,17,31,0.82), rgba(7,17,31,0.42) 52%, rgba(7,17,31,0.24)),
     url("./assets/cover-background.jpg") center center / cover no-repeat;
 }
-.template-slide[data-design="summit"][data-template="agenda"] .slide-canvas {
+.template-slide[data-template="agenda"] .slide-canvas {
   background:
     linear-gradient(90deg, rgba(7,17,31,0.86), rgba(7,17,31,0.58) 52%, rgba(7,17,31,0.32)),
     url("./assets/cover-background.jpg") center center / cover no-repeat;
 }
-.template-slide[data-design="summit"][data-template="section-divider"] .slide-canvas {
+.template-slide[data-template="section-divider"] .slide-canvas {
   background:
     linear-gradient(90deg, rgba(7,17,31,0.86), rgba(16,26,43,0.62) 58%, rgba(36,58,115,0.36)),
     url("./assets/cover-background.jpg") center center / cover no-repeat;
 }
 .template-slide[data-template="closing"] .slide-canvas { background: linear-gradient(135deg, #07111f, #315eea 58%, #18a8d8); }
 
-.template-slide[data-design="summit"][data-template="closing"] .slide-canvas {
+.template-slide[data-template="closing"] .slide-canvas {
   background:
     linear-gradient(90deg, rgba(7,17,31,0.82), rgba(49,94,234,0.42) 58%, rgba(24,168,216,0.24)),
     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
 .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; }
 .text-panel-formula-caption { margin: 0; font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-muted); }
 .template-chart-takeaway-list { display: grid; gap: 22px; width: 100%; }
-.template-chart-takeaway-item { display: grid; gap: 7px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,0.24); }
+.template-chart-takeaway-item { display: grid; gap: 7px; padding-top: 18px; border-top: 1px solid var(--line); }
+.template-text-panel--color .template-chart-takeaway-item { border-top-color: rgba(255,255,255,0.24); }
 .template-chart-takeaway-item:first-child { padding-top: 0; border-top: 0; }
-.template-chart-takeaway-item h3 { margin: 0; font-size: 25px; line-height: 1.24; color: white; }
-.template-chart-takeaway-item p { margin: 0; font-size: 20px; line-height: 1.46; color: rgba(255,255,255,0.78); }
+.template-chart-takeaway-item h3 { margin: 0; font-size: 25px; line-height: 1.24; color: var(--text-primary); }
+.template-text-panel--color .template-chart-takeaway-item h3 { color: white; }
+.template-chart-takeaway-item p { margin: 0; font-size: 20px; line-height: 1.46; color: var(--text-secondary); }
+.template-text-panel--color .template-chart-takeaway-item p { color: rgba(255,255,255,0.78); }
 .template-bar { flex: 1; background: linear-gradient(180deg, var(--accent-primary), var(--accent-cyan)); min-height: 80px; }
 .template-table-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 34px; height: 100%; align-items: stretch; }
 .template-table-layout .template-side-panel { grid-column: 1; grid-row: 1; }
@@ -345,14 +348,14 @@ body { margin: 0; background: var(--bg-frame, #07111f); color: var(--text-primar
 .template-timeline-layout .template-text-panel--color {
   background: linear-gradient(135deg, #176c63 0%, #2a8f84 54%, #b0822e 125%);
 }
-.template-slide[data-design="summit"][data-template="cover"] .slide-canvas,
-.template-slide[data-design="summit"][data-template="agenda"] .slide-canvas,
-.template-slide[data-design="summit"][data-template="section-divider"] .slide-canvas {
+.template-slide[data-template="cover"] .slide-canvas,
+.template-slide[data-template="agenda"] .slide-canvas,
+.template-slide[data-template="section-divider"] .slide-canvas {
   background:
     linear-gradient(90deg, rgba(10,16,16,0.84), rgba(10,16,16,0.46) 52%, rgba(10,16,16,0.18)),
     url("./assets/cover-background.jpg") center center / cover no-repeat;
 }
-.template-slide[data-design="summit"][data-template="closing"] .slide-canvas {
+.template-slide[data-template="closing"] .slide-canvas {
   background:
     linear-gradient(90deg, rgba(10,16,16,0.78), rgba(23,108,99,0.4) 58%, rgba(176,130,46,0.22)),
     url("./assets/closing-background.jpg") center center / cover no-repeat;

package/lib/deck-html/foundation.ts

@@ -1,5 +1,5 @@
 import { existsSync, mkdirSync, writeFileSync } from "fs"
-import { dirname, isAbsolute, normalize, resolve } from "path"
+import { basename, dirname, isAbsolute, normalize, resolve } from "path"
 import { activeDesign, getDesignSection, materializeDesignCssSnapshot } from "../design/designs"
 
 export type DeckFoundationMode = "create" | "repair"
@@ -48,7 +48,12 @@ export function createDeckFoundation(input: CreateDeckFoundationInput): CreateDe
   const foundation = getDesignSection("foundation", design)
   const parts = parseFoundationParts(foundation)
   if (parts.scriptBlocks.length === 0) throw new Error(`Design '${design}' foundation does not include a SlidePresentation JavaScript code block.`)
-  const snapshot = materializeDesignCssSnapshot({ workspaceRoot: input.workspaceRoot, outputPath, designName: design })
+  const snapshot = materializeDesignCssSnapshot({
+    workspaceRoot: input.workspaceRoot,
+    outputPath,
+    designName: design,
+    snapshotName: activeDesignSnapshotName(outputPath),
+  })
 
   const html = renderFoundationHtml({
     language: input.language || "en",
@@ -69,6 +74,7 @@ export function createDeckFoundation(input: CreateDeckFoundationInput): CreateDe
       "design:foundation",
       parts.fontLinks.length > 0 ? "foundation:font-links" : "foundation:font-links:none",
       snapshot.generatedFallback ? "design-css:fallback" : "design-css:snapshot",
+      `design-css:active-snapshot:${snapshot.snapshotName}`,
       snapshot.assetCount > 0 ? "design-assets:snapshot" : "design-assets:none",
       "foundation:SlidePresentation",
     ],
@@ -81,6 +87,14 @@ export function createDeckFoundation(input: CreateDeckFoundationInput): CreateDe
   }
 }
 
+export function activeDesignSnapshotName(outputPath: string): string {
+  const stem = basename(normalizeOutputPath(outputPath), ".html")
+    .toLowerCase()
+    .replace(/[^a-z0-9-]+/g, "-")
+    .replace(/^-+|-+$/g, "")
+  return `${stem || "deck"}-active`
+}
+
 export function normalizeOutputPath(outputPath: string): string {
   const trimmed = outputPath.trim()
   if (!trimmed) throw new Error("outputPath is required")

package/lib/design/designs.ts

@@ -180,6 +180,7 @@ export interface MaterializeDesignPreviewResult {
 export interface DesignCssSnapshotResult {
   ok: true
   design: string
+  snapshotName: string
   sourcePath: string
   snapshotDir: string
   cssPath: string
@@ -425,11 +426,13 @@ export function materializeDesignCssSnapshot(input: {
   workspaceRoot: string
   outputPath: string
   designName?: string
+  snapshotName?: string
 }): DesignCssSnapshotResult {
   const designName = normalizeDesignName(input.designName || activeDesign())
+  const snapshotName = normalizeDesignSnapshotName(input.snapshotName || designName)
   const designDir = resolveDesignPackageDir(designName)
   const outputDir = dirname(normalize(input.outputPath))
-  const snapshotRelDir = normalize(join(outputDir, "_revela-design", designName)).replace(/\\/g, "/")
+  const snapshotRelDir = normalize(join(outputDir, "_revela-design", snapshotName)).replace(/\\/g, "/")
   const snapshotDir = resolve(input.workspaceRoot, snapshotRelDir)
   const cssPath = join(snapshotDir, "design.css")
   const cssRead = readDesignCss(designName)
@@ -450,6 +453,7 @@ export function materializeDesignCssSnapshot(input: {
   return {
     ok: true,
     design: designName,
+    snapshotName,
     sourcePath: cssRead.path || join(designDir, "DESIGN.md"),
     snapshotDir,
     cssPath,
@@ -460,6 +464,14 @@ export function materializeDesignCssSnapshot(input: {
   }
 }
 
+function normalizeDesignSnapshotName(name: string): string {
+  const normalized = name.trim().toLowerCase()
+  if (!/^[a-z0-9](?:[a-z0-9-]*[a-z0-9])?$/.test(normalized)) {
+    throw new Error("Design snapshot name must be kebab-case using lowercase letters, numbers, and hyphens")
+  }
+  return normalized
+}
+
 /** Normalize and validate a design package name. */
 export function normalizeDesignName(name: string): string {
   const normalized = name.trim().toLowerCase()

package/lib/page-templates/render.ts

@@ -475,23 +475,23 @@ export function templateDeckCss(input: { designName?: string; designAssetBasePat
   const lucentCoverBackground = designName === "lucent" && assetBasePath ? cssUrl(`${assetBasePath}/cover-background.jpg`) : ""
   const lucentClosingBackground = designName === "lucent" && assetBasePath ? cssUrl(`${assetBasePath}/closing-background.jpg`) : ""
   const lucentCoverBackgroundCss = lucentCoverBackground ? `
-.template-slide[data-design="lucent"][data-template="cover"] .slide-canvas {
+.template-slide[data-template="cover"] .slide-canvas {
   background:
     linear-gradient(90deg, rgba(7,17,31,0.82), rgba(7,17,31,0.42) 52%, rgba(7,17,31,0.24)),
     url("${lucentCoverBackground}") center center / cover no-repeat;
 }
-.template-slide[data-design="lucent"][data-template="agenda"] .slide-canvas {
+.template-slide[data-template="agenda"] .slide-canvas {
   background:
     linear-gradient(90deg, rgba(7,17,31,0.86), rgba(7,17,31,0.58) 52%, rgba(7,17,31,0.32)),
     url("${lucentCoverBackground}") center center / cover no-repeat;
 }
-.template-slide[data-design="lucent"][data-template="section-divider"] .slide-canvas {
+.template-slide[data-template="section-divider"] .slide-canvas {
   background:
     linear-gradient(90deg, rgba(7,17,31,0.86), rgba(16,26,43,0.62) 58%, rgba(36,58,115,0.36)),
     url("${lucentCoverBackground}") center center / cover no-repeat;
 }` : ""
   const lucentClosingBackgroundCss = lucentClosingBackground ? `
-.template-slide[data-design="lucent"][data-template="closing"] .slide-canvas {
+.template-slide[data-template="closing"] .slide-canvas {
   background:
     linear-gradient(90deg, rgba(7,17,31,0.82), rgba(49,94,234,0.42) 58%, rgba(24,168,216,0.24)),
     url("${lucentClosingBackground}") center center / cover no-repeat;
@@ -591,10 +591,13 @@ ${lucentClosingBackgroundCss}
 .template-text-panel-formula-caption { margin: 0; font-size: 14px; line-height: 1.35; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-muted); }
 .template-text-panel--color .template-text-panel-formula-caption { color: rgba(255,255,255,0.72); }
 .template-chart-takeaway-list { display: grid; gap: 22px; width: 100%; }
-.template-chart-takeaway-item { display: grid; gap: 7px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,0.24); }
+.template-chart-takeaway-item { display: grid; gap: 7px; padding-top: 18px; border-top: 1px solid var(--line); }
+.template-text-panel--color .template-chart-takeaway-item { border-top-color: rgba(255,255,255,0.24); }
 .template-chart-takeaway-item:first-child { padding-top: 0; border-top: 0; }
-.template-chart-takeaway-item h3 { margin: 0; font-size: 25px; line-height: 1.24; color: white; }
-.template-chart-takeaway-item p { margin: 0; font-size: 20px; line-height: 1.46; color: rgba(255,255,255,0.78); }
+.template-chart-takeaway-item h3 { margin: 0; font-size: 25px; line-height: 1.24; color: var(--text-primary); }
+.template-text-panel--color .template-chart-takeaway-item h3 { color: white; }
+.template-chart-takeaway-item p { margin: 0; font-size: 20px; line-height: 1.46; color: var(--text-secondary); }
+.template-text-panel--color .template-chart-takeaway-item p { color: rgba(255,255,255,0.78); }
 .template-bar { flex: 1; background: linear-gradient(180deg, var(--accent-primary), var(--accent-cyan)); min-height: 80px; }
 .template-table-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 34px; height: 100%; align-items: stretch; }
 .template-table-layout .template-side-panel { grid-column: 1; grid-row: 1; }

package/lib/runtime/index.ts

@@ -1,6 +1,6 @@
 import { createHash } from "crypto"
-import { existsSync, mkdirSync, readFileSync, writeFileSync } from "fs"
-import { dirname, resolve } from "path"
+import { existsSync, mkdirSync, readFileSync, statSync, writeFileSync } from "fs"
+import { dirname, isAbsolute, resolve, sep } from "path"
 import {
   activeDesign,
   activateDesign,
@@ -16,13 +16,14 @@ import {
   listDesignAssets,
   listDesigns,
   materializeDesignPreview,
+  materializeDesignCssSnapshot,
   packDesignPackage,
   seedBuiltinDesigns,
   validateDesignDraftPackage,
   validateDesignPackage,
   type DesignPackageAssetInput,
 } from "../design/designs"
-import { createDeckFoundation as createDeckFoundationShell } from "../deck-html/foundation"
+import { activeDesignSnapshotName, createDeckFoundation as createDeckFoundationShell } from "../deck-html/foundation"
 import { activeDomain, activateDomain, createDomainDraftPackage, createDomainPackage, getDomainSkillMd, installDomainDraftPackage, listDomains, seedBuiltinDomains, validateDomainDraftPackage, validateDomainPackage } from "../domain/domains"
 import { compileNarrativeVault } from "../narrative-vault/compile"
 import { autoCompileNarrativeVault } from "../narrative-vault/auto-compile"
@@ -36,6 +37,8 @@ import { recordRenderedArtifact, workspaceRelative } from "../workspace-state/re
 import { existingWorkspaceMetaPath, workspaceMetaPath } from "../workspace-meta"
 import { checkMaterialIntake, extractMaterial, materialIntakeNoticeForCommand, prepareLocalMaterials, recordMaterialReview } from "../material-intake"
 import type { ReviewDeckOpenInput, ReviewDeckReadInput } from "./review"
+export type { OpenDeckInput } from "./open-deck"
+import { openDeck as openDeckDirect } from "./open-deck"
 import pkg from "../../package.json"
 export { bindResearchFindings, evaluateResearchFindings, researchSave, researchTargets } from "./research"
 export { storyRead } from "./story"
@@ -72,6 +75,12 @@ export interface RuntimeDesignInventoryInput {
   name?: string
 }
 
+export interface RuntimeDeckDesignSwitchInput extends RuntimeWorkspaceInput {
+  file: string
+  name: string
+  openBrowser?: boolean
+}
+
 export interface RuntimeDesignLayoutReadInput {
   name?: string
   layout: string | string[]
@@ -380,6 +389,16 @@ export async function reviewDeckOpen(input: ReviewDeckOpenInput) {
   return review.reviewDeckOpen(input)
 }
 
+export async function openDeck(input: RuntimeFileInput & { openBrowser?: boolean; openUrl?: (url: string) => void }) {
+  const direct = await import("./open-deck")
+  return direct.openDeck(input)
+}
+
+export async function stopOpenDeckServers() {
+  const direct = await import("./open-deck")
+  return direct.stopOpenDeckServers()
+}
+
 export function designList() {
   return {
     ok: true,
@@ -586,6 +605,50 @@ export function designActivate(input: RuntimeNameInput) {
   }
 }
 
+export function switchDeckDesign(input: RuntimeDeckDesignSwitchInput) {
+  seedBuiltinDesigns()
+  const workspaceRoot = root(input.workspaceRoot)
+  const file = normalizeDeckFile(workspaceRoot, requiredString(input.file, "file"))
+  const design = requiredName({ name: input.name }, "design")
+  activateDesign(design)
+
+  const snapshot = materializeDesignCssSnapshot({
+    workspaceRoot,
+    outputPath: file,
+    designName: design,
+    snapshotName: activeDesignSnapshotName(file),
+  })
+
+  const htmlPath = resolve(workspaceRoot, file)
+  const html = readFileSync(htmlPath, "utf-8")
+  const migratedHtml = migrateDeckDesignLink(html, snapshot.href)
+  const migratedLink = migratedHtml !== html
+  if (migratedLink) writeFileSync(htmlPath, migratedHtml, "utf-8")
+
+  const opened = input.openBrowser === false
+    ? undefined
+    : openDeckDirect({ workspaceRoot, file, openBrowser: input.openBrowser })
+
+  return {
+    ok: true,
+    file,
+    activeDesign: activeDesign(),
+    design,
+    snapshotHref: snapshot.href,
+    snapshotDir: workspaceRelative(workspaceRoot, snapshot.snapshotDir),
+    assetCount: snapshot.assetCount,
+    migratedLink,
+    opened: opened ? {
+      ok: opened.ok,
+      url: opened.url,
+      openedBrowser: opened.openedBrowser,
+      mode: opened.mode,
+      readOnly: opened.readOnly,
+    } : undefined,
+    warnings: snapshot.warnings,
+  }
+}
+
 export function domainList() {
   seedBuiltinDomains()
   return {
@@ -659,6 +722,35 @@ function root(workspaceRoot: string | undefined): string {
   return resolve(workspaceRoot || process.cwd())
 }
 
+function normalizeDeckFile(workspaceRoot: string, fileInput: string): string {
+  const requested = fileInput.trim()
+  const absolute = isAbsolute(requested) ? resolve(requested) : resolve(workspaceRoot, requested)
+  if (!isInside(workspaceRoot, absolute)) throw new Error(`Deck HTML file is outside the workspace: ${requested}`)
+  if (!existsSync(absolute) || !statSync(absolute).isFile()) throw new Error(`Deck HTML file not found: ${requested}`)
+  const file = workspaceRelative(workspaceRoot, absolute)
+  if (!file.startsWith("decks/") || !file.endsWith(".html")) throw new Error(`Deck HTML file must be under decks/*.html: ${file}`)
+  return file
+}
+
+function migrateDeckDesignLink(html: string, activeHref: string): string {
+  const escapedHref = activeHref.replace(/"/g, """)
+  if (html.includes(`href="${escapedHref}"`) || html.includes(`href='${escapedHref}'`)) return html
+  const linkRe = /<link\b(?=[^>]*\brel=(["'])stylesheet\1)(?=[^>]*\bhref=(["'])\.\/_revela-design\/[^"']+\/design\.css\2)[^>]*>/i
+  if (linkRe.test(html)) {
+    return html.replace(linkRe, `<link rel="stylesheet" href="${escapedHref}" data-revela-design-link="active">`)
+  }
+  if (/<\/head>/i.test(html)) {
+    return html.replace(/<\/head>/i, `  <link rel="stylesheet" href="${escapedHref}" data-revela-design-link="active">\n</head>`)
+  }
+  return html
+}
+
+function isInside(rootPath: string, candidate: string): boolean {
+  const normalizedRoot = resolve(rootPath)
+  const normalizedCandidate = resolve(candidate)
+  return normalizedCandidate === normalizedRoot || normalizedCandidate.startsWith(normalizedRoot.endsWith(sep) ? normalizedRoot : normalizedRoot + sep)
+}
+
 function safe<T>(fn: () => T): T | undefined {
   try {
     return fn()

package/lib/runtime/open-deck.ts

@@ -0,0 +1,190 @@
+import { existsSync, statSync } from "fs"
+import { extname, resolve, sep } from "path"
+import { openUrl as systemOpenUrl } from "../edit/open"
+import { workspaceRelative } from "../workspace-state/rendered-artifacts"
+
+export interface OpenDeckInput {
+  workspaceRoot?: string
+  file: string
+  openBrowser?: boolean
+  openUrl?: (url: string) => void
+}
+
+interface DirectDeckServer {
+  server: ReturnType<typeof Bun.serve>
+  baseUrl: string
+  workspaceRoot: string
+  idleTimer?: Timer
+}
+
+const servers = new Map<string, DirectDeckServer>()
+const IDLE_STOP_MS = 30 * 60 * 1000
+const FALLBACK_PORT_START = 8765
+const FALLBACK_PORT_END = 8899
+
+export function openDeck(input: OpenDeckInput): any {
+  const workspaceRoot = resolve(input.workspaceRoot || process.cwd())
+  const requestedFile = input.file?.trim()
+  if (!requestedFile) {
+    return {
+      ok: false,
+      file: "",
+      error: "Missing required file.",
+      diagnostics: [{ severity: "error", code: "missing_file", message: "Provide a workspace-relative or absolute deck HTML file." }],
+    }
+  }
+
+  const absoluteFile = resolve(workspaceRoot, requestedFile)
+  const file = workspaceRelative(workspaceRoot, absoluteFile)
+  if (!isInside(workspaceRoot, absoluteFile)) {
+    return {
+      ok: false,
+      file,
+      error: `Deck HTML file is outside the workspace: ${file}`,
+      diagnostics: [{ severity: "error", code: "file_outside_workspace", message: `Deck HTML file is outside the workspace: ${file}` }],
+    }
+  }
+  if (!existsSync(absoluteFile) || !statSync(absoluteFile).isFile()) {
+    return {
+      ok: false,
+      file,
+      error: `Deck HTML file not found: ${file}`,
+      diagnostics: [{ severity: "error", code: "file_not_found", message: `Deck HTML file not found: ${file}` }],
+    }
+  }
+  if (!file.startsWith("decks/") || !file.endsWith(".html")) {
+    return {
+      ok: false,
+      file,
+      error: `Deck HTML file must be under decks/*.html: ${file}`,
+      diagnostics: [{ severity: "error", code: "invalid_deck_path", message: `Deck HTML file must be under decks/*.html: ${file}` }],
+    }
+  }
+
+  try {
+    const deckServer = startDeckStaticServer(workspaceRoot)
+    const url = `${deckServer.baseUrl}/${file.split("/").map(encodeURIComponent).join("/")}`
+    const openedBrowser = input.openBrowser !== false
+    if (openedBrowser) (input.openUrl ?? systemOpenUrl)(url)
+    return {
+      ok: true,
+      file,
+      url,
+      serveRoot: workspaceRoot,
+      openedBrowser,
+      mode: "direct",
+      readOnly: true,
+    }
+  } catch (e) {
+    const message = e instanceof Error ? e.message : String(e)
+    return {
+      ok: false,
+      file,
+      error: message,
+      diagnostics: [{ severity: "error", code: "open_deck_failed", message }],
+    }
+  }
+}
+
+export function stopOpenDeckServers(): void {
+  for (const item of servers.values()) {
+    if (item.idleTimer) clearTimeout(item.idleTimer)
+    item.server.stop()
+  }
+  servers.clear()
+}
+
+function startDeckStaticServer(workspaceRoot: string): DirectDeckServer {
+  const existing = servers.get(workspaceRoot)
+  if (existing) {
+    scheduleIdleStop(existing)
+    return existing
+  }
+
+  const server = serveWithFallback(workspaceRoot)
+  const item: DirectDeckServer = {
+    server,
+    baseUrl: `http://127.0.0.1:${server.port}`,
+    workspaceRoot,
+  }
+  ;(server as any).unref?.()
+  servers.set(workspaceRoot, item)
+  scheduleIdleStop(item)
+  return item
+}
+
+function serveWithFallback(workspaceRoot: string): ReturnType<typeof Bun.serve> {
+  const ports = [0, ...Array.from({ length: FALLBACK_PORT_END - FALLBACK_PORT_START + 1 }, (_, index) => FALLBACK_PORT_START + index)]
+  const failures: string[] = []
+  for (const port of ports) {
+    try {
+      return Bun.serve({
+        hostname: "127.0.0.1",
+        port,
+        fetch: (req) => handleStaticRequest(workspaceRoot, req),
+      })
+    } catch (e) {
+      failures.push(`port ${port}: ${e instanceof Error ? e.message : String(e)}`)
+    }
+  }
+  throw new Error(`Failed to start direct deck server. ${failures.slice(0, 3).join(" ")}`)
+}
+
+async function handleStaticRequest(workspaceRoot: string, req: Request): Promise<Response> {
+  const url = new URL(req.url)
+  if (req.method !== "GET" && req.method !== "HEAD") return new Response("Method not allowed", { status: 405 })
+  if (url.pathname === "/health") return new Response("ok", { status: 200 })
+  const pathPart = decodeURIComponent(url.pathname.replace(/^\/+/, ""))
+  if (!pathPart) return new Response("Not found", { status: 404 })
+  const absolutePath = resolve(workspaceRoot, pathPart)
+  if (!isInside(workspaceRoot, absolutePath)) return new Response("Forbidden", { status: 403 })
+  if (!existsSync(absolutePath) || !statSync(absolutePath).isFile()) return new Response("Not found", { status: 404 })
+  const file = Bun.file(absolutePath)
+  const headers = new Headers({ "content-type": contentType(absolutePath) })
+  if (req.method === "HEAD") return new Response(null, { status: 200, headers })
+  return new Response(file, { headers })
+}
+
+function scheduleIdleStop(item: DirectDeckServer): void {
+  if (item.idleTimer) clearTimeout(item.idleTimer)
+  item.idleTimer = setTimeout(() => {
+    item.server.stop()
+    servers.delete(item.workspaceRoot)
+  }, IDLE_STOP_MS)
+}
+
+function isInside(root: string, candidate: string): boolean {
+  const normalizedRoot = resolve(root)
+  const normalizedCandidate = resolve(candidate)
+  return normalizedCandidate === normalizedRoot || normalizedCandidate.startsWith(normalizedRoot.endsWith(sep) ? normalizedRoot : normalizedRoot + sep)
+}
+
+function contentType(filePath: string): string {
+  switch (extname(filePath).toLowerCase()) {
+    case ".html":
+      return "text/html; charset=utf-8"
+    case ".css":
+      return "text/css; charset=utf-8"
+    case ".js":
+      return "application/javascript; charset=utf-8"
+    case ".json":
+      return "application/json; charset=utf-8"
+    case ".svg":
+      return "image/svg+xml"
+    case ".png":
+      return "image/png"
+    case ".jpg":
+    case ".jpeg":
+      return "image/jpeg"
+    case ".webp":
+      return "image/webp"
+    case ".gif":
+      return "image/gif"
+    case ".woff":
+      return "font/woff"
+    case ".woff2":
+      return "font/woff2"
+    default:
+      return "application/octet-stream"
+  }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cyber-dash-tech/revela",
-  "version": "0.19.8",
+  "version": "0.19.9",
   "description": "Codex-first CLI/MCP workspace for trusted narrative artifacts from local sources, research, and evidence",
   "type": "module",
   "main": "./index.ts",

package/plugins/revela/.codex-plugin/plugin.json

@@ -1,7 +1,7 @@
 {
   "name": "revela",
-  "version": "0.19.7",
-  "description": "Use Revela in Codex to specify, research, plan, make, and export trusted narrative decision artifacts.",
+  "version": "0.19.9",
+    "description": "Use Revela in Codex to specify, research, plan, make, review, and export trusted narrative decision artifacts.",
   "author": {
     "name": "cyber-dash-tech",
     "url": "https://github.com/cyber-dash-tech"
@@ -20,7 +20,7 @@
   "interface": {
     "displayName": "Revela",
     "shortDescription": "Trusted narrative artifacts from local sources and research.",
-    "longDescription": "Revela helps Codex route workspace workflows, capture requirements in spec.md, ingest local materials, save research findings, plan decks, generate HTML deck artifacts, open them in Codex Browser for annotation, and export PDF/PPTX/PNG outputs while preserving source traceability.",
+    "longDescription": "Revela helps Codex route workspace workflows, capture requirements in spec.md, ingest local materials, save research findings, plan decks, generate HTML deck artifacts, open them directly in Codex Browser, and export PDF/PPTX/PNG outputs while preserving source traceability.",
     "developerName": "cyber-dash-tech",
     "category": "Productivity",
     "capabilities": [
@@ -31,6 +31,7 @@
       "Use Revela to route the next workflow step for this workspace.",
       "Use Revela to write a spec.md for this deck objective.",
       "Use Revela to make a deck from the deck plan.",
+      "Use Revela to review this deck in Codex Browser.",
       "Use Revela to export this deck artifact."
     ],
     "brandColor": "#2563EB"