/* Canonical exercise typography and question types. Cascade order is defined in index.html. */

/* Compact sans-serif reading text. */
.reading-passage,
.reading-passage-text,
.reading-passage-title,
.reading-passage-instruction,
.reading-passage p,
.reading-passage h1,
.reading-passage h2,
.reading-passage h3,
.reading-passage em{
  font-family:Arial,Helvetica,sans-serif!important;
}
.reading-passage-text,
.reading-passage .passage-body,
.reading-passage .rich-passage,
.reading-passage .passage-text{
  font-size:18px!important;
  line-height:1.5!important;
}
.reading-passage-paragraph,
.reading-passage p{
  margin-bottom:12px!important;
  text-align:left!important;
}
.reading-passage-title{line-height:1.2!important;margin-bottom:16px!important}
.reading-passage-instruction{line-height:1.35!important}

/* Questions are bold; option text remains regular. */
.reading-questions .reading-question-scroll{
  font-family:Arial,Helvetica,sans-serif!important;
  font-size:18px!important;
  line-height:1.45!important;
}
.reading-questions .reading-question-text,
.reading-questions .mc-prompt,
.reading-questions .open-response-prompt,
.reading-questions .matching-prompt{
  font-family:Arial,Helvetica,sans-serif!important;
  font-size:18px!important;
  line-height:1.45!important;
  font-weight:700!important;
}
.reading-questions .mc-text{
  font-family:Arial,Helvetica,sans-serif!important;
  font-size:18px!important;
  line-height:1.45!important;
  font-weight:400!important;
}
.reading-questions .mc-group:not(.ms-group):not(.tfng-row) .mc-label{
  font-size:18px!important;
  line-height:1.45!important;
}

/* Prompt-free/cloze questions follow the compact reference layout. */
.reading-questions .mc-group.promptless{padding:18px 0 24px!important}
.cloze-question-header{
  display:block!important;
  width:100%!important;
  white-space:nowrap!important;
  margin:0 0 14px!important;
  font-family:Arial,Helvetica,sans-serif!important;
  font-size:19px!important;
  line-height:1.35!important;
  font-weight:700!important;
}
.mc-group.promptless>.mc-options,
.exam-compact-cloze>.mc-group>.mc-options{display:grid!important;width:100%!important}
.reading-questions .mc-group.promptless .mc-options:not(.mc-long){
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  column-gap:34px!important;
  row-gap:8px!important;
}
.reading-questions .mc-group.promptless .mc-option{
  padding:9px 10px!important;
  font-weight:400!important;
}
.reading-questions .mc-group.promptless .mc-label{font-weight:700!important}
.reading-questions .mc-group.promptless .mc-text{font-weight:400!important}

/* These two exercise types intentionally keep normal-weight prompts. */
.reading-questions .tfng-row .mc-prompt,
.reading-questions .tfng-row .reading-question-text,
.reading-questions .tf-prompt,
.reading-questions .open-response.compact-reference .open-response-prompt{
  font-size:18px!important;
  line-height:1.45!important;
  font-weight:400!important;
}
@media(max-width:620px){
  .reading-questions .mc-group.promptless .mc-options:not(.mc-long){grid-template-columns:1fr!important}
}

/* One typography system for every exercise layout. */
:is(#preview,#studentPreview,.reading-shell,.exam-shell,.quiz-shell,.exercise-tab-panel){
  font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif!important;
  font-size:18px!important;
  line-height:1.5!important;
}

