.game-completion{
  width:min(92vw,540px);
  max-width:540px;
  max-height:min(88vh,760px);
  padding:0;
  border:1px solid color-mix(in srgb,var(--game-accent,var(--brand-violet)) 28%,var(--line,#ffffff18));
  border-radius:28px;
  overflow:hidden;
  color:var(--text,#f8fafc);
  background:color-mix(in srgb,var(--surface,#111827) 96%,var(--game-accent,var(--brand-violet)) 4%);
  box-shadow:0 30px 90px #0008;
}
.game-completion::backdrop{
  background:#050816b8;
  backdrop-filter:blur(8px);
}
.game-completion[open] .game-completion-panel{animation:completion-enter .34s cubic-bezier(.2,.9,.2,1) both}
.game-completion-panel{position:relative;padding:clamp(24px,5vw,34px)}
.game-completion-close{
  position:absolute;top:14px;right:14px;width:38px;height:38px;border-radius:999px;border:1px solid var(--line,#ffffff18);
  color:inherit;background:color-mix(in srgb,var(--surface,#111827) 78%,transparent);font-size:24px;line-height:1;cursor:pointer
}
.game-completion-head{text-align:center;padding:4px 34px 0}
.game-completion-kicker{display:block;margin-bottom:8px;color:var(--game-accent-2,var(--brand-cyan));font-size:.78rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.game-completion h2{margin:0;font-size:clamp(2rem,7vw,3rem);line-height:1.03}
.game-completion-message{max-width:430px;margin:12px auto 0;color:var(--muted,#aebbd0);line-height:1.55}
.game-completion-rating{display:grid;justify-items:center;gap:7px;margin:22px 0 8px}
.game-completion-stars{display:flex;gap:7px;font-size:clamp(2rem,8vw,2.8rem);line-height:1}
.game-completion-stars span{color:color-mix(in srgb,var(--muted,#94a3b8) 28%,transparent);transform:scale(.82)}
.game-completion-stars .is-earned{
  color:#f6c453;
  text-shadow:0 5px 20px #f6c45345;
  animation:completion-star .42s cubic-bezier(.2,1.4,.3,1) both;
  animation-delay:calc(var(--star-index) * 70ms)
}
.game-completion-rating>strong{font-size:1rem}
.game-completion-personal{
  width:max-content;max-width:100%;margin:14px auto 0;padding:8px 13px;border-radius:999px;
  color:color-mix(in srgb,var(--game-accent-2,var(--brand-cyan)) 86%,white);
  background:color-mix(in srgb,var(--game-accent-2,var(--brand-cyan)) 12%,transparent);
  border:1px solid color-mix(in srgb,var(--game-accent-2,var(--brand-cyan)) 30%,transparent);
  font-size:.86rem;font-weight:750;text-align:center
}
.game-completion-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:22px}
.game-completion-metric{
  min-width:0;padding:14px 15px;border:1px solid var(--line,#ffffff18);border-radius:17px;
  background:color-mix(in srgb,var(--surface-2,#0b1220) 92%,var(--game-accent,var(--brand-violet)) 8%)
}
.game-completion-metric span{display:block;color:var(--muted,#94a3b8);font-size:.76rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em}
.game-completion-metric strong{display:block;margin-top:5px;font-size:1.15rem;overflow-wrap:anywhere}
.game-completion-actions{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:9px;margin-top:24px}
.game-completion-primary,.game-completion-secondary,.game-completion-sound{
  min-height:46px;border-radius:14px;font:inherit;font-weight:800;text-decoration:none;cursor:pointer
}
.game-completion-primary{border:0;padding:0 18px;color:#07111c;background:linear-gradient(135deg,var(--game-accent-2,var(--brand-cyan)),color-mix(in srgb,var(--game-accent,var(--brand-violet)) 55%,white))}
.game-completion-secondary{display:inline-flex;align-items:center;justify-content:center;padding:0 16px;color:inherit;border:1px solid var(--line,#ffffff18);background:transparent}
.game-completion-sound{width:46px;border:1px solid var(--line,#ffffff18);color:inherit;background:transparent;font-size:1.1rem}
.game-root.is-game-complete{animation:completion-board-pulse .72s ease both}
@keyframes completion-enter{from{opacity:0;transform:translateY(22px) scale(.97)}to{opacity:1;transform:none}}
@keyframes completion-star{0%{opacity:.2;transform:scale(.55) rotate(-12deg)}70%{transform:scale(1.18) rotate(3deg)}100%{opacity:1;transform:scale(1)}}
@keyframes completion-board-pulse{0%,100%{filter:none}45%{filter:drop-shadow(0 0 22px color-mix(in srgb,var(--game-accent-2,var(--brand-cyan)) 56%,transparent));transform:scale(1.006)}}
@media(max-width:640px){
  .game-completion{width:100vw;max-width:none;max-height:86vh;margin:auto 0 0;border-radius:26px 26px 0 0;border-bottom:0}
  .game-completion-panel{padding:24px 18px calc(22px + env(safe-area-inset-bottom))}
  .game-completion-actions{grid-template-columns:minmax(0,1fr) 46px}
  .game-completion-secondary{grid-row:2;grid-column:1/-1}
}
@media(prefers-reduced-motion:reduce){
  .game-completion[open] .game-completion-panel,.game-completion-stars .is-earned,.game-root.is-game-complete{animation:none!important}
}