/* Isolated BCM hero graph. Cache-bust ?v=433000 so this can land beside BCM 4.3.28, PR 38 4.3.27, and a parallel 4.3.29 DSCR mapper. */
.axis-bcm-engine{
  min-width:0;
}
.axis-bcm-graph{
  --bcm-ink:var(--axis-ink);
  --bcm-mute:var(--axis-muted);
  --bcm-line:var(--axis-brass);
  --bcm-area:rgba(201,163,88,.22);
  --bcm-grid:var(--axis-line);
  --bcm-face:var(--axis-cream);
  display:grid;
  gap:16px;
  min-width:0;
  color:var(--bcm-ink);
}
.axis-bcm-graph-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:16px;
}
.axis-bcm-graph-head>div:first-child{
  display:grid;
  gap:6px;
  min-width:0;
}
.axis-bcm-graph-kicker{
  color:#8b6a2d;
  font:800 10px/1.4 var(--axis-mono);
  letter-spacing:.14em;
  text-transform:uppercase;
}
.axis-bcm-graph-head strong{
  color:var(--axis-green);
  font:700 clamp(22px,2.6vw,32px)/1.05 var(--axis-serif);
}
.axis-bcm-graph-score{
  text-align:right;
}
.axis-bcm-graph-score span{
  display:block;
  margin-bottom:4px;
  color:#8b6a2d;
  font:800 9px/1.2 var(--axis-mono);
  letter-spacing:.12em;
  text-transform:uppercase;
}
.axis-bcm-graph-score b{
  color:var(--axis-green);
  font:700 clamp(48px,6vw,72px)/.8 var(--axis-serif);
  font-variant-numeric:tabular-nums;
}
.axis-bcm-graph-score small{
  margin-left:4px;
  color:#8b6a2d;
  font:800 11px/1 var(--axis-mono);
  letter-spacing:.08em;
}
.axis-bcm-graph-plot{
  position:relative;
  min-width:0;
}
.axis-bcm-graph-plot svg{
  display:block;
  width:100%;
  height:auto;
}
.axis-bcm-graph-plot text{
  fill:var(--bcm-mute);
  font-family:var(--axis-mono);
  font-size:9px;
  font-weight:800;
  letter-spacing:.04em;
}
.axis-bcm-graph-plot .axis-bcm-threshold-label{
  fill:#8b6a2d;
  font-size:11px;
}
.axis-bcm-line{
  fill:none;
  stroke:var(--bcm-line);
  stroke-width:3.2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.axis-bcm-area{fill:var(--bcm-area)}
.axis-bcm-threshold{
  stroke:var(--bcm-line);
  stroke-width:1.8;
  stroke-dasharray:5 5;
}
.axis-bcm-grid{stroke:var(--bcm-grid);stroke-width:1}
.axis-bcm-dot{
  fill:var(--bcm-line);
  stroke:var(--bcm-face);
  stroke-width:2;
  opacity:0;
}
.axis-bcm-dot.is-on{opacity:1}
.axis-bcm-cursor{
  fill:var(--bcm-face);
  stroke:var(--bcm-line);
  stroke-width:3;
}
.axis-bcm-graph-chips{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  min-height:34px;
}
.axis-bcm-graph-chips[hidden]{display:none}
.axis-bcm-chip{
  display:inline-flex;
  align-items:center;
  min-height:32px;
  padding:7px 12px;
  border-radius:999px;
  font:800 10px/1.2 var(--axis-mono);
  letter-spacing:.08em;
  text-transform:uppercase;
}
.axis-bcm-chip.fit{background:#dfeee7;color:#24644f}
.axis-bcm-chip.test{background:#f1e8d4;color:#805d21}
.axis-bcm-graph-foot{
  display:grid;
  gap:6px;
  color:var(--bcm-mute);
  font:600 12px/1.45 var(--axis-sans);
}
.axis-bcm-graph-foot strong{
  color:var(--axis-green);
  font:800 10px/1.35 var(--axis-mono);
  letter-spacing:.08em;
  text-transform:uppercase;
}
.axis-bcm-graph-stamp{
  color:var(--bcm-mute);
  font:800 9px/1.2 var(--axis-mono);
  letter-spacing:.12em;
  text-transform:uppercase;
}
@media (max-width:1050px){
  .axis-monitoring-hero .axis-page-hero-grid{align-items:stretch}
  .axis-bcm-engine{margin-top:4px}
}
@media (max-width:390px){
  .axis-bcm-engine .axis-engine-body{padding:18px 14px 16px}
  .axis-bcm-graph-head{align-items:flex-start}
  .axis-bcm-graph-score b{font-size:46px}
  .axis-bcm-graph-plot text{font-size:8px}
  .axis-bcm-chip{min-height:30px;padding:6px 10px;font-size:9px}
}
@media (prefers-reduced-motion:reduce){
  .axis-bcm-line,
  .axis-bcm-area,
  .axis-bcm-dot,
  .axis-bcm-cursor,
  .axis-bcm-graph-chips{transition:none}
}
