/* Keep the controls and selected plot together; no sticky or nested scrolling. */
.side-by-side main{max-width:1240px;padding:22px 26px}
.side-by-side header{margin-bottom:16px}.side-by-side header h1{font-size:27px;margin:8px 0}.side-by-side header .intro{font-size:13px;max-width:900px}.side-by-side .circuit{display:none}
.experiment-workspace{display:grid;grid-template-columns:220px minmax(0,1fr);gap:20px;align-items:start;margin:12px 0 20px}
.experiment-workspace section{margin:0}.control-pane .section-top{display:block;margin-bottom:12px}.control-pane h2{font-size:15px;margin-bottom:10px}.control-pane .presets{display:grid;grid-template-columns:1fr 1fr;gap:5px}.control-pane .presets button{padding:7px 4px;font-size:11px;min-height:34px}
.control-pane .controls{grid-template-columns:1fr;gap:16px;padding:15px 13px;box-shadow:none;border-radius:7px}.control-pane label{gap:4px}.control-pane label>span{font-size:12px;gap:7px;align-items:baseline}.control-pane output{font-size:12px}.control-pane small{font-size:10px;line-height:1.45}.control-pane input[type=range]{min-height:24px}.control-pane label[for=post]>span{flex-wrap:wrap;gap:0 8px}
.plot-pane{min-width:0}.plot-pane .result{display:block;padding:12px 15px;margin:0 0 12px;border-radius:7px}.plot-pane .result-label{font-size:9px}.plot-pane .result h2{font-size:18px;margin:4px 0}.plot-pane .result p{font-size:11px;margin:3px 0}.plot-pane .limit{display:flex;flex-wrap:wrap;gap:2px 12px;align-items:baseline;min-width:0;font-size:10px;margin-top:8px}.plot-pane .limit strong{font-size:21px}.plot-pane .limit span:last-child{margin-left:auto}
.plot-tabs{display:flex;gap:6px;margin:12px 0}.plot-tabs button{font-size:12px;padding:7px 12px;border-radius:4px}.plot-tabs button[aria-selected=true]{color:var(--accent);background:var(--accent-soft);border-color:var(--accent)}
.plot-pane [role=tabpanel][hidden]{display:none}.plot-pane [role=tabpanel] .section-top{margin-bottom:7px}.plot-pane [role=tabpanel] h2{font-size:13px}.plot-pane .subtle{font-size:10px}.plot-pane .legend{gap:6px 16px;font-size:10px;margin:5px 0}.plot-pane .chart-note{font-size:10px;line-height:1.5;margin:9px 0 0}.side-by-side .learning{margin-top:14px;border:0;padding:0}.side-by-side details{font-size:12px;padding:12px 0}.side-by-side .learning ol{font-size:12px}
body.embedded.side-by-side main{padding:12px 8px;max-width:1240px}body.embedded.side-by-side header{display:none}body.embedded.side-by-side .experiment-workspace{margin-top:0}
@media(max-width:600px){.side-by-side main{padding:18px 12px}.experiment-workspace{grid-template-columns:170px minmax(0,1fr);gap:12px}.control-pane .controls{padding:12px 9px;gap:13px}.control-pane label>span{font-size:11px;flex-wrap:wrap;gap:0 8px}.control-pane .presets button{font-size:10px}.plot-pane .result{padding:10px}.plot-pane .result h2{font-size:15px}.plot-tabs{gap:4px}.plot-tabs button{font-size:10px;padding:6px}.plot-pane .limit span:last-child{margin-left:0}}
@media(max-width:480px){.experiment-workspace{grid-template-columns:1fr}.control-pane .presets{grid-template-columns:repeat(4,1fr)}.control-pane .controls{grid-template-columns:1fr 1fr}.control-pane label>span{font-size:12px}.control-pane small{font-size:10px}.plot-pane .result{margin-top:8px}}
