/* Popex v112 — simpler final polish: lower tray, full-height gradient, POP TIME uses brand mascot. */
@media (orientation:portrait){
  html,body{min-height:100%;background:linear-gradient(180deg,#0c1739 0%, #1b2a63 58%, #10224d 82%, #091732 100%)!important}
  body{background:linear-gradient(180deg,#0c1739 0%, #1b2a63 58%, #10224d 82%, #091732 100%)!important}
  main.moonlit-app{
    background:
      radial-gradient(130% 64% at 50% 18%, rgba(120,140,214,.18) 0%, rgba(120,140,214,.09) 38%, rgba(120,140,214,0) 68%),
      linear-gradient(180deg,#0c1739 0%, #1b2a63 58%, #10224d 82%, #091732 100%)!important;
    min-height:100vh!important;min-height:100dvh!important;
  }
  /* Let the atmospheric veil reach down instead of fading too early. */
  .moonlit-app .night-atmosphere{inset:0!important;height:100%!important;min-height:100%!important}
  .moonlit-app .ridge-far{
    top:clamp(136px,20dvh,210px)!important;left:-28%!important;width:162%!important;
    height:clamp(180px,27dvh,280px)!important;
    border-radius:58% 42% 55% 45% / 40% 60% 38% 62%!important;
    background:radial-gradient(ellipse 78% 60% at 36% 46%,rgba(134,148,205,.18),rgba(106,126,185,.09) 53%,transparent 84%)!important;
    filter:blur(26px)!important;
  }
  .moonlit-app .ridge-near{
    top:clamp(320px,49dvh,470px)!important;left:-34%!important;width:170%!important;
    height:clamp(200px,31dvh,315px)!important;
    border-radius:46% 54% 60% 40% / 58% 40% 60% 42%!important;
    background:radial-gradient(ellipse 72% 68% at 58% 40%,rgba(106,125,196,.16),rgba(93,110,179,.08) 48%,transparent 82%)!important;
    filter:blur(30px)!important;
  }

  /* Move the board / tray relationship closer to centered balance. */
  #gameStage>#rack{
    margin:clamp(34px,6.2dvh,62px) auto 0!important;
    width:min(100%,392px)!important;
    gap:clamp(8px,2.8vw,14px)!important;
  }
  #gameStage>#rack>.piece{
    width:min(100%,116px)!important;
    aspect-ratio:1/1!important;
  }

  /* POP TIME: exact same mascot language as in the header, animated for 1s. */
  #gameStage>.sheet>.bonus-countdown:not([hidden]){
    display:flex!important;flex-direction:column!important;align-items:center!important;gap:8px!important;
  }
  .pw112-pop-mascot.brand-mark{
    position:relative!important;
    display:inline-flex!important;
    width:72px!important;height:72px!important;min-width:72px!important;min-height:72px!important;
    box-shadow:0 0 0 1px rgba(255,255,255,.18), 0 8px 24px rgba(44,97,163,.24), inset 0 2px 10px rgba(255,255,255,.45)!important;
    animation:pw112MascotPop 1s ease-in-out both!important;
  }
  .pw112-pop-mascot .brand-eye{top:24px!important;left:18px!important}
  .pw112-pop-mascot .brand-eye.eye-two{left:auto!important;right:16px!important}
  .pw112-pop-mascot .brand-pupil{animation:pw112Blink 1s ease-in-out 1 both!important}
  .pw112-intro-label{font-size:clamp(23px,6vw,36px);font-weight:850;letter-spacing:.5px;line-height:1.1}
  @keyframes pw112MascotPop{
    0%{transform:scale(.82) translateY(3px);opacity:.0}
    18%{opacity:1}
    38%{transform:scale(1.08) translateY(-1px)}
    62%{transform:scale(.98) translateY(0)}
    100%{transform:scale(1) translateY(0);opacity:1}
  }
  @keyframes pw112Blink{
    0%,100%{transform:scaleY(1)}
    42%{transform:scaleY(1)}
    48%{transform:scaleY(.16)}
    56%{transform:scaleY(1)}
  }
}
@media (orientation:portrait) and (max-height:740px){
  #gameStage>#rack{margin-top:28px!important}
  #gameStage>#rack>.piece{width:min(100%,108px)!important}
  .pw112-pop-mascot.brand-mark{width:68px!important;height:68px!important;min-width:68px!important;min-height:68px!important}
  .moonlit-app .ridge-near{top:clamp(296px,47dvh,420px)!important;height:clamp(170px,28dvh,240px)!important}
}
@media (orientation:portrait) and (max-height:620px){
  #gameStage>#rack{margin-top:16px!important}
  #gameStage>#rack>.piece{width:min(100%,90px)!important}
  .pw112-pop-mascot.brand-mark{width:60px!important;height:60px!important;min-width:60px!important;min-height:60px!important}
}
@media(prefers-reduced-motion:reduce){
  .pw112-pop-mascot.brand-mark,.pw112-pop-mascot .brand-pupil{animation:none!important}
}