/* Shared AP Micro FRQ-style desk for every teacher-marked written response.
   The answer paper keeps its full natural height. The secure guide stretches
   to that same grid row and scrolls only inside its own content panel. */
@media (min-width: 981px) {
  #teacher-diagram-marking .q19-marking-workflow,
  #teacher-analysis-marking .q20-marking-desk.unified-teacher-marking-desk,
  #teacher-evaluation-marking .q21-marking-layout.unified-teacher-marking-desk {
    display: grid;
    grid-template-columns: minmax(0, 1.16fr) minmax(420px, 0.94fr);
    grid-template-areas:
      "question question"
      "paper scheme"
      "feedback feedback"
      "history history";
    align-items: stretch;
    gap: 18px;
    overflow-x: hidden;
  }

  #teacher-diagram-marking .q19-marking-question,
  #teacher-analysis-marking .q20-marking-question,
  #teacher-evaluation-marking .q21-marking-question-card { grid-area: question; }
  #teacher-diagram-marking .q19-marking-answer,
  #teacher-analysis-marking .q20-marking-answer,
  #teacher-evaluation-marking .q21-marking-paper { grid-area: paper; min-width: 0; }
  #teacher-diagram-marking .q19-marking-feedback-bottom,
  #teacher-analysis-marking .q20-marking-sidebar,
  #teacher-evaluation-marking .q21-marking-sidebar { grid-area: feedback; min-width: 0; position: static; }
  #teacher-diagram-marking .q20-marking-history,
  #teacher-analysis-marking .q20-marking-history,
  #teacher-evaluation-marking .q21-marking-history { grid-area: history; }
  #teacher-evaluation-marking .q21-marking-main { display: contents; }

  #teacher-diagram-marking .q19-marking-scheme,
  #teacher-analysis-marking .q20-marking-desk.unified-teacher-marking-desk > .unified-marking-scheme,
  #teacher-evaluation-marking .q21-marking-layout.unified-teacher-marking-desk > .unified-marking-scheme {
    grid-area: scheme;
    min-width: 0;
    height: auto;
    min-height: 0;
    max-height: none;
    overflow: hidden;
    position: static;
    align-self: stretch;
    display: flex;
    flex-direction: column;
  }

  #teacher-analysis-marking .q20-marking-desk.unified-teacher-marking-desk > .unified-marking-scheme {
    height: auto;
    min-height: 0;
    max-height: none;
  }

  #teacher-diagram-marking .q19-marking-answer,
  #teacher-analysis-marking .q20-marking-answer,
  #teacher-evaluation-marking .q21-marking-paper {
    height: auto;
    min-height: 0;
    max-height: none;
    overflow: visible;
  }
}

#teacher-diagram-marking .q19-marking-scheme > details,
#teacher-analysis-marking .unified-marking-scheme > details,
#teacher-evaluation-marking .unified-marking-scheme > details {
  display: flex;
  flex: 1 1 auto;
  min-height: 0;
  flex-direction: column;
}

#teacher-analysis-marking .unified-marking-scheme,
#teacher-evaluation-marking .unified-marking-scheme {
  box-sizing: border-box;
  background: #fff;
  border: 1px solid #e0e5ef;
  border-radius: 16px;
  padding: 24px;
}

#teacher-analysis-marking .unified-marking-scheme h2,
#teacher-evaluation-marking .unified-marking-scheme h2 { margin: 6px 0 14px; }

#teacher-analysis-marking .unified-marking-scheme > details > summary,
#teacher-evaluation-marking .unified-marking-scheme > details > summary {
  color: #5060c7;
  cursor: pointer;
  font-weight: 800;
}

#teacher-diagram-marking .q19-marking-scheme > details > div,
#teacher-analysis-marking .unified-marking-scheme > details > div,
#teacher-evaluation-marking .unified-marking-scheme > details > div {
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  padding-right: 10px;
}

#teacher-diagram-marking .secure-marking-guide,
#teacher-analysis-marking .secure-marking-guide,
#teacher-evaluation-marking .secure-marking-guide {
  min-width: 0;
  overflow-wrap: anywhere;
}

#teacher-diagram-marking .secure-marking-guide table,
#teacher-analysis-marking .secure-marking-guide table,
#teacher-evaluation-marking .secure-marking-guide table {
  width: 100%;
  table-layout: fixed;
}

