/* 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; gap: var(--space-3); }
.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); }
.pk-item { border-top: 1px solid var(--color-border); padding: var(--space-3) var(--space-4); }
.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; }

/* 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; }
.pk-summary { 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); }
.pk-paper { background: #fff; color: #1a1a2e; border: 1px solid #c5c8cc; 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-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; }
  .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; }
  body.printing-packet > *:not(#main-content) { display: none !important; }
  body.printing-packet #main-content > *: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-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; }
  body.printing-packet .pk-paper { border: 0; max-width: none; margin: 0; padding: 0; }
  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; }
}