/* Framed-only M14 virtual microscope + fetal circulation. */
body.study-framed-page .m14-lab { --m14-ink:var(--text); --m14-dim:var(--text-dim); --m14-muted:var(--text-muted); overflow:clip; }
body.study-framed-page .m14-lab * { box-sizing:border-box; }
body.study-framed-page .m14-lab button { min-width:0; -webkit-tap-highlight-color:transparent; }
body.study-framed-page .m14-lab button:focus-visible,
body.study-framed-page .m14-lab [tabindex]:focus-visible { outline:none; box-shadow:var(--focus); }

body.study-framed-page .m14-head { min-width:0; grid-template-columns:minmax(0,1fr) auto; overflow:clip; }
body.study-framed-page .m14-head h3 { overflow-wrap:anywhere; }
body.study-framed-page .m14-steps { min-width:0; display:flex; justify-content:flex-end; align-items:center; gap:4px; margin:0; padding:0; list-style:none; }
body.study-framed-page .m14-steps li { min-width:0; display:flex; align-items:center; color:var(--m14-muted); border:1px solid transparent; border-radius:999px; font-size:9px; line-height:1.2; white-space:nowrap; }
body.study-framed-page .m14-steps button { min-width:0; min-height:31px; display:flex; align-items:center; gap:5px; padding:4px 7px 4px 4px; color:inherit; background:transparent; border:0; border-radius:999px; font:inherit; cursor:pointer; }
body.study-framed-page .m14-steps button:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
body.study-framed-page .m14-steps li span { width:21px; height:21px; display:grid; place-items:center; color:var(--m14-muted); background:var(--panel); border:1px solid var(--border); border-radius:50%; font:750 8.5px/1 "SFMono-Regular",Consolas,monospace; }
body.study-framed-page .m14-steps li b { font-weight:650; }
body.study-framed-page .m14-steps li.is-current { color:var(--accent-bright); background:color-mix(in srgb,var(--accent) 8%,transparent); border-color:color-mix(in srgb,var(--accent) 35%,var(--border)); }
body.study-framed-page .m14-steps li.is-current span { color:var(--bg); background:var(--accent); border-color:var(--accent); }
body.study-framed-page .m14-steps li.is-done span { color:var(--bg); background:var(--good); border-color:var(--good); }
html[data-reading-scale="1.5"] body.study-framed-page .m14-steps li b,
html[data-reading-scale="1.75"] body.study-framed-page .m14-steps li b,
html[data-reading-scale="2"] body.study-framed-page .m14-steps li b { display:none; }

