/* r174: content-led quiz directory, loaded after the shared student theme. */
body.student-page #reviewPanel,
body.student-page #reviewPanel button {
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "PingFang SC", "Microsoft YaHei", sans-serif !important;
}

body.student-page #reviewPanel.active-mobile-panel,
body.student-page #reviewPanel .review-list,
body.student-page #reviewPanel .output-mode-chooser,
body.student-page #reviewPanel .output-mode-choice-grid,
body.student-page #reviewPanel .output-directory-intro,
body.student-page #reviewPanel .output-course-directory-list,
body.student-page #reviewPanel .output-course-body,
body.student-page #reviewPanel .output-chapter-body,
body.student-page #reviewPanel .output-topic-quiz-list {
  align-content: start !important;
  align-items: start !important;
  grid-auto-rows: max-content !important;
}

body.student-page #reviewPanel.active-mobile-panel {
  padding: 12px 8px calc(82px + env(safe-area-inset-bottom, 0px)) !important;
}

body.student-page #reviewPanel .review-list {
  width: 100% !important;
  gap: 14px !important;
}

body.student-page #reviewPanel .review-list > * {
  align-self: start !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

body.student-page #reviewPanel .output-mode-chooser {
  gap: 18px !important;
  padding: 10px 2px 0 !important;
}

body.student-page #reviewPanel .output-mode-chooser-head {
  gap: 7px !important;
  padding: 0 2px !important;
}

body.student-page #reviewPanel .output-mode-chooser-head > span {
  color: var(--forest-orange-deep, #b86b08) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
}

body.student-page #reviewPanel .output-mode-chooser-head > strong {
  color: var(--forest-ink, #3b2012) !important;
  font-size: 25px !important;
  font-weight: 800 !important;
  line-height: 1.24 !important;
  letter-spacing: -0.02em !important;
}

body.student-page #reviewPanel .output-mode-chooser-head > p {
  max-width: 34em !important;
  margin: 0 !important;
  color: var(--forest-muted, #8a7562) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.55 !important;
}

body.student-page #reviewPanel .output-mode-choice-grid {
  width: 100% !important;
  gap: 10px !important;
}

body.student-page #reviewPanel .output-mode-choice,
body.student-page #reviewPanel .output-mode-choice.knowledge,
body.student-page #reviewPanel .output-mode-choice.chapter {
  grid-template-columns: 54px minmax(0, 1fr) auto !important;
  grid-template-rows: auto auto auto !important;
  gap: 5px 12px !important;
  align-items: center !important;
  align-content: center !important;
  width: 100% !important;
  min-height: 118px !important;
  border: 1px solid rgba(208, 178, 129, 0.24) !important;
  border-radius: 22px !important;
  padding: 16px 18px !important;
  background: rgba(254, 253, 248, 0.98) !important;
  color: var(--forest-ink, #3b2012) !important;
  text-align: left !important;
  box-shadow: 0 7px 20px rgba(129, 91, 37, 0.065) !important;
  box-sizing: border-box !important;
}

body.student-page #reviewPanel .output-mode-choice:active {
  transform: translateY(1px) !important;
}

body.student-page #reviewPanel .output-mode-choice > img {
  grid-column: 1 !important;
  grid-row: 1 / 4 !important;
  align-self: center !important;
  width: 50px !important;
  height: 50px !important;
  border-radius: 15px !important;
  object-fit: cover !important;
}

body.student-page #reviewPanel .output-mode-choice em {
  grid-column: 2 / -1 !important;
  padding: 0 !important;
  color: var(--forest-orange-deep, #b86b08) !important;
  font-size: 11px !important;
  font-style: normal !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
}

body.student-page #reviewPanel .output-mode-choice strong {
  grid-column: 2 !important;
  min-width: 0 !important;
  color: var(--forest-ink, #3b2012) !important;
  font-size: 19px !important;
  font-weight: 750 !important;
  line-height: 1.3 !important;
}

body.student-page #reviewPanel .output-mode-choice span {
  grid-column: 3 !important;
  justify-self: end !important;
  color: var(--forest-muted, #8a7562) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
}

body.student-page #reviewPanel .output-mode-choice small {
  grid-column: 2 / -1 !important;
  color: var(--forest-muted, #8a7562) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.45 !important;
}

