@vibecheckai/cli 3.0.8 → 3.0.10

package/bin/runners/runBadge.js

@@ -1,121 +1,731 @@
 /**
- * vibecheck badge - Generate ship badges for your project
+ * vibecheck badge - Generate Premium Ship Badges
+ *
+ * ═══════════════════════════════════════════════════════════════════════════════
+ * ENTERPRISE EDITION - World-Class Badge Generation
+ * ═══════════════════════════════════════════════════════════════════════════════
+ *
+ * Generate stunning, modern badges for your project README.
+ * Multiple styles: Classic, Gradient, Cyberpunk, Minimal, Full Stats
  */
 
 const fs = require("fs");
 const path = require("path");
 
+// ═══════════════════════════════════════════════════════════════════════════════
+// ADVANCED TERMINAL - ANSI CODES & UTILITIES
+// ═══════════════════════════════════════════════════════════════════════════════
+
 const c = {
-  reset: "\x1b[0m",
-  bold: "\x1b[1m",
-  dim: "\x1b[2m",
-  green: "\x1b[32m",
-  yellow: "\x1b[33m",
-  red: "\x1b[31m",
-  cyan: "\x1b[36m",
+  reset: '\x1b[0m',
+  bold: '\x1b[1m',
+  dim: '\x1b[2m',
+  italic: '\x1b[3m',
+  underline: '\x1b[4m',
+  blink: '\x1b[5m',
+  inverse: '\x1b[7m',
+  hidden: '\x1b[8m',
+  strike: '\x1b[9m',
+  black: '\x1b[30m',
+  red: '\x1b[31m',
+  green: '\x1b[32m',
+  yellow: '\x1b[33m',
+  blue: '\x1b[34m',
+  magenta: '\x1b[35m',
+  cyan: '\x1b[36m',
+  white: '\x1b[37m',
+  gray: '\x1b[90m',
+  brightRed: '\x1b[91m',
+  brightGreen: '\x1b[92m',
+  brightYellow: '\x1b[93m',
+  brightBlue: '\x1b[94m',
+  brightMagenta: '\x1b[95m',
+  brightCyan: '\x1b[96m',
+  brightWhite: '\x1b[97m',
+  bgBlack: '\x1b[40m',
+  bgRed: '\x1b[41m',
+  bgGreen: '\x1b[42m',
+  bgYellow: '\x1b[43m',
+  bgBlue: '\x1b[44m',
+  bgMagenta: '\x1b[45m',
+  bgCyan: '\x1b[46m',
+  bgWhite: '\x1b[47m',
+  clearLine: '\x1b[2K',
+  hideCursor: '\x1b[?25l',
+  showCursor: '\x1b[?25h',
+};
+
+// True color support
+const rgb = (r, g, b) => `\x1b[38;2;${r};${g};${b}m`;
+const bgRgb = (r, g, b) => `\x1b[48;2;${r};${g};${b}m`;
+
+// Premium color palette (emerald/teal theme for badges)
+const colors = {
+  // Gradient for banner
+  gradient1: rgb(0, 255, 200),
+  gradient2: rgb(0, 230, 180),
+  gradient3: rgb(0, 210, 160),
+  gradient4: rgb(0, 190, 140),
+  gradient5: rgb(0, 170, 120),
+  gradient6: rgb(0, 150, 100),
+  
+  // Verdict colors
+  ship: rgb(0, 255, 150),
+  warn: rgb(255, 200, 0),
+  block: rgb(255, 80, 80),
+  
+  // UI colors
+  accent: rgb(0, 255, 200),
+  muted: rgb(120, 140, 130),
+  success: rgb(0, 255, 150),
+  info: rgb(100, 200, 255),
+  highlight: rgb(255, 255, 255),
+  
+  // Badge colors
+  neonCyan: rgb(0, 255, 255),
+  neonGreen: rgb(0, 255, 128),
+  neonPink: rgb(255, 0, 128),
+  neonPurple: rgb(180, 0, 255),
+};
+
+// ═══════════════════════════════════════════════════════════════════════════════
+// PREMIUM BANNER
+// ═══════════════════════════════════════════════════════════════════════════════
+
+const BADGE_BANNER = `
+${rgb(0, 255, 200)}  ██████╗  █████╗ ██████╗  ██████╗ ███████╗${c.reset}
+${rgb(0, 230, 180)}  ██╔══██╗██╔══██╗██╔══██╗██╔════╝ ██╔════╝${c.reset}
+${rgb(0, 210, 160)}  ██████╔╝███████║██║  ██║██║  ███╗█████╗  ${c.reset}
+${rgb(0, 190, 140)}  ██╔══██╗██╔══██║██║  ██║██║   ██║██╔══╝  ${c.reset}
+${rgb(0, 170, 120)}  ██████╔╝██║  ██║██████╔╝╚██████╔╝███████╗${c.reset}
+${rgb(0, 150, 100)}  ╚═════╝ ╚═╝  ╚═╝╚═════╝  ╚═════╝ ╚══════╝${c.reset}
+`;
+
+const BANNER_FULL = `
+${rgb(0, 255, 200)}  ██╗   ██╗██╗██████╗ ███████╗ ██████╗██╗  ██╗███████╗ ██████╗██╗  ██╗${c.reset}
+${rgb(0, 230, 180)}  ██║   ██║██║██╔══██╗██╔════╝██╔════╝██║  ██║██╔════╝██╔════╝██║ ██╔╝${c.reset}
+${rgb(0, 210, 160)}  ██║   ██║██║██████╔╝█████╗  ██║     ███████║█████╗  ██║     █████╔╝ ${c.reset}
+${rgb(0, 190, 140)}  ╚██╗ ██╔╝██║██╔══██╗██╔══╝  ██║     ██╔══██║██╔══╝  ██║     ██╔═██╗ ${c.reset}
+${rgb(0, 170, 120)}   ╚████╔╝ ██║██████╔╝███████╗╚██████╗██║  ██║███████╗╚██████╗██║  ██╗${c.reset}
+${rgb(0, 150, 100)}    ╚═══╝  ╚═╝╚═════╝ ╚══════╝ ╚═════╝╚═╝  ╚═╝╚══════╝ ╚═════╝╚═╝  ╚═╝${c.reset}
+
+${c.dim}  ┌─────────────────────────────────────────────────────────────────────┐${c.reset}
+${c.dim}  │${c.reset}  ${rgb(0, 255, 200)}🏆${c.reset} ${c.bold}BADGE${c.reset} ${c.dim}•${c.reset} ${rgb(200, 200, 200)}Premium Badges${c.reset} ${c.dim}•${c.reset} ${rgb(150, 150, 150)}Show Off Your Ship Status${c.reset}    ${c.dim}│${c.reset}
+${c.dim}  └─────────────────────────────────────────────────────────────────────┘${c.reset}
+`;
+
+// ═══════════════════════════════════════════════════════════════════════════════
+// ICONS & BOX DRAWING
+// ═══════════════════════════════════════════════════════════════════════════════
+
+const ICONS = {
+  badge: '🏆',
+  ship: '🚀',
+  warn: '⚠️',
+  block: '🛑',
+  check: '✓',
+  cross: '✗',
+  arrow: '→',
+  sparkle: '✨',
+  star: '★',
+  copy: '📋',
+  file: '📄',
+  paint: '🎨',
+  lightning: '⚡',
+};
+
+const BOX = {
+  topLeft: '╭', topRight: '╮', bottomLeft: '╰', bottomRight: '╯',
+  horizontal: '─', vertical: '│',
+  dTopLeft: '╔', dTopRight: '╗', dBottomLeft: '╚', dBottomRight: '╝',
+  dHorizontal: '═', dVertical: '║',
+};
+
+// ═══════════════════════════════════════════════════════════════════════════════
+// UTILITY FUNCTIONS
+// ═══════════════════════════════════════════════════════════════════════════════
+
+function padCenter(str, width) {
+  const padding = Math.max(0, width - str.length);
+  const left = Math.floor(padding / 2);
+  const right = padding - left;
+  return ' '.repeat(left) + str + ' '.repeat(right);
+}
+
+function printDivider(char = '─', width = 69, color = c.dim) {
+  console.log(`${color}  ${char.repeat(width)}${c.reset}`);
+}
+
+function printSection(title, icon = '◆') {
+  console.log();
+  console.log(`  ${colors.accent}${icon}${c.reset} ${c.bold}${title}${c.reset}`);
+  printDivider();
+}
+
+// ═══════════════════════════════════════════════════════════════════════════════
+// BADGE GENERATION - PREMIUM SVG BADGES
+// ═══════════════════════════════════════════════════════════════════════════════
+
+/**
+ * Style: Classic (shields.io compatible)
+ */
+function generateClassicBadge(verdict, score) {
+  const colorMap = {
+    SHIP: 'brightgreen',
+    WARN: 'yellow',
+    BLOCK: 'red',
+  };
+  const color = colorMap[verdict] || 'lightgrey';
+  const message = verdict === 'SHIP' ? 'SHIP%20✓' : verdict;
+  return {
+    markdown: `[![vibecheck](https://img.shields.io/badge/vibecheck-${message}-${color}?style=flat-square)](https://vibecheckai.dev)`,
+    html: `<a href="https://vibecheckai.dev"><img src="https://img.shields.io/badge/vibecheck-${message}-${color}?style=flat-square" alt="vibecheck"></a>`,
+  };
+}
+
+/**
+ * Style: Gradient - Modern gradient badge with glow
+ */
+function generateGradientBadge(verdict, score) {
+  const configs = {
+    SHIP: {
+      gradient: ['#00FF96', '#00D4AA'],
+      glow: '#00FF96',
+      text: 'SHIP READY',
+      icon: '✓',
+    },
+    WARN: {
+      gradient: ['#FFD700', '#FFA500'],
+      glow: '#FFD700',
+      text: 'WARNINGS',
+      icon: '⚠',
+    },
+    BLOCK: {
+      gradient: ['#FF6B6B', '#FF4757'],
+      glow: '#FF6B6B',
+      text: 'BLOCKED',
+      icon: '✗',
+    },
+  };
+  
+  const config = configs[verdict] || configs.SHIP;
+  
+  const svg = `<svg xmlns="http://www.w3.org/2000/svg" width="140" height="28" viewBox="0 0 140 28">
+  <defs>
+    <linearGradient id="bg" x1="0%" y1="0%" x2="100%" y2="0%">
+      <stop offset="0%" style="stop-color:#1a1a2e"/>
+      <stop offset="100%" style="stop-color:#16213e"/>
+    </linearGradient>
+    <linearGradient id="accent" x1="0%" y1="0%" x2="100%" y2="0%">
+      <stop offset="0%" style="stop-color:${config.gradient[0]}"/>
+      <stop offset="100%" style="stop-color:${config.gradient[1]}"/>
+    </linearGradient>
+    <filter id="glow">
+      <feGaussianBlur stdDeviation="2" result="coloredBlur"/>
+      <feMerge>
+        <feMergeNode in="coloredBlur"/>
+        <feMergeNode in="SourceGraphic"/>
+      </feMerge>
+    </filter>
+  </defs>
+  <rect width="140" height="28" rx="6" fill="url(#bg)"/>
+  <rect x="1" y="1" width="138" height="26" rx="5" fill="none" stroke="url(#accent)" stroke-width="1" opacity="0.5"/>
+  <text x="12" y="18" font-family="system-ui, -apple-system, sans-serif" font-size="11" font-weight="600" fill="url(#accent)" filter="url(#glow)">⚡</text>
+  <text x="28" y="18" font-family="system-ui, -apple-system, sans-serif" font-size="10" font-weight="500" fill="#ffffff">vibecheck</text>
+  <rect x="88" y="6" width="46" height="16" rx="4" fill="url(#accent)"/>
+  <text x="111" y="18" font-family="system-ui, -apple-system, sans-serif" font-size="9" font-weight="700" fill="#000" text-anchor="middle">${config.icon} ${verdict}</text>
+</svg>`;
+
+  return {
+    svg,
+    markdown: `![vibecheck ${verdict}](data:image/svg+xml;base64,${Buffer.from(svg).toString('base64')})`,
+    html: svg,
+  };
+}
+
+/**
+ * Style: Cyberpunk - Neon glow effect with tech aesthetic
+ */
+function generateCyberpunkBadge(verdict, score) {
+  const configs = {
+    SHIP: {
+      primary: '#00FFFF',
+      secondary: '#00FF88',
+      text: 'SHIP',
+      scanline: '#00FFFF',
+    },
+    WARN: {
+      primary: '#FFD700',
+      secondary: '#FF8800',
+      text: 'WARN',
+      scanline: '#FFD700',
+    },
+    BLOCK: {
+      primary: '#FF0066',
+      secondary: '#FF4444',
+      text: 'BLOCK',
+      scanline: '#FF0066',
+    },
+  };
+  
+  const config = configs[verdict] || configs.SHIP;
+  
+  const svg = `<svg xmlns="http://www.w3.org/2000/svg" width="160" height="32" viewBox="0 0 160 32">
+  <defs>
+    <linearGradient id="cyberbg" x1="0%" y1="0%" x2="100%" y2="100%">
+      <stop offset="0%" style="stop-color:#0a0a0f"/>
+      <stop offset="50%" style="stop-color:#1a1a2e"/>
+      <stop offset="100%" style="stop-color:#0a0a0f"/>
+    </linearGradient>
+    <linearGradient id="cyberglow" x1="0%" y1="0%" x2="100%" y2="0%">
+      <stop offset="0%" style="stop-color:${config.primary};stop-opacity:0"/>
+      <stop offset="50%" style="stop-color:${config.primary};stop-opacity:0.3"/>
+      <stop offset="100%" style="stop-color:${config.primary};stop-opacity:0"/>
+    </linearGradient>
+    <filter id="neon">
+      <feGaussianBlur stdDeviation="1.5" result="blur"/>
+      <feMerge>
+        <feMergeNode in="blur"/>
+        <feMergeNode in="blur"/>
+        <feMergeNode in="SourceGraphic"/>
+      </feMerge>
+    </filter>
+    <clipPath id="clip">
+      <rect width="160" height="32" rx="4"/>
+    </clipPath>
+  </defs>
+  <g clip-path="url(#clip)">
+    <rect width="160" height="32" fill="url(#cyberbg)"/>
+    <rect width="160" height="1" y="8" fill="url(#cyberglow)"/>
+    <rect width="160" height="1" y="23" fill="url(#cyberglow)"/>
+    <rect x="0" y="0" width="2" height="32" fill="${config.primary}" opacity="0.8"/>
+    <rect x="158" y="0" width="2" height="32" fill="${config.secondary}" opacity="0.8"/>
+  </g>
+  <text x="14" y="21" font-family="'Courier New', monospace" font-size="11" font-weight="bold" fill="${config.primary}" filter="url(#neon)">VIBE</text>
+  <text x="48" y="21" font-family="'Courier New', monospace" font-size="11" font-weight="bold" fill="#ffffff">CHECK</text>
+  <rect x="98" y="7" width="54" height="18" rx="2" fill="none" stroke="${config.primary}" stroke-width="1"/>
+  <text x="125" y="20" font-family="'Courier New', monospace" font-size="10" font-weight="bold" fill="${config.primary}" text-anchor="middle" filter="url(#neon)">${config.text}</text>
+</svg>`;
+
+  return {
+    svg,
+    markdown: `![vibecheck ${verdict}](data:image/svg+xml;base64,${Buffer.from(svg).toString('base64')})`,
+    html: svg,
+  };
+}
+
+/**
+ * Style: Minimal - Clean, modern, Apple-inspired
+ */
+function generateMinimalBadge(verdict, score) {
+  const configs = {
+    SHIP: { color: '#34C759', symbol: '●' },
+    WARN: { color: '#FF9500', symbol: '●' },
+    BLOCK: { color: '#FF3B30', symbol: '●' },
+  };
+  
+  const config = configs[verdict] || configs.SHIP;
+  
+  const svg = `<svg xmlns="http://www.w3.org/2000/svg" width="90" height="24" viewBox="0 0 90 24">
+  <rect width="90" height="24" rx="12" fill="#f5f5f7"/>
+  <circle cx="14" cy="12" r="4" fill="${config.color}"/>
+  <text x="26" y="16" font-family="system-ui, -apple-system, SF Pro Text, sans-serif" font-size="11" font-weight="500" fill="#1d1d1f">vibecheck</text>
+</svg>`;
+
+  return {
+    svg,
+    markdown: `![vibecheck](data:image/svg+xml;base64,${Buffer.from(svg).toString('base64')})`,
+    html: svg,
+  };
+}
+
+/**
+ * Style: Full Stats - Complete badge with score and details
+ */
+function generateFullStatsBadge(verdict, score, stats = {}) {
+  const configs = {
+    SHIP: {
+      gradient: ['#00C853', '#00E676'],
+      icon: '🚀',
+      label: 'SHIP READY',
+    },
+    WARN: {
+      gradient: ['#FF8F00', '#FFB300'],
+      icon: '⚠️',
+      label: 'WARNINGS',
+    },
+    BLOCK: {
+      gradient: ['#D50000', '#FF1744'],
+      icon: '🛑',
+      label: 'BLOCKED',
+    },
+  };
+  
+  const config = configs[verdict] || configs.SHIP;
+  const blockers = stats.blockers || 0;
+  const warnings = stats.warnings || 0;
+  
+  const svg = `<svg xmlns="http://www.w3.org/2000/svg" width="200" height="60" viewBox="0 0 200 60">
+  <defs>
+    <linearGradient id="fullbg" x1="0%" y1="0%" x2="100%" y2="100%">
+      <stop offset="0%" style="stop-color:#1e1e2e"/>
+      <stop offset="100%" style="stop-color:#2d2d44"/>
+    </linearGradient>
+    <linearGradient id="statusgrad" x1="0%" y1="0%" x2="100%" y2="0%">
+      <stop offset="0%" style="stop-color:${config.gradient[0]}"/>
+      <stop offset="100%" style="stop-color:${config.gradient[1]}"/>
+    </linearGradient>
+  </defs>
+  <rect width="200" height="60" rx="8" fill="url(#fullbg)"/>
+  <rect x="1" y="1" width="198" height="58" rx="7" fill="none" stroke="#3d3d5c" stroke-width="1"/>
+  
+  <!-- Header -->
+  <text x="16" y="22" font-family="system-ui, -apple-system, sans-serif" font-size="12" font-weight="600" fill="#ffffff">⚡ vibecheck</text>
+  
+  <!-- Status pill -->
+  <rect x="100" y="8" width="90" height="20" rx="10" fill="url(#statusgrad)"/>
+  <text x="145" y="22" font-family="system-ui, -apple-system, sans-serif" font-size="10" font-weight="700" fill="#000" text-anchor="middle">${config.label}</text>
+  
+  <!-- Stats row -->
+  <text x="16" y="45" font-family="system-ui, -apple-system, sans-serif" font-size="10" fill="#888">Score</text>
+  <text x="16" y="55" font-family="system-ui, -apple-system, sans-serif" font-size="11" font-weight="600" fill="#fff">${score}%</text>
+  
+  <text x="70" y="45" font-family="system-ui, -apple-system, sans-serif" font-size="10" fill="#888">Blockers</text>
+  <text x="70" y="55" font-family="system-ui, -apple-system, sans-serif" font-size="11" font-weight="600" fill="${blockers > 0 ? '#FF5252' : '#4CAF50'}">${blockers}</text>
+  
+  <text x="130" y="45" font-family="system-ui, -apple-system, sans-serif" font-size="10" fill="#888">Warnings</text>
+  <text x="130" y="55" font-family="system-ui, -apple-system, sans-serif" font-size="11" font-weight="600" fill="${warnings > 0 ? '#FFB300' : '#4CAF50'}">${warnings}</text>
+</svg>`;
+
+  return {
+    svg,
+    markdown: `![vibecheck](data:image/svg+xml;base64,${Buffer.from(svg).toString('base64')})`,
+    html: svg,
+  };
+}
+
+/**
+ * Style: Animated - CSS animation for web use
+ */
+function generateAnimatedBadge(verdict, score) {
+  const configs = {
+    SHIP: {
+      gradient: ['#00FF96', '#00D4AA', '#00B8D4'],
+      text: 'SHIP ✓',
+    },
+    WARN: {
+      gradient: ['#FFD700', '#FFA500', '#FF8C00'],
+      text: 'WARN ⚠',
+    },
+    BLOCK: {
+      gradient: ['#FF6B6B', '#FF4757', '#FF3838'],
+      text: 'BLOCK ✗',
+    },
+  };
+  
+  const config = configs[verdict] || configs.SHIP;
+  
+  const svg = `<svg xmlns="http://www.w3.org/2000/svg" width="150" height="30" viewBox="0 0 150 30">
+  <defs>
+    <linearGradient id="animbg" x1="0%" y1="0%" x2="100%" y2="0%">
+      <stop offset="0%" style="stop-color:#1a1a2e"/>
+      <stop offset="100%" style="stop-color:#16213e"/>
+    </linearGradient>
+    <linearGradient id="animgrad" x1="0%" y1="0%" x2="100%" y2="0%">
+      <stop offset="0%" style="stop-color:${config.gradient[0]}">
+        <animate attributeName="stop-color" values="${config.gradient.join(';')};${config.gradient[0]}" dur="3s" repeatCount="indefinite"/>
+      </stop>
+      <stop offset="100%" style="stop-color:${config.gradient[1]}">
+        <animate attributeName="stop-color" values="${config.gradient.slice(1).join(';')};${config.gradient[0]};${config.gradient[1]}" dur="3s" repeatCount="indefinite"/>
+      </stop>
+    </linearGradient>
+    <filter id="animglow">
+      <feGaussianBlur stdDeviation="1" result="blur"/>
+      <feMerge>
+        <feMergeNode in="blur"/>
+        <feMergeNode in="SourceGraphic"/>
+      </feMerge>
+    </filter>
+  </defs>
+  <rect width="150" height="30" rx="6" fill="url(#animbg)"/>
+  <rect x="1" y="1" width="148" height="28" rx="5" fill="none" stroke="url(#animgrad)" stroke-width="1.5">
+    <animate attributeName="stroke-opacity" values="0.5;1;0.5" dur="2s" repeatCount="indefinite"/>
+  </rect>
+  <text x="12" y="20" font-family="system-ui, sans-serif" font-size="11" font-weight="600" fill="url(#animgrad)" filter="url(#animglow)">⚡</text>
+  <text x="28" y="20" font-family="system-ui, sans-serif" font-size="11" font-weight="500" fill="#fff">vibecheck</text>
+  <rect x="95" y="6" width="48" height="18" rx="4" fill="url(#animgrad)"/>
+  <text x="119" y="19" font-family="system-ui, sans-serif" font-size="9" font-weight="700" fill="#000" text-anchor="middle">${config.text}</text>
+</svg>`;
+
+  return {
+    svg,
+    markdown: `![vibecheck ${verdict}](data:image/svg+xml;base64,${Buffer.from(svg).toString('base64')})`,
+    html: svg,
+  };
+}
+
+/**
+ * Style: Holographic - Premium iridescent effect
+ */
+function generateHolographicBadge(verdict, score) {
+  const configs = {
+    SHIP: { text: 'SHIP', icon: '✓' },
+    WARN: { text: 'WARN', icon: '⚠' },
+    BLOCK: { text: 'BLOCK', icon: '✗' },
+  };
+  
+  const config = configs[verdict] || configs.SHIP;
+  
+  const svg = `<svg xmlns="http://www.w3.org/2000/svg" width="160" height="36" viewBox="0 0 160 36">
+  <defs>
+    <linearGradient id="holobg" x1="0%" y1="0%" x2="100%" y2="100%">
+      <stop offset="0%" style="stop-color:#0f0f1a"/>
+      <stop offset="50%" style="stop-color:#1a1a2e"/>
+      <stop offset="100%" style="stop-color:#0f0f1a"/>
+    </linearGradient>
+    <linearGradient id="hologram" x1="0%" y1="0%" x2="100%" y2="100%">
+      <stop offset="0%" style="stop-color:#00FFFF">
+        <animate attributeName="stop-color" values="#00FFFF;#FF00FF;#FFFF00;#00FF00;#00FFFF" dur="4s" repeatCount="indefinite"/>
+      </stop>
+      <stop offset="25%" style="stop-color:#FF00FF">
+        <animate attributeName="stop-color" values="#FF00FF;#FFFF00;#00FF00;#00FFFF;#FF00FF" dur="4s" repeatCount="indefinite"/>
+      </stop>
+      <stop offset="50%" style="stop-color:#FFFF00">
+        <animate attributeName="stop-color" values="#FFFF00;#00FF00;#00FFFF;#FF00FF;#FFFF00" dur="4s" repeatCount="indefinite"/>
+      </stop>
+      <stop offset="75%" style="stop-color:#00FF00">
+        <animate attributeName="stop-color" values="#00FF00;#00FFFF;#FF00FF;#FFFF00;#00FF00" dur="4s" repeatCount="indefinite"/>
+      </stop>
+      <stop offset="100%" style="stop-color:#00FFFF">
+        <animate attributeName="stop-color" values="#00FFFF;#FF00FF;#FFFF00;#00FF00;#00FFFF" dur="4s" repeatCount="indefinite"/>
+      </stop>
+    </linearGradient>
+    <filter id="hologlow">
+      <feGaussianBlur stdDeviation="2" result="blur"/>
+      <feMerge>
+        <feMergeNode in="blur"/>
+        <feMergeNode in="blur"/>
+        <feMergeNode in="SourceGraphic"/>
+      </feMerge>
+    </filter>
+    <mask id="holomask">
+      <rect width="160" height="36" rx="8" fill="white"/>
+    </mask>
+  </defs>
+  <g mask="url(#holomask)">
+    <rect width="160" height="36" fill="url(#holobg)"/>
+    <rect x="0" y="0" width="160" height="36" fill="url(#hologram)" opacity="0.1">
+      <animate attributeName="opacity" values="0.05;0.15;0.05" dur="2s" repeatCount="indefinite"/>
+    </rect>
+  </g>
+  <rect x="1" y="1" width="158" height="34" rx="7" fill="none" stroke="url(#hologram)" stroke-width="1.5"/>
+  <text x="16" y="24" font-family="system-ui, -apple-system, sans-serif" font-size="13" font-weight="700" fill="url(#hologram)" filter="url(#hologlow)">⚡ vibecheck</text>
+  <rect x="108" y="8" width="44" height="20" rx="4" fill="url(#hologram)" opacity="0.9"/>
+  <text x="130" y="22" font-family="system-ui, -apple-system, sans-serif" font-size="10" font-weight="800" fill="#000" text-anchor="middle">${config.icon} ${config.text}</text>
+</svg>`;
+
+  return {
+    svg,
+    markdown: `![vibecheck ${verdict}](data:image/svg+xml;base64,${Buffer.from(svg).toString('base64')})`,
+    html: svg,
+  };
+}
+
+// ═══════════════════════════════════════════════════════════════════════════════
+// BADGE STYLE REGISTRY
+// ═══════════════════════════════════════════════════════════════════════════════
+
+const BADGE_STYLES = {
+  classic: {
+    name: 'Classic',
+    description: 'shields.io compatible',
+    generator: generateClassicBadge,
+  },
+  gradient: {
+    name: 'Gradient',
+    description: 'Modern gradient with glow',
+    generator: generateGradientBadge,
+  },
+  cyberpunk: {
+    name: 'Cyberpunk',
+    description: 'Neon tech aesthetic',
+    generator: generateCyberpunkBadge,
+  },
+  minimal: {
+    name: 'Minimal',
+    description: 'Clean Apple-inspired',
+    generator: generateMinimalBadge,
+  },
+  full: {
+    name: 'Full Stats',
+    description: 'Complete with score & stats',
+    generator: generateFullStatsBadge,
+  },
+  animated: {
+    name: 'Animated',
+    description: 'CSS animation for web',
+    generator: generateAnimatedBadge,
+  },
+  holographic: {
+    name: 'Holographic',
+    description: 'Premium iridescent effect',
+    generator: generateHolographicBadge,
+  },
 };
 
