/* Tabletas y pantallas anchas (≥ 700 px). En celular no aplica nada de este archivo.
   La horizontal y el escritorio usan la misma columna centrada. */

@media (min-width: 700px) {
  .app {
    max-width: 760px;
    border-left: 1px solid var(--line);
    border-right: 1px solid var(--line);
  }
  .nav {
    width: min(760px, 100%);
  }
  .top {
    padding: 22px 28px 14px;
  }
  .content {
    padding: 24px 28px;
  }

  /* Formularios como ventana centrada en lugar de hoja inferior */
  .modal {
    place-items: center;
    padding: 24px;
  }
  .sheet {
    border-radius: 24px;
    max-height: 85dvh;
    padding: 24px 24px 28px;
    box-shadow: 0 20px 60px #0003;
  }

  /* Más aire en tarjetas y gráfica, que ahora tienen más ancho */
  .quick button {
    min-height: 110px;
    font-size: 13px;
  }
  .column {
    height: 110px;
  }
  .monthLabel {
    font-size: 11px;
  }
  .toast {
    bottom: 96px;
  }
}