/* ---------- ficha header ---------- */
.eyebrow{display:flex;align-items:center;flex-wrap:wrap;gap:6px;font-size:var(--fs-tag);
  text-transform:uppercase;letter-spacing:.08em;color:var(--muted);
  font-weight:600;margin-bottom:10px;}
.eyebrow a{color:inherit;text-decoration:none;transition:color .15s;}
.eyebrow a:hover{color:var(--ink);text-decoration:underline;}
.eyebrow .bc-sep{opacity:.4;margin:0 2px;}
.titlewrap{display:flex;align-items:center;gap:20px;margin-bottom:8px;}
.organ{width:96px;height:96px;flex:none;object-fit:contain;
  filter:drop-shadow(0 3px 6px rgba(0,0,0,.22));
  transition:transform .2s ease;}
@media (hover: hover) and (pointer: fine) {
  .organ:hover{transform:scale(1.05);}
}
@media (prefers-reduced-motion: reduce) {
  .organ{transition:none;}
  .organ:hover{transform:none;}
}
h1{font-family:var(--serif);font-size:2rem;font-weight:600;
  line-height:1.18;color:var(--ink);margin-bottom:4px;
  min-width:0;text-wrap:balance;}
.synon{font-size:13.5px;color:var(--muted);margin-bottom:20px;font-style:italic;}

/* ---------- chip de seguridad clínica y alcance ---------- */
.clinical-scope-chip {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 12px;
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  padding: 7px 12px;
  font-size: 11.5px;
  line-height: 1.4;
  color: var(--muted);
  margin-bottom: 24px;
}
.clinical-scope-chip .csc-badge {
  display: inline-flex;
  align-items: center;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .06em;
  font-size: 10px;
  background: color-mix(in srgb, var(--accent-ink) 14%, transparent);
  color: var(--accent-ink);
  padding: 2px 7px;
  border-radius: var(--r-pill);
}
.clinical-scope-chip span:not(.csc-badge) {
  flex: 1 1 240px;
}
.clinical-scope-chip .csc-btn {
  background: none;
  border: none;
  color: var(--accent-ink);
  font-weight: 600;
  font-size: 11px;
  cursor: pointer;
  padding: 2px 4px;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.clinical-scope-chip .csc-btn:hover {
  color: var(--ink);
}

/* ---------- «de un vistazo» ---------- */
.glance{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);
  padding:18px 22px;margin-bottom:36px;box-shadow:var(--shadow-2);}
.gh{font-family:var(--serif);font-weight:600;font-size:14px;
  color:var(--accent-ink);text-transform:uppercase;letter-spacing:.07em;
  margin-bottom:10px;}
.glance ul{padding-left:20px;}
.glance li{font-size:var(--fs-card);margin-bottom:6px;color:var(--ink);}

/* ---------- secciones ---------- */
section{margin-bottom:44px;}
h2{font-family:var(--serif);font-size:1.35rem;font-weight:600;
  color:var(--ink);border-bottom:1.5px solid var(--line);
  padding-bottom:6px;margin-bottom:16px;display:flex;align-items:baseline;gap:10px;}
/* --accent-ink, no --accent: sobre --bg el acento daba 2,12 y era el peor
   contraste de toda la página. Con la variante entintada, 5,38. */
.num{font-family:var(--mono);font-size:13px;color:var(--accent-ink);font-weight:500;}
h3{font-family:var(--serif);font-size:1.05rem;font-weight:600;
  margin:22px 0 10px;color:var(--ink);}
p{margin-bottom:12px;}
/* El párrafo de entrada va en --read itálica, no en --serif: en la serif de
   lectura respira mejor que en la de títulos. Ya renderizaba así, pero por un
   accidente de cascada (`.view p` le ganaba en especificidad); queda escrito
   para que sea una decisión y no una casualidad. */
.lede{font-family:var(--read);font-style:italic;color:var(--muted);
  font-size:15px;margin-bottom:14px;}

/* ---------- tablas ----------
   `separate` + `overflow:hidden` para que el radio recorte de verdad las
   esquinas (con `collapse` los bordes se escapan del redondeo). */
table{width:100%;border-collapse:separate;border-spacing:0;
  margin:18px 0 24px;font-size:var(--fs-card);background:var(--surface);
  border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;}
