/* ---------- PWA: install button, iOS hint, offline banner ---------- */

/* Fixed bottom-right, deliberately independent of #app-header (which
   is hidden until sign-in) so an install prompt can appear on the
   auth screen too — see index.html for why this lives outside the
   header. */
#pwa-toolbar{
  position:fixed;right:16px;bottom:16px;z-index:60;
  display:flex;align-items:center;gap:8px;
}

.pwa-install-btn{
  display:none;align-items:center;gap:7px;font-family:var(--font);
  font-size:12.5px;font-weight:800;letter-spacing:.3px;color:#C9D0E8;
  padding:9px 14px;border-radius:11px;border:1px solid var(--line-strong);
  background:rgba(255,255,255,.02);cursor:pointer;transition:background .18s,border-color .18s;white-space:nowrap;
}
.pwa-install-btn:hover{background:rgba(255,255,255,.06);border-color:var(--steel)}
.pwa-install-btn:focus-visible{outline:2px solid var(--crimson-light);outline-offset:2px}

.pwa-ios-hint{
  display:none;font-size:11px;font-weight:700;color:var(--muted);
  padding:6px 12px;border-radius:999px;border:1px solid var(--line);
  background:rgba(255,255,255,.02);white-space:nowrap;
}

/* Honest, non-blocking connectivity notice — never implies student
   data or progress is available offline (see sw.js and
   docs/decisions/gate-2-pwa-and-marketing-plan.md, "Fix 5"). */
#offline-banner{
  display:none;position:fixed;top:0;left:0;right:0;z-index:90;
  text-align:center;padding:9px 16px;font-size:12.5px;font-weight:700;
  color:#F3DCAF;background:rgba(233,180,76,.16);
  border-bottom:1px solid rgba(233,180,76,.45);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
}