/* Print stylesheet — loaded only via media="print". The whole design
   leans on a book/document metaphor (the fleuron, the colophon, crop
   marks); actually printing well is the same idea taken literally.
   Independent of tokens.css on purpose — printed paper isn't the deep
   green-black ground, it's ink on white, so colors are hardcoded here
   rather than reading the (dark) custom properties. */

@page {
  margin: 2cm;
}

/* Chrome that means nothing on paper */
.vhs,
.crop-marks,
.sakura-outer,
.site-nav-inline,
.button-wall,
.site-wall-wrap,
.site-colophon,
.post-back,
.theme-toggle {
  display: none !important;
}

html,
body {
  background: #fff !important;
  color: #000 !important;
}

.site-shell {
  padding: 0;
}

.site-masthead {
  border-bottom: 1px solid #000;
}
.site-title {
  color: #000;
}

.mod-box,
.post-body pre,
.post-body code {
  border-color: #999 !important;
  background: none !important;
}
.mod-box {
  border-top-color: #000 !important;
}

.post-title,
.mod-header,
.post-body h2,
.post-body h3,
.post-body h4 {
  color: #000 !important;
}
.post-meta,
.mod-header__meta,
.link-row__date {
  color: #444 !important;
}

/* Classic print-stylesheet footnote trick — show the actual destination
   next to a link, since "click here" means nothing on paper. Scoped to
   post prose only; nav/decorative links would just add noise. */
.post-body a[href]::after {
  content: " (" attr(href) ")";
  font-size: 0.75em;
  color: #444;
}

/* Sane pagination */
p,
li {
  orphans: 3;
  widows: 3;
}
h1,
h2,
h3,
.mod-header {
  break-after: avoid;
}
.mod-box,
.post-stream-entry,
pre {
  break-inside: avoid;
}