1551 lines
69 KiB
HTML
1551 lines
69 KiB
HTML
|
|
|||
|
|
<!DOCTYPE html>
|
|||
|
|
|
|||
|
|
<html lang="en">
|
|||
|
|
<head>
|
|||
|
|
<meta charset="UTF-8">
|
|||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|||
|
|
<title>CKD Dialysis Initiation — Clinical Decision Flow</title>
|
|||
|
|
<link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,600;0,700;1,600&family=Source+Serif+4:wght@300;400;600&family=JetBrains+Mono:wght@400;500;600&display=swap" rel="stylesheet">
|
|||
|
|
<style>
|
|||
|
|
:root {
|
|||
|
|
--bg: #0B0F14;
|
|||
|
|
--surface: #111620;
|
|||
|
|
--surface2: #161D28;
|
|||
|
|
--border: #1E2A38;
|
|||
|
|
--border2: #243040;
|
|||
|
|
|
|||
|
|
--red: #E84040;
|
|||
|
|
--red-dim: rgba(232,64,64,0.12);
|
|||
|
|
--red-glow: rgba(232,64,64,0.25);
|
|||
|
|
|
|||
|
|
--amber: #F0922A;
|
|||
|
|
--amber-dim: rgba(240,146,42,0.12);
|
|||
|
|
|
|||
|
|
--green: #2ECC8A;
|
|||
|
|
--green-dim: rgba(46,204,138,0.12);
|
|||
|
|
--green-glow: rgba(46,204,138,0.2);
|
|||
|
|
|
|||
|
|
--blue: #4A9EE8;
|
|||
|
|
--blue-dim: rgba(74,158,232,0.12);
|
|||
|
|
|
|||
|
|
--violet: #9B72E8;
|
|||
|
|
--violet-dim: rgba(155,114,232,0.12);
|
|||
|
|
|
|||
|
|
--teal: #2EC4B6;
|
|||
|
|
--teal-dim: rgba(46,196,182,0.12);
|
|||
|
|
|
|||
|
|
--text: #C8D6E8;
|
|||
|
|
--text-dim: #6A7D94;
|
|||
|
|
--text-bright: #E8F0FA;
|
|||
|
|
|
|||
|
|
--serif: 'Playfair Display', Georgia, serif;
|
|||
|
|
--body: 'Source Serif 4', serif;
|
|||
|
|
--mono: 'JetBrains Mono', monospace;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
- { box-sizing: border-box; margin: 0; padding: 0; }
|
|||
|
|
html { font-size: 15px; scroll-behavior: smooth; }
|
|||
|
|
|
|||
|
|
body {
|
|||
|
|
background: var(--bg);
|
|||
|
|
color: var(--text);
|
|||
|
|
font-family: var(--body);
|
|||
|
|
min-height: 100vh;
|
|||
|
|
overflow-x: hidden;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ── HEADER ── */
|
|||
|
|
.header {
|
|||
|
|
background: linear-gradient(180deg, #0D1520 0%, var(--bg) 100%);
|
|||
|
|
border-bottom: 1px solid var(--border);
|
|||
|
|
padding: 2.5rem 3rem 2rem;
|
|||
|
|
position: relative;
|
|||
|
|
overflow: hidden;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.header::before {
|
|||
|
|
content: '';
|
|||
|
|
position: absolute; top: 0; left: 0; right: 0; bottom: 0;
|
|||
|
|
background: radial-gradient(ellipse 60% 80% at 80% 50%, rgba(74,158,232,0.06) 0%, transparent 60%);
|
|||
|
|
pointer-events: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.header-badge {
|
|||
|
|
font-family: var(--mono);
|
|||
|
|
font-size: 0.62rem;
|
|||
|
|
letter-spacing: 0.2em;
|
|||
|
|
text-transform: uppercase;
|
|||
|
|
color: var(--blue);
|
|||
|
|
margin-bottom: 0.8rem;
|
|||
|
|
opacity: 0.8;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.header h1 {
|
|||
|
|
font-family: var(--serif);
|
|||
|
|
font-size: 2.4rem;
|
|||
|
|
color: var(--text-bright);
|
|||
|
|
line-height: 1.15;
|
|||
|
|
margin-bottom: 0.6rem;
|
|||
|
|
font-weight: 700;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.header h1 em { font-style: italic; color: var(--blue); }
|
|||
|
|
|
|||
|
|
.header-sub {
|
|||
|
|
font-size: 0.88rem;
|
|||
|
|
color: var(--text-dim);
|
|||
|
|
max-width: 700px;
|
|||
|
|
line-height: 1.65;
|
|||
|
|
margin-bottom: 1.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.guideline-pills {
|
|||
|
|
display: flex; flex-wrap: wrap; gap: 0.5rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.pill {
|
|||
|
|
display: inline-flex; align-items: center; gap: 0.4rem;
|
|||
|
|
padding: 0.28rem 0.75rem;
|
|||
|
|
border-radius: 20px;
|
|||
|
|
font-family: var(--mono);
|
|||
|
|
font-size: 0.62rem;
|
|||
|
|
letter-spacing: 0.06em;
|
|||
|
|
font-weight: 500;
|
|||
|
|
border: 1px solid;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.pill.blue { background: var(--blue-dim); border-color: rgba(74,158,232,0.3); color: var(--blue); }
|
|||
|
|
.pill.green { background: var(--green-dim); border-color: rgba(46,204,138,0.3); color: var(--green); }
|
|||
|
|
.pill.amber { background: var(--amber-dim); border-color: rgba(240,146,42,0.3); color: var(--amber); }
|
|||
|
|
.pill.violet { background: var(--violet-dim); border-color: rgba(155,114,232,0.3); color: var(--violet); }
|
|||
|
|
.pill.red { background: var(--red-dim); border-color: rgba(232,64,64,0.3); color: var(--red); }
|
|||
|
|
|
|||
|
|
/* ── TAB NAV ── */
|
|||
|
|
.tab-nav {
|
|||
|
|
display: flex;
|
|||
|
|
background: var(--surface);
|
|||
|
|
border-bottom: 1px solid var(--border);
|
|||
|
|
overflow-x: auto;
|
|||
|
|
padding: 0 2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.tab-btn {
|
|||
|
|
display: flex; align-items: center; gap: 0.5rem;
|
|||
|
|
padding: 1rem 1.4rem;
|
|||
|
|
font-family: var(--mono);
|
|||
|
|
font-size: 0.7rem;
|
|||
|
|
letter-spacing: 0.06em;
|
|||
|
|
text-transform: uppercase;
|
|||
|
|
color: var(--text-dim);
|
|||
|
|
border: none;
|
|||
|
|
background: none;
|
|||
|
|
cursor: pointer;
|
|||
|
|
border-bottom: 2px solid transparent;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
transition: all 0.2s;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.tab-btn:hover { color: var(--text); }
|
|||
|
|
|
|||
|
|
.tab-btn.active {
|
|||
|
|
color: var(--blue);
|
|||
|
|
border-bottom-color: var(--blue);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.tab-btn .dot {
|
|||
|
|
width: 6px; height: 6px;
|
|||
|
|
border-radius: 50%;
|
|||
|
|
background: currentColor;
|
|||
|
|
opacity: 0.6;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ── PANELS ── */
|
|||
|
|
.panel { display: none; padding: 2rem 3rem 4rem; }
|
|||
|
|
.panel.active { display: block; }
|
|||
|
|
|
|||
|
|
/* ── SECTION HEADER ── */
|
|||
|
|
.sec-head {
|
|||
|
|
margin-bottom: 2rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sec-head h2 {
|
|||
|
|
font-family: var(--serif);
|
|||
|
|
font-size: 1.7rem;
|
|||
|
|
color: var(--text-bright);
|
|||
|
|
font-weight: 600;
|
|||
|
|
line-height: 1.2;
|
|||
|
|
margin-bottom: 0.4rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sec-head p {
|
|||
|
|
font-size: 0.86rem;
|
|||
|
|
color: var(--text-dim);
|
|||
|
|
max-width: 620px;
|
|||
|
|
line-height: 1.6;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ── FLOW DIAGRAM ── */
|
|||
|
|
.flow-container {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
align-items: center;
|
|||
|
|
gap: 0;
|
|||
|
|
max-width: 900px;
|
|||
|
|
margin: 0 auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.flow-node {
|
|||
|
|
width: 100%;
|
|||
|
|
position: relative;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* Node types */
|
|||
|
|
.node-box {
|
|||
|
|
border-radius: 6px;
|
|||
|
|
padding: 1.1rem 1.4rem;
|
|||
|
|
border: 1px solid var(--border2);
|
|||
|
|
background: var(--surface2);
|
|||
|
|
position: relative;
|
|||
|
|
cursor: default;
|
|||
|
|
transition: border-color 0.2s, box-shadow 0.2s;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.node-box:hover {
|
|||
|
|
border-color: var(--blue);
|
|||
|
|
box-shadow: 0 0 0 1px rgba(74,158,232,0.15), 0 4px 20px rgba(0,0,0,0.4);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.node-box.start {
|
|||
|
|
background: linear-gradient(135deg, rgba(74,158,232,0.18) 0%, rgba(74,158,232,0.06) 100%);
|
|||
|
|
border-color: rgba(74,158,232,0.4);
|
|||
|
|
text-align: center;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.node-box.decision {
|
|||
|
|
background: linear-gradient(135deg, rgba(155,114,232,0.14) 0%, rgba(155,114,232,0.04) 100%);
|
|||
|
|
border-color: rgba(155,114,232,0.35);
|
|||
|
|
clip-path: polygon(20px 0, calc(100% - 20px) 0, 100% 50%, calc(100% - 20px) 100%, 20px 100%, 0 50%);
|
|||
|
|
padding: 1.2rem 3rem;
|
|||
|
|
text-align: center;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.node-box.emergency {
|
|||
|
|
background: linear-gradient(135deg, rgba(232,64,64,0.2) 0%, rgba(232,64,64,0.06) 100%);
|
|||
|
|
border-color: rgba(232,64,64,0.45);
|
|||
|
|
border-left: 3px solid var(--red);
|
|||
|
|
box-shadow: 0 0 20px var(--red-glow);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.node-box.action {
|
|||
|
|
background: linear-gradient(135deg, rgba(46,204,138,0.12) 0%, rgba(46,204,138,0.03) 100%);
|
|||
|
|
border-color: rgba(46,204,138,0.3);
|
|||
|
|
border-left: 3px solid var(--green);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.node-box.amber-node {
|
|||
|
|
background: linear-gradient(135deg, rgba(240,146,42,0.14) 0%, rgba(240,146,42,0.04) 100%);
|
|||
|
|
border-color: rgba(240,146,42,0.35);
|
|||
|
|
border-left: 3px solid var(--amber);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.node-box.info-node {
|
|||
|
|
background: var(--surface2);
|
|||
|
|
border-color: var(--border2);
|
|||
|
|
border-left: 3px solid var(--teal);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.node-label {
|
|||
|
|
font-family: var(--mono);
|
|||
|
|
font-size: 0.58rem;
|
|||
|
|
letter-spacing: 0.15em;
|
|||
|
|
text-transform: uppercase;
|
|||
|
|
color: var(--text-dim);
|
|||
|
|
margin-bottom: 0.4rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.node-title {
|
|||
|
|
font-size: 0.95rem;
|
|||
|
|
font-weight: 600;
|
|||
|
|
color: var(--text-bright);
|
|||
|
|
font-family: var(--body);
|
|||
|
|
margin-bottom: 0.25rem;
|
|||
|
|
line-height: 1.35;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.node-desc {
|
|||
|
|
font-size: 0.8rem;
|
|||
|
|
color: var(--text-dim);
|
|||
|
|
line-height: 1.55;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.node-desc strong { color: var(--text); }
|
|||
|
|
|
|||
|
|
.source-tag {
|
|||
|
|
display: inline-flex; align-items: center;
|
|||
|
|
margin-top: 0.5rem;
|
|||
|
|
font-family: var(--mono);
|
|||
|
|
font-size: 0.58rem;
|
|||
|
|
letter-spacing: 0.06em;
|
|||
|
|
color: var(--text-dim);
|
|||
|
|
gap: 0.3rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.source-tag .ref {
|
|||
|
|
padding: 0.1rem 0.4rem;
|
|||
|
|
border-radius: 3px;
|
|||
|
|
background: rgba(255,255,255,0.05);
|
|||
|
|
border: 1px solid var(--border2);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* Arrows */
|
|||
|
|
.arrow {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
align-items: center;
|
|||
|
|
margin: 0.3rem 0;
|
|||
|
|
color: var(--text-dim);
|
|||
|
|
font-size: 0.7rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.arrow-line {
|
|||
|
|
width: 2px;
|
|||
|
|
height: 24px;
|
|||
|
|
background: linear-gradient(180deg, var(--border2), rgba(255,255,255,0.1));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.arrow-head { font-size: 0.9rem; color: var(--border2); margin-top: -4px; }
|
|||
|
|
|
|||
|
|
.arrow-label {
|
|||
|
|
font-family: var(--mono);
|
|||
|
|
font-size: 0.6rem;
|
|||
|
|
color: var(--text-dim);
|
|||
|
|
letter-spacing: 0.08em;
|
|||
|
|
margin: 2px 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* Split flow */
|
|||
|
|
.flow-split {
|
|||
|
|
display: grid;
|
|||
|
|
grid-template-columns: 1fr 1fr;
|
|||
|
|
gap: 1.2rem;
|
|||
|
|
width: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.flow-split-3 {
|
|||
|
|
display: grid;
|
|||
|
|
grid-template-columns: 1fr 1fr 1fr;
|
|||
|
|
gap: 1rem;
|
|||
|
|
width: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.split-label {
|
|||
|
|
font-family: var(--mono);
|
|||
|
|
font-size: 0.6rem;
|
|||
|
|
letter-spacing: 0.12em;
|
|||
|
|
text-transform: uppercase;
|
|||
|
|
text-align: center;
|
|||
|
|
color: var(--text-dim);
|
|||
|
|
margin-bottom: 0.4rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ── CHECKLIST ── */
|
|||
|
|
.checklist-grid {
|
|||
|
|
display: grid;
|
|||
|
|
grid-template-columns: 1fr 1fr;
|
|||
|
|
gap: 1.2rem;
|
|||
|
|
margin-top: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.cl-card {
|
|||
|
|
background: var(--surface2);
|
|||
|
|
border: 1px solid var(--border2);
|
|||
|
|
border-radius: 6px;
|
|||
|
|
overflow: hidden;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.cl-card-head {
|
|||
|
|
padding: 0.8rem 1.1rem;
|
|||
|
|
display: flex; align-items: center; gap: 0.6rem;
|
|||
|
|
border-bottom: 1px solid var(--border);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.cl-card-head .icon {
|
|||
|
|
font-size: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.cl-card-head h4 {
|
|||
|
|
font-family: var(--mono);
|
|||
|
|
font-size: 0.68rem;
|
|||
|
|
letter-spacing: 0.1em;
|
|||
|
|
text-transform: uppercase;
|
|||
|
|
font-weight: 600;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.cl-card-head.blue { background: rgba(74,158,232,0.08); }
|
|||
|
|
.cl-card-head.blue h4 { color: var(--blue); }
|
|||
|
|
.cl-card-head.green { background: rgba(46,204,138,0.08); }
|
|||
|
|
.cl-card-head.green h4 { color: var(--green); }
|
|||
|
|
.cl-card-head.amber { background: rgba(240,146,42,0.08); }
|
|||
|
|
.cl-card-head.amber h4 { color: var(--amber); }
|
|||
|
|
.cl-card-head.red { background: rgba(232,64,64,0.08); }
|
|||
|
|
.cl-card-head.red h4 { color: var(--red); }
|
|||
|
|
.cl-card-head.violet { background: rgba(155,114,232,0.08); }
|
|||
|
|
.cl-card-head.violet h4 { color: var(--violet); }
|
|||
|
|
.cl-card-head.teal { background: rgba(46,196,182,0.08); }
|
|||
|
|
.cl-card-head.teal h4 { color: var(--teal); }
|
|||
|
|
|
|||
|
|
.cl-items { padding: 0.6rem 0; }
|
|||
|
|
|
|||
|
|
.cl-item {
|
|||
|
|
display: flex; align-items: flex-start; gap: 0.6rem;
|
|||
|
|
padding: 0.38rem 1.1rem;
|
|||
|
|
font-size: 0.8rem;
|
|||
|
|
color: var(--text);
|
|||
|
|
line-height: 1.45;
|
|||
|
|
border-bottom: 1px solid rgba(255,255,255,0.03);
|
|||
|
|
cursor: pointer;
|
|||
|
|
transition: background 0.15s;
|
|||
|
|
user-select: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.cl-item:last-child { border-bottom: none; }
|
|||
|
|
.cl-item:hover { background: rgba(255,255,255,0.03); }
|
|||
|
|
|
|||
|
|
.cl-check {
|
|||
|
|
width: 14px; height: 14px;
|
|||
|
|
border: 1.5px solid var(--border2);
|
|||
|
|
border-radius: 3px;
|
|||
|
|
flex-shrink: 0;
|
|||
|
|
margin-top: 1px;
|
|||
|
|
display: flex; align-items: center; justify-content: center;
|
|||
|
|
font-size: 0.6rem;
|
|||
|
|
transition: all 0.15s;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.cl-item.checked .cl-check {
|
|||
|
|
background: var(--green);
|
|||
|
|
border-color: var(--green);
|
|||
|
|
color: #000;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.cl-item .cl-text { flex: 1; }
|
|||
|
|
.cl-item .cl-sub { font-size: 0.7rem; color: var(--text-dim); display: block; }
|
|||
|
|
|
|||
|
|
.cl-item .threshold {
|
|||
|
|
font-family: var(--mono);
|
|||
|
|
font-size: 0.65rem;
|
|||
|
|
color: var(--amber);
|
|||
|
|
white-space: nowrap;
|
|||
|
|
flex-shrink: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ── MEDICATION TABLE ── */
|
|||
|
|
.med-table-wrap {
|
|||
|
|
overflow-x: auto;
|
|||
|
|
margin: 1rem 0;
|
|||
|
|
border: 1px solid var(--border);
|
|||
|
|
border-radius: 6px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.med-table {
|
|||
|
|
width: 100%;
|
|||
|
|
border-collapse: collapse;
|
|||
|
|
font-size: 0.8rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.med-table th {
|
|||
|
|
background: var(--surface2);
|
|||
|
|
color: var(--text-dim);
|
|||
|
|
font-family: var(--mono);
|
|||
|
|
font-size: 0.62rem;
|
|||
|
|
letter-spacing: 0.1em;
|
|||
|
|
text-transform: uppercase;
|
|||
|
|
font-weight: 600;
|
|||
|
|
padding: 0.7rem 0.9rem;
|
|||
|
|
text-align: left;
|
|||
|
|
border-bottom: 1px solid var(--border2);
|
|||
|
|
white-space: nowrap;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.med-table td {
|
|||
|
|
padding: 0.6rem 0.9rem;
|
|||
|
|
border-bottom: 1px solid rgba(255,255,255,0.04);
|
|||
|
|
color: var(--text);
|
|||
|
|
vertical-align: top;
|
|||
|
|
line-height: 1.45;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.med-table tr:hover td { background: rgba(255,255,255,0.02); }
|
|||
|
|
.med-table tr:last-child td { border-bottom: none; }
|
|||
|
|
|
|||
|
|
.risk-badge {
|
|||
|
|
display: inline-block;
|
|||
|
|
padding: 0.12rem 0.45rem;
|
|||
|
|
border-radius: 3px;
|
|||
|
|
font-family: var(--mono);
|
|||
|
|
font-size: 0.6rem;
|
|||
|
|
font-weight: 600;
|
|||
|
|
letter-spacing: 0.05em;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.risk-badge.stop { background: var(--red-dim); color: var(--red); border: 1px solid rgba(232,64,64,0.3); }
|
|||
|
|
.risk-badge.caution { background: var(--amber-dim); color: var(--amber); border: 1px solid rgba(240,146,42,0.3); }
|
|||
|
|
.risk-badge.reduce { background: var(--violet-dim); color: var(--violet); border: 1px solid rgba(155,114,232,0.3); }
|
|||
|
|
.risk-badge.monitor { background: var(--blue-dim); color: var(--blue); border: 1px solid rgba(74,158,232,0.3); }
|
|||
|
|
.risk-badge.continue { background: var(--green-dim); color: var(--green); border: 1px solid rgba(46,204,138,0.3); }
|
|||
|
|
|
|||
|
|
/* ── DDX ── */
|
|||
|
|
.ddx-grid {
|
|||
|
|
display: grid;
|
|||
|
|
grid-template-columns: 1fr 1fr;
|
|||
|
|
gap: 1rem;
|
|||
|
|
margin-top: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.ddx-card {
|
|||
|
|
background: var(--surface2);
|
|||
|
|
border: 1px solid var(--border2);
|
|||
|
|
border-radius: 6px;
|
|||
|
|
overflow: hidden;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.ddx-head {
|
|||
|
|
padding: 0.75rem 1rem;
|
|||
|
|
display: flex; align-items: center; justify-content: space-between;
|
|||
|
|
border-bottom: 1px solid var(--border);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.ddx-head h4 {
|
|||
|
|
font-size: 0.85rem;
|
|||
|
|
font-weight: 600;
|
|||
|
|
color: var(--text-bright);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.prob-bar-wrap {
|
|||
|
|
display: flex; align-items: center; gap: 0.6rem;
|
|||
|
|
padding: 0.65rem 1rem;
|
|||
|
|
border-bottom: 1px solid rgba(255,255,255,0.03);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.prob-bar-wrap:last-child { border-bottom: none; }
|
|||
|
|
|
|||
|
|
.prob-name {
|
|||
|
|
font-size: 0.78rem;
|
|||
|
|
color: var(--text);
|
|||
|
|
min-width: 160px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.prob-bar {
|
|||
|
|
flex: 1; height: 5px;
|
|||
|
|
background: rgba(255,255,255,0.06);
|
|||
|
|
border-radius: 3px;
|
|||
|
|
overflow: hidden;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.prob-fill {
|
|||
|
|
height: 100%;
|
|||
|
|
border-radius: 3px;
|
|||
|
|
transition: width 0.6s ease;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.prob-pct {
|
|||
|
|
font-family: var(--mono);
|
|||
|
|
font-size: 0.65rem;
|
|||
|
|
color: var(--text-dim);
|
|||
|
|
min-width: 32px;
|
|||
|
|
text-align: right;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ── CALLOUT ── */
|
|||
|
|
.callout {
|
|||
|
|
padding: 0.9rem 1.1rem;
|
|||
|
|
border-radius: 5px;
|
|||
|
|
margin: 1rem 0;
|
|||
|
|
font-size: 0.82rem;
|
|||
|
|
line-height: 1.6;
|
|||
|
|
border-left: 3px solid;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.callout-label {
|
|||
|
|
font-family: var(--mono);
|
|||
|
|
font-size: 0.6rem;
|
|||
|
|
letter-spacing: 0.15em;
|
|||
|
|
text-transform: uppercase;
|
|||
|
|
font-weight: 600;
|
|||
|
|
margin-bottom: 0.35rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.callout.urgent { background: var(--red-dim); border-color: var(--red); color: #f0a0a0; }
|
|||
|
|
.callout.urgent .callout-label { color: var(--red); }
|
|||
|
|
.callout.info { background: var(--blue-dim); border-color: var(--blue); color: #a0c8f0; }
|
|||
|
|
.callout.info .callout-label { color: var(--blue); }
|
|||
|
|
.callout.success-c { background: var(--green-dim); border-color: var(--green); color: #90e0b8; }
|
|||
|
|
.callout.success-c .callout-label { color: var(--green); }
|
|||
|
|
.callout.warn { background: var(--amber-dim); border-color: var(--amber); color: #f0c878; }
|
|||
|
|
.callout.warn .callout-label { color: var(--amber); }
|
|||
|
|
|
|||
|
|
/* ── EVIDENCE GRADE ── */
|
|||
|
|
.grade {
|
|||
|
|
display: inline-flex; align-items: center;
|
|||
|
|
padding: 0.1rem 0.4rem;
|
|||
|
|
border-radius: 3px;
|
|||
|
|
font-family: var(--mono);
|
|||
|
|
font-size: 0.6rem;
|
|||
|
|
font-weight: 600;
|
|||
|
|
letter-spacing: 0.05em;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.grade.1A { background: rgba(46,204,138,0.15); color: var(--green); }
|
|||
|
|
.grade.1B { background: rgba(74,158,232,0.15); color: var(--blue); }
|
|||
|
|
.grade.2B { background: rgba(240,146,42,0.15); color: var(--amber); }
|
|||
|
|
.grade.2C { background: rgba(155,114,232,0.15); color: var(--violet); }
|
|||
|
|
|
|||
|
|
/* ── VASCULAR ACCESS ── */
|
|||
|
|
.va-timeline {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
gap: 0;
|
|||
|
|
margin: 1rem 0;
|
|||
|
|
max-width: 800px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.va-step {
|
|||
|
|
display: flex;
|
|||
|
|
gap: 1.2rem;
|
|||
|
|
padding-bottom: 1.5rem;
|
|||
|
|
position: relative;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.va-step::before {
|
|||
|
|
content: '';
|
|||
|
|
position: absolute;
|
|||
|
|
left: 15px; top: 32px;
|
|||
|
|
bottom: 0;
|
|||
|
|
width: 2px;
|
|||
|
|
background: var(--border2);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.va-step:last-child::before { display: none; }
|
|||
|
|
|
|||
|
|
.va-dot {
|
|||
|
|
width: 32px; height: 32px;
|
|||
|
|
border-radius: 50%;
|
|||
|
|
border: 2px solid;
|
|||
|
|
display: flex; align-items: center; justify-content: center;
|
|||
|
|
font-family: var(--mono);
|
|||
|
|
font-size: 0.65rem;
|
|||
|
|
font-weight: 700;
|
|||
|
|
flex-shrink: 0;
|
|||
|
|
position: relative; z-index: 1;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.va-dot.avf { background: rgba(46,204,138,0.1); border-color: var(--green); color: var(--green); }
|
|||
|
|
.va-dot.avg { background: rgba(240,146,42,0.1); border-color: var(--amber); color: var(--amber); }
|
|||
|
|
.va-dot.cvc { background: rgba(232,64,64,0.1); border-color: var(--red); color: var(--red); }
|
|||
|
|
.va-dot.pd { background: rgba(74,158,232,0.1); border-color: var(--blue); color: var(--blue); }
|
|||
|
|
|
|||
|
|
.va-content { flex: 1; padding-top: 4px; }
|
|||
|
|
.va-content h4 { font-size: 0.9rem; font-weight: 600; color: var(--text-bright); margin-bottom: 0.25rem; }
|
|||
|
|
.va-content p { font-size: 0.8rem; color: var(--text-dim); line-height: 1.55; }
|
|||
|
|
.va-content .timing { font-family: var(--mono); font-size: 0.65rem; color: var(--amber); margin-top: 0.3rem; }
|
|||
|
|
|
|||
|
|
/* ── PROGRESS ── */
|
|||
|
|
.progress-row {
|
|||
|
|
display: flex; gap: 0.4rem;
|
|||
|
|
margin-bottom: 0.8rem;
|
|||
|
|
align-items: center;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.progress-label {
|
|||
|
|
font-family: var(--mono);
|
|||
|
|
font-size: 0.6rem;
|
|||
|
|
color: var(--text-dim);
|
|||
|
|
min-width: 80px;
|
|||
|
|
text-align: right;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ── INTERACTIVE eGFR calc ── */
|
|||
|
|
.calc-section {
|
|||
|
|
background: var(--surface2);
|
|||
|
|
border: 1px solid var(--border2);
|
|||
|
|
border-radius: 6px;
|
|||
|
|
padding: 1.4rem;
|
|||
|
|
margin: 1.5rem 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.calc-title {
|
|||
|
|
font-family: var(--mono);
|
|||
|
|
font-size: 0.65rem;
|
|||
|
|
letter-spacing: 0.15em;
|
|||
|
|
text-transform: uppercase;
|
|||
|
|
color: var(--teal);
|
|||
|
|
margin-bottom: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.calc-grid {
|
|||
|
|
display: grid;
|
|||
|
|
grid-template-columns: repeat(4, 1fr);
|
|||
|
|
gap: 0.8rem;
|
|||
|
|
margin-bottom: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.calc-field label {
|
|||
|
|
display: block;
|
|||
|
|
font-family: var(--mono);
|
|||
|
|
font-size: 0.6rem;
|
|||
|
|
color: var(--text-dim);
|
|||
|
|
letter-spacing: 0.1em;
|
|||
|
|
text-transform: uppercase;
|
|||
|
|
margin-bottom: 0.3rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.calc-field input, .calc-field select {
|
|||
|
|
width: 100%;
|
|||
|
|
background: var(--bg);
|
|||
|
|
border: 1px solid var(--border2);
|
|||
|
|
border-radius: 4px;
|
|||
|
|
padding: 0.5rem 0.7rem;
|
|||
|
|
font-family: var(--mono);
|
|||
|
|
font-size: 0.8rem;
|
|||
|
|
color: var(--text-bright);
|
|||
|
|
outline: none;
|
|||
|
|
transition: border-color 0.2s;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.calc-field input:focus, .calc-field select:focus {
|
|||
|
|
border-color: var(--blue);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.calc-field select option { background: var(--bg); }
|
|||
|
|
|
|||
|
|
.calc-btn {
|
|||
|
|
background: linear-gradient(135deg, rgba(74,158,232,0.3), rgba(74,158,232,0.1));
|
|||
|
|
border: 1px solid rgba(74,158,232,0.4);
|
|||
|
|
color: var(--blue);
|
|||
|
|
padding: 0.6rem 1.4rem;
|
|||
|
|
border-radius: 4px;
|
|||
|
|
font-family: var(--mono);
|
|||
|
|
font-size: 0.72rem;
|
|||
|
|
letter-spacing: 0.08em;
|
|||
|
|
text-transform: uppercase;
|
|||
|
|
cursor: pointer;
|
|||
|
|
transition: all 0.2s;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.calc-btn:hover {
|
|||
|
|
background: linear-gradient(135deg, rgba(74,158,232,0.4), rgba(74,158,232,0.15));
|
|||
|
|
box-shadow: 0 0 12px rgba(74,158,232,0.2);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.calc-result {
|
|||
|
|
display: none;
|
|||
|
|
margin-top: 1rem;
|
|||
|
|
padding: 1rem;
|
|||
|
|
background: var(--bg);
|
|||
|
|
border-radius: 5px;
|
|||
|
|
border: 1px solid var(--border2);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.calc-result.show { display: block; }
|
|||
|
|
|
|||
|
|
.egfr-value {
|
|||
|
|
font-family: var(--serif);
|
|||
|
|
font-size: 2.4rem;
|
|||
|
|
line-height: 1;
|
|||
|
|
margin-bottom: 0.3rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.egfr-unit {
|
|||
|
|
font-family: var(--mono);
|
|||
|
|
font-size: 0.7rem;
|
|||
|
|
color: var(--text-dim);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.ckd-stage-bar {
|
|||
|
|
display: grid;
|
|||
|
|
grid-template-columns: repeat(5, 1fr);
|
|||
|
|
gap: 2px;
|
|||
|
|
margin: 0.8rem 0;
|
|||
|
|
border-radius: 4px;
|
|||
|
|
overflow: hidden;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.stage-seg {
|
|||
|
|
padding: 0.35rem 0;
|
|||
|
|
text-align: center;
|
|||
|
|
font-family: var(--mono);
|
|||
|
|
font-size: 0.58rem;
|
|||
|
|
font-weight: 600;
|
|||
|
|
letter-spacing: 0.04em;
|
|||
|
|
transition: opacity 0.3s;
|
|||
|
|
opacity: 0.3;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.stage-seg.active { opacity: 1; }
|
|||
|
|
.stage-seg.g1 { background: rgba(46,204,138,0.3); color: var(--green); }
|
|||
|
|
.stage-seg.g2 { background: rgba(74,158,232,0.3); color: var(--blue); }
|
|||
|
|
.stage-seg.g3 { background: rgba(240,146,42,0.3); color: var(--amber); }
|
|||
|
|
.stage-seg.g4 { background: rgba(232,64,64,0.25); color: #f07060; }
|
|||
|
|
.stage-seg.g5 { background: rgba(232,64,64,0.45); color: var(--red); }
|
|||
|
|
|
|||
|
|
/* ── RESPONSIVE ── */
|
|||
|
|
@media (max-width: 760px) {
|
|||
|
|
.header { padding: 1.5rem; }
|
|||
|
|
.header h1 { font-size: 1.6rem; }
|
|||
|
|
.panel { padding: 1.5rem; }
|
|||
|
|
.checklist-grid, .ddx-grid { grid-template-columns: 1fr; }
|
|||
|
|
.flow-split, .flow-split-3 { grid-template-columns: 1fr; }
|
|||
|
|
.calc-grid { grid-template-columns: 1fr 1fr; }
|
|||
|
|
.tab-nav { padding: 0 0.5rem; }
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* ── FADE IN ── */
|
|||
|
|
@keyframes fadeUp {
|
|||
|
|
from { opacity: 0; transform: translateY(12px); }
|
|||
|
|
to { opacity: 1; transform: none; }
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.panel.active > * {
|
|||
|
|
animation: fadeUp 0.4s ease both;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.panel.active > *:nth-child(2) { animation-delay: 0.06s; }
|
|||
|
|
.panel.active > *:nth-child(3) { animation-delay: 0.12s; }
|
|||
|
|
.panel.active > *:nth-child(4) { animation-delay: 0.18s; }
|
|||
|
|
</style>
|
|||
|
|
|
|||
|
|
</head>
|
|||
|
|
<body>
|
|||
|
|
|
|||
|
|
<!-- HEADER -->
|
|||
|
|
|
|||
|
|
<div class="header">
|
|||
|
|
<div class="header-badge">Agentic AI RAG · Clinical Decision Flow · Nephrology</div>
|
|||
|
|
<h1>CKD Dialysis Initiation<br><em>Decision Framework</em></h1>
|
|||
|
|
<p class="header-sub">Evidence-based clinical decision support integrating KDIGO 2022, ERA-EDTA 2023, IDEAL Trial, and KDOQI Vascular Access guidelines with pre-dialysis workup, medication safety, and differential diagnosis modules.</p>
|
|||
|
|
<div class="guideline-pills">
|
|||
|
|
<span class="pill blue">● KDIGO 2022 Update</span>
|
|||
|
|
<span class="pill green">● ERA-EDTA 2023</span>
|
|||
|
|
<span class="pill amber">● IDEAL Trial</span>
|
|||
|
|
<span class="pill violet">● KDOQI Vascular Access 2019</span>
|
|||
|
|
<span class="pill red">● Emergency Criteria</span>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<!-- TAB NAV -->
|
|||
|
|
|
|||
|
|
<div class="tab-nav">
|
|||
|
|
<button class="tab-btn active" onclick="switchTab('flow', this)"><span class="dot"></span>Decision Flow</button>
|
|||
|
|
<button class="tab-btn" onclick="switchTab('checklist', this)"><span class="dot"></span>Pre-Dialysis Checklist</button>
|
|||
|
|
<button class="tab-btn" onclick="switchTab('medications', this)"><span class="dot"></span>Medication Safety</button>
|
|||
|
|
<button class="tab-btn" onclick="switchTab('ddx', this)"><span class="dot"></span>Differential Diagnosis</button>
|
|||
|
|
<button class="tab-btn" onclick="switchTab('access', this)"><span class="dot"></span>Vascular Access</button>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<!-- ══════════════════════════════════════════════
|
|||
|
|
TAB 1 — DECISION FLOW
|
|||
|
|
═══════════════════════════════════════════════ -->
|
|||
|
|
|
|||
|
|
<div id="tab-flow" class="panel active">
|
|||
|
|
<div class="sec-head">
|
|||
|
|
<h2>Dialysis Initiation Decision Flow</h2>
|
|||
|
|
<p>Step-by-step clinical pathway from CKD staging to modality selection, grounded in KDIGO 2022 and ERA-EDTA 2023. Includes IDEAL Trial evidence for timing of elective initiation.</p>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<!-- eGFR CALCULATOR -->
|
|||
|
|
|
|||
|
|
<div class="calc-section">
|
|||
|
|
<div class="calc-title">⚙ CKD-EPI 2021 eGFR Calculator (Race-Free Equation)</div>
|
|||
|
|
<div class="calc-grid">
|
|||
|
|
<div class="calc-field">
|
|||
|
|
<label>Serum Creatinine (mg/dL)</label>
|
|||
|
|
<input type="number" id="cr" placeholder="e.g. 3.8" step="0.1" min="0.1">
|
|||
|
|
</div>
|
|||
|
|
<div class="calc-field">
|
|||
|
|
<label>Age (years)</label>
|
|||
|
|
<input type="number" id="age" placeholder="e.g. 65" min="18" max="120">
|
|||
|
|
</div>
|
|||
|
|
<div class="calc-field">
|
|||
|
|
<label>Sex Assigned at Birth</label>
|
|||
|
|
<select id="sex">
|
|||
|
|
<option value="male">Male</option>
|
|||
|
|
<option value="female">Female</option>
|
|||
|
|
</select>
|
|||
|
|
</div>
|
|||
|
|
<div class="calc-field">
|
|||
|
|
<label>Cystatin C (mg/L) — optional</label>
|
|||
|
|
<input type="number" id="cystc" placeholder="e.g. 1.8" step="0.01" min="0.1">
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<button class="calc-btn" onclick="calcEGFR()">Calculate eGFR → Stage CKD</button>
|
|||
|
|
<div class="calc-result" id="calc-result">
|
|||
|
|
<div style="display:flex; align-items:baseline; gap:0.5rem; margin-bottom:0.5rem;">
|
|||
|
|
<div class="egfr-value" id="egfr-val">—</div>
|
|||
|
|
<div class="egfr-unit">mL/min/1.73 m²</div>
|
|||
|
|
<div id="stage-label" style="margin-left:0.5rem; font-family:var(--mono); font-size:0.75rem; color:var(--text-dim);"></div>
|
|||
|
|
</div>
|
|||
|
|
<div class="ckd-stage-bar">
|
|||
|
|
<div class="stage-seg g1" id="seg-g1">G1 ≥90</div>
|
|||
|
|
<div class="stage-seg g2" id="seg-g2">G2 60–89</div>
|
|||
|
|
<div class="stage-seg g3" id="seg-g3">G3 30–59</div>
|
|||
|
|
<div class="stage-seg g4" id="seg-g4">G4 15–29</div>
|
|||
|
|
<div class="stage-seg g5" id="seg-g5">G5 <15</div>
|
|||
|
|
</div>
|
|||
|
|
<div id="egfr-recommendation" style="font-size:0.82rem; color:var(--text-dim); margin-top:0.5rem; line-height:1.6;"></div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="flow-container">
|
|||
|
|
|
|||
|
|
```
|
|||
|
|
<!-- Step 1 -->
|
|||
|
|
<div class="flow-node">
|
|||
|
|
<div class="node-box start">
|
|||
|
|
<div class="node-label">Entry Point</div>
|
|||
|
|
<div class="node-title">CKD Patient Assessment — Staging & Trajectory</div>
|
|||
|
|
<div class="node-desc">Determine CKD stage using <strong>CKD-EPI 2021 eGFR</strong> (race-free) + urine ACR. Assess trajectory: rate of eGFR decline over ≥3 months. Document modifying factors: diabetes, hypertension, proteinuria, AKI history.</div>
|
|||
|
|
<div class="source-tag"><span class="ref">KDIGO 2022 §2.1</span> <span class="ref">CKD-EPI 2021 — Inker et al. NEJM</span></div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="arrow"><div class="arrow-line"></div><div class="arrow-label">KDIGO Staging →</div><div class="arrow-head">▼</div></div>
|
|||
|
|
|
|||
|
|
<!-- Step 2: Emergency Check -->
|
|||
|
|
<div class="flow-node">
|
|||
|
|
<div class="node-box emergency">
|
|||
|
|
<div class="node-label">⚡ Emergency Screen — KDIGO 2022 §4 + ERA-EDTA 2023</div>
|
|||
|
|
<div class="node-title">Absolute Indications for Urgent Dialysis Initiation</div>
|
|||
|
|
<div class="node-desc">
|
|||
|
|
Screen for any of the following — presence of <strong>any one criterion</strong> mandates immediate initiation regardless of eGFR:
|
|||
|
|
<br><br>
|
|||
|
|
<strong style="color:var(--red);">U</strong>raemia symptomatic: encephalopathy, seizures, pericarditis, uremic bleeding |
|
|||
|
|
<strong style="color:var(--red);">A</strong>cidosis: pH <7.1 or HCO₃⁻ <12 mEq/L refractory to medical Rx |
|
|||
|
|
<strong style="color:var(--red);">E</strong>lectrolyte: K⁺ >6.5 mEq/L or EKG changes |
|
|||
|
|
<strong style="color:var(--red);">O</strong>verload: pulmonary oedema refractory to diuretics |
|
|||
|
|
<strong style="color:var(--red);">I</strong>ntoxication: dialysable toxin (methanol, lithium, salicylate)
|
|||
|
|
</div>
|
|||
|
|
<div class="source-tag"><span class="ref">KDIGO 2022 Emergency Triggers</span> <span class="ref">ERA-EDTA 2023 §3.2</span></div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="arrow">
|
|||
|
|
<div class="arrow-line"></div>
|
|||
|
|
<div class="arrow-label">If NO emergency criteria →</div>
|
|||
|
|
<div class="arrow-head">▼</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<!-- Step 3: eGFR threshold -->
|
|||
|
|
<div class="flow-node">
|
|||
|
|
<div class="node-box decision">
|
|||
|
|
<div class="node-label">Decision Node</div>
|
|||
|
|
<div class="node-title">Is eGFR ≤ 15 mL/min/1.73 m² OR rapid decline (>5 mL/min/yr)?</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="flow-split" style="margin:0.8rem 0;">
|
|||
|
|
<div>
|
|||
|
|
<div class="split-label" style="color:var(--green);">YES — Initiation Zone</div>
|
|||
|
|
<div class="node-box action">
|
|||
|
|
<div class="node-label">KDIGO G5 / Pre-ESRD</div>
|
|||
|
|
<div class="node-title">Proceed to Elective Dialysis Planning</div>
|
|||
|
|
<div class="node-desc">IDEAL Trial: <strong>no survival benefit</strong> to early initiation (eGFR 10–14) vs. late (eGFR 5–7). Initiate based on symptoms + clinical judgement, not eGFR alone. Target: symptom burden, nutritional status, volume status.</div>
|
|||
|
|
<div class="source-tag"><span class="ref">IDEAL Trial — Cooper et al. NEJM 2010</span> <span class="ref">ERA-EDTA 2023 §4.1</span></div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div>
|
|||
|
|
<div class="split-label" style="color:var(--amber);">NO — Monitoring Zone</div>
|
|||
|
|
<div class="node-box amber-node">
|
|||
|
|
<div class="node-label">CKD G3b–G4</div>
|
|||
|
|
<div class="node-title">Optimise Conservative Management + Prepare</div>
|
|||
|
|
<div class="node-desc">Intensify CKD retardation: RAAS blockade, SGLT2i (if eGFR >20), blood pressure to <130/80 mmHg. Refer to nephrology if not already. Begin patient education on RRT modalities. Nephrology referral: eGFR <30 or rapid decline.</div>
|
|||
|
|
<div class="source-tag"><span class="ref">DAPA-CKD — Heerspink NEJM 2020</span> <span class="ref">KDIGO 2022 §5</span></div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="arrow"><div class="arrow-line"></div><div class="arrow-label">Elective initiation path →</div><div class="arrow-head">▼</div></div>
|
|||
|
|
|
|||
|
|
<!-- Step 4: Symptoms -->
|
|||
|
|
<div class="flow-node">
|
|||
|
|
<div class="node-box decision">
|
|||
|
|
<div class="node-label">Symptom Assessment — IDEAL Trial Criteria</div>
|
|||
|
|
<div class="node-title">Symptomatic uraemia OR clinical deterioration despite optimised conservative Rx?</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="flow-split" style="margin:0.8rem 0;">
|
|||
|
|
<div>
|
|||
|
|
<div class="split-label" style="color:var(--red);">YES — Initiate</div>
|
|||
|
|
<div class="node-box emergency" style="box-shadow:none;">
|
|||
|
|
<div class="node-label">Symptom-Driven Initiation</div>
|
|||
|
|
<div class="node-title">Symptoms mandating initiation</div>
|
|||
|
|
<div class="node-desc">
|
|||
|
|
<strong>Uraemic symptoms:</strong> nausea, vomiting, anorexia, weight loss, pruritus, encephalopathy |
|
|||
|
|
<strong>Volume:</strong> resistant oedema, cardiac decompensation |
|
|||
|
|
<strong>Metabolic:</strong> progressive acidosis, hyperkalaemia unresponsive to medical Rx |
|
|||
|
|
<strong>Nutritional:</strong> unintentional weight loss >10%, serum albumin <3.5 g/dL
|
|||
|
|
</div>
|
|||
|
|
<div class="source-tag"><span class="ref">IDEAL Trial — Cooper 2010</span> <span class="ref">KDIGO 2022 §4.2</span></div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div>
|
|||
|
|
<div class="split-label" style="color:var(--green);">NO — Continue Conservative</div>
|
|||
|
|
<div class="node-box action">
|
|||
|
|
<div class="node-label">Pre-emptive Planning</div>
|
|||
|
|
<div class="node-title">Watchful Waiting with 4–8 weekly review</div>
|
|||
|
|
<div class="node-desc">Continue CKD management. Monitor eGFR, electrolytes, nutritional parameters monthly. Initiate vascular access planning if eGFR <20 (see Vascular Access tab). Patient choice and shared decision-making is central. Consider peritoneal dialysis or home HD.</div>
|
|||
|
|
<div class="source-tag"><span class="ref">ERA-EDTA 2023 §4.3</span></div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="arrow"><div class="arrow-line"></div><div class="arrow-label">Initiating → Modality Selection</div><div class="arrow-head">▼</div></div>
|
|||
|
|
|
|||
|
|
<!-- Step 5: Modality -->
|
|||
|
|
<div class="flow-node">
|
|||
|
|
<div class="node-box info-node">
|
|||
|
|
<div class="node-label">Modality Selection — Shared Decision Making</div>
|
|||
|
|
<div class="node-title">Select RRT Modality Based on Clinical + Patient Factors</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="flow-split-3" style="margin:0.8rem 0;">
|
|||
|
|
<div class="node-box action">
|
|||
|
|
<div class="node-label" style="color:var(--green);">Preferred (If feasible)</div>
|
|||
|
|
<div class="node-title">Haemodialysis (HD)</div>
|
|||
|
|
<div class="node-desc">In-centre or home HD. Requires AVF (preferred) or AVG. <strong>Avoid CVC</strong> for long-term HD — associated with ×3 higher infection risk and mortality. Initiate AVF referral ≥6 months before anticipated start.</div>
|
|||
|
|
<div class="source-tag"><span class="ref">KDOQI VA 2019</span> <span class="ref">ERA-EDTA 2023</span></div>
|
|||
|
|
</div>
|
|||
|
|
<div class="node-box amber-node">
|
|||
|
|
<div class="node-label" style="color:var(--amber);">Patient-Centred Choice</div>
|
|||
|
|
<div class="node-title">Peritoneal Dialysis (PD)</div>
|
|||
|
|
<div class="node-desc">Home-based. CAPD or APD. Preferred in: preserved residual renal function, young patients, remote geography, diabetic patients. Contraindicated: abdominal adhesions, hernia, no caregiver support.</div>
|
|||
|
|
<div class="source-tag"><span class="ref">KDIGO 2022 §5.1</span></div>
|
|||
|
|
</div>
|
|||
|
|
<div class="node-box" style="border-left:3px solid var(--violet);">
|
|||
|
|
<div class="node-label" style="color:var(--violet);">Acute/Bridge</div>
|
|||
|
|
<div class="node-title">CRRT / SLED</div>
|
|||
|
|
<div class="node-desc">For haemodynamically unstable patients in ICU. CRRT preferred over IHD in AKI-on-CKD with vasopressor dependency. SLED as intermediate modality. Transition to IHD when stable.</div>
|
|||
|
|
<div class="source-tag"><span class="ref">KDIGO AKI 2012 §5.3</span></div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
</div><!-- /flow-container -->
|
|||
|
|
|
|||
|
|
<div class="callout warn" style="margin-top:2rem;">
|
|||
|
|
<div class="callout-label">IDEAL Trial Key Finding</div>
|
|||
|
|
The IDEAL RCT (n=828, Cooper et al. NEJM 2010) found <strong>no significant difference</strong> in survival or quality of life between early (eGFR 10–14) vs. late (eGFR 5–7) initiation of dialysis. The current recommendation is symptom-guided initiation, avoiding automatic eGFR-based triggers for elective dialysis start.
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<!-- ══════════════════════════════════════════════
|
|||
|
|
TAB 2 — PRE-DIALYSIS CHECKLIST
|
|||
|
|
═══════════════════════════════════════════════ -->
|
|||
|
|
|
|||
|
|
<div id="tab-checklist" class="panel">
|
|||
|
|
<div class="sec-head">
|
|||
|
|
<h2>Pre-Dialysis Workup Checklist</h2>
|
|||
|
|
<p>Comprehensive investigations and interventions required before dialysis initiation. Click items to mark as completed. Adapted from KDIGO 2022 pre-dialysis care standards and ERA-EDTA 2023.</p>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="callout urgent">
|
|||
|
|
<div class="callout-label">Emergency — Complete within 4 hours if urgent dialysis</div>
|
|||
|
|
U&E, VBG/ABG, 12-lead ECG, portable CXR, bedside weight, IV access × 2, anaesthesia/critical care alert if HD planned emergently.
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="checklist-grid">
|
|||
|
|
|
|||
|
|
```
|
|||
|
|
<!-- HAEMATOLOGY -->
|
|||
|
|
<div class="cl-card">
|
|||
|
|
<div class="cl-card-head blue"><span class="icon">🔬</span><h4>Haematology & Iron Studies</h4></div>
|
|||
|
|
<div class="cl-items">
|
|||
|
|
<div class="cl-item" onclick="toggle(this)"><div class="cl-check">✓</div><div class="cl-text">FBC / CBC with differential<span class="cl-sub">Anaemia of CKD staging; baseline pre-ESA</span></div><div class="threshold">Hb target 10–12 g/dL</div></div>
|
|||
|
|
<div class="cl-item" onclick="toggle(this)"><div class="cl-check">✓</div><div class="cl-text">Serum Ferritin & Transferrin Saturation<span class="cl-sub">Iron deficiency screen before ESA therapy</span></div><div class="threshold">Ferritin >200; TSAT >20%</div></div>
|
|||
|
|
<div class="cl-item" onclick="toggle(this)"><div class="cl-check">✓</div><div class="cl-text">Reticulocyte count & reticulocyte Hb<span class="cl-sub">Functional iron deficiency assessment</span></div></div>
|
|||
|
|
<div class="cl-item" onclick="toggle(this)"><div class="cl-check">✓</div><div class="cl-text">Blood film morphology<span class="cl-sub">Exclude haemolysis, microangiopathy</span></div></div>
|
|||
|
|
<div class="cl-item" onclick="toggle(this)"><div class="cl-check">✓</div><div class="cl-text">Coagulation — PT, APTT, fibrinogen<span class="cl-sub">Baseline before AV fistula creation or CVC insertion</span></div></div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<!-- BIOCHEMISTRY -->
|
|||
|
|
<div class="cl-card">
|
|||
|
|
<div class="cl-card-head amber"><span class="icon">⚗️</span><h4>Biochemistry & Electrolytes</h4></div>
|
|||
|
|
<div class="cl-items">
|
|||
|
|
<div class="cl-item" onclick="toggle(this)"><div class="cl-check">✓</div><div class="cl-text">U&E: Na, K, Cl, HCO₃, Urea, Creatinine<span class="cl-sub">eGFR (CKD-EPI 2021), acidosis assessment</span></div><div class="threshold">K⁺ >5.5 = urgent</div></div>
|
|||
|
|
<div class="cl-item" onclick="toggle(this)"><div class="cl-check">✓</div><div class="cl-text">Venous blood gas (VBG)<span class="cl-sub">pH, pCO₂, HCO₃, lactate — metabolic acidosis severity</span></div><div class="threshold">pH <7.2 = urgent</div></div>
|
|||
|
|
<div class="cl-item" onclick="toggle(this)"><div class="cl-check">✓</div><div class="cl-text">Calcium, Phosphate, Magnesium<span class="cl-sub">CKD-MBD assessment; HD prescription planning</span></div><div class="threshold">PO₄ >5.5 mg/dL</div></div>
|
|||
|
|
<div class="cl-item" onclick="toggle(this)"><div class="cl-check">✓</div><div class="cl-text">PTH (intact/biointact), Vitamin D 25-OH<span class="cl-sub">Secondary hyperparathyroidism staging</span></div></div>
|
|||
|
|
<div class="cl-item" onclick="toggle(this)"><div class="cl-check">✓</div><div class="cl-text">Uric acid, LDH, haptoglobin<span class="cl-sub">Exclude haemolysis, gout exacerbation</span></div></div>
|
|||
|
|
<div class="cl-item" onclick="toggle(this)"><div class="cl-check">✓</div><div class="cl-text">24h Urine protein or spot ACR<span class="cl-sub">Proteinuria quantification — KDIGO staging</span></div><div class="threshold">ACR >300 = high risk</div></div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<!-- LIVER & NUTRITION -->
|
|||
|
|
<div class="cl-card">
|
|||
|
|
<div class="cl-card-head green"><span class="icon">🍃</span><h4>Liver Function & Nutrition</h4></div>
|
|||
|
|
<div class="cl-items">
|
|||
|
|
<div class="cl-item" onclick="toggle(this)"><div class="cl-check">✓</div><div class="cl-text">LFT: ALT, AST, GGT, Alk Phos, Bilirubin<span class="cl-sub">Hepatic comorbidity; hepatitis serology baseline</span></div></div>
|
|||
|
|
<div class="cl-item" onclick="toggle(this)"><div class="cl-check">✓</div><div class="cl-text">Serum Albumin & Pre-albumin<span class="cl-sub">Nutritional status — <3.5 g/dL indicates malnutrition risk</span></div><div class="threshold">Alb <3.5 = high risk</div></div>
|
|||
|
|
<div class="cl-item" onclick="toggle(this)"><div class="cl-check">✓</div><div class="cl-text">Lipid panel: TC, LDL, HDL, TG<span class="cl-sub">Cardiovascular risk baseline</span></div></div>
|
|||
|
|
<div class="cl-item" onclick="toggle(this)"><div class="cl-check">✓</div><div class="cl-text">HbA1c (if diabetic)<span class="cl-sub">Glycaemic control assessment (note: unreliable in severe anaemia)</span></div><div class="threshold">Target HbA1c 6.5–8%</div></div>
|
|||
|
|
<div class="cl-item" onclick="toggle(this)"><div class="cl-check">✓</div><div class="cl-text">Nutritional screening (MIS or SGA)<span class="cl-sub">Malnutrition Inflammation Score baseline</span></div></div>
|
|||
|
|
<div class="cl-item" onclick="toggle(this)"><div class="cl-check">✓</div><div class="cl-text">Fasting glucose & Insulin (HOMA-IR)<span class="cl-sub">Insulin resistance in CKD-metabolic syndrome</span></div></div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<!-- SEROLOGY & INFECTION -->
|
|||
|
|
<div class="cl-card">
|
|||
|
|
<div class="cl-card-head red"><span class="icon">🦠</span><h4>Serology & Infection Screen</h4></div>
|
|||
|
|
<div class="cl-items">
|
|||
|
|
<div class="cl-item" onclick="toggle(this)"><div class="cl-check">✓</div><div class="cl-text">Hepatitis B sAg, sAb, core Ab (HBcAb)<span class="cl-sub">Mandatory pre-HD; isolation bay planning; vaccination status</span></div></div>
|
|||
|
|
<div class="cl-item" onclick="toggle(this)"><div class="cl-check">✓</div><div class="cl-text">Hepatitis C Ab + HCV RNA (if Ab+)<span class="cl-sub">Identify for treatment pre-dialysis if possible (DAA therapy)</span></div></div>
|
|||
|
|
<div class="cl-item" onclick="toggle(this)"><div class="cl-check">✓</div><div class="cl-text">HIV 1/2 Ag/Ab combination assay<span class="cl-sub">Infection control planning; antiretroviral renal dosing</span></div></div>
|
|||
|
|
<div class="cl-item" onclick="toggle(this)"><div class="cl-check">✓</div><div class="cl-text">SARS-CoV-2 status (institutional protocol)<span class="cl-sub">Dialysis unit isolation protocol compliance</span></div></div>
|
|||
|
|
<div class="cl-item" onclick="toggle(this)"><div class="cl-check">✓</div><div class="cl-text">Quantiferon-TB (or TST)<span class="cl-sub">Latent TB screen — immunosuppressed population</span></div></div>
|
|||
|
|
<div class="cl-item" onclick="toggle(this)"><div class="cl-check">✓</div><div class="cl-text">Nasal MRSA swab (pre-AVF / CVC)<span class="cl-sub">Decolonisation protocol if positive (mupirocin × 5d)</span></div></div>
|
|||
|
|
<div class="cl-item" onclick="toggle(this)"><div class="cl-check">✓</div><div class="cl-text">Blood culture × 2 if febrile or septic<span class="cl-sub">Before empiric antibiotics — mandatory</span></div></div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<!-- CARDIAC WORKUP -->
|
|||
|
|
<div class="cl-card">
|
|||
|
|
<div class="cl-card-head violet"><span class="icon">❤️</span><h4>Cardiovascular Workup</h4></div>
|
|||
|
|
<div class="cl-items">
|
|||
|
|
<div class="cl-item" onclick="toggle(this)"><div class="cl-check">✓</div><div class="cl-text">12-lead ECG<span class="cl-sub">Hyperkalaemia changes, LVH, arrhythmia, ischaemia</span></div><div class="threshold">Mandatory always</div></div>
|
|||
|
|
<div class="cl-item" onclick="toggle(this)"><div class="cl-check">✓</div><div class="cl-text">Echocardiogram (transthoracic)<span class="cl-sub">LVH, wall motion, EF, pericardial effusion — uraemic pericarditis</span></div></div>
|
|||
|
|
<div class="cl-item" onclick="toggle(this)"><div class="cl-check">✓</div><div class="cl-text">Troponin I/T (high-sensitivity)<span class="cl-sub">Chronically elevated in CKD — baseline essential for future comparison</span></div></div>
|
|||
|
|
<div class="cl-item" onclick="toggle(this)"><div class="cl-check">✓</div><div class="cl-text">NT-proBNP or BNP<span class="cl-sub">Volume overload assessment; cardiac failure staging</span></div></div>
|
|||
|
|
<div class="cl-item" onclick="toggle(this)"><div class="cl-check">✓</div><div class="cl-text">Chest X-ray (erect PA if possible)<span class="cl-sub">Pulmonary congestion, cardiomegaly, pleural effusion</span></div></div>
|
|||
|
|
<div class="cl-item" onclick="toggle(this)"><div class="cl-check">✓</div><div class="cl-text">Holter / prolonged cardiac monitoring (if indicated)<span class="cl-sub">Atrial fibrillation, dialysis-related arrhythmia risk</span></div></div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<!-- VASCULAR ACCESS PRE-ASSESSMENT -->
|
|||
|
|
<div class="cl-card">
|
|||
|
|
<div class="cl-card-head teal"><span class="icon">💉</span><h4>Vascular Access & Miscellaneous</h4></div>
|
|||
|
|
<div class="cl-items">
|
|||
|
|
<div class="cl-item" onclick="toggle(this)"><div class="cl-check">✓</div><div class="cl-text">Upper limb vein mapping (duplex USS)<span class="cl-sub">Basilic / cephalic vein diameter ≥2.5 mm for AVF suitability</span></div><div class="threshold">KDOQI VA 2019</div></div>
|
|||
|
|
<div class="cl-item" onclick="toggle(this)"><div class="cl-check">✓</div><div class="cl-text">Arterial assessment (radial/brachial pulse, Allen test)<span class="cl-sub">Arterial patency for radio-cephalic or brachio-cephalic AVF</span></div></div>
|
|||
|
|
<div class="cl-item" onclick="toggle(this)"><div class="cl-check">✓</div><div class="cl-text">Surgical vascular access referral (≥6 months pre-HD)<span class="cl-sub">AVF maturation requires 6–8 weeks minimum post-creation</span></div></div>
|
|||
|
|
<div class="cl-item" onclick="toggle(this)"><div class="cl-check">✓</div><div class="cl-text">Hepatitis B vaccination status + booster if needed<span class="cl-sub">3-dose series or 2-dose Heplisav-B; higher-dose regimen for CKD</span></div></div>
|
|||
|
|
<div class="cl-item" onclick="toggle(this)"><div class="cl-check">✓</div><div class="cl-text">Vaccination: Pneumococcal, Influenza, COVID-19<span class="cl-sub">Immunisation before immunosuppression or dialysis commencement</span></div></div>
|
|||
|
|
<div class="cl-item" onclick="toggle(this)"><div class="cl-check">✓</div><div class="cl-text">Renal Dietitian referral + low K/P diet counselling<span class="cl-sub">Pre-dialysis dietary optimisation; phosphate binder education</span></div></div>
|
|||
|
|
<div class="cl-item" onclick="toggle(this)"><div class="cl-check">✓</div><div class="cl-text">Psychosocial assessment + RRT modality education<span class="cl-sub">Shared decision-making — HD vs PD vs conservative care</span></div></div>
|
|||
|
|
<div class="cl-item" onclick="toggle(this)"><div class="cl-check">✓</div><div class="cl-text">Advance care planning documentation<span class="cl-sub">Goals of care, ceiling of treatment, organ donation wishes</span></div></div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
</div><!-- /checklist-grid -->
|
|||
|
|
|
|||
|
|
<div class="callout success-c" style="margin-top:1.5rem;">
|
|||
|
|
<div class="callout-label">Checklist Progress</div>
|
|||
|
|
Click items above to track completion. All items should be completed before elective dialysis initiation. Items marked <span style="color:var(--red);">red-threshold</span> require immediate clinical action if outside target range.
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<!-- ══════════════════════════════════════════════
|
|||
|
|
TAB 3 — MEDICATION SAFETY
|
|||
|
|
═══════════════════════════════════════════════ -->
|
|||
|
|
|
|||
|
|
<div id="tab-medications" class="panel">
|
|||
|
|
<div class="sec-head">
|
|||
|
|
<h2>Medication Safety & Renal Dose Adjustment</h2>
|
|||
|
|
<p>Pre-dialysis medication reconciliation with renal dose adjustment guidance. Adjusted for eGFR thresholds per BNF/Micromedex/KDIGO 2022 pharmacotherapy recommendations.</p>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="callout urgent">
|
|||
|
|
<div class="callout-label">STOP Immediately — Pre-Dialysis</div>
|
|||
|
|
Metformin (if eGFR <30), NSAIDs/COX-2 inhibitors, ACE inhibitors on day of HD (volume-dependent), nephrotoxic antibiotics (gentamicin without level monitoring), oral anticoagulants without renal dose adjustment.
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="med-table-wrap">
|
|||
|
|
<table class="med-table">
|
|||
|
|
<thead>
|
|||
|
|
<tr>
|
|||
|
|
<th>Drug / Class</th>
|
|||
|
|
<th>Action at eGFR</th>
|
|||
|
|
<th>Recommendation</th>
|
|||
|
|
<th>Evidence</th>
|
|||
|
|
<th>Status</th>
|
|||
|
|
</tr>
|
|||
|
|
</thead>
|
|||
|
|
<tbody>
|
|||
|
|
<tr>
|
|||
|
|
<td><strong>Metformin</strong><br><span style="color:var(--text-dim);font-size:0.72rem;">Biguanide</span></td>
|
|||
|
|
<td>eGFR <45: reduce dose<br>eGFR <30: STOP</td>
|
|||
|
|
<td>Lactic acidosis risk in renal impairment. Withhold if AKI or contrast. Discontinue permanently at eGFR <30.</td>
|
|||
|
|
<td><span class="grade 1A">1A</span> KDIGO</td>
|
|||
|
|
<td><span class="risk-badge stop">STOP <30</span></td>
|
|||
|
|
</tr>
|
|||
|
|
<tr>
|
|||
|
|
<td><strong>SGLT2 Inhibitors</strong><br><span style="color:var(--text-dim);font-size:0.72rem;">Dapagliflozin, Empagliflozin</span></td>
|
|||
|
|
<td>eGFR <25: glycaemic benefit lost; eGFR <20: STOP for glycaemia (renoprotective benefit may persist per DAPA-CKD)</td>
|
|||
|
|
<td>Continue for CKD progression retardation down to eGFR ≥20 (DAPA-CKD trial). Discontinue before HD initiation — dehydration/DKA risk.</td>
|
|||
|
|
<td><span class="grade 1B">1B</span> DAPA-CKD</td>
|
|||
|
|
<td><span class="risk-badge reduce">Reduce/Stop</span></td>
|
|||
|
|
</tr>
|
|||
|
|
<tr>
|
|||
|
|
<td><strong>ACE Inhibitors / ARBs</strong><br><span style="color:var(--text-dim);font-size:0.72rem;">Ramipril, Losartan</span></td>
|
|||
|
|
<td>Continue through CKD if tolerated. Withhold on HD days if volume-depleted. Stop if K⁺ >6.0 mEq/L unresponsive to measures.</td>
|
|||
|
|
<td>Continue for renoprotection and proteinuria reduction. Monitor creatinine (acceptable rise <30% from baseline). Avoid in bilateral RAS.</td>
|
|||
|
|
<td><span class="grade 1A">1A</span> KDIGO 2022</td>
|
|||
|
|
<td><span class="risk-badge monitor">Monitor</span></td>
|
|||
|
|
</tr>
|
|||
|
|
<tr>
|
|||
|
|
<td><strong>NSAIDs / COX-2 inhibitors</strong><br><span style="color:var(--text-dim);font-size:0.72rem;">Ibuprofen, Celecoxib</span></td>
|
|||
|
|
<td>All eGFR levels: avoid; esp. eGFR <30</td>
|
|||
|
|
<td>Contraindicated in CKD G3b+. Accelerate eGFR decline, cause AKI via NSAID-mediated afferent arteriolar constriction. Substitute paracetamol.</td>
|
|||
|
|
<td><span class="grade 1A">1A</span></td>
|
|||
|
|
<td><span class="risk-badge stop">STOP</span></td>
|
|||
|
|
</tr>
|
|||
|
|
<tr>
|
|||
|
|
<td><strong>Gabapentin / Pregabalin</strong><br><span style="color:var(--text-dim);font-size:0.72rem;">Neuropathic pain, uraemic itch</span></td>
|
|||
|
|
<td>eGFR 30–60: reduce to 50% dose<br>eGFR <30: 25% dose<br>Dialysis: dose post-HD session</td>
|
|||
|
|
<td>Renally cleared; accumulation causes somnolence, confusion. In HD: significant dialysis clearance — dose after session (100–300 mg post-HD).</td>
|
|||
|
|
<td><span class="grade 2B">2B</span></td>
|
|||
|
|
<td><span class="risk-badge reduce">Dose Reduce</span></td>
|
|||
|
|
</tr>
|
|||
|
|
<tr>
|
|||
|
|
<td><strong>Low Molecular Weight Heparin</strong><br><span style="color:var(--text-dim);font-size:0.72rem;">Enoxaparin, Dalteparin</span></td>
|
|||
|
|
<td>eGFR <30: accumulation risk — anti-Xa monitoring or switch to UFH</td>
|
|||
|
|
<td>Use UFH (unfractionated) in eGFR <30 or active HD. If LMWH required: anti-Xa monitoring (target 0.5–1.0 IU/mL), dose reduction (enoxaparin 1 mg/kg once daily vs BD).</td>
|
|||
|
|
<td><span class="grade 1B">1B</span></td>
|
|||
|
|
<td><span class="risk-badge caution">Caution</span></td>
|
|||
|
|
</tr>
|
|||
|
|
<tr>
|
|||
|
|
<td><strong>Direct Oral Anticoagulants</strong><br><span style="color:var(--text-dim);font-size:0.72rem;">Apixaban, Rivaroxaban, Dabigatran</span></td>
|
|||
|
|
<td>Dabigatran: STOP eGFR <30 (dialysable)<br>Apixaban: use 2.5 mg BD if ≥2 of: Cr>1.5, age≥80, wt≤60 kg; STOP on HD<br>Rivaroxaban: avoid eGFR <15</td>
|
|||
|
|
<td>Warfarin is preferred in CKD G4–5 AF (lower stroke risk reduction with DOACs in dialysis patients per observational data). Individual risk-benefit with haematology.</td>
|
|||
|
|
<td><span class="grade 2B">2B</span></td>
|
|||
|
|
<td><span class="risk-badge caution">Caution/Adjust</span></td>
|
|||
|
|
</tr>
|
|||
|
|
<tr>
|
|||
|
|
<td><strong>Statins</strong><br><span style="color:var(--text-dim);font-size:0.72rem;">Atorvastatin, Rosuvastatin</span></td>
|
|||
|
|
<td>Continue through all CKD stages. Do NOT initiate in HD patients (4D, AURORA trials — no benefit, possible harm).</td>
|
|||
|
|
<td>Continue if already established in dialysis patients. Do not start de novo in prevalent HD (KDIGO Lipids 2013). Atorvastatin preferred (mainly hepatic clearance).</td>
|
|||
|
|
<td><span class="grade 1A">1A</span> KDIGO Lipids</td>
|
|||
|
|
<td><span class="risk-badge continue">Continue (pre-HD)</span></td>
|
|||
|
|
</tr>
|
|||
|
|
<tr>
|
|||
|
|
<td><strong>Allopurinol</strong><br><span style="color:var(--text-dim);font-size:0.72rem;">Uric acid reduction</span></td>
|
|||
|
|
<td>eGFR 30–60: max 200 mg/day<br>eGFR <30: max 100 mg/day<br>HD: dose post-dialysis</td>
|
|||
|
|
<td>Accumulation of active metabolite oxipurinol causes severe toxicity (bone marrow suppression, Stevens-Johnson). Monitor allopurinol level if <eGFR 30.</td>
|
|||
|
|
<td><span class="grade 2C">2C</span></td>
|
|||
|
|
<td><span class="risk-badge reduce">Dose Reduce</span></td>
|
|||
|
|
</tr>
|
|||
|
|
<tr>
|
|||
|
|
<td><strong>Phosphate Binders</strong><br><span style="color:var(--text-dim);font-size:0.72rem;">Calcium carbonate, Sevelamer, Lanthanum</span></td>
|
|||
|
|
<td>Initiate when PO₄ >4.5 mg/dL despite dietary restriction</td>
|
|||
|
|
<td>Non-calcium binders (sevelamer, lanthanum) preferred in dialysis — avoid calcium loading. Calcium carbonate acceptable pre-dialysis if serum Ca normal. Take with meals.</td>
|
|||
|
|
<td><span class="grade 1B">1B</span> KDIGO MBD</td>
|
|||
|
|
<td><span class="risk-badge continue">Initiate if indicated</span></td>
|
|||
|
|
</tr>
|
|||
|
|
<tr>
|
|||
|
|
<td><strong>ESA — Erythropoiesis Stimulating Agents</strong><br><span style="color:var(--text-dim);font-size:0.72rem;">Darbepoetin alfa, Epoetin alfa</span></td>
|
|||
|
|
<td>Initiate when Hb <10 g/dL after iron repletion (TSAT >20%, ferritin >100)</td>
|
|||
|
|
<td>Target Hb 10–12 g/dL. Avoid Hb >13 g/dL (CHOIR trial: increased CV events). Reduce or withhold if Hb rising >1 g/dL per 2 weeks or Hb >12.</td>
|
|||
|
|
<td><span class="grade 1A">1A</span> KDIGO Anaemia</td>
|
|||
|
|
<td><span class="risk-badge monitor">Monitor closely</span></td>
|
|||
|
|
</tr>
|
|||
|
|
<tr>
|
|||
|
|
<td><strong>Potassium Binders</strong><br><span style="color:var(--text-dim);font-size:0.72rem;">Patiromer, Sodium Zirconium Cyclosilicate</span></td>
|
|||
|
|
<td>Initiate for persistent K⁺ >5.0 mEq/L to maintain RAAS therapy</td>
|
|||
|
|
<td>Novel agents enable continuation of ACEi/ARB in hyperkalaemia-prone CKD patients. Patiromer: 8.4 g once daily with food. SZC: 10 g TDS × 48h then 5 g/day maintenance.</td>
|
|||
|
|
<td><span class="grade 1B">1B</span></td>
|
|||
|
|
<td><span class="risk-badge continue">Initiate if K⁺ raised</span></td>
|
|||
|
|
</tr>
|
|||
|
|
<tr>
|
|||
|
|
<td><strong>Aminoglycosides</strong><br><span style="color:var(--text-dim);font-size:0.72rem;">Gentamicin, Tobramycin</span></td>
|
|||
|
|
<td>Nephrotoxic — avoid in CKD G3b+. If essential: single-dose, level-guided, with nephrology input</td>
|
|||
|
|
<td>If unavoidable in life-threatening infection: extended-interval dosing, trough <1 mg/L. Monitor renal function daily. Dialysis patients: dose post-HD session; obtain pre-HD trough level.</td>
|
|||
|
|
<td><span class="grade 1A">1A</span></td>
|
|||
|
|
<td><span class="risk-badge stop">Avoid / Level-guide</span></td>
|
|||
|
|
</tr>
|
|||
|
|
</tbody>
|
|||
|
|
</table>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="callout info" style="margin-top:1rem;">
|
|||
|
|
<div class="callout-label">Medication Reconciliation Principle</div>
|
|||
|
|
All patients transitioning to dialysis require a full medication reconciliation by a renal pharmacist. Particular attention to: drugs requiring post-HD supplemental dosing (gabapentin, acyclovir, vancomycin), drugs with altered protein binding in uraemia, and drugs contraindicated in PD (icodextrin interactions with amylase-based glucose monitors).
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<!-- ══════════════════════════════════════════════
|
|||
|
|
TAB 4 — DIFFERENTIAL DIAGNOSIS
|
|||
|
|
═══════════════════════════════════════════════ -->
|
|||
|
|
|
|||
|
|
<div id="tab-ddx" class="panel">
|
|||
|
|
<div class="sec-head">
|
|||
|
|
<h2>Differential Diagnosis Support</h2>
|
|||
|
|
<p>Common and important differential diagnoses for acute or subacute deterioration in eGFR in a CKD patient. Probability estimates are contextual — adjust based on clinical history, urinalysis, and imaging.</p>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="callout warn">
|
|||
|
|
<div class="callout-label">AKI-on-CKD — First Exclude Reversible Causes</div>
|
|||
|
|
Before accepting progressive CKD as the aetiology of eGFR decline, systematically exclude: obstruction (obstructive uropathy), volume depletion, nephrotoxins, renovascular disease, and intrinsic AKI causes. Every unexplained eGFR drop warrants urine dipstick, microscopy, and renal ultrasound as minimum workup.
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="ddx-grid">
|
|||
|
|
|
|||
|
|
```
|
|||
|
|
<!-- PRE-RENAL -->
|
|||
|
|
<div class="ddx-card">
|
|||
|
|
<div class="ddx-head">
|
|||
|
|
<h4>Pre-renal / Haemodynamic</h4>
|
|||
|
|
<span class="pill amber" style="font-size:0.58rem;">Common</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="prob-bar-wrap"><div class="prob-name">Volume depletion (over-diuresis)</div><div class="prob-bar"><div class="prob-fill" style="width:85%;background:var(--amber);"></div></div><div class="prob-pct">85%</div></div>
|
|||
|
|
<div class="prob-bar-wrap"><div class="prob-name">Cardiac failure / cardiorenal</div><div class="prob-bar"><div class="prob-fill" style="width:70%;background:var(--amber);"></div></div><div class="prob-pct">70%</div></div>
|
|||
|
|
<div class="prob-bar-wrap"><div class="prob-name">Sepsis / distributive shock</div><div class="prob-bar"><div class="prob-fill" style="width:60%;background:var(--amber);"></div></div><div class="prob-pct">60%</div></div>
|
|||
|
|
<div class="prob-bar-wrap"><div class="prob-name">Hepatorenal syndrome</div><div class="prob-bar"><div class="prob-fill" style="width:25%;background:var(--amber);"></div></div><div class="prob-pct">25%</div></div>
|
|||
|
|
<div style="padding:0.6rem 1rem;font-size:0.75rem;color:var(--text-dim);">Key: BUN:Cr ratio >20:1, fractional Na excretion <1%, orthostatic hypotension, muddy brown casts absent.</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<!-- OBSTRUCTIVE -->
|
|||
|
|
<div class="ddx-card">
|
|||
|
|
<div class="ddx-head">
|
|||
|
|
<h4>Post-renal / Obstructive</h4>
|
|||
|
|
<span class="pill red" style="font-size:0.58rem;">Must Exclude</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="prob-bar-wrap"><div class="prob-name">BPH / bladder outlet obstruction</div><div class="prob-bar"><div class="prob-fill" style="width:70%;background:var(--red);"></div></div><div class="prob-pct">70%</div></div>
|
|||
|
|
<div class="prob-bar-wrap"><div class="prob-name">Ureteric calculi (bilateral / solitary kidney)</div><div class="prob-bar"><div class="prob-fill" style="width:40%;background:var(--red);"></div></div><div class="prob-pct">40%</div></div>
|
|||
|
|
<div class="prob-bar-wrap"><div class="prob-name">Malignancy — extrinsic compression</div><div class="prob-bar"><div class="prob-fill" style="width:30%;background:var(--red);"></div></div><div class="prob-pct">30%</div></div>
|
|||
|
|
<div class="prob-bar-wrap"><div class="prob-name">Retroperitoneal fibrosis</div><div class="prob-bar"><div class="prob-fill" style="width:10%;background:var(--red);"></div></div><div class="prob-pct">10%</div></div>
|
|||
|
|
<div style="padding:0.6rem 1rem;font-size:0.75rem;color:var(--text-dim);">Key: Renal USS — hydronephrosis. Bladder residual volume >300 mL. Consider CT KUB if USS non-diagnostic. Catheterise if outlet obstruction suspected.</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<!-- NEPHROTOXIN -->
|
|||
|
|
<div class="ddx-card">
|
|||
|
|
<div class="ddx-head">
|
|||
|
|
<h4>Nephrotoxin-Induced AKI</h4>
|
|||
|
|
<span class="pill amber" style="font-size:0.58rem;">High Risk in CKD</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="prob-bar-wrap"><div class="prob-name">NSAIDs / COX-2 inhibitors</div><div class="prob-bar"><div class="prob-fill" style="width:80%;background:#f07060;"></div></div><div class="prob-pct">80%</div></div>
|
|||
|
|
<div class="prob-bar-wrap"><div class="prob-name">Contrast nephropathy (CI-AKI)</div><div class="prob-bar"><div class="prob-fill" style="width:65%;background:#f07060;"></div></div><div class="prob-pct">65%</div></div>
|
|||
|
|
<div class="prob-bar-wrap"><div class="prob-name">Aminoglycosides</div><div class="prob-bar"><div class="prob-fill" style="width:55%;background:#f07060;"></div></div><div class="prob-pct">55%</div></div>
|
|||
|
|
<div class="prob-bar-wrap"><div class="prob-name">Calcineurin inhibitors (tacrolimus, ciclosporin)</div><div class="prob-bar"><div class="prob-fill" style="width:45%;background:#f07060;"></div></div><div class="prob-pct">45%</div></div>
|
|||
|
|
<div class="prob-bar-wrap"><div class="prob-name">Herbal / complementary medicines</div><div class="prob-bar"><div class="prob-fill" style="width:30%;background:#f07060;"></div></div><div class="prob-pct">30%</div></div>
|
|||
|
|
<div style="padding:0.6rem 1rem;font-size:0.75rem;color:var(--text-dim);">Full medication history including OTC, herbal, supplements. NSAID mechanism: afferent arteriolar constriction → acute tubular ischaemia on background CKD.</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<!-- RENOVASCULAR -->
|
|||
|
|
<div class="ddx-card">
|
|||
|
|
<div class="ddx-head">
|
|||
|
|
<h4>Renovascular Disease</h4>
|
|||
|
|
<span class="pill violet" style="font-size:0.58rem;">Under-diagnosed</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="prob-bar-wrap"><div class="prob-name">Atherosclerotic renal artery stenosis</div><div class="prob-bar"><div class="prob-fill" style="width:60%;background:var(--violet);"></div></div><div class="prob-pct">60%</div></div>
|
|||
|
|
<div class="prob-bar-wrap"><div class="prob-name">ACEi-induced in bilateral RAS</div><div class="prob-bar"><div class="prob-fill" style="width:45%;background:var(--violet);"></div></div><div class="prob-pct">45%</div></div>
|
|||
|
|
<div class="prob-bar-wrap"><div class="prob-name">Cholesterol embolisation</div><div class="prob-bar"><div class="prob-fill" style="width:20%;background:var(--violet);"></div></div><div class="prob-pct">20%</div></div>
|
|||
|
|
<div class="prob-bar-wrap"><div class="prob-name">Fibromuscular dysplasia (younger patients)</div><div class="prob-bar"><div class="prob-fill" style="width:10%;background:var(--violet);"></div></div><div class="prob-pct">10%</div></div>
|
|||
|
|
<div style="padding:0.6rem 1rem;font-size:0.75rem;color:var(--text-dim);">Clues: flash pulmonary oedema, refractory hypertension, asymmetric kidneys on USS, eGFR drop >30% on ACEi initiation. Renal duplex or CT angiography for evaluation.</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<!-- GLOMERULAR -->
|
|||
|
|
<div class="ddx-card">
|
|||
|
|
<div class="ddx-head">
|
|||
|
|
<h4>Intrinsic Renal / Glomerular</h4>
|
|||
|
|
<span class="pill blue" style="font-size:0.58rem;">Biopsy May Be Needed</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="prob-bar-wrap"><div class="prob-name">Rapidly progressive GN (RPGN)</div><div class="prob-bar"><div class="prob-fill" style="width:75%;background:var(--blue);"></div></div><div class="prob-pct">75%</div></div>
|
|||
|
|
<div class="prob-bar-wrap"><div class="prob-name">IgA nephropathy exacerbation</div><div class="prob-bar"><div class="prob-fill" style="width:60%;background:var(--blue);"></div></div><div class="prob-pct">60%</div></div>
|
|||
|
|
<div class="prob-bar-wrap"><div class="prob-name">Diabetic nephropathy (DKD) progression</div><div class="prob-bar"><div class="prob-fill" style="width:55%;background:var(--blue);"></div></div><div class="prob-pct">55%</div></div>
|
|||
|
|
<div class="prob-bar-wrap"><div class="prob-name">Membranous nephropathy (de novo)</div><div class="prob-bar"><div class="prob-fill" style="width:30%;background:var(--blue);"></div></div><div class="prob-pct">30%</div></div>
|
|||
|
|
<div class="prob-bar-wrap"><div class="prob-name">Vasculitis (ANCA, anti-GBM)</div><div class="prob-bar"><div class="prob-fill" style="width:20%;background:var(--blue);"></div></div><div class="prob-pct">20%</div></div>
|
|||
|
|
<div style="padding:0.6rem 1rem;font-size:0.75rem;color:var(--text-dim);">Red cell casts / nephritic sediment = glomerular origin. Immunology: ANCA, anti-GBM, ANA, complement (C3/C4), anti-PLA2R. Biopsy if aetiology unclear and clinically safe.</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<!-- METABOLIC / SYSTEMIC -->
|
|||
|
|
<div class="ddx-card">
|
|||
|
|
<div class="ddx-head">
|
|||
|
|
<h4>Metabolic / Systemic</h4>
|
|||
|
|
<span class="pill green" style="font-size:0.58rem;">Reversible if Caught Early</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="prob-bar-wrap"><div class="prob-name">Hypercalcaemia (myeloma, sarcoid, PTH)</div><div class="prob-bar"><div class="prob-fill" style="width:50%;background:var(--green);"></div></div><div class="prob-pct">50%</div></div>
|
|||
|
|
<div class="prob-bar-wrap"><div class="prob-name">Acute uric acid nephropathy</div><div class="prob-bar"><div class="prob-fill" style="width:35%;background:var(--green);"></div></div><div class="prob-pct">35%</div></div>
|
|||
|
|
<div class="prob-bar-wrap"><div class="prob-name">Light chain nephropathy (myeloma cast)</div><div class="prob-bar"><div class="prob-fill" style="width:25%;background:var(--green);"></div></div><div class="prob-pct">25%</div></div>
|
|||
|
|
<div class="prob-bar-wrap"><div class="prob-name">Thrombotic microangiopathy (TMA)</div><div class="prob-bar"><div class="prob-fill" style="width:15%;background:var(--green);"></div></div><div class="prob-pct">15%</div></div>
|
|||
|
|
<div style="padding:0.6rem 1rem;font-size:0.75rem;color:var(--text-dim);">Workup: SPEP, serum free light chains, BJP urine, blood film (schistocytes in TMA), ADAMTS13 (TTP). Calcium and uric acid levels. Bone marrow biopsy if myeloma suspected.</div>
|
|||
|
|
</div>
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
</div><!-- /ddx-grid -->
|
|||
|
|
|
|||
|
|
<div class="callout info" style="margin-top:1.5rem;">
|
|||
|
|
<div class="callout-label">Systematic DDx Approach — AKI-on-CKD Workup</div>
|
|||
|
|
Step 1: Urine dipstick + microscopy (sediment analysis) → Step 2: Urine Na, osmolality, FENa → Step 3: Renal USS (obstruction, kidneys size/symmetry) → Step 4: Medication review for nephrotoxins → Step 5: Immunology screen if glomerular suspected → Step 6: Renal biopsy if aetiology unclear and clinically safe (avoid if small <8 cm echogenic kidneys — chronic irreversible disease likely).
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<!-- ══════════════════════════════════════════════
|
|||
|
|
TAB 5 — VASCULAR ACCESS
|
|||
|
|
═══════════════════════════════════════════════ -->
|
|||
|
|
|
|||
|
|
<div id="tab-access" class="panel">
|
|||
|
|
<div class="sec-head">
|
|||
|
|
<h2>Vascular Access Planning</h2>
|
|||
|
|
<p>Sequential decision pathway for HD vascular access — KDOQI Vascular Access 2019 guidelines with ERA-EDTA 2023 supplementary recommendations. Fistula First principle remains the gold standard.</p>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="callout success-c">
|
|||
|
|
<div class="callout-label">KDOQI 2019 — Fistula First Principle</div>
|
|||
|
|
AVF is the preferred permanent access for HD. Access hierarchy: <strong>AVF (radiocephalic → brachiocephalic → transposed brachiobasilic) → AVG → Tunnelled CVC (bridge only)</strong>. Non-tunnelled CVC: emergency only, maximum 7 days.
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="va-timeline">
|
|||
|
|
|
|||
|
|
```
|
|||
|
|
<div class="va-step">
|
|||
|
|
<div class="va-dot avf">AVF</div>
|
|||
|
|
<div class="va-content">
|
|||
|
|
<h4>1st Choice — Autologous AV Fistula (AVF)</h4>
|
|||
|
|
<p>Radiocephalic (wrist, RC-AVF) is the preferred first attempt — lowest thrombosis, best long-term patency. If unsuitable (vein <2 mm, arterial disease): brachiocephalic (BC-AVF) or transposed brachiobasilic (BB-AVF). Requires vein diameter ≥2.5 mm and radial artery diameter ≥2.0 mm on duplex mapping.</p>
|
|||
|
|
<p style="margin-top:0.4rem;font-size:0.78rem;"><strong style="color:var(--text);">Maturation criteria (KDOQI "Rule of 6s"):</strong> Diameter ≥6 mm, depth ≤6 mm from skin, flow ≥600 mL/min at 6 weeks post-creation.</p>
|
|||
|
|
<p class="timing">⏱ Refer ≥6 months before anticipated HD start · Maturation 6–12 weeks · Primary failure rate: 20–40%</p>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="va-step">
|
|||
|
|
<div class="va-dot avg">AVG</div>
|
|||
|
|
<div class="va-content">
|
|||
|
|
<h4>2nd Choice — Prosthetic AV Graft (AVG)</h4>
|
|||
|
|
<p>When autologous veins are unsuitable or primary AVF has failed. ePTFE or PTFE graft — brachio-antecubital most common. Earlier cannulation possible (2–3 weeks for standard PTFE, 24–72 hours for early cannulation grafts). Higher thrombosis and infection rates vs. AVF. Surveillance programme essential (monthly flow monitoring).</p>
|
|||
|
|
<p class="timing">⏱ Cannulation 2–6 weeks (standard) or 24–72h (Acuseal/Flixene) · Suitable for patients with poor vein anatomy</p>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="va-step">
|
|||
|
|
<div class="va-dot cvc">CVC</div>
|
|||
|
|
<div class="va-content">
|
|||
|
|
<h4>Bridge / Emergency — Tunnelled Cuffed CVC (TCC)</h4>
|
|||
|
|
<p>Right internal jugular vein is the preferred site. Subclavian vein must be avoided — high risk of central vein stenosis that precludes future ipsilateral AVF/AVG. Femoral CVC only for short-term bridge in emergencies with no upper limb access. TCC carries ×3 higher mortality risk than AVF (infection, thrombosis, bacteraemia — <em>Staphylococcus aureus</em> most common pathogen).</p>
|
|||
|
|
<p style="color:var(--red);font-size:0.78rem;margin-top:0.4rem;">⚠ Non-tunnelled CVC: maximum 7 days only. Convert to TCC or functioning AVF/AVG as soon as possible.</p>
|
|||
|
|
<p class="timing">⏱ Right IJV preferred · Subclavian CONTRAINDICATED · Lock with citrate or heparin between sessions</p>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="va-step">
|
|||
|
|
<div class="va-dot pd">PD</div>
|
|||
|
|
<div class="va-content">
|
|||
|
|
<h4>Alternative — Peritoneal Dialysis Catheter</h4>
|
|||
|
|
<p>For patients choosing PD as modality. Tenckhoff catheter — laparoscopic placement preferred (lower malposition rates). Break-in period: 2 weeks minimum (urgent start PD possible with low-volume supine exchanges after 1–2 days in experienced centres). Patient suitability: intact peritoneum, adequate home environment, manual dexterity or trained caregiver.</p>
|
|||
|
|
<p><strong style="color:var(--text);">Absolute PD contraindications:</strong> extensive abdominal adhesions, active abdominal infection/IBD, large abdominal hernia (repair first), no peritoneal access possible.</p>
|
|||
|
|
<p class="timing">⏱ Insert ≥2 weeks before PD start · Allows flush and leak testing · Urgent start possible in experienced centres</p>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<h3 style="color:var(--text-bright); font-family:var(--body); font-size:1rem; margin-bottom:1rem; margin-top:0.5rem;">Access Selection Decision Matrix</h3>
|
|||
|
|
|
|||
|
|
<div class="med-table-wrap">
|
|||
|
|
<table class="med-table">
|
|||
|
|
<thead>
|
|||
|
|
<tr>
|
|||
|
|
<th>Clinical Factor</th>
|
|||
|
|
<th>AVF</th>
|
|||
|
|
<th>AVG</th>
|
|||
|
|
<th>TCC</th>
|
|||
|
|
<th>PD Catheter</th>
|
|||
|
|
</tr>
|
|||
|
|
</thead>
|
|||
|
|
<tbody>
|
|||
|
|
<tr><td>Adequate vein (≥2.5 mm duplex)</td><td style="color:var(--green)">✓ Preferred</td><td style="color:var(--amber)">Alternative</td><td style="color:var(--text-dim)">Not indicated</td><td style="color:var(--text-dim)">Not applicable</td></tr>
|
|||
|
|
<tr><td>Poor peripheral veins</td><td style="color:var(--text-dim)">Not feasible</td><td style="color:var(--green)">✓ Preferred</td><td style="color:var(--amber)">Bridge</td><td style="color:var(--blue)">Consider PD</td></tr>
|
|||
|
|
<tr><td>Imminent HD need (<1 week)</td><td style="color:var(--text-dim)">Not ready</td><td style="color:var(--amber)">Early cannulation graft</td><td style="color:var(--green)">✓ Use</td><td style="color:var(--amber)">Urgent start PD</td></tr>
|
|||
|
|
<tr><td>Active systemic infection</td><td style="color:var(--red)">Defer</td><td style="color:var(--red)">Defer</td><td style="color:var(--amber)">Caution</td><td style="color:var(--red)">Contraindicated</td></tr>
|
|||
|
|
<tr><td>Patient preference — home therapy</td><td style="color:var(--amber)">Home HD possible</td><td style="color:var(--text-dim)">Less suitable</td><td style="color:var(--text-dim)">Not suitable</td><td style="color:var(--green)">✓ Ideal</td></tr>
|
|||
|
|
<tr><td>Diabetic + severe peripheral vascular disease</td><td style="color:var(--amber)">May have arterial issues</td><td style="color:var(--green)">✓ Preferred</td><td style="color:var(--amber)">Bridge</td><td style="color:var(--blue)">Consider</td></tr>
|
|||
|
|
<tr><td>Previous failed access (ipsilateral)</td><td style="color:var(--amber)">Contralateral AVF</td><td style="color:var(--green)">✓ Preferred</td><td style="color:var(--amber)">Bridge</td><td style="color:var(--blue)">Consider PD</td></tr>
|
|||
|
|
</tbody>
|
|||
|
|
</table>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="callout info" style="margin-top:1rem;">
|
|||
|
|
<div class="callout-label">Subclavian Vein — Absolute Contraindication for HD Access</div>
|
|||
|
|
Subclavian vein catheterisation carries a 40–50% risk of central vein stenosis or occlusion, which permanently precludes ipsilateral upper limb arteriovenous access. KDOQI 2019 recommends the subclavian route is <strong>never used</strong> for HD access in patients with existing or potential future upper limb fistulas. Right internal jugular vein is the universal first choice.
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
</div><!-- /panel -->
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
// Tab switching
|
|||
|
|
function switchTab(id, btn) {
|
|||
|
|
document.querySelectorAll('.panel').forEach(p => p.classList.remove('active'));
|
|||
|
|
document.querySelectorAll('.tab-btn').forEach(b => b.classList.remove('active'));
|
|||
|
|
document.getElementById('tab-' + id).classList.add('active');
|
|||
|
|
btn.classList.add('active');
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// Checklist toggle
|
|||
|
|
function toggle(el) {
|
|||
|
|
el.classList.toggle('checked');
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// CKD-EPI 2021 eGFR Calculator (Creatinine-only, race-free)
|
|||
|
|
function calcEGFR() {
|
|||
|
|
const cr = parseFloat(document.getElementById('cr').value);
|
|||
|
|
const age = parseFloat(document.getElementById('age').value);
|
|||
|
|
const sex = document.getElementById('sex').value;
|
|||
|
|
|
|||
|
|
if (!cr || !age || cr <= 0 || age <= 0) {
|
|||
|
|
alert('Please enter valid creatinine and age values.');
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
let kappa, alpha;
|
|||
|
|
if (sex === 'female') { kappa = 0.7; alpha = -0.241; }
|
|||
|
|
else { kappa = 0.9; alpha = -0.302; }
|
|||
|
|
|
|||
|
|
const crKappa = cr / kappa;
|
|||
|
|
const minTerm = Math.min(crKappa, 1);
|
|||
|
|
const maxTerm = Math.max(crKappa, 1);
|
|||
|
|
const sexMult = sex === 'female' ? 1.012 : 1.0;
|
|||
|
|
|
|||
|
|
const egfr = 142 * Math.pow(minTerm, alpha) * Math.pow(maxTerm, -1.200) * Math.pow(0.9938, age) * sexMult;
|
|||
|
|
const egfrRounded = Math.round(egfr * 10) / 10;
|
|||
|
|
|
|||
|
|
// Stage
|
|||
|
|
let stage, stageDesc, stageColor, rec;
|
|||
|
|
if (egfr >= 90) {
|
|||
|
|
stage = 'G1'; stageDesc = 'Normal or high eGFR'; stageColor = 'var(--green)';
|
|||
|
|
rec = 'CKD G1 — Diagnosis requires additional evidence of kidney damage (e.g., proteinuria, haematuria, structural abnormality). Optimise cardiovascular risk factors. Annual eGFR monitoring.';
|
|||
|
|
} else if (egfr >= 60) {
|
|||
|
|
stage = 'G2'; stageDesc = 'Mildly reduced'; stageColor = 'var(--blue)';
|
|||
|
|
rec = 'CKD G2 — Mildly reduced eGFR. Requires evidence of kidney damage for CKD diagnosis. RAAS blockade if proteinuric. 6-12 monthly monitoring.';
|
|||
|
|
} else if (egfr >= 30) {
|
|||
|
|
stage = 'G3'; stageDesc = 'Moderately reduced';
|
|||
|
|
stageColor = egfr >= 45 ? 'var(--teal)' : 'var(--amber)';
|
|||
|
|
rec = 'CKD G3 (' + (egfr >= 45 ? 'G3a' : 'G3b') + ') — Begin CKD complications screening (anaemia, MBD, acidosis). Consider nephrology referral. SGLT2i if eligible. 3–6 monthly monitoring.';
|
|||
|
|
} else if (egfr >= 15) {
|
|||
|
|
stage = 'G4'; stageDesc = 'Severely reduced'; stageColor = '#f07060';
|
|||
|
|
rec = '⚠ CKD G4 — Nephrology must be involved. Begin pre-dialysis preparation: RRT education, vascular access planning (AVF referral if HD planned), vaccinations (HBV, pneumococcal). Monthly monitoring.';
|
|||
|
|
} else {
|
|||
|
|
stage = 'G5'; stageDesc = 'Kidney failure'; stageColor = 'var(--red)';
|
|||
|
|
rec = '🚨 CKD G5 (Kidney Failure) — Assess for dialysis initiation. Evaluate for emergency criteria (uraemia, hyperkalaemia, acidosis, fluid overload). If asymptomatic, may defer — IDEAL Trial: no benefit to early initiation. Symptom-guided start.';
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
document.getElementById('egfr-val').textContent = egfrRounded;
|
|||
|
|
document.getElementById('egfr-val').style.color = stageColor;
|
|||
|
|
document.getElementById('stage-label').textContent = stage + ' — ' + stageDesc;
|
|||
|
|
document.getElementById('egfr-recommendation').textContent = rec;
|
|||
|
|
|
|||
|
|
// Stage bar
|
|||
|
|
['g1','g2','g3','g4','g5'].forEach(s => document.getElementById('seg-'+s).classList.remove('active'));
|
|||
|
|
const stageMap = { 'G1': 'g1', 'G2': 'g2', 'G3': 'g3', 'G4': 'g4', 'G5': 'g5' };
|
|||
|
|
document.getElementById('seg-' + stageMap[stage]).classList.add('active');
|
|||
|
|
|
|||
|
|
document.getElementById('calc-result').classList.add('show');
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
</body>
|
|||
|
|
</html>
|
|||
|
|
|