@vibecheckai/cli 3.1.8 → 3.2.0

package/bin/runners/lib/scan-output.js

@@ -1,10 +1,11 @@
 /**
- * Scan Output - Premium Scan Results Display
+ * Scan Output - World-Class Premium Terminal Display
  * 
- * Handles all scan output formatting:
- * - Layer status display
- * - Findings grouped by category
- * - Coverage maps
+ * Features:
+ * - Beautiful ASCII tables with box drawing
+ * - Color-coded severity with gradients
+ * - Progress bars and sparklines
+ * - Category breakdown with visual hierarchy
  * - JSON/SARIF export
  */
 
@@ -24,195 +25,248 @@ const {
 } = require('./terminal-ui');
 
 // ═══════════════════════════════════════════════════════════════════════════════
-// LAYER STATUS DISPLAY
+// ENHANCED COLOR PALETTE
 // ═══════════════════════════════════════════════════════════════════════════════
 
-function renderLayers(layers) {
-  const lines = [];
-  lines.push(renderSection('ANALYSIS LAYERS', '⚡'));
-  lines.push('');
-  
-  const layerConfig = {
-    ast: { name: 'AST Analysis', icon: '🔍', desc: 'Static code parsing' },
-    truth: { name: 'Build Truth', icon: '📦', desc: 'Manifest verification' },
-    reality: { name: 'Reality Check', icon: '🎭', desc: 'Playwright runtime' },
-    realitySniff: { name: 'Reality Sniff', icon: '🔬', desc: 'AI artifact detection' },
-    detection: { name: 'Detection Engines', icon: '🛡️', desc: 'Security patterns' },
-  };
-  
-  for (const layer of layers) {
-    const config = layerConfig[layer.name] || { name: layer.name, icon: '○', desc: '' };
-    
-    let status, statusColor;
-    if (layer.skipped) {
-      status = `${ansi.dim}○ skipped${ansi.reset}`;
-    } else if (layer.error) {
-      status = `${colors.error}${icons.error} error${ansi.reset}`;
-    } else {
-      status = `${colors.success}${icons.success}${ansi.reset}`;
-    }
-    
-    const duration = layer.duration ? `${ansi.dim}${layer.duration}ms${ansi.reset}` : '';
-    const findings = layer.findings !== undefined ? `${colors.accent}${layer.findings}${ansi.reset} ${ansi.dim}findings${ansi.reset}` : '';
-    
-    lines.push(`  ${status} ${config.icon} ${config.name.padEnd(20)} ${duration.padEnd(15)} ${findings}`);
-  }
-  
-  return lines.join('\n');
-}
+const palette = {
+  // Severity gradient
+  critical: ansi.rgb(255, 50, 50),
+  criticalBg: ansi.bgRgb(180, 20, 20),
+  high: ansi.rgb(255, 120, 50),
+  highBg: ansi.bgRgb(180, 80, 20),
+  medium: ansi.rgb(255, 200, 50),
+  mediumBg: ansi.bgRgb(150, 120, 20),
+  low: ansi.rgb(100, 180, 255),
+  lowBg: ansi.bgRgb(40, 80, 150),
+  
+  // Status colors
+  pass: ansi.rgb(50, 255, 120),
+  passBg: ansi.bgRgb(20, 120, 50),
+  warn: ansi.rgb(255, 200, 50),
+  warnBg: ansi.bgRgb(150, 120, 20),
+  fail: ansi.rgb(255, 50, 50),
+  failBg: ansi.bgRgb(180, 20, 20),
+  
+  // UI elements
+  border: ansi.rgb(70, 70, 90),
+  borderBright: ansi.rgb(100, 100, 130),
+  header: ansi.rgb(150, 150, 200),
+  muted: ansi.rgb(100, 100, 120),
+  accent: ansi.rgb(100, 200, 255),
+  highlight: ansi.rgb(255, 220, 100),
+  
+  // Category colors (rainbow)
+  cat1: ansi.rgb(255, 100, 100),
+  cat2: ansi.rgb(255, 150, 100),
+  cat3: ansi.rgb(255, 200, 100),
+  cat4: ansi.rgb(200, 255, 100),
+  cat5: ansi.rgb(100, 255, 150),
+  cat6: ansi.rgb(100, 255, 200),
+  cat7: ansi.rgb(100, 200, 255),
+  cat8: ansi.rgb(100, 150, 255),
+  cat9: ansi.rgb(150, 100, 255),
+  cat10: ansi.rgb(200, 100, 255),
+  cat11: ansi.rgb(255, 100, 200),
+  cat12: ansi.rgb(255, 100, 150),
+};
 
 // ═══════════════════════════════════════════════════════════════════════════════
-// COVERAGE MAP DISPLAY
+// BOX DRAWING HELPERS
 // ═══════════════════════════════════════════════════════════════════════════════
 
