/* Each explanation belongs to its figure. No stage labels or extra rules. */
.em-diagram {container:em / inline-size}
.em-stages {display:grid;grid-template-columns:minmax(0,1.9fr) minmax(0,1fr);gap:clamp(1.5rem,3vw,3rem);align-items:start}
.em-stage {display:grid;gap:1rem;min-width:0;margin:0}
.em-art {display:grid;align-items:center;aspect-ratio:38/17;min-width:0}
.em-art svg {display:block;width:100%;height:auto}
.em-stage:last-child .em-art {aspect-ratio:20/17;justify-items:center}
.em-stage:last-child .em-art svg {width:82%}
.em-stage figcaption {max-width:55ch;color:#526052;font:400 clamp(1rem,1.1vw,1.2rem)/1.55 var(--font-body,Inter),sans-serif;text-wrap:pretty}
@container em (max-width:44em) {
 .em-stages {grid-template-columns:1fr;gap:2rem}
 .em-stage:last-child .em-art {width:65%;justify-self:center}
}
.em-wave {fill:none;stroke:#3e584c;stroke-width:1.2;vector-effect:non-scaling-stroke}
.em-echo {fill:none;stroke:#b44c35;stroke-width:1.3;vector-effect:non-scaling-stroke}
.em-doc-page {fill:#f6f5f1;stroke:#bac3b5;stroke-width:1;vector-effect:non-scaling-stroke}
.em-doc-mid {fill:#f1f0eb}
.em-doc-back {fill:#ebeae4}
.em-doc-rule {fill:none;stroke:#d3d8cc;stroke-width:1;vector-effect:non-scaling-stroke}
.em-doc-axis {fill:none;stroke:#aab5a3;stroke-width:1;vector-effect:non-scaling-stroke}
.em-doc-title {fill:#3e584c;opacity:.85}
.em-doc-text {fill:#c9d0c3}
.em-doc-accent {fill:#b44c35;opacity:.8}
.em-doc-bar {fill:#b9c7b4}
.em-doc-curve {fill:none;stroke:#3e584c;stroke-width:1.5;vector-effect:non-scaling-stroke}
.em-doc-trend {fill:none;stroke:#526d50;stroke-width:1.4;vector-effect:non-scaling-stroke}
.em-doc-marker {stroke:#b44c35;stroke-width:1;vector-effect:non-scaling-stroke}
.em-doc-dot {fill:#b44c35}

/* ?tune panel (never shown to visitors). */
.em-tuner {position:fixed;right:0.75rem;bottom:0.75rem;z-index:80;width:18.125rem;max-height:80vh;overflow:auto;padding:0.75rem;background:#fffffff2;border:0.0625rem solid #bac3b5;border-radius:0.25rem;font:0.6875rem/1.3 Inter,sans-serif;color:#2d3b32;box-shadow:0 0.375rem 1.5rem #0002}
.em-tuner strong {display:block;margin-bottom:0.5rem;font-size:0.75rem}
.em-tuner label {display:grid;grid-template-columns:5.75rem 1fr 2.375rem;align-items:center;gap:0.375rem;margin:0.1875rem 0}
.em-tuner input[type=color] {grid-column:2/4;height:1.25rem;padding:0;border:0}
.em-tuner output {text-align:right;font-variant-numeric:tabular-nums}
.em-tuner button {margin:0.5rem 0.375rem 0.375rem 0;font:inherit;padding:0.25rem 0.625rem}
.em-tuner textarea {width:100%;font:0.625rem/1.3 ui-monospace,monospace}