/* Diagram-block figures in the notes. Tone is role: blue = keys and the context, purple = values and stored weights,
   amber = the query or the thing being asked, green = a result or the new state, red = a cost, a limit or what is lost. */
html.lean .dg-figure{margin:1.8em 0 2em;position:relative}
html.lean .dg-figure .dg-host{min-height:60px}
html.lean .dg-figure figcaption{font-family:var(--serif);font-size:.84em;line-height:1.5;color:var(--muted);margin:10px 0 0}
html.lean .dg-figure figcaption b{color:var(--ink);font-weight:400}
html.lean .dg-figure .dg-wrap{margin:0 auto}
html.lean .dg-figure svg,html.lean .dg-figure svg:focus,html.lean .dg-figure svg:focus-visible{outline:none}
@media (min-width:1100px){
  html.lean .dg-figure.dg-wide{width:calc(100% + 300px);max-width:calc(100vw - 56px);margin-left:-150px;margin-right:-150px}
  html.lean .dg-figure.dg-wide figcaption{max-width:var(--measure);margin-left:auto;margin-right:auto}
}
