/* Native jade frame and image_gen phone, animated with crisp pixel scaling. */
#orientation-guard{position:fixed;inset:0;z-index:100000;display:grid;place-items:center;overflow:auto;padding:max(16px,env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left));background:#06151df5;color:#f3e5bc;font-family:var(--pixel,Pixelify,monospace);font-size:17px;line-height:1.45;text-align:center;outline:0;box-sizing:border-box}
#orientation-guard[hidden]{display:none!important}#orientation-guard *{box-sizing:border-box}
#orientation-guard .orientation-panel{width:min(430px,100%);min-width:0;padding:28px 25px;border:18px solid transparent;border-image:url('assets/ui/arena-jade-quiet.png') 40 95 fill / 18px 30px / 0 stretch;image-rendering:pixelated}
#orientation-guard .orientation-phone{display:block;width:72px;height:116px;object-fit:contain;margin:20px auto 28px;image-rendering:pixelated;animation:arena-phone-turn 2.6s steps(18,end) infinite}
#orientation-guard .orientation-kicker{font-size:11px;letter-spacing:.07em;color:#adcdbd;margin:8px 0}
#orientation-guard h2{font-size:clamp(22px,7vw,30px);line-height:1.12;color:#fff0bd;margin:10px 0;overflow-wrap:break-word}
#orientation-guard p{margin:10px 0;overflow-wrap:break-word}#orientation-guard .orientation-note{font-size:13px;color:#b6cdbf;margin:18px 0 0}
body.orientation-blocked{overflow:hidden!important}#orientation-guard.orientation-ready .orientation-phone{animation:arena-phone-ready .62s steps(12,end) both}#orientation-guard.orientation-ready .orientation-panel{animation:arena-orientation-ready .62s steps(12,end) both}
@keyframes arena-phone-turn{0%,15%{transform:rotate(0)}55%,80%{transform:rotate(-90deg)}100%{transform:rotate(0)}}
@keyframes arena-phone-ready{from{transform:rotate(0) scale(.85)}60%,100%{transform:rotate(-90deg) scale(1)}}
@keyframes arena-orientation-ready{0%,70%{opacity:1}100%{opacity:0}}
@media(orientation:landscape){#orientation-guard .orientation-panel{width:min(620px,100%);padding:10px 30px}#orientation-guard .orientation-phone{width:42px;height:68px;margin:10px auto 14px}#orientation-guard h2{font-size:24px}#orientation-guard .orientation-note{margin-top:8px}}
@media(prefers-reduced-motion:reduce){#orientation-guard .orientation-phone,#orientation-guard.orientation-ready .orientation-phone,#orientation-guard.orientation-ready .orientation-panel{animation:none}#orientation-guard .orientation-phone{transform:rotate(-90deg)}}