/* Ni mu (juegos/nimu/tv.js). Escena blanca: los personajes cuentan quién describe, quién
   adivina y quién vigila (docs/diseno/maquetas/nimu). Fondo estático; el contenido solo
   cambia al pasar algo (nunca en cada fotograma). Sin box-shadow, filter ni canvas; solo
   se animan transform y opacity. 1rem = 32 px a 1080p; ningún texto por debajo de 1rem. */
.nimu { background: #fff; color: var(--tg-ink); }
/* El área común es oscura: en blanco, para que no asome por las esquinas redondeadas */
.juego--escena #juego-area:has(> .nimu) { background: #fff; }
.nimu p { margin: 0; }

/* ---------- Centro: el que describe, su reloj y su bocadillo ---------- */
.nimu-tarjeta { position: absolute; inset: 0; pointer-events: none; }
.nimu-halo {
  position: absolute; left: 50%; top: 1.875rem; width: 13.75rem; height: 13.75rem; margin-left: -6.875rem;
  border-radius: var(--tg-r-pill); background: var(--tg-nimu-claro);
}
.nimu-quien {
  position: absolute; left: 50%; top: 3.75rem; width: 9.375rem; height: 9.375rem; margin-left: -4.6875rem;
  transform: rotate(-3deg);
}
.nimu-quien .tg-cara { display: block; width: 100%; height: 100%; }
.nimu-quien .tg-cara--foto { border-radius: var(--tg-r-pill); object-fit: cover; }

/* Reloj: número de 92 px dentro de un aro turquesa, pegado al que describe */
.nimu-segundos {
  position: absolute; left: 50%; top: .625rem; width: 5.625rem; height: 5.625rem; margin-left: 3.4375rem;
  box-sizing: border-box; border-radius: var(--tg-r-pill); background: #fff; border: .3125rem solid var(--tg-nimu);
  display: flex; align-items: center; justify-content: center;
  font-size: 2.875rem; font-weight: 700; letter-spacing: -.04em; line-height: 1; color: var(--tg-nimu-tinta);
  font-variant-numeric: tabular-nums;
}

/* Bocadillo: «…» mientras describe, o un texto corto («¡Me toca!») */
.nimu-bocadillo {
  position: absolute; right: 50%; top: 2.1875rem; min-width: 5.3125rem; height: 3.4375rem; margin-right: 5rem;
  box-sizing: border-box; padding: 0 1.25rem; border-radius: var(--tg-r-pill); background: var(--tg-nimu-oscuro); color: #fff;
  display: flex; align-items: center; justify-content: center; gap: .4375rem;
  font-size: 1.25rem; font-weight: var(--tg-w-strong); white-space: nowrap;
}
.nimu-bocadillo[hidden] { display: none; }
.nimu-punto { width: .75rem; height: .75rem; border-radius: var(--tg-r-pill); background: #fff; }
.nimu-punto:nth-child(1) { opacity: .4; }
.nimu-punto:nth-child(2) { opacity: .7; }

/* «Alberto describe» */
.nimu-tarjeta__titulo {
  position: absolute; left: 0; right: 0; top: 16.5625rem; text-align: center;
  font-size: 1.75rem; font-weight: var(--tg-w-strong); letter-spacing: -.02em; line-height: 1.1;
}
.nimu-tarjeta__titulo .tg-personaje--linea { width: 1.75rem; height: 1.75rem; vertical-align: -.2em; }
.nimu-tarjeta__sub {
  position: absolute; left: 0; right: 0; top: 18.75rem; text-align: center;
  font-size: 1.125rem; color: var(--tg-muted);
}
.nimu-tarjeta__sub:empty { display: none; }

/* ---------- Equipos (con 4 o más jugadores): a cada lado ---------- */
.nimu-equipo {
  position: absolute; top: 1.25rem; width: 14.6875rem;
  display: flex; flex-direction: column; gap: .6875rem; align-items: flex-start;
}
.nimu-equipo--0 { left: 1.25rem; }
.nimu-equipo--1 { right: 1.25rem; align-items: flex-end; }
.nimu-equipo__cabeza { display: flex; align-items: center; gap: .625rem; }
.nimu-equipo__nombre {
  height: 2rem; padding: 0 .8125rem; border-radius: var(--tg-r-pill); display: flex; align-items: center;
  font-size: 1.125rem; font-weight: var(--tg-w-strong); white-space: nowrap;
}
.nimu-equipo--0 .nimu-equipo__nombre { background: #6B3FD4; color: #fff; }
.nimu-equipo--1 .nimu-equipo__nombre { background: #E37400; color: var(--tg-ink); }
.nimu-equipo__puntos { font-size: 3rem; font-weight: var(--tg-w-strong); letter-spacing: -.04em; line-height: 1; }

.nimu-equipo__caras { display: flex; gap: .875rem; margin-top: .9375rem; }
.nimu-equipo__cara { display: flex; flex-direction: column; align-items: center; gap: .3125rem; }
.nimu-equipo__insignia { height: 2.625rem; display: flex; align-items: flex-end; }
.nimu-equipo__dibujo { width: 4.6875rem; height: 4.6875rem; }
.nimu-equipo__dibujo .tg-cara { display: block; width: 100%; height: 100%; }
.nimu-equipo__dibujo .tg-cara--foto { border-radius: var(--tg-r-pill); object-fit: cover; }
.nimu-equipo__cara--adivina .nimu-equipo__dibujo { transform: rotate(-4deg); }
.nimu-equipo__quien {
  max-width: 6.25rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-size: 1.0625rem; font-weight: var(--tg-w-medium);
}
.nimu-equipo__quien .tg-personaje--linea { width: 1.0625rem; height: 1.0625rem; vertical-align: -.15em; }
/* Con 3 o 4 personajes en un lado, más pequeños para que quepan */
.nimu-equipo--muchos .nimu-equipo__caras { gap: .5rem; }
.nimu-equipo--muchos .nimu-equipo__dibujo { width: 3.125rem; height: 3.125rem; }
.nimu-equipo--muchos .nimu-equipo__quien { max-width: 3.5rem; font-size: 1rem; }

/* Insignias: bocadillo amarillo «?» (adivina) y círculo noche con ojo (vigila) */
.nimu-insignia {
  position: relative; width: 2.25rem; height: 2.25rem; border-radius: var(--tg-r-pill);
  display: flex; align-items: center; justify-content: center;
}
.nimu-insignia svg { width: 1.21875rem; height: 1.21875rem; }
.nimu-insignia--adivina { background: var(--tg-rol-adivina); color: var(--tg-ink); font-size: 1.375rem; font-weight: 800; line-height: 1; }
.nimu-insignia--adivina::after {
  content: ""; position: absolute; left: .375rem; bottom: -.46875rem; width: .46875rem; height: .46875rem;
  border-radius: var(--tg-r-pill); background: var(--tg-rol-adivina);
}
.nimu-insignia--vigila { background: var(--tg-rol-vigila); }

/* Etiqueta del papel, debajo de los personajes */
.nimu-papel {
  height: 1.75rem; padding: 0 .75rem 0 .5625rem; border-radius: var(--tg-r-pill);
  display: inline-flex; align-items: center; gap: .3125rem;
  font-size: 1.0625rem; font-weight: var(--tg-w-strong); white-space: nowrap;
}
.nimu-papel svg { width: 1rem; height: 1rem; flex: none; }
.nimu-papel--adivina { background: var(--tg-rol-adivina); color: var(--tg-ink); }
.nimu-papel--vigila { background: var(--tg-rol-vigila); color: #fff; }

/* ---------- Bandeja: palabras ya jugadas en el turno (nunca la que está en juego) ---------- */
.nimu-palabras {
  position: absolute; left: 6.25rem; right: 6.25rem; top: 21.5625rem;
  padding-top: .875rem; border-top: .09375rem solid var(--tg-line);
  display: flex; align-items: center; gap: .75rem; overflow: hidden;
}
.nimu-palabras[hidden] { display: none; }
.nimu-bandeja__cuenta { flex: none; display: flex; align-items: baseline; gap: .375rem; }
.nimu-bandeja__n { font-size: 2.25rem; font-weight: 700; color: var(--tg-nimu-tinta); line-height: 1; }
.nimu-bandeja__texto { font-size: 1.125rem; color: var(--tg-muted); }
.nimu-bandeja__fichas { display: flex; gap: .375rem; min-width: 0; }
.nimu-palabra {
  flex: none; height: 1.875rem; padding: 0 .5rem 0 .375rem; border-radius: var(--tg-r-pill); box-sizing: border-box;
  display: flex; align-items: center; gap: .25rem; font-size: 1rem; font-weight: var(--tg-w-strong); white-space: nowrap;
}
.nimu-palabra svg { width: .875rem; height: .875rem; flex: none; }
.nimu-palabra__emoji { font-size: 1.125rem; line-height: 1; }
.nimu-palabra--ok, .nimu-palabra--acertada { background: #E3F5E9; color: #136B32; }
.nimu-palabra--pito, .nimu-palabra--pillada { background: var(--tg-error-bg); color: var(--tg-error); }
.nimu-palabra--pillada .nimu-palabra__texto { text-decoration: line-through; text-decoration-thickness: .125rem; }

/* Momento clave (de momento, la pastilla común): centrado sobre la bandeja */
#nimu-aviso { position: absolute; left: 0; right: 0; width: max-content; margin: 0 auto; top: 18.75rem; z-index: 3; }