#teacher-diagram-marking .secure-marking-guide th:nth-child(1),
#teacher-diagram-marking .secure-marking-guide td:nth-child(1),
#teacher-analysis-marking .secure-marking-guide th:nth-child(1),
#teacher-analysis-marking .secure-marking-guide td:nth-child(1),
#teacher-evaluation-marking .secure-marking-guide th:nth-child(1),
#teacher-evaluation-marking .secure-marking-guide td:nth-child(1) { width: 72px; white-space: nowrap; }

#teacher-diagram-marking .secure-marking-guide th:nth-child(2),
#teacher-diagram-marking .secure-marking-guide td:nth-child(2),
#teacher-analysis-marking .secure-marking-guide th:nth-child(2),
#teacher-analysis-marking .secure-marking-guide td:nth-child(2),
#teacher-evaluation-marking .secure-marking-guide th:nth-child(2),
#teacher-evaluation-marking .secure-marking-guide td:nth-child(2) { width: 86px; white-space: nowrap; }

#teacher-diagram-marking .marking-ao-grid,
#teacher-analysis-marking .marking-ao-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin: 16px 0 8px;
}

#teacher-diagram-marking .marking-score-card,
#teacher-analysis-marking .marking-score-card {
  min-width: 0;
  display: grid;
  gap: 5px;
  padding: 12px;
  border: 1px solid #dcdce2;
  border-radius: 10px;
  background: #fff;
}

#teacher-diagram-marking .marking-score-card small,
#teacher-analysis-marking .marking-score-card small { color: #697386; font-size: 12px; }
#teacher-diagram-marking .marking-score-card > div,
#teacher-analysis-marking .marking-score-card > div { display: flex; align-items: center; gap: 8px; }
#teacher-diagram-marking .marking-score-card input,
#teacher-analysis-marking .marking-score-card input { width: 64px; min-width: 0; }
#teacher-diagram-marking .marking-score-card.is-not-assessed,
#teacher-analysis-marking .marking-score-card.is-not-assessed { background: #f7f8fb; }
#teacher-diagram-marking .marking-ao-total,
#teacher-analysis-marking .marking-ao-total { margin: 0; font-variant-numeric: tabular-nums; }
#teacher-diagram-marking .marking-ao-legacy-score,
#teacher-analysis-marking .marking-ao-legacy-score { margin: 10px 0 0; color: #697386; }

#teacher-data-response-marking .q18-ao-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin: 14px 0 8px; }
#teacher-data-response-marking .q18-ao-grid .marking-score-card { min-width: 0; display: grid; gap: 5px; padding: 10px; border: 1px solid #dcdce2; border-radius: 10px; background: #fff; }
#teacher-data-response-marking .q18-ao-grid .marking-score-card small { color: #697386; font-size: 12px; }
#teacher-data-response-marking .q18-ao-grid .marking-score-card > div { display: flex; align-items: center; gap: 6px; }
#teacher-data-response-marking .q18-ao-grid .marking-score-card input { width: 56px; min-width: 0; }
#teacher-data-response-marking .q18-ao-grid .marking-score-card.is-not-assessed { background: #f7f8fb; }
#teacher-data-response-marking .marking-ao-total { margin: 0 0 12px; font-variant-numeric: tabular-nums; }

/* Q19's score form is a full-width review step.  Do not put AO cards in the
   narrow score column that the earlier two-column feedback form used. */
@media (min-width: 981px) {
  #teacher-diagram-marking .q19-marking-feedback-bottom form {
    grid-template-columns: minmax(0, 1fr);
  }

  #teacher-diagram-marking .q19-marking-feedback-bottom .q19-score-panel,
  #teacher-diagram-marking .q19-marking-feedback-bottom .marking-feedback-card {
    grid-column: 1 / -1;
  }

  #teacher-diagram-marking .marking-ao-grid {
    grid-template-columns: repeat(4, minmax(148px, 1fr));
  }

  #teacher-diagram-marking .marking-score-card > div {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 5px;
  }

  #teacher-diagram-marking .marking-score-card input {
    box-sizing: border-box;
    width: 100%;
  }
}

