/* diagram styles for "Without Intermediaries" -- generated from the
   post's build.py; scoped under figure.diagram to avoid theme collisions */
figure.diagram { margin: 2.2rem 0; text-align: center; }
figure.diagram svg { width: 100%; height: auto;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
figure.diagram figcaption { font-size: 1.1rem; line-height: 1.6;
  margin-top: .5rem;
  /* undo tufte.css's margin-note float (float: right; max-width: 40%) */
  float: none; clear: both; max-width: 100%; text-align: center;
  margin-left: auto; margin-right: auto; }
figure.diagram .slbl { font-size:13px; font-weight:600; fill:#2a2a3a; }
figure.diagram .ssub { font-size:10px; fill:#777; }
figure.diagram .sdata { font-size:10px; fill:#0099ff; }
figure.diagram .sopen { font-size:10px; fill:#00b2a1; }
figure.diagram .schk { font-size:10px; fill:#2a2a3a; }
figure.diagram .stiny { font-size:9px; fill:#777; }
figure.diagram .march { stroke:#0099ff; stroke-width:1.4; fill:none; stroke-dasharray:3 6;
         animation:stc-march 2.6s linear infinite; }
@keyframes stc-march { to { stroke-dashoffset:-9; } }
figure.diagram .glow { stroke:#0099ff; stroke-width:6; fill:none; stroke-linecap:round;
        animation:stc-glowp 2.6s ease-in-out infinite alternate; }
figure.diagram .marchc { stroke:#7261e0; stroke-width:1.4; fill:none; stroke-dasharray:3 6;
          animation:stc-march 2.6s linear infinite; }
figure.diagram .glowc { stroke:#a99df0; stroke-width:6; fill:none; stroke-linecap:round;
         animation:stc-glowp 2.6s ease-in-out infinite alternate; }
@keyframes stc-glowp { from { opacity:.09; } to { opacity:.32; } }
figure.diagram .sails { animation:stc-sails 6s linear infinite; transform-origin:center; transform-box:fill-box; }
@keyframes stc-sails { to { transform:rotate(360deg); } }
figure.diagram .windg { animation:stc-windflow 1.1s linear infinite; }
figure.diagram .windg path { stroke:#bbb5a0; stroke-width:1.6; fill:none; stroke-dasharray:10 8;
              stroke-linecap:round; animation:inherit; }
@keyframes stc-windflow { to { stroke-dashoffset:-18; } }
figure.diagram .millgrow { transform-box:fill-box; transform-origin:50% 100%;
            animation:stc-millgrow 14s ease-in-out infinite; }
@keyframes stc-millgrow { 0% { transform:scale(.81); opacity:0; } 6% { opacity:1; }
  74% { transform:scale(1); } 96% { transform:scale(1); opacity:1; } 100% { transform:scale(1); opacity:0; } }
figure.diagram .adopt { animation:stc-adopt 14s linear infinite; }
@keyframes stc-adopt { 0%,20% { fill:#2a2a3a; } 24% { fill:#0099ff; }
  78% { fill:#0099ff; } 88%,100% { fill:#2a2a3a; } }
figure.diagram .flick { animation:stc-flick 14s linear infinite; }
@keyframes stc-flick { 0% { fill:#2a2a3a; opacity:1; } 4% { fill:#0099ff; }
  9% { fill:#0099ff; opacity:1; } 13% { opacity:.45; } 16%,100% { fill:#2a2a3a; opacity:1; } }
figure.diagram .draw { stroke-dasharray:800; stroke-dashoffset:800; animation:stc-draw 1.8s ease-out .5s forwards; }
@keyframes stc-draw { to { stroke-dashoffset:0; } }
/* the watcher's pupil rests centered, then darts toward each deviant dot just
   AFTER it turns blue (dots emerge at 4%/37.6%/70.4% of the shared 14s cycle)
   and holds its gaze while the dot fades; eye at (490,70), dots at (387,125),
   (570,174), (464,196). restored from the community-site v1 (jul-28 polish). */
figure.diagram .pupil { animation:stc-pupil 14s ease-in-out infinite; }
@keyframes stc-pupil {
  0%, 5% { transform:translate(0,0); }
  9%, 17% { transform:translate(-5px,1px); }
  22%, 38% { transform:translate(0,0); }
  42%, 50% { transform:translate(4.5px,1.2px); }
  55%, 71% { transform:translate(0,0); }
  75%, 83% { transform:translate(-1.5px,1.6px); }
  88%, 100% { transform:translate(0,0); } }
/* "wide" hero diagrams break out of the text column on large screens,
   like physical-evals' fullwidth hero figure */
@media (min-width: 1000px) {
  figure.diagram.wide {
    width: 940px;
    max-width: none;
    margin-left: calc((100% - 940px) / 2);
  }
}
@media (prefers-reduced-motion: reduce) {
  figure.diagram .march, figure.diagram .sails, figure.diagram .windg, figure.diagram .windg path, figure.diagram .millgrow, figure.diagram .adopt, figure.diagram .flick, figure.diagram .glow,
  figure.diagram .marchc, figure.diagram .glowc, figure.diagram .pupil { animation:none; }
  figure.diagram .glow, figure.diagram .glowc { opacity:.18; }
  figure.diagram .draw { animation:none; stroke-dashoffset:0; }
  figure.diagram .pkt { display:none; } /* SMIL movers can't be stopped by CSS -- hide them */
}
/* clickable project names inside the market-map figure */
figure.diagram text a { text-decoration: underline; text-underline-offset: 2px; text-decoration-thickness: from-font; font-weight: 600; cursor: pointer; }
figure.diagram text a:hover { fill: #0099ff; }

/* the companion-piece note under the intro: same words, quieter */
p:has(> .companion) { font-size: .82em; color: var(--muted, #777); line-height: 1.5; }

/* breathing room between the last paragraph and the byline: this post has a single hr, before the colophon */
article hr { margin: 4rem 0 2rem; }
