/*
 * HYUNWOO V31.85 - canonical evaluation OX player
 *
 * Evaluation, daily, topic, review, wrong-note, bookmark, and confused-item
 * solving routes share the approved evaluation layout. Dashboard and list
 * surfaces retain their existing cascade. Feedback-dock motion keeps the
 * V31.72 transform/opacity timing.
 */

:root {
  --hy-player-ink: #101a35;
  --hy-player-muted: #71809f;
  --hy-player-line: #e0e5ee;
  --hy-player-surface: #ffffff;
  --hy-player-canvas: #f7f8fb;
  --hy-player-green: #0bab68;
  --hy-player-green-soft: #f2fbf7;
  --hy-player-green-line: #cceee0;
  --hy-player-red: #d5525b;
  --hy-player-red-soft: #fff6f6;
  --hy-player-red-line: #f1d4d6;
  --hy-player-shadow: 0 18px 48px rgba(27, 39, 70, .08);
  --hy-player-dock-h: 78px;
  --hy-player-feedback-dock-h: 66px;
  --hy-player-dock-gap: 10px;
}

html body.exam-tab-active,
html body.daily-learning-active.ox-player-active {
  background: var(--hy-player-canvas) !important;
  color: var(--hy-player-ink) !important;
  overflow: hidden !important;
  overscroll-behavior: none !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot {
  width: min(760px, 100%) !important;
  max-width: 760px !important;
  height: 100dvh !important;
  max-height: 100dvh !important;
  min-height: 0 !important;
  margin: 0 auto !important;
  padding: max(8px, env(safe-area-inset-top)) 12px 0 !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}

/* Evaluation shell: the old tab-card chrome is hidden only while this tab is active. */
html body.exam-tab-active #appRoot#appRoot#appRoot > .dashboard-grid[data-app-panel~="exam"],
html body.exam-tab-active #appRoot#appRoot#appRoot .exam-tab-card,
html body.exam-tab-active #appRoot#appRoot#appRoot .exam-tab-card > .card-inner {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
  pointer-events: auto !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot > [data-app-panel].app-tab-hidden:not([data-app-panel~="exam"]),
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot > [data-app-panel].app-tab-hidden:not(.study-hero-card) {
  display: none !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-tab-card > .card-inner > :not(#examPracticeBox) {
  display: none !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot::before,
html body.exam-tab-active #appRoot#appRoot#appRoot::after,
html body.exam-tab-active #appRoot#appRoot#appRoot > .dashboard-grid[data-app-panel~="exam"]::before,
html body.exam-tab-active #appRoot#appRoot#appRoot > .dashboard-grid[data-app-panel~="exam"]::after,
html body.exam-tab-active #appRoot#appRoot#appRoot .exam-tab-card::before,
html body.exam-tab-active #appRoot#appRoot#appRoot .exam-tab-card::after {
  content: none !important;
  display: none !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 0 calc(var(--hy-player-dock-h) + var(--hy-player-dock-gap) + env(safe-area-inset-bottom)) !important;
  box-sizing: border-box !important;
  border: 0 !important;
  overflow: hidden !important;
  background: transparent !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox.hidden {
  display: none !important;
}

/* Daily shell keeps its V31.72 home routing, but the open player becomes one full screen. */
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot > .study-hero-card,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot > .study-hero-card > .card-inner {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot #dailyQuizShell {
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 0 calc(var(--hy-player-dock-h) + var(--hy-player-dock-gap) + env(safe-area-inset-bottom)) !important;
  border: 0 !important;
  overflow: hidden !important;
  transform: none !important;
}

html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot #dailyQuizShell.hidden {
  display: none !important;
}

/* Shared player header */
html body.exam-tab-active #appRoot#appRoot#appRoot .exam-player-stage.exam-status-header,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .daily-player-stage {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 10px !important;
  flex: 0 0 auto !important;
  width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
  pointer-events: auto !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-player-stage.exam-status-header::before,
html body.exam-tab-active #appRoot#appRoot#appRoot .exam-player-stage.exam-status-header::after,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .daily-player-stage::before,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .daily-player-stage::after {
  content: none !important;
  display: none !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .player-topbar,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .daily-player-stage > .player-topbar {
  position: relative !important;
  z-index: 2 !important;
  display: grid !important;
  grid-template-columns: 40px minmax(0, 1fr) 42px !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
  min-height: 56px !important;
  margin: 0 !important;
  padding: 0 2px !important;
  box-sizing: border-box !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
  overflow: visible !important;
  pointer-events: auto !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .player-title-copy,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .player-title-copy {
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-player-title,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .daily-player-title {
  margin: 0 !important;
  color: var(--hy-player-ink) !important;
  font-size: clamp(17px, 3.2vw, 22px) !important;
  font-weight: 950 !important;
  line-height: 1.16 !important;
  letter-spacing: -.045em !important;
  text-align: left !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-player-subtitle,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .daily-player-subtitle {
  display: block !important;
  margin: 5px 0 0 !important;
  color: var(--hy-player-muted) !important;
  font-size: 9px !important;
  font-weight: 750 !important;
  line-height: 1.25 !important;
  letter-spacing: -.018em !important;
  white-space: nowrap !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .player-back-btn,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .player-back-btn {
  position: relative !important;
  display: grid !important;
  place-items: center !important;
  width: 40px !important;
  min-width: 40px !important;
  height: 40px !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 14px !important;
  background: transparent !important;
  color: var(--hy-player-ink) !important;
  box-shadow: none !important;
  cursor: pointer !important;
  pointer-events: auto !important;
  touch-action: manipulation !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .player-back-svg,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .player-back-svg {
  display: block !important;
  width: 25px !important;
  height: 25px !important;
  transform: translateX(.75px) !important;
  pointer-events: none !important;
}

html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .player-more-btn,
html body.exam-tab-active #appRoot#appRoot#appRoot .exam-kebab-menu > summary {
  position: relative !important;
  display: grid !important;
  place-items: center !important;
  width: 42px !important;
  min-width: 42px !important;
  height: 42px !important;
  min-height: 42px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid var(--hy-player-line) !important;
  border-radius: 14px !important;
  background: rgba(255, 255, 255, .9) !important;
  color: var(--hy-player-ink) !important;
  box-shadow: 0 8px 24px rgba(32, 44, 75, .05) !important;
  font-size: 0 !important;
  line-height: 0 !important;
  cursor: pointer !important;
  touch-action: manipulation !important;
  list-style: none !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-kebab-menu {
  position: relative !important;
  align-self: center !important;
  justify-self: end !important;
  width: 42px !important;
  height: 42px !important;
  margin: 0 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-kebab-menu > summary::before,
html body.exam-tab-active #appRoot#appRoot#appRoot .exam-kebab-menu > summary::after,
html body.exam-tab-active #appRoot#appRoot#appRoot .exam-kebab-menu > summary::marker {
  content: none !important;
  display: none !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .player-more-dots,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .player-more-dots {
  display: block !important;
  width: 4px !important;
  height: 4px !important;
  border-radius: 50% !important;
  background: currentColor !important;
  box-shadow: -8px 0 0 currentColor, 8px 0 0 currentColor !important;
}

html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .player-more-btn > .settings-gear-svg,
html body.exam-tab-active #appRoot#appRoot#appRoot .exam-kebab-menu > summary > .settings-gear-svg {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  overflow: visible !important;
  flex: 0 0 18px !important;
}

/* Summary cards */
html body.exam-tab-active #appRoot#appRoot#appRoot .exam-status-card,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .daily-status-card {
  position: relative !important;
  z-index: 1 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 74px !important;
  align-items: center !important;
  gap: 12px !important;
  width: 100% !important;
  min-height: 100px !important;
  margin: 0 !important;
  padding: 11px 14px !important;
  box-sizing: border-box !important;
  border: 1px solid var(--hy-player-line) !important;
  border-radius: 23px !important;
  background: rgba(255, 255, 255, .92) !important;
  box-shadow: var(--hy-player-shadow) !important;
  overflow: hidden !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-status-grid,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .daily-status-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 62px !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 0 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-status-item,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .daily-status-item {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 12px !important;
  border: 0 !important;
  background: transparent !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-status-item + .exam-status-item::before,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .daily-status-item + .daily-status-item::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 12px !important;
  bottom: 12px !important;
  width: 1px !important;
  background: var(--hy-player-line) !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-status-item > span,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .daily-status-item > span {
  margin: 0 !important;
  color: var(--hy-player-muted) !important;
  font-size: 9px !important;
  font-weight: 850 !important;
  line-height: 1.1 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-status-item > strong,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .daily-status-item > strong {
  margin: 8px 0 0 !important;
  color: var(--hy-player-ink) !important;
  font-size: clamp(17px, 3.7vw, 24px) !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  letter-spacing: -.04em !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-status-badge,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .daily-accuracy-orb {
  position: relative !important;
  z-index: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  width: 66px !important;
  min-width: 66px !important;
  height: 66px !important;
  min-height: 66px !important;
  margin: 0 !important;
  padding: 0 !important;
  justify-self: center !important;
  border: 1px solid rgba(255, 255, 255, .8) !important;
  border-radius: 50% !important;
  background:
    radial-gradient(circle at 35% 30%, rgba(255, 255, 255, .95), rgba(222, 247, 242, .86) 52%, rgba(215, 236, 251, .72)) !important;
  color: var(--hy-player-green) !important;
  box-shadow: inset 0 0 18px rgba(20, 184, 166, .08) !important;
  overflow: visible !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-status-badge-label,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .daily-accuracy-orb > span {
  position: relative !important;
  z-index: 3 !important;
  color: var(--hy-player-muted) !important;
  font-size: 9px !important;
  font-weight: 850 !important;
  line-height: 1 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-status-badge-text,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .daily-accuracy-orb > strong {
  position: relative !important;
  z-index: 3 !important;
  margin: 5px 0 0 !important;
  color: var(--hy-player-green) !important;
  font-size: 19px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  letter-spacing: -.035em !important;
}

html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .daily-accuracy-orb > strong {
  font-size: clamp(18px, 4.6vw, 22px) !important;
}

html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .daily-mode-label {
  display: none !important;
}

/* Scroll surface and cards */
html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox > .exam-player-card.exam-chat-card,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot #dailyQuizShell > .quiz-card {
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: 100% !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 0 10px !important;
  box-sizing: border-box !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
  overscroll-behavior-y: contain !important;
  touch-action: pan-y !important;
}

html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot #dailyQuizShell > .quiz-card > .daily-player-stage {
  flex: 0 0 auto !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox > .exam-player-card.exam-chat-card::after,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot #dailyQuizShell > .quiz-card::after {
  content: "" !important;
  display: block !important;
  flex: 0 0 10px !important;
  width: 100% !important;
  height: 10px !important;
  min-height: 10px !important;
  background: transparent !important;
  pointer-events: none !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-question-box.exam-chat-window,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .question-box {
  position: relative !important;
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: clamp(190px, 24dvh, 260px) !important;
  height: auto !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 16px 19px 21px !important;
  box-sizing: border-box !important;
  border: 1px solid var(--hy-player-line) !important;
  border-radius: 26px !important;
  background: var(--hy-player-surface) !important;
  box-shadow: 0 12px 38px rgba(28, 41, 72, .045) !important;
  overflow: visible !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox.exam-has-feedback .exam-question-box.exam-chat-window,
html body.exam-tab-active #appRoot#appRoot#appRoot .exam-player-card.exam-answered .exam-question-box.exam-chat-window,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot #dailyQuizShell > .quiz-card.correct-pop > .question-box,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot #dailyQuizShell > .quiz-card.wrong-pop > .question-box {
  flex: 0 0 auto !important;
  min-height: 0 !important;
  height: auto !important;
  max-height: none !important;
  padding: 15px 19px 20px !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox.exam-has-feedback > .exam-player-card.exam-chat-card,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot #dailyQuizShell > .quiz-card.correct-pop,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot #dailyQuizShell > .quiz-card.wrong-pop {
  gap: 6px !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-question-head,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .daily-question-head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 6px !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 12px !important;
  margin: 0 !important;
  padding: 0 74px 0 0 !important;
  box-sizing: border-box !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .question-label,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .question-label {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--hy-player-muted) !important;
  font-size: 10px !important;
  font-weight: 850 !important;
  line-height: 1.2 !important;
  letter-spacing: -.018em !important;
  text-align: left !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-question-support,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .daily-question-support {
  position: absolute !important;
  right: 9px !important;
  top: 9px !important;
  display: inline-flex !important;
  align-items: flex-start !important;
  justify-content: flex-end !important;
  gap: 0 !important;
  flex: 0 0 auto !important;
  min-width: 80px !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-question-support .support-icon-btn,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .daily-question-support .support-icon-btn {
  position: relative !important;
  display: grid !important;
  place-items: center !important;
  width: 40px !important;
  min-width: 40px !important;
  height: 40px !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 13px !important;
  background: transparent !important;
  color: #647391 !important;
  box-shadow: none !important;
  overflow: visible !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-question-support .support-icon-btn::before,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .daily-question-support .support-icon-btn::before {
  content: "" !important;
  position: absolute !important;
  inset: 5px !important;
  border-radius: 10px !important;
  background: #f6f8fb !important;
  opacity: 1 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-question-support .support-icon-btn[data-bookmark-saved="true"],
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .daily-question-support .support-icon-btn[data-bookmark-saved="true"] {
  color: var(--hy-player-green) !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-question-support .support-icon-btn[data-bookmark-saved="true"]::before,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .daily-question-support .support-icon-btn[data-bookmark-saved="true"]::before {
  background: #eaf8f2 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-question-support .support-icon-btn .support-svg,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .daily-question-support .support-icon-btn .support-svg {
  position: relative !important;
  z-index: 1 !important;
  display: block !important;
  width: 17px !important;
  height: 17px !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-question-support .support-icon-btn > span,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .daily-question-support .support-icon-btn > span {
  display: none !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-question,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .question {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 4px 0 0 !important;
  padding: 0 !important;
  color: var(--hy-player-ink) !important;
  font-size: clamp(18px, 4vw, 23px) !important;
  font-weight: 900 !important;
  line-height: 1.48 !important;
  letter-spacing: -.034em !important;
  text-align: left !important;
  word-break: keep-all !important;
  overflow-wrap: anywhere !important;
}

html body.large-question-mode.exam-tab-active #appRoot#appRoot#appRoot .exam-question,
html body.large-question-mode.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .question {
  font-size: clamp(20px, 4.6vw, 26px) !important;
}

/* Keep the source and question tightly stacked while tools float in the corner. */
html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-question-box.exam-chat-window .exam-question-head,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot #dailyQuizShell:not(.hidden) .question-box .daily-question-head {
  position: static !important;
  z-index: auto !important;
  min-height: 12px !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 70px 0 0 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-question-box.exam-chat-window .exam-question-support,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot #dailyQuizShell:not(.hidden) .question-box .daily-question-support {
  position: absolute !important;
  z-index: 2 !important;
  top: -1px !important;
  right: 3px !important;
  width: 60px !important;
  min-width: 60px !important;
  height: 30px !important;
  margin: 0 !important;
  gap: 0 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-question-box.exam-chat-window .exam-question-support .support-icon-btn,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot #dailyQuizShell:not(.hidden) .question-box .daily-question-support .support-icon-btn {
  width: 30px !important;
  min-width: 30px !important;
  max-width: 30px !important;
  height: 30px !important;
  min-height: 30px !important;
  max-height: 30px !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-question-box.exam-chat-window .exam-question,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot #dailyQuizShell:not(.hidden) .question-box .question {
  margin: 4px 0 0 !important;
}

/* Answered explanation card */
html body.exam-tab-active #appRoot#appRoot#appRoot .exam-result-area {
  display: none !important;
  flex: 0 0 auto !important;
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox.exam-has-feedback .exam-result-area,
html body.exam-tab-active #appRoot#appRoot#appRoot .exam-player-card.exam-answered .exam-result-area {
  display: block !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-feedback,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .feedback {
  position: relative !important;
  display: none !important;
  flex: 0 0 auto !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 164px !important;
  height: auto !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 18px 19px 46px !important;
  box-sizing: border-box !important;
  border: 1px solid var(--hy-player-green-line) !important;
  border-radius: 23px !important;
  background: var(--hy-player-green-soft) !important;
  color: var(--hy-player-ink) !important;
  box-shadow: 0 12px 34px rgba(31, 136, 94, .045) !important;
  overflow: hidden !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-feedback.show,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .feedback.show {
  display: flex !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-feedback.wrong,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .feedback.wrong {
  border-color: var(--hy-player-red-line) !important;
  background: var(--hy-player-red-soft) !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-feedback-title,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .feedback-title {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
  min-height: 42px !important;
  margin: 0 0 12px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--hy-player-green) !important;
  font-size: 13px !important;
  font-weight: 950 !important;
  line-height: 1.25 !important;
  letter-spacing: -.025em !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-feedback-title::before,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .feedback-title::before {
  content: "✓" !important;
  display: grid !important;
  place-items: center !important;
  flex: 0 0 42px !important;
  width: 42px !important;
  height: 42px !important;
  border-radius: 13px !important;
  background: #e8f7f0 !important;
  color: var(--hy-player-green) !important;
  font-size: 18px !important;
  font-weight: 800 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-feedback.wrong .exam-feedback-title,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .feedback.wrong .feedback-title {
  color: var(--hy-player-red) !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-feedback.wrong .exam-feedback-title::before,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .feedback.wrong .feedback-title::before {
  content: "×" !important;
  background: #fdeced !important;
  color: var(--hy-player-red) !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-feedback .explanation-toggle-row,
html body.exam-tab-active #appRoot#appRoot#appRoot .exam-feedback .exam-explanation-title,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .feedback .explanation-toggle-row,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .feedback .explanation-title {
  display: none !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-feedback .exam-explanation,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .feedback .explanation {
  display: block !important;
  flex: 0 0 auto !important;
  width: 100% !important;
  min-height: 0 !important;
  height: auto !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #26324d !important;
  font-size: clamp(11px, 2.65vw, 15px) !important;
  font-weight: 650 !important;
  line-height: 1.75 !important;
  letter-spacing: -.018em !important;
  overflow: visible !important;
  word-break: keep-all !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-feedback .exam-explanation.explanation-hidden,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .feedback .explanation.explanation-hidden {
  display: none !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .multi-result-list,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .multi-result-list {
  display: grid !important;
  gap: 5px !important;
  margin: 0 0 10px !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .multi-result-item,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .multi-result-item {
  padding: 11px 12px !important;
  border: 1px solid rgba(156, 178, 167, .35) !important;
  border-radius: 14px !important;
  background: rgba(255, 255, 255, .62) !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .question-ask-btn,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .question-ask-btn {
  position: absolute !important;
  left: 16px !important;
  bottom: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 7px !important;
  width: auto !important;
  min-width: 0 !important;
  height: 42px !important;
  min-height: 42px !important;
  margin: 0 !important;
  padding: 0 10px 0 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--hy-player-ink) !important;
  box-shadow: none !important;
  font-size: 10px !important;
  font-weight: 850 !important;
  line-height: 1 !important;
  cursor: pointer !important;
  touch-action: manipulation !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .question-chat-svg,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .question-chat-svg {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-feedback > .exam-next-btn,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .feedback > .next-btn {
  display: none !important;
}

/* Pre-answer O/X dock */
html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox > .exam-choice-area.exam-fixed-answer-dock,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot #dailyQuizShell > .daily-answer-area {
  position: fixed !important;
  left: 50% !important;
  right: auto !important;
  bottom: calc(12px + env(safe-area-inset-bottom)) !important;
  z-index: 180020 !important;
  display: flex !important;
  align-items: center !important;
  width: min(680px, calc(100vw - 28px)) !important;
  min-width: 0 !important;
  height: var(--hy-player-dock-h) !important;
  min-height: var(--hy-player-dock-h) !important;
  margin: 0 !important;
  padding: 8px !important;
  box-sizing: border-box !important;
  border: 1px solid rgba(218, 224, 234, .98) !important;
  border-radius: 21px !important;
  background: rgba(255, 255, 255, .96) !important;
  box-shadow: 0 18px 50px rgba(27, 40, 71, .14) !important;
  transform: translate3d(-50%, 0, 0) !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  overflow: hidden !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox > .exam-choice-area.hidden,
html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox.exam-has-feedback > .exam-choice-area,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot #dailyQuizShell > .daily-answer-area.hidden {
  display: none !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox > .exam-choice-area .answer-grid,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot #dailyQuizShell > .daily-answer-area .answer-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox > .exam-choice-area .answer-btn,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot #dailyQuizShell > .daily-answer-area .answer-btn {
  display: grid !important;
  place-items: center !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1.5px solid #d7deea !important;
  border-radius: 16px !important;
  background: #fff !important;
  color: var(--hy-player-ink) !important;
  box-shadow: none !important;
  font-size: 32px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
}

/* Canonical answer feedback dock: evaluation and daily source selectors. */
html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox > .learning-player-dock.exam-ox-feedback-dock,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot #dailyQuizShell > .learning-player-dock.exam-ox-feedback-dock {
  position: fixed !important;
  left: 50% !important;
  right: auto !important;
  bottom: calc(12px + env(safe-area-inset-bottom)) !important;
  z-index: 180030 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto auto !important;
  align-items: center !important;
  gap: 10px !important;
  width: min(680px, calc(100vw - 28px)) !important;
  min-width: 0 !important;
  height: var(--hy-player-feedback-dock-h) !important;
  min-height: var(--hy-player-feedback-dock-h) !important;
  margin: 0 !important;
  padding: 8px 10px 8px 15px !important;
  box-sizing: border-box !important;
  border: 1px solid rgba(218, 224, 234, .98) !important;
  border-radius: 21px !important;
  background: rgba(255, 255, 255, .97) !important;
  box-shadow: 0 18px 50px rgba(27, 40, 71, .14) !important;
  transform: translate3d(-50%, 0, 0) !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  overflow: hidden !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  transition:
    transform .34s cubic-bezier(.16, 1, .3, 1),
    opacity .24s ease !important;
  will-change: transform, opacity !important;
}

html body:not(.feedback-dock-always).feedback-dock-hidden.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox > .learning-player-dock.exam-ox-feedback-dock,
html body:not(.feedback-dock-always).feedback-dock-hidden.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot #dailyQuizShell > .learning-player-dock.exam-ox-feedback-dock {
  transform: translate3d(-50%, calc(100% + 30px), 0) !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox > .learning-player-dock.exam-ox-feedback-dock.feedback-wrong,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot #dailyQuizShell > .learning-player-dock.exam-ox-feedback-dock.feedback-wrong {
  border-color: rgba(236, 211, 215, .98) !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-ox-feedback-dock .exam-dock-message,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .exam-ox-feedback-dock .exam-dock-message {
  min-width: 0 !important;
  overflow: hidden !important;
  color: var(--hy-player-green) !important;
  font-size: clamp(10px, 2.7vw, 14px) !important;
  font-weight: 950 !important;
  line-height: 1.15 !important;
  letter-spacing: -.025em !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-ox-feedback-dock.feedback-wrong .exam-dock-message,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .exam-ox-feedback-dock.feedback-wrong .exam-dock-message {
  color: var(--hy-player-red) !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-ox-feedback-dock .exam-confused-btn,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .exam-ox-feedback-dock .exam-confused-btn {
  display: grid !important;
  place-items: center !important;
  width: auto !important;
  min-width: 72px !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 0 11px !important;
  border: 1px solid #7fd7b2 !important;
  border-radius: 13px !important;
  background: #fff !important;
  color: var(--hy-player-green) !important;
  box-shadow: none !important;
  font-size: 10px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-ox-feedback-dock .exam-confused-btn[aria-pressed="true"],
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .exam-ox-feedback-dock .exam-confused-btn[aria-pressed="true"] {
  border-color: var(--hy-player-green) !important;
  background: #eaf8f2 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-ox-feedback-dock .exam-next-btn.show,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .exam-ox-feedback-dock .next-btn.show {
  display: grid !important;
  place-items: center !important;
  width: auto !important;
  min-width: 96px !important;
  height: 50px !important;
  min-height: 50px !important;
  margin: 0 !important;
  padding: 0 14px !important;
  border: 0 !important;
  border-radius: 15px !important;
  background: var(--hy-player-ink) !important;
  color: #fff !important;
  box-shadow: 0 9px 20px rgba(16, 26, 53, .17) !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

/* Feature pages use the same header frame as the evaluation player. */
html body.feature-page-active:not(.dedicated-ox-player):not(.storage-library-active) {
  min-height: 100dvh !important;
  display: block !important;
  padding: 8px 10px 0 !important;
  background: var(--hy-player-canvas) !important;
  color: var(--hy-player-ink) !important;
}

html body.feature-page-active:not(.dedicated-ox-player):not(.storage-library-active) #appRoot#appRoot#appRoot {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  align-content: start !important;
  gap: 0 !important;
  width: min(760px, 100%) !important;
  max-width: 760px !important;
  min-height: 100dvh !important;
  margin: 0 auto !important;
  padding: max(8px, env(safe-area-inset-top)) 12px calc(22px + env(safe-area-inset-bottom)) !important;
  box-sizing: border-box !important;
}

html body.feature-page-active:not(.dedicated-ox-player) #appRoot#appRoot#appRoot > .topbar {
  display: none !important;
}

html body.feature-page-active:not(.dedicated-ox-player) #appRoot#appRoot#appRoot > .study-feature-nav.canonical-player-topbar:not(.hidden) {
  position: relative !important;
  z-index: 20 !important;
  order: -10 !important;
  display: grid !important;
  grid-template-columns: 40px minmax(0, 1fr) 42px !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
  min-height: 56px !important;
  margin: 2px 0 10px !important;
  padding: 0 2px !important;
  box-sizing: border-box !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

html body.feature-page-active:not(.dedicated-ox-player) #appRoot#appRoot#appRoot > .study-feature-nav.canonical-player-topbar > * {
  grid-area: auto !important;
  grid-column: auto !important;
  grid-row: auto !important;
}

html body.feature-page-active:not(.dedicated-ox-player) #appRoot#appRoot#appRoot > .study-feature-nav.canonical-player-topbar.hidden {
  display: none !important;
}

html body.feature-page-active:not(.dedicated-ox-player) #appRoot#appRoot#appRoot .study-feature-nav .player-title-copy {
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body.feature-page-active:not(.dedicated-ox-player) #appRoot#appRoot#appRoot .study-feature-nav .exam-player-title {
  margin: 0 !important;
  color: var(--hy-player-ink) !important;
  font-size: clamp(17px, 3.2vw, 22px) !important;
  font-weight: 950 !important;
  line-height: 1.16 !important;
  letter-spacing: -.045em !important;
  text-align: left !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

html body.feature-page-active:not(.dedicated-ox-player) #appRoot#appRoot#appRoot .study-feature-nav .exam-player-subtitle {
  display: block !important;
  min-width: 0 !important;
  margin: 5px 0 0 !important;
  color: var(--hy-player-muted) !important;
  font-size: 9px !important;
  font-weight: 750 !important;
  line-height: 1.25 !important;
  letter-spacing: -.015em !important;
  text-align: left !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

html body.feature-page-active:not(.dedicated-ox-player) #appRoot#appRoot#appRoot .study-feature-nav .player-back-btn,
html body.feature-page-active:not(.dedicated-ox-player) #appRoot#appRoot#appRoot .study-feature-nav .player-more-btn,
html body.feature-page-active:not(.dedicated-ox-player) #appRoot#appRoot#appRoot .study-feature-nav .study-feature-edit,
html body.feature-page-active:not(.dedicated-ox-player) #appRoot#appRoot#appRoot .study-feature-nav .study-feature-header-spacer {
  position: relative !important;
  z-index: 2 !important;
  display: inline-grid !important;
  place-items: center !important;
  width: 40px !important;
  min-width: 40px !important;
  height: 40px !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  transform: none !important;
}

html body.feature-page-active:not(.dedicated-ox-player) #appRoot#appRoot#appRoot .study-feature-nav .player-back-btn {
  justify-self: start !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--hy-player-ink) !important;
  box-shadow: none !important;
}

html body.feature-page-active:not(.dedicated-ox-player) #appRoot#appRoot#appRoot .study-feature-nav .player-back-svg {
  width: 24px !important;
  height: 24px !important;
}

html body.feature-page-active:not(.dedicated-ox-player) #appRoot#appRoot#appRoot .study-feature-nav .player-more-btn {
  justify-self: end !important;
  border: 1px solid var(--hy-player-line) !important;
  border-radius: 14px !important;
  background: #fff !important;
  color: var(--hy-player-ink) !important;
  box-shadow: 0 5px 15px rgba(16, 26, 53, .05) !important;
}

html body.feature-page-active:not(.dedicated-ox-player) #appRoot#appRoot#appRoot .study-feature-nav .player-more-btn > .settings-gear-svg {
  width: 19px !important;
  height: 19px !important;
}

html body.feature-page-active:not(.dedicated-ox-player) #appRoot#appRoot#appRoot .study-feature-nav .study-feature-edit {
  justify-self: end !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--hy-player-ink) !important;
  box-shadow: none !important;
  font-size: 11px !important;
  font-weight: 900 !important;
}

html body.feature-page-active:not(.dedicated-ox-player) #appRoot#appRoot#appRoot .study-feature-nav :is(.player-more-btn, .study-feature-edit, .study-feature-header-spacer).hidden {
  display: none !important;
}

html body.feature-page-active:not(.dedicated-ox-player) #appRoot#appRoot#appRoot > [data-feature-panel]:not(.hidden) {
  margin-top: 0 !important;
}

@media (max-width: 520px) {
  html body.feature-page-active:not(.dedicated-ox-player) #appRoot#appRoot#appRoot {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  html body.feature-page-active:not(.dedicated-ox-player) #appRoot#appRoot#appRoot > .study-feature-nav.canonical-player-topbar:not(.hidden) {
    grid-template-columns: 36px minmax(0, 1fr) 40px !important;
    gap: 6px !important;
    min-height: 52px !important;
    margin-top: 0 !important;
  }

  html body.feature-page-active:not(.dedicated-ox-player) #appRoot#appRoot#appRoot .study-feature-nav .player-back-btn {
    width: 36px !important;
    min-width: 36px !important;
    height: 36px !important;
    min-height: 36px !important;
  }

  html body.feature-page-active:not(.dedicated-ox-player) #appRoot#appRoot#appRoot .study-feature-nav :is(.player-more-btn, .study-feature-edit, .study-feature-header-spacer) {
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
  }
}

/* Shared evaluation-player UI for topic, review, wrong-note, bookmark, and confused-item OX.
   Legacy learning-* geometry remains available for inline dashboards, while every dedicated
   solving route is rendered by this single canonical player layer. */
html body.dedicated-ox-player {
  background: var(--hy-player-canvas) !important;
  color: var(--hy-player-ink) !important;
  overflow: hidden !important;
  overscroll-behavior: none !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot {
  display: flex !important;
  flex-direction: column !important;
  width: min(760px, 100%) !important;
  max-width: 760px !important;
  height: 100dvh !important;
  max-height: 100dvh !important;
  min-height: 0 !important;
  margin: 0 auto !important;
  padding: max(8px, env(safe-area-inset-top)) 12px 0 !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}

@media (min-width: 521px) {
  html body.dedicated-ox-player {
    padding-top: 10px !important;
  }
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot > [data-study-home],
html body.dedicated-ox-player #appRoot#appRoot#appRoot > .study-feature-nav,
html body.dedicated-ox-player #appRoot#appRoot#appRoot > .footer {
  display: none !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot > .study-feature-card:not(.hidden),
html body.dedicated-ox-player #appRoot#appRoot#appRoot > .study-feature-card:not(.hidden) > .card-inner {
  display: flex !important;
  flex: 1 1 0 !important;
  flex-direction: column !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot :is(#topicPanel.topic-panel, #reviewPanel.review-panel) {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  width: 100% !important;
  height: auto !important;
  flex: 1 1 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 0 calc(var(--hy-player-dock-h) + var(--hy-player-dock-gap) + env(safe-area-inset-bottom)) !important;
  box-sizing: border-box !important;
  border: 0 !important;
  background: transparent !important;
  overflow: hidden !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot :is(#topicPanel.topic-panel, #reviewPanel.review-panel).hidden {
  display: none !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot :is(#topicPanel.topic-panel, #reviewPanel.review-panel) > .learning-stage.exam-player-stage.exam-status-header {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 10px !important;
  flex: 0 0 auto !important;
  width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .learning-stage.exam-player-stage::before,
html body.dedicated-ox-player #appRoot#appRoot#appRoot .learning-stage.exam-player-stage::after {
  content: none !important;
  display: none !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .learning-stage .player-topbar {
  position: relative !important;
  z-index: 2 !important;
  display: grid !important;
  grid-template-columns: 40px minmax(0, 1fr) 42px !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
  min-height: 56px !important;
  margin: 0 !important;
  padding: 0 2px !important;
  box-sizing: border-box !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
  overflow: visible !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .learning-stage .player-title-copy {
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .learning-stage .exam-player-title {
  margin: 0 !important;
  color: var(--hy-player-ink) !important;
  font-size: clamp(17px, 3.2vw, 22px) !important;
  font-weight: 950 !important;
  line-height: 1.16 !important;
  letter-spacing: -.045em !important;
  text-align: left !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .learning-stage .exam-player-subtitle {
  display: block !important;
  min-width: 0 !important;
  margin: 5px 0 0 !important;
  overflow: hidden !important;
  color: var(--hy-player-muted) !important;
  font-size: 9px !important;
  font-weight: 750 !important;
  line-height: 1.25 !important;
  letter-spacing: -.018em !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .learning-stage .player-back-btn {
  position: relative !important;
  z-index: 4 !important;
  display: grid !important;
  place-items: center !important;
  width: 40px !important;
  min-width: 40px !important;
  height: 40px !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 14px !important;
  background: transparent !important;
  color: var(--hy-player-ink) !important;
  box-shadow: none !important;
  cursor: pointer !important;
  pointer-events: auto !important;
  touch-action: manipulation !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .learning-stage .player-back-svg {
  display: block !important;
  width: 25px !important;
  height: 25px !important;
  transform: translateX(.75px) !important;
  pointer-events: none !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .learning-stage .player-more-btn {
  position: relative !important;
  z-index: 4 !important;
  display: grid !important;
  place-items: center !important;
  width: 42px !important;
  min-width: 42px !important;
  height: 42px !important;
  min-height: 42px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid var(--hy-player-line) !important;
  border-radius: 14px !important;
  background: rgba(255, 255, 255, .9) !important;
  color: var(--hy-player-ink) !important;
  box-shadow: 0 8px 24px rgba(32, 44, 75, .05) !important;
  font-size: 0 !important;
  line-height: 0 !important;
  cursor: pointer !important;
  pointer-events: auto !important;
  touch-action: manipulation !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .learning-stage .player-more-btn > .settings-gear-svg {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  overflow: visible !important;
  flex: 0 0 18px !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .learning-stage .exam-status-card {
  position: relative !important;
  z-index: 1 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 74px !important;
  align-items: center !important;
  gap: 12px !important;
  width: 100% !important;
  min-height: 100px !important;
  margin: 0 !important;
  padding: 11px 14px !important;
  box-sizing: border-box !important;
  border: 1px solid var(--hy-player-line) !important;
  border-radius: 23px !important;
  background: rgba(255, 255, 255, .92) !important;
  box-shadow: var(--hy-player-shadow) !important;
  overflow: hidden !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .learning-stage .exam-status-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 62px !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 0 !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .learning-stage .exam-status-item {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 12px !important;
  border: 0 !important;
  background: transparent !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .learning-stage .exam-status-item + .exam-status-item::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 12px !important;
  bottom: 12px !important;
  width: 1px !important;
  background: var(--hy-player-line) !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .learning-stage .exam-status-item > span {
  margin: 0 !important;
  color: var(--hy-player-muted) !important;
  font-size: 9px !important;
  font-weight: 850 !important;
  line-height: 1.1 !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .learning-stage .exam-status-item > strong {
  margin: 8px 0 0 !important;
  color: var(--hy-player-ink) !important;
  font-size: clamp(17px, 3.7vw, 24px) !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  letter-spacing: -.04em !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .learning-stage .exam-status-badge {
  position: relative !important;
  z-index: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  width: 66px !important;
  min-width: 66px !important;
  height: 66px !important;
  min-height: 66px !important;
  margin: 0 !important;
  padding: 0 !important;
  justify-self: center !important;
  border: 1px solid rgba(255, 255, 255, .8) !important;
  border-radius: 50% !important;
  background: radial-gradient(circle at 35% 30%, rgba(255, 255, 255, .95), rgba(222, 247, 242, .86) 52%, rgba(215, 236, 251, .72)) !important;
  color: var(--hy-player-green) !important;
  box-shadow: inset 0 0 18px rgba(20, 184, 166, .08) !important;
  overflow: visible !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .learning-stage .exam-status-badge-label {
  color: var(--hy-player-muted) !important;
  font-size: 9px !important;
  font-weight: 850 !important;
  line-height: 1 !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .learning-stage .exam-status-badge-text {
  margin: 5px 0 0 !important;
  color: var(--hy-player-green) !important;
  font-size: 19px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  letter-spacing: -.035em !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot :is(#topicPanel.topic-panel, #reviewPanel.review-panel) > .exam-player-card.exam-chat-card {
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: 100% !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 0 10px !important;
  box-sizing: border-box !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
  overscroll-behavior-y: contain !important;
  touch-action: pan-y !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot :is(#topicPanel.topic-panel, #reviewPanel.review-panel) > .exam-player-card.exam-chat-card::after {
  content: "" !important;
  display: block !important;
  flex: 0 0 10px !important;
  width: 100% !important;
  height: 10px !important;
  min-height: 10px !important;
  background: transparent !important;
  pointer-events: none !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot :is(#topicPanel.topic-panel, #reviewPanel.review-panel) .exam-question-box.exam-chat-window {
  position: relative !important;
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: clamp(190px, 24dvh, 260px) !important;
  height: auto !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 16px 19px 21px !important;
  box-sizing: border-box !important;
  border: 1px solid var(--hy-player-line) !important;
  border-radius: 26px !important;
  background: var(--hy-player-surface) !important;
  box-shadow: 0 12px 38px rgba(28, 41, 72, .045) !important;
  overflow: visible !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot :is(#topicPanel.topic-panel, #reviewPanel.review-panel).learning-has-feedback > .exam-player-card.exam-chat-card {
  gap: 6px !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot :is(#topicPanel.topic-panel, #reviewPanel.review-panel).learning-has-feedback .exam-question-box.exam-chat-window,
html body.dedicated-ox-player #appRoot#appRoot#appRoot :is(#topicPanel.topic-panel, #reviewPanel.review-panel) .exam-player-card.exam-answered .exam-question-box.exam-chat-window {
  flex: 0 0 auto !important;
  min-height: 0 !important;
  height: auto !important;
  max-height: none !important;
  padding: 15px 19px 20px !important;
  overflow: visible !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .exam-question-head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 6px !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 12px !important;
  margin: 0 !important;
  padding: 0 70px 0 0 !important;
  box-sizing: border-box !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .question-label {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  color: var(--hy-player-muted) !important;
  font-size: 10px !important;
  font-weight: 850 !important;
  line-height: 1.2 !important;
  letter-spacing: -.018em !important;
  text-align: left !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .exam-question-support {
  position: absolute !important;
  z-index: 2 !important;
  top: -1px !important;
  right: 3px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  width: 60px !important;
  min-width: 60px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 0 !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .exam-question-support .support-icon-btn {
  position: relative !important;
  display: grid !important;
  place-items: center !important;
  width: 30px !important;
  min-width: 30px !important;
  max-width: 30px !important;
  height: 30px !important;
  min-height: 30px !important;
  max-height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: transparent !important;
  color: #647391 !important;
  box-shadow: none !important;
  overflow: visible !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .exam-question-support .support-icon-btn::before {
  content: "" !important;
  position: absolute !important;
  inset: 4px !important;
  border-radius: 8px !important;
  background: #f6f8fb !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .exam-question-support .support-icon-btn[data-bookmark-saved="true"] {
  color: var(--hy-player-green) !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .exam-question-support .support-icon-btn[data-bookmark-saved="true"]::before {
  background: #eaf8f2 !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .exam-question-support .support-svg {
  position: relative !important;
  z-index: 1 !important;
  display: block !important;
  width: 17px !important;
  height: 17px !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .exam-question-support .support-icon-btn > span,
html body.dedicated-ox-player #appRoot#appRoot#appRoot .inline-cycle-count {
  display: none !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .exam-question {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 4px 0 0 !important;
  padding: 0 !important;
  color: var(--hy-player-ink) !important;
  font-size: clamp(18px, 4vw, 23px) !important;
  font-weight: 900 !important;
  line-height: 1.48 !important;
  letter-spacing: -.034em !important;
  text-align: left !important;
  word-break: keep-all !important;
  overflow: visible !important;
  overflow-wrap: anywhere !important;
}

html body.large-question-mode.dedicated-ox-player #appRoot#appRoot#appRoot .exam-question {
  font-size: clamp(20px, 4.6vw, 26px) !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .exam-result-area {
  display: none !important;
  flex: 0 0 auto !important;
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot :is(#topicPanel.topic-panel, #reviewPanel.review-panel).learning-has-feedback .exam-result-area,
html body.dedicated-ox-player #appRoot#appRoot#appRoot .exam-player-card.exam-answered .exam-result-area {
  display: block !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .exam-feedback {
  position: relative !important;
  display: none !important;
  flex: 0 0 auto !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 164px !important;
  height: auto !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 18px 19px 46px !important;
  box-sizing: border-box !important;
  border: 1px solid var(--hy-player-green-line) !important;
  border-radius: 23px !important;
  background: var(--hy-player-green-soft) !important;
  color: var(--hy-player-ink) !important;
  box-shadow: 0 12px 34px rgba(31, 136, 94, .045) !important;
  overflow: hidden !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .exam-feedback.show {
  display: flex !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .exam-feedback.wrong {
  border-color: var(--hy-player-red-line) !important;
  background: var(--hy-player-red-soft) !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .exam-feedback-title {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
  min-height: 42px !important;
  margin: 0 0 12px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--hy-player-green) !important;
  font-size: 13px !important;
  font-weight: 950 !important;
  line-height: 1.25 !important;
  letter-spacing: -.025em !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .exam-feedback-title::before {
  content: "✓" !important;
  display: grid !important;
  place-items: center !important;
  flex: 0 0 42px !important;
  width: 42px !important;
  height: 42px !important;
  border-radius: 13px !important;
  background: #e8f7f0 !important;
  color: var(--hy-player-green) !important;
  font-size: 18px !important;
  font-weight: 800 !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .exam-feedback.wrong .exam-feedback-title {
  color: var(--hy-player-red) !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .exam-feedback.wrong .exam-feedback-title::before {
  content: "×" !important;
  background: #fdeced !important;
  color: var(--hy-player-red) !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .exam-feedback .explanation-toggle-row,
html body.dedicated-ox-player #appRoot#appRoot#appRoot .exam-feedback .exam-explanation-title {
  display: none !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .exam-feedback .exam-explanation {
  display: block !important;
  flex: 0 0 auto !important;
  width: 100% !important;
  min-height: 0 !important;
  height: auto !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #26324d !important;
  font-size: clamp(11px, 2.65vw, 15px) !important;
  font-weight: 650 !important;
  line-height: 1.75 !important;
  letter-spacing: -.018em !important;
  overflow: visible !important;
  word-break: keep-all !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .exam-feedback .exam-explanation.explanation-hidden {
  display: none !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .question-ask-btn {
  position: absolute !important;
  left: 16px !important;
  bottom: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 7px !important;
  width: auto !important;
  min-width: 0 !important;
  height: 42px !important;
  min-height: 42px !important;
  margin: 0 !important;
  padding: 0 10px 0 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--hy-player-ink) !important;
  box-shadow: none !important;
  font-size: 10px !important;
  font-weight: 850 !important;
  line-height: 1 !important;
  cursor: pointer !important;
  touch-action: manipulation !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .question-chat-svg {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .exam-feedback > .exam-next-btn {
  display: none !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .multi-result-list {
  display: grid !important;
  gap: 5px !important;
  margin: 0 0 10px !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .multi-result-item {
  padding: 11px 12px !important;
  border: 1px solid rgba(156, 178, 167, .35) !important;
  border-radius: 14px !important;
  background: rgba(255, 255, 255, .62) !important;
}

/* Compound-answer summary: restore the two-line thinker cards used in the approved UI. */
html body.exam-tab-active #appRoot#appRoot#appRoot .multi-result-item,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .multi-result-item,
html body.dedicated-ox-player #appRoot#appRoot#appRoot .multi-result-item {
  min-height: 46px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  padding: 6px 10px !important;
  border-width: 1.25px !important;
  border-radius: 13px !important;
  background: #ffffff !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .multi-result-item.correct,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .multi-result-item.correct,
html body.dedicated-ox-player #appRoot#appRoot#appRoot .multi-result-item.correct {
  border-color: #86e6b3 !important;
  background: #effcf5 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .multi-result-item.wrong,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .multi-result-item.wrong,
html body.dedicated-ox-player #appRoot#appRoot#appRoot .multi-result-item.wrong {
  border-color: #f2a4a4 !important;
  background: #fff3f3 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .multi-result-top,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .multi-result-top,
html body.dedicated-ox-player #appRoot#appRoot#appRoot .multi-result-top {
  margin: 0 0 2px !important;
  font-size: clamp(12.5px, 3.35vw, 14px) !important;
  font-weight: 950 !important;
  line-height: 1.2 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .multi-result-detail,
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .multi-result-detail,
html body.dedicated-ox-player #appRoot#appRoot#appRoot .multi-result-detail {
  color: #64748b !important;
  font-size: clamp(10.5px, 2.8vw, 11.5px) !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot :is(#topicPanel.topic-panel, #reviewPanel.review-panel) > .exam-choice-area.exam-fixed-answer-dock {
  position: fixed !important;
  left: 50% !important;
  right: auto !important;
  bottom: calc(12px + env(safe-area-inset-bottom)) !important;
  z-index: 180020 !important;
  display: flex !important;
  align-items: center !important;
  width: min(680px, calc(100vw - 28px)) !important;
  min-width: 0 !important;
  height: var(--hy-player-dock-h) !important;
  min-height: var(--hy-player-dock-h) !important;
  margin: 0 !important;
  padding: 8px !important;
  box-sizing: border-box !important;
  border: 1px solid rgba(218, 224, 234, .98) !important;
  border-radius: 21px !important;
  background: rgba(255, 255, 255, .96) !important;
  box-shadow: 0 18px 50px rgba(27, 40, 71, .14) !important;
  transform: translate3d(-50%, 0, 0) !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  overflow: hidden !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot :is(#topicPanel.topic-panel, #reviewPanel.review-panel) > .exam-choice-area.hidden,
html body.dedicated-ox-player #appRoot#appRoot#appRoot :is(#topicPanel.topic-panel, #reviewPanel.review-panel).learning-has-feedback > .exam-choice-area {
  display: none !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot :is(#topicPanel.topic-panel, #reviewPanel.review-panel) > .exam-choice-area .answer-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot :is(#topicPanel.topic-panel, #reviewPanel.review-panel) > .exam-choice-area .answer-btn {
  display: grid !important;
  place-items: center !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1.5px solid #d7deea !important;
  border-radius: 16px !important;
  background: #fff !important;
  color: var(--hy-player-ink) !important;
  box-shadow: none !important;
  font-size: 32px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot :is(#topicPanel.topic-panel, #reviewPanel.review-panel) > .learning-player-dock.exam-ox-feedback-dock {
  position: fixed !important;
  left: 50% !important;
  right: auto !important;
  bottom: calc(12px + env(safe-area-inset-bottom)) !important;
  z-index: 180030 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto auto !important;
  align-items: center !important;
  gap: 10px !important;
  width: min(680px, calc(100vw - 28px)) !important;
  min-width: 0 !important;
  height: var(--hy-player-feedback-dock-h) !important;
  min-height: var(--hy-player-feedback-dock-h) !important;
  margin: 0 !important;
  padding: 8px 10px 8px 15px !important;
  box-sizing: border-box !important;
  border: 1px solid rgba(218, 224, 234, .98) !important;
  border-radius: 21px !important;
  background: rgba(255, 255, 255, .97) !important;
  box-shadow: 0 18px 50px rgba(27, 40, 71, .14) !important;
  transform: translate3d(-50%, 0, 0) !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  overflow: hidden !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  transition: transform .34s cubic-bezier(.16, 1, .3, 1), opacity .24s ease !important;
  will-change: transform, opacity !important;
}

html body:not(.feedback-dock-always).feedback-dock-hidden.dedicated-ox-player #appRoot#appRoot#appRoot :is(#topicPanel.topic-panel, #reviewPanel.review-panel) > .learning-player-dock.exam-ox-feedback-dock {
  transform: translate3d(-50%, calc(100% + 30px), 0) !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .exam-ox-feedback-dock.feedback-wrong {
  border-color: rgba(236, 211, 215, .98) !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .exam-ox-feedback-dock .exam-dock-message {
  min-width: 0 !important;
  overflow: hidden !important;
  color: var(--hy-player-green) !important;
  font-size: clamp(10px, 2.7vw, 14px) !important;
  font-weight: 950 !important;
  line-height: 1.15 !important;
  letter-spacing: -.025em !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .exam-ox-feedback-dock.feedback-wrong .exam-dock-message {
  color: var(--hy-player-red) !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .exam-ox-feedback-dock .exam-confused-btn {
  display: grid !important;
  place-items: center !important;
  width: auto !important;
  min-width: 72px !important;
  height: 44px !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 0 11px !important;
  border: 1px solid #7fd7b2 !important;
  border-radius: 13px !important;
  background: #fff !important;
  color: var(--hy-player-green) !important;
  box-shadow: none !important;
  font-size: 10px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .exam-ox-feedback-dock .exam-confused-btn[aria-pressed="true"] {
  border-color: var(--hy-player-green) !important;
  background: #eaf8f2 !important;
}

html body.dedicated-ox-player #appRoot#appRoot#appRoot .exam-ox-feedback-dock .exam-next-btn.show {
  display: grid !important;
  place-items: center !important;
  width: auto !important;
  min-width: 96px !important;
  height: 50px !important;
  min-height: 50px !important;
  margin: 0 !important;
  padding: 0 14px !important;
  border: 0 !important;
  border-radius: 15px !important;
  background: var(--hy-player-ink) !important;
  color: #fff !important;
  box-shadow: 0 9px 20px rgba(16, 26, 53, .17) !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

@media (max-width: 520px) {
  html body.dedicated-ox-player #appRoot#appRoot#appRoot {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  html body.dedicated-ox-player #appRoot#appRoot#appRoot .learning-stage .player-topbar {
    grid-template-columns: 36px minmax(0, 1fr) 40px !important;
    gap: 6px !important;
    min-height: 52px !important;
  }

  html body.dedicated-ox-player #appRoot#appRoot#appRoot .learning-stage .player-back-btn {
    width: 36px !important;
    min-width: 36px !important;
    height: 36px !important;
    min-height: 36px !important;
  }

  html body.dedicated-ox-player #appRoot#appRoot#appRoot .learning-stage .player-more-btn {
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
    border-radius: 13px !important;
  }

  html body.dedicated-ox-player #appRoot#appRoot#appRoot .learning-stage .exam-status-card {
    grid-template-columns: minmax(0, 1fr) 56px !important;
    min-height: 72px !important;
    padding: 7px 9px !important;
    border-radius: 20px !important;
  }

  html body.dedicated-ox-player #appRoot#appRoot#appRoot .learning-stage .exam-status-grid {
    height: 48px !important;
  }

  html body.dedicated-ox-player #appRoot#appRoot#appRoot .learning-stage .exam-status-badge {
    width: 52px !important;
    min-width: 52px !important;
    height: 52px !important;
    min-height: 52px !important;
  }

  html body.dedicated-ox-player #appRoot#appRoot#appRoot :is(#topicPanel.topic-panel, #reviewPanel.review-panel) .exam-question-box.exam-chat-window {
    padding: 13px 15px 18px !important;
    border-radius: 20px !important;
  }

  html body.dedicated-ox-player #appRoot#appRoot#appRoot .exam-question {
    font-size: 18px !important;
    line-height: 1.48 !important;
  }

  html body.dedicated-ox-player #appRoot#appRoot#appRoot .exam-feedback {
    min-height: 164px !important;
    padding: 16px 15px 44px !important;
    border-radius: 20px !important;
  }

  html body.dedicated-ox-player #appRoot#appRoot#appRoot :is(#topicPanel.topic-panel, #reviewPanel.review-panel) > .exam-choice-area.exam-fixed-answer-dock,
  html body.dedicated-ox-player #appRoot#appRoot#appRoot :is(#topicPanel.topic-panel, #reviewPanel.review-panel) > .learning-player-dock.exam-ox-feedback-dock {
    width: calc(100vw - 20px) !important;
    bottom: calc(8px + env(safe-area-inset-bottom)) !important;
    border-radius: 19px !important;
  }

  html body.dedicated-ox-player #appRoot#appRoot#appRoot :is(#topicPanel.topic-panel, #reviewPanel.review-panel) > .learning-player-dock.exam-ox-feedback-dock {
    grid-template-columns: minmax(0, 1fr) 68px 84px !important;
    gap: 6px !important;
    padding: 6px 8px 6px 12px !important;
  }

  html body.dedicated-ox-player #appRoot#appRoot#appRoot .exam-ox-feedback-dock .exam-dock-message {
    font-size: 10px !important;
  }

  html body.dedicated-ox-player #appRoot#appRoot#appRoot .exam-ox-feedback-dock .exam-confused-btn {
    width: 68px !important;
    min-width: 68px !important;
    max-width: 68px !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 4px !important;
    font-size: 10px !important;
  }

  html body.dedicated-ox-player #appRoot#appRoot#appRoot .exam-ox-feedback-dock .exam-next-btn.show {
    width: 84px !important;
    min-width: 84px !important;
    max-width: 84px !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 6px !important;
    font-size: 12px !important;
  }
}

/* Daily composite question */
html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .multi-progress,
html body.exam-tab-active #appRoot#appRoot#appRoot .multi-progress {
  flex: 0 0 auto !important;
}

html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .multi-chip,
html body.exam-tab-active #appRoot#appRoot#appRoot .multi-chip {
  font-size: 9px !important;
}

html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .multi-target-box {
  flex: 0 0 auto !important;
  border-radius: 22px !important;
  background: #fff !important;
}

html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .multi-target-title,
html body.exam-tab-active #appRoot#appRoot#appRoot .multi-target-title {
  font-size: 18px !important;
}

html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .multi-target-sub,
html body.exam-tab-active #appRoot#appRoot#appRoot .multi-target-sub {
  font-size: 10px !important;
}

/* Evaluation settings modal */
html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-player-stage.exam-status-header:has(.exam-kebab-menu[open]) {
  position: relative !important;
  z-index: 2147483000 !important;
  isolation: auto !important;
  transform: none !important;
  overflow: visible !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-player-stage.exam-status-header:has(.exam-kebab-menu[open]) > .player-topbar {
  position: relative !important;
  z-index: 2147483001 !important;
  overflow: visible !important;
  pointer-events: auto !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-player-stage.exam-status-header:has(.exam-kebab-menu[open]) > .exam-status-card {
  position: relative !important;
  z-index: 0 !important;
  pointer-events: none !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-kebab-menu[open] {
  z-index: 2147483001 !important;
  isolation: auto !important;
  transform: none !important;
  overflow: visible !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-kebab-menu[open] > .exam-kebab-backdrop {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483002 !important;
  display: block !important;
  width: 100vw !important;
  height: 100dvh !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: rgba(31, 39, 55, .32) !important;
  backdrop-filter: blur(12px) saturate(.85) !important;
  -webkit-backdrop-filter: blur(12px) saturate(.85) !important;
  pointer-events: auto !important;
  touch-action: none !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-kebab-menu[open] > .exam-kebab-panel {
  position: fixed !important;
  left: 50% !important;
  right: auto !important;
  top: 50% !important;
  bottom: auto !important;
  z-index: 2147483003 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 16px !important;
  width: min(620px, calc(100vw - 28px)) !important;
  min-width: 0 !important;
  max-width: 620px !important;
  height: auto !important;
  max-height: calc(100dvh - 28px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
  margin: 0 !important;
  padding: 20px !important;
  box-sizing: border-box !important;
  border: 1px solid rgba(218, 224, 234, .98) !important;
  border-radius: 24px !important;
  background: #fff !important;
  box-shadow: 0 34px 100px rgba(20, 31, 52, .25) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  -webkit-overflow-scrolling: touch !important;
  transform: translate3d(-50%, -50%, 0) !important;
  pointer-events: auto !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-kebab-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  min-height: 44px !important;
  margin: 0 0 4px !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-kebab-title {
  margin: 0 !important;
  color: var(--hy-player-ink) !important;
  font-size: clamp(21px, 4.2vw, 27px) !important;
  font-weight: 950 !important;
  line-height: 1.15 !important;
  letter-spacing: -.045em !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-kebab-close {
  display: grid !important;
  place-items: center !important;
  flex: 0 0 40px !important;
  width: 40px !important;
  min-width: 40px !important;
  height: 40px !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid var(--hy-player-line) !important;
  border-radius: 13px !important;
  background: #fafbfc !important;
  color: var(--hy-player-ink) !important;
  box-shadow: none !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-kebab-close .ui-close-icon {
  width: 20px !important;
  height: 20px !important;
  stroke-width: 1.75 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-source-filter,
html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-year-filter,
html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-set-size-control {
  display: grid !important;
  gap: 9px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-filter-title-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  width: 100% !important;
  min-height: 24px !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-filter-title-row > strong,
html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-order-field > strong {
  margin: 0 !important;
  color: var(--hy-player-ink) !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  line-height: 1.2 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-filter-toggle-all {
  min-width: 0 !important;
  min-height: 32px !important;
  margin: -4px -4px -4px 0 !important;
  padding: 0 4px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: #5d6983 !important;
  box-shadow: none !important;
  font-size: 8px !important;
  font-weight: 750 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-filter-toggle-all[aria-pressed="true"] {
  color: var(--hy-player-green) !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-source-chip-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-source-chip {
  display: grid !important;
  place-items: center !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 0 12px !important;
  border: 1px solid var(--hy-player-line) !important;
  border-radius: 14px !important;
  background: #fff !important;
  color: #69758f !important;
  box-shadow: none !important;
  font-size: 10px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-source-chip[aria-pressed="true"] {
  border-color: var(--hy-player-ink) !important;
  background: var(--hy-player-ink) !important;
  color: #fff !important;
  box-shadow: 0 10px 22px rgba(16, 26, 53, .12) !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-year-chip-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 7px !important;
  min-width: 0 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-year-chip {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 3px !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 52px !important;
  margin: 0 !important;
  padding: 0 5px !important;
  border: 1px solid var(--hy-player-line) !important;
  border-radius: 14px !important;
  background: #fff !important;
  color: #64708a !important;
  box-shadow: none !important;
  line-height: 1 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-year-chip > span {
  font-size: 10px !important;
  font-weight: 900 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-year-chip > small {
  display: block !important;
  height: auto !important;
  min-width: 0 !important;
  padding: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: inherit !important;
  font-size: 8px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-year-chip[aria-pressed="true"] {
  border-color: var(--hy-player-ink) !important;
  background: var(--hy-player-ink) !important;
  color: #fff !important;
  box-shadow: 0 10px 22px rgba(16, 26, 53, .12) !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-year-empty {
  grid-column: 1 / -1 !important;
  color: #8a94a9 !important;
  font-size: 9px !important;
  text-align: center !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-order-field {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 9px !important;
  width: 100% !important;
  margin: 0 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-order-select-wrap {
  position: relative !important;
  display: block !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-order-select-wrap::after {
  content: "" !important;
  position: absolute !important;
  right: 16px !important;
  top: 50% !important;
  width: 9px !important;
  height: 9px !important;
  border-right: 2px solid var(--hy-player-ink) !important;
  border-bottom: 2px solid var(--hy-player-ink) !important;
  transform: translateY(-68%) rotate(45deg) !important;
  pointer-events: none !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox #examOrderModeSelectStage {
  appearance: none !important;
  -webkit-appearance: none !important;
  width: 100% !important;
  height: 46px !important;
  margin: 0 !important;
  padding: 0 42px 0 15px !important;
  border: 1px solid var(--hy-player-line) !important;
  border-radius: 14px !important;
  background: #fafbfe !important;
  color: var(--hy-player-ink) !important;
  font-size: 10px !important;
  font-weight: 850 !important;
  line-height: 1 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-kebab-check {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--hy-player-ink) !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-kebab-check input {
  appearance: none !important;
  -webkit-appearance: none !important;
  flex: 0 0 24px !important;
  width: 24px !important;
  height: 24px !important;
  margin: 0 !important;
  border: 1.5px solid #cfd6e2 !important;
  border-radius: 7px !important;
  background: #fff !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-kebab-check input:checked {
  border-color: var(--hy-player-ink) !important;
  background:
    linear-gradient(135deg, transparent 43%, #fff 43% 51%, transparent 51%) 5px 10px / 7px 5px no-repeat,
    linear-gradient(45deg, transparent 42%, #fff 42% 52%, transparent 52%) 9px 8px / 9px 8px no-repeat,
    var(--hy-player-ink) !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-kebab-check > span {
  color: var(--hy-player-ink) !important;
  font-size: 10px !important;
  font-weight: 850 !important;
  line-height: 1.25 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-set-size-options {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 0 !important;
  min-height: 46px !important;
  padding: 3px !important;
  border: 0 !important;
  border-radius: 14px !important;
  background: #f5f6fa !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-set-size-options > button {
  display: grid !important;
  place-items: center !important;
  min-width: 0 !important;
  height: 40px !important;
  margin: 0 !important;
  padding: 0 6px !important;
  border: 0 !important;
  border-radius: 11px !important;
  background: transparent !important;
  color: #78839a !important;
  box-shadow: none !important;
  font-size: 10px !important;
  font-weight: 850 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-set-size-options > button[aria-pressed="true"] {
  background: #fff !important;
  color: var(--hy-player-ink) !important;
  box-shadow: 0 7px 18px rgba(31, 43, 72, .1) !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-settings-footer {
  display: grid !important;
  grid-template-columns: minmax(112px, .78fr) minmax(0, 1.72fr) !important;
  gap: 9px !important;
  width: 100% !important;
  margin: 2px 0 0 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-settings-reset,
html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-settings-start {
  display: grid !important;
  place-items: center !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 50px !important;
  margin: 0 !important;
  padding: 0 12px !important;
  border-radius: 15px !important;
  box-shadow: none !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-settings-reset {
  border: 1px solid var(--hy-player-line) !important;
  background: #fff !important;
  color: #4e5a73 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-settings-start {
  border: 1px solid var(--hy-player-ink) !important;
  background: var(--hy-player-ink) !important;
  color: #fff !important;
  box-shadow: 0 12px 26px rgba(16, 26, 53, .15) !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-settings-start:disabled {
  border-color: #cfd5df !important;
  background: #dce1e9 !important;
  color: #8c96aa !important;
  box-shadow: none !important;
}

html body.exam-menu-open #appRoot#appRoot#appRoot #examPracticeBox > .exam-player-card,
html body.exam-menu-open #appRoot#appRoot#appRoot #examPracticeBox > .exam-choice-area,
html body.exam-menu-open #appRoot#appRoot#appRoot #examPracticeBox > .learning-player-dock,
html body.exam-menu-open #appRoot#appRoot#appRoot > .bottom-tabbar {
  pointer-events: none !important;
}

@media (max-width: 520px) {
  :root {
    --hy-player-dock-h: 70px;
    --hy-player-feedback-dock-h: 58px;
  }

  html body.exam-tab-active #appRoot#appRoot#appRoot,
  html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  html body.exam-tab-active #appRoot#appRoot#appRoot .player-topbar,
  html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .daily-player-stage > .player-topbar {
    grid-template-columns: 36px minmax(0, 1fr) 40px !important;
    gap: 6px !important;
    min-height: 52px !important;
  }

  html body.exam-tab-active #appRoot#appRoot#appRoot .player-back-btn,
  html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .player-back-btn {
    width: 36px !important;
    min-width: 36px !important;
    height: 36px !important;
    min-height: 36px !important;
  }

  html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .player-more-btn,
  html body.exam-tab-active #appRoot#appRoot#appRoot .exam-kebab-menu,
  html body.exam-tab-active #appRoot#appRoot#appRoot .exam-kebab-menu > summary {
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
    border-radius: 13px !important;
  }

  html body.exam-tab-active #appRoot#appRoot#appRoot .exam-status-card,
  html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .daily-status-card {
    grid-template-columns: minmax(0, 1fr) 56px !important;
    min-height: 72px !important;
    padding: 7px 9px !important;
    border-radius: 20px !important;
  }

  html body.exam-tab-active #appRoot#appRoot#appRoot .exam-status-grid,
  html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .daily-status-grid {
    height: 48px !important;
  }

  html body.exam-tab-active #appRoot#appRoot#appRoot .exam-status-badge,
  html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .daily-accuracy-orb {
    width: 52px !important;
    min-width: 52px !important;
    height: 52px !important;
    min-height: 52px !important;
  }

  html body.exam-tab-active #appRoot#appRoot#appRoot .exam-question-box.exam-chat-window,
  html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .question-box {
    padding: 13px 15px 18px !important;
    border-radius: 20px !important;
  }

  html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox.exam-has-feedback .exam-question-box.exam-chat-window,
  html body.exam-tab-active #appRoot#appRoot#appRoot .exam-player-card.exam-answered .exam-question-box.exam-chat-window,
  html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot #dailyQuizShell > .quiz-card.correct-pop > .question-box,
  html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot #dailyQuizShell > .quiz-card.wrong-pop > .question-box {
    padding: 13px 15px 18px !important;
  }

  html body.exam-tab-active #appRoot#appRoot#appRoot .exam-question,
  html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .question {
    font-size: 18px !important;
    line-height: 1.48 !important;
  }

  html body.exam-tab-active #appRoot#appRoot#appRoot .exam-feedback,
  html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .feedback {
    min-height: 164px !important;
    padding: 16px 15px 44px !important;
    border-radius: 20px !important;
  }

  html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox > .exam-choice-area.exam-fixed-answer-dock,
  html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot #dailyQuizShell > .daily-answer-area,
  html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox > .learning-player-dock.exam-ox-feedback-dock,
  html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot #dailyQuizShell > .learning-player-dock.exam-ox-feedback-dock {
    width: calc(100vw - 20px) !important;
    bottom: calc(8px + env(safe-area-inset-bottom)) !important;
    border-radius: 19px !important;
  }

  html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox > .learning-player-dock.exam-ox-feedback-dock,
  html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot #dailyQuizShell > .learning-player-dock.exam-ox-feedback-dock {
    grid-template-columns: minmax(0, 1fr) 68px 84px !important;
    gap: 6px !important;
    padding: 6px 8px 6px 12px !important;
  }

  html body.exam-tab-active #appRoot#appRoot#appRoot .exam-ox-feedback-dock .exam-dock-message,
  html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .exam-ox-feedback-dock .exam-dock-message {
    font-size: 10px !important;
  }

  html body.exam-tab-active #appRoot#appRoot#appRoot .exam-ox-feedback-dock .exam-confused-btn,
  html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .exam-ox-feedback-dock .exam-confused-btn {
    width: 68px !important;
    min-width: 68px !important;
    max-width: 68px !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 4px !important;
    font-size: 10px !important;
  }

  html body.exam-tab-active #appRoot#appRoot#appRoot .exam-ox-feedback-dock .exam-next-btn.show,
  html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .exam-ox-feedback-dock .next-btn.show {
    width: 84px !important;
    min-width: 84px !important;
    max-width: 84px !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 6px !important;
    font-size: 12px !important;
  }

  html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-kebab-menu[open] > .exam-kebab-panel {
    width: calc(100vw - 20px) !important;
    max-width: none !important;
    max-height: calc(100dvh - 20px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
    gap: 14px !important;
    padding: 18px 16px !important;
    border-radius: 23px !important;
  }

  html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-year-chip-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 7px !important;
  }

  html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-year-chip {
    height: 52px !important;
    padding: 0 2px !important;
  }

  html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-year-chip > span {
    font-size: 10px !important;
  }

  html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-year-chip > small {
    font-size: 8px !important;
  }

  html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-source-chip {
    height: 44px !important;
    font-size: 10px !important;
  }
}

@media (max-height: 720px) {
  html body.exam-tab-active #appRoot#appRoot#appRoot .exam-status-card,
  html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .daily-status-card,
  html body.dedicated-ox-player #appRoot#appRoot#appRoot .learning-stage .exam-status-card {
    min-height: 68px !important;
    padding-top: 6px !important;
    padding-bottom: 6px !important;
  }

  html body.exam-tab-active #appRoot#appRoot#appRoot .exam-status-grid,
  html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .daily-status-grid,
  html body.dedicated-ox-player #appRoot#appRoot#appRoot .learning-stage .exam-status-grid {
    height: 46px !important;
  }

  html body.exam-tab-active #appRoot#appRoot#appRoot .exam-status-badge,
  html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .daily-accuracy-orb,
  html body.dedicated-ox-player #appRoot#appRoot#appRoot .learning-stage .exam-status-badge {
    width: 50px !important;
    min-width: 50px !important;
    height: 50px !important;
    min-height: 50px !important;
  }

  html body.exam-tab-active #appRoot#appRoot#appRoot .exam-question-box.exam-chat-window,
  html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot .question-box {
    min-height: 190px !important;
  }

  html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox .exam-kebab-menu[open] > .exam-kebab-panel {
    gap: 17px !important;
    padding-top: 18px !important;
    padding-bottom: 18px !important;
  }
}

/* V31.75 — evaluation set result, matched to the approved result mockup. */
html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox.exam-set-result-active {
  gap: 0 !important;
  padding-bottom: env(safe-area-inset-bottom) !important;
  overflow: hidden !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox > .exam-set-result {
  display: block !important;
  flex: 1 1 auto !important;
  width: min(100%, 560px) !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 auto !important;
  padding: 0 4px 30px !important;
  box-sizing: border-box !important;
  color: var(--hy-player-ink) !important;
  text-align: center !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior-y: contain !important;
  scrollbar-width: none !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox > .exam-set-result::-webkit-scrollbar {
  display: none !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-result-head {
  display: grid !important;
  grid-template-columns: 44px minmax(0, 1fr) 44px !important;
  align-items: center !important;
  gap: 7px !important;
  width: 100% !important;
  min-height: 78px !important;
  margin: 0 !important;
  padding: 4px 0 10px !important;
  box-sizing: border-box !important;
  text-align: left !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-result-head > div {
  min-width: 0 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-result-head h2,
html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-result-head p {
  margin: 0 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-result-head h2 {
  color: var(--hy-player-ink) !important;
  font-size: 21px !important;
  font-weight: 950 !important;
  line-height: 1.16 !important;
  letter-spacing: -.045em !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-result-head p {
  margin-top: 5px !important;
  color: var(--hy-player-muted) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  letter-spacing: -.02em !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-result-close {
  display: grid !important;
  place-items: center !important;
  width: 44px !important;
  min-width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--hy-player-ink) !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-result-close .ui-remove-icon {
  width: 26px !important;
  height: 26px !important;
  stroke-width: 2.2 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-result-hero {
  width: 100% !important;
  margin: 0 !important;
  padding: 28px 22px 22px !important;
  box-sizing: border-box !important;
  border: 1px solid var(--hy-player-line) !important;
  border-radius: 27px !important;
  background: var(--hy-player-surface) !important;
  box-shadow: none !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-complete-badge {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  min-height: 32px !important;
  margin: 0 !important;
  padding: 0 13px !important;
  color: #178d69 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #eaf8f2 !important;
  font-size: 11px !important;
  font-weight: 850 !important;
  line-height: 1 !important;
  letter-spacing: -.025em !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-complete-badge > span {
  font-size: 16px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-score-ring {
  display: flex !important;
  align-items: baseline !important;
  justify-content: center !important;
  width: 138px !important;
  height: 138px !important;
  margin: 20px auto 17px !important;
  padding-top: 34px !important;
  box-sizing: border-box !important;
  color: #12a79c !important;
  border: 12px solid #e4f5f1 !important;
  border-radius: 50% !important;
  outline: 1px solid #d5ebe6 !important;
  background: #fcfffe !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-score-ring strong {
  color: #12a79c !important;
  font-size: 48px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  letter-spacing: -.07em !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-score-ring small {
  margin-left: 4px !important;
  color: #12a79c !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-result-hero h3 {
  margin: 0 !important;
  color: var(--hy-player-ink) !important;
  font-size: 25px !important;
  font-weight: 950 !important;
  line-height: 1.24 !important;
  letter-spacing: -.055em !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-result-stats {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  width: 100% !important;
  margin: 24px 0 0 !important;
  padding: 17px 0 0 !important;
  border-top: 1px solid var(--hy-player-line) !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-result-stats > div {
  min-width: 0 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-result-stats > div + div {
  border-left: 1px solid var(--hy-player-line) !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-result-stats span {
  display: block !important;
  color: var(--hy-player-muted) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-result-stats strong {
  display: block !important;
  margin-top: 6px !important;
  color: var(--hy-player-ink) !important;
  font-size: 23px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-result-actions {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 10px !important;
  width: 100% !important;
  margin: 16px 0 0 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-result-actions > button {
  display: block !important;
  width: 100% !important;
  min-height: 48px !important;
  margin: 0 !important;
  padding: 0 18px !important;
  color: var(--hy-player-ink) !important;
  border: 1px solid var(--hy-player-line) !important;
  border-radius: 15px !important;
  background: var(--hy-player-surface) !important;
  box-shadow: none !important;
  font-size: 16px !important;
  font-weight: 900 !important;
  line-height: 1.2 !important;
  letter-spacing: -.035em !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-result-actions > button.primary {
  color: #fff !important;
  border-color: var(--hy-player-ink) !important;
  background: var(--hy-player-ink) !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-review-teaser {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  width: 100% !important;
  min-height: 72px !important;
  margin: 16px 0 0 !important;
  padding: 12px 15px !important;
  box-sizing: border-box !important;
  color: var(--hy-player-ink) !important;
  text-align: left !important;
  border: 1px solid var(--hy-player-line) !important;
  border-radius: 18px !important;
  background: var(--hy-player-surface) !important;
  box-shadow: none !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-review-copy {
  display: flex !important;
  align-items: center !important;
  gap: 13px !important;
  min-width: 0 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-review-copy > span:last-child {
  min-width: 0 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-review-icon {
  display: grid !important;
  place-items: center !important;
  flex: 0 0 44px !important;
  width: 44px !important;
  height: 44px !important;
  color: #a36b15 !important;
  border: 1px solid #ecd9ae !important;
  border-radius: 14px !important;
  background: #fff8e8 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-review-icon svg {
  width: 23px !important;
  height: 23px !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-review-copy strong,
html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-review-copy small {
  display: block !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-review-copy strong {
  overflow: hidden !important;
  color: var(--hy-player-ink) !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  line-height: 1.28 !important;
  letter-spacing: -.035em !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-review-copy small {
  margin-top: 5px !important;
  color: var(--hy-player-muted) !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-review-chevron {
  flex: 0 0 20px !important;
  width: 20px !important;
  height: 20px !important;
  color: #9ba7bc !important;
}

html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result > .exam-result-home {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 0 !important;
  min-height: 38px !important;
  margin: 13px auto 0 !important;
  padding: 0 8px !important;
  color: var(--hy-player-muted) !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 13px !important;
  font-weight: 850 !important;
  line-height: 1.2 !important;
  letter-spacing: -.025em !important;
}

@media (max-width: 560px) {
  html body.exam-tab-active #appRoot#appRoot#appRoot #examPracticeBox > .exam-set-result {
    width: 100% !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
  }

  html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-result-head {
    min-height: 78px !important;
  }
}

@media (max-height: 760px) {
  html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-result-hero {
    padding-top: 20px !important;
    padding-bottom: 18px !important;
  }

  html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-score-ring {
    width: 116px !important;
    height: 116px !important;
    margin-top: 14px !important;
    margin-bottom: 12px !important;
    padding-top: 27px !important;
    border-width: 10px !important;
  }

  html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-score-ring strong {
    font-size: 41px !important;
  }

  html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-result-stats {
    margin-top: 18px !important;
    padding-top: 13px !important;
  }

  html body.exam-tab-active #appRoot#appRoot#appRoot .exam-set-result .exam-review-teaser {
    min-height: 74px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body.exam-tab-active #appRoot#appRoot#appRoot *,
  html body.daily-learning-active.ox-player-active #appRoot#appRoot#appRoot * {
    scroll-behavior: auto !important;
  }
}