@sikkuumiii/defuse 0.0.0-stage → 0.5.0

package/src/report/json.ts

@@ -0,0 +1,189 @@
+/**
+ * MACHINE-READABLE REPORT
+ *
+ * Two rules for this format:
+ *
+ * 1. It is a SUPERSET of the human report. Anything the terminal shows must be
+ *    in here, including the gaps and the suppressions. A JSON consumer must not
+ *    be able to build a rosier picture than a human reading the same scan.
+ *
+ * 2. `confidence` is a top-level field on every finding, and the `honesty`
+ *    block at the document root explains what the values mean. A dashboard that
+ *    ingests this cannot accidentally present unverified matches as confirmed
+ *    vulnerabilities without deliberately discarding the field.
+ *
+ * RELATIONSHIP TO SARIF: this shape deliberately resembles SARIF (the OASIS
+ * standard GitHub code scanning consumes) without pretending to be it, because
+ * emitting invalid SARIF and calling it SARIF would be its own small lie. Real
+ * SARIF now exists behind `--sarif` (report/sarif.ts), typed against the
+ * official 2.1.0 definitions so the compiler rejects a malformed document.
+ * This format stays because it carries things SARIF has no room for - the
+ * coverage matrix, verified-clean lines, trace limits and the score gauges.
+ */
+
+import type { ScanResult } from '../engine/scan.js';
+import { LICENCE_SPDX } from '../core/licence.js';
+
+export function renderJson(result: ScanResult, pretty = true): string {
+  const bySeverity: Record<string, number> = {};
+  for (const finding of result.findings) {
+    bySeverity[finding.severity] = (bySeverity[finding.severity] ?? 0) + 1;
+  }
+
+  const document = {
+    tool: {
+      name: 'Defuse',
+      version: result.coverage.engine.version,
+      analysis: result.coverage.engine.analysisLabel,
+      // Taken from the capability block rather than retyped here. This list was
+      // hand-written once and went stale immediately - it still claimed the
+      // tracer worked "within one function (JS/TS/Python)" long after it
+      // followed values across files in every language. A machine-readable
+      // report that overstates OR understates the engine is the same bug.
+      analysisTypes: result.coverage.engine.implemented,
+      // Machine-readable, because a consumer feeding this into a compliance
+      // pipeline should not have to read a README to learn the terms.
+      license: LICENCE_SPDX,
+    },
+    target: result.target,
+    scannedAt: new Date().toISOString(),
+
+    // Placed BEFORE findings on purpose: a consumer reading top-to-bottom meets
+    // the caveats before the results.
+    honesty: {
+      signatureBasedFindings: result.findings.filter((f) => f.confidence === 'signature-based')
+        .length,
+      flowVerifiedFindings: result.findings.filter((f) => f.confidence === 'flow-verified').length,
+      signatureGuessesSupersededByProof: result.stats.signaturesUpgraded,
+      signatureGuessesWithdrawnAsSanitised: result.stats.signaturesRetracted,
+      /*
+       * Withdrawn because every value spliced in is provably a fixed literal on
+       * every path that runs - a branch that cannot run, a condition decided at
+       * compile time, a same-file helper that only ever returns a literal. Each
+       * one is listed under diagnostics.verifiedClean with kind "constant" and
+       * the reason, so the reasoning can be checked line by line.
+       */
+      signatureGuessesWithdrawnAsConstant: result.stats.signaturesProvedConstant,
+      /*
+       * Branches and cases the tracer did not follow because a condition fixed
+       * at compile time means they cannot run. A flow that lived only inside one
+       * of them is not reported - so each is listed under
+       * diagnostics.unreachableCodeSkipped, with the decision, rather than
+       * leaving a missing finding with no explanation.
+       */
+      regionsProvedUnreachable: result.stats.regionsProvedUnreachable,
+      /*
+       * Reads from a local map or list answered by the key or the position,
+       * because every write the collection could receive is visible (see
+       * taint/local-map.ts) - each listed under diagnostics.collectionReadsResolved
+       * with the write that answers it.
+       */
+      collectionReadsResolved: result.stats.collectionReadsResolved,
+      /*
+       * Calls where a trace ENDED because the function returns new data - a
+       * database row, a file's contents - not its argument. Not a claim of
+       * safety: nothing is cleared by a stop, and a sink further on is still
+       * reported by its signature rule. Each is listed under
+       * diagnostics.tracesStoppedAtNewData with what the call returns instead.
+       */
+      tracesStoppedAtNewData: result.stats.tracesStoppedAtNewData,
+      meaningOfConfidence: result.coverage.engine.meaningOfConfidence,
+      notImplemented: result.coverage.engine.notImplemented,
+      dataFlowCoverageByLanguage: result.coverage.taint,
+      crossFileResolution: result.crossFile,
+      warning:
+        'Findings labelled signature-based are UNVERIFIED pattern matches - the data flow was ' +
+        'not traced and they may be false positives. Findings labelled flow-verified carry a ' +
+        'complete source-to-sink path in `flowPath`; check it rather than trusting the label. ' +
+        'Neither label proves exploitability in a running system.',
+    },
+
+    summary: {
+      total: result.findings.length,
+      bySeverity,
+      byConfidence: {
+        'signature-based': result.findings.filter((f) => f.confidence === 'signature-based').length,
+        'flow-verified': result.findings.filter((f) => f.confidence === 'flow-verified').length,
+      },
+      suppressed: result.suppressions.length,
+    },
+
+    findings: result.findings.map((finding) => ({
+      ruleId: finding.ruleId,
+      ruleName: finding.ruleName,
+      severity: finding.severity,
+      confidence: finding.confidence,
+      verified: finding.verified,
+      flowPath: finding.flowPath,
+      cwe: finding.cwe,
+      owasp: finding.owasp,
+      message: finding.message,
+      reasoning: finding.reasoning,
+      limitations: finding.limitations,
+      location: finding.location,
+      detectedAt: finding.detectedAt,
+    })),
+
+    coverage: {
+      counts: result.coverage.counts,
+      gaps: result.coverage.gaps,
+      matrix: result.coverage.matrix,
+      fileTypesPresentButNotScanned: result.coverage.unscannedExtensions,
+    },
+
+    diagnostics: {
+      stats: result.stats,
+      filesByLanguage: result.byLanguage,
+      parseProblems: result.parseProblems,
+      suppressions: result.suppressions,
+      /*
+       * Every line proved clean, each with `reason` - what cleaned it and on
+       * which line - and, when there were any, `assumes`: functions Defuse
+       * does not model that the value went through AFTER it was cleaned, each
+       * taken to hand back what it was given. A tool reading this file can
+       * hold the receipts that rest on trust to a different standard.
+       */
+      verifiedClean: result.verifiedClean,
+      unreachableCodeSkipped: result.unreachableCode,
+      collectionReadsResolved: result.collectionReadsResolved,
+      tracesStoppedAtNewData: result.tracesStoppedAtNewData,
+      /*
+       * Which PHP the project declares (Dockerfile, compose, composer.json,
+       * .php-version) and what php.net's facts say about each - with the date
+       * those facts were checked, and notes for what could not be checked.
+       * Null when --only left the check out.
+       */
+      runtimeVersions: result.runtimeVersions
+        ? {
+            factsChecked: result.runtimeVersions.factsChecked,
+            declared: result.runtimeVersions.declared,
+            notes: result.runtimeVersions.notes,
+          }
+        : null,
+      /** What `--deps` read and asked osv.dev; null when it did not run. */
+      dependencies: result.dependencies ?? null,
+      oversizedFilesSkipped: result.oversizedFiles,
+      excludedByUser: result.excluded,
+      /**
+       * What the scan spent on syntax trees.
+       *
+       * `reparses` above zero means the project did not fit in the tree budget
+       * and files were parsed more than once. The findings are unaffected - a
+       * re-parse of the same bytes with the same grammar is the same tree - but
+       * the scan took longer than it needed to, and saying so is the difference
+       * between a user tuning the budget and a user assuming the tool is slow.
+       */
+      treeMemory: {
+        ...result.treeMemory,
+        note:
+          result.treeMemory.reparses === 0
+            ? 'Every file was parsed exactly once; the project fitted in the tree budget.'
+            : `The project did not fit in the tree budget, so ${result.treeMemory.reparses} ` +
+              'file(s) were parsed more than once. Answers are unchanged; the scan was slower. ' +
+              'Raise DEFUSE_TREE_BUDGET_MB to trade memory back for speed.',
+      },
+    },
+  };
+
+  return JSON.stringify(document, null, pretty ? 2 : 0);
+}