thead th{background:var(--surface-2);text-align:left;
  padding:11px 14px;font-weight:600;font-size:var(--fs-meta);
  color:var(--ink);letter-spacing:.01em;line-height:1.35;
  border-bottom:1px solid var(--line-strong);}
td{padding:10px 14px;vertical-align:top;line-height:1.55;
  border-top:1px solid var(--line);}
tbody tr:first-child td{border-top:none;}
/* la primera columna es la clave de lectura de la fila: se destaca */
tbody td:first-child{font-weight:500;color:var(--ink);}
tbody tr:nth-child(even){background:var(--zebra);}
tbody tr:hover{background:var(--accent-soft);}
/* tabla-mapa: encabezado de grupo dentro de una tabla */
td.grp{background:var(--surface-2);font-weight:600;color:var(--ink);
  text-transform:uppercase;letter-spacing:.05em;font-size:var(--fs-tag);}
tbody tr:hover td.grp{background:var(--surface-2);}

/* ---------- tira de valores clave ----------
   Grid en vez de flex: con `flex:1` la última fila estiraba las tarjetas
   sobrantes a lo ancho y quedaban de tamaños distintos entre filas. */
.vals{display:grid;grid-template-columns:repeat(auto-fit,minmax(152px,1fr));
  gap:10px;margin:16px 0 22px;}
.val{background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r-sm);padding:11px 14px;}
.val .k{font-size:var(--fs-tag);color:var(--muted);margin-bottom:3px;line-height:1.35;}
.val .n{font-family:var(--mono);font-size:15px;font-weight:600;color:var(--ink);}
/* escalón intermedio (p. ej. los valores de prediabetes): antes se distinguía
   sólo por opacidad, que no comunica «zona de alerta». Ahora lleva el ámbar. */
.val.pre{border-left:3px solid var(--pearl);background:var(--pearl-soft);}
.val.pre .n{color:var(--pearl);}

/* ---------- callouts ---------- */
.note{display:flex;gap:13px;border-radius:var(--r-md);padding:14px 16px;
  margin:20px 0;border:1px solid;border-left-width:3px;}
.note.pearl{background:var(--pearl-soft);border-color:var(--pearl);}
.note.mnemo{background:var(--mnemo-soft);border-color:var(--mnemo);}
.note.crit{background:var(--crit-soft);border-color:var(--crit);}
/* el borde fino de los otros tres lados va más suave que la barra lateral */
.note.pearl{border-top-color:color-mix(in srgb,var(--pearl) 34%,transparent);
  border-right-color:color-mix(in srgb,var(--pearl) 34%,transparent);
  border-bottom-color:color-mix(in srgb,var(--pearl) 34%,transparent);}
.note.mnemo{border-top-color:color-mix(in srgb,var(--mnemo) 34%,transparent);
  border-right-color:color-mix(in srgb,var(--mnemo) 34%,transparent);
  border-bottom-color:color-mix(in srgb,var(--mnemo) 34%,transparent);}
.note.crit{border-top-color:color-mix(in srgb,var(--crit) 34%,transparent);
  border-right-color:color-mix(in srgb,var(--crit) 34%,transparent);
  border-bottom-color:color-mix(in srgb,var(--crit) 34%,transparent);}
.ic{flex:none;width:23px;height:23px;border-radius:50%;display:flex;
  align-items:center;justify-content:center;font-weight:700;
  font-size:var(--fs-meta);line-height:1;margin-top:1px;}
