Spaces:
Sleeping
Sleeping
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8" /> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0" /> | |
| <title>NephroScreen — Early CKD Screening</title> | |
| <meta name="description" content="Machine-learning screening tool that estimates chronic kidney disease risk from routine clinical lab values." /> | |
| <link rel="preconnect" href="https://fonts.googleapis.com" /> | |
| <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet" /> | |
| <link rel="stylesheet" href="style.css" /> | |
| </head> | |
| <body> | |
| <header class="site-header"> | |
| <div class="brand"> | |
| <span class="logo">◈</span> | |
| <div> | |
| <h1>NephroScreen</h1> | |
| <p class="tagline">Early chronic kidney disease screening from routine labs</p> | |
| </div> | |
| </div> | |
| <div class="model-strip" id="modelStrip"><span class="muted">Loading model…</span></div> | |
| </header> | |
| <main> | |
| <section class="panel form-panel"> | |
| <div class="panel-head"> | |
| <h2>Patient measurements</h2> | |
| <button type="button" id="exampleBtn" class="btn ghost">Load example patient</button> | |
| </div> | |
| <p class="hint">All fields are optional — blanks are imputed by the model. Fill what you have.</p> | |
| <form id="predictForm"> | |
| <h3 class="group-title">Laboratory values</h3> | |
| <div class="grid" id="numericFields"></div> | |
| <h3 class="group-title">Clinical indicators</h3> | |
| <div class="grid" id="categoricalFields"></div> | |
| <div class="actions"> | |
| <button type="submit" class="btn primary" id="submitBtn">Estimate CKD risk</button> | |
| <button type="reset" class="btn ghost">Clear</button> | |
| </div> | |
| </form> | |
| </section> | |
| <section class="panel result-panel" id="resultPanel" hidden> | |
| <div class="panel-head"><h2>Screening result</h2></div> | |
| <div class="result-card" id="resultCard"></div> | |
| <div class="indicators" id="indicators"></div> | |
| <p class="disclaimer" id="disclaimer"></p> | |
| </section> | |
| </main> | |
| <footer class="site-footer"> | |
| <p> | |
| <strong>NephroScreen</strong> · Random Forest on the UCI CKD dataset (400 patients). | |
| Educational portfolio project — not a medical device. | |
| </p> | |
| <p class="muted"> | |
| A solo end-to-end applied ML case study by Sadiq Mansoor — | |
| model, API, and interface engineered from scratch. | |
| </p> | |
| </footer> | |
| <script src="config.js"></script> | |
| <script src="app.js"></script> | |
| </body> | |
| </html> | |