@media (max-width: 980px) {
  #teacher-diagram-marking .marking-ao-grid,
  #teacher-analysis-marking .marking-ao-grid,
  #teacher-data-response-marking .q18-ao-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #teacher-diagram-marking .q19-marking-scheme,
  #teacher-analysis-marking .unified-marking-scheme,
  #teacher-evaluation-marking .unified-marking-scheme { max-height: 680px; }
}

/* Q21 uses the same teacher desk as Q19 and Q20: full answer paper on the
   left, an independently scrolling guide on the right, then scoring below. */
#teacher-evaluation-marking .q21-marking-page {
  max-width: none;
}

/* The card itself owns vertical scrolling. Native details adds an anonymous
   content box, so flexing its child div cannot reliably constrain the guide. */
@media (min-width: 981px) {
  #teacher-diagram-marking .q19-marking-scheme,
  #teacher-analysis-marking .q20-marking-desk.unified-teacher-marking-desk > .unified-marking-scheme,
  #teacher-evaluation-marking .q21-marking-layout.unified-teacher-marking-desk > .unified-marking-scheme {
    contain: size;
    display: block;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
  }
}

#teacher-diagram-marking .q19-marking-scheme > details,
#teacher-analysis-marking .unified-marking-scheme > details,
#teacher-evaluation-marking .unified-marking-scheme > details {
  display: block;
}

#teacher-diagram-marking .q19-marking-scheme > details > div,
#teacher-analysis-marking .unified-marking-scheme > details > div,
#teacher-evaluation-marking .unified-marking-scheme > details > div {
  overflow: visible;
}

#teacher-diagram-marking .q19-marking-scheme .secure-marking-guide-panel[open],
#teacher-analysis-marking .q20-marking-desk.unified-teacher-marking-desk > .unified-marking-scheme .secure-marking-guide-panel[open] {
  display: block;
  overflow: visible;
}

#teacher-diagram-marking .q19-marking-scheme .secure-marking-guide-panel[open] > div,
#teacher-analysis-marking .q20-marking-desk.unified-teacher-marking-desk > .unified-marking-scheme .secure-marking-guide-panel[open] > div {
  overflow: visible;
}

#teacher-evaluation-marking .q21-marking-extract {
  border-top: 1px solid #e7ebf1;
  margin-top: 18px;
  padding-top: 14px;
}

#teacher-evaluation-marking .q21-marking-extract summary {
  color: #5060c7;
  cursor: pointer;
  font-weight: 700;
}

#teacher-evaluation-marking .q21-marking-extract img {
  max-width: 100%;
  height: auto;
}

@media (max-width: 980px) {
  #teacher-diagram-marking .q19-marking-scheme,
  #teacher-analysis-marking .unified-marking-scheme,
  #teacher-evaluation-marking .unified-marking-scheme {
    overflow-y: auto;
    overflow-x: hidden;
  }
}

#teacher-evaluation-marking .q21-marking-layout.unified-teacher-marking-desk {
  margin: 0;
  max-width: none;
  width: 100%;
}

/* Q20 and Q21 deliberately share the same paper shell: file bar, annotation
   toolbar, then the PDF pages.  Keeping this one sequence prevents Q21 from
   reserving a blank preview stage before its toolbar or PDF has rendered. */
#teacher-analysis-marking .q20-marking-answer.ap-frq-teacher-paper,
#teacher-evaluation-marking .q21-marking-paper.ap-frq-teacher-paper {
  background: #fff;
  border: 1px solid #e0e5ef;
  border-radius: 16px;
  min-height: 0;
  overflow: hidden;
}

#teacher-analysis-marking .q20-marking-answer.ap-frq-teacher-paper > .ap-frq-teacher-paper-head,
#teacher-evaluation-marking .q21-marking-paper.ap-frq-teacher-paper > .ap-frq-teacher-paper-head {
  align-items: flex-start;
  background: #fff;
  border-bottom: 1px solid #e7ebf1;
  display: flex;
  gap: 16px;
  min-height: 0;
  justify-content: space-between;
  padding: 18px 20px;
}

#teacher-analysis-marking .q20-marking-answer.ap-frq-teacher-paper > .ap-frq-annotation-toolbar,
#teacher-evaluation-marking .q21-marking-paper.ap-frq-teacher-paper > .ap-frq-annotation-toolbar {
  border-bottom: 1px solid #e7ebf1;
  border-top: 0;
  min-height: 0;
}

