/* Laboratorios clínicos. La geometría médica conserva su escala interna;
   la interfaz se adapta al espacio real del simulador, no al viewport. */
.sim-lab{min-width:0;scroll-margin-top:80px}
.sim-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin:0 0 16px;padding:12px 0;border-bottom:1px solid var(--line);font-family:var(--sans)}
.sim-toolbar strong{font-size:var(--fs-card);color:var(--ink)}
.sim-toolbar p{font:400 var(--fs-meta)/1.5 var(--sans);color:var(--muted);margin:4px 0 0;max-width:62ch}
.sim-actions{display:flex;flex-wrap:wrap;gap:8px;flex-shrink:0}
.sim-lab button,.sim-audio-tools button{font-family:var(--sans);cursor:pointer}
.sim-action,.sim-audio-tools button{min-height:44px;padding:10px 14px;border:1px solid var(--line-strong);
  border-radius:var(--r-sm);background:var(--surface);color:var(--ink);font-size:var(--fs-meta)}
.sim-action:hover,.sim-audio-tools button:hover{background:var(--accent-soft);border-color:var(--accent-ink)}
.sim-lab :is(button,[role="button"],input,select):focus-visible{
  outline:3px solid var(--accent-ink);outline-offset:3px}
.sim-lab :is(.ecg-btn,.jvp-btn,.marcha-btn,.acv-reset,.ausc-play){min-height:44px;line-height:1.4}
.sim-lab :is(.ecg-btn,.jvp-btn,.marcha-btn).on{background:var(--accent-ink);border-color:var(--accent-ink);color:var(--surface)}
.sim-lab :is(.ix,.ixcard,.infop,.spiro-grid,.acv-col){min-width:0;max-width:100%}
.sim-lab .ixcard>svg{max-width:100%;height:auto}
.sim-lab .pbody{font:400 var(--fs-card)/1.65 var(--sans)}
.sim-lab .pmeta{font-size:var(--fs-meta);letter-spacing:0;text-transform:none}
.sim-lab .sim-dropdown-item{padding:0}
.sim-lab .sim-dropdown-item button{display:block;width:100%;min-height:44px;text-align:left;white-space:normal;padding:12px 14px;background:var(--surface);color:var(--ink);border:0}
.sim-lab .sim-dropdown-item button:is(:hover,.sim-suggested){background:var(--accent-soft);color:var(--accent-ink)}
.sim-lab .sim-patient-card,.sim-lab .game-step{box-shadow:none}
.sim-lab .sim-vitals-row p{font:400 var(--fs-card)/1.6 var(--sans);color:var(--muted);margin:0}
.sim-lab .sim-case-note{font:400 var(--fs-meta)/1.6 var(--sans);color:var(--muted);margin:16px 0}
.sim-lab :is(.btn-pri,.sim-progress-fill){background:var(--accent-ink)}
.sim-lab .game-step>.num,.sim-lab .game-step label>.num{background:var(--accent-ink)!important;color:var(--surface)}
.sim-lab .ginput{font-size:16px;min-height:44px}
.sim-lab :is(input[type="range"],input[type="checkbox"]){accent-color:var(--accent-ink)}
.sim-lab .scacor-viz,.sim-lab .scaanat-viz{min-width:0;max-width:100%}
.sim-lab :is(.scacor-viz,.scaanat-viz)>svg{max-width:100%;height:auto}
.sim-lab .infop{justify-content:flex-start}
.sim-lab:fullscreen{background:var(--bg);padding:24px;overflow:auto;width:100%;height:100%;box-sizing:border-box}
.sim-lab:fullscreen::backdrop{background:var(--bg)}
.sim-lab:fullscreen .sim-toolbar{position:sticky;top:-24px;background:var(--bg);z-index:5}
.sim-lab:fullscreen .sim-toolbar strong{font-size:var(--fs-h3)}
.sim-live{font:400 var(--fs-meta)/1.5 var(--sans);color:var(--muted);margin:10px 0}