-function renderCoverageMap(coverage) {
-  if (!coverage) return '';
-  
-  const lines = [];
-  lines.push(renderSection('ROUTE COVERAGE', '🗺️'));
-  lines.push('');
-  
-  const pct = coverage.coveragePercent || 0;
-  const color = pct >= 80 ? colors.success : pct >= 60 ? colors.warning : colors.error;
-  
-  // Coverage bar
-  const barWidth = 50;
-  const filled = Math.round((pct / 100) * barWidth);
-  const bar = `${color}${'█'.repeat(filled)}${ansi.dim}${'░'.repeat(barWidth - filled)}${ansi.reset}`;
-  
-  lines.push(`  ${color}${ansi.bold}${pct}%${ansi.reset} ${ansi.dim}of routes reachable from${ansi.reset} ${colors.accent}/${ansi.reset}`);
-  lines.push(`  ${bar}`);
-  lines.push('');
-  
-  // Stats
-  const stats = [
-    ['Total Routes', coverage.totalRoutes || 0],
-    ['Reachable', coverage.reachableFromRoot || 0],
-    ['Orphaned', coverage.orphanedRoutes || 0],
-    ['Dead Links', coverage.deadLinks || 0],
-  ];
-  
-  for (const [label, value] of stats) {
-    const valueColor = label === 'Orphaned' || label === 'Dead Links' 
-      ? (value > 0 ? colors.error : colors.success)
-      : ansi.reset;
-    lines.push(`  ${ansi.dim}${label}:${ansi.reset} ${valueColor}${ansi.bold}${value}${ansi.reset}`);
-  }
-  
-  // Isolated clusters
-  if (coverage.isolatedClusters?.length > 0) {
-    lines.push('');
-    lines.push(`  ${colors.warning}${icons.warning}${ansi.reset} ${ansi.dim}Isolated clusters:${ansi.reset}`);
-    for (const cluster of coverage.isolatedClusters.slice(0, 3)) {
-      const auth = cluster.requiresAuth ? ` ${ansi.dim}(auth required)${ansi.reset}` : '';
-      lines.push(`    ${ansi.dim}├─${ansi.reset} ${ansi.bold}${cluster.name}${ansi.reset}${auth} ${ansi.dim}(${cluster.nodeIds?.length || 0} routes)${ansi.reset}`);
-    }
-    if (coverage.isolatedClusters.length > 3) {
-      lines.push(`    ${ansi.dim}└─ ... and ${coverage.isolatedClusters.length - 3} more clusters${ansi.reset}`);
-    }
-  }
-  
-  // Unreachable routes
-  if (coverage.unreachableRoutes?.length > 0) {
-    lines.push('');
-    lines.push(`  ${colors.error}${icons.error}${ansi.reset} ${ansi.dim}Unreachable routes:${ansi.reset}`);
-    for (const route of coverage.unreachableRoutes.slice(0, 5)) {
-      lines.push(`    ${ansi.dim}├─${ansi.reset} ${colors.error}${route}${ansi.reset}`);
-    }
-    if (coverage.unreachableRoutes.length > 5) {
-      lines.push(`    ${ansi.dim}└─ ... and ${coverage.unreachableRoutes.length - 5} more${ansi.reset}`);
-    }
-  }
-  
-  return lines.join('\n');
+const B = {
+  // Heavy box
+  tl: '┏', tr: '┓', bl: '┗', br: '┛',
+  h: '━', v: '┃',
+  lT: '┣', rT: '┫', tT: '┳', bT: '┻', x: '╋',
+  
+  // Light box
+  ltl: '┌', ltr: '┐', lbl: '└', lbr: '┘',
+  lh: '─', lv: '│',
+  
+  // Double box
+  dtl: '╔', dtr: '╗', dbl: '╚', dbr: '╝',
+  dh: '═', dv: '║',
+  
+  // Rounded
+  rtl: '╭', rtr: '╮', rbl: '╰', rbr: '╯',
+  
+  // Blocks
+  full: '█', light: '░', medium: '▒', dark: '▓',
+  left: '▌', right: '▐', top: '▀', bottom: '▄',
+  
+  // Progress
+  pb: ['░', '▒', '▓', '█'],
+  spark: ['▁', '▂', '▃', '▄', '▅', '▆', '▇', '█'],
+};
+
+function repeatChar(char, n) {
+  return char.repeat(Math.max(0, n));
+}
+
+function padCenter(str, width) {
+  const len = stripAnsi(str).length;
+  const left = Math.floor((width - len) / 2);
+  const right = width - len - left;
+  return ' '.repeat(left) + str + ' '.repeat(right);
+}
+
+function stripAnsi(str) {
+  return str.replace(/\x1b\[[0-9;]*m/g, '');
 }
 
 // ═══════════════════════════════════════════════════════════════════════════════
-// BREAKDOWN DISPLAY
+// PREMIUM SCORE DISPLAY
 // ═══════════════════════════════════════════════════════════════════════════════
 
-function renderBreakdown(breakdown) {
-  if (!breakdown) return '';
-  
+function renderPremiumScoreCard(score, options = {}) {
+  const { verdict = 'BLOCK', findings = {}, duration, cached } = options;
   const lines = [];
-  lines.push(renderSection('SCORE BREAKDOWN', '📊'));
-  lines.push('');
   
-  const items = [
-    { key: 'deadLinks', label: 'Dead Links', icon: '🔗' },
-    { key: 'orphanRoutes', label: 'Orphan Routes', icon: '👻' },
-    { key: 'runtimeFailures', label: 'Runtime 404s', icon: '💥' },
-    { key: 'unresolvedDynamic', label: 'Unresolved Dynamic', icon: '❓' },
-    { key: 'placeholders', label: 'Placeholders', icon: '📝' },
-    { key: 'secretsExposed', label: 'Secrets Exposed', icon: '🔐' },
-    { key: 'authBypass', label: 'Auth Bypass', icon: '🚪' },
-    { key: 'mockData', label: 'Mock Data', icon: '🎭' },
-  ];
+  const width = 70;
+  const innerWidth = width - 4;
+  
+  // Determine colors based on verdict/score
+  let verdictColor, verdictBg, gradientColors;
+  if (verdict === 'SHIP' || verdict === 'PASS' || score >= 80) {
+    verdictColor = palette.pass;
+    verdictBg = palette.passBg;
+    gradientColors = [ansi.rgb(50, 200, 100), ansi.rgb(100, 255, 150), ansi.rgb(150, 255, 200)];
+  } else if (verdict === 'WARN' || score >= 50) {
+    verdictColor = palette.warn;
+    verdictBg = palette.warnBg;
+    gradientColors = [ansi.rgb(200, 150, 50), ansi.rgb(255, 200, 100), ansi.rgb(255, 220, 150)];
+  } else {
+    verdictColor = palette.fail;
+    verdictBg = palette.failBg;
+    gradientColors = [ansi.rgb(200, 50, 50), ansi.rgb(255, 100, 100), ansi.rgb(255, 150, 150)];
+  }
   
-  for (const item of items) {
-    const data = breakdown[item.key];
-    if (!data && data !== 0) continue;
-    
-    const count = typeof data === 'object' ? data.count : data;
-    const penalty = typeof data === 'object' ? data.penalty : 0;
-    
-    const status = count === 0 ? `${colors.success}${icons.success}${ansi.reset}` : `${colors.error}${icons.error}${ansi.reset}`;
-    const countColor = count === 0 ? colors.success : colors.error;
-    const penaltyStr = penalty > 0 ? `${ansi.dim}-${penalty} pts${ansi.reset}` : `${ansi.dim}  ---${ansi.reset}`;
-    
-    lines.push(`  ${status} ${item.icon} ${item.label.padEnd(22)} ${countColor}${ansi.bold}${String(count).padStart(3)}${ansi.reset}  ${penaltyStr}`);
+  // Top border with gradient
+  lines.push('');
+  lines.push(`  ${palette.border}${B.dtl}${B.dh.repeat(width - 2)}${B.dtr}${ansi.reset}`);
+  
+  // Score display
+  const scoreStr = String(score).padStart(3);
+  const gradeStr = score >= 90 ? 'A' : score >= 80 ? 'B' : score >= 70 ? 'C' : score >= 60 ? 'D' : 'F';
+  const gradeColor = score >= 80 ? palette.pass : score >= 60 ? palette.warn : palette.fail;
+  
+  lines.push(`  ${palette.border}${B.dv}${ansi.reset}${' '.repeat(innerWidth)}${palette.border}${B.dv}${ansi.reset}`);
+  
+  // Big score
+  const scoreLine = `${palette.muted}SCORE${ansi.reset}  ${verdictColor}${ansi.bold}${scoreStr}${ansi.reset}${palette.muted}/100${ansi.reset}        ${palette.muted}GRADE${ansi.reset}  ${gradeColor}${ansi.bold}${gradeStr}${ansi.reset}`;
+  lines.push(`  ${palette.border}${B.dv}${ansi.reset}    ${scoreLine}${' '.repeat(14)}${palette.border}${B.dv}${ansi.reset}`);
+  
+  lines.push(`  ${palette.border}${B.dv}${ansi.reset}${' '.repeat(innerWidth)}${palette.border}${B.dv}${ansi.reset}`);
+  
+  // Progress bar
+  const barWidth = 40;
+  const filled = Math.round((score / 100) * barWidth);
+  let progressBar = '';
+  for (let i = 0; i < barWidth; i++) {
+    if (i < filled) {
+      // Gradient fill
+      const gradientIdx = Math.floor((i / filled) * gradientColors.length);
+      progressBar += `${gradientColors[Math.min(gradientIdx, gradientColors.length - 1)]}${B.full}${ansi.reset}`;
+    } else {
+      progressBar += `${palette.muted}${B.light}${ansi.reset}`;
+    }
+  }
+  lines.push(`  ${palette.border}${B.dv}${ansi.reset}    ${progressBar}${' '.repeat(innerWidth - barWidth - 4)}${palette.border}${B.dv}${ansi.reset}`);
+  
+  lines.push(`  ${palette.border}${B.dv}${ansi.reset}${' '.repeat(innerWidth)}${palette.border}${B.dv}${ansi.reset}`);
+  
+  // Verdict badge
+  const verdictText = verdict === 'SHIP' ? '  ✓ SHIP  ' : verdict === 'WARN' ? ' ⚠ WARN  ' : '  ✗ BLOCK ';
+  const verdictDesc = verdict === 'SHIP' ? 'Ready to ship!' : verdict === 'WARN' ? 'Review before shipping' : 'Fix issues before shipping';
+  const badgeLine = `${verdictBg}${ansi.bold}${verdictText}${ansi.reset}             ${palette.muted}${verdictDesc}${ansi.reset}`;
+  lines.push(`  ${palette.border}${B.dv}${ansi.reset}                    ${badgeLine}  ${palette.border}${B.dv}${ansi.reset}`);
+  
+  lines.push(`  ${palette.border}${B.dv}${ansi.reset}${' '.repeat(innerWidth)}${palette.border}${B.dv}${ansi.reset}`);
+  
+  // Findings summary
+  const { critical = 0, high = 0, medium = 0, low = 0 } = findings;
+  const critStr = `${palette.critical}${critical}${ansi.reset} critical`;
+  const highStr = `${palette.high}${high}${ansi.reset} high`;
+  const medStr = `${palette.medium}${medium}${ansi.reset} medium`;
+  const lowStr = `${palette.low}${low}${ansi.reset} low`;
+  const findingsLine = `    ${critStr}  ${palette.muted}│${ansi.reset}  ${highStr}  ${palette.muted}│${ansi.reset}  ${medStr}  ${palette.muted}│${ansi.reset}  ${lowStr}`;
+  lines.push(`  ${palette.border}${B.dv}${ansi.reset}${findingsLine}${' '.repeat(9)}${palette.border}${B.dv}${ansi.reset}`);
+  
+  lines.push(`  ${palette.border}${B.dv}${ansi.reset}${' '.repeat(innerWidth)}${palette.border}${B.dv}${ansi.reset}`);
+  
+  // Duration
+  if (duration) {
+    const durationStr = `${palette.muted}Completed in ${formatDuration(duration)}${cached ? ' (cached)' : ''}${ansi.reset}`;
+    lines.push(`  ${palette.border}${B.dv}${ansi.reset}    ${durationStr}${' '.repeat(innerWidth - stripAnsi(durationStr).length - 4)}${palette.border}${B.dv}${ansi.reset}`);
+    lines.push(`  ${palette.border}${B.dv}${ansi.reset}${' '.repeat(innerWidth)}${palette.border}${B.dv}${ansi.reset}`);
   }
   
+  // Bottom border
+  lines.push(`  ${palette.border}${B.dbl}${B.dh.repeat(width - 2)}${B.dbr}${ansi.reset}`);
+  
   return lines.join('\n');
 }
 
 // ═══════════════════════════════════════════════════════════════════════════════
-// BLOCKERS DISPLAY
+// BLOCKERS TABLE
 // ═══════════════════════════════════════════════════════════════════════════════
 
-function renderBlockers(blockers, options = {}) {
-  const { maxItems = 8 } = options;
+function renderBlockersTable(blockers, options = {}) {
+  const { maxItems = 10 } = options;
   
   if (!blockers || blockers.length === 0) {
     const lines = [];
-    lines.push(renderSection('SHIP BLOCKERS', '🚀'));
     lines.push('');
-    lines.push(`  ${colors.success}${ansi.bold}${icons.success} No blockers! You're clear to ship.${ansi.reset}`);
+    lines.push(`  ${palette.pass}${ansi.bold}✓ NO BLOCKERS${ansi.reset} ${palette.muted}— Your code is ready to ship!${ansi.reset}`);
     return lines.join('\n');
   }
   
   const lines = [];
-  lines.push(renderSection(`SHIP BLOCKERS (${blockers.length})`, '🚨'));
+  const width = 70;
+  
+  lines.push('');
+  lines.push(`  ${palette.critical}${ansi.bold}🚨 SHIP BLOCKERS (${blockers.length})${ansi.reset}`);
+  lines.push(`  ${palette.border}${B.lh.repeat(width - 4)}${ansi.reset}`);
   lines.push('');
   
-  for (const blocker of blockers.slice(0, maxItems)) {
+  for (let i = 0; i < Math.min(blockers.length, maxItems); i++) {
+    const blocker = blockers[i];
     const sevColor = blocker.severity === 'critical' || blocker.severity === 'BLOCK' 
-      ? colors.bg.error 
-      : colors.bg.warning;
+      ? palette.criticalBg 
+      : palette.highBg;
     const sevLabel = blocker.severity === 'critical' || blocker.severity === 'BLOCK'
-      ? 'CRITICAL'
-      : '  HIGH  ';
+      ? ' BLOCK '
+      : ' HIGH  ';
     
-    lines.push(`  ${sevColor}${ansi.bold} ${sevLabel} ${ansi.reset} ${ansi.bold}${truncate(blocker.title || blocker.message, 45)}${ansi.reset}`);
+    // Row number
+    const num = `${palette.muted}${String(i + 1).padStart(2)}.${ansi.reset}`;
     
-    if (blocker.description) {
-      lines.push(`             ${ansi.dim}${truncate(blocker.description, 55)}${ansi.reset}`);
-    }
+    // Severity badge
+    const badge = `${sevColor}${ansi.bold}${sevLabel}${ansi.reset}`;
+    
+    // Title (truncated)
+    const title = truncate(blocker.title || blocker.message || 'Unknown issue', 48);
     
+    lines.push(`  ${num} ${badge} ${ansi.bold}${title}${ansi.reset}`);
+    
+    // File location
     if (blocker.file) {
       const fileDisplay = blocker.file + (blocker.line ? `:${blocker.line}` : '');
-      lines.push(`             ${colors.accent}${truncate(fileDisplay, 50)}${ansi.reset}`);
+      lines.push(`      ${palette.muted}└─${ansi.reset} ${palette.accent}${truncate(fileDisplay, 55)}${ansi.reset}`);
     }
     
-    if (blocker.fix || blocker.fixSuggestion) {
-      lines.push(`             ${colors.success}→ ${truncate(blocker.fix || blocker.fixSuggestion, 50)}${ansi.reset}`);
+    // Evidence/why
+    if (blocker.description || blocker.why) {
+      const desc = truncate(blocker.description || blocker.why, 55);
+      lines.push(`         ${palette.muted}${desc}${ansi.reset}`);
     }
     
     lines.push('');
   }
   
   if (blockers.length > maxItems) {
-    lines.push(`  ${ansi.dim}... and ${blockers.length - maxItems} more blockers${ansi.reset}`);
+    lines.push(`  ${palette.muted}... and ${blockers.length - maxItems} more blockers${ansi.reset}`);
     lines.push('');
   }
   
@@ -220,20 +274,23 @@ function renderBlockers(blockers, options = {}) {
 }
 
 // ═══════════════════════════════════════════════════════════════════════════════
-// CATEGORY SUMMARY
+// CATEGORY TABLE WITH VISUAL BARS
 // ═══════════════════════════════════════════════════════════════════════════════
 
-function renderCategorySummary(findings) {
+function renderCategoryTable(findings) {
   if (!findings || findings.length === 0) return '';
   
   // Group by category
   const categories = {};
+  let maxTotal = 0;
+  
   for (const f of findings) {
-    const cat = f.category || f.ruleId?.split('/')[0] || 'other';
+    const cat = f.category || f.ruleId?.split('/')[0] || 'Other';
     if (!categories[cat]) {
       categories[cat] = { critical: 0, high: 0, medium: 0, low: 0, total: 0 };
     }
     categories[cat].total++;
+    maxTotal = Math.max(maxTotal, categories[cat].total);
     
     const sev = (f.severity || '').toLowerCase();
     if (sev === 'critical' || sev === 'block') categories[cat].critical++;
@@ -242,46 +299,277 @@ function renderCategorySummary(findings) {
     else categories[cat].low++;
   }
   
+  const categoryIcons = {
+    ENVCONTRACT: '📋', MISSINGROUTE: '🔗', HARDCODEDSECRET: '🔑', TODOFIXME: '📝',
+    FAKESUCCESS: '✨', GHOSTAUTH: '👻', MOCKDATA: '🎭', CONSOLELOG: '🖥️',
+    DEADCODE: '💀', DEPRECATEDAPI: '⚠️', EMPTYCATCH: '🕳️', UNSAFEREGEX: '⚡',
+    SECURITY: '🛡️', BILLING: '💳', ROUTE: '🔗', AUTH: '🔐', SECRET: '🔑',
+  };
+  
+  const categoryColors = [
+    palette.cat1, palette.cat2, palette.cat3, palette.cat4, palette.cat5,
+    palette.cat6, palette.cat7, palette.cat8, palette.cat9, palette.cat10,
+    palette.cat11, palette.cat12,
+  ];
+  
   const lines = [];
-  lines.push(renderSection('FINDINGS BY CATEGORY', '📁'));
+  const width = 70;
+  
+  lines.push('');
+  lines.push(`  ${palette.header}${ansi.bold}📊 FINDINGS BY CATEGORY${ansi.reset}`);
+  lines.push(`  ${palette.border}${B.lh.repeat(width - 4)}${ansi.reset}`);
   lines.push('');
   
-  const categoryIcons = {
-    ROUTE: '🔗',
-    AUTH: '🔐',
-    SECRET: '🔑',
-    BILLING: '💳',
-    MOCK: '🎭',
-    DEAD_UI: '👻',
-    FAKE_SUCCESS: '✨',
-    REALITY: '🔬',
-    QUALITY: '📋',
-    CONFIG: '⚙️',
-  };
+  // Table header
+  lines.push(`  ${palette.muted}  CATEGORY          COUNT    SEVERITY BREAKDOWN              BAR${ansi.reset}`);
+  lines.push(`  ${palette.border}${B.lh.repeat(width - 4)}${ansi.reset}`);
   
+  // Sort by total count descending
   const sortedCategories = Object.entries(categories)
     .sort((a, b) => {
-      // Sort by criticality: critical > high > medium > low
-      const aCrit = a[1].critical * 1000 + a[1].high * 100 + a[1].medium * 10;
-      const bCrit = b[1].critical * 1000 + b[1].high * 100 + b[1].medium * 10;
+      // Sort by criticality first, then by total
+      const aCrit = a[1].critical * 1000 + a[1].high * 100 + a[1].total;
+      const bCrit = b[1].critical * 1000 + b[1].high * 100 + b[1].total;
       return bCrit - aCrit;
     });
   
+  let colorIdx = 0;
   for (const [cat, counts] of sortedCategories) {
     const icon = categoryIcons[cat.toUpperCase()] || '•';
-    const critStr = counts.critical > 0 ? `${colors.critical}${counts.critical}C${ansi.reset} ` : '';
-    const highStr = counts.high > 0 ? `${colors.high}${counts.high}H${ansi.reset} ` : '';
-    const medStr = counts.medium > 0 ? `${colors.medium}${counts.medium}M${ansi.reset} ` : '';
-    const lowStr = counts.low > 0 ? `${colors.low}${counts.low}L${ansi.reset}` : '';
+    const catColor = categoryColors[colorIdx % categoryColors.length];
+    colorIdx++;
+    
+    // Category name
+    const catName = truncate(cat, 15).padEnd(15);
+    
+    // Count
+    const countStr = String(counts.total).padStart(4);
+    
+    // Severity breakdown
+    const critStr = counts.critical > 0 ? `${palette.critical}${counts.critical}C${ansi.reset}` : `${palette.muted}--${ansi.reset}`;
+    const highStr = counts.high > 0 ? `${palette.high}${counts.high}H${ansi.reset}` : `${palette.muted}--${ansi.reset}`;
+    const medStr = counts.medium > 0 ? `${palette.medium}${counts.medium}M${ansi.reset}` : `${palette.muted}--${ansi.reset}`;
+    const lowStr = counts.low > 0 ? `${palette.low}${counts.low}L${ansi.reset}` : `${palette.muted}--${ansi.reset}`;
     
-    lines.push(`  ${icon} ${cat.padEnd(15)} ${ansi.dim}${String(counts.total).padStart(3)} total${ansi.reset}  ${critStr}${highStr}${medStr}${lowStr}`);
+    // Visual bar
+    const barWidth = 15;
+    const barFill = Math.round((counts.total / maxTotal) * barWidth);
+    let bar = '';
+    for (let i = 0; i < barWidth; i++) {
+      if (i < barFill) {
+        bar += `${catColor}${B.full}${ansi.reset}`;
+      } else {
+        bar += `${palette.muted}${B.light}${ansi.reset}`;
+      }
+    }
+    
+    lines.push(`  ${icon} ${catColor}${catName}${ansi.reset} ${ansi.bold}${countStr}${ansi.reset}    ${critStr} ${highStr} ${medStr} ${lowStr}  ${bar}`);
   }
   
+  lines.push(`  ${palette.border}${B.lh.repeat(width - 4)}${ansi.reset}`);
+  
+  // Total
+  const totalCount = findings.length;
+  const totalCrit = findings.filter(f => f.severity === 'critical' || f.severity === 'BLOCK').length;
+  const totalHigh = findings.filter(f => f.severity === 'high').length;
+  const totalMed = findings.filter(f => f.severity === 'medium' || f.severity === 'WARN' || f.severity === 'warning').length;
+  const totalLow = findings.filter(f => f.severity === 'low' || f.severity === 'INFO').length;
+  
+  lines.push(`  ${palette.muted}  TOTAL${ansi.reset}           ${ansi.bold}${String(totalCount).padStart(4)}${ansi.reset}    ${palette.critical}${totalCrit}C${ansi.reset} ${palette.high}${totalHigh}H${ansi.reset} ${palette.medium}${totalMed}M${ansi.reset} ${palette.low}${totalLow}L${ansi.reset}`);
+  
   return lines.join('\n');
 }
 
 // ═══════════════════════════════════════════════════════════════════════════════
-// FULL SCAN OUTPUT
+// TOP FINDINGS DETAILS
+// ═══════════════════════════════════════════════════════════════════════════════
+
+function renderTopFindings(findings, options = {}) {
+  const { maxItems = 5, showFix = true } = options;
+  
+  if (!findings || findings.length === 0) return '';
+  
+  // Get top critical/high findings
+  const topFindings = findings
+    .filter(f => f.severity === 'critical' || f.severity === 'BLOCK' || f.severity === 'high')
+    .slice(0, maxItems);
+  
+  if (topFindings.length === 0) return '';
+  
+  const lines = [];
+  const width = 70;
+  
+  lines.push('');
+  lines.push(`  ${palette.header}${ansi.bold}🔍 TOP ISSUES TO FIX${ansi.reset}`);
+  lines.push(`  ${palette.border}${B.lh.repeat(width - 4)}${ansi.reset}`);
+  
+  for (let i = 0; i < topFindings.length; i++) {
+    const f = topFindings[i];
+    const num = `${palette.accent}${i + 1}${ansi.reset}`;
+    const icon = f.severity === 'critical' || f.severity === 'BLOCK' ? '🔴' : '🟠';
+    
+    lines.push('');
+    lines.push(`  ${num}. ${icon} ${ansi.bold}${truncate(f.title || f.message, 55)}${ansi.reset}`);
+    
+    if (f.file) {
+      lines.push(`     ${palette.accent}${f.file}${f.line ? `:${f.line}` : ''}${ansi.reset}`);
+    }
+    
+    if (f.description || f.why) {
+      lines.push(`     ${palette.muted}${truncate(f.description || f.why, 60)}${ansi.reset}`);
+    }
+    
+    if (showFix && (f.fix || f.fixHints?.[0])) {
+      const fixHint = f.fix || f.fixHints?.[0];
+      lines.push(`     ${palette.pass}→ ${truncate(fixHint, 58)}${ansi.reset}`);
+    }
+  }
+  
+  return lines.join('\n');
+}
+
+// ═══════════════════════════════════════════════════════════════════════════════
+// ANALYSIS LAYERS STATUS
+// ═══════════════════════════════════════════════════════════════════════════════
+
+function renderLayers(layers) {
+  if (!layers || layers.length === 0) return '';
+  
+  const lines = [];
+  const width = 70;
+  
+  lines.push('');
+  lines.push(`  ${palette.header}${ansi.bold}⚡ ANALYSIS LAYERS${ansi.reset}`);
+  lines.push(`  ${palette.border}${B.lh.repeat(width - 4)}${ansi.reset}`);
+  lines.push('');
+  
+  const layerConfig = {
+    ast: { name: 'AST Analysis', icon: '🔍', desc: 'Static code parsing' },
+    truth: { name: 'Build Truth', icon: '📦', desc: 'Manifest verification' },
+    reality: { name: 'Reality Check', icon: '🎭', desc: 'Runtime testing' },
+    realitySniff: { name: 'Reality Sniff', icon: '🔬', desc: 'AI artifact detection' },
+    detection: { name: 'Detection', icon: '🛡️', desc: 'Security patterns' },
+    codeQuality: { name: 'Code Quality', icon: '📋', desc: 'TODO, MOCK, console.log' },
+  };
+  
+  for (const layer of layers) {
+    const config = layerConfig[layer.name] || { name: layer.name, icon: '○', desc: '' };
+    
+    let status, statusIcon;
+    if (layer.skipped) {
+      status = `${palette.muted}skipped${ansi.reset}`;
+      statusIcon = `${palette.muted}○${ansi.reset}`;
+    } else if (layer.error) {
+      status = `${palette.fail}error${ansi.reset}`;
+      statusIcon = `${palette.fail}✗${ansi.reset}`;
+    } else {
+      status = `${palette.pass}done${ansi.reset}`;
+      statusIcon = `${palette.pass}✓${ansi.reset}`;
+    }
+    
+    const duration = layer.duration ? `${palette.muted}${layer.duration}ms${ansi.reset}` : '';
+    const findingsCount = layer.findings !== undefined ? `${palette.accent}${layer.findings}${ansi.reset} findings` : '';
+    
+    lines.push(`  ${statusIcon} ${config.icon} ${config.name.padEnd(18)} ${status.padEnd(20)} ${duration.padEnd(12)} ${findingsCount}`);
+  }
+  
+  return lines.join('\n');
+}
+
+// ═══════════════════════════════════════════════════════════════════════════════
+// COVERAGE MAP
+// ═══════════════════════════════════════════════════════════════════════════════
+
+function renderCoverageMap(coverage) {
+  if (!coverage) return '';
+  
+  const lines = [];
+  const width = 70;
+  
+  lines.push('');
+  lines.push(`  ${palette.header}${ansi.bold}🗺️ ROUTE COVERAGE${ansi.reset}`);
+  lines.push(`  ${palette.border}${B.lh.repeat(width - 4)}${ansi.reset}`);
+  lines.push('');
+  
+  const pct = coverage.coveragePercent || 0;
+  const color = pct >= 80 ? palette.pass : pct >= 60 ? palette.warn : palette.fail;
+  
+  // Coverage percentage with big number
+  lines.push(`  ${color}${ansi.bold}${pct}%${ansi.reset} ${palette.muted}of routes reachable from root${ansi.reset}`);
+  
+  // Progress bar
+  const barWidth = 50;
+  const filled = Math.round((pct / 100) * barWidth);
+  let bar = '';
+  for (let i = 0; i < barWidth; i++) {
+    if (i < filled) {
+      bar += `${color}${B.full}${ansi.reset}`;
+    } else {
+      bar += `${palette.muted}${B.light}${ansi.reset}`;
+    }
+  }
+  lines.push(`  ${bar}`);
+  lines.push('');
+  
+  // Stats grid
+  const stats = [
+    ['Total Routes', coverage.totalRoutes || 0, palette.accent],
+    ['Reachable', coverage.reachableFromRoot || 0, palette.pass],
+    ['Orphaned', coverage.orphanedRoutes || 0, coverage.orphanedRoutes > 0 ? palette.warn : palette.pass],
+    ['Dead Links', coverage.deadLinks || 0, coverage.deadLinks > 0 ? palette.fail : palette.pass],
+  ];
+  
+  let statsLine = '  ';
+  for (const [label, value, col] of stats) {
+    statsLine += `${palette.muted}${label}:${ansi.reset} ${col}${ansi.bold}${value}${ansi.reset}  `;
+  }
+  lines.push(statsLine);
+  
+  return lines.join('\n');
+}
+
+// ═══════════════════════════════════════════════════════════════════════════════
+// UPSELL BANNER
+// ═══════════════════════════════════════════════════════════════════════════════
+
+function renderUpsellBanner(severityCounts) {
+  const { critical = 0, high = 0, medium = 0, low = 0 } = severityCounts;
+  const total = critical + high + medium + low;
+  
+  if (total === 0) return '';
+  
+  const lines = [];
+  const width = 68;
+  
+  lines.push('');
+  lines.push(`  ${palette.border}${B.rtl}${B.lh.repeat(width)}${B.rtr}${ansi.reset}`);
+  lines.push(`  ${palette.border}${B.lv}${ansi.reset}${' '.repeat(width)}${palette.border}${B.lv}${ansi.reset}`);
+  
+  if (critical > 0) {
+    lines.push(`  ${palette.border}${B.lv}${ansi.reset}  ${palette.fail}⚠ ${critical} critical issues${ansi.reset} blocking your ship!${' '.repeat(width - 42)}${palette.border}${B.lv}${ansi.reset}`);
+    lines.push(`  ${palette.border}${B.lv}${ansi.reset}${' '.repeat(width)}${palette.border}${B.lv}${ansi.reset}`);
+    lines.push(`  ${palette.border}${B.lv}${ansi.reset}  ${palette.accent}vibecheck fix${ansi.reset} ${palette.muted}→ AI-generated fixes for each issue${ansi.reset}${' '.repeat(width - 52)}${palette.border}${B.lv}${ansi.reset}`);
+    lines.push(`  ${palette.border}${B.lv}${ansi.reset}  ${palette.muted}Requires STARTER • vibecheck.dev/pricing${ansi.reset}${' '.repeat(width - 43)}${palette.border}${B.lv}${ansi.reset}`);
+  } else if (medium > 0) {
+    lines.push(`  ${palette.border}${B.lv}${ansi.reset}  ${palette.warn}⚡ ${medium} warnings${ansi.reset} detected in your codebase${' '.repeat(width - 46)}${palette.border}${B.lv}${ansi.reset}`);
+    lines.push(`  ${palette.border}${B.lv}${ansi.reset}${' '.repeat(width)}${palette.border}${B.lv}${ansi.reset}`);
+    lines.push(`  ${palette.border}${B.lv}${ansi.reset}  ${palette.accent}vibecheck ship${ansi.reset} ${palette.muted}→ Full verdict with AI risk score${ansi.reset}${' '.repeat(width - 51)}${palette.border}${B.lv}${ansi.reset}`);
+    lines.push(`  ${palette.border}${B.lv}${ansi.reset}  ${palette.accent}vibecheck fix${ansi.reset}  ${palette.muted}→ AI fixes • Requires STARTER${ansi.reset}${' '.repeat(width - 48)}${palette.border}${B.lv}${ansi.reset}`);
+  } else {
+    lines.push(`  ${palette.border}${B.lv}${ansi.reset}  ${palette.pass}✓ Looking good!${ansi.reset} Only minor issues found${' '.repeat(width - 40)}${palette.border}${B.lv}${ansi.reset}`);
+    lines.push(`  ${palette.border}${B.lv}${ansi.reset}${' '.repeat(width)}${palette.border}${B.lv}${ansi.reset}`);
+    lines.push(`  ${palette.border}${B.lv}${ansi.reset}  ${palette.accent}vibecheck prove${ansi.reset} ${palette.muted}→ Runtime proof + Verified Badge${ansi.reset}${' '.repeat(width - 50)}${palette.border}${B.lv}${ansi.reset}`);
+    lines.push(`  ${palette.border}${B.lv}${ansi.reset}  ${palette.muted}Requires PRO • vibecheck.dev/pricing${ansi.reset}${' '.repeat(width - 39)}${palette.border}${B.lv}${ansi.reset}`);
+  }
+  
+  lines.push(`  ${palette.border}${B.lv}${ansi.reset}${' '.repeat(width)}${palette.border}${B.lv}${ansi.reset}`);
+  lines.push(`  ${palette.border}${B.rbl}${B.lh.repeat(width)}${B.rbr}${ansi.reset}`);
+  
+  return lines.join('\n');
+}
+
+// ═══════════════════════════════════════════════════════════════════════════════
+// MAIN OUTPUT FORMATTER
 // ═══════════════════════════════════════════════════════════════════════════════
 
 function formatScanOutput(result, options = {}) {
@@ -307,64 +595,56 @@ function formatScanOutput(result, options = {}) {
   
   const lines = [];
   
-  // Score card
-  lines.push(renderScoreCard(score, {
+  // Premium score card
+  lines.push(renderPremiumScoreCard(score, {
     verdict: verdictStatus,
     findings: severityCounts,
     duration: timings.total,
     cached: result.cached,
   }));
   
-  // Blockers (critical + high severity findings)
+  // Blockers table
   const blockers = findings.filter(f => 
     f.severity === 'critical' || f.severity === 'BLOCK' || f.severity === 'high'
   );
-  lines.push(renderBlockers(blockers));
+  lines.push(renderBlockersTable(blockers));
   
-  // Category summary
+  // Category table with visual bars
   if (findings.length > 0) {
-    lines.push(renderCategorySummary(findings));
+    lines.push(renderCategoryTable(findings));
   }
   
   // Verbose output
   if (verbose) {
+    // Top findings with fix hints
+    lines.push(renderTopFindings(findings));
+    
     // Coverage map
     if (coverage) {
-      lines.push('');
       lines.push(renderCoverageMap(coverage));
     }
     
-    // Breakdown
-    if (breakdown) {
-      lines.push('');
-      lines.push(renderBreakdown(breakdown));
-    }
-    
-    // Layers
+    // Layers status
     if (layers.length > 0) {
-      lines.push('');
       lines.push(renderLayers(layers));
     }
-    
-    // All findings
-    if (findings.length > 0) {
-      lines.push('');
-      lines.push(renderFindingsList(findings, { maxItems: 20, groupBySeverity: true }));
-    }
   }
   
-  // Timing summary
+  // Timing
   if (timings.total) {
     lines.push('');
-    lines.push(`  ${ansi.dim}Completed in ${formatDuration(timings.total)}${ansi.reset}`);
+    lines.push(`  ${palette.muted}Completed in ${formatDuration(timings.total)}${ansi.reset}`);
   }
   
+  // Upsell banner
+  lines.push(renderUpsellBanner(severityCounts));
+  
   lines.push('');
   return lines.join('\n');
 }
 
 // ═══════════════════════════════════════════════════════════════════════════════
-// SCORE CALCULATION
+// UTILITIES
 // ═══════════════════════════════════════════════════════════════════════════════
 
 function calculateScore(severityCounts) {
@@ -377,10 +657,6 @@ function calculateScore(severityCounts) {
   return Math.max(0, 100 - deductions);
 }
 
-// ═══════════════════════════════════════════════════════════════════════════════
-// EXIT CODE DETERMINATION
-// ═══════════════════════════════════════════════════════════════════════════════
-
 const EXIT_CODES = {
   SUCCESS: 0,
   WARNING: 1,
@@ -390,9 +666,7 @@ const EXIT_CODES = {
 
 function getExitCode(verdict) {
   if (!verdict) return EXIT_CODES.ERROR;
-  
   const status = verdict.verdict || verdict;
-  
   switch (status) {
     case 'PASS':
     case 'SHIP':
@@ -407,57 +681,34 @@ function getExitCode(verdict) {
   }
 }
 
-// ═══════════════════════════════════════════════════════════════════════════════
-// ERROR DISPLAY
-// ═══════════════════════════════════════════════════════════════════════════════
-
 function printError(error, context = '') {
   const prefix = context ? `${context}: ` : '';
-  
   console.error('');
-  console.error(`  ${colors.error}${icons.error}${ansi.reset} ${ansi.bold}${prefix}${error.message || error}${ansi.reset}`);
-  
+  console.error(`  ${palette.fail}✗${ansi.reset} ${ansi.bold}${prefix}${error.message || error}${ansi.reset}`);
   if (error.code) {
-    console.error(`  ${ansi.dim}Error code: ${error.code}${ansi.reset}`);
+    console.error(`  ${palette.muted}Error code: ${error.code}${ansi.reset}`);
   }
-  
   if (error.suggestion || error.fix) {
-    console.error(`  ${colors.success}${icons.arrowRight}${ansi.reset} ${error.suggestion || error.fix}`);
-  }
-  
-  if (error.docs || error.helpUrl) {
-    console.error(`  ${ansi.dim}See: ${error.docs || error.helpUrl}${ansi.reset}`);
+    console.error(`  ${palette.pass}→${ansi.reset} ${error.suggestion || error.fix}`);
   }
-  
   console.error('');
-  
-  // Return appropriate exit code
-  if (error.code === 'VALIDATION_ERROR') return EXIT_CODES.FAILURE;
-  if (error.code === 'LIMIT_EXCEEDED') return EXIT_CODES.WARNING;
   return EXIT_CODES.ERROR;
 }
 
-// ═══════════════════════════════════════════════════════════════════════════════
-// SARIF OUTPUT
-// ═══════════════════════════════════════════════════════════════════════════════
-
+// SARIF export
 function formatSARIF(findings, options = {}) {
   const { projectPath = '.', version = '1.0.0' } = options;
-  
   const rules = new Map();
   const results = [];
   
   for (const f of findings) {
     const ruleId = f.ruleId || f.id || `vibecheck/${f.category || 'general'}`;
-    
     if (!rules.has(ruleId)) {
       rules.set(ruleId, {
         id: ruleId,
         name: f.category || 'general',
         shortDescription: { text: f.title || f.message },
-        defaultConfiguration: {
-          level: sarifLevel(f.severity),
-        },
+        defaultConfiguration: { level: sarifLevel(f.severity) },
         helpUri: 'https://vibecheck.dev/docs/rules/' + ruleId,
       });
     }
@@ -498,46 +749,34 @@ function formatSARIF(findings, options = {}) {
         },
       },
       results,
-      invocations: [{
-        executionSuccessful: true,
-        endTimeUtc: new Date().toISOString(),
-      }],
+      invocations: [{ executionSuccessful: true, endTimeUtc: new Date().toISOString() }],
     }],
   };
 }
 
 function sarifLevel(severity) {
   const levels = {
-    critical: 'error',
-    BLOCK: 'error',
-    high: 'error',
-    medium: 'warning',
-    WARN: 'warning',
-    warning: 'warning',
-    low: 'note',
-    INFO: 'note',
-    info: 'none',
+    critical: 'error', BLOCK: 'error', high: 'error',
+    medium: 'warning', WARN: 'warning', warning: 'warning',
+    low: 'note', INFO: 'note', info: 'none',
   };
   return levels[severity] || 'warning';
 }
 
-// ═══════════════════════════════════════════════════════════════════════════════
-// EXPORTS
-// ═══════════════════════════════════════════════════════════════════════════════
+// Legacy compatibility exports
+function renderBreakdown(breakdown) {
+  // Simplified - can expand later
+  return '';
+}
 
 module.exports = {
-  // Main formatters
   formatScanOutput,
   formatSARIF,
-  
-  // Component renderers
   renderLayers,
   renderCoverageMap,
   renderBreakdown,
-  renderBlockers,
-  renderCategorySummary,
-  
-  // Utilities
+  renderBlockers: renderBlockersTable,
+  renderCategorySummary: renderCategoryTable,
   calculateScore,
   getExitCode,
   printError,