#teacher-analysis-marking .q20-marking-answer.ap-frq-teacher-paper > .ap-frq-teacher-preview,
#teacher-evaluation-marking .q21-marking-paper.ap-frq-teacher-paper > .ap-frq-teacher-preview {
  background: #f5f5f7;
  display: block;
  height: auto;
  min-height: 720px;
  overflow: visible;
  padding: 0;
}

#teacher-analysis-marking .q20-marking-answer.ap-frq-teacher-paper > .ap-frq-teacher-preview > .ap-frq-pdf-annotator,
#teacher-evaluation-marking .q21-marking-paper.ap-frq-teacher-paper > .ap-frq-teacher-preview > .ap-frq-pdf-annotator {
  min-height: 0;
  padding: 18px;
}

#teacher-evaluation-marking .marking-score-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(148px, 1fr));
  gap: 12px;
  margin-top: 16px;
}

#teacher-evaluation-marking .marking-score-card {
  background: #fff;
  border: 1px solid #dcdce2;
  border-radius: 10px;
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 12px;
}

#teacher-evaluation-marking .marking-score-card > small {
  color: #697386;
  font-size: 12px;
}

#teacher-evaluation-marking .marking-score-card > div {
  align-items: center;
  display: grid;
  gap: 5px;
  grid-template-columns: minmax(0, 1fr) auto;
}

#teacher-evaluation-marking .marking-score-card input {
  box-sizing: border-box;
  min-width: 0;
  width: 100%;
}

@media (max-width: 980px) {
  #teacher-evaluation-marking .marking-score-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  #teacher-evaluation-marking .q21-marking-paper > .q21-marking-preview-stage {
    padding: 14px;
  }
}

/* Q18 now uses the same full answer-paper desk as Q19, Q20 and Q21.  The
   paper keeps its natural height; the paired MARK SCHEME owns the scrollbar
   and always ends at the same point as the answer-paper row. */
#teacher-data-response-marking.view {
  box-sizing: border-box;
  margin: 0;
  max-width: none;
  min-width: 0;
  padding: 18px 12px 56px;
  width: 100%;
}

#teacher-data-response-marking .q18-marking-desk.q18-marking-workflow {
  display: grid;
  gap: 18px;
  grid-template-areas:
    "question"
    "paper"
    "scheme"
    "feedback"
    "history";
  grid-template-columns: minmax(0, 1fr);
  margin: 0 auto;
  max-width: 1480px;
  width: 100%;
}

#teacher-data-response-marking .q18-marking-question { grid-area: question; }
#teacher-data-response-marking .q18-marking-answer { grid-area: paper; min-width: 0; }
#teacher-data-response-marking .q18-marking-scheme { grid-area: scheme; min-width: 0; }
#teacher-data-response-marking .q18-marking-feedback-bottom { grid-area: feedback; min-width: 0; }
#teacher-data-response-marking .q20-marking-history { grid-area: history; }

#teacher-data-response-marking .q18-marking-desk.q18-marking-workflow > section {
  box-sizing: border-box;
  margin: 0;
  min-width: 0;
}

#teacher-data-response-marking .q18-marking-question,
#teacher-data-response-marking .q18-marking-scheme,
#teacher-data-response-marking .q18-marking-answer,
#teacher-data-response-marking .q18-marking-feedback-bottom,
#teacher-data-response-marking .q20-marking-history {
  background: #fff;
  border: 1px solid #e0e5ef;
  border-radius: 16px;
  padding: 24px;
}

#teacher-data-response-marking .q18-marking-question > span,
#teacher-data-response-marking .q18-marking-answer-head span {
  color: #718098;
  font-size: 13px;
}

#teacher-data-response-marking .q18-marking-question h2,
#teacher-data-response-marking .q18-marking-scheme h2,
#teacher-data-response-marking .q18-marking-answer-head h2 {
  margin: 6px 0 12px;
}

#teacher-data-response-marking .q18-marking-question details {
  margin-top: 16px;
}

#teacher-data-response-marking .q18-marking-question summary,
#teacher-data-response-marking .q18-marking-scheme summary {
  color: #5060c7;
  cursor: pointer;
  font-weight: 800;
}

#teacher-data-response-marking .q18-marking-answer {
  min-height: 0;
  overflow: hidden;
  padding: 0;
}