+// ═══════════════════════════════════════════════════════════════════════════════
+// TERMINAL PREVIEW
+// ═══════════════════════════════════════════════════════════════════════════════
+
+function printBadgePreview(verdict, score, style) {
+  const verdictColors = {
+    SHIP: colors.ship,
+    WARN: colors.warn,
+    BLOCK: colors.block,
+  };
+  const vColor = verdictColors[verdict] || colors.accent;
+  const vIcon = verdict === 'SHIP' ? ICONS.ship : verdict === 'WARN' ? ICONS.warn : ICONS.block;
+  
+  console.log();
+  console.log(`  ${c.dim}┌${'─'.repeat(50)}┐${c.reset}`);
+  console.log(`  ${c.dim}│${c.reset}  ${ICONS.paint} ${c.bold}Badge Preview${c.reset}${' '.repeat(33)}${c.dim}│${c.reset}`);
+  console.log(`  ${c.dim}├${'─'.repeat(50)}┤${c.reset}`);
+  console.log(`  ${c.dim}│${c.reset}                                                  ${c.dim}│${c.reset}`);
+  
+  // Terminal representation of badge
+  const styleInfo = BADGE_STYLES[style] || BADGE_STYLES.gradient;
+  console.log(`  ${c.dim}│${c.reset}    ${bgRgb(26, 26, 46)} ${colors.accent}⚡${c.reset}${bgRgb(26, 26, 46)} vibecheck ${c.reset}${vColor}${bgRgb(0, 50, 40)} ${vIcon} ${verdict} ${c.reset}    ${c.dim}│${c.reset}`);
+  
+  console.log(`  ${c.dim}│${c.reset}                                                  ${c.dim}│${c.reset}`);
+  console.log(`  ${c.dim}│${c.reset}  ${c.dim}Style:${c.reset} ${colors.accent}${styleInfo.name}${c.reset} ${c.dim}(${styleInfo.description})${c.reset}${' '.repeat(Math.max(0, 20 - styleInfo.name.length - styleInfo.description.length))}${c.dim}│${c.reset}`);
+  console.log(`  ${c.dim}│${c.reset}  ${c.dim}Score:${c.reset} ${score >= 80 ? colors.success : score >= 50 ? colors.warn : colors.block}${score}%${c.reset}${' '.repeat(39)}${c.dim}│${c.reset}`);
+  console.log(`  ${c.dim}│${c.reset}                                                  ${c.dim}│${c.reset}`);
+  console.log(`  ${c.dim}└${'─'.repeat(50)}┘${c.reset}`);
+}
+
+function printStyleGallery() {
+  printSection('AVAILABLE STYLES', ICONS.paint);
+  console.log();
+  
+  for (const [key, style] of Object.entries(BADGE_STYLES)) {
+    const isAnimated = key === 'animated' || key === 'holographic';
+    const animTag = isAnimated ? ` ${c.dim}(animated)${c.reset}` : '';
+    console.log(`  ${colors.accent}${key.padEnd(12)}${c.reset} ${c.bold}${style.name}${c.reset}${animTag}`);
+    console.log(`  ${' '.repeat(12)} ${c.dim}${style.description}${c.reset}`);
+    console.log();
+  }
+}
+
+// ═══════════════════════════════════════════════════════════════════════════════
+// ARGS PARSER
+// ═══════════════════════════════════════════════════════════════════════════════
+
 function parseArgs(args) {
   const opts = {
     help: false,
     output: null,
-    format: "markdown",
+    format: 'markdown',
+    style: 'gradient',
     verdict: null,
     score: null,
+    list: false,
+    all: false,
   };
 
   for (let i = 0; i < args.length; i++) {
     const arg = args[i];
     switch (arg) {
-      case "--help":
-      case "-h":
+      case '--help':
+      case '-h':
         opts.help = true;
         break;
-      case "--output":
-      case "-o":
+      case '--output':
+      case '-o':
         opts.output = args[++i];
         break;
-      case "--format":
-      case "-f":
+      case '--format':
+      case '-f':
         opts.format = args[++i];
         break;
-      case "--verdict":
-        opts.verdict = args[++i];
+      case '--style':
+      case '-s':
+        opts.style = args[++i];
         break;
-      case "--score":
+      case '--verdict':
+        opts.verdict = args[++i]?.toUpperCase();
+        break;
+      case '--score':
         opts.score = parseInt(args[++i]);
         break;
+      case '--list':
+      case '-l':
+        opts.list = true;
+        break;
+      case '--all':
+      case '-a':
+        opts.all = true;
+        break;
     }
   }
 
   return opts;
 }
 
