/* Framed-only direct curve / time / organ-board family: M12, M13, M18. */
body.study-framed-page .physb-lab {
  --physb-stage: var(--stage-panel);
  --physb-air: var(--info);
  --physb-blood: var(--bad);
  --physb-flow: var(--accent);
  --physb-hormone: var(--warn);
  --physb-positive: var(--good);
  --physb-structure: var(--text-muted);
  --physb-soft-accent: color-mix(in srgb, var(--accent) 13%, transparent);
  --physb-soft-info: color-mix(in srgb, var(--info) 13%, transparent);
  --physb-soft-bad: color-mix(in srgb, var(--bad) 14%, transparent);
  --physb-soft-warn: color-mix(in srgb, var(--warn) 14%, transparent);
  --physb-soft-good: color-mix(in srgb, var(--good) 13%, transparent);
}

body.study-framed-page .physb-lab .physb-workbench {
  height: 394px;
  grid-template-columns: minmax(0, 1.58fr) minmax(272px, .92fr);
}

body.study-framed-page .physb-stage { background: var(--physb-stage); }
body.study-framed-page .physb-scene { width: 100%; height: 100%; min-width: 0; }
body.study-framed-page .physb-scene[hidden] { display: none; }
body.study-framed-page .physb-scene svg { display: block; width: 100%; height: 100%; }
body.study-framed-page .physb-side { grid-template-rows: 1fr; overflow: auto; scrollbar-width: thin; }
body.study-framed-page .physb-side > section { min-width: 0; display: grid; align-content: start; gap: 7px; }
body.study-framed-page .physb-side > section[hidden] { display: none; }

body.study-framed-page .physb-prompt { margin: 0; color: var(--text-dim); font-size: 10.5px; line-height: 1.42; }
body.study-framed-page .physb-mission.is-done::after { content: " ✓"; color: var(--good); }
body.study-framed-page .physb-mission:disabled { opacity: .42; cursor: not-allowed; }

body.study-framed-page .physb-metrics { min-width: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; }
body.study-framed-page .physb-metric { min-width: 0; min-height: 47px; display: grid; align-content: center; gap: 2px; padding: 5px 7px; background: var(--bg-alt); border: 1px solid var(--border); border-radius: 6px; }
body.study-framed-page .physb-metric span { color: var(--text-muted); font: 700 8.5px/1.2 "SFMono-Regular", Consolas, monospace; letter-spacing: .04em; text-transform: uppercase; }
body.study-framed-page .physb-metric strong { min-width: 0; color: var(--text); font-size: 10.5px; line-height: 1.24; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }

body.study-framed-page .physb-checks { display: flex; flex-wrap: wrap; gap: 4px; }
body.study-framed-page .physb-checks span { min-height: 24px; display: inline-flex; align-items: center; gap: 4px; padding: 3px 6px; color: var(--text-muted); background: transparent; border: 1px solid var(--border); border-radius: 999px; font: 700 8.5px/1.15 "SFMono-Regular", Consolas, monospace; }
body.study-framed-page .physb-checks i { width: 6px; height: 6px; flex: 0 0 6px; background: var(--border-strong); border-radius: 50%; }
body.study-framed-page .physb-checks span.is-done { color: var(--text); border-color: var(--good); background: var(--physb-soft-good); }
body.study-framed-page .physb-checks span.is-done i { background: var(--good); }

body.study-framed-page .physb-tools { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; }
body.study-framed-page .physb-tool-token,
body.study-framed-page .physb-axis-tabs button {
  min-width: 0;
  min-height: 44px;
  padding: 6px 7px;
  color: var(--text-dim);
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--r-control);
  cursor: grab;
  text-align: left;
}
body.study-framed-page .physb-tool-token strong { display: block; color: var(--text); font-size: 10px; line-height: 1.18; }
body.study-framed-page .physb-tool-token span { display: block; margin-top: 2px; color: var(--text-muted); font: 700 8px/1.1 "SFMono-Regular", Consolas, monospace; }
body.study-framed-page .physb-tool-token:hover,
body.study-framed-page .physb-axis-tabs button:hover { border-color: var(--border-strong); }
body.study-framed-page .physb-tool-token.is-selected,
body.study-framed-page .physb-axis-tabs button[aria-pressed="true"] { color: var(--accent-bright); background: var(--physb-soft-accent); border-color: var(--accent); }
body.study-framed-page .physb-axis-tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; }
body.study-framed-page .physb-axis-tabs button { cursor: pointer; text-align: center; font-size: 9.5px; }

