/* PDF and print. Loaded with media="print"; the build renders it with headless Chrome. */

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

html { scroll-behavior: auto; }
body { background: #FFFFFF; }

.skip, .sidenav, .topbar__pdf, .screen-only, .quick, .dl, .more, #footer-tokens { display: none !important; }

.topbar {
  position: static; height: auto;
  padding: 0 0 6mm;
  background: none; border: 0;
  -webkit-backdrop-filter: none; backdrop-filter: none;
}
.layout { display: block; max-width: none; padding: 0; }
main { padding: 0; }

.section { break-before: page; padding-block: 0 8mm; border-top: 0; }
.section:first-child { break-before: auto; }
.section__head { margin-bottom: 8mm; }
.block { margin-top: 10mm; }
.intro { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); padding-top: 20mm; }

.card, .logo-card, .swatch, .misuse__item, .principle, .device, .shot, .mock, .specimen,
.gradient-card, .tester, .clearspace, .minsize, .dodont__col, .ba, .spec, .scale__row, tr, figure {
  break-inside: avoid;
}

.chip { padding: 0; background: none; cursor: auto; }
.chip svg { display: none; }

h2, h3, .sub, .sub-lede, .swatch-group > h3 { break-after: avoid; }
.two-col > div, .sub-lede { break-inside: avoid; }
.swatch-group { break-inside: avoid; }

.logo-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.swatches { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.swatch__block { height: 72px; padding: 10px 12px; font-size: 14px; }
.swatch__body { padding: 10px 12px 12px; }
.swatch__role { min-height: 0; font-size: 12px; margin-bottom: 8px; }
.swatch__vals div { grid-template-columns: 42px minmax(0, 1fr); }
.swatch__vals .chip { font-size: 11px; }
.misuse { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.table-wrap { overflow: visible; }
.contrast { min-width: 0; }

.print-only { display: flex !important; }
.print-toc {
  display: grid !important; gap: 0;
  margin: 18mm 0 0; padding: 0; list-style: none;
  border-top: 1px solid rgba(34, 34, 34, 0.15);
}
.print-toc li {
  display: flex; gap: 10mm; align-items: baseline;
  padding: 3.2mm 0;
  border-bottom: 1px solid rgba(34, 34, 34, 0.15);
  font-family: var(--font-heading); font-size: 20px; font-weight: 500;
}
.print-toc span { width: 10mm; font-family: var(--font-body); font-size: 12px; font-weight: 600; color: var(--c-muted); }

.mock__frame, .card { box-shadow: none; }
a { text-decoration: none; }

/* Shadows smudge in print; hairlines instead */
* { box-shadow: none !important; }
.card, .principle, .dodont__col, .spec, .table-wrap, .misuse__stage, .swoosh-hero__stage--light, .device__stage--bg, .ba--after, .mock__frame {
  border: 1px solid rgba(34, 34, 34, 0.12);
}

.notch__hero { height: 150px; padding-bottom: 40px; }
.spec .chip { white-space: normal; }