/* POPEX v110 — repair standalone layout regression against v107. */
@media (orientation:portrait){
 html,body{width:100%;margin:0;overflow-x:hidden}
 main.moonlit-app{
  display:block!important;box-sizing:border-box!important;
  min-height:100vh!important;min-height:100dvh!important;
  height:auto!important;
  padding:calc(8px + env(safe-area-inset-top,0px)) 11px calc(16px + env(safe-area-inset-bottom,0px))!important;
 }
 .moonlit-app .layout{display:block!important;min-height:0!important;height:auto!important;flex:none!important}
 .moonlit-app .layout>.panel{display:block!important;min-height:0!important;height:auto!important;flex:none!important}
 .moonlit-app .bloop-header{margin-bottom:0!important}
 #gameStage{
  --pw109-board-size:unset!important;
  margin:clamp(4px,1.4dvh,14px) auto 0!important;
  width:100%!important;height:auto!important;min-height:0!important;
  flex:none!important;display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  grid-template-rows:auto 48px auto auto!important;
  grid-template-areas:"stats" "heading" "board" "queue"!important;
  align-content:start!important;align-items:start!important;
  gap:0!important;
 }
 #gameStage>.stats{margin:0!important;padding:0 0 2px!important;align-self:start!important}
 #gameStage>.queue-title{height:48px!important;min-height:48px!important;margin:0!important;align-self:start!important;display:flex!important;align-items:center!important}
 #gameStage>.queue-title .challenge-hud{height:46px!important;min-height:0!important}
 #gameStage>#sheet{width:min(100%,360px)!important;aspect-ratio:1 / 1!important;align-self:start!important;justify-self:center!important;margin:0 auto!important}
 #gameStage>#sheet>#board{width:100%!important;aspect-ratio:1 / 1!important;height:auto!important}
 #gameStage>#rack{
  width:min(100%,380px)!important;height:auto!important;min-height:0!important;
  margin:clamp(12px,2.2dvh,22px) auto 0!important;padding:0!important;
  display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;
  grid-template-rows:auto!important;gap:clamp(7px,2.4vw,12px)!important;
  align-items:center!important;justify-items:center!important;align-self:start!important;
 }
 #gameStage>#rack>.piece{
  width:min(100%,116px)!important;height:auto!important;min-height:0!important;
  aspect-ratio:1 / 1!important;border-radius:50%!important;
  align-self:center!important;justify-self:center!important;
 }
 /* Organic veil floats between the branding and the board, never a hard semicircle under it. */
 .moonlit-app .night-atmosphere{height:100%!important;overflow:hidden!important}
 .moonlit-app .ridge-far{
  top:clamp(124px,19dvh,204px)!important;left:-25%!important;width:155%!important;
  height:clamp(115px,18dvh,190px)!important;
  border-radius:56% 44% 58% 42% / 35% 64% 36% 65%!important;
  transform:rotate(-5deg)!important;
  background:radial-gradient(ellipse 72% 55% at 36% 55%,rgba(131,145,203,.16),rgba(105,125,185,.075) 53%,transparent 83%)!important;
  filter:blur(25px)!important;
 }
 .moonlit-app .ridge-near{
  top:clamp(156px,23dvh,236px)!important;left:-37%!important;width:174%!important;
  height:clamp(110px,18dvh,185px)!important;
  border-radius:47% 53% 63% 37% / 65% 36% 64% 35%!important;
  transform:rotate(6deg)!important;
  background:radial-gradient(ellipse 63% 60% at 65% 43%,rgba(140,151,210,.10),transparent 79%)!important;
  filter:blur(29px)!important;
 }
}
@media (orientation:portrait) and (max-height:740px){
 #gameStage{grid-template-rows:auto 34px auto auto!important;margin-top:1px!important}
 #gameStage>.queue-title{height:34px!important;min-height:34px!important}
 #gameStage>#sheet{width:min(100%,calc(100dvh - 280px),350px)!important}
 #gameStage>#rack{margin-top:8px!important}
 #gameStage>#rack>.piece{width:min(100%,100px)!important}
}
@media (orientation:portrait) and (max-height:620px){
 #gameStage{grid-template-rows:auto 25px auto auto!important}
 #gameStage>.queue-title{height:25px!important;min-height:25px!important}
 #gameStage>#sheet{width:min(100%,calc(100dvh - 246px),320px)!important}
 #gameStage>#rack>.piece{width:min(100%,82px)!important}
}