.physb-drag-ghost { position: fixed; z-index: 2147483000; pointer-events: none; transform: translate(-50%, -115%); padding: 6px 9px; color: var(--bg); background: var(--accent); border-radius: 999px; font: 700 11px/1 "SFMono-Regular", Consolas, monospace; box-shadow: var(--shadow); }

body.study-framed-page .physb-svg-kicker { fill: var(--accent); font: 750 9px/1.2 "SFMono-Regular", Consolas, monospace; letter-spacing: .11em; }
body.study-framed-page .physb-svg-label { fill: var(--text-muted); font: 700 9px/1.2 "SFMono-Regular", Consolas, monospace; letter-spacing: .05em; }
body.study-framed-page .physb-dial-value { fill: var(--text); font: 760 14px/1 "SFMono-Regular", Consolas, monospace; font-variant-numeric: tabular-nums; }
body.study-framed-page .physb-axis { stroke: var(--text-muted); stroke-width: 1.4; vector-effect: non-scaling-stroke; }
body.study-framed-page .physb-grid line { stroke: var(--border); stroke-width: 1; vector-effect: non-scaling-stroke; }
body.study-framed-page .physb-curve { fill: none; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; transition: d .18s ease; }
body.study-framed-page .physb-curve-ghost { stroke: var(--text-muted); stroke-width: 1.5; stroke-dasharray: 5 5; opacity: .65; }
body.study-framed-page .physb-curve-current { stroke: var(--accent); stroke-width: 3; }
body.study-framed-page .physb-cursor { stroke: var(--warn); stroke-width: 1.5; stroke-dasharray: 3 3; vector-effect: non-scaling-stroke; }
body.study-framed-page .physb-mark { fill: var(--warn); stroke: var(--stage-panel); stroke-width: 2; vector-effect: non-scaling-stroke; }

