/* boss-feel.css — El Examen (Boss Final DGT) con «toque de juego» (29-sep-2026).
 * Los momentos los marca games/boss/feel.js; aquí cómo se mueven (vocabulario
 * en css/juego-feel.css: opacity y translate/scale/rotate sueltas, que se suman
 * a lo que ya haya). No cambia los dibujos elegidos (los veredictos) ni el simulacro: en el examen NADA dice si vas bien o mal.
 */

/* ═════════ LA ENTRADA DEL AULA ═════════ */
/* (la cámara que entra la pone el plano de la puerta que monta arena.js, que
   tapa .bg: el acercamiento que había aquí sobre .bg no se veía nunca) */
@keyframes bxAcerca { from { scale: 1.14; } to { scale: 1; } }
#scrEntrada.on .entrada-panel { animation: jfSube .5s cubic-bezier(.2,.9,.3,1.15) .35s both; }

/* ═════════ EL EXAMEN: cada pregunta llega como hoja nueva ═════════ */
html[data-vp-game="boss"] body.boss-examen .q-text.vp-enter { animation: bxEnun .38s cubic-bezier(.3,1.3,.5,1) both; }
@keyframes bxEnun { 0% { opacity: 0; scale: .9; } 70% { opacity: 1; scale: 1.02; } 100% { opacity: 1; scale: 1; } }
html[data-vp-game="boss"] body.boss-examen .opt.vp-enter { animation: bxHoja .36s cubic-bezier(.2,.9,.3,1.12) both; }
html[data-vp-game="boss"] body.boss-examen .opt.vp-enter:nth-child(1) { animation-delay: .08s !important; }
html[data-vp-game="boss"] body.boss-examen .opt.vp-enter:nth-child(2) { animation-delay: .14s !important; }
html[data-vp-game="boss"] body.boss-examen .opt.vp-enter:nth-child(3) { animation-delay: .2s !important; }
html[data-vp-game="boss"] body.boss-examen .opt.vp-enter:nth-child(4) { animation-delay: .26s !important; }
html[data-vp-game="boss"] body.boss-examen .opt .tx.vp-enter { animation: none; }
@keyframes bxHoja { 0% { opacity: 0; translate: 46px 0; rotate: 1.5deg; } 70% { opacity: 1; translate: -3px 0; rotate: -.2deg; } 100% { opacity: 1; translate: 0 0; rotate: 0deg; } }
/* tu marca: la casilla se estampa (un golpe seco, sin color: no dice nada) */
html[data-vp-game="boss"] body.boss-examen .opt.marked .box { animation: bxCasilla .32s cubic-bezier(.3,1.6,.5,1); }
@keyframes bxCasilla { 0% { scale: 1.9; rotate: -12deg; } 60% { scale: .9; rotate: 3deg; } 100% { scale: 1; rotate: 0deg; } }

/* ═════════ EL VEREDICTO: el sello cae con más peso y la escena tiembla ═════════ */
#scrFin.on .bfin-escena { animation: bxAcerca 1.1s cubic-bezier(.2,.8,.2,1) both; }
#scrFin.bx-golpe .bfin-escena { animation: jfTiembla .46s linear both; }
html[data-vp-game="boss"] #scrFin .veredicto.slam { animation: bxVeredicto .55s cubic-bezier(.2,1.4,.4,1) forwards; }
@keyframes bxVeredicto {
  0%   { opacity: 0; transform: scale(3.4) rotate(-15deg); }
  52%  { opacity: 1; transform: scale(.88) rotate(-5deg); }
  74%  { transform: scale(1.07) rotate(-6.5deg); }
  100% { opacity: 1; transform: scale(1) rotate(-6deg); }
}
/* el rótulo del veredicto baja por debajo de la fila de controles: arriba del
   todo quedaba tapado por el sonido y el «!» (escena-fin.js coloca la nota y
   la columna midiendo dónde acaba la cabecera, así que se recoloca solo) */
.bfin-cab { top: calc(var(--ctl-fila, 56px) + 2px); }
/* los botones de oro del final laten */
html[data-vp-game="boss"] #finIn .cta:not(.sombria),
html[data-vp-game="boss"] .bunlock .cta,
html[data-vp-game="boss"] .bcert.fin .cta { animation: jfLatido 1.7s ease-in-out .6s infinite; }

@media (prefers-reduced-motion: reduce) {
  #scrEntrada .entrada-panel,
  body.boss-examen .q-text, body.boss-examen .opt, body.boss-examen .opt .box, #scrFin .bfin-escena,
  #finIn .cta, .bunlock .cta, .bcert .cta { animation: none !important; }
  html[data-vp-game="boss"] #scrFin .veredicto.slam { animation: none; opacity: 1; transform: rotate(-6deg); }
}