/* ---------- Ajustes responsive globales ---------- */
@media (max-width: 600px){
  body{ margin:14px; font-size:16px; }
  h1,h2,h3{ font-size:1.15rem; }
  /* Grillas: 1 columna en móvil */
  .grid{ display:grid; grid-template-columns: 1fr !important; gap:12px; }
  /* Tablas anchas: scroll horizontal suave */
  .table-wrap{ overflow-x:auto; -webkit-overflow-scrolling: touch; }
  table{ min-width: 640px; } /* evita colapsar columnas */
  /* Controles táctiles */
  button, input, select { width:100%; padding:12px; font-size:16px; }
  .pill { width:100%; justify-content:center; }
  /* Tarjetas y barras */
  .card{ border-radius:14px; padding:14px; }
  .bar{ height:12px; }
  /* Toolbars / filas */
  .top, .row, .rows { flex-direction:column; align-items:stretch; gap:10px; }
  .who, .muted{ font-size:13px; }
  /* Modales */
  .overlay .modal{ margin:12% 12px; }
}