body.study-framed-page .m14-workbench { height:366px; grid-template-columns:minmax(196px,.57fr) minmax(0,1.75fr); gap:8px; }
body.study-framed-page .m14-palette,
body.study-framed-page .m14-stage { min-width:0; min-height:0; background:var(--stage-panel); border:1px solid var(--image-border); border-radius:var(--r-control); }
body.study-framed-page .m14-palette { overflow:auto; padding:11px; scrollbar-width:thin; scrollbar-color:var(--border-strong) transparent; }
body.study-framed-page .m14-kicker { margin:0 0 4px; color:var(--accent); font:750 8.5px/1.3 "SFMono-Regular",Consolas,monospace; letter-spacing:.1em; }
body.study-framed-page .m14-palette h4 { margin:0; color:var(--m14-ink); font-size:13px; line-height:1.35; }
body.study-framed-page .m14-palette > p:not(.m14-kicker,.m14-status) { margin:6px 0 9px; color:var(--m14-dim); font-size:9.5px; line-height:1.45; }
body.study-framed-page .m14-token-grid { display:grid; grid-template-columns:1fr; gap:5px; }
body.study-framed-page .m14-token { min-height:44px; display:grid; align-content:center; gap:1px; padding:6px 8px; color:var(--m14-ink); background:var(--panel); border:1px solid var(--border); border-radius:var(--r-control); cursor:grab; text-align:left; touch-action:none; transition:border-color .16s ease,transform .16s ease,background .16s ease; }
body.study-framed-page .m14-token:hover { border-color:var(--accent); transform:translateY(-1px); }
body.study-framed-page .m14-token:active,
body.study-framed-page .m14-token.is-dragging { cursor:grabbing; transform:translateY(1px); border-color:var(--accent); }
body.study-framed-page .m14-token.is-carried { background:color-mix(in srgb,var(--accent) 12%,var(--panel)); border-color:var(--accent); }
body.study-framed-page .m14-token:disabled { opacity:.38; cursor:not-allowed; transform:none; }
body.study-framed-page .m14-token span { font-size:9.5px; font-weight:700; line-height:1.2; overflow-wrap:anywhere; }
body.study-framed-page .m14-token small { color:var(--m14-muted); font-size:8px; line-height:1.25; overflow-wrap:anywhere; }
body.study-framed-page .m14-evidence-list { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:3px; margin:9px 0 0; padding:0; list-style:none; }
body.study-framed-page .m14-evidence-list li { min-width:0; display:grid; justify-items:center; gap:2px; color:var(--m14-muted); font:700 7px/1.15 monospace; text-align:center; }
body.study-framed-page .m14-evidence-list li span { width:20px; height:20px; display:grid; place-items:center; border:1px solid var(--border); border-radius:50%; }
body.study-framed-page .m14-evidence-list li b { max-width:100%; overflow:hidden; text-overflow:ellipsis; }
body.study-framed-page .m14-evidence-list li.is-current span { color:var(--bg); background:var(--accent); border-color:var(--accent); }
body.study-framed-page .m14-evidence-list li.is-done span { color:var(--bg); background:var(--good); border-color:var(--good); }
body.study-framed-page .m14-status { margin:9px 0 0; color:var(--m14-muted); font:700 7.5px/1.3 monospace; }
body.study-framed-page .m14-status.ready { color:var(--good); }
body.study-framed-page .m14-status.error { color:var(--bad); }