/* Exercise text, prompts and answer choices share the same size. */
:is(#preview,#studentPreview,.reading-shell,.exam-shell,.quiz-shell,.exercise-tab-panel)
:is(.reading-passage-text,.reading-passage-paragraph,.passage-body,.rich-passage,.passage-text,
    .mc-prompt,.reading-question-text,.mc-option,.mc-label,.mc-text,.tf-prompt,
    .open-response-prompt,.open-response-input,.matching-prompt,.matching-item,
    .dd-item,.dd-pill,.dd-slot,.ic-item,.ic-option,.ec-sentence,.ec-input,
    .st-original,.st-target,.qline,.exam-arr-text,.exam-source-arrangement-line){
  font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif!important;
  font-size:18px!important;
  line-height:1.5!important;
}

/* Titles remain visually distinct. */
:is(#preview,#studentPreview,.reading-shell,.exam-shell,.quiz-shell,.exercise-tab-panel)
:is(.reading-passage-title,.quiz-title,.exam-title,h1.exercise-title,h2.exercise-title,h3.exercise-title){
  font-family:Georgia,"Times New Roman",serif!important;
  font-weight:700!important;
}
.reading-passage-title{font-size:28px!important;line-height:1.25!important}
.quiz-title,.exam-title{font-size:20px!important;line-height:1.3!important}

/* Instructions use Georgia but keep the same 18px reading size. */
:is(#preview,#studentPreview,.reading-shell,.exam-shell,.quiz-shell,.exercise-tab-panel)
:is(.instruction-box,.instruction-text,.instructions-block,.instruction,
    .instructions,.reading-passage-instruction,.exam-question-instruction){
  font-family:Georgia,"Times New Roman",serif!important;
  font-size:18px!important;
  line-height:1.5!important;
}

/* Preserve the intended prompt weights. */
:is(#preview,#studentPreview,.reading-shell,.exam-shell,.quiz-shell,.exercise-tab-panel)
.mc-group:not(.tfng-row) .mc-prompt,
:is(#preview,#studentPreview,.reading-shell,.exam-shell,.quiz-shell,.exercise-tab-panel)
.open-response:not(.compact-reference) .open-response-prompt,
:is(#preview,#studentPreview,.reading-shell,.exam-shell,.quiz-shell,.exercise-tab-panel)
.matching-prompt{font-weight:700!important}
:is(#preview,#studentPreview,.reading-shell,.exam-shell,.quiz-shell,.exercise-tab-panel)
:is(.mc-text,.mc-option){font-weight:400!important}
.reading-questions .tfng-row .mc-prompt,
.reading-questions .tfng-row .reading-question-text,
.reading-questions .tf-prompt,
.reading-questions .open-response.compact-reference .open-response-prompt{font-weight:400!important}

/* Canonical UI for Matching, T/F/NG and Reference. */
.matching-block{
  margin:10px 0 22px!important;
  font-weight:400!important;
}
.matching-prompt{
  margin:0 0 12px!important;
  font-weight:700!important;
}
.matching-prompt .reading-question-number{display:none!important}
.matching-bank{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:8px!important;
  margin:0 0 14px!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
}
.matching-pill{
  display:inline-flex!important;
  align-items:flex-start!important;
  gap:6px!important;
  padding:7px 10px!important;
  border:1px solid #d5dce8!important;
  border-radius:7px!important;
  background:transparent!important;
  color:inherit!important;
  box-shadow:none!important;
  font-weight:400!important;
  text-align:left!important;
  justify-content:flex-start!important;
}
.matching-pill>span:last-child{text-align:left!important}
.matching-pill:hover,.matching-pill.selected{
  border-color:#84adff!important;
  background:#eef4ff!important;
  color:#1849a9!important;
}
.matching-pill-code{font-weight:700!important}
.matching-pill.used{opacity:.38!important}
.matching-table{
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  overflow:visible!important;
}
.matching-head{display:none!important}
.matching-row{
  display:grid!important;
  grid-template-columns:minmax(135px,.65fr) minmax(220px,1.5fr)!important;
  gap:14px!important;
  align-items:center!important;
  margin:0!important;
  padding:6px 0!important;
  border:0!important;
  background:transparent!important;
}
.matching-head>div,.matching-row>div{padding:0!important}
.matching-left{font-weight:400!important}
.matching-choice-wrap{display:flex!important;align-items:center!important}
.matching-drop{
  display:flex!important;
  align-items:center!important;
  width:100%!important;
  min-height:40px!important;
  padding:6px 10px!important;
  border:1px dashed #c4cedd!important;
  border-radius:7px!important;
  background:transparent!important;
  font-weight:400!important;
}
.matching-drop.filled{
  border-style:solid!important;
  border-color:#9bb7ff!important;
  background:#e8f0ff!important;
  color:#1849a9!important;
}
.matching-drop.drag-over{border-color:#155eef!important;background:#eff4ff!important}
.matching-drop.correct{border-color:#12b76a!important;background:#ecfdf3!important;color:#087443!important}
.matching-drop.wrong{border-color:#f04438!important;background:#fef3f2!important;color:#b42318!important}
.matching-drop.revealed{border-color:#84adff!important;background:#eff4ff!important;color:#194185!important}
.matching-placed{display:flex!important;align-items:flex-start!important;gap:7px!important}
.matching-remove{margin-left:auto!important;padding:1px 6px!important;border:0!important;background:transparent!important;color:inherit!important}

.reading-questions .tfng-row{
  grid-template-columns:minmax(0,1fr) auto!important;
  gap:14px!important;
  padding:10px 0!important;
}
.reading-questions .tfng-row .reading-question-number{
  display:inline-block!important;
  margin-right:8px!important;
  font-weight:700!important;
}
.reading-questions .tfng-row .mc-prompt,
.reading-questions .tfng-row .reading-question-text{
  margin:0!important;
  font-weight:400!important;
}
.reading-questions .tfng-row .mc-prompt{
  display:grid!important;
  grid-template-columns:28px minmax(0,1fr)!important;
  gap:4px!important;
  align-items:start!important;
}
.reading-questions .tfng-row .reading-question-text{display:block!important}
.reading-questions .tfng-row .mc-options{display:flex!important;gap:6px!important}
.reading-questions .tfng-row .mc-option{
  min-width:48px!important;
  min-height:40px!important;
  justify-content:center!important;
  padding:6px 9px!important;
  border:1px solid #d5dce8!important;
  border-radius:7px!important;
  background:transparent!important;
}
.reading-questions .tfng-row .mc-option.selected{
  border-color:#9bb7ff!important;
  background:#e8f0ff!important;
  color:#2457e6!important;
}
.reading-questions .tfng-row .mc-option.selected:hover{background:#e8f0ff!important}
.reading-questions .tfng-row .mc-label{display:none!important}
.reading-questions .tfng-row .mc-text{
  font-weight:700!important;
  text-align:center!important;
}

.open-response.compact-reference{
  margin:0!important;
  padding:16px 0 18px!important;
  font-weight:400!important;
}
.open-response.compact-reference .open-response-prompt,
.open-response.compact-reference .reading-question-text{
  font-weight:400!important;
}
.open-response.compact-reference .reading-question-text strong{font-weight:700!important}
.open-response.compact-reference .open-response-input{
  min-height:44px!important;
  height:44px!important;
  margin-top:9px!important;
}

/* Canonical split footer: one full-width footer for both panes. */
:is(#preview,#studentPreview) .reading-shell{
  grid-template-rows:minmax(0,1fr) auto!important;
}
:is(#preview,#studentPreview) .reading-shell>.reading-passage{grid-column:1!important;grid-row:1!important}
:is(#preview,#studentPreview) .reading-shell>.reading-resizer{grid-column:2!important;grid-row:1!important}
:is(#preview,#studentPreview) .reading-shell>.reading-questions{grid-column:3!important;grid-row:1!important}
:is(#preview,#studentPreview) .reading-shell>.reading-actions{
  grid-column:1/-1!important;
  grid-row:2!important;
  position:relative!important;
  z-index:30!important;
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
  min-width:0!important;
  padding:4px 7px!important;
  border-top:1px solid #e3e7ef!important;
  background:rgba(255,255,255,.97)!important;
}
:is(#preview,#studentPreview) .reading-actions .reading-action-buttons{
  display:flex!important;
  flex:0 0 auto!important;
  align-items:center!important;
  gap:5px!important;
  margin-left:auto!important;
}
:is(#preview,#studentPreview) .reading-actions>.reading-qnav{
  position:static!important;
  inset:auto!important;
  z-index:auto!important;
  display:flex!important;
  flex:1 1 auto!important;
  flex-wrap:wrap!important;
  justify-content:flex-start!important;
  gap:0!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  max-height:72px!important;
  overflow:hidden!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  scrollbar-width:thin;
}
:is(#preview,#studentPreview) .reading-actions>.reading-qnav button{
  flex:0 0 36px!important;
  width:36px!important;
  min-width:36px!important;
  height:36px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
}
:is(#preview,#studentPreview) .reading-actions>.reading-qnav button.active:not(.nav-correct):not(.nav-wrong){
  background:#e5e7eb!important;color:#172033!important;outline:0!important;box-shadow:none!important;
}
:is(#preview,#studentPreview) .reading-actions>.reading-qnav button.answered{
  background:#e8f0ff!important;color:#2457e6!important;
}
:is(#preview,#studentPreview) .reading-actions>.reading-qnav button.nav-correct{
  background:#ecfdf3!important;color:#087443!important;
}
:is(#preview,#studentPreview) .reading-actions>.reading-qnav button.nav-wrong{
  background:#fef3f2!important;color:#b42318!important;
}
@media(max-width:700px){
  :is(#preview,#studentPreview) .reading-shell{display:block!important}
  :is(#preview,#studentPreview) .reading-shell>.reading-actions{position:sticky!important;bottom:0!important;align-items:flex-start!important;flex-direction:column!important;padding:3px 5px!important}
  :is(#preview,#studentPreview) .reading-actions>.reading-qnav{width:100%!important;justify-content:flex-start!important}
  :is(#preview,#studentPreview) .reading-actions .reading-action-buttons{align-self:flex-end!important}
}

/* One tab system for tabbed exercises, reading collections and exams. */
:is(#preview,#studentPreview) :is(.exercise-tabs-bar,.rc-tabs,.exam-horizontal-parts){
  display:flex!important;
  align-items:center!important;
  gap:5px!important;
  padding:4px 7px!important;
  border-bottom:1px solid #dfe5ee!important;
  background:#f5f7fb!important;
}
:is(#preview,#studentPreview) :is(.exercise-tab-btn,.rc-tab,.exam-tab){
  position:relative!important;
  z-index:1!important;
  height:32px!important;
  min-width:0!important;
  padding:0 11px!important;
  border:1px solid #d5dce8!important;
  border-radius:8px!important;
  background:#fff!important;
  color:#667085!important;
  box-shadow:none!important;
  font-size:13px!important;
  font-weight:700!important;
  line-height:1.2!important;
  text-align:left!important;
}
:is(#preview,#studentPreview) :is(.exercise-tab-btn,.rc-tab,.exam-tab):hover{
  border-color:#9bb7ff!important;
  background:#eef4ff!important;
  color:#1849a9!important;
}
:is(#preview,#studentPreview) :is(.exercise-tab-btn,.rc-tab,.exam-tab).active{
  z-index:2!important;
  border-color:#2457e6!important;
  background:#2457e6!important;
  color:#fff!important;
  box-shadow:none!important;
}
:is(#preview,#studentPreview) .rc-tab .rc-dot{background:#98a2b3!important;opacity:.75!important}
:is(#preview,#studentPreview) .rc-tab.has-answer:not(.active) .rc-dot{background:#12b76a!important;opacity:1!important}
:is(#preview,#studentPreview) .rc-tab.active .rc-dot{background:#fff!important;opacity:1!important}
html[data-theme="dark"] :is(#preview,#studentPreview) :is(.exercise-tabs-bar,.rc-tabs,.exam-horizontal-parts){background:#172033!important;border-color:#34435a!important}
html[data-theme="dark"] :is(#preview,#studentPreview) :is(.exercise-tab-btn,.rc-tab,.exam-tab){background:#1b2638!important;color:#aebbd0!important;border-color:#34435a!important}
html[data-theme="dark"] :is(#preview,#studentPreview) :is(.exercise-tab-btn,.rc-tab,.exam-tab).active{background:#2f66e8!important;color:#fff!important;border-color:#5b8cff!important}

/* Canonical exam header/footer: compact two-line parts, navigator at bottom-left. */
:is(#preview,#studentPreview) .exam-v5-2 .exam-horizontal-parts{
  padding:3px 6px 4px!important;
  overflow:visible!important;
}
:is(#preview,#studentPreview) .exam-v5-2 .exam-horizontal-parts .exam-tabs{
  width:100%!important;
  min-width:0!important;
  gap:4px!important;
  flex-wrap:wrap!important;
}
:is(#preview,#studentPreview) .exam-v5-2 .exam-horizontal-parts .exam-tab{
  flex:1 1 125px!important;
  height:auto!important;
  min-height:42px!important;
  min-width:118px!important;
  max-width:170px!important;
  padding:4px 7px!important;
  line-height:1.25!important;
}
:is(#preview,#studentPreview) .exam-v5-2 .exam-tab-title{
  display:block!important;
  white-space:nowrap!important;
  font-size:13px!important;
  font-weight:800!important;
}
:is(#preview,#studentPreview) .exam-v5-2 .exam-tab-sub{display:none!important}
:is(#preview,#studentPreview) .exam-v5-2 .exam-tab-count{
  display:block!important;
  margin-top:1px!important;
  white-space:nowrap!important;
  font-size:11px!important;
  line-height:1.2!important;
}
:is(#preview,#studentPreview) .exam-v5-2 .exam-actions{
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
  min-width:0!important;
  padding:4px 7px!important;
}
:is(#preview,#studentPreview) .exam-v5-2 .exam-actions>.exam-global-nav{
  position:static!important;
  inset:auto!important;
  z-index:auto!important;
  display:flex!important;
  flex:1 1 auto!important;
  align-items:center!important;
  gap:5px!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  overflow:visible!important;
  border:0!important;
  background:transparent!important;
}
:is(#preview,#studentPreview) .exam-actions .exam-global-nav .exam-qgrid{
  display:flex!important;
  flex:1 1 auto!important;
  flex-wrap:wrap!important;
  align-content:center!important;
  gap:0!important;
  min-width:0!important;
  padding:0!important;
  max-height:72px!important;
  overflow:hidden!important;
}
:is(#preview,#studentPreview) .exam-actions .exam-qbtn{
  flex:0 0 36px!important;
  width:36px!important;
  min-width:36px!important;
  height:36px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
}
:is(#preview,#studentPreview) .exam-actions .exam-qbtn.active:not(.nav-correct):not(.nav-wrong){
  background:#e5e7eb!important;color:#172033!important;outline:0!important;box-shadow:none!important;
}
:is(#preview,#studentPreview) .exam-actions .exam-qbtn.answered{
  background:#e8f0ff!important;color:#2457e6!important;outline:0!important;
}
:is(#preview,#studentPreview) .exam-actions .exam-qbtn.nav-correct{
  background:#ecfdf3!important;color:#087443!important;outline:0!important;
}
:is(#preview,#studentPreview) .exam-actions .exam-qbtn.nav-wrong{
  background:#fef3f2!important;color:#b42318!important;outline:0!important;
}
:is(#preview,#studentPreview) .exam-v5-2 .exam-action-buttons{
  display:flex!important;
  flex:0 0 auto!important;
  align-items:center!important;
  gap:5px!important;
  margin-left:auto!important;
}
:is(#preview,#studentPreview) .exam-v5-2 .exam-action-buttons .exam-submit{margin-left:0!important}
@media(max-width:760px){
  :is(#preview,#studentPreview) .exam-v5-2 .exam-actions{align-items:flex-start!important;flex-direction:column!important;padding:3px 5px!important}
  :is(#preview,#studentPreview) .exam-v5-2 .exam-actions>.exam-global-nav{width:100%!important}
  :is(#preview,#studentPreview) .exam-v5-2 .exam-action-buttons{width:100%!important;margin-left:0!important;overflow-x:auto!important}
}

/* Prompt-free arrangement questions: keep “Question 1.” on one line. */
.exam-question-pane .exam-arr-qno{
  display:block!important;
  width:max-content!important;
  max-width:100%!important;
  white-space:nowrap!important;
  margin:0 0 14px!important;
  font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif!important;
  font-size:19px!important;
  line-height:1.35!important;
  font-weight:700!important;
}
.exam-question-pane .exam-arrangement .mc-group{display:block!important;margin:0 0 24px!important}
.exam-question-pane .exam-arrangement .mc-options{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:8px 22px!important;
}
@media(max-width:620px){
  .matching-row{grid-template-columns:1fr!important;gap:6px!important;padding:8px 0!important}
  .exam-question-pane .exam-arrangement .mc-options{grid-template-columns:1fr!important}
}