/* iPhone safe areas belong to the shell, not the painted panels. */
.game{padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);box-sizing:border-box}
html{scroll-padding-top:calc(env(safe-area-inset-top,0px) + 12px)}
dialog{max-height:calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px) - 24px)!important;margin-top:max(12px,env(safe-area-inset-top,0px));margin-bottom:max(12px,env(safe-area-inset-bottom,0px))}
dialog .close{z-index:20;touch-action:manipulation}
.gacha-opening .royal-card-front{cursor:pointer;color:inherit;font-family:inherit;touch-action:manipulation}
.gacha-opening .royal-card-front:focus-visible{outline:2px solid var(--loot-color);outline-offset:5px}
.challenge-illustration.medal{display:block;float:none;align-self:center;flex-shrink:0;margin:0 auto 13px!important;aspect-ratio:1;background-repeat:no-repeat;background-size:330% 330%}
.challenge:nth-child(1) .challenge-illustration{background-position:50% 1%!important}
.challenge:nth-child(2) .challenge-illustration{background-position:3% 43.5%!important}
.challenge:nth-child(3) .challenge-illustration{background-position:50% 43.5%!important}
/* Rendered Blender footage: keep its native 5:7 frame, including on narrow phones. */
.gacha-opening .royal-stage{aspect-ratio:5/7;min-height:0!important}
.royal-chest-film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
.gacha-opening:not(.card-ready):not(.gacha-complete) .gacha-sky{display:none}
.gacha-opening .royal-chest-tap{inset:0!important;left:0!important;top:0!important;width:100%!important;height:100%!important;max-width:none!important;transform:none;aspect-ratio:auto}
.gacha-opening .royal-chest-tap .treasure-chest{display:none}
.gacha-opening .gacha-tap-label{position:absolute;bottom:6%;left:0;right:0;padding:15px 5px;background:linear-gradient(90deg,transparent,#0b0806dd,transparent);color:#f1d49e;font-size:11px}
.gacha-opening.is-summoning .royal-chest-tap{animation:none!important;opacity:0}
.gacha-opening.card-ready .royal-chest-film,.gacha-opening.gacha-complete .royal-chest-film{display:none}
.gacha-opening.card-ready .royal-stage,.gacha-opening.gacha-complete .royal-stage{aspect-ratio:auto}
