749aa23e87
The dropdown was labeled just "Risk Factors" with option "None (lower risk)" — ambiguous because AAP 2022 uses "risk factors" in two distinct senses: (a) risk factors for developing hyperbilirubinemia (screening-only, do not change thresholds) and (b) neurotoxicity risk factors (do change thresholds). Only (b) belongs on the threshold nomogram, and a clinician glancing at the form could easily pick wrong. Changes: - Label: "Neurotoxicity risk factors" - Options: "Absent" / "Present (any one qualifies)" — removes the misleading "None (lower risk)" phrasing (no-risk curve actually has HIGHER thresholds) - Expandable details listing the 6 specific AAP 2022 neurotoxicity risk factors (isoimmune hemolysis, G6PD, other hemolysis, sepsis, albumin <3.0, clinical instability <24h) with explicit note that GA <38w is handled by the per-week curve, not by this checkbox — prevents double-counting. No data changes. Cite: Kemper et al., Pediatrics 2022;150(3):e2022058859, Box 2.
1189 lines
80 KiB
HTML
1189 lines
80 KiB
HTML
<div class="module-header">
|
|
<h2><i class="fas fa-calculator"></i> Pediatric Calculators</h2>
|
|
<p>Clinical calculators for pediatric medicine</p>
|
|
</div>
|
|
|
|
<!-- Calculator selector pills -->
|
|
<div style="display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px;">
|
|
<button class="calc-nav-pill active" data-calc="bp">BP Percentile</button>
|
|
<button class="calc-nav-pill" data-calc="bmi">BMI Percentile</button>
|
|
<button class="calc-nav-pill" data-calc="growth">Growth Charts</button>
|
|
<button class="calc-nav-pill" data-calc="bili">Bilirubin</button>
|
|
<button class="calc-nav-pill" data-calc="vitals">Vital Signs</button>
|
|
<button class="calc-nav-pill" data-calc="bsa">Body Surface Area</button>
|
|
<button class="calc-nav-pill" data-calc="dose">Weight-Based Dosing</button>
|
|
<button class="calc-nav-pill" data-calc="resus">Resus Meds</button>
|
|
<button class="calc-nav-pill" data-calc="gcs">GCS</button>
|
|
<button class="calc-nav-pill" data-calc="equipment">Equipment</button>
|
|
<button class="calc-nav-pill" data-calc="bedside"><i class="fas fa-briefcase-medical" style="margin-right:5px;color:var(--red);"></i>Bedside</button>
|
|
</div>
|
|
|
|
<!-- ═══════════ GLOBAL AGE → WEIGHT (available for every calculator below) ═══════════ -->
|
|
<div id="bedside-shared" style="background:var(--g50);border:1px solid var(--g200);border-radius:10px;padding:12px 14px;margin-bottom:20px;">
|
|
<div style="font-size:11px;font-weight:700;color:var(--g600);text-transform:uppercase;letter-spacing:0.5px;margin-bottom:6px;"><i class="fas fa-weight-scale" style="color:var(--blue);"></i> Age → Weight estimator</div>
|
|
<div style="display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end;">
|
|
<div class="calc-field" style="flex:1;min-width:140px;max-width:190px;">
|
|
<label style="font-weight:600;">Age <span style="font-weight:400;color:var(--g500);font-size:11px;">(e.g. 3y, 6 mo, 15d)</span></label>
|
|
<input type="text" id="bedside-age" placeholder="e.g. 3y or 6 mo" autocomplete="off">
|
|
</div>
|
|
<div class="calc-field" style="flex:1;min-width:150px;max-width:200px;">
|
|
<label style="font-weight:600;">Formula</label>
|
|
<select id="bedside-formula">
|
|
<option value="apls" selected>APLS (Luscombe 2007)</option>
|
|
<option value="bestguess">Best Guess (Tinning 2007)</option>
|
|
</select>
|
|
</div>
|
|
<div class="calc-field" style="flex:1;min-width:140px;max-width:190px;">
|
|
<label style="font-weight:600;">Weight (kg)</label>
|
|
<input type="number" id="bedside-weight" min="0.3" max="200" step="0.1" placeholder="auto from age, or type">
|
|
</div>
|
|
<button id="btn-bedside-clear" class="btn-sm btn-ghost" type="button">Clear</button>
|
|
</div>
|
|
<div id="bedside-estimate-note" style="font-size:12px;color:var(--g600);margin-top:8px;min-height:18px;"></div>
|
|
<div style="font-size:11px;color:var(--g500);margin-top:4px;">Estimator only — copy the weight into whichever calculator you need.</div>
|
|
|
|
<!-- Formulas reference (collapsed by default) -->
|
|
<details style="margin-top:10px;">
|
|
<summary style="cursor:pointer;font-size:12px;color:var(--blue-dark);font-weight:600;"><i class="fas fa-info-circle"></i> Weight-estimation formulas</summary>
|
|
<div style="margin-top:8px;padding:10px 12px;background:white;border:1px solid var(--g200);border-radius:6px;font-size:12px;line-height:1.55;">
|
|
<div style="font-weight:700;color:var(--g700);margin-bottom:2px;">APLS (Luscombe & Owens 2007 / APLS-UK 2016)</div>
|
|
<div style="padding-left:12px;">
|
|
• 0-12 months: <strong>(0.5 × age in months) + 4</strong><br>
|
|
• 1-5 years: <strong>(2 × age in years) + 8</strong><br>
|
|
• 6-12 years: <strong>(3 × age in years) + 7</strong>
|
|
</div>
|
|
<div style="font-weight:700;color:var(--g700);margin:8px 0 2px;">Best Guess (Tinning & Acworth 2007)</div>
|
|
<div style="padding-left:12px;">
|
|
• 1-11 months: <strong>(age in months + 9) / 2</strong><br>
|
|
• 1-4 years: <strong>2 × (age in years + 5)</strong><br>
|
|
• 5-14 years: <strong>4 × age in years</strong>
|
|
</div>
|
|
<div style="margin-top:8px;color:var(--g500);font-style:italic;">Broselow tape (length-based) is most accurate when available.</div>
|
|
</div>
|
|
</details>
|
|
</div>
|
|
|
|
<!-- ═══════════ BP PERCENTILE CALCULATOR ═══════════ -->
|
|
<div id="calc-bp" class="calc-panel">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h3><i class="fas fa-heart-pulse"></i> Blood Pressure Percentile</h3>
|
|
<span style="font-size:11px;color:var(--g500);">AAP 2017 Clinical Practice Guideline</span>
|
|
</div>
|
|
<div style="padding:16px;">
|
|
<p style="font-size:12px;color:var(--g500);margin:0 0 16px;">Based on normative tables for normal-weight children ages 1-17. Flynn et al., Pediatrics 2017;140(3):e20171904.</p>
|
|
<div class="calc-grid">
|
|
<div class="calc-field">
|
|
<label>Age (years)</label>
|
|
<input type="number" id="bp-age" min="1" max="17" step="1" placeholder="1-17">
|
|
</div>
|
|
<div class="calc-field">
|
|
<label>Sex</label>
|
|
<select id="bp-sex"><option value="">Select</option><option value="male">Male</option><option value="female">Female</option></select>
|
|
</div>
|
|
<div class="calc-field">
|
|
<label>Height (cm)</label>
|
|
<input type="number" id="bp-height" min="50" max="200" step="0.1" placeholder="e.g. 110">
|
|
</div>
|
|
<div class="calc-field">
|
|
<label>Systolic BP (mmHg)</label>
|
|
<input type="number" id="bp-systolic" min="50" max="250" placeholder="e.g. 105">
|
|
</div>
|
|
<div class="calc-field">
|
|
<label>Diastolic BP (mmHg)</label>
|
|
<input type="number" id="bp-diastolic" min="30" max="150" placeholder="e.g. 65">
|
|
</div>
|
|
</div>
|
|
<button id="btn-calc-bp" class="btn-sm btn-primary" style="margin-top:12px;"><i class="fas fa-calculator"></i> Calculate</button>
|
|
<button id="btn-clear-bp" class="btn-sm btn-ghost" style="margin-top:12px;">Clear</button>
|
|
<div id="bp-result" class="calc-result hidden"></div>
|
|
<div id="bp-chart-container" class="chart-container hidden"><canvas id="bp-chart-canvas"></canvas></div>
|
|
|
|
<details style="margin-top:16px;font-size:12px;border:1px solid var(--g200);border-radius:8px;padding:0;">
|
|
<summary style="padding:10px 14px;cursor:pointer;font-weight:600;color:var(--g700);background:var(--g50);border-radius:8px;">Definitions: Hypertension & Hypotension (AAP 2017 / Nelson)</summary>
|
|
<div style="padding:12px 14px;">
|
|
<p style="font-weight:700;color:var(--g800);margin:0 0 8px;">Hypertension Classification (AAP 2017)</p>
|
|
<table style="width:100%;font-size:12px;border-collapse:collapse;margin-bottom:14px;">
|
|
<thead><tr style="background:var(--g100);"><th style="padding:6px 8px;text-align:left;border:1px solid var(--g200);">Category</th><th style="padding:6px 8px;text-align:left;border:1px solid var(--g200);">Ages 1 to <13 years</th><th style="padding:6px 8px;text-align:left;border:1px solid var(--g200);">Ages ≥13 years</th></tr></thead>
|
|
<tbody>
|
|
<tr><td style="padding:6px 8px;border:1px solid var(--g200);font-weight:600;color:#10b981;">Normal</td><td style="padding:6px 8px;border:1px solid var(--g200);"><90th percentile</td><td style="padding:6px 8px;border:1px solid var(--g200);"><120/<80 mmHg</td></tr>
|
|
<tr><td style="padding:6px 8px;border:1px solid var(--g200);font-weight:600;color:#f59e0b;">Elevated BP</td><td style="padding:6px 8px;border:1px solid var(--g200);">≥90th to <95th percentile<br>OR 120/80 mmHg to <95th (whichever lower)</td><td style="padding:6px 8px;border:1px solid var(--g200);">120-129/<80 mmHg</td></tr>
|
|
<tr><td style="padding:6px 8px;border:1px solid var(--g200);font-weight:600;color:#f97316;">Stage 1 HTN</td><td style="padding:6px 8px;border:1px solid var(--g200);">≥95th percentile to <95th + 12 mmHg<br>OR 130/80-139/89 mmHg (whichever lower)</td><td style="padding:6px 8px;border:1px solid var(--g200);">130/80 to 139/89 mmHg</td></tr>
|
|
<tr><td style="padding:6px 8px;border:1px solid var(--g200);font-weight:600;color:#ef4444;">Stage 2 HTN</td><td style="padding:6px 8px;border:1px solid var(--g200);">≥95th + 12 mmHg<br>OR ≥140/90 mmHg (whichever lower)</td><td style="padding:6px 8px;border:1px solid var(--g200);">≥140/90 mmHg</td></tr>
|
|
</tbody>
|
|
</table>
|
|
<p style="font-weight:700;color:var(--g800);margin:0 0 6px;">Hypertensive Urgency vs Emergency (Nelson)</p>
|
|
<ul style="margin:0 0 14px;padding-left:18px;color:var(--g700);line-height:1.7;">
|
|
<li><strong>Hypertensive urgency:</strong> Severe BP elevation (>95th + 30 mmHg or >180/120) WITHOUT end-organ damage. Requires reduction over 24-48 hours.</li>
|
|
<li><strong>Hypertensive emergency:</strong> Severe BP elevation WITH end-organ damage (encephalopathy, heart failure, retinopathy, renal injury). Requires immediate IV therapy with goal reduction of 25% in first 8 hours.</li>
|
|
</ul>
|
|
<p style="font-weight:700;color:var(--g800);margin:0 0 6px;">Hypotension (AAP/PALS)</p>
|
|
<ul style="margin:0 0 8px;padding-left:18px;color:var(--g700);line-height:1.7;">
|
|
<li><strong>Definition:</strong> Systolic BP below the 5th percentile for age, sex, and height.</li>
|
|
<li><strong>Quick estimate (1-10 years):</strong> Hypotension = SBP < 70 + (2 × age in years) mmHg</li>
|
|
<li><strong>Neonates:</strong> SBP < gestational age in weeks (term: <60 mmHg)</li>
|
|
<li><strong>Clinical significance:</strong> Hypotension in children is a late sign of shock. Tachycardia, poor perfusion, and altered mental status typically precede hypotension.</li>
|
|
</ul>
|
|
<p style="font-size:11px;color:var(--g400);margin:8px 0 0;">Sources: Flynn JT et al., Pediatrics 2017;140(3). Nelson Textbook of Pediatrics, 21st ed. PALS Provider Manual.</p>
|
|
</div>
|
|
</details>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- ═══════════ BMI PERCENTILE CALCULATOR ═══════════ -->
|
|
<div id="calc-bmi" class="calc-panel hidden">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h3><i class="fas fa-weight-scale"></i> BMI Percentile</h3>
|
|
<span style="font-size:11px;color:var(--g500);">CDC Growth Charts, ages 2-20</span>
|
|
</div>
|
|
<div style="padding:16px;">
|
|
<p style="font-size:12px;color:var(--g500);margin:0 0 16px;">Based on CDC 2000 growth reference data. For children ages 2-20 years.</p>
|
|
<div class="calc-grid">
|
|
<div class="calc-field">
|
|
<label>Age (years)</label>
|
|
<input type="number" id="bmi-age-yr" min="2" max="20" step="1" placeholder="e.g. 7" style="width:60%;display:inline-block;">
|
|
<select id="bmi-age-mo" style="width:35%;display:inline-block;padding:8px 4px;border:1.5px solid var(--g300);border-radius:6px;font-size:13px;">
|
|
<option value="0">0 mo</option><option value="1">1 mo</option><option value="2">2 mo</option><option value="3">3 mo</option>
|
|
<option value="4">4 mo</option><option value="5">5 mo</option><option value="6">6 mo</option><option value="7">7 mo</option>
|
|
<option value="8">8 mo</option><option value="9">9 mo</option><option value="10">10 mo</option><option value="11">11 mo</option>
|
|
</select>
|
|
</div>
|
|
<div class="calc-field">
|
|
<label>Sex</label>
|
|
<select id="bmi-sex"><option value="">Select</option><option value="male">Male</option><option value="female">Female</option></select>
|
|
</div>
|
|
<div class="calc-field">
|
|
<label>Weight (kg)</label>
|
|
<input type="number" id="bmi-weight" min="5" max="200" step="0.1" placeholder="e.g. 25">
|
|
</div>
|
|
<div class="calc-field">
|
|
<label>Height (cm)</label>
|
|
<input type="number" id="bmi-height" min="50" max="200" step="0.1" placeholder="e.g. 120">
|
|
</div>
|
|
</div>
|
|
<button id="btn-calc-bmi" class="btn-sm btn-primary" style="margin-top:12px;"><i class="fas fa-calculator"></i> Calculate</button>
|
|
<button id="btn-clear-bmi" class="btn-sm btn-ghost" style="margin-top:12px;">Clear</button>
|
|
<div id="bmi-result" class="calc-result hidden"></div>
|
|
<div id="bmi-chart-container" class="chart-container hidden"><canvas id="bmi-chart-canvas"></canvas></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- ═══════════ BODY SURFACE AREA ═══════════ -->
|
|
<div id="calc-bsa" class="calc-panel hidden">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h3><i class="fas fa-child"></i> Body Surface Area</h3>
|
|
<span style="font-size:11px;color:var(--g500);">Mosteller formula</span>
|
|
</div>
|
|
<div style="padding:16px;">
|
|
<p style="font-size:12px;color:var(--g500);margin:0 0 16px;">Mosteller formula: BSA (m2) = sqrt(height(cm) x weight(kg) / 3600)</p>
|
|
<div class="calc-grid">
|
|
<div class="calc-field">
|
|
<label>Weight (kg)</label>
|
|
<input type="number" id="bsa-weight" min="1" max="200" step="0.1" placeholder="e.g. 20">
|
|
</div>
|
|
<div class="calc-field">
|
|
<label>Height (cm)</label>
|
|
<input type="number" id="bsa-height" min="30" max="220" step="0.1" placeholder="e.g. 110">
|
|
</div>
|
|
</div>
|
|
<button id="btn-calc-bsa" class="btn-sm btn-primary" style="margin-top:12px;"><i class="fas fa-calculator"></i> Calculate</button>
|
|
<button id="btn-clear-bsa" class="btn-sm btn-ghost" style="margin-top:12px;">Clear</button>
|
|
<div id="bsa-result" class="calc-result hidden"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- ═══════════ WEIGHT-BASED DOSING ═══════════ -->
|
|
<div id="calc-dose" class="calc-panel hidden">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h3><i class="fas fa-pills"></i> Weight-Based Dosing</h3>
|
|
</div>
|
|
<div style="padding:16px;">
|
|
<p style="font-size:12px;color:var(--g500);margin:0 0 16px;">Calculate dose based on weight. Always verify against formulary and institutional guidelines.</p>
|
|
<div class="calc-grid">
|
|
<div class="calc-field">
|
|
<label>Patient Weight (kg)</label>
|
|
<input type="number" id="dose-weight" min="1" max="200" step="0.1" placeholder="e.g. 15">
|
|
</div>
|
|
<div class="calc-field">
|
|
<label>Dose (mg/kg)</label>
|
|
<input type="number" id="dose-per-kg" min="0.01" step="0.01" placeholder="e.g. 10">
|
|
</div>
|
|
<div class="calc-field">
|
|
<label>Frequency</label>
|
|
<select id="dose-freq">
|
|
<option value="1">Once daily</option>
|
|
<option value="2">Twice daily (BID)</option>
|
|
<option value="3">Three times daily (TID)</option>
|
|
<option value="4">Four times daily (QID)</option>
|
|
<option value="6">Every 4 hours (Q4H)</option>
|
|
</select>
|
|
</div>
|
|
<div class="calc-field">
|
|
<label>Max single dose (mg, optional)</label>
|
|
<input type="number" id="dose-max" min="0" step="1" placeholder="e.g. 500">
|
|
</div>
|
|
<div class="calc-field">
|
|
<label>Concentration (mg/mL, optional)</label>
|
|
<input type="number" id="dose-conc" min="0" step="0.1" placeholder="e.g. 40">
|
|
</div>
|
|
</div>
|
|
<button id="btn-calc-dose" class="btn-sm btn-primary" style="margin-top:12px;"><i class="fas fa-calculator"></i> Calculate</button>
|
|
<button id="btn-clear-dose" class="btn-sm btn-ghost" style="margin-top:12px;">Clear</button>
|
|
<div id="dose-result" class="calc-result hidden"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- ═══════════ GROWTH CHARTS ═══════════ -->
|
|
<div id="calc-growth" class="calc-panel hidden">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h3><i class="fas fa-chart-line"></i> Growth Percentiles</h3>
|
|
</div>
|
|
<div style="padding:16px;">
|
|
<div style="display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px;">
|
|
<button class="calc-pill active" data-growth="wfa">Weight-for-Age</button>
|
|
<button class="calc-pill" data-growth="lfa">Length/Height-for-Age</button>
|
|
<button class="calc-pill" data-growth="hcfa">Head Circumference</button>
|
|
<button class="calc-pill" data-growth="wfl">Weight-for-Length</button>
|
|
<button class="calc-pill" data-growth="fenton">Fenton (Preterm)</button>
|
|
</div>
|
|
<p id="growth-source-text" style="font-size:12px;color:var(--g500);margin:0 0 14px;">WHO growth standards (0-2y) / CDC 2000 (2-20y).</p>
|
|
<div class="calc-grid">
|
|
<div class="calc-field">
|
|
<label>Sex</label>
|
|
<select id="growth-sex"><option value="">Select</option><option value="male">Male</option><option value="female">Female</option></select>
|
|
</div>
|
|
<div class="calc-field" id="growth-age-field">
|
|
<label>Age <span style="font-weight:400;color:var(--g500);font-size:11px;">(fill any combination)</span></label>
|
|
<div style="display:flex;gap:6px;align-items:center;">
|
|
<input type="number" id="growth-age-yr" min="0" max="20" step="1" placeholder="yr" style="flex:1;min-width:0;">
|
|
<input type="number" id="growth-age-mo" min="0" max="240" step="1" placeholder="mo" style="flex:1;min-width:0;">
|
|
<input type="number" id="growth-age-d" min="0" max="365" step="1" placeholder="d" style="flex:1;min-width:0;">
|
|
</div>
|
|
<div id="growth-age-parsed" style="font-size:11px;color:var(--g500);margin-top:4px;min-height:14px;"></div>
|
|
</div>
|
|
<div class="calc-field" id="growth-ga-field" style="display:none;">
|
|
<label>Gestational Age (weeks)</label>
|
|
<input type="number" id="growth-ga" min="22" max="50" step="1" placeholder="22-50">
|
|
</div>
|
|
<div class="calc-field" id="growth-weight-field">
|
|
<label>Weight (kg)</label>
|
|
<input type="number" id="growth-weight" min="0.3" max="200" step="0.01" placeholder="e.g. 10.5">
|
|
</div>
|
|
<div class="calc-field" id="growth-length-field">
|
|
<label>Length/Height (cm)</label>
|
|
<input type="number" id="growth-length" min="20" max="200" step="0.1" placeholder="e.g. 75">
|
|
</div>
|
|
<div class="calc-field" id="growth-hc-field" style="display:none;">
|
|
<label>Head Circumference (cm)</label>
|
|
<input type="number" id="growth-hc" min="20" max="60" step="0.1" placeholder="e.g. 35">
|
|
</div>
|
|
</div>
|
|
<div id="growth-mph-section" style="display:none;margin-top:12px;padding:12px;background:var(--g50);border-radius:8px;">
|
|
<div style="font-size:12px;font-weight:600;color:var(--g600);margin-bottom:8px;">Mid-Parental Height (optional)</div>
|
|
<div class="calc-grid">
|
|
<div class="calc-field">
|
|
<label>Mother's Height (cm)</label>
|
|
<input type="number" id="growth-mother-ht" min="120" max="200" step="0.1" placeholder="e.g. 165">
|
|
</div>
|
|
<div class="calc-field">
|
|
<label>Father's Height (cm)</label>
|
|
<input type="number" id="growth-father-ht" min="140" max="220" step="0.1" placeholder="e.g. 178">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<button id="btn-calc-growth" class="btn-sm btn-primary" style="margin-top:12px;"><i class="fas fa-calculator"></i> Calculate</button>
|
|
<button id="btn-clear-growth" class="btn-sm btn-ghost" style="margin-top:12px;">Clear</button>
|
|
<div id="growth-result" class="calc-result hidden"></div>
|
|
<div id="growth-chart-container" class="chart-container hidden"><canvas id="growth-chart-canvas"></canvas></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- ═══════════ BILIRUBIN NOMOGRAM ═══════════ -->
|
|
<div id="calc-bili" class="calc-panel hidden">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h3><i class="fas fa-droplet"></i> Neonatal Bilirubin</h3>
|
|
</div>
|
|
<div style="padding:16px;">
|
|
<div style="display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px;">
|
|
<button class="calc-pill active" data-bili="aap">AAP 2022 Phototherapy</button>
|
|
<button class="calc-pill" data-bili="bhutani">Bhutani Nomogram</button>
|
|
</div>
|
|
|
|
<div id="bili-aap-panel">
|
|
<p style="font-size:12px;color:var(--g500);margin:0 0 14px;">AAP 2022 Clinical Practice Guideline. Determines phototherapy threshold based on gestational age and risk factors.</p>
|
|
<details style="margin-bottom:14px;font-size:12px;border:1px solid var(--g200);border-radius:8px;padding:0;">
|
|
<summary style="padding:10px 14px;cursor:pointer;font-weight:600;color:var(--g700);background:var(--g50);border-radius:8px;">Neurotoxicity Risk Factors for Phototherapy Threshold (AAP 2022)</summary>
|
|
<div style="padding:12px 14px;">
|
|
<p style="font-weight:600;color:#ef4444;margin:0 0 6px;">Higher Risk (use lower threshold):</p>
|
|
<ul style="margin:0 0 10px;padding-left:18px;color:var(--g700);line-height:1.7;">
|
|
<li>Gestational age 35-37 weeks (with other risk factors)</li>
|
|
<li>Albumin < 3.0 g/dL</li>
|
|
<li>Isoimmune hemolytic disease (ABO, Rh incompatibility)</li>
|
|
<li>G6PD deficiency</li>
|
|
<li>Asphyxia / significant lethargy</li>
|
|
<li>Sepsis</li>
|
|
<li>Acidosis (pH < 7.15)</li>
|
|
<li>Temperature instability / hypothermia</li>
|
|
</ul>
|
|
<p style="font-weight:600;color:#10b981;margin:0 0 6px;">Lower Risk (use higher threshold):</p>
|
|
<ul style="margin:0;padding-left:18px;color:var(--g700);line-height:1.7;">
|
|
<li>Gestational age ≥ 38 weeks</li>
|
|
<li>No hemolysis</li>
|
|
<li>Well-appearing infant</li>
|
|
<li>No risk factors above</li>
|
|
</ul>
|
|
<p style="margin:8px 0 0;font-size:11px;color:var(--g400);">Source: AAP 2022 Clinical Practice Guideline</p>
|
|
</div>
|
|
</details>
|
|
|
|
<details style="margin-bottom:14px;font-size:12px;border:1px solid var(--g200);border-radius:8px;padding:0;">
|
|
<summary style="padding:10px 14px;cursor:pointer;font-weight:600;color:var(--g700);background:var(--g50);border-radius:8px;">Risk Factors for Severe Neonatal Hyperbilirubinemia (Nelson Table 137.1)</summary>
|
|
<div style="padding:12px 14px;">
|
|
<p style="font-weight:600;color:var(--g800);margin:0 0 6px;">Genetic Factors</p>
|
|
<ul style="margin:0 0 12px;padding-left:18px;color:var(--g700);line-height:1.6;">
|
|
<li>Gilbert syndrome</li>
|
|
<li>Crigler-Najjar syndrome</li>
|
|
<li>Alagille syndrome</li>
|
|
<li>β-thalassemia</li>
|
|
<li>Glucose-6-phosphate dehydrogenase (G6PD) deficiency</li>
|
|
<li>Bilirubin glucuronosyltransferase polymorphism</li>
|
|
<li>Pyruvate kinase deficiency</li>
|
|
<li>Erythrocyte structural defects (hereditary spherocytosis, elliptocytosis)</li>
|
|
<li>Galactosemia</li>
|
|
</ul>
|
|
<p style="font-weight:600;color:var(--g800);margin:0 0 6px;">Maternal Factors</p>
|
|
<ul style="margin:0 0 12px;padding-left:18px;color:var(--g700);line-height:1.6;">
|
|
<li>Family history of severe jaundice, splenectomy, or cholecystectomy</li>
|
|
<li>Primiparity</li>
|
|
<li>Teenage pregnancy</li>
|
|
<li>Diabetes</li>
|
|
<li>Rhesus incompatibility</li>
|
|
<li>ABO incompatibility</li>
|
|
<li>Other blood group isoimmunization</li>
|
|
<li>Use of drugs during labor (oxytocin, promethazine, bupivacaine)</li>
|
|
<li>Exclusive breastfeeding</li>
|
|
</ul>
|
|
<p style="font-weight:600;color:var(--g800);margin:0 0 6px;">Perinatal Factors</p>
|
|
<ul style="margin:0 0 12px;padding-left:18px;color:var(--g700);line-height:1.6;">
|
|
<li>Mode of delivery (breech vs vertex, instrumentation)</li>
|
|
<li>Birth trauma (cephalohematoma, substantial bruising, extravasation)</li>
|
|
<li>Birth asphyxia</li>
|
|
<li>Congenital infections (CMV, syphilis)</li>
|
|
<li>Sepsis</li>
|
|
</ul>
|
|
<p style="font-weight:600;color:var(--g800);margin:0 0 6px;">Neonatal Factors</p>
|
|
<ul style="margin:0 0 12px;padding-left:18px;color:var(--g700);line-height:1.6;">
|
|
<li>Male sex</li>
|
|
<li>Prematurity or low birthweight and small-for-gestational age</li>
|
|
<li>Hypothyroidism</li>
|
|
<li>Polycythemia</li>
|
|
<li>Hypoglycemia</li>
|
|
<li>Low intake of breast milk, dehydration, or weight loss</li>
|
|
<li>Breast milk jaundice</li>
|
|
<li>Jaundice in the first day of life</li>
|
|
<li>Trisomy 21</li>
|
|
<li>Infant of diabetic mother</li>
|
|
<li>Cephalohematoma, other bruising</li>
|
|
</ul>
|
|
<p style="font-weight:600;color:var(--g800);margin:0 0 6px;">Other Risk Factors and Markers</p>
|
|
<ul style="margin:0 0 8px;padding-left:18px;color:var(--g700);line-height:1.6;">
|
|
<li>Previous sibling received phototherapy or exchange transfusion</li>
|
|
<li>Predischarge TSB or TcB in the high zone</li>
|
|
<li>Use of hemolytic agents (naphthalene, menthol-based products) in G6PD-deficient populations</li>
|
|
<li>Folate deficiency</li>
|
|
<li>Aflatoxins</li>
|
|
<li>Hypothermia</li>
|
|
<li>Birth outside of a healthcare facility</li>
|
|
</ul>
|
|
<p style="margin:8px 0 0;font-size:11px;color:var(--g400);">Modified from Olusanya BO, Kaplan M, Hansen TWR. Neonatal hyperbilirubinaemia: a global perspective. Lancet Child Adolesc Health. 2018;2:610-618. Nelson Textbook of Pediatrics, Table 137.1.</p>
|
|
</div>
|
|
</details>
|
|
<div class="calc-grid">
|
|
<div class="calc-field">
|
|
<label>Gestational Age (completed weeks)</label>
|
|
<select id="bili-ga">
|
|
<option value="">Select</option>
|
|
<option value="35">35 weeks</option>
|
|
<option value="36">36 weeks</option>
|
|
<option value="37">37 weeks</option>
|
|
<option value="38">38 weeks</option>
|
|
<option value="39">39 weeks</option>
|
|
<option value="40">40+ weeks</option>
|
|
</select>
|
|
<div style="font-size:11px;color:var(--g500);margin-top:2px;">AAP 2022 thresholds depend only on completed weeks; days do not change the curve.</div>
|
|
</div>
|
|
<div class="calc-field">
|
|
<label>Age of Infant (hours)</label>
|
|
<input type="number" id="bili-age-hours" min="0" max="168" step="1" placeholder="e.g. 48">
|
|
</div>
|
|
<div class="calc-field">
|
|
<label>Total Serum Bilirubin (mg/dL)</label>
|
|
<input type="number" id="bili-tsb" min="0" max="35" step="0.1" placeholder="e.g. 12.5">
|
|
</div>
|
|
<div class="calc-field">
|
|
<label>Neurotoxicity risk factors</label>
|
|
<select id="bili-risk">
|
|
<option value="none">Absent</option>
|
|
<option value="medium">Present (any one qualifies)</option>
|
|
</select>
|
|
<details style="font-size:11px;color:var(--g500);margin-top:4px;line-height:1.5;">
|
|
<summary style="cursor:pointer;color:var(--g600);">What counts as a neurotoxicity risk factor?</summary>
|
|
<ul style="margin:6px 0 0 16px;padding:0;">
|
|
<li>Isoimmune hemolytic disease (positive DAT — ABO or Rh incompatibility)</li>
|
|
<li>G6PD deficiency</li>
|
|
<li>Other hemolytic disease (congenital or acquired)</li>
|
|
<li>Sepsis</li>
|
|
<li>Albumin < 3.0 g/dL</li>
|
|
<li>Significant clinical instability in the previous 24 hours</li>
|
|
</ul>
|
|
<div style="margin-top:6px;">Any one qualifies. Per AAP 2022 Box 2. Gestational age < 38w is also a neurotoxicity risk per the guideline but is already accounted for by the per-week threshold curves — do NOT double-count it here.</div>
|
|
</details>
|
|
</div>
|
|
</div>
|
|
<button id="btn-calc-bili-aap" class="btn-sm btn-primary" style="margin-top:12px;"><i class="fas fa-calculator"></i> Assess</button>
|
|
<button id="btn-clear-bili-aap" class="btn-sm btn-ghost" style="margin-top:12px;">Clear</button>
|
|
</div>
|
|
|
|
<div id="bili-bhutani-panel" style="display:none;">
|
|
<p style="font-size:12px;color:var(--g500);margin:0 0 14px;">Bhutani hour-specific bilirubin nomogram. Determines risk zone for infants >= 35 weeks GA.</p>
|
|
<div class="calc-grid">
|
|
<div class="calc-field">
|
|
<label>Age of Infant (hours)</label>
|
|
<input type="number" id="bhutani-age" min="12" max="144" step="1" placeholder="12-144">
|
|
</div>
|
|
<div class="calc-field">
|
|
<label>Total Serum Bilirubin (mg/dL)</label>
|
|
<input type="number" id="bhutani-tsb" min="0" max="25" step="0.1" placeholder="e.g. 8.5">
|
|
</div>
|
|
</div>
|
|
<button id="btn-calc-bhutani" class="btn-sm btn-primary" style="margin-top:12px;"><i class="fas fa-calculator"></i> Assess</button>
|
|
<button id="btn-clear-bhutani" class="btn-sm btn-ghost" style="margin-top:12px;">Clear</button>
|
|
</div>
|
|
|
|
<div id="bili-result" class="calc-result hidden"></div>
|
|
<div id="bili-chart-container" class="chart-container hidden"><canvas id="bili-chart-canvas"></canvas></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- ═══════════ VITAL SIGNS BY AGE ═══════════ -->
|
|
<div id="calc-vitals" class="calc-panel hidden">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h3><i class="fas fa-heartbeat"></i> Normal Vital Signs by Age</h3>
|
|
<span style="font-size:11px;color:var(--g500);">Harriet Lane Handbook</span>
|
|
</div>
|
|
<div style="padding:16px;">
|
|
<p style="font-size:12px;color:var(--g500);margin:0 0 14px;">Select age group to view normal vital sign ranges. Source: Harriet Lane Handbook.</p>
|
|
|
|
<div class="calc-field" style="max-width:300px;margin-bottom:16px;">
|
|
<label>Age Group</label>
|
|
<select id="vitals-age-select">
|
|
<option value="">Select age group</option>
|
|
<option value="premie">Premie</option>
|
|
<option value="0-3mo">0-3 months</option>
|
|
<option value="3-6mo">3-6 months</option>
|
|
<option value="6-12mo">6-12 months</option>
|
|
<option value="1-3yr">1-3 years</option>
|
|
<option value="3-6yr">3-6 years</option>
|
|
<option value="6-12yr">6-12 years</option>
|
|
<option value=">12yr">>12 years</option>
|
|
</select>
|
|
</div>
|
|
|
|
<div id="vitals-result" class="hidden"></div>
|
|
|
|
<!-- All ages reference table (collapsible) -->
|
|
<details style="margin-top:16px;border:1px solid var(--g200);border-radius:8px;">
|
|
<summary style="padding:10px 14px;cursor:pointer;font-weight:600;font-size:13px;color:var(--g700);background:var(--g50);border-radius:8px;">View All Age Groups</summary>
|
|
<div style="padding:12px;overflow-x:auto;">
|
|
<table class="admin-table" style="font-size:12px;width:100%;">
|
|
<thead>
|
|
<tr><th>Age</th><th>HR (bpm)</th><th>RR</th><th>BP (mmHg)</th><th>Temp (C)</th></tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr><td>Premie</td><td>120-170</td><td>40-70</td><td>55-75/35-45</td><td>36.5-37.5</td></tr>
|
|
<tr><td>0-3 mo</td><td>100-150</td><td>35-55</td><td>65-85/45-55</td><td>36.5-37.5</td></tr>
|
|
<tr><td>3-6 mo</td><td>90-120</td><td>30-45</td><td>70-90/50-65</td><td>36.5-37.5</td></tr>
|
|
<tr><td>6-12 mo</td><td>80-120</td><td>25-40</td><td>80-100/55-65</td><td>36.0-37.5</td></tr>
|
|
<tr><td>1-3 yr</td><td>70-110</td><td>20-30</td><td>90-105/55-70</td><td>36.0-37.5</td></tr>
|
|
<tr><td>3-6 yr</td><td>65-110</td><td>20-25</td><td>95-110/60-75</td><td>36.0-37.5</td></tr>
|
|
<tr><td>6-12 yr</td><td>60-95</td><td>14-22</td><td>100-120/60-75</td><td>36.0-37.5</td></tr>
|
|
<tr><td>>12 yr</td><td>55-85</td><td>12-18</td><td>110-135/65-85</td><td>36.0-37.5</td></tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</details>
|
|
|
|
<div style="margin-top:16px;">
|
|
<h4 style="font-size:13px;font-weight:700;color:var(--g700);margin:0 0 8px;">Quick Reference Formulas</h4>
|
|
<div style="display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:8px;">
|
|
<div style="padding:10px;background:var(--g50);border-radius:8px;font-size:12px;">
|
|
<strong>Estimated Weight:</strong><br>
|
|
1-12mo: (age in mo + 9) / 2<br>
|
|
1-5yr: 2 x (age in yr) + 8<br>
|
|
6-12yr: 3 x (age in yr) + 7
|
|
</div>
|
|
<div style="padding:10px;background:var(--g50);border-radius:8px;font-size:12px;">
|
|
<strong>Min Systolic BP:</strong><br>
|
|
1-10yr: 70 + (2 x age in yr)<br>
|
|
Hypotension: SBP < 5th %ile
|
|
</div>
|
|
<div style="padding:10px;background:var(--g50);border-radius:8px;font-size:12px;">
|
|
<strong>ETT Size:</strong><br>
|
|
Uncuffed: (age/4) + 4<br>
|
|
Cuffed: (age/4) + 3.5<br>
|
|
Depth: ETT size x 3
|
|
</div>
|
|
<div style="padding:10px;background:var(--g50);border-radius:8px;font-size:12px;">
|
|
<strong>Maintenance Fluids (4-2-1):</strong><br>
|
|
First 10kg: 4 mL/kg/hr<br>
|
|
Next 10kg: +2 mL/kg/hr<br>
|
|
Each kg above 20: +1 mL/kg/hr
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- ═══════════ RESUSCITATION MEDICATIONS ═══════════ -->
|
|
<div id="calc-resus" class="calc-panel hidden">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h3><i class="fas fa-kit-medical"></i> Resuscitation Medications</h3>
|
|
<span style="font-size:11px;color:var(--g500);">Harriet Lane Handbook / AHA PALS 2020</span>
|
|
</div>
|
|
<div style="padding:16px;">
|
|
<p style="font-size:12px;color:var(--g500);margin:0 0 14px;">Enter patient weight to calculate all resuscitation medication doses.</p>
|
|
<div class="calc-grid">
|
|
<div class="calc-field">
|
|
<label>Patient Weight (kg)</label>
|
|
<input type="number" id="resus-weight" min="0.5" max="100" step="0.1" placeholder="e.g. 15">
|
|
</div>
|
|
</div>
|
|
<button id="btn-calc-resus" class="btn-sm btn-primary" style="margin-top:12px;"><i class="fas fa-calculator"></i> Calculate All Doses</button>
|
|
<button id="btn-clear-resus" class="btn-sm btn-ghost" style="margin-top:12px;">Clear</button>
|
|
<div id="resus-result" class="calc-result hidden"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- ═══════════ GLASGOW COMA SCALE ═══════════ -->
|
|
<div id="calc-gcs" class="calc-panel hidden">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h3><i class="fas fa-brain"></i> Glasgow Coma Scale</h3>
|
|
<span style="font-size:11px;color:var(--g500);">Child/Adult and Infant versions</span>
|
|
</div>
|
|
<div style="padding:16px;">
|
|
<p style="font-size:12px;color:var(--g500);margin:0 0 14px;">Select responses to calculate GCS. Total score 3-15. Source: Harriet Lane Handbook.</p>
|
|
|
|
<div style="display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px;">
|
|
<button class="calc-pill active" data-gcs="child">Child / Adult</button>
|
|
<button class="calc-pill" data-gcs="infant">Infant</button>
|
|
</div>
|
|
|
|
<!-- Child/Adult GCS -->
|
|
<div id="gcs-child-panel">
|
|
<div class="calc-field" style="margin-bottom:12px;">
|
|
<label>Eye Opening</label>
|
|
<select id="gcs-child-eye">
|
|
<option value="4">4 — Spontaneous</option>
|
|
<option value="3">3 — To speech</option>
|
|
<option value="2">2 — To pain</option>
|
|
<option value="1">1 — None</option>
|
|
</select>
|
|
</div>
|
|
<div class="calc-field" style="margin-bottom:12px;">
|
|
<label>Verbal Response</label>
|
|
<select id="gcs-child-verbal">
|
|
<option value="5">5 — Oriented</option>
|
|
<option value="4">4 — Confused</option>
|
|
<option value="3">3 — Inappropriate words</option>
|
|
<option value="2">2 — Incomprehensible sounds</option>
|
|
<option value="1">1 — None</option>
|
|
</select>
|
|
</div>
|
|
<div class="calc-field" style="margin-bottom:12px;">
|
|
<label>Motor Response</label>
|
|
<select id="gcs-child-motor">
|
|
<option value="6">6 — Obeys commands</option>
|
|
<option value="5">5 — Localizes pain</option>
|
|
<option value="4">4 — Withdraws to pain</option>
|
|
<option value="3">3 — Abnormal flexion (decorticate)</option>
|
|
<option value="2">2 — Abnormal extension (decerebrate)</option>
|
|
<option value="1">1 — None (flaccid)</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Infant GCS -->
|
|
<div id="gcs-infant-panel" style="display:none;">
|
|
<div class="calc-field" style="margin-bottom:12px;">
|
|
<label>Eye Opening</label>
|
|
<select id="gcs-infant-eye">
|
|
<option value="4">4 — Spontaneous</option>
|
|
<option value="3">3 — To speech/sound</option>
|
|
<option value="2">2 — To painful stimuli</option>
|
|
<option value="1">1 — None</option>
|
|
</select>
|
|
</div>
|
|
<div class="calc-field" style="margin-bottom:12px;">
|
|
<label>Verbal Response</label>
|
|
<select id="gcs-infant-verbal">
|
|
<option value="5">5 — Coos/babbles</option>
|
|
<option value="4">4 — Irritable cry</option>
|
|
<option value="3">3 — Cries to pain</option>
|
|
<option value="2">2 — Moans to pain</option>
|
|
<option value="1">1 — None</option>
|
|
</select>
|
|
</div>
|
|
<div class="calc-field" style="margin-bottom:12px;">
|
|
<label>Motor Response</label>
|
|
<select id="gcs-infant-motor">
|
|
<option value="6">6 — Normal spontaneous movement</option>
|
|
<option value="5">5 — Withdraws to touch</option>
|
|
<option value="4">4 — Withdraws to pain</option>
|
|
<option value="3">3 — Abnormal flexion (decorticate)</option>
|
|
<option value="2">2 — Abnormal extension (decerebrate)</option>
|
|
<option value="1">1 — None (flaccid)</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="gcs-result" class="calc-result"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- ═══════════ EQUIPMENT SIZING ═══════════ -->
|
|
<div id="calc-equipment" class="calc-panel hidden">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h3><i class="fas fa-lungs"></i> Pediatric Equipment Sizing</h3>
|
|
<span style="font-size:11px;color:var(--g500);">Harriet Lane Handbook</span>
|
|
</div>
|
|
<div style="padding:16px;">
|
|
<p style="font-size:12px;color:var(--g500);margin:0 0 14px;">Select age/weight group to view recommended equipment sizes.</p>
|
|
<div class="calc-field" style="max-width:300px;margin-bottom:16px;">
|
|
<label>Age / Weight Group</label>
|
|
<select id="equip-age-select">
|
|
<option value="">Select</option>
|
|
<option value="premie">Premie (1-3 kg)</option>
|
|
<option value="newborn">Newborn (2-4 kg)</option>
|
|
<option value="6mo">6 months (6-8 kg)</option>
|
|
<option value="1yr">1 year (10 kg)</option>
|
|
<option value="2-3yr">2-3 years (12-16 kg)</option>
|
|
<option value="4-6yr">4-6 years (20-25 kg)</option>
|
|
<option value="7-10yr">7-10 years (25-35 kg)</option>
|
|
<option value="11-15yr">11-15 years (40-50 kg)</option>
|
|
<option value="16yr">16+ years (>50 kg)</option>
|
|
</select>
|
|
</div>
|
|
<div id="equip-result" class="hidden"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- ═══════════ BEDSIDE (consolidated) ═══════════ -->
|
|
<div id="calc-bedside" class="calc-panel hidden">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h3><i class="fas fa-briefcase-medical" style="color:var(--red);"></i> Bedside</h3>
|
|
<span style="font-size:11px;color:var(--g500);">Weight-based pediatric reference. Always verify against institutional protocols.</span>
|
|
</div>
|
|
<div style="padding:16px;">
|
|
<div style="display:flex;gap:6px;flex-wrap:wrap;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid var(--g200);">
|
|
<button class="calc-pill active" data-em="neonatal"><i class="fas fa-baby"></i> Neonatal</button>
|
|
<button class="calc-pill" data-em="airway"><i class="fas fa-wind"></i> Airway/RSI</button>
|
|
<button class="calc-pill" data-em="cardiac"><i class="fas fa-heart-pulse"></i> Cardiac Arrest</button>
|
|
<button class="calc-pill" data-em="respiratory"><i class="fas fa-lungs"></i> Respiratory</button>
|
|
<button class="calc-pill" data-em="ventilation"><i class="fas fa-fan"></i> O2 & Ventilation</button>
|
|
<button class="calc-pill" data-em="seizure"><i class="fas fa-brain"></i> Seizures</button>
|
|
<button class="calc-pill" data-em="sepsis"><i class="fas fa-virus"></i> Sepsis & Fever</button>
|
|
<button class="calc-pill" data-em="anaphylaxis"><i class="fas fa-syringe"></i> Anaphylaxis</button>
|
|
<button class="calc-pill" data-em="sedation"><i class="fas fa-bed-pulse"></i> Sedation</button>
|
|
<button class="calc-pill" data-em="agitation"><i class="fas fa-user-injured"></i> Agitation</button>
|
|
<button class="calc-pill" data-em="antiemetics"><i class="fas fa-pills"></i> Antiemetics</button>
|
|
<button class="calc-pill" data-em="antimicrobials"><i class="fas fa-bacterium"></i> Antimicrobials</button>
|
|
<button class="calc-pill" data-em="burns"><i class="fas fa-fire"></i> Burns</button>
|
|
<button class="calc-pill" data-em="toxicology"><i class="fas fa-skull-crossbones"></i> Toxicology</button>
|
|
<button class="calc-pill" data-em="trauma"><i class="fas fa-user-injured" style="transform:rotate(-45deg);"></i> Trauma</button>
|
|
</div>
|
|
|
|
<!-- ── NEONATAL ── -->
|
|
<div id="em-neonatal" class="em-section">
|
|
<h4 style="font-size:15px;font-weight:700;color:var(--g800);margin:0 0 4px;">Neonatal Assessment</h4>
|
|
<p style="font-size:12px;color:var(--g500);margin:0 0 14px;">GA classification, birth weight assessment (AGA/SGA/LGA), and prematurity category. Fenton 2013 / WHO.</p>
|
|
<div style="display:flex;gap:12px;flex-wrap:wrap;margin-bottom:12px;">
|
|
<div class="calc-field" style="flex:1;min-width:130px;">
|
|
<label>GA (weeks)</label>
|
|
<input type="number" id="neo-ga-weeks" min="22" max="44" step="1" placeholder="e.g. 34">
|
|
</div>
|
|
<div class="calc-field" style="flex:1;min-width:130px;">
|
|
<label>GA (days)</label>
|
|
<input type="number" id="neo-ga-days" min="0" max="6" step="1" placeholder="0-6">
|
|
</div>
|
|
<div class="calc-field" style="flex:1;min-width:130px;">
|
|
<label>Birth Weight (g)</label>
|
|
<input type="number" id="neo-weight" min="200" max="6000" step="1" placeholder="e.g. 2500">
|
|
</div>
|
|
<div class="calc-field" style="flex:1;min-width:110px;">
|
|
<label>Sex</label>
|
|
<select id="neo-sex">
|
|
<option value="male">Male</option>
|
|
<option value="female">Female</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<button id="btn-neo-assess" class="btn-sm btn-primary" style="margin-bottom:12px;"><i class="fas fa-calculator"></i> Assess</button>
|
|
<div id="neo-result"></div>
|
|
|
|
<details style="margin-top:24px;border-top:1px solid var(--g200);padding-top:16px;">
|
|
<summary style="cursor:pointer;font-size:14px;font-weight:700;color:var(--g800);"><i class="fas fa-heart-pulse" style="color:var(--red);"></i> NRP Resuscitation Pathway</summary>
|
|
<p style="font-size:12px;color:var(--g500);margin:8px 0;">AHA Neonatal Resuscitation Program 2020. Static visual pathway — enter weight to calculate drug doses.</p>
|
|
<div style="margin-bottom:10px;">
|
|
<button class="btn-sm btn-ghost" type="button" data-img-src="/img/nrp_pathway.png" data-img-title="NRP Pathway (reference)"><i class="fas fa-image"></i> View pathway image</button>
|
|
</div>
|
|
<div id="nrp-pathway-static"></div>
|
|
<div style="display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end;margin-top:12px;">
|
|
<div class="calc-field" style="flex:1;min-width:170px;max-width:240px;">
|
|
<label>Current Weight (kg)</label>
|
|
<input type="number" id="nrp-weight" min="0.3" max="6" step="0.01" placeholder="e.g. 3.0">
|
|
</div>
|
|
<button id="btn-nrp-calc" class="btn-sm btn-primary"><i class="fas fa-calculator"></i> Calculate NRP Doses</button>
|
|
</div>
|
|
<div id="nrp-result" style="margin-top:12px;"></div>
|
|
</details>
|
|
|
|
<!-- Apgar Score -->
|
|
<div style="margin-top:24px;border-top:1px solid var(--g200);padding-top:16px;">
|
|
<h4 style="font-size:14px;font-weight:700;color:var(--g800);margin:0 0 4px;"><i class="fas fa-clipboard-check" style="color:var(--blue);"></i> Apgar Score</h4>
|
|
<p style="font-size:12px;color:var(--g500);margin:0 0 10px;">Assess at <strong>1 and 5 minutes</strong>. If <7 at 5 min, repeat every 5 min up to 20 min. Apgar is a description — <em>never</em> delay resuscitation waiting for a score.</p>
|
|
<div style="display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px;">
|
|
<div class="calc-field" style="flex:1;min-width:150px;">
|
|
<label><strong>A</strong>ppearance (color)</label>
|
|
<select id="apgar-appearance">
|
|
<option value="0">0 — Blue / pale all over</option>
|
|
<option value="1" selected>1 — Body pink, extremities blue</option>
|
|
<option value="2">2 — All pink</option>
|
|
</select>
|
|
</div>
|
|
<div class="calc-field" style="flex:1;min-width:150px;">
|
|
<label><strong>P</strong>ulse (HR)</label>
|
|
<select id="apgar-pulse">
|
|
<option value="0">0 — Absent</option>
|
|
<option value="1">1 — <100</option>
|
|
<option value="2" selected>2 — ≥100</option>
|
|
</select>
|
|
</div>
|
|
<div class="calc-field" style="flex:1;min-width:150px;">
|
|
<label><strong>G</strong>rimace (reflex)</label>
|
|
<select id="apgar-grimace">
|
|
<option value="0">0 — No response</option>
|
|
<option value="1">1 — Grimace / weak cry</option>
|
|
<option value="2" selected>2 — Cry / active withdrawal</option>
|
|
</select>
|
|
</div>
|
|
<div class="calc-field" style="flex:1;min-width:150px;">
|
|
<label><strong>A</strong>ctivity (tone)</label>
|
|
<select id="apgar-activity">
|
|
<option value="0">0 — Limp</option>
|
|
<option value="1">1 — Some flexion</option>
|
|
<option value="2" selected>2 — Active motion</option>
|
|
</select>
|
|
</div>
|
|
<div class="calc-field" style="flex:1;min-width:150px;">
|
|
<label><strong>R</strong>espiration</label>
|
|
<select id="apgar-respiration">
|
|
<option value="0">0 — Absent</option>
|
|
<option value="1">1 — Slow / irregular</option>
|
|
<option value="2" selected>2 — Strong cry</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<button id="btn-apgar-calc" class="btn-sm btn-primary"><i class="fas fa-calculator"></i> Calculate Apgar</button>
|
|
<div id="apgar-result" style="margin-top:10px;"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- ── AIRWAY / RSI ── -->
|
|
<div id="em-airway" class="em-section" style="display:none;">
|
|
<h4 style="font-size:15px;font-weight:700;color:var(--g800);margin:0 0 4px;">Airway Management / RSI</h4>
|
|
<p style="font-size:12px;color:var(--g500);margin:0 0 14px;">RSI drugs + equipment sizing + initial ventilator settings.</p>
|
|
<div style="display:flex;gap:12px;flex-wrap:wrap;margin-bottom:12px;">
|
|
<div class="calc-field" style="flex:1;min-width:140px;max-width:200px;">
|
|
<label>Weight (kg)</label>
|
|
<input type="number" id="airway-weight" min="1" max="150" step="0.1" placeholder="e.g. 20">
|
|
</div>
|
|
<div class="calc-field" style="flex:1;min-width:140px;max-width:200px;">
|
|
<label>Age (years, for equipment sizing)</label>
|
|
<input type="number" id="airway-age" min="0" max="18" step="0.5" placeholder="e.g. 5">
|
|
</div>
|
|
</div>
|
|
<button id="btn-airway-calc" class="btn-sm btn-primary" style="margin-bottom:12px;"><i class="fas fa-calculator"></i> Calculate</button>
|
|
<div id="airway-result"></div>
|
|
</div>
|
|
|
|
<!-- ── CARDIAC ARREST / PALS ── -->
|
|
<div id="em-cardiac" class="em-section" style="display:none;">
|
|
<h4 style="font-size:15px;font-weight:700;color:var(--g800);margin:0 0 4px;">Cardiac Arrest / PALS</h4>
|
|
<p style="font-size:12px;color:var(--g500);margin:0 0 14px;">PALS algorithm medications for arrest and peri-arrest rhythms.</p>
|
|
<div class="calc-field" style="max-width:200px;margin-bottom:12px;">
|
|
<label>Weight (kg)</label>
|
|
<input type="number" id="cardiac-weight" min="1" max="150" step="0.1" placeholder="e.g. 20">
|
|
</div>
|
|
<div style="display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px;">
|
|
<button class="btn-sm btn-primary" data-cardiac="general">General Doses</button>
|
|
<button class="btn-sm btn-primary" data-cardiac="asystole">Asystole / PEA</button>
|
|
<button class="btn-sm btn-primary" data-cardiac="brady">Bradycardia</button>
|
|
<button class="btn-sm btn-primary" data-cardiac="svt">SVT</button>
|
|
<button class="btn-sm btn-primary" data-cardiac="vfib">VF / Pulseless VT</button>
|
|
<button class="btn-sm btn-primary" data-cardiac="vt">Stable VT</button>
|
|
</div>
|
|
<div id="cardiac-result"></div>
|
|
</div>
|
|
|
|
<!-- ── RESPIRATORY ── -->
|
|
<div id="em-respiratory" class="em-section" style="display:none;">
|
|
<h4 style="font-size:15px;font-weight:700;color:var(--g800);margin:0 0 4px;">Respiratory Management</h4>
|
|
<p style="font-size:12px;color:var(--g500);margin:0 0 14px;">Asthma, croup, bronchiolitis — scores, stepwise management, weight-based drug dosing.</p>
|
|
<div class="calc-field" style="max-width:200px;margin-bottom:12px;">
|
|
<label>Weight (kg)</label>
|
|
<input type="number" id="resp-weight" min="1" max="150" step="0.1" placeholder="e.g. 15">
|
|
</div>
|
|
<div style="display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px;">
|
|
<button class="calc-pill active" data-resp="asthma">Asthma</button>
|
|
<button class="calc-pill" data-resp="croup">Croup</button>
|
|
<button class="calc-pill" data-resp="bronchiolitis">Bronchiolitis</button>
|
|
</div>
|
|
|
|
<div id="resp-asthma">
|
|
<p style="font-size:12px;color:var(--g500);margin:0 0 10px;">Select severity to see stepwise management with weight-based dosing.</p>
|
|
<div style="display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px;">
|
|
<button class="btn-sm" data-asthma-severity="mild" style="background:var(--green);color:white;">Mild</button>
|
|
<button class="btn-sm" data-asthma-severity="moderate" style="background:var(--amber);color:white;">Moderate</button>
|
|
<button class="btn-sm" data-asthma-severity="severe" style="background:var(--red);color:white;">Severe</button>
|
|
</div>
|
|
<div id="asthma-result"></div>
|
|
<div style="margin-top:16px;border-top:1px solid var(--g200);padding-top:12px;">
|
|
<label style="font-size:12px;font-weight:600;color:var(--g600);margin-bottom:8px;display:block;">PRAM Score (Pediatric Respiratory Assessment Measure)</label>
|
|
<div style="display:flex;gap:10px;flex-wrap:wrap;margin-bottom:10px;">
|
|
<div class="calc-field" style="flex:1;min-width:160px;">
|
|
<label>O2 Saturation</label>
|
|
<select id="pram-spo2"><option value="0">≥95%</option><option value="1">92-94%</option><option value="2"><92%</option></select>
|
|
</div>
|
|
<div class="calc-field" style="flex:1;min-width:160px;">
|
|
<label>Suprasternal Retractions</label>
|
|
<select id="pram-retractions"><option value="0">Absent</option><option value="2">Present</option></select>
|
|
</div>
|
|
<div class="calc-field" style="flex:1;min-width:160px;">
|
|
<label>Scalene Contraction</label>
|
|
<select id="pram-scalene"><option value="0">Absent</option><option value="2">Present</option></select>
|
|
</div>
|
|
<div class="calc-field" style="flex:1;min-width:160px;">
|
|
<label>Air Entry</label>
|
|
<select id="pram-air"><option value="0">Normal</option><option value="1">Decreased at bases</option><option value="2">Widespread decrease</option><option value="3">Absent/minimal</option></select>
|
|
</div>
|
|
<div class="calc-field" style="flex:1;min-width:160px;">
|
|
<label>Wheezing</label>
|
|
<select id="pram-wheeze"><option value="0">Absent</option><option value="1">Expiratory only</option><option value="2">Insp & exp</option><option value="3">Audible / silent chest</option></select>
|
|
</div>
|
|
</div>
|
|
<button id="btn-pram-calc" class="btn-sm btn-primary"><i class="fas fa-calculator"></i> Calculate PRAM</button>
|
|
<div id="pram-result" style="margin-top:8px;"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="resp-croup" style="display:none;">
|
|
<p style="font-size:12px;color:var(--g500);margin:0 0 10px;">Westley Croup Score → severity-based treatment.</p>
|
|
<div style="display:flex;gap:10px;flex-wrap:wrap;margin-bottom:10px;">
|
|
<div class="calc-field" style="flex:1;min-width:160px;">
|
|
<label>Consciousness</label>
|
|
<select id="croup-conscious"><option value="0">Normal</option><option value="5">Disoriented</option></select>
|
|
</div>
|
|
<div class="calc-field" style="flex:1;min-width:160px;">
|
|
<label>Cyanosis</label>
|
|
<select id="croup-cyanosis"><option value="0">None</option><option value="4">With agitation</option><option value="5">At rest</option></select>
|
|
</div>
|
|
<div class="calc-field" style="flex:1;min-width:160px;">
|
|
<label>Stridor</label>
|
|
<select id="croup-stridor"><option value="0">None</option><option value="1">With agitation</option><option value="2">At rest</option></select>
|
|
</div>
|
|
<div class="calc-field" style="flex:1;min-width:160px;">
|
|
<label>Air Entry</label>
|
|
<select id="croup-air"><option value="0">Normal</option><option value="1">Decreased</option><option value="2">Markedly decreased</option></select>
|
|
</div>
|
|
<div class="calc-field" style="flex:1;min-width:160px;">
|
|
<label>Retractions</label>
|
|
<select id="croup-retractions"><option value="0">None</option><option value="1">Mild</option><option value="2">Moderate</option><option value="3">Severe</option></select>
|
|
</div>
|
|
</div>
|
|
<button id="btn-croup-calc" class="btn-sm btn-primary"><i class="fas fa-calculator"></i> Calculate Westley Score</button>
|
|
<div id="croup-result" style="margin-top:10px;"></div>
|
|
</div>
|
|
|
|
<div id="resp-bronchiolitis" style="display:none;">
|
|
<p style="font-size:12px;color:var(--g500);margin:0 0 10px;">Bronchiolitis management per AAP 2014/2023 — primarily supportive.</p>
|
|
<div style="display:flex;gap:10px;flex-wrap:wrap;margin-bottom:10px;">
|
|
<div class="calc-field" style="flex:1;min-width:160px;">
|
|
<label>Age</label>
|
|
<select id="bronch-age"><option value="<12w"><12 weeks</option><option value="12w-12m">12 wks - 12 mo</option><option value=">12m">>12 months</option></select>
|
|
</div>
|
|
<div class="calc-field" style="flex:1;min-width:160px;">
|
|
<label>O2 Saturation</label>
|
|
<select id="bronch-spo2"><option value="normal">≥90%</option><option value="low"><90%</option></select>
|
|
</div>
|
|
<div class="calc-field" style="flex:1;min-width:160px;">
|
|
<label>Hydration</label>
|
|
<select id="bronch-hydration"><option value="adequate">Adequate</option><option value="poor">Poor / dehydrated</option></select>
|
|
</div>
|
|
<div class="calc-field" style="flex:1;min-width:160px;">
|
|
<label>Resp Distress</label>
|
|
<select id="bronch-distress"><option value="mild">Mild</option><option value="moderate">Moderate</option><option value="severe">Severe / apnea</option></select>
|
|
</div>
|
|
</div>
|
|
<button id="btn-bronch-calc" class="btn-sm btn-primary"><i class="fas fa-calculator"></i> Assess</button>
|
|
<div id="bronch-result" style="margin-top:10px;"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- ── O2 & VENTILATION (teaching + reference) ── -->
|
|
<div id="em-ventilation" class="em-section" style="display:none;">
|
|
<h4 style="font-size:15px;font-weight:700;color:var(--g800);margin:0 0 14px;">Oxygen & Ventilation</h4>
|
|
<div style="display:flex;gap:12px;flex-wrap:wrap;margin-bottom:12px;">
|
|
<div class="calc-field" style="flex:1;min-width:140px;max-width:200px;">
|
|
<label>Weight (kg)</label>
|
|
<input type="number" id="vent-weight" min="1" max="150" step="0.1" placeholder="e.g. 20">
|
|
</div>
|
|
<div class="calc-field" style="flex:1;min-width:140px;max-width:200px;">
|
|
<label>Age (years, optional)</label>
|
|
<input type="number" id="vent-age" min="0" max="18" step="0.5" placeholder="e.g. 5">
|
|
</div>
|
|
</div>
|
|
<button id="btn-vent-show" class="btn-sm btn-primary" style="margin-bottom:12px;"><i class="fas fa-diagram-project"></i> Show Reference</button>
|
|
<div id="vent-result"></div>
|
|
</div>
|
|
|
|
<!-- ── SEIZURES / STATUS EPILEPTICUS ── -->
|
|
<div id="em-seizure" class="em-section" style="display:none;">
|
|
<h4 style="font-size:15px;font-weight:700;color:var(--g800);margin:0 0 4px;">Status Epilepticus</h4>
|
|
<p style="font-size:12px;color:var(--g500);margin:0 0 14px;">Time-based pathway — stabilize → 1st benzo → 2nd benzo → 2nd-line AED → refractory.</p>
|
|
<div class="calc-field" style="max-width:200px;margin-bottom:12px;">
|
|
<label>Weight (kg)</label>
|
|
<input type="number" id="seizure-weight" min="1" max="150" step="0.1" placeholder="e.g. 20">
|
|
</div>
|
|
<div style="display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px;">
|
|
<button id="btn-seizure-calc" class="btn-sm btn-primary"><i class="fas fa-diagram-project"></i> Show Pathway</button>
|
|
<button class="btn-sm btn-ghost" data-img-src="/img/epilepsy_eiic_pathway.png" data-img-title="Pediatric Status Epilepticus Pathway (reference)"><i class="fas fa-image"></i> View pathway image</button>
|
|
</div>
|
|
<div id="seizure-result"></div>
|
|
</div>
|
|
|
|
<!-- ── SEPSIS ── -->
|
|
<div id="em-sepsis" class="em-section" style="display:none;">
|
|
<h4 style="font-size:15px;font-weight:700;color:var(--g800);margin:0 0 4px;">Sepsis & Fever Workup</h4>
|
|
<p style="font-size:12px;color:var(--g500);margin:0 0 14px;">Phoenix Sepsis Criteria (2024), age-based approach, first-hour bundle, and validated febrile-infant rules (PECARN / Aronson / Rochester / Step-by-Step).</p>
|
|
<div style="display:flex;gap:12px;flex-wrap:wrap;margin-bottom:12px;">
|
|
<div class="calc-field" style="flex:1;min-width:140px;max-width:200px;">
|
|
<label>Weight (kg)</label>
|
|
<input type="number" id="sepsis-weight" min="1" max="150" step="0.1" placeholder="e.g. 20">
|
|
</div>
|
|
<div class="calc-field" style="flex:1;min-width:180px;max-width:240px;">
|
|
<label>Age group</label>
|
|
<select id="sepsis-age">
|
|
<option value="neonate">Neonate (0-28 days)</option>
|
|
<option value="infant">Young infant (29 d - 3 mo)</option>
|
|
<option value="child" selected>Older child / adolescent (>3 mo)</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<button id="btn-sepsis-show" class="btn-sm btn-primary" style="margin-bottom:12px;"><i class="fas fa-list-check"></i> Show Approach</button>
|
|
<div id="sepsis-result"></div>
|
|
</div>
|
|
|
|
<!-- ── ANAPHYLAXIS ── -->
|
|
<div id="em-anaphylaxis" class="em-section" style="display:none;">
|
|
<h4 style="font-size:15px;font-weight:700;color:var(--g800);margin:0 0 4px;">Anaphylaxis</h4>
|
|
<p style="font-size:12px;color:var(--g500);margin:0 0 14px;">Stepwise management with weight-based dosing.</p>
|
|
<div style="display:flex;gap:12px;flex-wrap:wrap;margin-bottom:12px;">
|
|
<div class="calc-field" style="flex:1;min-width:140px;max-width:200px;">
|
|
<label>Weight (kg)</label>
|
|
<input type="number" id="anaph-weight" min="1" max="150" step="0.1" placeholder="e.g. 25">
|
|
</div>
|
|
<div class="calc-field" style="flex:1;min-width:140px;max-width:200px;">
|
|
<label>Age Group</label>
|
|
<select id="anaph-age"><option value="infant"><1 year</option><option value="child" selected>1-12 years</option><option value="adolescent">>12 years</option></select>
|
|
</div>
|
|
</div>
|
|
<button id="btn-anaph-calc" class="btn-sm btn-primary" style="margin-bottom:12px;"><i class="fas fa-calculator"></i> Calculate Doses</button>
|
|
<div id="anaph-result"></div>
|
|
</div>
|
|
|
|
<!-- ── PROCEDURAL SEDATION ── -->
|
|
<div id="em-sedation" class="em-section" style="display:none;">
|
|
<h4 style="font-size:15px;font-weight:700;color:var(--g800);margin:0 0 4px;">Procedural Sedation</h4>
|
|
<p style="font-size:12px;color:var(--g500);margin:0 0 14px;">Sedation agents + reversal drugs.</p>
|
|
<div class="calc-field" style="max-width:200px;margin-bottom:12px;">
|
|
<label>Weight (kg)</label>
|
|
<input type="number" id="sed-weight" min="1" max="150" step="0.1" placeholder="e.g. 15">
|
|
</div>
|
|
<button id="btn-sed-calc" class="btn-sm btn-primary" style="margin-bottom:12px;"><i class="fas fa-calculator"></i> Calculate Doses</button>
|
|
<div id="sed-result"></div>
|
|
</div>
|
|
|
|
<!-- ── AGITATION ── -->
|
|
<div id="em-agitation" class="em-section" style="display:none;">
|
|
<h4 style="font-size:15px;font-weight:700;color:var(--g800);margin:0 0 4px;">Acute Agitation</h4>
|
|
<p style="font-size:12px;color:var(--g500);margin:0 0 14px;">Stepwise: verbal de-escalation → oral → IM/IV.</p>
|
|
<div class="calc-field" style="max-width:200px;margin-bottom:12px;">
|
|
<label>Weight (kg)</label>
|
|
<input type="number" id="agit-weight" min="1" max="150" step="0.1" placeholder="e.g. 30">
|
|
</div>
|
|
<button id="btn-agit-calc" class="btn-sm btn-primary" style="margin-bottom:12px;"><i class="fas fa-calculator"></i> Calculate Doses</button>
|
|
<div id="agit-result"></div>
|
|
</div>
|
|
|
|
<!-- ── ANTIEMETICS ── -->
|
|
<div id="em-antiemetics" class="em-section" style="display:none;">
|
|
<h4 style="font-size:15px;font-weight:700;color:var(--g800);margin:0 0 4px;">Antiemetics</h4>
|
|
<p style="font-size:12px;color:var(--g500);margin:0 0 14px;">Common pediatric antiemetic dosing with max doses and key cautions.</p>
|
|
<div class="calc-field" style="max-width:200px;margin-bottom:12px;">
|
|
<label>Weight (kg)</label>
|
|
<input type="number" id="emet-weight" min="1" max="150" step="0.1" placeholder="e.g. 20">
|
|
</div>
|
|
<button id="btn-emet-calc" class="btn-sm btn-primary" style="margin-bottom:12px;"><i class="fas fa-calculator"></i> Calculate Doses</button>
|
|
<div id="emet-result"></div>
|
|
</div>
|
|
|
|
<!-- ── ANTIMICROBIALS ── -->
|
|
<div id="em-antimicrobials" class="em-section" style="display:none;">
|
|
<h4 style="font-size:15px;font-weight:700;color:var(--g800);margin:0 0 4px;">Empiric Antimicrobials</h4>
|
|
<p style="font-size:12px;color:var(--g500);margin:0 0 14px;">Empiric regimens by age and infection type. Always tailor to local resistance, cultures, and severity.</p>
|
|
<div style="display:flex;gap:12px;flex-wrap:wrap;margin-bottom:12px;">
|
|
<div class="calc-field" style="flex:1;min-width:160px;">
|
|
<label>Age</label>
|
|
<select id="abx-age">
|
|
<option value="neonate">Neonate (0-28 days)</option>
|
|
<option value="infant">Infant (1-3 months)</option>
|
|
<option value="child">Child (>3 months)</option>
|
|
</select>
|
|
</div>
|
|
<div class="calc-field" style="flex:1;min-width:200px;">
|
|
<label>Infection</label>
|
|
<select id="abx-infection">
|
|
<option value="sepsis">Sepsis / bacteremia</option>
|
|
<option value="meningitis">Meningitis</option>
|
|
<option value="pna">Community-acquired pneumonia</option>
|
|
<option value="uti">UTI / pyelonephritis</option>
|
|
<option value="skin">Skin / soft tissue</option>
|
|
<option value="ent">AOM / sinusitis / pharyngitis</option>
|
|
<option value="neutropenic">Febrile neutropenia</option>
|
|
<option value="ic">Intra-abdominal</option>
|
|
<option value="bone">Osteomyelitis / septic arthritis</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<button id="btn-abx-lookup" class="btn-sm btn-primary" style="margin-bottom:12px;"><i class="fas fa-search"></i> Look Up Regimen</button>
|
|
<div id="abx-result"></div>
|
|
</div>
|
|
|
|
<!-- ── BURNS ── -->
|
|
<div id="em-burns" class="em-section" style="display:none;">
|
|
<h4 style="font-size:15px;font-weight:700;color:var(--g800);margin:0 0 4px;">Burn Management</h4>
|
|
<p style="font-size:12px;color:var(--g500);margin:0 0 14px;">TBSA body-parts calculator (Lund-Browder age-adjusted) + Parkland fluid resuscitation. Count only 2nd-degree or deeper.</p>
|
|
<div style="display:flex;gap:12px;flex-wrap:wrap;margin-bottom:12px;">
|
|
<div class="calc-field" style="flex:1;min-width:130px;max-width:180px;">
|
|
<label>Weight (kg)</label>
|
|
<input type="number" id="burn-weight" min="1" max="150" step="0.1" placeholder="e.g. 20">
|
|
</div>
|
|
<div class="calc-field" style="flex:1;min-width:130px;max-width:180px;">
|
|
<label>Age group</label>
|
|
<select id="burn-age">
|
|
<option value="infant">Infant (<1 yr)</option>
|
|
<option value="young" selected>1-5 years</option>
|
|
<option value="child">5-10 years</option>
|
|
<option value="adol">10-15 years</option>
|
|
<option value="adult">>15 / adult</option>
|
|
</select>
|
|
</div>
|
|
<div class="calc-field" style="flex:1;min-width:130px;max-width:180px;">
|
|
<label>Override TBSA %</label>
|
|
<input type="number" id="burn-tbsa" min="0" max="100" step="0.5" placeholder="auto from body parts">
|
|
</div>
|
|
</div>
|
|
<div id="burn-bodyparts-wrapper" style="margin-bottom:12px;"></div>
|
|
<div style="display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:12px;">
|
|
<button id="btn-burn-calc" class="btn-sm btn-primary" type="button"><i class="fas fa-calculator"></i> Calculate Parkland</button>
|
|
<button id="btn-burn-reset" class="btn-sm btn-ghost" type="button">Reset body parts</button>
|
|
<span id="burn-tbsa-live" style="font-size:13px;font-weight:700;color:var(--blue-dark);"></span>
|
|
</div>
|
|
<div id="burn-result"></div>
|
|
</div>
|
|
|
|
<!-- ── TOXICOLOGY ── -->
|
|
<div id="em-toxicology" class="em-section" style="display:none;">
|
|
<h4 style="font-size:15px;font-weight:700;color:var(--g800);margin:0 0 4px;">Toxicology</h4>
|
|
<p style="font-size:12px;color:var(--g500);margin:0 0 14px;">Approach, decontamination, common ingestions with antidotes, dialyzable drugs reference.</p>
|
|
<div style="display:flex;gap:12px;flex-wrap:wrap;margin-bottom:12px;">
|
|
<div class="calc-field" style="flex:1;min-width:140px;max-width:200px;">
|
|
<label>Weight (kg)</label>
|
|
<input type="number" id="tox-weight" min="1" max="150" step="0.1" placeholder="e.g. 20">
|
|
</div>
|
|
<div class="calc-field" style="flex:1;min-width:200px;">
|
|
<label>Topic</label>
|
|
<select id="tox-topic">
|
|
<option value="approach">General approach + decontamination</option>
|
|
<option value="acetaminophen">Acetaminophen</option>
|
|
<option value="opioids">Opioids</option>
|
|
<option value="iron">Iron</option>
|
|
<option value="tca">TCAs</option>
|
|
<option value="bbccb">β-blocker / CCB</option>
|
|
<option value="benzo">Benzodiazepines</option>
|
|
<option value="organo">Organophosphates / carbamates</option>
|
|
<option value="salicylate">Salicylates</option>
|
|
<option value="etoh">Toxic alcohols</option>
|
|
<option value="dialyzable">Dialyzable drugs (ISTUMBLE)</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<button id="btn-tox-lookup" class="btn-sm btn-primary" style="margin-bottom:12px;"><i class="fas fa-search"></i> Look Up</button>
|
|
<div id="tox-result"></div>
|
|
</div>
|
|
|
|
<!-- ── TRAUMA ── -->
|
|
<div id="em-trauma" class="em-section" style="display:none;">
|
|
<h4 style="font-size:15px;font-weight:700;color:var(--g800);margin:0 0 4px;">Trauma</h4>
|
|
<p style="font-size:12px;color:var(--g500);margin:0 0 14px;">Primary / secondary survey, c-spine, massive transfusion, TXA.</p>
|
|
<div class="calc-field" style="max-width:200px;margin-bottom:12px;">
|
|
<label>Weight (kg)</label>
|
|
<input type="number" id="trauma-weight" min="1" max="150" step="0.1" placeholder="e.g. 30">
|
|
</div>
|
|
<button id="btn-trauma-show" class="btn-sm btn-primary" style="margin-bottom:12px;"><i class="fas fa-list"></i> Show Reference</button>
|
|
<div id="trauma-result"></div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- ═══════════ IMAGE LIGHTBOX (reusable, any section can trigger via [data-img-src]) ═══════════ -->
|
|
<div id="img-lightbox" style="display:none;position:fixed;inset:0;background:rgba(0,0,0,0.85);z-index:9999;align-items:center;justify-content:center;padding:20px;flex-direction:column;">
|
|
<div style="display:flex;align-items:center;gap:12px;margin-bottom:10px;color:white;max-width:95%;">
|
|
<div id="img-lightbox-title" style="flex:1;font-weight:600;font-size:14px;"></div>
|
|
<a id="img-lightbox-open" href="#" target="_blank" rel="noopener" style="color:#93c5fd;font-size:13px;text-decoration:none;"><i class="fas fa-up-right-from-square"></i> Open in new tab</a>
|
|
<button id="img-lightbox-close" type="button" style="background:rgba(255,255,255,0.15);color:white;border:none;border-radius:6px;padding:6px 10px;cursor:pointer;font-size:14px;"><i class="fas fa-xmark"></i> Close</button>
|
|
</div>
|
|
<img id="img-lightbox-img" src="" alt="" style="max-width:95%;max-height:85vh;object-fit:contain;border-radius:6px;box-shadow:0 4px 30px rgba(0,0,0,0.5);background:white;">
|
|
</div>
|