/* V27 — nonblocking portrait-phone rotate suggestion. Reader app only. */
.rotate-tip[hidden]{display:none!important}
.rotate-tip{position:fixed;z-index:48;left:50%;bottom:calc(max(64px,env(safe-area-inset-bottom)) + 4px);transform:translateX(-50%);display:flex;align-items:center;gap:11px;width:min(420px,calc(100vw - 22px));padding:11px 12px;background:linear-gradient(120deg,#fff9e9 0%,#f6fafc 100%);color:#294960;border:1px solid #e3d5b8;border-radius:19px;box-shadow:0 12px 38px #17394d35,0 2px 8px #17394d15;animation:rotate-tip-arrive .35s ease both;text-align:left}
.rotate-tip-art{position:relative;display:grid;place-items:center;flex:0 0 43px;width:43px;height:43px;border-radius:14px;background:#e2f2f7;color:#3e8ca9;overflow:hidden}
.rotate-phone{height:35px;width:35px;animation:rotate-phone-demo 2.8s ease-in-out .3s 2 both;transform-origin:center}
.rotate-swoosh{width:17px;height:17px;position:absolute;right:0;top:-2px;color:#c48349}
.rotate-tip-copy{display:flex;flex-direction:column;gap:3px;flex:1;min-width:0}
.rotate-tip-copy strong{font-size:13px;font-weight:800;line-height:1.2;letter-spacing:-.12px;color:#254a61}
.rotate-tip-copy>span{font-size:11.5px;line-height:1.3;color:#5c7986}
.rotate-tip-dismiss{border:0;border-radius:11px;padding:10px 10px;flex:0 0 auto;background:#2c88ab;color:#fff;font-family:inherit;font-weight:800;font-size:11px;cursor:pointer;min-height:36px}
.rotate-tip-dismiss:focus-visible{outline:3px solid #db9a59;outline-offset:3px}
@keyframes rotate-tip-arrive{from{opacity:0;transform:translate(-50%,14px)}to{opacity:1;transform:translate(-50%,0)}}
@keyframes rotate-phone-demo{0%,20%,70%,100%{transform:rotate(0)}42%,54%{transform:rotate(90deg)}}
@media(max-width:350px){.rotate-tip{gap:7px;padding:9px 8px}.rotate-tip-art{flex-basis:36px;width:36px;height:36px}.rotate-tip-copy strong{font-size:12px}.rotate-tip-copy>span{font-size:10.5px}.rotate-tip-dismiss{font-size:10px;padding:9px 7px}}
@media(prefers-reduced-motion:reduce){.rotate-tip,.rotate-phone{animation:none!important}}
@media (orientation:landscape),(min-width:641px),(pointer:fine){.rotate-tip{display:none!important}}