body.study-framed-page .m14-stage { position:relative; overflow:clip; padding:8px; }
body.study-framed-page .m14-stage-head { min-width:0; min-height:39px; display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:start; gap:10px; padding:0 2px 6px; }
body.study-framed-page .m14-stage-head span { display:block; color:var(--accent); font:750 8px/1.2 "SFMono-Regular",Consolas,monospace; letter-spacing:.11em; }
body.study-framed-page .m14-stage-head h4 { margin:2px 0 0; color:var(--m14-ink); font-size:12px; line-height:1.25; }
body.study-framed-page .m14-stage-head output { max-width:210px; color:var(--accent-bright); font:750 10px/1.25 monospace; text-align:right; font-variant-numeric:tabular-nums; }
body.study-framed-page .m14-microscope { height:299px; min-width:0; display:grid; grid-template-rows:27px minmax(148px,1fr) auto auto auto; gap:4px; }
body.study-framed-page .m14-toolbar { min-width:0; display:grid; grid-template-columns:44px minmax(0,1fr) 44px; align-items:center; gap:5px; }
body.study-framed-page .m14-toolbar button { min-height:27px; padding:2px; color:var(--m14-ink); background:var(--panel); border:1px solid var(--border); border-radius:6px; cursor:pointer; font-size:15px; }
body.study-framed-page .m14-toolbar button:hover { border-color:var(--accent); }
body.study-framed-page .m14-toolbar span { min-width:0; color:var(--m14-muted); font:700 7.5px/1.2 monospace; text-align:center; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
body.study-framed-page .m14-viewport { position:relative; min-width:0; min-height:0; overflow:hidden; background:var(--bg-alt); border:1px solid var(--border); border-radius:var(--r-control); cursor:grab; touch-action:none; }
body.study-framed-page .m14-viewport.is-panning { cursor:grabbing; border-color:var(--accent); }
body.study-framed-page .m14-image-plane { position:absolute; transform-origin:center; will-change:transform; }
body.study-framed-page .m14-image-plane > img { width:100%; height:100%; display:block; user-select:none; pointer-events:none; }
body.study-framed-page .m14-hotspot { position:absolute; left:var(--x); top:var(--y); width:var(--d); height:var(--d); min-width:48px; min-height:48px; display:grid; place-items:center; padding:0; color:var(--m14-dim); background:color-mix(in srgb,var(--panel) 36%,transparent); border:2px dashed color-mix(in srgb,var(--accent) 72%,var(--border)); border-radius:50%; cursor:crosshair; transform:translate(-50%,-50%); transition:border-color .16s ease,background .16s ease; }
body.study-framed-page .m14-lab button.m14-hotspot { min-width:48px; min-height:48px; }
body.study-framed-page .m14-hotspot:hover,
body.study-framed-page .m14-hotspot.is-armed,
body.study-framed-page .m14-hotspot.is-hovered { color:var(--m14-ink); background:color-mix(in srgb,var(--accent) 17%,transparent); border-color:var(--accent); }
body.study-framed-page .m14-hotspot.is-found { color:var(--m14-ink); background:color-mix(in srgb,var(--good) 24%,transparent); border-color:var(--good); border-style:solid; }
body.study-framed-page .m14-hotspot.is-rejected { border-color:var(--bad); background:color-mix(in srgb,var(--bad) 18%,transparent); animation:m14-reject .24s ease; }
body.study-framed-page .m14-hotspot span { max-width:86px; padding:2px; font:750 11px/1 monospace; text-align:center; overflow-wrap:anywhere; }
@keyframes m14-reject { 0%,100%{transform:translate(-50%,-50%)}30%{transform:translate(calc(-50% - 3px),-50%)}70%{transform:translate(calc(-50% + 3px),-50%)} }
body.study-framed-page .m14-image-state { position:absolute; inset:0; z-index:4; display:grid; place-items:center; align-content:center; gap:5px; padding:12px; background:color-mix(in srgb,var(--bg) 84%,transparent); text-align:center; }
body.study-framed-page .m14-image-state b { color:var(--accent-bright); font:750 9px/1.2 monospace; }
body.study-framed-page .m14-image-state span { color:var(--m14-dim); font-size:9px; }
body.study-framed-page .m14-image-state.error b { color:var(--bad); }
body.study-framed-page .m14-found-strip { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:4px; }
body.study-framed-page .m14-found-strip > span { min-width:0; min-height:30px; display:flex; align-items:center; gap:4px; padding:3px 5px; color:var(--m14-muted); background:var(--panel); border:1px solid var(--border); border-radius:6px; font-size:7px; overflow:hidden; white-space:nowrap; }
body.study-framed-page .m14-found-strip > span b { width:17px; height:17px; flex:0 0 auto; display:grid; place-items:center; border:1px solid var(--border-strong); border-radius:50%; font:700 7px/1 monospace; }
body.study-framed-page .m14-found-strip > span.is-found { color:var(--m14-dim); border-color:color-mix(in srgb,var(--good) 55%,var(--border)); }
body.study-framed-page .m14-found-strip > span.is-found b { color:var(--bg); background:var(--good); border-color:var(--good); }
body.study-framed-page .m14-order-track { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; }
body.study-framed-page .m14-drop { min-height:44px; padding:5px 7px; color:var(--m14-dim); background:var(--panel); border:1px dashed var(--border-strong); border-radius:var(--r-control); cursor:pointer; transition:border-color .16s ease,background .16s ease,transform .16s ease; }
body.study-framed-page .m14-drop:hover,
body.study-framed-page .m14-drop.is-armed,
body.study-framed-page .m14-drop.is-hovered { color:var(--m14-ink); border-color:var(--accent); }
body.study-framed-page .m14-drop.is-hovered { background:color-mix(in srgb,var(--accent) 12%,var(--panel)); transform:translateY(-1px); }
body.study-framed-page .m14-drop.is-filled { border-style:solid; border-color:var(--good); background:color-mix(in srgb,var(--good) 7%,var(--panel)); }
body.study-framed-page .m14-drop.is-rejected { border-color:var(--bad); animation:m14-drop-reject .24s ease; }
body.study-framed-page .m14-drop span,
body.study-framed-page .m14-drop small { display:block; }
body.study-framed-page .m14-drop span { font-size:8.5px; font-weight:750; line-height:1.2; }
body.study-framed-page .m14-drop small { margin-top:2px; color:var(--m14-muted); font-size:7px; line-height:1.2; }
@keyframes m14-drop-reject { 0%,100%{transform:translateX(0)}30%{transform:translateX(-3px)}70%{transform:translateX(3px)} }
body.study-framed-page .m14-rationale { margin:0; color:var(--m14-dim); font-size:7.7px; line-height:1.35; }
body.study-framed-page .m14-credit { margin:0; color:var(--m14-muted); font:700 6.8px/1.2 monospace; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

body.study-framed-page .m14-birth { height:299px; display:grid; grid-template-columns:minmax(0,1fr) 154px; grid-template-rows:minmax(0,1fr) auto; gap:7px; }
body.study-framed-page .m14-birth-flow { min-width:0; min-height:0; overflow:hidden; background:var(--bg-alt); border:1px solid var(--border); border-radius:var(--r-control); }
body.study-framed-page .m14-birth-flow svg { width:100%; height:100%; display:block; }
body.study-framed-page .m14-shunt-lanes { display:none; }
body.study-framed-page .m14-organ rect,
body.study-framed-page .m14-organ circle,
body.study-framed-page .m14-organ path { fill:var(--panel); stroke:var(--border-strong); stroke-width:2; }
body.study-framed-page .m14-organ text { fill:var(--m14-dim); font:750 9px/1 monospace; text-anchor:middle; }
body.study-framed-page .m14-vessel { fill:none; stroke:var(--border-strong); stroke-width:4; stroke-linecap:round; vector-effect:non-scaling-stroke; transition:stroke .18s ease,opacity .18s ease; }
body.study-framed-page .m14-vessel.is-flowing { stroke:var(--accent); }
body.study-framed-page .m14-vessel.is-return { stroke:var(--warn); }
body.study-framed-page .m14-vessel.is-low { stroke:var(--border-strong); stroke-dasharray:5 5; }
body.study-framed-page .m14-vessel.is-off { stroke:var(--bad); stroke-dasharray:2 7; opacity:.38; }
body.study-framed-page #m14-arrow path { fill:var(--accent); }
body.study-framed-page .m14-flow-label { fill:var(--m14-muted); font:700 8px/1 monospace; text-anchor:middle; }
body.study-framed-page .m14-birth > .m14-drop { align-self:stretch; display:grid; align-content:center; text-align:center; }
body.study-framed-page .m14-birth-metrics { grid-column:1/-1; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:5px; }
body.study-framed-page .m14-birth-metrics span { min-width:0; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:4px; padding:5px 7px; color:var(--m14-dim); background:var(--panel); border:1px solid var(--border); border-radius:6px; font:700 8px/1.25 monospace; }
body.study-framed-page .m14-birth-metrics b { color:var(--m14-muted); font-size:7px; }

body.study-framed-page .m14-foot { grid-template-columns:minmax(0,1fr) auto; }
body.study-framed-page .m14-feedback { min-width:0; margin:0; color:var(--m14-dim); font-size:10px; line-height:1.35; }
body.study-framed-page .m14-feedback.good { color:var(--good); }
body.study-framed-page .m14-feedback.bad { color:var(--bad); }
body.study-framed-page .m14-feedback.info { color:var(--accent-bright); }
body.study-framed-page .m14-foot-actions { display:flex; align-items:center; gap:9px; }
body.study-framed-page .m14-next { min-height:32px; padding:5px 9px; color:var(--bg); background:var(--accent); border:1px solid var(--accent); border-radius:var(--r-control); cursor:pointer; font-size:9px; font-weight:750; }

@media (max-width:1100px) {
  body.study-framed-page .m14-steps li b { display:none; }
  body.study-framed-page .m14-workbench { grid-template-columns:minmax(180px,.54fr) minmax(0,1.75fr); }
  body.study-framed-page .m14-token span { font-size:9px; }
}
@media (max-width:760px),(pointer:coarse) {
  body.study-framed-page .m14-head { grid-template-columns:1fr; }
  body.study-framed-page .m14-steps { justify-content:flex-start; }
  body.study-framed-page .m14-steps li { min-height:44px; }
  body.study-framed-page .m14-steps button { width:100%; min-height:44px; justify-content:center; padding:5px; }
  body.study-framed-page .m14-steps li span { width:32px; height:32px; font-size:11px; }
  body.study-framed-page .m14-workbench { height:auto; grid-template-columns:1fr; }
  body.study-framed-page .m14-palette { overflow:visible; }
  body.study-framed-page .m14-palette h4 { font-size:15px; }
  body.study-framed-page .m14-palette > p:not(.m14-kicker,.m14-status) { font-size:12px; }
  body.study-framed-page .m14-token-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  body.study-framed-page .m14-token,
  body.study-framed-page .m14-drop,
  body.study-framed-page .m14-next,
  body.study-framed-page .m14-toolbar button { min-height:44px; }
  body.study-framed-page .m14-token span,
  body.study-framed-page .m14-drop span { font-size:11px; }
  body.study-framed-page .m14-token small,
  body.study-framed-page .m14-drop small { font-size:10px; }
  body.study-framed-page .m14-evidence-list li { font-size:9px; }
  body.study-framed-page .m14-stage { height:auto; min-height:445px; overflow:visible; }
  body.study-framed-page .m14-stage-head { grid-template-columns:1fr; }
  body.study-framed-page .m14-stage-head output { max-width:none; text-align:left; }
  body.study-framed-page .m14-microscope { height:auto; min-height:385px; grid-template-rows:44px 260px auto auto auto; }
  body.study-framed-page .m14-toolbar { grid-template-columns:44px minmax(0,1fr) 44px; }
  body.study-framed-page .m14-toolbar span { font-size:9px; }
  body.study-framed-page .m14-found-strip { grid-template-columns:repeat(3,minmax(0,1fr)); }
  body.study-framed-page .m14-order-track { grid-template-columns:1fr; }
  body.study-framed-page .m14-rationale { font-size:10px; }
  body.study-framed-page .m14-credit { font-size:8.5px; white-space:normal; }
  body.study-framed-page .m14-birth { height:auto; min-height:540px; grid-template-columns:1fr; grid-template-rows:auto auto auto; }
  body.study-framed-page .m14-birth-flow { min-height:330px; display:grid; grid-template-rows:172px auto; padding:5px; gap:5px; }
  body.study-framed-page .m14-birth-flow svg { min-height:0; }
  body.study-framed-page .m14-shunt-lanes { display:grid; grid-template-columns:1fr; gap:4px; }
  body.study-framed-page .m14-shunt-lanes span { min-height:44px; display:grid; align-content:center; gap:2px; padding:5px 8px; color:var(--m14-dim); background:var(--panel); border:1px solid var(--border); border-radius:6px; }
  body.study-framed-page .m14-shunt-lanes b { font:750 10px/1.2 monospace; }
  body.study-framed-page .m14-shunt-lanes small { color:var(--m14-muted); font-size:9px; line-height:1.2; }
  body.study-framed-page .m14-birth > .m14-drop { min-height:70px; }
  body.study-framed-page .m14-birth-metrics { grid-column:1; grid-template-columns:repeat(2,minmax(0,1fr)); }
  body.study-framed-page .m14-foot { grid-template-columns:1fr; }
  body.study-framed-page .m14-feedback { font-size:12px; }
  body.study-framed-page .m14-foot-actions { flex-direction:column; align-items:stretch; }
  body.study-framed-page .m14-next { font-size:12px; }
}
@media (max-width:430px) {
  body.study-framed-page .m14-steps { width:100%; }
  body.study-framed-page .m14-steps li { flex:1; justify-content:center; }
  body.study-framed-page .m14-token-grid { grid-template-columns:1fr; }
  body.study-framed-page .m14-found-strip { grid-template-columns:repeat(2,minmax(0,1fr)); }
  body.study-framed-page .m14-birth-metrics { grid-template-columns:1fr; }
}
@media (prefers-reduced-motion:reduce) { body.study-framed-page .m14-lab * { animation:none!important; transition:none!important; } }
@media print {
  body.study-framed-page .m14-lab { break-inside:avoid; }
  body.study-framed-page .m14-token,
  body.study-framed-page .m14-next,
  body.study-framed-page .m14-toolbar { display:none; }
}
