create-dss-project 0.1.0

package/template/dashboard/build-data.js

@@ -0,0 +1,395 @@
+#!/usr/bin/env node
+/**
+ * Build script for {{PROJECT_NAME}} Dashboard
+ * Reads project markdown/CSV files (read-only) and outputs JSON to dashboard/data/
+ */
+
+const fs = require('fs');
+const path = require('path');
+const { parse } = require('csv-parse/sync');
+const { marked } = require('marked');
+
+// Safety: hardcoded paths
+const PROJECT_ROOT = path.resolve(__dirname, '..');
+const OUTPUT_DIR = path.join(__dirname, 'data');
+
+// Ensure output dir exists and is inside dashboard/
+if (!OUTPUT_DIR.startsWith(__dirname)) {
+  console.error('SAFETY: Output directory must be inside dashboard/');
+  process.exit(1);
+}
+fs.mkdirSync(OUTPUT_DIR, { recursive: true });
+
+// ─── Project Config ──────────────────────────────────────────────────────────
+
+function loadProjectConfig() {
+  const configPath = path.join(PROJECT_ROOT, 'project.config.json');
+  try {
+    return JSON.parse(fs.readFileSync(configPath, 'utf-8'));
+  } catch (e) {
+    console.warn('  WARN: No project.config.json found — using defaults');
+    return {};
+  }
+}
+
+const PROJECT_CONFIG = loadProjectConfig();
+
+// ─── Utilities ───────────────────────────────────────────────────────────────
+
+function readFile(relativePath) {
+  const full = path.join(PROJECT_ROOT, relativePath);
+  try {
+    return fs.readFileSync(full, 'utf-8');
+  } catch (e) {
+    console.warn(`  WARN: Could not read ${relativePath}`);
+    return null;
+  }
+}
+
+function parseMarkdownTables(md) {
+  const tables = [];
+  const lines = md.split('\n');
+  let i = 0;
+  while (i < lines.length) {
+    if (lines[i].trim().startsWith('|') && i + 1 < lines.length && lines[i + 1].trim().startsWith('|')) {
+      const tableLines = [];
+      while (i < lines.length && lines[i].trim().startsWith('|')) {
+        tableLines.push(lines[i]);
+        i++;
+      }
+      if (tableLines.length >= 3) {
+        const headers = tableLines[0].split('|').map(c => c.trim()).filter(c => c);
+        const rows = [];
+        for (let r = 2; r < tableLines.length; r++) {
+          const cells = tableLines[r].split('|').map(c => c.trim()).filter(c => c);
+          if (cells.length > 0 && !cells[0].match(/^[-:]+$/)) {
+            const row = {};
+            headers.forEach((h, idx) => { row[h] = cells[idx] || ''; });
+            rows.push(row);
+          }
+        }
+        if (rows.length > 0) tables.push({ headers, rows });
+      }
+    } else {
+      i++;
+    }
+  }
+  return tables;
+}
+
+function splitByHeadings(md, level = 2) {
+  const regex = new RegExp(`^${'#'.repeat(level)} (.+)$`, 'gm');
+  const sections = {};
+  let match;
+  const positions = [];
+  while ((match = regex.exec(md)) !== null) {
+    positions.push({ title: match[1].trim(), start: match.index + match[0].length });
+  }
+  for (let i = 0; i < positions.length; i++) {
+    const end = i + 1 < positions.length ? positions[i + 1].start - positions[i + 1].title.length - level - 2 : md.length;
+    const content = md.substring(positions[i].start, end).trim();
+    sections[positions[i].title] = content;
+  }
+  return sections;
+}
+
+// ─── Build Overview Data ─────────────────────────────────────────────────────
+
+function buildOverview() {
+  console.log('Building overview data...');
+  const overview = {
+    projectName: PROJECT_CONFIG.projectName || '',
+    entityType: PROJECT_CONFIG.entityType || '',
+    statusBlurb: '',
+    killConditions: [],
+    buildTime: new Date().toISOString(),
+  };
+
+  // Status blurb
+  const blurb = readFile('docs/output/status-blurb.md');
+  if (blurb) {
+    overview.statusBlurb = blurb
+      .replace(/<!--[\s\S]*?-->/g, '')
+      .trim();
+  }
+
+  // Kill conditions from executive summary
+  const execSummary = readFile('docs/executive-summary.md');
+  if (execSummary) {
+    const tables = parseMarkdownTables(execSummary);
+    for (const table of tables) {
+      if (table.headers.some(h => h.toLowerCase().includes('condition'))) {
+        overview.killConditions = table.rows.map(row => ({
+          id: row['KC'] || row['#'] || '',
+          condition: row['Condition'] || '',
+          status: row['Status'] || 'UNTESTED',
+          evidence: row['Key Evidence'] || '',
+        }));
+        break;
+      }
+    }
+  }
+
+  return overview;
+}
+
+// ─── Build Entity Data (from CSV) ───────────────────────────────────────────
+
+function buildEntities() {
+  console.log('Building entity data...');
+  const csvPath = PROJECT_CONFIG.pipelineSourceOfTruth || 'data/entities.csv';
+  const csv = readFile(csvPath);
+  if (!csv) {
+    console.warn('  No entity CSV found — skipping entity build');
+    return [];
+  }
+
+  try {
+    const records = parse(csv, { columns: true, skip_empty_lines: true, trim: true });
+    return records;
+  } catch (e) {
+    console.error(`  ERROR parsing CSV: ${e.message}`);
+    return [];
+  }
+}
+
+// ─── Build Competitor Data ──────────────────────────────────────────────────
+
+function buildCompetitors() {
+  console.log('Building competitor data...');
+  const researchMd = readFile('memory/research.md');
+  if (!researchMd) return [];
+
+  const tables = parseMarkdownTables(researchMd);
+  if (tables.length === 0) return [];
+
+  // Use the first table (capability map)
+  return tables[0].rows;
+}
+
+// ─── Build Decisions Data ────────────────────────────────────────────────────
+
+function buildDecisions() {
+  console.log('Building decisions data...');
+  const md = readFile('memory/decisions.md');
+  if (!md) return [];
+
+  const decisions = [];
+  const decisionRegex = /### Decision (\d+):\s*(.+)/g;
+  let match;
+  const positions = [];
+
+  while ((match = decisionRegex.exec(md)) !== null) {
+    positions.push({
+      number: parseInt(match[1], 10),
+      title: match[2].trim(),
+      start: match.index + match[0].length,
+    });
+  }
+
+  if (positions.length === 0) return [];
+
+  for (let i = 0; i < positions.length; i++) {
+    const end = i + 1 < positions.length ? positions[i + 1].start - positions[i + 1].title.length - 20 : md.length;
+    const block = md.substring(positions[i].start, end);
+
+    const dateMatch = block.match(/\*\*Date\*\*:\s*(.+)/);
+    const decidedMatch = block.match(/\*\*Decided\*\*:\s*(.+)/);
+    const reversibilityMatch = block.match(/\*\*Reversibility\*\*:\s*(.+)/);
+    const revisitMatch = block.match(/\*\*Revisit trigger\*\*:\s*(.+)/);
+
+    decisions.push({
+      number: positions[i].number,
+      title: positions[i].title,
+      date: dateMatch ? dateMatch[1].trim() : '',
+      decided: decidedMatch ? decidedMatch[1].trim() : '',
+      reversibility: reversibilityMatch ? reversibilityMatch[1].trim() : '',
+      revisitTrigger: revisitMatch ? revisitMatch[1].trim() : '',
+    });
+  }
+
+  return decisions;
+}
+
+// ─── Build Scoring Data ─────────────────────────────────────────────────────
+
+function buildScoring() {
+  console.log('Building scoring data...');
+  const md = readFile('memory/scoring.md');
+  if (!md) return { options: [], matrix: [], recommended: {} };
+
+  const tables = parseMarkdownTables(md);
+  const options = tables.length > 0 ? tables[0].rows : [];
+  const matrix = tables.length > 1 ? tables[1].rows : [];
+
+  // Extract Recommended Strategy section
+  const recommended = {};
+  const recMatch = md.match(/## Recommended Strategy([\s\S]*?)(?=\n## |\n# |$)/);
+  if (recMatch) {
+    const recBlock = recMatch[1];
+    const optionMatch = recBlock.match(/\*\*Option\*\*:\s*(.+)/);
+    const rationaleMatch = recBlock.match(/\*\*Rationale\*\*:\s*(.+)/);
+    const risksMatch = recBlock.match(/\*\*Risks\*\*:\s*(.+)/);
+    const fallbackMatch = recBlock.match(/\*\*Fallback\*\*:\s*(.+)/);
+
+    if (optionMatch) recommended.option = optionMatch[1].trim();
+    if (rationaleMatch) recommended.rationale = rationaleMatch[1].trim();
+    if (risksMatch) recommended.risks = risksMatch[1].trim();
+    if (fallbackMatch) recommended.fallback = fallbackMatch[1].trim();
+  }
+
+  return { options, matrix, recommended };
+}
+
+// ─── Build Timeline Data ────────────────────────────────────────────────────
+
+function buildTimeline() {
+  console.log('Building timeline data...');
+  const md = readFile('docs/output/work-log.md');
+  if (!md) return [];
+
+  const tables = parseMarkdownTables(md);
+  if (tables.length === 0) return [];
+
+  // Find the table that has workstream-like headers
+  let workTable = null;
+  for (const table of tables) {
+    const lowerHeaders = table.headers.map(h => h.toLowerCase());
+    if (lowerHeaders.includes('workstream') || lowerHeaders.includes('item') || lowerHeaders.includes('date')) {
+      workTable = table;
+      break;
+    }
+  }
+  if (!workTable) workTable = tables[0];
+
+  const entries = workTable.rows.map(row => ({
+    workstream: row['Workstream'] || row['workstream'] || '',
+    item: row['Item'] || row['item'] || '',
+    owner: row['Owner'] || row['owner'] || '',
+    date: row['Date'] || row['date'] || '',
+    output: row['Output'] || row['output'] || '',
+  }));
+
+  // Sort by date descending
+  entries.sort((a, b) => {
+    if (!a.date && !b.date) return 0;
+    if (!a.date) return 1;
+    if (!b.date) return -1;
+    return new Date(b.date) - new Date(a.date);
+  });
+
+  return entries;
+}
+
+// ─── Build Research Data ────────────────────────────────────────────────────
+
+function buildResearch() {
+  console.log('Building research data...');
+  const researchDir = path.join(PROJECT_ROOT, 'research');
+  const files = [];
+  const grades = { confirmed: 0, secondary: 0, inference: 0, assumption: 0 };
+
+  function scanDir(dir, relBase) {
+    let entries;
+    try {
+      entries = fs.readdirSync(dir, { withFileTypes: true });
+    } catch (e) {
+      console.warn(`  WARN: Could not read directory ${dir}`);
+      return;
+    }
+    for (const entry of entries) {
+      const fullPath = path.join(dir, entry.name);
+      const relPath = path.join(relBase, entry.name);
+      if (entry.isDirectory()) {
+        scanDir(fullPath, relPath);
+      } else if (entry.name.endsWith('.md') && entry.name !== '.gitkeep') {
+        const content = fs.readFileSync(fullPath, 'utf-8');
+        const stat = fs.statSync(fullPath);
+
+        // Determine type from path
+        let type = 'other';
+        if (relPath.startsWith('competitors/') || relPath.startsWith('competitors\\')) type = 'competitor';
+        else if (relPath.startsWith('market/') || relPath.startsWith('market\\')) type = 'market';
+        else if (relPath.startsWith('technical/') || relPath.startsWith('technical\\')) type = 'technical';
+
+        // Entity name from filename slug
+        const entityName = path.basename(entry.name, '.md').replace(/[-_]/g, ' ');
+
+        // Check for TL;DR
+        const hasTldr = /## TL;DR|## tl;dr/i.test(content);
+
+        // Count evidence grades
+        const confirmed = (content.match(/\[CONFIRMED\]/g) || []).length;
+        const secondary = (content.match(/\[SECONDARY\]/g) || []).length;
+        const inference = (content.match(/\[INFERENCE\]/g) || []).length;
+        const assumption = (content.match(/\[ASSUMPTION\]/g) || []).length;
+
+        grades.confirmed += confirmed;
+        grades.secondary += secondary;
+        grades.inference += inference;
+        grades.assumption += assumption;
+
+        files.push({
+          filename: entry.name,
+          path: relPath,
+          type,
+          entityName,
+          hasTldr,
+          grades: { confirmed, secondary, inference, assumption },
+          lastModified: stat.mtime.toISOString(),
+        });
+      }
+    }
+  }
+
+  scanDir(researchDir, '');
+
+  // Identify gaps from memory/research.md capability map
+  const gaps = [];
+  const researchMd = readFile('memory/research.md');
+  if (researchMd) {
+    const tables = parseMarkdownTables(researchMd);
+    if (tables.length > 0) {
+      const entityNames = files.map(f => f.entityName.toLowerCase());
+      for (const row of tables[0].rows) {
+        // Check the first column as the entity identifier
+        const firstCol = Object.values(row)[0] || '';
+        if (firstCol && !entityNames.includes(firstCol.toLowerCase().replace(/[-_]/g, ' '))) {
+          gaps.push(firstCol);
+        }
+      }
+    }
+  }
+
+  return { files, grades, gaps };
+}
+
+// ─── Write Outputs ──────────────────────────────────────────────────────────
+
+function writeJSON(filename, data) {
+  const outPath = path.join(OUTPUT_DIR, filename);
+  fs.writeFileSync(outPath, JSON.stringify(data, null, 2));
+  console.log(`  ✓ ${filename} (${Array.isArray(data) ? data.length + ' items' : 'object'})`);
+}
+
+// ─── Main ───────────────────────────────────────────────────────────────────
+
+console.log(`\nBuilding dashboard data for project at ${PROJECT_ROOT}\n`);
+
+const overview = buildOverview();
+const entities = buildEntities();
+const competitors = buildCompetitors();
+const decisions = buildDecisions();
+const scoring = buildScoring();
+const timeline = buildTimeline();
+const research = buildResearch();
+
+writeJSON('overview.json', overview);
+writeJSON('entities.json', entities);
+writeJSON('competitors.json', competitors);
+writeJSON('decisions.json', decisions);
+writeJSON('scoring.json', scoring);
+writeJSON('timeline.json', timeline);
+writeJSON('research.json', research);
+
+console.log('\nDone.\n');

package/template/dashboard/competitors.html

@@ -0,0 +1,143 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="robots" content="noindex, nofollow">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <meta name="generator" content="DS Strategy Stack by DiffTheEnder (github.com/DiffTheEnder/DSS-Claude-Stack)">
+  <title>Competitors — {{PROJECT_NAME}}</title>
+  <link rel="preconnect" href="https://fonts.googleapis.com">
+  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+  <link href="https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Instrument+Serif&family=Syne:wght@600;700&display=swap" rel="stylesheet">
+  <script src="https://cdn.tailwindcss.com"></script>
+  <script>
+    tailwind.config = {
+      darkMode: 'class',
+      theme: { extend: {
+        colors: {
+          cream: { 50:"#F7F4EF",100:"#f5f2ed",200:"#efe9e0",300:"#e8e0d4",400:"#E3DDD4",white:"#FEFCF9" },
+          warmgray: { 100:"#f0ebe3",300:"#d4c8b8",400:"#9B9183",500:"#7D7265",600:"#5C5044",700:"#4a3c2e",900:"#2C2418" },
+          warmdark: { 950:"#1A1612",900:"#242018",800:"#2C2720",700:"#3A3530",600:"#4a3f32" },
+          accent: { 50:"#F2F7F5",100:"#E3EEEA",200:"#C5D9D4",400:"#2DB892",500:"#0E9C82",600:"#0E7C6B",700:"#0B6358",800:"#084C44",900:"#053B35" },
+        },
+        fontFamily: { sans:['DM Sans','system-ui','sans-serif'], serif:['Instrument Serif','Georgia','serif'], syne:['Syne','sans-serif'] }
+      }}
+    }
+  </script>
+  <link rel="stylesheet" href="css/styles.css">
+</head>
+<body class="bg-cream-50 dark:bg-warmdark-950 text-warmgray-900 dark:text-warmgray-100 min-h-screen flex">
+
+  <!-- Sidebar -->
+  <aside id="sidebar" class="sidebar flex flex-col shrink-0">
+    <a href="index.html" class="sidebar-brand" style="text-decoration:none;color:inherit">
+      <svg width="32" height="32" viewBox="0 0 32 32" fill="none">
+        <rect x="2" y="2" width="28" height="28" rx="8" stroke="rgba(255,255,255,0.15)" stroke-width="1.5"/>
+        <circle cx="16" cy="16" r="3" stroke="#2DB892" stroke-width="1.5"/>
+        <line x1="16" y1="6" x2="16" y2="12" stroke="#2DB892" stroke-width="1.5" stroke-linecap="round"/>
+        <line x1="16" y1="20" x2="16" y2="26" stroke="#2DB892" stroke-width="1.5" stroke-linecap="round"/>
+        <line x1="6" y1="16" x2="12" y2="16" stroke="#2DB892" stroke-width="1.5" stroke-linecap="round"/>
+        <line x1="20" y1="16" x2="26" y2="16" stroke="#2DB892" stroke-width="1.5" stroke-linecap="round"/>
+      </svg>
+      <div>
+        <div class="sidebar-title">{{PROJECT_NAME}}</div>
+        <div class="sidebar-subtitle">Strategy Dashboard</div>
+      </div>
+    </a>
+    <nav class="sidebar-nav">
+      <div class="sidebar-label">Core</div>
+      <a href="index.html" class="nav-link">
+        <svg class="nav-icon" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><circle cx="8" cy="8" r="6"/><path d="M8 5v3l2 2"/></svg>
+        Overview
+      </a>
+      <a href="pipeline.html" class="nav-link">
+        <svg class="nav-icon" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><path d="M2 4h12M2 8h8M2 12h5"/></svg>
+        Pipeline
+      </a>
+      <a href="competitors.html" class="nav-link">
+        <svg class="nav-icon" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><rect x="2" y="2" width="5" height="5" rx="1"/><rect x="9" y="2" width="5" height="5" rx="1"/><rect x="2" y="9" width="5" height="5" rx="1"/><rect x="9" y="9" width="5" height="5" rx="1"/></svg>
+        Competitors
+      </a>
+      <div class="sidebar-label" style="margin-top: 0.75rem">Strategy</div>
+      <a href="decisions.html" class="nav-link">
+        <svg class="nav-icon" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><path d="M8 2v12M2 8h12"/><circle cx="8" cy="8" r="6"/></svg>
+        Decisions
+      </a>
+      <a href="scoring.html" class="nav-link">
+        <svg class="nav-icon" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><path d="M3 13l3-4 3 2 4-6"/></svg>
+        Scoring
+      </a>
+      <a href="timeline.html" class="nav-link">
+        <svg class="nav-icon" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><path d="M2 3h12M2 8h12M2 13h12"/><circle cx="5" cy="3" r="1" fill="currentColor"/><circle cx="10" cy="8" r="1" fill="currentColor"/><circle cx="7" cy="13" r="1" fill="currentColor"/></svg>
+        Timeline
+      </a>
+      <a href="research.html" class="nav-link">
+        <svg class="nav-icon" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><circle cx="7" cy="7" r="5"/><path d="M11 11l3 3"/></svg>
+        Research Hub
+      </a>
+    </nav>
+    <div style="padding: 0.75rem; border-top: 1px solid rgba(255,248,240,0.06);">
+      <button id="dark-toggle" class="nav-link" style="width:100%; border:none; background:none; cursor:pointer">
+        <svg class="nav-icon" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><path d="M8 1a7 7 0 100 14 5 5 0 010-10"/></svg>Toggle Theme
+      </button>
+    </div>
+      <div style="padding: 0.5rem 0.75rem; border-top: 1px solid rgba(255,248,240,0.06); text-align: center;">
+      <a href="https://github.com/DiffTheEnder/DSS-Claude-Stack" target="_blank" rel="noopener" style="font-size: 0.65rem; color: rgba(155,145,131,0.5); text-decoration: none;">Powered by DS Strategy Stack</a>
+    </div>
+  </aside>
+
+  <!-- Main Content -->
+  <main class="flex-1 ml-[240px] p-8">
+    <header class="mb-8">
+      <h1 class="font-serif text-3xl mb-2">Competitive Landscape</h1>
+      <p class="text-warmgray-400 text-sm">Data from <code>memory/research.md</code> capability map</p>
+    </header>
+
+    <section class="bg-white dark:bg-warmdark-800 rounded-xl border border-cream-300 dark:border-warmdark-700 overflow-x-auto">
+      <table class="w-full text-sm">
+        <thead id="comp-head">
+          <!-- Populated by JS -->
+        </thead>
+        <tbody id="comp-body">
+          <!-- Populated by JS -->
+        </tbody>
+      </table>
+    </section>
+  </main>
+
+  <script src="js/app.js"></script>
+  <script>
+    // Competitors page logic — loads competitors.json
+    document.addEventListener('DOMContentLoaded', async () => {
+      initDarkMode();
+      initSidebar();
+      initNav();
+
+      try {
+        const competitors = await loadJSON('competitors.json');
+        const thead = document.getElementById('comp-head');
+        const tbody = document.getElementById('comp-body');
+
+        if (competitors.length === 0) {
+          tbody.innerHTML = '<tr><td colspan="5" class="p-6 text-center text-warmgray-400">No competitor data yet. Add entries to <code>memory/research.md</code> capability map.</td></tr>';
+          return;
+        }
+
+        // Build headers from first row keys
+        const keys = Object.keys(competitors[0]);
+        thead.innerHTML = '<tr class="border-b border-cream-300 dark:border-warmdark-700">' +
+          keys.map(k => `<th class="text-left p-3 font-semibold">${k}</th>`).join('') + '</tr>';
+
+        competitors.forEach(comp => {
+          const row = document.createElement('tr');
+          row.className = 'border-b border-cream-200 dark:border-warmdark-700 hover:bg-cream-100 dark:hover:bg-warmdark-700 transition-colors';
+          row.innerHTML = keys.map(k => `<td class="p-3">${comp[k] || '—'}</td>`).join('');
+          tbody.appendChild(row);
+        });
+      } catch (e) {
+        console.warn('Could not load competitor data:', e.message);
+      }
+    });
+  </script>
+</body>
+</html>

package/template/dashboard/css/styles.css

@@ -0,0 +1,143 @@
+/* ═══════════════════════════════════════════════
+   Strategy Dashboard — Design System
+   Warm cream/teal editorial palette
+   ═══════════════════════════════════════════════ */
+
+/* ── Sidebar ── */
+.sidebar {
+  width: 240px;
+  height: 100vh;
+  background: #1C1713;
+  position: fixed;
+  top: 0;
+  left: 0;
+  overflow-y: auto;
+  transition: transform 0.2s;
+  z-index: 30;
+}
+.sidebar::after {
+  content: '';
+  position: absolute;
+  inset: 0;
+  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.03'/%3E%3C/svg%3E");
+  background-size: 128px 128px;
+  pointer-events: none;
+  z-index: 1;
+}
+.sidebar > * { position: relative; z-index: 2; }
+.sidebar-brand {
+  display: flex;
+  align-items: center;
+  padding: 1.25rem;
+  gap: 0.75rem;
+  border-bottom: 1px solid rgba(255,248,240,0.06);
+}
+.sidebar-title {
+  font-family: 'Syne', sans-serif;
+  font-size: 1rem;
+  font-weight: 700;
+  color: white;
+  letter-spacing: 0.01em;
+  line-height: 1.2;
+}
+.sidebar-subtitle {
+  font-size: 0.6rem;
+  text-transform: uppercase;
+  letter-spacing: 0.1em;
+  color: rgba(255,248,240,0.45);
+}
+.sidebar-nav {
+  flex: 1;
+  padding: 0.75rem;
+  overflow-y: auto;
+}
+.sidebar-label {
+  font-size: 0.6rem;
+  text-transform: uppercase;
+  letter-spacing: 0.1em;
+  color: rgba(255,248,240,0.40);
+  padding-left: 0.75rem;
+  margin-top: 1.25rem;
+  margin-bottom: 0.25rem;
+}
+.sidebar-label:first-child { margin-top: 0; }
+.nav-link {
+  font-size: 0.8125rem;
+  display: flex;
+  align-items: center;
+  gap: 0.625rem;
+  padding: 0.5rem 0.75rem;
+  border-radius: 0.375rem;
+  color: rgba(255,248,240,0.70);
+  transition: background 0.15s, color 0.15s;
+  position: relative;
+  text-decoration: none;
+}
+.nav-link:hover {
+  background: rgba(255,248,240,0.05);
+  color: rgba(255,248,240,0.85);
+}
+.nav-link.active {
+  background: rgba(14,124,107,0.12);
+  color: white;
+}
+.nav-link.active::before {
+  content: '';
+  position: absolute;
+  left: 0;
+  top: 0.375rem;
+  bottom: 0.375rem;
+  width: 2px;
+  border-radius: 1px;
+  background: #2DB892;
+}
+.nav-icon {
+  width: 16px;
+  height: 16px;
+  flex-shrink: 0;
+}
+
+/* ── Kill Condition Cards ── */
+.kc-card {
+  background: white;
+  border: 1px solid #e8e0d4;
+  border-radius: 0.75rem;
+  padding: 1.25rem;
+  transition: box-shadow 0.2s;
+}
+.dark .kc-card {
+  background: #2C2720;
+  border-color: #3A3530;
+}
+.kc-card:hover {
+  box-shadow: 0 4px 12px rgba(0,0,0,0.06);
+}
+.kc-badge {
+  display: inline-block;
+  padding: 0.125rem 0.5rem;
+  border-radius: 0.25rem;
+  font-size: 0.6875rem;
+  font-weight: 600;
+  text-transform: uppercase;
+  letter-spacing: 0.03em;
+}
+.kc-untested { background: #f0ebe3; color: #7D7265; }
+.kc-early-signal { background: #FEF3C7; color: #92400E; }
+.kc-building { background: #DBEAFE; color: #1E40AF; }
+.kc-weakening { background: #FEE2E2; color: #991B1B; }
+.kc-passed { background: #D1FAE5; color: #065F46; }
+.kc-failed { background: #FEE2E2; color: #991B1B; }
+
+.dark .kc-untested { background: rgba(125,114,101,0.2); color: #d4c8b8; }
+.dark .kc-early-signal { background: rgba(245,158,11,0.15); color: #fbbf24; }
+.dark .kc-building { background: rgba(59,130,246,0.15); color: #93C5FD; }
+.dark .kc-weakening { background: rgba(239,68,68,0.15); color: #FCA5A5; }
+.dark .kc-passed { background: rgba(16,185,129,0.15); color: #6EE7B7; }
+.dark .kc-failed { background: rgba(239,68,68,0.15); color: #FCA5A5; }
+
+/* ── Responsive ── */
+@media (max-width: 768px) {
+  .sidebar { transform: translateX(-100%); }
+  .sidebar.open { transform: translateX(0); }
+  main { margin-left: 0 !important; }
+}