+// ═══════════════════════════════════════════════════════════════════════════════
+// HELP DISPLAY
+// ═══════════════════════════════════════════════════════════════════════════════
+
 function printHelp() {
+  console.log(BANNER_FULL);
   console.log(`
-${c.bold}vibecheck badge${c.reset} - Generate ship badges for your project
-
-${c.bold}USAGE${c.reset}
-  vibecheck badge [options]
-
-${c.bold}OPTIONS${c.reset}
-  --help, -h          Show this help
-  --output, -o <file> Output file (default: stdout)
-  --format, -f <fmt>  Format: markdown, html, svg (default: markdown)
-  --verdict <v>       Override verdict: SHIP, WARN, BLOCK
-  --score <n>         Override score (0-100)
-
-${c.bold}EXAMPLES${c.reset}
-  vibecheck badge                    # Generate from last scan
-  vibecheck badge -o README.md       # Append to README
-  vibecheck badge --format svg       # SVG badge
-  vibecheck badge --verdict SHIP     # Force SHIP badge
-`);
-}
+  ${c.bold}Usage:${c.reset} vibecheck badge [options]
 
-function getVerdictColor(verdict) {
-  switch (verdict) {
-    case "SHIP": return "brightgreen";
-    case "WARN": return "yellow";
-    case "BLOCK": return "red";
-    default: return "lightgrey";
-  }
-}
+  ${c.bold}Premium Badge Generator${c.reset} — Show off your ship status in style.
 
