
.hb-wrap{max-width:820px}
.hb-hero{overflow:hidden;position:relative}
.hb-badge{display:inline-block;padding:7px 12px;border-radius:999px;background:#fff1f4;border:1px solid #f4d7de;font-size:13px;font-weight:700;margin:8px 0 10px}
.hb-type-strip{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0}
.hb-type-strip span{background:#f7f7f8;border:1px solid #ececef;border-radius:999px;padding:7px 10px;font-size:13px}
.hb-split{display:grid;grid-template-columns:1.25fr 1fr;gap:14px}
.hb-radar-card{min-height:320px}
#hb-radar{display:flex;justify-content:center;align-items:center;min-height:265px}
.hb-radar-svg{width:100%;max-width:330px;height:auto}
.hb-radar-label{font-size:12px;fill:currentColor;font-weight:700}
.hb-radar-value{font-size:11px;fill:currentColor}
.hb-script{margin-top:14px;padding:14px;border-radius:14px;background:#faf6f7;border:1px solid #efe4e7}
.hb-deep-card{background:linear-gradient(180deg,#fff,#fbf8f9)}
.hb-persona-chip{display:inline-flex;align-items:center;gap:6px;padding:7px 10px;border-radius:999px;background:#f6f6f7;margin-top:6px}
.hb-match-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
.hb-match-item{padding:12px;border-radius:14px;border:1px solid #ececef;background:#fff}
.hb-dim-legend{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px}
.hb-dim-legend div{font-size:12px;padding:8px 10px;background:#f8f8f9;border-radius:10px}
.hb-question-box .answer{line-height:1.5}
@media (max-width:700px){
  .hb-split{grid-template-columns:1fr}
  .hb-match-grid{grid-template-columns:1fr}
}
