.orientation-gate{position:fixed;inset:0;z-index:1000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;padding:28px 23px;text-align:center;background:radial-gradient(circle at 50% 35%,#368fc9,#19599d 48%,#123c74);color:#effcff;overflow:auto;min-height:100dvh}.orientation-gate:before,.orientation-gate:after{content:'';position:absolute;width:140px;height:170px;z-index:-1;border-radius:50%;border:2px solid #9ff7ff33;background:radial-gradient(circle at 30% 25%,#ccffff33,#44bedb0a);transform:rotate(25deg)}.orientation-gate:before{left:-65px;top:8%}.orientation-gate:after{right:-70px;bottom:10%;width:200px;height:230px}.rotate-brand{font:800 22px/.9 'Baloo 2',sans-serif;letter-spacing:-.4px;color:#d5ffff;display:flex;align-items:center;gap:9px}.rotate-brand>span{display:grid;place-items:center;width:36px;height:38px;border-radius:11px;background:#51e4d8;color:#105471;font-size:32px;box-shadow:0 3px 0 #198ba5}.rotate-illustration{position:relative;display:grid;place-items:center;width:156px;height:143px;margin:31px 0 20px}.rotate-illustration svg{width:137px;height:117px;fill:none;stroke:#c5fffc;stroke-width:4;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 5px 0 #0e498c)}.rotate-illustration .rotate-arrow{stroke:#ffda80;stroke-width:3}.rotate-illustration .rotate-screen{fill:#53dccc33;stroke:#8cf1ee;stroke-width:2}.rotate-kicker{font-size:9px;font-weight:900;letter-spacing:2.1px;color:#99deee}.orientation-gate h1{font:800 36px/.98 'Baloo 2',sans-serif;letter-spacing:-.7px;margin:14px 0 15px;text-shadow:0 3px 0 #174986;max-width:330px}.orientation-gate p{font-size:13px;line-height:1.6;color:#c4e8f7;max-width:285px;margin:0 0 22px}.orientation-gate button{background:linear-gradient(#ffdd7d,#ffb64e);border:2px solid #fff0b4;border-radius:14px;color:#6c471f;box-shadow:0 4px 0 #a67532;padding:13px 24px;font-weight:900;font-size:14px;min-height:47px;min-width:220px}.orientation-gate #orientation-status{font-size:11px;line-height:1.5;margin:18px 0 0;color:#f8e3b1;max-width:290px;min-height:34px}.portrait-locked{overflow:hidden}.portrait-locked .app-shell{visibility:hidden;pointer-events:none}.portrait-locked dialog{visibility:hidden}.portrait-locked .toast{visibility:hidden}
@media(pointer:coarse) and (orientation:portrait){#orientation-gate{display:flex!important}body>.app-shell{visibility:hidden}}
@media(min-width:600px){.orientation-gate h1{font-size:46px;max-width:410px}.orientation-gate p{font-size:16px;max-width:390px}.rotate-illustration{transform:scale(1.15);margin:45px 0 30px}.orientation-gate button{font-size:16px;padding:15px 32px}.rotate-brand{font-size:27px}}