/* Popex v113 — fix iOS pull-down black area and make live POP TIME circular + centered. */
html,body{
  min-height:100%!important;
  background:#0a1735!important;
  overscroll-behavior-y:none;
}
body{
  position:relative!important;
  overflow-x:hidden!important;
}
body::before{
  content:"";
  position:fixed;
  inset:-24vh 0 -28vh 0;
  z-index:-20;
  pointer-events:none;
  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,#0b1737 0%, #1b2a63 58%, #112654 82%, #091832 100%);
}
body::after{
  content:"";
  position:fixed;
  inset:34vh -24vw -16vh -24vw;
  z-index:-19;
  pointer-events:none;
  background:
    radial-gradient(ellipse 78% 42% at 36% 20%, rgba(134,148,205,.17), rgba(106,126,185,.08) 48%, transparent 78%),
    radial-gradient(ellipse 80% 46% at 62% 78%, rgba(106,125,196,.13), rgba(93,110,179,.06) 46%, transparent 76%);
  filter:blur(24px);
}
main.moonlit-app{
  position:relative!important;
  background:transparent!important;
  min-height:100vh!important;
  min-height:100dvh!important;
  min-height:-webkit-fill-available!important;
}
@supports (-webkit-touch-callout:none){
  html,body,main.moonlit-app{min-height:-webkit-fill-available!important}
}
@media (orientation:portrait){
  /* Slightly richer bottom veil so the last part of the page never feels cut off. */
  .moonlit-app .ridge-near{
    top:clamp(330px,50dvh,492px)!important;
    height:clamp(215px,33dvh,340px)!important;
    opacity:.95!important;
  }

  /* Live POP TIME clock: circular bubble centered on the same vertical band as the score numerals. */
  #gameStage>.stats .pop-time-hud{
    top:3px!important;
    left:50%!important;
    right:auto!important;
    bottom:auto!important;
    width:94px!important;
    height:94px!important;
    margin-left:-47px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    border-radius:50%!important;
  }
  #gameStage .pop-time-clock,
  .moonlit-app .pop-time-clock{
    width:94px!important;
    height:94px!important;
    border-radius:50%!important;
    display:none;
    gap:0!important;
    padding:0!important;
    background:
      radial-gradient(circle at 32% 24%, rgba(255,255,255,.36), transparent 30%),
      linear-gradient(180deg, rgba(172,183,229,.92) 0%, rgba(115,130,191,.92) 48%, rgba(83,97,163,.94) 100%)!important;
    border:1.5px solid rgba(234,240,255,.72)!important;
    box-shadow:inset 0 2px 8px rgba(255,255,255,.32), inset 0 -6px 12px rgba(31,45,95,.28), 0 12px 26px rgba(8,14,34,.22)!important;
  }
  .pop-time-hud.is-live .pop-time-clock{display:flex!important}
  #gameStage .pop-time-clock small{
    font-size:11px!important;line-height:1!important;letter-spacing:1.25px!important;
    color:#eef3ff!important;margin-top:8px!important;
  }
  #gameStage .pop-time-clock strong{
    font-size:52px!important;line-height:.92!important;margin:4px 0 2px!important;
    color:#fffaf0!important;text-shadow:0 2px 7px rgba(23,29,60,.2)!important;
  }
  #gameStage .pop-time-clock span{
    font-size:10px!important;line-height:1!important;letter-spacing:.55px!important;
    color:#edf9ff!important;margin-bottom:9px!important;
  }
}
@media (orientation:portrait) and (max-height:740px){
  #gameStage>.stats .pop-time-hud{
    top:1px!important;width:84px!important;height:84px!important;margin-left:-42px!important;
  }
  #gameStage .pop-time-clock,.moonlit-app .pop-time-clock{width:84px!important;height:84px!important}
  #gameStage .pop-time-clock strong{font-size:46px!important}
  #gameStage .pop-time-clock small{font-size:10px!important;margin-top:7px!important}
  #gameStage .pop-time-clock span{font-size:9px!important;margin-bottom:8px!important}
}
@media (orientation:portrait) and (max-height:620px){
  #gameStage>.stats .pop-time-hud{
    top:0!important;width:72px!important;height:72px!important;margin-left:-36px!important;
  }
  #gameStage .pop-time-clock,.moonlit-app .pop-time-clock{width:72px!important;height:72px!important}
  #gameStage .pop-time-clock strong{font-size:37px!important}
  #gameStage .pop-time-clock small{font-size:8px!important;margin-top:5px!important}
  #gameStage .pop-time-clock span{font-size:7px!important;margin-bottom:6px!important}
}
