Download index.html from kipasyangin5/mva-syndrome-exploreraaaa: direct link, hf CLI and curl.
- Browser
- Download file 34.8 kB
-
https://huggingface.co/spaces/kipasyangin5/mva-syndrome-exploreraaaa/resolve/main/index.html
- Command line
-
hf download hf://spaces/kipasyangin5/mva-syndrome-exploreraaaa/index.html
-
curl -L -o index.html https://huggingface.co/spaces/kipasyangin5/mva-syndrome-exploreraaaa/resolve/main/index.html
34.8 kB
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>MVA Syndrome Multi-Dimensional Genomic Studio</title> | |
| <link rel="stylesheet" href="style.css"> | |
| <link rel="preconnect" href="https://fonts.googleapis.com"> | |
| <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> | |
| <link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600;700&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap" rel="stylesheet"> | |
| </head> | |
| <body> | |
| <div class="app-container"> | |
| <!-- Top Header --> | |
| <header class="studio-header"> | |
| <div class="header-left"> | |
| <div class="logo-badge"> | |
| <div class="pulse-dot"></div> | |
| <span class="logo-title">MVA SYNDROME</span> | |
| <span class="logo-sub">MULTI-DIMENSIONAL GENOMIC STUDIO</span> | |
| </div> | |
| <div class="patient-badge"> | |
| <span class="patient-label">PROBAND:</span> | |
| <span class="patient-id font-mono">EX2312012 (HGWCNDSX7)</span> | |
| </div> | |
| </div> | |
| <div class="header-stats"> | |
| <div class="stat-pill" title="Total Whole Genome Variants"> | |
| <span class="stat-label">TOTAL WGS VARIANTS</span> | |
| <span class="stat-val">5,012,204</span> | |
| </div> | |
| <div class="stat-pill" title="Candidate Variants in MVA / Cancer Panels"> | |
| <span class="stat-label">CANDIDATE VARIANTS</span> | |
| <span id="statCandidateCount" class="stat-val font-cyan">1,576</span> | |
| </div> | |
| <div class="stat-pill highlight-gold" title="Putative Mosaic Somatic Mutations (5%-38% VAF)"> | |
| <span class="stat-label">MOSAIC CANDIDATES</span> | |
| <span id="statMosaicCount" class="stat-val">84</span> | |
| </div> | |
| <div class="stat-pill" title="Mean WGS Sequencing Coverage"> | |
| <span class="stat-label">MEAN COVERAGE</span> | |
| <span class="stat-val">36.2× (NovaSeq)</span> | |
| </div> | |
| </div> | |
| <div class="header-right"> | |
| <div class="connection-badge" title="Hugging Face Dataset Connection Status"> | |
| <span class="badge-dot"></span> | |
| <span class="badge-text">PRIVATE DATASET LINKED</span> | |
| </div> | |
| <button id="btnShortcuts" class="icon-btn">⌨ Shortcuts</button> | |
| </div> | |
| </header> | |
| <!-- Navigation Tabs --> | |
| <nav class="studio-nav"> | |
| <button class="nav-tab tab-omniverse" data-tab="tab-omniverse"> | |
| <span class="tab-icon">🏛️</span> 219-Table Omniverse Hub <span class="badge-omniverse-count">219 Tables</span> | |
| </button> | |
| <button class="nav-tab active" data-tab="tab-clinical"> | |
| <span class="tab-icon">🏥</span> Clinical Phenotype & HPO | |
| </button> | |
| <button class="nav-tab" data-tab="tab-variants"> | |
| <span class="tab-icon">🧬</span> Chromosome & Variant Navigator | |
| </button> | |
| <button class="nav-tab" data-tab="tab-gene-burden"> | |
| <span class="tab-icon">📋</span> Candidate Gene Burden Matrix | |
| </button> | |
| <button class="nav-tab" data-tab="tab-syndromic-diff"> | |
| <span class="tab-icon">🩺</span> Phenotype Differential Matrix | |
| </button> | |
| <button class="nav-tab" data-tab="tab-acmg-matrix"> | |
| <span class="tab-icon">🧪</span> ACMG Variant Classification | |
| </button> | |
| <button class="nav-tab" data-tab="tab-therapeutic-targets"> | |
| <span class="tab-icon">💊</span> Precision Oncology Targets | |
| </button> | |
| <button class="nav-tab" data-tab="tab-mosaic-strat"> | |
| <span class="tab-icon">⚡</span> Mosaic Allelic Stratification | |
| </button> | |
| <button class="nav-tab" data-tab="tab-mitotic-machinery"> | |
| <span class="tab-icon">🔬</span> Mitotic Machinery Interactome | |
| </button> | |
| <button class="nav-tab" data-tab="tab-karyotype-matrix"> | |
| <span class="tab-icon">🌐</span> 24-Chromosome Karyotype Matrix | |
| </button> | |
| <button class="nav-tab" data-tab="tab-mosaic"> | |
| <span class="tab-icon">🔬</span> Mosaicism & VAF Spectrum | |
| </button> | |
| <button class="nav-tab" data-tab="tab-wgs"> | |
| <span class="tab-icon">📊</span> 4-Lane Sequencing QC Audit | |
| </button> | |
| <button class="nav-tab" data-tab="tab-pathway"> | |
| <span class="tab-icon">⚙️</span> Mitotic Checkpoint Pathway | |
| </button> | |
| </nav> | |
| <!-- Tab 0: 219-Table Omniverse Hub --> | |
| <section id="tab-omniverse" class="tab-content"> | |
| <div class="omniverse-layout"> | |
| <!-- Omniverse Controls Bar --> | |
| <div class="omniverse-toolbar"> | |
| <div class="omniverse-top-row"> | |
| <div class="omniverse-title-box"> | |
| <div class="badge-omniverse-pulse">🏛️ 219-TABLE OMNIVERSE HUB</div> | |
| <h2>Multi-Omics Analytical Matrix Explorer</h2> | |
| <p class="omniverse-subtitle">Instant interactive browsing across 219 deep tables intersecting clinical phenomics, chromosome architecture, mitotic machinery, mosaicism strata, ACMG predictions, precision pharmacology, cytogenetics, sequencing QC, biophysical kinetics, and comparative oncology cohorts.</p> | |
| </div> | |
| <div class="omniverse-stats-summary"> | |
| <div class="omni-stat-box"><span class="omni-lbl">TOTAL TABLES</span><strong id="omniTotalTables">219</strong></div> | |
| <div class="omni-stat-box"><span class="omni-lbl">CATEGORIES</span><strong>10 Hubs</strong></div> | |
| <div class="omni-stat-box"><span class="omni-lbl">FILTERED MATCHES</span><strong id="omniFilteredCount" class="font-cyan">219</strong></div> | |
| </div> | |
| </div> | |
| <!-- Category Filter Pills --> | |
| <div class="category-pills-bar" id="omniCategoryPills"> | |
| <button class="cat-pill active" data-cat="ALL">All Categories (219)</button> | |
| <button class="cat-pill" data-cat="Clinical & Phenomics">🏥 Clinical & Phenomics (25)</button> | |
| <button class="cat-pill" data-cat="Chromosome Architecture">🧬 Chromosome Architecture (30)</button> | |
| <button class="cat-pill" data-cat="Gene Panels & Interactome">📋 Gene Panels & Interactome (35)</button> | |
| <button class="cat-pill" data-cat="Mosaicism Spectrum">⚡ Mosaicism Spectrum (25)</button> | |
| <button class="cat-pill" data-cat="ACMG & In Silico Predictors">🧪 ACMG & In Silico (25)</button> | |
| <button class="cat-pill" data-cat="Precision Oncology & Pharma">💊 Precision Oncology (25)</button> | |
| <button class="cat-pill" data-cat="Cytogenetics & Aneuploidy">🌐 Cytogenetics & Aneuploidy (20)</button> | |
| <button class="cat-pill" data-cat="Sequencing & Flowcell QC">📊 Sequencing QC (20)</button> | |
| <button class="cat-pill" data-cat="Biophysical Kinetics">🔬 Biophysical Kinetics (15)</button> | |
| <button class="cat-pill" data-cat="Comparative Oncology Cohorts">👥 Comparative Cohorts (15)</button> | |
| </div> | |
| <!-- Table Selector Search & Switcher --> | |
| <div class="omniverse-search-row"> | |
| <div class="search-wrap"> | |
| <span class="search-icon">🔍</span> | |
| <input type="text" id="omniGlobalSearch" placeholder="Fuzzy search across all 219 tables by keyword, gene, pathway, or metric..." class="omni-search-input"> | |
| </div> | |
| <div class="table-dropdown-wrap"> | |
| <label for="omniTableSelect" class="table-select-lbl">ACTIVE TABLE:</label> | |
| <select id="omniTableSelect" class="omni-table-select"> | |
| <!-- Populated via JS --> | |
| </select> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Active Table Viewer Card --> | |
| <div class="infotable-card omniverse-active-card"> | |
| <div class="infotable-header omniverse-card-header"> | |
| <div class="infotable-title-box"> | |
| <div class="omni-active-badge-row"> | |
| <span id="omniActiveCat" class="badge-cyan">Clinical & Phenomics</span> | |
| <span id="omniActiveId" class="badge-patho font-mono">clin_01_hpo_hierarchy</span> | |
| <span id="omniActiveRows" class="badge-mva-match">8 rows</span> | |
| </div> | |
| <h3 id="omniActiveTitle">HPO Term Ontological Hierarchy & Phenotypic Specificity</h3> | |
| <p id="omniActiveDesc" class="infotable-desc">Detailed phenotypic depth, information content (IC), and syndromic specificity of proband HPO features.</p> | |
| </div> | |
| <div class="omni-action-buttons"> | |
| <input type="text" id="omniTableRowFilter" placeholder="Filter rows in active table..." class="search-input-sm"> | |
| <button id="btnExportCSV" class="btn-export">⬇ Export CSV</button> | |
| <button id="btnExportJSON" class="btn-export">⬇ Export JSON</button> | |
| </div> | |
| </div> | |
| <div class="table-scroll-lg"> | |
| <table class="infotable" id="omniverseDynamicTable"> | |
| <thead id="omniTableHead"> | |
| <!-- Rendered dynamically --> | |
| </thead> | |
| <tbody id="omniTableBody"> | |
| <!-- Rendered dynamically --> | |
| </tbody> | |
| </table> | |
| </div> | |
| </div> | |
| <!-- Quick Table Discovery Matrix Grid --> | |
| <div class="omni-discovery-section"> | |
| <div class="discovery-header"> | |
| <h4>📑 Table Discovery Matrix (Click any table card to load instantly):</h4> | |
| </div> | |
| <div class="omni-grid-cards" id="omniDiscoveryGrid"> | |
| <!-- Rendered dynamically --> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Tab 1: Clinical Phenotype & HPO Profile --> | |
| <section id="tab-clinical" class="tab-content active"> | |
| <div class="clinical-grid"> | |
| <!-- Left Column: Patient Case Overview --> | |
| <div class="card card-overview"> | |
| <div class="card-header"> | |
| <h3>📋 Proband Case Summary & Diagnostic Context</h3> | |
| <span class="badge-rare">Rare Disease: MVA Syndrome</span> | |
| </div> | |
| <div class="card-body"> | |
| <div class="alert-box"> | |
| <strong>Clinical Presentation:</strong> Pediatric patient presenting with a coherent phenotypic cluster of embryonal malignancy (rhabdomyosarcoma), congenital nephrocalcinosis, severe intrauterine growth restriction (IUGR), microcephaly/short stature, failure to thrive, and parental history of recurrent miscarriages. | |
| </div> | |
| <div class="clinical-meta-grid"> | |
| <div class="meta-item"> | |
| <span class="meta-label">Primary Oncological Event:</span> | |
| <span class="meta-val font-red">Rhabdomyosarcoma (Soft Tissue Tumour)</span> | |
| </div> | |
| <div class="meta-item"> | |
| <span class="meta-label">Renal Anomalies:</span> | |
| <span class="meta-val font-gold">Congenital Nephrocalcinosis (Since Birth)</span> | |
| </div> | |
| <div class="meta-item"> | |
| <span class="meta-label">Gestational Age at Birth:</span> | |
| <span class="meta-val">32 Weeks (Premature)</span> | |
| </div> | |
| <div class="meta-item"> | |
| <span class="meta-label">Birth Weight:</span> | |
| <span class="meta-val">~1.0 kg (Severe IUGR / Small for Gestational Age)</span> | |
| </div> | |
| <div class="meta-item"> | |
| <span class="meta-label">Family Reproductive History:</span> | |
| <span class="meta-val font-cyan">Parental Recurrent Spontaneous Abortions</span> | |
| </div> | |
| <div class="meta-item"> | |
| <span class="meta-label">Diagnostic Trigger:</span> | |
| <span class="meta-val">Urgent Whole Genome Sequencing (WGS)</span> | |
| </div> | |
| </div> | |
| <div class="insight-box"> | |
| <h4>💡 Syndromic Diagnostic Key:</h4> | |
| <p>In chromosomal instability syndromes such as Mosaic Variegated Aneuploidy (MVA), no single finding is isolated. The hallmark is the triad of <strong>growth restriction + pediatric cancer predisposition + chromosome segregation/mitotic checkpoint defects</strong>. Parental recurrent pregnancy loss further points to segregation/aneuploidy vulnerability.</p> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Right Column: HPO Term Breakdown --> | |
| <div class="card card-hpo"> | |
| <div class="card-header"> | |
| <h3>🏷️ Human Phenotype Ontology (HPO) Profile</h3> | |
| <span id="hpoCountBadge" class="badge-count">8 Phenotypes</span> | |
| </div> | |
| <div class="card-body"> | |
| <div id="hpoList" class="hpo-list"> | |
| <!-- Rendered via JS --> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Tab 2: Chromosome & Variant Navigator --> | |
| <section id="tab-variants" class="tab-content"> | |
| <div class="variants-layout"> | |
| <!-- Top Toolbar: Gene Panels & Filters --> | |
| <div class="variant-toolbar"> | |
| <div class="filter-group"> | |
| <label for="geneFilter" class="filter-label">GENE PANEL:</label> | |
| <select id="geneFilter" class="styled-select"> | |
| <option value="ALL">All Candidate Genes (16 Panels)</option> | |
| <option value="BUB1B">BUB1B — MVA Type 1 (chr15)</option> | |
| <option value="CEP57">CEP57 — MVA Type 2 (chr11)</option> | |
| <option value="TRIP13">TRIP13 — MVA Type 3 (chr5)</option> | |
| <option value="CEP192">CEP192 — MVA Type 4 (chr18)</option> | |
| <option value="MAD1L1">MAD1L1 — MVA Susceptibility (chr7)</option> | |
| <option value="MAD2L1">MAD2L1 — Checkpoint Core (chr4)</option> | |
| <option value="BUB1">BUB1 — Kinetochore Kinase (chr2)</option> | |
| <option value="BUB3">BUB3 — SAC Scaffold (chr10)</option> | |
| <option value="SMC5">SMC5 — Chromosome Repair (chr9)</option> | |
| <option value="CENPE">CENPE — Kinetochore Motor (chr4)</option> | |
| <option value="CENPF">CENPF — Centromere Protein F (chr1)</option> | |
| <option value="PLK1">PLK1 — Polo Like Kinase (chr16)</option> | |
| <option value="AURKA">AURKA — Aurora Kinase A (chr20)</option> | |
| <option value="TP53">TP53 — Li-Fraumeni / Sarcoma (chr17)</option> | |
| <option value="WT1">WT1 — Wilms / Nephrocalcinosis (chr11)</option> | |
| <option value="DICER1">DICER1 — Rhabdomyosarcoma (chr14)</option> | |
| </select> | |
| </div> | |
| <div class="filter-group"> | |
| <label for="typeFilter" class="filter-label">TYPE:</label> | |
| <select id="typeFilter" class="styled-select-sm"> | |
| <option value="ALL">All Types</option> | |
| <option value="SNV">SNV (Single Nucleotide)</option> | |
| <option value="Insertion">Insertion</option> | |
| <option value="Deletion">Deletion</option> | |
| </select> | |
| </div> | |
| <div class="filter-group"> | |
| <label for="mosaicFilter" class="filter-label">ZYGOSITY / MOSAICISM:</label> | |
| <select id="mosaicFilter" class="styled-select-sm"> | |
| <option value="ALL">All Classifications</option> | |
| <option value="Mosaic Somatic Candidate">Mosaic Somatic Candidates (5%-38% VAF)</option> | |
| <option value="Germline Heterozygous">Germline Heterozygous (40%-60% VAF)</option> | |
| <option value="Germline Homozygous">Germline Homozygous (85%-100% VAF)</option> | |
| </select> | |
| </div> | |
| <div class="filter-group search-group"> | |
| <input type="text" id="variantSearch" placeholder="Search by position, dbSNP rsID, or allele..." class="search-input"> | |
| </div> | |
| <div class="filter-stats"> | |
| <span>Showing <strong id="filteredCount">0</strong> / <span id="totalCandidateCount">0</span> variants</span> | |
| </div> | |
| </div> | |
| <!-- Chromosome Ideogram Selector --> | |
| <div class="chromosome-bar-wrapper"> | |
| <div class="chr-bar-header"> | |
| <span>GENOME-WIDE CHROMOSOME DENSITY (Click chromosome to filter):</span> | |
| <button id="btnResetChr" class="mini-btn">Reset All Chromosomes</button> | |
| </div> | |
| <div id="chromosomeKaryotype" class="chromosome-karyotype"> | |
| <!-- Rendered via JS --> | |
| </div> | |
| </div> | |
| <!-- Variants Table --> | |
| <div class="table-card"> | |
| <div class="table-scroll"> | |
| <table class="variant-table"> | |
| <thead> | |
| <tr> | |
| <th>Gene</th> | |
| <th>Chromosome:Position</th> | |
| <th>Ref → Alt</th> | |
| <th>Type</th> | |
| <th>Genotype (GT)</th> | |
| <th>Allelic Depth (AD)</th> | |
| <th>Total DP</th> | |
| <th>VAF (Allele Fraction)</th> | |
| <th>Classification</th> | |
| <th>Filter</th> | |
| <th>Action</th> | |
| </tr> | |
| </thead> | |
| <tbody id="variantTableBody"> | |
| <!-- Rendered via JS --> | |
| </tbody> | |
| </table> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Tab 3: Candidate Gene Burden & ACMG Matrix --> | |
| <section id="tab-gene-burden" class="tab-content"> | |
| <div class="infotable-card"> | |
| <div class="infotable-header"> | |
| <div class="infotable-title-box"> | |
| <h3>📋 Candidate Gene Burden & ACMG Pathogenicity Matrix</h3> | |
| <p class="infotable-desc">Comprehensive comparative matrix analyzing all 16 candidate genes in the patient across OMIM phenotypes, variant burdens, inheritance models, and diagnostic tiers.</p> | |
| </div> | |
| <div class="table-search-box"> | |
| <input type="text" id="searchGeneBurden" placeholder="Filter by gene, syndrome, or pathway..." class="search-input"> | |
| </div> | |
| </div> | |
| <div class="table-scroll-lg"> | |
| <table class="infotable"> | |
| <thead> | |
| <tr> | |
| <th>Gene</th> | |
| <th>OMIM / Cytoband</th> | |
| <th>Syndromic Classification</th> | |
| <th>Mitotic Complex / Role</th> | |
| <th>Inheritance</th> | |
| <th>Proband Variants</th> | |
| <th>Highest VAF</th> | |
| <th>Mosaic Loci</th> | |
| <th>Clinical Presentation Link</th> | |
| <th>Diagnostic Tier</th> | |
| </tr> | |
| </thead> | |
| <tbody id="geneBurdenTableBody"> | |
| <!-- Rendered via JS --> | |
| </tbody> | |
| </table> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Tab 4: Phenotype Differential Matrix --> | |
| <section id="tab-syndromic-diff" class="tab-content"> | |
| <div class="infotable-card"> | |
| <div class="infotable-header"> | |
| <div class="infotable-title-box"> | |
| <h3>🩺 Proband Phenotype Constellation vs Syndromic Differential Matrix</h3> | |
| <p class="infotable-desc">Systematic cross-referencing of observed clinical HPO findings against competing pediatric cancer and primordial growth syndromes.</p> | |
| </div> | |
| <div class="table-search-box"> | |
| <input type="text" id="searchSyndromicDiff" placeholder="Filter by clinical feature or syndrome..." class="search-input"> | |
| </div> | |
| </div> | |
| <div class="table-scroll-lg"> | |
| <table class="infotable"> | |
| <thead> | |
| <tr> | |
| <th>Clinical Feature (HPO)</th> | |
| <th>MVA Syndrome Match</th> | |
| <th>Implicated Candidate Genes</th> | |
| <th>Competing Syndromic Differentials</th> | |
| <th>Cellular & Molecular Mechanism</th> | |
| <th>Discriminatory Diagnostic Power</th> | |
| </tr> | |
| </thead> | |
| <tbody id="syndromicDiffTableBody"> | |
| <!-- Rendered via JS --> | |
| </tbody> | |
| </table> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Tab 5: ACMG Variant Classification Table --> | |
| <section id="tab-acmg-matrix" class="tab-content"> | |
| <div class="infotable-card"> | |
| <div class="infotable-header"> | |
| <div class="infotable-title-box"> | |
| <h3>🧪 ACMG / AMP Diagnostic Variant Pathogenicity Classification Table</h3> | |
| <p class="infotable-desc">Formal ACMG/AMP clinical evidence tiering of prioritized candidate mutations across Spindle Assembly Checkpoint and sarcoma driver loci.</p> | |
| </div> | |
| <div class="table-search-box"> | |
| <input type="text" id="searchAcmgMatrix" placeholder="Filter by gene or classification..." class="search-input"> | |
| </div> | |
| </div> | |
| <div class="table-scroll-lg"> | |
| <table class="infotable"> | |
| <thead> | |
| <tr> | |
| <th>Gene</th> | |
| <th>HGVSc / Protein Change</th> | |
| <th>Genomic Coordinate (GRCh38)</th> | |
| <th>Ref → Alt</th> | |
| <th>Variant Type</th> | |
| <th>VAF</th> | |
| <th>ACMG Evidence Criteria</th> | |
| <th>gnomAD v4.1 AF</th> | |
| <th>REVEL / CADD</th> | |
| <th>Final ACMG Tier</th> | |
| </tr> | |
| </thead> | |
| <tbody id="acmgMatrixTableBody"> | |
| <!-- Rendered via JS --> | |
| </tbody> | |
| </table> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Tab 6: Precision Oncology Targets --> | |
| <section id="tab-therapeutic-targets" class="tab-content"> | |
| <div class="infotable-card"> | |
| <div class="infotable-header"> | |
| <div class="infotable-title-box"> | |
| <h3>💊 Precision Oncology & Therapeutic Target Matrix</h3> | |
| <p class="infotable-desc">Targeted therapies, synthetic lethality vulnerabilities, and investigational small molecules exploiting chromosomal instability (CIN) and mitotic spindle defects.</p> | |
| </div> | |
| <div class="table-search-box"> | |
| <input type="text" id="searchTherapeuticTargets" placeholder="Filter by drug, target, or mechanism..." class="search-input"> | |
| </div> | |
| </div> | |
| <div class="table-scroll-lg"> | |
| <table class="infotable"> | |
| <thead> | |
| <tr> | |
| <th>Drug / Small Molecule</th> | |
| <th>Target Gene</th> | |
| <th>Pharmacological Class</th> | |
| <th>Mechanism of Action</th> | |
| <th>Synergy with MVA Phenotype</th> | |
| <th>Clinical Trial Status</th> | |
| <th>Evidence Tier</th> | |
| </tr> | |
| </thead> | |
| <tbody id="therapeuticTargetsTableBody"> | |
| <!-- Rendered via JS --> | |
| </tbody> | |
| </table> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Tab 7: Mosaic Allelic Stratification --> | |
| <section id="tab-mosaic-strat" class="tab-content"> | |
| <div class="infotable-card"> | |
| <div class="infotable-header"> | |
| <div class="infotable-title-box"> | |
| <h3>⚡ Mosaic Somatic vs Germline Allelic Stratification Table</h3> | |
| <p class="infotable-desc">Stratification of whole-genome variants by Variant Allele Frequency (VAF), developmental timing, and inferred tissue lineage penetrance.</p> | |
| </div> | |
| </div> | |
| <div class="table-scroll-lg"> | |
| <table class="infotable"> | |
| <thead> | |
| <tr> | |
| <th>VAF Range</th> | |
| <th>Classification & Timing</th> | |
| <th>Total Variants</th> | |
| <th>Mean Sequencing DP</th> | |
| <th>Estimated Lineage Penetrance</th> | |
| <th>Candidate Genes Affected</th> | |
| <th>Pathological & Aneuploidy Consequence</th> | |
| </tr> | |
| </thead> | |
| <tbody id="mosaicStratTableBody"> | |
| <!-- Rendered via JS --> | |
| </tbody> | |
| </table> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Tab 8: Mitotic Machinery & Interactome Functional Table --> | |
| <section id="tab-mitotic-machinery" class="tab-content"> | |
| <div class="infotable-card"> | |
| <div class="infotable-header"> | |
| <div class="infotable-title-box"> | |
| <h3>🔬 Mitotic Spindle Assembly Checkpoint & Centrosome Interactome Matrix</h3> | |
| <p class="infotable-desc">Biochemical, structural, and macromolecular properties of key mitotic proteins in the MVA syndrome network.</p> | |
| </div> | |
| <div class="table-search-box"> | |
| <input type="text" id="searchMitoticMachinery" placeholder="Filter by protein, complex, or function..." class="search-input"> | |
| </div> | |
| </div> | |
| <div class="table-scroll-lg"> | |
| <table class="infotable"> | |
| <thead> | |
| <tr> | |
| <th>Protein (UniProt)</th> | |
| <th>Length</th> | |
| <th>Subcellular Location</th> | |
| <th>Biochemical Function & Activity</th> | |
| <th>Macromolecular Complex</th> | |
| <th>MVA Disease Association</th> | |
| <th>Proband WGS Findings</th> | |
| </tr> | |
| </thead> | |
| <tbody id="mitoticMachineryTableBody"> | |
| <!-- Rendered via JS --> | |
| </tbody> | |
| </table> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Tab 9: 24-Chromosome Karyotype & Instability Matrix --> | |
| <section id="tab-karyotype-matrix" class="tab-content"> | |
| <div class="infotable-card"> | |
| <div class="infotable-header"> | |
| <div class="infotable-title-box"> | |
| <h3>🌐 24-Chromosome Karyotype Architecture & Genomic Instability Matrix</h3> | |
| <p class="infotable-desc">Genome-wide breakdown of chromosomal physical lengths, variant densities, SNV/Indel ratios, and literature-reported MVA aneuploidy vulnerability rates.</p> | |
| </div> | |
| <div class="table-search-box"> | |
| <input type="text" id="searchKaryotypeMatrix" placeholder="Filter chromosomes..." class="search-input"> | |
| </div> | |
| </div> | |
| <div class="table-scroll-lg"> | |
| <table class="infotable"> | |
| <thead> | |
| <tr> | |
| <th>Chromosome</th> | |
| <th>Length (GRCh38)</th> | |
| <th>Total Variants</th> | |
| <th>SNVs</th> | |
| <th>Indels</th> | |
| <th>Variant Density</th> | |
| <th>SNV/Indel Ratio</th> | |
| <th>Heterozygous / Homozygous</th> | |
| <th>Reported MVA Aneuploidy Vulnerability in Literature</th> | |
| </tr> | |
| </thead> | |
| <tbody id="karyotypeMatrixTableBody"> | |
| <!-- Rendered via JS --> | |
| </tbody> | |
| </table> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Tab 10: Mosaicism Spectrum --> | |
| <section id="tab-mosaic" class="tab-content"> | |
| <div class="mosaic-grid"> | |
| <div class="card"> | |
| <div class="card-header"> | |
| <h3>🔬 Variant Allele Frequency (VAF) Spectrum & Mosaicism Analysis</h3> | |
| <span class="badge-cyan">Somatic vs Germline Resolution</span> | |
| </div> | |
| <div class="card-body"> | |
| <p class="section-desc"> | |
| In Mosaic Variegated Aneuploidy, post-zygotic somatic mutations and mitotic nondisjunction events exhibit non-Mendelian allele frequencies. Variants with <strong>VAF between 5% and 38% (0.05 – 0.38)</strong> represent high-confidence mosaic somatic candidates. | |
| </p> | |
| <div class="vaf-distribution-chart"> | |
| <div class="vaf-bracket bracket-mosaic"> | |
| <div class="bracket-header"> | |
| <span>MOSAIC SOMATIC SPECTRUM</span> | |
| <strong>5% – 38% VAF</strong> | |
| </div> | |
| <div class="bracket-body" id="mosaicListSummary"> | |
| <!-- JS generated --> | |
| </div> | |
| </div> | |
| <div class="vaf-bracket bracket-het"> | |
| <div class="bracket-header"> | |
| <span>GERMLINE HETEROZYGOUS</span> | |
| <strong>40% – 60% VAF</strong> | |
| </div> | |
| <div class="bracket-body" id="hetListSummary"> | |
| <!-- JS generated --> | |
| </div> | |
| </div> | |
| <div class="vaf-bracket bracket-hom"> | |
| <div class="bracket-header"> | |
| <span>GERMLINE HOMOZYGOUS</span> | |
| <strong>85% – 100% VAF</strong> | |
| </div> | |
| <div class="bracket-body" id="homListSummary"> | |
| <!-- JS generated --> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="card"> | |
| <div class="card-header"> | |
| <h3>⭐ Top Mosaic Somatic Candidate Loci</h3> | |
| <span class="badge-gold">Prioritized SAC & Centrosome Mutants</span> | |
| </div> | |
| <div class="card-body"> | |
| <div id="topMosaicTable" class="top-mosaic-container"> | |
| <!-- Rendered via JS --> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Tab 11: 4-Lane Sequencing QC Audit --> | |
| <section id="tab-wgs" class="tab-content"> | |
| <div class="wgs-grid"> | |
| <div class="card"> | |
| <div class="card-header"> | |
| <h3>📊 Illumina NovaSeq 6000 Flowcell Quality Audit (4 Lanes)</h3> | |
| <span class="badge-cyan">Flowcell ID: HGWCNDSX7</span> | |
| </div> | |
| <div class="card-body"> | |
| <div class="stats-overview-row"> | |
| <div class="overview-box"> | |
| <span class="box-label">Total Sequencing Data</span> | |
| <span class="box-val font-cyan">78.86 GB</span> | |
| </div> | |
| <div class="overview-box"> | |
| <span class="box-label">Total Paired Reads</span> | |
| <span class="box-val">805.8 Million</span> | |
| </div> | |
| <div class="overview-box"> | |
| <span class="box-label">Mean Genome Coverage</span> | |
| <span class="box-val font-green">36.2×</span> | |
| </div> | |
| <div class="overview-box"> | |
| <span class="box-label">Bases ≥ Q30</span> | |
| <span class="box-val font-gold">93.45%</span> | |
| </div> | |
| <div class="overview-box"> | |
| <span class="box-label">Mean Insert Size</span> | |
| <span class="box-val">380 bp</span> | |
| </div> | |
| <div class="overview-box"> | |
| <span class="box-label">Duplication Rate</span> | |
| <span class="box-val">8.4%</span> | |
| </div> | |
| </div> | |
| <h4 class="subhead">Comprehensive Lane-by-Lane Telemetry Audit</h4> | |
| <div class="lanes-table-wrapper"> | |
| <table class="lane-table"> | |
| <thead> | |
| <tr> | |
| <th>Lane ID</th> | |
| <th>Read Pairs FASTQ Files</th> | |
| <th>Total Size</th> | |
| <th>Paired Reads</th> | |
| <th>Q30 %</th> | |
| <th>GC %</th> | |
| <th>Est. Coverage</th> | |
| <th>Dup Rate</th> | |
| <th>Mapping Rate</th> | |
| <th>Flowcell Status</th> | |
| </tr> | |
| </thead> | |
| <tbody id="flowcellQcTableBody"> | |
| <!-- Rendered via JS --> | |
| </tbody> | |
| </table> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Tab 12: Mitotic Checkpoint Pathway Network --> | |
| <section id="tab-pathway" class="tab-content"> | |
| <div class="pathway-grid"> | |
| <div class="card"> | |
| <div class="card-header"> | |
| <h3>⚙️ Spindle Assembly Checkpoint (SAC) & Centrosomal Protein Network</h3> | |
| <span class="badge-rare">Mitotic Machinery</span> | |
| </div> | |
| <div class="card-body"> | |
| <div class="pathway-diagram" id="pathwayComplexes"> | |
| <!-- Rendered via JS --> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Variant Detail Modal --> | |
| <div id="modalVariant" class="modal-overlay hidden"> | |
| <div class="modal-card"> | |
| <div class="modal-header"> | |
| <h2 id="modalVarTitle">🧬 Variant Details</h2> | |
| <button id="btnCloseVarModal" class="modal-close">✕</button> | |
| </div> | |
| <div class="modal-body" id="modalVarBody"> | |
| <!-- Rendered via JS --> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Shortcuts Modal --> | |
| <div id="modalHelp" class="modal-overlay hidden"> | |
| <div class="modal-card"> | |
| <div class="modal-header"> | |
| <h2>⌨ Studio Keyboard Shortcuts</h2> | |
| <button id="btnCloseHelpModal" class="modal-close">✕</button> | |
| </div> | |
| <div class="modal-body"> | |
| <div class="shortcut-grid"> | |
| <div class="shortcut-item"><kbd>1</kbd><span>Clinical Phenotype & HPO Profile</span></div> | |
| <div class="shortcut-item"><kbd>2</kbd><span>Chromosome & Variant Navigator (5.01M WGS)</span></div> | |
| <div class="shortcut-item"><kbd>3</kbd><span>Candidate Gene Burden & ACMG Matrix</span></div> | |
| <div class="shortcut-item"><kbd>4</kbd><span>Phenotype Differential Matrix</span></div> | |
| <div class="shortcut-item"><kbd>5</kbd><span>ACMG Diagnostic Variant Classification</span></div> | |
| <div class="shortcut-item"><kbd>6</kbd><span>Precision Oncology Targets</span></div> | |
| <div class="shortcut-item"><kbd>7</kbd><span>Mosaic Allelic Stratification Table</span></div> | |
| <div class="shortcut-item"><kbd>8</kbd><span>Mitotic Machinery Interactome</span></div> | |
| <div class="shortcut-item"><kbd>9</kbd><span>24-Chromosome Karyotype Matrix</span></div> | |
| <div class="shortcut-item"><kbd>0</kbd><span>Mosaicism & VAF Spectrum</span></div> | |
| <div class="shortcut-item"><kbd>Q</kbd><span>4-Lane Sequencing QC Audit</span></div> | |
| <div class="shortcut-item"><kbd>W</kbd><span>Mitotic Checkpoint Pathway Network</span></div> | |
| <div class="shortcut-item"><kbd>/</kbd><span>Focus Variant Search bar</span></div> | |
| <div class="shortcut-item"><kbd>Esc</kbd><span>Close modals</span></div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <script src="app.js"></script> | |
| </body> | |
| </html> | |