/* Quarto's Cosmo theme supplies the reference's Bootstrap / Source Sans Pro style. */
html { scroll-padding-top: 85px; }
body { font-size: 1.0625rem; }
.navbar { border-bottom: 1px solid #eeeeee; }
.navbar-title { font-size: 1.25rem; }
#title-block-header { margin-bottom: 2rem; }
h2 { margin-top: 2.6rem; }
h3 { margin-top: 2rem; }
.result-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; margin: 1.4rem 0; }
.result-grid.cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.result-grid.cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.result-grid figure { margin: 0; min-width: 0; }
.result-grid img { display: block; width: 100%; height: auto; }
.result-grid figcaption { text-align: center; font-size: .875rem; line-height: 1.35; color: #62676d; margin-top: .5rem; }
.figure-caption { font-size: .9rem; }
.prompt { margin: 1rem 0; font-size: 1rem; }
.result-grid a { display: block; }
.anagram-view img { transition: transform .6s ease; }
.anagram-view a { overflow: hidden; }
.rotate-result { display: block; margin: .8rem auto 1.5rem; background: #fff; color: #343a40; border: 1px solid #b4b8bd; border-radius: 3px; padding: .4rem .8rem; font: inherit; font-size: .875rem; }
.rotate-result:hover, .rotate-result:focus-visible { background: #f0f3f6; }
.anagram-view.is-rotated img { transform: rotate(180deg); }
.hybrid-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 2rem; margin: 1.5rem 0; }
.hybrid-grid figure { margin: 0; text-align: center; }
.hybrid-full { width: 100%; max-width: 360px; height: auto; }
.distant-frame { height: 360px; display: flex; align-items: center; justify-content: center; gap: 2rem; }
.distant-frame img { width: auto; max-width: none; height: auto; }
.hybrid-grid figcaption { font-size: .875rem; color: #62676d; line-height: 1.4; margin-top: .65rem; }
.distant-frame figure { margin: 0; }
.math.display { display: block; max-width: 100%; overflow-x: auto; }
mjx-container[display="true"] { max-width: 100%; overflow-x: auto; overflow-y: hidden; padding: .3rem 0; }
.figure-img { max-width: 100%; }
.velocity-original { width: 220px; max-width: 100%; margin: 1.5rem auto; text-align: center; }
.velocity-original figure { margin: 0; }
.velocity-original img { width: 100%; height: auto; display: block; }
.velocity-original figcaption { font-size: .875rem; color: #62676d; margin-top: .5rem; }
#visualizing-velocity .result-grid img { aspect-ratio: 1; height: auto; }
.error-scale { max-width: 600px; margin: 1.5rem auto; }
.error-scale img { width: 100%; height: 12px; display: block; }
.scale-ticks { display: flex; justify-content: space-between; font-size: .875rem; }
.error-scale p { text-align: center; font-size: .875rem; color: #62676d; margin-top: .3rem; }
/* Part B reuses Part A's typography, caption colors, and full-width figures. */
.mnist-figure, .course-figure { margin: 1.6rem 0 2rem; }
.mnist-figure > a, .course-figure > a { display: block; }
.mnist-figure img, .course-figure img { display: block; width: 100%; height: auto; }
.mnist-figure figcaption, .course-figure figcaption { text-align: center; font-size: .875rem; line-height: 1.45; color: #62676d; margin: .65rem auto 0; max-width: 720px; }
.course-figure { max-width: 760px; margin-left: auto; margin-right: auto; }
.fc-figure { max-width: 560px; }
#part-b { border-top: 1px solid #eeeeee; padding-top: 2.2rem; margin-top: 3.5rem; }
@media (max-width: 767px) {
  .result-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; }
  .result-grid.cols-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hybrid-grid { grid-template-columns: 1fr; gap: 1rem; }
  .distant-frame { height: 140px; }
  h1.title { font-size: 2rem; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  .anagram-view img { transition: none; }
}
@media print {
  @page { margin: 16mm; }
  body { font-size: 10pt; }
  #quarto-header, #quarto-margin-sidebar, #quarto-search-results, .rotate-result, .nav-footer { display: none !important; }
  #quarto-content { display: block !important; padding: 0 !important; }
  main.content { max-width: 100%; margin: 0; }
  h2, h3, h4 { break-after: avoid; }
  /* Keep bold subject labels and prompts with the grids they introduce. */
  p:has(+ .result-grid), p:has(+ .hybrid-grid), p:has(+ .prompt), .prompt { break-after: avoid; }
  figure, .result-grid, .hybrid-grid { break-inside: avoid; }
  .mnist-figure, .course-figure { max-width: 155mm; margin: 5mm auto; }
  .result-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .6rem; }
  .result-grid.cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .result-grid.cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .hybrid-grid { grid-template-columns: 1fr 1fr; }
  .distant-frame { height: 230px; }
  .anagram-view.is-rotated img { transform: none; }
  a { color: inherit; text-decoration: none; }
}