/* Take a table with you (Road to Nine, Card 16): the two quiet buttons under a table, and
   what prints. Tokens only — no colour here that shell.css does not already name. */

.table-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 0 18px; margin: 2px 0 0; }
.table-tools .quiet { min-height: 44px; min-width: 44px; padding: 0 4px; font-size: 12px; line-height: 1; cursor: pointer; }
.table-tools .quiet:focus-visible { outline: 2px solid var(--plum); outline-offset: 2px; }
figure.artifact > .table-tools { margin-top: 6px; }

/* Print: the thread or the page, full width, black on white. No rail, Pages list,
   composer, account menu or control is printed; no table row is split across pages. */
@media print {
  #railHost, .composer-host, #sheetHost, #drawerHost, #authHost, #launch,
  .table-tools, .actions, .chips, .views, .art-right, .page-tools, .menu,
  .art-more summary, .note-host, .entry-host, .off-form, .decline-unlock,
  button, select, input, textarea { display: none !important; }

  html, body { background: Canvas !important; color: CanvasText !important; }
  .app, .main { display: block !important; min-height: 0 !important; width: auto !important; }
  .app *, .main * { text-shadow: none !important; box-shadow: none !important; }
  .app, .main, #pageHost, .thread-host, .thread-scroll, .thread, .page, .psheet,
  .artifact, .datasheet, .datasheet-view, .datasheet-scroll, thead th, tfoot td, .tile {
    background: Canvas !important; color: CanvasText !important;
  }
  .thread-scroll, .datasheet-scroll, .datasheet-view, #pageHost, .main {
    overflow: visible !important; height: auto !important; max-height: none !important; position: static !important;
  }
  .thread, .page, .psheet, .table-wrap, .datasheet { width: 100% !important; max-width: none !important; margin-left: 0 !important; margin-right: 0 !important; }
  .datasheet-view::after { display: none !important; }
  thead { display: table-header-group; }
  tr, .bar-row, .tile, figure.artifact { break-inside: avoid; page-break-inside: avoid; }
  a { color: CanvasText !important; text-decoration: none !important; }

  /* Card 17 (live check of Card 16): print is plain and full width. A chart's labels were
     printed on a beige box (the screen's paper-coloured halo) and an answer's cards kept their
     680 px screen measure on a page that is wider; the date gutter and the spine are not paper. */
  .art, .imp, .added, .alert, .decision .one, .review .one, .tiles, .tile, .cmp-cell { background: Canvas !important; max-width: none !important; }
  .art, .imp, .added, .alert, .cmp, .tiles { border-color: GrayText !important; }
  .trend text, .hm text, .chart text { stroke: none !important; paint-order: normal !important; fill: CanvasText !important; }
  .answer p, .answer ul, .answer ol, .review, .decision, .decision .lean, .review p.lead, .note-host, .entry-host, .alert-wrap, .page-state { max-width: none !important; }
  .thread::before, .psheet::before { display: none !important; }
  .gut { padding: 8px 0 0 !important; text-align: left !important; }
  .gut-mark { position: static !important; }
  .row, .psheet { display: block !important; }
  .body, .sec > .bd, .page-head .ph-t { padding-left: 0 !important; }
  .thread, .page { padding-right: 0 !important; padding-left: 0 !important; }
}