/* Ordinal cost ramp for these charts: warm, one hue family, light to dark. Dark mode steps are separated by lightness. */
:root{--bvc-low:#E0956A;--bvc-medium:#C8553A;--bvc-high:#8E2F1F}
@media (prefers-color-scheme:dark){:root:where(:not([data-theme="light"])){--bvc-low:#E0B860;--bvc-medium:#CF7B3A;--bvc-high:#B8452F}}
:root[data-theme="dark"]{--bvc-low:#E0B860;--bvc-medium:#CF7B3A;--bvc-high:#B8452F}
/* Buyer brief visuals (public/briefviz.js). Colours only from palette.css. Text is never set left aligned here: prose inherits the global justified rule. */
.bv-grid{align-items:start;display:grid;grid-template-columns:minmax(0,1fr);gap:12px;min-width:0}
.bv-card{background:var(--pit2);border-radius:10px;padding:14px}
.bv-card h3{font-size:1rem}
.bv-fig{min-width:0;max-width:430px}
.bv-svg{display:block;width:100%;height:auto;overflow:visible}
.bv-svg text{font-family:var(--body)}
.bv-axt{fill:var(--dim);font:600 10.5px var(--body);letter-spacing:.04em;text-transform:uppercase;margin:0}
p.bv-axt{font-size:.66rem;color:var(--dim);text-align:center !important;margin:2px 0 0}
.bv-small{font-size:.78rem;color:var(--smoke);margin:6px 0 0}
.bv-rl{font-size:11px}
.bv-name{fill:var(--chalk);font-weight:600}
.bv-cell{fill:var(--pit);stroke:var(--viz-grid)}
.bv-warm{fill:var(--tint-2)}
.bv-hot{fill:var(--tint-4)}
.bv-dot{stroke:var(--pit2);stroke-width:2}
.bv-dn{font:700 11px var(--body);font-variant-numeric:tabular-nums;pointer-events:none}
.bv-t-low,.bv-t-medium,.bv-t-ink{fill:#161D19;color:#161D19}
.bv-t-high{fill:#fff;color:#fff}
.bv-seg{stroke:none}
.bv-rail{stroke:var(--viz-grid);stroke-width:2;stroke-linecap:round}
.bv-tick{stroke-width:2;stroke-linecap:round}
.bv-dia{stroke:var(--pit2);stroke-width:1.5}
.bv-hit{fill:transparent}
.bv-mk{outline:none;cursor:default}
.bv-mk:hover .bv-dot,.bv-mk:focus-visible .bv-dot,.bv-mk:hover .bv-seg,.bv-mk:focus-visible .bv-seg,.bv-mk:hover .bv-ldot,.bv-mk:focus-visible .bv-ldot{stroke:var(--chalk);stroke-width:2}
.bv-mk:focus-visible .bv-hit{stroke:var(--chalk);stroke-width:1.5;stroke-dasharray:3 3}
.bv-mk:hover .bv-bar,.bv-mk:focus-visible .bv-bar{opacity:.78}
.bv-mk:hover .bv-tick,.bv-mk:focus-visible .bv-tick{stroke-width:3}
.bv-key{list-style:none;margin:8px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:4px 14px;font-size:.78rem;color:var(--smoke)}
.bv-key li{display:flex;gap:8px;align-items:flex-start;min-width:0;text-align:left !important}
.bv-kn{flex:none;display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50%;font:700 .68rem/1 var(--body)}
.bv-key span{min-width:0;overflow-wrap:anywhere;line-height:1.35;padding-top:1px}
.bv-gen{fill:var(--viz-grid);opacity:.45}
.bv-gen2{opacity:.22}
.bv-gcur{fill:var(--tint-1);opacity:1}
.bv-gl{fill:var(--dim);font:600 10.5px var(--body)}
.bv-glc{fill:var(--chalk)}
.bv-bar{fill:var(--viz-3)}
.bv-soft{opacity:.45}
.bv-lgb{background:var(--viz-grid);opacity:.7}
.bv-lgt{width:2px !important;height:12px !important;background:var(--viz-axis);border-radius:1px !important}
.bv-lgd{width:9px !important;height:9px !important;background:var(--viz-axis);transform:rotate(45deg);border-radius:1px !important}
.bv-lg2{margin-top:2px}
.bv-panels{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;min-width:0}
.bv-panel{min-width:0;max-width:430px}
.bv-panel h4{margin:0 0 4px;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--smoke);font-weight:700}
.bv-ldot{fill:var(--viz-3);stroke:var(--pit2);stroke-width:2}
.bv-lhollow{fill:none;stroke:var(--viz-axis);stroke-width:1.5;stroke-dasharray:2 2}
.bv-t-lol{fill:#fff;color:#fff}
.bv-how{font-size:.82rem;color:var(--smoke)}
.bv-how summary{cursor:pointer;min-height:36px;display:flex;align-items:center;font-weight:600}
.bv-how ul{margin:4px 0 0;padding-left:18px;display:grid;gap:6px}
.bv-how b{color:var(--chalk)}
.bv-fleetw{display:grid;gap:12px;min-width:0}
.bv-fuel{min-width:0;display:grid;gap:14px}
.bv-ringw{display:grid;grid-template-columns:132px minmax(0,1fr);gap:14px;align-items:center}
.bv-ring{width:132px}
.bv-rtrack{fill:none;stroke:var(--viz-grid);stroke-width:10}
.bv-rA,.bv-rV{fill:none;stroke-width:10;stroke-linecap:butt}
.bv-rA{stroke:var(--viz-1)}
.bv-rV{stroke:var(--viz-2)}
.bv-rn{fill:var(--chalk);font:700 15px var(--body);font-variant-numeric:tabular-nums}
.bv-ringk{min-width:0}
@media (prefers-color-scheme:dark){:root:where(:not([data-theme="light"])) .bv-t-lol{fill:#161D19;color:#161D19}}
:root[data-theme="dark"] .bv-t-lol{fill:#161D19;color:#161D19}
@media (min-width:900px){
  .bv-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bv-wide{grid-column:1/-1}
  .bv-wide .bv-panels{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bv-fleetw{grid-template-columns:minmax(0,430px) minmax(0,1fr);gap:24px;align-items:start}
}
@media (max-width:420px){.bv-ringw{grid-template-columns:104px minmax(0,1fr)}.bv-ring{width:104px}}
@media (prefers-reduced-motion:no-preference){.bv-bar,.bv-dot,.bv-seg{transition:opacity .15s}}

/* each chart is drawn at 2 widths; show the phone one on narrow cards */
.bv-m,.bv-d{display:block;min-width:0}
.bv-d{display:none}
@media (min-width:520px){.bv-m{display:none}.bv-d{display:block}}