-function generateMarkdownBadge(verdict, score) {
-  const color = getVerdictColor(verdict);
-  const label = "vibecheck";
-  const message = verdict === "SHIP" ? `${verdict}%20✓` : verdict;
-  return `[![vibecheck](https://img.shields.io/badge/${label}-${message}-${color})](https://vibecheckai.dev)`;
-}
+  ${c.bold}Options:${c.reset}
+    ${colors.accent}--help, -h${c.reset}            Show this help
+    ${colors.accent}--output, -o <file>${c.reset}   Output file ${c.dim}(default: stdout)${c.reset}
+    ${colors.accent}--format, -f <fmt>${c.reset}    Format: markdown, html, svg ${c.dim}(default: markdown)${c.reset}
+    ${colors.accent}--style, -s <style>${c.reset}   Badge style ${c.dim}(default: gradient)${c.reset}
+    ${colors.accent}--verdict <v>${c.reset}         Override: SHIP, WARN, BLOCK
+    ${colors.accent}--score <n>${c.reset}           Override score (0-100)
+    ${colors.accent}--list, -l${c.reset}            Show all available styles
+    ${colors.accent}--all, -a${c.reset}             Generate all badge styles
 
-function generateHtmlBadge(verdict, score) {
-  const color = verdict === "SHIP" ? "#4CAF50" : verdict === "WARN" ? "#FFC107" : "#F44336";
-  return `<a href="https://vibecheckai.dev"><img src="https://img.shields.io/badge/vibecheck-${verdict}-${color.replace("#", "")}" alt="vibecheck ${verdict}"></a>`;
-}
+  ${c.bold}Badge Styles:${c.reset}
+    ${colors.accent}classic${c.reset}       shields.io compatible
+    ${colors.accent}gradient${c.reset}      Modern gradient with glow ${c.dim}(default)${c.reset}
+    ${colors.accent}cyberpunk${c.reset}     Neon tech aesthetic
+    ${colors.accent}minimal${c.reset}       Clean Apple-inspired
+    ${colors.accent}full${c.reset}          Complete with score & stats
+    ${colors.accent}animated${c.reset}      CSS animation for web
+    ${colors.accent}holographic${c.reset}   Premium iridescent effect
 
