/* Hive new primitive block.
   Dropped into partner and use case pages by
   scripts/apply_partner_new_primitives.py.

   Every colour reads from the host page first and only falls back to the Hive
   default when the page does not define that variable. That way the block takes
   on each page's own palette instead of importing a foreign one. Class names are
   all namespaced hvnp so they cannot collide with a page's own styles.

   Gold is never used here. Blue is product and action. Green is a pass verdict.
*/

.hvnp{
  --hvnp-bg: var(--hull, var(--panel, var(--card, #0a1224)));
  --hvnp-bg2: var(--hull-2, var(--void, var(--bg, #071020)));
  --hvnp-line: var(--line, var(--border, #1b3a58));
  --hvnp-blue: var(--blue, var(--accent, #2F80FF));
  --hvnp-blue-soft: var(--blue-soft, var(--accent-soft, #7ecfff));
  --hvnp-green: var(--green, var(--ok, #34D399));
  --hvnp-hot: var(--hot, var(--bad, #ff8da6));
  --hvnp-text: var(--star, var(--fg, var(--text, #ffffff)));
  --hvnp-muted: var(--muted, #b6c7dc);
  --hvnp-dim: var(--dim, #7d8ea3);
  --hvnp-mono: var(--mono, ui-monospace, SFMono-Regular, Menlo, monospace);
  padding:64px 20px;
  border-top:1px solid var(--hvnp-line);
  background:var(--hvnp-bg2);
  color:var(--hvnp-text);
  text-align:left;
}
.hvnp *,.hvnp *::before,.hvnp *::after{text-align:inherit}
.hvnp__wrap{max-width:1140px;margin:0 auto;text-align:left}
.hvnp__k{
  display:block;text-align:left;font-family:var(--hvnp-mono);font-size:11px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--hvnp-blue-soft);margin:0 0 14px;
}
.hvnp__h{font-size:clamp(24px,3.2vw,36px);line-height:1.15;margin:0 0 14px;font-weight:600}
.hvnp__lede{font-size:16px;line-height:1.62;color:var(--hvnp-muted);max-width:74ch;margin:0 0 34px}
.hvnp__grid{display:grid;gap:22px;grid-template-columns:1fr}
@media(min-width:900px){.hvnp__grid.two{grid-template-columns:1fr 1fr}}

.hvnp-c{
  border:1px solid var(--hvnp-line);border-radius:14px;background:var(--hvnp-bg);
  padding:24px;display:flex;flex-direction:column;gap:14px;
}
.hvnp-c__t{font-family:var(--hvnp-mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--hvnp-blue)}
.hvnp-c__n{font-size:20px;line-height:1.25;margin:0;font-weight:600}
.hvnp-c__p{font-size:15px;line-height:1.65;color:var(--hvnp-muted);margin:0}
.hvnp-c__p b{color:var(--hvnp-text);font-weight:600}
.hvnp-c__no{font-size:13.5px;line-height:1.6;color:var(--hvnp-dim);margin:0;padding-left:12px;border-left:2px solid var(--hvnp-line)}
.hvnp-c__links{display:flex;flex-wrap:wrap;gap:10px;margin-top:2px}
.hvnp-a{
  font-family:var(--hvnp-mono);font-size:12px;letter-spacing:.04em;text-decoration:none;
  border:1px solid var(--hvnp-line);border-radius:999px;padding:7px 14px;
  color:var(--hvnp-blue-soft);background:transparent;transition:border-color .15s,color .15s;
}
.hvnp-a:hover{border-color:var(--hvnp-blue);color:var(--hvnp-blue)}
.hvnp-a.solid{background:var(--hvnp-blue);border-color:var(--hvnp-blue);color:#04121f;font-weight:600}
.hvnp-a.solid:hover{color:#04121f;filter:brightness(1.08)}

.hvnp-run{border:1px solid var(--hvnp-line);border-radius:12px;padding:18px;background:var(--hvnp-bg2)}
.hvnp-run__hd{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:space-between;margin-bottom:12px}
.hvnp-run__rt{font-family:var(--hvnp-mono);font-size:11.5px;color:var(--hvnp-dim);word-break:break-all}
.hvnp-run__btns{display:flex;flex-wrap:wrap;gap:8px}
.hvnp-b{
  font-family:var(--hvnp-mono);font-size:12px;cursor:pointer;border-radius:8px;padding:8px 13px;
  border:1px solid var(--hvnp-blue);background:var(--hvnp-blue);color:#04121f;font-weight:600;
}
.hvnp-b.ghost{background:transparent;color:var(--hvnp-blue-soft);border-color:var(--hvnp-line);font-weight:400}
.hvnp-b:disabled{opacity:.45;cursor:default}
.hvnp-out{font-family:var(--hvnp-mono);font-size:12px;line-height:1.55;color:var(--hvnp-muted);margin:0}
.hvnp-out pre{
  margin:10px 0 0;padding:12px;border:1px solid var(--hvnp-line);border-radius:8px;
  background:rgba(0,0,0,.28);max-height:280px;overflow:auto;white-space:pre-wrap;word-break:break-word;
  font-size:11.5px;color:var(--hvnp-muted);
}
.hvnp-tag{
  display:inline-block;font-family:var(--hvnp-mono);font-size:10.5px;letter-spacing:.06em;
  border:1px solid var(--hvnp-line);border-radius:999px;padding:3px 9px;margin:0 6px 6px 0;color:var(--hvnp-dim);
}
.hvnp-tag.ok{border-color:var(--hvnp-green);color:var(--hvnp-green)}
.hvnp-tag.no{border-color:var(--hvnp-hot);color:var(--hvnp-hot)}
.hvnp-tag.info{border-color:var(--hvnp-blue-soft);color:var(--hvnp-blue-soft)}
.hvnp__foot{
  margin:30px 0 0;font-size:13px;line-height:1.6;color:var(--hvnp-dim);max-width:80ch;
  padding-top:18px;border-top:1px solid var(--hvnp-line);
}
