.offline-sync-banner{position:fixed;left:50%;bottom:18px;z-index:10060;display:flex;align-items:center;gap:12px;min-width:min(92vw,420px);max-width:92vw;padding:12px 14px;border:1px solid #d8e1ee;border-radius:8px;background:#fff;box-shadow:0 16px 42px rgba(15,23,42,.18);color:#172033;transform:translateX(-50%)}.offline-sync-banner.is-offline{border-color:#f0b46a;background:#fff8ed}.offline-sync-banner.is-online{border-color:#b8dec1;background:#f3fbf5}.offline-sync-icon{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;flex:0 0 34px;border-radius:50%;background:#fff;color:#064ec4}.offline-sync-banner.is-offline .offline-sync-icon{color:#b45309}.offline-sync-banner>div:nth-child(2){display:grid;gap:2px;min-width:0;flex:1 1}.offline-sync-banner strong{font-size:13px;font-weight:800;line-height:1.2}.offline-sync-banner span{color:#4b5563;font-size:12px;line-height:1.35}.offline-sync-banner button{display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:0 10px;border:1px solid #064ec4;border-radius:6px;background:#064ec4;color:#fff;font-size:12px;font-weight:800}.offline-sync-banner button:disabled{opacity:.7}.offline-sync-spin{animation:offline-sync-spin .9s linear infinite}@keyframes offline-sync-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@media (max-width:560px){.offline-sync-banner{align-items:flex-start;bottom:12px}.offline-sync-banner button{display:none}}