markstream-solid 0.0.0-stage → 2.0.23

package/dist/index.px.css

@@ -0,0 +1,3279 @@
+/* Minimal, safe defaults to reduce flicker during frequent text updates */
+:is(.markstream-vue, .markstream-solid) pre[class^='language-'],
+:is(.markstream-vue, .markstream-solid) pre[class*=' language-'] {
+  /* Ensure code layout is stable */
+  white-space: pre;
+  overflow: auto;
+  -moz-tab-size: var(--markstream-code-tab-size, 4);
+    -o-tab-size: var(--markstream-code-tab-size, 4);
+       tab-size: var(--markstream-code-tab-size, 4);
+  font-variant-ligatures: none;
+  /* Isolate painting/layout to this block to avoid ancestor reflow jank */
+  contain: content;
+  /* Hint GPU compositing on WebKit/Blink to reduce paint flashing */
+  backface-visibility: hidden;
+  transform: translateZ(0);
+  -webkit-font-smoothing: antialiased;
+}
+:is(.markstream-vue, .markstream-solid) pre[class^='language-'] > code,
+:is(.markstream-vue, .markstream-solid) pre[class*=' language-'] > code {
+  display: block;
+}
+
+:is(.markstream-vue, .markstream-solid) pre[data-markstream-pre='1']:not(.markstream-pre--diff-preview) {
+  background: var(--markstream-code-fallback-bg, var(--markstream-code-theme-bg, var(--code-bg)));
+  color: var(--markstream-code-fallback-fg, var(--markstream-code-theme-fg, var(--code-fg)));
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--line-numbers {
+  position: relative;
+}
+
+:is(.markstream-vue, .markstream-solid) pre.code-pre-fallback[data-markstream-code-loading='1'] {
+  --markstream-pre-line-number-top: var(--markstream-code-padding-y, 8px);
+  --markstream-pre-line-number-left: 0px;
+  --markstream-pre-line-number-width: 2ch;
+  --markstream-pre-line-number-padding-left: 2ch;
+  --markstream-pre-line-number-padding-right: 1ch;
+  --markstream-pre-line-number-separator-width: 2px;
+  --markstream-code-padding-left: calc(2ch + 2ch + 1ch + 2px + 1ch);
+  box-sizing: border-box;
+  width: 100%;
+  margin: 0;
+  padding: var(--markstream-code-padding-y, 8px) var(--markstream-code-padding-x, 1ch);
+  padding-left: var(--markstream-code-padding-left);
+  overflow: auto;
+  border: 0;
+  border-radius: 0;
+  background: var(--markstream-code-fallback-bg, var(--markstream-code-theme-bg, var(--code-bg)));
+  color: var(--markstream-code-fallback-fg, var(--markstream-code-theme-fg, var(--code-fg)));
+  font-family: var(--markstream-code-font-family, \"SF Mono\", Monaco, Consolas, \"Ubuntu Mono\", \"Liberation Mono\", \"Courier New\", monospace);
+  font-size: var(--vscode-editor-font-size, 12px);
+  line-height: var(--vscode-editor-line-height, 18px);
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--line-numbers > .markstream-pre__line-numbers {
+  position: absolute;
+  top: var(--markstream-pre-line-number-top, 0);
+  left: var(--markstream-pre-line-number-left, 0);
+  box-sizing: content-box;
+  display: flex;
+  flex-direction: column;
+  align-items: flex-end;
+  width: var(--markstream-pre-line-number-width, 2ch);
+  min-width: var(--markstream-pre-line-number-width, 2ch);
+  padding-left: var(--markstream-pre-line-number-padding-left, 2ch);
+  padding-right: var(--markstream-pre-line-number-padding-right, 1ch);
+  border-right: var(--markstream-pre-line-number-separator-width, 2px) solid transparent;
+  color: var(--code-line-number);
+  font: inherit;
+  font-variant-numeric: tabular-nums;
+  line-height: inherit;
+  pointer-events: none;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+          user-select: none;
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--line-numbers:not(.markstream-pre--diff-preview):not(.code-pre-fallback) > .markstream-pre__code {
+  box-sizing: border-box;
+  min-width: 100%;
+  padding-left: var(--markstream-code-padding-left, 52px);
+  padding-right: var(--markstream-code-padding-x, 12px);
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--line-numbers > .markstream-pre__code--wrapped {
+  white-space: pre-wrap;
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--line-numbers > .markstream-pre__code--wrapped > .markstream-pre__logical-line {
+  position: relative;
+  display: block;
+  min-height: 1lh;
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--line-numbers > .markstream-pre__code--wrapped > .markstream-pre__logical-line::before {
+  position: absolute;
+  left: calc(-1 * var(--markstream-code-padding-left, 52px));
+  box-sizing: content-box;
+  width: var(--markstream-pre-line-number-width, 2ch);
+  padding-left: var(--markstream-pre-line-number-padding-left, 2ch);
+  color: var(--code-line-number);
+  font: inherit;
+  font-variant-numeric: tabular-nums;
+  line-height: inherit;
+  text-align: right;
+  white-space: pre;
+  content: attr(data-line-number);
+  pointer-events: none;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+          user-select: none;
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--line-numbers > .markstream-pre__line-numbers > .markstream-pre__line-number {
+  display: block;
+  min-height: 1lh;
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--line-numbers > .markstream-pre__line-numbers > .markstream-pre__line-numbers-text {
+  display: block;
+  min-height: 1lh;
+  text-align: right;
+  white-space: pre;
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview {
+  box-sizing: border-box;
+  /* The diff rows manage their own number-column padding, so the pre itself
+     must not add another left padding. `!important` so the loading-placeholder
+     rule (`pre[data-markstream-code-loading='1']`) cannot double-count it. */
+  padding-left: 0 !important;
+  padding-right: 0 !important;
+  width: 100%;
+
+  --markstream-pre-diff-gutter-marker-width: 4px;
+  --markstream-pre-diff-gutter-gap: 1ch;
+  --markstream-pre-diff-code-gap: 1ch;
+  --markstream-pre-diff-code-padding: 0px;
+  --markstream-diff-added-fg: var(--diff-added-fg, #2f8f68);
+  --markstream-diff-removed-fg: var(--diff-removed-fg, #c24141);
+  --markstream-diff-added-line-fill: var(--diff-added-bg, rgb(47 143 104 / 12%));
+  --markstream-diff-removed-line-fill: var(--diff-removed-bg, rgb(194 65 65 / 12%));
+  --markstream-diff-added-gutter: linear-gradient(
+    90deg,
+    var(--markstream-diff-added-fg) 0 var(--markstream-pre-diff-gutter-marker-width),
+    transparent var(--markstream-pre-diff-gutter-marker-width) 100%
+  );
+  --markstream-diff-removed-gutter: linear-gradient(
+    90deg,
+    var(--markstream-diff-removed-fg) 0 var(--markstream-pre-diff-gutter-marker-width),
+    transparent var(--markstream-pre-diff-gutter-marker-width) 100%
+  );
+  --markstream-pre-diff-line-number-width: 2ch;
+  --markstream-pre-diff-line-number-padding-left: 2ch;
+  --markstream-pre-diff-line-number-padding-right: 1ch;
+  --markstream-pre-diff-line-number-separator-width: 2px;
+  --markstream-pre-diff-pane-min-width: 225px;
+  --markstream-pre-diff-line-number-box-width: calc(
+    var(--markstream-pre-diff-line-number-padding-left)
+    + var(--markstream-pre-diff-line-number-width)
+    + var(--markstream-pre-diff-line-number-padding-right)
+    + var(--markstream-pre-diff-line-number-separator-width)
+  );
+  --markstream-pre-diff-line-number-bg: var(--markstream-diff-line-number-bg, transparent);
+  --markstream-pre-diff-line-number-gap-to-code: var(--markstream-pre-diff-code-gap);
+  --markstream-pre-diff-line-number-left: 0px;
+  --markstream-pre-diff-line-number-align: var(--markstream-diff-line-number-align, right);
+  --markstream-pre-diff-code-fill-left: calc(
+    var(--markstream-pre-diff-line-number-left)
+    + var(--markstream-pre-diff-line-number-box-width)
+  );
+  --markstream-pre-diff-code-left: calc(
+    var(--markstream-pre-diff-code-fill-left)
+    + var(--markstream-pre-diff-line-number-gap-to-code)
+    + var(--markstream-pre-diff-code-padding)
+  );
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview::-webkit-scrollbar {
+  width: 12px;
+  height: 12px;
+}
+
+:is(.markstream-vue, .markstream-solid) pre.code-pre-fallback.markstream-pre--diff-preview.markstream-pre--diff-inline:not(.is-wrap) {
+  scrollbar-width: none;
+}
+
+:is(.markstream-vue, .markstream-solid) pre.code-pre-fallback.markstream-pre--diff-preview.markstream-pre--diff-inline:not(.is-wrap)::-webkit-scrollbar {
+  width: 0;
+  height: 0;
+}
+
+:is(.markstream-vue, .markstream-solid) pre.is-wrap {
+  white-space: pre-wrap;
+  overflow-wrap: anywhere;
+  word-break: normal;
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview.markstream-pre--diff-inline {
+  --markstream-pre-diff-line-number-gap-to-code: var(--markstream-pre-diff-code-gap);
+  --markstream-pre-diff-line-number-left: 0px;
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview > .markstream-pre__diff-code {
+  display: grid;
+  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
+  font: inherit;
+  line-height: inherit;
+  min-width: 100%;
+  width: 100%;
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview.is-wrap > .markstream-pre__diff-code {
+  grid-template-columns: minmax(var(--markstream-pre-diff-pane-min-width, 225px), 1fr) minmax(var(--markstream-pre-diff-pane-min-width, 225px), 1fr);
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview.markstream-pre--diff-inline > .markstream-pre__diff-code {
+  grid-template-columns: minmax(0, 1fr);
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview.markstream-pre--diff-inline:not(.is-wrap) > .markstream-pre__diff-code {
+  grid-template-columns: minmax(100%, max-content);
+  width: 100%;
+  min-width: -moz-max-content;
+  min-width: max-content;
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview .markstream-pre__diff-pane {
+  min-width: 0;
+  overflow: hidden;
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview:not(.is-wrap):not(.markstream-pre--diff-inline) .markstream-pre__diff-pane {
+  overflow-x: auto;
+  overflow-y: hidden;
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview .markstream-pre__diff-pane-content {
+  display: block;
+  min-width: 100%;
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview:not(.is-wrap):not(.markstream-pre--diff-inline) .markstream-pre__diff-pane-content {
+  width: -moz-max-content;
+  width: max-content;
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview.markstream-pre--diff-inline:not(.is-wrap) .markstream-pre__diff-pane {
+  min-width: -moz-max-content;
+  min-width: max-content;
+  width: 100%;
+  overflow: visible;
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview .markstream-pre__diff-pane--modified {
+  --markstream-pre-diff-line-number-gap-to-code: var(--markstream-pre-diff-code-gap);
+  --markstream-pre-diff-line-number-left: 0px;
+  /* The finalized highlight surface separates its split columns with a clean
+     background gap (pierre's 1ch line paddings plus background-colored column
+     borders), not a colored 1px divider line. Keep the pre fallback visually
+     identical: drop the divider so the middle between the two columns reads
+     as a 2ch white gap. */
+  box-shadow: none;
+}
+
+/* Match the finalized highlight surface's 2ch white split divider: pierre's
+   split lines carry 1ch inline padding on each side of the code content. The
+   left pane mirrors the text's 1ch right padding toward the seam; the right
+   pane already spaces its text 1ch past the line-number gutter
+   (`--markstream-pre-diff-line-number-gap-to-code`), so no extra left padding
+   is added there — adding one would push the right column's content one `ch`
+   away from the line numbers compared with the highlight surface. */
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview:not(.markstream-pre--diff-inline) .markstream-pre__diff-pane--original .markstream-pre__diff-line:not(.markstream-pre__diff-line--collapsed) .markstream-pre__diff-content {
+  padding-right: 1ch;
+}
+
+/* Split view: the collapsed "N unmodified lines" pill must read as ONE
+   continuous pill spanning both columns (pierre's split separators meet at the
+   middle divider). The left pane extends its pill flush to its right edge and
+   the right pane starts flush at its own left edge, so the two halves abut
+   exactly at the column seam; the inner corners are squared so there is no
+   notch where they meet. */
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview:not(.markstream-pre--diff-inline) .markstream-pre__diff-pane--original .markstream-pre__diff-line--collapsed::before {
+  right: 0px;
+  border-top-right-radius: 0px;
+  border-bottom-right-radius: 0px;
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview:not(.markstream-pre--diff-inline) .markstream-pre__diff-pane--modified .markstream-pre__diff-line--collapsed::before {
+  left: 0px;
+  border-top-left-radius: 0px;
+  border-bottom-left-radius: 0px;
+}
+
+/* The modified (right) pane's collapsed row is only the empty half of the
+   continuous pill — the finalized surface renders the "N unmodified lines"
+   widget once on the original side. Hide the duplicated chevron/icon so the
+   right half stays clean (matches the highlight surface). */
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview:not(.markstream-pre--diff-inline) .markstream-pre__diff-pane--modified .markstream-pre__diff-line--collapsed > .markstream-pre__diff-collapsed-icon {
+  display: none;
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview .markstream-pre__diff-line {
+  position: relative;
+  display: block;
+  box-sizing: border-box;
+  width: 100%;
+  min-width: 100%;
+  min-height: var(
+    --markstream-pre-diff-synced-row-height,
+    var(--markstream-pre-diff-line-height, 18px)
+  );
+  padding-left: var(--markstream-pre-diff-code-left);
+  line-height: var(--markstream-pre-diff-line-height, 18px);
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview .markstream-pre__diff-line::before {
+  content: '';
+  position: absolute;
+  left: var(--markstream-pre-diff-code-fill-left);
+  right: 0;
+  top: 0;
+  height: var(
+    --markstream-pre-diff-synced-row-height,
+    var(--markstream-pre-diff-line-height, 18px)
+  );
+  z-index: 0;
+  pointer-events: none;
+  border-radius: 0;
+  background: transparent;
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview .markstream-pre__diff-line::after {
+  content: '';
+  position: absolute;
+  left: var(--markstream-pre-diff-line-number-left);
+  top: 0;
+  width: var(--markstream-pre-diff-line-number-box-width);
+  height: var(
+    --markstream-pre-diff-synced-row-height,
+    var(--markstream-pre-diff-line-height, 18px)
+  );
+  z-index: 0;
+  pointer-events: none;
+  background: var(--markstream-pre-diff-line-number-bg);
+  box-shadow: none;
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview .markstream-pre__diff-rail {
+  position: absolute;
+  z-index: 2;
+  top: 0;
+  left: 0;
+  height: var(
+    --markstream-pre-diff-synced-row-height,
+    var(--markstream-pre-diff-line-height, 18px)
+  );
+  width: var(--markstream-pre-diff-gutter-marker-width, 4px);
+  min-width: var(--markstream-pre-diff-gutter-marker-width, 4px);
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview .markstream-pre__diff-number {
+  position: absolute;
+  z-index: 1;
+  top: 0;
+  left: var(--markstream-pre-diff-line-number-left);
+  width: var(--markstream-pre-diff-line-number-width);
+  min-width: var(--markstream-pre-diff-line-number-width);
+  height: var(
+    --markstream-pre-diff-synced-row-height,
+    var(--markstream-pre-diff-line-height, 18px)
+  );
+  box-sizing: content-box;
+  background: var(--markstream-pre-diff-line-number-bg);
+  box-shadow: none;
+  padding-left: var(--markstream-pre-diff-line-number-padding-left, 2ch);
+  padding-right: var(--markstream-pre-diff-line-number-padding-right, 1ch);
+  border-right: var(--markstream-pre-diff-line-number-separator-width, 2px) solid var(--markstream-diff-editor-bg, var(--code-bg));
+  color: var(--code-line-number);
+  font-variant-numeric: tabular-nums;
+  line-height: var(--markstream-pre-diff-line-height, 18px);
+  text-align: var(--markstream-pre-diff-line-number-align, right);
+  -webkit-user-select: none;
+     -moz-user-select: none;
+          user-select: none;
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview .markstream-pre__diff-line--added > .markstream-pre__diff-number {
+  background: var(--markstream-diff-added-number-fill, var(--markstream-diff-added-line-fill, transparent));
+  color: var(--markstream-diff-added-fg, var(--code-line-number));
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview .markstream-pre__diff-line--removed > .markstream-pre__diff-number {
+  background: var(--markstream-diff-removed-number-fill, var(--markstream-diff-removed-line-fill, transparent));
+  color: var(--markstream-diff-removed-fg, var(--code-line-number));
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview .markstream-pre__diff-content {
+  position: relative;
+  z-index: 1;
+  display: block;
+  width: -moz-max-content;
+  width: max-content;
+  min-width: 100%;
+  line-height: var(--markstream-pre-diff-line-height, 18px);
+  white-space: inherit;
+  overflow-wrap: normal;
+  word-break: normal;
+  line-break: auto;
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview.is-wrap .markstream-pre__diff-content {
+  box-sizing: border-box;
+  width: auto;
+  min-width: 0;
+  padding-right: 1ch;
+  overflow-wrap: anywhere;
+  word-break: normal;
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview .markstream-pre__diff-content-inner {
+  white-space: inherit;
+  overflow-wrap: inherit;
+  word-break: inherit;
+  line-break: inherit;
+  -webkit-box-decoration-break: clone;
+  box-decoration-break: clone;
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview .markstream-pre__diff-line--hunk {
+  color: var(--markstream-diff-unchanged-fg, var(--code-line-number));
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview .markstream-pre__diff-line--hunk::before {
+  background: var(--markstream-diff-unchanged-bg, transparent);
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview .markstream-pre__diff-line--spacer::before {
+  background-image: linear-gradient(
+    -45deg,
+    color-mix(in srgb, currentColor 20%, transparent) 12.5%,
+    transparent 12.5%,
+    transparent 50%,
+    color-mix(in srgb, currentColor 20%, transparent) 50%,
+    color-mix(in srgb, currentColor 20%, transparent) 62.5%,
+    transparent 62.5%,
+    transparent 100%
+  );
+  background-size: 10px 10px;
+  opacity: 0.38;
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview .markstream-pre__diff-line--metadata {
+  color: var(--markstream-diff-metadata-fg, var(--code-line-number));
+  background: var(--markstream-diff-metadata-bg, var(--code-bg));
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview .markstream-pre__diff-line--metadata::after,
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview .markstream-pre__diff-line--metadata > .markstream-pre__diff-rail,
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview .markstream-pre__diff-line--metadata > .markstream-pre__diff-number {
+  display: none;
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview.markstream-pre--diff-inline .markstream-pre__diff-line--metadata + .markstream-pre__diff-line--metadata {
+  margin-top: calc(-1 * var(--markstream-pre-diff-line-height, 18px));
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview .markstream-pre__diff-line--spacer::after,
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview .markstream-pre__diff-line--spacer > .markstream-pre__diff-rail,
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview .markstream-pre__diff-line--spacer > .markstream-pre__diff-number,
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview .markstream-pre__diff-line--spacer > .markstream-pre__diff-content {
+  display: none;
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview.markstream-pre--diff-collapsed:not(.code-pre-fallback) {
+  height: auto !important;
+  min-height: 0 !important;
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview .markstream-pre__diff-line--collapsed {
+  /* The finalized highlight surface renders its "N unmodified lines" widget as a
+     32px pill separated from the surrounding diff rows by an 8px gap on each
+     side (pierre's `line-info` separator with its 8px `--diffs-gap-fallback`).
+     The first/last collapsed rows drop the outer gap (pierre's
+     `data-separator-first/last` rules): a terminal row reuses the pre's own
+     8px bottom padding so the pill sits at the bottom of the pre. */
+  min-height: calc(
+    var(--markstream-pre-diff-collapsed-row-height, 32px)
+    + var(--markstream-pre-diff-collapsed-row-gap-top, var(--markstream-pre-diff-collapsed-row-gap, 8px))
+    + var(--markstream-pre-diff-collapsed-row-gap-bottom, var(--markstream-pre-diff-collapsed-row-gap, 8px))
+  );
+  padding:
+    var(--markstream-pre-diff-collapsed-row-gap-top, var(--markstream-pre-diff-collapsed-row-gap, 8px))
+    0
+    var(--markstream-pre-diff-collapsed-row-gap-bottom, var(--markstream-pre-diff-collapsed-row-gap, 8px));
+  /* Match the finalized separator's text: pierre paints "N unmodified lines" in
+     its header/sans-serif font in the muted `--diffs-fg-number` gray
+     (`color-mix(in lab, fg 65%, bg)`), not the code's monospace foreground. */
+  color: color-mix(
+    in lab,
+    var(--markstream-code-theme-fg, var(--markstream-code-fallback-fg, var(--markstream-pre-resolved-theme-fg, var(--code-fg, #000)))) 65%,
+    var(--markstream-code-theme-bg, var(--markstream-code-fallback-bg, var(--markstream-pre-resolved-theme-bg, var(--code-bg, #fff))))
+  );
+  font-family: var(
+    --markstream-pre-diff-header-font,
+    system-ui,
+    -apple-system,
+    'Segoe UI',
+    Roboto,
+    'Helvetica Neue',
+    'Noto Sans',
+    'Liberation Sans',
+    Arial,
+    sans-serif
+  );
+  line-height: var(--markstream-pre-diff-collapsed-row-height, 32px);
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview .markstream-pre__diff-line--collapsed::before {
+  top: var(--markstream-pre-diff-collapsed-row-gap-top, var(--markstream-pre-diff-collapsed-row-gap, 8px));
+  left: 8px;
+  right: 8px;
+  height: var(--markstream-pre-diff-collapsed-row-height, 32px);
+  border-radius: 6px;
+  background: var(--markstream-diff-unchanged-bg, rgb(0 0 0 / 4%));
+}
+
+/* First collapsed region: flush against the top diff rows (pierre's
+   `data-separator-first` clears the leading margin). */
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview .markstream-pre__diff-line--collapsed-first {
+  --markstream-pre-diff-collapsed-row-gap-top: 0px;
+}
+
+/* Terminal collapsed region: the pill sits at the bottom of the pre and the
+   pre's own 8px bottom padding provides the gap (pierre's
+   `data-separator-last` clears the trailing margin). */
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview .markstream-pre__diff-line--collapsed-last {
+  --markstream-pre-diff-collapsed-row-gap-bottom: 0px;
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview .markstream-pre__diff-line--collapsed::after,
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview .markstream-pre__diff-line--collapsed > .markstream-pre__diff-rail,
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview .markstream-pre__diff-line--collapsed > .markstream-pre__diff-number {
+  display: none;
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview .markstream-pre__diff-line--collapsed > .markstream-pre__diff-content {
+  width: 100%;
+  min-width: 0;
+  /* Match the finalized separator's text offset: pierre's `line-info` pill
+     sits 8px from the code-area left (`padding-inline: 8px`), the text
+     follows a 34px expand-button column, and the content itself carries
+     `padding: 0 1ch` (8px + 34px + 1ch). */
+  padding-left: calc(8px + 34px + 1ch);
+  line-height: var(--markstream-pre-diff-collapsed-row-height, 32px);
+}
+
+/* Mirror pierre's `diffs-icon-expand` chevron occupying the 34px column left
+   of the "N unmodified lines" text, so the fallback pill matches the
+   finalized separator (same color, same position, non-interactive). */
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview .markstream-pre__diff-line--collapsed > .markstream-pre__diff-collapsed-icon {
+  position: absolute;
+  left: 8px;
+  top: var(--markstream-pre-diff-collapsed-row-gap-top, var(--markstream-pre-diff-collapsed-row-gap, 8px));
+  width: 34px;
+  height: var(--markstream-pre-diff-collapsed-row-height, 32px);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: inherit;
+  pointer-events: none;
+
+  & svg {
+    fill: currentColor;
+    flex: none;
+  }
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview .markstream-pre__diff-line--added::before {
+  background: var(--markstream-diff-added-line-fill, transparent);
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview .markstream-pre__diff-line--removed::before {
+  background: var(--markstream-diff-removed-line-fill, transparent);
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview .markstream-pre__diff-line--added > .markstream-pre__diff-rail {
+  background: var(--markstream-diff-added-gutter, currentColor);
+}
+
+:is(.markstream-vue, .markstream-solid) pre.markstream-pre--diff-preview .markstream-pre__diff-line--removed > .markstream-pre__diff-rail {
+  background: var(--markstream-diff-removed-gutter, currentColor);
+}
+
+/* Keyboard accessibility: visible focus when scroll container is focused */
+:is(.markstream-vue, .markstream-solid) pre[class^='language-']:focus,
+:is(.markstream-vue, .markstream-solid) pre[class*=' language-']:focus {
+  outline: var(--ms-focus-ring-width) solid var(--focus-ring);
+  outline-offset: var(--ms-focus-ring-offset);
+}
+:is(.markstream-vue, .markstream-solid) {
+
+  /* Base tokens — self-contained defaults.
+   * Override --ms-* directly to customise (e.g. .markstream-vue { --ms-foreground: ... }). */
+  --ms-background:              0 0% 100%;
+  --ms-foreground:              0 0% 10%;
+
+  --ms-muted:                   0 0% 96.5%;
+  --ms-muted-foreground:        0 0% 43%;
+
+  --ms-secondary:               0 0% 93.5%;
+  --ms-secondary-foreground:    0 0% 10%;
+
+  --ms-accent:                  0 0% 91%;
+  --ms-accent-foreground:       0 0% 10%;
+
+  --ms-primary:                 0 0% 10%;
+  --ms-primary-foreground:      0 0% 100%;
+
+  --ms-destructive:             0 62% 52%;
+  --ms-destructive-foreground:  0 0% 100%;
+
+  --ms-border:                  0 0% 87%;
+  --ms-ring:                    0 0% 10%;
+
+  --ms-popover:                 0 0% 100%;
+  --ms-popover-foreground:      0 0% 10%;
+
+  --ms-radius:                  8px;
+
+  /* Extension: markdown-specific, no shadcn collision
+   * Functional colors: unified sat ~58-64%, lightness tuned for
+   * equal visual weight on neutral canvas.
+   * Highlight & warning use dark foreground (light bg). */
+  --ms-info:                    215 60% 50%;
+  --ms-info-foreground:         0 0% 100%;
+
+  --ms-success:                 152 56% 39%;
+  --ms-success-foreground:      0 0% 100%;
+
+  --ms-warning:                 38 64% 46%;
+  --ms-warning-foreground:      0 0% 9%;
+
+  --ms-diff-added:              152 50% 36%;
+  --ms-diff-removed:            0 58% 48%;
+
+  --ms-highlight:               50 60% 72%;
+  --ms-highlight-foreground:    0 0% 0%;
+
+  --ms-font-sans:               ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
+  --ms-font-mono:               ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;
+}
+
+.dark :is(.markstream-vue, .markstream-solid),
+:is(.markstream-vue, .markstream-solid).dark {
+
+  /* Dark defaults
+   * Neutral steps: bg 7 → muted 12 → secondary 16 → border 20 → accent 24
+   * Ensures each surface level is visually distinguishable. */
+  --ms-background:              0 0% 7%;
+  --ms-foreground:              0 0% 93%;
+
+  --ms-muted:                   0 0% 12%;
+  --ms-muted-foreground:        0 0% 60%;
+
+  --ms-secondary:               0 0% 16%;
+  --ms-secondary-foreground:    0 0% 93%;
+
+  --ms-accent:                  0 0% 24%;
+  --ms-accent-foreground:       0 0% 93%;
+
+  --ms-primary:                 0 0% 93%;
+  --ms-primary-foreground:      0 0% 10%;
+
+  --ms-destructive:             0 60% 50%;
+  --ms-destructive-foreground:  0 0% 93%;
+
+  --ms-border:                  0 0% 20%;
+  --ms-ring:                    0 0% 80%;
+
+  --ms-popover:                 0 0% 9%;
+  --ms-popover-foreground:      0 0% 93%;
+
+  /* Extension: dark overrides — lightness lifted for readability */
+  --ms-info:                    215 55% 62%;
+  --ms-info-foreground:         0 0% 100%;
+
+  --ms-success:                 152 48% 55%;
+  --ms-success-foreground:      0 0% 100%;
+
+  --ms-warning:                 32 65% 58%;
+  --ms-warning-foreground:      0 0% 9%;
+
+  --ms-diff-added:              152 42% 60%;
+  --ms-diff-removed:            0 58% 58%;
+
+  --ms-highlight:               48 65% 50%;
+  --ms-highlight-foreground:    0 0% 0%;
+
+  /* Shadows: use black in dark mode (foreground is bright, would glow) */
+  --ms-shadow-subtle: 0 1px 3px 0 hsl(0 0% 0% / 0.25);
+  --ms-shadow-popover: 0 4px 6px -1px hsl(0 0% 0% / 0.2),
+                       0 2px 4px -2px hsl(0 0% 0% / 0.15);
+  --ms-shadow-modal: 0 10px 15px -3px hsl(0 0% 0% / 0.5),
+                     0 4px 6px -4px hsl(0 0% 0% / 0.4);
+  --ms-shadow-preview: 0 10px 40px hsl(0 0% 0% / 0.6);
+
+  /* Tooltip: subtle lift from black, muted text */
+  --tooltip-bg:                 hsl(0 0% 12%);
+  --tooltip-fg:                 hsl(0 0% 72%);
+
+  /* Code block defaults stay stable across renderers; explicit editor themes
+   * can still paint the enhanced surface. */
+  --code-bg:                    #111827;
+  --code-header-bg:             hsl(var(--ms-muted));
+
+  /* Admonition: stronger tint on dark backgrounds */
+  --admonition-note-header-bg:  color-mix(in srgb, hsl(var(--ms-info)) 12%, transparent);
+  --admonition-tip-header-bg:   color-mix(in srgb, hsl(var(--ms-success)) 12%, transparent);
+  --admonition-warn-header-bg:  color-mix(in srgb, hsl(var(--ms-warning)) 12%, transparent);
+  --admonition-danger-header-bg: color-mix(in srgb, hsl(var(--ms-destructive)) 12%, transparent);
+}
+
+:is(.markstream-vue, .markstream-solid) {
+
+  /* ── Base typography (inherited by all children) ── */
+  font-family: var(--ms-font-sans);
+  font-size: var(--ms-text-body);
+  line-height: var(--ms-leading-body);
+
+  /* ── Inline code ── */
+  --inline-code-bg:             hsl(var(--ms-secondary));
+  --inline-code-fg:             hsl(var(--ms-foreground) / 0.75);
+  --inline-code-border:         hsl(var(--ms-border) / 0.9);
+
+  /* ── Code block ── */
+  --code-bg:                    #fff;
+  --code-fg:                    hsl(var(--ms-foreground));
+  --code-border:                hsl(var(--ms-border));
+  --code-header-bg:             hsl(var(--ms-secondary));
+  --code-selection-bg:          hsl(var(--ms-accent) / 0.3);
+  --code-line-number:           hsl(var(--ms-muted-foreground));
+  --markstream-code-line-number-align: right;
+
+  /* ── Code block actions ── */
+  --code-action-fg:             hsl(var(--ms-muted-foreground));
+  --code-action-hover-bg:       hsl(var(--ms-accent));
+  --code-action-hover-fg:       hsl(var(--ms-accent-foreground));
+  --code-action-active-bg:      hsl(var(--ms-primary));
+  --code-action-active-fg:      hsl(var(--ms-primary-foreground));
+
+  /* ── Diff ── */
+  --diff-added-fg:              hsl(var(--ms-diff-added));
+  --diff-removed-fg:            hsl(var(--ms-diff-removed));
+  --diff-added-bg:              hsl(var(--ms-diff-added) / 0.1);
+  --diff-added-inline-bg:       hsl(var(--ms-diff-added) / 0.2);
+  --diff-removed-bg:            hsl(var(--ms-diff-removed) / 0.1);
+  --diff-removed-inline-bg:     hsl(var(--ms-diff-removed) / 0.2);
+
+  /* ── Blockquote ── */
+  --blockquote-border:          hsl(var(--ms-muted-foreground) / 0.2);
+
+  /* ── Admonition ── */
+  --admonition-bg:              hsl(var(--ms-muted));
+  --admonition-border:          hsl(var(--ms-border));
+  --admonition-fg:              hsl(var(--ms-foreground));
+  --admonition-muted:           hsl(var(--ms-muted-foreground));
+  --admonition-header-bg:       hsl(var(--ms-muted) / 0.5);
+  --admonition-note:            hsl(var(--ms-info));
+  --admonition-tip:             hsl(var(--ms-success));
+  --admonition-warning:         hsl(var(--ms-warning));
+  --admonition-danger:          hsl(var(--ms-destructive));
+  --admonition-note-header-bg:  color-mix(in srgb, hsl(var(--ms-info)) 6%, transparent);
+  --admonition-tip-header-bg:   color-mix(in srgb, hsl(var(--ms-success)) 6%, transparent);
+  --admonition-warn-header-bg:  color-mix(in srgb, hsl(var(--ms-warning)) 6%, transparent);
+  --admonition-danger-header-bg: color-mix(in srgb, hsl(var(--ms-destructive)) 6%, transparent);
+
+  /* ── Table ── */
+  --table-border:               hsl(var(--ms-border));
+  --table-header-bg:            hsl(var(--ms-muted));
+
+  /* ── Link ── */
+  --link-color:                 hsl(var(--ms-info));
+
+  /* ── List ── */
+  --list-marker:                hsl(var(--ms-muted-foreground) / 0.5);
+  --list-counter-marker:        hsl(var(--ms-muted-foreground));
+
+  /* ── Thematic break (HR) ── */
+  --hr-border:                  hsl(var(--ms-border));
+
+  /* ── Highlight ── */
+  --highlight-bg:               hsl(var(--ms-highlight));
+
+  /* ── Footnote ── */
+  --footnote-border:            hsl(var(--ms-border));
+
+  /* ── Tooltip ── */
+  --tooltip-bg:                 hsl(0 0% 18%);
+  --tooltip-fg:                 hsl(0 0% 88%);
+  --tooltip-border:             hsl(var(--ms-border));
+
+  /* ── Modal ── */
+  --modal-overlay:              hsl(0 0% 0% / 0.7);
+  --modal-bg:                   hsl(var(--ms-popover));
+  --modal-fg:                   hsl(var(--ms-popover-foreground));
+
+  /* ── Diagram containers (Mermaid / D2 / Infographic) ── */
+  --diagram-bg:                 hsl(var(--ms-muted));
+  --diagram-border:             hsl(var(--ms-border));
+  --diagram-header-bg:          hsl(var(--ms-muted));
+
+  /* ── Loading states ── */
+  --loading-spinner:            hsl(var(--ms-muted-foreground));
+  --loading-shimmer:            hsl(var(--ms-muted) / 0.5);
+
+  /* ── Image ── */
+  --image-placeholder-bg:       hsl(var(--ms-muted));
+
+  /* ── Focus ring ── */
+  --focus-ring:                 hsl(var(--ms-ring));
+
+  /* =======================================================================
+     Layer 2b: Spacing, Shadow, Animation, Border, Size Tokens
+     These are non-color tokens for layout theming and density control.
+     ======================================================================= */
+
+  /* ── Spacing scale ── */
+  --ms-space-1: 4px;
+  --ms-space-1_5: 6px;
+  --ms-space-2: 8px;
+  --ms-space-2_5: 10px;
+  --ms-space-3: 12px;
+  --ms-space-4: 16px;
+  --ms-space-5: 20px;
+  --ms-space-6: 24px;
+  --ms-space-8: 32px;
+  --ms-space-12: 48px;
+
+  /* ── Document flow spacing ── */
+  --ms-flow-paragraph-y: 1.5em;
+  --ms-flow-list-y: 1em;
+  --ms-flow-list-item-y: 0.25em;
+  --ms-flow-list-indent: calc(13 / 8 * 1em);
+  --ms-flow-list-indent-mobile: calc(14 / 9 * 1em);
+  --ms-flow-table-y: 2em;
+  --ms-flow-table-cell: 0.5em 0.75em;
+  --ms-flow-blockquote-y: 1.25em;
+  --ms-flow-blockquote-indent: 1.25em;
+  --ms-flow-admonition-y: 1.25em;
+  --ms-flow-footnote-y: 0.5em;
+  --ms-flow-hr-y: 2.5em;
+  --ms-flow-diagram-y: 1.5em;
+  --ms-flow-codeblock-y: 1.5em;
+  --ms-flow-definition-term-mt: 0.75em;
+  --ms-flow-definition-desc-ml: 1.25em;
+  --ms-flow-definition-desc-mb: 0.5em;
+
+  /* ── Heading rhythm ── */
+  --ms-flow-heading-1-mt: 0;
+  --ms-flow-heading-1-mb: 1em;
+  --ms-flow-heading-2-mt: 2em;
+  --ms-flow-heading-2-mb: 0.75em;
+  --ms-flow-heading-3-mt: 1.5em;
+  --ms-flow-heading-3-mb: 0.6em;
+  --ms-flow-heading-4-mt: 1.25em;
+  --ms-flow-heading-4-mb: 0.4em;
+  --ms-flow-heading-5-mt: 1em;
+  --ms-flow-heading-5-mb: 0.25em;
+  --ms-flow-heading-6-mt: 1em;
+  --ms-flow-heading-6-mb: 0.25em;
+
+  /* ── Typography ── */
+  --ms-text-body: 16px;
+  --ms-leading-body: 1.75;
+  --ms-text-h1: 36px;
+  --ms-text-h2: 24px;
+  --ms-text-h3: 20px;
+  --ms-text-h4: 16px;
+  --ms-text-h5: 16px;
+  --ms-text-h6: 16px;
+  --ms-leading-h1: 1.2;
+  --ms-leading-h2: 1.35;
+  --ms-leading-h3: 1.5;
+  --ms-weight-h1: 700;
+  --ms-weight-h2: 600;
+  --ms-weight-h3: 600;
+  --ms-weight-h4: 600;
+  --ms-text-label: 12px;
+  --ms-action-btn-padding: 6px;
+  --ms-action-btn-icon: 14px;
+
+  /* ── Panel insets & layout gaps ── */
+  --ms-inset-panel-x: 10px;
+  --ms-inset-panel-y: 6px;
+  --ms-inset-panel-body-sm: 8px;
+  --ms-inset-panel-body: 16px;
+  --ms-inset-admonition-body-top: 8px;
+  --ms-inset-admonition-body-bottom: 12px;
+  --ms-gap-header: var(--ms-space-4);
+  --ms-gap-header-main: var(--ms-space-2_5);
+  --ms-gap-header-actions: var(--ms-space-2);
+
+  /* ── Shadows ── */
+  --ms-shadow-subtle: 0 1px 3px 0 hsl(var(--ms-foreground) / 0.06);
+  --ms-shadow-popover: 0 4px 6px -1px hsl(var(--ms-foreground) / 0.1),
+                       0 2px 4px -2px hsl(var(--ms-foreground) / 0.1);
+  --ms-shadow-modal: 0 10px 15px -3px hsl(var(--ms-foreground) / 0.1),
+                     0 4px 6px -4px hsl(var(--ms-foreground) / 0.1);
+  --ms-shadow-preview: 0 10px 40px hsl(var(--ms-foreground) / 0.25);
+
+  /* ── Animation ── */
+  --ms-duration-fast: 120ms;
+  --ms-duration-standard: 180ms;
+  --ms-duration-overlay: 200ms;
+  --ms-duration-emphasis: 220ms;
+  --ms-duration-slow: 300ms;
+  --ms-duration-stream: 280ms;
+  --ms-ease-linear: linear;
+  --ms-ease-standard: ease;
+  --ms-ease-out: ease-out;
+  --ms-ease-in-out: ease-in-out;
+  --ms-ease-spring: cubic-bezier(.16, 1, .3, 1);
+
+  /* ── Border & focus ── */
+  --ms-border-width: 1px;
+  --ms-border-width-strong: 4px;
+  --ms-focus-ring-width: 2px;
+  --ms-focus-ring-offset: 2px;
+
+  /* ── Container sizes ── */
+  --ms-size-diagram-min-height: 360px;
+  --ms-size-code-max-height: 500px;
+  --ms-size-image-max-width: 384px;
+  --ms-size-image-min-width: 128px;
+  --ms-size-image-min-height: 1.5em;
+  --ms-size-math-min-height: 40px;
+  --ms-size-skeleton-min-height: 120px;
+}
+
+/*
+ * Keep button defaults minimal, but don't override Tailwind utilities.
+ * Use :where() to keep specificity low so `.markstream-solid .<utility>` wins.
+ */
+:where(.markstream-solid) button {
+  appearance: none;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  background: transparent;
+  border: 0;
+  font: inherit;
+  color: inherit;
+}
+
+markstream-solid {
+  display: block;
+  width: 100%;
+}
+
+.markstream-solid {color:inherit;word-break:break-word;position:relative;}
+
+.markstream-solid.markdown-renderer {
+  contain: layout;
+  content-visibility: auto;
+  contain-intrinsic-size: 800px 0;
+}
+
+.markstream-solid.virtualized {
+  content-visibility: visible;
+  contain-intrinsic-size: auto;
+}
+
+.markstream-solid > :first-child {
+  margin-top: 0;
+}
+
+.markstream-solid > :last-child {
+  margin-bottom: 0;
+}
+
+.markstream-solid .node-slot,
+.markstream-solid .node-content {
+  width: 100%;
+}
+
+.markstream-solid markstream-solid-blockquote-node,
+.markstream-solid markstream-solid-paragraph-node {
+  display: flow-root;
+  width: 100%;
+}
+
+.markstream-solid markstream-solid-nested-renderer,
+.markstream-solid markstream-solid-node-outlet,
+.markstream-solid markstream-solid-image-node {
+  display: contents;
+}
+
+.markstream-solid .node-placeholder {
+  position: relative;
+  overflow: hidden;
+  width: 100%;
+  min-height: 16px;
+  margin: 4px 0;
+  border-radius: 8px;
+  background: rgba(148, 163, 184, 0.18);
+}
+
+.markstream-solid .node-placeholder::before {
+  content: '';
+  position: absolute;
+  inset-block: 0;
+  left: -200%;
+  width: 500%;
+  background: linear-gradient(90deg, rgba(148, 163, 184, 0.18), rgba(148, 163, 184, 0.05), rgba(148, 163, 184, 0.18));
+  background-size: 40% 100%;
+  animation: node-placeholder-shimmer 1.1s ease-in-out infinite;
+}
+
+.markstream-solid .node-spacer {
+  width: 100%;
+}
+
+.markstream-solid .typewriter-node,
+.markstream-solid .fade-node {
+  opacity: 0;
+  animation: typewriter-fade var(--fade-duration, var(--typewriter-fade-duration, 280ms)) var(--fade-ease, var(--typewriter-fade-ease, cubic-bezier(0.33, 0, 0.67, 1))) both;
+}
+
+.markstream-solid .markstream-solid-text-node {
+  display: inline;
+  font-weight: inherit;
+  vertical-align: baseline;
+  white-space: pre-wrap;
+  overflow-wrap: break-word;
+}
+
+.markstream-solid .markstream-solid-text--centered {
+  display: inline-flex;
+  justify-content: center;
+  width: 100%;
+}
+
+.markstream-solid .markstream-solid-text__stream-delta {
+  animation-duration: var(--stream-update-fade-duration, var(--fade-duration, var(--typewriter-fade-duration, 280ms)));
+  animation-timing-function: var(--stream-update-fade-ease, var(--fade-ease, var(--typewriter-fade-ease, cubic-bezier(0.33, 0, 0.67, 1))));
+  animation-fill-mode: both;
+}
+
+.markstream-solid .markstream-solid-text__stream-delta--a {
+  animation-name: markstream-solid-text-stream-update-fade-a;
+}
+
+.markstream-solid .markstream-solid-text__stream-delta--b {
+  animation-name: markstream-solid-text-stream-update-fade-b;
+}
+
+.markstream-solid h1,
+.markstream-solid h2,
+.markstream-solid h3,
+.markstream-solid h4,
+.markstream-solid h5,
+.markstream-solid h6 {
+  margin: 28.8px 0 12.8px;
+  line-height: 1.15;
+  font-weight: 700;
+  letter-spacing: -0.02em;
+}
+
+.markstream-solid h1 {
+  font-size: clamp(32px, 4vw, 42.4px);
+}
+
+.markstream-solid h2 {
+  font-size: clamp(24.8px, 3vw, 32px);
+}
+
+.markstream-solid h3 {
+  font-size: 21.6px;
+}
+
+.markstream-solid h4 {
+  font-size: 18.4px;
+}
+
+.markstream-solid p,
+.markstream-solid ul,
+.markstream-solid ol,
+.markstream-solid blockquote,
+.markstream-solid pre,
+.markstream-solid table,
+.markstream-solid details,
+.markstream-solid dl {
+  margin: 16px 0;
+}
+
+.markstream-solid ul,
+.markstream-solid ol {
+  padding-left: 23.2px;
+}
+
+.markstream-solid li + li {
+  margin-top: 5.6px;
+}
+
+.markstream-solid li > p {
+  margin: 5.6px 0;
+}
+
+.markstream-solid a {
+  color: #2563eb;
+  text-decoration: underline;
+  text-underline-offset: 0.18em;
+}
+
+.markstream-solid .link-node {
+  color: var(--link-color, #0366d6);
+  text-decoration: none;
+}
+
+.markstream-solid .link-node:hover {
+  text-decoration: underline;
+  text-underline-offset: 3.2px;
+}
+
+.markstream-solid .link-loading {
+  display: inline-flex;
+  align-items: baseline;
+  gap: 6px;
+  color: var(--link-color, #0366d6);
+}
+
+.markstream-solid .link-loading .link-text-wrapper {
+  position: relative;
+  display: inline-flex;
+}
+
+.markstream-solid .link-loading .link-text {
+  position: relative;
+  z-index: 2;
+}
+
+.markstream-solid .link-loading-indicator {
+  position: absolute;
+  left: 0;
+  right: 0;
+  height: var(--underline-height, 2px);
+  bottom: var(--underline-bottom, -3px);
+  background: currentColor;
+  border-radius: 999px;
+  opacity: var(--underline-rest-opacity, 0.18);
+  animation: markstream-solid-link-loading-pulse var(--underline-duration, 1.6s) var(--underline-timing, ease-in-out) var(--underline-iteration, infinite);
+}
+
+@keyframes markstream-solid-link-loading-pulse {
+  0%, 100% { opacity: var(--underline-rest-opacity, 0.18); }
+  50% { opacity: var(--underline-opacity, 0.35); }
+}
+
+@keyframes markstream-solid-text-stream-update-fade-a {
+  from { opacity: 0; }
+  to { opacity: 1; }
+}
+
+@keyframes markstream-solid-text-stream-update-fade-b {
+  from { opacity: 0; }
+  to { opacity: 1; }
+}
+
+.markstream-solid .typewriter-cursor {
+  position: absolute;
+  left: 0;
+  top: 0;
+  display: inline-block;
+  width: 0.55em;
+  height: 1em;
+  margin-left: 0.08em;
+  vertical-align: -0.12em;
+  border-right: 2px solid currentColor;
+  pointer-events: none;
+  animation: typewriter-cursor-blink 1s steps(1, end) infinite;
+}
+
+@keyframes typewriter-cursor-blink {
+  0%, 49% {
+    opacity: 1;
+  }
+  50%, 100% {
+    opacity: 0;
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .markstream-solid .node-placeholder::before {
+    animation: none !important;
+  }
+
+  .markstream-solid .link-loading-indicator {
+    animation: none !important;
+    opacity: var(--underline-rest-opacity, 0.18);
+  }
+
+  .markstream-solid .markstream-solid-text__stream-delta {
+    animation: none !important;
+  }
+
+  .markstream-solid .typewriter-node,
+  .markstream-solid .fade-node {
+    animation: none !important;
+    opacity: 1;
+  }
+
+  .markstream-solid .typewriter-cursor {
+    animation: none !important;
+  }
+}
+
+.markstream-solid strong {
+  font-weight: 700;
+}
+
+.markstream-solid em {
+  font-style: italic;
+}
+
+.markstream-solid code {
+  padding: 1.92px 5.6px;
+  border-radius: 6.72px;
+  background: rgba(15, 23, 42, 0.06);
+  font:
+    500 0.92em/1.5 "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
+}
+
+.markstream-solid pre {
+  overflow: auto;
+  padding: 16px 17.6px;
+  border-radius: 16px;
+  background: var(--code-bg);
+  color: var(--code-fg);
+  box-shadow: inset 0 0 0 1px rgba(148, 163, 184, 0.14);
+}
+
+.markstream-solid pre code {
+  padding: 0;
+  background: transparent;
+  color: inherit;
+}
+
+.markstream-solid blockquote,
+.markstream-solid .blockquote-node {
+  display: flow-root;
+  font-weight: 400;
+  font-style: normal;
+  color: var(--blockquote-fg, hsl(var(--ms-muted-foreground)));
+  border-left: 3px solid var(--blockquote-border);
+  quotes: "\201C" "\201D" "\2018" "\2019";
+  margin-top: var(--ms-flow-blockquote-y);
+  margin-bottom: var(--ms-flow-blockquote-y);
+  padding-left: var(--ms-flow-blockquote-indent);
+  background: transparent;
+  border-radius: 0;
+}
+
+.markstream-solid .blockquote-node .markstream-solid,
+.markstream-solid blockquote .markstream-solid {
+  content-visibility: visible;
+  contain: content;
+  contain-intrinsic-size: 0 0;
+}
+
+.markstream-solid .blockquote-node > markstream-solid-nested-renderer,
+.markstream-solid blockquote > markstream-solid-nested-renderer,
+.markstream-solid .blockquote-node > markstream-solid-node-outlet,
+.markstream-solid blockquote > markstream-solid-node-outlet {
+  display: block;
+  width: 100%;
+}
+
+.markstream-solid hr {
+  margin: 24px 0;
+  border: 0;
+  border-top: 1px solid rgba(15, 23, 42, 0.12);
+}
+
+.markstream-solid table {
+  width: 100%;
+  border-collapse: collapse;
+  overflow: hidden;
+  border-radius: 16px;
+  box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.08);
+}
+
+.markstream-solid th,
+.markstream-solid td {
+  padding: 11.2px 12.8px;
+  border: 1px solid rgba(15, 23, 42, 0.08);
+  text-align: left;
+  vertical-align: top;
+  white-space: normal;
+  overflow-wrap: break-word;
+  word-break: normal;
+}
+
+.markstream-solid th {
+  position: relative;
+  background: rgba(15, 23, 42, 0.05);
+  font-weight: 700;
+}
+
+.markstream-solid .table-node__resize-handle {
+  position: absolute;
+  top: 0;
+  right: -4px;
+  bottom: 0;
+  z-index: 1;
+  width: 8px;
+  padding: 0;
+  border: 0;
+  background: transparent;
+  cursor: col-resize;
+  touch-action: none;
+}
+
+.markstream-solid .table-node__resize-handle::after {
+  content: '';
+  position: absolute;
+  top: 0.35em;
+  bottom: 0.35em;
+  left: 50%;
+  width: 2px;
+  border-radius: 9999px;
+  background: rgba(94, 104, 121, 0.55);
+  opacity: 0;
+  transform: translateX(-50%);
+  transition: opacity 0.12s ease;
+}
+
+.markstream-solid .table-node__resize-handle:hover::after,
+.markstream-solid .table-node__resize-handle:focus-visible::after {
+  opacity: 1;
+}
+
+.markstream-solid table .markstream-solid-text-node,
+.markstream-solid table code {
+  white-space: inherit;
+  overflow-wrap: inherit;
+  word-break: inherit;
+  max-width: none;
+}
+
+.markstream-solid img {
+  display: inline-block;
+  max-width: 100%;
+  height: auto;
+  border-radius: 14.4px;
+  vertical-align: middle;
+}
+
+.markstream-solid .image-node-container {
+  display: inline-block;
+  vertical-align: middle;
+  max-width: var(--ms-size-image-max-width);
+}
+
+.markstream-solid .image-node__img {
+  display: inline-block;
+  width: auto;
+  max-width: 100%;
+  height: auto;
+  border-radius: 12px;
+  vertical-align: middle;
+  transition: opacity var(--ms-duration-emphasis) var(--ms-ease-standard);
+}
+
+.markstream-solid .image-node__img.is-loading {
+  opacity: 0;
+}
+
+.markstream-solid .image-node__img.is-loaded {
+  opacity: 1;
+}
+
+.markstream-solid .image-placeholder {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  min-height: 128px;
+  max-width: var(--ms-size-image-max-width);
+  background: hsl(var(--ms-muted));
+  overflow: hidden;
+  vertical-align: middle;
+}
+
+.markstream-solid .image-shimmer {
+  position: relative;
+  overflow: hidden;
+  display: block;
+  width: 100%;
+  height: 100%;
+  min-height: 128px;
+  background: hsl(var(--ms-muted));
+}
+
+.markstream-solid .image-shimmer::before {
+  content: '';
+  position: absolute;
+  inset-block: 0;
+  left: -200%;
+  width: 300%;
+  background: linear-gradient(
+    90deg,
+    hsl(var(--ms-muted)) 0%,
+    hsl(var(--ms-muted-foreground) / 0.06) 50%,
+    hsl(var(--ms-muted)) 100%
+  );
+  background-position: 100% 0;
+  background-size: 66.6667% 100%;
+  animation: markstream-solid-image-shimmer 1.5s ease-in-out infinite;
+}
+
+.markstream-solid .image-error {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: 8px;
+  padding: 16px 24px;
+  min-height: 64px;
+  max-width: var(--ms-size-image-max-width);
+  background: hsl(var(--ms-muted));
+  color: hsl(var(--ms-muted-foreground));
+  font-size: var(--ms-text-label);
+  vertical-align: middle;
+}
+
+.markstream-solid .image-node__raw-text {
+  font-size: var(--ms-text-label);
+  color: hsl(var(--ms-muted-foreground));
+}
+
+@keyframes markstream-solid-image-shimmer {
+  from { transform: translateX(0); }
+  to { transform: translateX(66.6667%); }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .markstream-solid .image-shimmer::before {
+    animation: none !important;
+  }
+
+  .markstream-solid .image-node__img {
+    transition: none !important;
+  }
+}
+
+.markstream-solid details {
+  padding: 13.6px 16px;
+  border-radius: 14.4px;
+  border: 1px solid rgba(15, 23, 42, 0.08);
+  background: rgba(15, 23, 42, 0.03);
+}
+
+.markstream-solid summary {
+  cursor: pointer;
+  font-weight: 700;
+}
+
+.markstream-solid dl {
+  display: grid;
+  gap: 7.2px;
+}
+
+.markstream-solid dt {
+  font-weight: 700;
+}
+
+.markstream-solid dd {
+  margin: 0 0 7.2px 16px;
+}
+
+.markstream-solid input[type='checkbox'] {
+  margin-right: 6.4px;
+}
+
+.markstream-solid mark {
+  padding: 1.28px 3.84px;
+  border-radius: 4.8px;
+  background: rgba(250, 204, 21, 0.28);
+}
+
+.markstream-solid ins {
+  text-decoration-thickness: 0.08em;
+}
+
+.markstream-solid del {
+  text-decoration-thickness: 0.08em;
+}
+
+/* Prevent mermaid temporary render containers from causing layout shift */
+body > div[id^="dmermaid-"] {
+  position: fixed;
+  top: -10000px;
+  left: 0;
+  width: 100%;
+  visibility: hidden;
+  pointer-events: none;
+}
+
+.markstream-solid .markstream-nested-custom {
+  display: block;
+  margin: 16px 0;
+  padding: 14.4px 16px;
+  border-radius: 14.4px;
+  background: rgba(15, 23, 42, 0.04);
+  border: 1px solid rgba(15, 23, 42, 0.08);
+}
+
+.markstream-solid .markstream-nested-custom--thinking {
+  background: linear-gradient(180deg, rgba(14, 165, 233, 0.08), rgba(255, 255, 255, 0.92));
+  border-color: rgba(14, 165, 233, 0.18);
+}
+
+.markstream-solid .markstream-nested-admonition {
+  margin: 16px 0;
+  padding: 16px 17.6px;
+  border-radius: 16px;
+  border: 1px solid rgba(37, 99, 235, 0.14);
+  background: rgba(37, 99, 235, 0.05);
+}
+
+.markstream-solid .markstream-nested-admonition__title {
+  margin-bottom: 8.8px;
+  font-weight: 700;
+}
+
+.markstream-solid .markstream-nested-admonition--warning {
+  border-color: rgba(245, 158, 11, 0.24);
+  background: rgba(245, 158, 11, 0.08);
+}
+
+.markstream-solid .markstream-nested-admonition--error,
+.markstream-solid .markstream-nested-admonition--danger {
+  border-color: rgba(239, 68, 68, 0.22);
+  background: rgba(239, 68, 68, 0.07);
+}
+
+.markstream-solid .markstream-nested-admonition--tip {
+  border-color: rgba(16, 185, 129, 0.2);
+  background: rgba(16, 185, 129, 0.07);
+}
+
+.markstream-solid .markstream-nested-reference {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  min-width: 21.6px;
+  margin: 0 2px;
+  padding: 0 6px;
+  border-radius: 6px;
+  background: hsl(var(--muted));
+  color: hsl(var(--muted-foreground));
+  font-size: 12px;
+  line-height: 20px;
+  vertical-align: baseline;
+  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
+}
+
+.markstream-solid .reference-node:hover {
+  background-color: hsl(var(--ms-secondary));
+}
+
+.markstream-solid .footnote-node {
+  display: flex;
+  margin-top: var(--ms-flow-footnote-y);
+  margin-bottom: var(--ms-flow-footnote-y);
+  padding-top: 8px;
+  border-top: 1px solid var(--footnote-border);
+  font-size: 14px;
+  line-height: 1.625;
+}
+
+.markstream-solid .footnote-node__content {
+  flex: 1 1 auto;
+  min-width: 0;
+}
+
+.markstream-solid .footnote-reference {
+  font-size: 0.75em;
+  line-height: 0;
+  vertical-align: super;
+}
+
+.markstream-solid .footnote-link {
+  color: var(--link-color);
+  text-decoration: none;
+  cursor: pointer;
+}
+
+.markstream-solid .footnote-link:hover {
+  text-decoration: underline;
+}
+
+.markstream-solid .footnote-anchor {
+  margin-left: 5.6px;
+  color: var(--link-color);
+  font-size: 0.875em;
+  text-decoration: none;
+  cursor: pointer;
+}
+
+.markstream-solid .footnote-anchor:hover {
+  text-decoration: underline;
+}
+
+.markstream-solid .math-inline-wrapper {
+  position: relative;
+  display: inline-block;
+}
+
+.markstream-solid .math-inline {
+  display: inline-block;
+  vertical-align: middle;
+}
+
+.markstream-solid .math-inline--hidden {
+  visibility: hidden;
+}
+
+.markstream-solid .math-inline__loading {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  pointer-events: none;
+}
+
+.markstream-solid .math-inline__spinner {
+  width: 16px;
+  height: 16px;
+  border-radius: 9999px;
+  border: 2px solid rgba(94, 104, 121, 0.25);
+  border-top-color: rgba(94, 104, 121, 0.8);
+  animation: spin 1s linear infinite;
+}
+
+.markstream-solid .math-block,
+.markstream-solid .markstream-nested-math-block {
+  position: relative;
+  text-align: center;
+  overflow-x: auto;
+  min-height: 40px;
+  padding: 8px;
+}
+
+.markstream-solid .math-rendering {
+  opacity: 0.3;
+  transition: opacity 0.2s ease;
+}
+
+.markstream-solid .markstream-nested-math[data-markstream-katex="1"] .markstream-nested-math__source,
+.markstream-solid .markstream-nested-math-block--rendered > .markstream-nested-math-block__source {
+  display: none;
+}
+
+.markstream-solid .markstream-nested-math-block__render .katex-display {
+  margin: 0;
+  overflow-x: auto;
+  overflow-y: hidden;
+}
+
+.markstream-solid .markstream-solid-mermaid {
+  background: transparent;
+  color: hsl(var(--ms-foreground));
+}
+
+.markstream-solid.dark .markstream-solid-mermaid,
+.dark .markstream-solid .markstream-solid-mermaid {
+  background: transparent;
+  color: hsl(var(--ms-foreground));
+}
+
+.markstream-solid .markstream-solid-mermaid svg {
+  display: block;
+  max-width: 100%;
+  height: auto;
+  margin: 0 auto;
+}
+
+.markstream-solid .mermaid-block {
+  margin: var(--ms-flow-diagram-y) 0;
+  border: 1px solid var(--diagram-border);
+  border-radius: 8px;
+  overflow: hidden;
+  background: var(--diagram-bg);
+  color: hsl(var(--ms-foreground));
+  box-shadow: var(--ms-shadow-subtle);
+}
+
+.markstream-solid.dark .mermaid-block,
+.dark .markstream-solid .mermaid-block {
+  border-color: var(--diagram-border);
+  background: var(--diagram-bg);
+  color: hsl(var(--ms-foreground));
+}
+
+.markstream-solid.markstream-solid-modal-root {
+  position: fixed;
+  inset: 0;
+  z-index: 9999;
+  width: auto;
+  contain: none;
+  content-visibility: visible;
+  pointer-events: none;
+}
+
+.markstream-solid .mermaid-modal-overlay {
+  position: fixed;
+  inset: 0;
+  z-index: 9999;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 16px;
+  background: var(--modal-overlay);
+  pointer-events: auto;
+}
+
+.markstream-solid .mermaid-modal-panel {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  max-width: 100%;
+  max-height: 100%;
+  border-radius: 8px;
+  overflow: hidden;
+  background: var(--modal-bg);
+  color: var(--modal-fg);
+  box-shadow: var(--ms-shadow-modal);
+}
+
+.markstream-solid .mermaid-modal-panel.is-dark {
+  background: var(--modal-bg);
+  color: var(--modal-fg);
+}
+
+.markstream-solid .mermaid-modal-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 8px 16px;
+  border-bottom: 1px solid rgba(148, 163, 184, 0.25);
+}
+
+.markstream-solid .mermaid-modal-title {
+  font-size: 14px;
+  font-weight: 600;
+}
+
+.markstream-solid .mermaid-modal-close {
+  font-size: 14px;
+  padding: 4px 8px;
+  border-radius: 6px;
+  cursor: pointer;
+  opacity: 0.9;
+}
+
+.markstream-solid .mermaid-modal-close:hover {
+  opacity: 1;
+  background: rgba(148, 163, 184, 0.16);
+}
+
+.markstream-solid .mermaid-modal-controls {
+  position: absolute;
+  top: 24px;
+  right: 24px;
+  z-index: 2;
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.markstream-solid .mermaid-modal-body {
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+}
+
+.markstream-solid .mermaid-modal-content {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 16px;
+  transform-origin: center center;
+  overflow: hidden;
+}
+
+.markstream-solid .mermaid-modal-content svg,
+.markstream-solid .infographic-modal-content svg {
+  max-width: 100%;
+  max-height: 100%;
+  height: auto;
+}
+
+.markstream-solid .fullscreen {
+  width: 100%;
+  max-height: 100% !important;
+  height: 100% !important;
+}
+
+.markstream-solid .mermaid-header {
+  display: grid;
+  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
+  align-items: center;
+  gap: 12px;
+  padding: var(--ms-inset-panel-y) var(--ms-inset-panel-x);
+  border-bottom: 1px solid var(--diagram-border);
+  background: var(--diagram-header-bg);
+  color: hsl(var(--ms-foreground));
+}
+
+.markstream-solid.dark .mermaid-header,
+.dark .markstream-solid .mermaid-header {
+  background: var(--diagram-header-bg);
+  border-color: var(--diagram-border);
+}
+
+.markstream-solid .mermaid-header__title,
+.markstream-solid .icon-slot {
+  display: inline-flex;
+  align-items: center;
+}
+
+.markstream-solid .mermaid-header__title {
+  min-width: 0;
+  gap: 8px;
+  overflow: hidden;
+}
+
+.markstream-solid .action-icon {
+  width: var(--ms-action-btn-icon);
+  height: var(--ms-action-btn-icon);
+  flex: 0 0 auto;
+}
+
+.markstream-solid .icon-slot {
+  justify-content: center;
+}
+
+.markstream-solid .icon-slot svg {
+  display: block;
+  width: 100%;
+  height: 100%;
+}
+
+.markstream-solid .mermaid-title__text {
+  min-width: 0;
+  overflow: hidden;
+  color: var(--code-action-fg);
+  font:
+    500 var(--ms-text-label)/1.2 "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.markstream-solid .mermaid-actions {
+  display: flex;
+  align-items: center;
+  gap: var(--ms-gap-header-actions);
+  grid-column: 3;
+  justify-content: flex-end;
+  justify-self: end;
+}
+
+.markstream-solid .mermaid-action-btn,
+.markstream-solid .mermaid-btn {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  border: 0;
+  background: transparent;
+  color: var(--code-action-fg);
+  font:
+    500 var(--ms-text-label)/1 "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
+  padding: var(--ms-action-btn-padding);
+  border-radius: 4px;
+  cursor: pointer;
+  transition: background-color 0.15s ease, color 0.15s ease, opacity 0.15s ease, transform 0.15s ease;
+}
+
+.markstream-solid .mermaid-btn--icon {
+  width: calc(var(--ms-action-btn-icon) + var(--ms-action-btn-padding) + var(--ms-action-btn-padding));
+  height: calc(var(--ms-action-btn-icon) + var(--ms-action-btn-padding) + var(--ms-action-btn-padding));
+}
+
+.markstream-solid .mermaid-action-btn svg,
+.markstream-solid .mermaid-btn svg,
+.markstream-solid .mermaid-toggle-btn svg {
+  display: block;
+  width: var(--ms-action-btn-icon);
+  height: var(--ms-action-btn-icon);
+  flex: 0 0 auto;
+}
+
+.markstream-solid .mermaid-action-btn:hover:not(:disabled),
+.markstream-solid .mermaid-btn:hover:not(:disabled) {
+  background: var(--code-action-hover-bg);
+  color: var(--code-action-hover-fg);
+}
+
+.markstream-solid.dark .mermaid-btn:hover:not(:disabled),
+.dark .markstream-solid .mermaid-btn:hover:not(:disabled) {
+  background: var(--code-action-hover-bg);
+  color: var(--code-action-hover-fg);
+}
+
+.markstream-solid .mermaid-action-btn:active,
+.markstream-solid .mermaid-btn:active {
+  transform: scale(0.98);
+}
+
+.markstream-solid .mermaid-btn:disabled {
+  opacity: 0.4;
+  cursor: not-allowed;
+}
+
+.markstream-solid .mermaid-toggle {
+  display: inline-flex;
+  align-items: center;
+  gap: 2px;
+  grid-column: 2;
+  background: transparent;
+}
+
+.markstream-solid .mermaid-toggle-btn {
+  border: none;
+  background: transparent;
+  color: var(--code-action-fg);
+  font:
+    500 var(--ms-text-label)/1 "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
+  padding: 2px 8px;
+  border-radius: 4px;
+  cursor: pointer;
+  opacity: 0.6;
+  transition: background-color 0.15s ease, color 0.15s ease, opacity 0.15s ease;
+}
+
+.markstream-solid .mermaid-action-content {
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+}
+
+.markstream-solid .mermaid-toggle-btn:hover {
+  opacity: 0.9;
+}
+
+.markstream-solid .mermaid-toggle-btn--active {
+  background: hsl(var(--ms-foreground) / 0.08);
+  color: var(--code-fg);
+  opacity: 1;
+}
+
+.markstream-solid.dark .mermaid-toggle-btn--active,
+.dark .markstream-solid .mermaid-toggle-btn--active {
+  background: hsl(var(--ms-foreground) / 0.08);
+  color: var(--code-fg);
+}
+
+/* The pan transform is applied to `.mermaid-preview` itself, and a transformed
+   element paints above the header it overlaps; the body is what clips the panned
+   diagram back into the preview area. clip (not auto/hidden) means it is not a
+   scroll container at all, so a touch swipe keeps scrolling the page. */
+.markstream-solid .mermaid-body {
+  position: relative;
+  padding: 0;
+  overflow: clip;
+}
+
+.markstream-solid .markstream-solid-zoom-controls {
+  position: absolute;
+  top: 12px;
+  right: 12px;
+  z-index: 2;
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  padding: 4px;
+  border: 1px solid rgba(148, 163, 184, 0.3);
+  border-radius: 8px;
+  background: rgba(255, 255, 255, 0.82);
+  backdrop-filter: blur(10px);
+}
+
+.markstream-solid.dark .markstream-solid-zoom-controls,
+.dark .markstream-solid .markstream-solid-zoom-controls {
+  background: rgba(15, 23, 42, 0.78);
+  border-color: rgba(71, 85, 105, 0.65);
+}
+
+.markstream-solid .mermaid-preview {
+  width: 100%;
+  min-height: var(--ms-size-diagram-min-height);
+  /* clip, not auto: an overflow:auto pan surface is a "user-scrollable" box,
+     so a touch swipe latches onto it and, when nothing can scroll there, the
+     page does not scroll either. clip is never a scroll container and clips
+     the same (the diagram is scaled to fit). */
+  overflow: clip;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  text-align: center;
+  transform-origin: top center;
+}
+
+.markstream-solid .mermaid-preview svg {
+  width: 100%;
+  height: auto;
+}
+
+/* The pan surface takes the touch gesture instead of letting the page scroller
+   claim it, which would fire pointercancel and stop the drag mid-gesture. The
+   class is only bound while panning can reveal something (zoomed in, or in the
+   fullscreen modal), so at fit zoom a swipe keeps scrolling the page. */
+.markstream-solid .markstream-solid-pan-touch {
+  touch-action: none;
+}
+
+.markstream-solid .mermaid-source {
+  margin: 0;
+  padding: var(--ms-inset-panel-body);
+  border-radius: 0;
+  background: var(--diagram-bg);
+  color: hsl(var(--ms-foreground));
+  box-shadow: none;
+  white-space: pre-wrap;
+  font-family: ui-monospace, "SFMono-Regular", Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
+  font-size: 14px;
+  line-height: 20px;
+  overflow-x: auto;
+}
+
+.markstream-solid .mermaid-source code {
+  padding: 0;
+  background: transparent;
+  color: inherit;
+  font: inherit;
+  white-space: inherit;
+}
+
+.markstream-solid .mermaid-error {
+  padding: 13.6px 16px;
+  color: #b91c1c;
+  background: rgba(248, 113, 113, 0.15);
+  border-top: 1px solid rgba(248, 113, 113, 0.25);
+}
+
+.markstream-solid .mermaid-loading {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 12px 16px 16px;
+  font-size: 13.6px;
+  color: rgba(15, 23, 42, 0.6);
+}
+
+.markstream-solid.dark .mermaid-loading,
+.dark .markstream-solid .mermaid-loading {
+  color: rgba(226, 232, 240, 0.7);
+}
+
+.markstream-solid .mermaid-spinner {
+  width: 13.6px;
+  height: 13.6px;
+  border-radius: 9999px;
+  border: 2px solid rgba(59, 130, 246, 0.2);
+  border-top-color: #2563eb;
+  animation: spin 1s linear infinite;
+}
+
+.markstream-solid .markstream-solid-enhanced-block {
+  margin: var(--ms-flow-diagram-y) 0;
+  border-radius: 8px;
+  overflow: hidden;
+  border: 1px solid var(--diagram-border);
+  background: var(--diagram-bg);
+  color: hsl(var(--ms-foreground));
+  box-shadow: var(--ms-shadow-subtle);
+}
+
+.markstream-solid .markstream-solid-enhanced-block__header {
+  display: grid;
+  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
+  align-items: center;
+  gap: 12px;
+  padding: var(--ms-inset-panel-y) var(--ms-inset-panel-x);
+  border-bottom: 1px solid var(--diagram-border);
+  background: var(--diagram-header-bg);
+}
+
+.markstream-solid .markstream-solid-enhanced-block__actions {
+  display: inline-flex;
+  align-items: center;
+  justify-content: flex-end;
+  justify-self: end;
+  grid-column: 3;
+  gap: var(--ms-gap-header-actions);
+}
+
+.markstream-solid .markstream-solid-enhanced-block__title {
+  display: inline-flex;
+  align-items: center;
+  min-width: 0;
+  gap: 8px;
+}
+
+.markstream-solid .markstream-solid-enhanced-block__title-icon {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  flex: 0 0 auto;
+  width: 16px;
+  height: 16px;
+}
+
+.markstream-solid .markstream-solid-enhanced-block__title-text {
+  overflow: hidden;
+  font:
+    500 var(--ms-text-label)/1.2 "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.markstream-solid .markstream-solid-enhanced-block__action {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  padding: var(--ms-action-btn-padding);
+  border: 0;
+  border-radius: 4px;
+  background: transparent;
+  box-shadow: none;
+  color: var(--code-action-fg);
+  font:
+    500 var(--ms-text-label)/1 "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
+  cursor: pointer;
+  transition: background-color 0.15s ease, color 0.15s ease, opacity 0.15s ease, transform 0.15s ease;
+}
+
+.markstream-solid .markstream-solid-enhanced-block__action-content {
+  display: inline-flex;
+  align-items: center;
+  gap: 5.6px;
+}
+
+.markstream-solid .markstream-solid-enhanced-block__action--icon {
+  width: calc(var(--ms-action-btn-icon) + var(--ms-action-btn-padding) + var(--ms-action-btn-padding));
+  height: calc(var(--ms-action-btn-icon) + var(--ms-action-btn-padding) + var(--ms-action-btn-padding));
+}
+
+.markstream-solid .markstream-solid-enhanced-block__action:hover {
+  background: var(--code-action-hover-bg);
+  color: var(--code-action-hover-fg);
+}
+
+.markstream-solid .markstream-solid-enhanced-block__action:active {
+  transform: scale(0.98);
+}
+
+.markstream-solid .markstream-solid-enhanced-block__action:disabled {
+  opacity: 0.45;
+  cursor: not-allowed;
+}
+
+.markstream-solid .markstream-solid-enhanced-block__action:disabled:hover {
+  background: transparent;
+}
+
+.markstream-solid .markstream-solid-enhanced-block__badge {
+  display: inline-flex;
+  align-items: center;
+  padding: 3.52px 8.8px;
+  border-radius: 999px;
+  background: rgba(37, 99, 235, 0.1);
+  color: #1d4ed8;
+  font:
+    700 11.52px/1 "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
+  letter-spacing: 0.04em;
+  text-transform: uppercase;
+}
+
+.markstream-solid .markstream-solid-enhanced-block__body {
+  position: relative;
+  overflow: auto;
+  padding: var(--ms-inset-panel-body);
+  background: var(--diagram-bg);
+}
+
+.markstream-solid .markstream-solid-enhanced-block__body > :first-child {
+  margin-top: 0;
+}
+
+.markstream-solid .markstream-solid-enhanced-block__body > :last-child {
+  margin-bottom: 0;
+}
+
+.markstream-solid .markstream-solid-enhanced-block__body--code {
+  padding: 0;
+  background: #0b1220;
+}
+
+.markstream-solid .markstream-solid-enhanced-block__body--code .stream-diffs-shell,
+.markstream-solid .markstream-solid-enhanced-block__body--code diffs-container {
+  min-height: inherit;
+}
+
+.markstream-solid .markstream-solid-enhanced-block__details {
+  margin: 0;
+  border-top: 1px solid rgba(15, 23, 42, 0.08);
+  border-radius: 0;
+  background: rgba(248, 250, 252, 0.92);
+}
+
+.markstream-solid .markstream-solid-enhanced-block__details summary {
+  padding: 12.8px 15.2px;
+}
+
+.markstream-solid .markstream-solid-enhanced-block__source {
+  margin: 0;
+  border-radius: 0;
+}
+
+.markstream-solid .markstream-solid-enhanced-block--d2 svg,
+.markstream-solid .markstream-solid-enhanced-block--infographic svg {
+  display: block;
+  width: 100%;
+  height: auto;
+}
+
+.markstream-solid .markstream-solid-enhanced-block .markstream-solid-enhanced-block__title-icon svg,
+.markstream-solid .markstream-solid-enhanced-block .markstream-solid-enhanced-block__action svg {
+  width: var(--ms-action-btn-icon);
+  height: var(--ms-action-btn-icon);
+  flex: 0 0 auto;
+}
+
+.markstream-solid .infographic-label {
+  color: hsl(var(--ms-muted-foreground));
+}
+
+.markstream-solid .infographic-mode-toggle {
+  display: inline-flex;
+  align-items: center;
+  gap: 2px;
+  grid-column: 2;
+  background: transparent;
+}
+
+.markstream-solid .infographic-mode-btn {
+  color: var(--code-action-fg);
+  opacity: 0.6;
+}
+
+.markstream-solid .infographic-mode-btn:hover {
+  opacity: 0.9;
+}
+
+.markstream-solid .infographic-mode-btn.is-active {
+  background: hsl(var(--ms-foreground) / 0.08);
+  color: var(--code-fg);
+  opacity: 1;
+}
+
+.markstream-solid .infographic-action-btn,
+.markstream-solid .infographic-zoom-reset {
+  font-family: inherit;
+  color: var(--code-action-fg);
+}
+
+.markstream-solid .infographic-action-btn:hover:not(:disabled),
+.markstream-solid .infographic-zoom-reset:hover:not(:disabled) {
+  background: var(--code-action-hover-bg);
+  color: var(--code-action-hover-fg);
+}
+
+.markstream-solid .infographic-block-body {
+  padding: 0;
+  background: var(--diagram-bg);
+  /* The pan transform is applied to .infographic-render itself, so the body is
+     what clips the panned diagram back into the preview area. clip (not the
+     base __body's auto) so it is not a scroll container a swipe could latch on. */
+  overflow: clip;
+}
+
+.markstream-solid .infographic-source {
+  padding: var(--ms-inset-panel-body);
+  background: var(--diagram-bg);
+}
+
+.markstream-solid .infographic-source-code {
+  margin: 0;
+  padding: 0;
+  border-radius: 0;
+  background: transparent;
+  color: hsl(var(--ms-foreground));
+  box-shadow: none;
+  white-space: pre-wrap;
+  font-family: ui-monospace, "SFMono-Regular", Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
+  font-size: 14px;
+  line-height: 20px;
+}
+
+.markstream-solid .infographic-source-code code {
+  padding: 0;
+  background: transparent;
+  color: inherit;
+  font: inherit;
+  white-space: inherit;
+}
+
+.markstream-solid.dark .markstream-solid-enhanced-block,
+.dark .markstream-solid .markstream-solid-enhanced-block {
+  border-color: var(--diagram-border);
+  background: var(--diagram-bg);
+}
+
+.markstream-solid.dark .markstream-solid-enhanced-block__header,
+.dark .markstream-solid .markstream-solid-enhanced-block__header {
+  border-bottom-color: var(--diagram-border);
+  background: var(--diagram-header-bg);
+}
+
+.markstream-solid.dark .markstream-solid-enhanced-block__action,
+.dark .markstream-solid .markstream-solid-enhanced-block__action {
+  background: transparent;
+  box-shadow: none;
+}
+
+.markstream-solid.dark .markstream-solid-enhanced-block__action:hover,
+.dark .markstream-solid .markstream-solid-enhanced-block__action:hover {
+  background: var(--code-action-hover-bg);
+}
+
+.markstream-solid.dark .markstream-solid-enhanced-block__action:disabled:hover,
+.dark .markstream-solid .markstream-solid-enhanced-block__action:disabled:hover {
+  background: transparent;
+}
+
+.markstream-solid.dark .markstream-solid-enhanced-block__badge,
+.dark .markstream-solid .markstream-solid-enhanced-block__badge {
+  background: rgba(96, 165, 250, 0.16);
+  color: #93c5fd;
+}
+
+.markstream-solid.dark .markstream-solid-enhanced-block__body,
+.dark .markstream-solid .markstream-solid-enhanced-block__body {
+  background: var(--diagram-bg);
+}
+
+.markstream-solid.dark .markstream-solid-enhanced-block__details,
+.dark .markstream-solid .markstream-solid-enhanced-block__details {
+  border-top-color: rgba(148, 163, 184, 0.18);
+  background: rgba(15, 23, 42, 0.96);
+}
+
+@keyframes node-placeholder-shimmer {
+  from { transform: translateX(0); }
+  to { transform: translateX(80%); }
+}
+
+@keyframes spin {
+  to {
+    transform: rotate(360deg);
+  }
+}
+
+@keyframes typewriter-fade {
+  from {
+    opacity: 0;
+  }
+
+  to {
+    opacity: 1;
+  }
+}
+
+.markstream-solid .code-block-container {
+  --markstream-code-fallback-bg: var(--code-bg);
+  --markstream-code-fallback-fg: var(--code-fg);
+  --markstream-code-border-color: var(--code-border);
+  --markstream-diff-shell-fg: #0f172a;
+  --markstream-diff-shell-muted: #64748b;
+  --markstream-diff-shell-border: rgba(148, 163, 184, 0.24);
+  --markstream-diff-shell-bg: #ffffff;
+  --markstream-diff-header-border: rgba(148, 163, 184, 0.18);
+  --markstream-diff-editor-bg: #111111;
+  --markstream-diff-editor-fg: #d4d4d4;
+  --markstream-diff-unchanged-fg: #d4d4d4;
+  --markstream-diff-unchanged-bg: rgba(64, 64, 64, 0.92);
+  --markstream-diff-unchanged-divider: rgba(255, 255, 255, 0.18);
+  --markstream-diff-focus: rgba(96, 165, 250, 0.42);
+  --markstream-diff-widget-shadow: rgba(0, 0, 0, 0.72);
+  --markstream-diff-action-hover: rgba(148, 163, 184, 0.18);
+  --markstream-diff-pane-divider: rgba(82, 82, 91, 0.34);
+  --markstream-diff-gutter-gap: 8px;
+  --markstream-diff-line-number: rgba(161, 161, 170, 0.68);
+  --markstream-diff-line-number-active: rgba(228, 228, 231, 0.82);
+  --markstream-diff-added-fg: #5eead4;
+  --markstream-diff-removed-fg: #fda4af;
+  --markstream-diff-added-line: rgba(13, 148, 136, 0.18);
+  --markstream-diff-removed-line: rgba(225, 29, 72, 0.18);
+  --markstream-diff-added-inline: rgba(45, 212, 191, 0.24);
+  --markstream-diff-removed-inline: rgba(251, 113, 133, 0.24);
+  --markstream-diff-added-inline-border: transparent;
+  --markstream-diff-removed-inline-border: transparent;
+  --markstream-diff-added-line-fill: rgba(13, 148, 136, 0.18);
+  --markstream-diff-removed-line-fill: rgba(225, 29, 72, 0.18);
+  margin: 16px 0;
+  overflow: hidden;
+  border: 1px solid rgba(148, 163, 184, 0.24);
+  border-radius: 12px;
+  background: var(--markstream-code-fallback-bg, var(--code-bg));
+  color: var(--markstream-code-fallback-fg, var(--code-fg));
+  box-shadow: 0 18px 38px -28px rgba(15, 23, 42, 0.45);
+}
+
+.markstream-solid .code-block-container.is-dark,
+.dark .markstream-solid .code-block-container {
+  --markstream-code-fallback-bg: #111827;
+  --markstream-code-fallback-fg: hsl(0 0% 93%);
+  --markstream-diff-shell-fg: #e2e8f0;
+  --markstream-diff-shell-muted: #94a3b8;
+  --markstream-diff-shell-border: rgba(82, 82, 91, 0.56);
+  --markstream-diff-shell-bg: rgba(10, 10, 11, 0.99);
+  --markstream-diff-header-border: rgba(63, 63, 70, 0.82);
+  --markstream-diff-editor-bg: rgba(12, 12, 14, 0.99);
+  --markstream-diff-editor-fg: #b6c2d3;
+  --markstream-diff-unchanged-fg: #cbd5e1;
+  --markstream-diff-unchanged-bg: rgba(24, 24, 27, 0.92);
+  --markstream-diff-unchanged-divider: rgba(255, 255, 255, 0.18);
+  --markstream-diff-action-hover: rgba(255, 255, 255, 0.08);
+  border-color: rgba(71, 85, 105, 0.55);
+  background: var(--markstream-code-fallback-bg, var(--code-bg));
+  color: var(--markstream-code-fallback-fg, var(--code-fg));
+  box-shadow: 0 22px 44px -30px rgba(2, 6, 23, 0.95);
+}
+
+.markstream-solid .code-block-container.is-plain-text .stream-diffs-shell,
+.markstream-solid .code-block-container.is-plain-text diffs-container {
+  background: var(--vscode-editor-background, var(--markstream-code-fallback-bg)) !important;
+  color: var(--vscode-editor-foreground, var(--markstream-code-fallback-fg)) !important;
+}
+
+.markstream-solid .code-block-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: var(--ms-gap-header);
+  padding: var(--ms-inset-panel-y) var(--ms-inset-panel-x);
+  border-bottom: 1px solid var(--code-border);
+  background: var(--code-header-bg);
+  color: var(--code-fg);
+  border-radius: var(--ms-radius) var(--ms-radius) 0 0;
+}
+
+.markstream-solid .code-block-header__meta {
+  display: flex;
+  flex: 1 1 auto;
+  align-items: center;
+  gap: var(--ms-gap-header-main);
+  min-width: 0;
+}
+
+.markstream-solid .code-block-header__label {
+  min-width: 0;
+  overflow: hidden;
+  color: var(--code-action-fg);
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  font-size: var(--ms-text-label);
+  font-weight: 500;
+  line-height: 1.2;
+}
+
+.markstream-solid .code-block-header__actions {
+  display: flex;
+  flex: 0 0 auto;
+  align-items: center;
+  justify-content: flex-end;
+  gap: var(--ms-gap-header-actions);
+  margin-left: auto;
+}
+
+.markstream-solid .code-block-language-icon {
+  width: 16px;
+  height: 16px;
+  flex: 0 0 16px;
+  color: #2563eb;
+}
+
+.markstream-solid.dark .code-block-language-icon,
+.dark .markstream-solid .code-block-language-icon {
+  color: #93c5fd;
+}
+
+.markstream-solid .code-block-language-icon svg,
+.markstream-solid .code-block-language-icon img {
+  display: block;
+  width: 100%;
+  height: 100%;
+}
+
+.markstream-solid .code-block-language-icon__image {
+  -o-object-fit: contain;
+     object-fit: contain;
+}
+
+.markstream-solid .code-block-body {
+  position: relative;
+  display: grid;
+  grid-template-columns: minmax(0, 1fr);
+  min-width: 0;
+  overflow: hidden;
+  background: var(--markstream-code-fallback-bg, var(--code-bg));
+}
+
+.markstream-solid .code-block-body > .code-editor-container,
+.markstream-solid .code-block-body > .code-editor-fallback-surface {
+  grid-area: 1 / 1;
+}
+
+.markstream-solid .code-editor-fallback-surface {
+  min-width: 0;
+  background: var(--markstream-code-fallback-bg, var(--code-bg));
+}
+
+/* Once the enhanced editor owns the grid row, the retired fallback must leave
+   layout entirely: visibility-only hiding keeps the row at the fallback's
+   (uncollapsed) height, so collapsed diffs reserve space they no longer use. */
+.markstream-solid .code-editor-fallback-surface.is-retired {
+  display: none;
+}
+
+.code-block-body--expanded {
+  max-height: none;
+}
+
+.code-block-body--collapsed {
+  min-height: 0;
+  height: 0;
+  overflow: hidden;
+}
+
+.markstream-solid .code-action-btn {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  padding: var(--ms-action-btn-padding);
+  border-radius: 6px;
+  color: var(--code-action-fg);
+  transition: background-color 140ms ease, color 140ms ease, transform 140ms ease, opacity 140ms ease;
+}
+
+.markstream-solid .code-action-btn:hover {
+  background: var(--code-action-hover-bg);
+  color: var(--code-action-hover-fg);
+}
+
+.markstream-solid .code-action-btn__icon,
+.markstream-solid .code-action-btn svg {
+  display: block;
+  width: 12.8px;
+  height: 12.8px;
+  flex: 0 0 auto;
+}
+
+.markstream-solid .code-action-btn:active {
+  transform: scale(0.98);
+}
+
+.markstream-solid .code-action-btn:disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+
+.markstream-solid .code-action-btn:disabled:hover {
+  background: transparent;
+}
+
+.markstream-solid .code-editor-container.is-hidden {
+  opacity: 0;
+  pointer-events: none;
+}
+
+/* ── Pre fallback: non-diff line numbers (aligned with markstream-vue PreCodeNode) ── */
+.markstream-solid pre[class^='language-'],
+.markstream-solid pre[class*=' language-'] {
+  white-space: pre;
+  overflow: auto;
+  -moz-tab-size: 2;
+    -o-tab-size: 2;
+       tab-size: 2;
+  font-variant-ligatures: none;
+  contain: content;
+  backface-visibility: hidden;
+  transform: translateZ(0);
+  -webkit-font-smoothing: antialiased;
+}
+.markstream-solid pre[class^='language-'] > code,
+.markstream-solid pre[class*=' language-'] > code {
+  display: block;
+}
+
+.markstream-solid .code-block-container.is-diff {
+  color: var(--markstream-diff-shell-fg);
+  border-color: var(--markstream-diff-shell-border);
+  background: var(--markstream-diff-shell-bg);
+  --vscode-editor-selectionBackground: var(--markstream-diff-action-hover);
+}
+
+.markstream-solid .code-block-container.is-diff .code-block-header {
+  color: var(--markstream-diff-shell-fg);
+  border-bottom-color: var(--markstream-diff-header-border);
+  background: var(--markstream-diff-shell-bg);
+}
+
+.markstream-solid .code-block-container.is-diff .code-action-btn {
+  color: var(--markstream-diff-shell-muted);
+}
+
+.markstream-solid .code-block-container.is-diff .code-block-body {
+  background: var(--markstream-diff-editor-bg);
+  --vscode-editor-background: var(--markstream-diff-editor-bg);
+  --vscode-editor-foreground: var(--markstream-diff-editor-fg);
+  --vscode-diffEditor-unchangedRegionForeground: var(--markstream-diff-unchanged-fg);
+  --vscode-diffEditor-unchangedRegionBackground: var(--markstream-diff-unchanged-bg);
+  --vscode-diffEditor-insertedTextBackground: var(--markstream-diff-added-inline);
+  --vscode-diffEditor-removedTextBackground: var(--markstream-diff-removed-inline);
+  --vscode-diffEditor-insertedLineBackground: var(--markstream-diff-added-line);
+  --vscode-diffEditor-removedLineBackground: var(--markstream-diff-removed-line);
+  --vscode-diffEditor-insertedTextBorder: var(--markstream-diff-added-inline-border);
+  --vscode-diffEditor-removedTextBorder: var(--markstream-diff-removed-inline-border);
+  --vscode-focusBorder: var(--markstream-diff-focus);
+  --vscode-widget-shadow: var(--markstream-diff-widget-shadow);
+}
+
+.markstream-solid .code-block-container.is-diff .code-editor-container {
+  min-height: 0;
+  background: var(--markstream-diff-editor-bg);
+}
+
+.html-preview-frame__backdrop {
+  position: fixed;
+  inset: 0;
+  background-color: rgba(0, 0, 0, 0.5);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 50;
+}
+
+.html-preview-frame__backdrop--dark {
+  background-color: rgba(15, 23, 42, 0.8);
+}
+
+.html-preview-frame {
+  width: 80vw;
+  max-width: 960px;
+  height: 70vh;
+  background-color: #fff;
+  border-radius: 8px;
+  overflow: hidden;
+  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.25);
+  display: flex;
+  flex-direction: column;
+}
+
+.html-preview-frame--dark {
+  background-color: #020617;
+  color: #e5e7eb;
+  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.6);
+}
+
+.html-preview-frame__header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 6.4px 12px;
+  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
+}
+
+.html-preview-frame--dark .html-preview-frame__header {
+  border-bottom-color: rgba(148, 163, 184, 0.35);
+}
+
+.html-preview-frame__title {
+  display: inline-flex;
+  align-items: center;
+  gap: 6.4px;
+  font-size: 12px;
+  font-weight: 500;
+  letter-spacing: 0.02em;
+  text-transform: uppercase;
+  opacity: 0.85;
+}
+
+.html-preview-frame__dot {
+  width: 8px;
+  height: 8px;
+  border-radius: 999px;
+  background-color: #22c55e;
+}
+
+.html-preview-frame--dark .html-preview-frame__dot {
+  background-color: #4ade80;
+}
+
+.html-preview-frame__label {
+  white-space: nowrap;
+}
+
+.html-preview-frame__close {
+  border: none;
+  background: transparent;
+  font-size: 20px;
+  line-height: 1;
+  cursor: pointer;
+}
+
+.html-preview-frame__close--dark {
+  color: #e5e7eb;
+}
+
+.html-preview-frame__iframe {
+  width: 100%;
+  height: 100%;
+  border: none;
+  display: block;
+}
+
+@media (max-width: 640px) {
+  .html-preview-frame {
+    width: 100vw;
+    height: 80vh;
+    border-radius: 0;
+  }
+}
+
+.ms-tooltip {
+  position: fixed;
+  padding: 6.4px 10.4px;
+  font-size: 14px;
+  border-radius: 6px;
+  border-width: 1px;
+  border-style: solid;
+  box-shadow: 0 10px 15px rgba(0, 0, 0, 0.08);
+  pointer-events: none;
+  z-index: 9999;
+  opacity: 0;
+  transition: opacity 120ms linear, transform 220ms cubic-bezier(.16, 1, .3, 1);
+}
+
+.ms-tooltip[data-visible='true'] {
+  opacity: 1;
+}
+
+.ms-tooltip[data-dark='true'] {
+  background-color: #111827;
+  color: #f9fafb;
+  border-color: #374151;
+}
+
+.ms-tooltip[data-dark='false'],
+.ms-tooltip:not([data-dark='true']) {
+  background-color: #ffffff;
+  color: #111827;
+  border-color: #e5e7eb;
+}
+
+.markstream-solid .sr-only {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  padding: 0;
+  margin: -1px;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  white-space: nowrap;
+  border: 0;
+}
+
+.markstream-solid .d2-block-body {
+  position: relative;
+  padding: 0;
+}
+
+.markstream-solid .d2-block-header {
+  display: flex;
+  grid-template-columns: none;
+  justify-content: space-between;
+  border-bottom: 1px solid var(--diagram-border);
+  color: hsl(var(--ms-foreground));
+}
+
+.markstream-solid .d2-header-title {
+  display: inline-flex;
+  align-items: center;
+  min-width: 0;
+  gap: 8px;
+}
+
+.markstream-solid .d2-label {
+  color: hsl(var(--ms-foreground));
+  font:
+    500 var(--ms-text-label)/1.2 "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
+}
+
+.markstream-solid .d2-header-actions {
+  display: inline-flex;
+  align-items: center;
+  justify-content: flex-end;
+  justify-self: auto;
+  grid-column: auto;
+  gap: var(--ms-gap-header-actions);
+}
+
+.markstream-solid .d2-mode-toggle {
+  display: inline-flex;
+  align-items: center;
+  gap: 2px;
+  background: transparent;
+}
+
+.markstream-solid .d2-mode-btn {
+  padding: 2px 8px;
+  border-radius: 4px;
+  color: var(--code-action-fg);
+  opacity: 0.6;
+  transition: opacity 0.2s, color 0.2s, background-color 0.2s;
+}
+
+.markstream-solid .d2-mode-btn:hover {
+  opacity: 0.9;
+}
+
+.markstream-solid .d2-mode-btn.is-active {
+  background: hsl(var(--ms-foreground) / 0.08);
+  color: var(--code-fg);
+  opacity: 1;
+}
+
+.markstream-solid .d2-action-btn {
+  color: var(--code-action-fg);
+  opacity: 0.7;
+  transition: opacity 0.2s, background-color 0.15s, color 0.15s;
+}
+
+.markstream-solid .d2-action-btn:hover:not(:disabled) {
+  opacity: 1;
+  background: var(--code-action-hover-bg);
+  color: var(--code-action-hover-fg);
+}
+
+.markstream-solid .d2-action-btn:disabled {
+  opacity: 0.3;
+  cursor: not-allowed;
+}
+
+.markstream-solid .d2-source {
+  padding: var(--ms-inset-panel-body) var(--ms-inset-panel-x);
+  font-family: var(--vscode-editor-font-family, "Fira Code", "SFMono-Regular", Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
+}
+
+.markstream-solid .d2-code {
+  margin: 0;
+  padding: 0;
+  border-radius: 0;
+  background: transparent;
+  color: hsl(var(--ms-foreground));
+  box-shadow: none;
+  white-space: pre;
+  font-size: 14px;
+  line-height: 1.5;
+}
+
+.markstream-solid .d2-code code {
+  padding: 0;
+  background: transparent;
+  color: inherit;
+  font: inherit;
+  white-space: inherit;
+}
+
+/* Center the rendered diagram like the mermaid/infographic blocks: a
+   column flex container with margin:auto children stays centered while
+   remaining scroll-safe when content overflows. */
+.markstream-solid .d2-render {
+  max-height: var(--ms-size-code-max-height);
+  overflow: auto;
+  display: flex;
+  flex-direction: column;
+}
+
+/* margin: auto (not justify-content: center) keeps overflow scrolling safe. */
+.markstream-solid .d2-svg {
+  margin: auto;
+  width: 100%;
+}
+
+.markstream-solid .d2-render .d2-error {
+  margin-left: auto;
+  margin-right: auto;
+}
+
+.markstream-solid .d2-svg svg.markstream-d2-root-svg {
+  width: 100%;
+  max-width: 100%;
+  height: auto;
+  /* Match the container cap so tall diagrams scale down to fit, mirroring
+     the mermaid block's max-height behavior. The inline maxHeight prop
+     exposes its value as --ms-d2-render-max-height so the svg cap always
+     tracks the effective container cap. The fallback is the shared token. */
+  max-height: var(--ms-d2-render-max-height, var(--ms-size-code-max-height));
+  display: block;
+}
+
+.markstream-solid .d2-error {
+  color: #dc2626;
+  margin-top: 12px;
+}
+
+.markstream-solid .infographic-render {
+  position: relative;
+  width: 100%;
+  min-height: var(--ms-size-diagram-min-height);
+  /* clip, not auto — same reason as .mermaid-preview: a scrollable pan surface
+     would latch touch swipes and stop the page from scrolling. */
+  overflow: clip;
+  text-align: center;
+}
+
+.markstream-solid .infographic-pending-source {
+  position: absolute;
+  inset: 0;
+  z-index: 1;
+  overflow: auto;
+  padding: var(--ms-inset-panel-body);
+  text-align: left;
+}
+
+/* The render host mirrors the mermaid/vue diagram layers: an inset-0
+   layer with a definite height (the inline min-height estimate on
+   .infographic-render) that flex-centers the rendered diagram. */
+.markstream-solid .infographic-render > div {
+  position: absolute;
+  inset: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  transition: transform 120ms ease;
+}
+
+/* Keep the diagram fully visible and centered like the mermaid block:
+   scale down proportionally inside the preview area. Scoped to the
+   preview container only; the fullscreen modal clone (portaled to body
+   without this wrapper) keeps its own sizing. */
+.markstream-solid .infographic-render svg {
+  max-width: 100%;
+  max-height: 100%;
+  width: auto;
+  height: auto;
+}
+
+
+
+.html-preview-frame__backdrop {
+  position: fixed;
+  inset: 0;
+  background-color: var(--modal-overlay);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 50;
+}
+
+.html-preview-frame {
+  width: 80vw;
+  max-width: 960px;
+  height: 70vh;
+  background-color: var(--modal-bg);
+  color: var(--modal-fg);
+  border-radius: calc(var(--ms-radius) * 2);
+  overflow: hidden;
+  box-shadow: var(--ms-shadow-preview);
+  display: flex;
+  flex-direction: column;
+}
+
+.html-preview-frame__header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 6.4px 12px;
+  border-bottom: 1px solid var(--code-border);
+}
+
+.html-preview-frame__title {
+  display: inline-flex;
+  align-items: center;
+  gap: 6.4px;
+  font-size: 12px;
+  font-weight: 500;
+  letter-spacing: 0.02em;
+  text-transform: uppercase;
+  opacity: 0.85;
+}
+
+.html-preview-frame__dot {
+  width: 8px;
+  height: 8px;
+  border-radius: 999px;
+  background-color: hsl(var(--ms-success));
+}
+
+.html-preview-frame__label {
+  white-space: nowrap;
+}
+
+.html-preview-frame__close {
+  border: none;
+  background: transparent;
+  font-size: 20px;
+  line-height: 1;
+  cursor: pointer;
+  color: var(--modal-fg);
+}
+
+.html-preview-frame__iframe {
+  width: 100%;
+  height: 100%;
+  border: none;
+  display: block;
+}
+
+@media (max-width: 640px) {
+  .html-preview-frame {
+    width: 100vw;
+    height: 80vh;
+    border-radius: 0;
+  }
+}
+
+
+
+/* Minimal, safe defaults to reduce flicker during frequent text updates */
+.markstream-solid pre[class^='language-'],
+.markstream-solid pre[class*=' language-'] {
+  /* Ensure code layout is stable */
+  white-space: pre;
+  overflow: auto;
+  -moz-tab-size: var(--markstream-code-tab-size, 4);
+    -o-tab-size: var(--markstream-code-tab-size, 4);
+       tab-size: var(--markstream-code-tab-size, 4);
+  font-variant-ligatures: none;
+  /* Isolate painting/layout to this block to avoid ancestor reflow jank */
+  contain: content;
+  /* Hint GPU compositing on WebKit/Blink to reduce paint flashing */
+  backface-visibility: hidden;
+  transform: translateZ(0);
+  -webkit-font-smoothing: antialiased;
+}
+.markstream-solid pre[class^='language-'] > code,
+.markstream-solid pre[class*=' language-'] > code {
+  display: block;
+}
+
+.markstream-solid pre.is-wrap {
+  white-space: pre-wrap;
+  overflow-wrap: anywhere;
+  word-break: normal;
+}
+
+/* Match the finalized highlight surface's 2ch white split divider: pierre's
+   split lines carry 1ch inline padding on each side of the code content. The
+   left pane mirrors the text's 1ch right padding toward the seam; the right
+   pane already spaces its text 1ch past the line-number gutter
+   (`--markstream-pre-diff-line-number-gap-to-code`), so no extra left padding
+   is added there — adding one would push the right column's content one `ch`
+   away from the line numbers compared with the highlight surface. */
+
+/* Split view: the collapsed "N unmodified lines" pill must read as ONE
+   continuous pill spanning both columns (pierre's split separators meet at the
+   middle divider). The left pane extends its pill flush to its right edge and
+   the right pane starts flush at its own left edge, so the two halves abut
+   exactly at the column seam; the inner corners are squared so there is no
+   notch where they meet. */
+
+/* The modified (right) pane's collapsed row is only the empty half of the
+   continuous pill — the finalized surface renders the "N unmodified lines"
+   widget once on the original side. Hide the duplicated chevron/icon so the
+   right half stays clean (matches the highlight surface). */
+
+/* First collapsed region: flush against the top diff rows (pierre's
+   `data-separator-first` clears the leading margin). */
+
+/* Terminal collapsed region: the pill sits at the bottom of the pre and the
+   pre's own 8px bottom padding provides the gap (pierre's
+   `data-separator-last` clears the trailing margin). */
+
+/* Mirror pierre's `diffs-icon-expand` chevron occupying the 34px column left
+   of the "N unmodified lines" text, so the fallback pill matches the
+   finalized separator (same color, same position, non-interactive). */
+
+/* Keyboard accessibility: visible focus when scroll container is focused */
+.markstream-solid pre[class^='language-']:focus,
+.markstream-solid pre[class*=' language-']:focus {
+  outline: var(--ms-focus-ring-width) solid var(--focus-ring);
+  outline-offset: var(--ms-focus-ring-offset);
+}
+
+
+.markstream-solid .code-block-container { margin: var(--ms-flow-code-y, 16px) 0; border: 1px solid var(--code-border); border-radius: var(--ms-radius, 8px); overflow: visible; color: var(--code-fg); background: var(--code-bg); }
+.markstream-solid .code-block-header { display:flex; align-items:center; justify-content:space-between; gap:16px; border-bottom:1px solid var(--code-border); padding:8px 12px; background:var(--code-header-bg); color:var(--code-fg); }
+.markstream-solid .code-block-title,.markstream-solid .code-block-actions { display:flex;align-items:center;gap:8px;min-width:0; }
+.markstream-solid .code-block-title small { display:block;opacity:.6;font-size:11.2px; }
+.markstream-solid .code-language-icon { display:inline-flex;width:18.4px;height:18.4px;flex-shrink:0; }
+.markstream-solid .code-language-icon svg { width:100%;height:100%; }
+.markstream-solid .code-action-btn { cursor:pointer;border:0;border-radius:4px;padding:6px 8px;color:var(--code-action-fg);background:transparent;line-height:1.2;font:inherit;font-size:12px; }
+.markstream-solid .code-action-btn:hover,.markstream-solid .code-action-btn:focus-visible { background:var(--code-action-hover-bg);color:var(--code-action-hover-fg); }
+.markstream-solid .code-action-btn:disabled { opacity:.4;cursor:default; }
+.markstream-solid .code-more { position:relative; }
+.markstream-solid .code-more-menu { position:absolute;right:0;top:100%;z-index:20;min-width:176px;padding:4px;border:1px solid var(--code-border);border-radius:8px;background:hsl(var(--ms-popover));color:hsl(var(--ms-popover-foreground));box-shadow:0 8px 24px #0002; }
+.markstream-solid .code-more-menu button { display:block;text-align:left;width:100%; }
+.markstream-solid .code-diff-stats { display:flex;gap:6.4px;font-size:12px;font-variant-numeric:tabular-nums; }
+.markstream-solid .code-diff-stats .removed {color:#d14444;} .markstream-solid .code-diff-stats .added {color:#29934c;}
+.markstream-solid .code-block-body { min-width:0; } .markstream-solid .code-block-body pre {margin:0;}
+.markstream-solid .diagram-block-container { border:1px solid var(--diagram-border);border-radius:var(--ms-radius,8px);margin:16px 0;overflow:hidden;background:var(--diagram-bg); }
+.markstream-solid .diagram-preview { overflow:hidden;position:relative;display:flex;align-items:center;justify-content:center; }
+.markstream-solid .diagram-content { transform-origin:center;will-change:transform; }
+.markstream-solid .diagram-content svg { display:block;max-width:100%;height:auto; }
+.markstream-solid .diagram-zoom-controls {display:flex;justify-content:flex-end;gap:4px;padding:4px;border-top:1px solid var(--diagram-border);}
+.markstream-solid .diagram-modal-backdrop {position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;background:var(--modal-overlay,#000a);}
+.markstream-solid .diagram-modal {width:92vw;height:90vh;background:var(--modal-bg,#fff);color:var(--modal-fg);border-radius:12px;display:flex;flex-direction:column;overflow:hidden;}
+.markstream-solid .diagram-modal-surface {overflow:hidden;display:flex;align-items:center;justify-content:center;flex:1;}
+.markstream-solid .diagram-error {padding:16px;color:#b63737;}
+.markstream-solid .image-node {display:inline-block;position:relative;max-width:100%;}
+.markstream-solid .image-node img {max-width:100%;height:auto;display:block;}
+.markstream-solid .image-placeholder {position:absolute;inset:0;min-width:96px;min-height:32px;background:hsl(var(--ms-muted));font-size:12px;opacity:.6;pointer-events:none;}
+.markstream-solid .image-error {display:inline-block;padding:12px;border:1px solid var(--code-border);font-size:12.8px;}
+.markstream-solid .table-node-wrapper {overflow:auto;}
+.markstream-solid .table-node {width:100%;border-collapse:collapse;table-layout:fixed;}
+.markstream-solid .table-node th {position:relative;}
+.markstream-solid .table-node th,.markstream-solid .table-node td {border:1px solid var(--code-border);padding:8px 12px;vertical-align:top;}
+.markstream-solid .table-column-resize {position:absolute;right:-3px;top:0;bottom:0;width:6px;cursor:col-resize;touch-action:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;}
+.markstream-solid .link-node {position:relative;color:var(--link-color,#3b82f6);text-decoration:underline;text-decoration-thickness:var(--underline-height,2px);text-underline-offset:3px;}
+.markstream-solid .typewriter-cursor {top:0;left:0;width:2px;background:currentColor;pointer-events:none;animation:markstream-solid-cursor-blink 1s steps(1,end) infinite;}
+@keyframes markstream-solid-cursor-blink {50%{opacity:0}}
+.markstream-solid .admonition-node,.markstream-solid .vmr-container {padding:16px;border:1px solid var(--code-border);border-left-width:4px;border-radius:8px;margin:16px 0;}
+.markstream-solid .admonition-title {font-weight:600;}
+.markstream-solid .footnote-node {font-size:.875em;}
+.markstream-virtual-timeline .markstream-timeline-item {display:flow-root;}
+.markstream-virtual-timeline .markstream-timeline-default {padding:12px;white-space:pre-wrap;}
+.markstream-solid.typewriter-simple-cursor .typewriter-simple-cursor-target::after {content:'';display:inline-block;width:2px;height:1em;margin-left:2px;vertical-align:text-bottom;background:currentColor;animation:markstream-solid-cursor-blink 1s steps(1,end) infinite;}
+.markstream-solid .diagram-content {max-width:100%;min-width:0;width:100%;display:flex;align-items:center;justify-content:center;}
+.markstream-solid.code-block-container {margin:16px 0;border:1px solid var(--code-border);border-radius:var(--ms-radius,8px);color:var(--code-fg);background:var(--code-bg);}
+.markstream-solid.diagram-block-container {margin:16px 0;border:1px solid var(--diagram-border);border-radius:var(--ms-radius,8px);overflow:hidden;background:var(--diagram-bg);}
+
+.markstream-solid .code-block-header {padding:6px 10px;font-family:ui-sans-serif,system-ui,sans-serif;}
+.markstream-solid .code-header-main {gap:10px;}
+.markstream-solid .code-header-title {font-size:12px;color:hsl(var(--ms-muted-foreground));font-family:inherit;}
+.markstream-solid .code-header-actions {gap:2px;}
+.markstream-solid .code-block-container > .code-block-header .code-action-btn:not([role="menuitem"]) {width:26px;height:26px;padding:6px;line-height:1;}
+.markstream-solid .code-block-header .code-action-btn .action-icon {width:14px;height:14px;display:block;}
+
+.markstream-solid .math-block {position:relative;text-align:center;overflow-x:auto;min-height:40px;padding:0;}
+.markstream-solid .math-block__content .katex-display {margin:1em 0;}
+.markstream-solid .math-block__fallback {white-space:pre-wrap;overflow-wrap:anywhere;margin:0;text-align:left;}
+.markstream-solid .math-inline-wrapper {position:relative;display:inline-block;}
+.markstream-solid .math-inline {display:inline-block;vertical-align:middle;}
+.markstream-solid .math-inline--fallback {white-space:pre-wrap;}
+.markstream-solid .math-inline__loading {display:inline-flex;align-items:center;justify-content:center;pointer-events:none;}
+.markstream-solid .math-loading-overlay {position:absolute;inset:0;display:flex;align-items:center;justify-content:center;min-height:40px;}
+.markstream-solid .math-loading-spinner {width:20px;height:20px;border:2px solid #94a3b826;border-top-color:#94a3b8cc;border-radius:50%;animation:spin .8s linear infinite;}
+
+.markstream-solid .diagram-block-header {display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px 10px;border-bottom:1px solid var(--diagram-border);background:var(--diagram-header-bg);min-width:0;}
+.markstream-solid .diagram-header-label {display:flex;align-items:center;gap:8px;min-width:0;overflow:hidden;font:500 12px/1.75 var(--ms-font-mono,ui-monospace,SFMono-Regular,Menlo,monospace);color:var(--code-action-fg);}
+.markstream-solid .diagram-header-label > span:last-child {overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
+.markstream-solid .diagram-header-icon {display:inline-flex;width:14px;height:14px;flex:0 0 14px;}
+.markstream-solid .diagram-header-icon svg {width:100%;height:100%;display:block;}
+.markstream-solid .diagram-mode-toggle {display:flex;align-items:center;gap:2px;flex-shrink:0;}
+.markstream-solid .diagram-mode-btn {display:inline-flex;align-items:center;justify-content:center;gap:4px;width:auto;white-space:nowrap;word-break:normal;padding:2px 8px;font-size:12px;line-height:1.75;opacity:.6;}
+.markstream-solid .diagram-mode-btn[aria-pressed=true] {opacity:1;background:hsl(var(--ms-foreground)/.08);color:var(--code-fg);}
+.markstream-solid .diagram-header-actions {display:flex;align-items:center;gap:8px;flex-shrink:0;}
+.markstream-solid .diagram-header-actions .code-action-btn {display:inline-flex;align-items:center;justify-content:center;padding:6px;width:26px;height:26px;}
+.markstream-solid .diagram-block-header .action-icon,.markstream-solid .diagram-zoom-controls .action-icon {display:block;flex-shrink:0;width:14px;height:14px;}
+.markstream-solid .diagram-zoom-controls {position:absolute;top:8px;right:8px;z-index:1;display:flex;align-items:center;gap:8px;border:0;padding:0;backdrop-filter:blur(8px);}
+.markstream-solid .diagram-modal-header {display:flex;align-items:center;justify-content:space-between;padding:8px;}
+.markstream-solid .diagram-modal-header > div {display:flex;align-items:center;gap:8px;}
+
+.markstream-solid .heading-node {font-weight:500;line-height:1.25;color:inherit;}
+.markstream-solid .heading-1 {font-size:var(--ms-text-h1);line-height:var(--ms-leading-h1);font-weight:var(--ms-weight-h1);margin-top:var(--ms-flow-heading-1-mt);margin-bottom:var(--ms-flow-heading-1-mb);}
+.markstream-solid .heading-2 {font-size:var(--ms-text-h2);line-height:var(--ms-leading-h2);font-weight:var(--ms-weight-h2);margin-top:var(--ms-flow-heading-2-mt);margin-bottom:var(--ms-flow-heading-2-mb);}
+.markstream-solid .heading-3 {font-size:var(--ms-text-h3);line-height:var(--ms-leading-h3);font-weight:var(--ms-weight-h3);margin-top:var(--ms-flow-heading-3-mt);margin-bottom:var(--ms-flow-heading-3-mb);}
+.markstream-solid .heading-4 {font-size:var(--ms-text-h4);font-weight:var(--ms-weight-h4);margin-top:var(--ms-flow-heading-4-mt);margin-bottom:var(--ms-flow-heading-4-mb);}
+.markstream-solid .heading-5 {font-size:var(--ms-text-h5);margin-top:var(--ms-flow-heading-5-mt);margin-bottom:var(--ms-flow-heading-5-mb);}
+.markstream-solid .heading-6 {font-size:var(--ms-text-h6);margin-top:var(--ms-flow-heading-6-mt);margin-bottom:var(--ms-flow-heading-6-mb);}
+.markstream-solid .paragraph-node {font-size:var(--ms-text-body);line-height:var(--ms-leading-body);margin:var(--ms-flow-paragraph-y) 0;}
+.markstream-solid li .paragraph-node {margin:0;}
+.markstream-solid .blockquote {display:block;font-weight:400;font-style:normal;color:var(--blockquote-fg,hsl(var(--ms-muted-foreground)));border-left:3px solid var(--blockquote-border);margin:var(--ms-flow-blockquote-y) 0;padding-left:var(--ms-flow-blockquote-indent);}
+.markstream-solid .blockquote > .paragraph-node:first-child {margin-top:0;}
+.markstream-solid .blockquote > .paragraph-node:last-child {margin-bottom:0;}
+.markstream-solid .blockquote-content,.markstream-solid .footnote-node__content {content-visibility:visible;contain:content;contain-intrinsic-size:0px 0px;}
+.markstream-solid .list-node {margin:var(--ms-flow-list-y) 0;padding-left:var(--ms-flow-list-indent);}
+.markstream-solid .list-decimal {list-style-type:decimal;}
+.markstream-solid .list-disc {list-style-type:disc;}
+.markstream-solid .list-item {margin:var(--ms-flow-list-item-y) 0;padding-left:var(--ms-space-1_5);}
+.markstream-solid .highlight-node {background:var(--highlight-bg);padding:0 3.2px;border-radius:.2em;}
+.markstream-solid .subscript-node {font-size:.8em;vertical-align:sub;}
+.markstream-solid .superscript-node {font-size:.8em;vertical-align:super;}
+.markstream-solid .hr-node {margin:var(--ms-flow-hr-y) 0;border-color:var(--hr-border);}
+.markstream-solid .inline-code {display:inline;font-family:var(--ms-font-mono);font-size:.8125em;font-weight:inherit;line-height:inherit;color:var(--inline-code-fg);background:var(--inline-code-bg);padding:.15em .35em;border-radius:.25em;white-space:normal;word-break:break-word;max-width:100%;-webkit-box-decoration-break:clone;box-decoration-break:clone;}
+.markstream-solid .table-node {table-layout:fixed;border-collapse:separate;border-spacing:0;margin:var(--ms-flow-table-y) 0;font-size:inherit;border:1px solid var(--table-border);border-radius:var(--ms-radius);overflow:hidden;box-shadow:var(--ms-shadow-subtle);}
+.markstream-solid .table-node th,.markstream-solid .table-node td {border:0;border-bottom:1px solid var(--table-border);border-right:1px solid var(--table-border);padding:var(--ms-flow-table-cell);vertical-align:middle;white-space:normal;overflow-wrap:break-word;word-break:normal;}
+.markstream-solid .table-node th:last-child,.markstream-solid .table-node td:last-child {border-right:0;}
+.markstream-solid .table-node tbody tr:last-child td {border-bottom:0;}
+.markstream-solid .table-node thead th {position:relative;font-weight:600;background:var(--table-header-bg);border-bottom-width:2px;}
+.markstream-solid .image-node img {display:inline-block;border-radius:0;}
+.markstream-solid li:has(.checkbox-node) {list-style-type:none;margin-left:calc(-1 * var(--ms-flow-list-indent));}
+@media (max-width:1023px) {.markstream-solid .list-disc {margin-top:calc(4/3*1em);margin-bottom:calc(4/3*1em);padding-left:var(--ms-flow-list-indent-mobile);}}
+.markstream-solid .diagram-block-header {gap:normal;}
+.markstream-solid .infographic-block-header {color:hsl(var(--ms-foreground));}
+.markstream-solid .code-block-header {font-family:var(--ms-font-sans);}
+.markstream-solid .checkbox-node {display:inline-flex;align-items:center;margin-right:.5em;vertical-align:-.15em;}
+.markstream-solid .checkbox-icon {flex-shrink:0;}
+.markstream-solid .checkbox-unchecked {color:hsl(var(--ms-muted-foreground)/.5);}
+.markstream-solid .checkbox-checked {color:hsl(var(--ms-info));}
+.markstream-solid .reference-node {background:hsl(var(--ms-muted));color:hsl(var(--ms-muted-foreground));cursor:pointer;font-size:12px;border-radius:6px;padding:0 6px;margin:0 2px;}
+.markstream-solid .admonition {position:relative;margin:var(--ms-flow-admonition-y) 0;padding:.25em .75em .375em;border:1px solid var(--admonition-border);border-radius:var(--ms-radius);color:var(--admonition-fg);}
+.markstream-solid .admonition-legend {position:absolute;top:0;left:.75em;transform:translateY(-50%);display:inline-flex;align-items:center;gap:.35em;padding:0 .5em;background:hsl(var(--ms-background));font-size:13px;font-weight:600;line-height:1;}
+.markstream-solid .admonition-icon {flex-shrink:0;}
+.markstream-solid .admonition-title {white-space:nowrap;}
+.markstream-solid .admonition-content {padding-top:.25em;color:var(--admonition-fg);}
+.markstream-solid .admonition-note,.markstream-solid .admonition-info {border-color:hsl(var(--ms-info)/.3);background:hsl(var(--ms-info)/.04);}
+.markstream-solid .admonition-note .admonition-legend,.markstream-solid .admonition-info .admonition-legend {color:var(--admonition-note);}
+.markstream-solid .admonition-tip {border-color:hsl(var(--ms-success)/.3);background:hsl(var(--ms-success)/.04);}
+.markstream-solid .admonition-tip .admonition-legend {color:var(--admonition-tip);}
+.markstream-solid .admonition-warning,.markstream-solid .admonition-caution {border-color:hsl(var(--ms-warning)/.3);background:hsl(var(--ms-warning)/.04);}
+.markstream-solid .admonition-warning .admonition-legend,.markstream-solid .admonition-caution .admonition-legend {color:var(--admonition-warning);}
+.markstream-solid .admonition-danger,.markstream-solid .admonition-error {border-color:hsl(var(--ms-destructive)/.3);background:hsl(var(--ms-destructive)/.04);}
+.markstream-solid .admonition-danger .admonition-legend,.markstream-solid .admonition-error .admonition-legend {color:var(--admonition-danger);}
+.markstream-solid .admonition-toggle {margin-left:.25em;background:transparent;border:0;color:inherit;cursor:pointer;padding:2px;border-radius:calc(var(--ms-radius)*.5);display:inline-flex;align-items:center;}
+.markstream-solid.virtualized .node-slot,.markstream-solid.virtualized .node-content,.markstream-solid.virtual-scroll-coordinated .node-slot,.markstream-solid.virtual-scroll-coordinated .node-content {display:flow-root;}
+.markstream-solid .footnote-node {display:flex;font-size:14px;line-height:1.625;margin:var(--ms-flow-footnote-y) 0;border-top:1px solid var(--footnote-border);padding-top:8px;}
+.markstream-solid .code-pre-fallback code {color:inherit;font:inherit;background:transparent;}
+.markstream-solid.markdown-renderer {contain-intrinsic-size:auto 800px auto 0px;}
+.markstream-solid.markdown-renderer.virtualized,.markstream-solid.markdown-renderer.virtual-scroll-coordinated {content-visibility:visible;contain-intrinsic-size:none;}
+.markstream-solid .text-node-stream-delta {animation:markstream-solid-stream-fade var(--stream-update-fade-duration,var(--fade-duration,200ms)) var(--stream-update-fade-ease,var(--fade-ease,cubic-bezier(.2,0,.4,1))) both;}
+@keyframes markstream-solid-stream-fade {from{opacity:0}to{opacity:1}}
+@media (prefers-reduced-motion:reduce) {.markstream-solid .text-node-stream-delta {animation-duration:0s!important;}}
+.markstream-solid .heading-node {letter-spacing:normal;}
+.markstream-solid .math-loading-spinner {border-color:color-mix(in srgb,var(--loading-spinner) 15%,transparent);border-top-color:color-mix(in srgb,var(--loading-spinner) 80%,transparent);}
+.markstream-solid .reference-node {line-height:16px;}
+.markstream-solid .reference-node:hover {background:hsl(var(--ms-secondary));}
+.markstream-solid .footnote-reference {font-size:.75em;line-height:0;}
+.markstream-solid .table-node-wrapper {position:relative;max-width:100%;overflow-x:auto;scrollbar-gutter:stable;overscroll-behavior-x:contain;}
+.markstream-solid .table-node--loading tbody td {position:relative;overflow:hidden;}
+.markstream-solid .table-node--loading tbody td > * {visibility:hidden;}
+.markstream-solid .table-node--loading tbody td::after {content:'';position:absolute;inset:0;border-radius:calc(var(--ms-radius)*.5);background:var(--loading-shimmer);}
+.markstream-solid .table-node__loading {position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none;}
+.markstream-solid .table-node__spinner {width:40px;height:40px;border-radius:9999px;border:2px solid color-mix(in srgb,var(--loading-spinner) 25%,transparent);border-top-color:color-mix(in srgb,var(--loading-spinner) 80%,transparent);animation:spin 1s linear infinite;}
+.markstream-solid .link-node {position:static;text-decoration:none;}
+.markstream-solid .link-node:hover {text-decoration:underline;}
+.markstream-solid .footnote-reference {vertical-align:baseline;}
+.markstream-solid .footnote-anchor {font-size:14px;line-height:20px;margin-left:8px;color:var(--link-color);}
+.markstream-solid .footnote-link {color:var(--link-color);text-decoration:none;}
+.markstream-solid .footnote-link:hover {text-decoration:underline;}
+.markstream-solid .emoji-node {display:inline-block;}
+.markstream-solid .diagram-source-panel {padding:var(--ms-inset-panel-body);background:var(--diagram-bg);}
+.markstream-solid .diagram-source-code {margin:0;padding:0;font-family:var(--ms-font-mono);font-size:14px;line-height:20px;white-space:pre-wrap;text-align:left;color:hsl(var(--ms-foreground));background:transparent;border:0;border-radius:0;}
+.markstream-solid .d2-source-code {white-space:pre;line-height:1.5;}