/* Map Coatza - mapa público */
*{box-sizing:border-box} html,body{margin:0;height:100%;overflow:hidden;font-family:system-ui,sans-serif;color:#1d3b3a}
#mapa{position:absolute;inset:0}
.arriba{position:absolute;top:0;left:0;right:0;padding:10px 10px 0;z-index:5;pointer-events:none}
.arriba > *{pointer-events:auto}
.buscador{display:flex;align-items:center;gap:8px;background:#fff;border:3px solid #1d3b3a;border-radius:16px;padding:6px 10px;box-shadow:3px 3px 0 #1d3b3a55}
.buscador input{flex:1;border:0;font-size:16px;padding:6px 2px;outline:none;min-width:0;font-family:inherit}
.buscador .logo{font-weight:800;font-size:15px;white-space:nowrap} .buscador .x{border:0;background:none;font-size:20px;display:none}
.chips{display:flex;gap:6px;overflow-x:auto;padding:8px 0 4px;scrollbar-width:none} .chips::-webkit-scrollbar{display:none}
.chip{flex:none;background:#fff;border:2px solid #1d3b3a;border-radius:20px;padding:5px 11px;font-size:13px;font-weight:700;cursor:pointer}
.chip.act{background:#1d3b3a;color:#fff}
.resultados{background:#fff;border:3px solid #1d3b3a;border-radius:14px;margin-top:6px;max-height:45vh;overflow:auto;display:none}
.res{display:flex;gap:10px;align-items:center;padding:10px 12px;border-bottom:1px solid #eee;cursor:pointer}
.res .ic{font-size:22px} .res small{color:#5b706e;display:block}
.abajo{position:absolute;left:0;right:0;bottom:0;padding:10px;display:flex;gap:8px;z-index:4}
.abajo a{flex:1;text-align:center;padding:12px;border:3px solid #1d3b3a;border-radius:14px;background:#fff;color:#1d3b3a;
 font-weight:800;text-decoration:none;box-shadow:3px 3px 0 #1d3b3a55}
.abajo a.prim{background:#2a9d8f;color:#fff}
.flotante{position:absolute;right:12px;bottom:84px;z-index:4;width:48px;height:48px;border-radius:50%;border:3px solid #1d3b3a;
 background:#fff;font-size:22px;box-shadow:3px 3px 0 #1d3b3a55}
/* Pines */
.pin{width:34px;height:42px;cursor:pointer} .pin.apagado{opacity:.25}
.pin .gota{width:30px;height:30px;margin:0 auto;border-radius:50% 50% 50% 0;transform:rotate(-45deg);border:2.5px solid #1d3b3a;
 display:grid;place-items:center;box-shadow:2px 2px 0 #1d3b3a44} .pin .gota > *{transform:rotate(45deg)}
.pin .gota span{font-size:16px;line-height:1} .pin .gota img{width:22px;height:22px;object-fit:contain}
.pin .num{position:absolute;top:-6px;right:-6px;background:#e76f51;color:#fff;border:2px solid #1d3b3a;border-radius:20px;font-size:11px;font-weight:800;padding:0 5px}
.yo{width:16px;height:16px;border-radius:50%;background:#3a86ff;border:3px solid #fff;box-shadow:0 0 0 6px #3a86ff44}
/* Tarjeta inferior */
.velo{position:absolute;inset:0;background:#0003;z-index:8;display:none}
.hoja{position:absolute;left:0;right:0;bottom:0;max-height:82vh;overflow:auto;background:#fff;border-top:3px solid #1d3b3a;
 border-radius:20px 20px 0 0;z-index:9;transform:translateY(105%);transition:transform .25s ease;padding-bottom:20px}
.hoja.abierta{transform:none} .hoja .agarre{width:46px;height:5px;background:#c9d6d4;border-radius:5px;margin:8px auto}
.hoja .foto{width:100%;height:190px;object-fit:cover;display:block} .hoja .cuerpo{padding:12px 16px}
.hoja h2{margin:0;font-size:21px} .hoja .sub{color:#5b706e;font-size:14px;margin-top:2px}
.estado{display:inline-block;font-size:12px;font-weight:800;padding:2px 8px;border-radius:20px;margin-left:4px}
.estado.si{background:#d8f5e0;color:#17693a} .estado.no{background:#fde2e2;color:#9b2c2c}
.like{border:2px solid #1d3b3a;background:#fff;border-radius:20px;padding:5px 12px;font-weight:800;font-size:15px;cursor:pointer}
.like.mio{background:#ffe1ea;border-color:#e05ea8}
.prods{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.prod{background:#eef4f3;border:0;border-radius:20px;padding:5px 10px;font-size:13px;cursor:pointer;font-family:inherit;color:#1d3b3a}
.prod.mio{background:#ffe1ea} .prod b{margin-left:4px;font-size:12px} .prod.hl{outline:2px solid #2a9d8f}
.botones{display:grid;gap:8px;margin-top:14px}
.boton{display:block;text-align:center;padding:13px;border:3px solid #1d3b3a;border-radius:14px;font-weight:800;font-size:16px;
 text-decoration:none;color:#1d3b3a;background:#fff;box-shadow:3px 3px 0 #1d3b3a55;cursor:pointer;font-family:inherit}
.boton.wa{background:#25d366;color:#fff;border-color:#128c4a} .boton.tienda{background:#ffd166}
.dos{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.lista-punto .res{border:2px solid #eee;border-radius:12px;margin-top:8px}
.cargando{position:absolute;inset:0;display:grid;place-items:center;background:#fbf3e4;z-index:20;font-weight:800;font-size:18px}
/* FIN app.css */
.pin.vacio{opacity:.6;transform-origin:bottom} .pin.vacio .gota{background:#f3efe6 !important;border-style:dashed}
.hoja .sinfoto{height:120px;display:grid;place-items:center;font-size:56px} .hoja .sinfoto img{width:72px;height:72px;object-fit:contain}
.sub img{width:18px;height:18px;object-fit:contain;vertical-align:middle} .chip img{width:16px;height:16px;vertical-align:middle}
/* Globito de pines agrupados */
.grupo{min-width:46px;height:46px;padding:0 8px;border-radius:24px;background:#fff;border:3px solid #1d3b3a;box-shadow:3px 3px 0 #1d3b3a55;
 display:flex;align-items:center;gap:4px;cursor:pointer;font-size:15px}
.grupo .iconos{display:flex} .grupo .iconos > *{font-size:15px;margin-right:-4px} .grupo .iconos img{width:18px;height:18px}
.grupo b{background:#e76f51;color:#fff;border-radius:12px;padding:0 6px;margin-left:6px}
/* Plan destacado: pin más grande que late */
.pin.destacado{width:44px;height:54px} .pin.destacado .gota{width:40px;height:40px;border-width:3px}
.pin.destacado .gota span{font-size:21px} .pin .gota img.logo{width:100%;height:100%;border-radius:50%;object-fit:cover}
.pin.destacado::before{content:'';position:absolute;left:50%;top:20px;width:40px;height:40px;margin:-20px 0 0 -20px;border-radius:50%;
 background:var(--latido);opacity:.55;animation:latido 1.6s ease-out infinite;z-index:-1}
@keyframes latido{0%{transform:scale(.8);opacity:.6}100%{transform:scale(2.4);opacity:0}}
@media (prefers-reduced-motion:reduce){.pin.destacado::before{animation:none;opacity:.35;transform:scale(1.4)}}
/* Botón de instalar app (en lugar de las categorías) */
.instalar{margin-top:8px;background:#ffd166;border:2px solid #1d3b3a;border-radius:20px;padding:7px 14px;font-weight:800;font-size:14px;
 box-shadow:2px 2px 0 #1d3b3a55;cursor:pointer;font-family:inherit;color:#1d3b3a}
.instalar[hidden]{display:none}
.flotante.ayuda{bottom:144px;display:grid;place-items:center;text-decoration:none;font-size:20px}
/* Reto: objetos escondidos */
.filaBotones{display:flex;gap:6px;flex-wrap:wrap;align-items:flex-start}
.retoBanner{margin-top:8px;background:#1d3b3a;color:#fff;border:2px solid #1d3b3a;border-radius:20px;padding:7px 14px;font-size:13px;
 box-shadow:2px 2px 0 #1d3b3a55;cursor:pointer;font-family:inherit;text-align:left;max-width:100%} .retoBanner[hidden]{display:none}
.tesoro{font-size:15px;width:20px;height:20px;display:grid;place-items:center;cursor:pointer;animation:brillo 2.4s ease-in-out infinite}
.tesoro img{width:18px;height:18px;object-fit:contain} .tesoro.tomando{opacity:.4}
@keyframes brillo{0%,100%{filter:drop-shadow(0 0 0 #fff0)}50%{filter:drop-shadow(0 0 4px #fff)}}
/* Capa Ciudad */
.flotante.ciudadBtn{bottom:204px} .flotante.ciudadBtn.act{background:#ffd166}
.aviso-ciudad{width:28px;height:28px;border-radius:50%;background:#fff;border:3px solid #c0392b;display:grid;place-items:center;font-size:15px;
 box-shadow:2px 2px 0 #1d3b3a44;cursor:pointer}
.barraCiudad{position:absolute;left:10px;right:70px;bottom:84px;z-index:5;background:#1d3b3a;color:#fff;border-radius:14px;padding:10px 12px;
 font-size:14px;font-weight:700;display:flex;flex-direction:column;gap:6px} .barraCiudad[hidden]{display:none}
.barraCiudad button{border:2px solid #1d3b3a;background:#ffd166;color:#1d3b3a;border-radius:10px;padding:8px 10px;font-weight:800;font-family:inherit;cursor:pointer;flex:1}
.cruz{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:44px;color:#c0392b;z-index:4;pointer-events:none;text-shadow:0 0 4px #fff}
.cruz[hidden]{display:none}
.likesRes{font-size:13px;font-weight:800;color:#c2185b;background:#ffe1ea;border-radius:20px;padding:3px 9px;white-space:nowrap}