/* The claim packet (2026-09-03, completed 2026-09-04) on /profile.html:
   the entry at the top of My Preparation, the chooser, the review and the
   printed paper. Screen styles use tokens; the paper and the print rules are
   always dark ink on white, whatever the theme.

   No paragraph in these panels carries its own max-width, so every one of
   them spans the same band as the one above it (THE SYMMETRY LAW): the card
   is the measure here, exactly as it is for the rest of this profile card. */

/* ── The entry at the top of My Preparation ─────────────────────────────── */
.pkx {
  margin: 0 0 var(--space-4);
  padding: var(--space-4);
  border: 2px solid var(--color-accent);
  border-radius: var(--radius-md);
  background: var(--color-surface);
}
.pkx-h { margin: 0 0 var(--space-2); font-size: var(--text-lg); line-height: 1.25; color: var(--color-text-strong, var(--color-text)); }
.pkx-lede, .pkx-choose, .pkx-empty, .pkx-alt, .pkx-status, .pkx-links {
  margin: 0 0 var(--space-3); font-size: var(--text-body); line-height: 1.55; color: var(--color-text-muted);
}
.pkx-choose { color: var(--color-text); font-weight: 600; }
.pkx-status-error { color: var(--color-danger); font-weight: 600; }
.pkx-link { color: var(--color-primary); font-weight: 600; }
.pkx-alt { margin-bottom: 0; }
.pkx-list { display: grid; gap: var(--space-3); }
/* THE BUTTON LAW: a distinct 2px accent border, the cursor-following gold
   glow from card-fx.js (`cardfx-pop`), and a hover that shifts the border. */
.pkx-journey {
  display: block; width: 100%; min-width: 0; text-align: left;
  min-height: 44px; padding: var(--space-3) var(--space-4);
  border: 2px solid var(--color-accent); border-radius: var(--radius-md);
  background: var(--color-bg-alt, var(--color-bg)); color: var(--color-text);
  font: inherit; cursor: pointer;
}
.pkx-journey:hover, .pkx-journey:focus-visible { border-color: var(--color-primary); }
.pkx-journey:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }
.pkx-journey-name { display: block; font-size: var(--text-md); font-weight: 700; color: var(--color-text-strong, var(--color-text)); overflow-wrap: anywhere; }
.pkx-journey-conditions { display: block; margin-top: 2px; font-size: var(--text-body); line-height: 1.5; color: var(--color-text); overflow-wrap: anywhere; }
.pkx-journey-meta { display: block; margin-top: 2px; font-size: var(--text-sm); color: var(--color-text-muted); overflow-wrap: anywhere; }
.pkx-journey-go { display: block; margin-top: var(--space-2); font-size: var(--text-body); font-weight: 700; color: var(--color-primary); }
.pkx-btn {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 44px; padding: var(--space-2) var(--space-4);
  border: 2px solid var(--color-accent); border-radius: var(--radius-sm);
  background: var(--color-surface); color: var(--color-primary);
  font: inherit; font-weight: 700; cursor: pointer;
}
.pkx-btn:hover, .pkx-btn:focus-visible { border-color: var(--color-primary); }
.pkx-btn:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }

.pk { margin: 0 0 var(--space-5); }
.pk-claim { margin: 0 0 var(--space-2); font-size: var(--text-body); font-weight: 600; color: var(--color-text); overflow-wrap: anywhere; }
.pk-title { margin: 0 0 var(--space-2); font-size: var(--text-xl); line-height: 1.2; color: var(--color-text-strong, var(--color-text)); }
.pk-title:focus { outline: none; }
.pk-lede { margin: 0 0 var(--space-3); max-width: 70ch; font-size: var(--text-body); line-height: 1.55; color: var(--color-text-muted); }
.pk-steps { margin: 0 0 var(--space-4); font-size: var(--text-sm); font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--color-primary); }
.pk-note { margin: var(--space-2) 0; font-size: var(--text-body); line-height: 1.5; color: var(--color-text-muted); }
.pk-note-error { color: var(--color-danger); }
.pk-status { margin: var(--space-2) 0 0; min-height: 1.3em; font-size: var(--text-body); line-height: 1.5; color: var(--color-text); }
.pk-status-ok { color: var(--color-success); font-weight: 600; }
.pk-status-error { color: var(--color-danger); font-weight: 600; }

