/* "Get the app" banner (app-banner.js): Android phones only, hidden otherwise.
   Shared by the home pages and the post page /p/<uuid>; a file, not inline,
   so the CSP stays `style-src 'self'`. Same tokens as the site: paper, ink,
   purple, 1.4 border and hard shadow without blur. */
.app-banner {
  display: flex; align-items: center; gap: 10px;
  margin: 12px 16px 0; padding: 8px 6px 8px 10px;
  background: #fff; color: #131211;
  border: 1.4px solid #131211; border-radius: 14px;
  font-family: -apple-system, system-ui, "Segoe UI", sans-serif;
}
.app-banner[hidden] { display: none; }
.app-banner picture { flex: none; display: block; }
.app-banner img { flex: none; width: 40px; height: 40px; margin: 0; border: 0; border-radius: 10px; }
.app-banner-text { flex: 1; min-width: 0; }
.app-banner-text p { margin: 0; }
.app-banner-title { font-weight: 700; font-size: 15px; line-height: 1.2; }
.app-banner-store { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 11px; color: #666; }
.app-banner-get {
  flex: none; display: inline-flex; align-items: center; min-height: 36px; padding: 0 14px;
  background: #6c3bff; color: #fff; text-decoration: none; font-weight: 800; font-size: 13px;
  font-family: ui-monospace, Menlo, Consolas, monospace; text-transform: uppercase;
  border: 1.4px solid #131211; border-radius: 999px; box-shadow: 2px 2px 0 #131211;
}
.app-banner-get:active { transform: translate(1.5px, 1.5px); box-shadow: 0.5px 0.5px 0 #131211; }
.app-banner-close {
  flex: none; width: 44px; height: 44px; padding: 0; border: 0; background: none;
  color: #131211; font-size: 24px; line-height: 1; cursor: pointer;
}
.app-banner-get:focus-visible, .app-banner-close:focus-visible { outline: 3px solid #6c3bff; outline-offset: 2px; }