body.student-page #reviewPanel .output-directory-intro {
  gap: 8px !important;
  margin: 0 !important;
  border: 1px solid rgba(208, 178, 129, 0.2) !important;
  border-radius: 24px !important;
  padding: 14px 16px 16px !important;
  background: linear-gradient(145deg, #fffdf8 0%, #fff4d9 100%) !important;
  color: var(--forest-ink, #3b2012) !important;
  box-shadow: 0 8px 22px rgba(129, 91, 37, 0.07) !important;
  box-sizing: border-box !important;
}

body.student-page #reviewPanel .output-section-back {
  justify-self: start !important;
  min-height: 44px !important;
  margin: -7px 0 -3px !important;
  border: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  color: var(--forest-orange-deep, #b86b08) !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  box-shadow: none !important;
}

body.student-page #reviewPanel .output-quiz-view-tabs {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  width: 100% !important;
  gap: 4px !important;
  margin: 0 0 3px !important;
  border: 1px solid rgba(208, 178, 129, 0.16) !important;
  border-radius: 17px !important;
  padding: 4px !important;
  background: rgba(247, 232, 196, 0.72) !important;
  box-sizing: border-box !important;
}

body.student-page #reviewPanel .output-quiz-view-tabs button {
  min-height: 44px !important;
  border: 0 !important;
  border-radius: 13px !important;
  background: transparent !important;
  color: #7f6a54 !important;
  font-size: 14px !important;
  font-weight: 650 !important;
  box-shadow: none !important;
}

body.student-page #reviewPanel .output-quiz-view-tabs button.active {
  background: #fffdf8 !important;
  color: var(--forest-ink, #3b2012) !important;
  box-shadow: 0 3px 10px rgba(129, 91, 37, 0.07) !important;
}

body.student-page #reviewPanel .output-quiz-view-tabs button span {
  display: inline-grid !important;
  place-items: center !important;
  min-width: 18px !important;
  height: 18px !important;
  margin-left: 3px !important;
  border-radius: 999px !important;
  padding: 0 4px !important;
  background: #df715e !important;
  color: #fff !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  box-sizing: border-box !important;
}

body.student-page #reviewPanel .output-directory-intro > span {
  margin-top: 2px !important;
  color: #8e7b68 !important;
  font-size: 12px !important;
  font-weight: 550 !important;
  line-height: 1.4 !important;
}

body.student-page #reviewPanel .output-directory-intro > strong {
  color: var(--forest-ink, #3b2012) !important;
  font-size: 23px !important;
  font-weight: 800 !important;
  line-height: 1.32 !important;
  letter-spacing: -0.025em !important;
}

body.student-page #reviewPanel .output-directory-intro > p {
  margin: 0 !important;
  color: var(--forest-muted, #8a7562) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.55 !important;
}

body.student-page #reviewPanel .output-continue-button {
  width: 100% !important;
  min-height: 50px !important;
  margin-top: 6px !important;
  border: 0 !important;
  border-radius: 16px !important;
  background: linear-gradient(135deg, #f4b43c, #efa72b) !important;
  color: #4a2b14 !important;
  font-size: 16px !important;
  font-weight: 750 !important;
  box-shadow: 0 7px 16px rgba(205, 133, 20, 0.13) !important;
}

body.student-page #reviewPanel .output-course-directory-list {
  display: grid !important;
  width: 100% !important;
  gap: 10px !important;
}

body.student-page #reviewPanel .output-course-directory,
body.student-page #reviewPanel .output-chapter-directory {
  align-self: start !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  border: 1px solid rgba(208, 178, 129, 0.19) !important;
  background: rgba(254, 253, 248, 0.98) !important;
  color: var(--forest-ink, #3b2012) !important;
  box-sizing: border-box !important;
}

body.student-page #reviewPanel .output-course-directory {
  overflow: hidden !important;
  border-radius: 22px !important;
  box-shadow: 0 6px 18px rgba(129, 91, 37, 0.055) !important;
}

body.student-page #reviewPanel .output-course-directory[open] {
  border-color: rgba(239, 167, 43, 0.32) !important;
}

body.student-page #reviewPanel .output-course-directory > summary,
body.student-page #reviewPanel .output-chapter-directory > summary {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  width: 100% !important;
  min-height: 58px !important;
  gap: 8px !important;
  padding: 9px 15px !important;
  color: var(--forest-ink, #3b2012) !important;
  cursor: pointer !important;
  list-style: none !important;
  box-sizing: border-box !important;
}