.pk-btn {
  display: inline-flex; align-items: center; justify-content: center; text-align: center;
  min-height: 44px; padding: var(--space-2) var(--space-4);
  border: 2px solid var(--color-accent); border-radius: var(--radius-sm);
  background: var(--color-primary); color: var(--color-bg);
  font: inherit; font-size: var(--text-body); font-weight: 700; cursor: pointer;
}
.pk-btn:hover, .pk-btn:focus-visible { border-color: var(--color-primary); }
.pk-btn:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }
.pk-btn:disabled { opacity: .5; cursor: not-allowed; }
.pk-btn-secondary, .pk-btn-quiet { background: var(--color-surface); color: var(--color-primary); }
.pk-btn-quiet { font-weight: 600; }
.pk-textbtn { min-height: 44px; border: 0; background: none; color: var(--color-primary); font: inherit; font-size: var(--text-body); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; padding: var(--space-1) var(--space-1); }
.pk-textbtn:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }
.pk-actions { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-top: var(--space-3); }

/* Step 1 */
.pk-layout { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: var(--space-5); align-items: start; }
.pk-choices { min-width: 0; }
.pk-toolbar { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--space-2) var(--space-4); margin-bottom: var(--space-3); font-size: var(--text-body); color: var(--color-text-muted); }
.pk-toolbar-actions { display: flex; flex-wrap: wrap; column-gap: var(--space-4); row-gap: var(--space-1); }
.pk-condition { border: 1px solid var(--color-accent); border-radius: var(--radius-md); background: var(--color-surface); margin-bottom: var(--space-4); overflow: hidden; }
.pk-condition-head { padding: var(--space-4) var(--space-4) var(--space-3); }
.pk-condition-head h3 { margin: 0; font-size: var(--text-md); color: var(--color-text-strong, var(--color-text)); }
.pk-condition-head p { margin: var(--space-1) 0 0; font-size: var(--text-sm); color: var(--color-text-muted); }
/* One row, one line (Phase 2, P2-2, 2026-09-08). The tick and the wording
   take the width they need; "Where this came from" sits beside them rather
   than under them, because a second line per row turned ten choices back
   into a long page. The statement Include control and a refusal notice wrap
   to their own full-width line, since both are things to read and answer. */
.pk-item { display: flex; flex-wrap: wrap; align-items: flex-start; column-gap: var(--space-3); border-top: 1px solid var(--color-border); padding: var(--space-2) var(--space-4); }
.pk-item > .pk-pick { flex: 1 1 60%; min-width: 0; }
.pk-item > .pk-include, .pk-item > .pk-refused-note { flex: 1 1 100%; }
.pk-item.is-selected { background: var(--color-bg-alt, var(--color-bg)); }
.pk-pick { display: flex; align-items: flex-start; gap: var(--space-3); min-height: 44px; cursor: pointer; }
.pk-pick input { width: 22px; height: 22px; flex: 0 0 22px; margin: 2px 0 0; accent-color: var(--color-primary); }
.pk-pick strong { display: block; font-size: var(--text-body); color: var(--color-text); overflow-wrap: anywhere; }
.pk-pick small { display: block; margin-top: 2px; font-size: var(--text-sm); line-height: 1.45; color: var(--color-text-muted); overflow-wrap: anywhere; }
.pk-empty-condition { margin: 0 0 var(--space-3); font-size: var(--text-sm); color: var(--color-text-muted); }
/* An item the server refused (changed, removed, recreated, or now connected
   to a claim). It is unchecked and needs a deliberate fresh confirmation. */
.pk-refused-note { margin: var(--space-2) 0 0; padding: var(--space-2) var(--space-3); border-left: 3px solid var(--color-danger); font-size: var(--text-sm); line-height: 1.5; color: var(--color-text); }

