/* Evolución sobre la composición aprobada: SVG originales, contenido siempre útil. */
.a4-dinamica .a4-entrada { animation: a4-aparece .68s cubic-bezier(.16,1,.3,1) both; }
.a4-dinamica .stk.a4-entrada { animation-name: a4-sticker; animation-duration: .7s; }
.a4-dinamica .a4-entrada:not(.a4-en-vista) { animation-play-state: paused; }
.a4-dinamica .ruta-cam { animation: none; }
.a4-dinamica .ruta.a4-ruta-lista .ruta-cam { left: 6%; animation: a4-avanza 4.8s ease-in-out both; animation-play-state: paused; }
.a4-dinamica .ruta.a4-ruta-lista .e-recta { stroke-dasharray: var(--a4-largo); animation: a4-dibuja 4.8s ease-in-out both; animation-play-state: paused; }
.a4-dinamica .ruta.a4-ruta-lista .e-x { animation: a4-llegada 4.8s ease-in-out both; animation-play-state: paused; }
.a4-dinamica .ruta.a4-en-vista .ruta-cam,
.a4-dinamica .ruta.a4-en-vista .e-recta,
.a4-dinamica .ruta.a4-en-vista .e-x { animation-play-state: running; }
.a4-en-pausa .a4-entrada,
.a4-en-pausa .ruta.a4-ruta-lista .ruta-cam,
.a4-en-pausa .ruta.a4-ruta-lista .e-recta,
.a4-en-pausa .ruta.a4-ruta-lista .e-x { animation-play-state: paused !important; }
.riel li .riel-n { transition: border-color .25s, background-color .25s; }
.a4-dinamica .riel li.a4-en-vista .riel-n { border-color: var(--rojo); background: #292024; }
.a4-dinamica .riel li.fin.a4-en-vista .riel-n { background: var(--rojo); }
@keyframes a4-aparece { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
@keyframes a4-sticker { from { opacity: 0; transform: translateY(10px) scale(.96); } to { opacity: 1; transform: none; } }
@keyframes a4-avanza {
  0% { opacity: 0; transform: translateX(0); }
  8% { opacity: 1; transform: translateX(0); }
  76%, 100% { opacity: 1; transform: translateX(var(--a4-recorrido)); }
}
@keyframes a4-dibuja { 0%, 8% { stroke-dashoffset: var(--a4-largo); } 76%, 100% { stroke-dashoffset: 0; } }
@keyframes a4-llegada { 0%, 52% { opacity: .3; } 76%, 100% { opacity: 1; } }
.ruta-repetir { display: flex; align-items: center; min-height: 44px; width: fit-content; margin: 4px 0 0 auto; padding: 6px 0 6px 12px; border: 0; border-bottom: 1px solid rgba(247,247,244,.3); background: transparent; color: var(--suave); font: 500 13px/1.4 var(--f-txt); cursor: pointer; }
.perfil-invitacion { margin-top: 20px; font: 500 15px/1.5 var(--f-txt); color: var(--suave); }
.perfil-elegir { appearance: none; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 14px; min-height: 48px; width: 100%; padding: 4px 0; border: 0; background: transparent; color: var(--blanco); text-align: left; font: 700 24px/1.05 var(--f-disp); letter-spacing: -.03em; cursor: pointer; }
.perfil-accion { font: 600 12px/1.3 var(--f-txt); color: var(--suave); padding: 5px 8px; border: 1px solid var(--linea); border-radius: 999px; }
.perfil-elegido { border-color: rgba(247,247,244,.55); background: #222328; }
.perfil-elegido .perfil-accion { color: var(--blanco); border-color: rgba(247,247,244,.4); }
.perfil-consejos { margin-top: 14px; padding: 20px; border-left: 2px solid var(--rojo); border-radius: 0 16px 16px 0; background: #1A1B1F; }
.perfil-area { color: var(--suave); font: 600 12px/1.4 var(--f-txt); letter-spacing: .08em; text-transform: uppercase; margin-bottom: 8px; }
.perfil-titulo { font: 700 24px/1.15 var(--f-disp); letter-spacing: -.025em; margin-bottom: 14px; }
.perfil-consejos ol { display: grid; gap: 12px; counter-reset: consejo; }
.perfil-consejos li { display: grid; grid-template-columns: 24px minmax(0,1fr); gap: 10px; color: #D6D7D3; font: 400 15px/1.5 var(--f-txt); }
.perfil-consejos li::before { counter-increment: consejo; content: counter(consejo,decimal-leading-zero); color: var(--suave); font: 600 12px/1.9 var(--f-txt); }
.pregunta-abrir { appearance: none; display: flex; align-items: center; justify-content: space-between; gap: 14px; min-height: 48px; width: 100%; padding: 4px 0; border: 0; background: transparent; color: var(--blanco); font: inherit; text-align: left; cursor: pointer; }
.pregunta-signo { flex: none; width: 28px; height: 28px; display: grid; place-items: center; border: 1px solid rgba(247,247,244,.3); border-radius: 50%; font: 400 24px/1 var(--f-txt); }
.fq p[hidden] { display: none; }
.a4-movimiento-reducido .a4-entrada,
.a4-movimiento-reducido .ruta.a4-ruta-lista .ruta-cam,
.a4-movimiento-reducido .ruta.a4-ruta-lista .e-recta,
.a4-movimiento-reducido .ruta.a4-ruta-lista .e-x { animation: none !important; opacity: 1; transform: none; }
.a4-movimiento-reducido .ruta.a4-ruta-lista .e-recta { stroke-dasharray: none; stroke-dashoffset: 0; }
.a4-movimiento-reducido .ruta-repetir { display: none; }
@media (prefers-reduced-motion: reduce) {
  .a4-dinamica .a4-entrada, .a4-dinamica .ruta.a4-ruta-lista .ruta-cam, .a4-dinamica .ruta.a4-ruta-lista .e-recta, .a4-dinamica .ruta.a4-ruta-lista .e-x { animation: none !important; opacity: 1; transform: none; }
  .a4-dinamica .ruta.a4-ruta-lista .e-recta { stroke-dasharray: none; stroke-dashoffset: 0; }
  .ruta-repetir { display: none; }
}

/* D4-A: etiqueta secundaria sobre la tarjeta oscura, contraste >=4.5. */
.qn-k { color: #a6a7ab; }