/**
 * print.css — freddiejiang.one
 * Project sheets print as exhibit documents (PRINT SHEET button, or Cmd+P on
 * any #/work/<id> page). Tokens are remapped to paper; signal yellow → black.
 * Paper size follows the browser's print dialog (Letter / A4).
 */
@media print {
  :root, :root[data-theme] {
    --bg: #FFFFFF; --bg-inset: #F4F4F2; --bg-hover: #F4F4F2;
    --ink-900: #FFFFFF; --ink-800: #F4F4F2; --ink-700: #E8E8E5;
    --fg-1: #0D0F0E; --fg-2: #1F2120; --fg-3: #3A3D38; --fg-4: #5E635B; --fg-mute: #A9AAA6;
    --signal: #0D0F0E; --signal-ink: #FFFFFF; --datum: #0D0F0E;
    --hairline: rgba(0,0,0,0.14); --hairline-strong: rgba(0,0,0,0.28); --hairline-faint: rgba(0,0,0,0.05);
    --rule: rgba(0,0,0,0.14); --rule-strong: rgba(0,0,0,0.28);
    --hatch: rgba(0,0,0,0.06); --scrim: rgba(255,255,255,0); --scrim-0: rgba(255,255,255,0);
    --status-ok: #2F7D4A; --status-warn: #9A6400;
  }

  @page { margin: 16mm 16mm 18mm; }

  html, body { background: #FFFFFF !important; color: #0D0F0E !important; font-size: 10pt; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  html { scroll-behavior: auto; }

  /* Chrome and interactive elements */
  .ticker, .nav, .skip-link, .filters, .detail-bar, .detail-pager, .lightbox,
  .hero-cta, .contact-form, .form-actions, .theme-switch, .bar-btn, button { display: none !important; }

  /* Home sheet: the index is not the exhibit; detail sheets are */
  #work, #tools, #contact { display: none !important; }

  .hero, .detail-hero { padding: 0 0 14pt !important; border-bottom: 0.5pt solid rgba(0,0,0,0.2) !important; }
  .hero-grid { display: none !important; }
  .section, .detail-body, .detail-figures { padding: 14pt 0 !important; max-width: none !important; }
  .hero-display { font-size: 44pt !important; }
  .detail-title { font-size: 26pt !important; max-width: none !important; }
  .title-strip { margin-bottom: 10pt !important; font-size: 7pt !important; }
  .detail-tags { margin-top: 8pt !important; font-size: 8pt !important; }

  .detail-spec-grid { grid-template-columns: 1.6fr 1fr 1fr 1.3fr 0.9fr !important; margin-top: 14pt !important; }
  .detail-spec { padding: 7pt 8pt !important; gap: 4pt !important; }
  .detail-spec dt { font-size: 6.5pt !important; }
  .detail-spec dd { font-size: 8.5pt !important; }
  .outcome-strip { padding: 7pt 8pt !important; }
  .verified-badge.lg { font-size: 8.5pt !important; }
  .status-pill { font-size: 7pt !important; padding: 1pt 5pt !important; }

  .critical-role-block { padding: 10pt 14pt !important; margin: 0 0 14pt !important; border-left: 2pt solid #0D0F0E !important; break-inside: avoid; }
  .critical-role-block .label { font-size: 7pt !important; margin-bottom: 4pt !important; }
  .critical-role-block .text { font-size: 10.5pt !important; line-height: 1.5 !important; }
  .detail-body .detail-lede { font-size: 11pt !important; margin-bottom: 14pt !important; }
  .problem-block, .outcome-block, .timeline-block { margin-bottom: 12pt !important; break-inside: avoid; }
  .problem-block p, .outcome-block p, .step-text { font-size: 9.5pt !important; }
  .process-item { padding: 3pt 0 3pt 12pt !important; break-inside: avoid; }

  .detail-figures { grid-template-columns: 1fr 1fr !important; gap: 10pt !important; }
  .detail-fig { break-inside: avoid; }
  .detail-fig .caption { font-size: 6.5pt !important; }

  .process-row { padding: 6pt 0 !important; grid-template-columns: 50pt 1fr 110pt !important; break-inside: avoid; }
  .process-row .pr-tags { display: none !important; }
  .pr-title { font-size: 11pt !important; }
  .pr-body { font-size: 8.5pt !important; }
  .about-body p, .about-body p:first-child { font-size: 10.5pt !important; }

  h1, h2, .section-head { break-after: avoid; }

  /* Show destinations of meaningful outbound links */
  .arrow-link[href^="http"]::after, .contact-direct a[href^="http"]::after {
    content: " (" attr(href) ")"; font-size: 6.5pt; color: #5E635B; word-break: break-all; letter-spacing: 0; text-transform: none;
  }

  .foot { padding: 10pt 0 0 !important; font-size: 6.5pt !important; }
  .foot-row.sub { display: none !important; }
}

/* 2026.10.16 — long-form exhibit blocks on paper */
@media print {
  .detail-links { display: none !important; }
  .detail-metrics { border: 0.5pt solid rgba(0,0,0,0.2) !important; }
  .detail-metrics .metric { padding: 6pt 8pt !important; }
  .detail-metrics b { font-size: 18pt !important; }
  .detail-metrics span { font-size: 6.5pt !important; margin-top: 4pt !important; }
  .detail-sections { padding: 0 !important; max-width: none !important; }
  .long-sec { padding: 12pt 0 !important; break-inside: auto; }
  .long-sec-head { margin-bottom: 8pt !important; break-after: avoid; }
  .long-sec-title { font-size: 15pt !important; }
  .long-sec-body.with-figs { grid-template-columns: 1.2fr 1fr !important; gap: 14pt !important; }
  .long-sec-text > p, .long-ticks li, .long-lessons p, .detail-table td, .long-callout p { font-size: 9pt !important; }
  .long-lessons h3 { font-size: 10pt !important; }
  .long-ticks li, .long-lessons li, .detail-table tr, .long-callout, .sec-fig { break-inside: avoid; }
}

/* 2026.10.16 — compare slider prints as a side-by-side pair */
@media print {
  .detail-compare { padding: 10pt 0 !important; break-inside: avoid; }
  .compare-hint, .compare-handle, .compare-plate input { display: none !important; }
  .compare-plate { display: grid !important; grid-template-columns: 1fr 1fr; gap: 6pt; border: 0 !important; background: none !important; }
  .compare-plate .compare-top { position: static !important; clip-path: none !important; height: auto !important; }
  .compare-tag { top: 4pt !important; color: #fff !important; }
  .compare-tag.l { left: 6pt !important; } .compare-tag.r { left: calc(50% + 9pt) !important; right: auto !important; }
}