/* ============================================================
   LockLeed — /vevraa-benchmark-checker scoped styles
   Loads after styles.css. Prefix: .vv-
   ============================================================ */

.vv{max-width:880px;margin:0 auto;}
.vv-card{background:#fff;border:1px solid var(--line);padding:30px 32px;}
.vv-card + .vv-card{border-top:none;}

/* ---------- search ---------- */
.vv-search{display:flex;gap:12px;flex-wrap:wrap;}
.vv-search input{flex:1;min-width:240px;padding:15px 17px;border:1px solid var(--line);
  font-family:var(--sans);font-size:16px;color:var(--ink);background:#fff;}
.vv-search input:focus{outline:none;border-color:var(--red);box-shadow:0 0 0 3px var(--red-l);}
.vv-hint{font-size:12.5px;color:var(--ink-3);margin-top:12px;line-height:1.6;}
.vv-status{margin-top:14px;font-family:var(--mono);font-size:12px;letter-spacing:.03em;min-height:1.2em;}
.vv-status--err{font-family:var(--sans);font-size:13.5px;letter-spacing:0;color:var(--red);line-height:1.55;}

/* ---------- match list ---------- */
.vv-matches{display:flex;flex-direction:column;gap:1px;background:var(--line);
  border:1px solid var(--line);margin-top:20px;}
.vv-match{background:#fff;padding:14px 18px;display:flex;justify-content:space-between;
  align-items:center;gap:14px;border:none;width:100%;text-align:left;cursor:pointer;font:inherit;}
.vv-match:hover{background:var(--soft);}
.vv-match__n{font-weight:600;font-size:14.5px;color:var(--ink);}
.vv-match:hover .vv-match__n{color:var(--red);}
.vv-match__m{font-family:var(--mono);font-size:11.5px;color:var(--ink-3);white-space:nowrap;}

/* ---------- result ---------- */
.vv-co{font-family:var(--serif);font-size:clamp(21px,2.4vw,27px);font-weight:700;color:var(--ink);
  letter-spacing:-0.02em;}
.vv-meta{font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;
  color:var(--ink-3);margin-top:8px;}
.vv-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1px;
  background:var(--line);border:1px solid var(--line);margin-top:24px;}
.vv-tile{background:#fff;padding:20px 22px;}
.vv-tile__l{font-size:12.5px;color:var(--ink-3);}
.vv-tile__v{font-family:var(--serif);font-size:30px;font-weight:800;letter-spacing:-0.03em;
  color:var(--ink);margin-top:6px;line-height:1;}
.vv-tile__s{font-size:12px;color:var(--ink-3);margin-top:7px;line-height:1.5;}
.vv-tile--gap{background:var(--red-l);}
.vv-tile--gap .vv-tile__l,.vv-tile--gap .vv-tile__s{color:var(--red-d);}
.vv-tile--gap .vv-tile__v{color:var(--red-d);}
.vv-tile--ok{background:#F1FAF4;}
.vv-tile--ok .vv-tile__v{color:#146239;}

/* ---------- trend ---------- */
.vv-trend{margin-top:26px;}
.vv-trend__t{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--ink-3);margin-bottom:14px;}
.vv-bars{display:flex;align-items:flex-end;gap:12px;height:118px;}
.vv-bar{flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;height:100%;}
.vv-bar__f{width:100%;background:var(--ink-4);min-height:3px;transition:height .4s ease;}
.vv-bar--low .vv-bar__f{background:var(--red);}
.vv-bar--ok .vv-bar__f{background:#1a7f4b;}
.vv-bar__v{font-family:var(--mono);font-size:11.5px;color:var(--ink);margin-bottom:5px;}
.vv-bar__y{font-family:var(--mono);font-size:11px;color:var(--ink-3);margin-top:7px;}
@media (prefers-reduced-motion:reduce){.vv-bar__f{transition:none;}}

/* ---------- caveats ---------- */
/* Deliberately prominent. Self-ID is voluntary, so a low rate can understate reality — publishing
   a number about a named employer without that context would be unfair and legally exposed. */
.vv-note{margin-top:24px;background:var(--soft);border:1px solid var(--line);
  border-left:3px solid var(--ink-4);padding:20px 24px;}
.vv-note p{font-size:13px;line-height:1.7;color:var(--ink-2);}
.vv-note p + p{margin-top:11px;}
.vv-note strong{color:var(--ink);font-weight:600;}
.vv-nobench{background:var(--red-l);border-left-color:var(--red);}
.vv-nobench p{color:var(--red-d);}

.vv-cta{margin-top:26px;padding-top:24px;border-top:1px solid var(--line);}
.vv-cta p{font-size:14.5px;line-height:1.7;color:var(--ink-2);margin-bottom:16px;}

@media (max-width:700px){
  .vv-card{padding:22px 20px;}
  .vv-tiles{grid-template-columns:1fr;}
  .vv-bars{height:96px;gap:8px;}
}