.screen--session-end {
  flex-direction: column;
  overflow-y:     auto;
  padding:        var(--sp-6);
  gap:            var(--sp-5);
}

/* ─── Cinematic header ───────────────────────────────────────────────────────── */

.end__hero {
  display:        flex;
  flex-direction: column;
  align-items:    center;
  gap:            var(--sp-2);
  text-align:     center;
}

.end__volcano-icon {
  font-size:  80px;
  animation:  hero-pop 600ms cubic-bezier(0.34, 1.56, 0.64, 1) both;
}

@keyframes hero-pop {
  from { transform: scale(0.3); opacity: 0; }
  to   { transform: scale(1);   opacity: 1; }
}

.end__headline {
  font-size:   var(--fs-2xl);
  font-weight: var(--fw-bold);
  animation:   fade-up 500ms 200ms ease-out both;
}

.end__subline {
  font-size:  var(--fs-sm);
  color:      var(--c-text-muted);
  animation:  fade-up 500ms 300ms ease-out both;
}

@keyframes fade-up {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ─── Individual outcomes ────────────────────────────────────────────────────── */

.end__outcomes {
  display:        flex;
  flex-direction: column;
  gap:            var(--sp-2);
}

.end__outcomes-title {
  font-size:      var(--fs-xs);
  color:          var(--c-text-muted);
  text-transform: uppercase;
  letter-spacing: 1px;
}

.end__outcome-row {
  display:       flex;
  align-items:   center;
  gap:           var(--sp-3);
  padding:       var(--sp-3) var(--sp-4);
  background:    var(--c-bg-card);
  border-radius: var(--r-md);
  animation:     row-in 400ms ease-out both;
}

.end__outcome-row:nth-child(1) { animation-delay: 100ms; }
.end__outcome-row:nth-child(2) { animation-delay: 180ms; }
.end__outcome-row:nth-child(3) { animation-delay: 260ms; }
.end__outcome-row:nth-child(4) { animation-delay: 340ms; }
.end__outcome-row:nth-child(5) { animation-delay: 420ms; }

@keyframes row-in {
  from { opacity: 0; transform: translateX(-10px); }
  to   { opacity: 1; transform: translateX(0); }
}

.end__outcome-row--me         { border: 1.5px solid var(--c-primary); }
.end__outcome-row--ghost      { opacity: 0.55; }

.end__outcome-icon  { font-size: var(--fs-xl); }
.end__outcome-name  { flex: 1; font-weight: var(--fw-bold); font-size: var(--fs-sm); }
.end__outcome-score { font-size: var(--fs-sm); color: var(--c-text-muted); }
.end__outcome-badge {
  font-size:     var(--fs-xs);
  padding:       2px var(--sp-2);
  border-radius: var(--r-full);
  font-weight:   var(--fw-bold);
}

.end__outcome-badge--escaped  { background: rgba(76,175,80,0.2);  color: var(--c-success); }
.end__outcome-badge--rescued  { background: rgba(255,215,0,0.15); color: var(--c-gold); }
.end__outcome-badge--ghost    { background: rgba(255,255,255,0.06); color: var(--c-text-dim); }

/* ─── Team score card ────────────────────────────────────────────────────────── */

.end__team-card {
  text-align:  center;
  border:      1.5px solid rgba(255,107,53,0.3);
  animation:   fade-up 500ms 500ms ease-out both;
}

.end__team-label {
  font-size:      var(--fs-xs);
  color:          var(--c-text-muted);
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom:  var(--sp-2);
}

.end__team-score {
  font-size:   var(--fs-3xl);
  font-weight: var(--fw-bold);
  color:       var(--c-primary);
}

.end__team-multiplier {
  font-size:  var(--fs-sm);
  color:      var(--c-text-muted);
  margin-top: var(--sp-1);
}

.end__team-multiplier span {
  color:       var(--c-gold);
  font-weight: var(--fw-bold);
}

/* ─── Arcade name prompt ─────────────────────────────────────────────────────── */

.end__arcade {
  display:        flex;
  flex-direction: column;
  gap:            var(--sp-3);
  animation:      fade-up 500ms 700ms ease-out both;
}

.end__arcade-title {
  font-size:   var(--fs-base);
  font-weight: var(--fw-bold);
  text-align:  center;
}

.end__arcade-sub {
  font-size:  var(--fs-sm);
  color:      var(--c-text-muted);
  text-align: center;
}

/* Big character input (arcade style) */
.end__name-input {
  width:          100%;
  padding:        var(--sp-4);
  background:     var(--c-bg-elevated);
  border:         2px solid var(--c-primary);
  border-radius:  var(--r-md);
  color:          var(--c-primary);
  font-family:    var(--font);
  font-size:      var(--fs-xl);
  font-weight:    var(--fw-bold);
  text-align:     center;
  text-transform: uppercase;
  letter-spacing: 4px;
  outline:        none;
}

.end__name-input::placeholder {
  color:          rgba(255,107,53,0.3);
  letter-spacing: 2px;
}

/* ─── Action buttons ─────────────────────────────────────────────────────────── */

.end__actions {
  display:        flex;
  flex-direction: column;
  gap:            var(--sp-3);
  padding-bottom: var(--sp-4);
  animation:      fade-up 500ms 900ms ease-out both;
}