body.student-page #reviewPanel .output-course-directory > summary::-webkit-details-marker,
body.student-page #reviewPanel .output-chapter-directory > summary::-webkit-details-marker {
  display: none !important;
}

body.student-page #reviewPanel .output-course-directory > summary strong,
body.student-page #reviewPanel .output-chapter-directory > summary strong {
  min-width: 0 !important;
  color: var(--forest-ink, #3b2012) !important;
  font-size: 16px !important;
  font-weight: 750 !important;
  line-height: 1.35 !important;
  overflow-wrap: anywhere !important;
}

body.student-page #reviewPanel .output-course-directory > summary strong::before,
body.student-page #reviewPanel .output-chapter-directory > summary strong::before {
  margin-right: 8px !important;
  color: var(--forest-orange-deep, #b86b08) !important;
  font-size: 12px !important;
}

body.student-page #reviewPanel .output-course-directory > summary span,
body.student-page #reviewPanel .output-chapter-directory > summary span {
  color: #94816d !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  text-align: right !important;
  white-space: nowrap !important;
}

body.student-page #reviewPanel .output-course-directory > summary:focus-visible,
body.student-page #reviewPanel .output-chapter-directory > summary:focus-visible {
  outline: 3px solid rgba(239, 167, 43, 0.28) !important;
  outline-offset: -3px !important;
}

body.student-page #reviewPanel .output-course-body {
  display: grid !important;
  gap: 8px !important;
  border-top: 1px solid rgba(208, 178, 129, 0.16) !important;
  padding: 8px !important;
  background: #fffaf0 !important;
}

body.student-page #reviewPanel .output-chapter-directory {
  overflow: hidden !important;
  border-radius: 17px !important;
  background: rgba(255, 253, 248, 0.92) !important;
  box-shadow: none !important;
}

body.student-page #reviewPanel .output-chapter-directory > summary {
  min-height: 54px !important;
  padding: 8px 12px !important;
}

body.student-page #reviewPanel .output-chapter-directory > summary strong {
  font-size: 15px !important;
  font-weight: 700 !important;
}

body.student-page #reviewPanel .output-chapter-directory[open] > summary {
  background: #fff5dc !important;
}

body.student-page #reviewPanel .output-chapter-body {
  display: grid !important;
  gap: 9px !important;
  padding: 4px 10px 10px !important;
}

body.student-page #reviewPanel .output-topic-folder {
  display: grid !important;
  gap: 7px !important;
  margin: 0 0 0 7px !important;
  border: 0 !important;
  border-left: 2px solid rgba(239, 167, 43, 0.38) !important;
  padding: 2px 0 7px 10px !important;
}

body.student-page #reviewPanel .output-topic-folder-head {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  min-height: 40px !important;
  gap: 10px !important;
  padding: 5px 2px !important;
}

body.student-page #reviewPanel .output-topic-folder-head > span {
  display: none !important;
}

body.student-page #reviewPanel .output-topic-folder-head strong {
  min-width: 0 !important;
  color: #49301e !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.42 !important;
  overflow-wrap: anywhere !important;
}

body.student-page #reviewPanel .output-topic-folder-head em {
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  color: #9b8772 !important;
  font-size: 11px !important;
  font-style: normal !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
}

body.student-page #reviewPanel .output-topic-quiz-list {
  display: grid !important;
  width: 100% !important;
  gap: 7px !important;
}

body.student-page #reviewPanel .output-quiz-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  width: 100% !important;
  min-height: 66px !important;
  gap: 10px !important;
  border: 1px solid rgba(208, 178, 129, 0.17) !important;
  border-radius: 15px !important;
  padding: 10px 12px !important;
  background: #fffdf8 !important;
  color: var(--forest-ink, #3b2012) !important;
  text-align: left !important;
  box-shadow: 0 3px 10px rgba(129, 91, 37, 0.035) !important;
  box-sizing: border-box !important;
}

body.student-page #reviewPanel .output-quiz-row > span {
  display: grid !important;
  min-width: 0 !important;
  gap: 3px !important;
}

body.student-page #reviewPanel .output-quiz-row strong {
  color: var(--forest-ink, #3b2012) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  overflow-wrap: anywhere !important;
}