/* Estos dos laboratorios necesitan el ancho que la ficha reserva al índice. */
.view:has(.hidro[data-mapa]){max-width:1480px}
.view:has(.hidro[data-mapa]) .ficha-layout{grid-template-columns:minmax(0,1fr)}
.view:has(.hidro[data-mapa]) .ficha-content{max-width:none}
.view:has(.hidro[data-mapa]) .ficha-toc{display:none}
.hidro.sim-lab .mando{display:grid;gap:12px;margin-bottom:16px}
.sim-state-label{display:none;font:400 var(--fs-meta)/1.5 var(--sans);color:var(--muted)}
.sim-state-label select{width:100%;min-height:44px;background:var(--surface);color:var(--ink);font:600 var(--fs-meta) var(--sans);
  border:1px solid var(--line-strong);border-radius:var(--r-sm);padding:10px;margin-top:4px}
.hidro.sim-lab .paso{box-shadow:none;border-radius:var(--r-sm);gap:4px}
.hidro.sim-lab .paso button{min-height:44px;white-space:normal;text-align:left;border-radius:var(--r-xs)}
.hidro.sim-lab .paso button .n{display:none}
.hidro.sim-lab .mani button,.hidro.sim-lab .chips button{min-height:44px;border-radius:var(--r-sm);box-shadow:none}
.hidro.sim-lab .mani button{color:var(--ink)}
.hidro.sim-lab :is(.mani,.chips) button[aria-pressed="true"]{color:var(--surface);background:var(--ink);border-color:var(--ink)}
.hidro.sim-lab .cols{gap:20px}
.hidro.sim-lab .lienzo{box-shadow:none;padding:16px;min-width:0}
.hidro.sim-lab .lienzo>svg{display:block;width:100%;height:auto}
.sim-diagram-viewport{max-width:100%;overflow:auto;overscroll-behavior:contain}
.sim-diagram-viewport>svg{display:block;width:100%;height:auto}
.sim-diagram-viewport.sim-zoomed{max-height:70vh}
.sim-diagram-viewport.sim-zoomed>svg{min-width:900px;width:150%;max-width:none}
.sim-zoom{margin-bottom:12px;font-size:12px}
.sim-diagram-viewport:focus-visible{outline:3px solid var(--accent-ink);outline-offset:2px}
.hidro.sim-lab .panel{box-shadow:none;padding:20px;min-width:0}
.hidro.sim-lab .panel .tag{display:none}
.hidro.sim-lab .panel h2{font-size:var(--fs-h3);line-height:1.3;border:0;padding:0}
.hidro.sim-lab .panel .lead{font:400 var(--fs-card)/1.6 var(--sans)}
.hidro.sim-lab .prosa{font:400 var(--fs-card)/1.65 var(--sans)}
.hidro.sim-lab .numeros{gap:0;border-block:1px solid var(--line);padding-block:12px}
.hidro.sim-lab .num{border:0;border-radius:0;background:transparent;padding:8px}
.hidro.sim-lab .num+.num{border-left:1px solid var(--line)}
.hidro.sim-lab .num .k,.hidro.sim-lab .num .u{font-size:12px;letter-spacing:0;text-transform:none}
.hidro.sim-lab .num .v{font:600 21px/1.5 var(--mono);color:var(--ink)}
.hidro.sim-lab .num.alto .v{color:var(--crit-ink)}
.hidro.sim-lab h3.sec{font-size:var(--fs-card);text-transform:none;letter-spacing:0}
.hidro.sim-lab .detalle{border:0;border-top:1px solid var(--line);border-radius:0;
  background:transparent;padding:16px 0 0;font:400 var(--fs-card)/1.65 var(--sans)}
