/* Popex v123 — real unification: all transient surfaces use the New Game card language. */
:root{
  --pw123-card-bg: radial-gradient(ellipse at 22% 0%, rgba(238,241,255,.15), transparent 51%), linear-gradient(155deg, #343f69, #1b2647);
  --pw123-card-border: rgba(216,231,255,.31);
  --pw123-card-shadow: inset 0 2px 8px rgba(249,253,255,.06), 0 24px 72px rgba(3,9,27,.50);
  --pw123-card-radius: 28px 34px 30px 35px / 36px 27px 34px 29px;
}

/* Story / intro / generic mid-board notices */
#gameStage .popup,
#gameStage .popup.warn,
#gameStage .popup.ready,
#gameStage .popup.story-intro,
#gameStage .popup.story-intro.story-colored,
#gameStage .popup.story-nervous,
#gameStage .popup.story-nervous.story-colored,
#gameStage .popup.challenge-win,
#gameStage .popup.color-streak,
#gameStage .popup.board-clear{
  padding:20px 24px!important;
  width:min(74%, 460px)!important;
  min-width:min(74%, 260px)!important;
  max-width:min(86%, 460px)!important;
  min-height:108px!important;
  height:auto!important;
  white-space:normal!important;
  overflow-wrap:break-word!important;
  display:flex!important;flex-direction:column;align-items:center;justify-content:center!important;
  gap:4px!important;
  border-radius:var(--pw123-card-radius)!important;
  border:1px solid var(--pw123-card-border)!important;
  background:var(--pw123-card-bg)!important;
  box-shadow:var(--pw123-card-shadow)!important;
  color:#f6f8ff!important;
  font-size:clamp(18px,4.8vw,30px)!important;
  line-height:1.12!important;
  text-align:center!important;
  text-shadow:0 1px 4px rgba(7,16,40,.22)!important;
}
#gameStage .popup::before{
  content:""!important;position:absolute!important;inset:1px!important;border-radius:inherit!important;
  border:1px solid rgba(243,247,255,.14)!important;
  background:radial-gradient(ellipse at 22% 10%, rgba(255,255,255,.12), transparent 56%)!important;
  pointer-events:none!important;
}
#gameStage .popup.story-intro,
#gameStage .popup.story-intro.story-colored{font-size:clamp(22px,6vw,31px)!important}
#gameStage .popup.challenge-win .ch-win-heading{font-size:clamp(16px,4vw,22px)!important;color:#f4f8ff!important;white-space:normal!important;text-align:center!important}
#gameStage .popup.challenge-win .ch-win-detail{font-size:clamp(13px,3.5vw,16px)!important;color:#d9f0e7!important;white-space:normal!important;text-align:center!important;margin-top:4px!important}

/* POP TIME intro prompt should be a card, not a blob */
#gameStage>.sheet>.bonus-countdown:not([hidden]){
  width:min(76%, 420px)!important;
  min-width:min(76%, 280px)!important;
  max-width:min(88%, 420px)!important;
  min-height:154px!important;
  padding:18px 18px 16px!important;
  border-radius:var(--pw123-card-radius)!important;
  border:1px solid var(--pw123-card-border)!important;
  background:var(--pw123-card-bg)!important;
  box-shadow:var(--pw123-card-shadow)!important;
  color:#f7f5ff!important;
  font-size:clamp(27px,7vw,46px)!important;
  letter-spacing:.7px!important;
  text-align:center!important;
  text-shadow:0 2px 13px rgba(12,24,59,.42)!important;
}
#gameStage>.sheet>.bonus-countdown:not([hidden])::before{
  content:""!important;position:absolute!important;inset:1px!important;border-radius:inherit!important;
  border:1px solid rgba(243,247,255,.15)!important;
  background:radial-gradient(ellipse at 22% 10%, rgba(255,255,255,.14), transparent 54%)!important;
  pointer-events:none!important;
}

/* Challenge strip / announcement row */
#gameStage>.queue-title{height:48px!important;min-height:48px!important}
#gameStage>.queue-title .challenge-hud{
  inset:0!important;
  min-height:48px!important;
  padding:7px 13px!important;
  border-radius:22px!important;
  border:1px solid var(--pw123-card-border)!important;
  background:var(--pw123-card-bg)!important;
  box-shadow:0 10px 22px rgba(4,12,32,.16), inset 0 2px 8px rgba(249,253,255,.06)!important;
  color:#f4f8ff!important;
}
#gameStage>.queue-title .challenge-hud::before{
  content:""!important;position:absolute!important;inset:1px!important;border-radius:inherit!important;
  border:1px solid rgba(243,247,255,.14)!important;
  background:radial-gradient(ellipse at 22% 10%, rgba(255,255,255,.12), transparent 56%)!important;
  pointer-events:none!important;
}
.challenge-hud .ch-eyebrow{color:#d8ebe7!important;font-size:9px!important;letter-spacing:1px!important}
.challenge-hud .ch-goal{color:#f8fbff!important;font-size:12px!important}
.challenge-hud .ch-timer{color:#fff3d4!important;font-size:18px!important}
.challenge-hud .ch-timer.ch-low{color:#ffd2c6!important}
.challenge-hud .ch-record{color:#cfd9ef!important}

/* Clean record experience: only the round crown bubble carries the high-score celebration. */
.gameover-modal.pw123-record-mode .gameover-card.pw123-under-record{
  padding-top:118px!important;
}
.gameover-modal.pw123-record-mode .gameover-card.pw123-under-record .gameover-eyebrow{color:#d6dfef!important}
.gameover-modal.pw123-record-mode .gameover-card.pw123-under-record h2{margin-top:2px!important}
#pw121RecordBubble.pw123-record-bubble{
  width:min(54vw,205px)!important;
  aspect-ratio:1/1!important;
  border-radius:50%!important;
  top:calc(50% - 130px)!important;
  gap:4px!important;
  background:
    radial-gradient(circle at 29% 16%, rgba(255,255,255,.26), transparent 21%),
    radial-gradient(circle at 76% 80%, rgba(180,188,255,.13), transparent 28%),
    linear-gradient(155deg, rgba(113,126,185,.96), rgba(59,72,129,.98))!important;
  box-shadow: inset 0 7px 16px rgba(255,255,255,.20), inset 0 -12px 20px rgba(12,16,48,.18), 0 20px 60px rgba(2,8,25,.36), 0 0 0 1px rgba(255,255,255,.05)!important;
}
#pw121RecordBubble.pw123-record-bubble::before{inset:10%!important}
#pw121RecordBubble .pw121-kicker{font-size:clamp(10px,2.8vw,12px)!important;letter-spacing:1.8px!important}
#pw121RecordBubble .pw121-title{font-size:clamp(21px,5.8vw,28px)!important;line-height:1.04!important}
#pw121RecordBubble .pw121-score{font-size:clamp(18px,5.5vw,27px)!important}
#pw121RecordBubble .pw121-sub{display:none!important}
#pw121RecordBubble .pw123-crown-wrap{display:flex;align-items:center;justify-content:center;height:30px}
#pw121RecordBubble .pw123-crown{font-size:clamp(24px,6vw,31px)!important;filter:drop-shadow(0 2px 8px rgba(255,224,130,.16))}
@media(max-width:520px){
  #gameStage>.queue-title{height:45px!important;min-height:45px!important}
  #gameStage>.queue-title .challenge-hud{padding:6px 10px!important;border-radius:20px!important}
  #pw121RecordBubble.pw123-record-bubble{width:min(58vw,198px)!important;top:calc(50% - 122px)!important}
}