package/src/report/mark.ts

@@ -0,0 +1,47 @@
+/**
+ * THE MARK, AS A VECTOR.
+ *
+ * docs/defuse-mark.png is the source of truth for the mark, and it is not in
+ * the npm package - so a report written by an installed copy of the CLI could
+ * not include it. This is the same shape traced to a path (potrace, from the PNG
+ * at 4x), small enough to inline, so a report file carries its own mark and
+ * loads nothing from anywhere.
+ */
+
+/** #792CF7 - the mark's own colour, sampled from the PNG. */
+export const MARK_COLOUR = '#792CF7';
+
+const MARK_PATH =
+  'M162 9580 c-7 -11 -18 -20 -26 -20 -17 0 -96 -78 -96 -95 0 -6 -9 -20 -20 -30 -20 -18 -20 -31 -20 -2350 0 -2009 2 -2334 14 -2338 8 -3 22 -22 31 -41 22 -47 83 -94 142 -112 40 -12 240 -14 1227 -14 1123 1 1181 0 1187 -17 12 -29 10 -1733 -1 -1754 -10 -18 -51 -18 -1203 -19 l-1192 0 -55 -28 c-37 -18 -66 -42 -87 -72 -18 -25 -39 -53 -48 -62 -13 -16 -15 -154 -15 -1231 0 -1201 0 -1214 20 -1232 11 -10 20 -22 20 -27 0 -20 48 -72 88 -95 23 -14 42 -29 42 -34 0 -5 501 -9 1225 -9 l1224 0 25 23 c14 12 41 35 61 51 20 16 47 51 61 77 l24 48 0 1018 c0 560 4 1024 8 1031 7 10 249 12 1208 13 l1199 0 5 -1028 c5 -1108 3 -1061 58 -1128 14 -16 41 -41 61 -55 20 -14 40 -31 44 -37 13 -20 702 -18 749 2 19 7 84 19 144 25 172 16 341 48 589 111 186 48 206 54 515 164 25 8 54 20 65 25 11 5 72 31 135 59 134 59 386 186 478 241 17 11 47 29 65 40 17 11 48 29 67 40 59 35 154 98 271 182 163 115 355 277 559 468 283 266 641 727 833 1073 9 18 35 64 57 102 59 104 220 441 220 460 0 4 8 26 19 49 21 48 28 65 91 251 60 180 90 277 90 293 0 8 8 44 19 80 43 153 83 375 102 567 6 61 17 125 25 144 20 49 20 757 0 816 -8 22 -19 92 -25 155 -26 275 -107 634 -210 935 -67 197 -79 229 -95 260 -9 17 -16 34 -16 39 0 5 -9 30 -21 55 -12 25 -29 64 -39 86 -41 90 -123 254 -160 320 -22 39 -48 84 -57 102 -66 118 -166 273 -293 451 -220 311 -578 681 -920 952 -162 129 -178 140 -340 247 -63 42 -127 84 -142 94 -15 11 -30 19 -34 19 -4 0 -15 6 -23 14 -52 45 -492 262 -676 333 -22 8 -55 21 -72 29 -29 12 -228 79 -353 118 -25 8 -94 26 -155 40 -60 15 -137 33 -170 42 -91 22 -279 52 -406 65 -63 6 -129 17 -148 25 -28 12 -472 14 -2985 14 -2940 0 -2951 0 -2964 -20z m5648 -2648 c153 -13 203 -20 340 -51 111 -25 188 -48 227 -66 17 -8 35 -15 40 -15 47 0 389 -183 494 -265 15 -11 39 -29 55 -40 114 -80 352 -322 434 -441 36 -52 108 -162 127 -194 42 -70 153 -303 153 -323 1 -6 9 -30 20 -52 11 -22 19 -46 20 -54 0 -8 9 -44 20 -80 98 -330 97 -754 -2 -1111 -113 -409 -365 -796 -693 -1068 -44 -37 -82 -69 -85 -72 -3 -3 -16 -13 -30 -22 -14 -10 -44 -31 -67 -47 -163 -116 -433 -240 -628 -290 -235 -60 -306 -68 -645 -73 l-185 -3 -5 1095 -5 1095 -27 52 c-33 61 -103 122 -155 134 -21 5 -572 9 -1225 9 l-1188 0 -5 23 c-3 12 -4 435 -3 940 3 803 5 919 18 927 23 14 2817 7 3000 -8z';
+
+/** An inline <svg> of the mark, `width` pixels wide; height follows the 262:240 shape. */
+export function markSvg(width: number, title = ''): string {
+  const height = Math.round(((width * 240) / 262) * 100) / 100;
+  const label = title ? ` role="img" aria-label="${title}"` : ' aria-hidden="true"';
+  return (
+    `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1048.12 960.13" width="${width}" height="${height}"${label}>` +
+    `<g transform="translate(0,960) scale(0.1,-0.1)" fill="${MARK_COLOUR}"><path d="${MARK_PATH}"/></g></svg>`
+  );
+}
+
+/*
+ * THE MARK, AS BLOCKS - the terminal banner.
+ *
+ * "DEFUSE" in chunky block letters with a box-drawing shadow.
+ */
+const BANNER = [
+  '██████╗ ███████╗███████╗██╗   ██╗███████╗███████╗',
+  '██╔══██╗██╔════╝██╔════╝██║   ██║██╔════╝██╔════╝',
+  '██║  ██║█████╗  █████╗  ██║   ██║███████╗█████╗',
+  '██║  ██║██╔══╝  ██╔══╝  ██║   ██║╚════██║██╔══╝',
+  '██████╔╝███████╗██║     ╚██████╔╝███████║███████╗',
+  '╚═════╝ ╚══════╝╚═╝      ╚═════╝ ╚══════╝╚══════╝',
+];
+
+/** Columns the banner needs. */
+export const BANNER_WIDTH = Math.max(...BANNER.map((l) => l.length));
+
+/** The banner as plain lines. */
+export function bannerLines(): string[] {
+  return [...BANNER];
+}

