/* The public seal check (/verify) in the v6 site's dress (site switch C4).
   verify.html loads the v6 site's stylesheets the way every v6 page does: the v5 base below, in the lower cascade
   layer v5, then lab/v6 tokens-scoped, nav, theme and the feature-page kit (pages/_feature.css), all from /_site/.
   This file comes last. It dresses the check that scripts/verify-public.js fills (#verify-tool) and the few kit
   parts the page bends, scoped to .vc-page so nothing reaches the v6 header or footer.
   PRODUCT-TRUTHS §9: a match is a fact about bytes, never a green tick. In the v6 language a match is quiet blue,
   waiting or unknown is warm, and only a decline is red. */
@layer v5;
@import url("/_site/styles/tokens.css") layer(v5);
@import url("/_site/styles/base.css") layer(v5);
@import url("/_site/styles/components.css") layer(v5);
@import url("/_site/styles/motion.css") layer(v5);

/* The names verify-public.js and app-attest.js write into inline styles, mapped onto the v6 palette. */
#verify-tool {
  --success-50: #eaf3fc; --success-500: #9fc3e8; --success-700: #004e99;
  --warning-50: #fff3ea; --warning-500: #ffc8a3; --warning-700: #b8470e;
  --danger-50: #fdeeee; --danger-500: #e8a2a2; --danger-700: #b42318;
  --ink-200: #e3eaf1; --surface-sunken: #f5f8fb;
  --space-5: 20px; --text-small: 14px; --text-micro: 12.5px;
  --text-secondary: var(--fk-body); --text-tertiary: var(--fk-mute);
  --border-hairline: 1px solid var(--fk-line-2);
  --vc-focus: 0 0 0 3px rgba(0, 107, 203, .3);
}

/* Skip link: out of sight until it has focus, then above the fixed nav. */
.vc-skip {
  position: absolute; left: 16px; top: -64px; z-index: 40; padding: 10px 16px; border-radius: 999px;
  background: #fff; color: #102d49; font: 600 14px/1.2 var(--font-sans); text-decoration: none;
  box-shadow: 0 0 0 2px #006bcb;
}
.vc-skip:focus { top: 12px; }

/* ================================================================ the check: one card, straddling the blue edge */
html body .vc-page .hero-cu + .proof-cu.fk-stage { --fk-edge: 260px; }
.vc-page .vc-card {
  display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  border-radius: 24px; background: #fff; overflow: hidden;
  box-shadow: 0 2px 4px rgba(6, 22, 42, .08), 0 24px 60px -18px rgba(6, 22, 42, .38);
}
#verify-tool .vc-input { min-width: 0; padding: 36px 40px 34px; }
#verify-tool .vc-receipt { min-width: 0; padding: 36px 40px 34px; background: #f6f9fd; border-left: 1px solid rgba(16, 45, 73, .07); }
#verify-tool .vc-eyebrow { display: flex; align-items: center; margin: 0; font: 600 12px/1.3 var(--font-sans); letter-spacing: .14em; text-transform: uppercase; color: var(--fk-blue); }
#verify-tool .vc-eyebrow::before { content: ""; flex: none; width: 3px; height: 12px; margin-right: 10px; border-radius: 2px; background: var(--fk-blue); transform: var(--fk-stroke); }
#verify-tool .vc-small { margin: 12px 0 0; font: 400 13.5px/1.6 var(--font-sans); color: var(--fk-mute); }

/* Check a PDF · Look up a fingerprint */
#verify-tool .verify-tabs { display: flex; flex-wrap: wrap; gap: 6px 22px; margin-bottom: 24px; border-bottom: 1px solid var(--fk-line); }
#verify-tool .verify-tab {
  min-height: 44px; margin-bottom: -1px; padding: 10px 2px; border: 0; border-bottom: 2px solid transparent; background: transparent;
  font: 600 15px/1.3 var(--font-sans); color: var(--fk-mute); cursor: pointer; transition: color 140ms var(--v6-ease);
}
#verify-tool .verify-tab:hover { color: var(--fk-ink); }
#verify-tool .verify-tab.is-active { color: var(--fk-ink); border-bottom-color: var(--fk-blue); }
#verify-tool .verify-tab:focus-visible { outline: none; box-shadow: var(--vc-focus); border-radius: 6px; }
#verify-tool .verify-panel[hidden] { display: none; }

