/* Print stylesheet for the static pages. OWNER: WP2 (brief 3.2).
   /work/ and /about/ print to at most two A4 pages: no canvas, no nav, black on white,
   Inter (self-hosted, OFL) for text and for the small uppercase labels (refine 7: no mono font), Syne for the name: never the system SF, so a
   printed or generated PDF never embeds Apple's fonts. URLs after external links. The CV PDF (scripts/build-cv-pdf.mjs) is /about/ printed with this file. */
@page { size: A4; margin: 11mm 14mm 13mm; }

@media print {
  :root {
    --paper: #fff; --ink: #000; --ink-dim: #333; --fg: #000; --fg-dim: #333; --hair: #bbb; --bg: #fff;
    --t-body-size: 8.6pt;
    --f-sans: 'Inter Variable', Arial, sans-serif;
    --f-display: 'Inter Variable', Arial, sans-serif;
    --f-title: 'Syne Variable', 'Inter Variable', Arial, sans-serif;
    --f-label: 'Inter Variable', Arial, sans-serif;
    --f-code: 'Courier New', Courier, monospace;
  }
  html, html[data-ground="paper"], body, body.static-page { background: #fff !important; color: #000 !important; }
  body { font-size: 8.6pt; line-height: 1.33; -webkit-print-color-adjust: economy; print-color-adjust: economy; }

  /* chrome off */
  .site-header, .index-col, .index-disclosure, .skip-link, .run, .card-links, .dl-cv, details.sources, details.register,
  .meta-links a[download], figure.hero, .page-head .kicker, .portrait figcaption { display: none !important; }
  /* refine 4: on screen the portraits lead /about/ as a full-width pair (.body is display: contents);
     in print the CV keeps one small portrait beside the words, so it stays at two A4 pages */
  .block--portrait .body { display: grid !important; grid-column: 2 !important; grid-template-columns: 22mm minmax(0, 1fr) !important; gap: 4mm !important; }
  .block--portrait .portraits { grid-column: 1 !important; grid-row: 1 !important; display: block !important; margin: 0 !important; }
  .block--portrait .portraits .portrait + .portrait { display: none !important; }
  .block--portrait .about { grid-column: 2 !important; grid-row: 1 !important; }
  .block--portrait .label { grid-row: auto !important; }
  .portrait, .block--portrait .portrait { max-width: 22mm !important; }
  .block--portrait .portrait img { aspect-ratio: auto !important; }

  .shell { display: block; padding: 0; max-width: none; }
  .main, .page--wrong { max-width: none; }

  .page-head { gap: 2.2mm; padding-bottom: 4mm; }
  .page-head h1.display, .page--work .page-head h1.display, .page--about .page-head h1.display {
    font-size: 22pt; line-height: 1; letter-spacing: var(--t-name-tr); font-weight: var(--t-name-wt); max-width: none; color: #000;
  }
  .lede { font-size: 10.5pt; line-height: 1.3; max-width: none; color: #000; }
  .meta-links { gap: 1mm 5mm; }
  .link-mono { font-size: 7.4pt; min-height: 0; text-decoration: none; color: #000; }

  .block { grid-template-columns: 24mm minmax(0, 1fr); column-gap: 5mm; padding: 2.6mm 0 3mm; border-top: .5pt solid #999; break-inside: avoid-page; }
  .label { font-size: 6.6pt; padding-top: .35em; color: #333; }
  .body { gap: 1.6mm; }
  .body p, .about p, .pubs p, .cv-group p { font-size: 8.6pt; line-height: 1.33; max-width: none; color: #000; }
  .about { gap: 1.6mm; }

  /* cards: title and abstract only */
  .cards { gap: 0; }
  .work-card { padding: 1.6mm 0; gap: 1mm; border-top: .5pt solid #ccc; }
  .work-card:first-child { border-top: 0; padding-top: 0; }
  .work-card h3 { font-size: 10.5pt; font-weight: 400; letter-spacing: -.01em; }
  .work-card ul.chips { display: none; }

  .pubs { gap: 2.4mm; }
  .pubs > li { padding-left: 7mm; gap: 1mm; }
  .pubs > li::before { font-size: 6.6pt; }
  .pubs .chips { gap: 1mm; }
  .chip { font-size: 6.4pt; padding: 1.5pt 3pt; min-height: 0; border-color: #000; color: #000; background: none !important; }
  .chip--solid { background: #000 !important; color: #fff; }
  .chip--miss { border-color: #000; color: #000; }
  .pub-links a::after, dl.contact a[href^="http"]::after { content: " " attr(href); font-family: var(--f-label); font-variant-numeric: tabular-nums; font-size: 6.4pt; color: #333; text-transform: none; letter-spacing: 0; }
  .pub-links a { text-decoration: none; }

  .cv-group { padding-bottom: 1.2mm; gap: .6mm; }
  .cv-group h3 { font-size: 6.6pt; }
  dl.contact { gap: .8mm 4mm; grid-template-columns: 22mm minmax(0, 1fr); }
  dl.contact dd, dl.contact dt { font-size: 8.6pt; }
  dl.contact dt { font-size: 6.6pt; }

  dl.real-card { max-width: none; border-color: #999; }
  dl.real-card > div { grid-template-columns: 22mm minmax(0, 1fr); padding: 1.4mm 2.4mm; gap: 3mm; border-color: #ccc; }
  dl.real-card dd { font-size: 8.4pt; gap: 1mm; flex-direction: row; flex-wrap: wrap; align-items: baseline; column-gap: 2.4mm; }
  dl.real-card blockquote.voice-marcel { font-size: 10pt; }
  dl.real-card .chip { font-size: 6pt; }
  dl.real-card dt { font-size: 6.4pt; padding-top: .2em; }

  blockquote.voice-marcel { border-left-color: #000; }

  .site-footer { padding: 3mm 0 0; border-top: .5pt solid #999; max-width: none; }
  .footer-line { font-size: 6.4pt; color: #333; }
  a { color: #000; text-decoration: none; }
  .data-table { font-size: 7.4pt; }
  .wrong-table { font-size: 8pt; }
  h1, h2, h3, figure, .work-card, .block, tr { break-inside: avoid; }
}