@charset "UTF-8";
.has-top-page-navigation {
  --page-tint:var(--brand-tint);
  --page-accent:var(--brand-accent);
  --page-stroke:var(--line)
}
.course-menu-toggle.is-mac-safari .course-menu-label {
  transform:translateY(1px)
}
.course-menu-toggle {
  position:fixed;
  right:24px;
  bottom:calc(22px + env(safe-area-inset-bottom,0px));
  z-index:80;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  min-height:50px;
  max-width:calc(100vw - 32px);
  padding:11px 20px;
  border:1px solid var(--page-accent);
  border-radius:28px;
  background:var(--page-tint);
  color:var(--page-accent);
  box-shadow:0 4px 18px #37312f1c;
  font-size:14px;
  font-weight:500;
  line-height:1.6
}
.course-menu-icon {
  display:grid;
  gap:4px;
  width:19px;
  flex:0 0 19px
}
.course-menu-icon span {
  display:block;
  height:1px;
  background:currentColor
}
.has-course-navigation footer {
  padding-bottom:calc(96px + env(safe-area-inset-bottom,0px))
}
#course-menu-dialog {
  position:fixed;
  inset:0;
  margin:auto;
  width:min(620px,calc(100vw - 32px));
  max-width:none;
  height:fit-content;
  max-height:calc(100vh - 32px);
  max-height:calc(100dvh - 32px);
  padding:0;
  overflow:hidden;
  border:1px solid var(--page-stroke);
  border-radius:16px;
  background:#fff;
  box-shadow:0 24px 80px #37312f33
}
#course-menu-dialog[open] {
  display:flex;
  flex-direction:column
}
#course-menu-dialog::backdrop {
  background:#37312f80
}
.course-menu-heading {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:20px 24px;
  border-bottom:1px solid var(--page-stroke);
  background:var(--page-tint)
}
.course-menu-heading h2 {
  font-family:var(--serif);
  font-size:23px;
  line-height:1.5;
  font-weight:500
}
.course-menu-heading p {
  font-size:14px;
  line-height:1.6;
  margin-top:5px;
  color:var(--page-accent)
}
.course-menu-close {
  position:relative;
  appearance:none;
  -webkit-appearance:none;
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 0 44px;
  width:44px;
  height:44px;
  padding:0;
  border:1px solid var(--page-stroke);
  border-radius:50%;
  background:#fff;
  line-height:1
}
.course-menu-close::before,.course-menu-close::after {
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:20px;
  height:1px;
  background:currentColor;
  transform:translate(-50%,-50%) rotate(45deg)
}
.course-menu-close::after {
  transform:translate(-50%,-50%) rotate(-45deg)
}
.course-menu-close.is-pointer-focus:focus {
  outline:none
}
.course-menu-content {
  min-height:0;
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
  padding:20px 24px 24px
}
.course-menu-links {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px
}
.course-menu-links a {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  min-height:54px;
  padding:12px 14px;
  border:1px solid var(--page-stroke);
  border-radius:9px;
  font-size:15px;
  line-height:1.7;
  overflow-wrap:anywhere
}
.course-menu-links a[aria-current="location"] {
  border-color:var(--page-accent);
  background:var(--page-tint);
  color:var(--page-accent)
}
.course-menu-current {
  flex:0 0 auto;
  font-size:12px;
  white-space:nowrap
}
.course-menu-content h3 {
  font-size:14px;
  font-weight:500;
  line-height:1.7;
  margin:24px 0 12px;
  color:var(--page-accent)
}
.course-menu-links--secondary {
  grid-template-columns:minmax(0,1fr);
  gap:0
}
.course-menu-links--secondary a {
  border-width:0 0 1px;
  border-radius:0;
  min-height:48px;
  padding:12px 4px;
  font-size:14px
}
.course-menu-links a:focus-visible {
  outline-offset:-3px
}
@media(hover:hover) {
  .course-menu-toggle:hover,.course-menu-links a:hover {
    background:var(--page-tint);
    border-color:var(--page-accent)
  }
  .course-menu-toggle:hover {
    box-shadow:0 4px 20px #37312f30
  }
  .course-menu-close:hover {
    border-color:var(--page-accent)
  }
}
@media(max-width:640px) {
  .course-menu-toggle {
    right:16px;
    bottom:calc(14px + env(safe-area-inset-bottom,0px));
    min-height:48px;
    padding:10px 17px
  }
  .course-menu-heading {
    padding:16px 18px;
    gap:12px
  }
  .course-menu-heading h2 {
    font-size:21px
  }
  .course-menu-content {
    padding:16px 18px 22px
  }
  .course-menu-links {
    grid-template-columns:minmax(0,1fr)
  }
  .course-menu-links a {
    min-height:48px
  }
}