.hidro.sim-lab .detalle h4{font-size:var(--fs-body)}
.hidro.sim-lab .detalle .via{font-size:var(--fs-meta);color:var(--accent-ink)}
.hidro.sim-lab .leyenda{line-height:1.6;padding-top:16px;gap:8px 16px}
.hidro.sim-lab .pin{cursor:pointer}
.hidro.sim-lab .pin .pin-hit{fill:transparent;stroke:none}
.hidro.sim-lab .pin:focus-visible circle:not(.pin-hit){stroke:var(--ink);stroke-width:3}
.hidro.sim-lab .tubo.via{filter:none;stroke-dasharray:12 3}
.hidro.sim-lab .rot-org{fill:var(--ink)}
.hidro[data-mapa="htp"] .rot-org{font-size:16px}
.hidro[data-mapa="htp"] .rot-vaso{font-size:13px}
.hidro .anatomy-detail{fill:none;stroke:var(--h-borde);stroke-width:2;stroke-linecap:round;pointer-events:none}
.hidro .portal-fibrosis{fill:none;stroke:var(--h-mio-borde);stroke-width:2;pointer-events:none}
@container (min-width:760px){
  .hidro[data-mapa="ic"] .cols{grid-template-columns:minmax(0,1.2fr) minmax(320px,1fr)}
  .hidro[data-mapa="ic"] .lienzo{position:sticky;top:78px}
  .hidro[data-mapa="htp"] .cols{grid-template-columns:minmax(0,1fr)}
  .hidro[data-mapa="htp"] .panel{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px 24px}
  .hidro[data-mapa="htp"] .panel>:is(h2,.lead,.numeros,.cite,.aviso){grid-column:1/-1}
  .hidro[data-mapa="htp"] .panel .prosa{grid-column:1;grid-row:4/8}
  .hidro[data-mapa="htp"] .panel>:is(.sec,.chips,.sim-detail){grid-column:2}
}
@container (min-width:1000px){
  .hidro[data-mapa="htp"] .cols{grid-template-columns:minmax(0,1.8fr) minmax(300px,1fr)}
  .hidro[data-mapa="htp"] .panel{display:block}
  .hidro[data-mapa="htp"] .lienzo{position:sticky;top:78px}
}

