/* ==========================================================================
   B-17 · EL HOMÚNCULO
   --------------------------------------------------------------------------
   Se carga después de portada.css y paginas.css. Esta hoja solo pinta la
   cámara, la telemetría, las válvulas y el conducto psíquico.
   ========================================================================== */

.ente-body {
  --bio: #b7c07a;
  --bio-bright: #d7e0a1;
  --bio-dim: #6f7948;
  --fluid: #5f6b2b;
  --rust: #7b4b2c;
  --rust-dark: #35251a;
  --rust-light: #b07a4d;
  --line-bio: rgba(183, 192, 122, .28);
  --line-bio-dim: rgba(183, 192, 122, .13);
  --peligro: #d94b32;
  --frio: #7da6a0;
  background-color: #070907;
  background-image:
    radial-gradient(900px 640px at 50% 8%, rgba(120, 135, 65, .12), transparent 62%),
    radial-gradient(840px 620px at 100% 40%, rgba(123, 75, 44, .09), transparent 65%),
    radial-gradient(760px 520px at 0% 70%, rgba(80, 100, 50, .06), transparent 65%),
    linear-gradient(rgba(183, 192, 122, .022) 1px, transparent 1px),
    linear-gradient(90deg, rgba(183, 192, 122, .018) 1px, transparent 1px);
  background-size: auto, auto, auto, 52px 52px, 52px 52px;
}

.ente-body .crt {
  background-image:
    repeating-linear-gradient(0deg, rgba(0, 0, 0, .18) 0 1px, transparent 1px 3px),
    radial-gradient(125% 100% at 50% 50%, transparent 55%, rgba(0, 0, 0, .48) 100%);
  opacity: .55;
}
.ente-body .marco { border-color: rgba(183, 192, 122, .13); }
.ente-body .barra { border-bottom-color: rgba(183, 192, 122, .18); }
.ente-body .barra__hazard { opacity: .46; }
.ente-body .ticker { border-top-color: rgba(183, 192, 122, .1); }
.ente-body .ticker__track { color: var(--bio-dim); }
.ente-body a { color: var(--bio); }
.ente-body a:hover { color: var(--amber); }
.ente-body ::selection { background: var(--bio); color: #0a0b0e; }

.ente-page {
  width: min(1500px, calc(100vw - 28px));
  margin-inline: auto;
  padding: clamp(7px, 1vw, 12px) 0 clamp(42px, 6vw, 76px);
}

/* -------------------------------------------------------------------------- */
/* Cabecera de la sección                                                      */
/* -------------------------------------------------------------------------- */

.ente-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px 20px;
  min-height: 44px;
  margin-bottom: 7px;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--line-bio-dim);
}
.ente-hero__main { min-width: 0; flex: 1 1 auto; }
.ente-hero .eyebrow { margin: 0 0 2px; }
.ente-hero__line {
  display: flex;
  align-items: baseline;
  gap: 10px 20px;
  min-width: 0;
}
.ente-title {
  flex: 0 0 auto;
  margin: 0;
  color: var(--bone);
  font-family: var(--display);
  font-size: clamp(2.15rem, 3.3vw, 3rem);
  font-weight: 900;
  letter-spacing: -.06em;
  line-height: .76;
  text-transform: uppercase;
  transform: scaleX(.92);
  transform-origin: left bottom;
  text-shadow: 0 0 40px rgba(183, 192, 122, .07);
}
.ente-title__sub {
  color: var(--bio);
  font-family: var(--label);
  font-size: .23em;
  font-weight: 500;
  letter-spacing: .16em;
  vertical-align: .7em;
  white-space: nowrap;
}
.ente-lead {
  max-width: 72ch;
  margin: 0;
  color: #b7b5a4;
  font-size: .58rem;
  line-height: 1.5;
}
.ente-lead strong { color: var(--bio-bright); font-weight: 400; }

.ente-hero__status {
  display: flex;
  flex: 0 0 auto;
  border: 1px solid var(--line-bio-dim);
  background: rgba(11, 15, 11, .72);
}
.ente-hero__status div {
  min-width: 64px;
  padding: 4px 8px;
  border-right: 1px solid var(--line-bio-dim);
}
.ente-hero__status div:last-child { border-right: 0; }
.ente-hero__status span {
  display: block;
  color: var(--steel);
  font-size: .31rem;
  letter-spacing: .12em;
  white-space: nowrap;
}
.ente-hero__status b {
  color: var(--bone);
  font-family: var(--label);
  font-size: .58rem;
  font-weight: 600;
  letter-spacing: .05em;
  white-space: nowrap;
}

.ente-info-btn {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 6px;
  height: 31px;
  padding: 3px 8px;
  border: 1px solid var(--line-bio-dim);
  border-radius: 0;
  background: rgba(183, 192, 122, .035);
  color: var(--bio);
  font-family: var(--label);
  font-size: .38rem;
  letter-spacing: .1em;
  cursor: pointer;
}
.ente-info-btn:hover { border-color: var(--bio); background: rgba(183, 192, 122, .08); }
.ente-info-btn__icon {
  display: grid;
  place-items: center;
  width: 17px;
  height: 17px;
  border: 1px solid var(--line-bio);
  color: var(--bio);
  font-family: var(--mono);
  font-size: .52rem;
}

/* ---------- ficha / aviso ---------- */
.ficha {
  width: min(92vw, 720px);
  max-height: 86vh;
  margin: auto;
  padding: 0;
  border: 1px solid var(--line-bio);
  background: #0b0f0a;
  color: var(--bone);
  box-shadow: 0 30px 100px rgba(0, 0, 0, .7);
}
.ficha::backdrop { background: rgba(3, 6, 3, .82); }
.ficha__caja { padding: 12px; }
.ficha__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--line-bio);
  color: var(--bio);
  font-family: var(--label);
  font-size: .5rem;
  letter-spacing: .12em;
}
.ficha__cerrar {
  padding: 3px 7px;
  border: 1px solid var(--line-bio-dim);
  border-radius: 0;
  background: transparent;
  color: var(--steel);
  font-family: var(--mono);
  font-size: .4rem;
  cursor: pointer;
}
.ficha__cerrar:hover { border-color: var(--bio); color: var(--bio); }
.ficha__cuerpo {
  max-height: 70vh;
  overflow-y: auto;
  padding: 14px 2px 4px;
  scrollbar-width: thin;
}
.ficha__lead {
  margin: 0 0 12px;
  color: #c8c4af;
  font-size: .68rem;
  line-height: 1.7;
}
.ficha__lead strong { color: var(--bio-bright); font-weight: 400; }
.ficha__aviso {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin-bottom: 14px;
  padding: 7px 9px;
  border-left: 2px solid rgba(217, 75, 50, .65);
  background: rgba(93, 29, 18, .12);
  color: #b7ae9d;
  font-size: .46rem;
  line-height: 1.55;
}
.ficha__aviso b {
  flex: 0 0 auto;
  padding: 1px 4px;
  border: 1px solid rgba(217, 75, 50, .4);
  color: #e27760;
  font-family: var(--label);
  font-size: .4rem;
  letter-spacing: .08em;
}
.ficha__aviso span { flex: 1 1 auto; }
.ficha__aviso a {
  flex: 0 0 auto;
  border-bottom: 1px solid rgba(217, 75, 50, .35);
  color: #e27760;
  font-size: .4rem;
  letter-spacing: .08em;
}
.ficha__datos {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  margin: 0 0 14px;
  border: 1px solid var(--line-bio-dim);
  background: var(--line-bio-dim);
}
.ficha__datos div { padding: 7px 9px; background: #0c100b; }
.ficha__datos dt { color: var(--steel); font-size: .35rem; letter-spacing: .1em; }
.ficha__datos dd { margin: 2px 0 0; color: var(--bio-bright); font-size: .46rem; letter-spacing: .03em; }
.ficha__lore {
  margin: 0 0 10px;
  padding: 8px 0;
  border-top: 1px dashed var(--line-bio-dim);
  border-bottom: 1px dashed var(--line-bio-dim);
  color: var(--bio-dim);
  font-size: .4rem;
  letter-spacing: .04em;
  line-height: 1.7;
}
.ficha__creditos {
  margin: 0;
  color: var(--steel);
  font-size: .36rem;
  letter-spacing: .05em;
  line-height: 1.6;
}
.ficha__creditos a { border-bottom: 1px solid var(--line-bio-dim); color: var(--bio-dim); }

/* -------------------------------------------------------------------------- */
/* Rejilla principal                                                           */
/* -------------------------------------------------------------------------- */

.ente-layout {
  display: grid;
  grid-template-columns: 266px minmax(0, 1fr) 354px;
  gap: 12px;
  align-items: start;
}
.ente-col { display: grid; gap: 10px; align-content: start; min-width: 0; }

.panel {
  position: relative;
  border: 1px solid var(--line-bio-dim);
  background:
    linear-gradient(180deg, rgba(183, 192, 122, .035), transparent 36%),
    linear-gradient(180deg, rgba(20, 26, 18, .9), rgba(10, 13, 10, .94));
  box-shadow: 0 12px 32px rgba(0, 0, 0, .16);
}
.panel::before,
.panel::after {
  content: "";
  position: absolute;
  width: 7px;
  height: 7px;
  pointer-events: none;
  opacity: .7;
}
.panel::before {
  top: -1px;
  left: -1px;
  border-top: 1px solid var(--bio-dim);
  border-left: 1px solid var(--bio-dim);
}
.panel::after {
  right: -1px;
  bottom: -1px;
  border-right: 1px solid var(--bio-dim);
  border-bottom: 1px solid var(--bio-dim);
}
.panel__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 28px;
  padding: 6px 9px;
  border-bottom: 1px solid var(--line-bio-dim);
  color: var(--bio-dim);
  font-family: var(--label);
  font-size: .43rem;
  font-weight: 500;
  letter-spacing: .13em;
  line-height: 1.25;
  text-transform: uppercase;
}
.panel__head > span { display: inline-flex; align-items: center; gap: 6px; min-width: 0; }
.panel__head > span:last-child { color: var(--steel); white-space: nowrap; }
.panel__head b { font-weight: 600; }

