html, body {
  overflow-x: hidden;
}

/* Touch targets: native form controls always respect min-height.
   Anchor tags only respect it once they're inline-flex, which is the
   convention already used by every button-styled <a> in this app. */
@media (max-width: 767px) {
  input:not([type="checkbox"]):not([type="radio"]),
  select,
  textarea,
  button,
  a[class*="inline-flex"] {
    min-height: 44px;
  }
}

/* Kanban board: one column visible at a time below 768px, driven by
   the segmented control in tasks.ejs. Desktop keeps all three flexed. */
.kanban-col {
  display: flex;
  flex-direction: column;
}

@media (max-width: 767px) {
  .kanban-col {
    display: none !important;
  }
  .kanban-col.is-active {
    display: flex !important;
  }
}