-function generateSvgBadge(verdict, score) {
-  const color = verdict === "SHIP" ? "#4CAF50" : verdict === "WARN" ? "#FFC107" : "#F44336";
-  return `<svg xmlns="http://www.w3.org/2000/svg" width="100" height="20">
-  <linearGradient id="b" x2="0" y2="100%">
-    <stop offset="0" stop-color="#bbb" stop-opacity=".1"/>
-    <stop offset="1" stop-opacity=".1"/>
-  </linearGradient>
-  <mask id="a"><rect width="100" height="20" rx="3" fill="#fff"/></mask>
-  <g mask="url(#a)">
-    <rect width="60" height="20" fill="#555"/>
-    <rect x="60" width="40" height="20" fill="${color}"/>
-    <rect width="100" height="20" fill="url(#b)"/>
-  </g>
-  <g fill="#fff" text-anchor="middle" font-family="DejaVu Sans,Verdana,Geneva,sans-serif" font-size="11">
-    <text x="30" y="15" fill="#010101" fill-opacity=".3">vibecheck</text>
-    <text x="30" y="14">vibecheck</text>
-    <text x="80" y="15" fill="#010101" fill-opacity=".3">${verdict}</text>
-    <text x="80" y="14">${verdict}</text>
-  </g>
-</svg>`;
+  ${c.bold}Examples:${c.reset}
+    ${c.dim}# Generate default gradient badge${c.reset}
+    vibecheck badge
+
+    ${c.dim}# Cyberpunk style badge${c.reset}
+    vibecheck badge --style cyberpunk
+
+    ${c.dim}# Add to README${c.reset}
+    vibecheck badge -o README.md
+
+    ${c.dim}# Force SHIP badge${c.reset}
+    vibecheck badge --verdict SHIP
+
+    ${c.dim}# SVG output${c.reset}
+    vibecheck badge --format svg -o badge.svg
+
+    ${c.dim}# Generate all styles${c.reset}
+    vibecheck badge --all
+  `);
 }
 
+// ═══════════════════════════════════════════════════════════════════════════════
+// MAIN BADGE FUNCTION
+// ═══════════════════════════════════════════════════════════════════════════════
+
 async function runBadge(args) {
   const opts = parseArgs(args);
 
@@ -124,59 +734,156 @@ async function runBadge(args) {
     return 0;
   }
 
-  // Try to load last scan result
-  let verdict = opts.verdict || "SHIP";
+  if (opts.list) {
+    console.log(BANNER_FULL);
+    printStyleGallery();
+    return 0;
+  }
+
+  // Load last scan result
+  let verdict = opts.verdict || 'SHIP';
   let score = opts.score || 100;
+  let stats = { blockers: 0, warnings: 0 };
 
-  const lastScanPath = path.join(process.cwd(), ".vibecheck", "last_scan.json");
-  if (!opts.verdict && fs.existsSync(lastScanPath)) {
-    try {
-      const lastScan = JSON.parse(fs.readFileSync(lastScanPath, "utf8"));
-      verdict = lastScan.verdict || "SHIP";
-      score = lastScan.score || 100;
-    } catch (e) {
-      // Use defaults
+  const lastScanPath = path.join(process.cwd(), '.vibecheck', 'last_scan.json');
+  const lastShipPath = path.join(process.cwd(), '.vibecheck', 'last_ship.json');
+  
+  if (!opts.verdict) {
+    // Try ship report first, then scan
+    const reportPath = fs.existsSync(lastShipPath) ? lastShipPath : lastScanPath;
+    
+    if (fs.existsSync(reportPath)) {
+      try {
+        const report = JSON.parse(fs.readFileSync(reportPath, 'utf8'));
+        verdict = report.verdict || 'SHIP';
+        score = report.score ?? report.vibeScore ?? 100;
+        stats = {
+          blockers: report.counts?.BLOCK || report.findings?.filter(f => f.severity === 'BLOCK').length || 0,
+          warnings: report.counts?.WARN || report.findings?.filter(f => f.severity === 'WARN').length || 0,
+        };
+      } catch (e) {
+        // Use defaults
+      }
     }
   }
 
-  // Generate badge
-  let badge;
-  switch (opts.format) {
-    case "html":
-      badge = generateHtmlBadge(verdict, score);
-      break;
-    case "svg":
-      badge = generateSvgBadge(verdict, score);
-      break;
-    default:
-      badge = generateMarkdownBadge(verdict, score);
-  }
+  const projectName = path.basename(process.cwd());
+
+  // Print banner
+  console.log(BANNER_FULL);
+  
+  console.log(`  ${c.dim}Project:${c.reset}  ${c.bold}${projectName}${c.reset}`);
+  console.log(`  ${c.dim}Verdict:${c.reset}  ${verdict === 'SHIP' ? colors.ship : verdict === 'WARN' ? colors.warn : colors.block}${verdict}${c.reset}`);
+  console.log(`  ${c.dim}Score:${c.reset}    ${score}%`);
+
+  // Generate badge(s)
+  if (opts.all) {
+    // Generate all styles
+    printSection('ALL BADGE STYLES', ICONS.sparkle);
+    console.log();
+    
+    for (const [key, styleInfo] of Object.entries(BADGE_STYLES)) {
+      const badge = styleInfo.generator(verdict, score, stats);
+      console.log(`  ${colors.accent}${c.bold}${styleInfo.name}${c.reset} ${c.dim}(--style ${key})${c.reset}`);
+      console.log();
+      console.log(`  ${c.dim}Markdown:${c.reset}`);
+      console.log(`  ${badge.markdown || badge}`);
+      console.log();
+      printDivider('─', 50);
+      console.log();
+    }
+  } else {
+    // Generate single style
+    const styleKey = opts.style || 'gradient';
+    const styleInfo = BADGE_STYLES[styleKey];
+    
+    if (!styleInfo) {
+      console.log();
+      console.log(`  ${colors.block}${ICONS.cross}${c.reset} Unknown style: ${styleKey}`);
+      console.log(`  ${c.dim}Run 'vibecheck badge --list' to see available styles${c.reset}`);
+      return 1;
+    }
+
+    const badge = styleInfo.generator(verdict, score, stats);
+    
+    // Preview
+    printBadgePreview(verdict, score, styleKey);
 
-  // Output
-  if (opts.output) {
-    const outputPath = path.resolve(opts.output);
-    if (fs.existsSync(outputPath)) {
-      const content = fs.readFileSync(outputPath, "utf8");
-      // Replace existing badge or append
-      if (content.includes("vibecheck")) {
-        const updated = content.replace(/\[!\[vibecheck\].*?\]\(https:\/\/vibecheckai\.dev\)/g, badge);
-        fs.writeFileSync(outputPath, updated);
-        console.log(`${c.green}✓${c.reset} Updated badge in ${outputPath}`);
+    // Output
+    printSection('GENERATED BADGE', ICONS.badge);
+    console.log();
+
+    if (opts.output) {
+      const outputPath = path.resolve(opts.output);
+      const content = opts.format === 'svg' ? badge.svg : 
+                     opts.format === 'html' ? badge.html :
+                     badge.markdown || badge;
+      
+      if (fs.existsSync(outputPath)) {
+        let existing = fs.readFileSync(outputPath, 'utf8');
+        
+        // Replace existing badge or append
+        if (existing.includes('vibecheck')) {
+          const updated = existing.replace(/\[!\[vibecheck\].*?\]\(https:\/\/vibecheckai\.dev\)/g, content);
+          fs.writeFileSync(outputPath, updated);
+          console.log(`  ${colors.success}${ICONS.check}${c.reset} Updated badge in ${c.bold}${outputPath}${c.reset}`);
+        } else {
+          fs.writeFileSync(outputPath, existing + '\n\n' + content + '\n');
+          console.log(`  ${colors.success}${ICONS.check}${c.reset} Added badge to ${c.bold}${outputPath}${c.reset}`);
+        }
       } else {
-        fs.writeFileSync(outputPath, content + "\n\n" + badge + "\n");
-        console.log(`${c.green}✓${c.reset} Added badge to ${outputPath}`);
+        fs.writeFileSync(outputPath, content + '\n');
+        console.log(`  ${colors.success}${ICONS.check}${c.reset} Created ${c.bold}${outputPath}${c.reset}`);
+      }
+      
+      // Also save SVG to .vibecheck
+      const badgeDir = path.join(process.cwd(), '.vibecheck', 'badges');
+      if (!fs.existsSync(badgeDir)) {
+        fs.mkdirSync(badgeDir, { recursive: true });
+      }
+      if (badge.svg) {
+        fs.writeFileSync(path.join(badgeDir, `badge-${styleKey}.svg`), badge.svg);
+        console.log(`  ${colors.success}${ICONS.check}${c.reset} Saved ${c.dim}.vibecheck/badges/badge-${styleKey}.svg${c.reset}`);
       }
     } else {
-      fs.writeFileSync(outputPath, badge + "\n");
-      console.log(`${c.green}✓${c.reset} Created ${outputPath} with badge`);
+      // Output to console
+      console.log(`  ${c.dim}Format: ${opts.format}${c.reset}`);
+      console.log();
+      
+      const output = opts.format === 'svg' ? badge.svg :
+                    opts.format === 'html' ? badge.html :
+                    badge.markdown || badge;
+      
+      console.log(`  ${colors.accent}${BOX.topLeft}${'─'.repeat(60)}${BOX.topRight}${c.reset}`);
+      console.log(`  ${colors.accent}${BOX.vertical}${c.reset} ${ICONS.copy} ${c.bold}Copy this to your README:${c.reset}${' '.repeat(30)}${colors.accent}${BOX.vertical}${c.reset}`);
+      console.log(`  ${colors.accent}${BOX.vertical}${c.reset}${' '.repeat(60)}${colors.accent}${BOX.vertical}${c.reset}`);
+      
+      // Word wrap for long content
+      const maxWidth = 56;
+      if (output.length > maxWidth) {
+        const lines = [];
+        for (let i = 0; i < output.length; i += maxWidth) {
+          lines.push(output.slice(i, i + maxWidth));
+        }
+        for (const line of lines) {
+          console.log(`  ${colors.accent}${BOX.vertical}${c.reset}  ${c.dim}${line}${c.reset}${' '.repeat(Math.max(0, maxWidth - line.length + 2))}${colors.accent}${BOX.vertical}${c.reset}`);
+        }
+      } else {
+        console.log(`  ${colors.accent}${BOX.vertical}${c.reset}  ${c.dim}${output}${c.reset}${' '.repeat(Math.max(0, maxWidth - output.length + 2))}${colors.accent}${BOX.vertical}${c.reset}`);
+      }
+      
+      console.log(`  ${colors.accent}${BOX.vertical}${c.reset}${' '.repeat(60)}${colors.accent}${BOX.vertical}${c.reset}`);
+      console.log(`  ${colors.accent}${BOX.bottomLeft}${'─'.repeat(60)}${BOX.bottomRight}${c.reset}`);
     }
-  } else {
-    console.log(`\n${c.bold}Generated Badge:${c.reset}\n`);
-    console.log(badge);
-    console.log(`\n${c.dim}Copy and paste into your README.md${c.reset}\n`);
   }
 
+  // Tips
+  console.log();
+  console.log(`  ${c.dim}Tip: Use ${colors.accent}--style holographic${c.reset}${c.dim} for the premium animated effect${c.reset}`);
+  console.log(`  ${c.dim}     Use ${colors.accent}--all${c.reset}${c.dim} to see all available styles${c.reset}`);
+  console.log();
+
   return 0;
 }
 
-module.exports = { runBadge };
+module.exports = { runBadge }