/* The paper itself: always black on white, in millimetres, the same on screen, in print and in the
   downloaded pictures. Kept simple on purpose (founder, 2026-11-03): a board-paper look. */

@font-face { font-family: Tinos; src: url(/assets/fonts/paper/tinos-latin-400-normal.woff2) format("woff2"); font-weight: 400; font-style: normal; font-display: block; }
@font-face { font-family: Tinos; src: url(/assets/fonts/paper/tinos-latin-700-normal.woff2) format("woff2"); font-weight: 700; font-style: normal; font-display: block; }
@font-face { font-family: Tinos; src: url(/assets/fonts/paper/tinos-latin-400-italic.woff2) format("woff2"); font-weight: 400; font-style: italic; font-display: block; }
@font-face { font-family: Tinos; src: url(/assets/fonts/paper/tinos-latin-700-italic.woff2) format("woff2"); font-weight: 700; font-style: italic; font-display: block; }
@font-face { font-family: "Noto Nastaliq Urdu"; src: url(/assets/fonts/paper/noto-nastaliq-urdu-arabic-400-normal.woff2) format("woff2"); font-weight: 400; font-display: block; unicode-range: U+0600-06FF, U+0750-077F, U+200C-200F, U+2010-2011, U+204F, U+25CC, U+FB50-FDFF, U+FE70-FEFF; }
@font-face { font-family: "Noto Nastaliq Urdu"; src: url(/assets/fonts/paper/noto-nastaliq-urdu-arabic-700-normal.woff2) format("woff2"); font-weight: 700; font-display: block; unicode-range: U+0600-06FF, U+0750-077F, U+200C-200F, U+2010-2011, U+204F, U+25CC, U+FB50-FDFF, U+FE70-FEFF; }
@font-face { font-family: Gulzar; src: url(/assets/fonts/paper/gulzar-arabic-400-normal.woff2) format("woff2"); font-weight: 400; font-display: block; unicode-range: U+0600-06FF, U+0750-077F, U+200C-200F, U+FB50-FDFF, U+FE70-FEFF; }

.paper {
  --ink: #000;
  --rule: #000;
  --soft: #555;
  --fs: 11pt;
  --density: 1;
  --gap: calc(1.6mm * var(--density));
  --line: calc(7.5mm * var(--density));
  --en: Tinos, "Times New Roman", Times, serif;
  --ur: "Noto Nastaliq Urdu", "Jameel Noori Nastaleeq", serif;
  --ur-lh: 2.15;
  color: var(--ink);
  font-family: var(--en);
  font-size: var(--fs);
  line-height: 1.35;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
  text-rendering: optimizeLegibility;
}
.paper.font-sans { --en: "Plus Jakarta Sans", Arial, sans-serif; }
.paper.urdu-naskh { --ur: Gulzar, "Noto Nastaliq Urdu", serif; --ur-lh: 1.9; }
.paper [lang="ur"] { font-family: var(--ur); line-height: var(--ur-lh); unicode-bidi: plaintext; }
.paper.lang-ur { font-family: var(--ur); line-height: var(--ur-lh); }
.paper *, .paper *::before, .paper *::after { box-sizing: border-box; }
.paper b, .paper strong { font-weight: 700; }

