:root{
  --bg:#07090c;--side:#0b0e13;--side2:#0d1218;--line:#1b232d;--line2:#243240;
  --text:#e8eef5;--muted:#91a6b9;--muted2:#a9bfd2;
  --green:#2fe36b;--cyan:#33d3e8;--yellow:#ffd23c;--red:#ff4d4d;--orange:#ff9a2e;
  --blue:#3f8fe8;--paw:#ffcf45;--flow:#46e85a;--vt:#4ec3ff;
  --cream:#eceff0;--cream2:#d4d7d6;--cream3:#a9adaa;--metal:#8f938f;
  --grey:#e2e4e2;--grey2:#c2c4c1;--grey3:#93968f;
  --devBrandBlue:#0a5ca3;
  --dockH:118px;--sideW:300px;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:var(--bg);color:var(--text);
  font-family:"Segoe UI Variable Text","Segoe UI",Roboto,system-ui,Arial,sans-serif;overflow:hidden;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
button,input,select{font-family:inherit}
body.student .teacherOnly{display:none!important}
body.student #side{display:none!important}
body.student #dock{display:none!important}
body.student #app{grid-template-columns:0 1fr;grid-template-rows:1fr;grid-template-areas:"side stage"}
body.student #overviewBtn{display:none!important}

/* ---------- Login ---------- */
#login{position:fixed;inset:0;z-index:999;display:flex;align-items:center;justify-content:center;
  background:radial-gradient(circle at 50% 20%,#13212e,#05090d 60%)}
.loginCard{width:min(820px,92vw);display:grid;grid-template-columns:1fr 1fr;gap:0;
  background:rgba(10,18,26,.9);border:1px solid #213548;border-radius:20px;overflow:hidden;
  box-shadow:0 40px 120px #000}
.loginLeft{padding:34px;background:linear-gradient(160deg,#0f1d29,#0a141d)}
.loginRight{padding:34px;background:#06101a;border-left:1px solid #1b2c3c}
.brand{display:flex;align-items:center;gap:11px;font-weight:800;font-size:24px;letter-spacing:.4px}
.brand .logo{width:34px;height:34px;display:grid;place-items:center}
.brandLogo{display:block;max-width:150px;max-height:34px;width:auto;height:auto;object-fit:contain}
.sideHead .brandLogo{max-width:132px;max-height:26px}
.brand .x{color:var(--red)}
.lsub{color:#9eb3c6;margin-top:14px;line-height:1.6;font-size:14px}
.loginModes{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:26px}
.loginMode{border:1px solid #2a4054;background:linear-gradient(#11202e,#0a141d);border-radius:13px;
  padding:15px;cursor:pointer;transition:.15s}
.loginMode.active{outline:2px solid var(--blue);box-shadow:0 0 20px rgba(74,168,255,.22)}
.loginMode h3{margin:0 0 6px;font-size:15px}.loginMode p{margin:0;color:#90a5b8;font-size:12px;line-height:1.4}
.loginTraining{margin-top:16px;border:1px solid #203548;background:#07131e;border-radius:13px;padding:13px;display:grid;gap:10px}
.loginTraining.disabled{opacity:.46;pointer-events:none}
.loginTrainingTitle{font-size:11px;letter-spacing:1.3px;color:#9fb3c6;text-transform:uppercase;font-weight:800}
.loginTrainModes{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.loginTrainModes button{border:1px solid #2a4054;background:#0d1a26;color:#cfe1f1;border-radius:9px;padding:9px;font-weight:800;cursor:pointer}
.loginTrainModes button.active{background:#16456f;border-color:#4aa8ff;color:#fff}
.loginTraining select{width:100%;background:#020608;color:#eaf3ff;border:1px solid #2f4a63;border-radius:9px;padding:10px}
.pinBox label{display:block;color:#9fb3c6;font-size:13px;margin-bottom:10px}
.pinBox input{width:100%;background:#020608;color:#fff;border:1px solid #2f4a63;border-radius:11px;
  padding:14px;font-size:22px;letter-spacing:8px;text-align:center}
.pinBox input#studentName{letter-spacing:normal;font-size:14.5px;text-align:left;padding:12px}
.pinBox button{width:100%;margin-top:14px;padding:13px;border:0;border-radius:11px;
  background:linear-gradient(#3aa4ff,#1568c4);color:#fff;font-weight:700;cursor:pointer;font-size:15px}
.pinHint{font-size:12px;color:#7e93a6;margin-top:14px;line-height:1.5}
.pinBox button.inviteLink{display:block;width:auto;margin:10px auto 0;padding:0;border:0;border-radius:0;
  background:none;color:#7e93a6;font-size:12px;font-weight:600;text-decoration:underline;cursor:pointer}
.pinBox button.inviteLink:hover{color:#dcecff}
.loginDisclaimer{display:block;margin-top:9px;padding-top:8px;border-top:1px solid #1b2c3c;font-size:10.5px;color:#64798c}
.err{color:#ff8a8a;font-size:13px;height:16px;margin-top:8px}

/* ---------- App shell ---------- */
#app{display:none;height:100vh;grid-template-columns:var(--sideW) 1fr;
  grid-template-rows:1fr var(--dockH);grid-template-areas:"side stage" "side dock";
  background:linear-gradient(180deg,#0b0f13,#040607)}
body.student #app{grid-template-columns:0 1fr}

/* ---------- Sidebar ---------- */
#side{grid-area:side;background:linear-gradient(180deg,#0c1117,#080d12);border-right:1px solid #18242f;
  display:flex;flex-direction:column;min-height:0}
.sideHead{padding:14px 16px 12px;border-bottom:1px solid #16222e}
.sideHead .brand{font-size:18px}
.sideHead .logo{width:26px;height:26px}
.sideHead .st{font-size:10.5px;letter-spacing:2.5px;color:#7c93a8;margin-top:5px;font-weight:600}
.sideScroll{flex:1;overflow-y:auto;overflow-x:hidden;padding:10px 12px 8px}
.sideScroll::-webkit-scrollbar{width:7px}.sideScroll::-webkit-scrollbar-thumb{background:#1d2c3a;border-radius:4px}

.teacherCard{display:flex;align-items:center;gap:11px;background:linear-gradient(#101c27,#0c151e);
  border:1px solid #1d2e3c;border-radius:12px;padding:11px}
.tcDot{width:9px;height:9px;border-radius:50%;background:#27e06a;box-shadow:0 0 9px #27e06a;flex:none}
.tcAvatar{width:42px;height:42px;border-radius:10px;flex:none;overflow:hidden;border:1px solid #2a3f52;
  background:linear-gradient(#27384a,#16242f)}
.tcAvatar svg{width:100%;height:100%}
.tcMeta b{display:block;font-size:13.5px}.tcMeta span{display:block;font-size:11.5px;color:#8ea3b6;line-height:1.45}
.modeLabel{font-size:10px;letter-spacing:1.6px;color:#6fd89a;font-weight:700;margin:0 0 8px 2px}

.sec{margin-top:13px}
.secHead{display:flex;align-items:center;justify-content:space-between;cursor:pointer;
  padding:2px 2px 9px;border-bottom:1px solid #17242f}
.secHead h4{margin:0;font-size:11px;letter-spacing:1.4px;color:#9fb3c6;font-weight:700;text-transform:uppercase}
.secHead .chev{color:#5f7689;font-size:13px;transition:.2s}
.sec.collapsed .secBody{display:none}
.sec.collapsed .secHead .chev{transform:rotate(-90deg)}
.secBody{padding:11px 2px 2px}

.fieldSel{width:100%;background:#0a131c;color:#e8f0f8;border:1px solid #25394b;
  border-radius:9px;padding:10px 11px;font-size:13px;appearance:none;cursor:pointer;
  background-image:linear-gradient(45deg,transparent 50%,#6c8499 50%),linear-gradient(135deg,#6c8499 50%,transparent 50%);
  background-position:calc(100% - 18px) 17px,calc(100% - 13px) 17px;background-size:5px 5px,5px 5px;background-repeat:no-repeat}

.timeRow{display:flex;align-items:center;gap:10px;margin-top:4px}
.bigTime{font-size:27px;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:1px;color:#eaf3ff}
.tCtrls{display:flex;gap:6px;margin-left:auto}
.tBtn{width:34px;height:30px;border-radius:8px;border:1px solid #25394b;background:#0e1a25;color:#cfe1f1;
  cursor:pointer;display:grid;place-items:center;font-size:13px}
.tBtn:hover{background:#142536}
.speedRow{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-top:11px}
.speedRow button{padding:8px 0;border-radius:8px;border:1px solid #25394b;background:#0d1822;color:#bcd0e2;
  cursor:pointer;font-size:12.5px;font-weight:600}
.speedRow button.on{background:#16456f;border-color:#3f87c9;color:#eaf6ff}

.profRow{display:flex;align-items:center;gap:11px}
.profAvatar{width:46px;height:46px;border-radius:10px;overflow:hidden;flex:none;border:1px solid #2a3f52;
  background:linear-gradient(#27384a,#16242f)}
.profAvatar svg{width:100%;height:100%}
.profMeta b{display:block;font-size:13px}.profMeta span{display:block;font-size:11.5px;color:#8ea3b6;line-height:1.5}
.editPen{margin-left:auto;width:30px;height:30px;border-radius:8px;border:1px solid #25394b;background:#0e1a25;
  color:#9fc0dd;cursor:pointer;display:grid;place-items:center;flex:none}

.vital{display:flex;align-items:center;gap:10px;padding:8px 2px;border-bottom:1px solid #142029}
.vital:last-child{border-bottom:0}
.vDot{width:9px;height:9px;border-radius:2px;flex:none}
.vName{font-size:12.5px;color:#c2d3e3}
.vVal{margin-left:auto;font-weight:700;font-size:13.5px;font-variant-numeric:tabular-nums}
.vUnit{color:#7f93a6;font-size:11px;font-weight:500;margin-left:3px}
.fullBtn{width:100%;margin-top:11px;padding:10px;border-radius:9px;border:1px solid #25394b;
  background:#0f1c28;color:#cfe1f1;cursor:pointer;font-size:12.5px;font-weight:600}
.fullBtn:hover{background:#142838}

.sliders{display:none;margin-top:10px}
.sliders.open{display:block}
.slRow{margin-bottom:10px}
.slRow label{display:flex;justify-content:space-between;font-size:11.5px;color:#bccfe0;margin-bottom:5px}
.slRow label b{color:#fff}
.slRow input[type=range]{width:100%;accent-color:var(--blue)}

.miniGrid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.miniBtn{background:#0f1c28;color:#cfe1f1;border:1px solid #25394b;border-radius:8px;padding:9px;
  cursor:pointer;font-size:12px;font-weight:600;text-align:left}
.miniBtn:hover{background:#142838}
.miniBtn.red{background:#3a1414;border-color:#7a2a2a;color:#ffc7c7}
.miniBtn.green{background:#123a23;border-color:#2a7a48;color:#cdffdd}
.miniBtn.orange{background:#3d2a0e;border-color:#8a5e22;color:#ffe0a8}
.kvList .kv{display:flex;justify-content:space-between;font-size:12.5px;padding:7px 2px;border-bottom:1px solid #142029}
.kvList .kv:last-child{border:0}.kvList .kv b{color:#fff}
.logBox{height:120px;overflow:auto;background:#060c11;border:1px solid #17242f;border-radius:9px;
  padding:9px;font-size:11.5px;color:#90a6ba;line-height:1.55}
.icuGrid{display:grid;grid-template-columns:1fr;gap:8px}
.icuBedCard{position:relative;border:1px solid #213548;background:#08121b;border-radius:9px;padding:9px;cursor:pointer;transition:border-color .16s,background .16s,box-shadow .16s}
.icuBedCard:hover{border-color:#3d607c}.icuBedCard:focus-visible{outline:3px solid rgba(74,168,255,.45);outline-offset:2px}
.icuBedCard.active{border:2px solid #58b8ff;background:#0b1d2b;box-shadow:inset 4px 0 0 #58b8ff,0 0 0 3px rgba(74,168,255,.18)}
.icuBedTop{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:800}
.icuBedSelected{border:1px solid #58b8ff;border-radius:999px;background:#123b58;color:#d9f2ff;padding:2px 6px;font-size:8px;line-height:1.2;letter-spacing:.45px;text-transform:uppercase}
.icuBedAge{margin-left:auto;color:#86a8c2;font-size:9px;letter-spacing:.4px;text-transform:uppercase;text-align:right}
.icuBedDot{width:9px;height:9px;border-radius:50%;background:#35d36b;box-shadow:0 0 8px rgba(53,211,107,.6)}
.icuBedCard.warn .icuBedDot{background:#ffd23c}.icuBedCard.crit .icuBedDot{background:#ff4d4d}
.icuBedMeta{margin-top:5px;color:#8fa4b7;font-size:11px;line-height:1.35}
.icuBedPhase{display:flex;gap:7px;align-items:baseline;margin-top:7px;padding-top:6px;border-top:1px solid #1b3041;font-size:10px}.icuBedPhase span{color:#79a4c3;text-transform:uppercase;letter-spacing:.45px}.icuBedPhase b{overflow:hidden;color:#dcefff;text-overflow:ellipsis;white-space:nowrap}
.icuBedConfigure{display:none;gap:7px;margin-top:9px;padding-top:8px;border-top:1px solid #1b3041}
.icuBedCard.active .icuBedConfigure{display:grid}
.icuBedConfigure label{display:grid;gap:3px;color:#90a9bd;font-size:9px;font-weight:800;letter-spacing:.45px;text-transform:uppercase}
.icuBedConfigure select{min-width:0;width:100%;border:1px solid #29445b;border-radius:6px;background:#0c1a26;color:#e5f2fb;padding:6px;font-size:10.5px;text-transform:none;letter-spacing:0;cursor:pointer}
.icuFixedProfile,.startIcuFixedProfile{display:block;min-width:0;border:1px solid #29445b;border-radius:6px;background:#0c1a26;color:#e5f2fb;padding:6px;font-size:10.5px;font-weight:700;line-height:1.3;text-transform:none;letter-spacing:0}
.casePhaseProgress{color:#8db2cb;font-size:10px;font-weight:800;letter-spacing:.4px}.casePhaseEmpty{color:#8098aa;font-size:11px}.casePhaseBed{display:grid;gap:2px;margin-bottom:9px}.casePhaseBed b{color:#dcefff;font-size:12px}.casePhaseBed span{color:#86a2b6;font-size:10.5px;line-height:1.35}.casePhaseList{display:grid;gap:0;margin:0;padding:0;list-style:none}.casePhaseStep{position:relative;display:grid;grid-template-columns:14px minmax(0,1fr);gap:7px;min-height:39px}.casePhaseStep:not(:last-child)::after{content:"";position:absolute;left:5px;top:14px;bottom:-2px;width:2px;background:#243b4d}.casePhaseMarker{position:relative;z-index:1;width:12px;height:12px;margin-top:2px;border:2px solid #48657a;border-radius:50%;background:#0a151e}.casePhaseCopy{display:grid;gap:2px;padding-bottom:9px;min-width:0}.casePhaseCopy b{overflow:hidden;color:#88a0b1;font-size:11px;text-overflow:ellipsis;white-space:nowrap}.casePhaseCopy small{min-height:10px;color:#718b9e;font-size:8px;font-weight:800;letter-spacing:.4px;text-transform:uppercase}.casePhaseStep.active .casePhaseMarker{border-color:#5ec8ff;background:#5ec8ff;box-shadow:0 0 0 4px rgba(94,200,255,.14)}.casePhaseStep.active .casePhaseCopy b{color:#e8f7ff}.casePhaseStep.completed .casePhaseMarker{border-color:#43c57a;background:#43c57a}.casePhaseStep.completed:not(:last-child)::after{background:#356c55}.casePhaseStep.next .casePhaseMarker{border-color:#f1bf4a}.casePhaseStep.next .casePhaseCopy b{color:#d9e5ec}.casePhaseStep.skipped{opacity:.52}
.casePhaseStep.overridden .casePhaseMarker{border-color:#c68aff;background:#4d2f65}.casePhaseStep.overridden .casePhaseCopy b{color:#d9b8f7}
.casePhaseRoutes{display:grid;gap:5px;margin-top:4px;padding-top:8px;border-top:1px solid #1b3041}.casePhaseRoute{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:6px;align-items:center;color:#83a0b5;font-size:9px;line-height:1.3}.casePhaseRoute b{overflow:hidden;color:#d7eaf6;text-overflow:ellipsis;white-space:nowrap}.casePhaseRoute small{color:#f1bf4a;font-variant-numeric:tabular-nums}.casePhaseConflict{display:grid;gap:2px;margin:0 0 9px;border:1px solid #a85d32;border-radius:7px;background:#321b11;padding:7px;color:#ffd3b8;font-size:9.5px}.casePhaseConflict b{font-size:10px}.casePhaseConflict span{overflow-wrap:anywhere}
.casePhaseOverrideNotice{margin:0 0 9px;border:1px solid #36536a;border-radius:7px;background:#0d1c28;padding:7px;color:#a9c6d9;font-size:9.5px;line-height:1.4}.casePhaseList .casePhaseStep{display:block;margin:0 0 8px;border:1px solid #1d3344;border-radius:8px;background:#08141d;padding:7px;min-height:0}.casePhaseList .casePhaseStep::after{display:none}.casePhaseList .casePhaseStep.active{border-color:#3d7ca2;background:#0a1d2a}.casePhaseSelect{display:grid;grid-template-columns:14px minmax(0,1fr);gap:7px;width:100%;border:0;background:none;padding:0;text-align:left;color:inherit}.casePhaseSelect:is(button){cursor:pointer;border-radius:6px}.casePhaseSelect:is(button):hover:not(:disabled){background:#102839}.casePhaseSelect:is(button):focus-visible{outline:3px solid rgba(94,200,255,.42);outline-offset:2px}.casePhaseSelect:disabled{cursor:default}.casePhaseList .casePhaseCopy{padding-bottom:3px}.casePhaseRoutes> b,.casePhaseSteps> b{color:#8fb2c9;font-size:8px;letter-spacing:.45px;text-transform:uppercase}.casePhaseList .casePhaseRoute{grid-template-columns:auto minmax(0,1.15fr) minmax(0,.85fr) auto}.casePhaseRoute code,.casePhaseSteps code{border:1px solid #284256;border-radius:4px;background:#0c1d29;padding:2px 4px;color:#7ca5c0;font-size:8px}.casePhaseSteps{display:grid;gap:5px;margin-top:7px;padding-top:7px;border-top:1px solid #162b3b}.casePhaseSteps ul{display:grid;gap:4px;margin:0;padding:0;list-style:none}.casePhaseSteps li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:6px;align-items:start;color:#bdd0dc;font-size:9px;line-height:1.35}.casePhaseSteps small,.casePhaseTerminal{color:#7895a8;font-size:9px}.casePhaseTerminal{margin-top:6px;padding-top:7px;border-top:1px solid #162b3b}.casePhaseOverrideStatus{min-height:1px;color:#9ed5ef;font-size:9px}
.casePhaseBed{margin-bottom:10px;border-bottom:1px solid #1c3344;padding-bottom:9px}.casePhaseBed b{font-size:12px}.casePhaseBed span{margin-top:3px;color:#7f9aad;font-size:8px;font-weight:800;letter-spacing:.55px;text-transform:uppercase}.casePhaseBed strong{color:#d8ebf6;font-size:10px}.casePhaseFocus{display:grid;gap:9px;margin:0 0 12px;border:1px solid #3a7699;border-radius:10px;background:linear-gradient(145deg,#0b2231,#091822);padding:10px;box-shadow:0 8px 22px rgba(0,0,0,.16)}.casePhaseFocusHead{display:grid;gap:2px}.casePhaseFocusHead>span{color:#69cbfa;font-size:8px;font-weight:900;letter-spacing:.65px;text-transform:uppercase}.casePhaseFocusHead>b{color:#f0f9ff;font-size:13px;line-height:1.3}.casePhaseFocusHead>small{color:#8facbe;font-size:9px;font-variant-numeric:tabular-nums}.casePhaseGoal,.casePhaseImage{display:grid;gap:3px;border-left:3px solid #366681;padding-left:7px}.casePhaseGoal b,.casePhaseImage b{color:#86a9bf;font-size:8px;letter-spacing:.5px;text-transform:uppercase}.casePhaseGoal span,.casePhaseImage span{color:#d3e3ec;font-size:9.5px;line-height:1.4}.casePhaseMapTitle{margin:11px 0 7px;color:#9ab7ca;font-size:9px;letter-spacing:.7px;text-transform:uppercase}.casePhaseOverrideNotice{display:grid;gap:2px}.casePhaseOverrideNotice b{color:#d3edfb;font-size:9px}.casePhaseOverrideNotice span{color:#92afc1}.casePhaseList .casePhaseStep{padding:0;overflow:hidden}.casePhaseList .casePhaseStep details{display:block}.casePhaseList .casePhaseStep summary{display:grid;grid-template-columns:13px 20px minmax(0,1fr);gap:7px;align-items:center;cursor:pointer;padding:8px;list-style:none}.casePhaseList .casePhaseStep summary::-webkit-details-marker{display:none}.casePhaseList .casePhaseStep summary:focus-visible{outline:3px solid rgba(94,200,255,.42);outline-offset:-3px}.casePhaseNumber{display:grid;place-items:center;width:20px;height:20px;border-radius:6px;background:#102737;color:#93b1c4;font-size:9px;font-weight:900}.casePhaseList .casePhaseCopy{gap:1px;padding:0}.casePhaseList .casePhaseCopy b{white-space:normal;line-height:1.25}.casePhaseDetail{display:grid;gap:6px;border-top:1px solid #183044;padding:8px}.casePhaseGo{justify-self:start;border:1px solid #4e8eaf;border-radius:7px;background:#123449;padding:6px 9px;color:#ddf4ff;font-size:9px;font-weight:800;cursor:pointer}.casePhaseGo:hover{background:#1a4862}.casePhaseGo:focus-visible{outline:3px solid rgba(94,200,255,.45);outline-offset:2px}.casePhaseRoutes{gap:6px}.casePhaseRoute,.casePhaseList .casePhaseRoute{grid-template-columns:auto minmax(0,1fr);gap:2px 7px;border:1px solid #1d3a4d;border-radius:7px;background:#0a1923;padding:6px}.casePhaseRouteState{align-self:start;border-radius:999px;background:#273b47;padding:2px 5px;color:#b9ceda;font-size:7px;font-weight:900;letter-spacing:.35px;text-transform:uppercase}.casePhaseRoute>span:nth-child(2){color:#cde0eb;font-size:9px;line-height:1.35}.casePhaseRoute>b{grid-column:2;color:#f0c76a;font-size:9px;white-space:normal}.casePhaseRoute>small{grid-column:2;color:#f0c76a}.casePhaseRoute.chosen{border-color:#327b56;background:#0b251b}.casePhaseRoute.chosen .casePhaseRouteState{background:#276b49;color:#e6fff2}.casePhaseRoute.not-chosen{opacity:.58}.casePhaseRoute.waiting{border-color:#4b7893}.casePhaseSteps ol{display:grid;gap:5px;margin:0;padding:0;counter-reset:none;list-style:none}.casePhaseSteps li{grid-template-columns:18px minmax(0,1fr)}.casePhaseSteps li i{display:grid;place-items:center;width:17px;height:17px;border-radius:50%;background:#1c3b4f;color:#bde7fc;font-size:8px;font-style:normal;font-weight:900}.casePhaseStep.next{border-color:#8a7132}.casePhaseStep.next .casePhaseNumber{background:#5a481d;color:#ffe4a1}.casePhaseStep.completed .casePhaseNumber{background:#24553e;color:#caffdf}.casePhaseStep.not-chosen{opacity:.64}.casePhaseStep.unreachable{opacity:.42;border-style:dashed}.casePhaseStep.unreachable summary{cursor:default}.casePhaseStep.overridden{border-color:#72508b}.casePhaseTerminal{margin:0}.casePhaseOverrideStatus{margin-top:4px}
.casePhaseFocusHead>span{font-size:9px}.casePhaseFocusHead>b{font-size:14px}.casePhaseFocusHead>small{font-size:10px}.casePhaseGoal b,.casePhaseImage b{font-size:9px}.casePhaseGoal span,.casePhaseImage span{font-size:10.5px}.casePhaseMapTitle{font-size:10px}.casePhaseOverrideNotice b,.casePhaseOverrideNotice span{font-size:10px}.casePhaseList .casePhaseStep summary{grid-template-columns:13px 22px minmax(0,1fr);gap:8px;padding:9px}.casePhaseNumber{width:22px;height:22px;font-size:10px}.casePhaseList .casePhaseCopy b{font-size:11px;line-height:1.3}.casePhaseList .casePhaseCopy small{font-size:8.5px}.casePhaseDetail{gap:7px;padding:9px}.casePhaseGo{padding:7px 10px;font-size:10px}.casePhaseRoute,.casePhaseList .casePhaseRoute{gap:3px 8px;padding:7px}.casePhaseRouteState{font-size:8px}.casePhaseRoute>span:nth-child(2),.casePhaseRoute>b{font-size:10px}.casePhaseSteps ol{gap:6px}.casePhaseSteps li{grid-template-columns:20px minmax(0,1fr);font-size:10px}.casePhaseSteps li i{width:19px;height:19px;font-size:9px}.casePhaseTerminal{font-size:10px}
.caseContextLabel{display:block;margin:0 0 6px;color:#8da9ba;font-size:9px;font-weight:800;letter-spacing:.55px;text-transform:uppercase}.casePhaseBed strong::before{content:"🔒";margin-inline-end:5px;font-size:9px}.casePhaseNext{overflow:hidden;color:#7897aa;font-size:9px;line-height:1.25;text-overflow:ellipsis;white-space:nowrap}
.protocolMedicationPanel{display:grid;gap:8px}.protocolMedicationPanel+.miniGrid{display:none}.protocolContext{display:grid;gap:2px;border:1px solid #29465c;border-radius:7px;background:#0a1924;padding:8px}.protocolContext b{color:#d8effc;font-size:11px}.protocolContext span{color:#7f9daf;font-size:9px;overflow-wrap:anywhere}.protocolChooser{display:grid;gap:4px;color:#8ca9bb;font-size:9px;font-weight:800;letter-spacing:.4px;text-transform:uppercase}.protocolChooser select{width:100%;border:1px solid #31536a;border-radius:6px;background:#0b1b27;color:#ddecf5;padding:7px;font-size:10px;text-transform:none}.protocolAnchor{border:1px solid #263e50;border-radius:7px;background:#08141d;padding:8px}.protocolAnchor b{color:#b9d4e3;font-size:9px}.protocolAnchor p{margin:5px 0 0;color:#9ab2c1;font-size:9.5px;line-height:1.5}.protocolBlocked{display:grid;gap:3px;border:1px solid #7e5c28;border-radius:7px;background:#271d0d;padding:8px;color:#f0d49f;font-size:9px;line-height:1.4}.protocolBlocked b{font-size:9.5px}.protocolSources{display:grid;gap:4px}.protocolSources a{color:#66bce9;font-size:9px;line-height:1.35;text-decoration:none}.protocolSources a:hover{text-decoration:underline}
.icuCentralGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.icuCentralBed{border:1px solid #223544;background:#07111a;border-radius:10px;padding:9px;min-height:92px}
.icuCentralBed.active{border-color:#4aa8ff}
.icuCentralBed h6{margin:0 0 6px;font-size:11px;color:#dcecff}
.icuVitals{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;font-size:10px}.icuVitals b{display:block;font-size:15px;color:#fff}

.sideFoot{border-top:1px solid #16222e;padding:12px}
.stopSim{width:100%;padding:13px;border:0;border-radius:11px;background:linear-gradient(#e23b3b,#b41f1f);
  color:#fff;font-weight:800;letter-spacing:.4px;cursor:pointer;font-size:13.5px;
  display:flex;align-items:center;justify-content:center;gap:9px;box-shadow:0 6px 18px rgba(180,30,30,.32)}
.stopSim:hover{filter:brightness(1.07)}
.footIcons{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:13px}
.footIcons button{display:flex;flex-direction:column;align-items:center;gap:5px;background:none;border:0;
  color:#8298ab;cursor:pointer;font-size:10.5px}
.footIcons button:hover{color:#cfe1f1}
.footIcons svg{width:20px;height:20px}

/* ---------- Stage ---------- */
#stage{grid-area:stage;position:relative;min-width:0;min-height:0;padding:14px 14px 8px;display:grid;
  grid-template-rows:auto 1.16fr 1fr;gap:14px;overflow:hidden;
  background:radial-gradient(120% 90% at 50% -20%,rgba(38,54,70,.3),transparent 55%)}
.rowTop{display:grid;grid-template-columns:minmax(0,1.58fr) minmax(0,.86fr) minmax(0,.98fr);gap:12px;min-height:0;min-width:0}
.rowBot{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.16fr) minmax(0,1.04fr) minmax(0,.64fr);gap:12px;min-height:0;min-width:0}

/* device shells */
.dev{position:relative;border-radius:14px;min-height:0;min-width:0;display:flex;flex-direction:column;
  transition:box-shadow .2s,outline-color .2s;outline:2px solid transparent}
.dev.active{outline-color:rgba(74,168,255,.9);box-shadow:0 0 0 4px rgba(74,168,255,.12),0 16px 40px rgba(0,0,0,.55)}
.dev:hover{cursor:pointer}

/* physical machine housings — neutral medical plastic */
.shellCream{background:linear-gradient(168deg,#f6f7f5 0%,#dfe1de 46%,#b7bab5 100%);
  border:1px solid #878a84;border-radius:14px;padding:12px 13px 10px;flex:1;display:flex;flex-direction:column;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85),inset 0 -8px 18px rgba(30,34,32,.16),0 16px 36px rgba(0,0,0,.55)}
.monShell{background:linear-gradient(172deg,#f8f9f7 0%,#e2e4e1 44%,#bcbfba 100%);border-radius:15px;padding:9px 11px 8px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),inset 0 -9px 20px rgba(30,34,32,.17),0 16px 38px rgba(0,0,0,.56)}
.monShell .screen{border-color:#0c0d0e;border-width:6px;border-radius:8px;box-shadow:inset 0 0 26px #000,0 0 0 1px rgba(255,255,255,.14)}
.shellGrey{background:linear-gradient(168deg,#eef0ee 0%,#d6d8d5 46%,#b0b3af 100%);
  border:1px solid #83867f;border-radius:14px;padding:0;flex:1;display:flex;flex-direction:column;overflow:hidden;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85),inset 0 -8px 18px rgba(30,34,32,.14),0 16px 36px rgba(0,0,0,.55)}

/* device bezel strips (no window chrome — these are appliances, not windows) */
.titlebar{display:flex;align-items:center;gap:8px;padding:6px 11px;font-size:12px;font-weight:700;color:#33383c;
  background:linear-gradient(#f2f3f1,#dcdedb);border-bottom:1px solid #a9aca6;box-shadow:inset 0 1px 0 rgba(255,255,255,.8)}
.titlebar .devBrand{color:var(--devBrandBlue);font-weight:900;letter-spacing:.3px;font-size:13px}
.titlebar .tspacer{flex:1}
.winBtns{display:flex;gap:8px;align-items:center}
.winDot{display:none}
.winSq{display:none}
.bezelLeds{display:flex;gap:7px;align-items:center}
.bezelLed{width:7px;height:7px;border-radius:50%;background:#8f938d;box-shadow:inset 0 1px 1px rgba(0,0,0,.3)}
.bezelLed.on{background:#2fd465;box-shadow:0 0 6px rgba(47,212,101,.8)}
.bezelLed.chargeLed{background:#e8b93a;box-shadow:0 0 6px rgba(232,185,58,.7)}
.bezelTag{font-size:9px;font-weight:800;letter-spacing:.8px;color:#6c716c;text-transform:uppercase}

/* Monitor top bezel with alarm lamp */
.monBezel{display:flex;align-items:center;justify-content:center;position:relative;height:24px;margin-bottom:7px;border-radius:5px;
  background:linear-gradient(#f4f5f3,#e0e2df);box-shadow:inset 0 1px 0 rgba(255,255,255,.9),inset 0 -1px 0 rgba(0,0,0,.08)}
.monBezel .devBrand{font-weight:900;letter-spacing:5px;color:#2b3034;font-size:13.5px}
.monBezel .devModel{position:absolute;right:9px;top:5px;color:#585e62;font-size:10.5px;font-weight:700;letter-spacing:.2px}
.mxAlarmLamp{position:absolute;left:8px;top:5px;width:66px;height:13px;border-radius:7px;background:#c7c9c6;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.35);overflow:hidden}
.mxAlarmLamp:after{content:"";position:absolute;inset:2px;border-radius:5px;background:#aeb1ad;transition:background .2s}
.mxAlarmLamp.yellow:after{background:#ffce2e;box-shadow:0 0 14px 3px rgba(255,206,46,.85);animation:lampBlink 1.4s steps(1) infinite}
.mxAlarmLamp.red:after{background:#ff2d23;box-shadow:0 0 16px 4px rgba(255,45,35,.9);animation:lampBlink .7s steps(1) infinite}
@keyframes lampBlink{50%{opacity:.25}}

.screen{flex:1;background:#000;border:5px solid #101214;border-radius:8px;overflow:hidden;position:relative;
  box-shadow:inset 0 0 20px #000,0 0 0 1px rgba(255,255,255,.12)}
.screen.thin{border-width:4px}
.screen:after{content:"";position:absolute;inset:0;pointer-events:none;mix-blend-mode:screen;
  background:linear-gradient(118deg,rgba(255,255,255,.05),transparent 22%,transparent 78%,rgba(255,255,255,.03))}

/* hardware keys under the monitor screen */
.hwRow{display:flex;align-items:center;gap:8px;margin-top:8px;height:30px}
.hwBtn{background:linear-gradient(#f0f1ef,#d2d4d1);border:1px solid #8d908a;border-radius:6px;color:#33383c;
  font-weight:700;font-size:10.5px;cursor:pointer;padding:6px 11px;box-shadow:inset 0 1px 0 #fff,0 1px 2px rgba(0,0,0,.28)}
.hwBtn:hover{background:linear-gradient(#f8f9f7,#dcdedb)}
.hwBtn.amber{background:linear-gradient(#ffd764,#efa91c);border-color:#b97c12;color:#3d2c00}
.hwBtn.amber:hover{background:linear-gradient(#ffe084,#f7b52e)}
.hwSpacer{flex:1}
.pwrLed{width:8px;height:8px;border-radius:50%;background:#2fd465;box-shadow:0 0 7px rgba(47,212,101,.9);flex:none}
.pwrLbl{font-size:8.5px;font-weight:800;color:#6c716c;letter-spacing:.6px}
.knobBig{width:32px;height:32px;border-radius:50%;background:radial-gradient(circle at 36% 30%,#eceeeb,#9a9d98 68%,#7c7f7a);
  border:1px solid #6d706b;box-shadow:inset 0 1px 0 #fff,0 2px 5px rgba(0,0,0,.38);position:relative;cursor:pointer}
.knobBig:after{content:"";position:absolute;left:50%;top:4px;width:3px;height:9px;border-radius:2px;background:#4c504b;transform:translateX(-50%)}

/* ===== Bedside monitor screen ===== */
.monGrid{position:absolute;inset:0;display:grid;grid-template-columns:minmax(0,1fr) 148px;background:#000;
  font-family:"Arial Narrow",Arial,Helvetica,sans-serif}
.monWaves{position:relative}
.monWaves.frozen:after{content:attr(data-freeze-label);position:absolute;right:10px;top:34px;z-index:6;border:1px solid #5f86a3;background:rgba(7,18,27,.9);color:#cfe8fb;border-radius:4px;padding:3px 8px;font-size:9px;font-weight:900;letter-spacing:1px}
.monTop{position:absolute;left:0;right:0;top:0;height:26px;background:#10161c;color:#cfdcea;z-index:3;
  display:flex;align-items:center;gap:7px;padding:0 8px;font-size:10.5px;border-bottom:1px solid #202b35}
.monTab{background:#1b2733;border:1px solid #33465a;border-radius:2px;padding:1px 7px;font-size:9.5px;font-weight:800;color:#e4eef7}
.monTab.status{background:#242e36;color:#c3d2df}.monTab.alarmOk{background:#102818;border-color:#245c38;color:#5aef83}.monTab.advisor{background:#212d3d;border-color:#46607a;color:#d5e6f8}
.monTab.silenced{background:#3a2f10;border-color:#8a6d1c;color:#ffd75e}
.monCanvas{position:absolute;inset:26px 0 0 0;width:100%;height:calc(100% - 26px)}
.laneName{position:absolute;left:8px;font-size:11px;font-weight:800;text-shadow:0 0 5px #000;z-index:2;letter-spacing:.3px}
.laneSub{font-size:8px;font-weight:700;color:#8ba0b4;display:block;letter-spacing:.2px}
.params{border-left:1px solid #1c2126;background:#000;display:grid;grid-template-rows:1.04fr 1.12fr 1.04fr .92fr .92fr .86fr;z-index:3}
.par{padding:4px 8px 4px 8px;border-bottom:1px solid #14181c;position:relative;display:flex;flex-direction:column;justify-content:center;background:#000}
.par .pn{font-size:10px;font-weight:900;letter-spacing:.45px}
.par .pv{font-weight:900;line-height:.9;font-variant-numeric:tabular-nums;letter-spacing:-.5px}
.par .pu{font-size:9px;color:#93a0ab;position:absolute;right:8px;top:6px;font-weight:800}
.par .plim{font-size:8.5px;color:#77828c;position:absolute;right:8px;bottom:5px;text-align:right;line-height:1.12}
.par .psub{position:absolute;left:8px;bottom:5px;font-size:11px;font-weight:900}
.par .pnote{position:absolute;left:8px;bottom:5px;font-size:8.5px;font-weight:700;color:#8ba0b4}
.par.viol .pv{animation:numBlink 1s steps(1) infinite}
@keyframes numBlink{50%{opacity:.35}}
.alarmBanner{position:absolute;left:0;right:148px;top:26px;background:#c40e0e;color:#fff;text-align:center;
  font-weight:900;font-size:11px;padding:3px;z-index:6;display:none;animation:blink .85s infinite;letter-spacing:.5px}
.alarmBanner.yellow{background:#c79a04;color:#241c00;animation-duration:1.4s}
.dev.alarm .alarmBanner{display:block}
@keyframes blink{50%{opacity:.4}}

/* ===== Ventilator ===== */
.ventWrap{position:absolute;inset:0;display:grid;grid-template-columns:1fr 86px;background:#071018;color:#dbe7f2;font-family:Arial,Helvetica,sans-serif}
.ventMain{position:relative;min-width:0;overflow:hidden;background:#02070b}
.ventModeBar{position:absolute;left:0;right:0;top:0;height:24px;background:linear-gradient(#17232d,#0d151d);border-bottom:1px solid #263746;color:#cfe0ef;display:flex;align-items:center;gap:8px;padding:0 8px;font-size:10.5px;z-index:4;white-space:nowrap}
.ventBrand{font-weight:900;color:#fff}.ventModePill{font-weight:900;color:#fff;background:#12304a;border:1px solid #2d5c7b;border-radius:4px;padding:1px 7px}.ventAuto{color:#9fb4c6}.ventAlarmLine{margin-left:auto;font-weight:900;color:#63ff8a}.ventAlarmLine.warn{color:#ffd23c}.ventAlarmLine.bad{color:#ff6b55}.ventClock{color:#9fb4c6;font-variant-numeric:tabular-nums}
.ventCanvasWrap{position:absolute;left:0;right:0;top:24px;bottom:66px;background:#000}
.ventCanvas{width:100%;height:100%;display:block}
.ventLabs{position:absolute;left:8px;font-size:10px;font-weight:800;text-shadow:0 0 5px #000;z-index:2}.ventScale{position:absolute;right:8px;font-size:8.5px;color:#62788b;z-index:2}
.ventLoopBox{position:absolute;right:10px;top:32px;width:86px;height:70px;border:1px solid #1b3445;border-radius:6px;background:rgba(3,10,16,.82);z-index:3;padding:5px}.ventLoopBox label{display:block;color:#8aa0b3;font-size:8px;font-weight:800}.ventLoopBox svg{width:100%;height:48px;display:block}.ventLoopBox path{fill:none;stroke:#4ec3ff;stroke-width:2}
.ventNums{background:#071018;border-left:1px solid #1b2730;display:grid;grid-template-rows:repeat(8,1fr);min-width:0}
.ventNum{padding:4px 6px;border-bottom:1px solid #132331;display:flex;flex-direction:column;justify-content:center;align-items:flex-end;min-height:0}.ventNum .k{font-size:8.5px;color:#8aa0b3}.ventNum .v{font-size:17px;font-weight:900;line-height:1;font-variant-numeric:tabular-nums}.ventNum .u{font-size:8px;color:#7a8d9f}.ventNum.alarm .v{color:#ff6b55}.ventNum.ok .v{color:#63ff8a}
.ventBot{position:absolute;left:0;right:0;bottom:22px;height:44px;background:#0c141b;border-top:1px solid #1b2730;display:grid;grid-template-columns:repeat(8,1fr);z-index:4}
.ventBot .vb{display:flex;flex-direction:column;align-items:center;justify-content:center;border-right:1px solid #16222c;min-width:0}.ventBot .vb:last-child{border-right:0}.ventBot .vb .k{font-size:8px;color:#7f94a7}.ventBot .vb .v{font-size:12px;font-weight:900;white-space:nowrap}
.ventTabs{position:absolute;left:0;right:0;bottom:0;height:22px;background:#0a1117;display:flex;z-index:4;border-top:1px solid #142635}
.ventTabs span{flex:1;text-align:center;font-size:8.3px;color:#9fb4c6;line-height:22px;border-right:1px solid #16222c;cursor:pointer}.ventTabs span:last-child{border-right:0}.ventTabs span.on{background:#16456f;color:#eaf6ff;font-weight:900}
.ventHardKeys{position:absolute;right:4px;top:28px;bottom:70px;width:78px;display:flex;flex-direction:column;gap:4px;z-index:5}.ventHardKeys .softKey{font-size:8px;padding:2px 3px;min-height:20px}

/* ===== Pumps (syringe pumps) ===== */
.pumps{flex:1;display:flex;flex-direction:column;gap:9px}
.pump{flex:1;background:linear-gradient(172deg,#f2f3f1,#d8dad7 52%,#b9bcb8);border:1px solid #82857f;border-radius:10px;
  display:grid;grid-template-columns:26px 1fr 62px;overflow:hidden;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85),inset 0 -5px 12px rgba(30,34,32,.14),0 6px 16px rgba(0,0,0,.35)}
.pumpRail{background:linear-gradient(#dfe1de,#bbbeba);border-right:1px solid #8f928c;display:flex;
  flex-direction:column;align-items:center;padding:6px 0;gap:7px}
.pLed{width:8px;height:8px;border-radius:50%;background:#2fd465;box-shadow:0 0 7px rgba(47,212,101,.85)}
.pump.paused .pLed{background:#e8b93a;box-shadow:0 0 6px rgba(232,185,58,.8)}
.pump.stopped .pLed{background:#6f7880;box-shadow:none}
.pump.alarm .pLed{background:#ff3b30;box-shadow:0 0 8px rgba(255,59,48,.9);animation:blink .5s infinite}
.pEye{color:#565a55;font-size:10px}
.pBat{width:12px;height:7px;border:1px solid #565a55;border-radius:1px;margin-top:auto;position:relative;background:#cfd2ce}
.pBat:before{content:"";position:absolute;left:1px;top:1px;bottom:1px;width:70%;background:#3f8f4f}
.pBat:after{content:"";position:absolute;right:-3px;top:1.5px;width:2px;height:3.5px;background:#565a55}
.pumpMain{padding:6px 8px;display:flex;flex-direction:column;min-width:0}
.pumpHead{display:flex;align-items:center;gap:6px}
.pumpBrand{color:#12386b;font-weight:900;font-size:10px;letter-spacing:.2px}
.pumpType{font-size:8px;color:#5c615c;font-weight:800;letter-spacing:.6px}
/* syringe cradle with ISO drug-class label colours */
.pumpSyringe{display:grid;grid-template-columns:1fr 14px;align-items:center;gap:0;margin-top:4px;height:16px}
.syrBarrel{position:relative;height:13px;border-radius:3px;background:linear-gradient(rgba(255,255,255,.75),rgba(198,206,210,.55));
  border:1px solid #9aa0a2;overflow:hidden;box-shadow:inset 0 1px 2px rgba(255,255,255,.8)}
.syrFluid{position:absolute;left:0;top:0;bottom:0;background:rgba(224,236,244,.8);border-right:2px solid #6f7d86}
.syrLabel{position:absolute;left:14%;top:1px;bottom:1px;width:42%;border-radius:2px;display:flex;align-items:center;justify-content:center;
  font-size:6.5px;font-weight:900;letter-spacing:.3px;color:#191919;overflow:hidden;white-space:nowrap;border:1px solid rgba(0,0,0,.22)}
.syrPlunger{height:9px;background:linear-gradient(#e8eae7,#b6b9b5);border:1px solid #8f928c;border-radius:0 2px 2px 0}
.syrScale{position:absolute;left:0;right:0;bottom:0;height:3px;background:repeating-linear-gradient(90deg,rgba(60,66,70,.5) 0 1px,transparent 1px 9%)}
.pumpScr{flex:1;margin-top:4px;background:#0d1508;border:1px solid #2c3a12;border-radius:4px;padding:5px 8px;
  position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:center;
  box-shadow:inset 0 0 12px rgba(0,0,0,.75)}
.pumpScr:after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(255,255,255,.025) 0 1px,transparent 1px 3px)}
.pumpDrug{color:#8dff5e;font-weight:800;font-size:11px;font-family:Consolas,"Lucida Console",monospace;letter-spacing:.3px}
.pumpConc{color:#b6e88a;font-size:9px;margin-top:1px;font-family:Consolas,"Lucida Console",monospace}
.pumpRate{font-size:24px;font-weight:400;color:#d9ffbe;margin-top:auto;line-height:1;font-family:Consolas,"Lucida Console",monospace}
.pumpRate b{font-weight:700}.pumpRate .u{font-size:11px;color:#9fd07c;margin-left:3px}
.pumpStatusLine{font-size:8px;color:#9fd07c;font-family:Consolas,monospace;letter-spacing:.4px;margin-top:2px}
.pumpTelemetry{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:3px;margin-top:4px;padding-top:3px;border-top:1px solid rgba(159,208,124,.18);font-family:Consolas,"Lucida Console",monospace}
.pumpTelemetry span{min-width:0}.pumpTelemetry i{display:block;color:#739c5a;font-size:6.5px;font-style:normal;letter-spacing:.25px}.pumpTelemetry b{display:block;color:#c7e9ad;font-size:7.5px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pumpKeys{display:flex;flex-direction:column;border-left:1px solid #8f928c}
.pumpKeys button{flex:1;border:0;border-bottom:1px solid #9b9e98;background:linear-gradient(#eef0ed,#d2d5d1);
  color:#33383c;font-size:9px;font-weight:800;cursor:pointer;letter-spacing:.3px}
.pumpKeys button:last-child{border-bottom:0}
.pumpKeys button:hover{background:#f4f6f3}
.pumpKeys button:active{background:#c9ccc8}
.pumpKeys button.go{color:#0f6a2d;background:linear-gradient(#dff2e2,#bfe0c5)}
.pumpKeys button.stop{color:#a01d16;background:linear-gradient(#f6e0de,#e7c4c0)}
.pump.paused .pumpScr{filter:saturate(.55) brightness(.82)}
.pump.stopped .pumpScr{filter:saturate(.28) brightness(.72)}
.pump.stopped .pumpStatusLine{color:#c9d0d5}
.pump.alarm .pumpScr{border-color:#7c1a12}
.pump.alarm{animation:none}
.pump.alarm .pumpDrug,.pump.alarm .pumpRate{color:#ff8d7a}
.pump.selected{outline:2px solid #4aa8ff;outline-offset:1px;box-shadow:0 0 0 4px rgba(74,168,255,.14),0 7px 18px rgba(0,0,0,.4)}

/* ===== Anesthesia workstation ===== */
.anes{position:absolute;inset:0;background:#05090d;display:grid;grid-template-rows:24px 1fr 48px 22px;color:#dbe7f2;font-family:Arial,Helvetica,sans-serif}
.anesTop{background:linear-gradient(#16212b,#0d151d);border-bottom:1px solid #263746;display:flex;align-items:center;gap:8px;padding:0 9px;font-size:10.5px;white-space:nowrap}
.anesBrand{font-weight:800;color:#fff;letter-spacing:.2px}
.anesTag{background:#203040;border:1px solid #456172;border-radius:4px;padding:1px 7px;font-size:9.5px;color:#dff2ff}
.anesMode{font-weight:900;color:#fff;background:#101b25;border:1px solid #2d4658;border-radius:4px;padding:1px 7px}
.anesAlarm{margin-left:auto;color:#63ff8a;font-weight:800}.anesAlarm.warn{color:#ffd23c}.anesAlarm.bad{color:#ff6b55}
.anesClock{color:#9fb4c6;font-variant-numeric:tabular-nums}
.anesBody{display:grid;grid-template-columns:.9fr 1.3fr .9fr 1.05fr;min-height:0;background:#071018}
.anesCol{border-right:1px solid #182633;padding:7px 8px;min-width:0;overflow:hidden}
.anesCol:last-child{border-right:0}
.anesCol h5{margin:0 0 7px;font-size:9px;letter-spacing:.7px;color:#8fa6ba;font-weight:800;text-transform:uppercase}
.anesSub{font-size:9px;color:#7e95a8;margin-top:-5px;margin-bottom:6px}
.anesFlowRow{display:grid;grid-template-columns:35px 1fr 44px;gap:6px;align-items:center;padding:5px 0;border-bottom:1px solid #132331;font-size:10.5px}
.anesFlowRow b{color:#f5fbff;font-size:14px;font-variant-numeric:tabular-nums;text-align:right}.anesFlowRow .u{font-size:8.5px;color:#8aa0b3}
.anesBar{height:8px;border-radius:5px;background:#0c1a24;border:1px solid #203545;overflow:hidden}.anesBar i{display:block;height:100%;border-radius:5px;background:linear-gradient(90deg,#2b95d6,#86e3ff)}
.anesBar.air i{background:linear-gradient(90deg,#238b55,#73ff9b)}.anesBar.n2o i{background:linear-gradient(90deg,#6a6f7f,#d6dde7)}
.anesTotal{margin-top:7px;background:#0b1822;border:1px solid #1d3444;border-radius:7px;padding:7px;display:flex;justify-content:space-between;align-items:baseline;font-size:10px;color:#9fb4c6}
.anesTotal b{font-size:19px;color:#fff;font-variant-numeric:tabular-nums}
.anesWaveStack{display:grid;grid-template-rows:repeat(3,1fr);gap:5px;height:calc(100% - 26px)}
.anesMiniWave{position:relative;background:#02070b;border:1px solid #172a39;border-radius:5px;overflow:hidden}.anesMiniWave label{position:absolute;left:6px;top:4px;font-size:8.5px;color:#8aa0b3;font-weight:800;z-index:2}.anesMiniWave svg{width:100%;height:100%;display:block}.anesMiniWave path{fill:none;stroke-width:2}.anesMiniWave .grid{stroke:#0c2230;stroke-width:1}
.anesVaporDial{width:74px;height:74px;margin:2px auto 5px;border-radius:50%;background:radial-gradient(circle at 38% 32%,#3a3512,#0c0b04 65%);border:3px solid #e8c832;position:relative;box-shadow:inset 0 0 12px #000,0 0 14px rgba(232,200,50,.25)}
.anesVaporDial{cursor:pointer}.anesVaporDial:focus{outline:2px solid #4aa8ff;outline-offset:2px}.anesVaporDial:after{content:"";position:absolute;left:50%;top:7px;width:4px;height:27px;background:#d7f2ff;border-radius:3px;transform-origin:50% 30px;transform:translateX(-50%) rotate(var(--agent-angle,38deg))}
.anesAgentName{text-align:center;color:#ffd23c;font-size:11px;font-weight:900;letter-spacing:.5px}.anesAgentBig{text-align:center;font-size:24px;font-weight:900;color:#fff;font-variant-numeric:tabular-nums}.anesAgentBig .u{font-size:9px;color:#8aa0b3}
.anesAgentGrid{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin-top:6px}.anesTiny{background:#0b1822;border:1px solid #1b3445;border-radius:6px;padding:5px;text-align:center}.anesTiny span{display:block;font-size:8px;color:#7f94a7}.anesTiny b{font-size:12px;color:#eaf3ff}
.anesVentGrid{display:grid;grid-template-columns:1fr 1fr;gap:5px}.anesVentTile{background:#0b1822;border:1px solid #1c3345;border-radius:6px;padding:5px;min-height:34px}.anesVentTile span{display:block;font-size:8px;color:#8399ad}.anesVentTile b{display:block;color:#fff;font-size:15px;font-variant-numeric:tabular-nums}.anesVentTile .u{font-size:8px;color:#8aa0b3;font-weight:600}
.anesModeStrip{margin-top:6px;background:#101b25;border:1px solid #273e51;border-radius:6px;padding:5px;display:flex;justify-content:space-between;gap:5px;font-size:9px;color:#9fb4c6}.anesModeStrip b{color:#fff}
.anesVals{display:grid;grid-template-columns:repeat(5,1fr);background:#061019;border-top:1px solid #172633}
.anesVals .av{display:flex;flex-direction:column;align-items:center;justify-content:center;border-right:1px solid #142635;min-width:0}.anesVals .av:last-child{border-right:0}
.anesVals .av .k{font-size:8.5px;color:#7f94a7}.anesVals .av .v{font-size:17px;font-weight:900;font-variant-numeric:tabular-nums}.anesVals .av .v .u{font-size:9px;color:#8aa0b3;font-weight:600}
.anesTabs{display:flex;background:#0a1117;border-top:1px solid #142635}
.anesTabs span{flex:1;text-align:center;font-size:8.3px;color:#9fb4c6;line-height:22px;border-right:1px solid #16222c;cursor:pointer}.anesTabs span:last-child{border-right:0}.anesTabs span.on{background:#142638;color:#fff;font-weight:800}

/* ===== Defib (rugged dark chassis) ===== */
.defibShell{background:linear-gradient(170deg,#3a3e41,#25282b 46%,#141719);border:1px solid #0d0f10;border-radius:14px;
  padding:0;flex:1;display:flex;flex-direction:column;overflow:hidden;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14),inset 0 -8px 18px rgba(0,0,0,.5),0 16px 36px rgba(0,0,0,.6)}
.dTitle{display:flex;align-items:center;gap:8px;padding:6px 11px;border-bottom:1px solid #0e1112;
  background:linear-gradient(#313538,#212427);box-shadow:inset 0 1px 0 rgba(255,255,255,.1)}
.dTitle .dBrand{font-weight:900;color:#f2f5f7;font-size:13px;letter-spacing:1px}
.dTitle .dModel{font-weight:700;color:#aeb6bc;font-size:11px}
.dTitle .rubber{margin-left:auto;width:44px;height:8px;border-radius:4px;background:repeating-linear-gradient(90deg,#17191b 0 4px,#26292c 4px 8px)}
.defibBody{flex:1;display:grid;grid-template-columns:1fr 96px;gap:0}
.zScreenWrap{padding:8px 5px 8px 8px;display:flex;flex-direction:column}
.zScreen{flex:1;background:#000;border:4px solid #0a0c0d;border-radius:6px;position:relative;overflow:hidden;
  box-shadow:inset 0 0 18px #000,0 0 0 1px rgba(255,255,255,.08)}
.zTop{position:absolute;left:0;right:0;top:0;height:18px;display:flex;align-items:center;justify-content:space-between;
  padding:0 8px;color:#9fb4c6;font-size:10px;z-index:2;background:#0d1216;border-bottom:1px solid #1a2229}
.zHR{position:absolute;right:8px;top:20px;text-align:right;z-index:2}
.zHR .h{color:var(--green);font-size:30px;font-weight:800;line-height:.9}.zHR .b{color:var(--green);font-size:11px}
.zTimer{position:absolute;right:8px;top:58px;color:#cfe0ef;font-size:14px;font-weight:700;z-index:2;font-variant-numeric:tabular-nums}
.zNibp{position:absolute;right:8px;top:78px;color:var(--red);font-size:10px;font-weight:800;z-index:2;text-align:right;font-variant-numeric:tabular-nums;line-height:1.2}
.zNibp.measuring{color:var(--orange)}
.zCanvas{width:100%;height:100%;display:block}
.zEnergy{position:absolute;left:14px;bottom:44px;color:var(--orange);font-size:32px;font-weight:800;z-index:2}
.zSync{position:absolute;left:12px;top:40px;color:var(--orange);font-size:10px;font-weight:800;z-index:2}
.zPads{position:absolute;left:12px;bottom:10px;color:#9fb4c6;font-size:9px;z-index:2}
.zBtns{position:absolute;right:8px;bottom:25px;display:flex;gap:4px;z-index:2}
.zBtns button{background:#1a2229;border:1px solid #2c3a47;border-radius:3px;padding:2px 6px;font-size:9px;color:#cfe0ef;cursor:pointer}
.zPrompt{position:absolute;left:12px;right:12px;bottom:24px;height:14px;color:#9fb4c6;font-size:10px;z-index:2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.zSide{background:linear-gradient(180deg,#2e3235,#1c1f22);border-left:1px solid #0e1112;display:flex;flex-direction:column;
  align-items:center;padding:8px 5px;gap:6px}
.zKey{width:100%;background:linear-gradient(#43484c,#2a2e31);border:1px solid #17191b;border-radius:6px;
  font-size:8px;font-weight:800;color:#e3e8ec;padding:5px 0;cursor:pointer;box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 1px 2px rgba(0,0,0,.5);letter-spacing:.3px;
  /* De toetsnamen komen uit MXBrand/tr() en staan dus niet meer in kapitalen in de markup;
     de kapitalenlook van de zijtoetsen komt daarom uit de opmaak. Regelafbreking gebeurt
     nu vanzelf, zodat er geen <br> in een merkgebonden tekst hoeft te staan. */
  text-transform:uppercase;line-height:1.25}
.zKey:hover{background:linear-gradient(#4d5257,#33373b)}
.zKey:active{transform:translateY(1px)}
.zDial{width:42px;height:42px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#4a4e50,#101213);
  border:2px solid #6b7176;box-shadow:inset 0 1px 1px rgba(255,255,255,.2),0 3px 7px rgba(0,0,0,.55);margin:2px 0;position:relative;cursor:pointer}
.zDial:after{content:"";position:absolute;left:50%;top:5px;width:3px;height:11px;background:#dfe3e6;transform:translateX(-50%);border-radius:2px}
.zDial:focus{outline:2px solid #4aa8ff}
.zDial.pacerMode{border-color:#ffce4a;box-shadow:0 0 14px rgba(255,206,74,.55),0 3px 7px rgba(0,0,0,.55)}
.zDial.energyMode{border-color:#ff8a3c;box-shadow:0 0 14px rgba(255,138,60,.55),0 3px 7px rgba(0,0,0,.55)}
.zPacerReadout{width:100%;background:#241f06;border:1px solid #b98617;color:#ffe27a;border-radius:5px;padding:4px 2px;text-align:center;font-size:8px;font-weight:900;line-height:1.25;display:none}
.zPacerReadout.on{display:block}
.zEnergySelect{cursor:pointer}
.zEnergySelect.on{outline:2px solid #ff8a3c;box-shadow:0 0 14px rgba(255,138,60,.45)}
.zShockKey{width:48px;height:48px;border-radius:50%;background:radial-gradient(circle at 38% 30%,#ff6a3d,#b52a0a 72%);
  border:3px solid #ffb98a;color:#fff;font-weight:900;font-size:9px;cursor:pointer;display:grid;place-items:center;
  box-shadow:0 0 0 3px #17191b,0 4px 10px rgba(190,60,20,.55);text-shadow:0 1px 2px rgba(0,0,0,.5)}
.zShockKey:hover{filter:brightness(1.1)}
.zShockKey.charged,.zKey.charged{animation:blink .4s infinite}
.zSel{background:#ffce4a;border:1px solid #d6a417;border-radius:5px;width:100%;font-size:8px;font-weight:900;
  color:#4a3200;padding:4px 0;text-align:center;line-height:1.25;text-transform:uppercase}

/* ===== Lab (LIS terminal) ===== */
.labShell{flex:1;background:linear-gradient(#0d141d,#0a111a);border:1px solid #1d2c3a;border-radius:12px;
  display:flex;flex-direction:column;overflow:hidden;box-shadow:0 14px 34px rgba(0,0,0,.5)}
.labHead{padding:8px 12px;font-size:11.5px;font-weight:800;letter-spacing:1.6px;color:#cfe0ef;
  border-bottom:1px solid #1d2c3a;background:#0c1520;display:flex;align-items:center;gap:8px}
.labHead .labLive{margin-left:auto;font-size:9px;font-weight:800;color:#5aef83;letter-spacing:.8px}
.labHead .labLive:before{content:"●";margin-right:4px;animation:blink 2s infinite}
.labTabs{display:flex;gap:14px;padding:8px 12px 0;font-size:11px;color:#7f93a6}
.labTabs button{appearance:none;border:0;border-bottom:2px solid transparent;background:none;color:inherit;padding:0 0 7px;cursor:pointer;font:inherit}
.labTabs button.on{color:#eaf3ff;border-bottom-color:#4aa8ff;font-weight:700}
.labDate{padding:8px 12px 4px;font-size:10.5px;color:#7f93a6}
.labRows{flex:1;overflow:auto;padding:2px 12px 8px}
.labRow{display:grid;grid-template-columns:minmax(78px,1.25fr) minmax(44px,.62fr) minmax(42px,.62fr) 25px 25px;gap:7px;align-items:center;padding:7px 0;border-bottom:1px solid #15222d;font-size:12px}
.labRow .lk{color:#bccfe0;min-width:0}.labRow .lk b{display:block;color:#dceaf6;font-size:12px}.labRow .lk small{display:block;color:#70869a;font-size:8.5px;margin-top:1px}
.labRow .lvv{font-weight:900;font-size:13px;font-variant-numeric:tabular-nums;text-align:right}.labRow .lu{color:#7f93a6;font-size:9px;text-align:left;white-space:nowrap}
.labFlag{display:grid;place-items:center;width:22px;height:20px;border-radius:4px;border:1px solid #2b3f50;background:#0b1721;color:#8398aa;font-size:9px;font-weight:900}.labTrend{text-align:center;color:#8aa0b3;font-size:13px}
.labRow.hi .lvv,.labRow.hi .labFlag{color:#ff9a83}.labRow.hi .labFlag{border-color:#7b382d;background:#26110d}.labRow.lo .lvv,.labRow.lo .labFlag{color:#73c4ff}.labRow.lo .labFlag{border-color:#295a7d;background:#0b1b29}.labRow.ok .lvv{color:#e8f3ff}
.labLegend{display:flex;flex-wrap:wrap;gap:6px 14px;margin:8px 0 2px;padding:7px 10px;border:1px solid #243a4c;border-radius:7px;background:#0a1721;color:#a9bfd1;font-size:10px;line-height:1.35}.labLegend b{color:#f0f7fd;letter-spacing:1px}
.labDisc{margin-top:6px;font-size:9px;letter-spacing:.6px;color:#7f95a9;text-transform:uppercase}
.labBtn{margin:8px 12px 12px;padding:10px;border-radius:9px;border:1px solid #2a4258;background:#102433;
  color:#cfe6f9;cursor:pointer;font-weight:600;font-size:12px}

/* ===== Patient window (room camera feed) ===== */
.patShell{flex:1;background:linear-gradient(#0d141d,#0a111a);border:1px solid #1d2c3a;border-radius:12px;
  display:flex;flex-direction:column;overflow:hidden;box-shadow:0 14px 34px rgba(0,0,0,.5)}
.patBody{flex:1;position:relative;background:radial-gradient(120% 100% at 50% 0%,#1a2733,#0a121a);overflow:hidden}
.patBody:after{content:"";position:absolute;inset:0;pointer-events:none;z-index:5;
  background:radial-gradient(135% 110% at 50% 45%,transparent 62%,rgba(0,0,0,.4) 100%)}
.patCamTag{position:absolute;left:10px;bottom:10px;z-index:6;display:flex;align-items:center;gap:6px;
  background:rgba(3,8,13,.72);border:1px solid rgba(70,100,125,.4);border-radius:5px;padding:3px 8px;
  font-size:9.5px;font-weight:800;letter-spacing:.8px;color:#d5e4f2;pointer-events:none}
.patCamTag .rec{width:7px;height:7px;border-radius:50%;background:#ff3b30;animation:blink 1.6s infinite}
.patCamClock{position:absolute;right:10px;bottom:10px;z-index:6;background:rgba(3,8,13,.72);border:1px solid rgba(70,100,125,.4);
  border-radius:5px;padding:3px 8px;font-size:9.5px;font-weight:700;color:#b9cbdb;font-variant-numeric:tabular-nums;pointer-events:none}
.patSvg{position:absolute;inset:0;width:100%;height:100%}
.patFoot{border-top:1px solid #1d2c3a;background:#0c1520;padding:8px 12px;display:flex;align-items:center;gap:11px}
.patFoot .pf{font-size:11.5px;color:#bccfe0;line-height:1.5}.patFoot .pf b{color:#fff}
.bodyTag{margin-left:auto;width:34px;height:54px}

/* ---------- Dock ---------- */
#dock{grid-area:dock;background:linear-gradient(#0a1016,#070b10);border-top:1px solid #16232e;
  display:flex;align-items:center;gap:8px;padding:8px 14px;overflow-x:auto}
#dock::-webkit-scrollbar{height:6px}#dock::-webkit-scrollbar-thumb{background:#1d2c3a;border-radius:4px}
.dockItem{height:98px;min-width:118px;flex:none;border:1px solid #1e2c38;background:#0a1219;border-radius:10px;
  display:flex;flex-direction:column;overflow:hidden;cursor:pointer;transition:border-color .15s,box-shadow .15s}
.dockItem:hover{border-color:#33506a}
.dockItem.active{border-color:#3f8fe8;box-shadow:0 0 0 1px rgba(63,143,232,.35),0 0 18px rgba(63,143,232,.18)}
.dockThumb{flex:1;background:#04070b;position:relative;overflow:hidden;display:grid;place-items:center}
.dockThumb canvas{width:100%;height:100%}
.dockThumb .ico{font-size:30px}
.dockThumb svg.dockIco{width:30px;height:30px;color:#7e97ac}
.dockItem.active .dockThumb svg.dockIco{color:#cfe4f8}
.dockLabel{font-size:9px;letter-spacing:.7px;color:#9db0c2;text-align:center;padding:5px 4px;
  font-weight:700;text-transform:uppercase;background:#0a1219;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dockItem.active .dockLabel{color:#eaf6ff}
.dockSpacer{flex:1}
.dockTool{height:98px;min-width:82px;flex:none;border:0;background:none;color:#7e93a7;cursor:pointer;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;font-size:9.5px;font-weight:600}
.dockTool:hover{color:#cfe1f1}
.dockTool svg{width:24px;height:24px}

/* ---------- Machine selector / focus view ---------- */
.machineBar{display:flex;align-items:center;flex-wrap:wrap;gap:6px 8px;background:rgba(8,14,20,.82);border:1px solid #1d2c3a;border-radius:12px;padding:7px 10px;backdrop-filter:blur(10px)}
#sideToggle{display:none;border:1px solid #26394a;background:#0e1923;color:#cfe1f1;border-radius:9px;padding:8px 11px;font-size:14px;font-weight:800;cursor:pointer;line-height:1}
#sideToggle:hover{background:#142536}
.machineBar .mbTitle{font-size:11px;letter-spacing:1.4px;color:#8fa4b7;font-weight:800;text-transform:uppercase;margin-right:4px;white-space:nowrap}
.trainingControls{display:none;align-items:center;gap:8px;margin-left:auto}
.trainingControls.show{display:flex}
.trainingBadge{font-size:10px;letter-spacing:1.1px;text-transform:uppercase;color:#9fb3c6;font-weight:900;white-space:nowrap}
.trainingSelect{max-width:260px;background:#07131e;color:#eaf3ff;border:1px solid #2a4054;border-radius:8px;padding:8px 30px 8px 10px;font-size:12px}
/* Krappe weergave van de bovenbalk. In talen met lange knopteksten (Frans, Italiaans)
   paste de balk zelfs op 1920 px niet op één regel: de taalkiezer viel op een tweede
   regel en het apparaatscherm werd daardoor ~39 px korter — alleen in die taal.
   fitMachineBar() zet deze klassen pas op zodra de balk echt omslaat, en haalt ze er
   weer af zodra ze niet meer nodig zijn; de overige talen zien dus niets veranderen.
   Geen tekst inkorten: alleen ruimte tussen en rond de knoppen. */
.machineBar.mbTight{gap:5px 6px;padding:6px 8px}
.machineBar.mbTight .machineBtn{padding:7px 8px}
.machineBar.mbTight #sideToggle{padding:7px 9px}
.machineBar.mbTight .langSelect{padding:7px 7px}
.machineBar.mbTight .trainingSelect{padding:7px 28px 7px 9px}
/* .machineActions heeft een eigen gap; zonder deze regel bleef daar 56 px staan en
   was de krappe stand niet genoeg voor Nederlands, Engels en Portugees. */
.machineBar.mbTight .machineActions{gap:6px}
.machineBar.mbTight .mbTitle{margin-right:2px}
.machineBar.mbTighter{gap:4px 5px;padding:6px 7px}
.machineBar.mbTighter .machineBtn{padding:6px 7px;font-size:11px}
.machineBar.mbTighter #sideToggle{padding:6px 8px;font-size:13px}
.machineBar.mbTighter .langSelect{padding:6px 6px;font-size:11px}
.machineBar.mbTighter .trainingSelect{padding:6px 26px 6px 8px;font-size:11px}
.machineBar.mbTighter .machineActions{gap:5px}
/* De kop krimpt mee maar blijft staan: gemeten is dat niet nodig om de rij op één
   regel te krijgen, en een verdwijnend woord is een inhoudelijke wijziging. */
.machineBar.mbTighter .mbTitle{margin-right:2px;font-size:10px;letter-spacing:.8px}
body.deviceTraining .machineActions #overviewBtn,body.deviceTraining #minAll,body.deviceTraining #dashBtn2{display:none!important}
body.deviceTraining .dockSpacer{flex:1}
body.deviceTraining #dock{display:none!important}
body.deviceTraining #app{grid-template-rows:1fr;grid-template-areas:"side stage"}
body.deviceTraining.student #app{grid-template-columns:0 1fr;grid-template-areas:"side stage"}
body.deviceTraining #focusBtn{display:none!important}
body.deviceTraining #stage{padding-bottom:14px}
/* inset-inline-end en niet right: bij body.rtl (Arabisch, Hebreeuws) verhuist de zijbalk
   naar rechts en moet de leercoach mee naar links spiegelen. Met right:18px bleef hij
   rechts staan en dekte hij 70% van de zijbalk af, inclusief het patiëntprofiel en de
   knop STOP SIMULATIE. Zie ook restoreTrainingCoachPosition(): een versleepte stand
   wordt als leesrichting-offset bewaard, anders springt het paneel er alsnog overheen. */
.trainingCoach{display:none;position:fixed;inset-inline-end:18px;top:76px;width:min(360px,34vw);max-height:calc(100vh - 104px);z-index:320;background:rgba(5,12,18,.96);border:1px solid #2d4b62;border-radius:12px;box-shadow:0 18px 50px rgba(0,0,0,.65);overflow:hidden}
body.deviceTraining .trainingCoach,body.caseCoach .trainingCoach{display:block}
/* Het startscherm ligt op z-index 200, de leercoach op 320 en een apparaatpaneel op 220:
   zonder deze regel blijven die twee bovenop de startkaarten liggen en vangen ze de klik
   ('Studenten en resultaten' en 'Beeldbank' waren daardoor onbereikbaar). Zelfde
   specificiteit als de regel hierboven, maar later in de bron — dus deze wint. */
body.homeOpen .trainingCoach{display:none}
/* !important omdat .mxRouterPanel.show uit de LATER ingevoegde router-stylesheet komt en
   bij gelijke specificiteit anders wint. De panelen worden daarnaast ook echt gesloten. */
body.homeOpen .mxRouterPanel{display:none!important}
.trainingCoach.dragging{opacity:.92;box-shadow:0 22px 70px rgba(0,0,0,.82),0 0 0 2px rgba(74,168,255,.35)}
.trainingCoachHead{display:flex;align-items:center;gap:8px;background:#0e1b25;border-bottom:1px solid #203548;padding:10px 12px;cursor:move;user-select:none}
.trainingCoachHead b{font-size:12px;letter-spacing:1px;text-transform:uppercase;color:#eaf6ff}.trainingCoachHead span{margin-left:auto;font-size:11px;color:#8fa4b7}
.trainingCoachBody{padding:11px 12px;overflow:auto;max-height:calc(100vh - 158px)}
.trainingGoal{font-size:12px;line-height:1.45;color:#c7d9e8;margin-bottom:9px}
.trainingSteps{display:grid;gap:7px}.trainingStep{display:grid;grid-template-columns:20px 1fr;gap:8px;border:1px solid #1f3344;background:#07131d;border-radius:8px;padding:8px;font-size:12px;color:#bcd0e2;line-height:1.35}.trainingStep.done{border-color:#2d8d55;background:#0b2217;color:#d8ffe4}.trainingStep i{width:18px;height:18px;border-radius:50%;display:grid;place-items:center;background:#142536;color:#8fa4b7;font-style:normal;font-size:11px;font-weight:900}.trainingStep.done i{background:#2d8d55;color:#fff}.trainingStepPhase{display:block;margin:0 0 3px;color:#79bfe8;font-size:10px;font-weight:800;letter-spacing:.02em}.trainingStepObjective{display:block;margin-top:5px;color:#9fb4c4;font-size:10px;font-weight:600;line-height:1.4}.trainingStep.done .trainingStepPhase{color:#8edbad}
.trainingFeedback{margin-top:9px;border-top:1px solid #1d3142;padding-top:8px;font-size:12px;color:#ffd98a;line-height:1.4}
.trainingCoachActions{display:flex;gap:7px;margin-top:9px}.trainingCoachActions button{flex:1;border:1px solid #2a4258;background:#102235;color:#eaf3ff;border-radius:8px;padding:8px;font-weight:800;cursor:pointer;font-size:11.5px}.trainingCoachActions button:hover{background:#17324a}
.trainingQuestion{margin-top:9px;border:1px solid #2a4258;background:#07131d;border-radius:8px;padding:9px}.trainingQuestionContext{display:block;margin-bottom:6px;color:#79bfe8;font-size:10px;font-weight:800;line-height:1.4}.trainingQuestion b{display:block;color:#eaf6ff;font-size:12px;margin-bottom:7px}.trainingQuestion button{display:block;width:100%;margin:5px 0;border:1px solid #2a4258;background:#102235;color:#eaf3ff;border-radius:7px;padding:8px;text-align:left;font-weight:800;cursor:pointer}.trainingQuestion button:hover{background:#17324a}.trainingQuestion button.wrong{border-color:#8e2f3b;background:#2a1018}.trainingQuestion button.right{border-color:#2d8d55;background:#0c2919}.trainingQuestion .answerRow{display:grid;grid-template-columns:1fr auto;gap:6px;margin-top:7px}.trainingQuestion input{min-width:0;border:1px solid #2a4258;background:#0e1c28;color:#eaf3ff;border-radius:7px;padding:8px}
.trainingDebrief{margin-top:10px;border:1px solid #2d8d55;background:#081f14;border-radius:8px;padding:9px;color:#d8ffe4;font-size:12px;line-height:1.45}.trainingDebrief b{display:block;margin-bottom:5px}.trainingDebrief .score{font-size:22px;font-weight:900;color:#91f5b4}.studentResults{display:grid;gap:8px}.studentResultCard{border:1px solid #203548;background:#07131d;border-radius:8px;padding:8px;font-size:11.5px;color:#bcd0e2}.studentResultCard b{display:block;color:#eaf6ff;margin-bottom:4px}.studentResultCard .score{color:#91f5b4;font-weight:900}
.machineBtn{border:1px solid #26394a;background:#0e1923;color:#bcd0e2;border-radius:9px;padding:8px 10px;font-size:12px;font-weight:700;cursor:pointer;white-space:nowrap}
.machineBtn:hover{background:#142536;color:#eaf3ff}
.machineBtn.active{border-color:#4aa8ff;background:#163a5a;color:#fff;box-shadow:0 0 14px rgba(74,168,255,.25)}
.machineActions{margin-left:auto;display:flex;gap:8px}.machineActions .machineBtn{background:#111f2b}
.langSelect{border:1px solid #26394a;background:#0e1923;color:#dbeaf8;border-radius:9px;padding:8px 9px;font-size:12px;font-weight:700}
body.rtl{direction:rtl}
body.rtl canvas,body.rtl svg,body.rtl .monitor,body.rtl .defibBody,body.rtl .ventWrap,body.rtl .anes{direction:ltr}
body.rtl .mxRouterList div,body.rtl .mxRouterStep label,body.rtl .vital{direction:rtl}
#stage.focus{grid-template-rows:auto 1fr;grid-template-columns:1fr}
#stage.focus .rowTop,#stage.focus .rowBot{display:contents}
#stage.focus .dev{display:none}
#stage.focus .dev.active{display:flex;grid-column:1/-1;grid-row:2;min-height:0;height:100%}
#stage.focus .dev.active .shellCream,#stage.focus .dev.active .shellGrey,#stage.focus .dev.active .defibShell,#stage.focus .dev.active .labShell,#stage.focus .dev.active .patShell{min-height:0;height:100%;flex:1}
#stage.focus .dev.active .screen{min-height:0}
#stage.focus .dev[data-dev="pumps"].active .pumpRate{font-size:38px}
#stage.focus .dev[data-dev="lab"].active .labRow{font-size:18px;padding:14px 0}
#stage.focus .dev[data-dev="patient"].active .patFoot{font-size:16px}
.deviceControlBox{background:#071019;border:1px solid #1b2b39;border-radius:12px;padding:10px;margin-top:10px}
.deviceControlBox h5{margin:0 0 8px;font-size:11px;letter-spacing:1.2px;text-transform:uppercase;color:#9fb3c6}
.dcGrid{display:grid;grid-template-columns:1fr 1fr;gap:7px}.dcGrid .miniBtn{text-align:center}
.dcNote{font-size:11px;color:#8fa4b7;line-height:1.45;margin-top:8px}

/* ---------- Realistic device menu buttons ---------- */
.deviceSoftMenu{position:absolute;z-index:8;display:flex;gap:4px;pointer-events:auto}
.deviceSoftMenu.bottom{left:8px;right:156px;bottom:7px;justify-content:space-between}
.deviceSoftMenu.right{right:5px;top:30px;bottom:8px;flex-direction:column;width:104px}
.softKey{border:1px solid #2a3a47;background:linear-gradient(#182531,#0b141c);color:#cfe1f1;border-radius:4px;padding:4px 6px;font-size:9px;font-weight:800;letter-spacing:.25px;cursor:pointer;box-shadow:inset 0 1px rgba(255,255,255,.08)}
.softKey:hover,.softKey.on{background:linear-gradient(#26577d,#12304a);border-color:#4aa8ff;color:#fff}
.monitorSideKeys{display:grid;grid-template-columns:1fr;gap:4px;padding:4px;background:#050608;border-left:1px solid #171d22}
.monitorSideKeys .softKey{font-size:8.5px;padding:5px 3px;border-radius:3px}
.ventHardKeys,.anesHardKeys{position:absolute;left:0;right:0;bottom:4px;z-index:9;display:grid;grid-template-columns:repeat(7,1fr);gap:5px;padding:0 8px 8px}
.ventHardKeys .softKey,.anesHardKeys .softKey{background:linear-gradient(#e8e9e6,#c8cac5);border-color:#92958e;color:#30342f;box-shadow:inset 0 1px #fff}
.pumpMenuRow{display:flex;gap:4px;margin-top:5px}.pumpMenuRow .softKey{flex:1;background:#d8d0bf;color:#333;border-color:#8b8372;font-size:8px;padding:3px 2px}
.zMenuStrip{position:absolute;left:10px;right:10px;bottom:7px;z-index:3;display:flex;gap:4px}.zMenuStrip .softKey{flex:1;font-size:8px;padding:3px 2px}
.labMenuStrip,.patientMenuStrip{display:flex;gap:6px;padding:8px 12px;background:#0b1620;border-top:1px solid #1d2c3a}.labMenuStrip .softKey,.patientMenuStrip .softKey{flex:1}
#stage.focus .deviceSoftMenu.bottom{right:182px}.menuStatus{font-size:10px;color:#86a6c0;margin-top:7px;line-height:1.35}


/* ---------- Dynamic realistic button feedback / device menus ---------- */
.deviceStatusOverlay{position:absolute;left:14px;top:34px;min-width:210px;max-width:55%;z-index:20;background:rgba(5,12,18,.92);border:1px solid #33506a;border-radius:8px;box-shadow:0 12px 34px rgba(0,0,0,.45),0 0 18px rgba(74,168,255,.16);padding:9px 11px;color:#dcecff;font-size:11px;line-height:1.35;pointer-events:none;opacity:0;transform:translateY(-4px);transition:.15s}
.deviceStatusOverlay.show{opacity:1;transform:none}.deviceStatusOverlay b{display:block;color:#fff;font-size:12px;margin-bottom:4px}.deviceStatusOverlay .row{display:flex;justify-content:space-between;gap:18px;border-top:1px solid rgba(120,160,190,.18);padding-top:4px;margin-top:4px}.deviceStatusOverlay .warn{color:#ffcf45}.deviceStatusOverlay .bad{color:#ff6b6b}.deviceStatusOverlay .ok{color:#63ff8a}
.deviceModeBadge{position:absolute;right:132px;top:30px;z-index:18;background:#07121b;border:1px solid #2a4258;border-radius:6px;padding:4px 7px;color:#9fd0ff;font-size:10px;font-weight:800;letter-spacing:.35px;pointer-events:none}
.deviceHardPanel{position:absolute;z-index:12;display:flex;gap:5px;pointer-events:auto}.deviceHardPanel.right{right:8px;top:54px;bottom:46px;flex-direction:column;width:74px}.deviceHardPanel.bottom{left:12px;right:12px;bottom:5px;justify-content:center;flex-wrap:wrap}.deviceHardPanel .softKey{min-height:24px}.deviceHardPanel.right .softKey{flex:1;font-size:8px;padding:2px}.softKey:active,.miniBtn:active,.hwBtn:active,.zKey:active{transform:translateY(1px);filter:brightness(1.25)}
.softKey.on,.hwBtn.on,.zKey.on{outline:2px solid rgba(74,168,255,.85);box-shadow:0 0 16px rgba(74,168,255,.35),inset 0 1px rgba(255,255,255,.12)}
.pumpStatusBadge{position:absolute;right:4px;top:4px;background:#07120b;border:1px solid #267842;color:#58ff7b;border-radius:4px;padding:2px 4px;font-size:7.5px;font-weight:900}.pump.paused .pumpStatusBadge{background:#211906;border-color:#b98617;color:#ffd36b}.pump.alarm .pumpStatusBadge{background:#2a0808;border-color:#e44242;color:#ff7777}.pump{position:relative}
.zShockKey.fired{animation:shockPulse .45s ease-out}.screen.flash,.zScreen.flash{animation:screenFlash .16s ease-out}.dev.menuOpen{box-shadow:0 0 0 4px rgba(74,168,255,.18),0 14px 38px rgba(0,0,0,.55)}
@keyframes screenFlash{0%{filter:brightness(1.45)}100%{filter:brightness(1)}}@keyframes shockPulse{0%{transform:scale(1)}50%{transform:scale(1.12)}100%{transform:scale(1)}}

@media(max-width:900px){.machineActions{margin-left:0}.machineBtn{padding:8px 9px}}
@media(max-width:520px){
 #stage,#stage.focus{min-width:0;grid-template-columns:minmax(0,1fr)}
 .machineBar{min-width:0;width:100%}
 .trainingControls.show{flex:1 1 100%;min-width:0;margin-left:0;flex-wrap:wrap}
 .trainingBadge{flex:1 1 100%;white-space:normal}
 .trainingSelect{width:100%;max-width:none;min-width:0}
}

/* compacte apparaat-kolommen zodat het dashboard zonder scrollen past */
@media(max-width:1560px){
  .monGrid{grid-template-columns:minmax(0,1fr) 118px}
  .alarmBanner{right:118px}
  .silenceChip{right:124px}
  .deviceModeBadge{right:104px}
  .deviceSoftMenu.bottom{right:126px}
  #stage.focus .deviceSoftMenu.bottom{right:150px}
  .par .pv{font-size:34px!important}
  .par .pv[style*="27px"]{font-size:22px!important}
  .ventWrap{grid-template-columns:minmax(0,1fr) 74px}
  .ventNum .v{font-size:15px}
  .defibBody{grid-template-columns:minmax(0,1fr) 86px}
  .pump{grid-template-columns:22px minmax(0,1fr) 54px}
  .machineBtn{padding:7px 8px;font-size:11.5px}
  .capKey{font-size:8px;padding:4px 3px}
  .knobHint{display:none}
}
@media(max-width:900px){
  .anesBody{grid-template-columns:minmax(0,1fr) minmax(0,1.25fr)}
  .anesCol.anesAgent,.anesCol.anesVent{display:none}
  .hwBtn{padding:5px 7px;font-size:9.5px}
  .mbTitle{display:none}
}

@media(max-width:1180px){
  :root{--sideW:0px}
  body.teacher #side{position:fixed;left:0;top:0;bottom:var(--dockH);z-index:60;width:300px;transform:translateX(-103%);transition:.2s;box-shadow:24px 0 60px rgba(0,0,0,.5)}
  body.teacher.sideOpen #side{transform:none}
  body.teacher #sideToggle{display:block}
  .rowTop,.rowBot{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
}


/* ===== Button layout repair: keep hardkeys out of graphs ===== */
.ventMain .ventCanvasWrap{bottom:92px}
.ventMain .ventHardKeys{
  position:absolute;left:0;right:0;top:auto;bottom:66px;width:auto;height:26px;
  z-index:6;display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:4px;
  padding:3px 6px;background:#0a1117;border-top:1px solid #142635;border-bottom:1px solid #142635;
  pointer-events:auto
}
.ventMain .ventHardKeys .softKey{
  min-width:0;min-height:20px;padding:2px 3px;font-size:7.8px;line-height:1.05;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.anes{grid-template-rows:24px minmax(0,1fr) 48px 22px 30px}
.anes .anesHardKeys{
  position:static;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px;
  padding:4px 7px 6px;background:#0a1117;border-top:1px solid #142635;z-index:3;pointer-events:auto
}
.anes .anesHardKeys .softKey{
  min-width:0;min-height:20px;padding:2px 3px;font-size:7.8px;line-height:1.05;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.anes .anesTabs span,.ventTabs span,.anes .anesHardKeys .softKey,.ventMain .ventHardKeys .softKey{pointer-events:auto}


.anesWaveStack{position:relative}
.anesWaveCanvas{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:1;pointer-events:none}
.anesMiniWave{z-index:2;background:transparent}
.anesMiniWave svg{opacity:.18}



/* ===== Patient realism repair ===== */
.patBody{background:radial-gradient(120% 95% at 50% 8%,#263849,#0a121a 66%)}
.patSvg svg{display:block;width:100%;height:100%}
.patMonitorStrip{position:absolute;left:10px;right:10px;top:10px;z-index:3;display:grid;grid-template-columns:repeat(5,1fr);gap:6px;pointer-events:none}
.patMetric{background:rgba(3,9,14,.82);border:1px solid #21384b;border-radius:6px;padding:5px 6px;color:#dbeaf8;font-size:10px}.patMetric b{display:block;font-size:16px;line-height:1;color:#fff;font-variant-numeric:tabular-nums}.patMetric.warn b{color:#ffd23c}.patMetric.bad b{color:#ff6b55}
.patSpeechBubble{position:absolute;left:18px;bottom:78px;max-width:58%;z-index:4;background:rgba(235,245,255,.94);color:#111;border:1px solid #9eb8ce;border-radius:8px;padding:8px 10px;font-size:12px;line-height:1.25;box-shadow:0 10px 28px rgba(0,0,0,.35);display:none}.patSpeechBubble.show{display:block}
.patSpeechBubble:after{content:"";position:absolute;left:28px;bottom:-8px;border-width:8px 8px 0 8px;border-style:solid;border-color:rgba(235,245,255,.94) transparent transparent transparent}
.patStatusPill{position:absolute;right:12px;bottom:78px;z-index:4;background:rgba(3,9,14,.86);border:1px solid #263e52;border-radius:7px;padding:7px 9px;color:#dbeaf8;font-size:11px;line-height:1.35;pointer-events:none}.patStatusPill b{color:#fff}



/* ===== Patient photo-realistic scene ===== */
.patPhotoScene{position:absolute;inset:0;overflow:hidden;background:#071019}
.patPhotoBase{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center center;filter:contrast(1.03) saturate(1.01);transform:scale(1.01)}
.patPhotoTint{position:absolute;inset:0;pointer-events:none;mix-blend-mode:multiply;opacity:.0}
.patPhotoScene.cyanotic .patPhotoTint{background:#87a8d6;opacity:.26}
.patPhotoScene.pale .patPhotoTint{background:#ded6cd;opacity:.22}
.patPhotoScene.flushed .patPhotoTint{background:#d78a70;opacity:.18}
.patPhotoScene.left-lateral .patPhotoBase{transform:scale(1.02) translateX(-1.5%) rotate(-.6deg)}
.patPhotoScene.supine .patPhotoBase{transform:scale(1.015)}
.patPhotoScene.profile-woman52 .patPhotoBase,.patPhotoScene.profile-preg .patPhotoBase{filter:contrast(1.03) saturate(1.02) hue-rotate(-4deg)}
.patPhotoScene.profile-man68 .patPhotoBase{filter:contrast(1.08) saturate(.82) brightness(.97)}
.patPhotoScene.profile-man32 .patPhotoBase{filter:contrast(1.05) saturate(1.08) brightness(1.02)}
.patPhotoScene.profile-boy8 .patPhotoBase{transform:scale(.86) translateY(6%);transform-origin:center bottom;filter:contrast(1.02) saturate(1.06) brightness(1.05)}
.patPhotoScene.profile-preg .patPhotoBase{transform:scale(1.04) translateY(1%)}
.patPhotoScene.profile-preg:after{content:"";position:absolute;left:38%;top:58%;width:25%;height:16%;border-radius:50%;background:rgba(230,190,160,.18);box-shadow:0 0 28px rgba(255,220,190,.18);pointer-events:none}
.patPhotoScene.profile-man68:after{content:"";position:absolute;left:37%;top:15%;width:22%;height:11%;border-radius:45%;background:rgba(235,235,235,.20);filter:blur(6px);pointer-events:none}
.patPhotoScene.profile-boy8:after{content:"";position:absolute;left:12%;right:12%;bottom:0;height:18%;background:rgba(12,22,34,.25);pointer-events:none}
.patOxygenState{position:absolute;left:19%;top:38%;background:rgba(8,14,20,.84);border:1px solid #3a6c88;color:#dff3ff;border-radius:6px;padding:4px 7px;font-size:10px;font-weight:800;letter-spacing:.4px;display:block;box-shadow:0 5px 18px rgba(0,0,0,.32)}
.patPhotoScene.no-oxygen .patOxygenState{color:#ffd23c;border-color:#8d6c1d}.patPhotoScene.oxygen-ventilator .patOxygenState{color:#91f5b4;border-color:#2d8d55}
.patPhotoScene.conscious-verward .patPhotoBase{animation:patAgitation 2.4s ease-in-out infinite alternate}
.patPhotoScene.pain-high .patPhotoBase{filter:contrast(1.08) saturate(.92) brightness(.92)}
@keyframes patAgitation{0%{translate:-.25% 0}100%{translate:.35% 0}}

/* ===== Patient instructor editor ===== */
.mxPatientEditor{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin:8px 0}
.mxStudentControls,.mxLabRequestBar{margin:9px 0;padding:9px;border:1px solid #29465d;border-radius:9px;background:#081722}.mxStudentControls h6,.mxLabRequestBar h6{margin:0 0 8px;color:#dcecff;font-size:10px;letter-spacing:.9px;text-transform:uppercase}.mxStudentControls .miniGrid,.mxLabRequestBar .miniGrid{grid-template-columns:repeat(auto-fit,minmax(132px,1fr))}.mxStudentControls .miniBtn,.mxLabRequestBar .miniBtn{min-height:38px;text-align:left}.mxStudentControls .miniBtn b,.mxLabRequestBar .miniBtn b{display:block;color:#fff}.mxStudentControls .miniBtn small,.mxLabRequestBar .miniBtn small{display:block;margin-top:2px;color:#98afc2;font-size:9px}.mxLabResults{display:grid;gap:4px;margin-top:9px}.mxLabResult{display:grid;grid-template-columns:minmax(90px,1fr) minmax(72px,auto) 64px 32px;align-items:center;gap:8px;padding:7px 9px;border:1px solid #1d3344;border-radius:7px;background:#07121b;font-size:11.5px}.mxLabResult .value{text-align:right;color:#f4f9fd;font-weight:850}.mxLabResult .reference{color:#8fa6b8;font-size:9px}.mxLabResult .trend{text-align:center;color:#b7cddd;font-size:15px}.mxLabResult.hi .value,.mxLabResult.hi .trend{color:#ff9a83}.mxLabResult.lo .value,.mxLabResult.lo .trend{color:#73c4ff}
.mxPatientField{display:flex;align-items:center;justify-content:space-between;gap:8px;background:#07121b;border:1px solid #203548;border-radius:7px;padding:7px;color:#bfd3e4;font-size:11.5px}
.mxPatientField span{display:flex;align-items:center;gap:6px;white-space:nowrap}
.mxPatientField b{color:#fff}
.mxPatientField select,.mxPatientField input{min-width:0;max-width:130px;background:#0e1c28;color:#eaf3ff;border:1px solid #2a4258;border-radius:6px;padding:5px}
.mxPatientField input[type="range"]{padding:0;accent-color:#4aa8ff}
.mxPatientAsk{display:grid;grid-template-columns:1fr auto auto;gap:6px;margin:8px 0}
.mxPatientAsk input{min-width:0;background:#0e1c28;color:#eaf3ff;border:1px solid #2a4258;border-radius:7px;padding:8px}
.mxPatientAsk button{border:1px solid #2a4258;border-radius:7px;background:#173047;color:#eaf3ff;padding:7px 9px;font-weight:800;cursor:pointer}
.mxPatientAsk button.green{background:#123a23;border-color:#2a7a48;color:#cdffdd}.mxPatientAsk button.red{background:#3a1414;border-color:#7a2a2a;color:#ffc7c7}
.mxPatientAsk input:focus{outline:2px solid #4aa8ff;outline-offset:1px}.mxPatientMicStatus{grid-column:1/-1;min-height:16px;color:#9fb4c6;font-size:10.5px;line-height:1.35}
.mxPatientVoiceHint{font-size:11px;color:#9fb4c6;line-height:1.35;margin-top:6px}
.mxPatientVoiceControls{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 10px;margin:10px 0;padding:11px;border:1px solid #2a4258;border-radius:10px;background:linear-gradient(145deg,rgba(15,31,44,.96),rgba(9,20,30,.96));box-shadow:inset 0 1px 0 rgba(255,255,255,.035)}
.mxPatientVoiceControls>label{display:grid;gap:5px;min-width:0}.mxPatientVoiceControls>label>span{font-size:10px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:#adc2d4}
.mxPatientVoiceControls select{width:100%;min-width:0;border:1px solid #39536a;border-radius:7px;background:#0b1925;color:#eef7ff;padding:8px;outline:none}.mxPatientVoiceControls select:focus-visible{outline:2px solid #56b5ff;outline-offset:2px}
.mxPatientVoiceActions{display:flex;align-items:end;gap:6px}.mxPatientVoiceActions button{min-height:36px;border:1px solid #39536a;border-radius:7px;background:#173047;color:#eef7ff;padding:7px 10px;font-weight:800;cursor:pointer}.mxPatientVoiceActions button:focus-visible{outline:2px solid #56b5ff;outline-offset:2px}.mxPatientVoiceActions button:active{transform:translateY(1px)}
.mxPatientVoiceStatus{grid-column:1/-1;min-height:18px;padding-left:10px;border-left:3px solid #6f8799;color:#c8d8e5;font-size:11px;line-height:1.45}.mxPatientVoiceStatus[data-state="speaking"]{border-color:#42cf78;color:#d7ffe5}.mxPatientVoiceStatus[data-state="preparing"]{border-color:#e8b84a;color:#fff0c6}.mxPatientVoiceStatus[data-state="unavailable"],.mxPatientVoiceStatus[data-state="textOnly"],.mxPatientVoiceStatus[data-state="audioOff"],.mxPatientVoiceStatus[data-state="preferenceMissing"]{border-color:#eea13d;color:#ffe3bb}
.mxPatientVoiceControls>p{grid-column:1/-1;margin:0;color:#879dad;font-size:9.5px;line-height:1.4}
.mxPatientVoicePrivacy{margin:7px 0 3px;padding:7px 9px;border-left:2px solid #55728a;background:rgba(9,23,34,.58);color:#94aabc;font-size:9.5px;line-height:1.45}
@media(max-width:720px){.mxPatientVoiceControls{grid-template-columns:1fr}.mxPatientVoiceActions{align-items:stretch}.mxPatientVoiceActions button{flex:1;min-height:44px}}
.mxQuestionBank{display:grid;gap:9px;margin-top:9px}.mxQuestionGroup{border:1px solid #203548;background:#07131d;border-radius:8px;padding:8px}.mxQuestionGroup h6{margin:0 0 7px;font-size:11px;color:#9fb4c6;letter-spacing:.8px;text-transform:uppercase}.mxQuestionGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.mxQuestionGrid button{border:1px solid #2a4258;border-radius:7px;background:#102235;color:#eaf3ff;padding:7px;text-align:left;font-size:11.5px;cursor:pointer}.mxQuestionGrid button:hover{background:#17324a}
.mxAssessLib{display:grid;gap:8px}.mxAssessBlock{border:1px solid #203548;background:#07131d;border-radius:8px;padding:8px}.mxAssessBlock h6{margin:0 0 6px;font-size:11px;color:#dcecff;letter-spacing:.6px}.mxAssessBlock ul{margin:0;padding-left:18px;color:#bcd0e2;font-size:11.5px;line-height:1.45}.mxAssessBlock li{margin:2px 0}.mxAssessWarn{color:#ffd98a}.mxAssessBad{color:#ff8b8b}.mxAssessOk{color:#91f5b4}

/* ===== Bezel bar: capacitive keys + rotary knob ===== */
.bezelBar{display:flex;align-items:center;gap:6px;padding:4px 10px 6px;min-height:30px}
.capKey{flex:1;max-width:96px;border:1px solid #a0a39d;border-radius:6px;background:linear-gradient(#eef0ed,#d5d7d4);
  color:#3c413e;font-size:9px;font-weight:800;letter-spacing:.4px;cursor:pointer;padding:5px 4px;text-align:center;
  box-shadow:inset 0 1px 0 #fff,0 1px 2px rgba(0,0,0,.22)}
.capKey:hover{background:linear-gradient(#f6f8f5,#dfe1de)}
.capKey:active{transform:translateY(1px)}
.capKey.warn{color:#8a5a00}
.bezelKnob{margin-left:auto;width:38px;height:38px;border-radius:50%;flex:none;cursor:pointer;position:relative;
  background:radial-gradient(circle at 36% 30%,#f2f4f1,#a9ada8 62%,#848782);border:1px solid #6d706b;
  box-shadow:inset 0 1px 0 #fff,inset 0 -3px 6px rgba(0,0,0,.22),0 3px 7px rgba(0,0,0,.4)}
.bezelKnob:after{content:"";position:absolute;left:50%;top:5px;width:3px;height:10px;border-radius:2px;background:#4c504b;transform:translateX(-50%)}
.bezelKnob:hover{filter:brightness(1.05)}
.bezelKnob:active{transform:rotate(18deg)}
.knobHint{font-size:8px;font-weight:800;color:#767b76;letter-spacing:.5px;margin-left:6px;align-self:center}

/* ===== ICU Central Station overlay ===== */
#centralView{position:absolute;inset:0;z-index:40;display:none;flex-direction:column;background:#05080c;border-radius:12px;border:1px solid #1c2b38;overflow:hidden}
#centralView.show{display:flex}
.centralHead{display:flex;align-items:center;gap:10px;padding:9px 14px;background:#0b1420;border-bottom:1px solid #1c2b38}
.centralHead b{font-size:13px;letter-spacing:1.6px;color:#e8f2fc}
.centralHead .sub{color:#7f95a9;font-size:11px}
.centralHead .closeBtn{margin-left:auto;border:1px solid #2a4258;background:#102235;color:#dcecff;border-radius:7px;padding:6px 12px;font-weight:800;cursor:pointer;font-size:11.5px}
.centralHead .closeBtn:hover{background:#17324a}
.centralGrid{flex:1;display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:1fr;gap:10px;padding:12px;min-height:0;overflow:auto}
.cBed{border:1px solid #22384a;background:#070d13;border-radius:10px;display:flex;flex-direction:column;overflow:hidden;cursor:pointer;transition:border-color .15s;min-height:150px}
.cBed:hover{border-color:#3c5f7e}
.cBed.crit{border-color:#7c1a1a;box-shadow:inset 0 0 0 1px rgba(255,60,50,.25)}
.cBed.crit .cBedHead{background:#2a0d0d}
.cBed.warn{border-color:#8a6d1c}
.cBed.warn .cBedHead{background:#241d06}
.cBed.activeBed{outline:2px solid #3f8fe8}
.cBedHead{display:flex;align-items:center;gap:8px;padding:6px 10px;background:#0c1520;border-bottom:1px solid #1c2b38;font-size:11px}
.cBedHead b{color:#eaf3fc;letter-spacing:.5px}
.cBedHead span{color:#8fa4b7;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cBedHead .cAl{margin-left:auto;font-weight:900;font-size:9.5px;letter-spacing:.6px}
.cBed.crit .cAl{color:#ff5f52;animation:blink .8s infinite}
.cBed.warn .cAl{color:#ffd23c}
.cBed.ok .cAl{color:#4ce07c}
.cBedWave{flex:1;position:relative;min-height:52px;background:#02050a}
.cBedWave canvas{position:absolute;inset:0;width:100%;height:100%}
.cBedNums{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #15222d;background:#060b11}
.cBedNums .cn{padding:5px 4px 6px;text-align:center;border-right:1px solid #101b26}
.cBedNums .cn:last-child{border-right:0}
.cBedNums .cn span{display:block;font-size:8px;color:#7f93a6;font-weight:700;letter-spacing:.4px}
.cBedNums .cn b{font-size:16px;font-weight:900;font-variant-numeric:tabular-nums;line-height:1.1}
.cBedFoot{padding:4px 10px 7px;font-size:9.5px;color:#7f95a9;background:#060b11;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ===== NIBP measuring / sound toggle ===== */
.par .nibpBusy{color:#ffd23c;font-size:10px;font-weight:800;animation:blink 1.1s infinite}
#soundBtn.off{color:#7c8ea0}
#soundBtn.on{border-color:#2fae62;color:#7ff0a8;background:#0d2417}
.silenceChip{display:none;position:absolute;right:154px;top:2px;z-index:7;background:#3a2f10;border:1px solid #8a6d1c;color:#ffd75e;border-radius:4px;padding:1px 7px;font-size:9px;font-weight:900;font-variant-numeric:tabular-nums}
.silenceChip.show{display:block}

/* ===== Tutor dashboard ===== */
#tutorDash{position:fixed;inset-block:0 var(--dockH);inset-inline:var(--sideW) 0;z-index:260;display:none;flex-direction:column;background:#05080c;border-radius:12px;border:1px solid #1c2b38;overflow:hidden}
#tutorDash.show{display:flex}
.tdHead{display:flex;align-items:center;gap:10px;padding:10px 14px;background:#0b1420;border-bottom:1px solid #1c2b38}
.tdHead b{font-size:13px;letter-spacing:1.6px;color:#e8f2fc}
.tdHead .sub{color:#7f95a9;font-size:11px}
.tdHead .closeBtn{margin-left:auto;border:1px solid #2a4258;background:#102235;color:#dcecff;border-radius:7px;padding:6px 12px;font-weight:800;cursor:pointer;font-size:11.5px}
.tdHead .closeBtn:hover{background:#17324a}
.tdBody{flex:1;display:grid;grid-template-columns:1.15fr 1fr;gap:12px;padding:12px;min-height:0;overflow:auto}
.tdCol{display:flex;flex-direction:column;gap:12px;min-width:0}
.tdCard{border:1px solid #1e2f3e;background:#080f16;border-radius:10px;overflow:hidden}
.tdCard>h5{margin:0;padding:9px 12px;font-size:10.5px;letter-spacing:1.4px;text-transform:uppercase;color:#9fb3c6;background:#0c1520;border-bottom:1px solid #1c2b38;display:flex;align-items:center;gap:8px}
.tdCard>h5 .cnt{margin-left:auto;color:#5fb6ff;font-size:10px}
.tdCardBody{padding:10px 12px;display:grid;gap:8px}
.tdLiveCard{border:1px solid #21384a;background:#0a1219;border-radius:9px;padding:9px 11px;display:grid;gap:6px}
.tdLiveCard.offline{opacity:1;background:#080e14;border-color:#29323a}.tdLiveCard.offline .tdLiveMeta,.tdLiveCard.offline .dev{color:#91a1ae}
.tdLiveTop{display:flex;align-items:center;gap:8px}
.tdLiveTop b{color:#eaf3fc;font-size:12.5px}
.tdLiveTop .dev{font-size:10px;color:#8fa4b7;background:#101d2a;border:1px solid #223a4e;border-radius:4px;padding:2px 7px;font-weight:700}
.tdLiveTop .onl{margin-left:auto;font-size:9px;font-weight:900;letter-spacing:.6px}
.tdLiveCard:not(.offline) .onl{color:#4ce07c}
.tdLiveCard.offline .onl{color:#7c8ea0}
.tdBar{height:9px;border-radius:5px;background:#0e1a24;border:1px solid #1e3345;overflow:hidden}
.tdBar i{display:block;height:100%;background:linear-gradient(90deg,#2563a8,#4aa8ff);border-radius:5px;transition:width .4s}
.tdLiveMeta{display:flex;gap:12px;font-size:10.5px;color:#8fa4b7;flex-wrap:wrap}
.tdLiveMeta b{color:#cfe1f1}
.tdStudent{border:1px solid #203243;background:#0a1219;border-radius:9px;overflow:hidden}
.tdStudentHead{display:flex;align-items:center;gap:10px;padding:8px 11px;cursor:pointer}
.tdStudentHead:hover{background:#0e1822}
.tdStudentHead b{color:#eaf3fc;font-size:12.5px}
.tdStudentHead .avg{margin-left:auto;font-weight:900;color:#91f5b4;font-size:13px}
.tdStudentHead .n{color:#7f95a9;font-size:10.5px}
.tdSpark{display:flex;gap:2px;align-items:flex-end;height:22px;width:90px}
.tdSpark i{flex:1;background:#2f6da8;border-radius:1px;min-height:2px}
.tdSpark i.good{background:#2fae62}
.tdSpark i.bad{background:#b8452f}
.tdResults{display:none;border-top:1px solid #182a3a;padding:8px 11px;gap:7px}
.tdStudent.open .tdResults{display:grid}
.tdResult{border:1px solid #1c2e3f;background:#07101a;border-radius:7px;padding:7px 9px;font-size:11px;color:#bcd0e2;display:grid;gap:5px}
.tdResult b{color:#eaf3fc}
.tdResult .score{font-weight:900;color:#91f5b4}
.tdResult .score.low{color:#ffb08a}
.tdAssess{display:grid;grid-template-columns:64px 1fr auto;gap:6px}
.tdAssess input,.tdAssess textarea{background:#0e1c28;color:#eaf3ff;border:1px solid #2a4258;border-radius:6px;padding:6px;font-size:11px;min-width:0}
.tdAssess button{border:1px solid #2a4258;background:#173047;color:#eaf3ff;border-radius:6px;padding:6px 10px;font-weight:800;cursor:pointer;font-size:10.5px}
.tdAssess button:hover{background:#1d3d5a}
.tdAssessSaved{font-size:10px;color:#91f5b4}
.tdTeamRow{display:grid;grid-template-columns:1fr 1fr auto;gap:7px}
.tdTeamRow select{background:#0e1c28;color:#eaf3ff;border:1px solid #2a4258;border-radius:7px;padding:8px;font-size:11.5px;min-width:0}
.tdTeamRow button{border:1px solid #2d8d55;background:#0c2919;color:#a9f5c4;border-radius:7px;padding:8px 12px;font-weight:800;cursor:pointer;font-size:11.5px}
.tdTeamRow button:hover{background:#123a23}
.tdHint{font-size:10.5px;color:#7f95a9;line-height:1.5}
.tdEmpty{font-size:11.5px;color:#7f95a9;padding:4px 0}

/* Tutor-dashboard: één primaire taak per tabblad, met een vaste beslislaag erboven. */
.tdNav{display:flex;align-items:center;gap:6px;padding:8px 12px;background:#07111a;border-bottom:1px solid #1c2b38;overflow-x:auto}
.tdNav button{border:1px solid #263d50;background:#0d1a26;color:#9fb3c6;border-radius:8px;padding:7px 12px;font-size:11px;font-weight:800;cursor:pointer;white-space:nowrap}
.tdNav button:hover{background:#13283a;color:#eaf3fc}.tdNav button.on{background:#16456f;border-color:#4aa8ff;color:#fff;box-shadow:0 0 14px rgba(74,168,255,.18)}
.tdKpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;padding:10px 12px 0;background:#05080c}
.tdKpi{border:1px solid #1e3344;background:linear-gradient(160deg,#0d1a25,#08111a);border-radius:9px;padding:9px 11px;min-width:0}
.tdKpi span{display:block;color:#8fa4b7;font-size:9.5px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tdKpi b{display:block;margin-top:3px;color:#eaf3fc;font-size:20px;line-height:1;font-variant-numeric:tabular-nums}.tdKpi.attention b{color:#ffd36b}
#tutorDash .tdBody{grid-template-columns:minmax(0,1fr);gap:0;padding:12px}
#tutorDash .tdCol{display:contents}
#tutorDash [data-td-panel]{display:none}
#tutorDash:not([data-tab]) [data-td-panel="live"],#tutorDash[data-tab="live"] [data-td-panel="live"],#tutorDash[data-tab="attention"] [data-td-panel="attention"],#tutorDash[data-tab="results"] [data-td-panel="results"],#tutorDash[data-tab="content"] [data-td-panel="content"]{display:block}
.tdAttentionList{display:grid;gap:8px}.tdAttentionItem{display:grid;grid-template-columns:minmax(150px,1fr) minmax(180px,1.5fr) auto;gap:10px;align-items:center;border:1px solid #3e3619;background:#171507;border-radius:9px;padding:10px 12px}
.tdAttentionItem strong{font-size:12.5px;color:#fff}.tdAttentionItem span{font-size:11px;color:#c7b97b}.tdAttentionItem button{border:1px solid #6e5c1e;background:#2a230b;color:#ffe69a;border-radius:7px;padding:7px 10px;font-size:10.5px;font-weight:800;cursor:pointer}
[dir="rtl"] .tdKpi,[dir="rtl"] .tdAttentionItem{text-align:right}
@media(max-width:760px){#tutorDash{inset:0;border-radius:0}.tdKpis{grid-template-columns:repeat(2,minmax(0,1fr))}.tdAttentionItem{grid-template-columns:1fr}.tdHead .sub{display:none}}

/* Eén consistente toetsenbordfocus; voorheen was die alleen op drie speciale controls zichtbaar. */
:where(button,input,select,textarea,[role="button"],[role="tab"]):focus-visible{outline:2px solid #69b9ff!important;outline-offset:2px!important;box-shadow:0 0 0 4px rgba(74,168,255,.18)!important}
.loginDisclaimer,.homeFoot{color:#7f95a9}
body.student.caseCoach #stage,body.student.deviceTraining #stage{padding-inline-end:min(382px,35vw)}
@media(max-width:980px){body.student.caseCoach #stage,body.student.deviceTraining #stage{padding-inline-end:14px;padding-bottom:min(360px,43vh)}body.student .trainingCoach{top:auto;bottom:12px;inset-inline:12px;width:auto;max-height:40vh}body.student .trainingCoachBody{max-height:calc(40vh - 44px)}}
@media(prefers-reduced-motion:reduce){
 *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
 .mxAlarmLamp.yellow:after,.mxAlarmLamp.red:after,.pump.alarm .pLed,.cBed.crit .cAl{opacity:1!important}
}

/* ===== Startscherm (landingsdashboard voor de opleider) =====
   Na inloggen eerst regie, dan pas apparaten: de simulatie draait niet ongevraagd. */
#homeView{position:fixed;inset:0;z-index:200;display:none;flex-direction:column;overflow:auto;
  background:radial-gradient(120% 80% at 50% -10%,#16232f,#070b10 60%)}
#homeView.show{display:flex}
.homeTop{display:flex;align-items:center;gap:14px;padding:16px 30px;border-bottom:1px solid #16242f;background:rgba(8,13,19,.7);backdrop-filter:blur(8px);position:sticky;top:0;z-index:2}
.homeBrand{display:flex;align-items:center;gap:11px;font-weight:800;font-size:17px;letter-spacing:.3px;color:#eaf3fc}
.homeBrand img{max-height:26px;width:auto;display:block}
.homeOrg{margin-left:auto;text-align:right;line-height:1.35}
.homeOrg b{display:block;font-size:13px;color:#eaf3fc}
.homeOrg span{font-size:11px;color:#8fa4b7}
.homeTop .homeBtn{border:1px solid #26394a;background:#0e1923;color:#cfe1f1;border-radius:9px;padding:9px 14px;font-size:12px;font-weight:700;cursor:pointer}
.homeTop .homeBtn:hover{background:#142536}
.homeBody{flex:1;max-width:1180px;width:100%;margin:0 auto;padding:34px 30px 46px}
.homeHi{font-size:26px;font-weight:800;color:#eef5fc;letter-spacing:-.2px}
.homeSub{margin-top:7px;color:#8fa4b7;font-size:13.5px;line-height:1.55;max-width:70ch}
.homeGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(258px,1fr));gap:15px;margin-top:26px}
.homeCard{position:relative;text-align:left;border:1px solid #1e3040;background:linear-gradient(160deg,#101c27,#0b141d);border-radius:14px;padding:20px;cursor:pointer;
  display:flex;flex-direction:column;gap:9px;transition:border-color .16s,transform .16s,box-shadow .16s;font-family:inherit;color:inherit}
.homeCard:hover{border-color:#3f7fb5;transform:translateY(-2px);box-shadow:0 14px 34px rgba(0,0,0,.42)}
.homeCard:focus-visible{outline:2px solid #4aa8ff;outline-offset:2px}
.homeCard .ic{width:40px;height:40px;border-radius:11px;display:grid;place-items:center;background:#132738;border:1px solid #24405a;color:#7fc0f5}
.homeCard .ic svg{width:21px;height:21px}
.homeCard h3{margin:0;font-size:15px;font-weight:800;color:#eaf3fc}
.homeCard p{margin:0;font-size:12px;line-height:1.5;color:#8fa4b7}
.homeCard .badge{position:absolute;right:14px;top:16px;font-size:9.5px;font-weight:900;letter-spacing:.5px;color:#91f5b4;background:#0c2919;border:1px solid #2d8d55;border-radius:5px;padding:2px 7px}
.homeCard.primary{border-color:#2f6ea8;background:linear-gradient(160deg,#12293d,#0c1a28)}
.homeCard.primary .ic{background:#16406a;border-color:#3f87c9;color:#cfe6ff}
.homeSection{margin-top:34px}
.homeSection h4{margin:0 0 12px;font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:#7f95a9;font-weight:800}
.homeStats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:11px}
.homeStat{border:1px solid #1c2c3a;background:#0a131b;border-radius:11px;padding:14px 16px}
.homeStat b{display:block;font-size:23px;font-weight:800;color:#eaf3fc;font-variant-numeric:tabular-nums}
.homeStat span{font-size:11px;color:#8fa4b7}
.homeRecent{border:1px solid #1c2c3a;background:#0a131b;border-radius:11px;overflow:hidden}
.homeRecent div.r{display:flex;align-items:center;gap:12px;padding:10px 15px;border-bottom:1px solid #142130;font-size:12px;color:#bcd0e2}
.homeRecent div.r:last-child{border-bottom:0}
.homeRecent .who{font-weight:700;color:#eaf3fc;min-width:150px}
.homeRecent .sc{flex:1;color:#8fa4b7;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.homeRecent .sco{font-weight:800;color:#91f5b4}
.homeRecent .sco.low{color:#ffb08a}
.homeEmpty{padding:14px 15px;font-size:12px;color:#7f95a9}
.homeFoot{margin-top:30px;padding-top:16px;border-top:1px solid #16242f;font-size:10.5px;color:#64798c;line-height:1.6}

/* Scenariokiezer vóór het starten van de simulatie */
.startPick{display:grid;gap:14px}
.startRow{display:grid;grid-template-columns:150px 1fr;gap:12px;align-items:center}
.startRow label{font-size:11.5px;color:#9fb3c6;font-weight:700}
.startRow select{background:#0e1c28;color:#eaf3ff;border:1px solid #2a4258;border-radius:8px;padding:10px;font-size:13px;width:100%}
.startNote{font-size:11.5px;color:#8fa4b7;line-height:1.5;background:#07131d;border:1px solid #1d3142;border-radius:9px;padding:11px 13px}
.startIcuRooms{display:grid;gap:8px}
.startIcuRoom{display:grid;grid-template-columns:110px minmax(0,1fr) minmax(0,1fr);gap:10px;align-items:center;border:1px solid #1d3446;border-radius:9px;background:#08141e;padding:9px 10px}
.startIcuRoom>label:not(.startIcuBed){display:grid;grid-template-columns:72px minmax(0,1fr);gap:8px;align-items:center;color:#9fb3c6;font-size:10px;font-weight:800}
.startIcuRoom select{width:100%;min-width:0}
.startIcuFixedProfile{width:auto}
.startIcuBed{display:flex;align-items:center;gap:6px;color:#e3f2fc;cursor:pointer}.startIcuBed input{accent-color:#42a5f5}.startIcuBed span{color:#8299aa;font-size:9px;text-transform:uppercase;letter-spacing:.6px}
@media(max-width:760px){.startIcuRoom{grid-template-columns:1fr}.startIcuRoom>label:not(.startIcuBed){grid-template-columns:1fr}}

/* Fase- en stappeneditor voor eigen casussen. Eén rijopmaak voor beide lijsten:
   een opleider herkent de tijdlijn en de vragenlijst zo als dezelfde soort scherm. */
.scenStatus{font-size:11px;color:#8fa4b7;margin:0 0 10px;display:flex;flex-wrap:wrap;gap:8px;align-items:baseline}
.scenStatus b{color:#bcd0e2}
.scenStatus .warn{color:#ffb08a}
.scenBar{display:flex;align-items:center;gap:9px;margin:0 0 12px;font-size:10px;color:#7f95a9}
.scenBar .track{position:relative;flex:1;height:14px;background:#07131d;border:1px solid #1d3142;border-radius:7px}
.scenBar .track i{position:absolute;top:2px;bottom:2px;width:3px;margin-left:-1px;background:#4aa3e8;border-radius:2px}
.scenBar .track i.ev{background:#ffb08a}
.scenList{border:1px solid #1c2c3a;background:#0a131b;border-radius:11px;overflow:hidden}
.scenList .row{display:grid;grid-template-columns:22px 50px minmax(80px,1fr) minmax(0,1.3fr) auto;gap:9px;align-items:center;padding:9px 12px;border-bottom:1px solid #142130;font-size:11.5px;color:#bcd0e2}
.scenList .row.stap{grid-template-columns:22px minmax(0,1.7fr) 78px 96px auto}
.scenGraphMeta{display:flex;flex-wrap:wrap;gap:7px;align-items:center;margin:0 0 8px;color:#91a9ba;font-size:10.5px}.scenGraphMeta b,.scenGraphMeta span{border:1px solid #29445b;border-radius:999px;background:#0c1a26;padding:4px 8px}.scenGraphMeta b{color:#dff2ff}.scenList .row.graph{grid-template-columns:22px minmax(100px,.8fr) minmax(0,1fr) minmax(150px,1.4fr)}.scenRoutes{display:grid;gap:4px;min-width:0}.scenRoute{display:block;overflow:hidden;color:#a9c4d7;font-size:10px;line-height:1.35;text-overflow:ellipsis;white-space:nowrap}.scenRoute b{color:#f1c96b}
.scenList .row:last-child{border-bottom:0}
.scenList .nr{color:#7f95a9;font-weight:800}
.scenList .tijd{color:#91c8f5;font-weight:800}
.scenList .naam{font-weight:700;color:#eaf3fc;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.scenList .sum{color:#8fa4b7;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.scenList .tag{color:#9fb3c6;font-weight:700}
.scenList .warn{display:block;color:#ffb08a;font-size:10.5px;padding:0 12px 9px 43px;margin-top:-4px}
.scenList .acts{display:flex;gap:4px;justify-content:flex-end}
.scenList .acts button{border:1px solid #2a4258;background:#102235;color:#dcecff;border-radius:6px;padding:3px 7px;font-size:11px;line-height:1.3;cursor:pointer}
.scenList .acts button:hover{background:#17324a}
.scenList .acts button:disabled{opacity:.3;cursor:default}
.scenList .acts button.del{border-color:#8d3a2d;background:#2a1410;color:#ffb08a}
.scenAdd{margin-top:11px;background:#102235;border:1px solid #2a4258;color:#dcecff;border-radius:8px;padding:8px 14px;font-weight:800;cursor:pointer;font-size:12px}
.scenAdd:disabled{opacity:.4;cursor:default}
.scenMini{margin-top:6px;background:#0e1c28;border:1px solid #2a4258;color:#9fd0f5;border-radius:7px;padding:4px 10px;font-weight:700;cursor:pointer;font-size:11px}
.scenMini:disabled{opacity:.4;cursor:default}
.scenChk{display:grid;grid-template-columns:20px 148px 1fr;gap:10px;align-items:center}
.scenChk label{font-size:11.5px;color:#9fb3c6;font-weight:700}
.scenChk input[type=checkbox]{width:15px;height:15px;accent-color:#2d8d55}
.scenFout{color:#ffb08a;font-size:11.5px;line-height:1.5;background:#1d0f0c;border:1px solid #6d2f24;border-radius:9px;padding:9px 12px}
.mxDlgBody details{border:1px solid #1d3142;border-radius:9px;padding:9px 11px;background:#07131d}
.mxDlgBody details>summary{cursor:pointer;font-size:11.5px;font-weight:800;color:#9fd0f5;list-style:none}
.mxDlgBody details[open]>summary{margin-bottom:10px}
.mxDlgBody details>summary::-webkit-details-marker{display:none}

@media(max-width:700px){.homeBody{padding:22px 16px 34px}.homeTop{padding:13px 16px}.homeHi{font-size:21px}}

/* ===== Privacy/AVG: dialoogvenster ===== */
.mxOv{position:fixed;inset:0;z-index:400;background:rgba(2,6,10,.72);display:grid;place-items:center;padding:22px;backdrop-filter:blur(3px)}
.mxDlg{width:min(620px,94vw);max-height:86vh;display:flex;flex-direction:column;background:#0a121a;border:1px solid #24384a;border-radius:12px;box-shadow:0 26px 70px rgba(0,0,0,.7);overflow:hidden}
.mxDlgHead{padding:11px 15px;background:#0c1520;border-bottom:1px solid #1c2b38;font-size:12.5px;letter-spacing:.6px;color:#eaf3fc}
.mxDlgBody{padding:14px 16px;overflow:auto;font-size:12px;line-height:1.6;color:#bcd0e2}
.mxDlgBody h4{margin:0 0 8px;font-size:12.5px;color:#eaf3fc}
.mxDlgBody p{margin:0 0 9px}
.mxDlgBody b{color:#eaf3fc}
.mxDlgBody ul{margin:0 0 9px;padding-left:18px}
.mxDlgBody input,.mxDlgBody select{background:#0e1c28;color:#eaf3ff;border:1px solid #2a4258;border-radius:6px;padding:7px;font-size:12px}
.mxDlgFoot{display:flex;justify-content:flex-end;gap:8px;padding:11px 15px;background:#0a121a;border-top:1px solid #1c2b38}
.mxDlgFoot button{border:1px solid #2a4258;background:#102235;color:#dcecff;border-radius:7px;padding:8px 14px;font-weight:800;cursor:pointer;font-size:11.5px}
.mxDlgFoot button:hover{background:#17324a}
.mxDlgFoot button.danger{border-color:#8d3a2d;background:#2a1410;color:#ffb08a}
.mxDlgFoot button.danger:hover{background:#3d1d16}
.mxDlgFoot button.primary{border-color:#2d8d55;background:#0c2919;color:#a9f5c4}
.mxPrivacyLink{background:none;border:0;color:#7fb2e8;text-decoration:underline;cursor:pointer;font-size:10.5px;padding:0;font-family:inherit}
.mxPrivacyLink:hover{color:#a9cdf5}

/* ===== Certificaat, sessierapport en cesuur ===== */
/* =====================================================================
   CERTIFICAAT · SESSIERAPPORT · CESUUR
   Plak dit blok onderaan de bestaande <style>, vóór het einde van de stylesheet.
   ===================================================================== */

/* ---------- Cesuur-kaart in het tutor-dashboard (donkere UI) ---------- */
.mxExamRow{display:grid;grid-template-columns:150px 1fr;gap:8px;align-items:center}
.mxExamRow label{font-size:10.5px;color:#9fb3c6;letter-spacing:.3px}
.mxExamRow input{background:#0e1c28;color:#eaf3ff;border:1px solid #2a4258;border-radius:6px;padding:6px 8px;font-size:11.5px;min-width:0;width:100%}
.mxExamField{display:flex;align-items:center;gap:6px}
.mxExamField input{width:80px}
.mxExamField span{color:#7f95a9;font-size:11px;font-weight:800}
.mxExamActions{display:flex;align-items:center;gap:10px;margin-top:2px}
.mxExamActions button{border:1px solid #2d8d55;background:#0c2919;color:#a9f5c4;border-radius:7px;padding:7px 12px;font-weight:800;cursor:pointer;font-size:11.5px}
.mxExamActions button:hover{background:#123a23}
#mxExamSaved{font-size:10.5px;color:#91f5b4;font-weight:800}

/* ---------- Geslaagd/gezakt-badge + documentknoppen (donkere UI) ---------- */
.mxPassBadge{display:inline-flex;align-items:center;gap:5px;font-size:10px;font-weight:900;letter-spacing:.4px;border-radius:5px;padding:3px 8px;border:1px solid}
.mxPassBadge.pass{color:#91f5b4;background:#0c2919;border-color:#2d8d55}
.mxPassBadge.fail{color:#ffb08a;background:#2a1410;border-color:#8d4a2d}
/* Herkomst van de score: zelfgerapporteerd of door een tutor bevestigd. */
.mxVerifyBadge{display:inline-flex;align-items:center;gap:4px;font-size:9.5px;font-weight:800;letter-spacing:.3px;border-radius:5px;padding:3px 7px;border:1px solid}
.mxVerifyBadge.ok{color:#9fd3ff;background:#0d1f2e;border-color:#2a5a80}
.mxVerifyBadge.warn{color:#ffd79a;background:#2a2210;border-color:#8d7a2d}
.mxDocRow{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:6px}
.mxDocRow button{border:1px solid #2a4258;background:#102235;color:#dcecff;border-radius:6px;padding:5px 10px;font-weight:800;cursor:pointer;font-size:10.5px}
.mxDocRow button:hover{background:#17324a}
.mxDocRow select{background:#0e1c28;color:#eaf3ff;border:1px solid #2a4258;border-radius:6px;padding:4px 6px;font-size:10.5px}
.mxDebriefVerdict{margin-top:8px;padding:6px 9px;border-radius:6px;font-weight:900;font-size:11.5px;letter-spacing:.3px;border:1px solid}
.mxDebriefVerdict.pass{color:#91f5b4;background:#0c2919;border-color:#2d8d55}
.mxDebriefVerdict.fail{color:#ffb08a;background:#2a1410;border-color:#8d4a2d}

/* ---------- Documentvenster (schermweergave vóór het printen) ---------- */
#mxPrintRoot{display:none}
#mxPrintRoot.show{display:block;position:fixed;inset:0;z-index:400;background:#8b9199;overflow:auto;-webkit-overflow-scrolling:touch}
.mxDocBar{position:sticky;top:0;z-index:2;display:flex;align-items:center;gap:10px;padding:9px 14px;background:#0b1420;border-bottom:1px solid #1c2b38;color:#e8f2fc}
.mxDocBar b{font-size:12px;letter-spacing:1.1px;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mxDocBar button{border:1px solid #2a4258;background:#102235;color:#dcecff;border-radius:7px;padding:7px 13px;font-weight:800;cursor:pointer;font-size:11.5px}
.mxDocBar button:hover{background:#17324a}
.mxDocBar button[data-mx-doc-print]{border-color:#2d8d55;background:#0c2919;color:#a9f5c4}
.mxDocPages{display:flex;flex-direction:column;align-items:center;gap:16px;padding:18px 12px 40px}

/* ---------- Document: A4-pagina ---------- */
.mxDoc{width:210mm;max-width:100%;min-height:297mm;box-sizing:border-box;padding:16mm 15mm;background:#fff;color:#161c22;
 font-family:Georgia,'Times New Roman',serif;font-size:10.5pt;line-height:1.5;box-shadow:0 10px 34px rgba(0,0,0,.35)}
.mxDoc *{box-sizing:border-box}
.mxDoc h1,.mxDoc h2{margin:0;font-weight:700}
.mxDoc p{margin:0 0 3mm}
.mxSec{margin-top:6mm}
.mxSec h2{font-size:10pt;letter-spacing:1.4px;text-transform:uppercase;color:#3d4b58;border-bottom:1px solid #c9d2da;padding-bottom:1.5mm;margin-bottom:2.5mm;font-family:Arial,Helvetica,sans-serif}
.mxSec h2 small{font-weight:400;letter-spacing:0;text-transform:none;color:#6c7a88}
.mxNone{color:#6c7a88;font-style:italic}
.mxFine{font-size:8.5pt;color:#5d6b78;line-height:1.45}

/* ---------- Certificaat ---------- */
.mxCertFrame{border:1.5pt solid #22303c;padding:9mm 10mm;min-height:265mm;display:flex;flex-direction:column}
.mxCertTop{text-align:center;border-bottom:.75pt solid #c9d2da;padding-bottom:4mm}
.mxCertOrg{font-size:16pt;font-weight:700;letter-spacing:2.4px;text-transform:uppercase;color:#16222c}
.mxCertSub{font-family:Arial,Helvetica,sans-serif;font-size:8.5pt;letter-spacing:1.6px;text-transform:uppercase;color:#5d6b78;margin-top:1.5mm}
.mxCertTitle{text-align:center;font-size:19pt;letter-spacing:.6px;margin-top:7mm;color:#16222c}
.mxCertRule{width:34mm;height:2pt;background:#22303c;margin:3mm auto 5mm}
.mxCertLead{text-align:center;font-size:10.5pt;color:#3d4b58;margin:0 0 2mm}
.mxCertName{text-align:center;font-size:24pt;font-weight:700;color:#101820;margin:2mm 0 3mm;padding-bottom:2.5mm;border-bottom:.75pt solid #22303c}
.mxCertFoot{display:grid;grid-template-columns:1fr auto;gap:10mm;align-items:end;margin-top:auto;padding-top:8mm}
.mxCertNo{text-align:right;font-family:Arial,Helvetica,sans-serif}
.mxCertNo span{display:block;font-size:8pt;letter-spacing:1.2px;text-transform:uppercase;color:#5d6b78}
.mxCertNo b{display:block;font-size:11pt;letter-spacing:1.4px;color:#16222c;margin-top:1mm}
.mxCertNo small{display:block;font-size:8pt;color:#6c7a88;margin-top:1mm}
.mxGoal{font-style:italic;color:#3d4b58}
.mxMissed{font-size:9pt;color:#5d6b78}
.mxTick{margin:0;padding:0;list-style:none}
.mxTick li{position:relative;padding:0 0 1.5mm 7mm;font-size:10pt}
.mxTick li:before{content:'✓';position:absolute;left:1mm;top:0;font-weight:700;color:#1d6b3f}
.mxTick li.mxNone:before{content:'–';color:#8b959f}

/* ---------- Sleutel/waarde-blok ---------- */
.mxKV{display:grid;grid-template-columns:1fr 1fr;gap:3mm 8mm;margin:4mm 0}
.mxKV.mxKV3{grid-template-columns:1fr 1fr 1fr}
.mxKVItem{border-bottom:.5pt solid #d4dae0;padding-bottom:1.5mm;min-width:0}
.mxKVItem.wide{grid-column:1/-1}
.mxKVItem span{display:block;font-family:Arial,Helvetica,sans-serif;font-size:7.5pt;letter-spacing:1.1px;text-transform:uppercase;color:#6c7a88}
.mxKVItem b{display:block;font-size:10.5pt;color:#16222c;word-wrap:break-word;overflow-wrap:anywhere}

/* ---------- Uitslag ---------- */
.mxVerdict{margin:5mm 0 2mm;padding:3.5mm 5mm;text-align:center;font-family:Arial,Helvetica,sans-serif;font-size:14pt;font-weight:800;letter-spacing:2px;border:1.25pt solid;border-radius:2mm;
 -webkit-print-color-adjust:exact;print-color-adjust:exact}
.mxVerdict small{display:block;font-size:9pt;font-weight:600;letter-spacing:.4px;margin-top:1.5mm}
.mxVerdict.pass{color:#12572f;border-color:#12572f;background:#eef8f1}
.mxVerdict.fail{color:#8a2f14;border-color:#8a2f14;background:#fdf1ec}
.mxVerdict.small{font-size:11pt;padding:2.5mm 4mm;margin:0 0 3mm}
/* Score zonder tutorbeoordeling: zichtbaar als zelfgerapporteerd markeren. */
.mxUnverified{margin:0 0 3mm;padding:2.5mm 4mm;border:.75pt solid #b8860b;border-radius:2mm;background:#fdf8e8;color:#6b4e00;
 font-family:Arial,Helvetica,sans-serif;font-size:8.5pt;line-height:1.45;-webkit-print-color-adjust:exact;print-color-adjust:exact}

/* ---------- Tabellen in het rapport ---------- */
.mxTable{width:100%;border-collapse:collapse;font-family:Arial,Helvetica,sans-serif;font-size:8.5pt}
.mxTable th,.mxTable td{border:.5pt solid #c9d2da;padding:1.6mm 2mm;text-align:left;vertical-align:top}
.mxTable th{background:#eef1f4;color:#33414e;font-size:7.5pt;letter-spacing:.8px;text-transform:uppercase;
 -webkit-print-color-adjust:exact;print-color-adjust:exact}
.mxTable td.r,.mxTable th.r{text-align:right;white-space:nowrap}
.mxTable tr.tot td{font-weight:800;background:#f4f6f8;-webkit-print-color-adjust:exact;print-color-adjust:exact}
.mxTable td.okc{color:#12572f;font-weight:700;white-space:nowrap}
.mxTable td.noc{color:#8a2f14;font-weight:700}
.mxTable i{color:#5d6b78;font-style:italic}

/* ---------- Rapportkop, handtekeningen, disclaimer ---------- */
.mxRepHead{display:flex;align-items:flex-end;gap:8mm;border-bottom:1.25pt solid #22303c;padding-bottom:3mm;margin-bottom:2mm}
.mxRepHead b{display:block;font-size:15pt;color:#16222c}
.mxRepHead span{display:block;font-family:Arial,Helvetica,sans-serif;font-size:8.5pt;letter-spacing:1.2px;text-transform:uppercase;color:#5d6b78;margin-top:1mm}
.mxRepNo{margin-left:auto;font-family:Arial,Helvetica,sans-serif;font-size:9.5pt;letter-spacing:1.2px;color:#33414e;white-space:nowrap}
.mxSignRow{display:grid;grid-template-columns:1fr 1fr;gap:12mm;margin-top:8mm}
.mxSign{min-width:0}
.mxSignLine{display:block;border-bottom:.75pt solid #22303c;height:12mm;margin-bottom:1.5mm}
.mxSign b{display:block;font-size:10.5pt;color:#16222c}
.mxSign small{display:block;font-family:Arial,Helvetica,sans-serif;font-size:8pt;color:#6c7a88;margin-top:.5mm}
.mxDisclaimer{margin-top:6mm;padding-top:3mm;border-top:.5pt solid #c9d2da;font-family:Arial,Helvetica,sans-serif;font-size:7.5pt;line-height:1.5;color:#5d6b78;text-align:justify}

/* ---------- Printen: alleen het document, A4, geen donkere interface ---------- */
@media print{
 @page{size:A4 portrait;margin:12mm 11mm}
 html,body{background:#fff!important;height:auto!important;min-height:0!important;overflow:visible!important}
 body:not(.mxDocOpen) #mxPrintRoot{display:none!important}
 body.mxDocOpen{display:block!important;margin:0!important;padding:0!important}
 body.mxDocOpen>*{display:none!important}
 body.mxDocOpen>#mxPrintRoot{display:block!important;position:static!important;inset:auto!important;z-index:auto!important;
  background:#fff!important;overflow:visible!important;width:auto!important;height:auto!important}
 #mxPrintRoot .mxDocBar{display:none!important}
 #mxPrintRoot .mxDocPages{display:block!important;padding:0!important;gap:0!important;background:#fff!important}
 #mxPrintRoot .mxDoc{width:auto!important;max-width:none!important;min-height:0!important;margin:0!important;padding:0!important;
  border-radius:0!important;box-shadow:none!important;background:#fff!important;color:#000!important;font-size:10pt!important}
 #mxPrintRoot .mxDoc+.mxDoc{page-break-before:always;break-before:page}
 .mxCertFrame{min-height:252mm;padding:8mm 9mm}
 .mxSec,.mxCertFoot,.mxSignRow,.mxVerdict,.mxKVItem,.mxTable tr{page-break-inside:avoid;break-inside:avoid}
 .mxTable th{page-break-after:avoid;break-after:avoid}
 .mxDisclaimer{color:#333!important}
 a[href]:after{content:''}
}

/* ===== Leerdoelen & richtlijnverankering ===== */
.ev-box{font-size:11.5px;line-height:1.5;color:#bcd0e2}
.ev-box h4{margin:10px 0 5px;font-size:10.5px;letter-spacing:1.1px;text-transform:uppercase;color:#9fb3c6}
.ev-box ul{margin:0;padding-left:17px}
.ev-box li{margin:4px 0}
.ev-box b{color:#eaf3fc}
.ev-badge{display:inline-block;border:1px solid;border-radius:4px;padding:0 5px;font-size:9px;font-weight:800;white-space:nowrap;margin-left:4px}
.ev-comps{display:flex;flex-wrap:wrap;gap:5px}
.ev-comp{background:#102235;border:1px solid #2a4258;border-radius:4px;padding:2px 7px;font-size:10px;color:#cfe4f8}
.ev-warn{background:#2a1d06;border:1px solid #8a6d1c;border-radius:7px;padding:8px 10px;color:#ffd98a;font-size:11px;line-height:1.45;margin-bottom:9px}
.ev-review{margin-top:10px;padding-top:8px;border-top:1px solid #1d3142;font-size:10.5px;color:#8fa4b7}
.trainingEvidence{margin-top:9px;border-top:1px solid #1d3142;padding-top:8px}
.trainingEvidence summary{cursor:pointer;font-size:11.5px;font-weight:800;color:#9fd0ff;list-style:none}
.trainingEvidence summary::-webkit-details-marker{display:none}
.trainingEvidence summary:before{content:"▸ ";color:#5f7689}
.trainingEvidence[open] summary:before{content:"▾ "}

/* ===== Beeldbank (eigen beelden van de opleider) ===== */
.mlBar{display:grid;grid-template-columns:1fr 1fr auto;gap:7px;margin-bottom:9px}
.mlBar select,.mlBar button{background:#0e1c28;color:#eaf3ff;border:1px solid #2a4258;border-radius:7px;padding:8px;font-size:11.5px;min-width:0}
.mlBar button{background:#173047;font-weight:800;cursor:pointer;white-space:nowrap}
.mlBar button:hover{background:#1d3d5a}
.mlGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:8px;max-height:290px;overflow:auto}
.mlItem{border:1px solid #22384a;background:#07111a;border-radius:8px;overflow:hidden;position:relative}
.mlItem img{width:100%;height:70px;object-fit:cover;display:block;background:#000}
.mlItem .cap{padding:4px 5px;font-size:9px;color:#9fb4c6;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mlItem .cat{position:absolute;left:4px;top:4px;background:rgba(3,10,16,.85);border:1px solid #2f4d66;border-radius:3px;padding:1px 5px;font-size:8px;font-weight:800;color:#cfe4f8}
.mlItem .del{position:absolute;right:4px;top:4px;width:18px;height:18px;border:0;border-radius:4px;background:rgba(120,20,20,.9);color:#fff;font-size:11px;font-weight:900;cursor:pointer;line-height:1}
.mlItem .del:hover{background:#b62a2a}
.mlEmpty{font-size:11.5px;color:#7f95a9;line-height:1.5}
.mlNote{font-size:10.5px;color:#7f95a9;line-height:1.5;margin-top:8px}
.labCustomImg{width:100%;max-height:330px;object-fit:contain;background:#000;border:1px solid #2c3c4c;border-radius:8px;display:block}
.labImgMeta{font-size:10.5px;color:#8fa4b7;margin-top:6px;line-height:1.45}

/* ===== X-ray viewer ===== */
.xrayWrap{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:10px}
.xrayFilm{position:relative;background:radial-gradient(90% 90% at 50% 42%,#1c242c,#05080b 88%);border:1px solid #2c3c4c;border-radius:8px;overflow:hidden;min-height:230px}
.xrayFilm svg{width:100%;height:100%;display:block}
.xrayTag{position:absolute;left:8px;top:6px;color:#c8dcee;font-size:9px;font-weight:800;letter-spacing:1px;opacity:.85}
.xrayTag.r{left:auto;right:8px}
.xrayNote{font-size:11.5px;color:#bcd0e2;line-height:1.5}
.xrayNote b{color:#fff}
.xrayUnavailable{display:grid;grid-template-columns:64px minmax(0,1fr);gap:14px;align-items:center;min-height:220px;padding:24px;border:1px dashed #496172;border-radius:10px;background:linear-gradient(135deg,#0b151d,#111f29);color:#a9bfce}
.xrayUnavailableIcon{display:grid;place-items:center;width:62px;height:76px;border:2px solid #718b9c;border-radius:7px;background:#071016;color:#c6dce9;font:800 19px/1 ui-monospace,monospace;letter-spacing:2px;box-shadow:inset 0 0 24px rgba(139,183,207,.12)}
.xrayUnavailable b,.xrayUnavailable span{display:block}.xrayUnavailable b{color:#edf7fb;font-size:15px}.xrayUnavailable span{margin-top:5px;color:#e6bd65;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.45px}.xrayUnavailable p{margin:12px 0 0;color:#89a1b1;font-size:11px;line-height:1.5}
.mxUiV2 .xrayUnavailable{border-color:#b7c8ce;background:#f3f7f8;color:#536b75}.mxUiV2 .xrayUnavailableIcon{border-color:#8aa4ad;background:#e5edf0;color:#49616a}.mxUiV2 .xrayUnavailable b{color:#294650}.mxUiV2 .xrayUnavailable p{color:#687d86}

/* ===== Rondleiding (eerste login) en demomodus (marketing) =====
   Bewust géén eigen dialoogstijl: de kaart hergebruikt .mxDlg/.mxDlgHead/.mxDlgBody/
   .mxDlgFoot van mxModal, zodat de rondleiding er precies zo uitziet als de rest van de
   app en één stijlwijziging overal doorwerkt. Alleen het uitlichten (vier maskerpanelen
   met een gat) en de filmbijschriften hebben eigen regels nodig. */
#mxTourLayer{position:fixed;inset:0;z-index:900;pointer-events:none;display:none}
#mxTourLayer.on{display:block}
#mxTourLayer .mxTourMask{position:absolute;background:rgba(2,6,10,.70);pointer-events:auto}
#mxTourRing{position:absolute;border:2px solid #4aa8ff;border-radius:10px;pointer-events:none;
  box-shadow:0 0 0 3px rgba(74,168,255,.20),0 0 26px rgba(74,168,255,.45);transition:.2s ease;display:none}
#mxTourRing.on{display:block}
#mxTourCard{position:absolute;width:min(380px,92vw);max-height:78vh;pointer-events:auto}
#mxTourCard .mxDlgBody{max-height:46vh}
#mxTourCard .mxDlgFoot{flex-wrap:wrap}
.mxTourCount{margin-right:auto;align-self:center;font-size:10.5px;letter-spacing:.5px;color:#8fa4b7;font-variant-numeric:tabular-nums}
.mxTourArrow{position:absolute;width:0;height:0;border:8px solid transparent;pointer-events:none;display:none}
.mxTourArrow.on{display:block}
#tourBtn,#homeTourBtn{white-space:nowrap}
.srOnly{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.mxWalkthroughIntro{margin:0 0 12px;color:#bcd0e2}
.mxWalkthroughGrid{border:0;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.mxWalkthroughChoice{display:block;min-width:0;cursor:pointer}
.mxWalkthroughChoice>input{position:absolute;opacity:0;pointer-events:none}
.mxWalkthroughChoice>span{display:flex;min-height:112px;flex-direction:column;gap:6px;border:1px solid #294157;border-radius:10px;background:#091824;padding:12px;transition:border-color .15s,background .15s,transform .15s}
.mxWalkthroughChoice:hover>span{background:#0d2030;border-color:#47779d;transform:translateY(-1px)}
.mxWalkthroughChoice>input:focus-visible+span{outline:3px solid rgba(74,168,255,.5);outline-offset:2px}
.mxWalkthroughChoice>input:checked+span{border-color:#4aa8ff;background:#0d2538;box-shadow:0 0 0 2px rgba(74,168,255,.16)}
.mxWalkthroughChoice b{font-size:12px;color:#f0f7ff}.mxWalkthroughChoice small{font-size:10.5px;line-height:1.45;color:#a9bfd2;flex:1}
.mxWalkthroughChoice em{align-self:flex-start;border:1px solid #355675;border-radius:999px;padding:2px 7px;color:#9fd0ff;font-size:9px;font-style:normal;text-transform:uppercase;letter-spacing:.45px}
.mxWalkthroughPreview{pointer-events:none;background:rgba(2,6,10,.58)}
.mxWalkthroughPreview .mxDlg{width:min(900px,96vw);max-height:88vh}
.mxWalkthroughPreview .mxDlgHead{display:flex;justify-content:space-between;gap:12px}.mxWalkthroughPreview .mxDlgHead span{color:#91f5b4;font-size:9.5px;text-transform:uppercase;letter-spacing:.6px}
.mxWalkthroughPreview .mxDlgBody{padding:14px;overflow:auto}
.mxWalkthroughFakeFoot{display:flex;justify-content:flex-end;gap:8px;margin-top:10px;padding-top:10px;border-top:1px solid #1d3142}
.mxWalkthroughFakeFoot button,.mxWalkthroughPreview button{border:1px solid #31506a;background:#102235;color:#cfe4f6;border-radius:7px;padding:7px 11px;font-weight:800}
.mxWalkthroughBuilder{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.mxWalkthroughBuilder section,.mxWalkthroughStepPreview section,.mxInviteWalkthrough section{border:1px solid #223a4d;border-radius:9px;background:#07131d;padding:11px}
.mxWalkthroughBuilder h4,.mxWalkthroughStepPreview h4{margin:0 0 7px;color:#e9f5ff}.mxWalkthroughBuilder p,.mxWalkthroughStepPreview p{margin:6px 0 0;color:#abc0d2}
.mxWalkthroughBuilder .mxWalkthroughFakeFoot{grid-column:1/-1}.mxWalkthroughValues{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}.mxWalkthroughValues span{border:1px solid #29465e;border-radius:5px;padding:5px;text-align:center;color:#9fd0ff;font-size:10px}
.mxWalkthroughTimeline{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.mxWalkthroughTimeline>div{border-top:3px solid #4aa8ff;border-radius:7px;background:#07131d;padding:11px}.mxWalkthroughTimeline b,.mxWalkthroughTimeline span{display:block}.mxWalkthroughTimeline span{margin-top:7px;color:#abc0d2}
.mxWalkthroughStepPreview{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.mxInviteWalkthrough{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.mxInviteWalkthrough section{min-width:0}.mxInviteWalkthrough b{color:#e9f5ff}.mxInviteWalkthrough p{margin:6px 0 0;color:#abc0d2}.mxInviteAccess{display:grid;grid-template-columns:minmax(110px,.7fr) minmax(0,1.3fr);gap:5px;margin-top:7px}.mxInviteAccess code{overflow-wrap:anywhere;color:#9fd0ff}.mxWalkthroughLogin{display:grid;gap:5px;margin-top:8px}.mxWalkthroughLogin span{border:1px solid #29465e;border-radius:5px;padding:6px;color:#cfe4f6}
@media(max-width:720px){.mxWalkthroughGrid,.mxWalkthroughBuilder,.mxWalkthroughTimeline,.mxWalkthroughStepPreview,.mxInviteWalkthrough{grid-template-columns:1fr}.mxWalkthroughBuilder .mxWalkthroughFakeFoot{grid-column:auto}.mxWalkthroughChoice>span{min-height:0}.mxWalkthroughPreview .mxDlg{max-height:92vh}.mxWalkthroughPreview .startIcuRoom{grid-template-columns:1fr}.mxWalkthroughPreview .startIcuBed{justify-content:flex-start}}

#mxDemoLayer{position:fixed;inset:0;z-index:880;pointer-events:none;display:none}
#mxDemoLayer.on{display:block}
.mxDemoCap{position:absolute;left:50%;transform:translateX(-50%);bottom:138px;width:min(880px,92vw);
  background:rgba(4,10,16,.90);border:1px solid #2a4258;border-radius:13px;padding:15px 22px;
  color:#eaf3ff;font-size:16.5px;line-height:1.5;text-align:center;letter-spacing:.2px;
  box-shadow:0 20px 54px rgba(0,0,0,.62);opacity:0;transition:opacity .55s ease}
.mxDemoCap.show{opacity:1}
/* Eigen ondergrond en ruimte: de verplichte disclaimer moet leesbaar zijn, ook boven
   de ECG-curve of de navigatie. Zonder dit liep hij in de opnamen door andere tekst. */
.mxDemoNote{position:absolute;left:20px;bottom:64px;max-width:min(560px,52vw);font-size:11.5px;line-height:1.5;
  color:#cfe0f0;letter-spacing:.2px;background:rgba(4,10,16,.92);border:1px solid #24384a;
  border-radius:9px;padding:9px 13px;box-shadow:0 10px 30px rgba(0,0,0,.5)}
/* Zelfde reden als bij .trainingCoach: met right:20px lag deze knoppenbalk in het
   Arabisch en Hebreeuws over de rechteronderhoek van de zijbalk. */
.mxDemoBar{position:absolute;inset-inline-end:20px;bottom:18px;display:flex;gap:8px;pointer-events:auto}
.mxDemoBar button{border:1px solid #2a4258;background:rgba(14,28,40,.94);color:#dcecff;border-radius:8px;
  padding:8px 14px;font-weight:800;cursor:pointer;font-size:11.5px;font-family:inherit}
.mxDemoBar button:hover{background:#17324a}
.mxDemoProg{position:absolute;left:0;top:0;height:3px;background:#4aa8ff;width:0;transition:width .3s linear;box-shadow:0 0 12px rgba(74,168,255,.6)}
.mxDemoTitle{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:16px;text-align:center;padding:30px;background:#04090e;opacity:0;transition:opacity .7s ease;pointer-events:none}
.mxDemoTitle.show{opacity:1}
.mxDemoTitle h2{margin:0;font-size:clamp(24px,4.2vw,44px);letter-spacing:1.4px;color:#eaf3fc;font-weight:800}
.mxDemoTitle .sub{font-size:clamp(13px,1.6vw,17px);color:#9fb8cc;max-width:640px;line-height:1.6}
.mxDemoTitle .dev{font-size:12px;letter-spacing:2.2px;color:#5f7f99;text-transform:uppercase}
.mxDemoProducts{direction:ltr;unicode-bidi:isolate}
.mxDemoProduct{white-space:nowrap}
.mxDemoTitle .disc{font-size:12px;color:#7f95a9;max-width:560px;line-height:1.6}
.mxDemoValue{font-size:clamp(14px,1.8vw,19px);color:#cfe1f1;max-width:760px;line-height:1.55}
.mxDemoProofs{display:flex;flex-wrap:wrap;justify-content:center;gap:9px;max-width:820px}.mxDemoProofs span{border:1px solid #29465c;background:#0b1924;color:#b9dcf6;border-radius:999px;padding:7px 13px;font-size:11.5px;font-weight:800}
.mxDemoCta{display:inline-flex;align-items:center;gap:8px;border:1px solid #3e9b68;background:linear-gradient(180deg,#197044,#0f4f30);color:#edfff4;border-radius:10px;padding:10px 18px;font-size:13px;font-weight:900;box-shadow:0 10px 28px rgba(20,115,70,.24)}
body.mxMarketingCapture .mxDemoBar{opacity:0;pointer-events:none}
body.mxMarketingCapture .mxDemoNote{left:50%;transform:translateX(-50%);bottom:18px;max-width:min(920px,92vw);width:max-content;text-align:center;padding:7px 12px;font-size:10.5px;background:rgba(4,10,16,.86)}
body.mxMarketingCapture .mxDemoCap{bottom:78px;width:min(940px,90vw);font-size:17px;background:rgba(4,10,16,.94);border-color:#365a72}
.mxDemoPick{outline:2px solid #6ee7a0!important;outline-offset:2px;box-shadow:0 0 0 5px rgba(110,231,160,.22)!important;transition:.2s}
@media(max-width:820px){.mxDemoCap{bottom:104px;font-size:14px;padding:12px 15px}.mxDemoNote{max-width:38vw;font-size:10px}}

/* ===== Keuzescherm bij de eerste login en de schakelaar voor de etalagestand =====
   Ook hier geen eigen dialoogstijl: het keuzescherm is een gewone mxModal en leent
   .mxDlg met zijn kop, tekst en knoppenbalk. Nieuw is alleen de opsomming waarin
   per keuze staat wat je ervoor terugkrijgt. */
.mxKeuze{display:grid;gap:13px}
.mxKeuze .r{display:grid;grid-template-columns:22px 1fr;gap:11px;align-items:start;
  font-size:12.5px;color:#bcd0e2;line-height:1.55}
.mxKeuze .r b{display:block;color:#eaf3fc;font-size:13px;margin-bottom:3px}
.mxKeuze .ic{color:#5fb6ff;font-size:15px;text-align:center;line-height:1.35}
.mxEtalageRow{display:grid;grid-template-columns:20px 1fr;gap:10px;align-items:start}
.mxEtalageRow input[type=checkbox]{width:15px;height:15px;accent-color:#2d8d55;margin-top:2px}
.mxEtalageRow label{font-size:11.5px;color:#dcecff;font-weight:700;line-height:1.45}

/* ===== Clinical Command Center v2 =====
   De apparaat-HMI's houden hun klinische kleurcodering. De operatorlaag eromheen krijgt
   een eigen, lichte visuele taal en een verticale apparatuur-rack. */
html.mxUiV2{
  --ui-canvas:#e7edef;--ui-chrome:#f7fafb;--ui-surface:#fff;--ui-ink:#172c35;
  --ui-muted:#667b84;--ui-line:#d4dfe3;--ui-accent:#087d83;--ui-accent-2:#075f65;
  --ui-danger:#c93643;--ui-warning:#bc7209;--ui-ok:#178255;--ui-stage:#0d171d;
  --ui-stage-2:#18262e;--ui-shadow:0 14px 38px rgba(18,42,51,.14);
  --ui-r-sm:10px;--ui-r-md:15px;--ui-r-lg:22px;
  --sideW:318px;--dockW:124px;--dockH:0px;
}
html.mxUiV2,html.mxUiV2 body{background:var(--ui-canvas)}
.mxUiV2 #app{
  grid-template-columns:var(--sideW) minmax(0,1fr) var(--dockW);grid-template-rows:1fr;
  grid-template-areas:"side stage dock";gap:0;background:var(--ui-canvas)
}
.mxUiV2 body.student #app{grid-template-columns:0 minmax(0,1fr) 0;grid-template-areas:"side stage dock"}
.mxUiV2 body.deviceTraining #app{grid-template-columns:var(--sideW) minmax(0,1fr) 0;grid-template-rows:1fr;grid-template-areas:"side stage dock"}
.mxUiV2 body.student.deviceTraining #app{grid-template-columns:0 minmax(0,1fr) 0}

/* Lichte sessieconsole */
.mxUiV2 #side{
  background:linear-gradient(180deg,#fbfcfd 0,#f2f6f7 100%);color:var(--ui-ink);
  border:0;border-inline-end:1px solid var(--ui-line);box-shadow:8px 0 30px rgba(18,42,51,.09);z-index:5
}
.mxUiV2 .sideHead{min-height:72px;padding:17px 20px 14px;background:#fff;border-bottom:1px solid var(--ui-line)}
.mxUiV2 .sideHead .brandLogo{filter:none;max-width:146px;max-height:30px}
.mxUiV2 .sideHead .st{color:#6a7d85;font-size:10px;letter-spacing:1.7px;margin-top:7px;font-weight:750}
.mxUiV2 .sideScroll{padding:16px;scrollbar-color:#b9c8cd transparent}
.mxUiV2 .sideScroll::-webkit-scrollbar-thumb{background:#b9c8cd}
.mxUiV2 .modeLabel{
  width:max-content;margin:0 0 10px;padding:5px 9px;border-radius:999px;background:#e2f3ed;
  color:#13744d;font-size:9.5px;letter-spacing:.65px;font-weight:850
}
.mxUiV2 .teacherCard,.mxUiV2 .sec{
  background:var(--ui-surface);border:1px solid rgba(205,218,223,.88);border-radius:var(--ui-r-md);
  box-shadow:0 1px 0 rgba(255,255,255,.9),0 7px 21px rgba(18,42,51,.06)
}
.mxUiV2 .teacherCard{padding:12px 13px;gap:11px}
.mxUiV2 .tcAvatar,.mxUiV2 .profAvatar{border-color:#c8d6db;background:#e9eff1}
.mxUiV2 .tcDot{background:#20a469;box-shadow:0 0 0 4px rgba(32,164,105,.13)}
.mxUiV2 .tcMeta b,.mxUiV2 .profMeta b{color:var(--ui-ink)}
.mxUiV2 .tcMeta span,.mxUiV2 .profMeta span{color:var(--ui-muted)}
.mxUiV2 .sec{margin-top:12px;padding:3px 12px}
.mxUiV2 .secHead{padding:11px 2px 10px;border-bottom:1px solid #e6ecee}
.mxUiV2 .sec.collapsed .secHead{border-bottom:0}
.mxUiV2 .secHead h4{color:#29404a;font-size:12.5px;letter-spacing:0;text-transform:none;font-weight:760}
.mxUiV2 .secHead .chev{color:#78909a}
.mxUiV2 .secBody{padding:10px 2px 11px}
.mxUiV2 .fieldSel,.mxUiV2 .tBtn,.mxUiV2 .speedRow button,.mxUiV2 .fullBtn,
.mxUiV2 .miniBtn,.mxUiV2 .editPen,.mxUiV2 .trainingSelect{
  background:#f1f5f6;color:var(--ui-ink);border-color:#cad7dc;box-shadow:none
}
.mxUiV2 .fieldSel{background-color:#f6f8f9;background-image:linear-gradient(45deg,transparent 50%,#617781 50%),linear-gradient(135deg,#617781 50%,transparent 50%)}
.mxUiV2 .fieldSel:hover,.mxUiV2 .tBtn:hover,.mxUiV2 .speedRow button:hover,.mxUiV2 .fullBtn:hover,.mxUiV2 .miniBtn:hover{background-color:#e7eff1}
.mxUiV2 .speedRow button.on{background:#dceff0;border-color:#83bdc0;color:#075e63}
.mxUiV2 .bigTime{font-size:32px;color:var(--ui-ink);font-weight:760;letter-spacing:-.5px}
.mxUiV2 .vital{border-color:#e6edef;padding:8px 1px}
.mxUiV2 .vName{color:#425962}.mxUiV2 .vVal{color:var(--ui-ink)}.mxUiV2 .vUnit{color:#7b8f97}
.mxUiV2 .slRow label{color:#536a74}.mxUiV2 .slRow label b{color:var(--ui-ink)}
.mxUiV2 .miniBtn.red{background:#fff0f1;border-color:#edb7bc;color:#9d2834}
.mxUiV2 .miniBtn.green{background:#eaf7ef;border-color:#add8bd;color:#17633a}
.mxUiV2 .miniBtn.orange{background:#fff5e6;border-color:#e7c38d;color:#80500c}
.mxUiV2 .deviceControlBox{background:#f6f9fa;border-color:#d7e2e5}
.mxUiV2 .deviceControlBox h5{color:#49616a;letter-spacing:.65px}
.mxUiV2 .dcNote,.mxUiV2 .menuStatus{color:#687d86}
.mxUiV2 .logBox,.mxUiV2 .icuBedCard{background:#f4f7f8;border-color:#d7e2e5;color:#536b75}
.mxUiV2 .icuBedCard.active{border-color:#087d83;background:#e9f7f7;box-shadow:inset 4px 0 0 #087d83,0 0 0 3px rgba(8,125,131,.14)}
.mxUiV2 .icuBedMeta{color:#687d86}
.mxUiV2 .icuBedSelected{border-color:#087d83;background:#d9efef;color:#075f65}.mxUiV2 .icuBedPhase{border-color:#d7e2e5}.mxUiV2 .icuBedPhase span,.mxUiV2 .casePhaseProgress{color:#477d80}.mxUiV2 .icuBedPhase b,.mxUiV2 .casePhaseBed b,.mxUiV2 .casePhaseStep.active .casePhaseCopy b{color:#25434d}.mxUiV2 .casePhaseBed span,.mxUiV2 .casePhaseCopy b{color:#687d86}.mxUiV2 .casePhaseMarker{background:#f7fafb;border-color:#9eb3bc}.mxUiV2 .casePhaseStep:not(:last-child)::after{background:#d0dce0}
.mxUiV2 .casePhaseBed{border-color:#d7e2e5}.mxUiV2 .casePhaseBed strong{color:#284952}.mxUiV2 .casePhaseFocus{border-color:#8fc4c7;background:linear-gradient(145deg,#f3fbfb,#fff);box-shadow:0 8px 22px rgba(23,72,76,.08)}.mxUiV2 .casePhaseFocusHead>span{color:#087d83}.mxUiV2 .casePhaseFocusHead>b{color:#173c46}.mxUiV2 .casePhaseFocusHead>small{color:#5f7c86}.mxUiV2 .casePhaseGoal,.mxUiV2 .casePhaseImage{border-color:#79afb3}.mxUiV2 .casePhaseGoal b,.mxUiV2 .casePhaseImage b,.mxUiV2 .casePhaseMapTitle{color:#477d80}.mxUiV2 .casePhaseGoal span,.mxUiV2 .casePhaseImage span{color:#3e5963}.mxUiV2 .casePhaseOverrideNotice{border-color:#bfd6db;background:#f2f8f9;color:#496871}.mxUiV2 .casePhaseOverrideNotice b{color:#315963}.mxUiV2 .casePhaseList .casePhaseStep{border-color:#d7e2e5;background:#fff}.mxUiV2 .casePhaseList .casePhaseStep.active{border-color:#57a5aa;background:#f1fbfb}.mxUiV2 .casePhaseNumber{background:#e7eff1;color:#4f7079}.mxUiV2 .casePhaseDetail{border-color:#dce7e9}.mxUiV2 .casePhaseRoute,.mxUiV2 .casePhaseList .casePhaseRoute{border-color:#d7e3e6;background:#f7fafb}.mxUiV2 .casePhaseRoute>span:nth-child(2){color:#3d5963}.mxUiV2 .casePhaseRoute>b{color:#76560b}.mxUiV2 .casePhaseRoute.chosen{border-color:#8bc8a5;background:#effaf3}.mxUiV2 .casePhaseRouteState{background:#e1eaed;color:#4c6871}.mxUiV2 .casePhaseGo{border-color:#168c92;background:#e4f5f5;color:#075f65}.mxUiV2 .casePhaseGo:hover{background:#d4eeee}.mxUiV2 .casePhaseSteps li{color:#3e5963}.mxUiV2 .casePhaseSteps li i{background:#dff1f3;color:#126f74}
.mxUiV2 .sideFoot{background:#f8fafb;border-top:1px solid var(--ui-line);padding:12px 16px}
.mxUiV2 .stopSim{border-radius:10px;background:linear-gradient(180deg,#d94a54,#bb2d39);box-shadow:0 7px 18px rgba(180,40,52,.20)}
.mxUiV2 .footIcons{margin-top:11px}.mxUiV2 .footIcons button{color:#687d86}.mxUiV2 .footIcons button:hover{color:#075f65}

/* Donkere equipment-bay met een heldere navigatiebalk */
.mxUiV2 #stage{
  padding:0 18px 18px;grid-template-rows:72px 82px minmax(0,1.16fr) minmax(0,.84fr);gap:16px;
  background-color:var(--ui-stage);background-image:
    radial-gradient(100% 74% at 48% -8%,rgba(74,108,122,.36),transparent 60%),
    linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px),
    linear-gradient(180deg,#15242c,#0b1419 78%);background-size:auto,28px 28px,28px 28px,auto
}
.mxUiV2 .machineBar{
  grid-column:1/-1;min-height:72px;max-height:72px;margin-inline:-18px;padding:11px 18px;
  flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;gap:7px;background:rgba(252,253,253,.98);
  color:var(--ui-ink);border:0;border-bottom:1px solid var(--ui-line);border-radius:0;
  box-shadow:0 7px 24px rgba(0,0,0,.14);backdrop-filter:blur(16px);scrollbar-width:none
}
.mxUiV2 .machineBar::-webkit-scrollbar{display:none}
.mxUiV2 .machineBar .mbTitle{color:#617780;font-size:10px;letter-spacing:1.1px;margin-inline-end:5px}
.mxUiV2 #sideToggle,.mxUiV2 .machineBtn,.mxUiV2 .langSelect{
  min-height:40px;border:1px solid #d0dde1;background:#f4f7f8;color:#425962;border-radius:10px;
  padding:9px 11px;font-size:12px;font-weight:720;box-shadow:none
}
.mxUiV2 #sideToggle:hover,.mxUiV2 .machineBtn:hover{background:#e7eff1;color:#17343e}
.mxUiV2 .machineBtn.active{
  background:#dceff0;color:#075d62;border-color:#86c3c6;box-shadow:inset 0 -2px 0 var(--ui-accent)
}
.mxUiV2 .machineActions{margin-inline-start:auto;gap:7px;flex:none}
.mxUiV2 .machineActions:before{content:"";width:1px;align-self:stretch;background:#dbe4e7;margin-inline:4px}
.mxUiV2 .machineActions .machineBtn{background:#fff;color:#586e77}
.mxUiV2 #soundBtn.on{background:#e8f5ee;color:#17653e;border-color:#add8bd}

/* Permanente patiënt- en casuscontext */
.mxUiV2 .mxClinicalRail{
  grid-column:1/-1;min-width:0;display:grid;grid-template-columns:minmax(270px,1fr) auto;align-items:center;gap:18px;
  min-height:82px;padding:12px 15px;border:1px solid rgba(113,197,200,.38);border-radius:16px;
  background:linear-gradient(125deg,rgba(5,101,107,.96),rgba(20,58,68,.96));
  box-shadow:0 14px 34px rgba(0,0,0,.25),inset 0 1px rgba(255,255,255,.08);color:#efffff;overflow:hidden
}
.mxUiV2 .mxRailContext{min-width:0;display:flex;align-items:center;gap:13px}
.mxUiV2 .mxRailLive{display:inline-flex;align-items:center;gap:7px;flex:none;border:1px solid rgba(197,244,231,.28);background:rgba(5,31,38,.28);border-radius:999px;padding:7px 10px;font-size:10px;font-weight:850;letter-spacing:.6px;text-transform:uppercase}
.mxUiV2 .mxRailLive i{width:8px;height:8px;border-radius:50%;background:#70eca4;box-shadow:0 0 0 4px rgba(112,236,164,.14)}
.mxUiV2 .mxRailCopy{min-width:0}.mxUiV2 .mxRailCopy b{display:block;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mxUiV2 .mxRailCopy small{display:block;margin-top:3px;color:#bfdbdf;font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mxUiV2 .mxRailVitals{display:flex;align-items:stretch;gap:7px;min-width:0}
.mxUiV2 .mxRailVitals>span{min-width:66px;padding:7px 10px;border:1px solid rgba(205,241,243,.18);border-radius:10px;background:rgba(4,23,29,.28);text-align:right}
.mxUiV2 .mxRailVitals small{display:block;color:#a9cdd1;font-size:9px;font-weight:800;letter-spacing:.7px}
.mxUiV2 .mxRailVitals b{display:block;margin-top:1px;color:#fff;font-size:22px;line-height:1;font-variant-numeric:tabular-nums}
.mxUiV2 .mxRailVitals>span:nth-child(3) b{color:#7de7f0}.mxUiV2 .mxRailClock{min-width:96px!important}
.mxUiV2 .mxRailClock b{font-size:16px;margin-top:4px}

.mxUiV2 .rowTop,.mxUiV2 .rowBot{gap:16px}
.mxUiV2 .dev[data-dev]{
  padding:8px;background:linear-gradient(155deg,#22313a,#111b21);border:1px solid #344750;border-radius:20px;
  outline:0;box-shadow:0 20px 46px rgba(0,0,0,.34),inset 0 1px rgba(255,255,255,.055);
  transition:border-color .18s,box-shadow .18s,filter .18s
}
.mxUiV2 .dev[data-dev].active{border-color:#71c4c7;outline:0;box-shadow:0 0 0 2px rgba(8,125,131,.25),0 25px 62px rgba(0,0,0,.48)}
.mxUiV2 .dev[data-dev]:not(.active){filter:saturate(.84) brightness(.92)}
.mxUiV2 .shellCream,.mxUiV2 .monShell,.mxUiV2 .shellGrey,.mxUiV2 .defibShell,.mxUiV2 .labShell{
  border-radius:14px;box-shadow:inset 0 1px rgba(255,255,255,.9),inset 0 -7px 17px rgba(30,34,32,.14),0 10px 25px rgba(0,0,0,.32)
}
.mxUiV2 .screen,.mxUiV2 .zScreen{box-shadow:inset 0 0 26px #000,0 0 0 1px rgba(255,255,255,.12),0 8px 18px rgba(0,0,0,.32)}

/* Focus: één dominant apparaat en een vaste patiëntcamera ernaast. */
.mxUiV2 #stage.focus{grid-template-columns:minmax(0,1fr) minmax(276px,22vw);grid-template-rows:72px 82px minmax(0,1fr)}
.mxUiV2 #stage.focus .machineBar{grid-column:1/-1;grid-row:1}
.mxUiV2 #stage.focus .mxClinicalRail{grid-column:1/-1;grid-row:2}
.mxUiV2 #stage.focus>.rowTop,.mxUiV2 #stage.focus>.rowBot{display:contents}
.mxUiV2 #stage.focus .dev[data-dev]{display:none}
.mxUiV2 #stage.focus .dev[data-dev].active{display:flex;grid-column:1;grid-row:3;min-height:0;height:100%}
.mxUiV2 #stage.focus .dev[data-dev="patient"]:not(.active){display:flex;grid-column:2;grid-row:3;min-height:0;height:100%;padding:0;border-color:#31454f;filter:none}
.mxUiV2 #stage.focus .dev[data-dev="patient"].active{grid-column:1/-1}
.mxUiV2 #stage.focus .dev[data-dev="patient"] .patShell{height:100%;min-height:0;border:0;border-radius:18px}
.mxUiV2 #stage.focus .dev[data-dev="patient"] .patMonitorStrip{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
.mxUiV2 #stage.focus .dev[data-dev="patient"] .patMetric{padding:7px 8px;background:rgba(3,12,17,.78);border-color:rgba(135,187,205,.24)}
.mxUiV2 #stage.focus .dev[data-dev="patient"] .patMetric:last-child{grid-column:1/-1}
.mxUiV2 #stage.focus .dev[data-dev="patient"] .patMetric b{font-size:20px}
.mxUiV2 #stage.focus .dev[data-dev="patient"] .patPhotoBase{object-position:center 32%}
.mxUiV2 #stage.focus .dev[data-dev="patient"] .patFoot{padding:10px 12px;background:#101d25}
.mxUiV2 #stage.focus .monGrid{grid-template-columns:minmax(0,1fr) 210px}
.mxUiV2 #stage.focus .alarmBanner{right:210px}.mxUiV2 #stage.focus .silenceChip{right:216px}
.mxUiV2 #stage.focus .deviceModeBadge{right:196px}.mxUiV2 #stage.focus .deviceSoftMenu.bottom{right:218px}
.mxUiV2 #stage.focus .par{padding-inline:10px}.mxUiV2 #stage.focus .par .pv{font-size:clamp(38px,4.8vh,58px)!important}
.mxUiV2 #stage.focus .par .pv[style*="27px"]{font-size:30px!important}
.mxUiV2 body.deviceTraining #stage.focus{grid-template-columns:minmax(0,1fr)}
.mxUiV2 body.deviceTraining #stage.focus .dev[data-dev].active{grid-column:1/-1}
.mxUiV2 body.deviceTraining #stage.focus .dev[data-dev="patient"]:not(.active){display:none}

/* Verticale apparatuur-rack: navigatie wordt een tastbare inventaris in plaats van een tweede tabbar. */
.mxUiV2 #dock{
  align-items:stretch;flex-direction:column;gap:7px;padding:10px 9px;background:linear-gradient(180deg,#fbfcfd,#eef3f5);
  color:var(--ui-ink);border:0;border-inline-start:1px solid var(--ui-line);box-shadow:-7px 0 26px rgba(18,42,51,.08);
  overflow-x:hidden;overflow-y:auto;scrollbar-width:thin
}
.mxUiV2 .dockItem{
  width:100%;height:78px;min-width:0;min-height:78px;border:1px solid #d4dfe3;background:#fff;border-radius:12px;
  box-shadow:0 4px 12px rgba(18,42,51,.055);transition:border-color .16s,box-shadow .16s,transform .16s
}
.mxUiV2 .dockItem:hover{border-color:#9fbfc3;transform:translateY(-1px)}
.mxUiV2 .dockItem.active{border-color:#75b9bd;box-shadow:inset 3px 0 var(--ui-accent),0 7px 18px rgba(8,125,131,.13)}
.mxUiV2 .dockThumb{min-height:50px;background:#0a1116}.mxUiV2 .dockThumb .ico{font-size:24px}
.mxUiV2 .dockThumb svg.dockIco{width:25px;height:25px;color:#8aa4ae}.mxUiV2 .dockItem.active .dockThumb svg.dockIco{color:#d7f5f6}
.mxUiV2 .dockLabel{padding:5px 3px;background:#fff;color:#627781;font-size:8.5px;letter-spacing:.35px;text-transform:none}
.mxUiV2 .dockItem.active .dockLabel{color:#075e63;font-weight:850}
.mxUiV2 .dockSpacer{min-height:4px}.mxUiV2 .dockTool{width:100%;height:52px;min-width:0;min-height:52px;color:#687f89;font-size:9px;gap:4px}
.mxUiV2 .dockTool:hover{color:#075e63}.mxUiV2 .dockTool svg{width:20px;height:20px}
[dir="rtl"].mxUiV2 .dockItem.active{box-shadow:inset -3px 0 var(--ui-accent),0 7px 18px rgba(8,125,131,.13)}

/* Tutor-dashboard als licht analytics-werkblad */
.mxUiV2 #tutorDash{
  inset-block:0;inset-inline:var(--sideW) var(--dockW);grid-template-columns:226px minmax(0,1fr);
  grid-template-rows:72px 112px minmax(0,1fr);background:#edf3f5;color:var(--ui-ink);border:0;border-radius:0;box-shadow:none
}
.mxUiV2 #tutorDash.show{display:grid}
.mxUiV2 .tdHead{grid-column:1/-1;grid-row:1;padding:0 22px;background:#fff;border-bottom:1px solid var(--ui-line)}
.mxUiV2 .tdHead b{color:var(--ui-ink);font-size:14px;letter-spacing:.7px}.mxUiV2 .tdHead .sub{color:#6d818a}
.mxUiV2 .tdHead .closeBtn{background:#f2f6f7;color:#3f5660;border-color:#d1dde1}
.mxUiV2 .tdNav{grid-column:1;grid-row:2/4;flex-direction:column;align-items:stretch;gap:6px;padding:18px 12px;background:#172a33;border:0;overflow-y:auto}
.mxUiV2 .tdNav button{width:100%;text-align:start;padding:12px 14px;background:transparent;color:#b9cacf;border:0;border-radius:9px}
.mxUiV2 .tdNav button:hover{background:#213b46;color:#fff}.mxUiV2 .tdNav button.on{background:#28505a;color:#fff;border:0;box-shadow:inset 3px 0 #77d0d3}
.mxUiV2 .tdKpis{grid-column:2;grid-row:2;padding:16px 20px 0;background:transparent;gap:12px}
.mxUiV2 .tdKpi{background:#fff;border:0;border-radius:13px;padding:14px 16px;box-shadow:0 7px 22px rgba(18,42,51,.075)}
.mxUiV2 .tdKpi span{color:#70838b;font-size:10px;letter-spacing:.35px}.mxUiV2 .tdKpi b{color:var(--ui-ink);font-size:28px;margin-top:6px}
.mxUiV2 .tdKpi.attention{border-inline-start:4px solid #d69a33}.mxUiV2 .tdKpi.attention b{color:#9b6410}
.mxUiV2 #tutorDash .tdBody{grid-column:2;grid-row:3;padding:16px 20px 20px;overflow:auto;background:transparent}
.mxUiV2 .tdCard,.mxUiV2 .tdLiveCard,.mxUiV2 .tdStudent{background:#fff;color:var(--ui-ink);border:0;box-shadow:0 7px 22px rgba(18,42,51,.075)}
.mxUiV2 .tdCard{border-radius:14px}.mxUiV2 .tdCard>h5{padding:13px 15px;background:#f8fafb;color:#405862;border-bottom:1px solid #e4ebed;letter-spacing:.5px}
.mxUiV2 .tdCard>h5 .cnt{color:#087d83}.mxUiV2 .tdCardBody{padding:14px 15px}
.mxUiV2 .tdLiveTop b,.mxUiV2 .tdStudentHead b,.mxUiV2 .tdResult b{color:var(--ui-ink)}
.mxUiV2 .tdLiveTop .dev{background:#eaf1f3;color:#506770;border-color:#d2dfe3}
.mxUiV2 .tdLiveMeta,.mxUiV2 .tdHint,.mxUiV2 .tdEmpty{color:#6c8088}
.mxUiV2 .tdBar{background:#e3eaed;border-color:#d1dde1}.mxUiV2 .tdBar i{background:linear-gradient(90deg,#087d83,#62bec2)}
.mxUiV2 .tdResult{background:#f6f9fa;border-color:#dce5e8;color:#4c646d}.mxUiV2 .tdResults{border-color:#e2eaec}
.mxUiV2 .tdTeamRow select,.mxUiV2 .tdAssess input,.mxUiV2 .tdAssess textarea{background:#f6f8f9;color:var(--ui-ink);border-color:#cad8dd}
.mxUiV2 .tdAttentionItem{background:#fffaf0;border-color:#ecd7aa}.mxUiV2 .tdAttentionItem strong{color:#513d1c}.mxUiV2 .tdAttentionItem span{color:#826a36}

/* Leercoach als compacte witte instructiekaart. */
.mxUiV2 .trainingCoach{background:#fff;color:var(--ui-ink);border-color:#c9d9de;border-radius:15px;box-shadow:0 22px 60px rgba(9,28,36,.28)}
.mxUiV2 .trainingCoachHead{background:#18313b;border-bottom:0;padding:12px 14px}.mxUiV2 .trainingCoachHead b{color:#fff}.mxUiV2 .trainingCoachHead span{color:#b5c8ce}
.mxUiV2 .trainingCoachBody{background:#f8fafb}.mxUiV2 .trainingGoal{color:#405a64}
.mxUiV2 .trainingStep{background:#fff;color:#405a64;border-color:#d8e3e6}.mxUiV2 .trainingStep.done{background:#eaf7ef;color:#245c3d;border-color:#b7ddc5}
.mxUiV2 .trainingFeedback{color:#80550f;border-color:#e2e9eb}.mxUiV2 .trainingCoachActions button{background:#e8f1f3;color:#21434d;border-color:#c7dadd}
.mxUiV2 .trainingQuestion{background:#fff;border-color:#d6e1e5}.mxUiV2 .trainingQuestion b{color:var(--ui-ink)}
.mxUiV2 .trainingQuestion button{background:#f2f6f7;color:#29434d;border-color:#cfdbdf;text-align:start}

/* Marketingopname gebruikt nu de volledige hoogte; er is geen onderste dock meer. */
.mxUiV2 .mxDemoCap{bottom:66px;background:rgba(10,25,32,.94);border-color:rgba(112,198,202,.48);box-shadow:0 20px 54px rgba(0,0,0,.42)}
.mxUiV2 .mxDemoNote{bottom:14px;background:rgba(9,22,28,.92)}
.mxUiV2 .mxDemoTitle{background:radial-gradient(80% 80% at 50% 25%,#183a43,#081218 68%)}
.mxUiV2 .mxDemoProofs span{border-color:#32656d;background:#102d35}.mxUiV2 .mxDemoCta{background:linear-gradient(180deg,#138c74,#0b6657)}

@media(max-width:1500px){
 html.mxUiV2{--sideW:286px;--dockW:108px}
 .mxUiV2 #stage.focus{grid-template-columns:minmax(0,1fr) minmax(244px,21vw)}
 .mxUiV2 .dockItem{height:72px;min-height:72px}.mxUiV2 .dockThumb{min-height:45px}
 .mxUiV2 .mxRailVitals>span{min-width:58px;padding-inline:8px}
 .mxUiV2 #brandBtn,.mxUiV2 #homeBtn,.mxUiV2 #logoutBtnTop{display:none}
}
@media(max-width:1180px){
 html.mxUiV2{--sideW:0px;--dockW:100px}
 .mxUiV2 #app{grid-template-columns:0 minmax(0,1fr) var(--dockW)}
 .mxUiV2 body.student #app,.mxUiV2 body.student.deviceTraining #app{grid-template-columns:0 minmax(0,1fr) 0}
 .mxUiV2 body.deviceTraining #app{grid-template-columns:0 minmax(0,1fr) 0}
 .mxUiV2 body.teacher #side{width:304px;bottom:0;background:#f7fafb}
 [dir="rtl"].mxUiV2 body.teacher #side{left:auto;right:0;transform:translateX(103%)}
 [dir="rtl"].mxUiV2 body.teacher.sideOpen #side{transform:none}
 .mxUiV2 #stage.focus{grid-template-columns:minmax(0,1fr) 238px}
 .mxUiV2 .mxRailCopy b{font-size:14px}.mxUiV2 .mxRailVitals>span:nth-child(2){display:none}
 .mxUiV2 #tutorDash{inset:0}
}
@media(max-width:900px){
 .mxUiV2 #stage.focus{grid-template-columns:minmax(0,1fr)}
 .mxUiV2 #stage.focus .dev[data-dev].active{grid-column:1/-1}
 .mxUiV2 #stage.focus .dev[data-dev="patient"]:not(.active){display:none}
 .mxUiV2 .mxClinicalRail{grid-template-columns:minmax(190px,1fr) auto;gap:10px}
 .mxUiV2 .mxRailVitals>span:nth-child(4){display:none}
 .mxUiV2 .machineActions{margin-inline-start:0}
}
@media(max-width:720px){
 html.mxUiV2{--dockW:0px;--dockH:76px}
 .mxUiV2 #app{grid-template-columns:0 minmax(0,1fr);grid-template-rows:1fr var(--dockH);grid-template-areas:"side stage" "side dock"}
 .mxUiV2 body.student #app,.mxUiV2 body.deviceTraining #app,.mxUiV2 body.student.deviceTraining #app{grid-template-columns:0 minmax(0,1fr);grid-template-rows:1fr;grid-template-areas:"side stage"}
 .mxUiV2 #stage,.mxUiV2 #stage.focus{padding:0 10px 10px;grid-template-rows:64px 72px minmax(0,1fr);gap:10px}
 .mxUiV2 .machineBar{min-height:64px;max-height:64px;margin-inline:-10px;padding:9px 10px}
 .mxUiV2 .mxClinicalRail{min-height:72px;padding:9px 10px;border-radius:12px}
 .mxUiV2 .mxRailLive{display:none}.mxUiV2 .mxRailCopy small{font-size:10px}.mxUiV2 .mxRailVitals>span{min-width:55px;padding:6px 7px}
 .mxUiV2 #dock{flex-direction:row;align-items:center;gap:6px;padding:7px 8px;border:0;border-top:1px solid var(--ui-line);overflow-x:auto;overflow-y:hidden}
 .mxUiV2 .dockItem{width:78px;min-width:78px;height:60px;min-height:60px}.mxUiV2 .dockThumb{min-height:38px}.mxUiV2 .dockLabel{padding:3px;font-size:8px}
 .mxUiV2 .dockTool{width:64px;min-width:64px;height:60px;min-height:60px}.mxUiV2 .dockSpacer{min-width:4px}
 .mxUiV2 #tutorDash{grid-template-columns:1fr;grid-template-rows:64px auto 96px minmax(0,1fr)}
 .mxUiV2 .tdHead{grid-column:1;grid-row:1;padding-inline:12px}.mxUiV2 .tdHead .sub{display:none}
 .mxUiV2 .tdNav{grid-column:1;grid-row:2;flex-direction:row;padding:8px;overflow-x:auto}.mxUiV2 .tdNav button{width:auto;padding:9px 11px}
 .mxUiV2 .tdKpis{grid-column:1;grid-row:3;padding:10px;grid-template-columns:repeat(4,minmax(100px,1fr));overflow-x:auto}.mxUiV2 .tdKpi{padding:10px}.mxUiV2 .tdKpi b{font-size:22px}
 .mxUiV2 #tutorDash .tdBody{grid-column:1;grid-row:4;padding:10px}
}
@media(max-width:520px){
 html.mxUiV2{--dockH:0px}
 .mxUiV2 #app{grid-template-rows:1fr;grid-template-areas:"side stage"}.mxUiV2 #dock{display:none}
 .mxUiV2 .mxClinicalRail{grid-template-columns:minmax(0,1fr) auto}.mxUiV2 .mxRailVitals>span:nth-child(1),.mxUiV2 .mxRailVitals>span:nth-child(4){display:none}
 .mxUiV2 .mxRailClock{min-width:82px!important}.mxUiV2 .mxRailClock b{font-size:14px}
 .mxUiV2 .mxRailCopy b{font-size:12.5px}.mxUiV2 .mxRailCopy small{display:none}
 .mxUiV2 #stage.focus .monGrid{grid-template-columns:minmax(0,1fr) 128px}
 .mxUiV2 #stage.focus .alarmBanner{right:128px}.mxUiV2 #stage.focus .silenceChip{right:134px}.mxUiV2 #stage.focus .deviceSoftMenu.bottom{right:136px}
 .mxUiV2 #stage.focus .par .pv{font-size:32px!important}
}

/* v3 designlaag: frontend/v3.css */