[data-interactive="straight-pull"] { min-width: 0; margin-block: 1rem; }
[data-interactive="straight-pull"] * { box-sizing: border-box; }
.sp-lab { font: .96rem/1.5 var(--f-display); }
.sp-lab [hidden] { display:none !important; }
.sp-predict { min-width:0; padding:.75rem; border:1px solid var(--rule); }
.sp-predict legend { font-weight:750; }
.sp-predict label { display:flex; align-items:center; gap:.5rem; min-height:44px; }
.sp-lab :is(button,select,input) { font:inherit; color:var(--ink); accent-color:var(--accent); }
.sp-lab :is(button,select) { border:1px solid var(--rule); border-radius:var(--radius-xs); min-height:44px; background:var(--surface); padding:.4rem .6rem; }
.sp-lab button { cursor:pointer; }
.sp-lab button:disabled { opacity:.55; cursor:default; }
.sp-lab :is(button,select,input):focus-visible { outline:3px solid var(--accent); outline-offset:3px; }
.sp-controls { margin-top:1rem; display:grid; gap:.7rem; }
.sp-controls label { display:grid; gap:.3rem; font-weight:650; }
.sp-controls select { width:100%; min-width:0; }
.sp-controls input[type="range"] { min-height:44px; width:100%; margin:0; }
.sp-presets { display:flex; flex-wrap:wrap; gap:.4rem; }
.sp-path { font-weight:750; border-left:4px solid var(--accent); padding:.6rem; background:var(--surface); }
.sp-lab figure { margin:1rem 0; }
.sp-diagram { display:block; width:100%; height:auto; max-width:30rem; margin-inline:auto; background:var(--paper); }
.sp-diagram text { fill:var(--ink); font:700 22px var(--f-display); }
.sp-mold { fill:var(--surface-2); stroke:var(--rule); stroke-width:2; }
.sp-opening { stroke:var(--ink-soft); stroke-width:1.5; stroke-dasharray:4 5; }
.sp-cavity { fill:none; stroke:var(--ink); stroke-width:3; }
.sp-ghost { fill:var(--accent); fill-opacity:.17; stroke:var(--accent); stroke-width:2.5; stroke-dasharray:7 5; }
.sp-interference { fill:var(--mark-stop,#b8321c); fill-opacity:.3; stroke:var(--ink); stroke-width:2; stroke-dasharray:2 2; }
.sp-witness { fill:none; stroke:var(--ink); stroke-width:2.5; }
.sp-arrow { fill:none; stroke:var(--ink); stroke-width:3; }
.sp-readings { border:1px solid var(--rule); padding:.7rem; }
.sp-readings h3 { margin:.1rem 0 .5rem; font-size:1.05rem; }
.sp-static .unit-table { width:100%; }
@media (max-width:36rem) { .sp-presets button { flex:1 1 100%; } }
@media (prefers-reduced-motion:reduce) { [data-interactive="straight-pull"] * { animation:none !important; transition:none !important; } }
@media screen { [data-interactive="straight-pull"][data-sp-ready] > .sp-static { display:none; } }
@media print {
  [data-interactive="straight-pull"] .sp-lab { display:none !important; }
  [data-interactive="straight-pull"] > .sp-static { display:block !important; }
  .sp-static .sp-diagram { max-width:23rem; }
  .sp-static .unit-table { min-width:0; font-size:.88rem; }
}
