/* ==========================================================================
   KuduDoc v6 — timestamp-a-document (after pages/_feature.css).
   Only this page's own parts: the timestamp job card in the Timestamp tab, the check and compare results.
   Everything else is the kit.
   ========================================================================== */

/* the job: file → fingerprint → anchor pending → proof file */
.fk .fk-job { display: flex; flex-direction: column; gap: 14px; padding: 18px 20px 20px; }
.fk .fk-job-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.fk .fk-job-fp { display: flex; flex-direction: column; gap: 8px; }
.fk .fk-job-fp .fk-hash-v { font-size: 13px; }
.fk .fk-job-line { font: 500 13px/1.45 var(--font-sans); color: var(--fk-ink-2); }
.fk .fk-job-work { display: flex; flex-direction: column; gap: 9px; }
.fk .fk-job-note { font: 400 12.5px/1.5 var(--font-sans); color: var(--fk-mute); }
.fk .fk-job-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.fk .fk-job-sending { display: flex; align-items: center; gap: 10px; }
.fk .fk-job-sending::before {
  content: ""; width: 12px; height: 12px; border-radius: 50%; border: 2px solid #cfe0f1; border-top-color: var(--fk-blue);
  animation: fk-spin .8s linear infinite;
}
@keyframes fk-spin { to { transform: rotate(360deg); } }
.fk .fk-job-done { display: flex; flex-direction: column; gap: 12px; }
.fk .fk-job-state { padding: 12px 14px; border-radius: 10px; background: #fff8f3; box-shadow: inset 0 0 0 1px #ffe2cf; font: 400 13px/1.55 var(--font-sans); color: #4a3a2e; }
.fk .fk-proof {
  display: flex; align-items: center; justify-content: space-between; gap: 10px 14px; flex-wrap: wrap;
  padding: 12px 14px; border-radius: 10px; box-shadow: inset 0 0 0 1px var(--fk-line);
}
.fk .fk-btn--primary { transition: transform 140ms var(--v6-ease), background-color 140ms; }
.fk .fk-btn--primary.is-press { transform: scale(.96); background: #0058a8; }
.fk .fk-job [data-when] { animation: fk-in 320ms var(--v6-ease) both; }
@keyframes fk-in { from { opacity: 0; transform: translateY(4px); } }

/* check and compare */
.fk .fk-pair, .fk .fk-compare { display: flex; flex-direction: column; gap: 12px; }
.fk .fk-pair .fk-file + .fk-file { padding-top: 12px; border-top: 1px solid var(--fk-line-2); }
.fk .fk-compare .fk-label { margin-top: 4px; }
.fk .fk-result { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.fk .fk-result .fk-kv { align-self: stretch; }
.fk .fk-result-line { font: 500 14px/1.5 var(--font-sans); color: var(--fk-ink); }
.fk [data-tab-panel="check"] .fk-app-cols, .fk [data-tab-panel="compare"] .fk-app-cols { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.fk [data-tab-panel="check"] .fk-app-col + .fk-app-col, .fk [data-tab-panel="compare"] .fk-app-col + .fk-app-col { padding-top: 36px; }

@media (max-width: 1000px) {
  .fk [data-tab-panel="check"] .fk-app-cols, .fk [data-tab-panel="compare"] .fk-app-cols { grid-template-columns: 1fr; }
  .fk [data-tab-panel="check"] .fk-app-col + .fk-app-col, .fk [data-tab-panel="compare"] .fk-app-col + .fk-app-col { padding-top: 0; }
}
@media (max-width: 720px) {
  .fk .fk-job { padding: 16px 14px 16px; }
  .fk .fk-proof .fk-btn { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .fk .fk-job [data-when], .fk .fk-job-sending::before { animation: none; }
}