body.student-page #reviewPanel .output-quiz-row small {
  color: var(--forest-muted, #8a7562) !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
  overflow-wrap: anywhere !important;
}

body.student-page #reviewPanel .output-quiz-row em {
  color: var(--forest-orange-deep, #b86b08) !important;
  font-size: 11px !important;
  font-style: normal !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
}

@media (max-width: 1180px) {
  body.student-page .mobile-study-nav:not(.knowledge-module-dock) {
    min-height: calc(64px + env(safe-area-inset-bottom, 0px)) !important;
    border: 0 !important;
    border-top: 1px solid rgba(208, 178, 129, 0.18) !important;
    border-radius: 24px 24px 0 0 !important;
    padding: 7px 8px calc(6px + env(safe-area-inset-bottom, 0px)) !important;
    background: rgba(254, 253, 248, 0.985) !important;
    box-shadow: 0 -6px 20px rgba(129, 91, 37, 0.065) !important;
    overflow: visible !important;
  }

  body.student-page .mobile-study-nav:not(.knowledge-module-dock) button:not(.mobile-nav-refresh) {
    position: relative !important;
    min-height: 50px !important;
    border: 0 !important;
    border-radius: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    color: #9b8772 !important;
    box-shadow: none !important;
  }

  body.student-page .mobile-study-nav:not(.knowledge-module-dock) button:not(.mobile-nav-refresh)::after {
    position: absolute !important;
    right: 31% !important;
    bottom: 0 !important;
    left: 31% !important;
    height: 3px !important;
    border-radius: 999px !important;
    background: transparent !important;
    content: "" !important;
  }

  body.student-page .mobile-study-nav:not(.knowledge-module-dock) button:not(.mobile-nav-refresh) > strong {
    color: inherit !important;
    font-size: 13px !important;
    font-weight: 550 !important;
  }

  body.student-page .mobile-study-nav:not(.knowledge-module-dock) button:not(.mobile-nav-refresh).active {
    background: transparent !important;
    color: var(--forest-orange-deep, #b86b08) !important;
    box-shadow: none !important;
  }

  body.student-page .mobile-study-nav:not(.knowledge-module-dock) button:not(.mobile-nav-refresh).active::after {
    background: var(--forest-orange, #efa72b) !important;
  }

  body.student-page .mobile-study-nav:not(.knowledge-module-dock) button:not(.mobile-nav-refresh).active > strong {
    font-weight: 700 !important;
  }

  body.student-page .mobile-study-nav:not(.knowledge-module-dock) .mobile-nav-refresh {
    place-self: center !important;
    display: grid !important;
    place-items: center !important;
    width: 56px !important;
    height: 38px !important;
    min-width: 56px !important;
    min-height: 38px !important;
    margin: 0 !important;
    transform: none !important;
    border: 1px solid rgba(208, 139, 27, 0.16) !important;
    border-radius: 14px !important;
    padding: 0 !important;
    background: var(--forest-orange, #efa72b) !important;
    color: #4a2b14 !important;
    box-shadow: 0 5px 12px rgba(205, 133, 20, 0.11) !important;
  }

  body.student-page .mobile-study-nav:not(.knowledge-module-dock) .mobile-nav-refresh > strong {
    display: block !important;
    color: inherit !important;
    font-size: 12px !important;
    font-weight: 700 !important;
  }
}

body.student-page[data-mobile-target="reviewPanel"] #studentAssistantFab.student-planner-fab,
body.student-page[data-mobile-target="reviewPanel"] #studentAssistantFab.student-assistant-fab {
  display: none !important;
}

@media (max-width: 390px) {
  body.student-page #reviewPanel.active-mobile-panel {
    padding-inline: 4px !important;
  }

  body.student-page #reviewPanel .output-directory-intro {
    border-radius: 22px !important;
    padding-inline: 14px !important;
  }

  body.student-page #reviewPanel .output-directory-intro > strong {
    font-size: 21px !important;
  }

  body.student-page #reviewPanel .output-course-directory > summary,
  body.student-page #reviewPanel .output-chapter-directory > summary {
    grid-template-columns: minmax(0, 1fr) minmax(78px, auto) !important;
  }

  body.student-page #reviewPanel .output-quiz-row {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.student-page #reviewPanel .output-quiz-row em {
    justify-self: start !important;
  }
}