/* The claim overview: every condition on the claim, on screen and on paper. */
.pk-overview-screen { margin: 0 0 var(--space-4); padding: var(--space-4); border: 1px solid var(--color-accent); border-radius: var(--radius-md); background: var(--color-surface); }
.pk-overview-screen h3 { margin: 0 0 var(--space-2); font-size: var(--text-md); color: var(--color-text-strong, var(--color-text)); }
.pk-overview-screen .pk-overview-note { margin: 0 0 var(--space-3); font-size: var(--text-sm); line-height: 1.5; color: var(--color-text-muted); }
.pk-overview-list { list-style: none; margin: 0; padding: 0; }
.pk-overview-list li { padding: var(--space-2) 0; border-top: 1px solid var(--color-border); min-width: 0; }
.pk-overview-list li:first-child { border-top: 0; }
.pk-overview-list strong { display: block; font-size: var(--text-body); overflow-wrap: anywhere; }
.pk-overview-rel, .pk-overview-count { display: block; font-size: var(--text-sm); line-height: 1.5; color: var(--color-text-muted); overflow-wrap: anywhere; }
/* Connection pathways under a condition (2026-09-06): the paths the veteran
   chose to organize, once per condition, beside its relationship. */
.pk-paths { display: block; margin-top: 4px; }
.pk-paths-lead { display: block; font-size: var(--text-sm); font-weight: 700; color: var(--color-text); }
.pk-paths-list { margin: 2px 0 0; padding-left: 1.2em; font-size: var(--text-sm); line-height: 1.5; color: var(--color-text); }
.pk-paths-list li { padding: 1px 0; border: 0; overflow-wrap: anywhere; }
.pk-paths-answers { margin: 2px 0 0; padding-left: 1.1em; font-size: var(--text-sm); color: var(--color-text-muted); }
.pk-paths-footer { margin-top: var(--space-2); }

/* The optional "Not connected yet" section of the chooser. */
.pk-free { margin: var(--space-5) 0 var(--space-4); padding: var(--space-4); border: 1px dashed var(--color-accent); border-radius: var(--radius-md); }
.pk-free-h { margin: 0 0 var(--space-2); font-size: var(--text-md); color: var(--color-text-strong, var(--color-text)); }
.pk-free-h:focus { outline: none; }
.pk-free-note { margin: 0 0 var(--space-3); font-size: var(--text-sm); line-height: 1.55; color: var(--color-text-muted); }
.pk-condition-free { border-style: dashed; }

/* "Before you print": what is in, what was left out, what came from outside
   the claim, and which conditions have nothing saved. */
.pk-review-check { margin: var(--space-4) 0 0; padding: var(--space-4); border: 1px solid var(--color-accent); border-radius: var(--radius-md); background: var(--color-surface); }
.pk-review-check h3 { margin: 0 0 var(--space-2); font-size: var(--text-md); color: var(--color-text-strong, var(--color-text)); }
.pk-review-check ul { margin: 0; padding-left: 18px; font-size: var(--text-body); line-height: 1.6; color: var(--color-text); }
.pk-review-check li { margin: var(--space-2) 0; overflow-wrap: anywhere; }
/* Narrowing and paging the chooser (Phase 2, P2-2, 2026-09-08): three plain
   boxes and ten rows at a time, so a claim with hundreds of saved items is a
   short screen instead of a document. */
.pk-filters { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--space-3); margin-bottom: var(--space-4); padding: var(--space-3) var(--space-4); border: 1px solid var(--color-accent); border-radius: var(--radius-md); background: var(--color-surface); }
.pk-filter { display: flex; flex-direction: column; gap: 4px; min-width: 0; flex: 1 1 200px; }
.pk-filter label { font-size: var(--text-sm); font-weight: 700; color: var(--color-text); }
.pk-filter select, .pk-filter input { width: 100%; min-height: 44px; padding: 6px 8px; font: inherit; font-size: 16px; border: 1px solid var(--color-border); border-radius: var(--radius-sm); background: var(--color-bg); color: var(--color-text); }
.pk-filter select:focus-visible, .pk-filter input:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }
.pk-filter-count { flex: 1 1 100%; margin: 0; font-size: var(--text-sm); line-height: 1.5; color: var(--color-text-muted); }
/* The phone dock (Codex R5, 2026-09-08). On a phone the summary panel is its
   own tall block, so wherever it sat the count and Preview were far from the
   rows being ticked. This short bar sticks to the bottom of the screen while
   choices are made. It is NOT a second Preview: at this width the panel's own
   Preview button is hidden, so exactly one is ever on screen. */
