/* Browser remoto per il login Instagram: tutto schermo, pensato per iPhone. */
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html, body { margin: 0; height: 100%; background: #0a0a0f; color: #f4f4f8; font: 14px -apple-system, system-ui, sans-serif; overflow: hidden; overscroll-behavior: none; }
.rl { position: fixed; inset: 0; display: flex; flex-direction: column; }
.rl-top { flex: none; display: flex; align-items: center; gap: 6px; padding: calc(env(safe-area-inset-top) + 6px) 8px 6px; background: #15151f; border-bottom: 1px solid #2a2a3a; }
.rl-st { flex: 1; min-width: 0; font-size: 12px; color: #9a9ab0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rl-st.ok { color: #51cf66; font-weight: 600; }
.rl-st.err { color: #ff6b6b; }
.rl-btn { flex: none; display: inline-flex; align-items: center; justify-content: center; height: 36px; min-width: 40px; padding: 0 10px; font-size: 15px; color: #f4f4f8; background: #24243a; border: 0; border-radius: 10px; text-decoration: none; }
.rl-btn:active { background: #34345a; }
.rl-btn.on, .rl-primary { background: linear-gradient(120deg, #f06595, #d6336c); font-weight: 700; }
.rl-wrap { flex: 1; min-height: 0; display: flex; justify-content: center; align-items: flex-start; padding-bottom: env(safe-area-inset-bottom); }
.rl-scr { display: block; max-width: 100%; max-height: 100%; touch-action: none; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
.rl-msg { margin: 40px 20px; text-align: center; color: #9a9ab0; line-height: 1.5; }
.rl-ki { position: fixed; top: 0; left: 0; width: 2px; height: 2px; opacity: 0; font-size: 16px; border: 0; padding: 0; resize: none; }
.rl-dot { position: fixed; width: 34px; height: 34px; margin: -17px 0 0 -17px; border-radius: 50%; border: 2px solid #f06595; pointer-events: none; animation: rl-dot .45s ease-out forwards; }
@keyframes rl-dot { from { transform: scale(.4); opacity: 1; } to { transform: scale(1.3); opacity: 0; } }
.rl-banner { position: fixed; left: 10px; right: 10px; bottom: calc(env(safe-area-inset-bottom) + 12px); padding: 12px 14px; border-radius: 12px; background: #15151f; border: 1px solid #2a2a3a; font-size: 14px; line-height: 1.4; box-shadow: 0 8px 30px rgba(0, 0, 0, .5); }
.rl-banner.ok { background: #12351f; border-color: #2b8a3e; color: #b2f2bb; }
.rl-banner-actions { display: flex; gap: 8px; margin-top: 10px; }
.rl-banner-actions .rl-btn { flex: 1; }
.rl-banner[hidden], .rl-btn[hidden], .rl-scr[hidden] { display: none; }
