/* crowd-forecast-pill-v1.css — Crowds pill + modal.
 * px font sizes per site rules. Pill visuals match the .hg-fees-pill /
 * .hg-surf-btn family in the shared status-pill row. */

.hg-cf-pill-wrap{display:inline-flex;align-items:center;margin:0 6px}
.hg-cf-pill{
  display:inline-flex;align-items:center;gap:8px;
  border:none;cursor:pointer;
  padding:8px 14px;border-radius:999px;
  font-size:13px;font-weight:700;
  color:#fff;background:#555;
  box-shadow:0 2px 6px rgba(0,0,0,.15);
  font-family:inherit;line-height:1.2;
  text-transform:uppercase;letter-spacing:.3px;
  -webkit-appearance:none;appearance:none;
}
.hg-cf-pill .fa{font-size:15px}
.hg-cf-pill:hover{opacity:.92}
.hg-cf-pill.is-high{background:#b3661a}
.hg-cf-pill.is-moderate{background:#46626f}
.hg-cf-pill.is-low{background:#1D9771}
@media (max-width:600px){
  .hg-cf-pill-wrap{margin:4px 3px}
  .hg-cf-pill{font-size:11px;padding:6px 10px;letter-spacing:.1px;gap:6px}
  .hg-cf-pill .fa{font-size:13px}
}
@media (max-width:380px){
  .hg-cf-pill{font-size:10px;padding:5px 8px}
  .hg-cf-pill .fa{font-size:12px}
}

/* ── Modal ── */
.hg-cf-modal{
  display:none;position:fixed;top:0;left:0;width:100%;height:100%;
  z-index:99999;justify-content:center;align-items:center;padding:20px;
}
.hg-cf-modal.is-open{display:flex}
.hg-cf-modal-bg{
  position:absolute;top:0;left:0;width:100%;height:100%;
  background:rgba(0,0,0,.55);
  backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);
}
.hg-cf-modal-card{
  position:relative;background:#fff;border-radius:16px;
  max-width:500px;width:100%;max-height:85vh;overflow-y:auto;
  box-shadow:0 8px 40px rgba(0,0,0,.3);
  -webkit-overflow-scrolling:touch;
}
.hg-cf-modal-head{
  display:flex;justify-content:space-between;align-items:center;
  padding:16px 20px 12px;border-bottom:1px solid #eee;
}
.hg-cf-modal-head h3{font-size:19px;margin:0}
.hg-cf-modal-head h3 .fa{color:#46626f;margin-right:6px}
.hg-cf-modal-close{
  background:none;border:none;font-size:26px;color:#999;
  cursor:pointer;padding:2px 8px;line-height:1;
}
.hg-cf-modal-body{padding:16px 20px 6px}
.hg-cf-title-row{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 4px}
.hg-cf-title-row h4{font-size:20px;margin:0}
.hg-cf-level{
  font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;
  padding:4px 11px;border-radius:999px;color:#fff;white-space:nowrap;
}
.hg-cf-level.is-high{background:#b3661a}
.hg-cf-level.is-moderate{background:#46626f}
.hg-cf-level.is-low{background:#1D9771}
.hg-cf-headline{font-size:16px;font-weight:600;color:#2c3e49;margin:4px 0 14px}
.hg-cf-row{display:flex;gap:12px;padding:9px 0;border-top:1px solid #f1f4f6}
.hg-cf-row .fa{color:#46626f;font-size:17px;width:22px;text-align:center;margin-top:2px;flex:0 0 auto}
.hg-cf-row strong{font-size:14px;text-transform:uppercase;letter-spacing:.03em;color:#48606e;display:block;margin-bottom:2px}
.hg-cf-row p{font-size:15px;line-height:1.5;margin:0;color:#33454f}
.hg-cf-alt{
  background:#eef7f1;border:1px solid #cfe8d8;border-radius:12px;
  padding:12px 14px;margin:12px 0 10px;
}
.hg-cf-alt-eyebrow{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:#176a3a;margin-bottom:4px}
.hg-cf-alt-eyebrow .fa{margin-right:4px}
.hg-cf-alt-name{font-size:17px;font-weight:700;color:#0a5793;text-decoration:none}
.hg-cf-alt-name:hover{text-decoration:underline}
.hg-cf-alt-note{font-size:14px;line-height:1.5;color:#33454f;margin:4px 0 0}
.hg-cf-modal-foot{border-top:1px solid #eee;padding:10px 20px 14px}
.hg-cf-disclaimer{font-size:12px;color:#8a99a3;margin:0}
