/* Fit complete mobile card headings without changing their wording or desktop layout. */
@media (max-width:700px) {
  body.readability-v50 #main #curriculum .syllabus-understand {
    --mobile-title-em:11.31;
    --mobile-category-em:6.80;
  }
  body.readability-v50 #main #curriculum .syllabus-use {
    --mobile-title-em:12.04;
    --mobile-category-em:8.74;
  }
  body.readability-v50 #main #curriculum .syllabus-create {
    --mobile-title-em:17.35;
    --mobile-category-em:11.89;
  }
  body.readability-v50 #main #curriculum .syllabus-connect {
    --mobile-title-em:13.95;
    --mobile-category-em:10.00;
  }
  body.readability-v50 #main #curriculum .learn-heading-v11 {
    container-type:inline-size;
    --mobile-title-cap:32px;
    --mobile-category-cap:17px;
  }
  /* Reserve space for the existing illustration, number badge and their gaps. */
  body.readability-v50 #main #curriculum .learn-category-v11 {
    font-size:min(var(--mobile-category-cap),calc((100cqi - 100px) / var(--mobile-category-em)));
    white-space:nowrap;
  }
  /* Measured font widths leave a little room for the italic overhang. */
  body.readability-v50 #main #curriculum .learn-card-v10 h3 {
    font-size:min(var(--mobile-title-cap),calc(96cqi / var(--mobile-title-em)));
    white-space:nowrap;
  }
  body.readability-v50 #main #curriculum .learn-card-v10 h3 em {
    display:inline;
    margin-top:0;
  }
}
@media (max-width:360px) {
  body.readability-v50 #main #curriculum .learn-heading-v11 {
    --mobile-title-cap:30px;
    --mobile-category-cap:16px;
  }
}