.pk-dock { display: none; }
.pk-filters-free { margin-top: var(--space-3); }
.pk-search-limit { flex: 1 1 100%; margin: 0; padding-top: var(--space-2); border-top: 1px solid var(--color-border); }
.pk-search-limit .pk-note { margin: 0 0 var(--space-2); }
.pk-pager { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3); margin: var(--space-4) 0; }
.pk-pager-at { font-size: var(--text-body); color: var(--color-text); }
/* Where a row came from, folded away by default. */
.pk-item-more { flex: 0 0 auto; margin: 0; align-self: center; }
.pk-item-more summary { min-height: 44px; display: inline-flex; align-items: center; font-size: var(--text-sm); font-weight: 600; color: var(--color-primary); cursor: pointer; }
.pk-item-more summary:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }
.pk-item-more[open] { flex: 1 1 100%; align-self: flex-start; }
.pk-item-sub { margin: 4px 0 0; font-size: var(--text-sm); line-height: 1.45; color: var(--color-text-muted); overflow-wrap: anywhere; }
.pk-summary { position: sticky; top: var(--space-4); max-height: calc(100vh - 2 * var(--space-4)); overflow: auto; border: 1px solid var(--color-accent); border-radius: var(--radius-md); background: var(--color-surface); padding: var(--space-4); }
.pk-summary h3 { margin: 0; font-size: var(--text-md); color: var(--color-text-strong, var(--color-text)); }
.pk-count { margin-top: var(--space-3); font-family: var(--font-serif); font-size: var(--text-3xl); line-height: 1.1; color: var(--color-primary); }
.pk-count-label { font-size: var(--text-sm); color: var(--color-text-muted); }
.pk-selection-summary ul { margin: var(--space-3) 0 0; padding-left: 18px; font-size: var(--text-sm); }
.pk-selection-summary li { margin: var(--space-2) 0; }
.pk-summary .pk-btn { width: 100%; margin-top: var(--space-4); }
.pk-privacy { margin: var(--space-3) 0 0; padding-top: var(--space-3); border-top: 1px solid var(--color-border); font-size: var(--text-sm); line-height: 1.5; color: var(--color-text-muted); }
/* The discussion-cover tick and the conditions-only note (2026-09-04). */
.pk-cover { display: flex; align-items: flex-start; gap: var(--space-2); margin-top: var(--space-4); font-weight: 600; color: var(--color-text); cursor: pointer; }
.pk-cover input { width: 22px; height: 22px; margin: 1px 0 0; flex: none; accent-color: var(--color-primary); }
.pk-cover-note { margin: var(--space-1) 0 0; font-size: var(--text-sm); line-height: 1.5; color: var(--color-text-muted); }
.pk-privacy + .pk-privacy { border-top: 0; padding-top: 0; }

/* Step 2 */
.pk-preview-toolbar { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--space-3); margin: var(--space-4) 0; }
.pk-preview-toolbar .pk-btn { min-width: 170px; }
.pk-preview-info { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-4); font-size: var(--text-body); color: var(--color-text-muted); }
/* The preview stays white in every theme. Scope its ink tokens here so
   table cells and notes cannot inherit pale dark-mode text from the page.
   This also covers Auto mode without a data-theme attribute. */
