.screen--gameover {
  background: rgba(var(--screen-bg),0.88);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  overflow-y: auto;
  justify-content: flex-start;
  padding-top: max(env(safe-area-inset-top, 20px), 24px);
  padding-bottom: max(env(safe-area-inset-bottom, 0px), 24px);
}

.screen--gameover .gameover__card {
  margin-top: auto;
  margin-bottom: auto;
}

.gameover__card {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 92%;
  max-width: 340px;
  padding: 32px 24px 24px;
  background: rgba(var(--bg-tint),0.2);
  border: 1px solid rgba(var(--accent),0.15);
  border-radius: 24px;
  box-shadow: 0 0 60px rgba(100,40,200,0.12);
  animation: screenSlideIn 0.35s ease-out;
}

.gameover__score-ring {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  border: 3px solid rgba(var(--accent),0.35);
  display: flex;
  align-items: center;
  justify-content: center;
  background: radial-gradient(circle, rgba(var(--accent-dark),0.15), transparent);
  box-shadow: 0 0 40px rgba(var(--accent-dim),0.15);
}

.gameover__score-num {
  font-size: 36px;
  font-weight: 800;
  background: linear-gradient(135deg, var(--grad-start), var(--grad-end));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.gameover__label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: rgba(var(--text-muted),0.45);
  margin-top: 6px;
}

.gameover__row {
  display: flex;
  gap: 32px;
  margin-top: 18px;
}

.gameover__detail {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.gameover__detail-val {
  font-size: 18px;
  font-weight: 700;
  color: rgba(var(--text-primary),0.85);
}

.gameover__detail-key {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: rgba(var(--text-muted),0.4);
  margin-top: 2px;
}

.gameover__xp-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
  margin-top: 16px;
}

.gameover__xp {
  font-size: 13px;
  font-weight: 700;
  color: rgba(120,255,200,0.85);
}

.gameover__dust {
  font-size: 13px;
  font-weight: 700;
  color: rgba(255,215,0,0.85);
}

.gameover__levelup {
  width: 100%;
  text-align: center;
  font-size: 13px;
  font-weight: 700;
  color: rgba(255,220,80,0.92);
  text-shadow: 0 0 10px rgba(255,200,60,0.4);
}

.gameover__btns {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 18px;
  width: 100%;
}

.gameover__btn {
  flex: 1;
  padding: 12px 0;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  border-radius: 12px;
  border: 1px solid rgba(var(--accent),0.2);
  background: rgba(var(--accent-dark),0.15);
  color: rgba(var(--text-primary),0.85);
  cursor: pointer;
  transition: background 0.15s;
}

.gameover__btn:active { background: rgba(var(--accent-dim),0.3); }

.gameover__btn--play {
  background: linear-gradient(135deg, rgba(var(--accent-dim),0.3), rgba(80,160,255,0.3));
  border-color: rgba(var(--accent),0.35);
  color: rgba(var(--text-primary),0.95);
}

.gameover__achievements:empty { display: none; }

.gameover__achievements {
  width: 100%;
  margin-top: 10px;
  -webkit-overflow-scrolling: touch;
}

.achievement-unlock {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  margin-top: 4px;
  border-radius: 8px;
  background: rgba(255,200,60,0.08);
  border: 1px solid rgba(255,200,60,0.15);
}

.achievement-unlock__icon { font-size: 16px; }
.achievement-unlock__name { font-size: 12px; font-weight: 700; color: rgba(var(--text-primary),0.9); flex: 1; }
.achievement-unlock__reward { font-size: 12px; font-weight: 700; color: rgba(255,215,0,0.9); }

.achievement-row__icon svg,
.achievement-unlock__icon svg {
  width: 18px;
  height: 18px;
  display: block;
}

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