.note.pearl .ic{background:var(--pearl);color:#fff;}
.note.mnemo .ic{background:var(--mnemo);color:#fff;}
.note.crit .ic{background:var(--crit);color:#fff;}
.bd{font-size:var(--fs-card);line-height:1.55;}
.lbl{display:block;font-weight:600;font-size:var(--fs-tag);text-transform:uppercase;
  letter-spacing:.07em;margin-bottom:4px;}
.note.pearl .lbl{color:var(--pearl);}
.note.mnemo .lbl{color:var(--mnemo);}
.note.crit .lbl{color:var(--crit-ink);}

/* ---------- valor diagnóstico en rojo (corte / criterio clave) ---------- */
.rojo{color:var(--crit-ink);font-weight:700;}
.rojo.mono{font-family:var(--mono);}

/* ---------- 💎 5 Perlas de la Guardia (cierre de ficha) ---------- */
.datos-clave{background:var(--surface);border:1px solid var(--line);
  border-left:4px solid var(--pearl);border-radius:var(--r-md);
  padding:16px 20px 10px;margin:28px 0 12px;box-shadow:var(--shadow-2);}
/* El texto va en --pearl-ink (3,51 -> 6,12 sobre --surface). --pearl sigue
   pintando la barra lateral de 4px de arriba: la identidad no cambia, cambia
   lo que se puede leer. */
.datos-clave h3{font-family:var(--serif);font-size:1.14rem;font-weight:600;
  color:var(--pearl-ink);margin:0 0 12px;display:flex;align-items:center;gap:8px;
  text-transform:none;letter-spacing:0;}
.datos-clave ol{list-style:none;counter-reset:dato;padding:0;margin:0;}
.datos-clave li{counter-increment:dato;position:relative;padding:9px 0 9px 40px;
  border-top:1px solid var(--line);font-size:14px;line-height:1.55;color:var(--ink);}
.datos-clave li:first-child{border-top:none;}
/* Antes era #fff sobre --pearl: fallaba en los dos temas (3,76 claro / 2,27
   oscuro, donde --pearl es un dorado claro y quedaba blanco sobre dorado). Se
   pasa al mismo esquema que ya usa .tribunal li::before —fondo -soft, texto
   -ink— que es la única de cinco opciones medidas que sirve en ambos temas
   (5,32 / 6,41). De paso saca el #fff hardcodeado. */
.datos-clave li::before{content:counter(dato);position:absolute;left:0;top:9px;
  width:26px;height:26px;border-radius:50%;
  background:var(--pearl-soft);color:var(--pearl-ink);
  font-family:var(--mono);font-weight:700;font-size:13px;
  display:flex;align-items:center;justify-content:center;}

/* ---------- ⚖️ Lo que toma el Tribunal (banco de preguntas de final) ---------- */
.tribunal{background:var(--surface);border:1px solid var(--line);
  border-left:4px solid var(--tangelo);border-radius:var(--r-md);
  padding:16px 20px 12px;margin:28px 0 12px;box-shadow:var(--shadow-2);}
/* --tangelo-ink en el texto (2,60 -> 5,19 sobre --surface). La barra lateral
   sigue en --tangelo. */
.tribunal h3{font-family:var(--serif);font-size:1.14rem;font-weight:600;
  color:var(--tangelo-ink);margin:0 0 10px;display:flex;align-items:baseline;
  gap:10px;flex-wrap:wrap;text-transform:none;letter-spacing:0;}
.tribunal h3 .tsub{font-family:var(--sans);font-size:11px;font-weight:600;
  color:var(--muted);text-transform:uppercase;letter-spacing:.08em;}
/* Preguntas numeradas en vez de ❓ y 💡: el emoji le daba al bloque un aire
   efectista que no corresponde al registro del resto de la ficha. */
.tribunal ul{list-style:none;padding:0;margin:0;counter-reset:preg;}
.tribunal li{counter-increment:preg;position:relative;padding:11px 0 11px 32px;
  border-top:1px solid var(--line);font-size:var(--fs-card);line-height:1.55;color:var(--ink);}
.tribunal li:first-child{border-top:none;}
.tribunal li::before{content:counter(preg);position:absolute;left:0;top:11px;
  width:21px;height:21px;border-radius:50%;
  /* Este es el par que la auditoría medía en 2,33 y atribuía al título del
     bloque; el 2,33 era de acá. Con -ink: 4,65. */
  background:var(--tangelo-soft);color:var(--tangelo-ink);
  font-family:var(--mono);font-size:var(--fs-micro);font-weight:700;
  display:flex;align-items:center;justify-content:center;}
.tribunal .q{font-weight:700;color:var(--ink);margin:0 0 3px;}
.tribunal .a{margin:0;color:var(--muted);}

/* ---------- subfichas de fármacos ---------- */
.drugs{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px;margin:16px 0 24px;}
.drug{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:16px 18px;}
/* gap + flex:none en la etiqueta: sin eso, un nombre de fármaco largo
   aplastaba la clase farmacológica hasta partirla en varias líneas */
.drug .top{display:flex;align-items:baseline;justify-content:space-between;
  gap:9px;margin-bottom:4px;}
.drug h4{font-family:var(--serif);font-size:1rem;font-weight:600;color:var(--ink);
  min-width:0;overflow-wrap:anywhere;}
.cls{flex:none;font-size:var(--fs-micro);color:var(--muted);font-weight:500;
  background:var(--surface-2);border:1px solid var(--line);
  border-radius:var(--r-xs);padding:2px 7px;white-space:nowrap;}
.ex{font-size:var(--fs-meta);color:var(--accent-ink);margin-bottom:11px;font-style:italic;}

/* ---------- listas de definición (tarjetas de fármaco y de valvulopatía) ----------
   Antes: float con el término a 88px fijos. Hay términos de hasta 19 caracteres
   («Hidralazina+nitrato») que desbordaban ese ancho y se solapaban con la
   definición. Con grid la columna se adapta al término más largo de CADA lista,
   y `fit-content(40%)` evita que un término largo aplaste la definición. */
dl{display:grid;grid-template-columns:fit-content(40%) minmax(0,1fr);
  gap:7px 14px;margin:0;font-size:var(--fs-meta);align-items:baseline;}
dt{font-weight:600;color:var(--muted);}
dd{margin:0;color:var(--ink);line-height:1.55;}
dd.warn{color:var(--crit-ink);}
/* en pantallas angostas la definición pasa debajo del término */
@media(max-width:520px){
  dl{grid-template-columns:1fr;gap:1px 0;}
  dt{margin-top:9px;}
  dt:first-child{margin-top:0;}
}

/* ---------- fichas de valvulopatía (una por entidad) ---------- */
.vgrid{display:flex;flex-direction:column;gap:16px;margin:18px 0 10px;}
.vcard{background:var(--surface);border:1px solid var(--line);
  border-left:4px solid var(--accent);border-radius:var(--r-md);padding:15px 18px;}
.vcard.dia{border-left-color:var(--pearl);}
.vcard-head{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap;margin-bottom:12px;}
.vcard-head h4{font-family:var(--serif);font-size:1.15rem;font-weight:600;color:var(--ink);}
.vcard-head .ab{font-family:var(--mono);font-size:var(--fs-tag);color:var(--faint);}
.vbadge{flex:none;font-size:var(--fs-micro);font-weight:600;letter-spacing:.05em;
  text-transform:uppercase;border-radius:var(--r-xs);padding:2px 7px;white-space:nowrap;}
.vbadge.sys{background:var(--accent-soft);color:var(--accent-ink);}
.vbadge.dia{background:var(--pearl-soft);color:var(--pearl);}
.vcard-body{display:flex;gap:20px;flex-wrap:wrap;align-items:flex-start;}
.vcard-viz{flex:none;width:250px;}
.vcard-viz svg{width:100%;height:auto;display:block;}
.vcard-viz .cap{font-size:var(--fs-tag);color:var(--faint);text-align:center;
  margin-top:4px;line-height:1.4;}
.vcard-facts{flex:1 1 248px;min-width:0;}
.vcard-facts dl{gap:6px 12px;}
.vkey{margin-top:13px;border-radius:var(--r-sm);padding:9px 13px;
  font-size:var(--fs-meta);line-height:1.55;
  background:var(--surface-2);border:1px solid var(--line);}
.vkey .lbl{font-family:var(--mono);font-size:var(--fs-micro);text-transform:uppercase;
  letter-spacing:.06em;font-weight:600;color:var(--accent-ink);margin-right:7px;}
.vkey.crit{background:var(--crit-soft);border-color:var(--crit);}
.vkey.crit .lbl{color:var(--crit-ink);}

/* ---------- mapa coronario del SCA (corazón + derivaciones) ---------- */
.scacor{margin:14px 0 6px;}
.scacor-viz{background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r-md);padding:10px 8px 6px;flex:none;}
.scacor-viz svg{width:360px;max-width:100%;height:auto;display:block;}
.sca-terr{fill:var(--surface-2);stroke:var(--bg);stroke-width:3;transition:fill .25s;}
.sca-terr.on{fill:var(--crit);}
.sca-hole{fill:var(--surface);stroke:var(--line);stroke-width:1.5;}
.sca-vd{fill:var(--surface-2);stroke:var(--line);stroke-width:1.3;opacity:.65;}
.sca-wlbl{font-family:var(--sans);font-size:11px;font-weight:600;fill:var(--muted);
  pointer-events:none;transition:fill .25s;}
.sca-wlbl.lit{fill:#fff;}
.sca-chlbl{font-family:var(--serif);font-size:13px;font-weight:600;fill:var(--faint);pointer-events:none;}
.derv-spoke{stroke:var(--line);stroke-width:1.5;transition:stroke .2s;}
.derv rect{fill:var(--surface);stroke:var(--muted);stroke-width:1.4;transition:fill .2s,stroke .2s;}
.derv text{font-family:var(--mono);font-size:12px;font-weight:600;fill:var(--muted);pointer-events:none;}
.derv.see rect{fill:var(--crit);stroke:var(--crit-ink);}
.derv.see text{fill:#fff;}
.derv.see .derv-spoke{stroke:var(--crit);stroke-width:2;}
.derv.mirror rect{fill:var(--sca-espejo);stroke:var(--sca-espejo-borde);}
.derv.mirror text{fill:#fff;}
.derv.mirror .derv-spoke{stroke:var(--sca-espejo);}
.derv.avr rect{stroke-dasharray:3 2;}
.scacor-legend{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;
  color:var(--muted);margin-top:8px;padding-left:2px;}
.scacor-legend .sw{display:inline-block;width:11px;height:11px;border-radius:3px;
  vertical-align:-1px;margin-right:5px;}

/* ---------- anatomía coronaria (vista anterior: árbol + corona de derivaciones) ---------- */
.scaanat{margin:16px 0 10px;}
.scaanat-viz{background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r-md);padding:10px 8px 6px;flex:none;max-width:100%;box-sizing:border-box;}
.scaanat-viz svg{width:430px;max-width:100%;height:auto;display:block;}
.sca-myo{fill:var(--surface-2);stroke:var(--line);stroke-width:1.5;}
.sca-aorta{fill:var(--crit-soft);stroke:var(--crit);stroke-width:1;opacity:.75;}
.sca-pa{fill:var(--sca-espejo);opacity:.24;stroke:var(--sca-espejo);stroke-width:1;}
.sca-chmb{fill:var(--faint);font-family:var(--mono);font-size:12px;font-weight:600;
  letter-spacing:.04em;pointer-events:none;opacity:.85;}
.scaart{fill:none;stroke-linecap:round;stroke-linejoin:round;
  stroke:var(--faint);stroke-width:6;cursor:pointer;
  transition:stroke .2s,stroke-width .2s,opacity .2s,filter .2s;}
.scaart.branch{stroke-width:3.2;pointer-events:none;}
.scaart:hover{stroke:var(--crit-ink);}
.scaart.dim{opacity:.7;}
.scaart.on{stroke:var(--crit);stroke-width:8.5;opacity:1;filter:drop-shadow(0 0 5px var(--crit));}
.scaart.on.branch{stroke:var(--crit);stroke-width:4.4;}
.scaart-lbl rect{fill:var(--surface);stroke:var(--line);stroke-width:1.3;
  transition:fill .2s,stroke .2s;}
.scaart-lbl .l1{font-family:var(--sans);font-size:13px;font-weight:700;fill:var(--muted);
  pointer-events:none;transition:fill .2s;}
.scaart-lbl .l2{font-family:var(--sans);font-size:9.5px;font-weight:600;fill:var(--faint);
  pointer-events:none;transition:fill .2s;}
.scaart-lbl .lead{stroke:var(--line);stroke-width:1.5;fill:none;transition:stroke .2s;}
.scaart-lbl.on rect{fill:var(--crit);stroke:var(--crit-ink);}
.scaart-lbl.on .l1,.scaart-lbl.on .l2{fill:#fff;}
.scaart-lbl.on .lead{stroke:var(--crit);}
.sca-freq{display:inline-block;font-family:var(--mono);font-size:11px;font-weight:600;
  text-transform:uppercase;letter-spacing:.05em;color:var(--crit-ink);background:var(--crit-soft);
  border:1px solid var(--crit);border-radius:var(--r-pill);padding:3px 10px;margin-bottom:10px;}
.sca-irr{font-size:13.5px;line-height:1.6;margin:2px 0 8px;color:var(--ink);}
.sca-arr{font-size:13px;line-height:1.55;color:var(--ink);background:var(--surface-2);
  border-left:3px solid var(--crit);border-radius:var(--r-xs);padding:8px 11px;margin:8px 0;}
.sca-xrow{display:flex;flex-wrap:wrap;align-items:center;gap:5px 9px;margin:2px 0 6px;}
.sca-xlbl{font-family:var(--mono);font-size:10.5px;font-weight:600;text-transform:uppercase;
  letter-spacing:.05em;color:var(--crit-ink);}
.sca-xgrp{display:inline-flex;align-items:center;gap:4px;}
.sca-xlead{display:inline-block;font-family:var(--mono);font-size:11px;font-weight:600;
  color:#fff;background:var(--crit);border-radius:var(--r-xs);padding:2px 6px;}
.sca-xwhy{font-size:11.5px;color:var(--muted);margin:0 4px 0 2px;}

/* ---------- cita ---------- */
.cite{font-size:var(--fs-tag);color:var(--faint);margin-top:12px;
  padding-top:8px;border-top:1px solid var(--line);}

/* ---------- analítica y tablas de laboratorio (fase 5) ---------- */
.lab-group{margin:18px 0 24px;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r-md);overflow:hidden;box-shadow:var(--shadow-1);}
.lab-summary{list-style:none;cursor:pointer;user-select:none;display:flex;align-items:center;
  gap:10px;padding:12px 18px;font-size:var(--fs-meta);font-weight:600;color:var(--ink);
  background:var(--surface-2);border-bottom:1px solid var(--line);transition:background .15s;}
.lab-summary::-webkit-details-marker{display:none;}
.lab-summary:hover{background:var(--line);}
.lab-summary .dot{width:9px;height:9px;border-radius:50%;background:var(--accent);flex:none;}
.lab-summary .lab-count{margin-left:auto;font-family:var(--mono);font-size:11px;color:var(--muted);font-weight:500;}
.lab-summary .chev{width:7px;height:7px;flex:none;border-right:2px solid var(--muted);
  border-bottom:2px solid var(--muted);transform:rotate(45deg);transition:transform .18s ease;margin-left:8px;}
.lab-group[open] .lab-summary .chev{transform:rotate(-135deg);}
.lab-body{padding:0;overflow-x:auto;}
.lab-table{width:100%;border-collapse:collapse;margin:0;border:none;border-radius:0;
  background:transparent;font-size:13.5px;}
.lab-table th{background:var(--surface-2);text-align:left;padding:9px 14px;font-size:11.5px;
  text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:600;
  border-bottom:1px solid var(--line-strong);}
.lab-table td{padding:10px 14px;border-top:1px solid var(--line);color:var(--ink);line-height:1.45;}
.lab-table tr:hover td{background:var(--accent-soft);}
.lab-test{font-weight:600;color:var(--ink);}
.lab-val{font-family:var(--mono);font-size:13.5px;font-weight:600;}
.lab-ref{font-family:var(--mono);font-size:12px;color:var(--muted);}
.lab-unit{font-size:12px;color:var(--faint);}

/* Badges de smart highlighting (no estridentes) */
.lab-badge-high{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;
  border-radius:var(--r-pill);font-family:var(--mono);font-size:12px;font-weight:700;
  background:var(--crit-soft);color:var(--crit-ink);
  border:1px solid color-mix(in srgb,var(--crit) 30%,transparent);}
.lab-badge-low{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;
  border-radius:var(--r-pill);font-family:var(--mono);font-size:12px;font-weight:700;
  background:var(--accent-soft);color:var(--accent-ink);
  border:1px solid color-mix(in srgb,var(--accent) 30%,transparent);}
.lab-badge-normal{display:inline-flex;align-items:center;font-family:var(--mono);
  font-size:12.5px;font-weight:600;color:var(--ink);}

