:root{
  --hlog-pwa-online:#027A48;
  --hlog-pwa-offline:#B42318;
  --hlog-pwa-panel:#101828;
}
.hlog-pwa-status{
  position:fixed;
  left:16px;
  right:16px;
  bottom:16px;
  z-index:2600;
  display:none;
  pointer-events:none;
}
.hlog-pwa-status.is-visible{display:block;}
.hlog-pwa-status__pill{
  margin-left:auto;
  width:max-content;
  max-width:100%;
  padding:10px 14px;
  border-radius:999px;
  box-shadow:0 14px 28px rgba(16,24,40,.18);
  color:#fff;
  font-size:.92rem;
  font-weight:600;
  background:var(--hlog-pwa-panel);
}
.hlog-pwa-status__pill.is-offline{background:var(--hlog-pwa-offline);}
.hlog-pwa-status__pill.is-online{background:var(--hlog-pwa-online);}
.hlog-pwa-gate{
  position:fixed;
  inset:0;
  z-index:2700;
  display:none;
  align-items:center;
  justify-content:center;
  padding:24px;
  background:rgba(15,23,42,.72);
  backdrop-filter:blur(6px);
}
.hlog-pwa-gate.is-visible{display:flex;}
.hlog-pwa-gate__card{
  width:min(680px, 100%);
  border-radius:24px;
  background:#fff;
  border:1px solid rgba(16,24,40,.08);
  box-shadow:0 28px 56px rgba(15,23,42,.22);
  padding:24px;
}
.hlog-pwa-gate__title{font-size:1.2rem;font-weight:800;color:#101828;}
.hlog-pwa-gate__text{color:#475467;margin-top:8px;}
.hlog-pwa-gate__list{margin:14px 0 0;padding-left:18px;color:#344054;}
.hlog-pwa-gate__actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px;}
.hlog-pwa-disabled{pointer-events:none !important;opacity:.55 !important;filter:grayscale(.12);}
@media (max-width: 576px){
  .hlog-pwa-status{left:12px;right:12px;bottom:12px;}
  .hlog-pwa-status__pill{width:100%;text-align:center;}
  .hlog-pwa-gate__card{padding:20px;border-radius:20px;}
}
@supports(padding:max(0px)){
  .hlog-pwa-status{bottom:max(12px,env(safe-area-inset-bottom));left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));}
  .hlog-pwa-gate{padding:max(18px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));}
}