/* Aire, no líquido: el pulmón cambia de contorno, con vía aérea visible. */
#spiro .spiro-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
#spiro .spiro-card{min-width:0;max-width:none;box-shadow:none}
#spiro .spiro-lung{grid-column:1/-1;display:block}
#spiro .spiro-lg{display:flex;flex-direction:row;justify-content:center;gap:24px}
#spiro .spiro-lg svg{width:180px;flex-shrink:0}
#spiro .spiro-cap{font:400 var(--fs-meta)/1.5 var(--sans)}
.sim-legend{display:flex;flex-wrap:wrap;gap:10px 24px;margin:12px 0;color:var(--muted);font:400 var(--fs-meta)/1.5 var(--sans)}
.sim-legend span::before{content:"";display:inline-block;width:24px;border-top:2px solid var(--ink);vertical-align:middle;margin-right:7px}
.sim-legend .chosen::before{border-color:var(--spiro-color,var(--ink))}
.sim-legend .reference::before{border-top-style:dashed;border-color:var(--muted)}
.sim-legend .post::before{border-top-style:dashed;border-color:var(--accent-ink)}
.sim-audio-tools{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin:16px 0;font-family:var(--sans)}
.sim-volume{display:flex;align-items:center;gap:8px;font-size:var(--fs-meta);color:var(--muted)}
.sim-volume input{width:110px;accent-color:var(--accent-ink)}
.sim-practice{flex-basis:100%;padding:16px 0;border-block:1px solid var(--line)}
.sim-practice[hidden]{display:none}
.sim-practice p{font:400 var(--fs-card)/1.6 var(--sans);margin:0 0 12px}
.sim-answers{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
.sim-answers button[aria-pressed="true"]{background:var(--accent-soft);border-color:var(--accent-ink)}
.sim-feedback{color:var(--ink)}
.sim-blind :is(.chs-selector,.ausc-btn,.chs-heartcard,#chsDiagram,#chsInfo,#auscInfo){display:none!important}
.sim-blind .jvp-selector:has(.ausc-btn){display:none}
.sim-lab .ausc-play{background:var(--accent-ink);color:var(--surface);padding:10px 20px;border-radius:var(--r-sm)}
.sim-lab .ausc-wave{height:72px;border-radius:var(--r-sm)}
.sim-lab .lung-pt circle{r:14}
.sim-lab :is(.lung-pt,.foco) text{font-family:var(--mono)}
.sim-lab .lung-side{fill:var(--muted);font:600 12px var(--sans)}
.sim-lab .lung-field{fill:var(--accent-soft);stroke:var(--line-strong);stroke-width:1.2}
.sim-lab .hs-cham path{fill:var(--accent-soft);stroke:var(--line-strong);stroke-width:1.6}
.sim-lab .hs-clbl text{fill:var(--muted)}
.sim-lab .bronchial-tree{fill:none;stroke:var(--line-strong);stroke-width:2;stroke-linecap:round}
.sim-lab .acv-card,.sim-lab .acv-panel{box-shadow:none}
.sim-lab .acv-svg{max-width:100%;height:auto}
.sim-lab .marcha3d-stage{min-height:360px}
.sim-lab .marcha3d-controls{flex-wrap:wrap}
.sim-lab .m3d-ctl{min-height:44px}
.sim-lab .sim-volume select{min-height:44px;background:var(--surface);color:var(--ink);
  border:1px solid var(--line-strong);border-radius:var(--r-xs);padding:6px}
.snc-control button,.snc-corte-panel button{min-height:44px}
.snc-control :is(button,summary,[role="button"],input):focus-visible,
.snc-corte-panel :is(button,summary,[role="button"],input):focus-visible{outline:3px solid var(--accent-ink);outline-offset:3px}
.snc-control .snc-ficha{font-size:var(--fs-card);line-height:1.6}
.snc-canon summary{padding-block:10px}
.sim-lab .ecg-paper-scroll{max-width:100%;overflow-x:auto;overscroll-behavior-x:contain}
.sim-lab .ecg-paper-scroll>svg{min-width:600px;display:block}
.sim-lab .ecg-paper-scroll:focus-visible{outline:3px solid var(--accent-ink)}
@media(max-width:640px){
  .sim-toolbar{align-items:center;flex-wrap:wrap;margin-bottom:8px;padding:8px 0}
  .sim-toolbar p{display:none}
  .sim-toolbar .sim-actions{width:auto}
  .sim-actions{width:100%}
  .sim-action{flex:1}
  .hidro[data-mapa] .paso{display:none}
  .sim-state-label{display:block}
  .hidro.sim-lab .mani{flex-wrap:nowrap;overflow-x:auto;max-width:100%;padding-bottom:4px}
  .hidro.sim-lab .mani button{flex:0 0 auto;max-width:200px}
  .hidro.sim-lab .sim-live{margin:0;font-size:12px}
  .hidro.sim-lab .lienzo{padding:6px}
  .hidro.sim-lab .panel{padding:16px}
  .hidro.sim-lab .num .v{font-size:18px}
  #spiro .spiro-grid{grid-template-columns:1fr}
  .sim-lab .ix>div{min-width:0!important;max-width:100%;flex-basis:100%!important}
  .sim-lab .ixcard{text-align:center}
  .sim-lab .ixcard>svg{margin-inline:auto}
  .sim-lab .chs-heartcard{display:flex;align-items:center;justify-content:center;gap:16px}
  .sim-lab:fullscreen{padding:16px}
  .sim-lab:fullscreen .sim-toolbar{top:-16px}
}
@media(prefers-reduced-motion:reduce){
  .sim-lab *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}