/* ═══ Print — a real paginated CV, not a screenshot of a web page ══════
   Ctrl/Cmd-P → "Save as PDF" gives something you can attach to an email.
   ═════════════════════════════════════════════════════════════════════ */

@page { margin: 16mm 14mm; }

html { font-size: 14px; }

:root {
  --paper: #fff;
  --paper-2: #fff;
  --paper-3: #fff;
  --ink: #000;
  --ink-2: #1c1c1c;
  --muted: #333;
  --faint: #555;
  --rule: #c8c8c8;
  --rule-2: #999;
  --qing: #000;
  --qing-soft: transparent;
  --rail: 8.5rem;
  --shell: none;
  --gutter: 0;
}

body { background: #fff; color: #000; }

/* Screen furniture that means nothing on paper. A wash that reads as paper
   tone on a backlit screen prints as a smudge, and a printer will happily
   spend ink on it. */
.plate,
.tailpiece,
#topbar,
.toggle,
.skip,
.links,
.portrait,
.entry-logo,
a.tag,
.au-more { display: none !important; }

/* Reveals must not be able to hide content in a print job. */
.rise {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}

.wrap, .frame {
  max-width: none;
  padding-inline: 0;
  border-inline: none;
}
main { border: none; }

/* Keep the dated-column layout on paper. The narrow print width would
   otherwise trip the stacked mobile rule and put the year on its own line. */
/* The same three tracks as on screen, at paper proportions. The third is a
   declared width rather than `auto` for the same reason it is on screen: the
   crest and the DOI links are hidden here but the Preprint chip is not, so an
   `auto` lane came out 64px wide under Publications and zero everywhere else,
   and the printed lines stopped in two different places. */
.entry,
.pub,
.skills > div {
  grid-template-columns: 7rem minmax(0, 1fr) 5rem;
  gap: 0 1.4rem;
}
.pub-year { display: block; }
.place { margin-top: 0.3rem; }
.pub-meta { flex-direction: column; align-items: flex-end; margin-top: 0; }

/* Full author lists belong on a CV, and so does the full publication list.
   A folded paper is invisible on paper, where there is no button to press. */
.au-rest { display: inline !important; }
.pubs > li[hidden] { display: grid !important; }
.more { display: none !important; }

/* Links are dead on paper — print the identifiers instead. */
.doi-print {
  display: inline;
  font-family: var(--font-mono);
  font-size: 0.8em;
  color: #444;
}
a { text-decoration: none; border: none !important; }

/* Pagination. */
/* On screen every section is given a whole screen to itself. On paper that
   would turn a five-section CV into five near-empty sheets, so the floor comes
   off and each section is again exactly as tall as what is in it. */
.hero,
.sec {
  min-height: 0;
  align-content: start;
}
/* Back to the body face, upright. On screen this paragraph is Playfair italic
   — the Latin counterpart of the brush on the Chinese page — but a printed CV
   set in italic is a CV that is harder to read, and a laser printer thins
   Playfair's hairlines to nothing at 10pt. Handwriting is a screen gesture;
   paper gets the working face. The Chinese page does the same thing with the
   brush, in zh.css. */
.standfirst {
  padding-block: 0;
  font-family: var(--font-body);
  font-style: normal;
}

.hero { padding-block: 0 1.2rem; break-after: avoid; }
.name-cn { font-size: 2rem; }
.name-lat { font-size: 1rem; }

/* On paper the three parts of the lede close up into one block. The bold line
   needs no other treatment here; it is already at reading size on screen. */
.lede-text { gap: 0.5rem; }

/* On screen the hero's middle column is a timeline stood on end, doubling as
   the rule between the two columns. Paper has neither the height nor any use
   for sideways type, so the columns stack and the timeline lies back down. */
.hero-grid { display: block; }
.arc {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem 1.5rem;
  min-height: 0;
  padding: 0;
  margin-block: 0.9rem 0;
}
.arc::before { content: none; }
.arc li {
  writing-mode: horizontal-tb;
  padding: 0 0 0 0.8rem;
}
.arc li::after { content: none; }
.arc li::before { top: 0.28rem; }

.sec {
  padding-block: 1.4rem;
  break-inside: auto;
}
.rail,
.sectitle,
.secnum,
.subhead { break-after: avoid; }

.entry,
.pub,
.interests li,
.skills > div { break-inside: avoid; }

.entries > li + li,
.pubs > li + li { margin-top: 1.1rem; padding-top: 1.1rem; }

.stack { display: none; }

/* The mirror of the screen rule: on screen the repo title is already a live
   link and spelling the address out under it is the same information twice.
   On paper the link is dead and the address is the only way back to it. */
.repo-url {
  display: block;
  margin-top: 0.5rem;
  font-family: var(--font-mono);
  font-size: 0.8em;
  color: #444;
}
.colophon { padding-block: 1.2rem 0; }