.ctrl{display:grid;grid-template-columns:1fr 2fr auto;align-items:center;gap:10px;padding:7px 0;border-bottom:1px solid var(--rule)}.ctrl--choice{grid-template-columns:1fr;gap:8px;border-bottom:0;padding-bottom:22px}.ctrl__label{font-family:var(--font-sans);font-weight:400;font-size:14px;line-height:1.5;letter-spacing:0;text-wrap:balance;color:var(--muted)}.ctrl__value{font-family:var(--font-sans);font-weight:400;font-size:14px;line-height:1.5;letter-spacing:0;text-wrap:balance;font-variant-numeric:tabular-nums;text-align:right;min-width:5ch}.ctrl__range{appearance:none;width:100%;height:1px;background:var(--rule);outline:none}.ctrl__range::-webkit-slider-thumb{appearance:none;width:11px;height:11px;border-radius:50%;background:var(--ink);cursor:grab}.ctrl__range::-moz-range-thumb{width:11px;height:11px;border:0;border-radius:50%;background:var(--ink);cursor:grab}.ctrl__range:active::-webkit-slider-thumb{cursor:grabbing}.ctrl__options{display:grid;grid-template-columns:repeat(var(--opt-cols, 3),1fr);gap:6px}.ctrl__opt{font-family:var(--font-sans);font-weight:400;font-size:14px;line-height:1.5;letter-spacing:0;text-wrap:balance;appearance:none;border:1px solid var(--rule);background:transparent;color:var(--muted);padding:8px 12px;border-radius:100px;cursor:pointer;transition:color .2s,border-color .2s,background-color .2s}.ctrl__opt:hover{color:var(--ink)}.ctrl__opt[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:var(--paper)}.diagram{display:grid;grid-template-columns:1fr 300px;gap:var(--gutter);align-items:start;margin:0}.diagram__stage{position:relative;aspect-ratio:4/3;background:var(--paper);border:1px solid var(--rule);overflow:hidden}.diagram__stage>*{position:absolute;inset:0}.diagram__stage canvas{width:100%;height:100%;display:block}.diagram--pair{display:grid;grid-template-columns:1fr;row-gap:14px}.diagram__plates{display:grid;grid-template-columns:1fr 1fr;gap:var(--gutter)}.diagram__plate{margin:0;min-width:0}.diagram__platecap{margin-top:6px}.diagram--pair .diagram__stage{aspect-ratio:7/8}.diagram__head{display:flex;align-items:baseline;gap:10px;padding-bottom:10px;border-bottom:1px solid var(--ink);margin-bottom:6px}.diagram__title{font-family:var(--font-sans);font-weight:400;font-size:14px;line-height:1.5;letter-spacing:0;text-wrap:balance}.diagram__caption{font-family:var(--font-sans);font-weight:400;font-size:14px;line-height:1.5;letter-spacing:0;text-wrap:balance;color:var(--muted);margin-top:12px}.diagram__credit{margin-top:10px;padding-top:10px;border-top:1px solid var(--rule)}@media(min-width:1024px){.diagram{padding-inline:var(--margin)}}@media(min-width:1280px){.diagram{grid-template-columns:repeat(12,1fr);column-gap:var(--gutter);height:100vh}.diagram:not(.diagram--pair){align-items:start}.diagram:not(.diagram--pair) .diagram__stage{grid-column:1/10;align-self:stretch;aspect-ratio:auto}.diagram__panel{grid-column:10/-1}.diagram--pair{align-content:center;align-items:start;row-gap:16px}.diagram--pair>*{grid-column:1/-1}}@media(max-width:1023px){.diagram{grid-template-columns:1fr}}@media(max-width:767px){.diagram__plates{grid-template-columns:1fr}}