/* Keep the reading area compact; field weights still divide the available width. */
:root { --exam-bank-gap: 20px; }
@media screen and (width < 901px) {
  :root { --exam-bank-gap: 7px; }
}
.triplePdfStage { --exam-bank-gap: 20px; }
body[data-page="triple_exam"] #papers > .paper,
body.exam-create-page #out > .paper,
body.exam-create-page #out > .page {
  box-sizing: border-box;
  width: 100%;
  max-width: var(--exam-paper-max, 920px);
  margin-left: auto !important;
  margin-right: auto !important;
}
body[data-page="triple_exam"] .regularLayout.multiField { gap: var(--exam-bank-gap) !important; }
body[data-page="triple_exam"] .question {
  grid-template-columns: 30px minmax(0, max-content) auto !important;
  gap: 8px;
  align-items: center;
  padding-right: 0;
}
body[data-page="triple_exam"] .question .answerGroup {
  grid-column: auto;
  justify-self: start;
  justify-content: flex-start;
  gap: 6px;
}
body[data-page="triple_exam"] .question .answerGroupStacked { grid-column: 2 / -1; }
body[data-page="triple_exam"] .option {
  display: flex;
  gap: 6px;
  align-items: baseline;
  overflow-wrap: anywhere;
  padding-left: 0;
}
body[data-page="triple_exam"] .optionLabel { flex: 0 0 28px; min-width: 0; }
body[data-page="triple_exam"] .optionText { min-width: 0; white-space: pre-wrap; }
body[data-page="triple_exam"] [data-preserve-field-widths="true"] > div { min-width:0; }
body[data-page="triple_exam"] [data-preserve-field-widths="true"] .option { gap:3px; }
body[data-page="triple_exam"] [data-preserve-field-widths="true"] .optionLabel { flex-basis:auto; }
body[data-page="triple_exam"] [data-preserve-field-widths="true"] .answerGroup { flex-direction:column; gap:2px; }
body[data-page="triple_exam"] .easyHead.multiField,
body[data-page="triple_exam"] .easyRow.multiField { column-gap: 10px; }
body[data-page="triple_exam"] .easyOptions { column-gap: 16px; }

/* Legacy line matching and all writing exams share the selected source's field weights. */
body.exam-create-page #out .wrap {
  grid-template-columns: minmax(0, var(--exam-question-weight, 50fr)) minmax(0, var(--exam-response-weight, 50fr)) !important;
  gap: var(--exam-bank-gap) !important;
}
body.exam-create-page #out .wrap > * { min-width: 0; }
body.exam-create-page #out .wrap > .box:first-child { padding-right: 0; }
body.exam-create-page #out .wrap > .box + .box { padding-left: 0; }
body.exam-create-page #out .row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: nowrap;
}
body.exam-create-page #out .k { flex: 0 0 30px; width: 30px; }
body.exam-create-page #out .examPrompt { min-width: 0; overflow-wrap: anywhere; white-space: pre-wrap; }
body.exam-create-page #out .wrap .examPrompt { flex: 0 1 auto; }
body.exam-create-page #out .wrap :is(.ans, .ansBlank) { flex: 0 0 40px; width: 40px !important; margin-left: 0; }
body.exam-create-page #out .examWriteRow {
  --exam-row-gutters: 46px;
  display: flex;
  gap: 8px;
}
body.exam-create-page #out .examWriteRow:has(.wanted-cell) {
  --exam-row-gutters: 82px;
}
body.exam-create-page #out .examWriteRow .examPrompt {
  width: auto;
  min-width: 0;
  flex: 0 1 auto;
  max-width: calc((100% - var(--exam-row-gutters)) * var(--exam-question-fraction, .5));
}
body.exam-create-page #out .examWriteRow :is(input.ans, .meaningBox, .spellingBox, .twoFieldAnswerReveal) {
  box-sizing: border-box;
  flex: 0 1 auto;
  width: calc((100% - var(--exam-row-gutters)) * var(--exam-response-fraction, .5)) !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin-left: 0;
}
body.exam-create-page #out .examWriteRow :is(.meaningBox, .spellingBox) { min-height: 36px; }

@media screen and (max-width: 600px) {
  body[data-page="triple_exam"] .optionLabel { flex-basis: 22px; }
  body[data-page="triple_exam"] .option { gap: 4px; }
}
@media print {
  body[data-page="triple_exam"] #papers > .paper,
  body.exam-create-page #out > .paper,
  body.exam-create-page #out > .page { max-width: 100%; }
}
/* PDF capture uses a desktop-sized stage even when requested from a phone. */
body[data-page="triple_exam"] .triplePdfStage .question {
  grid-template-columns: 30px minmax(0, max-content) auto !important;
  gap: 8px;
}
body[data-page="triple_exam"] .triplePdfStage .question .answerGroup { grid-column: auto; }
body[data-page="triple_exam"] .triplePdfStage .question .answerGroupStacked { grid-column: 2 / -1; }