.pk-paper {
  --color-text: #1a1a2e;
  --color-text-strong: #0e2a4d;
  --color-text-muted: #5a6478;
  --color-border: #c5c8cc;
  background: #fff; color: var(--color-text); border: 1px solid var(--color-border);
  max-width: 850px; margin: var(--space-5) auto 0; padding: 38px 42px;
  box-shadow: 0 8px 28px rgba(0,0,0,.06);
}
.pk-paper h2, .pk-paper h3, .pk-paper h4 { color: #0e2a4d; }
.pk-paper-header { display: flex; justify-content: space-between; align-items: center; gap: var(--space-4); border-bottom: 2px solid #b07a1f; padding-bottom: 18px; }
.pk-paper-title { font: 700 30px/1.2 var(--font-serif); color: #0e2a4d; }
.pk-paper-meta { font-size: 12px; color: #5a6478; margin-top: 6px; }
.pk-notice { font-size: 12px; color: #5a6478; margin: 16px 0 24px; }
.pk-group { margin-top: 30px; }
.pk-cover-paper { margin: 18px 0 8px; padding: 14px 16px; border: 1px solid #333; break-inside: avoid; }
.pk-cover-paper h2 { margin: 0 0 4px; font-size: 16px; }
.pk-cover-paper h3 { margin: 12px 0 4px; font-size: 13px; }
.pk-cover-lede, .pk-cover-empty { margin: 0; font-size: 12px; color: #444; }
.pk-cover-list { margin: 0; padding-left: 18px; font-size: 12.5px; line-height: 1.45; }
.pk-cover-from { display: block; font-size: 11px; color: #555; }
.pk-group > h2 { font: 700 23px/1.3 var(--font-serif); border-bottom: 1px solid #b07a1f; padding-bottom: 9px; margin: 0; }
.pk-relation { display: block; margin-top: 3px; font: 400 14px/1.5 var(--font-sans); }
.pk-item-paper { margin: 22px 0 32px; }
.pk-ws-heading { display: flex; justify-content: space-between; gap: var(--space-4); align-items: flex-start; }
.pk-ws-heading h3 { margin: 0; font-size: 17px; line-height: 1.4; overflow-wrap: anywhere; }
.pk-paper .pk-textbtn { color: #0e2a4d; white-space: nowrap; font-size: 13px; min-height: 36px; }
.pk-source { font-size: 11px; color: #5a6478; line-height: 1.6; margin: 5px 0 15px; overflow-wrap: anywhere; }
.pk-extra-h { font-size: 13px; margin: 14px 0 0; }
.pk-unit { border-top: 1px solid #dde2e8; padding: 13px 0; }
.pk-unit-head { display: flex; gap: var(--space-4); justify-content: space-between; align-items: flex-start; }
.pk-unit-head h4 { font-size: 13px; margin: 0; line-height: 1.5; flex: 1; }
.pk-answer { font: 16px/1.6 var(--font-serif); white-space: pre-wrap; overflow-wrap: anywhere; margin: 8px 0 2px; }
.pk-entry-field { margin: 12px 0; }
.pk-entry-field dt { font: 700 12px/1.5 var(--font-sans); }
.pk-entry-field dd { font: 16px/1.6 var(--font-serif); margin: 4px 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.pk-paper-foot { font-size: 11px; color: #5a6478; border-top: 1px solid #b07a1f; padding-top: 14px; margin-top: 30px; }
/* The overview on the paper: dark ink on white like the rest of the sheet. */
.pk-paper .pk-overview { margin: 0 0 26px; padding: 0 0 18px; border-bottom: 1px solid #dde2e8; }
.pk-paper .pk-overview h2 { font: 700 18px/1.3 var(--font-serif); margin: 0 0 6px; }
.pk-paper .pk-overview-note { font-size: 11px; color: #5a6478; margin: 0 0 10px; line-height: 1.55; }
.pk-paper .pk-overview-list li { padding: 7px 0; border-top: 1px solid #eef1f4; }
.pk-paper .pk-overview-list li:first-child { border-top: 0; }
.pk-paper .pk-overview-list strong { font-size: 14px; }
.pk-paper .pk-overview-rel, .pk-paper .pk-overview-count { font-size: 11px; color: #5a6478; }
.pk-paper .pk-paths-lead { font-size: 11.5px; color: #1b2430; margin-top: 3px; }
.pk-paper .pk-paths-list { font-size: 11.5px; color: #1b2430; line-height: 1.5; }
.pk-paper .pk-paths-list li { padding: 1px 0; border: 0; }
.pk-paper .pk-paths-answers { font-size: 11px; color: #5a6478; }
.pk-paper .pk-paths-footer { margin-top: 8px; }
.pk-empty { padding: var(--space-6); border: 1px solid var(--color-accent); border-radius: var(--radius-md); background: var(--color-surface); text-align: center; margin: var(--space-5) 0; }
/* Printed only by a native print that was not armed by the Print button
   (nothing reviewed, auth lost, or a refused revalidation). Never on screen. */
.pk-print-notice { display: none; }
.pk-empty h3 { margin: 0 0 var(--space-2); font-size: var(--text-lg); }

@media (max-width: 700px) {
  .pk-layout { grid-template-columns: 1fr; }
  /* Stacked, the summary is its own row, so sticking it does nothing but
     risk a panel that covers the list on a short screen. It goes FIRST
     instead: on a phone it sat below the list, the optional not-connected
     section and everything else, so the count of what was chosen and the
     Preview button were the last things on the page. Reading "your packet"
     before choosing is the sensible order anyway. */
  .pk-summary { position: static; max-height: none; overflow: visible; order: -1; margin-bottom: var(--space-4); }
  .pk-filter { flex: 1 1 100%; }
  .pk-summary > [data-pk-preview] { display: none; }
  .pk-dock {
    position: sticky; bottom: 0; z-index: 30;
    display: flex; align-items: center; justify-content: space-between; gap: var(--space-3);
    margin: var(--space-3) 0 0; padding: var(--space-2) var(--space-3);
    border: 2px solid var(--color-accent); border-radius: var(--radius-sm);
    background: var(--color-surface); box-shadow: var(--shadow-sm);
  }
  .pk-dock-count { font-size: var(--text-body); font-weight: 700; color: var(--color-text); }
  .pk-dock .pk-btn { width: auto; margin: 0; flex: 0 0 auto; }
  .pk-pager { justify-content: center; }
  .pk-pager-at { order: -1; flex: 1 1 100%; text-align: center; }
  .pk-paper { padding: 20px 16px; }
  .pk-ws-heading, .pk-unit-head { flex-direction: column; gap: 6px; }
  .pk-paper .pk-textbtn { min-height: 44px; white-space: normal; }
  .pk-preview-toolbar .pk-btn { flex: 1 1 100%; }
}

/* Print: ONLY the reviewed packet. Everything else on the profile is hidden
   while body.printing-packet is set; without that class the profile prints
   as itself and this section prints nothing. */
@media print {
  #my-preparation-packet { display: none; }
  /* Both the direct claim workspace and Profile's nested saved-library view
     must retain the packet's ancestors while excluding all other account UI. */
  body.printing-packet { display: block !important; min-height: 0 !important; height: auto !important; }
  body.printing-packet #main-content { display: block !important; flex: none !important; min-height: 0 !important; width: auto !important; max-width: none; margin: 0 !important; padding: 0 !important; }
  body.printing-packet > *:not(#main-content) { display: none !important; }
  body.printing-packet #main-content > *:not(#my-preparation-card):not(#my-preparation-library) { display: none !important; }
  body.printing-packet #my-preparation-library { display: block !important; }
  body.printing-packet #my-preparation-library > *:not(#my-preparation-card) { display: none !important; }
  body.printing-packet #my-preparation-card > *:not(#my-preparation-packet) { display: none !important; }
  /* The card is hidden on screen once the session ends; the fenced packet
     (its notice) must still be the only thing a native print produces. */
  body.printing-packet #my-preparation-card { display: block !important; }
  body.printing-packet #my-preparation-packet { display: block !important; }
  body.printing-packet #my-preparation-packet .pk-screen-only,
  body.printing-packet #my-preparation-packet .pk-no-print,
  body.printing-packet #my-preparation-packet .pk-empty,
  body.printing-packet #my-preparation-packet .pk-actions,
  body.printing-packet #my-preparation-packet .pk-note,
  body.printing-packet #my-preparation-packet .pk-status,
  body.printing-packet #my-preparation-packet .pk-title,
  body.printing-packet #my-preparation-packet .pk-lede,
  body.printing-packet #my-preparation-packet .pk-steps,
  /* The chooser's own claim line, its overview and its optional section are
     direct children of the section, so they are named here too: a native
     print while the chooser is open must produce the notice and nothing
     that names the veteran's claim. */
  body.printing-packet #my-preparation-packet .pk-claim,
  body.printing-packet #my-preparation-packet .pk-overview-screen,
  body.printing-packet #my-preparation-packet .pk-free,
  body.printing-packet #my-preparation-packet .pk-review-check,
  body.printing-packet #my-preparation-packet .pk-layout { display: none !important; }
  /* Not armed by the Print button: the paper does not print, the notice does. */
  body.printing-packet.pk-print-blocked #my-preparation-packet .pk-paper { display: none !important; }
  body.printing-packet.pk-print-blocked #my-preparation-packet .pk-print-notice { display: block !important; font-size: 13pt; line-height: 1.5; color: #111 !important; }
  body.printing-packet,
  body.printing-packet #main-content,
  body.printing-packet #my-preparation-library,
  body.printing-packet #my-preparation-card,
  body.printing-packet #my-preparation-packet,
  body.printing-packet .pk-paper,
  body.printing-packet .pk-paper * { background: #fff !important; background-image: none !important; color: #111 !important; box-shadow: none !important; }
  body.printing-packet #my-preparation-card { border: 0; padding: 0 !important; margin: 0 !important; }
  /* An internal inset survives a browser's zero-margin print setting. Clone
     the paper decoration at page breaks, without introducing a named-page
     boundary inside the existing Profile wrapper. */
  body.printing-packet .pk-paper {
    border: 0; max-width: none; margin: 0;
    padding: 0.5in !important;
    box-sizing: border-box;
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
  }
  body.printing-packet .pk-paper h2, body.printing-packet .pk-paper h3, body.printing-packet .pk-paper h4, body.printing-packet .pk-paper-title { color: #0e2a4d !important; }
  body.printing-packet .pk-paper-title { font-size: 24pt; }
  body.printing-packet .pk-group > h2 { font-size: 18pt; break-after: avoid; }
  body.printing-packet .pk-ws-heading h3, body.printing-packet .pk-unit-head h4, body.printing-packet .pk-entry-field dt, body.printing-packet .pk-source { break-after: avoid; }
  body.printing-packet .pk-answer, body.printing-packet .pk-entry-field dd { font-size: 11pt; orphans: 3; widows: 3; }
  body.printing-packet .pk-paper-header { break-inside: avoid; }
  body.printing-packet .pk-unit { break-inside: auto; }
  body.printing-packet a { color: #000 !important; text-decoration: none; }
}

/* Statements in the printed copy (2026-09-05, Checkpoint 3): the author's own
   words as typed, line breaks kept; nothing stamped on the block. */
.pk-statement-body { font: 16px/1.6 var(--font-serif); white-space: pre-wrap; overflow-wrap: anywhere; margin: 10px 0 2px; }

/* Attached PDF pages in the copy (2026-09-05, Checkpoint 4): one image per
   page, page-sized, never split across sheets; the include choice on a
   statement row; the pages status line above the paper. */
.pk-include { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 6px 0 0 34px; font-size: 14px; }
.pk-include-select { min-height: 44px; font-size: 16px; padding: 6px 8px; border: 1px solid var(--color-border); border-radius: var(--radius-sm); background: var(--color-surface); color: var(--color-text); }
.pk-file-note { font: 13px/1.5 var(--font-sans); color: #444; margin: 6px 0 10px; }
.pk-page { display: block; width: 100%; max-width: 7.5in; margin: 0 auto 12px; border: 1px solid #ccc; break-inside: avoid; page-break-inside: avoid; }
.pk-pages { margin: 8px 0 0; font-size: 14px; line-height: 1.5; color: var(--color-text-muted); min-height: 1.2em; }
.pk-pages.is-error { color: var(--color-danger); font-weight: 600; }
@media print { .pk-page { border: 0; max-width: 100%; } }

/* Compact print templates (2026-09-05, statement upload and packet handoff,
   R12 / R13). Three-column record tables, the shared request and date tables,
   and the statements appendix. The veteran's own content stays at reading
   size; only the saved-at metadata is smaller. Nothing is clipped: long
   wording wraps, and a long note becomes a full-width continuation row under
   its own record rather than a truncated cell. */
.pk-table-wrap { overflow-x: auto; margin: 8px 0 14px; }
.pk-table { width: 100%; border-collapse: collapse; font: 15px/1.5 var(--font-sans); }
.pk-table th { text-align: left; font-size: 13px; letter-spacing: .04em; text-transform: uppercase; color: var(--color-text-muted); border-bottom: 2px solid var(--color-border); padding: 6px 10px 6px 0; vertical-align: bottom; }
.pk-table td { border-bottom: 1px solid var(--color-border); padding: 8px 10px 8px 0; vertical-align: top; overflow-wrap: anywhere; }
.pk-table-findings td:first-child { width: 42%; }
.pk-table-requests td:first-child, .pk-table-dates td:first-child { width: 38%; }
.pk-cell-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 10px; }
.pk-cell-main { display: block; font-weight: 600; color: var(--color-text); }
.pk-cell-sub { display: block; font-size: 13.5px; color: var(--color-text-muted); margin-top: 2px; }
.pk-cell-label { font-weight: 700; margin-right: 6px; }
.pk-cell-note { white-space: pre-wrap; }
.pk-row-note td { border-bottom: 1px solid var(--color-border); font-size: 14.5px; color: var(--color-text); padding-top: 0; }
.pk-sub-h { margin: 14px 0 2px; font: 700 17px/1.3 var(--font-sans); color: var(--color-text); }
.pk-pointer { margin: 6px 0 10px; font-size: 15px; color: var(--color-text); }
.pk-appendix-index { margin: 8px 0 16px; padding-left: 22px; }
.pk-appendix-index li { margin: 0 0 8px; }
.pk-appendix-item, .pk-appendix-file { margin-top: 14px; }

@media print {
  /* A table may run over a page; its head repeats and no row is cut in half. */
  body.printing-packet .pk-table-wrap { overflow-x: visible; }
  body.printing-packet .pk-table { font-size: 11pt; break-inside: auto; }
  body.printing-packet .pk-table thead { display: table-header-group; }
  body.printing-packet .pk-table tr { break-inside: avoid; }
  body.printing-packet .pk-table th { color: #111 !important; border-bottom-color: #333; }
  body.printing-packet .pk-table td { border-bottom-color: #bbb; }
  body.printing-packet .pk-cell-sub { font-size: 9.5pt; color: #333 !important; }
  body.printing-packet .pk-row-note td { font-size: 10.5pt; }
  /* Every uploaded PDF starts on a fresh sheet, and its own pages are never
     split, so an original page always prints as one page. */
  body.printing-packet .pk-appendix-file { break-before: page; page-break-before: always; }
  body.printing-packet .pk-appendix-index li { break-inside: avoid; }
}

/* The uploaded pages themselves (R14). A caption must never buy a sheet of
   its own: the first original page shares the sheet with its caption, and
   every page after it takes one sheet, whole and undistorted. */
@media print {
  body.printing-packet .pk-appendix-file .pk-file-note { font-size: 9.5pt; margin: 4px 0 6px; }
  body.printing-packet .pk-appendix-file .pk-ws-heading h3 { font-size: 14pt; margin: 0; }
  body.printing-packet .pk-appendix-file .pk-source { font-size: 9.5pt; margin: 2px 0 4px; }
  body.printing-packet .pk-appendix-file .pk-page { max-height: 8.2in; width: auto; max-width: 100%; margin: 0 auto 6px; }
  /* ONE original page per output sheet, whatever its shape: a short or
     landscape page must not share a sheet with the next one (2026-09-05
     review). The last page of the last file does not force a blank sheet. */
  body.printing-packet .pk-appendix-file .pk-page { break-after: page; page-break-after: always; }
  body.printing-packet .pk-appendix-file:last-of-type .pk-page:last-of-type { break-after: auto; page-break-after: auto; }
}

/* On a phone the same record reads as a stacked block rather than three
   squeezed columns (a print table must not become a sideways editor). The
   sub-lines already name their own fields, so no header is lost. */
@media screen and (max-width: 700px) {
  .pk-table, .pk-table tbody, .pk-table tr, .pk-table td { display: block; width: auto; }
  /* Match the desktop first-cell selectors: their higher specificity otherwise
     leaves the stacked finding/request/date text at 42% or 38% width. */
  .pk-table-findings td:first-child,
  .pk-table-requests td:first-child, .pk-table-dates td:first-child { width: auto; }
  .pk-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .pk-table tr { border: 1px solid var(--color-border); border-radius: var(--radius-sm); padding: 10px 12px; margin: 0 0 10px; }
  .pk-table td { border: 0; padding: 4px 0; }
  .pk-table td + td { border-top: 1px dashed var(--color-border); padding-top: 8px; }
  /* A note belongs to the record above it, so the two read as one block. */
  .pk-table tr.pk-row-note { margin-top: -11px; border-top: 0; border-top-left-radius: 0; border-top-right-radius: 0; }
  .pk-row-note td { border-top: 1px dashed var(--color-border); }
}