/* Scoped optional learning views; the original workbench remains the page's first content. */
#signal-open{color:var(--mint);border:1px solid var(--line);text-decoration:none;padding:8px 12px;background:#132d39}
#how-dialog.signal-expanded{max-width:850px}
.signal-explainer{border-top:1px solid var(--line);margin:18px 0;padding-top:14px;clear:both}
.signal-explainer summary{cursor:pointer;min-height:44px;padding:9px 4px;font-weight:650;color:var(--mint)}
.signal-explainer summary:focus-visible{outline:3px solid #ffcf82;outline-offset:3px}
.signal-explainer h3{margin:10px 0 8px;font-size:1.15rem;line-height:1.3}
.signal-explainer p,.signal-explainer li{font-size:.9375rem}
.signal-explainer figure{margin:12px 0}
.signal-scene{position:relative;width:100%;height:360px;overflow:hidden;background:radial-gradient(ellipse at 50% 40%,#28414b,#091d29);border:1px solid #657e86;border-radius:10px;isolation:isolate}
.signal-poster{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain}
.signal-canvas{position:absolute;inset:0;display:block;width:100%;height:100%;touch-action:none;cursor:grab;z-index:1}
.signal-canvas:active{cursor:grabbing}
.signal-canvas:focus-visible{outline:3px solid #ffcf82;outline-offset:-5px}
.signal-label{position:absolute;max-width:calc(100% - 12px);transform:translate(-50%,-50%);pointer-events:none;font:600 .6875rem/1.25 system-ui;color:#f3f7ed;background:#102b37eb;border:1px solid #7c9499;border-radius:4px;padding:3px 5px;z-index:2;white-space:nowrap}
.signal-explainer figcaption,.signal-explainer .signal-hint{font-size:.8125rem;color:var(--muted);margin:8px 0}
.signal-controls{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0}
.signal-controls button{min-height:44px;font-size:.875rem;flex:0 1 auto}
.signal-controls button[aria-pressed=true]{box-shadow:inset 0 0 0 1px var(--mint);border-color:var(--mint)}
.signal-path{padding:0;list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.signal-path li{border:1px solid var(--line);border-radius:8px;padding:10px;margin:0;background:#152b38}
.signal-path strong{display:block;color:var(--ink);margin-bottom:5px}
.signal-path span{font-size:.875rem}
.signal-example{border:1px solid var(--line);border-radius:9px;padding:12px;margin-top:14px;background:#142735}
.signal-example label{display:block;font-weight:600;font-size:.9375rem;margin:10px 0 4px}
.signal-example input[type=range]{display:block;width:100%;min-height:36px;accent-color:#cfb9ff}
.signal-demo-plots{display:grid;grid-template-columns:minmax(110px,.7fr) minmax(0,1.6fr);gap:12px}
.signal-demo-plots figure{margin:0;min-width:0}
#signal-demo-frame{display:block;width:100%;height:150px;border:1px solid var(--line);border-radius:6px}
#signal-demo-chart{display:block;width:100%;height:150px;background:#0b1d28;border-radius:6px}
.signal-demo-legend{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:.8125rem;color:var(--muted)}
.signal-demo-legend span::before{content:'';display:inline-block;width:18px;height:3px;margin:0 6px 3px 0;background:#edc481}
.signal-demo-legend span+span::before{background:#cdb9ff}
#signal-demo-reading{font-size:.875rem;min-height:2.8em;font-variant-numeric:tabular-nums}
@media(max-width:560px){.signal-scene{height:300px}.signal-path{grid-template-columns:1fr}.signal-demo-plots{grid-template-columns:1fr}.signal-demo-plots figure:first-child{max-width:240px;width:100%;margin:auto}.signal-controls button{flex:1 1 auto}#how-dialog.signal-expanded{padding:16px}.signal-explainer h3{font-size:1.1rem}}
.large-text .signal-path,.large-text .signal-demo-plots{grid-template-columns:1fr}.large-text .signal-scene{height:420px}.large-text .signal-label{white-space:normal}
@media(prefers-reduced-motion:reduce){.signal-explainer *{animation:none!important;transition:none!important;scroll-behavior:auto!important}}