/* HyperPrior, the hybrid build: print. Linked with media="print" on every page.

   The home page prints as one A4 data sheet: the typeset sheet that build.py writes into index.html between
   <!-- datasheet:start --> and <!-- datasheet:end --> (the definition, the seven research areas, the engagements,
   the terms with the inspection seal beside the Calibration row, the devices, the registration line, and the day
   it was printed). Nothing else of the home page is printed. /datasheet.pdf is this sheet, rendered by Playwright
   (assets/hybrid/og/render.mjs).

   The other pages print as their text, in ink on white: no bar, no nameplate, no dialog, no moving parts. */

@page { size: A4; margin: 13mm 14mm 12mm; }

html, body { background: #fff !important; color: #0a0b0c !important; }
* { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.bar, .skip, .foot-plate, .chrome-canvas, dialog, .gate, #gate, .card-flip, canvas, .cite-act, [data-legal] { display: none !important; }
html.js [data-reveal] { opacity: 1 !important; transform: none !important; transition: none !important; }
.pp { padding: 0 !important; background: #fff !important; }
.pp::after { display: none !important; }
.foot { padding: 6mm 0 0 !important; background: none !important; break-inside: avoid; }
.foot-row { color: #2a2e33 !important; }
a { color: inherit !important; }
.tag-item, .cat-item, .man-dev, .trouble tr, .spec-row, .fig { break-inside: avoid; }
.tag-string { display: none !important; }
.tag { filter: none !important; rotate: 0deg !important; }
.cat-item { top: 0 !important; }
.cat-card { rotate: 0deg !important; box-shadow: 0 0 0 0.6pt #888 !important; }

/* ------------------------------------------------------------------ the home page: the data sheet alone */
body.home > :not(main) { display: none !important; }
body.home main > :not(.ds) { display: none !important; }
body.home .ds { display: block !important; }

.ds {
  padding: 0 !important; background: #fff !important; color: #0a0b0c;
  font-family: "Xanh Mono", ui-serif, serif;
}
.ds-sheet { max-width: none; }
.ds .ds-head {
  display: grid; grid-template-columns: 1fr auto; grid-template-areas: "mark sub" "title sub";
  align-items: end; column-gap: 8mm; padding-bottom: 3.2mm; border-bottom: 1.4pt solid #0a0b0c;
}
.ds .ds-mark { grid-area: mark !important; font-family: "Austin", Georgia, serif; font-size: 9pt; letter-spacing: -0.04em; line-height: 1; color: #575d64; }
.ds .ds-title { grid-area: title !important; margin-top: 1.6mm; font-family: "Austin", Georgia, serif; font-size: 28pt; line-height: 0.95; letter-spacing: -0.03em; }
.ds .ds-sub { grid-area: sub !important; justify-self: end; font-style: italic; font-size: 11pt; color: #2a2e33; }

.ds-grid {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 8mm; row-gap: 3.6mm; padding-top: 4mm;
  grid-template-areas: "def engs" "devs engs" "areas areas" "terms reg" "terms fig";
  grid-template-rows: auto auto auto auto auto;
}
/* (the print page is narrower than 820px, so the screen's narrow rules would apply: these win over them) */
.ds .ds-grid > .ds-def { grid-area: def !important; }
.ds .ds-grid > .ds-areas { grid-area: areas !important; }
.ds .ds-grid > .ds-engs { grid-area: engs !important; }
.ds .ds-grid > .ds-terms { grid-area: terms !important; }
.ds .ds-grid > .ds-devs { grid-area: devs !important; align-self: end; }
.ds .ds-grid > .ds-reg { grid-area: reg !important; }
/* the figure: HPR-C1 from the manual, exploded, under the registration line */
.ds .ds-grid > .ds-fig {
  grid-area: fig !important; display: block !important; min-height: 44mm; margin-top: 0;
  background: url("/manual/img/hpr-c1.webp") 50% 34% / 120% auto no-repeat;
}
.ds-screen { display: none !important; }

.ds-h {
  margin: 0 0 2mm; padding: 0 0 1.2mm; border-bottom: 0.6pt solid #0a0b0c;
  font-family: "Xanh Mono", serif; font-style: italic; font-size: 8.6pt; line-height: 1.2; color: #2a2e33;
}
.ds .num { font-size: inherit; line-height: inherit; color: #575d64; }
.ds-areas .ds-table th { width: 46mm; }
.ds-sec p { font-size: 8.8pt; line-height: 1.45; color: #2a2e33; max-width: none; }
.ds-hw { font-family: "Austin", Georgia, serif; font-size: 17pt !important; line-height: 1.1 !important; color: #0a0b0c !important; }
.ds-hw .ds-ipa, .ds-hw i, .ds-hw [lang="ja"] { font-family: "Xanh Mono", "HP IPA", "HP Mincho", serif; font-size: 8.8pt; color: #575d64; }
.ds-senses { margin-top: 1.8mm; display: grid; row-gap: 1.2mm; }
.ds-senses li { display: grid; grid-template-columns: 4.6mm minmax(0, 1fr); font-size: 8.8pt; line-height: 1.45; color: #2a2e33; }
.ds-senses i { color: #575d64; }
.ds-q { margin-top: 3mm !important; font-family: "Austin", Georgia, serif; font-size: 13pt !important; line-height: 1.12 !important; color: #0a0b0c !important; }

.ds-table { width: 100%; border-collapse: collapse; font-size: 8.8pt; line-height: 1.35; }
.ds-table td, .ds-table th { padding: 1.05mm 2.4mm 1.05mm 0; border-bottom: 0.5pt solid #c9ced3; text-align: left; vertical-align: baseline; font-weight: 400; color: #2a2e33; }
.ds-table th { color: #0a0b0c; white-space: nowrap; }
.ds-table td.num { width: 8mm; color: #575d64; white-space: nowrap; }
.ds-table td.ds-g { width: 5mm; font-family: "Austin", Georgia, serif; font-size: 11pt; line-height: 1; color: #0a0b0c; }
.ds-engs .ds-table th { white-space: normal; width: 34%; }
.ds-engs .ds-table td.num { width: 10mm; }

.ds-dl { display: grid; }
.ds-term { position: relative; display: grid; grid-template-columns: 24mm minmax(0, 1fr); column-gap: 2.4mm; padding: 1.05mm 0; border-bottom: 0.5pt solid #c9ced3; font-size: 8.8pt; line-height: 1.35; }
.ds-term dt { font-style: italic; color: #575d64; }
.ds-term dd { margin: 0; color: #0a0b0c; }
.ds .ds-term--seal { padding: 1.05mm 30mm 1.05mm 0; min-height: 16mm; align-content: center; }
.ds .ds-seal { position: absolute; right: 0; left: auto; bottom: auto; top: 50%; width: 27mm; height: auto; translate: 0 -50%; rotate: -4deg; color: #0b6b66; }
.ds-seal text { font-family: "Xanh Mono", serif; fill: currentColor; }
.ds-seal-k { font-size: 10px; font-style: italic; }
.ds-seal-v { font-family: "Austin", Georgia, serif !important; font-size: 10.5px; }
.ds-seal-b { font-size: 9px; }

.ds-foot {
  margin-top: 4.6mm; padding-top: 2mm; border-top: 1.4pt solid #0a0b0c;
  font-style: italic; font-size: 8.8pt; color: #2a2e33; max-width: none;
}
.ds-printed { display: inline !important; }
html:not(.js) .ds-printed { display: none !important; }