/* CSC398 and CSC545/645 follow the original course pages. */
.course-page .with-sidebar { grid-template-columns: 224px minmax(0, 1fr); gap: 20px; }
.course-page .with-sidebar aside a { font-size: 13.2px; padding: 10px 0; border-bottom: 1px dotted #ddd; }
.course-page .with-sidebar aside a[aria-current] { color: #0097a4; }
.course-page .with-sidebar aside a[aria-current]::before { content: '›'; margin-right: 9px; }
.course-page .prose a { color: #00646d; text-decoration: none; }
.course-page .prose a:hover { text-decoration: underline; }
.course-page .last-update { color: #f00; }
.course-page h2 { font-size: 16px; line-height: normal; margin: 15px 0; }
.course-page p { margin: 0 0 20px; }
.course-page .prose > h2:not(:first-of-type) { margin-top: 36px; }
.course-page .prose > h2:first-of-type { margin-top: 15px; }
.course-page .prose > p:first-child { margin-bottom: 15px; }
.course-page .prose > h2:first-of-type + p { margin-bottom: 0; }
.course-page .prose > h2:nth-of-type(2) { margin-top: 20px; }
.course-page .prose img { display: block; width: 100%; height: auto; }
.course-page .prose > ol:first-of-type { padding-left: 0; list-style-position: inside; }
.course-page .prose > ol:first-of-type li { margin: 0; }
.course-page code { font-family: 'Courier New', monospace; font-weight: bold; background: #c0c0c0; color: #000; padding: 1px 3px; overflow-wrap: anywhere; }
.course-page pre { white-space: pre-wrap; background: transparent !important; color: #000 !important; }
.course-page pre code { display: inline-block; }
@media (max-width: 768px) {
  .course-page .with-sidebar { grid-template-columns: 1fr; }
  .course-page .with-sidebar aside { display: flex; flex-wrap: wrap; gap: 6px 18px; }
  .course-page .masthead { min-height: 72px; padding: 20px 0; }
  .course-page .nav-list { flex-wrap: wrap; padding: 0; }
  .course-page .nav-item > a { padding: 10px; }
  .course-page .nav-item details summary { padding: 10px 5px; }
}

.course-page .ai-course-image { box-shadow: 1px 1px 5px #0003; }
.course-page .prose > .ai-course-image + h2 { margin-top: 40px; }