claude-presentation-master 3.8.5 → 3.8.7

package/dist/index.mjs

@@ -1,3 +1,5 @@
+import "./chunk-HEBXNMVQ.mjs";
+
 // src/kb/KnowledgeGateway.ts
 import { readFileSync } from "fs";
 import { join } from "path";
@@ -2140,29 +2142,29 @@ var SlideGeneratorV2 = class {
   }
   /**
    * Process section content into slides.
-   * Tables become table slides. Lists become bullet slides.
+   * RULES:
+   * 1. Tables ALWAYS become table slides - NEVER extract to metrics
+   * 2. Empty sections are SKIPPED - no blank divider slides
+   * 3. Sections with minimal content are combined into statement slides
    */
   processSectionContent(section, startIndex) {
     const slides = [];
-    const hasTable = section.tokens.some((t) => t.type === "table");
+    const tableTokens = section.tokens.filter((t) => t.type === "table");
     const hasList = section.tokens.some((t) => t.type === "list");
     const hasSignificantText = this.hasSignificantParagraphs(section.tokens);
-    if (hasTable) {
-      const tableToken = section.tokens.find((t) => t.type === "table");
-      if (tableToken) {
-        slides.push(this.createTableSlide(section.title, tableToken));
-      }
+    for (const tableToken of tableTokens) {
+      slides.push(this.createTableSlide(section.title, tableToken));
     }
     if (hasList) {
       const listSlides = this.createBulletSlides(section.title, section.tokens);
       slides.push(...listSlides);
     }
-    if (hasSignificantText && !hasList && !hasTable) {
+    if (hasSignificantText && !hasList && tableTokens.length === 0) {
       slides.push(this.createContentSlide(section.title, section.tokens));
     }
     if (slides.length === 0 && section.tokens.length > 0) {
       const statement = this.extractStatement(section.tokens);
-      if (statement) {
+      if (statement && statement.length > 20) {
         slides.push({
           index: startIndex,
           type: "statement",
@@ -2193,7 +2195,10 @@ var SlideGeneratorV2 = class {
   }
   /**
    * Create bullet slides from list content.
-   * NEVER truncate bullets. Split into multiple slides if needed.
+   * RULES:
+   * 1. NEVER truncate bullets
+   * 2. NEVER create slides with only 1-2 bullets (orphan slides)
+   * 3. If there are fewer than minBulletsToKeep bullets, combine them into a statement slide
    */
   createBulletSlides(title, tokens) {
     const slides = [];
@@ -2208,40 +2213,61 @@ var SlideGeneratorV2 = class {
         }
       }
     }
+    if (allBullets.length === 0) {
+      return slides;
+    }
     const maxBullets = this.config.maxBulletsPerSlide;
     const minBullets = this.config.minBulletsToKeep;
+    if (allBullets.length < minBullets) {
+      const statement = allBullets.join(" \u2022 ");
+      slides.push({
+        index: 0,
+        type: "statement",
+        title,
+        content: { statement }
+      });
+      return slides;
+    }
     if (allBullets.length <= maxBullets) {
-      if (allBullets.length >= minBullets || allBullets.length === 0) {
-        slides.push({
-          index: 0,
-          type: "bullets",
-          title,
-          content: { bullets: allBullets }
-        });
-      } else {
-        slides.push({
-          index: 0,
-          type: "bullets",
-          title,
-          content: { bullets: allBullets },
-          notes: "Consider combining with adjacent content"
-        });
-      }
+      slides.push({
+        index: 0,
+        type: "bullets",
+        title,
+        content: { bullets: allBullets }
+      });
     } else {
-      for (let i = 0; i < allBullets.length; i += maxBullets) {
-        const chunk = allBullets.slice(i, i + maxBullets);
+      const chunks = this.splitBulletsWithoutOrphans(allBullets, maxBullets, minBullets);
+      for (let i = 0; i < chunks.length; i++) {
         const isFirst = i === 0;
         const slideTitle = isFirst ? title : `${title} (continued)`;
         slides.push({
           index: 0,
           type: "bullets",
           title: slideTitle,
-          content: { bullets: chunk }
+          content: { bullets: chunks[i] }
         });
       }
     }
     return slides;
   }
+  /**
+   * Split bullets into chunks without creating orphan slides.
+   * If the last chunk would have fewer than minBullets, steal from previous chunk.
+   */
+  splitBulletsWithoutOrphans(bullets, maxBullets, minBullets) {
+    const chunks = [];
+    for (let i = 0; i < bullets.length; i += maxBullets) {
+      chunks.push(bullets.slice(i, i + maxBullets));
+    }
+    const lastChunk = chunks[chunks.length - 1];
+    if (lastChunk && lastChunk.length < minBullets && chunks.length > 1) {
+      const prevChunk = chunks[chunks.length - 2];
+      const bulletsToMove = minBullets - lastChunk.length;
+      const movedBullets = prevChunk.splice(-bulletsToMove);
+      chunks[chunks.length - 1] = [...movedBullets, ...lastChunk];
+    }
+    return chunks;
+  }
   /**
    * Get complete text from a list item, including nested content.
    * NEVER truncate.
@@ -4883,7 +4909,71 @@ async function initRenderer() {
 }
 
 // src/output/RendererV2.ts
+import { writeFileSync } from "fs";
+var THEMES = {
+  mckinsey: {
+    style: "mckinsey",
+    primaryColor: "#003366",
+    // McKinsey blue
+    accentColor: "#0066cc",
+    description: "White background, professional hierarchy - for consulting/analysis decks"
+  },
+  dark: {
+    style: "dark",
+    primaryColor: "#1a1a2e",
+    accentColor: "#4a9eff",
+    description: "Dark dramatic theme - for keynotes and tech presentations"
+  },
+  minimal: {
+    style: "minimal",
+    primaryColor: "#333333",
+    accentColor: "#0066cc",
+    description: "Clean minimal white - for training and documentation"
+  },
+  corporate: {
+    style: "mckinsey",
+    // Uses McKinsey CSS but with different branding potential
+    primaryColor: "#1a365d",
+    accentColor: "#3182ce",
+    description: "Professional corporate - for executive presentations"
+  },
+  startup: {
+    style: "dark",
+    primaryColor: "#0d1117",
+    accentColor: "#58a6ff",
+    description: "Modern dark - for pitch decks and product demos"
+  }
+};
+var PRESENTATION_TYPE_TO_THEME = {
+  // Keynotes → Dark dramatic style (TED talks, big stage)
+  ted_keynote: "dark",
+  // Sales → Dark dramatic style (persuasion, impact)
+  sales_pitch: "dark",
+  // Consulting/Analysis decks → McKinsey white style (data-heavy, professional)
+  consulting_deck: "mckinsey",
+  // Investment Banking → McKinsey style (financial, dense data)
+  investment_banking: "mckinsey",
+  // Investor Pitch → Startup dark style (modern, VC audiences)
+  investor_pitch: "startup",
+  // Technical → Dark style (engineering audiences like dark mode)
+  technical_presentation: "dark",
+  // All Hands → Minimal clean style (readable, accessible)
+  all_hands: "minimal"
+};
 var RendererV2 = class {
+  theme;
+  presentationType;
+  /**
+   * Create renderer with theme based on presentation type.
+   * @param presentationType - The type of deck being created (determines theme)
+   * @param themeOverride - Optional explicit theme override
+   */
+  constructor(presentationType = "consulting_deck", themeOverride) {
+    this.presentationType = presentationType;
+    const themeStyle = themeOverride || PRESENTATION_TYPE_TO_THEME[presentationType] || "mckinsey";
+    this.theme = THEMES[themeStyle] || THEMES.mckinsey;
+    console.log(`[RendererV2] Using "${this.theme.style}" theme for "${presentationType}" deck`);
+  }
   /**
    * Render slides to complete HTML document.
    */
@@ -4923,202 +5013,1020 @@ ${slidesHtml}
 </html>`;
   }
   /**
-   * Render a single slide.
+   * Render slides to both HTML and PDF files.
+   * Always generates both formats for easy sharing.
    */
-  renderSlide(slide) {
-    const slideClass = `slide-${slide.type}`;
-    let content = "";
-    switch (slide.type) {
-      case "title":
-        content = this.renderTitleSlide(slide);
-        break;
-      case "section":
-        content = this.renderSectionSlide(slide);
-        break;
-      case "bullets":
-        content = this.renderBulletSlide(slide);
-        break;
-      case "table":
-        content = this.renderTableSlide(slide);
-        break;
-      case "metrics":
-        content = this.renderMetricsSlide(slide);
-        break;
-      case "statement":
-        content = this.renderStatementSlide(slide);
-        break;
-      case "call_to_action":
-        content = this.renderCTASlide(slide);
-        break;
-      case "thank_you":
-        content = this.renderThankYouSlide(slide);
-        break;
-      default:
-        content = this.renderBulletSlide(slide);
-    }
-    return `      <section class="${slideClass}">
-${content}
-      </section>`;
+  async renderToFiles(slides, outputPath, title = "Presentation") {
+    const html = this.render(slides, title);
+    const htmlPath = outputPath.replace(/\.pdf$/i, "") + ".html";
+    const pdfPath = outputPath.replace(/\.html$/i, "") + ".pdf";
+    writeFileSync(htmlPath, html);
+    console.log(`\u2705 HTML saved: ${htmlPath}`);
+    await this.renderToPDF(slides, pdfPath, title);
+    console.log(`\u2705 PDF saved: ${pdfPath}`);
+    return { htmlPath, pdfPath };
   }
   /**
-   * Title slide - big, bold, centered.
+   * Render slides directly to PDF using Puppeteer.
+   * Creates a printable PDF with one slide per page.
    */
-  renderTitleSlide(slide) {
-    return `        <h1>${this.escapeHtml(slide.title)}</h1>
-        ${slide.content.subtext ? `<h2>${this.escapeHtml(slide.content.subtext)}</h2>` : ""}`;
+  async renderToPDF(slides, outputPath, title = "Presentation") {
+    const puppeteer = await import("./puppeteer-EG4MVFUF.mjs");
+    const printHtml = this.renderForPrint(slides, title);
+    const browser = await puppeteer.default.launch({
+      headless: true,
+      args: ["--no-sandbox", "--disable-setuid-sandbox"]
+    });
+    try {
+      const page = await browser.newPage();
+      await page.setViewport({ width: 1920, height: 1080 });
+      await page.setContent(printHtml, { waitUntil: "networkidle0" });
+      const pdfBuffer = await page.pdf({
+        path: outputPath,
+        width: "1920px",
+        height: "1080px",
+        printBackground: true,
+        margin: { top: 0, right: 0, bottom: 0, left: 0 },
+        preferCSSPageSize: true
+      });
+      return pdfBuffer;
+    } finally {
+      await browser.close();
+    }
   }
   /**
-   * Section divider - transition slide.
+   * Render HTML optimized for PDF printing (no reveal.js, static pages).
    */
-  renderSectionSlide(slide) {
-    return `        <h1>${this.escapeHtml(slide.title)}</h1>`;
+  renderForPrint(slides, title) {
+    const slidesHtml = slides.map((slide) => {
+      const content = this.renderSlideContent(slide);
+      return `<div class="slide slide-${slide.type}">${content}</div>`;
+    }).join("\n");
+    if (this.theme.style === "mckinsey") {
+      return this.getMcKinseyPrintHTML(title, slidesHtml);
+    }
+    return this.getDarkPrintHTML(title, slidesHtml);
   }
   /**
-   * Bullet slide - the workhorse.
+   * McKinsey-style print HTML (white background, professional).
    */
-  renderBulletSlide(slide) {
-    let html = `        <h1>${this.escapeHtml(slide.title)}</h1>
-`;
-    if (slide.content.body) {
-      const paragraphs = slide.content.body.split("\n\n");
-      for (const p of paragraphs) {
-        html += `        <p>${this.escapeHtml(p)}</p>
-`;
-      }
+  getMcKinseyPrintHTML(title, slidesHtml) {
+    return `<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <title>${this.escapeHtml(title)}</title>
+  <style>
+    @page {
+      size: 1920px 1080px;
+      margin: 0;
     }
-    if (slide.content.bullets && slide.content.bullets.length > 0) {
-      html += "        <ul>\n";
-      for (const bullet of slide.content.bullets) {
-        const formattedBullet = this.formatBulletText(bullet);
-        html += `          <li>${formattedBullet}</li>
-`;
-      }
-      html += "        </ul>\n";
+
+    * {
+      box-sizing: border-box;
+      margin: 0;
+      padding: 0;
     }
-    if (slide.content.source) {
-      html += `        <div class="source">Source: ${this.escapeHtml(slide.content.source)}</div>
-`;
+
+    body {
+      font-family: 'Arial', 'Helvetica', sans-serif;
+      background: #ffffff;
+      color: #1a1a1a;
     }
-    return html;
-  }
-  /**
-   * Table slide - render tables properly.
-   */
-  renderTableSlide(slide) {
-    let html = `        <h1>${this.escapeHtml(slide.title)}</h1>
-`;
-    if (slide.content.table) {
-      html += this.renderTable(slide.content.table);
+
+    .slide {
+      width: 1920px;
+      height: 1080px;
+      padding: 0;
+      background: #ffffff;
+      page-break-after: always;
+      page-break-inside: avoid;
+      position: relative;
+      display: flex;
+      flex-direction: column;
+      overflow: hidden;
     }
-    return html;
-  }
-  /**
-   * Render a table as clean HTML.
-   */
-  renderTable(table) {
-    let html = '        <table class="data-table">\n';
-    html += "          <thead>\n            <tr>\n";
-    for (const header of table.headers) {
-      html += `              <th>${this.escapeHtml(header)}</th>
-`;
+
+    /* McKinsey header bar */
+    .slide::before {
+      content: '';
+      display: block;
+      height: 8px;
+      background: #003366;
+      width: 100%;
+      flex-shrink: 0;
     }
-    html += "            </tr>\n          </thead>\n";
-    html += "          <tbody>\n";
-    for (const row of table.rows) {
-      html += "            <tr>\n";
-      for (let i = 0; i < row.length; i++) {
-        const cell = row[i] || "";
-        const isNumber = /^[\d$%,.\-+]+[KMB]?$/.test(cell.trim());
-        const align = isNumber ? ' class="number"' : "";
-        html += `              <td${align}>${this.escapeHtml(cell)}</td>
-`;
-      }
-      html += "            </tr>\n";
+
+    .slide-content-area {
+      padding: 60px 80px;
+      flex: 1;
+      display: flex;
+      flex-direction: column;
     }
-    html += "          </tbody>\n";
-    html += "        </table>\n";
-    return html;
-  }
-  /**
-   * Metrics slide - big numbers with labels.
-   */
-  renderMetricsSlide(slide) {
-    let html = `        <h1>${this.escapeHtml(slide.title)}</h1>
-`;
-    html += '        <div class="metrics-container">\n';
-    if (slide.content.metrics) {
-      for (const metric of slide.content.metrics) {
-        const trendClass = metric.trend ? ` metric-trend-${metric.trend}` : "";
-        html += `          <div class="metric${trendClass}">
-            <div class="metric-value">${this.escapeHtml(metric.value)}</div>
-            <div class="metric-label">${this.escapeHtml(metric.label)}</div>
-          </div>
-`;
-      }
+
+    .slide:last-child {
+      page-break-after: auto;
     }
-    html += "        </div>\n";
-    return html;
-  }
-  /**
-   * Statement slide - single powerful message.
-   */
-  renderStatementSlide(slide) {
-    let html = `        <h1>${this.escapeHtml(slide.title)}</h1>
-`;
-    if (slide.content.statement) {
-      html += `        <p class="statement">${this.escapeHtml(slide.content.statement)}</p>
-`;
+
+    h1 {
+      font-size: 44px;
+      font-weight: 700;
+      color: #003366;
+      margin-bottom: 24px;
+      line-height: 1.2;
+      border-bottom: 3px solid #003366;
+      padding-bottom: 16px;
     }
-    if (slide.content.subtext) {
-      html += `        <p class="subtext">${this.escapeHtml(slide.content.subtext)}</p>
-`;
+
+    h2 {
+      font-size: 28px;
+      font-weight: 600;
+      color: #333333;
+      margin-bottom: 20px;
     }
-    return html;
-  }
-  /**
-   * Call to action slide.
-   */
-  renderCTASlide(slide) {
-    let html = `        <h1>${this.escapeHtml(slide.title)}</h1>
-`;
-    if (slide.content.bullets && slide.content.bullets.length > 0) {
-      html += "        <ul>\n";
-      for (const bullet of slide.content.bullets) {
-        html += `          <li>${this.formatBulletText(bullet)}</li>
-`;
-      }
-      html += "        </ul>\n";
+
+    p {
+      font-size: 22px;
+      color: #333333;
+      line-height: 1.6;
+      margin-bottom: 16px;
     }
-    return html;
-  }
-  /**
-   * Thank you slide.
-   */
-  renderThankYouSlide(slide) {
-    return `        <h1>${this.escapeHtml(slide.title)}</h1>
-        <h2>Questions?</h2>`;
-  }
-  /**
-   * Format bullet text - handle bold, arrows, etc.
-   */
-  formatBulletText(text) {
-    let formatted = this.escapeHtml(text);
-    formatted = formatted.replace(/\*\*(.+?)\*\*/g, "<strong>$1</strong>");
-    formatted = formatted.replace(/\*(.+?)\*/g, "<em>$1</em>");
-    formatted = formatted.replace(/→/g, " \u2192 ");
-    formatted = formatted.replace(/->/g, " \u2192 ");
-    return formatted;
-  }
-  /**
-   * Escape HTML special characters.
-   */
-  escapeHtml(text) {
-    return text.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#039;");
-  }
-  /**
-   * Professional CSS - McKinsey/BCG style.
+
+    ul {
+      margin: 20px 0 0 0;
+      padding: 0;
+      list-style: none;
+      flex: 1;
+    }
+
+    li {
+      font-size: 22px;
+      color: #333333;
+      line-height: 1.5;
+      margin-bottom: 16px;
+      padding-left: 28px;
+      position: relative;
+    }
+
+    li::before {
+      content: '\u25A0';
+      position: absolute;
+      left: 0;
+      top: 0;
+      color: #003366;
+      font-size: 12px;
+    }
+
+    li strong {
+      color: #1a1a1a;
+      font-weight: 700;
+    }
+
+    .data-table {
+      width: 100%;
+      border-collapse: collapse;
+      margin-top: 24px;
+      font-size: 18px;
+    }
+
+    .data-table th {
+      background: #003366;
+      color: #ffffff;
+      font-weight: 600;
+      text-align: left;
+      padding: 14px 16px;
+      border: 1px solid #003366;
+    }
+
+    .data-table td {
+      color: #333333;
+      padding: 12px 16px;
+      border: 1px solid #dee2e6;
+      background: #ffffff;
+    }
+
+    .data-table tbody tr:nth-child(even) td {
+      background: #f8f9fa;
+    }
+
+    .data-table td.number {
+      text-align: right;
+      font-weight: 600;
+      color: #003366;
+    }
+
+    .metrics-container {
+      display: flex;
+      justify-content: flex-start;
+      gap: 32px;
+      flex-wrap: wrap;
+      margin-top: 32px;
+    }
+
+    .metric {
+      background: #f8f9fa;
+      border: 2px solid #dee2e6;
+      border-top: 4px solid #003366;
+      padding: 24px 32px;
+      text-align: center;
+      min-width: 180px;
+    }
+
+    .metric-value {
+      font-size: 48px;
+      font-weight: 700;
+      color: #003366;
+      line-height: 1;
+      margin-bottom: 8px;
+    }
+
+    .metric-label {
+      font-size: 14px;
+      color: #666666;
+      text-transform: uppercase;
+      letter-spacing: 0.05em;
+    }
+
+    .statement {
+      font-size: 32px;
+      color: #1a1a1a;
+      line-height: 1.5;
+      max-width: 85%;
+      font-style: italic;
+    }
+
+    .subtext {
+      font-size: 20px;
+      color: #666666;
+    }
+
+    .slide-title, .slide-thank_you {
+      justify-content: center;
+      align-items: center;
+      text-align: center;
+      background: #003366 !important;
+    }
+
+    .slide-title::before, .slide-thank_you::before {
+      display: none !important;
+    }
+
+    .slide-title h1, .slide-thank_you h1 {
+      font-size: 56px;
+      color: #ffffff;
+      border-bottom: none;
+      padding-bottom: 0;
+    }
+
+    .slide-title h2, .slide-thank_you h2 {
+      color: rgba(255, 255, 255, 0.8);
+    }
+
+    .source {
+      position: absolute;
+      bottom: 24px;
+      left: 80px;
+      font-size: 12px;
+      color: #666666;
+      font-style: italic;
+    }
+  </style>
+</head>
+<body>
+${slidesHtml}
+</body>
+</html>`;
+  }
+  /**
+   * Dark theme print HTML (legacy).
+   */
+  getDarkPrintHTML(title, slidesHtml) {
+    return `<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <title>${this.escapeHtml(title)}</title>
+  <style>
+    @page {
+      size: 1920px 1080px;
+      margin: 0;
+    }
+
+    * {
+      box-sizing: border-box;
+      margin: 0;
+      padding: 0;
+    }
+
+    body {
+      font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
+      background: #1a1a2e;
+      color: #ffffff;
+    }
+
+    .slide {
+      width: 1920px;
+      height: 1080px;
+      padding: 80px 100px;
+      background: linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0f3460 100%);
+      page-break-after: always;
+      page-break-inside: avoid;
+      position: relative;
+      display: flex;
+      flex-direction: column;
+      justify-content: flex-start;
+      overflow: hidden;
+    }
+
+    /* Content area takes full available height */
+    .slide ul,
+    .slide .data-table,
+    .slide .statement {
+      flex: 1;
+      display: flex;
+      flex-direction: column;
+      justify-content: flex-start;
+    }
+
+    .slide ul {
+      margin-top: 20px;
+    }
+
+    .slide:last-child {
+      page-break-after: auto;
+    }
+
+    h1 {
+      font-size: 52px;
+      font-weight: 700;
+      color: #ffffff;
+      margin-bottom: 32px;
+      line-height: 1.1;
+      letter-spacing: -0.02em;
+    }
+
+    h2 {
+      font-size: 32px;
+      font-weight: 500;
+      color: rgba(255, 255, 255, 0.85);
+      margin-bottom: 24px;
+    }
+
+    p {
+      font-size: 24px;
+      color: rgba(255, 255, 255, 0.85);
+      line-height: 1.6;
+      margin-bottom: 20px;
+    }
+
+    ul {
+      margin: 0;
+      padding: 0;
+      list-style: none;
+    }
+
+    li {
+      font-size: 24px;
+      color: rgba(255, 255, 255, 0.85);
+      line-height: 1.5;
+      margin-bottom: 20px;
+      padding-left: 32px;
+      position: relative;
+    }
+
+    li::before {
+      content: '';
+      position: absolute;
+      left: 0;
+      top: 12px;
+      width: 10px;
+      height: 10px;
+      background: #4a9eff;
+      border-radius: 50%;
+    }
+
+    li strong {
+      color: #ffffff;
+      font-weight: 600;
+    }
+
+    .data-table {
+      width: 100%;
+      border-collapse: collapse;
+      margin-top: 24px;
+      font-size: 20px;
+    }
+
+    .data-table th {
+      background: rgba(255, 255, 255, 0.08);
+      color: #ffffff;
+      font-weight: 600;
+      text-align: left;
+      padding: 16px 20px;
+      border-bottom: 2px solid rgba(255, 255, 255, 0.1);
+    }
+
+    .data-table td {
+      color: rgba(255, 255, 255, 0.85);
+      padding: 14px 20px;
+      border-bottom: 1px solid rgba(255, 255, 255, 0.1);
+    }
+
+    .data-table td.number {
+      text-align: right;
+      font-family: 'SF Mono', 'Monaco', monospace;
+      font-weight: 500;
+      color: #4a9eff;
+    }
+
+    .metrics-container {
+      display: flex;
+      justify-content: flex-start;
+      gap: 40px;
+      flex-wrap: wrap;
+      margin-top: 40px;
+    }
+
+    .metric {
+      background: rgba(255, 255, 255, 0.05);
+      border: 1px solid rgba(255, 255, 255, 0.1);
+      border-radius: 12px;
+      padding: 32px 48px;
+      text-align: center;
+      min-width: 200px;
+    }
+
+    .metric-value {
+      font-size: 56px;
+      font-weight: 700;
+      color: #4a9eff;
+      line-height: 1;
+      margin-bottom: 12px;
+    }
+
+    .metric-label {
+      font-size: 16px;
+      color: rgba(255, 255, 255, 0.6);
+      text-transform: uppercase;
+      letter-spacing: 0.1em;
+    }
+
+    .statement {
+      font-size: 36px;
+      color: #ffffff;
+      line-height: 1.4;
+      max-width: 80%;
+    }
+
+    .subtext {
+      font-size: 24px;
+      color: rgba(255, 255, 255, 0.6);
+    }
+
+    .slide-title, .slide-thank_you {
+      justify-content: center;
+      align-items: center;
+      text-align: center;
+    }
+
+    .slide-title h1, .slide-thank_you h1 {
+      font-size: 72px;
+    }
+
+    .source {
+      position: absolute;
+      bottom: 24px;
+      left: 80px;
+      font-size: 14px;
+      color: rgba(255, 255, 255, 0.6);
+    }
+  </style>
+</head>
+<body>
+${slidesHtml}
+</body>
+</html>`;
+  }
+  /**
+   * Render slide content (shared between HTML and PDF renderers).
+   */
+  renderSlideContent(slide) {
+    switch (slide.type) {
+      case "title":
+        return this.renderTitleSlide(slide);
+      case "section":
+        return this.renderSectionSlide(slide);
+      case "bullets":
+        return this.renderBulletSlide(slide);
+      case "table":
+        return this.renderTableSlide(slide);
+      case "metrics":
+        return this.renderMetricsSlide(slide);
+      case "statement":
+        return this.renderStatementSlide(slide);
+      case "call_to_action":
+        return this.renderCTASlide(slide);
+      case "thank_you":
+        return this.renderThankYouSlide(slide);
+      default:
+        return this.renderBulletSlide(slide);
+    }
+  }
+  /**
+   * Render a single slide.
+   */
+  renderSlide(slide) {
+    const slideClass = `slide-${slide.type}`;
+    let content = "";
+    switch (slide.type) {
+      case "title":
+        content = this.renderTitleSlide(slide);
+        break;
+      case "section":
+        content = this.renderSectionSlide(slide);
+        break;
+      case "bullets":
+        content = this.renderBulletSlide(slide);
+        break;
+      case "table":
+        content = this.renderTableSlide(slide);
+        break;
+      case "metrics":
+        content = this.renderMetricsSlide(slide);
+        break;
+      case "statement":
+        content = this.renderStatementSlide(slide);
+        break;
+      case "call_to_action":
+        content = this.renderCTASlide(slide);
+        break;
+      case "thank_you":
+        content = this.renderThankYouSlide(slide);
+        break;
+      default:
+        content = this.renderBulletSlide(slide);
+    }
+    return `      <section class="${slideClass}">
+${content}
+      </section>`;
+  }
+  /**
+   * Title slide - big, bold, centered.
+   */
+  renderTitleSlide(slide) {
+    return `        <h1>${this.escapeHtml(slide.title)}</h1>
+        ${slide.content.subtext ? `<h2>${this.escapeHtml(slide.content.subtext)}</h2>` : ""}`;
+  }
+  /**
+   * Section divider - transition slide.
+   */
+  renderSectionSlide(slide) {
+    return `        <h1>${this.escapeHtml(slide.title)}</h1>`;
+  }
+  /**
+   * Bullet slide - the workhorse.
+   */
+  renderBulletSlide(slide) {
+    let html = `        <h1>${this.escapeHtml(slide.title)}</h1>
+`;
+    if (slide.content.body) {
+      const paragraphs = slide.content.body.split("\n\n");
+      for (const p of paragraphs) {
+        html += `        <p>${this.escapeHtml(p)}</p>
+`;
+      }
+    }
+    if (slide.content.bullets && slide.content.bullets.length > 0) {
+      html += "        <ul>\n";
+      for (const bullet of slide.content.bullets) {
+        const formattedBullet = this.formatBulletText(bullet);
+        html += `          <li>${formattedBullet}</li>
+`;
+      }
+      html += "        </ul>\n";
+    }
+    if (slide.content.source) {
+      html += `        <div class="source">Source: ${this.escapeHtml(slide.content.source)}</div>
+`;
+    }
+    return html;
+  }
+  /**
+   * Table slide - render tables properly.
+   */
+  renderTableSlide(slide) {
+    let html = `        <h1>${this.escapeHtml(slide.title)}</h1>
+`;
+    if (slide.content.table) {
+      html += this.renderTable(slide.content.table);
+    }
+    return html;
+  }
+  /**
+   * Render a table as clean HTML.
+   */
+  renderTable(table) {
+    let html = '        <table class="data-table">\n';
+    html += "          <thead>\n            <tr>\n";
+    for (const header of table.headers) {
+      html += `              <th>${this.escapeHtml(header)}</th>
+`;
+    }
+    html += "            </tr>\n          </thead>\n";
+    html += "          <tbody>\n";
+    for (const row of table.rows) {
+      html += "            <tr>\n";
+      for (let i = 0; i < row.length; i++) {
+        const cell = row[i] || "";
+        const isNumber = /^[\d$%,.\-+]+[KMB]?$/.test(cell.trim());
+        const align = isNumber ? ' class="number"' : "";
+        html += `              <td${align}>${this.escapeHtml(cell)}</td>
+`;
+      }
+      html += "            </tr>\n";
+    }
+    html += "          </tbody>\n";
+    html += "        </table>\n";
+    return html;
+  }
+  /**
+   * Metrics slide - big numbers with labels.
+   */
+  renderMetricsSlide(slide) {
+    let html = `        <h1>${this.escapeHtml(slide.title)}</h1>
+`;
+    html += '        <div class="metrics-container">\n';
+    if (slide.content.metrics) {
+      for (const metric of slide.content.metrics) {
+        const trendClass = metric.trend ? ` metric-trend-${metric.trend}` : "";
+        html += `          <div class="metric${trendClass}">
+            <div class="metric-value">${this.escapeHtml(metric.value)}</div>
+            <div class="metric-label">${this.escapeHtml(metric.label)}</div>
+          </div>
+`;
+      }
+    }
+    html += "        </div>\n";
+    return html;
+  }
+  /**
+   * Statement slide - single powerful message.
+   */
+  renderStatementSlide(slide) {
+    let html = `        <h1>${this.escapeHtml(slide.title)}</h1>
+`;
+    if (slide.content.statement) {
+      html += `        <p class="statement">${this.escapeHtml(slide.content.statement)}</p>
+`;
+    }
+    if (slide.content.subtext) {
+      html += `        <p class="subtext">${this.escapeHtml(slide.content.subtext)}</p>
+`;
+    }
+    return html;
+  }
+  /**
+   * Call to action slide.
+   */
+  renderCTASlide(slide) {
+    let html = `        <h1>${this.escapeHtml(slide.title)}</h1>
+`;
+    if (slide.content.bullets && slide.content.bullets.length > 0) {
+      html += "        <ul>\n";
+      for (const bullet of slide.content.bullets) {
+        html += `          <li>${this.formatBulletText(bullet)}</li>
+`;
+      }
+      html += "        </ul>\n";
+    }
+    return html;
+  }
+  /**
+   * Thank you slide.
+   */
+  renderThankYouSlide(slide) {
+    return `        <h1>${this.escapeHtml(slide.title)}</h1>
+        <h2>Questions?</h2>`;
+  }
+  /**
+   * Format bullet text - handle bold, arrows, etc.
+   */
+  formatBulletText(text) {
+    let formatted = this.escapeHtml(text);
+    formatted = formatted.replace(/\*\*(.+?)\*\*/g, "<strong>$1</strong>");
+    formatted = formatted.replace(/\*(.+?)\*/g, "<em>$1</em>");
+    formatted = formatted.replace(/→/g, " \u2192 ");
+    formatted = formatted.replace(/->/g, " \u2192 ");
+    return formatted;
+  }
+  /**
+   * Escape HTML special characters.
+   */
+  escapeHtml(text) {
+    return text.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#039;");
+  }
+  /**
+   * Professional CSS - McKinsey/BCG consulting style.
    */
   getCSS() {
+    if (this.theme.style === "mckinsey") {
+      return this.getMcKinseyCSS();
+    }
+    return this.getDarkCSS();
+  }
+  /**
+   * McKinsey/BCG Consulting Style - WHITE background, professional hierarchy.
+   */
+  getMcKinseyCSS() {
+    return `
+    /* McKinsey Consulting Theme - Clean White, Strong Hierarchy */
+    :root {
+      --bg-primary: #ffffff;
+      --bg-secondary: #f8f9fa;
+      --bg-accent: #e9ecef;
+      --text-primary: #1a1a1a;
+      --text-secondary: #333333;
+      --text-muted: #666666;
+      --mckinsey-blue: #003366;
+      --accent-blue: #0066cc;
+      --accent-green: #28a745;
+      --accent-red: #dc3545;
+      --border-color: #dee2e6;
+      --header-bar: #003366;
+    }
+
+    .reveal {
+      font-family: 'Georgia', 'Times New Roman', serif;
+    }
+
+    .reveal .slides {
+      text-align: left;
+    }
+
+    .reveal .slides section {
+      padding: 0;
+      background: var(--bg-primary);
+      height: 100%;
+      box-sizing: border-box;
+      display: flex !important;
+      flex-direction: column;
+      justify-content: flex-start;
+      align-items: stretch;
+    }
+
+    /* McKinsey-style header bar */
+    .reveal .slides section::before {
+      content: '';
+      display: block;
+      height: 8px;
+      background: var(--header-bar);
+      width: 100%;
+      flex-shrink: 0;
+    }
+
+    .reveal .slides section .slide-content {
+      padding: 60px 80px;
+      flex: 1;
+      display: flex;
+      flex-direction: column;
+    }
+
+    .reveal .slides section > ul,
+    .reveal .slides section > .data-table {
+      flex: 1;
+      display: flex;
+      flex-direction: column;
+      justify-content: flex-start;
+    }
+
+    /* Typography - Strong Hierarchy */
+    .reveal h1 {
+      font-size: 44px;
+      font-weight: 700;
+      color: var(--mckinsey-blue);
+      margin-bottom: 24px;
+      line-height: 1.2;
+      letter-spacing: -0.01em;
+      font-family: 'Arial', 'Helvetica', sans-serif;
+      border-bottom: 3px solid var(--mckinsey-blue);
+      padding-bottom: 16px;
+    }
+
+    .reveal h2 {
+      font-size: 28px;
+      font-weight: 600;
+      color: var(--text-secondary);
+      margin-bottom: 20px;
+      font-family: 'Arial', 'Helvetica', sans-serif;
+    }
+
+    .reveal p {
+      font-size: 22px;
+      color: var(--text-secondary);
+      line-height: 1.6;
+      margin-bottom: 16px;
+    }
+
+    /* Bullets - Clear, readable */
+    .reveal ul {
+      margin: 20px 0 0 0;
+      padding: 0;
+      list-style: none;
+    }
+
+    .reveal li {
+      font-size: 22px;
+      color: var(--text-secondary);
+      line-height: 1.5;
+      margin-bottom: 16px;
+      padding-left: 28px;
+      position: relative;
+    }
+
+    .reveal li::before {
+      content: '\u25A0';
+      position: absolute;
+      left: 0;
+      top: 0;
+      color: var(--mckinsey-blue);
+      font-size: 12px;
+    }
+
+    .reveal li strong {
+      color: var(--text-primary);
+      font-weight: 700;
+    }
+
+    /* Tables - Clean consulting style */
+    .data-table {
+      width: 100%;
+      border-collapse: collapse;
+      margin-top: 24px;
+      font-size: 18px;
+      font-family: 'Arial', sans-serif;
+    }
+
+    .data-table th {
+      background: var(--mckinsey-blue);
+      color: #ffffff;
+      font-weight: 600;
+      text-align: left;
+      padding: 14px 16px;
+      border: 1px solid var(--mckinsey-blue);
+    }
+
+    .data-table td {
+      color: var(--text-secondary);
+      padding: 12px 16px;
+      border: 1px solid var(--border-color);
+      background: var(--bg-primary);
+    }
+
+    .data-table tbody tr:nth-child(even) td {
+      background: var(--bg-secondary);
+    }
+
+    .data-table td.number {
+      text-align: right;
+      font-family: 'Arial', sans-serif;
+      font-weight: 600;
+      color: var(--mckinsey-blue);
+    }
+
+    .data-table tbody tr:hover td {
+      background: #e3f2fd;
+    }
+
+    /* Metrics - Clean boxes */
+    .metrics-container {
+      display: flex;
+      justify-content: flex-start;
+      gap: 32px;
+      flex-wrap: wrap;
+      margin-top: 32px;
+    }
+
+    .metric {
+      background: var(--bg-secondary);
+      border: 2px solid var(--border-color);
+      border-top: 4px solid var(--mckinsey-blue);
+      padding: 24px 32px;
+      text-align: center;
+      min-width: 180px;
+    }
+
+    .metric-value {
+      font-size: 48px;
+      font-weight: 700;
+      color: var(--mckinsey-blue);
+      line-height: 1;
+      margin-bottom: 8px;
+      font-family: 'Arial', sans-serif;
+    }
+
+    .metric-trend-up .metric-value {
+      color: var(--accent-green);
+    }
+
+    .metric-trend-down .metric-value {
+      color: var(--accent-red);
+    }
+
+    .metric-label {
+      font-size: 14px;
+      color: var(--text-muted);
+      text-transform: uppercase;
+      letter-spacing: 0.05em;
+      font-family: 'Arial', sans-serif;
+    }
+
+    /* Statement slides */
+    .statement {
+      font-size: 32px;
+      color: var(--text-primary);
+      line-height: 1.5;
+      max-width: 85%;
+      font-style: italic;
+    }
+
+    .subtext {
+      font-size: 20px;
+      color: var(--text-muted);
+    }
+
+    /* Title slide */
+    .slide-title {
+      display: flex;
+      flex-direction: column;
+      justify-content: center;
+      align-items: center;
+      text-align: center;
+      background: var(--mckinsey-blue) !important;
+    }
+
+    .slide-title::before {
+      display: none !important;
+    }
+
+    .slide-title h1 {
+      font-size: 56px;
+      color: #ffffff;
+      border-bottom: none;
+      padding-bottom: 0;
+    }
+
+    .slide-title h2 {
+      color: rgba(255, 255, 255, 0.8);
+    }
+
+    /* Thank you slide */
+    .slide-thank_you {
+      display: flex;
+      flex-direction: column;
+      justify-content: center;
+      align-items: center;
+      text-align: center;
+      background: var(--mckinsey-blue) !important;
+    }
+
+    .slide-thank_you::before {
+      display: none !important;
+    }
+
+    .slide-thank_you h1 {
+      font-size: 56px;
+      color: #ffffff;
+      border-bottom: none;
+      margin-bottom: 16px;
+    }
+
+    .slide-thank_you h2 {
+      color: rgba(255, 255, 255, 0.8);
+    }
+
+    /* Source citation */
+    .source {
+      position: absolute;
+      bottom: 24px;
+      left: 80px;
+      font-size: 12px;
+      color: var(--text-muted);
+      font-style: italic;
+    }
+
+    /* Page number style footer */
+    .reveal .slide-number {
+      background: var(--mckinsey-blue);
+      color: #ffffff;
+      font-size: 14px;
+      padding: 8px 12px;
+    }
+`;
+  }
+  /**
+   * Dark theme CSS (legacy).
+   */
+  getDarkCSS() {
     return `
     /* Professional Dark Theme - No Random Images */
     :root {
@@ -5143,10 +6051,22 @@ ${content}
     }
 
     .reveal .slides section {
-      padding: 60px 80px;
+      padding: 80px 100px;
       background: linear-gradient(135deg, var(--bg-primary) 0%, var(--bg-secondary) 50%, var(--bg-accent) 100%);
       height: 100%;
       box-sizing: border-box;
+      display: flex !important;
+      flex-direction: column;
+      justify-content: flex-start;
+      align-items: stretch;
+    }
+
+    .reveal .slides section > ul,
+    .reveal .slides section > .data-table {
+      flex: 1;
+      display: flex;
+      flex-direction: column;
+      justify-content: flex-start;
     }
 
     /* Typography */
@@ -5331,8 +6251,8 @@ ${content}
 `;
   }
 };
-function createRendererV2() {
-  return new RendererV2();
+function createRendererV2(presentationType = "consulting_deck", themeOverride) {
+  return new RendererV2(presentationType, themeOverride);
 }
 
 // src/image/NanoBananaProvider.ts