/* The file input is driven by the drop zone; keep it out of sight. */
#verify-tool #file-input {
  position: absolute; width: 1px; height: 1px; min-height: 0; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
#verify-tool .dropzone {
  position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px;
  min-height: 176px; padding: 28px 20px; text-align: center; cursor: pointer;
  border: 1.5px dashed #b8d1ea; border-radius: 18px; background: #f6faff;
  transition: border-color 160ms var(--v6-ease), background-color 160ms var(--v6-ease);
}
#verify-tool .dropzone:hover, #verify-tool .dropzone.is-dragover { border-style: solid; border-color: var(--fk-blue); background: #eef5fc; }
#verify-tool .dropzone:focus-visible { outline: none; box-shadow: var(--vc-focus); }
#verify-tool .dropzone.has-file { border-style: solid; border-color: var(--fk-blue); background: #eef5fc; cursor: default; }
#verify-tool .dropzone svg { display: block; flex-shrink: 0; width: 30px; height: 30px; fill: none; stroke: var(--fk-blue); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
#verify-tool .dropzone__empty svg { margin: 0 auto; }
#verify-tool .dropzone__title { margin: 8px 0 0; font: 600 16px/1.35 var(--font-sans); color: var(--fk-ink); }
#verify-tool .dropzone__hint { margin: 4px 0 0; font: 400 13.5px/1.5 var(--font-sans); color: var(--fk-mute); }
#verify-tool .dropzone__file { display: none; align-items: center; gap: 12px; max-width: 100%; }
#verify-tool .dropzone.has-file .dropzone__empty { display: none; }
#verify-tool .dropzone.has-file .dropzone__file { display: flex; }
#verify-tool .dropzone__filename { font: 600 14.5px/1.4 var(--font-sans); color: var(--fk-ink); overflow-wrap: anywhere; text-align: left; }
#verify-tool .dropzone__clear {
  display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 32px; height: 32px; padding: 0;
  border: 0; border-radius: 50%; background: #fff; color: var(--fk-mute); cursor: pointer; box-shadow: inset 0 0 0 1px #d4e0ec;
}
#verify-tool .dropzone__clear:hover { color: var(--danger-700); box-shadow: inset 0 0 0 1.5px var(--danger-500); }
#verify-tool .dropzone__clear:focus-visible { outline: none; box-shadow: var(--vc-focus); }
#verify-tool .dropzone__clear svg { width: 14px; height: 14px; stroke: currentColor; stroke-width: 2; }

#verify-tool #panel-fingerprint label { display: block; margin-bottom: 8px; font: 600 14px/1.4 var(--font-sans); color: var(--fk-ink); }
#verify-tool #panel-fingerprint label span { font-weight: 400; color: var(--fk-mute); }
#verify-tool .vc-mono {
  display: block; width: 100%; min-height: 50px; padding: 12px 14px; border: 0; border-radius: 12px; background: #fff;
  box-shadow: inset 0 0 0 1px #cfe0f1; color: var(--fk-ink); font: 500 13.5px/1.6 var(--fk-mono); letter-spacing: .02em;
}
#verify-tool .vc-mono::placeholder { color: var(--fk-faint); }
#verify-tool .vc-mono:focus { outline: none; box-shadow: inset 0 0 0 1.5px var(--fk-blue), var(--vc-focus); }

#verify-tool .verify-check-row { margin-top: 24px; }
#verify-tool #check-btn { min-height: 48px; padding: 0 26px; font-size: 15px; }
#verify-tool #check-btn[disabled] { opacity: .5; cursor: not-allowed; transform: none; box-shadow: none; }
#verify-tool .vc-privacy { margin-top: 14px; }
#verify-tool .vc-device-note { font-weight: 600; color: var(--warning-700); }
#verify-tool .vc-device-note[hidden] { display: none; }

