:root{
  --bg:#eef2f6; --surface:#ffffff; --surface-2:#f8fafc;
  --ink:#0f172a; --muted:#64748b; --line:#e2e8f0;
  --teal:#0f766e; --teal-2:#0d9488; --sky:#0ea5e9;
  --contra:#7f1d1d; --high:#dc2626; --moderate:#d97706; --low:#2563eb; --info:#94a3b8; --ok:#059669;
  --shadow:0 1px 2px rgba(15,23,42,.06),0 8px 24px rgba(15,23,42,.06);
  --radius:14px;
}
*{box-sizing:border-box}
html,body{margin:0}
body{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--ink);
  font-size:14.5px;line-height:1.5;-webkit-font-smoothing:antialiased}

/* top bar */
.topbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:.8rem 1.4rem;background:linear-gradient(120deg,#0f766e,#0d9488);color:#fff;position:sticky;top:0;z-index:10}
.brand{display:flex;align-items:center;gap:.7rem}
.logo{font-size:1.5rem;line-height:1;filter:drop-shadow(0 1px 2px rgba(0,0,0,.25))}
.brand-name{font-weight:800;font-size:1.15rem;letter-spacing:-.01em}
.brand-tag{font-size:.74rem;opacity:.85;margin-top:-2px}
.pill-demo{font-size:.64rem;font-weight:700;letter-spacing:.06em;background:rgba(255,255,255,.16);
  border:1px solid rgba(255,255,255,.3);padding:.3rem .6rem;border-radius:999px;white-space:nowrap}

/* layout */
.layout{display:grid;grid-template-columns:380px 1fr;gap:1.4rem;max-width:1280px;margin:1.4rem auto;padding:0 1.4rem;align-items:start}
@media(max-width:920px){.layout{grid-template-columns:1fr}}

/* builder */
.builder{display:flex;flex-direction:column;gap:1rem;position:sticky;top:74px}
@media(max-width:920px){.builder{position:static}}
.step{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:1rem 1.1rem;box-shadow:var(--shadow)}
.step-head{display:flex;align-items:center;gap:.55rem;margin-bottom:.7rem}
.step-head h2{font-size:1rem;margin:0;font-weight:700}
.step-num{width:1.5rem;height:1.5rem;border-radius:50%;background:var(--teal);color:#fff;display:grid;place-items:center;font-size:.8rem;font-weight:700}
.hint{margin-left:auto;font-size:.74rem;color:var(--muted)}

.patient-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem;max-height:380px;overflow-y:auto;overflow-x:hidden;padding-right:.4rem}
.pcard{text-align:left;border:1px solid var(--line);background:var(--surface-2);border-radius:10px;padding:.55rem .6rem;cursor:pointer;transition:.12s}
.pcard:hover{border-color:var(--teal-2);transform:translateY(-1px)}
.pcard.sel{border-color:var(--teal);background:#f0fdfa;box-shadow:0 0 0 2px rgba(13,148,136,.18)}
.pcard .pc-top{font-weight:700;font-size:.82rem}
.pcard .pc-labs{font-size:.7rem;color:var(--muted);margin-top:2px}
.pcard{min-width:0}
.pcard .pc-cond{font-size:.68rem;color:var(--teal-2);margin-top:3px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:1.3}
.pcard .badge-renal{color:var(--high);font-weight:600}

.link-btn{background:none;border:none;color:var(--teal-2);cursor:pointer;font-size:.78rem;padding:.5rem 0 0;font-weight:600}
.manual-panel{margin-top:.5rem}
.manual-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem}
.manual-grid label{min-width:0}
.manual-grid input,.manual-grid select{width:100%;min-width:0;box-sizing:border-box}
.manual-grid label{display:flex;flex-direction:column;font-size:.7rem;color:var(--muted);gap:.2rem}
.manual-grid input,.manual-grid select{padding:.35rem .4rem;border:1px solid var(--line);border-radius:8px;font-size:.85rem;font-family:inherit}

.search{width:100%;padding:.5rem .6rem;border:1px solid var(--line);border-radius:9px;font-size:.9rem;font-family:inherit}
.search:focus{outline:none;border-color:var(--teal-2);box-shadow:0 0 0 3px rgba(13,148,136,.12)}
.chips{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.55rem}
.chip{display:inline-flex;align-items:center;gap:.4rem;background:#ecfdf5;border:1px solid #a7f3d0;color:#065f46;
  padding:.28rem .55rem;border-radius:999px;font-size:.8rem;font-weight:600}
.chip button{background:none;border:none;color:#047857;cursor:pointer;font-size:.95rem;line-height:1;padding:0}
.chip.cond{background:#eff6ff;border-color:#bfdbfe;color:#1e40af}
.chip.cond button{color:#2563eb}
.baseline-row{display:flex;flex-wrap:wrap;gap:.35rem;margin-bottom:.55rem}
.base-chip{font-size:.72rem;background:var(--surface-2);border:1px dashed var(--line);color:var(--muted);padding:.22rem .5rem;border-radius:999px}
.quick{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem;margin-top:.7rem;font-size:.74rem;color:var(--muted)}
.quick-btn{font-size:.74rem;border:1px solid var(--line);background:var(--surface-2);border-radius:999px;padding:.25rem .55rem;cursor:pointer;color:var(--ink)}
.quick-btn:hover{border-color:var(--teal-2);color:var(--teal)}

/* report */
.report{min-height:60vh}
.empty{background:var(--surface);border:1px dashed var(--line);border-radius:var(--radius);padding:3.5rem 2rem;text-align:center;color:var(--muted)}
.empty-icon{font-size:2.5rem;color:#cbd5e1}
.empty h3{color:var(--ink);margin:.6rem 0 .3rem}

.banner{border-radius:var(--radius);padding:1.2rem 1.3rem;color:#fff;box-shadow:var(--shadow);margin-bottom:1rem}
.banner.minimal{background:linear-gradient(120deg,#475569,#64748b)}
.banner.low{background:linear-gradient(120deg,#2563eb,#3b82f6)}
.banner.moderate{background:linear-gradient(120deg,#d97706,#f59e0b)}
.banner.high{background:linear-gradient(120deg,#b91c1c,#dc2626)}
.banner-top{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap}
.band-tag{font-weight:800;letter-spacing:.04em;text-transform:uppercase;font-size:.78rem;background:rgba(255,255,255,.2);padding:.25rem .6rem;border-radius:999px}
.score{margin-left:auto;font-size:.8rem;opacity:.9}
.headline{font-size:1.18rem;font-weight:700;margin-top:.55rem;line-height:1.3}

.compare-toggle{display:flex;align-items:center;gap:.6rem;background:var(--surface);border:1px solid var(--line);
  border-radius:999px;padding:.5rem .9rem;margin-bottom:.9rem;box-shadow:var(--shadow)}
.compare-label{font-weight:600;font-size:.85rem}
.compare-counts{margin-left:auto;font-size:.78rem;color:var(--muted)}
.switch{position:relative;display:inline-block;width:40px;height:22px}
.switch input{opacity:0;width:0;height:0}
.slider{position:absolute;inset:0;background:#cbd5e1;border-radius:999px;transition:.2s;cursor:pointer}
.slider:before{content:"";position:absolute;height:16px;width:16px;left:3px;top:3px;background:#fff;border-radius:50%;transition:.2s}
.switch input:checked+.slider{background:var(--teal-2)}
.switch input:checked+.slider:before{transform:translateX(18px)}

.static-note{background:#fff7ed;border:1px solid #fed7aa;color:#9a3412;border-radius:10px;padding:.6rem .8rem;font-size:.82rem;margin-bottom:.9rem}

.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:1rem 1.1rem;margin-bottom:1rem;box-shadow:var(--shadow)}
.panel-title{margin:0 0 .7rem;font-size:.82rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}

/* gauges */
.gauges{display:flex;flex-direction:column;gap:.7rem}
.gauge .g-top{display:flex;align-items:baseline;gap:.5rem;font-size:.85rem;margin-bottom:.25rem}
.gauge .g-name{font-weight:700}
.gauge .g-level{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.03em}
.gauge .g-contrib{margin-left:auto;font-size:.74rem;color:var(--muted);text-align:right}
.bar{height:9px;background:#eef2f6;border-radius:999px;overflow:hidden}
.bar>span{display:block;height:100%;border-radius:999px}
.lv-high{color:var(--high)} .bar .lv-high{background:var(--high)}
.lv-moderate{color:var(--moderate)} .bar .lv-moderate{background:var(--moderate)}
.lv-low{color:var(--low)} .bar .lv-low{background:var(--low)}

/* risk graph (nodes -> edges; rendered from engine data only) */
.rgraph{width:100%;height:auto;display:block}
.rgraph .col-h{font-size:11px;font-weight:700;fill:var(--muted);text-anchor:middle;letter-spacing:.04em}
.rgraph .edge{fill:none;stroke:#cbd5e1;stroke-width:1.6;opacity:.6}
.rgraph .edge:hover{opacity:1;stroke-width:2.8}
.rgraph .edge.e-high{stroke:var(--high)}
.rgraph .edge.e-moderate{stroke:var(--moderate)}
.rgraph .edge.e-low{stroke:var(--low)}
.rgraph .gnode rect{fill:var(--surface-2);stroke:var(--line);stroke-width:1.2}
.rgraph .gnode text{font-size:11px;fill:var(--ink);text-anchor:middle;dominant-baseline:central}
.rgraph .gnode:hover rect{stroke-width:2}
.rgraph .n-drug rect{fill:#ecfdf5;stroke:#a7f3d0}
.rgraph .n-cons rect{fill:#f8fafc;stroke:var(--line)}
.rgraph .n-burden.lv-high rect{fill:#fef2f2;stroke:var(--high)}
.rgraph .n-burden.lv-moderate rect{fill:#fff7ed;stroke:var(--moderate)}
.rgraph .n-burden.lv-low rect{fill:#eff6ff;stroke:var(--low)}
.graph-legend{font-size:.72rem;color:var(--muted);margin-top:.6rem;line-height:1.5}

/* ---- dashboard hierarchy: scream convergence, whisper isolated-moderate ---- */
.banner-counts{margin-top:.5rem;font-size:.82rem;opacity:.95}
.banner-counts b{font-size:1rem}
/* hero = the convergence centrepiece */
.hero{border:1px solid var(--teal);border-radius:var(--radius);padding:.85rem;margin-bottom:1.1rem;
  background:linear-gradient(180deg,#f0fdfa,#ffffff);box-shadow:var(--shadow)}
.hero-label{font-weight:800;color:var(--teal);font-size:.92rem;margin:.1rem .15rem .6rem}
.hero .panel{margin-bottom:.7rem;box-shadow:none}
.hero-row{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}
.hero-row .panel{margin-bottom:0}
@media(max-width:680px){.hero-row{grid-template-columns:1fr}}
/* primary findings tier */
.tier-title{font-size:.98rem;font-weight:700;margin:.3rem 0 .6rem}
.tier-sub{font-weight:500;color:var(--muted);font-size:.8rem;display:block;margin-top:1px}
/* whispered, collapsed sections (static-also, FAERS) */
.whisper{margin-top:1rem;border:1px solid var(--line);border-radius:10px;background:var(--surface-2)}
.whisper>summary{cursor:pointer;padding:.6rem .9rem;font-size:.82rem;color:var(--muted);font-weight:600;list-style:none}
.whisper>summary::-webkit-details-marker{display:none}
.whisper>summary::before{content:"▸  "}
.whisper[open]>summary::before{content:"▾  "}
.whisper>.findings{padding:.1rem .7rem .7rem}
.findings.compact .finding{box-shadow:none;border-left-width:3px;padding:.5rem .7rem}
.findings.compact .f-title{font-size:.86rem;margin:.3rem 0 .2rem}
.findings.compact .f-row .lbl{display:none}

.context-body{display:flex;flex-wrap:wrap;gap:.5rem}
.lab-tile{background:var(--surface-2);border:1px solid var(--line);border-radius:10px;padding:.45rem .7rem;font-size:.82rem}
.lab-tile b{font-size:1rem}
.lab-tile.abn{border-color:#fecaca;background:#fef2f2;color:#991b1b}

/* findings */
.findings{display:flex;flex-direction:column;gap:.7rem}
.finding{background:var(--surface);border:1px solid var(--line);border-left-width:4px;border-radius:12px;padding:.85rem 1rem;box-shadow:var(--shadow)}
.finding.s-contraindicated{border-left-color:var(--contra)}
.finding.s-high{border-left-color:var(--high)}
.finding.s-moderate{border-left-color:var(--moderate)}
.finding.s-low{border-left-color:var(--low)}
.finding.s-info{border-left-color:var(--info)}
.f-top{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.sev-pill{font-size:.66rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;padding:.2rem .5rem;border-radius:999px;color:#fff}
.sev-contraindicated{background:var(--contra)} .sev-high{background:var(--high)}
.sev-moderate{background:var(--moderate)} .sev-low{background:var(--low)} .sev-info{background:var(--info)}
.axis-tag{font-size:.66rem;color:var(--muted);background:var(--surface-2);border:1px solid var(--line);padding:.18rem .45rem;border-radius:999px}
.miss-badge{margin-left:auto;font-size:.66rem;font-weight:700;color:#9a3412;background:#fff7ed;border:1px solid #fed7aa;padding:.2rem .5rem;border-radius:999px}
.f-title{font-weight:700;margin:.5rem 0 .35rem;font-size:.98rem}
.f-drugs{font-size:.78rem;color:var(--teal-2);font-weight:600;margin-bottom:.4rem}
.f-row{font-size:.84rem;margin:.22rem 0;color:#334155}
.f-row .lbl{color:var(--muted);font-weight:600;margin-right:.35rem}
.f-context{background:#f0fdfa;border:1px solid #99f6e4;color:#115e59;border-radius:8px;padding:.4rem .6rem;font-size:.8rem;margin-top:.45rem}
.f-evidence{font-size:.7rem;color:var(--muted);margin-top:.45rem}
.f-conf{display:inline-block;font-size:.62rem;font-weight:700;text-transform:uppercase;border:1px solid var(--line);border-radius:999px;padding:.1rem .4rem;margin-left:.3rem}
.f-conf.signal{color:#7c3aed;border-color:#ddd6fe;background:#f5f3ff}

/* static comparison mode */
body.static-mode .df-only{display:none}
body:not(.static-mode) .df-hide-in-full{display:none}
body.static-mode .finding:not(.from-static){display:none}

.footer{text-align:center;color:var(--muted);font-size:.74rem;padding:1.4rem;border-top:1px solid var(--line);margin-top:1rem}
.erratum{display:inline-block;margin-top:.45rem;color:#9a3412;font-style:italic;font-weight:600}

/* ---- completeness: unknown != safe (25/09/2026) ---- */
.banner.indeterminate{background:linear-gradient(120deg,#6d28d9,#7c3aed)}
.banner-incomplete{margin-top:.6rem;padding:.45rem .65rem;border-radius:9px;background:rgba(255,255,255,.16);font-size:.8rem}
.finding.s-unknown{border-left:4px solid #7c3aed;background:#faf5ff}
.sev-pill.sev-unknown{background:#ede9fe;color:#5b21b6}
.miss-badge.unk{background:#ede9fe;color:#5b21b6}
.lab-tile .lab-when{display:block;font-size:.66rem;color:var(--muted);margin-top:2px}
.lab-tile.stale{border-color:#7c3aed;background:#faf5ff}
.lab-tile.stale .lab-when{color:#6d28d9;font-weight:600}
/* ---- simulated withdrawal ---- */
.wd-note{font-size:.78rem;color:var(--muted);margin:0 0 .6rem}
.wd-item{border:1px solid var(--line);border-radius:10px;padding:.45rem .7rem;margin-bottom:.45rem;background:var(--surface-2)}
.wd-item summary{cursor:pointer;display:flex;flex-wrap:wrap;gap:.5rem;align-items:baseline;font-size:.86rem}
.wd-meta{font-size:.76rem;color:var(--muted)}
.wd-item ul{margin:.5rem 0 .2rem;padding-left:1.1rem;font-size:.8rem}
.wd-item li{margin:.15rem 0}
.wd-gone{font-size:.68rem;font-weight:700;color:var(--ok);text-transform:uppercase;margin-right:.3rem}
.wd-ch{font-size:.68rem;font-weight:700;color:var(--moderate);margin-right:.3rem}
.wd-none{font-size:.78rem;color:var(--muted);margin-top:.4rem}
