/* B1 — /verify/<report_id>. Layered on marketing-shell.css, which supplies the
   :root custom properties, .research-banner, .skip, .sr-only and the nav.
   Every selector here is namespaced `vf-` so this sheet cannot reach anything
   the shell or the shared footer owns. */

.vf-wrap{max-width:760px;margin:0 auto;padding:40px 20px 72px}

.vf-card{background:#fff;border:1px solid var(--gray-200);border-radius:14px;
  box-shadow:var(--shadow-md);padding:32px 28px}

.vf-card h1{font:700 1.65rem/1.25 var(--font-d);color:var(--gray-900);margin:0 0 10px}
.vf-card h2{font:700 1.05rem/1.3 var(--font-d);color:var(--gray-900);margin:28px 0 8px}
.vf-card p{font:400 .95rem/1.65 var(--font-b);color:var(--gray-700);margin:0 0 12px}
.vf-lede{font-size:1.02rem;color:var(--gray-900)}

/* Identifiers, versions and git shas are long unbroken strings. At 320px an
   8-character token plus a build sha overflows the card and takes the page
   with it, so breaking is opt-in here rather than left to the default. */
.vf-mono{font-family:var(--font-m);font-size:.86rem;overflow-wrap:anywhere;word-break:break-word}

.vf-verdict{display:flex;align-items:center;gap:12px;margin:20px 0 8px;
  padding:14px 16px;border-radius:10px;border:1px solid transparent;
  font:700 1rem/1.35 var(--font-d)}
.vf-verdict svg{flex-shrink:0}
.vf-ok{background:#ECFDF5;border-color:#6EE7B7;color:#065F46}
.vf-bad{background:#FEF2F2;border-color:#FCA5A5;color:#991B1B}

.vf-facts{display:grid;grid-template-columns:minmax(0,auto) minmax(0,1fr);
  gap:8px 18px;margin:22px 0 0}
.vf-facts dt{font:600 .82rem/1.5 var(--font-b);color:var(--gray-500);
  text-transform:uppercase;letter-spacing:.04em}
.vf-facts dd{margin:0;font:400 .95rem/1.5 var(--font-b);color:var(--gray-900);
  overflow-wrap:anywhere}

.vf-gates{list-style:none;padding:0;margin:8px 0 0;display:flex;
  flex-direction:column;gap:8px}
.vf-gates li{display:flex;align-items:center;justify-content:space-between;
  gap:12px;flex-wrap:wrap;padding:10px 14px;border-radius:8px;
  border:1px solid var(--gray-200);background:var(--gray-100)}
.vf-g-ok{border-color:#A7F3D0}
.vf-g-bad{border-color:#FCA5A5}

.vf-tag{font:700 .72rem/1.2 var(--font-b);text-transform:uppercase;
  letter-spacing:.06em;padding:4px 10px;border-radius:999px;white-space:nowrap}
.vf-tag-ok{background:#D1FAE5;color:#065F46}
.vf-tag-bad{background:#FEE2E2;color:#991B1B}

.vf-note{margin-top:24px;padding-top:16px;border-top:1px solid var(--gray-200);
  font-size:.86rem;color:var(--gray-500)}

.vf-link{color:var(--teal);font-weight:600;text-decoration:underline;
  text-underline-offset:3px}
.vf-link:focus-visible{outline:2px solid var(--teal);outline-offset:2px;border-radius:3px}

@media (max-width:520px){
  .vf-wrap{padding:24px 14px 56px}
  .vf-card{padding:22px 16px;border-radius:12px}
  .vf-card h1{font-size:1.35rem}
  /* Below this width the two-column definition list leaves roughly 90px for a
     value that can be a 40-character version string. Stack instead. */
  .vf-facts{grid-template-columns:minmax(0,1fr);gap:2px 0}
  .vf-facts dd{margin-bottom:12px}
}