/* PopeX v137 — quieter Challenge, satisfying transient POP, 7-second living pockets.
   Respect the v130 battery budget. Idle motion lives ONLY on three pocket membranes. */

/* Never animate the hit target: the decorative membrane is independent of touch. */
#gameStage > #rack > .piece:not(.used)::before {
  animation:pw137PocketBreath 7s cubic-bezier(.42,0,.58,1) infinite!important;
  animation-delay:0s!important;
  transform-origin:51% 49%;
  border-radius:47% 53% 49% 51% / 52% 47% 53% 48%!important;
}
#gameStage > #rack > .piece:nth-child(2):not(.used)::before {
  animation-delay:-2.333s!important;
  transform-origin:47% 52%;
  border-radius:53% 47% 52% 48% / 47% 52% 48% 53%!important;
}
#gameStage > #rack > .piece:nth-child(3):not(.used)::before {
  animation-delay:-4.666s!important;
  transform-origin:53% 49%;
  border-radius:49% 51% 46% 54% / 50% 46% 54% 50%!important;
}
@keyframes pw137PocketBreath {
  0%,100% {transform:translate3d(0,0,0) rotate(-.45deg) scale(.99,1.005);opacity:.95}
  37% {transform:translate3d(.45px,-.85px,0) rotate(.55deg) scale(1.023,.982);opacity:1}
  70% {transform:translate3d(-.45px,.45px,0) rotate(-.3deg) scale(.986,1.017);opacity:.97}
}
/* Lower-contrast, single-surface mission strip; board/score geometry unchanged.
   No second bevel, no perpetual glow/box-shadow animations. */
#gameStage>#queueTitle .challenge-hud:not([hidden]) {
  padding:5px 14px!important;
  gap:10px!important;
  border-radius:17px!important;
  border:1px solid rgba(190,210,245,.22)!important;
  background:linear-gradient(120deg,rgba(65,80,122,.49),rgba(34,49,86,.54))!important;
  box-shadow:inset 0 1px 0 rgba(245,250,255,.07),0 2px 9px rgba(8,15,35,.10)!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}
#gameStage>#queueTitle .challenge-hud::before {
  content:none!important;display:none!important;animation:none!important;
}
#gameStage>#queueTitle .challenge-hud .ch-text {gap:3px!important}
#gameStage>#queueTitle .challenge-hud .ch-eyebrow {
  font-size:clamp(9px,2.25vw,10px)!important;
  font-weight:720!important;letter-spacing:1.25px!important;
  color:#b6cde0!important;
}
#gameStage>#queueTitle .challenge-hud .ch-goal {
  font-size:clamp(11px,3.1vw,13px)!important;
  font-weight:790!important;line-height:1.17!important;
  color:#f4f7ff!important;
}
#gameStage>#queueTitle .challenge-hud .ch-timer {
  font-size:clamp(17px,4.4vw,21px)!important;
  font-weight:750!important;
  color:#f0e4ce!important;
  min-width:45px!important;
  letter-spacing:.35px!important;
}
#gameStage>#queueTitle .challenge-hud .ch-timer.ch-low {color:#ffc4ba!important}
@media(orientation:portrait) and (max-height:740px) {
  #gameStage>#queueTitle .challenge-hud:not([hidden]) {padding:3px 11px!important;border-radius:14px!important}
  #gameStage>#queueTitle .challenge-hud .ch-text {gap:2px!important}
}
@media(orientation:portrait) and (max-height:620px) {
  #gameStage>#queueTitle .challenge-hud:not([hidden]) {padding:2px 9px!important;border-radius:12px!important}
  #gameStage>#queueTitle .challenge-hud .ch-eyebrow {font-size:8px!important}
  #gameStage>#queueTitle .challenge-hud .ch-goal {font-size:10px!important}
  #gameStage>#queueTitle .challenge-hud .ch-timer {font-size:15px!important}
}

/* Short punchy membrane release, no animated filter/shadow, duration exactly
   matches POP_FX.bodyMs. Surprise faces stay visible until their domes pop. */
body.pop-fx-full #gameStage #board>.cell.filled.pop-now::before,
body.pop-fx-full #gameStage #board>.cell.filled.pop-now::after {
  animation:pw137BubbleSnap .37s cubic-bezier(.18,.62,.15,1) both!important;
}
@keyframes pw137BubbleSnap {
  0%{transform:scale(1);opacity:1}
  17%{transform:scale(.95,1.047);opacity:1}
  38%{transform:scale(1.095,.96);opacity:1}
  58%{transform:scale(1.055,1.065);opacity:1}
  72%{transform:scale(1.19,1.17);opacity:.95}
  84%{transform:scale(1.27);opacity:0}
  100%{transform:scale(1.29);opacity:0}
}
/* A single wave at the midpoint of each cleared line, not a new effect per
   frame or per bubble. It exists for 400 ms and is then removed from the DOM. */
.pw137-line-wave {
  position:fixed;pointer-events:none;z-index:177;
  box-sizing:border-box;width:66px;height:66px;border-radius:50%;
  border:1.5px solid rgba(223,250,255,.79);
  box-shadow:0 0 8px rgba(155,217,246,.14);
  left:var(--pw137-x);top:var(--pw137-y);
  animation:pw137LineWave .42s cubic-bezier(.17,.72,.29,1) both;
}
@keyframes pw137LineWave {
  0%{opacity:0;transform:translate(-50%,-50%) scale(.42)}
  22%{opacity:.87}
  100%{opacity:0;transform:translate(-50%,-50%) scale(2.05)}
}
/* Very short typography snap; makes a successful line read as a reward. */
#gameStage .popup.pop,#gameStage .popup.perfect,#gameStage .popup.combo {
  animation:pw137ScorePop 1.15s cubic-bezier(.18,.72,.23,1) both!important;
}
@keyframes pw137ScorePop {
  0%{opacity:0;transform:translate(-50%,-45%) scale(.70)}
  13%{opacity:1;transform:translate(-50%,-50%) scale(1.16)}
  27%{opacity:1;transform:translate(-50%,-50%) scale(.96)}
  45%{opacity:1;transform:translate(-50%,-53%) scale(1.02)}
  75%{opacity:1;transform:translate(-50%,-56%) scale(1)}
  100%{opacity:0;transform:translate(-50%,-66%) scale(.95)}
}
@media(prefers-reduced-motion:reduce){
  #gameStage > #rack > .piece:not(.used)::before {animation:none!important;transform:none!important;opacity:1!important}
  .pw137-line-wave {animation:none!important;display:none!important}
  #gameStage .popup.pop,#gameStage .popup.perfect,#gameStage .popup.combo {animation:none!important}
  body.pop-fx-full #gameStage #board>.cell.filled.pop-now::before,
  body.pop-fx-full #gameStage #board>.cell.filled.pop-now::after {animation-duration:.12s!important}
}