/* Examen aprobado: popup + confetti ------------------------------------- */
.examen-confetti { position: fixed; inset: 0; z-index: var(--z-confetti); pointer-events: none; }
.examen-exito { position: fixed; inset: 0; z-index: var(--z-modal-exito); display: flex; align-items: center; justify-content: center; padding: 1.5rem; }
.examen-exito__overlay { position: absolute; inset: 0; background: rgba(8, 10, 14, 0.78); backdrop-filter: blur(3px); }
.examen-exito__dialog {
  position: relative;
  width: min(460px, 100%);
  background: #fff;
  border-radius: 20px;
  padding: 2.5rem 2rem 2rem;
  text-align: center;
  box-shadow: 0 30px 70px rgba(0, 0, 0, 0.45);
  animation: examen-exito-pop 0.35s var(--ease, cubic-bezier(0.16, 1, 0.3, 1));
}
@keyframes examen-exito-pop { from { transform: scale(0.9) translateY(10px); opacity: 0; } to { transform: none; opacity: 1; } }
.examen-exito__x { position: absolute; top: 0.5rem; right: 0.5rem; display: grid; place-items: center; width: 44px; height: 44px; border: 0; background: transparent; font-size: 1.6rem; line-height: 1; color: var(--color-muted, #888); cursor: pointer; }
.examen-exito__x:hover { color: var(--color-text, #222); }
.examen-exito__emoji { font-size: 3.2rem; line-height: 1; margin-bottom: 0.5rem; }
.examen-exito__titulo { font-family: var(--font-head); font-weight: 800; font-size: 1.6rem; color: var(--color-primary-dark); margin: 0 0 0.75rem; }
.examen-exito__nota { font-family: var(--font-head); font-weight: 900; font-size: 3.4rem; line-height: 1; color: var(--color-primary); margin: 0; }
.examen-exito__nota span { font-size: 1.4rem; color: var(--color-muted, #888); font-weight: 700; }
.examen-exito__detalle { color: var(--color-muted, #666); margin: 0.35rem 0 1.5rem; }
.examen-exito__acciones { display: flex; flex-direction: column; gap: 0.6rem; }
.examen-exito__acciones .btn { width: 100%; }

/* Iconos de meta del curso (ficha + hero) -------------------------------- */
.curso-hero__meta li { display: inline-flex; align-items: center; gap: 0.4rem; }
.curso-hero__meta-ic { flex: 0 0 auto; opacity: 0.9; }
.curso-ficha__lista dt { display: inline-flex; align-items: center; gap: 0.45rem; }
.curso-ficha__ic { flex: 0 0 auto; color: var(--color-primary); }
.curso-ficha__lista dd { display: inline-flex; align-items: center; gap: 0.35rem; }
.curso-ficha__sino { flex: 0 0 auto; }
.curso-ficha__lista dd.is-si .curso-ficha__sino { color: var(--color-success-strong); }
.curso-ficha__lista dd.is-no .curso-ficha__sino { color: var(--color-muted, #9aa0a6); }

/* Examen ya rendido: resumen ------------------------------------------- */
.examen__ya { display: flex; justify-content: center; padding: 2rem 0; }
.examen__ya-card { background: #fff; border: 1px solid var(--color-border); border-radius: 16px; padding: 2rem; max-width: 440px; width: 100%; text-align: center; box-shadow: 0 12px 34px rgba(0, 0, 0, 0.08); }
.examen__ya-estado { display: inline-flex; align-items: center; gap: 0.4rem; font-weight: 700; }
.examen__ya-estado.is-ok { color: var(--color-success-strong); }
.examen__ya-estado.is-no { color: var(--color-primary-dark); }
.examen__ya-nota { font-family: var(--font-head); font-weight: 900; font-size: 3rem; line-height: 1; color: var(--color-primary); margin: 0.5rem 0 1rem; }
.examen__ya-nota span { font-size: 1.2rem; color: var(--color-muted); font-weight: 700; }
.examen__ya-tabla { width: 100%; border-collapse: collapse; margin: 0 0 1.5rem; font-size: var(--text-sm); }
.examen__ya-tabla th { text-align: left; color: var(--color-muted); font-weight: 600; padding: 0.45rem 0; border-bottom: 1px solid var(--color-border); }
.examen__ya-tabla td { text-align: right; font-weight: 700; padding: 0.45rem 0; border-bottom: 1px solid var(--color-border); }
.examen__ya-acciones { display: flex; flex-direction: column; gap: 0.6rem; }
.examen__ya-acciones .btn { width: 100%; }

/* Panel: barra de progreso slim + badge de estado a la derecha ----------- */
.panel-card__prog { display: flex; align-items: center; gap: 0.7rem; margin: 0.5rem 0 0.25rem; }
.panel-card__prog .progress { flex: 1; min-width: 0; height: 8px; box-shadow: none; background: #ece3e0; }
.panel-card__prog .progress__fill { min-width: 0; box-shadow: none; }
.panel-card__prog .progress__fill::after { content: none; display: none; }  /* sin knob */
.panel-card__prog .progress__state { display: none; }                        /* sin texto interno */
.panel-card__prog .panel-estado { flex: 0 0 auto; }

/* Respeta la preferencia de movimiento reducido en las animaciones de entrada. */
@media (prefers-reduced-motion: reduce) {
  .modal__dialog,
  .examen-exito__dialog { animation: none; }
}