Download app/index.html from lablab-ai-amd-developer-hackathon/pheromone: direct link, hf CLI and curl.
- Browser
- Download file 28.9 kB
-
https://huggingface.co/spaces/lablab-ai-amd-developer-hackathon/pheromone/resolve/main/app/index.html
- Command line
-
hf download hf://spaces/lablab-ai-amd-developer-hackathon/pheromone/app/index.html
-
curl -L -o index.html https://huggingface.co/spaces/lablab-ai-amd-developer-hackathon/pheromone/resolve/main/app/index.html
28.9 kB
| <html lang="en"> | |
| <head> | |
| <meta charset="utf-8" /> | |
| <meta name="viewport" content="width=device-width, initial-scale=1" /> | |
| <title>Pheromone — AI Recall Operating System</title> | |
| <meta | |
| name="description" | |
| content="Pheromone is a multi-agent recall operating system: trace provenance, notify affected customers, and proactively reassure safe customers with proof." | |
| /> | |
| <link rel="stylesheet" href="style.css" /> | |
| </head> | |
| <body> | |
| <a class="skipLink" href="#main">Skip to content</a> | |
| <header class="header"> | |
| <div class="container header__inner"> | |
| <a class="brand" href="#top" aria-label="Pheromone home"> | |
| <div class="logo" aria-hidden="true"> | |
| <span class="logo__dot"></span> | |
| <span class="logo__dot logo__dot--2"></span> | |
| <span class="logo__dot logo__dot--3"></span> | |
| </div> | |
| <div class="brand__text"> | |
| <div class="brand__name">Pheromone</div> | |
| <div class="brand__tag">AI Recall Operating System</div> | |
| </div> | |
| </a> | |
| <nav class="nav" aria-label="Primary"> | |
| <a class="nav__link" href="#problem">Problem</a> | |
| <a class="nav__link" href="#agents">Agents</a> | |
| <a class="nav__link" href="#provenance">Provenance</a> | |
| <a class="nav__link" href="#outcomes">Outcomes</a> | |
| </nav> | |
| <div class="header__actions"> | |
| <a class="btn btn--primary" id="demoLink" href="#" target="_blank" rel="noreferrer">View Demo Video</a> | |
| <a class="btn btn--secondary" id="githubLinkTop" href="https://github.com/" target="_blank" rel="noreferrer">GitHub</a> | |
| </div> | |
| </div> | |
| </header> | |
| <main id="main" class="container" tabindex="-1"> | |
| <section id="top" class="hero section section--hero"> | |
| <div class="hero__grid"> | |
| <div class="hero__left reveal"> | |
| <div class="eyebrow">AI RECALL OPERATING SYSTEM</div> | |
| <h1>Trace recalls. Notify the affected. Reassure the safe.</h1> | |
| <p class="hero__sub"> | |
| Pheromone is the first multi-agent recall system that proactively reaches both <span class="danger">affected</span> and | |
| <span class="ok">safe</span> customers — backed by supply chain provenance proof. | |
| </p> | |
| <div class="ctaRow"> | |
| <a class="btn btn--primary" id="demoLink2" href="#" target="_blank" rel="noreferrer">View Demo Video</a> | |
| <a class="btn btn--secondary" id="githubLink" href="https://github.com/" target="_blank" rel="noreferrer">GitHub</a> | |
| </div> | |
| <div class="amdBadge" role="note" aria-label="AMD stack badge"> | |
| <span class="amdBadge__pill">AMD</span> | |
| <span class="amdBadge__text">Running Qwen3-32B on AMD Instinct MI300X via vLLM + ROCm 7</span> | |
| </div> | |
| </div> | |
| <div class="hero__right reveal"> | |
| <figure class="heroAnim" aria-label="Animated supply chain recall story (loops every 12 seconds, pauses on hover)"> | |
| <svg class="heroAnim__svg" viewBox="0 0 720 420" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Supply chain nodes, recall detection, and customer notifications"> | |
| <defs> | |
| <filter id="softGlow" x="-50%" y="-50%" width="200%" height="200%"> | |
| <feGaussianBlur stdDeviation="3" result="blur" /> | |
| <feColorMatrix | |
| in="blur" | |
| type="matrix" | |
| values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 0.55 0" | |
| result="glow" | |
| /> | |
| <feMerge> | |
| <feMergeNode in="glow" /> | |
| <feMergeNode in="SourceGraphic" /> | |
| </feMerge> | |
| </filter> | |
| <marker id="arrow" viewBox="0 0 10 10" refX="10" refY="5" markerWidth="5" markerHeight="5" orient="auto-start-reverse"> | |
| <path d="M 0 0 L 10 5 L 0 10 z" fill="currentColor" /> | |
| </marker> | |
| </defs> | |
| <!-- Trails --> | |
| <g class="trail"> | |
| <path class="trail__path" d="M80 120 L180 120 L280 120 L380 120 L500 120 L640 120" /> | |
| <path class="trail__path trail__path--soft" d="M380 305 L460 260 L560 260" /> | |
| <path class="trail__path trail__path--soft" d="M380 305 L500 330 L610 330" /> | |
| </g> | |
| <!-- Nodes row --> | |
| <g class="nodes"> | |
| <g class="node" transform="translate(80,120)"> | |
| <circle class="node__ring" r="30" /> | |
| <circle class="node__fill" r="24" /> | |
| <g class="icon" aria-hidden="true"> | |
| <path d="M-6 9 C-14 1,-10 -12,6 -16 C14 -10,12 2,2 10 C-2 12,-4 12,-6 9Z" /> | |
| <path class="icon__stem" d="M0 6 L8 16" /> | |
| </g> | |
| <text class="node__label" y="52" text-anchor="middle">Ingredient</text> | |
| <text class="node__label" y="68" text-anchor="middle">Supplier</text> | |
| </g> | |
| <g class="node" transform="translate(180,120)"> | |
| <circle class="node__ring" r="30" /> | |
| <circle class="node__fill" r="24" /> | |
| <g class="icon" aria-hidden="true"> | |
| <rect x="-12" y="-10" width="24" height="18" rx="3" /> | |
| <path d="M-10 -6 L-6 -10 L-2 -6 L2 -10 L6 -6 L10 -10" class="icon__roof" /> | |
| <path d="M-8 2 H-2 M2 2 H8" class="icon__win" /> | |
| </g> | |
| <text class="node__label" y="52" text-anchor="middle">Plant 1</text> | |
| </g> | |
| <g class="node node--danger" id="plant2" transform="translate(280,120)"> | |
| <circle class="node__ring" r="30" /> | |
| <circle class="node__fill" r="24" /> | |
| <g class="icon" aria-hidden="true"> | |
| <rect x="-12" y="-10" width="24" height="18" rx="3" /> | |
| <path d="M-10 -6 L-6 -10 L-2 -6 L2 -10 L6 -6 L10 -10" class="icon__roof" /> | |
| <path d="M-8 2 H-2 M2 2 H8" class="icon__win" /> | |
| </g> | |
| <text class="node__label" y="52" text-anchor="middle">Plant 2</text> | |
| </g> | |
| <g class="node" transform="translate(380,120)"> | |
| <circle class="node__ring" r="30" /> | |
| <circle class="node__fill" r="24" /> | |
| <g class="icon" aria-hidden="true"> | |
| <path d="M-14 8 H8 V-2 H-2 V-10 H-14 Z" /> | |
| <circle cx="8" cy="6" r="4" /> | |
| <path d="M-10 4 H-4" class="icon__win" /> | |
| </g> | |
| <text class="node__label" y="52" text-anchor="middle">Distributor</text> | |
| </g> | |
| <g class="node" id="storeNode" transform="translate(500,120)"> | |
| <circle class="node__ring" r="30" /> | |
| <circle class="node__fill" r="24" /> | |
| <g class="icon" aria-hidden="true"> | |
| <path d="M-14 -2 H14 L10 -12 H-10 Z" /> | |
| <rect x="-12" y="-2" width="24" height="16" rx="2" /> | |
| <path d="M-8 6 H-2 M2 6 H8" class="icon__win" /> | |
| </g> | |
| <text class="node__label" y="52" text-anchor="middle">Store</text> | |
| </g> | |
| <g class="node" transform="translate(640,120)"> | |
| <circle class="node__ring" r="30" /> | |
| <circle class="node__fill" r="24" /> | |
| <g class="icon" aria-hidden="true"> | |
| <circle cx="0" cy="-6" r="7" /> | |
| <path d="M-14 16 C-12 4,-4 2,0 2 C4 2,12 4,14 16" /> | |
| </g> | |
| <text class="node__label" y="52" text-anchor="middle">Customer</text> | |
| </g> | |
| </g> | |
| <!-- Pheromone node --> | |
| <g class="pheromone" transform="translate(380,305)"> | |
| <circle class="pheromone__ring anim anim--glow" r="36" /> | |
| <circle class="pheromone__core" r="22" /> | |
| <text class="pheromone__label" y="58" text-anchor="middle">Pheromone</text> | |
| </g> | |
| <!-- Recall detected callout --> | |
| <g class="callout anim anim--callout" transform="translate(280,56)"> | |
| <rect x="-64" y="-16" width="128" height="32" rx="16" /> | |
| <text text-anchor="middle" dominant-baseline="middle">Recall Detected</text> | |
| </g> | |
| <!-- Dots: contamination path --> | |
| <g class="dots"> | |
| <circle class="dot dot--danger anim anim--contam" r="5" /> | |
| <circle class="dot dot--ok anim anim--flowOk1" r="4.5" /> | |
| <circle class="dot dot--ok anim anim--flowOk2" r="4.5" /> | |
| <circle class="dot dot--danger anim anim--flowBad1" r="4.5" /> | |
| <circle class="dot dot--danger anim anim--flowBad2" r="4.5" /> | |
| <!-- Mixing swarm --> | |
| <circle class="dot dot--ok anim anim--mix1" r="3.5" /> | |
| <circle class="dot dot--danger anim anim--mix2" r="3.5" /> | |
| <circle class="dot dot--neutral anim anim--mix3" r="3.5" /> | |
| <!-- Notifications streams --> | |
| <circle class="dot dot--danger anim anim--notifyBad1" r="4.5" /> | |
| <circle class="dot dot--danger anim anim--notifyBad2" r="4.5" /> | |
| <circle class="dot dot--danger anim anim--notifyBad3" r="4.5" /> | |
| <circle class="dot dot--ok anim anim--notifyOk1" r="4.5" /> | |
| <circle class="dot dot--ok anim anim--notifyOk2" r="4.5" /> | |
| <circle class="dot dot--ok anim anim--notifyOk3" r="4.5" /> | |
| <circle class="dot dot--ok anim anim--notifyOk4" r="4.5" /> | |
| <circle class="dot dot--ok anim anim--notifyOk5" r="4.5" /> | |
| </g> | |
| <!-- Customers row --> | |
| <g class="custRow"> | |
| <g class="cust" transform="translate(460,260)"> | |
| <circle class="cust__head" r="7" cx="0" cy="-8" /> | |
| <path class="cust__body" d="M-12 18 C-10 5,-4 2,0 2 C4 2,10 5,12 18" /> | |
| <g class="notif notif--bad anim anim--notifBad1" aria-hidden="true"> | |
| <rect x="10" y="-26" width="26" height="18" rx="6" /> | |
| <path d="M14 -18 H32" /> | |
| </g> | |
| <g class="notif notif--ok anim anim--notifOk1" aria-hidden="true"> | |
| <circle cx="26" cy="-18" r="10" /> | |
| <path d="M21 -18 L25 -14 L31 -22" /> | |
| </g> | |
| </g> | |
| <g class="cust" transform="translate(520,260)"> | |
| <circle class="cust__head" r="7" cx="0" cy="-8" /> | |
| <path class="cust__body" d="M-12 18 C-10 5,-4 2,0 2 C4 2,10 5,12 18" /> | |
| <g class="notif notif--bad anim anim--notifBad2" aria-hidden="true"> | |
| <rect x="10" y="-26" width="26" height="18" rx="6" /> | |
| <path d="M14 -18 H32" /> | |
| </g> | |
| <g class="notif notif--ok anim anim--notifOk2" aria-hidden="true"> | |
| <circle cx="26" cy="-18" r="10" /> | |
| <path d="M21 -18 L25 -14 L31 -22" /> | |
| </g> | |
| </g> | |
| <g class="cust" transform="translate(580,260)"> | |
| <circle class="cust__head" r="7" cx="0" cy="-8" /> | |
| <path class="cust__body" d="M-12 18 C-10 5,-4 2,0 2 C4 2,10 5,12 18" /> | |
| <g class="notif notif--bad anim anim--notifBad3" aria-hidden="true"> | |
| <rect x="10" y="-26" width="26" height="18" rx="6" /> | |
| <path d="M14 -18 H32" /> | |
| </g> | |
| <g class="notif notif--ok anim anim--notifOk3" aria-hidden="true"> | |
| <circle cx="26" cy="-18" r="10" /> | |
| <path d="M21 -18 L25 -14 L31 -22" /> | |
| </g> | |
| </g> | |
| <g class="cust" transform="translate(460,330)"> | |
| <circle class="cust__head" r="7" cx="0" cy="-8" /> | |
| <path class="cust__body" d="M-12 18 C-10 5,-4 2,0 2 C4 2,10 5,12 18" /> | |
| <g class="notif notif--ok anim anim--notifOk4" aria-hidden="true"> | |
| <circle cx="26" cy="-18" r="10" /> | |
| <path d="M21 -18 L25 -14 L31 -22" /> | |
| </g> | |
| </g> | |
| <g class="cust" transform="translate(520,330)"> | |
| <circle class="cust__head" r="7" cx="0" cy="-8" /> | |
| <path class="cust__body" d="M-12 18 C-10 5,-4 2,0 2 C4 2,10 5,12 18" /> | |
| <g class="notif notif--ok anim anim--notifOk5" aria-hidden="true"> | |
| <circle cx="26" cy="-18" r="10" /> | |
| <path d="M21 -18 L25 -14 L31 -22" /> | |
| </g> | |
| </g> | |
| </g> | |
| <!-- Labels for notification phase --> | |
| <g class="phaseLabels"> | |
| <g class="phaseLabel phaseLabel--bad anim anim--labelBad" transform="translate(520,220)"> | |
| <rect x="-90" y="-16" width="180" height="32" rx="16" /> | |
| <text text-anchor="middle" dominant-baseline="middle">Affected — action needed</text> | |
| </g> | |
| <g class="phaseLabel phaseLabel--ok anim anim--labelOk" transform="translate(540,360)"> | |
| <rect x="-88" y="-16" width="176" height="32" rx="16" /> | |
| <text text-anchor="middle" dominant-baseline="middle">Safe — here’s why</text> | |
| </g> | |
| </g> | |
| </svg> | |
| <figcaption class="heroAnim__cap">Multi-plant manufacturer. One plant contaminated. Pheromone identifies who’s affected and reassures who isn’t — with proof.</figcaption> | |
| </figure> | |
| </div> | |
| </div> | |
| </section> | |
| <section id="problem" class="section"> | |
| <div class="section__head reveal"> | |
| <h2>The problem</h2> | |
| <p class="muted">When recalls hit, systems are built for containment — not for trust.</p> | |
| </div> | |
| <div class="grid3"> | |
| <article class="card reveal"> | |
| <h3>Customers panic</h3> | |
| <p class="muted"> | |
| When recalls hit the news, even safe customers throw away clean food and demand refunds. Stores lose money and trust. | |
| </p> | |
| </article> | |
| <article class="card reveal"> | |
| <h3>Stores can’t pinpoint</h3> | |
| <p class="muted"> | |
| The data exists — receipts, loyalty cards, transactions — but stores don’t have the tools to use it under pressure. | |
| </p> | |
| </article> | |
| <article class="card reveal"> | |
| <h3>Affected don’t find out</h3> | |
| <p class="muted"> | |
| 84% of grocery chains have no purchase-level notification policy. Affected customers learn from the news, days late. | |
| </p> | |
| </article> | |
| </div> | |
| <p class="emphasis reveal">3,000 deaths a year from foodborne illness. This isn’t a tech gap — it’s a tools gap.</p> | |
| </section> | |
| <section id="agents" class="section"> | |
| <div class="section__head reveal"> | |
| <h2>Five agents. Each solves a piece of the chaos.</h2> | |
| <p class="muted">A calm pipeline: structured intake, defensible trace, probabilistic matching, operations, and comms.</p> | |
| </div> | |
| <div class="agentFlow reveal" role="img" aria-label="Five-agent pipeline: Intake to Comms with looping pulse and data packet animation"> | |
| <div class="agentFlow__row"> | |
| <article class="agentCard" data-agent="1"> | |
| <div class="agentCard__name">Intake</div> | |
| <div class="agentCard__desc">Parses messy recall notices into structured JSON</div> | |
| </article> | |
| <div class="agentArrow" aria-hidden="true"></div> | |
| <article class="agentCard" data-agent="2"> | |
| <div class="agentCard__name">Trace</div> | |
| <div class="agentCard__desc">Walks the supply chain backward through recursive SQL</div> | |
| </article> | |
| <div class="agentArrow" aria-hidden="true"></div> | |
| <article class="agentCard" data-agent="3"> | |
| <div class="agentCard__name">Match</div> | |
| <div class="agentCard__desc">Computes per-transaction probability of affectation</div> | |
| </article> | |
| <div class="agentArrow" aria-hidden="true"></div> | |
| <article class="agentCard" data-agent="4"> | |
| <div class="agentCard__name">Ops</div> | |
| <div class="agentCard__desc">Generates store-side actions (pulls, blocks, tasks)</div> | |
| </article> | |
| <div class="agentArrow" aria-hidden="true"></div> | |
| <article class="agentCard" data-agent="5"> | |
| <div class="agentCard__name">Comms</div> | |
| <div class="agentCard__desc">Drafts customer messages in the right tier and language</div> | |
| </article> | |
| <div class="agentPacket" aria-hidden="true"></div> | |
| </div> | |
| <div class="agentFlow__footer"> | |
| <div class="agentFooter__line" aria-hidden="true"></div> | |
| <article class="complianceCard"> | |
| <div class="complianceCard__name">Compliance Logger</div> | |
| <div class="complianceCard__desc">Passive system writing every step to an audit trail.</div> | |
| </article> | |
| </div> | |
| </div> | |
| </section> | |
| <section id="provenance" class="section"> | |
| <div class="section__head reveal"> | |
| <h2>How probabilistic provenance actually works.</h2> | |
| <p class="muted">In a real store, lots get mixed. Pheromone doesn’t pretend to know. It computes probability.</p> | |
| </div> | |
| <div class="provenance reveal"> | |
| <div class="provenance__viz" role="img" aria-label="Shelf scenario: three units from two plants with three customers and analysis cards"> | |
| <svg class="provSvg" viewBox="0 0 980 520" xmlns="http://www.w3.org/2000/svg" aria-hidden="true"> | |
| <defs> | |
| <linearGradient id="shelfGrad" x1="0" y1="0" x2="0" y2="1"> | |
| <stop offset="0" stop-color="#0f172a" /> | |
| <stop offset="1" stop-color="#0a0e1a" /> | |
| </linearGradient> | |
| </defs> | |
| <rect x="40" y="60" width="900" height="150" rx="22" fill="url(#shelfGrad)" stroke="rgba(245,240,232,0.10)" /> | |
| <rect x="70" y="190" width="840" height="10" rx="5" fill="rgba(245,240,232,0.12)" /> | |
| <!-- Products --> | |
| <g class="unit unit--safe" transform="translate(170,92)"> | |
| <rect x="-52" y="0" width="104" height="92" rx="16" /> | |
| <rect class="unit__label" x="-44" y="12" width="88" height="20" rx="10" /> | |
| <text class="unit__txt" x="0" y="27" text-anchor="middle">Sunny Valley</text> | |
| <text class="unit__txt2" x="0" y="52" text-anchor="middle">Salsa</text> | |
| </g> | |
| <g class="unit unit--bad" transform="translate(330,92)"> | |
| <rect x="-52" y="0" width="104" height="92" rx="16" /> | |
| <rect class="unit__label" x="-44" y="12" width="88" height="20" rx="10" /> | |
| <text class="unit__txt" x="0" y="27" text-anchor="middle">Sunny Valley</text> | |
| <text class="unit__txt2" x="0" y="52" text-anchor="middle">Salsa</text> | |
| </g> | |
| <g class="unit unit--safe" transform="translate(490,92)"> | |
| <rect x="-52" y="0" width="104" height="92" rx="16" /> | |
| <rect class="unit__label" x="-44" y="12" width="88" height="20" rx="10" /> | |
| <text class="unit__txt" x="0" y="27" text-anchor="middle">Sunny Valley</text> | |
| <text class="unit__txt2" x="0" y="52" text-anchor="middle">Salsa</text> | |
| </g> | |
| <!-- Customers --> | |
| <g class="cust2" transform="translate(160,352)"> | |
| <circle cx="0" cy="-14" r="10" /> | |
| <path d="M-18 30 C-14 6,-6 0,0 0 C6 0,14 6,18 30" /> | |
| <text class="custLbl" x="0" y="56" text-anchor="middle">Customer A</text> | |
| <text class="custLbl2" x="0" y="74" text-anchor="middle">8:05am · card</text> | |
| </g> | |
| <g class="cust2" transform="translate(360,352)"> | |
| <circle cx="0" cy="-14" r="10" /> | |
| <path d="M-18 30 C-14 6,-6 0,0 0 C6 0,14 6,18 30" /> | |
| <text class="custLbl" x="0" y="56" text-anchor="middle">Customer B</text> | |
| <text class="custLbl2" x="0" y="74" text-anchor="middle">11:30am · cash</text> | |
| </g> | |
| <g class="cust2" transform="translate(560,352)"> | |
| <circle cx="0" cy="-14" r="10" /> | |
| <path d="M-18 30 C-14 6,-6 0,0 0 C6 0,14 6,18 30" /> | |
| <text class="custLbl" x="0" y="56" text-anchor="middle">Customer C</text> | |
| <text class="custLbl2" x="0" y="74" text-anchor="middle">2:14pm · loyalty</text> | |
| </g> | |
| <!-- Connectors to cards --> | |
| <g class="provLines"> | |
| <path d="M160 390 C220 410,240 420,270 436" marker-end="url(#arrow)" /> | |
| <path d="M360 390 C420 410,450 420,482 446" marker-end="url(#arrow)" /> | |
| <path d="M560 390 C620 410,660 420,690 456" marker-end="url(#arrow)" /> | |
| </g> | |
| </svg> | |
| <div class="shelfLabels" aria-hidden="true"> | |
| <div class="shelfLabel shelfLabel--ok"> | |
| <div class="shelfLabel__top">Unit 1: Plant 1</div> | |
| <div class="shelfLabel__bot">SAFE</div> | |
| </div> | |
| <div class="shelfLabel shelfLabel--bad"> | |
| <div class="shelfLabel__top">Unit 2: Plant 2</div> | |
| <div class="shelfLabel__bot">CONTAMINATED</div> | |
| </div> | |
| <div class="shelfLabel shelfLabel--ok"> | |
| <div class="shelfLabel__top">Unit 3: Plant 1</div> | |
| <div class="shelfLabel__bot">SAFE</div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="provenance__cards"> | |
| <article class="analysisCard analysisCard--warn reveal"> | |
| <div class="analysisCard__k">Customer A</div> | |
| <div class="analysisCard__t">Purchase at 8:05am. Shelf composition: 3 units (1 affected, 2 safe). Probability of affected pick: <b>33%</b>.</div> | |
| <div class="analysisCard__b">Tier: <b>POSSIBLE AFFECTED</b>. We have identity (card) — direct message sent.</div> | |
| </article> | |
| <article class="analysisCard analysisCard--warn reveal"> | |
| <div class="analysisCard__k">Customer B</div> | |
| <div class="analysisCard__t">Purchase at 11:30am. Cash payment, identity unknown. Shelf state at time: 2 units (1 affected, 1 safe). Probability: <b>50%</b>.</div> | |
| <div class="analysisCard__b">Tier: <b>POSSIBLE AFFECTED</b>. Can’t message directly — issue a specific public notice with a time window.</div> | |
| </article> | |
| <article class="analysisCard analysisCard--ok reveal"> | |
| <div class="analysisCard__k">Customer C</div> | |
| <div class="analysisCard__t">Purchase at 2:14pm. Shelf state: 1 unit, the safe one. Probability of affected pick: <b>0%</b>.</div> | |
| <div class="analysisCard__b">Tier: <b>CONFIRMED UNAFFECTED</b>. Reassurance sent with provenance proof.</div> | |
| </article> | |
| </div> | |
| </div> | |
| <p class="note reveal"> | |
| This is the part no other recall system does: specificity of public notices, reassurance with proof, probability instead of guessing. | |
| </p> | |
| </section> | |
| <section id="outcomes" class="section"> | |
| <div class="section__head reveal"> | |
| <h2>Existing apps notify only the affected. Pheromone reaches both.</h2> | |
| <p class="muted">Time-bound. Defensible. Proactive.</p> | |
| </div> | |
| <div class="grid2"> | |
| <article class="smsCard smsCard--bad reveal" aria-label="Mock SMS for affected customer"> | |
| <header class="smsCard__head"> | |
| <div> | |
| <div class="smsCard__title">AFFECTED CUSTOMER</div> | |
| <div class="smsCard__sub">Confirmed Affected · drafted in Spanish (or the customer’s preferred language)</div> | |
| </div> | |
| </header> | |
| <pre class="sms" aria-label="Affected SMS message"> | |
| Acción urgente: retiro RG-4429 (high) | |
| Su compra está confirmadamente afectada. | |
| Peligro: Salmonella. Severidad: alta. | |
| No consuma el producto. Devuélvalo para reembolso. | |
| Nota de riesgo: mayor riesgo para bebés/niños pequeños y personas vulnerables. | |
| Prueba de procedencia: su compra proviene de la Planta 2 según inventario al momento de la venta. | |
| As of <span data-now="iso">2026-05-10T04:22:53Z</span>.</pre> | |
| </article> | |
| <article class="smsCard smsCard--ok reveal" aria-label="Mock SMS for reassured customer"> | |
| <header class="smsCard__head"> | |
| <div> | |
| <div class="smsCard__title">REASSURED CUSTOMER</div> | |
| <div class="smsCard__sub">Confirmed Unaffected · the killer feature</div> | |
| </div> | |
| </header> | |
| <pre class="sms" aria-label="Reassured SMS message"> | |
| Update on recall RG-4429 | |
| Good news: based on our records, your recent purchase came from Plant 1, not the affected Plant 2. | |
| We’ve verified this against shipment records. No action needed. | |
| We will notify you immediately if recall scope changes. | |
| Provenance check completed at <span data-now="iso">2026-05-10T04:22:53Z</span>.</pre> | |
| </article> | |
| </div> | |
| </section> | |
| <section class="section"> | |
| <div class="section__head reveal"> | |
| <h2>Validation + stack</h2> | |
| </div> | |
| <div class="stats reveal" role="list" aria-label="Validation stats"> | |
| <div class="stat" role="listitem"><div class="stat__n">67/67</div><div class="stat__k">tests passing</div></div> | |
| <div class="stat" role="listitem"><div class="stat__n">5</div><div class="stat__k">specialized agents</div></div> | |
| <div class="stat" role="listitem"><div class="stat__n">6</div><div class="stat__k">confidence tiers</div></div> | |
| <div class="stat" role="listitem"><div class="stat__n">25</div><div class="stat__k">real OpenFDA fixtures</div></div> | |
| </div> | |
| <div class="stackBadges reveal" aria-label="Stack badges"> | |
| <span class="chip">Qwen3-32B</span> | |
| <span class="chip">vLLM 0.17.1</span> | |
| <span class="chip">ROCm 7.0</span> | |
| <span class="chip chip--amd">AMD Instinct MI300X</span> | |
| <span class="chip">192GB HBM3</span> | |
| <span class="chip">LangGraph</span> | |
| <span class="chip">Postgres</span> | |
| <span class="chip">Next.js</span> | |
| </div> | |
| </section> | |
| <section class="section section--cta"> | |
| <div class="ctaCard reveal"> | |
| <h2>Pheromone is open-source. Built solo on AMD’s stack.</h2> | |
| <div class="ctaCard__row"> | |
| <a class="btn btn--secondary" id="githubLinkBottom" href="https://github.com/" target="_blank" rel="noreferrer">GitHub</a> | |
| <a class="btn btn--primary" id="demoLink3" href="#" target="_blank" rel="noreferrer">Demo Video</a> | |
| <a class="btn btn--secondary" id="xLink" href="https://x.com/" target="_blank" rel="noreferrer">Build-in-Public Thread</a> | |
| <a class="btn btn--secondary" id="techLink" href="https://github.com/" target="_blank" rel="noreferrer">Technical Walkthrough</a> | |
| </div> | |
| <div class="footerNote">AMD Developer Hackathon 2026 · Solo build by Preyash Yadav · <a id="siteLink" href="https://preyashyadav.com" target="_blank" rel="noreferrer">preyashyadav.com</a></div> | |
| </div> | |
| </section> | |
| </main> | |
| <script src="app.js"></script> | |
| </body> | |
| </html> | |