/* cumulative P&L bar chart — plain HTML/CSS bars, not SVG: makes per-bar
   green/red coloring and a zero baseline trivial. */
.pl-chart { position: relative; height: 96px; display: flex; align-items: stretch; gap: 3px; margin-bottom: 1rem; }
.pl-zero { position: absolute; left: 0; right: 0; border-top: 1px dashed var(--border); z-index: 0; }
.pl-col { flex: 1; position: relative; }
.pl-col .bar { position: absolute; left: 1px; right: 1px; background: var(--success); transition: all 0.4s var(--ease); }
.pl-col.neg .bar { background: var(--flag); }
.pl-col .m-label { position: absolute; bottom: -15px; left: 0; right: 0; text-align: center;
                    font-family: var(--font-mono); font-size: 0.55rem; color: var(--fg-muted); }

/* three sliders on one row — wrapping them to two columns overflows the slide */
.controls { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.9rem 1.5rem; }
@media (max-width: 640px) { .controls { grid-template-columns: 1fr !important; } }
.controls label { display: grid; gap: 0.4rem; font-family: var(--font-mono); font-size: 0.72rem;
                  text-transform: uppercase; letter-spacing: 0.06em; color: var(--fg-muted); }
.controls label b { color: var(--accent); font-weight: 500; font-size: 0.85rem; }
.controls input[type=range] { width: 100%; accent-color: var(--accent); }
.econ-provenance { font-size: 0.62rem; color: var(--fg-muted); opacity: 0.7; margin-top: 0.35rem; font-variant-numeric: tabular-nums; }

/* Set when the synced pricing data is missing or its schemaVersion moved.
   Deliberately shows a readable message rather than empty tiles — a blank
   chart reads as "zero", and this needs to be caught in rehearsal. */
#slide-economics.data-unavailable .chart-card,
#slide-economics.data-unavailable .stat-strip,
#slide-economics.data-unavailable .controls,
#slide-economics.data-unavailable .source-note { display: none; }
#slide-economics.data-unavailable .inner::after {
  content: "Pricing data unavailable — this slide is driven by the live cost model. Re-run scripts/sync-pricing-data.sh and redeploy.";
  display: block;
  margin-top: 1rem;
  padding: 1rem 1.25rem;
  border: 1px dashed var(--flag, #e5484d);
  border-radius: 8px;
  color: var(--flag, #e5484d);
  font-size: 0.85rem;
  line-height: 1.5;
}