/* PopeX v127 — one version stamp, identical end/new-game bubbles,
   visible shared burst, single continuous POP TIME enlargement, and board-width challenge HUD. */
:root{--pw127-bubble-size:clamp(170px,52vw,220px)}
/* Permanently visible release marker, independent of PWA cache state. */
.moonlit-app .bloop-header .pw-build-stamp{
 position:absolute!important;left:clamp(50px,12vw,61px)!important;top:50%!important;
 transform:translateY(-46%)!important;z-index:3!important;pointer-events:none!important;
 font-size:10px!important;letter-spacing:.3px!important;line-height:1!important;
 font-family:var(--pw-cartoon,ui-rounded,system-ui,sans-serif)!important;
 font-weight:800!important;color:rgba(224,231,252,.60)!important;
 padding:4px 0!important;background:none!important;text-shadow:0 1px 3px rgba(4,13,37,.18);
}

/* New Game and both end variants share the exact same physical footprint. */
#pw72Modal .pw72-dialog.pw117-confirm,
#gameoverModal #pw124EndBubble{
 width:var(--pw127-bubble-size)!important;
 height:var(--pw127-bubble-size)!important;
 min-width:0!important;min-height:0!important;
 max-width:calc(100vw - 30px)!important;
 border-radius:50%!important;
 box-sizing:border-box!important;
 animation:pw127-idle-float 2.9s ease-in-out infinite!important;
 transform-origin:center center!important;
}
#pw72Modal .pw72-dialog.pw117-confirm{
 gap:clamp(8px,2vh,14px)!important;
 padding:20px 12px!important;
}
#pw72Modal #pw107ConfirmTitle{
 font-size:clamp(22px,5.9vw,29px)!important;
 margin:0!important;
}
#pw72Modal .pw117-confirm .pw72-actions{gap:clamp(9px,2.8vw,15px)!important}
#pw72Modal .pw117-confirm .pw72-actions button{
 width:clamp(51px,14.4vw,63px)!important;
 height:clamp(51px,14.4vw,63px)!important;
}
#pw72Modal .pw117-mark{width:31px!important;height:31px!important}
@keyframes pw127-idle-float{
 0%,100%{transform:translate3d(0,0,0) rotate(-.8deg) scale(1)}
 50%{transform:translate3d(0,-5px,0) rotate(.9deg) scale(1.014)}
}
/* Both X and check close with an identical bubble pop (different follow-up). */
#pw72Modal.pw127-pop-dismiss .pw72-dialog.pw117-confirm,
#gameoverModal.pw124-end-layer.is-popping #pw124EndBubble{
 animation:pw127-bubble-break .30s cubic-bezier(.12,.4,.3,1) both!important;
 pointer-events:none!important;
}
@keyframes pw127-bubble-break{
 0%{opacity:1;transform:scale(1)}
 30%{opacity:1;transform:scale(1.14)}
 100%{opacity:0;transform:scale(1.48)}
}

/* Noticeable but still playful burst: two ripples + luminous short flecks. */
#gameoverModal .pw127-pop-ring,#pw72Modal .pw127-pop-ring{
 position:absolute!important;z-index:1600!important;pointer-events:none!important;
 border:2px solid rgba(237,248,255,.87)!important;
 box-shadow:0 0 16px rgba(160,214,255,.38)!important;
 border-radius:50%!important;
 opacity:0;
 animation:pw127-ring-blast .62s cubic-bezier(.12,.65,.3,1) both!important;
}
#gameoverModal .pw127-pop-spark,#pw72Modal .pw127-pop-spark{
 position:absolute!important;z-index:1601!important;pointer-events:none!important;
 border-radius:50%!important;background:var(--spark,#e9fbff)!important;
 box-shadow:0 0 8px rgba(244,250,255,.70),0 0 2px rgba(255,255,255,.55)!important;
 opacity:0;
 animation:pw127-pop-flecks .62s cubic-bezier(.15,.7,.35,1) both!important;
}
@keyframes pw127-ring-blast{
 0%{opacity:.88;transform:translate(-50%,-50%) scale(.72)}
 30%{opacity:.94}
 100%{opacity:0;transform:translate(-50%,-50%) scale(1.47)}
}
@keyframes pw127-pop-flecks{
 0%{opacity:1;transform:translate(-50%,-50%) scale(.6) rotate(0deg)}
 25%{opacity:1}
 100%{opacity:0;transform:translate(calc(-50% + var(--dx)),calc(-50% + var(--dy))) scale(.36) rotate(var(--turn,90deg))}
}
/* A single LINEAR transform with no intermediate size keyframes: GPU can
   interpolate it at each frame. Fade is an independent animation on the word. */
#gameStage>#sheet>#bonusCountdown.bonus-countdown.v75-pop-intro:not([hidden]){
 animation:pw127-one-scale 1.5s linear both!important;
 opacity:1!important;backface-visibility:hidden!important;-webkit-backface-visibility:hidden!important;
 will-change:transform!important;
 transform-origin:center center!important;
}
#gameStage #bonusCountdown .pw126-pop-wordmark{
 display:block!important;
 animation:pw127-pop-fade 1.5s linear both!important;
 will-change:opacity!important;
}
@keyframes pw127-one-scale{
 from{transform:translate3d(-50%,-50%,0) scale(.60)}
 to{transform:translate3d(-50%,-50%,0) scale(1.47)}
}
@keyframes pw127-pop-fade{
 0%{opacity:0}10%{opacity:1}77%{opacity:1}100%{opacity:0}
}
/* Challenge prompt never sticks out beyond the play board, and is a rectangle,
   not the old rubbery ellipse. Sheet's actual measured width is shared via RO. */
#gameStage>#queueTitle.queue-title{
 width:var(--pw127-board-width,min(100%,360px))!important;
 max-width:100%!important;
 min-width:0!important;
 margin-left:auto!important;margin-right:auto!important;
 box-sizing:border-box!important;
 justify-self:center!important;
}
#gameStage>#queueTitle.queue-title .challenge-hud{
 position:absolute!important;
 left:0!important;right:0!important;top:0!important;bottom:0!important;
 width:100%!important;max-width:100%!important;min-width:0!important;
 margin:0!important;
 box-sizing:border-box!important;
 border-radius:13px!important;
}
#gameStage>#queueTitle.queue-title .challenge-hud::before{
 border-radius:12px!important;
}
@media(max-height:620px){
 :root{--pw127-bubble-size:clamp(150px,38vh,195px)}
 #pw72Modal #pw107ConfirmTitle{font-size:clamp(20px,5.3vw,25px)!important}
 #pw72Modal .pw117-confirm .pw72-actions button{width:49px!important;height:49px!important}
}
@media(orientation:landscape) and (max-height:600px){
 #gameStage>#queueTitle.queue-title{width:100%!important}
}
@media(prefers-reduced-motion:reduce){
 #pw72Modal .pw72-dialog.pw117-confirm,#gameoverModal #pw124EndBubble{animation:none!important}
 #gameStage>#sheet>#bonusCountdown.bonus-countdown.v75-pop-intro:not([hidden]){animation:none!important;transform:translate(-50%,-50%)!important}
 #gameStage #bonusCountdown .pw126-pop-wordmark{animation:none!important;opacity:1!important}
 #pw72Modal .pw127-pop-ring,#gameoverModal .pw127-pop-ring,#pw72Modal .pw127-pop-spark,#gameoverModal .pw127-pop-spark{animation:none!important;opacity:0!important}
}
