.harness-figure { --harness-l1: #86b5d6; --harness-l2: #3788bd; --harness-l3: #175583; }
.harness-cost_usd { --harness-l1: #ffb16f; --harness-l2: #f47721; --harness-l3: #ab3e08; }
.harness-figure [hidden] { display: none !important; }
.harness-l1 { fill: var(--harness-l1); background: var(--harness-l1); }
.harness-l2 { fill: var(--harness-l2); background: var(--harness-l2); }
.harness-l3 { fill: var(--harness-l3); background: var(--harness-l3); }
.harness-legend { display: flex; justify-content: center; gap: 24px; padding: 0 8px 12px; color: var(--text-secondary); font: 11px/1.5 var(--mono); }
.harness-legend > span { display: inline-flex; align-items: center; gap: 7px; }
.harness-legend i { width: 16px; height: 10px; border-radius: 2px; }
.harness-panels { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 16px 12px 8px; gap: 14px; }
.harness-panel { min-width: 0; }
.research-page .harness-panel h3 { font: 500 19px/1.4 var(--serif); margin: 0 0 10px; text-align: center; }
.harness-scroll { min-width: 0; width: 100%; }
.harness-scroll svg { display: block; width: 100%; max-width: 100%; min-width: 0; height: auto; }
.harness-gridline { stroke: var(--grid); stroke-width: 1; }
.harness-tick, .harness-missing { fill: var(--text-muted); font: 10px var(--mono); }
.harness-model { fill: var(--text-secondary); font: 11px var(--serif); }
.harness-bar { transform-box: fill-box; transform-origin: center bottom; transform: scaleY(1); transition: transform 750ms cubic-bezier(.2,.7,.2,1) var(--delay); }
.harness-figure.is-ready:not(.is-revealed) .harness-bar { transform: scaleY(0); }
.harness-bar:hover, .harness-bar:focus { filter: brightness(1.2); stroke: var(--text-primary); stroke-width: 1; outline: none; }
.harness-scroll:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.research-page .harness-status { font-size: 12px; padding: 0 20px; color: var(--text-muted); }
@media (max-width: 1450px) { .harness-panels { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 680px) { .harness-panels { padding: 12px 8px; gap: 20px; } }
@media (prefers-reduced-motion: reduce) { .harness-bar { transition: none; } .harness-figure.is-ready .harness-bar { transform: none; } }
@media print { .harness-figure .harness-bar { transform: none !important; } .harness-scroll { overflow: visible; } .harness-scroll svg { min-width: 0 !important; } }
