.game-wrap{max-width:53rem;padding-bottom:2rem}
.game-wrap h1{font-size:clamp(2.2rem,6.3vw,4.4rem)}
.game-wrap .headline p:last-child{max-width:35rem;margin:.65rem auto 0}
.game-card{padding:clamp(.55rem,2vw,1rem);background:var(--paper);border:2px solid var(--line);border-radius:1.35rem}
.game-score{text-align:center;padding:.2rem 0 .65rem;font-family:var(--heading);font-size:1.18rem}
.sky-field{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  height:clamp(17rem,49vh,28rem);
  border-radius:.9rem;
  background:radial-gradient(ellipse at 8% 0%,#ffbfe5,transparent 58%),linear-gradient(150deg,#70d2fa,#beeaff 57%,#fbe2f3);
}
.game-cloud{
  position:absolute;
  width:32%;
  height:18%;
  border-radius:50%;
  background:#fff9;
  box-shadow:2rem -1rem 0 #fff7,4rem .4rem 0 #fff7;
  pointer-events:none;
}
.cloud-top{left:-9%;top:16%}
.cloud-bottom{left:16%;bottom:1%}
.game-pup,.game-present,.sade-target{
  position:absolute;
  left:var(--x,18%);
  top:var(--y,66%);
  transform:translate(-50%,-50%);
}
.game-pup{
  width:clamp(3.15rem,9vw,5.1rem);
  aspect-ratio:1;
  z-index:2;
}
.pup-avatar,.sade-avatar{
  display:block;
  width:100%;
  aspect-ratio:1;
  border-radius:50%;
  border:3px solid white;
  box-shadow:0 3px 0 #a7206670,0 5px 12px #6f26583a;
}
.avatar-skye{background:#ffd4e7 url(invitation-mockup.png) 28.3% 56.6% / 505% auto no-repeat}
.sade-avatar{background:#ffd4e7 url(sade-birthday.png) 58% 17% / 256% auto no-repeat}
.sade-target{
  --x:84%;
  --y:75%;
  width:clamp(4.2rem,12vw,6.3rem);
  text-align:center;
}
.sade-target .sade-avatar{outline:3px dashed #a41661;outline-offset:4px}
.sade-label{
  display:block;
  position:absolute;
  left:50%;
  top:89%;
  transform:translateX(-50%);
  background:#a41661;
  color:white;
  border-radius:2rem;
  padding:.1rem .65rem;
  font:600 1.05rem var(--heading);
}
.game-present,.pup-cargo{font-size:clamp(1.65rem,5vw,2.6rem);line-height:1}
.game-present{z-index:1;filter:drop-shadow(0 2px 4px #9d428674)}
.pup-cargo{position:absolute;right:-.4rem;bottom:-.2rem}
.game-overlay{
  position:absolute;
  z-index:3;
  inset:0;
  display:grid;
  place-content:center;
  justify-items:center;
  gap:.75rem;
  padding:1rem;
  text-align:center;
  background:#fff2f8d9;
}
.game-overlay[hidden]{display:none}
.game-overlay p{margin:0;font:650 clamp(1.65rem,5vw,2.8rem) var(--heading);color:#941653}
.game-status{min-height:3em;margin:.55rem 0 .45rem;text-align:center;font-weight:650}
.flight-controls{display:flex;justify-content:center;gap:clamp(.25rem,2vw,.7rem)}
.flight-controls button{
  width:clamp(2.9rem,12vw,4.2rem);
  min-height:2.9rem;
  border:1px solid #c6528b;
  border-radius:.65rem;
  background:#ffe0f0;
  color:#83114d;
  font:bold 1.5rem/1 system-ui,sans-serif;
  touch-action:none;
  cursor:pointer;
}
.flight-controls button:active{background:#f1a9d2}

.avatar-chase{background:#bce8ff url(chase.webp) center / cover no-repeat}
.avatar-marshall{background:#ffd7eb url(marshall.webp) center / cover no-repeat}
.pup-picker{
  display:flex;
  justify-content:center;
  gap:.4rem;
  padding:0;
  margin:0;
  border:0;
}
.pup-picker legend{
  width:100%;
  margin:0 0 .35rem;
  padding:0;
  text-align:center;
  font-size:1rem;
}
.pup-picker label{position:relative;margin:0;cursor:pointer}
.pup-picker input{position:absolute;width:1px;height:1px;min-height:0;opacity:0;padding:0}
.pup-option{
  display:grid;
  justify-items:center;
  gap:.25rem;
  min-width:clamp(4.2rem,16vw,5.3rem);
  padding:.32rem .28rem;
  border:2px solid transparent;
  border-radius:.65rem;
  color:#761340;
  background:#fff8fc;
  font:600 .95rem var(--heading);
}
.pup-option .pup-avatar{width:clamp(2.3rem,9vw,3.2rem);border-width:2px}
.pup-picker input:checked + .pup-option{border-color:#a41661;background:#ffdfef}
.pup-picker input:focus-visible + .pup-option{outline:3px solid #6020a0;outline-offset:2px}