/* =========================================================
   SACH — celulares (menos de 900 px)
   Va después de base.css y mapa.css para poder pisarlas.
   ========================================================= */

/* ---------- móvil ---------- */
@media (max-width:899px){
  .app{grid-template-columns:1fr;grid-template-rows:auto 1fr auto}
  .top{grid-row:1;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 18px;padding-top:calc(12px + var(--safe-t));border-bottom:1px solid var(--hair);background:var(--canvas)}
  .top-title,.top-sub{display:none}
  .top-date{margin:0;font-size:12.5px;color:var(--mute);font-weight:500;text-align:right}
  .panel,.mapwrap{grid-column:1;grid-row:2;min-height:0}
  .mapwrap{margin:0;border-radius:0}
  .tabs{grid-row:3;width:auto;max-width:none;margin:0;border-radius:0;background:rgba(253,252,252,.96);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-top:1px solid var(--hair);padding:4px 4px calc(4px + var(--safe-b));justify-content:space-around;z-index:700}
  .tab{flex:1;flex-direction:column;gap:3px;padding:6px 0;border-radius:14px;font-size:11px;font-weight:500;letter-spacing:0}
  .tab svg{display:block;width:21px;height:21px}
  .tab-map{display:flex!important}
  .tab[aria-current="page"]{background:none;box-shadow:none;color:var(--ink)}
  .tab[aria-current="page"] svg{stroke-width:2.1}
  .tab:not([aria-current="page"]){color:var(--faint)}
  .badge{position:absolute;top:2px;left:calc(50% + 5px);min-width:16px;height:16px;font-size:10px}
  body:not(.v-mapa) .mapwrap{display:none}
  body.v-mapa .panel{display:none}
  .view{padding:16px 18px 40px}
  h2.h{font-size:30px}
  .chips{margin:0 -18px;padding-left:18px;padding-right:18px}
  .barrio,.ag-day>h3{margin-left:-18px;margin-right:-18px;padding-left:18px;padding-right:18px}
  .d-num{font-size:72px}
  .d-name{font-size:30px}
  .map-tools{top:10px;left:10px;right:10px}
  .map-tools .days button{padding:7px 12px;font-size:13.5px}
  .map-tools .days .lg{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .map-tools .days .shl{display:inline}
  .map-tools .terr{margin:0 -10px;padding:0 10px;max-width:calc(100% + 20px)}
  .leaflet-control-zoom{display:none}
  .lay-pop{top:58px;left:10px;right:10px;width:auto;max-width:none}
  .tools-row .btn{padding:7px 11px}
  .tools-row .btn .lb{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .it-stop{grid-template-columns:50px 1fr;}
  .it-stop .ctl{grid-column:2;margin-left:-8px}
  .it-move{padding-left:62px}
  .map-card{left:10px;right:10px;bottom:10px;width:auto;max-height:calc(100% - 120px);overflow-y:auto;padding:16px}
  .people{columns:1}
}

@media (prefers-reduced-motion:reduce){
  .pd{animation:none}
  .pm{transition:none}
  .leaflet-zoom-anim .leaflet-zoom-animated{transition:none!important}
}
