.r2l-portrait-guard{display:none;box-sizing:border-box;position:fixed;inset:0;z-index:2147483647;min-height:100dvh;padding:20px max(24px,env(safe-area-inset-right)) 20px max(24px,env(safe-area-inset-left));place-content:center;justify-items:center;gap:12px;background:radial-gradient(ellipse at 50% 30%,#192019,#070a09 48%,#020405);color:#f3ddb1;text-align:center;font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif}
.r2l-portrait-guard img{display:block;width:150px;max-width:40vw;height:auto;margin-bottom:4px}
.r2l-portrait-guard svg{display:block;width:46px;height:58px;color:#e6bd70}
.r2l-portrait-guard h1{margin:0;font:500 clamp(24px,4vw,36px)/1.1 Georgia,serif;letter-spacing:-.025em;color:#f3ddb1}
.r2l-portrait-guard p{max-width:440px;margin:0;color:#9da5a1;font-size:13px;line-height:1.5}
@media screen{
 html[data-r2l-phone-landscape],html[data-r2l-phone-landscape] body{overflow:hidden!important}
 html[data-r2l-phone-landscape] body>:not(#r2l-portrait-guard),html[data-r2l-phone-landscape] body>:not(#r2l-portrait-guard) *{visibility:hidden!important;pointer-events:none!important}
 html[data-r2l-phone-landscape] #r2l-portrait-guard{display:grid}
}
/* Protect first paint before the controller loads. The controller then uses the
   physical screen orientation, so opening a keyboard cannot block a form. */
@media screen and (orientation:landscape) and (any-pointer:coarse) and (max-height:600px){
 html:not([data-r2l-orientation-ready]),html:not([data-r2l-orientation-ready]) body{overflow:hidden!important}
 html:not([data-r2l-orientation-ready]) body>:not(#r2l-portrait-guard){visibility:hidden!important}
 html:not([data-r2l-orientation-ready]) #r2l-portrait-guard{display:grid!important}
}
