#map{display:none}#lmap{position:absolute;inset:0;z-index:0}.zb,.hint{z-index:1000}
.mk{width:22px;height:22px;border-radius:50%;border:3px solid #fff;box-shadow:0 2px 8px rgba(0,0,0,.45)}
.leaflet-popup-content-wrapper,.leaflet-popup-tip{background:var(--sf);color:var(--tx);border-radius:16px}
.leaflet-popup-content{margin:12px 14px;min-width:210px}.leaflet-popup-content .m{font-size:12.5px;color:var(--mu)}
.leaflet-popup-content button{padding:6px 10px;font-size:13px}
.lgb{margin-left:10px;background:var(--bg);border:1px solid var(--bd);color:var(--tx);border-radius:30px;padding:9px 16px;font-weight:700;box-shadow:none}
.leaflet-tooltip.ectip{background:var(--sf);color:var(--tx);border:0;border-radius:14px;box-shadow:0 8px 24px rgba(0,0,0,.28);padding:10px 12px;white-space:normal;width:220px}.leaflet-tooltip-top.ectip:before{border-top-color:var(--sf)}

/* ---------- Encabezado blanco (antes marrón) que se achica al bajar ---------- */
.hd{background:var(--sf);border-bottom:1px solid var(--bd);box-shadow:0 2px 12px rgba(0,0,0,.08)}
.hd .bn{color:var(--tx);transition:font-size .25s}.hd .bn b{color:#ea580c}.hd .bw small{color:var(--mu)}.hd .lk{color:var(--tx)}
.hd .auth .p{background:linear-gradient(135deg,#f97316,#ea580c);color:#fff}
.hd .seg{display:flex;width:fit-content;max-width:100%;background:var(--bg)}.hd .seg button{color:var(--tx)}.hd .seg button.on{background:#f97316;color:#fff}
.hd .nav button{background:var(--bg);border-color:var(--bd);color:var(--tx)}.hd .nav button.on{background:#f97316;border-color:#f97316;color:#fff}
.hd .bw small,.hd .seg{overflow:hidden;transition:max-height .25s ease,opacity .2s ease,margin .25s ease}
.hd .bw small{max-height:40px}.hd .seg,.hd .nav{max-height:150px}
.hd.mini{padding-top:6px;padding-bottom:6px}
.hd.mini .bw small,.hd.mini .seg,.hd.mini .nav{max-height:0;opacity:0;margin-top:0;margin-bottom:0;padding-top:0;padding-bottom:0}
.hd .brand svg{width:46px;height:46px;flex:none;transition:width .25s,height .25s}.fb svg{width:34px;height:34px;flex:none}
.hd.mini .bn{font-size:22px}.hd.mini .brand svg{width:32px;height:32px}
@media(max-width:700px){.hd .brand svg{width:38px;height:38px}.hd.mini .brand svg{width:30px;height:30px}}

/* ---------- Deportes con color ---------- */
#chips{padding-bottom:10px}
#chips button[data-s]:not([data-s=""]){display:inline-flex;align-items:center;gap:6px;border:1.5px solid var(--cc);background:var(--sf);color:var(--tx);font-weight:600}
#chips button[data-s]:not([data-s=""])::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--cc);flex:none}
#chips button[data-s]:not([data-s=""]).on{background:var(--cc);color:#fff;border-color:var(--cc);box-shadow:0 3px 10px rgba(0,0,0,.2)}
#chips button[data-s]:not([data-s=""]).on::before{background:#fff}
@media(min-width:900px){#chips{flex-wrap:wrap;max-height:118px;overflow-y:auto;overflow-x:hidden}}

/* ---------- Marcador "Vos" ---------- */
.me{position:relative;width:48px;height:48px;display:flex;flex-direction:column;align-items:center;pointer-events:none}
.me b{background:#1e88e5;color:#fff;font:800 12px/1 system-ui,sans-serif;padding:4px 9px;border-radius:12px;border:2px solid #fff;box-shadow:0 2px 8px rgba(0,0,0,.35)}
.me i{display:block;margin-top:6px;width:18px;height:18px;border-radius:50%;background:#1e88e5;border:3px solid #fff;box-shadow:0 0 0 0 rgba(30,136,229,.6);animation:mep 1.8s infinite}
@keyframes mep{70%{box-shadow:0 0 0 16px rgba(30,136,229,0)}100%{box-shadow:0 0 0 0 rgba(30,136,229,0)}}
@media(max-width:700px){.hd.mini .brand{flex-wrap:nowrap}.hd.mini .auth .lgb{display:none}.hd.mini .auth .p{padding:7px 12px;font-size:13px}}

/* evita que el navegador reacomode el scroll al achicarse el encabezado (causaba el sube y baja) */
html,body{overflow-anchor:none}

.legal h3{font-size:15px;margin:16px 0 4px}.legal p,.legal li{font-size:13.5px;line-height:1.55;color:var(--mu)}.legal ul{padding-left:20px;margin:6px 0}.legal b,.legal strong{color:var(--tx)}

/* pestañas: se pueden deslizar a los costados en el celular */
.hd .nav{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;scrollbar-width:none;touch-action:pan-x pan-y;transition:max-height .25s ease,opacity .2s ease,margin .25s ease}
.hd .nav::-webkit-scrollbar{display:none}.hd .nav button{flex:none}
.hd .seg button{flex:none}

/* ---------- Celular v1: menos saturación ---------- */
.mm{display:none}
#chips button.hid{display:none}#chips.all button.hid{display:inline-flex}
#chips .more{display:inline-flex;align-items:center;border:1.5px dashed var(--mu);background:var(--sf);color:var(--tx);font-weight:700}
#chips.all{flex-wrap:wrap;overflow:visible;max-height:none}
#geo,#setme{font-size:0!important;width:44px;height:44px;min-height:44px;padding:0!important;display:flex;align-items:center;justify-content:center}
#geo::before{content:"📍";font-size:20px}#setme::before{content:"🎯";font-size:20px}
@media(max-width:700px){
  /* encabezado mínimo */
  .hd .bw small{display:none}
  #auth>button:not(.ac){display:none}
  .mm{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;padding:0;border-radius:12px;background:var(--bg);border:1px solid var(--bd);color:var(--tx);font-size:20px;box-shadow:none;flex:none}
  .hd .brand{flex-wrap:nowrap;align-items:center;gap:8px}
  .hd .brand .bl{flex:1;min-width:0}
  .hd .bn{font-size:22px}
  .hd .seg{margin-top:8px}.hd .seg button{padding:7px 14px;font-size:13px;min-height:34px}
  .hd .nav{margin-top:8px}.hd .nav button{padding:6px 12px;font-size:13px;min-height:36px}
  .mlist{display:grid;gap:8px;margin-top:10px}.mlist .mi{width:100%;text-align:left;padding:13px 14px;font-size:15px;border-radius:14px}
  /* deportes: 8 + "Más" */
  #chips button.hid{display:none}
  #chips.all button.hid{display:inline-flex}
  #chips .more{display:inline-flex;align-items:center;border:1.5px dashed var(--mu);background:var(--sf);color:var(--tx);font-weight:700}
  #chips.all{flex-wrap:wrap;overflow:visible;max-height:none}
  /* "Para vos": carrusel compacto */
  #promo{padding:0 12px 6px}
  #promo .ph{margin:2px 0 6px}#promo .ph .m{display:none}#promo .ph>div b{font-size:14px}
  #promo .ph button{padding:5px 12px;font-size:12px;min-height:0}
  .pst2{display:flex;overflow-x:auto;gap:8px;scrollbar-width:none}.pst2::-webkit-scrollbar{display:none}
  .pst2 .pm{flex:0 0 150px;padding:9px 10px;gap:3px;border-radius:14px}
  .pm b{font-size:13px}.pm small{font-size:11px}.pm .wy{display:none}.pm .pb{font-size:9.5px;padding:2px 7px}
  .pst2 .pm:nth-child(n+7){display:none}
}

/* ---------- Celular v2: app completa ---------- */
@media(max-width:700px){
  :root{--nh:62px;--peek:58px;--sab:env(safe-area-inset-bottom,0px)}
  body.mob{padding-bottom:calc(var(--nh) + var(--sab))}
  body.mapview{position:fixed;inset:0;width:100%;overflow:hidden;padding-bottom:0}
  body.mapview .note,body.mapview .ft{display:none}
  /* menú inferior */
  body.mob .hd .nav{position:fixed;left:0;right:0;bottom:0;z-index:1150;margin:0;max-height:none;opacity:1;overflow:visible;gap:2px;padding:6px 6px calc(6px + var(--sab));background:var(--sf);border-top:1px solid var(--bd);box-shadow:0 -4px 16px rgba(0,0,0,.1)}
  body.mob .hd.mini .nav{max-height:none;opacity:1;margin:0;padding:6px 6px calc(6px + var(--sab))}
  body.mob .hd .nav button{flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:4px 2px;min-height:50px;border:0;background:transparent;border-radius:12px;font-size:11px;font-weight:600;line-height:1.1;color:var(--mu);white-space:normal;text-align:center;box-shadow:none}
  body.mob .hd .nav button.on{color:#ea580c;background:rgba(249,115,22,.13)}
  body.mob .hd .nav .ni{font-size:20px;line-height:1}
  /* mapa casi a pantalla completa */
  body.mapview .mapw{position:fixed!important;top:var(--hh,100px)!important;left:0!important;right:0!important;bottom:calc(var(--nh) + var(--peek) + var(--sab))!important;height:auto!important;min-height:0!important;width:auto!important;margin:0!important;border-radius:0!important}
  body.mapview .zb{top:112px!important}
  #geo,#setme{font-size:0!important;width:44px;height:44px;min-height:44px;padding:0!important;display:flex;align-items:center;justify-content:center}
  #geo::before{content:"📍";font-size:20px}#setme::before{content:"🎯";font-size:20px}
  #add{display:none!important}
  /* buscador y deportes flotando sobre el mapa */
  #ovl{position:absolute;top:8px;left:8px;right:8px;z-index:1000;pointer-events:none}
  #ovl #bar,#ovl #chips{pointer-events:auto}
  #ovl #bar{display:flex;padding:0;margin:0;background:none;border:0;box-shadow:none}
  #ovl #q{flex:1;width:100%;height:46px;border:0;border-radius:26px;padding:0 18px;font-size:15px;background:var(--sf);color:var(--tx);box-shadow:0 4px 14px rgba(0,0,0,.25)}
  #ovl #chips{display:flex;flex-wrap:nowrap;overflow-x:auto;gap:6px;margin:8px 0 0;padding:2px 2px 8px;scrollbar-width:none}
  #ovl #chips::-webkit-scrollbar{display:none}
  #ovl #chips button{flex:none;box-shadow:0 2px 8px rgba(0,0,0,.2)}
  #ovl #chips.all{flex-wrap:wrap;overflow-y:auto;max-height:46vh;background:var(--sf);border-radius:18px;padding:10px;box-shadow:0 6px 20px rgba(0,0,0,.3)}
  #ovl #chips.all button{box-shadow:none}
  /* panel de resultados que se desliza */
  #sheet{position:fixed;left:0;right:0;bottom:calc(var(--nh) + var(--sab));height:66vh;z-index:1120;background:var(--sf);border-radius:22px 22px 0 0;box-shadow:0 -6px 24px rgba(0,0,0,.22);transform:translateY(calc(100% - var(--peek)));transition:transform .28s ease;display:flex;flex-direction:column}
  #sheet.open{transform:translateY(0)}
  .shh{height:var(--peek);flex:none;width:100%;border:0;background:transparent;border-radius:22px 22px 0 0;box-shadow:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;color:var(--tx);font-weight:700;font-size:14px;touch-action:none}
  .shh i{display:block;width:44px;height:5px;border-radius:3px;background:var(--bd,#cbd5e1)}
  #shb{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:0 12px 16px}
  #shb #side{width:auto;max-width:none;margin:0;padding:0}
  #shb #promo{padding:0 0 8px}
}
@media(max-width:700px){body.mob .hd{z-index:1150}}
@media(max-width:700px){#sheet{display:none}body.mapview #sheet{display:flex}}

/* ---------- Clases Plus más marcadas en el mapa ---------- */
.mk.pl{display:flex;align-items:center;justify-content:center;border-color:#fff;box-shadow:0 2px 8px rgba(0,0,0,.45)}
.mk.pl b{color:#fff;font-size:12px;line-height:1;text-shadow:0 1px 2px rgba(0,0,0,.55)}
.leaflet-popup-content .timg{width:100%;height:90px;object-fit:cover;border-radius:10px;margin:0 0 6px}
.ecpop .leaflet-popup-content{min-width:200px}
@media(max-width:700px){
  /* novedades de nuevo arriba, con tarjetas chicas */
  body.mapview #promo{position:fixed;top:var(--hh,100px);left:0;right:0;z-index:1000;background:var(--bg,#f4f6f0);padding:6px 10px;box-shadow:0 2px 8px rgba(0,0,0,.1)}
  body.mapview .mapw{top:calc(var(--hh,100px) + var(--ph,0px))!important}
  #promo .ph{margin:0 0 5px}#promo .ph>div b{font-size:12.5px}
  .pst2 .pm{flex:0 0 136px;padding:7px 9px;gap:2px;border-radius:12px}
  .pm b{font-size:12px;line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .pm small{display:none}.pm .pb{font-size:9px;padding:1px 6px}
  /* deja lugar si hay un logo flotante ajeno abajo a la derecha */
  body.fgn.mob .hd .nav{padding-right:70px}
}

/* ---------- Computadora: más simple y ordenada ---------- */
@media(min-width:701px){
  .hd{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px}
  .hd .brand{flex:0 0 100%}
  .hd .seg{margin:0}.hd .nav{flex:1;min-width:0;margin:0}
  .hd.mini{gap:0}
  .pst2{display:flex!important;flex-wrap:nowrap;overflow-x:auto;gap:12px;padding-bottom:6px;scrollbar-width:thin}
  .pst2 .pm{flex:0 0 250px;padding:10px 12px}
  .pst2 .pm:nth-child(n+7){display:none}
}
/* deportes: solo 8 visibles + "Más" (con mayor prioridad que los estilos de color) */
#chips button[data-s].hid{display:none!important}
#chips.all button[data-s].hid{display:inline-flex!important}

/* ---------- Pin para elegir el lugar de la clase ---------- */
.fpin{display:flex;flex-direction:column;align-items:center;gap:2px;pointer-events:auto;cursor:grab;filter:drop-shadow(0 3px 5px rgba(0,0,0,.4))}
.fpin b{background:#e53935;color:#fff;font:800 11px/1 system-ui,sans-serif;padding:4px 8px;border-radius:10px;border:2px solid #fff;white-space:nowrap}
/* ---------- Fotos de la clase ---------- */
.pgal{display:flex;gap:8px;flex-wrap:wrap;margin:4px 0 6px}.pgal .pa2{position:relative}
.pgal .pa2 button{position:absolute;top:-7px;right:-7px;width:22px;height:22px;min-height:0;padding:0;border-radius:50%;font-size:11px;line-height:1;background:#e53935;color:#fff;border:2px solid #fff}
.gal{display:flex;gap:8px;overflow-x:auto;scroll-snap-type:x mandatory;margin:8px 0 2px;scrollbar-width:thin}
.gal img{flex:0 0 78%;height:170px;object-fit:cover;border-radius:12px;scroll-snap-align:start;cursor:zoom-in}
.cimg{height:170px;cursor:zoom-in}
.card.flash{animation:cflash 1.5s ease}@keyframes cflash{0%,100%{box-shadow:0 4px 14px rgba(0,0,0,.08)}30%{box-shadow:0 0 0 4px rgba(249,115,22,.6),0 6px 20px rgba(0,0,0,.15)}}
@media(max-width:700px){#shb #side{max-height:none!important;overflow:visible!important}}
/* ---------- Computadora: "Busco / Soy profe" en la otra esquina ---------- */
@media(min-width:701px){.hd .nav{order:2}.hd .seg{order:3;margin-left:auto}}

/* ---------- Celular: sin tarjetas de novedades sobre el mapa (quedan en la pestaña Novedades) ---------- */
@media(max-width:700px){#promo{display:none!important}}
/* campos de archivo que no se pasen del ancho de la pantalla */
input[type=file]{max-width:100%;width:100%!important;font-size:13px}

/* ---------- Botón de comentarios (computadora) ---------- */
.fbk{position:fixed;left:16px;bottom:16px;z-index:900;background:var(--sf);color:var(--tx);border:1px solid var(--bd);border-radius:24px;padding:10px 16px;font-weight:700;font-size:13.5px;text-decoration:none;box-shadow:0 4px 14px rgba(0,0,0,.18)}
.fbk:hover{border-color:#f97316;color:#ea580c}
@media(max-width:700px){.fbk{display:none}}