/* ----- pages and sheets ----- */
.pd-measure { position: absolute; left: -100000px; top: 0; visibility: hidden; }
.pd-page {
  position: relative;
  width: var(--w);
  height: var(--h);
  padding: var(--margin);
  background: #fff;
  overflow: hidden;
}
.pd-content { position: relative; height: 100%; }
.has-border .pd-page::after { content: ""; position: absolute; inset: calc(var(--margin) * 0.55); border: 0.35mm solid #000; pointer-events: none; }
.pd-sheet { width: var(--sw); height: var(--sh); background: #fff; }
.pd-sheet.is-double { display: flex; position: relative; }
.pd-sheet.is-double > .pd-page { flex: none; }
.pd-cut { position: absolute; left: 50%; top: 4mm; bottom: 4mm; border-left: 0.3mm dashed #888; }
.pd-folio { position: absolute; left: 0; right: 0; bottom: calc(var(--margin) * 0.45); text-align: center; font-size: 8.5pt; color: var(--soft); }
.pd-watermark {
  position: absolute; inset: 0; display: grid; place-items: center;
  font: 700 54pt/1 var(--en); color: rgb(0 0 0 / 0.07);
  transform: rotate(-32deg); pointer-events: none; white-space: nowrap;
}

/* ----- header ----- */
.p-head { padding-bottom: calc(var(--gap) * 1.5); }
.head-top { display: flex; align-items: center; justify-content: center; gap: 4mm; text-align: center; }
.head-logo { width: auto; height: 17mm; max-width: 30mm; object-fit: contain; }
.head-names { display: grid; gap: 0.6mm; }
.head-institute { font-size: 1.55em; font-weight: 700; line-height: 1.2; }
.head-branch { font-size: 1em; }
.head-title { font-size: 1.12em; font-weight: 700; }
.head-institute, .head-branch, .head-title { display: flex; flex-wrap: wrap; justify-content: center; column-gap: 4mm; }
.head-side .head-top { justify-content: flex-start; text-align: start; }
.head-side .head-institute, .head-side .head-branch, .head-side .head-title { justify-content: flex-start; }
.head-compact .head-institute { font-size: 1.25em; }
.head-compact .head-logo { height: 11mm; }
.head-facts { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1mm 5mm; margin-top: 2.2mm; padding: 1.2mm 0; border-top: 0.35mm solid var(--rule); border-bottom: 0.35mm solid var(--rule); }
.fact-label { font-weight: 700; }
.paper bdi[lang="ur"], .paper bdi > [lang="ur"] { line-height: 1.6; }
.head-fields { display: grid; grid-template-columns: repeat(var(--per-row, 3), minmax(0, 1fr)); gap: 2.4mm 5mm; margin-top: 3mm; }
.field { display: flex; align-items: flex-end; gap: 1.5mm; min-width: 0; }
.field-label { white-space: nowrap; font-weight: 700; }
.field-line { flex: 1; min-width: 12mm; border-bottom: 0.3mm solid var(--rule); min-height: 1.2em; padding-inline: 1mm; }
.head-instructions { margin-top: 2.5mm; font-size: 0.95em; }

/* ----- sections ----- */
.p-banner { text-align: center; font-weight: 700; font-size: 1.08em; padding: calc(var(--gap) * 1.2) 0 var(--gap); text-transform: none; letter-spacing: 0.02em; }
.p-section-head { display: flex; align-items: flex-start; gap: 3mm; padding: calc(var(--gap) * 1.4) 0 var(--gap); font-weight: 700; }
.p-section-head .sh-text { flex: 1; min-width: 0; }
.sh-line { display: flex; gap: 2mm; }
.sh-num { white-space: nowrap; }
.sh-attempt, .sh-compulsory { font-weight: 400; font-style: italic; }
.sh-marks { white-space: nowrap; font-weight: 700; }
.p-gap { height: calc(var(--gap) * 1.2); }

/* ----- questions ----- */
.p-q, .p-part { position: relative; padding: calc(var(--gap) * 0.45) 0; }
.p-q:has(> .q-marks), .p-part:has(> .q-marks) { padding-inline-end: 10mm; }
.q { display: flex; gap: 1.6mm; align-items: baseline; }
.q-num { flex: none; min-width: 2.4em; }
.q-main { flex: 1; min-width: 0; }
.q-text { display: block; }
.q-marks { position: absolute; inset-inline-end: 0; top: calc(var(--gap) * 0.45); font-weight: 400; }
.q-img { display: block; max-width: 70%; max-height: 80mm; width: auto; height: auto; object-fit: contain; margin: 1.5mm auto; }
.is-passage .q-text { text-align: justify; }
.part { display: flex; gap: 1.6mm; padding-inline-start: 6mm; }
.part-num { flex: none; min-width: 5.5mm; }

.opts { display: grid; gap: 0.4mm 3mm; margin-top: 0.6mm; }
.opts.probe { display: block; }
.opts.probe > .opt { display: inline-block; white-space: nowrap; margin-inline-end: 3mm; }
.opts.cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.opts.cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.opts.cols-1 { grid-template-columns: minmax(0, 1fr); }
.opt-label { white-space: nowrap; }
.q-tf .q-main { display: flex; align-items: baseline; gap: 4mm; }
.q-tf .q-text { flex: 1; }
.tf-box { flex: none; white-space: nowrap; }
.cell-bi { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0 3mm; }
.blank { display: inline-block; width: calc(var(--n, 12) * 0.9mm); min-width: 14mm; border-bottom: 0.3mm solid var(--rule); vertical-align: baseline; height: 1em; }
.blank-end { width: 36mm; margin-inline-start: 2mm; }
.match { border-collapse: collapse; width: 100%; margin-top: 1mm; }
.match th, .match td { border: 0.3mm solid var(--rule); padding: 0.8mm 1.6mm; text-align: start; vertical-align: top; }
.match th { font-weight: 700; }
.match td:first-child, .match td:nth-child(3) { width: 9mm; white-space: nowrap; text-align: center; }
.match td:last-child { width: 18mm; }

/* Bilingual: English beside Urdu (or under it). */
.bi-col { min-width: 0; }
.bi.bi-side { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 5mm; align-items: start; }
.bi.bi-stacked { display: grid; gap: 0.8mm; }

/* Questions side by side (a section set to 2 or 3 columns). */
.p-row { display: grid; grid-template-columns: repeat(var(--cols, 2), minmax(0, 1fr)); gap: 0 6mm; }

/* Answer lines: ruled, or blank working space. */
.p-lines { padding: 0.5mm 0 calc(var(--gap) * 0.6); }
.p-line { height: var(--line); border-bottom: 0.25mm solid #444; }
.p-lines.is-space .p-line { border-bottom: 0; }

/* Formulas keep their own fonts; a formula that could not be read shows as typed. */
.paper .katex { font-size: 1.08em; }
.paper .katex-display { margin: 1mm 0; }
.math-error { font-family: monospace; color: #000; border-bottom: 0.3mm dotted #000; }

/* ----- answer key ----- */
.p-key-title { font-size: 1.25em; font-weight: 700; text-align: center; padding-bottom: 3mm; border-bottom: 0.35mm solid var(--rule); margin-bottom: 2mm; }
.p-key-section { padding: 1.4mm 0; display: grid; grid-template-columns: 12mm 1fr; gap: 2mm; }
.key-head { font-weight: 700; }
.key-items { display: grid; gap: 0.8mm; }
.p-key-section.is-compact .key-items { display: flex; flex-wrap: wrap; gap: 0.8mm 6mm; }

/* ----- OMR sheet ----- */
.omr-head { display: grid; grid-template-columns: 1fr auto; gap: 3mm 6mm; padding-bottom: 3mm; border-bottom: 0.4mm solid #000; }
.omr-title { grid-column: 1 / -1; font-size: 1.25em; font-weight: 700; text-align: center; }
.omr-info { display: grid; gap: 3mm; align-content: start; }
.omr-roll { border: 0.35mm solid #000; padding: 1.5mm; }
.omr-roll-label { font-weight: 700; font-size: 0.85em; text-align: center; margin-bottom: 1mm; }
.omr-roll-grid { display: flex; gap: 1.2mm; }
.omr-roll-col { display: grid; gap: 0.7mm; justify-items: center; }
.omr-box { width: 5mm; height: 5mm; border: 0.3mm solid #000; }
.omr-grid { display: grid; grid-template-columns: repeat(var(--cols, 4), max-content); justify-content: space-between; gap: 4mm; margin-top: 4mm; }
.omr-col { display: grid; gap: 1.2mm; align-content: start; }
.omr-row { display: flex; align-items: center; gap: 1.4mm; }
.omr-n { width: 7mm; text-align: end; font-weight: 700; font-size: 0.85em; }
.bubble { display: inline-grid; place-items: center; width: 4.6mm; height: 4.6mm; border: 0.3mm solid #000; border-radius: 50%; font: 6.5pt/1 Arial, sans-serif; }
.bubble.is-filled { background: #000; color: #fff; }
.omr-note { margin-top: 4mm; font-size: 0.85em; text-align: center; }
