*{box-sizing:border-box}
:root{
 --bg:#edf3f8;--card:#fff;--text:#17202a;--muted:#6b7280;--line:#d9e0e7;
 --accent:#2563d4;--soft:#eef5ff;--ok:#eaf7ee;--warn:#fff4d8;--bad:#fff0f0;
 --nav:#0f1c2b;--monitor:#08111b;--monitor-panel:#111c28;
}
body{margin:0;background:var(--bg);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--text)}
.wrap{max-width:1440px;margin:0 auto;padding:0 22px 18px}
.card{background:var(--card);border-radius:10px;padding:14px;margin:10px 0;box-shadow:0 12px 30px #10203310;border:1px solid #e7edf4}
h1,h2,h3{margin-top:0}.muted{color:var(--muted)}.small{font-size:12px;color:var(--muted)}
button{border:0;border-radius:9px;padding:10px 14px;cursor:pointer;font-weight:650}
.primary{background:linear-gradient(180deg,#2f7bf4,#1663dc);color:#fff;box-shadow:0 10px 22px #1a65d733}.secondary{background:#eef2f6;color:#26313d}.ghost{background:#fff;border:1px solid var(--line);color:#25303b}
.hidden{display:none}
.topbar{display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap}
.badge{display:inline-block;padding:5px 8px;border-radius:999px;font-size:11px;background:#eef1f4;margin:2px}
.badge.ok{background:var(--ok);color:#28623d}.badge.warn{background:var(--warn);color:#7a5900}.badge.bad{background:var(--bad);color:#9a3a37}
.badge.hidden{display:none}
.navbar{background:radial-gradient(circle at 80% 0,#29405c 0,#132234 34%,#0d1723 100%);color:#fff;border-radius:0;padding:13px 26px;margin:0 -22px 10px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;box-shadow:0 8px 28px #0b172540}
.navbar-title{font-size:21px;font-weight:850}
.navbar-tagline{font-size:12px;color:#8291a3;margin-top:2px}
.navbar-actions{display:flex;align-items:center;gap:10px}
.navbar-link{color:#fff;background:transparent;border:0;border-radius:9px;padding:8px 10px;font-size:13px;font-weight:650;text-decoration:none}
.navbar-link:hover{background:rgba(255,255,255,.16)}
.case-meta{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}
.case-meta-left{display:flex;gap:14px;align-items:flex-start}
.case-badge{background:linear-gradient(180deg,#eaf3ff,#dfeeff);color:var(--accent);border-radius:8px;padding:10px 15px;text-align:center;min-width:80px}
.case-badge span{display:block;font-size:11px;font-weight:650;opacity:.8}
.case-badge b{display:block;font-size:28px;line-height:1}
.case-meta h1{font-size:24px;margin:2px 0 5px}
.case-prompt{margin-left:auto;min-width:260px;background:linear-gradient(135deg,#eaf2ff,#f5f8fc);border:1px solid #deebf8;border-radius:8px;padding:15px 18px;color:#10294a;font-weight:750;line-height:1.55}
.case-tags{display:flex;gap:6px;flex-wrap:wrap}
.case-tag{background:#607086;color:#fff;border-radius:7px;padding:6px 12px;font-size:12px;font-weight:650}
.case-stepper{position:relative;display:flex;justify-content:space-between;gap:4px;padding:2px 0;overflow-x:auto}
.stepper-card{overflow:hidden}
.case-stepper::before{content:'';position:absolute;top:22px;left:5%;right:5%;height:2px;background:var(--line);z-index:0}
.stepper-item{flex:1;min-width:90px;text-align:center;position:relative;z-index:1}
.stepper-circle{width:32px;height:32px;border-radius:50%;background:#f6faff;border:2px solid #c4d4e7;color:#3c5169;display:flex;align-items:center;justify-content:center;margin:0 auto;font-weight:800;font-size:13px}
.stepper-item.active .stepper-circle{background:var(--accent);border-color:var(--accent);color:#fff}
.stepper-item.done .stepper-circle{background:var(--ok);border-color:#2f8a4e;color:#2f8a4e}
.stepper-label{margin-top:6px;font-size:11px;font-weight:650;color:var(--muted)}
.stepper-item.active .stepper-label{color:var(--accent)}
.stepper-sub{font-size:10px;color:#607086;margin:3px auto 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:120px}
.case-layout{display:block}
.case-main{display:block}
.grid{display:grid;grid-template-columns:1.3fr .7fr;gap:12px}
.patient-monitor-card{background:var(--monitor);color:#eef6ff;border-color:#203041;box-shadow:0 18px 38px #0b172538}
.monitor-title-row{display:flex;align-items:center;gap:14px;margin-bottom:8px}
.monitor-title-row h2{font-size:17px;margin:0;color:#75aaff}
.monitor-title-row span{font-size:13px;color:#8db5e9}
.patient-monitor-grid{display:grid;grid-template-columns:1fr;gap:10px;align-items:stretch}
.patient-panel{background:linear-gradient(180deg,#162332,#101b27);border:1px solid #223348;border-radius:8px;padding:12px}
.patient-header{display:flex;gap:10px;align-items:center;margin-bottom:6px}
.patient-avatar{width:38px;height:38px;border-radius:50%;background:#e7f0fb;color:#fff;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.patient-name{font-weight:850;font-size:19px;color:#fff}
.patient-sub{color:#c7d3e0;font-size:12px;margin-top:3px}
.patient-facts{display:grid;grid-template-columns:82px 1fr;gap:0;margin:10px 0 0;border-top:1px solid #304257}
.patient-facts dt,.patient-facts dd{margin:0;padding:5px 0;border-bottom:1px solid #304257;font-size:12px}
.patient-facts dt{color:#9cafc4}.patient-facts dd{color:#f2f7ff;font-weight:650}
.patient-monitor-card .small{color:#b8c7d8;margin-bottom:0}
.monitor{background:transparent;color:#fff;border-radius:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.mbox{background:#101a26;border:1px solid #233449;border-radius:8px;padding:8px;text-align:center;min-height:62px;display:flex;flex-direction:column;align-items:center;justify-content:center}.mbox span{display:block;font-size:10px;color:#a8b6c2}.mbox b{font-size:21px;line-height:1.1}
.mval-ok{color:#4ade80}.mval-warn{color:#fbbf24}.mval-bad{color:#f87171}
.stage-card{padding:0;overflow:hidden}
.stage-card-head{display:flex;align-items:center;gap:12px;background:linear-gradient(90deg,#edf6ff,#f7fbff);padding:12px 18px;border-bottom:1px solid #e0ebf6}
.stage-number{width:38px;height:38px;border-radius:50%;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:850;flex-shrink:0}
.stage-card-head h3{margin:0;font-size:20px;color:#102d5a}
.stage-pill,.stage-chip{margin-left:auto;background:#fff;border-radius:999px;padding:6px 12px;font-size:12px;font-weight:750;color:#163052}
.stage-chip{margin-left:0;background:#dcebff;color:#2364c8}
.stage-card .callout,.answer-wrap,.action-row,.tip-box,.tutor-panel{margin-left:22px;margin-right:22px}
.stage-card .callout{margin-top:12px}
.answer-wrap{position:relative;margin-top:12px}
textarea{width:100%;min-height:96px;border:1px solid #cbd8e8;border-radius:8px;padding:12px 14px 28px;font-size:15px;resize:vertical}
#answerCount{position:absolute;right:14px;bottom:10px;color:#8796a8;font-size:12px}
.action-row{margin-top:10px;display:flex;gap:8px;flex-wrap:wrap}
.action-row button{min-width:136px;padding-top:9px;padding-bottom:9px}
.tip-box{margin-top:12px;margin-bottom:12px;background:#f5f9fe;border:1px solid #e1ebf5;border-radius:8px;padding:10px 12px;display:flex;gap:12px;align-items:flex-start;color:#53677d;font-size:12px;line-height:1.45}
.tip-box b{color:#164891}
.tutor-panel{border-top:1px solid #e5edf6;padding-top:12px;margin-bottom:16px}
.tutor-panel h3{font-size:15px;margin-bottom:8px;color:#102d5a}
.tutor-card{display:none}
.ai{background:var(--soft);border-left:4px solid var(--accent);border-radius:9px;padding:14px;line-height:1.65}
.ai.classification-pass{background:var(--ok);border-left-color:#2f8a4e}
.ai.classification-partial{background:var(--warn);border-left-color:#c99a1f}
.ai.classification-misconception{background:var(--bad);border-left-color:#c0524f}
.ai.classification-unclassifiable{background:#f1f1f3;border-left-color:#8a94a0}
.callout{background:#fafafa;border:1px dashed #cfd7df;border-radius:10px;padding:12px;line-height:1.55}
.stage-card .callout{background:#fff;border:0;padding:0;font-weight:750;color:#162b45}
.case-top-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:start}
.info-tabs{display:flex;gap:4px;flex-wrap:wrap;border-bottom:1px solid var(--line);margin-bottom:10px}
.info-tab{background:transparent;border-radius:8px 8px 0 0;padding:8px 14px;font-size:13px;color:var(--muted)}
.info-tab.active{background:var(--soft);color:var(--accent)}
.info-row{display:flex;justify-content:space-between;align-items:center;width:100%;background:#f1f4f7;border:1px solid #d7dde4;border-radius:8px;padding:9px 12px;margin-bottom:6px;font-size:13px;text-align:left}
.info-row.seen{background:var(--ok);border-color:#b9dec4}
.info-row.auto-open{cursor:default}
.info-row-caret{color:var(--muted)}
.info-row-detail{background:#f8fafc;border:1px solid var(--line);border-radius:8px;padding:10px 12px;margin:-2px 0 8px;font-size:13px;line-height:1.5}
.lab-table{width:100%;border-collapse:collapse}
.lab-table td{padding:6px 4px;border-bottom:1px solid var(--line)}
.lab-table tr:last-child td{border-bottom:none}
.lab-table td:first-child{color:var(--muted)}
.lab-table td:last-child{text-align:right;width:20px}
.lab-arrow.up{color:#c0524f}.lab-arrow.down{color:#2563d4}
.panel{background:#f8fafc;border:1px solid var(--line);border-radius:10px;padding:12px;white-space:pre-line;min-height:74px}
.trajectory-charts{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.trajectory-chart{background:#fafbfc;border:1px solid var(--line);border-radius:10px;padding:8px}
.chart-title{font-size:12px;font-weight:650;margin-bottom:2px}
.chart-svg{width:100%;height:auto;display:block}
.chart-line{fill:none;stroke-width:2}
.chart-dot{fill:#fff;stroke:#9aa7b4;stroke-width:1.5;cursor:pointer}
.chart-dot.active{fill:var(--accent);stroke:var(--accent)}
.chart-tick{font-size:8px;fill:var(--muted)}
.chart-axis{font-size:8px;fill:var(--muted)}
.kpi{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.kpi div{background:#f8fafc;border:1px solid var(--line);border-radius:10px;padding:10px}
.log{font-size:13px;line-height:1.5}.log div{padding:7px 0;border-bottom:1px solid #edf0f3}
.domain-accordion{border:1px solid var(--line);border-radius:12px;margin:8px 0;overflow:hidden;background:#fafbfc}
.domain-accordion-header{width:100%;display:flex;align-items:center;gap:8px;justify-content:flex-start;background:transparent;border-radius:0;padding:12px 14px;font-weight:700;text-align:left}
.domain-accordion-label{flex:1}
.domain-accordion-caret{transition:transform .15s;color:var(--muted)}
.domain-accordion.open .domain-accordion-caret{transform:rotate(180deg)}
.domain-accordion-body{display:none;padding:0 14px 14px}
.domain-accordion.open .domain-accordion-body{display:block}
.concept-category{border:1px solid var(--line);border-radius:11px;margin:8px 0;overflow:hidden;background:#fff}
.concept-category-header{width:100%;display:flex;align-items:center;gap:8px;background:transparent;border-radius:0;padding:11px 13px;font-weight:700;text-align:left}
.concept-category-label{flex:1}
.concept-category-caret{transition:transform .15s;color:var(--muted)}
.concept-category.open .concept-category-caret{transform:rotate(180deg)}
.concept-category-body{display:none;padding:0 13px 13px}
.concept-category.open .concept-category-body{display:block}
.concept{border:1px solid var(--line);border-radius:10px;margin:8px 0;overflow:hidden;transition:box-shadow .3s,border-color .3s}
.concept.highlight{border-color:var(--accent);box-shadow:0 0 0 3px #2563d433}
.concept-header{width:100%;display:flex;align-items:center;gap:8px;background:#fff;border-radius:0;padding:10px 12px;font-weight:650;text-align:left}
.concept-header-label{flex:1}
.concept-header-caret{transition:transform .15s;color:var(--muted);font-size:13px}
.concept.open .concept-header-caret{transform:rotate(180deg)}
.concept-body{display:none;padding:0 12px 12px}
.concept.open .concept-body{display:block}
.concept-link{cursor:pointer}
.concept-map-node rect{fill:#eef1f4;stroke:#aab4bf;stroke-width:1.5}
.concept-map-node text{font-size:12px;fill:var(--text);font-weight:650}
.concept-map-node.external rect{fill:#f8fafc;stroke:#aab4bf;stroke-width:1.5;stroke-dasharray:5 4}
.concept-map-node.external text{fill:#617082}
.concept-map-node .concept-map-domain{font-size:9px;fill:#8a97a3;font-weight:600}
.concept-map-node.status-asked rect{stroke:var(--accent);stroke-width:2.5;fill:var(--soft)}
.concept-map-node.status-pass rect{stroke:#2f8a4e;stroke-width:2.5;fill:var(--ok)}
.concept-map-node.status-unstable rect{stroke:#c99a1f;stroke-width:2.5;fill:var(--warn)}
/* Higher-specificity duplicates so status always wins over a hemodynamic
   node's decorative .tone-* color, regardless of stylesheet order — with
   equal specificity the tone rule (declared later, below) would otherwise
   silently override status and the pass/asked colors would never show. */
.concept-map-node.hemodynamic-node.status-asked rect{stroke:var(--accent);stroke-width:2.5;fill:var(--soft)}
.concept-map-node.hemodynamic-node.status-pass rect{stroke:#2f8a4e;stroke-width:2.5;fill:var(--ok)}
.concept-map-node.hemodynamic-node.status-unstable rect{stroke:#c99a1f;stroke-width:2.5;fill:var(--warn)}
.concept-map-edge{stroke:#8a97a3;stroke-width:1.5;fill:none}
.concept-map-edge.external{stroke:#aab4bf;stroke-dasharray:5 4}
.concept-map-edge.formula{stroke:#738293;stroke-width:1.7;fill:none}
.concept-map-edge.active{stroke:var(--accent);stroke-width:2.6}
.concept-map-edge.formula.active{stroke:var(--accent);stroke-width:2.8}
.concept-map-scroll{overflow-x:auto}
.hemodynamic-map{min-width:720px}
.hemodynamic-node rect{stroke-width:1.6;filter:drop-shadow(0 8px 16px rgba(18,31,48,.08))}
/* "core" = a real, gradeable concept (MAP/CO/SV/SVR) — stays visually
   neutral until conversation gives it a status (asked/pass/unstable above).
   "supporting"/"determinant" = decorative context nodes (HR, Preload, ...)
   that are never graded, so they keep a fixed identity color permanently. */
.hemodynamic-node.tone-core rect{fill:#eef1f4;stroke:#aab4bf}
.hemodynamic-node.tone-supporting rect{fill:#f8fafc;stroke:#c7d0da}
.hemodynamic-node.tone-determinant rect{fill:#fff8e8;stroke:#f6bd58}
.hemodynamic-node.supporting text{fill:#2f3b48}
.hemodynamic-node .concept-map-main-label{font-size:18px;font-weight:800;fill:#14253d}
.hemodynamic-node .concept-map-sub-label{font-size:12px;font-weight:650;fill:#405066}
.concept-map-explain{margin-top:14px;border:1px solid var(--line);border-radius:10px;background:#fff;padding:12px 14px}
.concept-map-explain-title{font-weight:750;color:#14253d;margin-bottom:6px}
.concept-map-explain p{margin:0;color:#405066;line-height:1.65;font-size:13px}
.concept-map-empty{min-height:150px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;border:1px dashed #c7d0da;border-radius:10px;background:#fff;padding:24px}
.concept-map-empty-title{font-weight:750;color:#14253d;margin-bottom:8px}
.concept-map-empty p{max-width:560px;margin:0;color:#617082;line-height:1.7;font-size:13px}
#conceptMap{overflow-x:auto;background:#f7f9fb;border:1px solid var(--line);border-radius:10px;padding:14px}
#conceptMap svg{display:block}
.badge.concept-link{background:var(--soft);color:#164891;border:1px solid #cbdcf5}
.concept-ai-panel{margin-top:8px;padding-top:8px;border-top:1px dashed var(--line)}
.concept-ai-thread{display:flex;flex-direction:column;gap:6px;max-height:260px;overflow-y:auto}
.concept-ai-thread.hidden{display:none}
.concept-ai-bubble{border-radius:9px;padding:8px 10px;font-size:13px;line-height:1.5}
.concept-ai-bubble.user{background:#f1f4f7;align-self:flex-end;max-width:85%}
.concept-ai-bubble.assistant{background:var(--soft);border-left:3px solid var(--accent);max-width:100%}
.concept-ai-bubble.assistant.classification-pass{background:var(--ok);border-left-color:#2f8a4e}
.concept-ai-bubble.assistant.classification-partial{background:var(--warn);border-left-color:#c99a1f}
.concept-ai-bubble.assistant.classification-misconception{background:var(--bad);border-left-color:#c0524f}
.concept-ai-bubble.assistant.classification-unclassifiable{background:#f1f1f3;border-left-color:#8a94a0}
.concept-ai-input{flex:1;border:1px solid #cbd3db;border-radius:9px;padding:8px 10px;font-size:13px}
.level-gauge{display:flex;gap:6px}
.level-dot{width:28px;height:28px;border-radius:999px;background:#eef1f4;border:1px solid var(--line)}
.level-dot.filled{background:var(--accent);border-color:var(--accent)}
.current-focus-label{min-height:16px}
.current-question-row{display:flex;gap:12px;align-items:flex-start}
.current-question-avatar{width:60px;height:60px;border-radius:50%;background:var(--soft);display:flex;align-items:center;justify-content:center;font-size:28px;flex-shrink:0;overflow:hidden}
.current-question-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.current-question-body{flex:1;min-width:0}
.current-question-speaker{font-size:12px;font-weight:700;color:var(--muted);margin-bottom:6px}
.current-feedback{color:#3c4a58;font-size:13px;margin-bottom:8px;line-height:1.6}
.current-feedback.current-feedback-intro{font-size:18px;font-weight:400;color:var(--text);line-height:1.6}
.current-question-text{font-size:18px;font-weight:400;line-height:1.6;color:var(--text)}
.current-pending-answer{margin-top:12px;background:#f1f4f7;border-radius:8px;padding:9px 11px;font-size:13px;color:#3c4a58}
.current-thinking{margin-top:12px;color:var(--muted);font-size:13px}
.answer-row{display:flex;gap:12px;align-items:flex-start}
.answer-avatar{width:60px;height:60px;border-radius:50%;background:var(--soft);display:flex;align-items:center;justify-content:center;font-size:26px;flex-shrink:0;overflow:hidden}
.answer-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.answer-body{flex:1;min-width:0}
.history-toggle{width:100%;display:flex;justify-content:space-between;align-items:center;background:#eef2f6;color:#26313d}
.history-toggle-caret{transition:transform .15s}
.history-toggle.open .history-toggle-caret{transform:rotate(180deg)}
.visualizer-title{font-weight:750;font-size:14px;color:#14253d}
.visualizer-svg{width:100%;max-width:360px;height:auto;display:block;margin:10px 0}
.lv-shape{fill:#eef5ff;stroke:#2563d4;stroke-width:1.5}
.aorta-shape{fill:#f8fafc;stroke:#aab4bf;stroke-width:1.5}
.visualizer-label{font-size:11px;font-weight:650;fill:#26313d}
.ejection-arrow{stroke:#2563d4;stroke-width:6;transition:stroke-width .3s ease,x2 .3s ease}
.visualizer-slider-row{margin-top:8px}
.visualizer-slider-row input[type=range]{width:100%;margin-top:6px;accent-color:#2563d4}
.visualizer-slider-scale{display:flex;justify-content:space-between;margin-top:2px}
.visualizer-sv-row{margin-top:14px}
.sv-bar-track{background:#eef1f4;border-radius:999px;height:14px;margin:6px 0;overflow:hidden}
.sv-bar-fill{background:linear-gradient(90deg,#2f7bf4,#1663dc);height:100%;border-radius:999px;transition:width .3s ease}
.sv-value{font-weight:750;font-size:15px;color:#14253d}
.concept-map-node.force-active rect{stroke:var(--accent);stroke-width:2.5}
@media(max-width:1180px){.patient-monitor-grid{grid-template-columns:1fr}.patient-panel{grid-column:auto}}
@media(max-width:950px){.grid{grid-template-columns:1fr}.kpi{grid-template-columns:1fr 1fr}.case-prompt{min-width:100%;margin-left:0}.navbar{margin-left:-14px;margin-right:-14px}.wrap{padding-left:14px;padding-right:14px}.case-top-grid{grid-template-columns:1fr}}
@media(max-width:560px){.trajectory-charts{grid-template-columns:1fr}.kpi{grid-template-columns:1fr}.patient-monitor-grid{grid-template-columns:1fr}.monitor{grid-template-columns:1fr}.stage-card .callout,.answer-wrap,.action-row,.tip-box,.tutor-panel{margin-left:16px;margin-right:16px}.action-row button{width:100%}}
