/* PopeX v158 — ONLY the active POP TIME presentation.
   v156 positions/board/shape pockets, all gameplay, and regular challenge
   presentation are intentionally unchanged. v157's dark clock is gone.
   Keep the v139 measured tagline-to-board visual centering instead of
   anchoring the clock at a fixed offset from the scoreboard. */

@media (orientation:portrait) {
  #gameStage > .stats .pop-time-hud {
    top:var(--pw139-text-top,-8px)!important;
    left:50%!important;
    right:auto!important;
    bottom:auto!important;
    transform:translateX(-50%)!important;
    width:min(310px,94vw)!important;
    height:var(--pw139-text-height,100px)!important;
    max-width:94vw!important;
    min-height:0!important;
    padding:0!important;
    background:none!important;
    border:0!important;
    box-shadow:none!important;
  }
}

/* Clean, readable three-line countdown. Never reintroduce any membrane. */
#gameStage .pop-time-clock,
.moonlit-app .pop-time-clock {
  background:none!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  width:auto!important;
  height:auto!important;
  min-width:0!important;
  min-height:0!important;
  padding:0!important;
  gap:3px!important;
  animation:pw158CountIn .18s ease-out both!important;
}
#gameStage .pop-time-clock small {
  font-size:clamp(10px,3vw,12px)!important;
  letter-spacing:2.8px!important;
  font-weight:800!important;
  line-height:1.1!important;
  color:#edf3ff!important;
  text-shadow:0 2px 8px rgba(6,14,36,.30)!important;
  margin:0!important;
}
#gameStage .pop-time-clock strong {
  font-size:clamp(48px,13.7vw,62px)!important;
  line-height:.98!important;
  font-weight:850!important;
  color:#fff!important;
  text-shadow:0 3px 13px rgba(6,14,36,.30)!important;
  margin:0!important;
}
#gameStage .pop-time-clock span {
  font-size:clamp(10px,2.85vw,12px)!important;
  line-height:1.1!important;
  letter-spacing:2.0px!important;
  font-weight:750!important;
  color:#dfeafd!important;
  text-shadow:0 2px 8px rgba(6,14,36,.24)!important;
  margin:0!important;
}

/* The game board remains 100% visible and interactive during the bonus.
   The header and parked Next Shapes gently recede; no extra dark overlay. */
.bloop-header {
  transition:opacity .2s ease-out!important;
}
#gameStage > #rack {
  transition:opacity .2s ease-out!important;
}
body.pop-time-active .bloop-header {
  opacity:.22!important;
}
body.pop-time-active #gameStage > #rack {
  opacity:.76!important;
}
/* Keep score dimensions and grid slots exactly as they were to avoid reflow. */
body.pop-time-active #gameStage > .stats > .stat {
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}
/* Challenge remains mounted and its 90s clock is paused by the existing JS.
   Fade its surface instead of reserving a visually dark empty block. */
#gameStage > .queue-title .challenge-hud:not([hidden]) {
  transition:opacity .2s ease-out!important;
}
body.pop-time-active #gameStage > .queue-title .challenge-hud:not([hidden]) {
  opacity:0!important;
  visibility:visible!important;
  pointer-events:none!important;
}

@keyframes pw158CountIn {
  from {opacity:.4;transform:translateY(3px) scale(.985)}
  to {opacity:1;transform:translateY(0) scale(1)}
}

@media (orientation:portrait) and (max-height:740px) {
  #gameStage .pop-time-clock {gap:2px!important}
  #gameStage .pop-time-clock strong {font-size:clamp(38px,12.5vw,48px)!important}
  #gameStage .pop-time-clock small {font-size:10px!important;letter-spacing:2.3px!important}
  #gameStage .pop-time-clock span {font-size:10px!important;letter-spacing:1.8px!important}
}
@media (orientation:portrait) and (max-height:620px) {
  #gameStage .pop-time-clock strong {font-size:34px!important}
  #gameStage .pop-time-clock small {font-size:9px!important;letter-spacing:1.7px!important}
  #gameStage .pop-time-clock span {font-size:9px!important;letter-spacing:1.4px!important}
}
@media (prefers-reduced-motion:reduce) {
  .bloop-header,#gameStage>#rack,#gameStage>.queue-title .challenge-hud:not([hidden]) {
    transition:none!important;
  }
  #gameStage .pop-time-clock,.moonlit-app .pop-time-clock {
    animation:none!important;
  }
}