@media (max-width: 768px) {
  html, body { overflow-x: clip; max-width: 100vw; }
  .modal-dialog { margin: 0.5rem; max-width: calc(100vw - 1rem); width: auto !important; }
  .modal-content { max-height: min(92vh, var(--mobile-vh, 92vh)); overflow: hidden; display: flex; flex-direction: column; }
  .modal-body { overflow-y: auto; -webkit-overflow-scrolling: touch; }
  .modal-header .btn-close { width: 48px; height: 48px; padding: 0; margin: -0.25rem -0.5rem -0.25rem auto; opacity: 1; }
  .btn, .btn-modern, .modal-footer .btn { min-height: 48px; font-size: 16px !important; }
  input.form-control, textarea.form-control, select.form-select, .form-control, .form-select {
    width: 100% !important; max-width: 100%; font-size: 16px !important; min-height: 48px;
  }
}