/**
 * Styles de l'écran de fin - Mortel Dîner
 */

/* Modal de fin */
#end-screen-modal {
  display: none;
}

#end-screen-modal.active {
  display: flex;
}

#end-screen-modal .modal__content {
  max-width: 800px;
  width: 90%;
  max-height: 90vh;
  overflow-y: auto;
  text-align: center;
}

/* Résultat principal */
.end-screen-result {
  padding: var(--spacing-2xl) 0;
  border-bottom: var(--border-width-thin) solid var(--color-border);
  margin-bottom: var(--spacing-xl);
}

#end-result-icon {
  font-size: 5rem;
  margin-bottom: var(--spacing-md);
  animation: scaleIn 0.6s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

#end-result-title {
  font-size: var(--font-size-4xl);
  font-weight: var(--font-weight-bold);
  margin: 0 0 var(--spacing-md) 0;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  animation: slideInDown 0.5s ease-out;
}

#end-result-message {
  font-size: var(--font-size-lg);
  line-height: var(--line-height-relaxed);
  color: var(--color-text-muted);
  margin: 0;
  animation: fadeIn 0.8s ease-out 0.2s both;
}

/* Sections de détails */
.end-screen-details {
  text-align: left;
  margin-bottom: var(--spacing-2xl);
}

#murderer-reveal {
  margin-bottom: var(--spacing-xl);
  animation: slideInUp 0.6s ease-out 0.3s both;
}

#arrested-list {
  margin-bottom: var(--spacing-xl);
  animation: slideInUp 0.6s ease-out 0.4s both;
}

#players-stats {
  animation: slideInUp 0.6s ease-out 0.5s both;
}

/* Carte du meurtrier */
.murderer-card {
  position: relative;
  overflow: hidden;
}

.murderer-card::before {
  content: '🔪';
  position: absolute;
  top: -20px;
  right: -20px;
  font-size: 8rem;
  opacity: 0.1;
  transform: rotate(-15deg);
}

/* Actions */
.end-screen-actions {
  display: flex;
  gap: var(--spacing-md);
  justify-content: center;
  margin-top: var(--spacing-2xl);
  animation: fadeIn 1s ease-out 0.6s both;
}

.end-screen-actions .btn {
  min-width: 180px;
}

/* Animations */
@keyframes scaleIn {
  from {
    transform: scale(0);
    opacity: 0;
  }
  to {
    transform: scale(1);
    opacity: 1;
  }
}

@keyframes slideInDown {
  from {
    transform: translateY(-30px);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}

@keyframes slideInUp {
  from {
    transform: translateY(30px);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/* Responsive */
@media (max-width: 768px) {
  #end-screen-modal .modal__content {
    width: 95%;
    max-height: 95vh;
  }

  #end-result-icon {
    font-size: 4rem;
  }

  #end-result-title {
    font-size: var(--font-size-3xl);
  }

  #end-result-message {
    font-size: var(--font-size-base);
  }

  .end-screen-actions {
    flex-direction: column;
  }

  .end-screen-actions .btn {
    width: 100%;
  }
}