/* The paper itself — identical rules apply on screen (inside the simulated
   sheet) and on print (inside the real @page box). No screen/print branching
   here; that lives in app.css. */

:root {
  --page-w: 210mm;
  --page-h: 297mm;
  --margin-top: 14mm;
  --margin-bottom: 14mm;
  --margin-left: 16mm;
  --margin-right: 16mm;
  --marks-col: 12mm;
  --rule: #222;
  --ink: #111;
}

.page {
  width: var(--page-w);
  min-height: var(--page-h);
  background: #fff;
  color: var(--ink);
  font-family: 'Noto Sans Telugu', 'Noto Sans Devanagari', 'Noto Sans', sans-serif;
  font-size: 12.5pt;
  line-height: 1.5;
  box-sizing: border-box;
  padding: var(--margin-top) var(--margin-right) var(--margin-bottom) var(--margin-left);
}

/* ---- Header ---- */

.paper-header {
  break-inside: avoid;
}

.masthead {
  display: flex;
  align-items: center;
  gap: 4mm;
}

.masthead-logo {
  width: 16mm;
  height: 16mm;
  border: 1px solid #999;
  border-radius: 2px;
  flex: none;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 7pt;
  color: #999;
  text-align: center;
  overflow: hidden;
}

.masthead-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.masthead-text {
  flex: 1;
  text-align: center;
}

.school-name {
  font-size: 16pt;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.exam-title {
  font-size: 12pt;
  margin-top: 1mm;
}

.exam-title .subject {
  font-weight: 700;
}

.paper-meta-row {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 3mm 6mm;
  margin-top: 4mm;
  font-size: 11pt;
}

.paper-meta-row .field {
  white-space: nowrap;
}

.paper-meta-row .field .fill {
  display: inline-block;
  min-width: 28mm;
  border-bottom: 0.5pt solid #555;
  margin-left: 2mm;
}

.header-rule {
  border: none;
  border-top: 1pt solid var(--rule);
  margin: 3mm 0 4mm;
}

/* ---- Sections grid: content column + pinned marks column ---- */

.sections {
  display: grid;
  grid-template-columns: 1fr var(--marks-col);
  column-gap: 3mm;
}

.section-content {
  break-inside: avoid;
  margin-bottom: 4mm;
}

.section-marks {
  break-inside: avoid;
  margin-bottom: 4mm;
  font-weight: 700;
  font-size: 11pt;
  text-align: right;
  padding-top: 0.2em;
}

.section-title {
  font-weight: 700;
  margin-bottom: 2.5mm;
}

.section-number {
  margin-right: 1.5mm;
}

.block + .block {
  margin-top: 3mm;
}

.block-image {
  max-width: 100%;
  max-height: 30mm;
  display: block;
  margin: 2mm 0;
}

/* ---- grid block ---- */

.block-grid {
  border-collapse: collapse;
  width: 100%;
}

.block-grid td {
  border: 0.75pt solid #444;
  height: 12mm;
  width: 12mm;
}

/* ---- pool block ---- */

.block-pool {
  padding: 3mm 4mm;
}

.block-pool.bordered {
  border: 0.75pt solid #444;
}

.pool-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6mm;
  justify-content: space-around;
}

.pool-row + .pool-row {
  margin-top: 3mm;
}

.pool-token {
  font-size: 14pt;
}

/* ---- matching block ---- */

.block-matching {
  display: flex;
  justify-content: space-between;
  gap: 20mm;
  padding: 2mm 6mm;
}

.matching-col {
  display: flex;
  flex-direction: column;
  gap: 7mm;
}

.matching-item {
  font-size: 13pt;
}

/* ---- sequence block ---- */

.sequence-items {
  display: flex;
  flex-wrap: wrap;
  gap: 8mm;
}

.sequence-item {
  display: flex;
  align-items: baseline;
  gap: 2mm;
  font-size: 13pt;
}

.sequence-blank {
  display: inline-block;
  min-width: 10mm;
  border-bottom: 0.5pt solid #555;
}

/* ---- oral block ---- */

.oral-items {
  list-style: none;
  padding: 0;
  margin: 0;
}

.oral-items li {
  margin-bottom: 1.5mm;
}

.oral-items li::before {
  content: "\2022";
  margin-right: 2mm;
}

/* ---- freetext block ---- */

.freetext-line {
  border-bottom: 0.5pt solid #555;
  height: 8mm;
}

/* ---- mcq block ---- */

.mcq-options {
  display: flex;
  flex-wrap: wrap;
  gap: 2mm 8mm;
  margin-top: 1.5mm;
}

.mcq-option {
  white-space: nowrap;
}