package/src/report/pricing.ts

@@ -0,0 +1,374 @@
+import { ALL_RULES } from '../rules/registry.js';
+import { LANGUAGES } from '../parse/languages.js';
+import type { BenchmarkResult } from './coverage-table.js';
+import { BASE_CSS, FOOTER_CSS, NAV_CSS, esc, siteFooter, siteNav } from './site.js';
+
+/**
+ * THE PRICING PAGE
+ * ================
+ *
+ * Generated like the landing page, and held to the same rule: it may not say
+ * more than is true today.
+ *
+ *   - Every feature listed under a plan EXISTS. Nothing planned is listed as
+ *     if it were built; a plan that is not built yet is shown as "coming soon"
+ *     with no price and no feature list.
+ *   - Numbers come from the registry and the measurement files, not from the
+ *     prose, so `npm test` fails if the page and the engine disagree.
+ *   - No "most popular" badge. There is nothing to be popular among yet, and a
+ *     badge that says otherwise is the kind of claim this project exists to
+ *     refuse. The cards do carry a badge, because the design has a place for
+ *     one - and it holds a FACT about the plan ("Open source", "5+ developers"),
+ *     never a ranking.
+ *   - How buying works is said plainly: there is no checkout. A plan is set up
+ *     by hand after someone asks.
+ *
+ * The paid tools are Defuse Team, a separate private program that reads the
+ * scanner's JSON. They organise findings; they never re-decide one. That is
+ * stated on the page, because it is the promise a buyer most needs.
+ */
+
+/** Where a plan enquiry goes: a public GitHub issue form, .github/ISSUE_TEMPLATE/plan-enquiry.yml. */
+const ENQUIRY_URL = 'https://github.com/Sikkuumi/Defuse/issues/new?template=plan-enquiry.yml';
+const enquiry = (plan: string): string => `${ENQUIRY_URL}&title=${encodeURIComponent(`Plan enquiry: ${plan}`)}`;
+
+export interface PlanFeature {
+  readonly name: string;
+  readonly detail: string;
+}
+
+export interface Plan {
+  readonly name: string;
+  readonly status: 'available' | 'coming-soon';
+  /** Shown only for an available plan. */
+  readonly price?: { readonly amount: string; readonly unit: string; readonly note?: string };
+  readonly forWhom: string;
+  /**
+   * A fact about the plan, shown in the corner of its card. A fact, never a
+   * ranking: "open source", "from 5 developers". See the note above on badges.
+   */
+  readonly badge?: string;
+  /** "Everything in Pro, and:" - the plan below this one. */
+  readonly builds?: string;
+  readonly features: readonly PlanFeature[];
+  readonly cta: { readonly label: string; readonly href: string; readonly primary?: boolean };
+}
+
+/** Team is priced per developer with a floor of this many. */
+export const TEAM_MIN_SEATS = 5;
+const TEAM_PRICE = 49;
+
+/** Rule/language pairs the engine declares it does not implement - counted, never typed in. */
+function countNotImplemented(): number {
+  let n = 0;
+  for (const rule of ALL_RULES) {
+    for (const language of LANGUAGES) {
+      if (rule.support[language.id]?.status === 'not-implemented') n++;
+    }
+  }
+  return n;
+}
+
+export function plans(): Plan[] {
+  const notImplemented = countNotImplemented();
+  return [
+    {
+      name: 'Community',
+      status: 'available',
+      price: { amount: 'Free', unit: 'for everyone, for good', note: 'Open source, AGPL-3.0' },
+      forWhom: 'Anyone scanning their own code, on their own machine or in their own CI.',
+      badge: 'Open source',
+      builds: 'Included:',
+      features: [
+        {
+          name: 'The scanner',
+          detail: `${LANGUAGES.length} languages and ${ALL_RULES.length} rules. Data flow is traced in every language, into other functions, and into other files in every language but PHP.`,
+        },
+        {
+          name: 'Two labels on every finding',
+          detail: 'Proven, with the path from source to sink printed; or to review, a matched pattern that was not traced. Never blended into one score.',
+        },
+        {
+          name: 'What it did not check',
+          detail: `Every run lists the rule and language pairs it does not cover - ${notImplemented} today - each with its reason.`,
+        },
+        {
+          name: 'Terminal, browser and CI',
+          detail: 'A terminal command, a browser page that scans on your own machine and uploads nothing, JSON output, and SARIF for GitHub code scanning.',
+        },
+        {
+          name: 'Client report',
+          detail: 'One HTML file for a client or a manager, with the proven problems, what to review and what was not checked. Prints to PDF.',
+        },
+      ],
+      cta: { label: 'Run it now', href: 'https://github.com/Sikkuumi/Defuse#readme' },
+    },
+    {
+      name: 'Pro',
+      status: 'available',
+      price: { amount: '$19', unit: 'per developer / month' },
+      forWhom: 'One developer working through findings over time, on their own machine.',
+      badge: 'One developer',
+      builds: 'Everything in Community, and:',
+      features: [
+        {
+          name: 'New problems only',
+          detail: 'Compare two scans and see only what a change added. A line that moved is matched, not called new; what disappeared is "no longer reported", never "fixed".',
+        },
+        {
+          name: 'Trend dashboard',
+          detail: 'Proven and to-review counts across your scans, in one file that opens offline. Where the scanner itself changed, the point is marked with the reason.',
+        },
+      ],
+      cta: { label: 'Ask for Pro', href: enquiry('Pro') },
+    },
+    {
+      name: 'Team',
+      status: 'available',
+      price: {
+        amount: `$${TEAM_PRICE}`,
+        unit: 'per developer / month',
+        note: `From ${TEAM_MIN_SEATS} developers ($${TEAM_PRICE * TEAM_MIN_SEATS} a month).`,
+      },
+      forWhom: 'A team that wants every pull request checked, and one shared record of what was decided.',
+      badge: `${TEAM_MIN_SEATS}+ developers`,
+      builds: 'Everything in Pro, and:',
+      features: [
+        {
+          name: 'Pull-request check',
+          detail: 'Each pull request is scanned against its base. One comment, updated on every push, lists only what it adds, and the check fails only on new problems at the level you set.',
+        },
+        {
+          name: 'Shared triage',
+          detail: 'False alarms and accepted risks are marked in the repository with a reason and a name. A mark never hides a finding, ends when the code changes, and a pull request cannot approve its own.',
+        },
+        {
+          name: 'Automatic history',
+          detail: 'One scan a day kept on its own branch, and the trend dashboard rebuilt on every push to main. On private repositories, unless you choose otherwise.',
+        },
+      ],
+      cta: { label: 'Ask for Team', href: enquiry('Team'), primary: true },
+    },
+    /*
+     * Business and Enterprise were listed here as "coming soon", each with a
+     * "Tell us you need it" button. Removed: a button for a plan that does not
+     * exist only brings requests nobody can fill. A plan is added back when it
+     * is built - and if one is listed before then, it is drawn as "coming
+     * soon", with no price and no features (planCard).
+     */
+  ];
+}
+
+/** Lucide's "check" icon (ISC licence), inline so the page still calls nobody. */
+const CHECK_ICON =
+  '<svg class="tick" viewBox="0 0 24 24" width="16" height="16" fill="none" stroke="currentColor" stroke-width="2.25" ' +
+  'stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M20 6 9 17l-5-5"/></svg>';
+
+function planCard(p: Plan): string {
+  if (p.status === 'coming-soon') {
+    return `      <div class="plan soon">
+        <h3 class="pname">${esc(p.name)}</h3>
+        <div class="tag">Coming soon</div>
+        <p class="who">${esc(p.forWhom)}</p>
+        <p class="who">Not available yet. If you need it, say so - it will be shaped around real requests rather than guessed at.</p>
+        <a class="pbtn" href="${esc(p.cta.href)}">${esc(p.cta.label)}</a>
+      </div>`;
+  }
+  const price = p.price!;
+  // One card: a header (name, who it is for, a fact in the corner), the price
+  // on one line, the features as a checked list, and one full-width button.
+  // The plan whose button is the primary one gets a brand-coloured ring.
+  return `      <div class="plan glass${p.cta.primary ? ' featured' : ''}">
+        <div class="phead">
+          <h3 class="pname">${esc(p.name)}</h3>
+          ${p.badge ? `<span class="badge">${esc(p.badge)}</span>` : ''}
+          <p class="who">${esc(p.forWhom)}</p>
+        </div>
+        <div class="pricebox">
+          <div class="priceline"><span class="amount">${esc(price.amount)}</span><span class="unit">${esc(price.unit)}</span></div>
+          ${price.note ? `<div class="pnote">${esc(price.note)}</div>` : ''}
+        </div>
+        ${p.builds ? `<div class="builds">${esc(p.builds)}</div>` : ''}
+        <ul class="feats">
+${p.features.map((f) => `          <li>${CHECK_ICON}<div><b>${esc(f.name)}</b><span>${esc(f.detail)}</span></div></li>`).join('\n')}
+        </ul>
+        <a class="pbtn${p.cta.primary ? ' primary' : ''}" href="${esc(p.cta.href)}">${esc(p.cta.label)}</a>
+      </div>`;
+}
+
+export function renderPricing(benchmark: BenchmarkResult): string {
+  // The precision figures stay on the main page, beside the footnote that says what they do and do not
+  // promise. Quoted alone on a page that sells, a 100% would read as a promise about your code.
+  const all = plans();
+  const available = all.filter((p) => p.status === 'available');
+  const soon = all.filter((p) => p.status === 'coming-soon');
+  const notImplemented = countNotImplemented();
+
+  return `<!doctype html>
+<html lang="en">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<title>Defuse — plans and pricing</title>
+<meta name="description" content="Defuse is free and open source. Paid plans add tools for working through findings over time and across a team - and never change what the scanner finds.">
+<meta property="og:title" content="Defuse — plans and pricing">
+<meta property="og:description" content="The scanner is free. Paid plans organise findings; they never re-decide one.">
+<meta property="og:type" content="website">
+<meta name="theme-color" content="#262626">
+<link rel="icon" href="defuse-mark.png">
+<style>
+${BASE_CSS}
+  header{position:relative;padding:0 0 clamp(40px,6vw,72px)}
+${NAV_CSS}
+  h1{font-size:clamp(38px,6.4vw,72px);letter-spacing:-2px;margin:22px 0 0;max-width:17ch}
+  .lede{margin-top:22px;font-size:clamp(16px,1.9vw,19px);font-weight:300;max-width:62ch}
+
+  /* ---------- the plans ----------
+     Card layout after shadcn's pricing card: a header with a fact badge in the
+     corner, the price on one line, a checked feature list, one full-width
+     button, and a ring on the plan whose button is the primary one. Drawn
+     with this site's own colours, fonts and glass surface - no framework. */
+  .plans{display:grid;grid-template-columns:1fr;gap:20px;margin-top:8px;max-width:420px;margin-left:auto;margin-right:auto}
+  @media(min-width:960px){.plans{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;max-width:none}}
+  .plan{position:relative;display:flex;flex-direction:column;border-radius:12px;box-shadow:0 1px 2px rgba(0,0,0,.25)}
+  .plan.featured{border-color:var(--brand);box-shadow:0 0 0 1px var(--brand),0 18px 50px -24px rgba(121,44,247,.55)}
+  .phead{position:relative;padding:24px 24px 0}
+  .pname{font-size:24px;font-weight:600;letter-spacing:-.4px;line-height:1.1;color:var(--white);padding-right:120px}
+  .badge{position:absolute;top:24px;right:24px;font-family:"IBM Plex Mono",monospace;font-size:11.5px;font-weight:500;letter-spacing:.3px;
+    color:var(--brand-soft);background:rgba(121,44,247,.14);border:1px solid rgba(121,44,247,.35);border-radius:999px;padding:3px 10px;white-space:nowrap}
+  .plan.featured .badge{color:var(--white);background:var(--brand);border-color:var(--brand)}
+  .who{margin-top:8px;font-size:14px;line-height:1.55;color:var(--mute)}
+  .pricebox{padding:22px 24px 0}
+  .priceline{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 8px}
+  .amount{font-weight:600;font-size:clamp(32px,3.2vw,38px);letter-spacing:-1.2px;line-height:1;color:var(--white);font-variant-numeric:tabular-nums}
+  .unit{font-size:14px;color:var(--mute)}
+  .pnote{margin-top:8px;font-size:13px;color:var(--faint)}
+  /* Side by side, the headers and price blocks are given the same height, so
+     the feature lists start on one line across the three cards. */
+  @media(min-width:960px){.plan .phead{min-height:130px}.plan .pricebox{min-height:92px}}
+  .builds{margin:20px 24px 0;padding-top:16px;border-top:1px solid var(--hair);font-family:"IBM Plex Mono",monospace;font-size:12px;letter-spacing:1px;color:var(--faint)}
+  .feats{list-style:none;margin:12px 24px 24px;flex-grow:1;display:flex;flex-direction:column;gap:14px}
+  .feats li{display:flex;gap:10px;align-items:flex-start}
+  .feats .tick{flex-shrink:0;margin-top:3px;color:var(--brand-soft)}
+  .feats b{display:block;font-weight:500;font-size:14.5px;color:var(--white)}
+  .feats span{display:block;margin-top:3px;font-size:13.5px;line-height:1.55;color:var(--mute)}
+  .pbtn{display:flex;align-items:center;justify-content:center;height:42px;margin:0 24px 24px;font-size:14px;font-weight:500;color:var(--white);
+    background:var(--glass);border:1px solid var(--line);border-radius:8px;padding:0 16px;transition:background 200ms ease,border-color 200ms ease}
+  .pbtn:hover{background:rgba(245,245,245,.07);border-color:var(--brand-lift);color:var(--white)}
+  .pbtn.primary{background:var(--brand);border-color:var(--brand)}
+  .pbtn.primary:hover{background:var(--brand-lift);border-color:var(--brand-lift)}
+  .pbtn:focus-visible{outline:2px solid var(--brand-soft);outline-offset:3px}
+
+  /* Not built yet: drawn as an outline with no price, so it cannot be mistaken
+     for something on sale. None are listed today - see plans(). */
+  .soonrow{display:grid;grid-template-columns:1fr;gap:18px;margin-top:18px}
+  @media(min-width:760px){.soonrow{grid-template-columns:1fr 1fr;gap:20px}}
+  .plan.soon{border:1px solid var(--hair);border-radius:12px;background:transparent;padding:24px;box-shadow:none}
+  .plan.soon .pname{color:var(--mute);font-size:20px;padding-right:0}
+  .plan.soon .who{margin-top:10px}
+  .plan.soon .pbtn{margin:20px 0 0;align-self:flex-start;color:var(--mute)}
+  .tag{margin-top:12px;align-self:flex-start;font-family:"IBM Plex Mono",monospace;font-size:11.5px;letter-spacing:1.4px;text-transform:uppercase;color:var(--mute);border:1px solid var(--line);border-radius:6px;padding:4px 9px}
+
+  /* ---------- promises, effort, buying ---------- */
+  .three{display:grid;grid-template-columns:1fr;gap:18px;margin-top:40px}
+  @media(min-width:900px){.three{grid-template-columns:repeat(3,1fr);gap:20px}}
+  .three .glass{padding:26px 24px}
+  .three h3{font-size:19px;font-weight:500;letter-spacing:-.3px;color:var(--white)}
+  .three p{margin-top:10px;font-size:14.5px}
+  .stats{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:40px}
+  @media(min-width:760px){.stats{grid-template-columns:repeat(4,1fr);gap:18px}}
+  .stat{padding:24px 22px;border-radius:14px}
+  .stat b{display:block;font-weight:700;font-size:clamp(26px,3.2vw,34px);letter-spacing:-1px}
+  .stat span{display:block;margin-top:5px;font-family:"IBM Plex Mono",monospace;font-size:11.5px;letter-spacing:1.4px;text-transform:uppercase;color:var(--faint)}
+  .steps{margin:26px 0 0 20px;color:var(--mute);max-width:70ch}
+  .steps li{margin:10px 0}
+  .steps strong{color:var(--white);font-weight:500}
+${FOOTER_CSS}
+</style>
+</head>
+<body>
+
+<header>
+  <div class="wrap">
+${siteNav('pricing')}
+    <div class="kicker" style="margin-top:clamp(30px,5vw,64px)">Plans and pricing</div>
+    <h1>The scanner is free. Teams pay for the tools around it.</h1>
+    <p class="lede">Community is the whole scanner, open source, with nothing held back. The paid plans add
+      tools for working through findings over time and across a team. They read what the scanner found;
+      they never change what it found or how it is labelled.</p>
+  </div>
+</header>
+
+<section id="plans" style="padding-top:clamp(36px,5vw,56px)">
+  <div class="wrap">
+    <div class="plans">
+${available.map(planCard).join('\n')}
+    </div>
+${soon.length > 0 ? `    <div class="soonrow">\n${soon.map(planCard).join('\n')}\n    </div>\n` : ''}    <p class="mono" style="margin-top:22px;font-size:12.5px;color:var(--faint);max-width:none">Prices in US dollars.
+      There is no checkout yet - see how buying works below.</p>
+  </div>
+</section>
+
+<section id="promise">
+  <div class="wrap">
+    <div class="kicker">The same in every plan</div>
+    <h2>Paying never makes<br>a guess look like a proof.</h2>
+    <div class="three">
+      <div class="glass">
+        <h3>The scanner decides</h3>
+        <p>The paid tools read the scanner's own output. They organise findings - compare them, mark them,
+          chart them - and never re-decide or relabel one.</p>
+      </div>
+      <div class="glass">
+        <h3>Nothing is hidden</h3>
+        <p>A finding your team marks is still listed, with the reason beside it. A comparison never calls a
+          finding fixed; it says "no longer reported", because that is all it can know.</p>
+      </div>
+      <div class="glass">
+        <h3>Your code stays with you</h3>
+        <p>Everything runs on your machine or in your own CI. There is no account to make and nothing is
+          uploaded anywhere.</p>
+      </div>
+    </div>
+  </div>
+</section>
+
+<section id="work">
+  <div class="wrap">
+    <div class="kicker">The work behind it</div>
+    <h2>Measured, and<br>published whole.</h2>
+    <p style="margin-top:20px">The engine is scored against OWASP BenchmarkJava, with the two labels scored
+      separately. Safety rules are switched off one at a time to prove a test notices. And the scanner
+      is run on large real projects - Django, WordPress and VS Code among them - to find what synthetic tests
+      miss. <a href="index.html#numbers">The measurements, and what they do not promise, are on the main page.</a></p>
+    <div class="stats">
+      <div class="stat glass"><b>${benchmark.scored.toLocaleString('en-US')}</b><span>benchmark cases scored</span></div>
+      <div class="stat glass"><b>${ALL_RULES.length}</b><span>rules</span></div>
+      <div class="stat glass"><b>${LANGUAGES.length}</b><span>languages traced</span></div>
+      <div class="stat glass"><b>${notImplemented}</b><span>gaps listed by name</span></div>
+    </div>
+  </div>
+</section>
+
+<section id="buying">
+  <div class="wrap">
+    <div class="kicker">How buying works, today</div>
+    <h2>Set up by hand,<br>for now.</h2>
+    <ol class="steps">
+      <li><strong>Ask</strong> using the button on the plan you want. It opens a short request form on GitHub.</li>
+      <li><strong>Hear back</strong> privately, with the licence terms and an invoice.</li>
+      <li><strong>Get the package</strong> - a file your machine or your CI installs next to the scanner.</li>
+    </ol>
+    <p style="margin-top:20px">The request form is public. Write only the plan, the number of developers and
+      how to reach you privately - never code, keys or company details.</p>
+  </div>
+</section>
+
+<div class="wrap">
+${siteFooter()}
+</div>
+
+</body>
+</html>
+`;
+}