/* GENERATED by graphics/build.mjs from @mosaic/technical-graphics tokens.css — do not edit. */
[data-md-color-scheme="default"] {
  color-scheme: light dark;
  --m-unit: 8px;
  --m-font: ui-sans-serif, -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", sans-serif;
  --m-mono: ui-monospace, "SFMono-Regular", Consolas, monospace;
  --m-bg: #f7f8fa;
  --m-surface: #ffffff;
  --m-surface-raised: #fbfcfd;
  --m-text: #16191d;
  --m-muted: #66707d;
  --m-subtle: #8a94a2;
  --m-line: #dfe3e8;
  --m-line-strong: #bdc5cf;
  --m-blue: #2f6feb;
  --m-blue-soft: #eaf1ff;
  --m-green: #20845b;
  --m-green-soft: #e5f5ed;
  --m-violet: #7656d6;
  --m-violet-soft: #f0ecff;
  --m-sand: #a86f12;
  --m-sand-soft: #fbf0d8;
  --m-coral: #bd4c5d;
  --m-coral-soft: #fde9ec;
  --m-radius-sm: 8px;
  --m-radius: 12px;
  --m-radius-lg: 16px;
  --m-stroke: 1px;
  --m-stroke-strong: 1.5px;
  --m-shadow: 0 1px 2px rgb(16 24 40 / 5%), 0 8px 24px rgb(16 24 40 / 5%);
}
[data-md-color-scheme="slate"] {
  --m-bg: #111418; --m-surface: #191d22; --m-surface-raised: #20252b;
  --m-text: #f2f4f7; --m-muted: #aab2bd; --m-subtle: #858f9c;
  --m-line: #343a43; --m-line-strong: #505967;
  --m-blue: #76a5ff; --m-blue-soft: #1d2a45; --m-green: #62c99a; --m-green-soft: #18372c;
  --m-violet: #ad94ff; --m-violet-soft: #2d2449; --m-sand: #e7b45d; --m-sand-soft: #3c301d;
  --m-coral: #f18a99; --m-coral-soft: #48252d; --m-shadow: none;
}
/* Material sets `.md-typeset figure { width: fit-content }`. Our SVGs carry only a
   viewBox, so their default intrinsic size is 300x150 (CSS spec) and the figure
   shrink-wraps to that instead of the content column. Force it full-width. */
.md-typeset .mosaic-fig { width: 100%; margin: 1.6em 0; }
.mosaic-fig svg,
.mosaic-fig img { display: block; width: 100%; height: auto; }

/* Wide single-row diagrams: below `min-width` the labels stop being legible, so
   scroll the figure rather than shrinking the type into nothing. */
.md-typeset .mosaic-fig--wide { overflow-x: auto; }
.mosaic-fig--wide svg { min-width: 880px; }

/* Portrait flowcharts. Stretching these to the column width scales them up —
   a 460x1392 chart would render nearly 3000px tall. Respect the SVG's own
   width attribute instead, capped by the container. */
.mosaic-fig--tall svg,
.mosaic-fig--tall img { width: auto; max-width: 100%; margin-inline: auto; }