/* PB PWA */
:root {
  --pbpwa-color: #1f2937;
  --pbpwa-bg: #ffffff;
  --pbpwa-fg: #1f2937;
  --pbpwa-muted: #6b7280;
}
@media (prefers-color-scheme: dark) {
  :root { --pbpwa-bg: #1f2937; --pbpwa-fg: #f3f4f6; --pbpwa-muted: #9ca3af; }
}

.pbpwa-hidden { display: none !important; }

.pbpwa-banner {
  position: fixed;
  left: 50%;
  bottom: calc(12px + env(safe-area-inset-bottom, 0px));
  z-index: 99999;
  display: flex;
  align-items: center;
  gap: 12px;
  width: calc(100% - 24px);
  max-width: 460px;
  box-sizing: border-box;
  padding: 14px 40px 14px 14px;
  background: var(--pbpwa-bg);
  color: var(--pbpwa-fg);
  border-radius: 16px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .18), 0 2px 6px rgba(0, 0, 0, .08);
  font: 14px/1.4 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  transform: translate(-50%, 140%);
  opacity: 0;
  transition: transform .3s ease, opacity .3s ease;
}
.pbpwa-banner.pbpwa-show { transform: translate(-50%, 0); opacity: 1; }

.pbpwa-icon { width: 48px; height: 48px; border-radius: 12px; flex: 0 0 48px; object-fit: cover; }

.pbpwa-text { flex: 1 1 auto; min-width: 0; }
.pbpwa-text strong { display: block; font-size: 15px; margin-bottom: 2px; }
.pbpwa-text span { color: var(--pbpwa-muted); }

.pbpwa-share {
  display: inline-flex;
  vertical-align: middle;
  color: #007aff;
  padding: 0 2px;
}

.pbpwa-btn {
  flex: 0 0 auto;
  border: 0;
  border-radius: 999px;
  padding: 9px 18px;
  background: var(--pbpwa-color);
  color: #fff;
  font-weight: 600;
  font-size: 14px;
  cursor: pointer;
}
.pbpwa-btn:hover { filter: brightness(1.1); }

.pbpwa-close {
  position: absolute;
  top: 6px;
  right: 8px;
  width: 28px;
  height: 28px;
  border: 0;
  background: transparent;
  color: var(--pbpwa-muted);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}

[data-pbpwa-push][data-state="on"] { opacity: .85; }