body.study-framed-page .physb-handle { color: var(--bg); fill: var(--accent); stroke: var(--accent-bright); stroke-width: 2.2; vector-effect: non-scaling-stroke; cursor: ew-resize; touch-action: none; }
body.study-framed-page .physb-handle path { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
body.study-framed-page .physb-hit { r: 40px; fill: transparent; stroke: none; pointer-events: all; }
body.study-framed-page .physb-zone-hit { fill: transparent; stroke: none; pointer-events: all; }
body.study-framed-page .physb-handle-round circle:last-child { fill: var(--accent); stroke: var(--accent-bright); }

body.study-framed-page .physb-drop-zone { color: var(--text-dim); fill: var(--physb-soft-accent); stroke: var(--border-strong); stroke-width: 1.4; vector-effect: non-scaling-stroke; cursor: pointer; touch-action: none; }
body.study-framed-page .physb-drop-zone:hover,
body.study-framed-page .physb-drop-zone:focus-visible { stroke: var(--accent); }
body.study-framed-page .physb-drop-zone text { fill: var(--text); stroke: none; font: 720 10px/1.2 "SFMono-Regular", Consolas, monospace; }

/* M12 — lung, hemoglobin, and gut. */
body.study-framed-page .physb-lung-wall { fill: var(--physb-soft-info); stroke: var(--physb-structure); vector-effect: non-scaling-stroke; }
body.study-framed-page .physb-airway { fill: none; stroke: var(--physb-air); stroke-linecap: round; vector-effect: non-scaling-stroke; }
body.study-framed-page .physb-vessel { fill: none; stroke: var(--physb-blood); stroke-linecap: round; vector-effect: non-scaling-stroke; }
body.study-framed-page .physb-alveoli { fill: var(--physb-soft-info); stroke: var(--info); stroke-width: 2; transform-origin: 244px 166px; transition: transform .18s ease; }
body.study-framed-page .physb-particle { transition: opacity .14s ease, transform .14s ease; }
body.study-framed-page .physb-particle-air { fill: var(--info); }
body.study-framed-page .physb-particle-blood { fill: var(--bad); }
body.study-framed-page .physb-particle.is-off { opacity: .08; transform: scale(.55); }
body.study-framed-page .physb-output-dial circle { fill: var(--bg-alt); stroke: var(--border-strong); stroke-width: 2; }
body.study-framed-page .physb-output-dial path { stroke: var(--accent); stroke-width: 4; stroke-linecap: round; vector-effect: non-scaling-stroke; }
body.study-framed-page .physb-rbc-zone path { fill: var(--physb-soft-bad); stroke: var(--bad); }
body.study-framed-page .physb-m12[data-hb-direction="right"] .physb-curve-current { stroke: var(--bad); }
body.study-framed-page .physb-m12[data-hb-direction="left"] .physb-curve-current { stroke: var(--info); }
body.study-framed-page .physb-gi-lumen path { fill: var(--bg-alt); stroke: var(--border-strong); }
body.study-framed-page .physb-enterocytes path { fill: var(--physb-soft-accent); stroke: var(--accent); stroke-width: 1.3; }
body.study-framed-page .physb-enterocytes text,
body.study-framed-page .physb-gi-organ text,
body.study-framed-page .physb-hormone-pulses text { fill: var(--text-muted); font: 700 9px/1.2 "SFMono-Regular", Consolas, monospace; }
body.study-framed-page .physb-route-line { fill: none; stroke: var(--border-strong); stroke-width: 5; stroke-linecap: round; vector-effect: non-scaling-stroke; }
body.study-framed-page .physb-m12[data-gi-route="acid"] [data-gi-apical],
body.study-framed-page .physb-m12[data-gi-route="amino"] [data-gi-blood],
body.study-framed-page .physb-m12[data-gi-route="glucose"] [data-gi-blood],
body.study-framed-page .physb-m12[data-gi-route="fat"] [data-gi-lymph] { stroke: var(--accent); }
body.study-framed-page .physb-gi-vessel { fill: none; stroke: var(--bad); stroke-width: 16; stroke-linecap: round; opacity: .62; }
body.study-framed-page .physb-gi-lymph { fill: none; stroke: var(--info); stroke-width: 12; stroke-linecap: round; opacity: .62; }
body.study-framed-page .physb-gi-organ path { fill: var(--physb-soft-warn); stroke: var(--warn); stroke-width: 1.5; }
body.study-framed-page .physb-hormone-pulses { transition: opacity .18s ease; }
body.study-framed-page .physb-hormone-pulses circle { fill: var(--warn); }

/* M13 — endocrine axes, calcium routing, and cycle. */
body.study-framed-page .physb-axis-flow { fill: none; stroke: var(--accent); stroke-width: 5; stroke-linecap: round; vector-effect: non-scaling-stroke; }
body.study-framed-page .physb-feedback { fill: none; stroke: var(--info); stroke-width: 3; stroke-dasharray: 7 5; vector-effect: non-scaling-stroke; }
body.study-framed-page .physb-feedback.is-blocked { stroke: var(--bad); stroke-dasharray: 2 5; }
body.study-framed-page .physb-axis-node circle { fill: var(--bg-alt); stroke: var(--border-strong); }
body.study-framed-page .physb-axis-node text { font-size: 8.5px; }
body.study-framed-page .physb-axis-node rect { fill: var(--accent); stroke: none; transition: width .18s ease; }
body.study-framed-page .physb-feedback-zone rect { fill: var(--physb-soft-info); stroke: var(--info); }
body.study-framed-page .physb-axis-hormone,
body.study-framed-page .physb-axis-output { fill: var(--text); font: 700 9px/1.2 "SFMono-Regular", Consolas, monospace; }
body.study-framed-page .physb-calcium-organ path,
body.study-framed-page .physb-calcium-organ circle { fill: var(--bg-alt); stroke: var(--border-strong); stroke-width: 2; vector-effect: non-scaling-stroke; }
body.study-framed-page .physb-calcium-route { fill: none; stroke: var(--accent); stroke-width: 3; stroke-dasharray: 7 5; vector-effect: non-scaling-stroke; pointer-events: none; }
body.study-framed-page .physb-ion-dials circle { fill: var(--bg-alt); stroke: var(--border-strong); stroke-width: 1.5; }
body.study-framed-page .physb-ion-dials text { fill: var(--text); font: 730 11px/1.2 "SFMono-Regular", Consolas, monospace; }
body.study-framed-page .physb-cycle-e2 { stroke: var(--info); stroke-width: 2.5; }
body.study-framed-page .physb-cycle-lh { stroke: var(--warn); stroke-width: 3; }
body.study-framed-page .physb-cycle-prog { stroke: var(--accent); stroke-width: 2.5; }
body.study-framed-page .physb-ovulation { opacity: .12; transition: opacity .18s ease; }
body.study-framed-page .physb-ovulation.is-visible { opacity: 1; }
body.study-framed-page .physb-ovulation circle { fill: var(--physb-soft-good); stroke: var(--good); stroke-width: 2; }
body.study-framed-page .physb-ovulation path { fill: none; stroke: var(--good); stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; }
body.study-framed-page .physb-ovulation text { fill: var(--good); font: 700 9px/1.2 "SFMono-Regular", Consolas, monospace; }
body.study-framed-page .physb-endometrium { fill: var(--physb-soft-bad); stroke: var(--bad); stroke-width: 1.5; transition: d .18s ease; }
body.study-framed-page .physb-cycle-zone rect { fill: var(--bg-alt); stroke: var(--border-strong); }

/* M18 — PK tank, PD receptor, ANS organ board. */
body.study-framed-page .physb-pk-tank [data-pk-tank] { fill: var(--bg-alt); stroke: var(--border-strong); stroke-width: 3; }
body.study-framed-page .physb-pk-fluid { fill: var(--physb-soft-accent); stroke: var(--accent); stroke-width: 1.5; transition: d .18s ease; pointer-events: none; }
body.study-framed-page .physb-pk-tank > text { pointer-events: none; }
body.study-framed-page .physb-pk-drain { fill: none; stroke: var(--accent); stroke-linecap: round; vector-effect: non-scaling-stroke; }
body.study-framed-page .physb-flow-dots circle { fill: var(--accent); }
body.study-framed-page .physb-receptor-zone path { fill: var(--physb-soft-accent); stroke: var(--accent); }
body.study-framed-page .physb-organ-zone { fill: none; }
body.study-framed-page .physb-organ-zone path,
body.study-framed-page .physb-organ-zone circle { fill: var(--physb-soft-info); stroke: var(--border-strong); stroke-width: 2.2; vector-effect: non-scaling-stroke; }
body.study-framed-page .physb-organ-zone.is-active path,
body.study-framed-page .physb-organ-zone.is-active circle { fill: var(--physb-soft-good); stroke: var(--good); }
body.study-framed-page .physb-ans-readout rect { fill: var(--bg-alt); stroke: var(--border-strong); }
body.study-framed-page .physb-ans-readout text { fill: var(--text); font: 700 8.5px/1.2 "SFMono-Regular", Consolas, monospace; }

@media (max-width: 430px), (pointer: coarse) {
  body.study-framed-page .physb-lab .physb-workbench { height: auto; grid-template-columns: 1fr; }
  body.study-framed-page .physb-stage { height: 206px; }
  body.study-framed-page .physb-side { overflow: visible; }
  body.study-framed-page .physb-prompt,
  body.study-framed-page .physb-metric strong,
  body.study-framed-page .physb-checks span,
  body.study-framed-page .physb-tool-token strong,
  body.study-framed-page .physb-tool-token span,
  body.study-framed-page .physb-axis-tabs button { font-size: 11px; }
  body.study-framed-page .physb-tool-token,
  body.study-framed-page .physb-axis-tabs button { min-height: 44px; }
  body.study-framed-page .physb-metric { min-height: 46px; }
  body.study-framed-page .physb-metrics { grid-template-columns: 1fr 1fr; }
  body.study-framed-page .physb-m13 [data-physb-scene="B"] .physb-calcium-organ text { font-size: 20px; }
}

@media (prefers-reduced-motion: reduce) {
  body.study-framed-page .physb-lab *,
  .physb-drag-ghost { transition: none !important; animation: none !important; }
}

@media print {
  body.study-framed-page .physb-stage { height: 330px; }
  body.study-framed-page .physb-side { overflow: visible; }
  .physb-drag-ghost { display: none !important; }
}