/* -------------------------------------------------------------------------- */
/* Telemetría                                                                  */
/* -------------------------------------------------------------------------- */

.tel { border-color: var(--line-bio); }
.tel__estado {
  max-width: 48%;
  overflow: hidden;
  color: var(--bio-bright) !important;
  text-overflow: ellipsis;
}
.tel__cuerpo { padding: 9px 10px 10px; }
.tel__identidad {
  display: grid;
  gap: 2px;
  padding-bottom: 8px;
  margin-bottom: 8px;
  border-bottom: 1px dashed var(--line-bio-dim);
}
.tel__identidad span { color: var(--steel); font-size: .35rem; letter-spacing: .12em; }
.tel__identidad b {
  color: var(--bone);
  font-family: var(--label);
  font-size: .55rem;
  font-weight: 500;
  letter-spacing: .05em;
}
.tel__identidad small { color: var(--bio-dim); font-size: .36rem; letter-spacing: .09em; }

.medidor { margin-bottom: 8px; }
.medidor__fila {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 3px;
  color: var(--steel);
  font-size: .41rem;
  letter-spacing: .08em;
  line-height: 1.2;
}
.medidor__fila b {
  color: var(--bio-bright);
  font-family: var(--mono);
  font-size: .49rem;
  font-weight: 400;
  letter-spacing: .02em;
  font-variant-numeric: tabular-nums;
}
.medidor__fila b i { font-style: normal; }
.barra-medidor {
  position: relative;
  display: block;
  height: 7px;
  overflow: hidden;
  border: 1px solid rgba(183, 192, 122, .13);
  background:
    repeating-linear-gradient(90deg, transparent 0 7px, rgba(0, 0, 0, .35) 7px 8px),
    rgba(6, 9, 6, .9);
}
.barra-medidor > i {
  display: block;
  width: var(--pct, 0%);
  height: 100%;
  background:
    repeating-linear-gradient(90deg, transparent 0 6px, rgba(0, 0, 0, .22) 6px 7px),
    linear-gradient(90deg, #69713b, var(--bio));
  box-shadow: 0 0 10px rgba(183, 192, 122, .22);
  transition: width .55s cubic-bezier(.2, .8, .2, 1);
}
.medidor--malo .medidor__fila b { color: var(--amber); }
.medidor--malo .barra-medidor > i {
  background:
    repeating-linear-gradient(90deg, transparent 0 6px, rgba(0, 0, 0, .22) 6px 7px),
    linear-gradient(90deg, #84601c, var(--amber));
  box-shadow: 0 0 10px rgba(255, 176, 0, .2);
}
.medidor--malo.alto .medidor__fila b,
.medidor--malo.critico .medidor__fila b { color: #ff6b53; }
.medidor--malo.alto .barra-medidor > i,
.medidor--malo.critico .barra-medidor > i {
  background:
    repeating-linear-gradient(90deg, transparent 0 6px, rgba(0, 0, 0, .22) 6px 7px),
    linear-gradient(90deg, #8e2c20, var(--peligro));
  box-shadow: 0 0 12px rgba(217, 75, 50, .3);
}
.medidor--fluido { margin-bottom: 2px; }
.medidor--fluido .barra-medidor > i {
  background:
    repeating-linear-gradient(90deg, transparent 0 6px, rgba(0, 0, 0, .22) 6px 7px),
    linear-gradient(90deg, #456b64, var(--frio));
}

.barra-medidor--bipolar {
  height: 10px;
  overflow: visible;
  background:
    linear-gradient(90deg, rgba(217, 75, 50, .16), transparent 42%, transparent 58%, rgba(183, 192, 122, .14)),
    rgba(6, 9, 6, .9);
}
.barra-medidor--bipolar > i {
  position: absolute;
  top: 0;
  left: 50%;
  width: 50%;
  background: linear-gradient(90deg, rgba(183, 192, 122, .2), var(--bio));
  transition: width .55s, left .55s;
}
.barra-medidor--bipolar > i.negativa {
  background: linear-gradient(90deg, var(--peligro), rgba(217, 75, 50, .16));
}
.barra-medidor__cero {
  position: absolute;
  top: -1px;
  bottom: -1px;
  left: 50%;
  width: 1px;
  background: rgba(234, 230, 223, .55);
}
.barra-medidor__aguja {
  position: absolute;
  top: -3px;
  bottom: -3px;
  left: 50%;
  width: 2px;
  background: var(--bone);
  box-shadow: 0 0 6px rgba(234, 230, 223, .45);
  transform: translateX(-1px);
  transition: left .55s;
}
.medidor--valencia.negativa .medidor__fila b { color: #e27760; }
.valencia-extremos {
  display: flex;
  justify-content: space-between;
  margin-top: 2px;
  color: #697061;
  font-size: .26rem;
  letter-spacing: .08em;
}
.valencia-extremos span:nth-child(2) { color: var(--bio-dim); }

.psique-mini {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 5px;
  margin-top: 6px;
}
.psique-mini .medidor { margin-bottom: 0; }
.psique-mini .medidor__fila {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1px;
  margin-bottom: 3px;
  color: #9aa088;
  font-size: .32rem;
  letter-spacing: .03em;
  line-height: 1.15;
}
.psique-mini .medidor__fila b { color: var(--bio-bright); font-size: .43rem; line-height: 1.1; }
.psique-mini .barra-medidor { height: 5px; }
.psique-mini .medidor__fila span::before { content: ""; }
.barra-medidor__marcas {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: repeating-linear-gradient(90deg, transparent 0 19px, rgba(0, 0, 0, .26) 19px 20px);
}

.medidor--psique .medidor__fila span::before {
  content: "› ";
  color: var(--bio-dim);
}
.separador {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 10px 0 7px;
  color: var(--bio-dim);
  font-size: .34rem;
  letter-spacing: .14em;
}
.separador::before,
.separador::after {
  content: "";
  flex: 1;
  height: 1px;
  background: var(--line-bio-dim);
}
.separador span { white-space: nowrap; }

.eeg {
  position: relative;
  margin-top: 9px;
  padding-top: 7px;
  border-top: 1px dashed var(--line-bio-dim);
}
.eeg canvas {
  display: block;
  width: 100%;
  height: 42px;
  background:
    linear-gradient(rgba(183, 192, 122, .04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(183, 192, 122, .04) 1px, transparent 1px),
    #060906;
  background-size: 13px 10px, 13px 10px, auto;
}
.eeg span {
  display: block;
  margin-top: 3px;
  color: var(--bio-dim);
  font-size: .3rem;
  letter-spacing: .1em;
}

.tel__pie {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid var(--line-bio-dim);
}
.tel__pie div {
  padding: 6px 8px;
  border-right: 1px solid var(--line-bio-dim);
}
.tel__pie div:last-child { border-right: 0; }
.tel__pie span { display: block; color: var(--steel); font-size: .32rem; letter-spacing: .1em; }
.tel__pie b {
  color: var(--bone);
  font-family: var(--label);
  font-size: .68rem;
  font-weight: 600;
  letter-spacing: .03em;
  font-variant-numeric: tabular-nums;
}
.tel__pie small { margin-left: 2px; color: var(--steel); font-size: .3rem; }

/* Cerebro */
.cerebro__cuerpo { padding: 10px; }
.cerebro__contador {
  display: flex;
  align-items: baseline;
  gap: 7px;
  padding-bottom: 7px;
  border-bottom: 1px dashed var(--line-bio-dim);
}
.cerebro__contador b {
  color: var(--bio-bright);
  font-family: var(--label);
  font-size: 1.55rem;
  font-weight: 500;
  line-height: .9;
  letter-spacing: -.02em;
  font-variant-numeric: tabular-nums;
}
.cerebro__contador span {
  color: var(--steel);
  font-size: .33rem;
  letter-spacing: .1em;
  line-height: 1.35;
}
.cerebro__mini {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 7px 0;
  border: 1px solid var(--line-bio-dim);
}
.cerebro__mini div {
  padding: 5px 6px;
  border-right: 1px solid var(--line-bio-dim);
  min-width: 0;
}
.cerebro__mini div:last-child { border-right: 0; }
.cerebro__mini span { display: block; color: var(--steel); font-size: .29rem; letter-spacing: .08em; }
.cerebro__mini b {
  display: block;
  overflow: hidden;
  color: var(--bio-bright);
  font-family: var(--label);
  font-size: .46rem;
  font-weight: 500;
  letter-spacing: .02em;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.cerebro__palabras {
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
  min-height: 42px;
  max-height: 94px;
  overflow: hidden;
  align-content: flex-start;
  padding: 1px 0 3px;
}
.cerebro__vacio {
  color: var(--steel);
  font-size: .37rem;
  letter-spacing: .03em;
  line-height: 1.55;
}
.palabra-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  max-width: 100%;
  padding: 2px 4px;
  border: 1px solid var(--line-bio-dim);
  background: rgba(183, 192, 122, .04);
  color: var(--bio);
  font-size: .36rem;
  letter-spacing: .03em;
  line-height: 1.25;
}
.palabra-chip small { color: var(--steel); font-size: .29rem; }
.palabra-chip--mal { border-color: rgba(217, 75, 50, .2); color: #d98a78; }
.palabra-chip--tabu { border-color: rgba(217, 75, 50, .4); color: #e27760; background: rgba(217, 75, 50, .06); }
.palabra-chip--tabu::after { content: "⊘"; color: var(--peligro); font-size: .35rem; }
.cerebro__nota {
  margin: 7px 0 0;
  padding-top: 6px;
  border-top: 1px dashed var(--line-bio-dim);
  color: var(--steel);
  font-size: .33rem;
  letter-spacing: .035em;
  line-height: 1.6;
}

/* -------------------------------------------------------------------------- */
/* Cámara                                                                      */
/* -------------------------------------------------------------------------- */

.camara-panel {
  position: relative;
  min-width: 0;
  border: 1px solid var(--line-bio);
  background: #080b07;
  box-shadow:
    0 0 0 1px rgba(0, 0, 0, .65),
    0 22px 56px rgba(0, 0, 0, .36),
    inset 0 0 60px rgba(120, 135, 65, .03);
  clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 14px 100%, 0 calc(100% - 14px));
}
.camara-panel__head {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 6px 9px;
  border-bottom: 1px solid var(--line-bio-dim);
  background: linear-gradient(180deg, rgba(183, 192, 122, .045), transparent);
  color: var(--bio-dim);
  font-family: var(--label);
  font-size: .42rem;
  letter-spacing: .13em;
  line-height: 1.3;
}
.camara-panel__head > span:first-child {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.camara-panel__head > span:last-child { flex: 0 0 auto; }
.camara-panel__live {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--bio);
  white-space: nowrap;
}
.camara-panel__live.fallo { color: #e27760; }
.camara-panel__live.fallo .led { background: var(--peligro); box-shadow: 0 0 8px rgba(217, 75, 50, .55); }

.camara-stage {
  position: relative;
  width: 100%;
  aspect-ratio: 1.37;
  overflow: hidden;
  background: #050705;
  isolation: isolate;
  contain: paint;
}
#especimen {
  display: block;
  width: 100%;
  height: 100%;
  cursor: crosshair;
}
#especimen:focus-visible { outline: 2px solid var(--bio); outline-offset: -2px; }

/* Cristal blindado: curvatura, brillo especular y suciedad de borde. */
.camara-cristal {
  position: absolute;
  z-index: 1;
  inset: 5% 9.2% 3.5%;
  border-radius: 11% 11% 5% 5%;
  pointer-events: none;
  box-shadow:
    inset 0 0 80px rgba(0, 0, 0, .88),
    inset 0 0 24px rgba(44, 90, 76, .3),
    inset 0 0 8px rgba(215, 232, 190, .08);
  background:
    linear-gradient(90deg,
      rgba(255, 255, 255, .055) 0%,
      rgba(255, 255, 255, .012) 7%,
      transparent 18%,
      transparent 76%,
      rgba(0, 0, 0, .26) 90%,
      rgba(0, 0, 0, .55) 100%),
    radial-gradient(110% 100% at 50% 0%, rgba(220, 235, 195, .07), transparent 44%);
}
.camara-cristal::before {
  content: "";
  position: absolute;
  top: 5%;
  bottom: 5%;
  left: 7%;
  width: 9%;
  border-radius: 50%;
  background: linear-gradient(90deg, rgba(235, 244, 216, .09), transparent 80%);
  filter: blur(5px);
  transform: rotate(1.5deg);
}
.camara-cristal::after {
  content: "";
  position: absolute;
  top: 10%;
  bottom: 14%;
  right: 9%;
  width: 2px;
  background: linear-gradient(180deg, rgba(235, 244, 216, .18), rgba(235, 244, 216, 0));
  box-shadow: 7px 0 18px rgba(235, 244, 216, .04);
}

/* Pulso de transmisión: del conducto psíquico al tanque. */
.camara-transmision {
  position: absolute;
  z-index: 2;
  inset: 0;
  pointer-events: none;
  opacity: 0;
  background:
    linear-gradient(90deg, transparent 0 44%, rgba(183, 212, 160, .1) 70%, rgba(214, 238, 189, .3) 100%);
  background-size: 180% 100%;
  background-position: 130% 0;
}
.camara-transmision.activa {
  animation: pulso-transmision .72s ease-out;
}
@keyframes pulso-transmision {
  0% { opacity: 0; background-position: 130% 0; }
  18% { opacity: .9; }
  100% { opacity: 0; background-position: -20% 0; }
}

.camara-hud {
  position: absolute;
  z-index: 3;
  display: grid;
  gap: 2px;
  pointer-events: none;
  color: var(--bio-dim);
  font-size: .32rem;
  letter-spacing: .12em;
  text-shadow: 0 1px 3px #000;
}
.camara-hud span { font-size: .3rem; }
.camara-hud b { color: var(--bio-bright); font-family: var(--label); font-size: .42rem; font-weight: 500; letter-spacing: .07em; }
.camara-hud--tl { top: 14px; left: 17px; }
.camara-hud--tr { top: 14px; right: 17px; text-align: right; }
.camara-hud--tr b { color: var(--amber); }

.voz {
  position: absolute;
  z-index: 4;
  top: 8.5%;
  right: 5.2%;
  width: min(48%, 340px);
  padding: 6px 8px 8px;
  border: 1px solid rgba(183, 192, 122, .55);
  background:
    repeating-linear-gradient(0deg, rgba(183, 192, 122, .028) 0 1px, transparent 1px 3px),
    rgba(4, 9, 5, .975);
  box-shadow:
    0 12px 34px rgba(0, 0, 0, .7),
    inset 0 0 22px rgba(120, 135, 65, .07);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 7px), calc(100% - 7px) 100%, 0 100%);
  transition: border-color .3s, opacity .3s;
}
.voz::after {
  content: "";
  position: absolute;
  left: 18%;
  bottom: -13px;
  width: 15px;
  height: 15px;
  border-right: 1px solid rgba(183, 192, 122, .3);
  border-bottom: 1px solid rgba(183, 192, 122, .3);
  background: rgba(5, 12, 7, .92);
  transform: skewX(-28deg) rotate(45deg);
}
.voz--callada { opacity: .58; border-color: rgba(183, 192, 122, .18); }
.voz--hablando { border-color: rgba(183, 192, 122, .75); }
.voz--miedo { border-color: rgba(217, 75, 50, .55); }
.voz--miedo .voz__head { color: #e27760; }
.voz__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding-bottom: 4px;
  margin-bottom: 5px;
  border-bottom: 1px dashed rgba(183, 192, 122, .2);
  color: var(--bio-dim);
  font-family: var(--label);
  font-size: .34rem;
  letter-spacing: .11em;
}
.voz__head span:last-child { color: var(--bio); font-family: var(--mono); font-size: .29rem; letter-spacing: .05em; }
.voz__texto {
  min-height: 1.35em;
  margin: 0;
  color: #dce4b4;
  font-family: var(--mono);
  font-size: clamp(.56rem, 1.05vw, .74rem);
  line-height: 1.45;
  letter-spacing: .015em;
  text-shadow: 0 0 10px rgba(183, 192, 122, .18);
  overflow-wrap: anywhere;
}
.voz__cursor {
  display: inline-block;
  width: .46em;
  height: 1em;
  margin-left: 2px;
  background: var(--bio);
  vertical-align: -.12em;
  animation: parpadeo 1s steps(2, end) infinite;
}
.voz--callada .voz__cursor { display: none; }
@keyframes parpadeo { 50% { opacity: 0; } }

.camara-placa {
  position: absolute;
  z-index: 3;
  right: 17px;
  bottom: 18px;
  display: grid;
  gap: 1px;
  width: 94px;
  padding: 5px 7px;
  border: 1px solid rgba(183, 192, 122, .24);
  background: rgba(8, 11, 7, .82);
  color: var(--steel);
  font-size: .27rem;
  letter-spacing: .08em;
  line-height: 1.3;
  pointer-events: none;
}
.camara-placa b { color: var(--bone); font-family: var(--label); font-size: .66rem; font-weight: 600; letter-spacing: .08em; }
.camara-placa small { color: var(--amber); font-size: .26rem; letter-spacing: .04em; }
.camara-niebla {
  position: absolute;
  z-index: 2;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(80% 65% at 18% 20%, rgba(183, 192, 122, .045), transparent 70%),
    radial-gradient(90% 75% at 72% 85%, rgba(0, 0, 0, .35), transparent 70%);
}

.camara-feedback {
  position: absolute;
  z-index: 6;
  top: 37%;
  right: 4.5%;
  max-width: 58%;
  padding: 5px 8px;
  border: 1px solid rgba(183, 192, 122, .4);
  border-left: 3px solid var(--bio);
  background: rgba(5, 11, 6, .94);
  color: var(--bio-bright);
  font-family: var(--mono);
  font-size: .46rem;
  letter-spacing: .06em;
  line-height: 1.35;
  opacity: 0;
  transform: translateY(4px);
  pointer-events: none;
  transition: opacity .2s, transform .2s;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .5);
}
.camara-feedback.visible { opacity: 1; transform: none; }
.camara-feedback--mal {
  border-color: rgba(217, 75, 50, .55);
  border-left-color: var(--peligro);
  color: #f0a090;
}
.camara-feedback--alerta {
  border-color: rgba(255, 176, 0, .5);
  border-left-color: var(--amber);
  color: var(--amber);
}
.voz--muda .voz__cursor { animation: none; opacity: .25; }
.voz--muda .voz__texto { color: #bcc49b; }
.activar-voz {
  position: absolute;
  z-index: 6;
  left: 50%;
  bottom: 12px;
  transform: translateX(-50%);
  min-height: 25px;
  padding: 4px 9px;
  border: 1px solid rgba(183, 192, 122, .48);
  border-radius: 0;
  background: rgba(5, 11, 6, .94);
  color: var(--bio-bright);
  font-family: var(--mono);
  font-size: .47rem;
  letter-spacing: .06em;
  white-space: nowrap;
  cursor: pointer;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, .5), 0 0 22px rgba(183, 192, 122, .1);
  animation: llamada-voz 2.6s steps(2, end) infinite;
}
.activar-voz span { color: var(--bio); }
.activar-voz:hover { border-color: var(--bio); background: rgba(183, 192, 122, .1); }
.activar-voz[hidden] { display: none !important; }
.audio-btn--sugerir { border-color: var(--amber); color: var(--amber); animation: llamada-voz 2.2s steps(2, end) infinite; }
@keyframes llamada-voz { 50% { opacity: .58; } }
.voz--glitch { animation: glitch-voz .55s steps(2) 1; }
@keyframes glitch-voz {
  20% { transform: translateX(-3px); filter: hue-rotate(-18deg); }
  40% { transform: translateX(2px); }
  60% { transform: translateX(-1px); opacity: .78; }
  100% { transform: none; }
}
.camara-scan {
  position: absolute;
  z-index: 5;
  inset: 0;
  pointer-events: none;
  background:
    repeating-linear-gradient(0deg, rgba(0, 0, 0, .1) 0 1px, transparent 1px 4px),
    radial-gradient(120% 95% at 50% 45%, transparent 50%, rgba(0, 0, 0, .46) 100%);
  opacity: .75;
}

.camara-panel__foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 30px;
  padding: 5px 9px;
  border-top: 1px solid var(--line-bio-dim);
  background: rgba(8, 11, 7, .88);
  color: var(--steel);
  font-size: .34rem;
  letter-spacing: .08em;
  line-height: 1.35;
}
#camara-nota { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.camara-panel__salto {
  flex: 0 0 auto;
  color: var(--bio-dim);
  font-family: var(--label);
  font-size: .34rem;
  letter-spacing: .1em;
  white-space: nowrap;
}
.camara-panel__salto:hover { color: var(--amber); }
.audio-btn {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 5px;
  min-height: 22px;
  padding: 2px 6px;
  border: 1px solid var(--line-bio-dim);
  border-radius: 0;
  background: transparent;
  color: var(--bio-dim);
  font-family: var(--mono);
  font-size: .34rem;
  letter-spacing: .06em;
  cursor: pointer;
}
.audio-btn:hover { border-color: var(--bio); color: var(--bio); }
.audio-btn[aria-pressed="true"] { border-color: var(--bio); color: var(--bio-bright); background: rgba(183, 192, 122, .08); }
.audio-btn__icon { font-size: .56rem; line-height: 1; }

/* -------------------------------------------------------------------------- */
/* Válvulas                                                                    */
/* -------------------------------------------------------------------------- */

.acciones__grid {
  display: grid;
  min-width: 0;
  gap: 0;
  padding: 7px 8px 8px;
  background:
    linear-gradient(180deg, rgba(183, 192, 122, .03), transparent 45%),
    #0a0e09;
}
.valvulas-grupo { min-width: 0; }
.valvulas-grupo__label {
  display: flex;
  min-width: 0;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 4px;
  color: var(--bio-dim);
  font-family: var(--label);
  font-size: .33rem;
  letter-spacing: .12em;
}
.valvulas-grupo__label b { color: var(--steel); font-weight: 400; font-size: .29rem; white-space: nowrap; }
.valvulas-fila {
  display: grid;
  min-width: 0;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 4px;
}
.valvulas-fila--danio { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.franja-peligro {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 16px;
  margin: 7px 0;
  border-top: 1px solid rgba(217, 75, 50, .32);
  border-bottom: 1px solid rgba(217, 75, 50, .22);
  background:
    repeating-linear-gradient(45deg, rgba(255, 176, 0, .13) 0 5px, transparent 5px 10px);
  color: #c47963;
  font-family: var(--label);
  font-size: .3rem;
  letter-spacing: .14em;
}
.franja-peligro span { padding: 0 5px; background: #0a0e09; }
.accion {
  position: relative;
  display: grid;
  min-width: 0;
  grid-template-columns: 22px minmax(0, 1fr);
  grid-template-rows: auto auto auto;
  column-gap: 5px;
  align-items: center;
  min-height: 54px;
  padding: 5px 7px;
  border: 0;
  border-top: 1px solid rgba(231, 232, 199, .12);
  border-bottom: 3px solid rgba(0, 0, 0, .78);
  border-radius: 0;
  background: linear-gradient(180deg, #11170e, #090d08 68%, #060806);
  color: var(--steel);
  font-family: var(--mono);
  text-align: left;
  cursor: pointer;
  box-shadow:
    inset 0 1px rgba(255, 255, 255, .035),
    inset 0 -1px rgba(0, 0, 0, .6),
    0 1px 0 rgba(0, 0, 0, .5);
  transition: background .12s, color .12s, transform .06s, border-color .12s;
}
.accion::after {
  content: "";
  position: absolute;
  top: 2px;
  right: 2px;
  width: 5px;
  height: 5px;
  border-top: 1px solid rgba(183, 192, 122, .3);
  border-right: 1px solid rgba(183, 192, 122, .3);
}
.accion:hover { background: linear-gradient(180deg, #182012, #0d120a 70%, #080b07); color: var(--bone); }
.accion:active:not(:disabled) {
  transform: translateY(2px);
  border-bottom-width: 1px;
  box-shadow: inset 0 2px 6px rgba(0, 0, 0, .65);
}
.accion:focus-visible { outline: 2px solid var(--bio); outline-offset: -2px; }
.accion:disabled {
  cursor: wait;
  opacity: .46;
  filter: saturate(.4) brightness(.72);
}
.accion__icono {
  grid-row: 1 / 3;
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border: 1px solid var(--line-bio-dim);
  background: radial-gradient(circle at 35% 30%, rgba(183, 192, 122, .18), rgba(0, 0, 0, .18));
  color: var(--bio);
  font-family: var(--label);
  font-size: .75rem;
  line-height: 1;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .6);
}
.accion--mal .accion__icono {
  border-color: rgba(217, 75, 50, .3);
  background: radial-gradient(circle at 35% 30%, rgba(217, 75, 50, .16), rgba(0, 0, 0, .24));
  color: #d98a78;
}
.accion__nombre {
  color: var(--bone);
  font-family: var(--label);
  font-size: .47rem;
  font-weight: 600;
  letter-spacing: .075em;
  line-height: 1.1;
}
.accion__sub { color: var(--steel); font-size: .28rem; letter-spacing: .02em; line-height: 1.25; }
.accion__coste {
  grid-column: 1 / -1;
  margin-top: 3px;
  padding-top: 2px;
  border-top: 1px dashed rgba(183, 192, 122, .1);
  color: var(--bio-dim);
  font-size: .26rem;
  letter-spacing: .04em;
  line-height: 1.15;
}
.accion--mal .accion__coste { color: #a96a5d; }
.accion.activa { animation: pulso-accion .5s steps(2); }
@keyframes pulso-accion { 50% { background: rgba(183, 192, 122, .14); } }
.acciones__grid.recargando .accion { opacity: .56; }
.acciones__grid.recargando .accion__icono {
  border-color: rgba(217, 75, 50, .25);
  color: #9e5b4e;
  box-shadow: inset 0 0 8px rgba(217, 75, 50, .12);
}

.acciones__pie {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 5px 9px;
  border-top: 1px solid var(--line-bio-dim);
}
#aviso-accion {
  flex: 1 1 auto;
  margin: 0;
  color: var(--steel);
  font-size: .33rem;
  letter-spacing: .04em;
  line-height: 1.4;
}
#aviso-accion.error { color: #e27760; }
#aviso-accion.ok { color: var(--bio-bright); }
.cooldown {
  position: relative;
  flex: 0 0 auto;
  width: 44px;
  height: 5px;
  overflow: hidden;
  border: 1px solid var(--line-bio-dim);
  background: #060906;
}
.cooldown i { display: block; width: 0%; height: 100%; background: var(--bio); transition: width .2s linear; }
.cooldown.activo i { background: var(--amber); }

/* -------------------------------------------------------------------------- */
/* Conducto psíquico                                                           */
/* -------------------------------------------------------------------------- */

.conducto__form { padding: 9px 10px 10px; }
.tonos { margin: 0; padding: 0; border: 0; min-width: 0; }
.tonos legend {
  margin-bottom: 5px;
  padding: 0;
  color: var(--steel);
  font-size: .34rem;
  letter-spacing: .1em;
}
.tonos legend b { color: var(--amber); font-weight: 400; }
.tonos__grid { display: grid; gap: 2px; }
.tono {
  display: grid;
  grid-template-columns: 19px minmax(0, 1fr);
  grid-template-rows: auto auto;
  column-gap: 6px;
  align-items: center;
  min-height: 32px;
  padding: 4px 6px;
  border: 1px solid transparent;
  border-left: 2px solid rgba(183, 192, 122, .12);
  border-radius: 0;
  background: rgba(183, 192, 122, .025);
  color: var(--steel);
  text-align: left;
  cursor: pointer;
  transition: background .15s, border-color .15s;
}
.tono:hover { background: rgba(183, 192, 122, .06); border-left-color: var(--bio-dim); }
.tono:focus-visible { outline: 2px solid var(--bio); outline-offset: -2px; }
.tono__marca {
  grid-row: 1 / 3;
  display: grid;
  place-items: center;
  width: 18px;
  height: 18px;
  border: 1px solid var(--line-bio-dim);
  color: var(--bio-dim);
  font-family: var(--label);
  font-size: .54rem;
  line-height: 1;
}
.tono__nombre {
  color: var(--bone);
  font-family: var(--label);
  font-size: .43rem;
  font-weight: 500;
  letter-spacing: .07em;
  line-height: 1.15;
}
.tono small { color: var(--steel); font-size: .3rem; letter-spacing: .015em; line-height: 1.25; }
.tono[aria-pressed="true"] {
  border-color: rgba(183, 192, 122, .28);
  border-left-color: var(--bio);
  background: rgba(183, 192, 122, .08);
}
.tono[aria-pressed="true"] .tono__marca { border-color: var(--bio); background: var(--bio); color: #0a0b0e; }
.tono[aria-pressed="true"] .tono__nombre { color: var(--bio-bright); }
.tono[data-tono="REPULSION"][aria-pressed="true"] {
  border-color: rgba(217, 75, 50, .32);
  border-left-color: var(--peligro);
  background: rgba(217, 75, 50, .07);
}
.tono[data-tono="REPULSION"][aria-pressed="true"] .tono__marca { border-color: var(--peligro); background: var(--peligro); }
.tono[data-tono="REPULSION"][aria-pressed="true"] .tono__nombre { color: #e27760; }
.tono.necesario { animation: tono-falta .55s steps(2) 2; }
@keyframes tono-falta { 50% { border-color: var(--amber); background: rgba(255, 176, 0, .09); } }

.campo { display: block; margin-top: 8px; }
.campo > span {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 4px;
  color: var(--steel);
  font-size: .34rem;
  letter-spacing: .1em;
}
.campo > span b { color: var(--bio-dim); font-weight: 400; font-family: var(--mono); letter-spacing: .03em; }
.campo textarea {
  display: block;
  width: 100%;
  min-height: 62px;
  max-height: 130px;
  padding: 7px 8px;
  border: 1px solid var(--line-bio-dim);
  border-left: 2px solid var(--line-bio);
  border-radius: 0;
  background: #060906;
  color: var(--bone);
  font-family: var(--mono);
  font-size: .6rem;
  line-height: 1.5;
  resize: vertical;
}
.campo textarea::placeholder { color: #68705b; opacity: 1; }
.campo textarea:focus { outline: none; border-color: var(--bio); box-shadow: 0 0 0 1px var(--bio); }
.campo textarea:disabled { opacity: .55; }
.conducto__acciones {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: 7px;
}
.conducto__firma { color: var(--bio-dim); font-size: .32rem; letter-spacing: .08em; white-space: nowrap; }
.conducto__enviar {
  min-height: 30px;
  padding: 4px 10px;
  border-color: var(--bio);
  background: var(--bio);
  color: #080b07;
  font-family: var(--label);
  font-size: .46rem;
  font-weight: 600;
  letter-spacing: .09em;
}
.conducto__enviar:hover { background: var(--amber); border-color: var(--amber); }
.conducto__enviar:disabled { opacity: .45; cursor: wait; }
.conducto__estado {
  min-height: 2.2em;
  margin: 7px 0 0;
  padding-top: 6px;
  border-top: 1px dashed var(--line-bio-dim);
  color: var(--steel);
  font-size: .32rem;
  letter-spacing: .025em;
  line-height: 1.5;
}
.conducto__estado.error { color: #e27760; }
.conducto__estado.ok { color: var(--bio-bright); }

.sinapsis {
  margin: 0 10px 10px;
  padding: 6px 8px;
  border: 1px solid rgba(183, 192, 122, .24);
  background: rgba(183, 192, 122, .05);
}
.sinapsis span { display: block; color: var(--bio-dim); font-size: .29rem; letter-spacing: .12em; }
.sinapsis p { margin: 3px 0 0; color: var(--bio-bright); font-size: .37rem; line-height: 1.5; letter-spacing: .02em; }
.sinapsis.es-frio { border-color: rgba(217, 75, 50, .3); background: rgba(217, 75, 50, .05); }
.sinapsis.es-frio p { color: #e2a08f; }

/* Registro */
.registro__lista {
  display: grid;
  gap: 0;
  max-height: 318px;
  margin: 0;
  padding: 4px 8px 5px;
  overflow-y: auto;
  list-style: none;
  scrollbar-width: thin;
  scrollbar-color: rgba(183, 192, 122, .3) transparent;
}
.registro__lista::-webkit-scrollbar { width: 5px; }
.registro__lista::-webkit-scrollbar-thumb { background: rgba(183, 192, 122, .26); }
.registro__item {
  display: grid;
  grid-template-columns: 43px 52px minmax(0, 1fr);
  gap: 5px;
  align-items: baseline;
  padding: 4px 0;
  border-bottom: 1px dotted rgba(183, 192, 122, .09);
  color: var(--steel);
  font-size: .33rem;
  letter-spacing: .02em;
  line-height: 1.45;
}
.registro__item:last-child { border-bottom: 0; }
.registro__hora { color: #747c68; font-size: .3rem; font-variant-numeric: tabular-nums; }
.registro__actor { overflow: hidden; color: var(--bio-dim); font-size: .3rem; text-overflow: ellipsis; white-space: nowrap; }
.registro__texto { color: var(--steel); overflow-wrap: anywhere; }
.registro__item--mensaje .registro__texto { color: #c5c1ac; }
.registro__item--voz .registro__texto { color: var(--bio-bright); font-family: var(--mono); }
.registro__item--voz .registro__actor { color: var(--amber); }
.registro__item--sistema .registro__texto { color: #e27760; }
.registro__item--accion .registro__texto { color: #aeb39a; }
.registro__item.nuevo { animation: registro-in .35s steps(3); }
@keyframes registro-in { from { opacity: 0; transform: translateX(-4px); } to { opacity: 1; transform: none; } }
.registro__vacio {
  padding: 9px 2px;
  color: var(--steel);
  font-size: .36rem;
  letter-spacing: .03em;
  line-height: 1.55;
}
.registro__pie {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 5px 9px;
  border-top: 1px solid var(--line-bio-dim);
  color: var(--steel);
  font-size: .31rem;
  letter-spacing: .05em;
}
.registro__refrescar {
  width: 22px;
  height: 20px;
  border: 1px solid var(--line-bio-dim);
  border-radius: 0;
  background: transparent;
  color: var(--bio-dim);
  font-family: var(--mono);
  font-size: .6rem;
  line-height: 1;
  cursor: pointer;
}
.registro__refrescar:hover { border-color: var(--bio); color: var(--bio); }

.ente-lore {
  margin: 0;
  padding: 0 2px;
  color: var(--bio-dim);
  font-size: .32rem;
  letter-spacing: .05em;
  line-height: 1.7;
}
.ente-creditos {
  margin: 0;
  padding: 0 2px;
  color: #69705d;
  font-size: .3rem;
  letter-spacing: .07em;
  line-height: 1.6;
}
.ente-creditos a {
  border-bottom: 1px solid rgba(183, 192, 122, .24);
  color: var(--bio-dim);
}
.ente-creditos a:hover { color: var(--amber); border-color: var(--amber); }

/* -------------------------------------------------------------------------- */
/* Explicación                                                                 */
/* -------------------------------------------------------------------------- */

.ente-explica {
  display: grid;
  grid-template-columns: minmax(220px, .55fr) minmax(0, 1.45fr);
  gap: 20px 36px;
  margin-top: 18px;
  padding: clamp(16px, 2.4vw, 26px);
  border: 1px solid var(--line-bio-dim);
  background:
    linear-gradient(180deg, rgba(183, 192, 122, .03), transparent 45%),
    rgba(10, 14, 10, .68);
}
.ente-explica .kicker { margin: 0 0 5px; }
.ente-explica h2 {
  margin: 0;
  color: var(--bone);
  font-family: var(--display);
  font-size: clamp(1.6rem, 3vw, 2.7rem);
  font-weight: 900;
  letter-spacing: -.045em;
  line-height: .9;
  text-transform: uppercase;
  transform: scaleX(.94);
  transform-origin: left top;
}
.ente-explica__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  background: var(--line-bio-dim);
  border: 1px solid var(--line-bio-dim);
}
.ente-explica article { padding: 10px 12px; background: #0b0f0a; }
.ente-explica article b {
  display: block;
  margin-bottom: 4px;
  color: var(--bio);
  font-family: var(--label);
  font-size: .45rem;
  font-weight: 600;
  letter-spacing: .09em;
}
.ente-explica article p {
  margin: 0;
  color: var(--steel);
  font-size: .43rem;
  letter-spacing: .02em;
  line-height: 1.65;
}

.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.ente-noscript {
  width: min(900px, calc(100vw - 28px));
  margin: 20px auto;
  padding: 12px 14px;
  border-left: 2px solid var(--peligro);
  background: rgba(217, 75, 50, .06);
  color: #e27760;
  font-size: .55rem;
  letter-spacing: .05em;
  line-height: 1.6;
}

/* -------------------------------------------------------------------------- */
/* Responsive                                                                  */
/* -------------------------------------------------------------------------- */

@media (min-width: 1121px) {
  .ente-layout { align-items: stretch; }
  .ente-col--left { grid-template-rows: auto minmax(0, 1fr); align-content: stretch; }
  .cerebro { display: flex; flex-direction: column; }
  .cerebro__cuerpo { display: flex; flex: 1; flex-direction: column; }
  .cerebro__palabras { flex: 1 1 auto; max-height: none; }
  .ente-col--right { grid-template-rows: auto minmax(0, 1fr); align-content: stretch; }
  .registro { display: flex; flex-direction: column; }
  .registro__lista { flex: 1 1 auto; max-height: none; min-height: 180px; }
}

@media (max-width: 1320px) {
  .ente-layout { grid-template-columns: 242px minmax(0, 1fr) 326px; }
  .ente-hero__status div { min-width: 58px; padding-inline: 6px; }
  .valvulas-fila { gap: 3px; }
}

@media (max-width: 1120px) {
  .ente-hero { align-items: center; }
  .ente-hero__status { display: none; }
  .ente-layout {
    grid-template-columns: 248px minmax(0, 1fr);
    grid-template-areas:
      "izquierda centro"
      "derecha derecha";
  }
  .ente-col--left { grid-area: izquierda; }
  .ente-col--center { grid-area: centro; }
  .ente-col--right {
    grid-area: derecha;
    grid-template-columns: minmax(0, 1.15fr) minmax(280px, .85fr);
    align-items: start;
  }
  .registro__lista { max-height: 286px; }
  .camara-stage { aspect-ratio: 1.37; }
}

@media (max-width: 880px) {
  .ente-page { width: calc(100vw - 20px); }
  .ente-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 3px 10px;
    align-items: start;
  }
  .ente-hero__main { grid-column: 1; }
  .ente-hero__line { display: block; }
  .ente-title { font-size: clamp(2.2rem, 7vw, 2.8rem); }
  .ente-lead { margin-top: 3px; font-size: .58rem; line-height: 1.45; }
  .ente-info-btn { grid-column: 2; grid-row: 1; align-self: start; height: 28px; }
  .ente-layout {
    grid-template-columns: 1fr;
    grid-template-areas:
      "centro"
      "derecha"
      "izquierda";
  }
  .ente-col--right { grid-template-columns: 1fr; }
  .camara-stage { aspect-ratio: 1 / 1.03; }
  .ente-col--left { grid-template-columns: 1fr 1fr; }
  .valvulas-fila,
  .valvulas-fila--danio { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .voz { width: min(62%, 300px); top: 6.5%; }
  .camara-feedback { top: 34%; right: 4%; max-width: 72%; }
  .ente-explica { grid-template-columns: 1fr; gap: 14px; }
}

@media (max-width: 600px) {
  .ente-page { width: calc(100vw - 14px); }
  .ente-title { font-size: clamp(2.1rem, 11vw, 2.8rem); }
  .ente-title__sub { display: inline; margin: 0; font-size: .25em; }
  .ente-lead { font-size: .51rem; line-height: 1.45; }
  .ente-info-btn { font-size: .33rem; padding-inline: 6px; }
  .ficha__datos { grid-template-columns: 1fr; }
  .ente-col--left { grid-template-columns: 1fr; }
  .ente-col--right { grid-template-columns: 1fr; }
  .camara-stage { aspect-ratio: 1 / 1.03; }
  .camara-panel__head { font-size: .36rem; }
  .camara-panel__head > span:first-child { max-width: 68%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .camara-hud { display: none; }
  .voz { top: 6%; right: 4%; width: 64%; padding: 5px 7px 7px; }
  .voz__texto { font-size: .58rem; }
  .activar-voz { bottom: 8px; font-size: .42rem; padding: 4px 7px; }
  .camara-feedback { top: 55%; right: 4%; max-width: 72%; font-size: .5rem; }
  .voz__head { font-size: .29rem; }
  .camara-placa { display: none; }
  .accion { min-height: 52px; }
  .accion__nombre { font-size: .44rem; }
  .accion__sub { font-size: .27rem; }
  .valvulas-grupo__label { font-size: .29rem; }
  .franja-peligro { font-size: .27rem; }
  .ente-explica__grid { grid-template-columns: 1fr; }
  .ente-explica article { padding: 9px 10px; }
  .footer__nav { gap: 8px 12px; }
  .ente-body .barra__nav a:nth-child(4) { display: none; }
}

@media (max-width: 390px) {
  .voz { width: 72%; }
  .accion { grid-template-columns: 20px minmax(0, 1fr); padding-inline: 6px; }
  .accion__icono { width: 20px; height: 20px; font-size: .7rem; }
  .conducto__firma { display: none; }
  .conducto__enviar { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .voz__cursor,
  .accion.activa,
  .registro__item.nuevo,
  .camara-transmision.activa,
  .voz--glitch,
  .activar-voz,
  .audio-btn--sugerir { animation: none !important; }
  .barra-medidor > i,
  .barra-medidor__aguja,
  .cooldown i,
  .camara-feedback { transition: none !important; }
}

/* ==========================================================================
   PASADA DE LEGIBILIDAD
   --------------------------------------------------------------------------
   La interfaz es densa, pero la microtipografía anterior se quedaba en 5-7 px
   reales. Se sube un escalón (~25-30 %) y se compensa con el tanque 4:3 para
   que el cockpit siga entrando en 1080p.
   ========================================================================== */

.panel__head { font-size: .55rem; letter-spacing: .1em; }
.camara-panel__head { font-size: .52rem; letter-spacing: .1em; }
.camara-panel__foot { font-size: .42rem; }
.audio-btn { font-size: .42rem; }
.tel__identidad span { font-size: .42rem; }
.tel__identidad b { font-size: .64rem; }
.tel__identidad small { font-size: .42rem; }
.medidor__fila { font-size: .5rem; letter-spacing: .05em; }
.medidor__fila b { font-size: .6rem; }
.separador { font-size: .42rem; }
.valencia-extremos { font-size: .34rem; letter-spacing: .06em; }
.psique-mini .medidor__fila { font-size: .38rem; }
.psique-mini .medidor__fila b { font-size: .5rem; }
.eeg span { font-size: .36rem; }
.tel__pie span { font-size: .38rem; }
.tel__pie b { font-size: .76rem; }
.tel__pie small { font-size: .36rem; }
.cerebro__contador b { font-size: 1.7rem; }
.cerebro__contador span { font-size: .42rem; }
.cerebro__mini span { font-size: .36rem; }
.cerebro__mini b { font-size: .55rem; }
.palabra-chip { font-size: .45rem; }
.palabra-chip small { font-size: .35rem; }
.cerebro__vacio { font-size: .46rem; }
.cerebro__nota { font-size: .42rem; }
.camara-hud { font-size: .4rem; }
.camara-hud span { font-size: .36rem; }
.camara-hud b { font-size: .5rem; }
.voz__head { font-size: .42rem; }
.voz__head span:last-child { font-size: .36rem; }
.voz__texto { font-size: clamp(.68rem, 1.25vw, .86rem); }
.camara-feedback { font-size: .55rem; }
.valvulas-grupo__label { font-size: .42rem; }
.valvulas-grupo__label b { font-size: .35rem; }
.franja-peligro { font-size: .38rem; }
.accion { min-height: 58px; }
.accion__icono { font-size: .82rem; }
.accion__nombre { font-size: .57rem; letter-spacing: .06em; }
.accion__sub { font-size: .35rem; }
.accion__coste { font-size: .33rem; }
#aviso-accion { font-size: .42rem; }
.tonos legend { font-size: .42rem; }
.tono { min-height: 36px; }
.tono__marca { font-size: .62rem; }
.tono__nombre { font-size: .52rem; }
.tono small { font-size: .38rem; }
.campo > span { font-size: .42rem; }
.campo textarea { font-size: .68rem; }
.conducto__firma { font-size: .4rem; }
.conducto__estado { font-size: .42rem; }
.conducto__enviar { font-size: .56rem; }
.sinapsis span { font-size: .36rem; }
.sinapsis p { font-size: .46rem; }
.registro__item { font-size: .43rem; }
.registro__hora,
.registro__actor { font-size: .37rem; }
.registro__vacio { font-size: .45rem; }
.registro__pie { font-size: .4rem; }
.registro__refrescar { font-size: .7rem; }
.ente-lead { font-size: .68rem; }
.ente-hero__status span { font-size: .37rem; }
.ente-hero__status b { font-size: .65rem; }
.ente-info-btn { font-size: .45rem; }
.ente-info-btn__icon { font-size: .6rem; }
.ficha__lead { font-size: .72rem; }
.ficha__aviso { font-size: .52rem; }
.ficha__datos dt { font-size: .42rem; }
.ficha__datos dd { font-size: .52rem; }
.ficha__lore,
.ficha__creditos { font-size: .44rem; }
.ente-explica article b { font-size: .52rem; }
.ente-explica article p { font-size: .5rem; }

@media (max-width: 600px) {
  .panel__head,
  .camara-panel__head { font-size: .52rem; }
  .medidor__fila { font-size: .48rem; }
  .tono__nombre { font-size: .5rem; }
  .accion__nombre { font-size: .55rem; }
  .registro__item { font-size: .41rem; }
  .ente-lead { font-size: .58rem; line-height: 1.5; }
  .camara-panel__foot { font-size: .39rem; }
  .audio-btn { font-size: .39rem; }
}

/* Segundo escalón de lectura: etiquetas y datos por encima de 9 px reales. */
.panel__head { font-size: .64rem; }
.camara-panel__head { font-size: .6rem; }
.camara-panel__foot { font-size: .46rem; }
.audio-btn { font-size: .46rem; }
.tel__identidad span { font-size: .48rem; }
.tel__identidad b { font-size: .7rem; }
.tel__identidad small { font-size: .48rem; }
.medidor__fila { font-size: .6rem; }
.medidor__fila b { font-size: .7rem; }
.separador { font-size: .46rem; }
.valencia-extremos { font-size: .4rem; }
.psique-mini .medidor__fila { font-size: .46rem; }
.psique-mini .medidor__fila b { font-size: .56rem; }
.eeg span { font-size: .42rem; }
.tel__pie span { font-size: .42rem; }
.tel__pie b { font-size: .82rem; }
.tel__pie small { font-size: .4rem; }
.cerebro__contador b { font-size: 1.8rem; }
.cerebro__contador span { font-size: .48rem; }
.cerebro__mini span { font-size: .4rem; }
.cerebro__mini b { font-size: .6rem; }
.palabra-chip { font-size: .5rem; }
.palabra-chip small { font-size: .4rem; }
.cerebro__vacio { font-size: .5rem; }
.cerebro__nota { font-size: .48rem; }
.camara-hud { font-size: .46rem; }
.camara-hud span { font-size: .42rem; }
.camara-hud b { font-size: .56rem; }
.voz__head { font-size: .46rem; }
.voz__head span:last-child { font-size: .4rem; }
.voz__texto { font-size: clamp(.72rem, 1.3vw, .9rem); }
.camara-feedback { font-size: .6rem; }
.valvulas-grupo__label { font-size: .46rem; }
.valvulas-grupo__label b { font-size: .4rem; }
.franja-peligro { font-size: .42rem; }
.accion { min-height: 60px; }
.accion__nombre { font-size: .64rem; }
.accion__sub { font-size: .4rem; }
.accion__coste { font-size: .37rem; }
#aviso-accion { font-size: .46rem; }
.tonos legend { font-size: .46rem; }
.tono { min-height: 38px; }
.tono__nombre { font-size: .58rem; }
.tono small { font-size: .43rem; }
.campo > span { font-size: .46rem; }
.campo textarea { font-size: .74rem; }
.conducto__firma { font-size: .44rem; }
.conducto__estado { font-size: .46rem; }
.conducto__enviar { font-size: .62rem; }
.sinapsis span { font-size: .4rem; }
.sinapsis p { font-size: .52rem; }
.registro__item { font-size: .5rem; }
.registro__hora,
.registro__actor { font-size: .42rem; }
.registro__vacio { font-size: .5rem; }
.registro__pie { font-size: .44rem; }
.ente-lead { font-size: .75rem; }
.ente-hero__status span { font-size: .42rem; }
.ente-hero__status b { font-size: .7rem; }
.ente-info-btn { font-size: .5rem; }
.ficha__lead { font-size: .78rem; }
.ficha__aviso { font-size: .58rem; }
.ficha__datos dt { font-size: .46rem; }
.ficha__datos dd { font-size: .58rem; }
.ficha__lore,
.ficha__creditos { font-size: .5rem; }
.ente-explica article b { font-size: .58rem; }
.ente-explica article p { font-size: .56rem; }

/* Recorta aire para que el aumento de letra no rompa el cockpit. */
.acciones__grid { padding: 5px 7px 6px; }
.valvulas-grupo__label { margin-bottom: 3px; }
.franja-peligro { min-height: 14px; margin: 5px 0; }
.acciones__pie { padding: 4px 8px; }
.tel__cuerpo { padding: 8px 9px 9px; }
.medidor { margin-bottom: 7px; }
.conducto__form { padding: 8px 9px 9px; }

@media (max-width: 600px) {
  .panel__head,
  .camara-panel__head { font-size: .56rem; }
  .medidor__fila { font-size: .52rem; }
  .medidor__fila b { font-size: .62rem; }
  .tono__nombre { font-size: .54rem; }
  .accion__nombre { font-size: .58rem; }
  .registro__item { font-size: .46rem; }
  .ente-lead { font-size: .62rem; line-height: 1.5; }
  .camara-panel__foot { font-size: .44rem; }
  .audio-btn { font-size: .44rem; }
}

/* Contraste para las etiquetas más pequeñas: subir tamaño sin romper paneles. */
.panel__head { color: #9aa47c; }
.accion__sub { font-size: .43rem; color: #b2b79f; }
.accion__coste { font-size: .4rem; color: #9ca681; }
.tono small { font-size: .47rem; color: #a3ab92; }
.registro__item { font-size: .54rem; }
.registro__hora { color: #8c947e; }
.registro__actor { color: #a8b184; }
.registro__texto { color: #b0b5a2; }
.cerebro__nota { color: #99a184; }
.camara-panel__foot { color: #aab198; }
#aviso-accion { color: #aab198; }
.conducto__estado { color: #a5ad94; }
.tel__identidad span,
.tel__identidad small { color: #99a18e; }
.valencia-extremos { color: #8f9781; }
.ente-lore,
.ente-creditos { color: #8f9781; }

@media (max-width: 600px) {
  .accion__sub { font-size: .41rem; }
  .accion__coste { font-size: .38rem; }
  .tono small { font-size: .45rem; }
  .registro__item { font-size: .5rem; }
}

/* ==========================================================================
   SELECTOR DE ESPÉCIMENES
   ========================================================================== */
.especimenes { display: flex; flex: 0 0 auto; gap: 3px; align-items: center; }
.especimen-tab {
  min-height: 21px;
  padding: 2px 7px;
  border: 1px solid var(--line-bio-dim);
  border-radius: 0;
  background: rgba(4, 8, 5, .55);
  color: var(--bio-dim);
  font-family: var(--label);
  font-size: .52rem;
  letter-spacing: .08em;
  line-height: 1;
  cursor: pointer;
}
.especimen-tab:hover { border-color: var(--bio); color: var(--bio-bright); }
.especimen-tab[aria-selected="true"] {
  border-color: var(--bio);
  background: rgba(183, 192, 122, .12);
  color: var(--bio-bright);
  box-shadow: inset 0 -2px 0 var(--bio);
}
.especimen-tab:focus-visible { outline: 2px solid var(--bio-bright); outline-offset: 2px; }

.ente-body[data-especimen="b18"] {
  --bio: #d2a35c;
  --bio-bright: #f0cf95;
  --bio-dim: #8a693b;
  --fluid: #6b4e24;
  --line-bio: rgba(210, 163, 92, .3);
  --line-bio-dim: rgba(210, 163, 92, .14);
  --frio: #c89d6a;
  background-color: #0b0805;
  background-image:
    radial-gradient(900px 640px at 50% 8%, rgba(160, 105, 45, .16), transparent 62%),
    radial-gradient(840px 620px at 100% 40%, rgba(120, 72, 30, .1), transparent 65%),
    radial-gradient(760px 520px at 0% 70%, rgba(120, 90, 40, .07), transparent 65%),
    linear-gradient(rgba(210, 163, 92, .022) 1px, transparent 1px),
    linear-gradient(90deg, rgba(210, 163, 92, .018) 1px, transparent 1px);
}
.ente-body[data-especimen="b19"] {
  --bio: #82c9c2;
  --bio-bright: #c2f5ef;
  --bio-dim: #4d837e;
  --fluid: #2f6866;
  --line-bio: rgba(130, 201, 194, .3);
  --line-bio-dim: rgba(130, 201, 194, .14);
  --frio: #a99ad8;
  background-color: #05080a;
  background-image:
    radial-gradient(900px 640px at 50% 8%, rgba(55, 125, 125, .17), transparent 62%),
    radial-gradient(840px 620px at 100% 40%, rgba(105, 80, 155, .1), transparent 65%),
    radial-gradient(760px 520px at 0% 70%, rgba(60, 110, 115, .07), transparent 65%),
    linear-gradient(rgba(130, 201, 194, .022) 1px, transparent 1px),
    linear-gradient(90deg, rgba(130, 201, 194, .018) 1px, transparent 1px);
}
.ente-body[data-especimen="b18"] .camara-panel { background: #0b0805; }
.ente-body[data-especimen="b19"] .camara-panel { background: #05080a; }
.ente-body[data-especimen="b18"] .especimen-tab[aria-selected="true"] { background: rgba(210, 163, 92, .13); }
.ente-body[data-especimen="b19"] .especimen-tab[aria-selected="true"] { background: rgba(130, 201, 194, .13); }

@media (max-width: 600px) {
  .camara-panel__head > span:first-child { display: none; }
  .especimenes { flex: 1 1 auto; justify-content: flex-start; }
  .especimen-tab { flex: 1 1 0; padding: 3px 2px; font-size: .5rem; }
}

/* ==========================================================================
   TERCER ESCALÓN DE LECTURA
   ========================================================================== */
.panel__head { font-size: .72rem; }
.camara-panel__head { font-size: .66rem; }
.camara-panel__foot { font-size: .52rem; }
.audio-btn { font-size: .52rem; }
.tel__identidad span { font-size: .54rem; }
.tel__identidad b { font-size: .76rem; }
.tel__identidad small { font-size: .52rem; }
.medidor__fila { font-size: .66rem; }
.medidor__fila b { font-size: .78rem; }
.separador { font-size: .52rem; }
.valencia-extremos { font-size: .44rem; }
.psique-mini .medidor__fila { font-size: .5rem; }
.psique-mini .medidor__fila b { font-size: .62rem; }
.eeg span { font-size: .46rem; }
.tel__pie span { font-size: .46rem; }
.tel__pie b { font-size: .9rem; }
.tel__pie small { font-size: .44rem; }
.cerebro__contador b { font-size: 1.95rem; }
.cerebro__contador span { font-size: .54rem; }
.cerebro__mini span { font-size: .44rem; }
.cerebro__mini b { font-size: .66rem; }
.palabra-chip { font-size: .56rem; }
.palabra-chip small { font-size: .44rem; }
.cerebro__vacio { font-size: .56rem; }
.cerebro__nota { font-size: .54rem; }
.camara-hud { font-size: .5rem; }
.camara-hud span { font-size: .44rem; }
.camara-hud b { font-size: .62rem; }
.voz__head { font-size: .52rem; }
.voz__head span:last-child { font-size: .44rem; }
.voz__texto { font-size: clamp(.8rem, 1.4vw, .98rem); }
.camara-feedback { font-size: .66rem; }
.valvulas-grupo__label { font-size: .52rem; }
.valvulas-grupo__label b { font-size: .44rem; }
.franja-peligro { font-size: .46rem; }
.accion__nombre { font-size: .7rem; }
.accion__sub { font-size: .46rem; }
.accion__coste { font-size: .43rem; }
#aviso-accion { font-size: .52rem; }
.tonos legend { font-size: .52rem; }
.tono__nombre { font-size: .64rem; }
.tono small { font-size: .5rem; }
.campo > span { font-size: .52rem; }
.campo textarea { font-size: .8rem; }
.conducto__firma { font-size: .5rem; }
.conducto__estado { font-size: .52rem; }
.conducto__enviar { font-size: .68rem; }
.sinapsis span { font-size: .46rem; }
.sinapsis p { font-size: .58rem; }
.registro__item { font-size: .58rem; }
.registro__hora,
.registro__actor { font-size: .46rem; }
.registro__vacio { font-size: .56rem; }
.registro__pie { font-size: .48rem; }
.ente-lead { font-size: .82rem; }
.ente-hero__status span { font-size: .46rem; }
.ente-hero__status b { font-size: .76rem; }
.ente-info-btn { font-size: .56rem; }

@media (max-width: 600px) {
  .panel__head,
  .camara-panel__head { font-size: .6rem; }
  .medidor__fila { font-size: .56rem; }
  .medidor__fila b { font-size: .66rem; }
  .tono__nombre { font-size: .58rem; }
  .accion__nombre { font-size: .62rem; }
  .registro__item { font-size: .52rem; }
  .ente-lead { font-size: .68rem; }
  .voz__texto { font-size: .72rem; }
}

/* Entrada: primero texto, después la forma de decirlo. La cuadrícula de 8
   emociones ocupa cuatro filas y no empuja el tanque. */
.tonos { margin-top: 8px; }
.tonos__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 3px; }
.tono { min-height: 44px; padding: 4px 5px; }
.tono small { line-height: 1.2; }
.tono[data-tono="AGRESIVIDAD"][aria-pressed="true"],
.tono[data-tono="BURLA"][aria-pressed="true"] {
  border-color: rgba(217, 75, 50, .32);
  border-left-color: var(--peligro);
  background: rgba(217, 75, 50, .07);
}
.tono[data-tono="AGRESIVIDAD"][aria-pressed="true"] .tono__marca,
.tono[data-tono="BURLA"][aria-pressed="true"] .tono__marca {
  border-color: var(--peligro);
  background: var(--peligro);
}
.tono[data-tono="AGRESIVIDAD"][aria-pressed="true"] .tono__nombre,
.tono[data-tono="BURLA"][aria-pressed="true"] .tono__nombre { color: #e27760; }

/* La puerta de sonido: más grande, porque el navegador exige un gesto. */
.activar-voz {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 46px;
  padding: 7px 11px;
  font-size: .6rem;
  border-color: var(--bio);
  background: rgba(4, 10, 5, .96);
  box-shadow: 0 0 0 1px rgba(0, 0, 0, .7), 0 0 34px rgba(183, 192, 122, .18);
}
.activar-voz__icono {
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  border: 1px solid var(--line-bio);
  color: var(--bio-bright);
  font-size: 1rem;
  line-height: 1;
}
.activar-voz__texto { display: flex; flex-direction: column; gap: 2px; text-align: left; }
.activar-voz__texto small { color: var(--bio-dim); font-size: .46rem; letter-spacing: .04em; }
.activar-voz:hover .activar-voz__icono { background: var(--bio); color: #080b06; }
@media (max-width: 600px) {
  .activar-voz { min-height: 42px; padding: 5px 8px; font-size: .52rem; }
  .activar-voz__icono { width: 22px; height: 22px; font-size: .8rem; }
  .activar-voz__texto small { font-size: .4rem; }
}

/* Táctil: evita el doble toque de zoom y el destello de pulsación. */
.ente-body { -webkit-tap-highlight-color: transparent; }
.ente-body button,
.ente-body .accion,
.ente-body .especimen-tab,
.ente-body .activar-voz { touch-action: manipulation; }

/* Respuesta compacta: en móvil el conducto sube junto al tanque y el eco
   queda pegado al campo para no perder la contestación. */
.conducto__eco { display: none; }
@media (max-width: 880px) {
  .conducto__eco {
    display: block;
    margin: 0 0 8px;
    padding: 7px 8px;
    border: 1px solid var(--line-bio);
    background: rgba(183, 192, 122, .045);
    scroll-margin-top: 120px;
  }
  .conducto__eco > span {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    color: var(--bio-dim);
    font-family: var(--label);
    font-size: .44rem;
    letter-spacing: .09em;
  }
  .conducto__eco > span b { color: var(--bio-bright); font-weight: 500; }
  .conducto__eco p {
    margin: 4px 0 0;
    color: var(--bone);
    font-family: var(--mono);
    font-size: .72rem;
    line-height: 1.45;
  }
}

/* ==========================================================================
   GUÍA ABIERTA / SEO
   --------------------------------------------------------------------------
   Texto visible y rastreable para buscadores y para quien llega sin conocer
   la cámara: qué es Homúnculo, cómo se juega y preguntas frecuentes.
   ========================================================================== */

.ente-title__sub b {
  color: var(--bio-bright);
  font-weight: 500;
}

.ente-guia {
  margin-top: 18px;
  padding: clamp(17px, 2.6vw, 30px);
  border: 1px solid var(--line-bio-dim);
  background:
    radial-gradient(70% 90% at 100% 0, rgba(183, 192, 122, .045), transparent 62%),
    linear-gradient(180deg, rgba(183, 192, 122, .028), transparent 42%),
    rgba(9, 13, 9, .7);
}

.ente-guia__head { max-width: 96ch; }
.ente-guia .kicker { margin: 0 0 6px; }
.ente-guia h2 {
  margin: 0 0 12px;
  color: var(--bone);
  font-family: var(--display);
  font-size: clamp(1.8rem, 3.4vw, 3.1rem);
  font-weight: 900;
  letter-spacing: -.045em;
  line-height: .88;
  text-transform: uppercase;
  transform: scaleX(.94);
  transform-origin: left top;
}

.ente-guia__lead {
  max-width: 92ch;
  margin: 0;
  color: #b8b5a3;
  font-size: .63rem;
  line-height: 1.75;
}
.ente-guia__lead strong { color: var(--bio-bright); font-weight: 400; }

.ente-guia__camaras {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 18px;
}

.ente-camara {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 14px;
  border: 1px solid var(--line-bio-dim);
  background: rgba(5, 8, 5, .55);
  color: var(--bone);
  text-decoration: none;
  transition: border-color .16s ease, background .16s ease;
}
.ente-camara:hover {
  border-color: var(--bio);
  background: rgba(183, 192, 122, .06);
}
.ente-camara__no {
  color: var(--bio);
  font-family: var(--label);
  font-size: .52rem;
  font-weight: 600;
  letter-spacing: .16em;
}
.ente-camara strong {
  margin: 2px 0 3px;
  color: var(--bio-bright);
  font-family: var(--display);
  font-size: 1.18rem;
  font-weight: 900;
  letter-spacing: -.03em;
  line-height: 1;
  text-transform: uppercase;
}
.ente-camara > span:not(.ente-camara__no) {
  color: var(--steel);
  font-size: .51rem;
  line-height: 1.6;
}
.ente-camara em {
  margin-top: auto;
  padding-top: 8px;
  color: var(--amber);
  font-family: var(--label);
  font-size: .45rem;
  font-style: normal;
  font-weight: 600;
  letter-spacing: .09em;
}
.ente-camara:hover em { color: var(--amber); text-decoration: underline; }

.ente-guia__cols {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px 30px;
  margin-top: 22px;
  padding-top: 18px;
  border-top: 1px solid var(--line-bio-dim);
}
.ente-guia__cols h3,
.ente-guia__faq h3 {
  margin: 0 0 9px;
  color: var(--bio);
  font-family: var(--label);
  font-size: .58rem;
  font-weight: 600;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.ente-guia__cols ol,
.ente-guia__cols ul {
  margin: 0;
  padding-left: 18px;
  color: #b8b5a3;
  font-size: .56rem;
  line-height: 1.7;
}
.ente-guia__cols li { margin-bottom: 5px; }
.ente-guia__cols li::marker { color: var(--bio); }
.ente-guia__cols strong { color: var(--bio-bright); font-weight: 400; }

.ente-guia__faq {
  margin-top: 22px;
  padding-top: 18px;
  border-top: 1px solid var(--line-bio-dim);
}
.ente-guia__faq details {
  border-top: 1px solid var(--line-bio-dim);
  padding: 9px 0;
}
.ente-guia__faq details:last-of-type { border-bottom: 1px solid var(--line-bio-dim); }
.ente-guia__faq summary {
  cursor: pointer;
  color: var(--bone);
  font-family: var(--mono);
  font-size: .56rem;
  letter-spacing: .02em;
  list-style: none;
}
.ente-guia__faq summary::-webkit-details-marker { display: none; }
.ente-guia__faq summary::before {
  content: "[+]";
  margin-right: 8px;
  color: var(--bio);
}
.ente-guia__faq details[open] summary::before { content: "[-]"; }
.ente-guia__faq details p {
  max-width: 96ch;
  margin: 7px 0 2px 26px;
  color: var(--steel);
  font-size: .53rem;
  line-height: 1.7;
}

.ente-guia__links {
  margin: 18px 0 0;
  color: var(--steel);
  font-family: var(--mono);
  font-size: .5rem;
  line-height: 1.8;
}
.ente-guia__links a { color: var(--bio); }
.ente-guia__links a:hover { color: var(--amber); }

@media (max-width: 900px) {
  .ente-guia__camaras { grid-template-columns: 1fr; }
  .ente-guia__cols { grid-template-columns: 1fr; }
}

@media (max-width: 600px) {
  .ente-guia { padding: 13px 11px; }
  .ente-guia h2 { font-size: clamp(1.6rem, 9vw, 2.2rem); }
  .ente-guia__lead { font-size: .58rem; }
  .ente-guia__camaras { gap: 8px; }
  .ente-camara { padding: 11px; }
  .ente-camara strong { font-size: 1rem; }
  .ente-guia__cols ol,
  .ente-guia__cols ul { font-size: .52rem; }
  .ente-guia__faq summary { font-size: .52rem; }
  .ente-guia__faq details p { font-size: .5rem; }
}

/* En móvil el nombre del proyecto manda y el espécimen baja a su línea:
   así «HOMÚNCULO» no se parte y no se pega al texto de presentación. */
@media (max-width: 600px) {
  .ente-title {
    display: block;
    font-size: clamp(2.2rem, 9.6vw, 2.6rem);
    line-height: .82;
  }
  .ente-title__sub {
    display: block;
    margin-top: 7px;
    font-size: .34em;
    letter-spacing: .12em;
    vertical-align: 0;
    white-space: normal;
  }
  .ente-lead { margin-top: 8px; }
}