/* Let flex/grid children shrink to the viewport instead of their text's minimum width. */
.main, .content, .screen, .card, .two-col > *, .three-col > *, .metrics-grid > * { min-width: 0; }
.exercise-card-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.exercise-card-grid > *, .exercise-prescription > * { min-width: 0; overflow-wrap: anywhere; }
@media (max-width: 768px) {
  .exercise-card-grid { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .exercise-phase-heading { flex-wrap: wrap; }
  .exercise-phase-heading h2 { white-space: normal !important; flex-basis: 100%; line-height: 1.5; }
  .exercise-phase-video { flex-wrap: wrap; }
  .exercise-phase-video > a { min-height: 44px; display: inline-flex; align-items: center; }
  #screen-exercises button { min-height: 44px; }
  #screen-exercises { overflow-wrap: anywhere; }
  .screen input, .screen select, .screen textarea { max-width: 100%; }
  .screen img, .screen video { max-width: 100%; }
  .two-col, .three-col { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 480px) {
  .exercise-prescription { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  #postop-timeline-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
.athena-patient-panel { overflow-wrap: anywhere; }
.athena-patient-panel h2, .athena-patient-panel h3 { margin-bottom: 8px; }
.athena-patient-panel p { margin-bottom: 12px; line-height: 1.6; }
.athena-patient-panel button { min-height: 44px; white-space: normal; margin: 6px 8px 6px 0; }
.athena-patient-panel label { display: block; line-height: 1.6; margin-block: 14px; }
.athena-patient-panel input[type=checkbox] { margin-right: 8px; width: 20px; height: 20px; vertical-align: middle; }
.athena-connection + .athena-connection, .athena-appointment { border-top: 1px solid var(--border); padding-top: 16px; margin-top: 16px; }