/* Paper. The round-2 design print sheet, class names matched to the site.
   Every page links this with media="print"; /set/{id}/checklist/ links it for all media so the screen
   view matches paper. The checklist's running header (set and ACN range) and footer (site + snapshot)
   are emitted per set by render.py as an inline @page rule. Paper size is left to the printer
   (Letter or A4); margins are in mm so both fit. */

/* Paper uses static Source Sans 3 and Source Serif 4 (Adobe's release instances, unmodified): Chrome writes variable fonts into
   PDFs as Type 3, which bloats long checklists. Fetched only for print (the checklist preloads them). */
@font-face { font-family: "Source Sans 3 Static"; src: url("fonts/SourceSans3-Regular.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: block; }
@font-face { font-family: "Source Sans 3 Static"; src: url("fonts/SourceSans3-Semibold.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: block; }
@font-face { font-family: "Source Serif 4 Static"; src: url("fonts/SourceSerif4-Regular.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: block; }
@font-face { font-family: "Source Serif 4 Static"; src: url("fonts/SourceSerif4-Semibold.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: block; }

@page {
  margin: 16mm 12mm 16mm 12mm;
  /* Margin boxes do not see :root custom properties, so these two greys are literal: --ink-mute, --ink. */
  @top-left { font: 600 8pt "Source Sans 3 Static", sans-serif; color: #5C564C; vertical-align: bottom; padding-bottom: 3mm; }
  @top-right { font: 500 8pt "IBM Plex Mono", monospace; color: #5C564C; vertical-align: bottom; padding-bottom: 3mm; }
  @bottom-left { font: 8pt "Source Sans 3 Static", sans-serif; color: #5C564C; vertical-align: top; padding-top: 3mm; }
  @bottom-right { content: "Page " counter(page) " of " counter(pages); font: 600 8pt "Source Sans 3 Static", sans-serif; color: #1A1714; vertical-align: top; padding-top: 3mm; }
}

@media print {
  /* Paper is always light, whatever the screen theme. */
  :root, :root[data-theme] {
    color-scheme: light;
    --paper: #fff; --paper-deep: #fff; --white: #fff; --ink: #000; --ink-mute: #444; --rule: #999;
    --control: #999; --tobacco: #8B2E1F;
    --print-hair: #BBB; --print-five: #666; --print-soft: #333;
    --font-sans: "Source Sans 3 Static", "Source Sans 3", sans-serif;
    --font-serif: "Source Serif 4 Static", "Source Serif 4", Georgia, serif;
  }
  html, body { background: var(--paper) !important; color: var(--ink); }
  header.site, footer.site, form.search, .banner, .skip, .crumbs, .no-print, .toolbar, .pager, .view-toggle,
  .theme-btn, .theme-row, .menu-toggle, #copy-status, button.copy { display: none !important; }
  main { padding: 0 !important; }
  .wrap { width: auto !important; max-width: none !important; margin: 0 !important; }
  a { color: inherit; text-decoration: none; }
}

/* ---- Printable checklist (screen and paper) ---- */
.checklist { max-width: 820px; }
.checklist .print-brand { display: none; }
.checklist-head {
  break-after: avoid; page-break-after: avoid;
  display: flex; justify-content: space-between; align-items: flex-end; gap: 12mm;
  border-bottom: 2px solid var(--ink); padding-bottom: 4mm; margin-bottom: 3mm;
}
.checklist-head .acn-xl code { font: inherit; }
.checklist-head .acn-xl { margin: 0; font-family: var(--font-mono); font-size: 2rem; font-weight: 500; line-height: 1.1; color: var(--tobacco); overflow-wrap: anywhere; }
.checklist-head h1 { font-family: var(--font-sans); font-size: 1.15rem; font-weight: 600; line-height: 1.25; margin: 0.15rem 0 0; }
.checklist-meta { font-size: 0.8rem; color: var(--ink-mute); margin: 0.35rem 0 0; }
.checklist-meta code { font-family: var(--font-mono); font-size: 0.78rem; }
.checklist-have { display: flex; align-items: flex-end; gap: 2mm; margin: 0; font: 600 0.85rem var(--font-sans); white-space: nowrap; }
.checklist-have .line { display: inline-block; width: 18mm; border-bottom: 1px solid var(--ink); height: 5mm; }
.checklist .toolbar { margin: 0.75rem 0; }

table.checklist-table { width: 100%; border-collapse: collapse; font-size: 0.85rem; line-height: 1.2; margin-top: 2mm; }
table.checklist-table thead { display: table-header-group; }
table.checklist-table th {
  font: 600 0.68rem var(--font-sans); text-transform: uppercase; letter-spacing: 0.08em; color: var(--ink-mute);
  text-align: left; border-bottom: 1px solid var(--ink); padding: 1.2mm 1.5mm;
}
table.checklist-table td { padding: 0.75mm 1.5mm; border-bottom: 0.5pt solid var(--rule); vertical-align: top; }
table.checklist-table tr { break-inside: avoid; page-break-inside: avoid; }
table.checklist-table tbody tr:nth-child(5n) td { border-bottom: 0.75pt solid var(--ink-mute); }   /* every 5th row: easier counting */
table.checklist-table td.acn code { font-family: var(--font-mono); font-size: 0.78rem; letter-spacing: 0; color: var(--ink); }
table.checklist-table td.acn b { font-weight: 600; }
table.checklist-table .no { width: 9mm; text-align: right; font-variant-numeric: tabular-nums; color: var(--ink-mute); white-space: nowrap; }
table.checklist-table .tick { width: 6mm; padding-right: 0; }
table.checklist-table .team { color: var(--ink-mute); }
table.checklist-table .vn { color: var(--ink-mute); font-size: 0.75rem; }
table.checklist-table td.tick::before, table.checklist-table th.tick::before {
  content: ""; display: inline-block; width: 3.2mm; height: 3.2mm; border: 0.8pt solid var(--ink); border-radius: 0.4mm; vertical-align: -0.5mm;
}
table.checklist-table th.tick::before { border-color: var(--control); }
.checklist-foot { overflow-wrap: anywhere; font-size: 0.75rem; color: var(--ink-mute); margin-top: 4mm; border-top: 0.5pt solid var(--rule); padding-top: 2mm; }

@media (max-width: 560px) {
  .checklist-head { flex-direction: column; align-items: flex-start; gap: 0.5rem; }
  .checklist-head .acn-xl { font-size: 1.5rem; }
  table.checklist-table .team { display: none; }
  table.checklist-table td.acn code { font-size: 0.7rem; overflow-wrap: anywhere; }
  table.checklist-table td.acn .seg { display: inline; }
}

@media print {
  .checklist { max-width: none; }
  .checklist .print-brand { display: block; height: 22px; width: auto; margin: 0 0 4mm; }
  .checklist-head .acn-xl { font-size: 20pt; }
  .checklist-head h1 { font-size: 14pt; margin-top: 1mm; }
  .checklist-meta { font-size: 8.5pt; color: var(--ink-mute); margin-top: 1.5mm; }
  .checklist-meta code { font-size: 8pt; }
  .checklist-have { font-size: 9pt; }
  table.checklist-table { font-size: 8.5pt; line-height: 1.15; }
  table.checklist-table th { font-size: 7pt; color: var(--ink-mute); border-bottom-color: var(--ink); }
  table.checklist-table td { border-bottom-color: var(--print-hair); }
  table.checklist-table tbody tr:nth-child(5n) td { border-bottom-color: var(--print-five); }
  table.checklist-table td.acn code { font-size: 8pt; white-space: nowrap; }
  table.checklist-table td.acn .seg { display: inline; }
  table.checklist-table .team { color: var(--print-soft); }
  table.checklist-table .vn { color: var(--ink-mute); font-size: 7.5pt; }
  table.checklist-table tbody { content-visibility: visible; }
  .checklist-foot { font-size: 7.5pt; color: var(--ink-mute); border-top-color: var(--rule); }
}
