.pwa-connection {
  position: fixed; z-index: 100; top: max(12px, env(safe-area-inset-top));
  left: 50%; transform: translateX(-50%); width: max-content;
  max-width: calc(100% - 24px); box-sizing: border-box;
  display: flex; align-items: center; gap: 16px; padding: 12px 16px;
  border: 1px solid #caa66e; border-radius: 14px; background: #142739;
  color: #f6dfba; box-shadow: 0 8px 32px #0006;
}
.pwa-connection[hidden] { display: none; }
.pwa-connection strong { display: block; font-size: .9rem; }
.pwa-connection p { margin: 4px 0 0; font-size: .8rem; }
.pwa-connection button { white-space: nowrap; flex-shrink: 0; }
.pwa-install-preview { display: flex; align-items: center; gap: 16px; margin: 12px 0 18px; }
.pwa-install-preview img { width: 64px; height: 64px; border-radius: 50%; object-fit: contain; }
.pwa-install-preview p { margin: 4px 0; }
@media (max-width: 560px) {
  .pwa-connection { align-items: flex-start; flex-direction: column; gap: 10px; }
}
@media (display-mode: standalone) and (max-width: 820px) {
  .page { padding-left: max(16px, env(safe-area-inset-left)); padding-right: max(16px, env(safe-area-inset-right)); }
}
/* The cached fallback contains only this layout, a logo and recovery instructions. */
.tarvi-app .voice-transcript-card,
.tarvi-app #live-transcript-toggle { display: none !important; }
.app-brand { background: none; border: 0; font-family: inherit; cursor: pointer; text-align: left; }
.app-brand:focus-visible { outline: 2px solid #8bdfeb; outline-offset: 4px; border-radius: 8px; }
.brand[hidden] { display: none; }
.pwa-offline {
  margin: 0; min-height: 100dvh; display: grid; place-items: center;
  background: #081725; color: #e6f8ff; font: 16px/1.6 system-ui, sans-serif;
}
.pwa-offline main { max-width: 440px; padding: 32px 24px; text-align: center; }
.pwa-offline img { width: 112px; height: 112px; border-radius: 50%; object-fit: contain; }
.pwa-offline h1 { font-size: 1.7rem; line-height: 1.25; margin: 24px 0 16px; }
.pwa-offline p { color: #b4ccd9; }
.pwa-offline a {
  display: inline-block; margin: 12px 0; padding: 10px 20px; border-radius: 10px;
  background: #8bdfeb; color: #081725; font-weight: 700; text-decoration: none;
}
.pwa-offline a:focus-visible { outline: 3px solid white; outline-offset: 4px; }