#teacher-data-response-marking .q18-marking-answer-head {
  align-items: flex-start;
  border-bottom: 1px solid #e7ebf1;
  display: flex;
  gap: 16px;
  justify-content: space-between;
  padding: 18px 20px;
}

#teacher-data-response-marking .q18-marking-file-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

#teacher-data-response-marking .q18-marking-answer > .ap-frq-annotation-toolbar {
  border-bottom: 1px solid #e7ebf1;
  border-top: 0;
  min-height: 0;
}

#teacher-data-response-marking .q18-teacher-paper-preview {
  background: #f5f5f7;
  display: block;
  height: auto;
  min-height: 720px;
  overflow: visible;
  padding: 0;
}

#teacher-data-response-marking .q18-teacher-paper-preview > .ap-frq-pdf-annotator {
  min-height: 0;
  padding: 18px;
}

#teacher-data-response-marking .q18-marking-feedback-bottom form {
  display: grid;
  gap: 18px;
}

#teacher-data-response-marking .q18-score-panel-head,
#teacher-data-response-marking .q18-history-head {
  align-items: flex-start;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}

#teacher-data-response-marking .q18-score-panel-head > span,
#teacher-data-response-marking .q18-history-head > span {
  color: #718098;
  font-size: 13px;
}

#teacher-data-response-marking .q18-marking-feedback-bottom .marking-feedback-card {
  background: transparent;
  border: 0;
  display: grid;
  gap: 14px;
  padding: 0;
}

#teacher-data-response-marking .q18-marking-feedback-bottom .marking-save-bar {
  border-top: 1px solid #e7ebf1;
  margin-top: 4px;
  padding-top: 18px;
}

#teacher-data-response-marking .q18-marking-scheme {
  display: block;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

#teacher-data-response-marking .q18-marking-scheme > details > div {
  line-height: 1.6;
  margin-top: 14px;
  overflow-wrap: anywhere;
}

#teacher-data-response-marking .q18-marking-scheme .secure-marking-guide {
  min-width: 0;
  overflow-wrap: anywhere;
}

#teacher-data-response-marking .q18-marking-scheme .secure-marking-guide table {
  table-layout: fixed;
  width: 100%;
}

#teacher-data-response-marking .q18-marking-scheme .secure-marking-guide th:nth-child(1),
#teacher-data-response-marking .q18-marking-scheme .secure-marking-guide td:nth-child(1) {
  white-space: nowrap;
  width: 72px;
}

#teacher-data-response-marking .q18-marking-scheme .secure-marking-guide th:nth-child(2),
#teacher-data-response-marking .q18-marking-scheme .secure-marking-guide td:nth-child(2) {
  white-space: nowrap;
  width: 86px;
}

@media (min-width: 981px) {
  #teacher-data-response-marking .q18-marking-desk.q18-marking-workflow {
    align-items: stretch;
    grid-template-areas:
      "question question"
      "paper scheme"
      "feedback feedback"
      "history history";
    grid-template-columns: minmax(0, 1.16fr) minmax(420px, 0.94fr);
  }

  #teacher-data-response-marking .q18-marking-answer {
    height: auto;
    max-height: none;
    overflow: visible;
  }

  #teacher-data-response-marking .q18-marking-scheme {
    align-self: stretch;
    contain: size;
    display: block;
    height: auto;
    max-height: none;
    min-height: 0;
  }
}

@media (max-width: 980px) {
  #teacher-data-response-marking.view { padding: 24px 18px 42px; }
  #teacher-data-response-marking .q18-marking-scheme { max-height: 680px; }
}

@media (max-width: 620px) {
  #teacher-data-response-marking.view { padding: 18px 12px 36px; }
  #teacher-data-response-marking .q18-marking-question,
  #teacher-data-response-marking .q18-marking-scheme,
  #teacher-data-response-marking .q18-marking-feedback-bottom,
  #teacher-data-response-marking .q20-marking-history { padding: 18px; }
  #teacher-data-response-marking .q18-marking-answer-head { align-items: stretch; flex-direction: column; }
  #teacher-data-response-marking .q18-marking-file-actions { justify-content: flex-start; }
  #teacher-data-response-marking .q18-teacher-paper-preview { min-height: 520px; }
}