/* Paciente Virtual · dirección artística "Turno de noche" */

:root {
  --bg: #070b0e;
  --s0: #0d1418;
  --s1: #121b21;
  --s2: #18242c;
  --s3: #1f2e37;
  --line: rgba(255, 255, 255, 0.07);
  --line-2: rgba(255, 255, 255, 0.13);
  --ink: #edf2f5;
  --ink-2: #b8c5cd;
  --muted: #7d8f9a;
  --accent: #2ee6a8;
  --accent-soft: rgba(46, 230, 168, 0.13);
  --accent-line: rgba(46, 230, 168, 0.38);
  --warm: #ffcf8a;
  --warm-soft: rgba(255, 207, 138, 0.12);
  --info: #7cbcff;
  --warn: #f2b53c;
  --danger: #ff6b6b;
  --danger-soft: rgba(255, 107, 107, 0.13);
  --present: #2ee6a8;
  --unknown: #f2b53c;
  --r: 14px;
  --r-sm: 9px;
  --shadow: 0 2px 4px rgba(0,0,0,.45), 0 18px 48px rgba(0,0,0,.5);
  --display: "Sora", "Inter", system-ui, sans-serif;
  --font: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
  --ease: cubic-bezier(.2,.8,.2,1);
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { color-scheme: dark; }
body {
  margin: 0; font-family: var(--font); font-size: 15px; line-height: 1.55; color: var(--ink);
  background: var(--bg); -webkit-font-smoothing: antialiased; overflow-x: hidden;
}
h1, h2, h3 { margin: 0; line-height: 1.15; letter-spacing: -0.02em; }
.display { font-family: var(--display); font-weight: 700; }
h1 { font-size: clamp(1.7rem, 3.4vw, 2.6rem); }
h2 { font-size: 1rem; font-weight: 600; }
h3 { font-family: var(--display); font-size: .7rem; font-weight: 600; text-transform: uppercase; letter-spacing: .12em; color: var(--muted); margin: 1.1rem 0 .45rem; display: flex; align-items: center; gap: .5rem; }
p { margin: 0 0 .5rem; }
.muted { color: var(--muted); }
.small { font-size: .84rem; }
.center { text-align: center; margin-inline: auto; }
ul.plain { margin: 0; padding-left: 1.1rem; color: var(--ink-2); }
ul.plain li { margin-bottom: .3rem; }
.eyebrow { font-family: var(--display); font-size: .72rem; font-weight: 600; text-transform: uppercase; letter-spacing: .18em; color: var(--accent); margin-bottom: .55rem; }
.lead { max-width: 56ch; color: var(--ink-2); font-size: 1.04rem; }
.section-title { font-family: var(--display); font-size: 1.05rem; font-weight: 600; margin: 2rem 0 .8rem; display: flex; align-items: center; gap: .7rem; }
.section-title::after { content: ""; flex: 1; height: 1px; background: var(--line-2); }
.section-title.danger { color: var(--danger); }
.skip { position: absolute; left: -999px; top: 0; background: var(--accent); color: #05231a; padding: .5rem 1rem; z-index: 99; font-weight: 600; }
.skip:focus { left: 0; }

/* ---------- Topbar ---------- */
.topbar {
  position: sticky; top: 0; z-index: 40; display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  padding: .55rem 1.1rem; background: rgba(7, 11, 14, .78); backdrop-filter: blur(12px); border-bottom: 1px solid var(--line);
}
.brand { display: flex; align-items: center; gap: .55rem; font: inherit; font-size: .95rem; color: var(--ink-2); background: none; border: 0; cursor: pointer; padding: 0; }
.brand strong { color: var(--ink); font-weight: 700; }
.brand-mark { width: 9px; height: 9px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 4px var(--accent-soft), 0 0 14px var(--accent); }
.topbar-center { flex: 1; text-align: center; font-family: var(--display); font-size: .82rem; font-weight: 600; color: var(--ink-2); letter-spacing: .02em; }
.notice { margin: 0; font-size: .72rem; color: var(--warm); white-space: nowrap; opacity: .9; }
@media (max-width: 640px) { .notice { display: none; } }
.admin-link { font-family: var(--display); font-size: .75rem; font-weight: 600; text-transform: uppercase; letter-spacing: .1em; color: var(--warm); background: var(--warm-soft); padding: .3rem .75rem; border-radius: 99px; text-decoration: none; }
.admin-link:hover { background: rgba(255, 207, 138, .2); }

/* ---------- Botones ---------- */
.btn {
  font: inherit; font-family: var(--display); font-size: .88rem; font-weight: 600; padding: .6rem 1.15rem; border-radius: 999px;
  border: 1px solid var(--line-2); background: var(--s2); color: var(--ink); cursor: pointer;
  transition: transform .12s var(--ease), background .15s, border-color .15s, box-shadow .2s;
}
.btn:hover:not(:disabled) { border-color: var(--accent-line); transform: translateY(-1px); }
.btn:active:not(:disabled) { transform: scale(.98); }
.btn:disabled { opacity: .4; cursor: not-allowed; }
.btn.primary { background: var(--accent); color: #05231a; border-color: var(--accent); box-shadow: 0 0 0 0 rgba(46,230,168,0); }
.btn.primary:hover:not(:disabled) { box-shadow: 0 6px 24px rgba(46,230,168,.28); }
.btn.resolve { background: var(--warm); color: #2b1a00; border-color: var(--warm); }
.btn.resolve:hover:not(:disabled) { box-shadow: 0 6px 24px rgba(255,207,138,.3); }
.btn.xl { font-size: 1rem; padding: .85rem 1.6rem; }
.icon-btn { font: inherit; background: var(--s2); border: 1px solid var(--line-2); color: var(--ink-2); width: 34px; height: 34px; border-radius: 50%; cursor: pointer; }
button:focus-visible, textarea:focus-visible, input:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

/* ---------- Escena (SVG compartido) ---------- */
.stage-scene, .home-stage { --top: url(#g-polo); --hair: url(#g-hair); --hair-edge: #7c8187; }
[data-age="young"] { --hair: url(#g-hair-dark); --hair-edge: #3a2c27; }
[data-variant="b"] { --top: url(#g-top-b); }
[data-variant="c"] { --top: url(#g-top-c); }
[data-pose="leaning_forward"] #patient { transform: translateY(10px) scaleY(.97); transform-origin: 50% 100%; }
.scene { display: block; width: 100%; height: 100%; }
.mon-off { font: 500 10px var(--mono); fill: #3f5a53; letter-spacing: .16em; }
.mon-label { font: 500 9px var(--mono); fill: #4d7a6d; letter-spacing: .16em; }
.mon-value { font: 600 20px var(--mono); fill: var(--accent); }
.mon-value.spo2 { fill: var(--info); }
.mon-value.bp { fill: var(--warn); font-size: 15px; }
.mon-value.temp { fill: #dfe9ee; font-size: 15px; }
.trace { fill: none; stroke: var(--accent); stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
@media (prefers-reduced-motion: no-preference) {
  .trace { stroke-dasharray: 360; stroke-dashoffset: 360; animation: draw 2.2s linear infinite; }
  @keyframes draw { to { stroke-dashoffset: 0; } }
  #sweat path { animation: drip 3.2s ease-in-out infinite; transform-box: fill-box; transform-origin: center top; }
  #sweat path:nth-child(2) { animation-delay: 1.1s; }
  #sweat path:nth-child(3) { animation-delay: 2s; }
  @keyframes drip { 0%, 66% { transform: translateY(0); opacity: .9; } 100% { transform: translateY(14px); opacity: 0; } }
  #patient { animation: breathe 4.2s ease-in-out infinite; transform-box: fill-box; transform-origin: 50% 100%; }
  @keyframes breathe { 0%, 100% { transform: scaleY(1); } 50% { transform: scaleY(1.008); } }
}

/* ---------- Portada ---------- */
.home { position: relative; min-height: calc(100vh - 52px); }
.home-stage { position: absolute; inset: 0; z-index: 0; overflow: hidden; }
.home-stage .scene { height: 100%; opacity: .55; filter: saturate(.9); }
.home-stage::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(7,11,14,.96) 0%, rgba(7,11,14,.86) 42%, rgba(7,11,14,.35) 100%), linear-gradient(180deg, rgba(7,11,14,.2) 0%, rgba(7,11,14,0) 40%, rgba(7,11,14,1) 100%); }
.home-content { position: relative; z-index: 1; max-width: 1200px; margin: 0 auto; padding: clamp(3rem, 9vh, 7rem) 1.5rem 2rem; }
.home-content .display { font-size: clamp(2.4rem, 6vw, 4.4rem); letter-spacing: -0.03em; line-height: 1; margin-bottom: 1rem; }
.record { display: flex; gap: .5rem; flex-wrap: wrap; margin: 1.2rem 0 1.6rem; }
.record span { font-size: .8rem; color: var(--ink-2); background: rgba(18,27,33,.8); border: 1px solid var(--line-2); border-radius: 999px; padding: .32rem .85rem; backdrop-filter: blur(6px); }
.record b { color: var(--accent); font-weight: 600; }
.record .star { color: var(--warn); }

.shift { position: relative; z-index: 1; max-width: 1200px; margin: 0 auto; padding: 1rem 1.5rem 3rem; }
.shift-title { font-family: var(--display); font-size: .78rem; text-transform: uppercase; letter-spacing: .16em; color: var(--muted); margin-bottom: 1rem; }
.shift-map { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1rem; }
.shift-node { position: relative; background: rgba(18,27,33,.86); border: 1px solid var(--line-2); border-radius: var(--r); padding: 1.1rem 1.2rem 1.2rem; backdrop-filter: blur(10px); box-shadow: var(--shadow); display: flex; flex-direction: column; gap: .5rem; transition: transform .2s var(--ease), border-color .2s; }
.shift-node.playable:hover { transform: translateY(-3px); border-color: var(--accent-line); }
.shift-node .num { font-family: var(--mono); font-size: .72rem; color: var(--muted); letter-spacing: .1em; }
.shift-node h2 { font-family: var(--display); font-size: 1.15rem; font-weight: 600; }
.shift-node .meta { display: flex; gap: .4rem; flex-wrap: wrap; }
.shift-node .best { font-size: .82rem; color: var(--warn); letter-spacing: .1em; }
.shift-node .best.none { color: var(--muted); letter-spacing: 0; }
.shift-node .btn { align-self: flex-start; margin-top: .3rem; }
.shift-node.locked { opacity: .55; }
.shift-node.locked h2 { color: var(--muted); }
.shift-node .lock { font-size: .8rem; color: var(--muted); }
.pill { display: inline-flex; align-items: center; font-family: var(--display); font-size: .66rem; font-weight: 600; padding: .16rem .6rem; border-radius: 999px; background: var(--accent-soft); color: var(--accent); border: 1px solid var(--accent-line); letter-spacing: .04em; text-transform: uppercase; }
.pill.ghost { background: transparent; border-color: var(--line-2); color: var(--muted); }
.pill.warn { background: rgba(242,181,60,.12); border-color: rgba(242,181,60,.4); color: var(--warn); }

/* ---------- Consulta: escenario ---------- */
.case { max-width: 1280px; margin: 0 auto; padding: 0 0 1rem; }
.stage { position: relative; aspect-ratio: 16 / 9; width: min(100%, calc(70vh * 16 / 9)); min-height: 240px; margin: 0 auto; overflow: hidden; background: #0f171d; border-bottom: 1px solid var(--line); }
@media (min-width: 900px) { .stage { border-radius: 0 0 var(--r) var(--r); } }
.stage-scene { position: absolute; inset: 0; }
.stage-scene .scene { height: 100%; }
.stage-vignette { position: absolute; inset: 0; pointer-events: none; background: radial-gradient(120% 90% at 50% 40%, rgba(0,0,0,0) 45%, rgba(7,11,14,.55) 100%), linear-gradient(180deg, rgba(7,11,14,.55) 0%, rgba(7,11,14,0) 22%, rgba(7,11,14,0) 70%, rgba(7,11,14,.7) 100%); }
.stage.phase-flash::before { content: ""; position: absolute; inset: 0; z-index: 5; background: var(--accent); opacity: 0; animation: flash .6s ease-out; pointer-events: none; }
@keyframes flash { 0% { opacity: .18; } 100% { opacity: 0; } }

.stage-top { position: absolute; left: 0; right: 0; top: 0; z-index: 3; display: flex; justify-content: space-between; align-items: flex-start; gap: .75rem; padding: .9rem 1rem; pointer-events: none; }
.objective { max-width: 380px; background: rgba(7,11,14,.72); border: 1px solid var(--line-2); border-radius: var(--r-sm); padding: .6rem .85rem; backdrop-filter: blur(8px); display: flex; flex-direction: column; gap: .25rem; pointer-events: auto; }
.objective-kicker { font-family: var(--display); font-size: .62rem; text-transform: uppercase; letter-spacing: .18em; color: var(--accent); }
.objective strong { font-family: var(--display); font-weight: 600; font-size: .92rem; line-height: 1.3; }
.objective-progress { height: 4px; background: var(--line-2); border-radius: 2px; overflow: hidden; margin-top: .2rem; }
.objective-progress span { display: block; height: 100%; width: 0; background: var(--accent); border-radius: 2px; transition: width .5s var(--ease); }
.objective-count { font-family: var(--mono); font-size: .68rem; color: var(--muted); }
.hud { display: flex; gap: .4rem; pointer-events: auto; }
.hud-stat { display: flex; flex-direction: column; align-items: flex-end; min-width: 64px; background: rgba(7,11,14,.72); border: 1px solid var(--line-2); border-radius: var(--r-sm); padding: .3rem .65rem; backdrop-filter: blur(8px); }
.hud-stat .k { font-family: var(--display); font-size: .58rem; text-transform: uppercase; letter-spacing: .16em; color: var(--muted); }
.hud-stat .v { font-family: var(--mono); font-size: .95rem; font-weight: 600; color: var(--ink); font-variant-numeric: tabular-nums; }
.hud-stat.over .v { color: var(--warn); }
@media (prefers-reduced-motion: no-preference) {
  .hud-stat.pulse { animation: pop .5s var(--ease); }
  .hud-stat.pulse .v { color: var(--accent); }
  @keyframes pop { 0% { transform: scale(1); } 35% { transform: scale(1.12); } 100% { transform: scale(1); } }
}
@media (max-width: 640px) { .objective strong { font-size: .8rem; } .objective { max-width: 60%; } }

/* bocadillo */
.bubble-layer { position: absolute; z-index: 4; left: 50%; top: 9%; transform: translateX(-50%); width: min(560px, 92%); pointer-events: none; display: flex; justify-content: center; }
.bubble { position: relative; background: rgba(14,20,24,.92); border: 1px solid var(--line-2); border-radius: 16px; padding: .75rem 1rem .8rem; backdrop-filter: blur(10px); box-shadow: var(--shadow); max-width: 100%; pointer-events: auto; }
.bubble::after { content: ""; position: absolute; left: 50%; bottom: -9px; width: 16px; height: 16px; background: rgba(14,20,24,.92); border-right: 1px solid var(--line-2); border-bottom: 1px solid var(--line-2); transform: translateX(-50%) rotate(45deg); }
.bubble.system { background: rgba(7,11,14,.6); text-align: center; color: var(--ink-2); font-size: .88rem; }
.bubble.system::after { display: none; }
.bubble .who { display: block; font-family: var(--display); font-size: .62rem; font-weight: 600; text-transform: uppercase; letter-spacing: .16em; color: var(--warm); margin-bottom: .3rem; }
.bubble .you { color: var(--muted); font-size: .84rem; font-style: italic; margin-bottom: .35rem; }
.bubble .facts { margin: 0; max-height: 40vh; overflow-y: auto; }
.bubble .facts li { border: none; padding: .22rem 0 .22rem 1.5rem; font-size: .9rem; }
@media (prefers-reduced-motion: no-preference) {
  .bubble { animation: bubble-in .35s var(--ease); }
  @keyframes bubble-in { from { opacity: 0; transform: translateY(10px) scale(.97); } to { opacity: 1; transform: none; } }
  .bubble .facts li { animation: fact-in .35s var(--ease) both; }
  .bubble .facts li:nth-child(2) { animation-delay: .08s; } .bubble .facts li:nth-child(3) { animation-delay: .16s; }
  .bubble .facts li:nth-child(4) { animation-delay: .24s; } .bubble .facts li:nth-child(5) { animation-delay: .32s; }
  @keyframes fact-in { from { opacity: 0; transform: translateX(-6px); } to { opacity: 1; transform: none; } }
}
@media (max-width: 640px) { .bubble-layer { top: 6%; } .bubble { padding: .55rem .75rem; } .bubble .facts li { font-size: .8rem; } }

/* puntos calientes */
.hotspots { position: absolute; inset: 0; z-index: 3; }
.hotspot {
  position: absolute; transform: translate(-50%, -50%); width: 46px; height: 46px; border-radius: 50%; cursor: pointer;
  background: rgba(46,230,168,.14); border: 2px solid var(--accent); color: var(--accent); font: inherit; display: grid; place-items: center;
  box-shadow: 0 0 0 0 rgba(46,230,168,.5); transition: transform .15s var(--ease), background .15s;
}
.hotspot::after { content: attr(data-label); opacity: 0; transition: opacity .15s; position: absolute; top: calc(100% + 6px); left: 50%; transform: translateX(-50%); white-space: nowrap; font-family: var(--display); font-size: .66rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--ink); background: rgba(7,11,14,.8); padding: .18rem .5rem; border-radius: 4px; border: 1px solid var(--line-2); }
.hotspot:hover, .hotspot:focus-visible { transform: translate(-50%, -50%) scale(1.1); background: rgba(46,230,168,.3); z-index: 2; }
.hotspot:hover::after, .hotspot:focus-visible::after { opacity: 1; }
.hotspot.done { border-color: var(--line-2); color: var(--muted); background: rgba(7,11,14,.6); box-shadow: none; animation: none; }
.hotspot.done::before { content: "✓"; font-size: .9rem; }
.hotspot:not(.done)::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--accent); }
@media (prefers-reduced-motion: no-preference) {
  .hotspot:not(.done) { animation: ping 2.4s ease-out infinite; }
  @keyframes ping { 0% { box-shadow: 0 0 0 0 rgba(46,230,168,.5); } 70% { box-shadow: 0 0 0 16px rgba(46,230,168,0); } 100% { box-shadow: 0 0 0 0 rgba(46,230,168,0); } }
}
@media (max-width: 640px) {
  .hotspot { width: 36px; height: 36px; }
  .hotspot::after { display: none; }
  .stage { aspect-ratio: 4 / 3; width: 100%; }
  .toasts { top: auto; bottom: 5.5rem; }
  .topbar-center { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
}

.stage-bottom { position: absolute; left: 0; right: 0; bottom: 0; z-index: 3; display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; padding: 1rem; pointer-events: none; }
.caption { display: flex; flex-direction: column; text-shadow: 0 2px 8px rgba(0,0,0,.8); pointer-events: auto; }
.caption strong { font-family: var(--display); font-size: 1.1rem; }
.caption span { font-size: .8rem; color: var(--warm); }
.drawer-toggle { pointer-events: auto; display: flex; align-items: center; gap: .5rem; font: inherit; font-family: var(--display); font-size: .82rem; font-weight: 600; color: var(--ink); background: rgba(7,11,14,.75); border: 1px solid var(--line-2); border-radius: 999px; padding: .5rem .95rem; backdrop-filter: blur(8px); cursor: pointer; transition: border-color .15s, transform .15s var(--ease); }
.drawer-toggle:hover { border-color: var(--accent-line); }
.drawer-toggle .badge { font-family: var(--mono); font-size: .72rem; background: var(--accent); color: #05231a; border-radius: 999px; min-width: 1.4rem; padding: .05rem .4rem; text-align: center; }
@media (prefers-reduced-motion: no-preference) {
  .drawer-toggle.bump { animation: bump .45s var(--ease); }
  @keyframes bump { 30% { transform: scale(1.08); } }
}

/* ---------- Consulta: deck ---------- */
.deck { position: relative; z-index: 2; padding: .9rem 1rem 0; }
.deck-head { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; margin-bottom: .75rem; }
.steps { list-style: none; display: flex; gap: .25rem; margin: 0; padding: 0; flex-wrap: wrap; }
.steps li { font-family: var(--display); font-size: .68rem; font-weight: 600; letter-spacing: .04em; padding: .22rem .6rem; border-radius: 6px; color: var(--muted); border: 1px solid transparent; }
.steps li.done { color: var(--ink-2); }
.steps li.done::before { content: "✓ "; color: var(--accent); }
.steps li[aria-current="step"] { color: var(--accent); background: var(--accent-soft); border-color: var(--accent-line); }
.deck-hint { font-size: .82rem; color: var(--muted); }
.deck-body { min-height: 96px; }
.deck-actions { display: flex; justify-content: flex-end; gap: .6rem; padding: .9rem 0 .4rem; }

.chips { display: flex; flex-wrap: wrap; gap: .45rem; }
.chip { font: inherit; font-size: .86rem; font-weight: 500; padding: .5rem .95rem; border-radius: 999px; border: 1px solid var(--line-2); background: var(--s1); color: var(--ink-2); cursor: pointer; transition: all .15s var(--ease); }
.chip:hover:not(:disabled) { background: var(--accent-soft); border-color: var(--accent-line); color: var(--accent); transform: translateY(-1px); }
.chip:disabled { opacity: .4; cursor: not-allowed; }
.chip.asked { border-style: dashed; color: var(--muted); background: transparent; }
.chip.asked::after { content: " ✓"; color: var(--accent); }
/* Anamnesis por preguntas del caso (ADR 0028): grupos desplegables compactos. */
.hq { display: flex; flex-direction: column; gap: .35rem; }
.hq-group { border: 1px solid var(--line-2); border-radius: 12px; background: var(--s1); }
.hq-group > summary { display: flex; align-items: center; justify-content: space-between; gap: .6rem; padding: .5rem .8rem; cursor: pointer; font-size: .88rem; color: var(--ink-2); list-style: none; }
.hq-group > summary::-webkit-details-marker { display: none; }
.hq-group > summary::before { content: "▸"; color: var(--muted); transition: transform .15s var(--ease); }
.hq-group[open] > summary::before { transform: rotate(90deg); }
.hq-group > summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 12px; }
.hq-title { flex: 1; font-weight: 600; }
.hq-count { font-family: var(--mono); font-size: .72rem; color: var(--muted); }
.hq-list { padding: 0 .7rem .7rem; }
@media (prefers-reduced-motion: reduce) { .hq-group > summary::before { transition: none; } }
/* Paciente dinámico (ADR 0029/0030): cuatro bloques sobrios, sin animaciones. */
.dyn { display: flex; flex-direction: column; gap: .75rem; margin-bottom: .9rem; padding: .8rem .9rem; border: 1px solid var(--line-2); border-radius: 12px; background: var(--s1); }
.dyn h4 { margin: 0 0 .4rem; font-size: .82rem; font-weight: 600; color: var(--ink-2); }
.dyn small { color: var(--muted); font-family: var(--mono); font-size: .68rem; }
.dyn-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .4rem; }
.dyn-clock { font-family: var(--mono); font-size: .8rem; color: var(--ink-2); }
.dyn-clock b { font-size: 1.15rem; color: var(--ink); }
.dyn-vitals { display: flex; flex-wrap: wrap; gap: .4rem .9rem; font-size: .9rem; color: var(--ink); }
.dyn-vital b { color: var(--muted); font-weight: 600; margin-right: .15rem; }
.dyn-changes { margin: .4rem 0 0; padding-left: 1.1rem; font-size: .85rem; color: var(--ink-2); }
.dyn-actions { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: .4rem; }
.dyn-act { width: 100%; text-align: left; font: inherit; font-size: .86rem; font-weight: 600; padding: .55rem .7rem; border-radius: 8px; border: 1px solid var(--line-2); background: transparent; color: var(--ink); cursor: pointer; }
.dyn-act:hover:not(:disabled) { border-color: var(--accent-line); }
.dyn-act:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.dyn-act.given { border-style: dashed; color: var(--ink-2); }
.dyn-act:disabled { opacity: .6; cursor: not-allowed; }
.dyn-note { display: block; margin-top: .2rem; font-size: .72rem; color: var(--muted); }
.dyn-more { margin-top: .45rem; }
.dyn-more > summary, .dyn-timeline summary { cursor: pointer; font-size: .78rem; color: var(--muted); }
.dyn-more dl { margin: .4rem 0 0; font-size: .8rem; color: var(--ink-2); }
.dyn-more dt { font-weight: 600; color: var(--ink); margin-top: .35rem; }
.dyn-more dd { margin: 0; }
.dyn-reassess { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem; }
.dyn-reassess p { flex-basis: 100%; margin: 0; }
.dyn-ready { color: var(--warm); }
.dyn-timeline ol { margin: 0; padding-left: 1.1rem; font-size: .82rem; color: var(--ink-2); display: grid; gap: .15rem; }
.dyn-timeline details ol { margin-top: .35rem; }
.dyn-timeline li.visible_change, .dyn-tl li.state { color: var(--warm); }
.dyn-scene h3 { margin: .15rem 0 .25rem; font-size: 1.05rem; color: var(--ink); }
.dyn-scene p { margin: 0; font-size: .9rem; color: var(--ink-2); }
.dyn-choices { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: .4rem; }
.dyn-choice { display: flex; align-items: flex-start; gap: .45rem; padding: .5rem .65rem; border: 1px solid var(--line-2); border-radius: 8px; font-size: .86rem; font-weight: 600; color: var(--ink); cursor: pointer; }
.dyn-choice input { margin-top: .15rem; accent-color: var(--accent); }
.dyn-choice:has(input:checked) { border-color: var(--accent); }
.dyn-choice:has(input:focus-visible) { outline: 2px solid var(--accent); outline-offset: 2px; }
.dyn-choice.given { border-style: dashed; color: var(--ink-2); }
.dyn-choice.off { opacity: .6; cursor: not-allowed; }
.dyn-decide .btn { width: 100%; }
.encounter-tools { display: grid; gap: .35rem; }
.encounter-tools h4 { margin: 0 0 .15rem; }
.encounter-tools p { margin: 0 0 .35rem; }
.tool > summary { display: flex; align-items: center; justify-content: space-between; gap: .6rem; padding: .5rem .7rem; border: 1px solid var(--line-2); border-radius: 8px; cursor: pointer; font-size: .88rem; font-weight: 600; color: var(--ink); list-style: none; }
.tool > summary::-webkit-details-marker { display: none; }
.tool > summary::after { content: "+"; font-family: var(--mono); color: var(--muted); }
.tool[open] > summary::after { content: "−"; }
.tool > summary:hover { border-color: var(--accent-line); }
.tool > summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.tool-count { font-family: var(--mono); font-size: .72rem; font-weight: 500; color: var(--muted); }
.tool-body { padding: .5rem .1rem .2rem; }
.dyn-status { border-left: 3px solid var(--line-2); padding: .1rem 0 .1rem .7rem; margin-bottom: .6rem; }
.dyn-status p { margin: 0; font-size: .9rem; color: var(--ink-2); }
.dyn-status-label { font-weight: 700; color: var(--ink); letter-spacing: .01em; }
.dyn-status-label span { font-weight: 600; color: var(--muted); font-size: .8rem; }
.dyn-status.tone-improving { border-left-color: var(--accent); }
.dyn-status.tone-worsening, .dyn-status.tone-critical { border-left-color: var(--warm); }
.dyn-closing p { margin: 0 0 .3rem; font-size: .9rem; color: var(--ink); }
.dyn-debrief { max-width: 940px; margin-top: 1.2rem; }
.dyn-final { margin: 0 0 .8rem; font-weight: 600; color: var(--ink); }
.dyn-tl { margin: 1rem 0 0; padding-left: 1.1rem; display: grid; gap: .25rem; font-size: .85rem; color: var(--ink-2); }
.dyn-debrief-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1rem; }
.dyn-debrief-grid h4 { margin: 0 0 .3rem; font-size: .85rem; }

.anamnesis-help { display: flex; flex-direction: column; align-items: flex-start; gap: .55rem; }
.hint-button { border-color: var(--warn); color: var(--warn); }
.hint-result { display: flex; flex-direction: column; gap: .45rem; }
.hint-areas { display: flex; flex-wrap: wrap; gap: .4rem; }
.hint-areas span { padding: .32rem .65rem; border: 1px solid var(--warn); border-radius: 999px; color: var(--ink-2); background: color-mix(in srgb, var(--warn) 8%, transparent); }
.hint-count { color: var(--muted); }

.tray { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: .55rem; }
.test-card { font: inherit; text-align: left; background: var(--s1); border: 1px solid var(--line-2); border-radius: var(--r-sm); padding: .7rem .85rem; color: var(--ink); cursor: pointer; display: flex; flex-direction: column; gap: .3rem; transition: all .15s var(--ease); }
.test-card:hover:not(:disabled) { border-color: var(--accent-line); transform: translateY(-2px); }
.test-card:disabled { cursor: default; }
.test-card .name { font-weight: 600; font-size: .9rem; }
.test-card .eta { font-family: var(--mono); font-size: .72rem; color: var(--muted); }
.test-card.pending { border-color: var(--warn); }
.test-card.pending .eta { color: var(--warn); }
.test-card.done { opacity: .6; }
.test-card.done .eta::before { content: "✓ "; color: var(--accent); }
.test-card .eta .bar { display: block; height: 3px; background: var(--line-2); border-radius: 2px; margin-top: .35rem; overflow: hidden; }
.test-card .eta .bar span { display: block; height: 100%; width: 0; background: var(--warn); }
@media (prefers-reduced-motion: no-preference) { .test-card.pending .eta .bar span { animation: fill var(--dur, 1.2s) linear forwards; } @keyframes fill { to { width: 100%; } } }

.clockbar { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; margin-top: .75rem; padding: .6rem .9rem; background: var(--s1); border: 1px solid var(--line-2); border-radius: var(--r-sm); }
.clockbar-info { display: flex; align-items: baseline; gap: .6rem; flex-wrap: wrap; }
.clockbar .k { font-family: var(--display); font-size: .62rem; text-transform: uppercase; letter-spacing: .16em; color: var(--muted); }
.clockbar .v { font-family: var(--mono); font-size: 1rem; font-weight: 600; }
.act-now { margin-top: .75rem; }
.act-now > summary { cursor: pointer; font-size: .9rem; color: var(--ink-2); padding: .5rem 0; display: flex; align-items: center; gap: .6rem; }
.act-now .sheet-box { margin-top: .5rem; }
.test-card.done { opacity: .75; }
.test-card.done .eta { color: var(--accent); }
.sheet { display: grid; grid-template-columns: 1fr; gap: .8rem; }
@media (min-width: 900px) { .sheet.two { grid-template-columns: 1fr 1fr; } }
.sheet-box { background: var(--s1); border: 1px solid var(--line-2); border-radius: var(--r); padding: .9rem 1rem; }
.sheet-box h3 { margin-top: 0; }
textarea { width: 100%; font: inherit; font-size: .9rem; padding: .65rem; border: 1px solid var(--line-2); border-radius: var(--r-sm); background: var(--s0); color: var(--ink); resize: vertical; }
textarea::placeholder { color: #55687290; }
.sheet-row { display: flex; gap: .6rem; align-items: center; flex-wrap: wrap; margin-top: .55rem; }
.status { font-size: .82rem; color: var(--accent); min-height: 1.2em; }
.plan-options { display: flex; flex-direction: column; gap: .3rem; }
.plan-option-group { display: flex; flex-direction: column; gap: .3rem; margin-bottom: .55rem; }
.plan-option-group:last-child { margin-bottom: 0; }
.plan-option-group h4 { margin: .25rem 0 .15rem; color: var(--muted); font-family: var(--display); font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; }
.plan-options label { display: flex; gap: .6rem; align-items: flex-start; font-size: .88rem; padding: .5rem .65rem; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--s0); cursor: pointer; color: var(--ink-2); transition: border-color .15s; }
.plan-options label:hover { border-color: var(--line-2); }
.plan-options input { accent-color: var(--accent); margin-top: .2rem; }
.plan-options input:checked + span { color: var(--ink); }
.plan-options label:has(input:checked) { border-color: var(--accent-line); background: var(--accent-soft); }

.brief { display: flex; flex-direction: column; gap: .4rem; background: var(--s1); border: 1px solid var(--line-2); border-radius: var(--r); padding: 1rem 1.1rem; }
.brief p { color: var(--ink-2); }

.talk { display: flex; gap: .5rem; margin-bottom: .75rem; }
.talk input { flex: 1; font: inherit; font-size: .95rem; padding: .62rem .9rem; border-radius: 999px; border: 1px solid var(--line-2); background: var(--s0); color: var(--ink); }
.talk input::placeholder { color: #5c6f7a; }
.talk input:focus { border-color: var(--accent-line); outline: none; box-shadow: 0 0 0 3px var(--accent-soft); }
.bubble .say { margin: 0; font-size: 1rem; line-height: 1.5; }
.bubble .facts.cited { margin-top: .5rem; padding-top: .4rem; border-top: 1px dashed var(--line-2); }
.bubble .facts.cited li { font-size: .8rem; color: var(--muted); padding: .15rem 0 .15rem 1.4rem; }
.bubble .facts.cited li::before { transform: scale(.85); }

/* ---------- Bloc (cajón) ---------- */
.drawer-scrim { position: fixed; inset: 0; background: rgba(0,0,0,.55); z-index: 45; backdrop-filter: blur(2px); }
.drawer { position: fixed; top: 0; right: 0; bottom: 0; width: min(440px, 100%); z-index: 46; background: var(--s0); border-left: 1px solid var(--line-2); box-shadow: var(--shadow); display: flex; flex-direction: column; }
@media (prefers-reduced-motion: no-preference) { .drawer { animation: slide .3s var(--ease); } @keyframes slide { from { transform: translateX(30px); opacity: 0; } to { transform: none; opacity: 1; } } }
.drawer-head { display: flex; justify-content: space-between; align-items: center; padding: .9rem 1.1rem; border-bottom: 1px solid var(--line); }
.drawer-head h2 { font-family: var(--display); }
.drawer-body { padding: .3rem 1.1rem 1.5rem; overflow: auto; }
.triage { color: var(--ink-2); font-size: .92rem; }
.count { font-family: var(--mono); font-size: .66rem; background: var(--s2); color: var(--ink-2); border-radius: 999px; padding: 0 .4rem; }

.facts { list-style: none; padding: 0; margin: 0; font-size: .88rem; }
.facts li { padding: .4rem 0 .4rem 1.6rem; position: relative; border-top: 1px solid var(--line); color: var(--ink-2); }
.facts li:first-child { border-top: none; }
.facts li::before { content: "+"; position: absolute; left: 0; top: .45rem; width: 1.15rem; height: 1.15rem; border-radius: 5px; text-align: center; line-height: 1.15rem; font-weight: 700; font-size: .72rem; color: #05231a; background: var(--present); }
.facts li.absent::before { content: "–"; background: #3d4f59; color: var(--ink); }
.facts li.unknown::before { content: "?"; background: var(--unknown); color: #2a1f03; }
.facts li.empty { color: var(--muted); font-style: italic; padding-left: 0; }
.facts li.empty::before { display: none; }
.facts li.fresh { color: var(--ink); }
.tag { font-family: var(--mono); font-size: .64rem; color: var(--muted); margin-left: .4rem; background: var(--s1); border: 1px solid var(--line); padding: .02rem .3rem; border-radius: 4px; white-space: nowrap; }

/* ---------- Overlay de fase ---------- */
.overlay { position: fixed; inset: 0; z-index: 50; display: grid; place-items: center; padding: 1rem; background: rgba(7,11,14,.82); backdrop-filter: blur(8px); }
.overlay-card { max-width: 520px; width: 100%; text-align: center; background: var(--s1); border: 1px solid var(--line-2); border-radius: 20px; padding: 2rem 1.6rem 1.6rem; box-shadow: var(--shadow); }
.overlay-kicker { font-family: var(--display); font-size: .7rem; text-transform: uppercase; letter-spacing: .2em; color: var(--accent); }
.overlay-card .display { font-size: clamp(1.6rem, 4vw, 2.3rem); margin: .4rem 0 .6rem; }
.overlay-card p { color: var(--ink-2); }
.overlay-facts { list-style: none; margin: .8rem 0 1.2rem; padding: 0; display: flex; flex-direction: column; gap: .35rem; }
.overlay-facts li { font-size: .86rem; color: var(--ink-2); background: var(--s0); border: 1px solid var(--line); border-radius: var(--r-sm); padding: .45rem .7rem; }
.overlay-facts li b { color: var(--accent); font-weight: 600; }
@media (prefers-reduced-motion: no-preference) {
  .overlay-card { animation: rise .4s var(--ease); }
  @keyframes rise { from { opacity: 0; transform: translateY(16px) scale(.98); } to { opacity: 1; transform: none; } }
}

/* ---------- Toasts ---------- */
.toasts { position: fixed; right: 1rem; top: 7.6rem; z-index: 60; display: flex; flex-direction: column; gap: .4rem; align-items: flex-end; pointer-events: none; }
.toast { font-family: var(--mono); font-size: .82rem; font-weight: 600; color: var(--accent); background: rgba(7,11,14,.9); border: 1px solid var(--accent-line); border-radius: 999px; padding: .35rem .8rem; }
.toast.warm { color: var(--warm); border-color: rgba(255,207,138,.4); }
@media (prefers-reduced-motion: no-preference) { .toast { animation: toast 1.6s var(--ease) forwards; } @keyframes toast { 0% { opacity: 0; transform: translateY(6px); } 15% { opacity: 1; transform: none; } 80% { opacity: 1; } 100% { opacity: 0; transform: translateY(-8px); } } }
@media (prefers-reduced-motion: reduce) { .toast { animation: none; } }

.error { position: fixed; left: 50%; bottom: 1rem; transform: translateX(-50%); z-index: 60; color: var(--danger); background: var(--danger-soft); border: 1px solid rgba(255,107,107,.3); padding: .6rem 1rem; border-radius: var(--r-sm); font-weight: 500; max-width: 92%; backdrop-filter: blur(8px); }

/* ---------- Resolución ---------- */
.result { max-width: 1100px; margin: 0 auto; padding: 1.5rem 1.25rem 3rem; }
.result-hero { text-align: center; padding: 1.5rem 1rem 1.75rem; background: radial-gradient(60% 100% at 50% 0%, rgba(255,207,138,.12), transparent 70%); border: 1px solid var(--line-2); border-radius: 20px; box-shadow: var(--shadow); }
.stars { font-size: 2.6rem; letter-spacing: .3rem; color: var(--warn); line-height: 1; margin: .4rem 0 .6rem; }
.stars span { display: inline-block; opacity: 0; }
.stars span.off { color: var(--line-2); }
@media (prefers-reduced-motion: no-preference) {
  .stars span { animation: star .55s var(--ease) forwards; }
  .stars span:nth-child(2) { animation-delay: .25s; } .stars span:nth-child(3) { animation-delay: .5s; }
  @keyframes star { 0% { opacity: 0; transform: scale(.3) rotate(-20deg); } 60% { transform: scale(1.25) rotate(4deg); } 100% { opacity: 1; transform: none; } }
}
@media (prefers-reduced-motion: reduce) { .stars span { opacity: 1; } }
.result-hero .display { font-size: clamp(1.7rem, 4vw, 2.6rem); }
.dials { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: .9rem; margin-top: 1.5rem; text-align: left; }
.dial { background: rgba(13,20,24,.8); border: 1px solid var(--line-2); border-radius: var(--r); padding: .95rem 1rem; }
.dial-label { display: block; font-family: var(--display); font-size: .64rem; text-transform: uppercase; letter-spacing: .14em; color: var(--muted); }
.dial-value { display: block; font-family: var(--mono); font-size: 2.1rem; font-weight: 600; font-variant-numeric: tabular-nums; line-height: 1.2; }
.bar { height: 6px; background: var(--line-2); border-radius: 3px; overflow: hidden; margin-top: .4rem; }
.bar span { display: block; height: 100%; width: 0; background: var(--accent); border-radius: 3px; transition: width 1s var(--ease); }
.bar.safety span { background: var(--info); }
.bar.low span { background: var(--danger); }

.next-goal { margin-top: 1rem; background: var(--warm-soft); border: 1px solid rgba(255,207,138,.35); border-radius: var(--r); padding: 1rem 1.2rem; }
.next-goal .eyebrow { color: var(--warm); }
.next-goal strong { font-family: var(--display); font-size: 1.05rem; display: block; margin-bottom: .3rem; }

.violation { background: var(--danger-soft); border: 1px solid rgba(255,107,107,.28); border-left: 4px solid var(--danger); border-radius: var(--r-sm); padding: .85rem 1rem; margin-bottom: .6rem; }
.violation.major { border-left-color: var(--warn); }
.violation.minor { border-left-color: var(--muted); background: var(--s1); border-color: var(--line-2); }
.violation .sev { font-family: var(--display); font-size: .62rem; font-weight: 600; text-transform: uppercase; letter-spacing: .14em; color: var(--danger); }
.violation.major .sev { color: var(--warn); } .violation.minor .sev { color: var(--muted); }
.violation strong { display: block; margin: .2rem 0; }
.violation p { margin: 0; font-size: .87rem; color: var(--ink-2); }
.violation .rule { font-family: var(--mono); font-size: .66rem; color: var(--muted); }

.achievements { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: .6rem; }
.ach { background: var(--s1); border: 1px solid var(--line-2); border-radius: var(--r-sm); padding: .8rem .9rem; display: flex; gap: .7rem; align-items: flex-start; opacity: 0; }
.ach.earned { border-color: var(--accent-line); background: linear-gradient(135deg, var(--accent-soft), transparent); }
.ach.locked { opacity: .5; }
.ach .icon { font-size: 1.15rem; line-height: 1.3; color: var(--warn); }
.ach.locked .icon { color: var(--muted); }
.ach strong { display: block; font-size: .88rem; }
.ach .desc { font-size: .78rem; color: var(--muted); }
@media (prefers-reduced-motion: no-preference) {
  .ach { animation: rise .45s var(--ease) forwards; }
  .ach:nth-child(1) { animation-delay: .1s; } .ach:nth-child(2) { animation-delay: .2s; } .ach:nth-child(3) { animation-delay: .3s; }
  .ach:nth-child(4) { animation-delay: .4s; } .ach:nth-child(5) { animation-delay: .5s; } .ach:nth-child(6) { animation-delay: .6s; }
}
@media (prefers-reduced-motion: reduce) { .ach { opacity: 1; } .ach.locked { opacity: .5; } }

.components { display: grid; gap: .5rem; }
.component { background: var(--s1); border: 1px solid var(--line-2); border-radius: var(--r-sm); padding: .7rem .95rem; }
.component-head { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; font-size: .9rem; font-weight: 600; }
.component-head .pts { font-family: var(--mono); color: var(--accent); }
.component p { margin: .2rem 0 .4rem; font-size: .84rem; color: var(--muted); }

.result-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 1rem; margin-top: 2rem; }
.panel { background: var(--s1); border: 1px solid var(--line-2); border-radius: var(--r); padding: 1.2rem; }
.big { font-family: var(--display); font-size: 1.25rem; font-weight: 600; color: var(--accent); line-height: 1.3; }

.plan-review { display: grid; gap: .5rem; }
.pr { background: var(--s1); border: 1px solid var(--line-2); border-left: 4px solid var(--line-2); border-radius: var(--r-sm); padding: .7rem .95rem; }
.pr.essential { border-left-color: var(--accent); } .pr.harmful { border-left-color: var(--danger); } .pr.low_value { border-left-color: var(--warn); }
.pr-head { display: flex; gap: .6rem; align-items: center; flex-wrap: wrap; font-size: .9rem; font-weight: 600; }
.pr p { margin: .25rem 0 0; font-size: .84rem; color: var(--muted); }
.mark { font-family: var(--mono); font-size: .68rem; padding: .1rem .45rem; border-radius: 4px; border: 1px solid var(--line-2); color: var(--muted); }
.mark.yes { color: var(--accent); border-color: var(--accent-line); background: var(--accent-soft); }

.differential { display: grid; gap: .6rem; }
.dx { background: var(--s1); border: 1px solid var(--line-2); border-left: 4px solid var(--line-2); border-radius: var(--r-sm); padding: .85rem 1.05rem; }
.dx.final { border-left-color: var(--accent); } .dx.must_not_miss { border-left-color: var(--danger); } .dx.plausible { border-left-color: var(--warn); }
.dx-head { display: flex; align-items: center; gap: .55rem; flex-wrap: wrap; margin-bottom: .25rem; }
.dx h3 { margin: 0; font-family: var(--font); font-size: 1rem; text-transform: none; letter-spacing: -0.01em; color: var(--ink); }
.role { font-family: var(--display); font-size: .6rem; font-weight: 600; text-transform: uppercase; letter-spacing: .12em; padding: .14rem .45rem; border-radius: 4px; background: var(--s0); color: var(--muted); border: 1px solid var(--line-2); }
.dx.final .role { color: var(--accent); border-color: var(--accent-line); } .dx.must_not_miss .role { color: var(--danger); border-color: rgba(255,107,107,.3); } .dx.plausible .role { color: var(--warn); border-color: rgba(242,181,60,.3); }
.hit-badge { font-size: .68rem; font-weight: 600; color: var(--accent); background: var(--accent-soft); border: 1px solid var(--accent-line); padding: .1rem .45rem; border-radius: 4px; }
.dx p { font-size: .88rem; color: var(--ink-2); margin: 0 0 .3rem; }
.result-actions { display: flex; gap: .7rem; justify-content: center; flex-wrap: wrap; margin-top: 2.5rem; }
a { color: var(--accent); }

/* ---------- Transiciones entre pantallas ---------- */
@media (prefers-reduced-motion: no-preference) {
  .screen { animation: screen-in .4s var(--ease); }
  @keyframes screen-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
}
/* Nueva dirección visual: ilustración cinematográfica y superficies de consulta. */
:root { --bg:#080e18; --s0:#0c1622; --s1:#101e2c; --s2:#172a3a; --ink:#f3f7fb; --ink-2:#c6d3df; --muted:#9bafc0; --accent:#72f1ce; --line-2:rgba(176,208,231,.2); }
body { background:radial-gradient(ellipse at 20% 0%,#152c3c 0,transparent 55%),var(--bg); }
.topbar { padding:1rem clamp(1rem,4vw,4rem); background:rgba(8,14,24,.85); }
.brand { font-size:1.08rem; letter-spacing:-.04em; }
.brand-mark { width:12px;height:12px; }
.patient-art { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; opacity:0; }
.illustrated > .patient-art { opacity:1; }
.illustrated > .scene { visibility:hidden; }
.home-stage.illustrated > .patient-art { object-position:65% center; }
.home-stage::after { background:linear-gradient(90deg,rgba(8,14,24,.98),rgba(8,14,24,.87) 31%,rgba(8,14,24,.15) 76%),linear-gradient(0deg,#080e18 0,transparent 65%); }
.home-content { max-width:1320px; padding:clamp(3rem,8vh,6rem) 2rem 2.5rem; }
.home-content .display { font-size:clamp(4rem,8vw,7.5rem); line-height:.94; letter-spacing:-.065em; margin:1.5rem 0; }
.display em { font-style:normal; color:var(--accent); }
.home-content .lead { max-width:43ch; font-size:1.08rem; line-height:1.8; }
.shift-live { display:inline-flex;align-items:center;gap:.65rem;font-size:.65rem;letter-spacing:.17em;color:#d2e7e0; border:1px solid rgba(114,241,206,.25); border-radius:999px;padding:.55rem .85rem;background:rgba(12,29,35,.8); }
.shift-live span { width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 12px var(--accent); }
.hero-skills { display:flex;gap:1.3rem;margin:1.5rem 0;font-size:.75rem;color:#b3c7d5;letter-spacing:.04em; }
.btn { border-radius:12px;padding:.7rem 1.2rem; }
.btn.primary { background:linear-gradient(120deg,#98ffe1,#59debc);border-color:#83efd1;box-shadow:0 8px 30px #31d9ac20; }
.btn.xl { padding:1rem 1.7rem; }
.shift { max-width:1320px;padding:1rem 2rem 4rem; }
.shift-title { color:#b4c8d8; }
.shift-node { overflow:hidden;padding:0 1.25rem 1.25rem;background:linear-gradient(145deg,rgba(22,43,57,.94),rgba(11,23,35,.96));border-radius:20px;gap:.7rem; }
.case-art { height:170px; margin:0 -1.25rem .4rem;background-size:cover;background-position:50% 34%;position:relative;border-bottom:1px solid var(--line-2); }
.case-art::after { content:"";position:absolute;inset:0;background:linear-gradient(0deg,#101e2c,transparent 60%); }
.case-art-label { position:absolute;bottom:.8rem;left:1.25rem;z-index:1;font-size:.6rem;letter-spacing:.18em;color:var(--accent); }
.shift-node h2 { font-size:1.2rem; }
.stage { margin-top:1.2rem; border-radius:24px; border:1px solid var(--line-2);box-shadow:0 24px 80px #0007; }
.objective,.hud,.caption,.drawer-toggle { background:rgba(8,18,29,.82);backdrop-filter:blur(16px); }
.objective { border-radius:14px; }
.stage-top { padding:1.2rem; }
.stage-bottom { padding:1.2rem; }
.deck { background:linear-gradient(150deg,#132635,#0c1825);border:1px solid var(--line-2);border-radius:20px;margin-top:1rem; }
.bubble { background:rgba(10,23,35,.95);border-radius:18px;box-shadow:0 14px 50px #0006; }
.clinical-monitor { display:none;position:absolute;right:3%;top:30%;width:190px;padding:1rem;background:rgba(5,18,25,.92);border:1px solid #72f1ce55;border-radius:14px;box-shadow:0 0 30px #72f1ce10; }
.illustrated .clinical-monitor { display:block; }
.monitor-title { display:block;font-size:.52rem;letter-spacing:.12em;color:var(--accent);margin-bottom:.6rem; }
.clinical-monitor div { padding:.3rem 0;border-top:1px solid #ffffff14; }
.clinical-monitor div span { display:block;font-size:.6rem;color:#9bafc0; }
.clinical-monitor strong { font-family:var(--mono);font-size:1rem;color:var(--accent); }
.clinical-monitor small { font-size:.65rem;font-weight:400; }
.result-hero { background:radial-gradient(ellipse at top,#20493e77,transparent 70%),#101e2c; }
@media(max-width:640px) { .home-content { padding:3rem 1.2rem 2rem; }.home-stage::after { background:linear-gradient(90deg,#080e18ed,#080e1870),linear-gradient(0deg,#080e18,transparent); }.home-content .display { font-size:4.8rem; }.shift { padding:1rem 1.2rem 3rem; }.hero-skills { gap:.8rem;font-size:.68rem; }.stage { margin-top:0;border-radius:0; }.clinical-monitor { top:35%;right:2%;width:125px;padding:.55rem;max-height:45%;overflow:auto; }.clinical-monitor strong { font-size:.8rem; }.case-art { height:190px; } }
@media(max-width:640px) { .stage-top .hud { position:absolute;right:10px;top:165px; }.stage-top { padding:.7rem; }.objective { max-width:155px; }.objective strong { font-size:.8rem; } }

/* Personaje 2D por capas. El fondo permanece inmóvil. */
.animated-mode > .scene { position:absolute;inset:0;visibility:visible;z-index:1; }
.animated-mode.illustrated > .scene > :not(defs):not(title):not(#patient):not(#companion) { visibility:hidden; }
.animated-mode > .patient-art { z-index:0; }
.animated-mode .clinical-monitor { z-index:2; }
.animated-mode #patient { animation:none;filter:drop-shadow(4px 9px 9px #02091170); }
.animated-mode #patient-torso { transform-box:view-box;transform-origin:600px 444px; }
.animated-mode #patient-head { transform-box:view-box;transform-origin:600px 302px; }
.animated-mode #patient-eyes { transform-box:fill-box;transform-origin:center; }
.closed-lids,.mouth-open { opacity:0; }
.motion-toggle { font-size:.65rem;padding:.45rem .65rem;white-space:nowrap; }
.animated-mode #patient-mouth { transform-box:fill-box;transform-origin:center; }
.animated-mode[data-pose="leaning_forward"] #patient { transform:translateY(10px) scaleY(.97); }
@media(prefers-reduced-motion:no-preference) {
  .animated-mode #patient-torso { animation:patient-breath 4.5s ease-in-out infinite; }
  .animated-mode #patient-head { animation:patient-idle 7.2s ease-in-out infinite; }
  .animated-mode #patient-eyes { animation:patient-blink 6.1s linear infinite; }
  .animated-mode .closed-lids { animation:patient-lids 6.1s linear infinite; }
  .animated-mode.responding #patient-head { animation:patient-answer 1.2s ease-in-out 2; }
  .animated-mode.responding .mouth-open { animation:patient-mouth .4s ease-in-out 6; }
  .animated-mode.responding #patient-mouth > path { animation:patient-lips .4s ease-in-out 6; }
  @keyframes patient-breath { 0%,100% { transform:scaleY(1); } 50% { transform:scaleY(1.014); } }
  @keyframes patient-idle { 0%,100% { transform:rotate(-.35deg) translateY(0); } 50% { transform:rotate(.35deg) translateY(-1px); } }
  @keyframes patient-blink { 0%,43%,47%,79%,83%,100% { transform:scaleY(1); } 45%,81% { transform:scaleY(.03); } }
  @keyframes patient-lids { 0%,43%,47%,79%,83%,100% { opacity:0; } 45%,81% { opacity:1; } }
  @keyframes patient-answer { 0%,100% { transform:rotate(0); } 50% { transform:rotate(1.3deg) translateY(1px); } }
  @keyframes patient-mouth { 0%,100% { opacity:0;transform:scaleY(.2); } 50% { opacity:1;transform:scaleY(1); } }
  @keyframes patient-lips { 0%,100% { opacity:1; } 50% { opacity:0; } }
}
.animation-paused .animated-mode #patient *, .animation-paused .animated-mode #patient-head,.animation-paused .animated-mode #patient-torso { animation:none!important; }
.animation-paused .closed-lids,.animation-paused .mouth-open { opacity:0!important; }
.animation-paused #patient-mouth > path { opacity:1!important; }
@media(max-width:640px) { .motion-toggle { order:3; }.animated-mode .clinical-monitor { width:110px;right:1%;top:32%; }.deck-head { flex-wrap:wrap; }.animated-mode #patient { filter:drop-shadow(2px 4px 5px #02091170); } }
.stage:has(.animated-mode) .bubble-layer { left:2%;top:32%;transform:none;width:34%; }.stage:has(.animated-mode) .bubble { max-height:240px;overflow:auto; } @media(max-width:640px) { .stage:has(.animated-mode) .bubble-layer { left:3%;top:auto;bottom:65px;width:94%; }.stage:has(.animated-mode) .bubble { max-height:110px; } }
.atlas-character #patient-eyes { transform:none;animation:atlas-open 6.1s steps(1,end) infinite; }.atlas-face-closed { opacity:0;animation:atlas-closed 6.1s steps(1,end) infinite; }.atlas-character #patient-head { transform-origin:600px 295px; }.atlas-character #patient-torso { transform-origin:600px 425px; } @keyframes atlas-open { 0%,45%,81% { opacity:1; }44%,80% { opacity:0; } } @keyframes atlas-closed { 0%,45%,81% { opacity:0; }44%,80% { opacity:1; } }.animation-paused .atlas-face-open { opacity:1!important; }.animation-paused .atlas-face-closed { opacity:0!important; } @media(prefers-reduced-motion:reduce) { .atlas-character #patient-eyes,.atlas-face-closed { animation:none!important; }.atlas-face-open { opacity:1; }.atlas-face-closed { opacity:0; } }
.animated-mode #companion { opacity:.25; }

/* Pacientes quietos mientras se revisa la animación por capas. */
.scene #patient, .scene #patient *, .patient-art { animation:none!important; }
.scene #patient-head,.scene #patient-torso,.scene #patient-eyes { transform:none!important; }.scene .atlas-face-open { opacity:1!important; }.scene .atlas-face-closed,.scene .closed-lids,.scene .mouth-open { opacity:0!important; }

/* Interfaz de juego clínico: escenario, misión y consola de acciones. */
:root { --accent:#6af5d5;--warm:#ffc77b;--bg:#070e17;--line-2:rgba(115,202,218,.25);--display:"Sora","Segoe UI",sans-serif; }
.topbar { height:62px;padding:.8rem 1.6rem;border-bottom:1px solid #63e7cf30;background:#07121bf2; }
.brand { font-family:var(--display);font-size:1rem; }
.brand-mark { border-radius:3px;transform:rotate(45deg);box-shadow:0 0 20px #6af5d570; }
.topbar-center { font-family:var(--mono);font-size:.72rem;letter-spacing:.04em; }
.notice { font-family:var(--mono);font-size:.6rem;border:1px solid #ffc77b40;padding:.35rem .55rem; }
.home-content { max-width:1440px;padding:4rem 3rem 2rem; }
.home-content .eyebrow { color:var(--warm);letter-spacing:.25em; }
.home-content .display { text-transform:uppercase;font-size:clamp(3.6rem,7vw,7.5rem);line-height:.91;letter-spacing:-.06em;text-shadow:0 8px 30px #0005; }
.home-content .display em { color:var(--warm); }
.shift-live { border-radius:3px;font-family:var(--mono);font-size:.62rem; }
.hero-skills { border-left:2px solid var(--accent);padding-left:1rem;font-family:var(--mono);text-transform:uppercase;letter-spacing:.06em; }
.btn { border-radius:4px;font-family:var(--display);letter-spacing:.02em; }
.btn.primary { background:var(--accent);border-color:#c0ffef;box-shadow:inset 0 -3px 0 #16857855,0 0 22px #6af5d517; }
.btn.primary:hover:not(:disabled) { box-shadow:0 0 25px #6af5d544; }
.home-cta-icon { margin-right:.7rem;font-size:.8rem; }
.shift { max-width:1440px;padding:1rem 3rem 3rem; }
.shift-title { font-family:var(--mono);font-size:.7rem;color:var(--warm);letter-spacing:.2em; }
.shift-node { border-radius:5px;border-top:2px solid #6af5d570;background:linear-gradient(145deg,#142936ef,#07131aef); }
.shift-node .num { color:var(--accent);font-size:.65rem; }
.case-art { height:180px; }
.case-art-label { font-family:var(--mono);font-size:.55rem; }
.shift-node .btn { align-self:stretch;text-align:left; }
.shift-node .btn::after { content:" →";float:right; }
.record span { border-radius:3px;font-family:var(--mono);font-size:.7rem; }
.case { max-width:none;padding:0;background:#070f18; }
.stage { width:100%;height:calc(100vh - 315px);min-height:440px;max-height:780px;margin:0;border-radius:0;aspect-ratio:auto;border:0;border-bottom:1px solid #6af5d540;box-shadow:none; }
.stage::after { content:"";position:absolute;inset:12px;pointer-events:none;border:1px solid #7edfcd12;z-index:2; }
.scene-location { position:absolute;top:22px;left:50%;transform:translateX(-50%);z-index:3;display:flex;flex-direction:column;gap:.3rem;align-items:center;font-family:var(--mono);font-size:.55rem;letter-spacing:.2em;color:#b9d3df;text-shadow:0 2px 8px #000;pointer-events:none; }
.scene-location strong { color:var(--warm);font-size:.7rem;font-weight:500; }
.stage-top { padding:1.4rem 1.6rem; }
.objective { width:250px;max-width:28%;border-radius:3px;border:1px solid #6af5d538;border-left:3px solid var(--accent);background:linear-gradient(110deg,#07141aed,#0a1c26d9);padding:.85rem 1rem;gap:.4rem;box-shadow:0 10px 30px #0003; }
.objective-kicker { font-family:var(--mono);font-size:.58rem;letter-spacing:.18em; }
.objective strong { font-size:1rem; }
.objective-count { color:#a8c6ce; }
.objective-progress { border-radius:0;height:3px; }
.hud { background:none;gap:.5rem; }
.hud-stat { border-radius:3px;border-top:2px solid var(--warm);padding:.6rem .8rem;min-width:78px;background:#06131be8; }
.hud-stat .k { font-family:var(--mono);font-size:.55rem; }
.hud-stat .v { font-size:1.3rem;color:var(--warm); }
.animated-mode #patient { transform:translate(600px,425px) scale(1.18) translate(-600px,-425px); }
.animated-mode[data-pose="leaning_forward"] #patient { transform:translate(600px,425px) scale(1.18) translate(-600px,-415px); }
.stage-bottom { padding:1.2rem 1.6rem; }
.caption { padding:.75rem 1rem;border-radius:3px;border-left:3px solid var(--warm);background:#07141bed; }
.caption::before { content:"PATIENT / EN CONSULTA";font-family:var(--mono);font-size:.5rem;letter-spacing:.16em;color:#9ab8c5;margin-bottom:.35rem; }
.caption strong { font-size:1.2rem; }
.caption span { color:var(--accent);font-family:var(--mono);font-size:.64rem;margin-top:.25rem; }
.drawer-toggle { border-radius:3px;border:1px solid #6af5d570;background:#07141be8;padding:.65rem 1rem; }
.drawer-toggle::before { content:"✚";color:var(--accent);margin-right:.7rem; }
.hotspot { width:40px;height:40px;border:1px solid #a9ffea;background:#092b2ee0;box-shadow:0 0 0 4px #6af5d51a; }
.hotspot::before { content:"+"!important;width:auto!important;height:auto!important;background:none!important;font-family:var(--mono);font-size:1.4rem; }
.hotspot.done::before { content:"✓"!important;font-size:1rem; }
.hotspot::after { border-radius:2px;font-family:var(--mono);background:#06141bee; }
.hotspot:not(.done) { animation:none; }
.deck { max-width:none;margin:0;border-radius:0;border:0;background:linear-gradient(180deg,#0e202c,#08121c); }
.deck-head { padding:.75rem 1.6rem;border-bottom:1px solid #6af5d524;background:#07141be8; }
.steps { gap:.5rem; }
.steps li { font-family:var(--mono);font-size:.63rem;text-transform:uppercase;letter-spacing:.06em;border-radius:2px; }
.steps li[aria-current="step"] { color:#06231c;background:var(--accent);font-weight:700; }
.deck-hint { font-family:var(--mono);font-size:.63rem;color:#aac3d0; }
.deck-body { padding:1rem 1.6rem; }
.deck-actions { padding:.7rem 1.6rem 1rem;border-top:1px solid #6af5d515; }
.deck-body .brief { border-radius:3px;background:#0a1922;max-width:100%;border-left:2px solid var(--warm);padding:.75rem 1rem; }
.deck-body .brief .eyebrow { color:var(--warm);font-family:var(--mono);font-size:.6rem; }
.deck-body .brief p { font-size:.84rem;margin:0; }
.deck-body .brief p+p { margin-top:.35rem; }
.chips { gap:.45rem; }
.chip { border-radius:3px;background:#132b39;border:1px solid #7fc6d333;padding:.6rem .8rem; }
.chip:hover { border-color:var(--accent);background:#183847; }
.talk input { border-radius:3px;border-color:#6af5d538;background:#050f17; }
.talk .btn { padding-inline:1.4rem; }
.clinical-monitor { border-radius:3px;border-top:2px solid var(--accent);right:2.5%;background:#04151dee; }
.overlay-card { border-radius:5px;border:1px solid #6af5d560;border-top:3px solid var(--accent);background:linear-gradient(145deg,#112c3b,#07131d); }
.overlay-kicker { font-family:var(--mono); }
.overlay-card .display { color:var(--warm); }
.bubble { border-radius:4px;border-left:3px solid var(--warm); }
.result-hero,.dial,.ach,.panel,.component,.pr,.dx { border-radius:5px; }
@media(min-width:1100px) { .deck-body:has(.brief) { padding-block:.75rem; }.deck-body .brief { display:grid;grid-template-columns:95px 1fr;gap:.15rem 1rem; }.deck-body .brief .eyebrow { grid-row:span 2;margin:0; }.deck-body .brief p+p { margin:0; } }
@media(max-width:640px) {
 .topbar { height:54px;padding:.8rem 1rem; }.topbar-center { font-size:.6rem; }.brand { font-size:.85rem; }
 .home-content { padding:3rem 1.2rem 2rem; }.home-content .display { font-size:4rem; }.hero-skills { font-size:.58rem;gap:.65rem; }.shift { padding:1rem 1.2rem 2rem; }
 .stage { height:52vh;min-height:390px;max-height:540px; }.stage-top { padding:1rem; }.objective { max-width:47%;width:170px;padding:.6rem .7rem; }.objective strong { font-size:.8rem; }.scene-location { top:13px;left:auto;right:1rem;transform:none;align-items:flex-end; }.scene-location span { display:none; }.scene-location strong { font-size:.55rem; }
 .stage-top .hud { position:absolute;right:1rem;top:47px; }.hud-stat { padding:.4rem .5rem;min-width:48px; }.hud-stat .v { font-size:1rem; }
 .stage-bottom { padding:1rem;gap:.5rem; }.caption { padding:.55rem .65rem; }.caption strong { font-size:.94rem; }.caption::before { font-size:.42rem; }.caption span { font-size:.55rem; }.drawer-toggle { padding:.5rem .6rem;font-size:.65rem; }.drawer-toggle::before { display:none; }
 .deck-head { padding:.8rem 1rem; }.deck-body { padding:1rem; }.deck-actions { padding:.75rem 1rem; }.steps { gap:.25rem; }.steps li { font-size:.54rem; }.deck-hint { font-size:.6rem; }.hotspot { width:32px;height:32px; }.clinical-monitor { top:32%;max-height:38%;overflow:auto; }
}
.animated-mode #patient { transform-box:view-box;transform-origin:600px 425px;transform:scale(1.18); }.animated-mode[data-pose="leaning_forward"] #patient { transform:translateY(10px) scale(1.18); }.caption::before { content:"PACIENTE / EN CONSULTA"; }

/* ---------- Cuentas y progreso (Fase 9) ---------- */
.btn.small { font-size: .74rem; padding: .42rem .8rem; }
.btn.ghost { background: transparent; border-color: var(--line-2); color: var(--ink-2); }
.btn.ghost:hover:not(:disabled) { color: var(--ink); border-color: var(--accent-line); }
.topbar-user { display: flex; align-items: center; gap: .6rem; }
.topbar-user .btn { white-space: nowrap; }
.user-email { font-family: var(--mono); font-size: .72rem; color: var(--ink-2); max-width: 22ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 640px) { .user-email { display: none; } }

.auth { position: relative; min-height: calc(100vh - 62px); display: grid; place-items: center; padding: 2rem 1rem 3rem; }
.auth-stage { position: absolute; inset: 0; z-index: 0; overflow: hidden; }
.auth-stage .scene { height: 100%; opacity: .4; filter: saturate(.8); }
.auth-stage::after { content: ""; position: absolute; inset: 0; background: radial-gradient(70% 70% at 50% 40%, rgba(7,11,14,.55), rgba(7,11,14,.96)); }
.auth-card { position: relative; z-index: 1; width: min(460px, 100%); background: rgba(13,20,24,.9); border: 1px solid #6af5d540; border-top: 3px solid var(--accent); border-radius: 5px; padding: 2rem 1.6rem 1.4rem; backdrop-filter: blur(12px); box-shadow: var(--shadow); }
.auth-card .display { font-size: clamp(2rem, 5vw, 2.8rem); line-height: 1; margin-bottom: .8rem; }
.auth-card .lead { font-size: .94rem; margin-bottom: 1rem; }
.auth-banner { font-size: .86rem; color: var(--ink-2); background: var(--s2); border: 1px solid var(--line-2); border-left: 3px solid var(--accent); border-radius: var(--r-sm); padding: .55rem .8rem; margin-bottom: 1rem; }
.auth-banner.warn { border-left-color: var(--warn); color: var(--warm); }
.tabs { display: flex; gap: .3rem; border-bottom: 1px solid var(--line-2); margin-bottom: 1rem; }
.tab { font: inherit; font-family: var(--display); font-size: .8rem; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; padding: .6rem .9rem; background: none; border: 0; border-bottom: 2px solid transparent; color: var(--muted); cursor: pointer; margin-bottom: -1px; }
.tab[aria-selected="true"] { color: var(--accent); border-bottom-color: var(--accent); }
.auth-form { display: flex; flex-direction: column; gap: .8rem; }
.field { display: flex; flex-direction: column; gap: .3rem; }
.field span { font-family: var(--display); font-size: .66rem; font-weight: 600; text-transform: uppercase; letter-spacing: .12em; color: var(--muted); }
.field input { font: inherit; font-size: .95rem; padding: .65rem .85rem; border-radius: 3px; border: 1px solid #6af5d538; background: #050f17; color: var(--ink); }
.field input::placeholder { color: #5c6f7a; }
.field input:focus { border-color: var(--accent-line); outline: none; box-shadow: 0 0 0 3px var(--accent-soft); }
.form-error { font-size: .86rem; color: var(--danger); background: var(--danger-soft); border: 1px solid rgba(255,107,107,.3); border-radius: var(--r-sm); padding: .5rem .75rem; margin: 0; }
.auth-form .btn.xl { width: 100%; justify-content: center; margin-top: .2rem; }
.auth-note { margin: .4rem 0 0; text-align: center; }
/* Entrar con Google y contraseña olvidada (ADR 0037) */
.auth-google { display: flex; flex-direction: column; gap: .5rem; margin-bottom: .6rem; }
.auth-google .muted { margin: 0; text-align: center; }
.btn.google { width: 100%; justify-content: center; gap: .6rem; background: #fff; color: #1f1f1f; border-color: #dadce0; text-decoration: none; font-family: var(--font); letter-spacing: 0; }
.btn.google:hover { background: #f1f3f4; }
.google-g { flex: none; }
.auth-divider { display: flex; align-items: center; gap: .7rem; margin: .5rem 0 0; color: var(--muted); font-size: .8rem; }
.auth-divider::before, .auth-divider::after { content: ""; flex: 1; height: 1px; background: var(--line-2); }
.link-btn { font: inherit; background: none; border: 0; padding: .2rem 0; color: var(--accent); cursor: pointer; text-decoration: underline; text-underline-offset: 3px; align-self: flex-start; }
.link-btn:hover { color: var(--ink); }
#auth-back { align-self: center; }

.resume-banner { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; background: rgba(18,27,33,.88); border: 1px solid #6af5d550; border-left: 3px solid var(--accent); border-radius: 5px; padding: .8rem 1rem; margin-bottom: 1.2rem; max-width: 640px; backdrop-filter: blur(8px); }
.resume-banner > div { display: flex; flex-direction: column; gap: .15rem; }
.resume-banner .eyebrow { margin-bottom: 0; }
.resume-banner strong { font-family: var(--display); font-size: 1rem; }
.pill.live { background: rgba(255,207,138,.12); border-color: rgba(255,207,138,.45); color: var(--warm); }
.node-actions { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; margin-top: .3rem; }
.shift-node .node-actions .btn { margin-top: 0; }
.deck-spacer { flex: 1; }
.deck-actions { justify-content: flex-start; align-items: center; }

.progress { max-width: 1000px; margin: 0 auto; padding: 1.5rem 1.25rem 3rem; }
.progress-head { padding: 1rem 0 .5rem; }
.progress-head .display { font-size: clamp(1.8rem, 4vw, 2.6rem); margin-bottom: .5rem; }
.pending-list { display: flex; flex-direction: column; gap: .6rem; }
.pending { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; background: var(--s1); border: 1px solid var(--line-2); border-left: 3px solid var(--warm); border-radius: 5px; padding: .8rem 1rem; }
.pending.stale { border-left-color: var(--muted); opacity: .85; }
.pending-main { display: flex; flex-direction: column; gap: .2rem; }
.pending-main strong { font-family: var(--display); }
.stale-note { font-size: .8rem; color: var(--warn); }
.pending-actions { display: flex; gap: .5rem; align-items: center; }
.table-wrap { overflow-x: auto; }
.history { width: 100%; border-collapse: collapse; font-size: .9rem; }
.history th { text-align: left; font-family: var(--display); font-size: .64rem; text-transform: uppercase; letter-spacing: .14em; color: var(--muted); padding: .5rem .6rem; border-bottom: 1px solid var(--line-2); }
.history td { padding: .55rem .6rem; border-bottom: 1px solid var(--line); color: var(--ink-2); vertical-align: middle; }
.history td.mono { font-family: var(--mono); font-variant-numeric: tabular-nums; font-size: .82rem; }
.history td.stars-cell { color: var(--warn); letter-spacing: .1em; white-space: nowrap; }

.loading { position: fixed; left: 50%; top: 4.6rem; transform: translateX(-50%); z-index: 70; display: flex; align-items: center; gap: .5rem; font-family: var(--mono); font-size: .78rem; color: var(--ink-2); background: rgba(7,11,14,.92); border: 1px solid var(--line-2); border-radius: 999px; padding: .38rem .9rem; pointer-events: none; }
.spinner { width: 12px; height: 12px; border-radius: 50%; border: 2px solid var(--line-2); border-top-color: var(--accent); }
@media (prefers-reduced-motion: no-preference) { .spinner { animation: spin .8s linear infinite; } @keyframes spin { to { transform: rotate(360deg); } } }

/* ---- Correcciones de la revisión del 2026-09-16 (docs/plan-mvp-beta.md, A.4 9-10) ---- */
/* El bocadillo del paciente nunca invade la franja inferior (nombre, estado, bloc):
   ocupa como mucho desde el 9 % hasta el 26 % del borde inferior de la escena y,
   si el texto es más largo, se desplaza dentro del propio bocadillo. */
.bubble-layer { bottom: 26%; align-items: flex-start; }
.stage .bubble-layer .bubble { display: flex; flex-direction: column; max-height: 100%; overflow: hidden; }
.bubble .say { flex: 0 1 auto; min-height: 0; overflow-y: auto; margin: 0; }
.bubble .facts { flex: 0 1 auto; min-height: 0; max-height: none; }
/* El aviso "paciente sintético · educativo" se ve en todos los tamaños: en móvil
   pasa a una segunda línea de la cabecera en vez de ocultarse. */
@media (max-width: 640px) {
  .topbar { flex-wrap: wrap; height: auto; min-height: 54px; row-gap: .25rem; }
  .notice { display: block; order: 10; flex-basis: 100%; text-align: center; border: 0; padding: 0; font-size: .58rem; white-space: normal; }
}

/* ---- Debrief ampliado (ADR 0013) ---- */
.evolution { margin-top: 1rem; border-radius: var(--r); padding: 1.1rem 1.3rem; border: 1px solid var(--line-2); background: var(--s1); }
.evolution .display { font-size: clamp(1.2rem, 2.6vw, 1.6rem); margin: .2rem 0 .5rem; }
.evolution p { margin: 0; line-height: 1.55; }
.evolution.good { border-color: rgba(106,245,213,.35); background: linear-gradient(135deg, rgba(106,245,213,.10), transparent 60%); }
.evolution.partial { border-color: rgba(255,207,138,.35); background: linear-gradient(135deg, rgba(255,207,138,.12), transparent 60%); }
.evolution.poor { border-color: rgba(255,107,107,.35); background: linear-gradient(135deg, rgba(255,107,107,.12), transparent 60%); }
.evolution.good .eyebrow { color: var(--accent); } .evolution.partial .eyebrow { color: var(--warm); } .evolution.poor .eyebrow { color: var(--danger); }

.debrief-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1rem; }
.debrief-grid .panel h3 { margin-top: 0; }
.flags { list-style: none; margin: 0; padding: 0; }
.flags li { display: grid; grid-template-columns: auto 1fr; gap: .3rem .6rem; padding: .45rem 0; border-bottom: 1px solid var(--line); font-size: .92rem; }
.flags li .tag { grid-column: 2; }
.flags .flag-mark { font-weight: 700; }
.flags li.found .flag-mark { color: var(--accent); } .flags li.missed .flag-mark { color: var(--danger); }
.flags li.missed { background: var(--danger-soft); border-radius: var(--r-sm); padding-inline: .5rem; }
.plain li.bad { color: var(--danger); } .plain li.warn { color: var(--warm); }

.narrative { font-size: 1.02rem; line-height: 1.6; padding: 1rem 1.2rem; border-left: 3px solid var(--warm); background: var(--warm-soft); border-radius: 0 var(--r) var(--r) 0; }
.path { list-style: none; margin: 1rem 0 0; padding: 0; position: relative; }
.path::before { content: ""; position: absolute; left: 15px; top: 8px; bottom: 8px; width: 2px; background: var(--line-2); }
.step { display: grid; grid-template-columns: 32px 1fr; gap: .8rem; margin-bottom: 1rem; position: relative; }
.step-num { width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; background: var(--s2, var(--s1)); border: 2px solid var(--accent); font-family: var(--mono); font-size: .8rem; }
.step-stage { display: block; font-family: var(--display); font-size: .66rem; font-weight: 600; text-transform: uppercase; letter-spacing: .14em; color: var(--accent); margin-top: .45rem; }
.step p { margin: .25rem 0 .4rem; line-height: 1.5; }
.cites { display: flex; flex-wrap: wrap; gap: .35rem; }
.cite { font-size: .74rem; padding: .2rem .5rem; border-radius: 999px; border: 1px solid var(--line-2); background: var(--s1); color: var(--ink-2); max-width: 100%; }
.cite.absent { border-style: dashed; }
.cite.dx { border-color: rgba(255,207,138,.5); color: var(--warm); }
.cite.act { border-color: rgba(106,245,213,.5); color: var(--accent); }

/* Evidencias del diferencial como texto, sin identificadores */
.dx .evidence { display: grid; grid-template-columns: 5.5rem 1fr; gap: .2rem .6rem; margin: .4rem 0 0; font-size: .82rem; color: var(--ink-2); }
.dx .evidence-label { font-family: var(--display); font-size: .62rem; font-weight: 600; text-transform: uppercase; letter-spacing: .12em; color: var(--muted); padding-top: .15rem; }
.dx .evidence ul { margin: 0; padding-left: 1rem; }
.dx .evidence li { margin: 0 0 .15rem; }

.overlay-actions { display: flex; gap: .6rem; justify-content: center; flex-wrap: wrap; }

/* ---- Dashboard (paso 8, ADR 0015) ---- */
.home-content.dash { max-width: 1100px; }
.dash-head { display: grid; grid-template-columns: 1fr; gap: 1rem; margin: .8rem 0 1.2rem; }
.dash-level { background: rgba(8,18,29,.82); border: 1px solid var(--line-2); border-radius: var(--r); padding: 1rem 1.2rem; backdrop-filter: blur(12px); }
.dash-kicker { display: block; font-family: var(--display); font-size: .62rem; font-weight: 600; text-transform: uppercase; letter-spacing: .16em; color: var(--warm); }
.dash-level-num { display: block; font-family: var(--display); font-size: 2.6rem; font-weight: 700; line-height: 1.05; margin: .15rem 0 .5rem; }
.dash-level-num b { font-weight: 700; }
.dash-level-num::before { content: "Nivel "; font-size: 1.1rem; font-weight: 600; color: var(--ink-2); }
.xp-bar { height: 10px; border-radius: 999px; background: var(--s2); overflow: hidden; border: 1px solid var(--line-2); }
.xp-bar span { display: block; height: 100%; width: 0; background: linear-gradient(90deg, var(--accent), #b9ffe9); transition: width .8s var(--ease); }
.dash-xp { display: block; margin-top: .4rem; color: var(--ink-2); font-family: var(--mono); font-size: .72rem; }
.dash-chips { display: grid; grid-template-columns: repeat(3, 1fr); gap: .6rem; }
.chip-stat { display: flex; flex-direction: column; align-items: flex-start; gap: .1rem; background: rgba(8,18,29,.82); border: 1px solid var(--line-2); border-radius: var(--r); padding: .7rem .8rem; backdrop-filter: blur(12px); }
.chip-stat b { font-family: var(--display); font-size: 1.5rem; line-height: 1; }
.chip-stat span:last-child { font-size: .68rem; color: var(--ink-2); font-family: var(--mono); }
.chip-icon { font-size: .95rem; opacity: .6; }
.chip-stat.alive .chip-icon { opacity: 1; filter: drop-shadow(0 0 6px rgba(255,160,60,.6)); }
.chip-stat.alive b { color: var(--warm); }
.dash-cards { display: grid; grid-template-columns: 1fr; gap: .8rem; margin-bottom: 1.2rem; }
.dash-card { display: flex; flex-direction: column; gap: .3rem; background: rgba(8,18,29,.88); border: 1px solid var(--line-2); border-radius: var(--r); padding: 1rem 1.1rem; backdrop-filter: blur(12px); }
.dash-card strong { font-family: var(--display); font-size: 1.1rem; }
.dash-card p { margin: 0; color: var(--ink-2); }
.dash-card .btn { align-self: flex-start; margin-top: .4rem; }
.dash-card.continue { border-color: rgba(255,207,138,.4); }
.dash-card.recommend { border-color: rgba(106,245,213,.35); }
.dash-section-title { font-family: var(--display); font-size: .95rem; font-weight: 600; margin: 0 0 .2rem; }
.spec-list { list-style: none; margin: .6rem 0 0; padding: 0; display: grid; grid-template-columns: 1fr; gap: .5rem; }
.spec { background: rgba(8,18,29,.82); border: 1px solid var(--line-2); border-radius: var(--r-sm); padding: .65rem .8rem; backdrop-filter: blur(12px); }
.spec.empty { opacity: .6; }
.spec.weak { border-color: rgba(255,207,138,.45); }
.spec.strong { border-color: rgba(106,245,213,.45); }
.spec-head { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.spec-name { font-family: var(--display); font-weight: 600; }
.spec-meta { font-family: var(--mono); font-size: .68rem; color: var(--muted); }
.spec-bars { display: grid; gap: .3rem; margin-top: .45rem; }
.spec-bar { display: grid; grid-template-columns: 5rem 1fr 2.2rem; align-items: center; gap: .5rem; font-size: .74rem; }
.spec-bar .k { color: var(--ink-2); }
.spec-bar .v { text-align: right; font-family: var(--mono); }
.spec-bar .bar { height: 7px; border-radius: 999px; background: var(--s2); overflow: hidden; }
.spec-bar .bar span { display: block; height: 100%; background: var(--accent); }
.spec-bar .bar.safety span { background: var(--warm); }
@media (min-width: 760px) {
  .dash-head { grid-template-columns: 1.2fr 1fr; align-items: stretch; }
  .dash-cards { grid-template-columns: 1fr 1fr; }
  .spec-list { grid-template-columns: 1fr 1fr; }
}

/* ---- Caso del día y modo guardia (paso 9, ADR 0016) ---- */
.dash-card.daily { border-color: rgba(255,207,138,.5); background: linear-gradient(135deg, rgba(255,207,138,.12), rgba(8,18,29,.9) 60%); }
.dash-card.daily.done { border-color: rgba(106,245,213,.4); background: linear-gradient(135deg, rgba(106,245,213,.10), rgba(8,18,29,.9) 60%); }
.daily-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--warm); margin-right: .3rem; vertical-align: middle; box-shadow: 0 0 8px rgba(255,207,138,.8); }
.dash-card.daily.done .daily-dot { background: var(--accent); box-shadow: 0 0 8px rgba(106,245,213,.8); }
.dash-card.guardia { border-style: dashed; }
.stage.mode-guardia .scene-location strong { color: var(--danger); }
.stage.mode-daily .scene-location span { color: var(--warm); }

/* ---- Planes (paso 10, ADR 0017) ---- */
.plan-badge { display: inline-block; margin-left: .6rem; padding: .15rem .5rem; border-radius: 999px; border: 1px solid rgba(106,245,213,.4); color: var(--accent); font-size: .6rem; letter-spacing: .1em; text-transform: uppercase; vertical-align: middle; }
.plan-badge:empty { display: none; }
.pill.lock { border-color: rgba(255,207,138,.5); color: var(--warm); }
.shift-node.locked { opacity: .75; }
.shift-node.locked .case-art { filter: grayscale(.6); }
.dash-card.intent { border-color: rgba(255,207,138,.45); }
.dash-card.intent strong { font-size: 1rem; font-weight: 600; line-height: 1.45; }
.intent-actions { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .3rem; }
.intent-actions .btn { margin-top: 0; }

/* ---- Clasificación (ADR 0018) ---- */
.dash-board { background: rgba(8,18,29,.82); border: 1px solid var(--line-2); border-radius: var(--r); padding: 1rem 1.1rem; backdrop-filter: blur(12px); margin-bottom: 1.2rem; }
.board-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .4rem; }
.board-tabs { margin: .5rem 0 .7rem; }
.board-setup p { margin: .2rem 0 .5rem; }
.inline-form { display: flex; gap: .5rem; flex-wrap: wrap; margin: .3rem 0 .6rem; }
.inline-form input { flex: 1 1 160px; min-width: 0; background: var(--s2); border: 1px solid var(--line-2); border-radius: var(--r-sm); color: var(--ink); padding: .5rem .7rem; font: inherit; }
.board-me { display: flex; flex-wrap: wrap; gap: .5rem 1.2rem; align-items: center; font-size: .86rem; margin-bottom: .4rem; }
.friend-code { font-family: var(--mono); letter-spacing: .18em; background: var(--s2); border: 1px dashed var(--line-2); padding: .15rem .5rem; border-radius: 6px; user-select: all; }
.switch { display: inline-flex; align-items: center; gap: .4rem; }
.board-list { list-style: none; margin: .4rem 0 0; padding: 0; }
.board-list li { display: grid; grid-template-columns: 2rem 1fr auto auto; gap: .6rem; align-items: center; padding: .45rem .5rem; border-bottom: 1px solid var(--line); font-size: .92rem; }
.board-list li.me { background: rgba(106,245,213,.08); border-radius: var(--r-sm); }
.board-list .rank { font-family: var(--display); font-weight: 700; color: var(--muted); }
.board-list li:nth-child(1) .rank { color: var(--warm); }
.board-list .xp { font-family: var(--mono); font-size: .78rem; }
.board-list .streak { font-size: .78rem; color: var(--ink-2); }

/* ---- Legal y cuenta (ADR 0019) ---- */
.legal-notice { color: var(--warm); border-left: 3px solid rgba(255,207,138,.6); padding: .4rem .7rem; margin: 1rem 0 0; line-height: 1.45; }
.consent { display: grid; gap: .4rem; margin: .2rem 0 .6rem; }
.check { display: flex; gap: .5rem; align-items: flex-start; font-size: .86rem; color: var(--ink-2); line-height: 1.4; }
.check input { margin-top: .2rem; flex: 0 0 auto; }
.check a { color: var(--accent); }
.account { max-width: 760px; margin: 0 auto; padding: 1.5rem 1.25rem 3rem; }
.account .panel { margin-bottom: .8rem; }
.danger-zone { border-color: rgba(255,107,107,.4); }
.btn.danger { border-color: rgba(255,107,107,.6); color: var(--danger); }
.btn.danger:hover { background: var(--danger-soft); }
.overlay-facts a { color: var(--accent); }

/* ---- Portada organizada (ADR 0020) ---- */
.home-nav { position: sticky; top: 62px; z-index: 3; display: flex; gap: .4rem; flex-wrap: wrap; padding: .45rem .5rem; margin: 0 0 1.2rem; background: rgba(8,14,24,.82); border: 1px solid var(--line-2); border-radius: 999px; backdrop-filter: blur(12px); width: fit-content; max-width: 100%; }
.home-nav a { font-family: var(--display); font-size: .74rem; font-weight: 600; letter-spacing: .04em; color: var(--ink-2); text-decoration: none; padding: .35rem .75rem; border-radius: 999px; white-space: nowrap; }
.home-nav a:hover { color: var(--ink); background: var(--s2); }
.anchor { display: block; height: 0; scroll-margin-top: 120px; }
.home-section-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: .3rem .8rem; margin: .4rem 0 .7rem; }
.home-section-head .dash-section-title { font-size: 1.15rem; }
.shift.in-dash { max-width: none; padding: 0; margin: 0 0 1.4rem; }
.dash-teachers { margin-bottom: 1.2rem; }
.dash-card.teacher { border-color: rgba(124,188,255,.35); background: linear-gradient(135deg, rgba(124,188,255,.10), rgba(8,18,29,.9) 60%); }
.dash-card.teacher.soon { opacity: .8; border-style: dashed; }
.dash-card.teacher .pill.ghost { align-self: flex-start; margin-top: .4rem; }
.dash-card a.btn { text-decoration: none; }
.topbar-user a.btn { text-decoration: none; }
.home-footer { margin-top: 1.5rem; padding-top: 1.2rem; border-top: 1px solid var(--line-2); display: grid; gap: .5rem; }
.home-footer-links { display: flex; flex-wrap: wrap; gap: .4rem 1.2rem; font-size: .86rem; }
.home-footer-links a, .linklike { color: var(--ink-2); text-decoration: none; background: none; border: 0; padding: 0; font: inherit; font-size: .86rem; cursor: pointer; }
.home-footer-links a:hover, .linklike:hover { color: var(--accent); }
.home-footer .legal-notice { margin-top: .2rem; }
@media (max-width: 640px) { .home-nav { top: 56px; border-radius: 14px; } }
kbd { font-family: var(--mono); font-size: .85em; background: var(--s2); border: 1px solid var(--line-2); border-bottom-width: 2px; border-radius: 5px; padding: 0 .4em; }

/* ---- Pestañas de la aplicación (ADR 0022) ---- */
.tabbar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; display: flex; justify-content: space-around; align-items: stretch; background: rgba(8,14,24,.94); border-top: 1px solid var(--line-2); backdrop-filter: blur(14px); padding: .3rem .4rem calc(.3rem + env(safe-area-inset-bottom)); }
.tab-btn { flex: 1 1 0; display: flex; flex-direction: column; align-items: center; gap: .15rem; font: inherit; font-family: var(--display); font-size: .62rem; font-weight: 600; letter-spacing: .04em; color: var(--muted); background: none; border: 0; border-radius: 12px; padding: .35rem .2rem; cursor: pointer; }
.tab-icon { font-size: 1.15rem; line-height: 1; }
.tab-btn.on { color: var(--accent); }
.tab-btn.on .tab-icon { filter: drop-shadow(0 0 6px rgba(46,230,168,.6)); }
body.with-tabs main { padding-bottom: 5rem; }
@media (min-width: 760px) {
  .tabbar { position: sticky; top: 62px; bottom: auto; justify-content: center; gap: .3rem; padding: .4rem 1rem; border-top: 0; border-bottom: 1px solid var(--line); }
  .tab-btn { flex: 0 0 auto; flex-direction: row; gap: .45rem; font-size: .8rem; padding: .45rem .95rem; border-radius: 999px; }
  .tab-btn.on { background: var(--accent-soft); }
  .tab-icon { font-size: .95rem; }
  body.with-tabs main { padding-bottom: 2rem; }
}
.home { min-height: auto; }
.home-more { display: flex; justify-content: space-between; align-items: center; width: 100%; margin-top: .4rem; font: inherit; color: var(--ink); text-align: left; background: rgba(8,18,29,.88); border: 1px solid var(--line-2); border-radius: var(--r); padding: 1rem 1.1rem; cursor: pointer; backdrop-filter: blur(12px); transition: border-color .2s; }
.home-more:hover { border-color: var(--accent-line); }
.home-more strong { font-family: var(--display); font-size: 1.05rem; display: block; }
.home-more-arrow { font-size: 1.4rem; color: var(--accent); }
.cases, .board { max-width: 1100px; margin: 0 auto; padding: 1.5rem 1.25rem 3rem; }
.filters { display: grid; gap: .5rem; margin: 0 0 1.1rem; }
.chips { display: flex; flex-wrap: wrap; gap: .4rem; }
.chip { font: inherit; font-family: var(--display); font-size: .74rem; font-weight: 600; color: var(--ink-2); background: var(--s1); border: 1px solid var(--line-2); border-radius: 999px; padding: .32rem .8rem; cursor: pointer; }
.chip.on { color: #05231a; background: var(--accent); border-color: transparent; }
.board .dash-board { margin-bottom: 0; }
.plan-badge.inline { margin-left: 0; font-size: .7rem; }
.progress .dash-specialties { margin-top: 2rem; }
.account .dash-cards { margin-bottom: .4rem; }

/* ---- Monitor de constantes: nunca por debajo del pie de la escena ---- */
.clinical-monitor { top: 22%; right: 2.5%; width: 240px; max-height: calc(78% - 4.4rem); overflow: auto; padding: .6rem .75rem; display: none; grid-template-columns: 1fr 1fr; gap: .1rem .7rem; align-content: start; }
.illustrated .clinical-monitor:not([hidden]) { display: grid; }
.clinical-monitor .monitor-title { grid-column: 1 / -1; }
.clinical-monitor div { padding: .22rem 0; }
.clinical-monitor div span { font-size: .56rem; }
.clinical-monitor strong { font-size: .92rem; }
@media (max-width: 640px) {
  .clinical-monitor, .animated-mode .clinical-monitor { top: 20%; right: 1.5%; width: 40%; max-width: 160px; max-height: calc(80% - 4.6rem); grid-template-columns: 1fr; padding: .45rem .55rem; }
  .clinical-monitor strong { font-size: .8rem; }
}

/* ---- Monitor con vida: trazado que se desplaza al ritmo del pulso y alarmas visuales ---- */
.clinical-monitor .monitor-title { display: flex; align-items: center; gap: .35rem; }
.mon-beat { width: .45rem; height: .45rem; border-radius: 50%; background: var(--accent); box-shadow: 0 0 6px var(--accent); animation: monbeat var(--beat, 1s) ease-out infinite; }
.mon-strips { grid-column: 1 / -1; display: grid; gap: .15rem; margin: -.2rem 0 .3rem; }
.mon-strip { width: 100%; height: 34px; display: block; overflow: hidden; background: rgba(0,0,0,.35); border-radius: 4px; }
.mon-strip.pleth { height: 22px; }
.mon-strip polyline { fill: none; stroke: var(--accent); stroke-width: 1.6; vector-effect: non-scaling-stroke; stroke-linejoin: round; filter: drop-shadow(0 0 2px rgba(46,230,168,.7)); }
.mon-strip.pleth polyline { stroke: var(--info); filter: drop-shadow(0 0 2px rgba(124,188,255,.7)); }
.mon-scroll { animation: monscroll var(--loop, 4s) linear infinite; }
@keyframes monscroll { to { transform: translateX(calc(var(--w) * -1px)); } }
@keyframes monbeat { 0% { transform: scale(1); opacity: 1; } 18% { transform: scale(1.7); opacity: .7; } 40% { transform: scale(1); opacity: 1; } 100% { transform: scale(1); opacity: 1; } }
.clinical-monitor div.hr strong { display: inline-block; animation: monbump var(--beat, 1s) ease-out infinite; transform-origin: left center; }
@keyframes monbump { 0% { transform: scale(1); } 15% { transform: scale(1.08); } 35% { transform: scale(1); } 100% { transform: scale(1); } }
.clinical-monitor div.alarm strong { color: var(--danger); text-shadow: 0 0 8px rgba(255,107,107,.6); animation: monblink 1.2s steps(2, start) infinite; }
.clinical-monitor div.alarm span::after { content: " · alarma"; color: var(--danger); }
@keyframes monblink { to { opacity: .35; } }
.clinical-monitor.has-alarm { border-color: rgba(255,107,107,.7); box-shadow: 0 0 0 1px rgba(255,107,107,.3), 0 0 26px rgba(255,107,107,.25); }
/* El trazado del monitor dibujado en la escena también sigue la frecuencia. */
@media (prefers-reduced-motion: no-preference) { .trace { animation-duration: calc(var(--beat, 1s) * 2); } }
/* Pausa (botón) y preferencia del sistema: todo quieto pero visible. */
.animation-paused .mon-scroll, .animation-paused .mon-beat, .animation-paused .clinical-monitor div.hr strong, .animation-paused .clinical-monitor div.alarm strong, .animation-paused .trace { animation: none !important; }
@media (prefers-reduced-motion: reduce) { .mon-scroll, .mon-beat, .clinical-monitor div.hr strong, .clinical-monitor div.alarm strong { animation: none !important; } }

/* ---- Cronómetro discreto en la cabecera de la escena ---- */
.hud-timer { cursor: pointer; font: inherit; color: inherit; min-width: auto; align-items: center; flex-direction: row; gap: .4rem; }
.hud-timer .k { font-size: .85rem; letter-spacing: 0; }
.hud-timer[aria-pressed="true"] { border-color: var(--accent-line); }
.hud-timer[aria-pressed="true"] .k { color: var(--accent); }

/* ---- Caso piloto guiado (ADR 0023) ---- */
.tour-card { position: fixed; left: 50%; bottom: 1rem; transform: translateX(-50%); z-index: 60; width: min(440px, calc(100vw - 2rem)); background: rgba(8,18,29,.96); border: 1px solid var(--accent-line); border-radius: var(--r); padding: .9rem 1rem 1rem; box-shadow: var(--shadow), 0 0 0 1px rgba(46,230,168,.15); backdrop-filter: blur(12px); display: grid; gap: .35rem; }
.tour-head { display: flex; justify-content: space-between; align-items: center; gap: .6rem; }
.tour-head .eyebrow { margin: 0; }
.tour-skip { font: inherit; font-size: .78rem; color: var(--muted); background: none; border: 0; cursor: pointer; padding: 0; }
.tour-skip:hover { color: var(--ink); }
.tour-card strong { font-family: var(--display); font-size: 1.05rem; }
.tour-card p { margin: 0; color: var(--ink-2); font-size: .92rem; line-height: 1.45; }
.tour-actions { display: flex; justify-content: flex-end; margin-top: .3rem; }
.tour-target { outline: 3px solid var(--accent) !important; outline-offset: 4px; border-radius: 10px; box-shadow: 0 0 0 6px rgba(46,230,168,.18), 0 0 26px rgba(46,230,168,.35) !important; transition: box-shadow .3s; }
@media (prefers-reduced-motion: no-preference) { .tour-card { animation: tourin .35s var(--ease); } @keyframes tourin { from { opacity: 0; transform: translate(-50%, 12px); } to { opacity: 1; transform: translate(-50%, 0); } } }
@media (max-width: 640px) { .tour-card { bottom: .6rem; } }
body.with-tour main { padding-bottom: 15rem; }
/* ---------- Revisión guiada del caso: una idea clínica por pantalla ---------- */
.result { max-width:1120px;margin:0 auto;padding:clamp(1rem,3vw,2.5rem); }
.debrief-deck { position:relative;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;height:calc(100vh - 118px);min-height:610px;scroll-margin-top:76px;overflow:hidden;border:1px solid #6af5d542;border-top:3px solid var(--accent);background:linear-gradient(145deg,#102330 0%,#08131d 70%);box-shadow:0 28px 90px #0008; }
.deck-progress { display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1rem clamp(1rem,3vw,2rem);border-bottom:1px solid #6af5d526;background:#06121bd9; }
.deck-progress p { margin:0; }.deck-progress .eyebrow { color:var(--accent);font-family:var(--mono);font-size:.58rem;letter-spacing:.16em; }.case-label { margin-top:.22rem!important;color:var(--ink-2);font-size:.82rem; }
.deck-meta { display:flex;align-items:center;gap:.7rem;flex:none;font-family:var(--mono);font-size:.7rem;color:var(--warm); }
.deck-meta span+span { padding-left:.7rem;border-left:1px solid var(--line-2); }
.slide-dots { display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:.45rem;padding:.75rem clamp(1rem,3vw,2rem) 0; }
.slide-dots button { height:4px;padding:0;border:0;border-radius:0;background:#8fb6c42b;cursor:pointer;transition:background .2s,transform .2s; }
.slide-dots button.active { background:var(--accent);box-shadow:0 0 14px #6af5d54f; }.slide-dots button:focus-visible { outline:2px solid var(--warm);outline-offset:4px; }
.debrief-slides { min-height:0;overflow-y:auto;overflow-x:hidden;scrollbar-color:#6af5d555 transparent; }
.debrief-slide { padding:clamp(1.8rem,4vw,3.4rem) clamp(1.25rem,6vw,5.5rem) 2.5rem; }
.debrief-slide.active { animation:debrief-in .35s ease-out; }.debrief-slide[hidden] { display:none; }
@keyframes debrief-in { from { opacity:0;transform:translateX(18px); } to { opacity:1;transform:none; } }
.slide-kicker { margin:0 0 .75rem;color:var(--warm);font-family:var(--mono);font-size:.65rem;letter-spacing:.18em;text-transform:uppercase; }
.debrief-slide h1,.debrief-slide h2 { max-width:860px;margin:0;font-family:var(--display);font-size:clamp(2rem,5vw,3.7rem);line-height:1.03;letter-spacing:-.045em; }
.slide-intro,.story-lead { max-width:780px;color:var(--ink-2);line-height:1.65; }.story-lead { margin:1.15rem 0;font-size:clamp(1rem,2vw,1.18rem); }
.diagnosis-reveal { max-width:900px;margin-top:1.7rem;padding:1.25rem 1.45rem;border-left:4px solid var(--accent);background:linear-gradient(90deg,#163f3b,#10242e); }
.diagnosis-reveal>span,.tutor-note>span { display:block;margin-bottom:.35rem;color:var(--accent);font-family:var(--mono);font-size:.6rem;letter-spacing:.14em;text-transform:uppercase; }
.diagnosis-reveal>strong { display:block;color:#fff;font-family:var(--display);font-size:clamp(1.3rem,3vw,2.05rem);line-height:1.2; }.diagnosis-reveal p { margin:.6rem 0 0;color:#c7d9df;line-height:1.55; }
.story-timeline { max-width:920px;margin:1.6rem 0 0;padding:0;list-style:none; }
.story-timeline li { position:relative;display:grid;grid-template-columns:22px 1fr;gap:.9rem;padding:0 0 1rem; }.story-timeline li:not(:last-child)::before { content:"";position:absolute;left:7px;top:16px;bottom:0;width:1px;background:#6af5d54a; }
.timeline-marker { position:relative;z-index:1;width:15px;height:15px;margin-top:.2rem;border:3px solid #0d202b;background:var(--accent);box-shadow:0 0 0 1px #6af5d570; }.story-timeline li.missed .timeline-marker { background:var(--warm); }.story-timeline li.success .timeline-marker { box-shadow:0 0 16px #6af5d590; }
.story-timeline strong { color:#fff;font-size:.95rem; }.story-timeline p { margin:.12rem 0;color:var(--ink-2);font-size:.88rem;line-height:1.45; }.story-timeline small { display:block;color:var(--muted);font-size:.74rem;line-height:1.4; }
.clue-list { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem;max-width:960px;margin:1.7rem 0 0;padding:0;list-style:none; }
.clue-list li { min-height:96px;padding:1rem 1.1rem;border:1px solid var(--line-2);border-left:4px solid var(--accent);background:#0c1c28; }.clue-list li.missed { border-left-color:var(--warm);background:#241d16; }
.clue-list span,.decision-item>span { display:block;margin-bottom:.45rem;color:var(--accent);font-family:var(--mono);font-size:.57rem;letter-spacing:.08em;text-transform:uppercase; }.clue-list .missed span,.decision-item.missed>span,.decision-item.warning>span { color:var(--warm); }
.clue-list strong { color:var(--ink);font-size:.9rem;line-height:1.42; }
.decision-columns { display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:1.5rem; }.decision-columns h3 { margin:0 0 .65rem;color:var(--warm);font-family:var(--mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase; }
.decision-list { display:grid;gap:.6rem; }.decision-item { padding:.9rem 1rem;border:1px solid var(--line-2);border-left:4px solid #7592a2;background:#0b1a25; }.decision-item.success { border-left-color:var(--accent); }.decision-item.missed,.decision-item.warning { border-left-color:var(--warm); }.decision-item.warning { background:#211b16; }
.decision-item strong { display:block;color:#fff;font-size:.93rem;line-height:1.32; }.decision-item p { margin:.35rem 0 0;color:var(--muted);font-size:.78rem;line-height:1.45; }
.learning-summary { display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:1.4rem; }.summary-column { padding:1rem 1.15rem;border:1px solid var(--line-2);background:#0b1a25; }.summary-column.success-summary { border-top:3px solid var(--accent); }.summary-column.error-summary { border-top:3px solid var(--warm); }
.summary-column h3 { margin:0 0 .7rem;font-size:.95rem; }.summary-column ul { margin:0;padding-left:1.1rem; }.summary-column li { margin:.38rem 0;color:var(--ink-2);font-size:.82rem;line-height:1.45; }.success-summary li::marker { color:var(--accent); }.error-summary li::marker { color:var(--warm); }
.coach-card { margin-top:.8rem;padding:.85rem 1.1rem;border-left:4px solid var(--warm);background:#2a2116; }.coach-card>span { display:block;color:var(--warm);font-family:var(--mono);font-size:.57rem;letter-spacing:.12em;text-transform:uppercase; }.coach-card strong { display:block;margin:.3rem 0;color:#fff;font-size:1rem; }.coach-card p { margin:0;color:#d8c9b4;font-size:.8rem; }
.tutor-note { margin-top:.7rem;padding:.8rem 1rem;border:1px solid #6af5d542;background:#0d2429; }.tutor-note p { margin:.25rem 0;color:var(--ink-2);font-size:.8rem;line-height:1.45; }
.score-pills { display:flex;gap:.5rem;margin-top:.8rem;flex-wrap:wrap; }.score-pills span { padding:.5rem .7rem;border:1px solid #6af5d53d;background:#091923;color:var(--muted);font-family:var(--mono);font-size:.65rem; }.score-pills strong { color:var(--accent);font-size:.86rem; }
.slide-navigation { display:flex;justify-content:space-between;align-items:center;padding:.9rem clamp(1rem,3vw,2rem);border-top:1px solid #6af5d526;background:#06121bf2; }.slide-navigation #slide-next { margin-left:auto; }
.secondary-review { margin-top:1rem;border:1px solid var(--line-2);background:#091721; }.secondary-review>summary { padding:1rem 1.2rem;cursor:pointer;color:var(--ink-2);font-size:.85rem; }.secondary-review-body { display:grid;gap:1.5rem;padding:0 1.2rem 1.2rem; }.secondary-review-body h3 { margin:0 0 .65rem;font-size:.95rem; }
/* ---- Diapositiva 1: el veredicto (estrellas, rango y puntuación) ---- */
.verdict-stars { margin:.4rem 0 .9rem;font-size:clamp(2.6rem,8vw,4.6rem);line-height:1;letter-spacing:.12em; }
.verdict-stars span { display:inline-block;color:var(--warm);opacity:0; }
.verdict-stars span.off { color:#3b5462; }
.verdict-title { margin:0!important; }
.verdict-sub { max-width:720px;margin:.9rem 0 1.4rem;color:var(--ink-2);font-size:clamp(1rem,2vw,1.15rem);line-height:1.6; }
.verdict-achievements { display:flex;gap:.45rem;margin-top:1rem;flex-wrap:wrap; }
.ach-chip { padding:.42rem .7rem;border:1px solid var(--accent-line);background:var(--accent-soft);color:var(--ink);font-family:var(--mono);font-size:.68rem; }
@media(prefers-reduced-motion:no-preference) {
  .verdict-stars span { animation:star-pop .5s var(--ease) forwards; }
  .verdict-stars span:nth-child(1) { animation-delay:.12s; } .verdict-stars span:nth-child(2) { animation-delay:.3s; } .verdict-stars span:nth-child(3) { animation-delay:.48s; }
  @keyframes star-pop { from { opacity:0;transform:scale(.4) rotate(-18deg); } 60% { transform:scale(1.18) rotate(4deg); } to { opacity:1;transform:none; } }
}
@media(prefers-reduced-motion:reduce) { .verdict-stars span { opacity:1; } }

/* ---- Diapositiva 3: los tres desenlaces, con el que ocurrió delante ---- */
.branch-list { display:grid;gap:.7rem;max-width:940px;margin-top:1.5rem; }
.branch { padding:1rem 1.15rem;border:1px solid var(--line-2);border-left:4px solid #7592a2;background:#0b1a25;opacity:.62; }
.branch.reached { opacity:1;border-color:#6af5d542; }
.branch.good.reached { border-left-color:var(--accent);background:#102c2b; }
.branch.partial.reached { border-left-color:var(--warm);background:#241d16; }
.branch.poor.reached { border-left-color:var(--danger);background:#28181a; }
.branch-tag { display:block;margin-bottom:.4rem;color:var(--muted);font-family:var(--mono);font-size:.57rem;letter-spacing:.12em;text-transform:uppercase; }
.branch.reached .branch-tag { color:var(--warm); }
.branch strong { display:block;color:#fff;font-size:.95rem; }
.branch.reached strong { font-size:1.08rem; }
.branch p { margin:.35rem 0 0;color:var(--ink-2);font-size:.85rem;line-height:1.55; }

/* ---- Diapositiva 7: los avisos de seguridad, ya no bajo un desplegable ---- */
.safety-alerts { max-width:940px;margin:1.4rem 0 0; }
.safety-alerts h3 { margin:0 0 .6rem;color:var(--warm);font-family:var(--mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase; }
.safety-alerts.grave h3 { color:var(--danger); }
/* ---- Diapositiva 2: el diagnóstico tapado hasta que el alumno se moja ---- */
.recall-gate { max-width:900px;margin-top:1.7rem;padding:1.25rem 1.45rem;border:1px dashed #6af5d54d;background:#0c1c28; }
.recall-gate>span { display:block;margin-bottom:.35rem;color:var(--warm);font-family:var(--mono);font-size:.6rem;letter-spacing:.14em;text-transform:uppercase; }
.recall-gate>strong { display:block;color:#fff;font-family:var(--display);font-size:clamp(1.15rem,2.4vw,1.6rem);line-height:1.25; }
.recall-gate>p { margin:.55rem 0 1rem;color:var(--ink-2);font-size:.88rem;line-height:1.5; }
.diagnosis-reveal:focus { outline:2px solid var(--warm);outline-offset:3px; }
.diagnosis-reveal:focus:not(:focus-visible) { outline:none; }
.dx-hit { margin:.5rem 0 0!important;font-family:var(--mono);font-size:.7rem;letter-spacing:.06em;text-transform:uppercase; }
.dx-hit.hit { color:var(--accent); } .dx-hit.miss { color:var(--warm); }

/* ---- Diapositiva 4: el eslabón que faltó y el contraste con el experto ---- */
.coach-card.turning-clear { border-left-color:var(--accent);background:#102c2b; }
.coach-card.turning-clear>span { color:var(--accent); } .coach-card.turning-clear p { color:var(--ink-2); }
#turning-point { margin:1.5rem 0 0;max-width:920px; }
#expert-toggle { margin-top:1.1rem; }
.expert-line { margin:.5rem 0 0!important;padding:.55rem .75rem;border-left:2px solid var(--warm);background:#1d1810;color:#d8c9b4!important;font-size:.82rem!important;line-height:1.5; }
.expert-line>span { display:block;margin-bottom:.2rem;color:var(--warm);font-family:var(--mono);font-size:.55rem;letter-spacing:.12em;text-transform:uppercase; }
@media(prefers-reduced-motion:reduce) { .debrief-slide.active { animation:none; } }
@media(max-width:700px) {
  .result { padding:.65rem; }.debrief-deck { height:calc(100vh - 92px);min-height:530px; }.debrief-slide { padding:1.6rem 1rem 1.4rem; }.debrief-slide h1,.debrief-slide h2 { font-size:2rem; }
  .clue-list,.decision-columns,.learning-summary { grid-template-columns:1fr; }.clue-list li { min-height:0; }.diagnosis-reveal { padding:1rem; }.story-timeline p { font-size:.82rem; }
  .slide-navigation .btn { padding:.62rem .75rem;font-size:.73rem; }.result-actions { margin-top:1rem; }.result-actions .btn { width:100%; }
}

/* ---------- Avatar del alumno (ADR 0026) ---------- */
.profile-card {
  display: grid; grid-template-columns: auto 1fr; gap: 1rem; align-items: center;
  background: rgba(8,18,29,.86); border: 1px solid var(--line-2); border-radius: var(--r);
  padding: 1rem 1.1rem; margin: .8rem 0 0; backdrop-filter: blur(12px);
}
.profile-avatar { line-height: 0; }
.profile-avatar .avatar-svg { width: 96px; height: 96px; display: block; }
.profile-id { min-width: 0; }
.profile-name { display: block; font-family: var(--display); font-size: 1.25rem; line-height: 1.2; overflow-wrap: anywhere; }
.profile-name.unset { color: var(--muted); font-weight: 500; }
.profile-role { display: block; font-size: .78rem; color: var(--accent); font-family: var(--mono); letter-spacing: .04em; margin-bottom: .5rem; }
.profile-stats { display: flex; flex-wrap: wrap; gap: .3rem 1.1rem; list-style: none; margin: 0; padding: 0; }
.profile-stats li { display: flex; align-items: baseline; gap: .35rem; }
.profile-stats b { font-family: var(--display); font-size: 1.15rem; color: var(--ink); }
.profile-stats span { font-size: .72rem; color: var(--ink-2); font-family: var(--mono); }
.profile-edit { grid-column: 1 / -1; justify-self: start; }
@media (min-width: 720px) {
  .profile-card { grid-template-columns: auto 1fr auto; }
  .profile-edit { grid-column: auto; justify-self: end; }
}

/* Editor: la vista previa manda, los controles se desplazan al lado. */
/* Una sola zona que se desplaza (el cuerpo): el título y los botones no se van
   de la pantalla ni en un móvil apaisado. */
.account-avatar { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
.account-avatar-art { line-height: 0; }
.account-avatar-art .avatar-svg { width: 84px; height: 84px; }
.avatar-overlay { z-index: 45; }   /* por debajo de la confirmación: se ve encima del editor */
.avatar-card { max-width: 760px; text-align: left; padding: 1.4rem 1.3rem 1.1rem; display: flex; flex-direction: column; max-height: calc(100dvh - 2rem); overflow: hidden; }
.avatar-card .display { font-size: clamp(1.3rem, 3.4vw, 1.8rem); }
.avatar-editor-body { display: grid; grid-template-columns: 1fr; gap: 1rem; margin-top: .9rem; flex: 1; min-height: 0; overflow-y: auto; padding-right: .25rem; }
.avatar-preview { display: flex; flex-direction: column; align-items: center; gap: .2rem; text-align: center; background: var(--s0); border: 1px solid var(--line); border-radius: var(--r); padding: 1rem; }
.avatar-preview-art { line-height: 0; }
.avatar-preview-art .avatar-svg { width: 132px; height: 132px; }
.avatar-preview-name { font-family: var(--display); font-size: 1.05rem; overflow-wrap: anywhere; }
.avatar-controls { display: flex; flex-direction: column; gap: .8rem; min-width: 0; }
.avatar-hint { margin: -.4rem 0 0; }
.avatar-group { border: 0; border-top: 1px solid var(--line); margin: 0; padding: .7rem 0 0; }
.avatar-group legend { font-family: var(--display); font-size: .82rem; font-weight: 600; padding: 0; color: var(--ink); }
.avatar-options { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .45rem; }
.avatar-option { position: relative; display: inline-flex; }
.avatar-option input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.avatar-option-face {
  display: inline-flex; align-items: center; min-height: 40px; padding: .45rem .85rem;
  border: 1px solid var(--line-2); border-radius: 999px; background: var(--s2);
  font-size: .82rem; color: var(--ink-2); cursor: pointer; transition: border-color .15s, background .15s, color .15s;
}
.avatar-option input:checked + .avatar-option-face { border-color: var(--accent); background: var(--accent-soft); color: var(--ink); }
.avatar-option input:focus-visible + .avatar-option-face { outline: 2px solid var(--accent); outline-offset: 2px; }
.avatar-option input:disabled + .avatar-option-face { cursor: not-allowed; opacity: .55; border-style: dashed; }
.avatar-lock { color: var(--warm); font-size: .72rem; margin-left: .3rem; }
.avatar-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .6rem; margin-top: 1rem; }
.avatar-actions .btn { min-height: 44px; }
@media (min-width: 760px) {
  .avatar-editor-body { grid-template-columns: 230px 1fr; align-items: start; }
  .avatar-preview { position: sticky; top: 0; }
}
@media (max-width: 480px) {
  .avatar-card { padding: 1.2rem 1rem 1rem; }
  .avatar-option-face { min-height: 44px; }
  .avatar-actions .btn { flex: 1; }
}


/* Consulta continua: respuesta y acciones comparten la misma zona de lectura. */
.consultation-response { background:#102431; border-block:1px solid #7cbcff38; padding:.75rem 1.2rem; min-height:0; }
.response-heading { display:flex;justify-content:space-between;gap:1rem;color:var(--info);font:600 .65rem var(--mono);text-transform:uppercase;letter-spacing:.08em;margin-bottom:.6rem; }
.response-live { color:var(--muted); }
.response-latest { max-height:24vh;overflow:auto;overscroll-behavior:contain; }
.consultation-response .bubble-layer { position:static;transform:none;width:100%;display:block;pointer-events:auto; }
.consultation-response .bubble { border:0;padding:0;background:none;box-shadow:none;backdrop-filter:none;border-radius:0; }
.consultation-response .bubble::after { display:none; }
.consultation-response .bubble .say { font-size:.95rem;overflow:visible; }
.consultation-response .bubble .facts { max-height:none;overflow:visible; }
.response-history { margin-top:.55rem;font-size:.78rem;color:var(--ink-2); }
.response-history summary { cursor:pointer; }
.response-history ol { list-style:none;padding:0;max-height:20vh;overflow:auto; }
.response-history li { padding:.65rem 0;border-top:1px solid var(--line-2); }
.response-history .bubble { animation:none; }
.hq-tabs { display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:.6rem; }
.hq-tab,.encounter-nav button { font:inherit;font-size:.78rem;color:var(--ink-2);background:#0a1922;border:1px solid var(--line-2);padding:.6rem .75rem;border-radius:8px;cursor:pointer; }
.hq-tab[aria-pressed=true],.encounter-nav button[aria-pressed=true] { background:#193b4d;border-color:var(--info);color:#fff; }
.hq-tab:focus-visible,.encounter-nav button:focus-visible { outline:2px solid var(--info);outline-offset:3px; }
.hq-list { display:grid;grid-template-columns:1fr;gap:.45rem; }
.hq-list .chip { text-align:left;justify-content:flex-start;line-height:1.4;white-space:normal; }
.asked-toggle { margin-bottom:.65rem; }
.encounter-nav { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.4rem;margin:.75rem 0; }
.dyn-scene h3 { margin:.35rem 0; }
.dyn-scene p { font-size:.87rem; }
.dyn-decide { position:sticky;bottom:0;z-index:3;background:#102431;padding:.75rem;border-top:1px solid var(--info); }
.dyn-decide button { width:100%;white-space:normal; }
.encounter-tools .tool-body { padding:.7rem; }
@media (min-width:1000px) {
  #screen-case { display:grid;grid-template-columns:minmax(0,1fr) minmax(430px,.95fr);height:calc(100dvh - 64px);min-height:600px; }
  #screen-case > .stage { height:100%;min-height:0;max-height:none;width:100%;border-right:1px solid var(--line-2); }
  #screen-case > .deck { display:flex;flex-direction:column;min-width:0;min-height:0;padding:0;overflow:hidden; }
  #screen-case .deck-head { flex:none;padding:.65rem 1rem;gap:.45rem;margin:0; }
  #screen-case .deck-hint { font-size:.7rem; }
  #screen-case .deck-body { flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:.9rem 1rem; }
  #screen-case .deck-actions { flex:none;padding:.7rem 1rem; }
  #screen-case .consultation-response { flex:none; }
  #screen-case .stage .objective { max-width:60%; }
  #screen-case .scene-location { display:none; }
}
@media (max-width:999px) {
  #screen-case > .stage { height:32dvh;min-height:230px;max-height:340px; }
  #screen-case > .deck { padding:0; }
  #screen-case .consultation-response { position:sticky;top:58px;z-index:8;padding:.65rem 1rem; }
  #screen-case .response-latest { max-height:23dvh; }
  #screen-case .deck-body { padding:.8rem 1rem; }
  #screen-case .deck-head { padding:.65rem 1rem; }
  #screen-case .stage .objective { width:auto;max-width:52%;padding:.55rem; }
  #screen-case .stage .objective strong { font-size:.78rem; }
  #screen-case .stage .scene-location { display:none; }
  #screen-case .clinical-monitor { max-height:48%; }
  .encounter-nav button { padding:.65rem .25rem;font-size:.73rem; }
}

.response-details { margin-top:.5rem;font-size:.78rem;color:var(--muted); }
.response-details summary { cursor:pointer; }
@media(max-width:999px) { #screen-case .consultation-response { top:66px; } }

/* El alumno puede plegar la respuesta sin perderla mientras sigue el caso. */
.consultation-response > summary { list-style:none;cursor:pointer;user-select:none; }
.consultation-response > summary::-webkit-details-marker { display:none; }
.consultation-response > summary:focus-visible { outline:2px solid var(--info);outline-offset:3px; }
.consultation-response:not([open]) { padding-block:.7rem; }
.consultation-response:not([open]) > summary { margin-bottom:0; }
.response-heading-end { display:flex;align-items:center;gap:.75rem; }
.response-chevron { display:inline-block;transition:transform .18s ease;font-size:.9rem; }
.consultation-response:not([open]) .response-chevron { transform:rotate(-90deg); }
.consultation-response.has-new .response-live { color:var(--warm); }
@media(prefers-reduced-motion:reduce) { .response-chevron { transition:none; } }


/* El caso presenta una decisión principal y opciones de investigar en el mismo lugar. */
#screen-case .deck-head { min-height:48px;display:flex;align-items:center;gap:1rem; }
#screen-case .steps { align-items:center; }
#screen-case .steps li:not([aria-current="step"]) { display:none; }
#screen-case .steps li[aria-current="step"] { font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;border:0;background:transparent;color:var(--warm);padding:0; }
#screen-case .deck-hint { display:none; }
#screen-case .deck-body { padding:clamp(1.1rem,2vw,1.8rem); }
#screen-case .dyn { border:0;background:transparent;padding:0;margin:0;gap:1.15rem; }
#screen-case .dyn-scene { padding:0 0 1rem;border-bottom:1px solid var(--line-2); }
#screen-case .dyn-scene .eyebrow { display:block;color:var(--warm);font-size:.65rem;margin-bottom:.55rem; }
#screen-case .dyn-scene h3 { display:block;text-transform:none;letter-spacing:-.03em;font-family:var(--display);font-size:clamp(1.45rem,2.5vw,1.95rem);font-weight:700;color:var(--ink);line-height:1.17;margin:0 0 .65rem; }
#screen-case .dyn-scene p { font-size:1rem;line-height:1.55;color:var(--ink-2);max-width:55ch; }
#screen-case .dyn-head { margin-top:-.15rem;align-items:center; }
#screen-case .dyn-clock { color:var(--muted);font-size:.72rem; }
#screen-case .dyn-clock b { color:var(--warm);font-size:.95rem; }
.dyn-status-short { font-size:.7rem;font-family:var(--mono);color:var(--accent); }
.dyn-status-short.tone-worsening,.dyn-status-short.tone-critical { color:var(--warm); }
.dyn-investigate,.dyn-review { border:1px solid var(--line-2);border-radius:12px;background:#10212c; }
.dyn-investigate > summary,.dyn-review > summary { list-style:none;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.9rem 1rem;cursor:pointer;font-weight:600;font-size:.9rem; }
.dyn-investigate > summary::-webkit-details-marker,.dyn-review > summary::-webkit-details-marker { display:none; }
.dyn-investigate > summary::after,.dyn-review > summary::after { content:"+";color:var(--accent);font-size:1.2rem;line-height:1; }
.dyn-investigate[open] > summary::after,.dyn-review[open] > summary::after { content:"−"; }
.dyn-investigate > summary:focus-visible,.dyn-review > summary:focus-visible { outline:2px solid var(--accent);outline-offset:3px; }
.dyn-investigate > summary small { margin-left:auto;font-size:.68rem;font-weight:400;color:var(--muted); }
.dyn-investigate-body { padding:0 1rem 1rem;display:grid;gap:1rem; }
.dyn-investigate .dyn-reassess { padding:.8rem 0;border-top:1px solid var(--line-2); }
.dyn-investigate .dyn-reassess p { line-height:1.45; }
.dyn-investigate .encounter-tools { gap:.55rem; }
.dyn-investigate .tool > summary { padding:.8rem .9rem;background:#0c1a24; }
.dyn-decision-area { padding:.3rem 0 0; }
.dyn-decision-area h4 { color:var(--warm);font-family:var(--mono);font-size:.67rem!important;letter-spacing:.12em;text-transform:uppercase;margin-bottom:.5rem!important; }
.dyn-decision-area .dyn-block > p { margin:0 0 1rem;color:var(--muted);font-size:.82rem; }
.dyn-decision-area .dyn-choices { grid-template-columns:1fr;gap:.65rem; }
.dyn-decision-area .dyn-choice { min-height:56px;align-items:center;padding:.85rem 1rem;background:#0f2230;border-color:#7895a140;border-radius:10px;font-size:.93rem;transition:background .15s,border-color .15s,transform .15s; }
.dyn-decision-area .dyn-choice:hover:not(.off) { background:#183846;border-color:var(--accent-line);transform:translateY(-1px); }
.dyn-decision-area .dyn-choice:has(input:checked) { background:#154238;border-color:var(--accent); }
.dyn-decision-area .dyn-choice input { width:19px;height:19px;margin:0 1rem 0 0;flex:none; }
.dyn-decision-area .dyn-choice.off { background:transparent; }
.dyn-decision-area .dyn-more { margin-top:1rem; }
.dyn-review > .dyn-block { padding:0 1rem 1rem; }
.dyn-review .dyn-timeline { border-top:1px solid var(--line-2);padding-top:1rem; }
#screen-case .deck-actions:has(.dyn-decide) { border-top:1px solid var(--accent-line);background:#0b1e29;box-shadow:0 -12px 28px #040d16b0; }
#screen-case .deck-actions .dyn-decide { flex:1;position:static;padding:0;border:0;background:transparent; }
#screen-case .deck-actions .dyn-decide button { min-height:51px;font-size:.93rem; }
#screen-case .consultation-response { background:#102431; }
#screen-case .consultation-response > summary { margin:0; }
#screen-case .response-latest { margin-top:.65rem; }
#screen-case .consultation-response:not([open]) { padding-block:.6rem; }
@media(max-width:999px) {
  #screen-case .deck-body { padding:1.1rem 1rem; }
  #screen-case .dyn-scene h3 { font-size:1.45rem; }
  #screen-case .dyn-investigate > summary small { display:none; }
  #screen-case .deck-head { min-height:42px; }
}
@media(prefers-reduced-motion:reduce) { .dyn-decision-area .dyn-choice { transition:none; } }

/* Antes de la primera acción, la respuesta ocupa solo una línea. */
#screen-case .consultation-response:has(#response-empty:not([hidden])) .response-latest { display:none; }
#screen-case .deck-actions .dyn-decide .btn.ghost { background:#10232d;color:var(--ink-2);border:1px solid var(--line-2);box-shadow:none; }

@media(max-width:999px) {
  #screen-case .deck-actions { position:sticky;bottom:0;z-index:10;background:#0b1e29;border-top:1px solid var(--line-2);box-shadow:0 -10px 22px #050e16c9; }
  #screen-case .deck-actions:has(.dyn-decide) { padding:.7rem 1rem max(.7rem,env(safe-area-inset-bottom)); }
}

#screen-case .deck-actions:has(.dyn-decide) .deck-spacer { display:none; }
#screen-case .deck-actions:has(.dyn-decide) .dyn-decide { min-width:0; }

/* El siguiente paso ocupa siempre el mismo lugar en todos los recorridos. */
#screen-case .deck-actions:has(#advance:not([hidden])),
#screen-case .deck-actions:has(#finish:not([hidden])) { border-top-color:var(--accent-line);background:#0b1e29;box-shadow:0 -12px 28px #040d16b0; }
#screen-case .deck-actions #advance:not([hidden]),
#screen-case .deck-actions #finish:not([hidden]) { min-height:51px;min-width:210px;font-size:.93rem;white-space:normal; }
@media(max-width:999px) {
  #screen-case .deck-actions #advance:not([hidden]),
  #screen-case .deck-actions #finish:not([hidden]) { flex:1;min-width:0; }
}

/* ===== Sala clínica (room.js): casos evolutivos piloto =====
   Una sola zona de interacción junto al paciente. Mientras dura, el escenario
   clásico pierde sus capas (objetivo, HUD, puntos, monitor) y el panel clásico
   se oculta: no compiten con la atención. */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
#screen-case.in-room { display: block; height: auto; min-height: 0; }
#screen-case.in-room > .deck, #screen-case.in-room > .drawer, #screen-case.in-room > .drawer-scrim { display: none; }
#screen-case.in-room .stage { width: 100%; height: auto; max-height: none; margin: 0; aspect-ratio: 4 / 3; min-height: 0; border: 1px solid var(--line-2); border-radius: var(--r); }
#screen-case.in-room .stage-top, #screen-case.in-room .hotspots, #screen-case.in-room .stage-bottom,
#screen-case.in-room .scene-location { display: none; }
/* El monitor animado se queda en la sala: es la forma de ver las constantes medidas. */
#screen-case.in-room .clinical-monitor { top: 4%; right: 3%; max-height: 92%; }
.room { padding: 1rem clamp(1rem, 3vw, 2rem) 1.5rem; }
.room[hidden] { display: none; }
.room-head { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1.25rem; margin-bottom: 1rem; }
.room-id { flex: 1 1 14rem; }
.room-kicker { margin: 0; color: var(--accent); font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; font-weight: 600; }
.room-id h2 { margin: .15rem 0 0; font-family: var(--display); font-size: clamp(1.25rem, 2.4vw, 1.6rem); color: var(--ink); }
.room-clock { margin: 0; padding: .55rem .9rem; border: 1px solid var(--line-2); border-radius: var(--r-sm); background: var(--s1); color: var(--ink-2); font-size: .9rem; }
.room-clock b { color: var(--ink); font-family: var(--mono); font-size: 1.05rem; }
.room-log-open { min-height: 44px; }
.room-grid { display: grid; gap: 1.25rem; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 900px) { .room-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); align-items: start; } }
.room-patient { display: grid; gap: .9rem; }
.room-state { display: grid; gap: .75rem; }
.room-status { padding: .75rem .95rem; border: 1px solid var(--line-2); border-left: 5px solid var(--muted); border-radius: var(--r-sm); background: var(--s1); }
.room-status p { margin: 0; color: var(--ink-2); line-height: 1.5; }
.room-status .room-status-label { color: var(--ink); font-weight: 700; margin-bottom: .25rem; }
.room-status .room-status-label span { font-weight: 600; color: var(--ink-2); }
.room-status.tone-improving { border-left-color: var(--accent); }
.room-status.tone-worsening, .room-status.tone-critical { border-left-color: var(--warm); }
.room-vitals { list-style: none; margin: 0; padding: 0; display: grid; gap: .4rem; }
.room-vitals li { display: grid; grid-template-columns: minmax(8rem, auto) 1fr auto; gap: .5rem; align-items: baseline; padding: .5rem .75rem; border-radius: var(--r-sm); background: var(--s1); border: 1px solid var(--line); }
.room-vital-label { color: var(--ink-2); font-size: .88rem; }
.room-vital-value { color: var(--ink); }
.room-vital-value b { font-family: var(--mono); font-size: 1rem; }
.room-trend, .room-vital-time, .room-change { color: var(--ink-2); font-size: .8rem; }
.room-main { display: grid; gap: 1rem; padding: 1rem; border: 1px solid var(--line-2); border-radius: var(--r); background: var(--s0); }
.room-nav { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: .5rem; }
.room-nav[hidden], .room-nav-btn[hidden] { display: none; }
.room-help { padding: .8rem 1rem; border: 1px solid var(--info); border-radius: var(--r-sm); background: var(--s1); }
.room-help p { margin: 0 0 .35rem; font-weight: 700; color: var(--ink); }
.room-help ul { margin: 0 0 .6rem; padding-left: 1.1rem; color: var(--ink-2); line-height: 1.5; font-size: .9rem; }
.room-notice { margin: 0; padding: .6rem .8rem; border-left: 4px solid var(--warm); border-radius: var(--r-sm); background: var(--warm-soft); color: var(--ink); }
.room-goal { margin: .5rem 0 0; color: var(--ink-2); font-size: .92rem; }
.room-field { display: grid; gap: .4rem; }
.room-field > label { font-weight: 700; color: var(--ink); }
.room-field textarea { width: 100%; box-sizing: border-box; padding: .65rem .8rem; border: 1px solid var(--line-2); border-radius: var(--r-sm); background: var(--s1); color: var(--ink); font: inherit; line-height: 1.5; resize: vertical; }
.room-plan label { min-height: 44px; align-items: center; }
.room-response-results { margin-top: .4rem !important; }
.room-log-foot { padding: .8rem 1.1rem; border-top: 1px solid var(--line-2); }
.room-log-foot:has(> [hidden]:only-child) { display: none; }
.room-nav-btn { min-height: 52px; padding: .6rem .5rem; border: 1px solid var(--line-2); border-radius: var(--r-sm); background: var(--s2); color: var(--ink); font: inherit; font-weight: 600; font-size: .98rem; cursor: pointer; }
.room-nav-btn:hover { border-color: var(--accent-line); }
.room-nav-btn[aria-pressed="true"] { background: var(--accent-soft); border-color: var(--accent); box-shadow: inset 0 -3px 0 var(--accent); }
.room-badge { display: inline-block; min-width: 1.4rem; margin-left: .3rem; padding: 0 .35rem; border-radius: 999px; background: var(--accent); color: #05231a; font-size: .78rem; }
.room-panel { display: grid; gap: .85rem; align-content: start; min-height: 12rem; }
.room-panel-head { display: grid; gap: .35rem; justify-items: start; }
.room-panel-head h3 { margin: 0; font-family: var(--display); font-size: 1.2rem; color: var(--ink); text-transform: none; letter-spacing: normal; }
.room-log-body h3, .room-conseq-block h4 { font-family: var(--font); }
.room-panel-head h3:focus { outline: none; }
.room-panel-head h3:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.room-back { min-height: 40px; }
.room-cost, .room-muted { margin: 0; color: var(--ink-2); font-size: .88rem; line-height: 1.5; }
.room-situation p { margin: 0 0 .5rem; color: var(--ink); font-size: 1.02rem; line-height: 1.55; }
.room-ask { margin: 0; color: var(--ink-2); }
.room-callout { padding: .85rem 1rem; border: 1px solid var(--warm); border-radius: var(--r-sm); background: var(--warm-soft); }
.room-callout p { margin: 0; color: var(--ink); line-height: 1.5; }
.room-callout .room-callout-title { font-weight: 700; margin-bottom: .25rem; }
.room-tabs { display: flex; flex-wrap: wrap; gap: .4rem; }
.room-tab { min-height: 40px; padding: .4rem .8rem; border: 1px solid var(--line-2); border-radius: 999px; background: transparent; color: var(--ink-2); font: inherit; font-size: .88rem; cursor: pointer; }
.room-tab[aria-pressed="true"] { border-color: var(--accent); color: var(--ink); background: var(--accent-soft); }
.room-options { list-style: none; margin: 0; padding: 0; display: grid; gap: .45rem; }
.room-option { display: flex; align-items: center; justify-content: space-between; gap: .75rem; width: 100%; min-height: 48px; padding: .6rem .85rem; border: 1px solid var(--line-2); border-radius: var(--r-sm); background: var(--s1); color: var(--ink); font: inherit; text-align: left; cursor: pointer; }
.room-option:hover:not(:disabled) { border-color: var(--accent-line); }
.room-option:disabled { cursor: not-allowed; color: var(--ink-2); }
.room-option small { color: var(--ink-2); font-size: .8rem; }
.room-option > span small { display: block; }
.room-option.done { border-style: dashed; }
.room-done::before { content: "✓ "; }
.room-choice { justify-content: flex-start; }
.room-choice input { width: 22px; height: 22px; flex: none; accent-color: var(--accent); }
.room-choice.off { cursor: not-allowed; }
.room-choice.off .room-choice-label { color: var(--ink-2); }
.room-choice:has(input:focus-visible) { outline: 2px solid var(--accent); outline-offset: 2px; }
.room-choice:has(input:checked) { border-color: var(--accent); background: var(--accent-soft); }
.room-note { display: block; margin-top: .15rem; }
.room-draft { padding: .75rem .95rem; border-radius: var(--r-sm); background: var(--s2); }
.room-draft-title { margin: 0 0 .4rem; font-weight: 700; color: var(--ink); }
.room-draft-list { list-style: none; margin: 0 0 .5rem; padding: 0; display: grid; gap: .25rem; color: var(--ink); }
.room-draft-list li span { color: var(--accent); font-weight: 700; }
.room-details summary { cursor: pointer; min-height: 32px; display: inline-flex; align-items: center; color: var(--info); font-size: .88rem; }
.room-details summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 4px; }
.room-details dl { margin: .4rem 0 0; }
.room-details dt { font-weight: 700; color: var(--ink); font-size: .9rem; }
.room-details dd, .room-details p { margin: 0 0 .5rem; color: var(--ink-2); font-size: .88rem; line-height: 1.5; }
.room-qa { margin: 0; display: grid; gap: .65rem; }
.room-qa > div { display: grid; gap: .2rem; }
.room-qa dt { font-family: var(--display); font-size: .68rem; font-weight: 600; text-transform: uppercase; letter-spacing: .14em; color: var(--muted); }
.room-qa-a dt { color: var(--warm); }
.room-qa dd { margin: 0; color: var(--ink); }
.room-qa-q dd { font-family: var(--display); font-weight: 700; font-size: 1.02rem; line-height: 1.4; }
.room-qa-a { padding-left: .8rem; border-left: 2px solid var(--line-2); }
.room-qa-a dd { font-size: 1rem; line-height: 1.6; }
.room-response-time { margin: .55rem 0 0 !important; color: var(--ink-2) !important; font-size: .82rem; }
.room-log-body li:has(> .room-qa) { list-style: none; margin-left: -1.1rem; padding: .55rem 0; border-bottom: 1px solid var(--line); }
.room-status-note { color: var(--ink-2) !important; font-size: .88rem; }
.room-inline-action { justify-self: start; min-height: 44px; }
.room-plan-group { border: 0; margin: 0 0 .75rem; padding: 0; min-width: 0; }
.room-plan-group legend { padding: 0; margin-bottom: .4rem; color: var(--ink-2); font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.room-plan-item { display: grid; gap: .2rem; }
.room-plan-item .room-details { padding-left: .9rem; }
.room-short { display: none; }
/* Los valores se ven en el monitor; la lista completa queda para el lector de
   pantalla y, en móvil con un selector abierto, como chips compactos. */
.room-vitals-list { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.room-vitals-when { margin: 0; color: var(--ink-2); font-size: .88rem; }
.room-trends { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem; }
.room-trends li { padding: .35rem .6rem; border: 1px solid var(--line-2); border-radius: var(--r-sm); background: var(--s1); color: var(--ink-2); font-size: .85rem; }
.room-trends b { color: var(--ink); font-family: var(--mono); }
.room-response { padding: .75rem .95rem; border-left: 4px solid var(--info); border-radius: var(--r-sm); background: var(--s2); }
.room-response[hidden] { display: none; }
.room-response p { margin: 0 0 .3rem; color: var(--ink); line-height: 1.5; }
.room-response .room-response-who { font-weight: 700; }
.room-response small { color: var(--ink-2); font-weight: 400; margin-left: .35rem; }
.room-response ul { margin: 0; padding-left: 1.1rem; color: var(--ink); }
.room-consequence { display: grid; gap: .8rem; }
.room-conseq-block h4 { margin: 0 0 .35rem; color: var(--ink-2); font-size: .8rem; letter-spacing: .08em; text-transform: uppercase; }
.room-conseq-block p, .room-conseq-block li { margin: 0; color: var(--ink); line-height: 1.5; }
.room-conseq-block ul { margin: 0; padding-left: 1.1rem; }
.room-conseq-block .room-vitals { padding-left: 0; }
/* Pie fijo: la acción principal siempre a la vista, aunque la lista sea larga.
   Va en el flujo, así que al final de la lista nunca tapa la última opción. */
.room-foot { position: sticky; bottom: 0; z-index: 6; display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; margin: 0 -1rem -1rem; padding: .8rem 1rem; background: var(--s0); border-top: 1px solid var(--line-2); border-radius: 0 0 var(--r) var(--r); box-shadow: 0 -12px 24px rgba(0, 0, 0, .35); }
.room-foot:empty { display: none; }
.room-foot-summary { flex: 1 1 100%; margin: 0; color: var(--ink-2); font-size: .9rem; }
.room-primary { min-height: 52px; font-size: 1rem; flex: 1 1 16rem; }
.room-secondary { min-height: 48px; flex: 0 1 auto; }
html:has(#screen-case.in-room) { scroll-padding-top: 88px; scroll-padding-bottom: calc(var(--room-foot-h, 0px) + 12px); }
/* Pantallas bajas (zoom al 200 %, móvil en horizontal): pie compacto. */
@media (max-height: 560px) {
  .room-foot { padding: .5rem .75rem; gap: .4rem; }
  .room-foot-summary { font-size: .82rem; }
  .room-primary, .room-secondary { min-height: 44px; flex: 1 1 auto; font-size: .92rem; }
}
.room-log-scrim { position: fixed; inset: 0; z-index: 45; background: rgba(0,0,0,.55); }
.room-log { position: fixed; top: 0; right: 0; bottom: 0; z-index: 46; width: min(480px, 100%); display: flex; flex-direction: column; background: var(--s0); border-left: 1px solid var(--line-2); box-shadow: var(--shadow); }
.room-log[hidden], .room-log-scrim[hidden] { display: none; }
.room-log-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 1.1rem; border-bottom: 1px solid var(--line-2); }
.room-log-head h2 { margin: 0; font-size: 1.1rem; }
.room-log-head .icon-btn { width: 44px; height: 44px; }
.room-log-body { overflow-y: auto; padding: .5rem 1.1rem 1.5rem; }
.room-log-body h3 { margin: 1rem 0 .4rem; font-size: .95rem; color: var(--accent); }
.room-log-body p, .room-log-body li { color: var(--ink); line-height: 1.5; font-size: .92rem; }
.room-log-body ul { margin: 0; padding-left: 1.1rem; display: grid; gap: .35rem; }
.room-log-body li span { display: block; color: var(--ink-2); }
.room-log-body small { color: var(--ink-2); font-family: var(--mono); margin-right: .3rem; }
@media (max-width: 640px) {
  .room { padding: .75rem 1rem 1.25rem; }
  .room-head { gap: .5rem; }
  .room-clock { padding: .45rem .7rem; font-size: .82rem; }
  .room-log-open { padding: .45rem .8rem; }
  .room-nav { grid-auto-flow: row; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .room-vitals li { grid-template-columns: 1fr auto; }
  .room-vital-label { grid-column: 1 / -1; }
  #screen-case.in-room .stage { aspect-ratio: 16 / 10; }
  .room-primary { flex-basis: 100%; }
  /* Con un selector abierto o una consecuencia, la imagen se reduce y los datos
     clave (nombre, minuto, situación y constantes) quedan compactos arriba. */
  #screen-case.in-room .room.is-focused .stage { aspect-ratio: auto; height: 88px; }
  #screen-case.in-room .room.is-focused .clinical-monitor { display: none; }
  .room.is-focused .room-vitals-when, .room.is-focused .room-trends { display: none; }
  .room.is-focused .room-vitals-list { position: static; width: auto; height: auto; margin: 0; overflow: visible; clip: auto; white-space: normal; }
  .room.is-focused .room-patient { gap: .5rem; }
  .room.is-focused .room-status { padding: .45rem .7rem; }
  .room.is-focused .room-status p:not(.room-status-label) { display: none; }
  .room.is-focused .room-vitals { display: flex; flex-wrap: wrap; gap: .3rem; }
  .room.is-focused .room-vitals li { display: inline-flex; gap: .3rem; padding: .25rem .5rem; }
  .room.is-focused .room-vital-time, .room.is-focused .room-trend { display: none; }
  .room.is-focused .room-long { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .room.is-focused .room-short { display: inline; }
  .room.is-focused .room-nav { grid-auto-flow: column; grid-template-columns: none; grid-auto-columns: minmax(0, 1fr); }
  .room.is-focused .room-nav-btn { min-height: 44px; padding: .35rem .2rem; font-size: .85rem; }
}
@media (prefers-reduced-motion: reduce) { .room-option, .room-nav-btn { transition: none; } }

/* Acontecimiento lineal en la sala clásica (ADR 0038): la misma tarjeta de
 * consecuencia que la sala urgente. */
.dyn-event { display: grid; gap: .9rem; }
.dyn-event h3 { margin: 0; font-size: 1.1rem; }
.dyn-event h3:focus { outline: none; }
.dyn-event h3:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }

/* Paso de tratamiento de los casos lineales (ADR 0040): una sola cosa en pantalla. */
.dyn-step { display: grid; gap: .8rem; }
.dyn-step h3 { margin: 0; font-size: 1.15rem; }
.dyn-step h3:focus { outline: none; }
.dyn-step h3:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.dyn-step p { margin: 0; line-height: 1.5; }
.dyn-step-choices { border: 0; margin: 0; padding: 0; display: grid; gap: .45rem; }
.dyn-step-choices legend { font-weight: 700; margin-bottom: .4rem; }
.dyn-lapse { margin: 0; font-weight: 700; }
.dyn-now { margin: 0; line-height: 1.5; }
.dyn-figures { list-style: none; margin: 0; padding: 0; display: grid; gap: .35rem; }
.dyn-figures li { display: flex; justify-content: space-between; gap: 1rem; padding: .45rem .7rem; border-radius: var(--r-sm); background: var(--s1); border: 1px solid var(--line); }
.dyn-fig-label { color: var(--ink-2); }
.dyn-fig-value b { font-family: var(--mono); }
.dyn-notes { margin: 0; padding-left: 1.1rem; line-height: 1.5; }

/* ADR 0041: detalle del plan, estimación de probabilidad e idea para recordar. */
.plan-entry { display: grid; gap: .15rem; }
.plan-detail summary { cursor: pointer; font-size: .85rem; color: var(--ink-2); padding-left: 1.9rem; }
.plan-detail p { margin: .25rem 0 .4rem 1.9rem; font-size: .88rem; color: var(--ink-2); line-height: 1.45; }
.estimate { display: grid; gap: .8rem; }
.estimate h3 { margin: 0; }
.estimate h3:focus { outline: none; }
.estimate p { margin: 0; line-height: 1.5; }
.estimate-options { border: 0; margin: 0; padding: 0; display: grid; gap: .45rem; }
.take-home { margin-bottom: 1rem; }