/* ================================================================ the answer */
#verify-tool .vc-idle { margin: 22px 0 0; font: 650 24px/1.25 var(--font-display); letter-spacing: -.025em; color: var(--fk-ink); }
#verify-tool .vc-idle span { display: block; margin-top: 10px; font: 400 15px/1.6 var(--font-sans); letter-spacing: 0; color: var(--fk-body); }
#verify-tool .verify-result:not([hidden]) ~ .vc-idle { display: none; }
#verify-tool .verify-result { margin-top: 20px; }
#verify-tool .verify-result:focus { outline: none; }
#verify-tool .verify-result__head { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; }

/* Status chips: text with the logo's slanted stroke (the v6 marker), never a tick or a shield.
   The v5 .chip (a dashed filter pill) sits in the lower layer; every part of it is set again here. */
#verify-tool .chip {
  position: relative; display: inline-flex; align-items: center; gap: 8px; max-width: 100%; margin: 0; padding: 7px 14px 7px 12px;
  border: 0; border-radius: 999px; background: #fff; box-shadow: inset 0 0 0 1px #dfe6ee; cursor: default; transition: none;
  font: 600 13.5px/1.3 var(--font-sans); letter-spacing: .005em; color: var(--fk-ink);
}
#verify-tool .chip::before {
  content: ""; position: static; inset: auto; flex: none; width: 3px; height: 12px; border: 0; border-radius: 2px; opacity: 1;
  background: currentColor; transform: skewX(-14deg);
}
#verify-tool h3.chip { font-size: 15px; }
#verify-tool h3.chip:focus { outline: none; box-shadow: inset 0 0 0 1px #dfe6ee, var(--vc-focus); }
/* The result takes focus when it lands; keep it clear of the fixed v6 nav. */
#verify-tool h3.chip, #verify-tool .verify-result { scroll-margin-top: 112px; }
#verify-tool .chip--success { background: var(--success-50); color: var(--success-700); box-shadow: inset 0 0 0 1px #cfe2f5; }
#verify-tool .chip--success::before { background: var(--fk-blue); }
#verify-tool .chip--warning { background: var(--warning-50); color: var(--warning-700); box-shadow: inset 0 0 0 1px #ffdcc4; }
#verify-tool .chip--warning::before { background: var(--orange); }
#verify-tool .chip--danger { background: var(--danger-50); color: var(--danger-700); box-shadow: inset 0 0 0 1px #f3c4c4; }
#verify-tool .chip--neutral { background: #fff; color: var(--fk-ink-2); box-shadow: inset 0 0 0 1px #dfe6ee; }
#verify-tool .chip--neutral::before { background: var(--fk-blue); }
#verify-tool .verify-result__statusbar { display: flex; width: 100%; justify-content: center; margin-top: 4px; border-radius: 12px; padding: 11px 14px; white-space: normal; text-align: center; }

#verify-tool .verify-warn {
  margin: 0 0 16px; padding: 16px 18px; border: 1px solid #e3eaf1; border-radius: 14px; background: #fff;
  font: 400 14px/1.6 var(--font-sans); color: var(--fk-body);
}
#verify-tool .verify-warn__t { margin: 0 0 6px; font: 650 15px/1.35 var(--font-display); letter-spacing: -.01em; color: var(--fk-ink); }
#verify-tool .verify-warn__d { margin: 0; font: 400 13.5px/1.6 var(--font-sans); color: var(--fk-body); }

