/* ==========================================================================
   KuduDoc v6 — pdf-signature-checker (after pages/_feature.css).
   Only this page's own parts: the checker's result (file head, signature cards with six lines, the
   signed page with its signature fields, the file card, the page comparison, the actions), and the specimens in
   the sections below. Everything else is the kit. Prefix psc-.
   ========================================================================== */

/* ---------------------------------------------------------------- the checker: file head + summary */
.fk .psc-head {
  display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px 18px;
  min-height: 74px; padding: 16px 26px; border-bottom: 1px solid var(--fk-line-2); background: #fbfcfd;
}
.fk .psc-head > .fk-file { flex: 0 1 auto; }
.fk .psc-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.fk .psc-status { display: flex; flex-direction: column; gap: 8px; width: min(280px, 100%); }
.fk .psc-status-line { font: 500 13px/1.4 var(--font-sans); color: var(--fk-ink-2); }
.fk .psc-asking { flex-direction: row; align-items: center; gap: 10px; width: auto; }
.fk .psc-asking::before {
  content: ""; flex: none; width: 12px; height: 12px; border-radius: 50%; border: 2px solid #cfe0f1; border-top-color: var(--fk-blue);
  animation: psc-spin .8s linear infinite;
}
@keyframes psc-spin { to { transform: rotate(360deg); } }
.fk .psc-head [data-when] { animation: psc-in 280ms var(--v6-ease) both; }
@keyframes psc-in { from { opacity: 0; transform: translateY(3px); } }

