filing / index.html
caustino's picture
Update index.html
30b2df5 verified
Raw History Blame Contribute Delete
32.1 kB
<!DOCTYPE html>
<html lang="en" class="scroll-smooth">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>MCML Master Unified Filing & Technical Portfolio</title>
<script src="https://cdn.tailwindcss.com"></script>
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/animejs/3.2.1/anime.min.js"></script>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600;800&family=JetBrains+Mono:wght@400;700&display=swap" rel="stylesheet">
<script>
tailwind.config = {
theme: {
extend: {
colors: {
navy: '#0f172a',
courtblue: '#1e3a8a',
gold: '#b45309',
techcyan: '#06b6d4',
},
fontFamily: {
sans: ['Inter', 'sans-serif'],
mono: ['JetBrains Mono', 'monospace'],
}
}
}
}
</script>
<style>
body { background-color: #f8fafc; color: #0f172a; overflow-x: hidden; }
.glass-panel {
background: rgba(255, 255, 255, 0.85);
backdrop-filter: blur(12px);
border: 1px solid rgba(255, 255, 255, 0.3);
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.03);
}
.chart-container {
position: relative;
width: 100%;
max-width: 600px;
margin-left: auto;
margin-right: auto;
height: 300px;
max-height: 400px;
}
/* Animation Initial States */
.reveal { opacity: 0; transform: translateY(30px); }
.reveal-left { opacity: 0; transform: translateX(-50px); }
.reveal-right { opacity: 0; transform: translateX(50px); }
.bar-grow { transform: scaleX(0); transform-origin: left; }
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: #f1f5f9; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #94a3b8; }
</style>
</head>
<body class="antialiased font-sans">
<!-- Navigation -->
<nav class="fixed w-full z-50 glass-panel border-b border-gray-200">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="flex justify-between h-16 items-center">
<div class="flex-shrink-0 flex items-center gap-3">
<div class="w-8 h-8 rounded-full bg-gradient-to-br from-courtblue to-techcyan flex items-center justify-center shadow-lg">
<span class="text-white font-bold text-sm">CM</span>
</div>
<span class="font-bold text-xl tracking-tight text-navy">Master Unified Filing</span>
</div>
<div class="hidden md:flex space-x-8">
<a href="#overview" class="text-gray-600 hover:text-courtblue font-medium transition-colors">Overview</a>
<a href="#charts" class="text-gray-600 hover:text-courtblue font-medium transition-colors">Scientific Data</a>
<a href="#courts" class="text-gray-600 hover:text-courtblue font-medium transition-colors">Jurisdictions</a>
<a href="#patents" class="text-gray-600 hover:text-courtblue font-medium transition-colors">Patents</a>
</div>
</div>
</div>
</nav>
<!-- Hero Section -->
<header class="relative pt-32 pb-20 lg:pt-48 lg:pb-32 overflow-hidden">
<div class="absolute inset-0 -z-10 bg-[radial-gradient(ellipse_at_top_right,_var(--tw-gradient-stops))] from-blue-100 via-white to-white"></div>
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative">
<div class="text-center max-w-3xl mx-auto">
<span class="inline-block py-1 px-3 rounded-full bg-blue-100 text-courtblue text-sm font-semibold mb-6 border border-blue-200 animate-pulse">
Docket Master: MCML-MULTICOURT-2026-001
</span>
<h1 class="text-4xl md:text-6xl font-extrabold text-navy tracking-tight mb-6 hero-title">
Integrated <span class="text-transparent bg-clip-text bg-gradient-to-r from-courtblue to-techcyan">Bio-Legal</span> Architecture
</h1>
<p class="mt-4 text-xl text-gray-600 mb-8 hero-subtitle">
Simultaneous multi-court filing and technical disclosure. Bridging the gap between novel mechanistic biology, post-quantum computing, and rigorous constitutional execution.
</p>
<div class="flex justify-center gap-4 hero-buttons">
<a href="#charts" class="bg-navy hover:bg-gray-800 text-white px-8 py-3 rounded-lg font-medium transition-all shadow-lg hover:shadow-xl transform hover:-translate-y-1">Explore Data</a>
<a href="#courts" class="bg-white hover:bg-gray-50 text-navy border border-gray-300 px-8 py-3 rounded-lg font-medium transition-all shadow-sm hover:shadow-md transform hover:-translate-y-1">View Filings</a>
</div>
</div>
</div>
</header>
<!-- Overview Section -->
<section id="overview" class="py-20 bg-white">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="grid md:grid-cols-2 gap-12 items-center">
<div class="reveal-left">
<h2 class="text-3xl font-bold text-navy mb-6">The Unified Factual Nexus</h2>
<div class="space-y-4 text-gray-600 leading-relaxed">
<p>This portfolio unites a <strong>$500,000,000</strong> corporate debt conversion (USEC to Centrus Energy), a documented violation of ADA Title II regarding neurogenetic disabilities, and a suite of patent-pending biotechnologies.</p>
<p>The State of Maryland fully terminated a wrongful prosecution, yet a duplicate derivative file remains open as a ghost record in NCIC/METERS, creating active bench warrants.</p>
<p>Concurrently, administrative delays and the refusal to accommodate cognitive load (via AI prosthetics) have caused measurable biological harm, necessitating the ZINC-MOD and IPC-04 biopharma interventions.</p>
</div>
<ul class="mt-8 space-y-3 font-mono text-sm">
<li class="flex items-center text-gray-700"><span class="w-2 h-2 bg-techcyan rounded-full mr-3"></span> Genomic Matrix: COMT, DRD2, FKBP5, BDNF</li>
<li class="flex items-center text-gray-700"><span class="w-2 h-2 bg-gold rounded-full mr-3"></span> Asset Conversion: 45,850,000 LEU Shares</li>
<li class="flex items-center text-gray-700"><span class="w-2 h-2 bg-courtblue rounded-full mr-3"></span> IP Estate: ZINC-MOD, HSPA v3.0, Open Diamond</li>
</ul>
</div>
<div class="reveal-right grid grid-cols-2 gap-4">
<div class="glass-panel p-6 rounded-2xl">
<div class="text-4xl font-bold text-courtblue mb-2">$500M</div>
<div class="text-sm text-gray-500 font-medium">Debt Conversion</div>
</div>
<div class="glass-panel p-6 rounded-2xl mt-8">
<div class="text-4xl font-bold text-techcyan mb-2">7</div>
<div class="text-sm text-gray-500 font-medium">Jurisdictions</div>
</div>
<div class="glass-panel p-6 rounded-2xl">
<div class="text-4xl font-bold text-gold mb-2">30k</div>
<div class="text-sm text-gray-500 font-medium">Annual Preventable Deaths</div>
</div>
<div class="glass-panel p-6 rounded-2xl mt-8">
<div class="text-4xl font-bold text-red-600 mb-2">0</div>
<div class="text-sm text-gray-500 font-medium">DNA Cuts (ZINC-MOD)</div>
</div>
</div>
</div>
</div>
</section>
<!-- Scientific Data & Charts Section -->
<section id="charts" class="py-20 bg-slate-50 border-t border-gray-200">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="text-center mb-16 reveal">
<h2 class="text-3xl font-bold text-navy mb-4">Scientific & Mechanistic Evidence</h2>
<p class="text-gray-600 max-w-2xl mx-auto">Quantitative analysis of the Bioinorganic Zinc Modulation strategy vs. traditional Genomic Editing, alongside therapeutic synergy models.</p>
</div>
<div class="grid md:grid-cols-2 gap-8">
<!-- Chart 1: Radar -->
<div class="glass-panel p-6 rounded-2xl reveal">
<h3 class="text-lg font-bold text-navy mb-2">Safety & Risk Profile</h3>
<p class="text-xs text-gray-500 mb-4">Genomic Editing vs. Bioinorganic Zinc Modulation</p>
<div class="chart-container">
<canvas id="riskRadarChart"></canvas>
</div>
</div>
<!-- Chart 2: Donut -->
<div class="glass-panel p-6 rounded-2xl reveal">
<h3 class="text-lg font-bold text-navy mb-2">HIV Reservoir Distribution</h3>
<p class="text-xs text-gray-500 mb-4">Anatomical hiding places for latent provirus</p>
<div class="chart-container">
<canvas id="reservoirDonutChart"></canvas>
</div>
</div>
<!-- Chart 3: Scatter -->
<div class="glass-panel p-6 rounded-2xl reveal">
<h3 class="text-lg font-bold text-navy mb-2">Therapeutic Window (Ejectors)</h3>
<p class="text-xs text-gray-500 mb-4">EC50 (Potency) vs CC50 (Cytotoxicity)</p>
<div class="chart-container">
<canvas id="ejectorScatterChart"></canvas>
</div>
</div>
<!-- Chart 4: Bar -->
<div class="glass-panel p-6 rounded-2xl reveal">
<h3 class="text-lg font-bold text-navy mb-2">Dendritic Cell (DC) Phenotype</h3>
<p class="text-xs text-gray-500 mb-4">Immune Activation via Zinc Chelation</p>
<div class="chart-container">
<canvas id="dcPhenotypeChart"></canvas>
</div>
</div>
<!-- Chart 5: Stacked Bar -->
<div class="glass-panel p-6 rounded-2xl reveal md:col-span-2">
<h3 class="text-lg font-bold text-navy mb-2">Shock and Kill Synergy Model</h3>
<p class="text-xs text-gray-500 mb-4">Combining LRA, Chelators, and Vaccines for Cumulative Efficacy</p>
<div class="chart-container max-w-3xl">
<canvas id="synergyStackedChart"></canvas>
</div>
</div>
<!-- Chart 6: Horizontal Bar -->
<div class="glass-panel p-6 rounded-2xl reveal md:col-span-2">
<h3 class="text-lg font-bold text-navy mb-2">Comparative Favorability Matrix</h3>
<p class="text-xs text-gray-500 mb-4">Overall assessment of CRISPR/ZFN vs Bioinorganic Strategy</p>
<div class="chart-container max-w-3xl">
<canvas id="comparativeBarChart"></canvas>
</div>
</div>
</div>
</div>
</section>
<!-- Court Jurisdictions Section -->
<section id="courts" class="py-20 bg-navy text-white relative overflow-hidden">
<div class="absolute inset-0 bg-[url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGNpcmNsZSBjeD0iMiIgY3k9IjIiIHI9IjEiIGZpbGw9IiMzMzMiLz48L3N2Zz4=')] opacity-20"></div>
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10">
<div class="text-center mb-16 reveal">
<h2 class="text-3xl font-bold mb-4">Simultaneous Jurisdictional Filings</h2>
<p class="text-gray-400 max-w-2xl mx-auto">Coordinated legal actions across State, Federal, and International Trade courts.</p>
</div>
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
<!-- Card 1 -->
<div class="glass-panel !bg-slate-800/80 !border-slate-700 p-6 rounded-xl hover:-translate-y-2 transition-transform duration-300">
<div class="flex justify-between items-start mb-4">
<span class="text-xs font-mono text-techcyan bg-techcyan/10 px-2 py-1 rounded">Circuit Court</span>
<span class="text-gold text-sm font-bold">24-C-26-003970</span>
</div>
<h3 class="text-xl font-bold mb-2">Baltimore City, MD</h3>
<p class="text-sm text-gray-400 mb-4">Omnibus Master Petition for Writ of Mandamus. Directing the $500M USEC debt conversion to M&T Bank.</p>
<div class="w-full bg-slate-700 h-1 rounded overflow-hidden"><div class="bg-gold h-full w-3/4"></div></div>
</div>
<!-- Card 2 -->
<div class="glass-panel !bg-slate-800/80 !border-slate-700 p-6 rounded-xl hover:-translate-y-2 transition-transform duration-300">
<div class="flex justify-between items-start mb-4">
<span class="text-xs font-mono text-techcyan bg-techcyan/10 px-2 py-1 rounded">Circuit Court</span>
<span class="text-gold text-sm font-bold">New Filing</span>
</div>
<h3 class="text-xl font-bold mb-2">Baltimore County, MD</h3>
<p class="text-sm text-gray-400 mb-4">Establishment of the PSDLEF Purpose Trust. Enforcing ADA cognitive load constraints.</p>
<div class="w-full bg-slate-700 h-1 rounded overflow-hidden"><div class="bg-gold h-full w-2/4"></div></div>
</div>
<!-- Card 3 -->
<div class="glass-panel !bg-slate-800/80 !border-slate-700 p-6 rounded-xl hover:-translate-y-2 transition-transform duration-300">
<div class="flex justify-between items-start mb-4">
<span class="text-xs font-mono text-techcyan bg-techcyan/10 px-2 py-1 rounded">U.S. District Court</span>
<span class="text-gold text-sm font-bold">24-cv-02383</span>
</div>
<h3 class="text-xl font-bold mb-2">District of Maryland</h3>
<p class="text-sm text-gray-400 mb-4">§ 1983 Civil Rights & ADA Title II. Injunctive relief against NCIC ghost warrants.</p>
<div class="w-full bg-slate-700 h-1 rounded overflow-hidden"><div class="bg-gold h-full w-full"></div></div>
</div>
<!-- Card 4 -->
<div class="glass-panel !bg-slate-800/80 !border-slate-700 p-6 rounded-xl hover:-translate-y-2 transition-transform duration-300">
<div class="flex justify-between items-start mb-4">
<span class="text-xs font-mono text-techcyan bg-techcyan/10 px-2 py-1 rounded">Federal Claims</span>
<span class="text-gold text-sm font-bold">23-141 C</span>
</div>
<h3 class="text-xl font-bold mb-2">COFC</h3>
<p class="text-sm text-gray-400 mb-4">Tucker Act Complaint. Uncompensated taking of $500M and illegal exaction of liberty.</p>
<div class="w-full bg-slate-700 h-1 rounded overflow-hidden"><div class="bg-gold h-full w-4/5"></div></div>
</div>
<!-- Card 5 -->
<div class="glass-panel !bg-slate-800/80 !border-slate-700 p-6 rounded-xl hover:-translate-y-2 transition-transform duration-300">
<div class="flex justify-between items-start mb-4">
<span class="text-xs font-mono text-techcyan bg-techcyan/10 px-2 py-1 rounded">Federal Circuit</span>
<span class="text-gold text-sm font-bold">25-1522, 25-1222</span>
</div>
<h3 class="text-xl font-bold mb-2">CAFC</h3>
<p class="text-sm text-gray-400 mb-4">Interlocutory Appeal. Resolving the Jurisdictional Dead Zone & USPTO patent denials.</p>
<div class="w-full bg-slate-700 h-1 rounded overflow-hidden"><div class="bg-gold h-full w-1/2"></div></div>
</div>
<!-- Card 6 -->
<div class="glass-panel !bg-slate-800/80 !border-slate-700 p-6 rounded-xl hover:-translate-y-2 transition-transform duration-300">
<div class="flex justify-between items-start mb-4">
<span class="text-xs font-mono text-techcyan bg-techcyan/10 px-2 py-1 rounded">Supreme Court</span>
<span class="text-gold text-sm font-bold">25-4130</span>
</div>
<h3 class="text-xl font-bold mb-2">SCOTUS</h3>
<p class="text-sm text-gray-400 mb-4">Writ of Certiorari. Mandating AI cognitive prosthetics as constitutional ADA accommodations.</p>
<div class="w-full bg-slate-700 h-1 rounded overflow-hidden"><div class="bg-gold h-full w-5/6"></div></div>
</div>
</div>
</div>
</section>
<!-- Patent & Tech Section -->
<section id="patents" class="py-20 bg-white">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="text-center mb-16 reveal">
<h2 class="text-3xl font-bold text-navy mb-4">Public Ownership Dedication</h2>
<p class="text-gray-600 max-w-2xl mx-auto">All disclosed subject matter is irrevocably dedicated to the public domain to prevent proprietary enclosure.</p>
</div>
<div class="space-y-6 max-w-4xl mx-auto">
<!-- Accordion Item 1 -->
<div class="border border-gray-200 rounded-xl overflow-hidden reveal">
<button class="w-full px-6 py-4 text-left bg-gray-50 hover:bg-gray-100 flex justify-between items-center transition-colors">
<span class="font-bold text-navy">1. ZINC-MOD (HIV Immune Reconstitution)</span>
<svg class="w-5 h-5 text-gray-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path></svg>
</button>
<div class="px-6 py-4 bg-white text-gray-600 text-sm leading-relaxed">
A patent-distant, host-directed adjuvant strategy utilizing controlled zinc delivery. Combines autologous monocyte-derived adjuvant cells (Zn-MDAC) with nanocarriers. Explicitly avoids ZFN, CRISPR, and NCp7 zinc-ejector estates. No DNA cuts.
</div>
</div>
<!-- Accordion Item 2 -->
<div class="border border-gray-200 rounded-xl overflow-hidden reveal">
<button class="w-full px-6 py-4 text-left bg-gray-50 hover:bg-gray-100 flex justify-between items-center transition-colors">
<span class="font-bold text-navy">2. IPC-04 & D3-AG01 (CNS Architecture)</span>
<svg class="w-5 h-5 text-gray-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path></svg>
</button>
<div class="px-6 py-4 bg-white text-gray-600 text-sm leading-relaxed">
Selective dopamine receptor agonists targeting ADHD, Parkinson's LID, and Anhedonia. IPC-04 acts as a bivalent TAAR1-D2R heteromer modulator, while D3-AG01 escapes desensitization via biased signaling at the D3 receptor.
</div>
</div>
<!-- Accordion Item 3 -->
<div class="border border-gray-200 rounded-xl overflow-hidden reveal">
<button class="w-full px-6 py-4 text-left bg-gray-50 hover:bg-gray-100 flex justify-between items-center transition-colors">
<span class="font-bold text-navy">3. Open Diamond & HSPA v3.0 (Post-Quantum)</span>
<svg class="w-5 h-5 text-gray-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path></svg>
</button>
<div class="px-6 py-4 bg-white text-gray-600 text-sm leading-relaxed">
A fully implantable, silicon-free neural interface on a 20µm CVD diamond substrate. Achieves non-genetic, non-electrical neural activation via FMCW Lidar and focused ultrasound superposition. Controlled by the HSPA v3.0 Semantic Processor.
</div>
</div>
<!-- Accordion Item 4 -->
<div class="border border-gray-200 rounded-xl overflow-hidden reveal">
<button class="w-full px-6 py-4 text-left bg-gray-50 hover:bg-gray-100 flex justify-between items-center transition-colors">
<span class="font-bold text-navy">4. OSI-P & MORTAR (DAG-only Cryptographic Integrity)</span>
<svg class="w-5 h-5 text-gray-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path></svg>
</button>
<div class="px-6 py-4 bg-white text-gray-600 text-sm leading-relaxed">
The OpenSSA Integrity Pipeline (OSI-P) uses a nine-stage DAG-only architecture (zero Merkle trees, zero blockchain dependence) anchored to local WORM storage. MORTAR optimizes mortality risk in administrative queues.
</div>
</div>
</div>
</div>
</section>
<!-- Footer -->
<footer class="bg-white border-t border-gray-200 py-12">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 flex flex-col md:flex-row justify-between items-center text-sm text-gray-500">
<div class="mb-4 md:mb-0">
<p>&copy; 2026 Caustin Lee McLaughlin. Public Domain Dedication.</p>
<p>Document ID: MCML-MULTICOURT-2026-001</p>
</div>
<div class="flex space-x-4">
<span class="font-mono bg-gray-100 px-2 py-1 rounded">CC0 1.0 Universal</span>
<span class="font-mono bg-gray-100 px-2 py-1 rounded">DAG-Only</span>
</div>
</div>
</footer>
<!-- JavaScript Logic -->
<script>
// --- 1. Animation Engine (anime.js) ---
document.addEventListener('DOMContentLoaded', () => {
// Hero Animations
anime.timeline({ easing: 'easeOutExpo', duration: 1000 })
.add({ targets: '.hero-title', translateY: [50, 0], opacity: [0, 1], delay: 200 })
.add({ targets: '.hero-subtitle', translateY: [30, 0], opacity: [0, 1], offset: '-=800' })
.add({ targets: '.hero-buttons', translateY: [20, 0], opacity: [0, 1], offset: '-=800' });
// Scroll Reveal via Intersection Observer
const observerOptions = { threshold: 0.1, rootMargin: "0px 0px -50px 0px" };
const observer = new IntersectionObserver((entries) => {
entries.forEach(entry => {
if (entry.isIntersecting) {
if (entry.target.classList.contains('reveal-left')) {
anime({ targets: entry.target, translateX: [-50, 0], opacity: [0, 1], duration: 800, easing: 'easeOutCubic' });
} else if (entry.target.classList.contains('reveal-right')) {
anime({ targets: entry.target, translateX: [50, 0], opacity: [0, 1], duration: 800, easing: 'easeOutCubic' });
} else {
anime({ targets: entry.target, translateY: [30, 0], opacity: [0, 1], duration: 800, easing: 'easeOutCubic' });
}
observer.unobserve(entry.target);
}
});
}, observerOptions);
document.querySelectorAll('.reveal, .reveal-left, .reveal-right').forEach(el => observer.observe(el));
// Accordion Logic
document.querySelectorAll('button').forEach(button => {
button.addEventListener('click', () => {
const content = button.nextElementSibling;
const icon = button.querySelector('svg');
if (content.style.display === 'block') {
content.style.display = 'none';
icon.style.transform = 'rotate(0deg)';
} else {
content.style.display = 'block';
icon.style.transform = 'rotate(180deg)';
}
});
});
});
// --- 2. Chart.js Configuration (From provided source) ---
const standardTooltipConfig = {
callbacks: {
title: function(tooltipItems) {
const item = tooltipItems[0];
let label = item.chart.data.labels[item.dataIndex];
if (Array.isArray(label)) return label.join(' ');
return label;
}
}
};
function wrapLabel(str, maxLen = 16) {
if (str.length <= maxLen) return str;
const words = str.split(' ');
const lines = [];
let currentLine = '';
words.forEach(word => {
if ((currentLine + ' ' + word).trim().length > maxLen) {
lines.push(currentLine.trim());
currentLine = word;
} else {
currentLine += ' ' + word;
}
});
if (currentLine) lines.push(currentLine.trim());
return lines;
}
// Chart 1: Risk Radar
const ctxRadar = document.getElementById('riskRadarChart').getContext('2d');
const rawRadarLabels = ['Host Genomic Instability', 'Off-Target Cleavage Risk', 'Viral Tropism Escape', 'Delivery Complexity', 'Patent Encumbrance'];
new Chart(ctxRadar, {
type: 'radar',
data: {
labels: rawRadarLabels.map(l => wrapLabel(l)),
datasets: [{
label: 'Genomic Editing (CRISPR/ZFN)',
data: [90, 85, 80, 75, 95],
backgroundColor: 'rgba(239, 68, 68, 0.2)',
borderColor: '#ef4444',
pointBackgroundColor: '#ef4444'
}, {
label: 'Bioinorganic Zinc Modulation',
data: [5, 15, 10, 35, 20],
backgroundColor: 'rgba(6, 182, 212, 0.2)',
borderColor: '#06b6d4',
pointBackgroundColor: '#06b6d4'
}]
},
options: {
responsive: true, maintainAspectRatio: false,
scales: { r: { angleLines: { color: '#e2e8f0' }, grid: { color: '#cbd5e1' }, suggestedMin: 0, suggestedMax: 100, ticks: { display: false } } },
plugins: { tooltip: standardTooltipConfig, legend: { position: 'bottom', labels: { boxWidth: 12, font: { size: 11 } } } }
}
});
// Chart 2: Reservoir Donut
const ctxDonut = document.getElementById('reservoirDonutChart').getContext('2d');
const rawDonutLabels = ['Resting CD4+ T Cells', 'Gut Lymphoid (GALT)', 'Lymph Node Centers', 'CNS Microglia / Brain'];
new Chart(ctxDonut, {
type: 'doughnut',
data: {
labels: rawDonutLabels.map(l => wrapLabel(l)),
datasets: [{
data: [45, 30, 15, 10],
backgroundColor: ['#2563eb', '#06b6d4', '#10b981', '#f59e0b'],
borderWidth: 2, borderColor: '#ffffff'
}]
},
options: {
responsive: true, maintainAspectRatio: false,
plugins: { tooltip: standardTooltipConfig, legend: { position: 'right', labels: { boxWidth: 12, font: { size: 11 } } } }
}
});
// Chart 3: Ejector Scatter
const ctxScatter = document.getElementById('ejectorScatterChart').getContext('2d');
new Chart(ctxScatter, {
type: 'scatter',
data: {
datasets: [{
label: '1st Gen Ejector (NOBA)',
data: [{ x: 8, y: 12 }], backgroundColor: '#ef4444', pointRadius: 10
}, {
label: '2nd Gen Ejector (SAMT-19)',
data: [{ x: 0.8, y: 45 }], backgroundColor: '#f59e0b', pointRadius: 12
}, {
label: 'Non-Ejection Nc9 Chelator',
data: [{ x: 0.1, y: 120 }], backgroundColor: '#10b981', pointRadius: 14
}]
},
options: {
responsive: true, maintainAspectRatio: false,
scales: {
x: { type: 'linear', position: 'bottom', title: { display: true, text: 'EC50 Virucidal Potency (μM) - Lower is Better', font: { size: 11 } } },
y: { title: { display: true, text: 'CC50 Cytotoxicity Limit (μM) - Higher is Better', font: { size: 11 } } }
},
plugins: {
tooltip: { callbacks: { title: (items) => items[0].dataset.label, label: (item) => `EC50: ${item.raw.x} μM, CC50: ${item.raw.y} μM` } },
legend: { position: 'bottom', labels: { boxWidth: 10, font: { size: 10 } } }
}
}
});
// Chart 4: DC Phenotype
const ctxDC = document.getElementById('dcPhenotypeChart').getContext('2d');
const rawDCLabels = ['MHC-II Expression', 'CD86 Co-Stimulation', 'IL-12 Secretion', 'Treg Polarization'];
new Chart(ctxDC, {
type: 'bar',
data: {
labels: rawDCLabels.map(l => wrapLabel(l)),
datasets: [{
label: 'Controlled Zinc Chelation', data: [88, 92, 85, 12], backgroundColor: '#06b6d4'
}, {
label: 'High Exogenous Zinc', data: [25, 30, 18, 90], backgroundColor: '#f59e0b'
}]
},
options: {
responsive: true, maintainAspectRatio: false,
scales: { y: { beginAtZero: true, max: 100, title: { display: true, text: 'Relative Expression Level (%)', font: { size: 11 } } } },
plugins: { tooltip: standardTooltipConfig, legend: { position: 'bottom', labels: { boxWidth: 12, font: { size: 11 } } } }
}
});
// Chart 5: Synergy Stacked
const ctxSynergy = document.getElementById('synergyStackedChart').getContext('2d');
const rawSynergyLabels = ['Baseline cART', 'LRA