#verify-tool .vc-facts { margin: 8px 0 18px; }
#verify-tool .vc-facts dt { margin-top: 16px; font: 600 11px/1.3 var(--font-sans); letter-spacing: .1em; text-transform: uppercase; color: var(--fk-mute); }
#verify-tool .vc-facts dd { margin: 6px 0 0; }
#verify-tool .verify-result__value { font: 600 14.5px/1.5 var(--font-sans); color: var(--fk-ink); overflow-wrap: anywhere; }
#verify-tool .verify-result__hash {
  display: block; padding: 10px 12px; border-radius: 10px; background: #fff; box-shadow: inset 0 0 0 1px #dbe5ef;
  font: 500 12.5px/1.7 var(--fk-mono); letter-spacing: .03em; color: var(--fk-ink-2); overflow-wrap: anywhere; word-break: break-all;
}
#verify-tool .verify-result__note { margin: 14px 0 0; font: 600 13.5px/1.6 var(--font-sans); color: var(--fk-ink); }

#verify-tool .verify-scope { margin-top: 20px; padding-top: 18px; border-top: 1px solid var(--fk-line); }
#verify-tool .verify-scope__title { margin: 0 0 10px; font: 650 14px/1.35 var(--font-display); color: var(--fk-ink); }
#verify-tool .verify-scope__list { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
#verify-tool .verify-scope__list li { position: relative; padding-left: 22px; font: 400 13.5px/1.55 var(--font-sans); color: var(--fk-body); }
#verify-tool .verify-scope__list li::before { position: absolute; left: 0; top: 0; font-weight: 700; }
/* A match is a fact about bytes, never a green tick (PRODUCT-TRUTHS §9). */
#verify-tool .verify-scope__list li.is-yes::before { content: '='; color: var(--fk-blue); }
#verify-tool .verify-scope__list li.is-no::before { content: '–'; color: var(--fk-faint); }

/* ================================================================ the kit, bent for this page */
/* The three steps keep their own numbers (span.step__num) where the kit draws its counter. */
.vc-page .vc-steps > li::after { content: none; }
.vc-page .vc-steps > li > .step__num { position: absolute; left: 30px; top: 30px; font: 650 13px/1 var(--font-display); letter-spacing: .08em; color: var(--fk-blue); }
.vc-page .vc-steps > li > .step__num::before { content: "0" / ""; }
.vc-page .vc-record > p { max-width: 64ch; font: 400 17px/1.65 var(--font-sans); color: var(--fk-body); }
.vc-page .vc-record > p + p { margin-top: 16px; }
.vc-page .vc-links { display: flex; flex-wrap: wrap; gap: 10px 28px; }
.vc-page .vc-record .fk-more { color: var(--fk-blue); }
.vc-page .vc-record .fk-more:hover { color: var(--fk-blue-deep); }
.vc-page .fk-under a { color: var(--fk-blue); font-weight: 600; text-decoration: none; }
.vc-page .fk-under a:hover { text-decoration: underline; }
/* A seal whose sender removed KuduDoc branding (verify-public.js drawPromotions): the phone menu's Start free is
   gone, so Sign in takes the whole row. */
html[data-kd-promotions="off"] #mobile-menu .mnav-foot { grid-template-columns: minmax(0, 1fr); }

/* No closing band on this page: the last section keeps the kit's room above the footer. */
.vc-page > .fk-sec:last-child { padding-bottom: 112px; }

@media (max-width: 900px) {
  .vc-page .vc-card { grid-template-columns: minmax(0, 1fr); }
  #verify-tool .vc-input, #verify-tool .vc-receipt { padding: 28px 24px; }
  #verify-tool .vc-receipt { border-left: 0; border-top: 1px solid rgba(16, 45, 73, .07); }
}
@media (max-width: 640px) {
  html body .vc-page .hero-cu + .proof-cu.fk-stage { --fk-edge: 180px; }
  .vc-page .vc-steps > li > .step__num { top: 28px; }
  .vc-page .vc-record > p { font-size: 16px; }
  .vc-page > .fk-sec:last-child { padding-bottom: 84px; }
}
@media (max-width: 400px) {
  #verify-tool .vc-input, #verify-tool .vc-receipt { padding: 22px 18px; }
  #verify-tool .dropzone { min-height: 148px; }
}
@media (prefers-reduced-motion: reduce) {
  #verify-tool * { transition: none !important; }
}