/* escena.css · Tarea A (ADENDA 9): etiquetas HUD finas estilo Igloo y HUD de la pieza en foco (home e /ia).
   Pisa los estilos compilados de index.*.css / ia.*.css con `html.cx-on` (más específico que `.cx--ia …`).
   Tamaños mínimos: texto ≥ 12 px, objetivos táctiles ≥ 44 px. */

/* ---------- etiquetas «PIEZA_0N · NOMBRE» ancladas a cada pieza ---------- */
html.cx-on .cx-etq {
  --etq: #a5ccff;
  font: 500 12px/16px var(--f-mono, "IBM Plex Mono", ui-monospace, Consolas, monospace);
  letter-spacing: 0.06em;
  color: #eef2ff;
  text-shadow: 0 1px 8px #02040b;
  white-space: nowrap;
}
html.cx-on .cx-etq[data-region="0"] { --etq: #e0a6f7; }
html.cx-on .cx-etq[data-region="1"] { --etq: #19f58c; }
html.cx-on .cx-etq[data-region="2"] { --etq: #4cc3f5; }
html.cx-on .cx-etq[data-region="3"] { --etq: #ff8b9c; }
html.cx-on .cx--ia .cx-etq { --etq: #19f58c; }

html.cx-on .cx-etq__cod,
html.cx-on .cx-etq__nom {
  position: static;
  display: inline-block;
  min-width: 0;
  min-height: 0;
  opacity: 1;
  vertical-align: top;
  text-align: left;
  background: rgba(2, 4, 11, 0.66);
  padding: 2px 6px;
}
html.cx-on .cx--ia .cx-etq__cod,
html.cx-on .cx--ia .cx-etq__nom { background: rgba(2, 11, 6, 0.66); }
html.cx-on .cx-etq__cod { color: var(--etq); letter-spacing: 0.08em; font-weight: 500; }
html.cx-on .cx-etq__nom { color: #eef2ff; padding-left: 0; }
html.cx-on .cx-etq__nom::before { content: "· "; color: var(--etq); }
html.cx-on .cx-etq__sub {
  display: flex;
  flex-direction: column;
  gap: 1px;
  margin-top: 4px;
  padding: 0 6px;
  font-weight: 400;
  color: #b9c3dc;
}
html.cx-on .cx-etq__click { color: var(--etq); letter-spacing: 0.1em; }
html.cx-on .cx-etq.is-izq { text-align: right; }
html.cx-on .cx-etq.is-izq .cx-etq__sub { align-items: flex-end; }
html.cx-on .cx-etq.is-hover .cx-etq__cod,
html.cx-on .cx-etq.is-hover .cx-etq__nom { background: rgba(2, 4, 11, 0.86); }
html.cx-on .cx-guia { stroke-width: 1px; }

/* móvil (mismo corte que el motor: aspecto < 0,8): solo «PIEZA_0N · NOMBRE» */
@media (max-aspect-ratio: 4/5) {
  html.cx-on .cx-etq__sub { display: none; }
}

/* ---------- HUD de la pieza en foco: etiqueta fina junto a la pieza ---------- */
html.cx-on .cx-hud.cx-hud--igloo {
  width: min(264px, 100vw - 32px);
  padding: 10px 12px 12px;
  background: rgba(3, 5, 14, 0.58);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(var(--cx-halo-rgb, 165, 204, 255), 0.22);
  text-shadow: 0 1px 10px #02040b;
}
html.cx-on .cx--ia .cx-hud.cx-hud--igloo { --cx-linea-rgb: 25, 245, 140; background: rgba(2, 11, 6, 0.58); }
html.cx-on .cx-hud--igloo .cx-hud__cod { font-size: 12px; letter-spacing: 0.08em; }
html.cx-on .cx-hud--igloo .cx-hud__nom {
  min-height: 0;
  margin: 4px 0 8px;
  font-size: 1.15rem;
  line-height: 1.15;
  display: block;
}
html.cx-on .cx-hud--igloo .cx-hud__tel { margin: 0 0 10px; font-size: 12px; gap: 2px; }
html.cx-on .cx-hud--igloo .cx-hud__tel div { grid-template-columns: 64px 1fr; }
html.cx-on .cx-hud--igloo .cx-hud__acciones { display: block; }
html.cx-on .cx-hud--igloo .cx-hud__resumen {
  width: 100%;
  min-height: 44px;
  justify-content: space-between;
  gap: 12px;
  padding: 0 14px;
  font: 500 12px/1 var(--f-mono, "IBM Plex Mono", ui-monospace, Consolas, monospace);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #fff;
  background: rgba(var(--cx-linea-rgb, 24, 175, 241), 0.14);
  border: 1px solid var(--cx-acento, #18aff1);
}
html.cx-on .cx-hud--igloo .cx-hud__resumen i { font-style: normal; transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1); }
@media (hover: hover) {
  html.cx-on .cx-hud--igloo .cx-hud__resumen:hover { background: rgba(var(--cx-linea-rgb, 24, 175, 241), 0.28); }
  html.cx-on .cx-hud--igloo .cx-hud__resumen:hover i { transform: translateX(3px); }
}
html.cx-on .cx-hud--igloo .cx-hud__resumen:focus-visible {
  outline: 2px solid var(--cx-acento, #18aff1);
  outline-offset: 3px;
  border-radius: 0;
}
@media (prefers-reduced-motion: reduce) {
  html.cx-on .cx-hud--igloo .cx-hud__resumen i { transition: none; }
}
@media (max-aspect-ratio: 4/5) {
  html.cx-on .cx-hud.cx-hud--igloo { width: min(300px, 100vw - 32px); padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px)); }
}

/* Fase 1 (PLAN_REVISION_FINAL) · «texto que se cuela» al arrancar: con la escena (cx-on) la ficha de cada región es solo para
   lectores de pantalla. Esta regla estaba solo en ui/ventana-vidrio.css, que se pide tras `cerebro:listo`; durante el
   «calentamiento» del motor (.is-calentando quita el recorte de .cx-regiones, z-index 21 sobre el loader) la ficha se veía
   sin estilo encima de la pantalla de carga. Aquí llega antes del primer pintado. */
html.cx-on .cx-reg > .cx-reg__ficha {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}