/* F175 / F186: about headings, the get-the-app heading, and the how-it-works
   sample checklist stay on one line at phone width. Text stays at least 16px.
   These rules do not set letter-spacing below normal. Side padding is in px
   so a larger text size does not eat the line. */

@media (max-width: 760px) {
  html body main .col-narrow > .card.about-card,
  html body main .col-medium > .card {
    padding-left: 8px;
    padding-right: 8px;
  }
  html body main #tracker {
    padding-left: 8px;
    padding-right: 8px;
  }
  /* Same 16px floor the page title already uses, so a long translation stays
     one line. 1rem lets the text size setting grow it. */
  html body main .about-card > h2,
  html body main .col-medium > .card > h2 {
    font-size: max(1rem, 16px);
    line-height: 1.25;
  }
}

html body main #tracker .tracker-list label {
  align-items: center;
  gap: 8px;
  min-height: 44px;
}

/* The row is the 44px tap target. Keep the box at 24px so 200% text
   does not spend the line on a 48px checkbox. */
html body main #tracker .tracker-list input {
  width: 24px;
  height: 24px;
}

html body main #tracker .tracker-list label > span {
  letter-spacing: normal;
  line-height: 1.3;
  overflow-wrap: normal;
  word-break: normal;
  hyphens: manual;
}