/* ---------------------------------------------------------------- a signature: header + six lines */
.fk .psc-content { padding-top: 20px; }
.fk .psc-cols { grid-template-columns: minmax(0, 1fr) minmax(0, 300px); }
.fk .psc-cols.fk-app-cols--even { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.fk .psc-sig { padding: 0; overflow: hidden; }
.fk .psc-sig-head { padding: 15px 20px 13px; border-bottom: 1px solid var(--fk-line-2); background: #fafcfd; }
.fk .psc-sig-h { font: 650 15px/1.3 var(--font-sans); letter-spacing: -.01em; color: var(--fk-ink); }
.fk .psc-sig-name { margin-top: 3px; font: 400 12.5px/1.4 var(--font-sans); color: var(--fk-mute); }
.fk .psc-lines > div {
  display: grid; grid-template-columns: 144px minmax(0, 1fr); gap: 3px 16px; padding: 11px 20px;
  border-top: 1px solid var(--fk-line-2); transition: opacity 280ms var(--v6-ease);
}
.fk .psc-lines > div:first-child { border-top: 0; }
.fk .psc-lines dt { position: relative; padding-left: 14px; font: 600 12.5px/1.55 var(--font-sans); color: var(--fk-ink); }
.fk .psc-lines dt::before {
  content: ""; position: absolute; left: 1px; top: .32em; width: 3px; height: 12px; border-radius: 2px; background: var(--fk-blue); transform: skewX(-14deg);
}
.fk .psc-lines dd { font: 400 13px/1.55 var(--font-sans); color: var(--fk-ink-2); overflow-wrap: anywhere; }
.fk .psc-lines .psc-l { display: block; }
.fk .psc-lines .psc-l + .psc-l { margin-top: 2px; }
.fk .psc-lines .psc-sub { margin-top: 4px; }

/* the read plays in: the lines arrive as the checker reaches them (scripts/pages/pdf-signature-checker.js) */
.fk .psc-main[data-phase="work"] .psc-lines > div,
.fk .psc-main[data-phase="send"] .psc-lines > div.psc-late { opacity: .12; }
.fk .psc-main[data-phase="work"] .psc-lines > div { transition-duration: 0ms; }

/* ---------------------------------------------------------------- the signed page, beside the card */
.fk .psc-where { gap: 12px; padding-top: 0; }
.fk .psc-page { padding: 18px 18px 16px; }
.fk .psc-page .fk-doc-kicker { font-size: 9px; }
.fk .psc-page .fk-doc-title { margin-top: 9px; font-size: 16px; }
.fk .psc-page .fk-doc-lines { gap: 7px; margin: 12px 0; }
.fk .psc-page .fk-doc-lines i { height: 4px; }
.fk .psc-page .fk-doc-clause { font-size: 10.5px; }
.fk .psc-fill {
  display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-top: 7px; padding-bottom: 4px;
  border-bottom: 1px solid #e3dccf; font: 400 10px/1.3 var(--font-sans); color: var(--fk-mute);
}
.fk .psc-page .fk-doc-clause + .psc-fill { margin-top: 12px; }
.fk .psc-fill b { font: 600 11px/1.3 var(--font-sans); color: var(--fk-ink); text-align: right; }
.fk .psc-fill b.is-empty { display: block; width: 44%; height: 11px; }
.fk .psc-sigfields { display: flex; flex-direction: column; gap: 8px; margin-top: 14px; }
.fk .psc-sigfield {
  display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 2px 9px; padding: 8px 10px;
  border-radius: 6px; background: #fff; box-shadow: inset 0 0 0 1px #e3dccf;
}
.fk .psc-sigfield.is-on { box-shadow: inset 0 0 0 1.5px var(--fk-blue), 0 0 0 3px rgba(0, 107, 203, .1); }
.fk .psc-sigfield-n {
  display: grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; background: var(--fk-ice);
  font: 700 9.5px/1 var(--font-sans); color: var(--fk-blue-deep);
}
.fk .psc-sigfield.is-on .psc-sigfield-n { background: var(--fk-blue); color: #fff; }
.fk .psc-sigfield-ap { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.fk .psc-sigfield-ap b { font: 600 10.5px/1.3 var(--font-sans); color: var(--fk-ink); }
.fk .psc-sigfield-ap small { font: 400 9.5px/1.3 var(--fk-mono); color: var(--fk-mute); overflow-wrap: anywhere; }
.fk .psc-sigfield-role { grid-column: 2; font: 600 9px/1.2 var(--font-sans); letter-spacing: .1em; text-transform: uppercase; color: var(--fk-faint); }
.fk .psc-sigfield.is-blank { background: #f0f7ff; box-shadow: inset 0 0 0 1px #b8d1ea; }
.fk .psc-sigfield.is-blank b { font-weight: 500; color: var(--fk-blue); }
.fk .psc-sig-acts { display: flex; flex-wrap: wrap; gap: 8px; }

/* ---------------------------------------------------------------- about the file */
.fk .psc-fp { display: flex; flex-direction: column; gap: 8px; }
.fk .psc-note { margin: 0 0 8px; font: 400 12px/1.45 var(--font-sans); color: var(--fk-mute); }
.fk .psc-props > div { grid-template-columns: 84px minmax(0, 1fr); padding: 8px 0; }
.fk .psc-versions { position: relative; display: flex; flex-direction: column; margin-top: 10px; }
.fk .psc-versions > li { position: relative; display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: 12px; padding: 0 0 16px; }
.fk .psc-versions > li:last-child { padding-bottom: 0; }
.fk .psc-versions > li + li::before { content: ""; position: absolute; left: 11.25px; top: -14px; width: 1.5px; height: 12px; border-radius: 1px; background: #c3d1df; }
.fk .psc-v-n {
  display: grid; place-items: center; width: 24px; height: 24px; border-radius: 7px; background: #eef3f8; box-shadow: inset 0 0 0 1px var(--fk-line);
  font: 650 11px/1 var(--font-sans); color: var(--fk-ink-2);
}
.fk .psc-v-txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; padding-top: 3px; }
.fk .psc-v-txt b { font: 600 13px/1.3 var(--font-sans); color: var(--fk-ink); }
.fk .psc-v-txt small { font: 400 11.5px/1.35 var(--font-sans); color: var(--fk-mute); }
.fk .psc-versions--sm > li { padding-bottom: 12px; }
.fk .psc-versions--sm > li + li::before { top: -10px; height: 8px; }

/* ---------------------------------------------------------------- compare: two pictures of page 6 */
.fk .psc-cmp { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 300px); gap: 18px; align-items: start; }
.fk .psc-cmp-pages { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.fk .psc-cmp-page { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.fk .psc-page--sm { display: flex; flex-direction: column; aspect-ratio: 1 / 1.3; padding: 16px 16px 14px; }
.fk .psc-page--sm .fk-doc-title { font-size: 14px; }
.fk .psc-page--sm .fk-doc-lines { margin: 12px 0; }
.fk .psc-page--sm .psc-sigfields { margin-top: auto; padding-top: 14px; }
.fk .psc-page--sm .psc-sigfield { padding: 6px 8px; }
.fk .psc-cmp-pages .is-diff { outline: 1.5px dashed var(--fk-blue); outline-offset: 3px; border-radius: 3px; }
.fk .psc-cmp-pages .psc-sigfield.is-diff { outline-offset: 2px; border-radius: 6px; }
.fk .psc-cmp-res { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.fk .psc-cmp-res .psc-sig-name { margin-top: -8px; }
.fk .psc-strip { display: flex; gap: 6px; margin: 2px 0 2px; }
.fk .psc-strip li {
  display: grid; place-items: end center; width: 26px; height: 34px; padding-bottom: 4px; border-radius: 3px 7px 3px 3px;
  background: #f5f8fb; box-shadow: inset 0 0 0 1px var(--fk-line); font: 600 10px/1 var(--font-sans); color: var(--fk-faint);
}
.fk .psc-strip li.is-diff { background: var(--fk-ice); box-shadow: inset 0 0 0 1.5px var(--fk-blue); color: var(--fk-blue-deep); }
.fk .psc-res-line { font: 500 13.5px/1.5 var(--font-sans); color: var(--fk-ink); }
.fk .psc-cmp-res .psc-note { margin: -4px 0 2px; }

/* ---------------------------------------------------------------- under the result */
.fk .psc-foot { display: flex; flex-direction: column; gap: 10px; padding: 14px 26px 18px; border-top: 1px solid var(--fk-line-2); background: #fbfcfd; }
.fk .psc-foot-acts { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; }
.fk .psc-foot-acts .fk-btn--link { margin-left: 6px; }
.fk .psc-helper { font: 400 11.5px/1.5 var(--font-sans); color: var(--fk-mute); }

/* under the capture: the public seal check line */
.fk .psc-sealed-line { max-width: 78ch; margin: 10px 2px 0 17px; font: 400 14.5px/1.55 var(--font-sans); color: var(--fk-body); }
.fk .psc-sealed-line a { color: var(--fk-blue); }

/* ---------------------------------------------------------------- section specimens */
.fk .psc-spec-chips { align-items: flex-start; }
.fk .psc-spec-lines { display: flex; flex-direction: column; gap: 7px; }
.fk .psc-spec-lines li {
  display: grid; grid-template-columns: 124px minmax(0, 1fr); align-items: center; gap: 12px; position: relative; padding-left: 12px;
  font: 600 11.5px/1.2 var(--font-sans); color: var(--fk-ink-2);
}
.fk .psc-spec-lines li::before { content: ""; position: absolute; left: 0; top: 1px; width: 3px; height: 11px; border-radius: 2px; background: var(--fk-blue); transform: skewX(-14deg); }
.fk .psc-spec-lines li::after { content: ""; height: 5px; border-radius: 3px; background: #e3eaf1; }
.fk .psc-spec-lines li:nth-child(2n)::after { width: 72%; }
.fk .psc-spec-lines li:nth-child(3n)::after { width: 56%; }
.fk .psc-spec-v { font: 600 12.5px/1.3 var(--font-sans); color: var(--fk-ink-2); }
.fk .psc-spec-v::before { content: ""; display: inline-block; width: 3px; height: 11px; margin-right: 9px; border-radius: 2px; background: var(--fk-blue); transform: skewX(-14deg); }

/* tables: the line names read as names */
.fk .psc-table tbody th { width: 22%; }
.fk .psc-table--2 tbody th { width: 52%; font-weight: 500; color: var(--fk-ink-2); }
.fk .psc-table--2 tbody td { color: var(--fk-ink); }

/* the trust-list dates, under the list */
.fk .psc-dates { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 22px; }
.fk .psc-dates span {
  display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px; border-radius: 999px; background: var(--fk-ice);
  font: 500 13px/1.2 var(--font-sans); color: var(--fk-ink-2);
}
.fk .psc-dates b { font-weight: 650; color: var(--fk-blue-deep); }

/* metadata: the properties card */
.fk .psc-meta-card { padding: 20px 22px; border-radius: 18px; box-shadow: var(--fk-card-sh); }
.fk .psc-meta-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 22px 28px; }
.fk .psc-meta-grid .fk-card-h { margin-bottom: 8px; }
.fk .psc-meta-card + .fk-after { margin-top: 26px; }
.fk .fk-after + .fk-after { margin-top: 12px; }

/* sealed with KuduDoc: the text and the seal's card side by side */
.fk .psc-sealed { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 440px); gap: 32px 56px; align-items: start; }
.fk .psc-sealed .fk-list > li.is-key { color: var(--fk-ink); font-weight: 500; }
.fk .psc-seal-card { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; padding: 20px 22px 12px; border-radius: 18px; box-shadow: var(--fk-card-sh); }
.fk .psc-seal-top { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px 12px; align-self: stretch; padding-bottom: 14px; border-bottom: 1px solid var(--fk-line-2); }
.fk .psc-seal-note { font: 400 13px/1.55 var(--font-sans); color: var(--fk-ink-2); }
.fk .psc-seal-card .fk-kv { align-self: stretch; }
.fk .psc-seal-card .fk-kv > div { grid-template-columns: 124px minmax(0, 1fr); }

/* keep: the Library holds the file with its check */
.fk .psc-lib { padding: 16px 22px 8px; border-radius: 18px; box-shadow: var(--fk-card-sh); }
.fk .psc-lib-top { display: flex; align-items: center; gap: 10px; padding-bottom: 12px; border-bottom: 1px solid var(--fk-line-2); }
.fk .psc-lib .fk-rows > li.fk-row { padding: 14px 0; }
.fk .psc-lib + .fk-after { margin-top: 24px; }
.fk #keep .fk-plan { margin-top: 28px; }

/* the closing: the highlighted words wrap evenly */
html body .fk .fk-closing h2 span { text-wrap: balance; }
/* the closing line's link */
html body .fk .fk-closing h2 + p a { color: #fff; text-decoration: underline; text-decoration-color: rgba(255, 255, 255, .5); }
html body .fk .fk-closing h2 + p a:hover { text-decoration-color: #fff; }

/* ================================================================ responsive */
@media (max-width: 1180px) {
  .fk .psc-cols, .fk .psc-cmp { grid-template-columns: minmax(0, 1fr) minmax(0, 270px); }
}
@media (max-width: 1000px) {
  .fk .psc-cols, .fk .psc-cols.fk-app-cols--even, .fk .psc-cmp { grid-template-columns: 1fr; }
  .fk .psc-where { display: grid; grid-template-columns: minmax(0, 360px) auto; justify-content: start; align-items: start; gap: 14px 18px; }
  .fk .psc-sig-acts { flex-direction: column; align-items: stretch; }
  .fk .psc-sealed { grid-template-columns: 1fr; max-width: 640px; }
}
@media (max-width: 760px) {
  .fk .psc-table tbody th, .fk .psc-table--2 tbody th { width: auto; }
  .fk .psc-table--2 tbody th { font-weight: 600; color: var(--fk-ink); }
  .fk .psc-meta-grid { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .fk .psc-head { padding: 14px; min-height: 0; }
  .fk .psc-content { padding-top: 16px; }
  .fk .psc-where { display: flex; flex-direction: column; }
  .fk .psc-where .psc-page { display: none; }
  .fk .psc-sig-acts { flex-direction: row; flex-wrap: wrap; }
  .fk .psc-sig-head { padding: 13px 14px 11px; }
  .fk .psc-lines > div { grid-template-columns: 1fr; gap: 3px; padding: 11px 14px; }
  .fk .psc-cmp-pages { gap: 10px; }
  .fk .psc-page--sm { aspect-ratio: auto; padding: 10px 10px 9px; }
  .fk .psc-page--sm .fk-doc-title { font-size: 11.5px; }
  .fk .psc-page--sm .fk-doc-clause, .fk .psc-page--sm .fk-doc-lines i:nth-child(n+4) { display: none; }
  .fk .psc-page--sm .fk-doc-lines { margin: 8px 0 4px; }
  .fk .psc-fill { flex-direction: column; gap: 2px; }
  .fk .psc-fill b { text-align: left; }
  .fk .psc-page--sm .psc-sigfield { grid-template-columns: 1fr; }
  .fk .psc-page--sm .psc-sigfield-n { display: none; }
  .fk .psc-foot { padding: 12px 14px 14px; }
  .fk .psc-foot-acts .fk-btn:not(.fk-btn--link) { flex: 1 1 auto; }
  .fk .psc-foot-acts .fk-btn--primary { flex-basis: 100%; }
  .fk .psc-foot-acts .fk-btn--link { margin-left: 0; }
}
@media (max-width: 520px) {
  /* four tabs: a two-by-two segmented control instead of a bar that scrolls */
  .fk .fk-app-content.psc-content[data-tabs] > .fk-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2px; overflow: visible; }
  .fk .psc-content .fk-tab { padding: 8px 6px; text-align: center; }
}
@media (max-width: 640px) {
  .fk .psc-sealed-line { margin-left: 2px; font-size: 14px; }
  .fk .psc-lib { padding: 12px 16px 4px; }
  .fk .psc-lib .fk-rows > li.fk-row { grid-template-columns: auto minmax(0, 1fr); }
  .fk .psc-lib .fk-rows > li.fk-row > .fk-chip { grid-column: 2; justify-self: start; }
  .fk .psc-seal-card { padding: 16px 16px 8px; }
  .fk .psc-seal-card .fk-kv > div { grid-template-columns: 1fr; }
  .fk .psc-meta-card { padding: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .fk .psc-head [data-when], .fk .psc-asking::before { animation: none; }
}
