/* App instalable del Club (pwa.js, 1-oct-2026): invitación a instalar, aviso sin conexión y avisos al celular. */
.pwa-instalar { position: fixed; z-index: 60; left: 12px; right: 12px; bottom: calc(env(safe-area-inset-bottom, 0px) + 12px); max-width: 520px; margin: 0 auto;
  display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; align-items: center; padding: 14px; background: #121212; color: #fff;
  border: 1px solid #2E312B; box-shadow: 0 10px 30px rgba(0, 0, 0, .35); }
.pwa-instalar b { display: block; font-size: 14px; font-weight: 800; }
.pwa-instalar span { display: block; font-size: 13px; line-height: 1.4; color: #D6D8D1; overflow-wrap: anywhere; }
.pwa-instalar svg, .avisos-cel svg { width: 16px; height: 16px; vertical-align: -3px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.pwa-instalar svg { stroke: #9AB47C; }
.pwa-acc { grid-column: 1 / -1; display: flex; gap: 8px; justify-content: flex-end; }
.pwa-acc button { border: 1px solid #9AB47C; background: #9AB47C; color: #121212; font: inherit; font-size: 12px; font-weight: 800; letter-spacing: .1em;
  text-transform: uppercase; padding: 10px 14px; cursor: pointer; }
.pwa-acc .pwa-no { background: transparent; border-color: #3A3D36; color: #fff; }
@media (prefers-reduced-motion: no-preference) { .pwa-instalar:not([hidden]) { animation: pwa-sube .35s ease-out; } }
@keyframes pwa-sube { from { transform: translateY(16px); opacity: 0; } to { transform: none; opacity: 1; } }

.pwa-red { position: sticky; top: 0; z-index: 55; display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: center; justify-content: center;
  padding: 10px 16px; background: #121212; color: #fff; font-size: 13px; font-weight: 600; text-align: center; }
.pwa-red button { border: 1px solid #9AB47C; background: #9AB47C; color: #121212; font: inherit; font-size: 12px; font-weight: 800; padding: 6px 12px; cursor: pointer; }

/* Sin conexión: fuera lo que necesita la red (fotos y preguntas de la gente del Club, subir fotos) */
body.sin-red #fotos, body.sin-red #pregs, body.sin-red .subir, body.sin-red #pregTexto, body.sin-red [data-preguntar], body.sin-red #campana { display: none !important; }

.avisos-cel { margin-top: 28px; padding: 18px; border: 1px solid var(--line, #E3E4DF); background: var(--smoke, #F3F3F3); max-width: 640px; }
.avisos-cel h3 { font-size: 15px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; margin: 0 0 6px; }
.avisos-cel p { margin: 0 0 12px; font-size: 14px; }
.avisos-cel .fine:empty { display: none; }