/* Step 01 · The problem */
#s1 .s1-src { color: var(--source); }
#s1 .s1-tgt { color: var(--target); }
#s1 canvas.plot { touch-action: auto; } /* nothing to drag here: let phones scroll and zoom over the plot */
#s1 .s1-legend { margin-top: 8px; font-size: 0.86rem; }
#s1 .s1-title { font-family: var(--f-display); font-weight: 700; font-size: 1.15rem; margin: 0; }
#s1 .s1-sliders { display: grid; gap: 8px; }
#s1 .readout { display: grid; gap: 2px; }
#s1 .s1-mats { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 6px; margin-bottom: 4px; }
#s1 .s1-row { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; }
#s1 .s1-row b { font-weight: 600; font-size: 0.95rem; }
#s1 .s1-small { font-size: 0.78rem; }
#s1 .caption { max-width: 60rem; }
#s1 .ctl .ctl-val { grid-row: 1; grid-column: 2; }
#s1 .readout b.good { color: var(--good); }