@linloir/limr 0.1.0 → 1.0.1

package/benchmarks/results/streaming-browser.json

@@ -0,0 +1,77 @@
+{
+  "date": "2026-10-13T14:19:53.397Z",
+  "browser": "156.0.8078.4",
+  "measurement": "Production Vite/React, default modules, typography and increment animations; Reader without TOC/sidebar. Three isolated warmed pages per scenario. React synchronous commit plus forced layout; idle rAF time, network and async highlighting excluded. Current implementation only.",
+  "results": [
+    {
+      "scenario": "standard",
+      "characters": 34860,
+      "chunkSize": 256,
+      "median": {
+        "updates": 137,
+        "totalMs": 334.69999980926514,
+        "p95Ms": 3.900000035762787,
+        "maxMs": 7.300000011920929,
+        "elements": 2979
+      },
+      "samples": [
+        {
+          "updates": 137,
+          "totalMs": 331.3000004887581,
+          "p95Ms": 3.5,
+          "maxMs": 8.400000035762787,
+          "elements": 2979
+        },
+        {
+          "updates": 137,
+          "totalMs": 343.80000019073486,
+          "p95Ms": 3.800000011920929,
+          "maxMs": 8.099999964237213,
+          "elements": 2979
+        },
+        {
+          "updates": 137,
+          "totalMs": 334.69999980926514,
+          "p95Ms": 3.900000035762787,
+          "maxMs": 7.300000011920929,
+          "elements": 2979
+        }
+      ]
+    },
+    {
+      "scenario": "growing-code",
+      "characters": 43211,
+      "chunkSize": 256,
+      "median": {
+        "updates": 169,
+        "totalMs": 294.200000166893,
+        "p95Ms": 2.599999964237213,
+        "maxMs": 12.400000035762787,
+        "elements": 33
+      },
+      "samples": [
+        {
+          "updates": 169,
+          "totalMs": 294.200000166893,
+          "p95Ms": 2.599999964237213,
+          "maxMs": 12.400000035762787,
+          "elements": 33
+        },
+        {
+          "updates": 169,
+          "totalMs": 281.5000005364418,
+          "p95Ms": 2.300000011920929,
+          "maxMs": 10.699999988079071,
+          "elements": 34
+        },
+        {
+          "updates": 169,
+          "totalMs": 304,
+          "p95Ms": 3,
+          "maxMs": 13.300000011920929,
+          "elements": 35
+        }
+      ]
+    }
+  ]
+}

package/benchmarks/results/streaming.json

@@ -0,0 +1,357 @@
+{
+  "date": "2026-10-13T14:19:35.764Z",
+  "node": "v20.19.5",
+  "cpu": "13th Gen Intel(R) Core(TM) i7-13700",
+  "baseline": "ebab99154ada9a61bf0e3a0bfbc8c7e943feee7c",
+  "measurement": "Core append plus finalization. Five alternating warmed trials; median by total time. Same dependencies, UTF-16 input and chunk boundaries. Rendering, layout, syntax highlighting and network are excluded.",
+  "results": [
+    {
+      "scenario": "gfm",
+      "characters": 34860,
+      "chunkSize": 256,
+      "measurements": {
+        "current": {
+          "median": {
+            "totalMs": 89.06527600000004,
+            "p95Ms": 1.171282999999903,
+            "maxMs": 1.9022370000000137,
+            "finishMs": 0.34038600000008046
+          },
+          "samples": [
+            {
+              "totalMs": 91.39315399999998,
+              "p95Ms": 1.185141999999928,
+              "maxMs": 3.050705999999991,
+              "finishMs": 0.3589269999999942
+            },
+            {
+              "totalMs": 87.85499000000004,
+              "p95Ms": 1.3831660000000738,
+              "maxMs": 3.741890000000012,
+              "finishMs": 0.2768620000001647
+            },
+            {
+              "totalMs": 89.06527600000004,
+              "p95Ms": 1.171282999999903,
+              "maxMs": 1.9022370000000137,
+              "finishMs": 0.34038600000008046
+            },
+            {
+              "totalMs": 92.94587500000011,
+              "p95Ms": 1.342890000000125,
+              "maxMs": 2.8518779999999424,
+              "finishMs": 0.34800099999984013
+            },
+            {
+              "totalMs": 88.03629999999998,
+              "p95Ms": 1.062398999999914,
+              "maxMs": 3.07391500000017,
+              "finishMs": 0.2814010000001872
+            }
+          ]
+        },
+        "baseline": {
+          "median": {
+            "totalMs": 139.221266,
+            "p95Ms": 1.43726300000003,
+            "maxMs": 3.0861139999999523,
+            "finishMs": 36.00974499999995
+          },
+          "samples": [
+            {
+              "totalMs": 139.221266,
+              "p95Ms": 1.43726300000003,
+              "maxMs": 3.0861139999999523,
+              "finishMs": 36.00974499999995
+            },
+            {
+              "totalMs": 139.91041299999995,
+              "p95Ms": 1.5241469999999708,
+              "maxMs": 2.2273830000000316,
+              "finishMs": 36.47520199999997
+            },
+            {
+              "totalMs": 128.7012440000001,
+              "p95Ms": 1.498747000000094,
+              "maxMs": 2.0280199999999695,
+              "finishMs": 32.749250000000075
+            },
+            {
+              "totalMs": 135.77528900000016,
+              "p95Ms": 1.6348089999999047,
+              "maxMs": 2.581604999999854,
+              "finishMs": 37.24695500000007
+            },
+            {
+              "totalMs": 148.9168790000001,
+              "p95Ms": 1.577359000000115,
+              "maxMs": 1.8855259999997998,
+              "finishMs": 46.68065299999989
+            }
+          ]
+        }
+      }
+    },
+    {
+      "scenario": "standard",
+      "characters": 34860,
+      "chunkSize": 256,
+      "measurements": {
+        "current": {
+          "median": {
+            "totalMs": 94.62975000000006,
+            "p95Ms": 1.226701999999932,
+            "maxMs": 1.8527490000001308,
+            "finishMs": 0.3568080000000009
+          },
+          "samples": [
+            {
+              "totalMs": 99.32511599999998,
+              "p95Ms": 1.166323000000375,
+              "maxMs": 2.4412569999999505,
+              "finishMs": 0.3740309999998317
+            },
+            {
+              "totalMs": 103.67979299999979,
+              "p95Ms": 1.364842999999837,
+              "maxMs": 2.0434229999996205,
+              "finishMs": 0.36833300000034797
+            },
+            {
+              "totalMs": 94.62975000000006,
+              "p95Ms": 1.226701999999932,
+              "maxMs": 1.8527490000001308,
+              "finishMs": 0.3568080000000009
+            },
+            {
+              "totalMs": 89.93437799999992,
+              "p95Ms": 1.4441069999998035,
+              "maxMs": 2.6483499999999367,
+              "finishMs": 0.34338500000012573
+            },
+            {
+              "totalMs": 89.22391799999968,
+              "p95Ms": 1.486648999999943,
+              "maxMs": 1.8704970000003414,
+              "finishMs": 0.28617099999974016
+            }
+          ]
+        },
+        "baseline": {
+          "median": {
+            "totalMs": 141.40319799999997,
+            "p95Ms": 1.4039769999999407,
+            "maxMs": 2.470600999999988,
+            "finishMs": 34.666573999999855
+          },
+          "samples": [
+            {
+              "totalMs": 160.21205999999984,
+              "p95Ms": 1.7312900000001719,
+              "maxMs": 2.604899999999816,
+              "finishMs": 42.263388999999734
+            },
+            {
+              "totalMs": 157.7413550000001,
+              "p95Ms": 1.7623570000000655,
+              "maxMs": 3.413104999999632,
+              "finishMs": 39.673129000000245
+            },
+            {
+              "totalMs": 140.3145129999998,
+              "p95Ms": 1.2951160000002346,
+              "maxMs": 1.6633320000000822,
+              "finishMs": 36.181274999999914
+            },
+            {
+              "totalMs": 139.2373090000001,
+              "p95Ms": 1.2822190000001683,
+              "maxMs": 1.8564060000003337,
+              "finishMs": 37.97901400000001
+            },
+            {
+              "totalMs": 141.40319799999997,
+              "p95Ms": 1.4039769999999407,
+              "maxMs": 2.470600999999988,
+              "finishMs": 34.666573999999855
+            }
+          ]
+        }
+      }
+    },
+    {
+      "scenario": "growing-code",
+      "characters": 43209,
+      "chunkSize": 128,
+      "measurements": {
+        "current": {
+          "median": {
+            "totalMs": 29.05458499999986,
+            "p95Ms": 0.07175000000097498,
+            "maxMs": 7.814548000000286,
+            "finishMs": 6.639192000000548
+          },
+          "samples": [
+            {
+              "totalMs": 31.501055999999153,
+              "p95Ms": 0.07259000000067317,
+              "maxMs": 7.657408999999461,
+              "finishMs": 8.405789999999797
+            },
+            {
+              "totalMs": 29.043093999999655,
+              "p95Ms": 0.06668300000001182,
+              "maxMs": 7.89716800000042,
+              "finishMs": 7.1266969999996945
+            },
+            {
+              "totalMs": 34.70156400000087,
+              "p95Ms": 0.06666699999914272,
+              "maxMs": 8.81749200000013,
+              "finishMs": 11.916243000000577
+            },
+            {
+              "totalMs": 27.024387999999817,
+              "p95Ms": 0.06571500000063679,
+              "maxMs": 7.245672999999442,
+              "finishMs": 6.643808999999237
+            },
+            {
+              "totalMs": 29.05458499999986,
+              "p95Ms": 0.07175000000097498,
+              "maxMs": 7.814548000000286,
+              "finishMs": 6.639192000000548
+            }
+          ]
+        },
+        "baseline": {
+          "median": {
+            "totalMs": 1335.872523,
+            "p95Ms": 7.245639000000665,
+            "maxMs": 10.973995000000286,
+            "finishMs": 7.3576929999999265
+          },
+          "samples": [
+            {
+              "totalMs": 1335.872523,
+              "p95Ms": 7.245639000000665,
+              "maxMs": 10.973995000000286,
+              "finishMs": 7.3576929999999265
+            },
+            {
+              "totalMs": 1326.274002,
+              "p95Ms": 7.014228000000003,
+              "maxMs": 12.445556000000579,
+              "finishMs": 7.228640000000269
+            },
+            {
+              "totalMs": 1418.6740360000003,
+              "p95Ms": 8.239763999999923,
+              "maxMs": 14.58256099999926,
+              "finishMs": 6.973140000000058
+            },
+            {
+              "totalMs": 1253.9393839999993,
+              "p95Ms": 6.971345999998448,
+              "maxMs": 9.23040199999923,
+              "finishMs": 6.990519999999378
+            },
+            {
+              "totalMs": 1460.0512850000014,
+              "p95Ms": 8.281401999998707,
+              "maxMs": 11.391765000000305,
+              "finishMs": 7.17864599999848
+            }
+          ]
+        }
+      }
+    },
+    {
+      "scenario": "long-paragraph",
+      "characters": 7840,
+      "chunkSize": 128,
+      "measurements": {
+        "current": {
+          "median": {
+            "totalMs": 74.3154510000004,
+            "p95Ms": 2.3149130000001605,
+            "maxMs": 2.428404000000228,
+            "finishMs": 2.6850159999994503
+          },
+          "samples": [
+            {
+              "totalMs": 74.3154510000004,
+              "p95Ms": 2.3149130000001605,
+              "maxMs": 2.428404000000228,
+              "finishMs": 2.6850159999994503
+            },
+            {
+              "totalMs": 74.49110699999983,
+              "p95Ms": 2.0422170000001643,
+              "maxMs": 2.207414999998946,
+              "finishMs": 2.4779399999988527
+            },
+            {
+              "totalMs": 71.64176199999929,
+              "p95Ms": 2.2076100000012957,
+              "maxMs": 2.4227049999990413,
+              "finishMs": 1.9338840000000346
+            },
+            {
+              "totalMs": 71.10443200000009,
+              "p95Ms": 2.0364410000001953,
+              "maxMs": 2.633443000000625,
+              "finishMs": 2.517675999999483
+            },
+            {
+              "totalMs": 75.18800999999985,
+              "p95Ms": 2.2747699999999895,
+              "maxMs": 2.808483000000706,
+              "finishMs": 2.1569129999988945
+            }
+          ]
+        },
+        "baseline": {
+          "median": {
+            "totalMs": 72.4345570000005,
+            "p95Ms": 2.2167799999988347,
+            "maxMs": 2.6973809999999503,
+            "finishMs": 2.005934000000707
+          },
+          "samples": [
+            {
+              "totalMs": 71.58244899999954,
+              "p95Ms": 2.1129600000003848,
+              "maxMs": 2.415530000000217,
+              "finishMs": 1.925279999999475
+            },
+            {
+              "totalMs": 72.4345570000005,
+              "p95Ms": 2.2167799999988347,
+              "maxMs": 2.6973809999999503,
+              "finishMs": 2.005934000000707
+            },
+            {
+              "totalMs": 73.05818700000054,
+              "p95Ms": 2.3213269999996555,
+              "maxMs": 2.667983000001186,
+              "finishMs": 1.9141130000007252
+            },
+            {
+              "totalMs": 70.90283699999964,
+              "p95Ms": 2.136710000000676,
+              "maxMs": 2.787261999999828,
+              "finishMs": 1.9099530000003142
+            },
+            {
+              "totalMs": 78.5518319999992,
+              "p95Ms": 2.3536110000004555,
+              "maxMs": 3.2725900000004913,
+              "finishMs": 2.1518209999994724
+            }
+          ]
+        }
+      }
+    }
+  ]
+}

package/dist/base.css

@@ -1,5 +1,10 @@
 /* LiMR classic skin. Local assets only; unlayered application CSS wins. */
 
+/* Viewport coordinates change on every scroll. They belong to the mask host,
+   never its text descendants; inheriting them invalidates the entire article. */
+@property --limr-fade-start { syntax: '<length>'; inherits: false; initial-value: 0px; }
+@property --limr-fade-end { syntax: '<length>'; inherits: false; initial-value: 0px; }
+
 @layer limr {
   :where([data-limr-appearance]) {
     --limr-ease: cubic-bezier(.16, 1, .3, 1);
@@ -62,8 +67,21 @@
       --limr-link: #8bb8e3; --limr-selection: #6e88c955; --limr-shadow: #0006;
     }
   }
-  .limr-prose { width: 100%; min-width: 0; font-size: var(--limr-font-size, 1rem); line-height: var(--limr-line-height, 1.8); font-feature-settings: var(--limr-font-features, 'palt' 1); overflow-wrap: break-word; --limr-paragraph-align: start; }
+  .limr-prose { width: 100%; min-width: 0; font-size: var(--limr-font-size, 1rem); line-height: var(--limr-line-height, 1.8); font-feature-settings: var(--limr-font-features, normal); text-spacing-trim: var(--limr-punctuation-spacing, space-all); overflow-wrap: break-word; --limr-paragraph-align: start; }
   .limr-prose[data-limr-justify='true'] { --limr-paragraph-align: justify; }
+  .limr-prose[data-limr-typography='pretty'] :where(p,.limr-paragraph,li,figcaption) { text-wrap: pretty; }
+  .limr-prose[data-limr-typography='pretty'] :where(h1,h2,h3,h4,h5,h6) { text-wrap: balance; }
+  /* Stable native wrapping prevents earlier lines moving for every token. */
+  .limr-prose[data-limr-typography='pretty'] :where([data-pending], [data-pending] p, [data-pending] li, [data-pending] .limr-paragraph) { text-wrap: wrap; text-wrap: stable; }
+  .limr-block-loading { display: flex; align-items: center; min-height: 3rem; padding-block: .5rem; }
+  .limr-loading { display: inline-flex; flex: none; width: 22px; height: 22px; line-height: 0; color: var(--limr-secondary, #7b7975); }
+  .limr-loading svg { display: block; width: 100%; height: 100%; overflow: visible; }
+  .limr-loading circle { fill: none; stroke-width: 4; }
+  .limr-loading-track { stroke: currentColor; opacity: .17; }
+  .limr-loading-orbit { transform-box: view-box; transform-origin: 16px 16px; animation: limr-loading-orbit 1.55s cubic-bezier(.65,0,.35,1) infinite; }
+  .limr-loading-arc { stroke: currentColor; stroke-linecap: round; stroke-dasharray: 3 97; transform: rotate(-90deg); transform-box: view-box; transform-origin: 16px 16px; animation: limr-loading-arc 1.55s cubic-bezier(.65,0,.35,1) infinite; }
+  @keyframes limr-loading-orbit { 0% { transform: rotate(0deg); } 50% { transform: rotate(300deg); } 100% { transform: rotate(720deg); } }
+  @keyframes limr-loading-arc { 0% { stroke-dasharray: 3 97; stroke-dashoffset: 0; } 46%,57% { stroke-dasharray: 92 8; stroke-dashoffset: -4; } 100% { stroke-dasharray: 3 97; stroke-dashoffset: -100; } }
   .limr-prose :where(p,.limr-paragraph,li) { text-align: var(--limr-paragraph-align); text-align-last: start; text-justify: auto; }
   .limr-prose ::selection { background: var(--limr-selection, #667eea4d); }
   .limr-prose { position: relative; isolation: isolate; transition: translate var(--limr-motion) var(--limr-ease); }
@@ -82,6 +100,7 @@
   .limr-highlight[data-hidden] { background: transparent; text-decoration: none; }
   .limr-paint-background { background: color-mix(in srgb, var(--limr-highlight) 30%, transparent); }
   .limr-paint-background:is([data-hovered],[data-active]) { background: color-mix(in srgb, var(--limr-highlight) 48%, transparent); }
+  .limr-paint-background[data-reference] { background: color-mix(in srgb, var(--limr-highlight) 18%, transparent); }
   .limr-highlight-layer .limr-paint-rect:is([data-hovered],[data-active]):not(.limr-paint-background) { background-color: color-mix(in srgb, var(--limr-highlight) 14%, transparent); }
   .limr-highlight { cursor: pointer; }
   .limr-paint-selection { background: var(--limr-selection, #667eea4d); z-index: 1; }
@@ -318,9 +337,9 @@
   .limr-sidebar-card { color: var(--limr-annotation-text, var(--limr-text, #1a1a1a)); min-width: 0; transition: top var(--limr-motion-slow) var(--limr-ease), border-color var(--limr-motion) var(--limr-ease), background-color var(--limr-motion) var(--limr-ease); }
   .limr-sidebar-card:not([data-default-card]),.limr-sidebar-card-body { border-inline-start: 2px solid var(--limr-annotation-border, var(--limr-annotation-color, var(--limr-border-strong, #d5d0c8))); background: var(--limr-background, #fffefa); padding: var(--limr-sidebar-padding-block, .65rem) var(--limr-sidebar-padding-inline, 10px) calc(var(--limr-sidebar-padding-block, .65rem) + 2px); }
   .limr-sidebar-card[data-locked] { z-index: 1; transition-property: border-color, background-color; }
-  .limr-sidebar[data-resizing] > .limr-sidebar-card { transition-property: border-color, background-color; }
+  .limr-sidebar:is([data-resizing],[data-releasing]) > .limr-sidebar-card { transition-property: border-color, background-color; }
   .limr-sidebar-card[data-default-card] { display: flex; flex-direction: column; }
-  .limr-sidebar-card[data-default-card][data-expanded] { max-height: var(--limr-sidebar-card-height, none); }
+  .limr-sidebar-card[data-default-card] { max-height: var(--limr-sidebar-card-height, none); }
   .limr-sidebar-card-body { display: flex; flex-direction: column; min-height: 0; transition: border-color var(--limr-motion) var(--limr-ease), background-color var(--limr-motion) var(--limr-ease); }
   .limr-sidebar-card-body > .limr-collapse { min-height: 0; }
   /* Preview and details trade height; fading both can leave a blank card when
@@ -398,8 +417,9 @@
   .limr-toolbar-item { display: flex; align-items: center; border-radius: 3px; transition: color 240ms var(--limr-ease); }
   [data-ready] .limr-toolbar-item { animation: limr-tool-float 330ms cubic-bezier(.16,1,.3,1) calc(30ms + var(--limr-tool-index) * 22ms) both, limr-tool-fade 210ms cubic-bezier(.22,.7,.3,1) calc(65ms + var(--limr-tool-index) * 22ms) both; }
   .limr-toolbar-action { display: inline-grid; place-items: center; flex: none; min-height: 34px; padding: 5px 7px; border: 0; border-radius: 3px; background: transparent; white-space: nowrap; line-height: 1.5; }
-  .limr-tool-face { display: flex; align-items: center; justify-self: start; grid-area: 1 / 1; gap: 5px; width: 0; min-width: 0; line-height: 1.5; opacity: 0; pointer-events: none; transition: opacity 240ms var(--limr-ease); }
-  .limr-tool-face[data-visible] { width: auto; opacity: 1; }
+  .limr-tool-faces { display: inline-grid; min-width: 0; transition: width 320ms var(--limr-ease); }
+  .limr-tool-face { display: flex; align-items: center; justify-self: start; grid-area: 1 / 1; gap: 5px; width: max-content; min-width: 0; line-height: 1.5; opacity: 0; transform: translateY(2px) scale(.94); transform-origin: left center; pointer-events: none; transition: opacity 220ms var(--limr-ease), transform 320ms var(--limr-ease); }
+  .limr-tool-face[data-visible] { opacity: 1; transform: none; }
   .limr-tool-label { display: block; flex: none; padding-block-end: 1px; }
   .limr-tool-face > .limr-tool-icon { animation: limr-tool-fade 240ms var(--limr-ease) both; }
   .limr-toolbar-item[data-status='success'] { color: var(--limr-success, #52885e); }
@@ -408,11 +428,12 @@
   .limr-tool-icon :where(*) { max-inline-size: 100% !important; max-block-size: 100% !important; min-inline-size: 0 !important; min-block-size: 0 !important; }
   .limr-tool-icon :where(svg,img) { display: block; width: 100% !important; height: 100% !important; object-fit: contain; flex: none; }
   .limr-tool-icon :where(div,span,i,b,strong,em) { display: inline-flex; align-items: center; justify-content: center; font-size: inherit !important; line-height: 1 !important; }
-  .limr-toolbar-panel { display: flex; width: 100%; min-width: 0; min-height: 0; align-self: stretch; max-height: var(--limr-toolbar-panel-height, 260px); overflow: hidden; text-align: start; margin-top: 4px; border-top: 1px solid var(--limr-toolbar-border, var(--limr-border, #e5e2dc)); animation: limr-tool-float 300ms cubic-bezier(.16,1,.3,1) both, limr-tool-fade 220ms ease 35ms both; }
+  /* Only the actions determine toolbar width. Panel contents cannot enlarge it. */
+  .limr-toolbar-panel { display: flex; contain: inline-size; min-width: 0; min-height: 0; align-self: stretch; max-height: var(--limr-toolbar-panel-height, 260px); overflow: hidden; text-align: start; margin-top: 4px; border-top: 1px solid var(--limr-toolbar-border, var(--limr-border, #e5e2dc)); animation: limr-tool-float 300ms cubic-bezier(.16,1,.3,1) both, limr-tool-fade 220ms ease 35ms both; }
   .limr-toolbar-panel .limr-overlay-content { padding: 10px 9px 4px; scroll-padding-block: 8px; }
-  .limr-toolbar-panel .limr-overlay-scroll-inner { width: var(--limr-toolbar-panel-width, 246px); max-width: 100%; min-width: 0; overflow-wrap: anywhere; }
+  .limr-toolbar-panel .limr-overlay-scroll { width: 100%; min-width: 0; }
+  .limr-toolbar-panel .limr-overlay-scroll-inner { width: 100%; min-width: 0; overflow-wrap: anywhere; }
   .limr-toolbar-panel :where(input,textarea,select,img) { max-width: 100%; }
-  .limr-selection-toolbar[data-expanded] .limr-toolbar-surface { min-width: min(calc(var(--limr-toolbar-panel-width, 246px) + 30px), calc(100vw - 20px)); }
   [data-placement^='top'] .limr-toolbar-panel { order: -1; border-top: 0; border-bottom: 1px solid var(--limr-toolbar-border, var(--limr-border, #e5e2dc)); margin-top: 0; margin-bottom: 4px; }
   .limr-toolbar-swatch { position: relative; width: 24px; height: 24px; margin: 3px 12px 3px 5px; padding: 0; border: 1px solid color-mix(in srgb, var(--swatch) 60%, transparent); border-radius: var(--limr-toolbar-swatch-radius, 4px); background: color-mix(in srgb, var(--swatch) 30%, transparent); transition: scale 240ms var(--limr-ease); --limr-highlight: var(--swatch); }
   .limr-toolbar-swatch:hover { scale: 1.07; }
@@ -421,6 +442,8 @@
   .limr-toolbar-delete-warning[aria-hidden='true'] { visibility: hidden; }
   [data-placement^='top'] .limr-toolbar-delete-warning { order: -1; }
   .limr-toolbar-delete-hint { margin: 4px 8px 5px; font-size: 11px; color: var(--limr-error, #b45858); }
+  .limr-selection-toolbar[data-readonly] { width: max-content; }
+  .limr-toolbar-readonly-hint { margin: 4px 8px 5px; font-size: 11px; line-height: 1.6; color: var(--limr-secondary, #7b756e); white-space: nowrap; text-align: start; }
   .limr-highlight-settings fieldset { border: 0; padding: 0; margin: 0 0 12px; min-width: 0; }
   .limr-highlight-settings legend { margin-bottom: 7px; padding: 0; color: var(--limr-secondary, #7b756e); font-size: 11px; }
   .limr-highlight-colors { display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 9px; }
@@ -429,8 +452,9 @@
   .limr-color-swatch[aria-pressed='true'] { outline-color: var(--swatch); }
   .limr-color-swatch svg { width: 15px; height: 15px; color: var(--limr-text, #3d3a36); opacity: 0; }
   .limr-color-swatch[aria-pressed='true'] svg { opacity: 1; }
-  .limr-highlight-styles { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 5px; }
-  .limr-highlight-styles button { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 6px 2px; border: 1px solid transparent; border-radius: 4px; background: transparent; font-size: 11px; }
+  .limr-highlight-styles { display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: flex-start; gap: 5px; }
+  .limr-highlight-styles button { display: flex; flex: 0 0 auto; min-width: 48px; flex-direction: column; align-items: center; gap: 4px; padding: 6px 8px; border: 1px solid transparent; border-radius: 4px; background: transparent; font-size: 11px; white-space: nowrap; }
+  .limr-highlight-style-label { text-align: center; }
   .limr-highlight-styles button svg { width: 21px; height: 21px; }
   .limr-highlight-styles [aria-pressed='true'] { color: var(--limr-toolbar-accent, var(--limr-accent, #8a7865)); border-color: currentColor; }
   .limr-action-error { display: block; max-width: 300px; padding: .5rem; color: #b45858; }
@@ -449,3 +473,62 @@
     .limr-prose pre { white-space: pre-wrap; }
   }
 }
+
+@layer limr { .limr-stream-block { display: contents; } }
+
+@layer limr {
+  .limr-mermaid-display { padding: 0; overflow: hidden; }
+  .limr-mermaid-loading { display: grid; place-items: center; min-height: 80px; }
+  .limr-mermaid-viewport { overflow: auto; max-width: 100%; max-height: var(--limr-mermaid-max-height, min(70vh, 36rem)); padding: .75rem 1rem; box-sizing: border-box; scrollbar-width: thin; scrollbar-color: var(--limr-mermaid-scrollbar, #87837866) transparent; cursor: grab; user-select: none; -webkit-user-select: none; }
+  .limr-mermaid-viewport * { user-select: none; -webkit-user-select: none; }
+  .limr-mermaid-viewport[data-dragging] { cursor: grabbing; }
+  .limr-mermaid-viewport:focus-visible { outline-offset: -2px; }
+  .limr-mermaid-viewport::-webkit-scrollbar { width: 5px; height: 5px; }
+  .limr-mermaid-viewport::-webkit-scrollbar-track,.limr-mermaid-viewport::-webkit-scrollbar-corner { background: transparent; }
+  .limr-mermaid-viewport::-webkit-scrollbar-thumb { background: var(--limr-mermaid-scrollbar, #87837866); border-radius: 8px; }
+  .limr-mermaid-viewport::-webkit-scrollbar-button { display: none; }
+  .limr-mermaid-viewport[hidden],.limr-prose .limr-mermaid-source[hidden] { display: none; }
+  .limr-mermaid-canvas { margin-inline: auto; min-width: 0; transition: width var(--limr-motion) var(--limr-ease); }
+  .limr-mermaid-canvas > svg { display: block; width: 100%; height: auto; max-width: none !important; }
+  .limr-prose .limr-mermaid-source { background: transparent; padding: .75rem 1rem; }
+  .limr-mermaid-error { color: var(--limr-secondary); font-size: .8em; margin-bottom: .5rem; }
+  .limr-mermaid-error button { border: 0; background: transparent; text-decoration: underline; }
+  .limr-block-tools { position: absolute; inset-block-start: .45rem; inset-inline-end: .5rem; display: flex; align-items: center; padding: 2px; gap: 1px; border-radius: 9px; background: #ffffff99; backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); box-shadow: 0 1px 5px #29231d0a, inset 0 0 0 1px #ffffff80; color: #6b6760; z-index: 1; opacity: 0; transition: opacity var(--limr-motion-fast) var(--limr-ease); }
+  .limr-mermaid-block:hover .limr-block-tools,.limr-mermaid-block:focus-within .limr-block-tools { opacity: 1; }
+  @media (hover: none) { .limr-block-tools { opacity: 1; } }
+  .limr-block-tools > button { display: inline-grid; place-items: center; position: relative; width: 28px; height: 28px; padding: 0; border: 0; border-radius: 7px; background: transparent; color: inherit; transition: color var(--limr-motion-fast) var(--limr-ease), background-color var(--limr-motion-fast) var(--limr-ease), opacity var(--limr-motion-fast) var(--limr-ease); }
+  .limr-block-tools > button > svg { width: 19px; height: 19px; }
+  .limr-block-tools > button:enabled:hover { background: #87837822; color: #2c2925; }
+  .limr-block-tools > button:enabled:active { background: #87837838; }
+  .limr-block-tools > button[aria-pressed='true'] { color: var(--limr-heading); }
+  [data-limr-theme='dark'] .limr-block-tools { background: #37332dcc; box-shadow: 0 1px 5px #0002, inset 0 0 0 1px #ffffff10; color: #c7c0b6; }
+  [data-limr-theme='dark'] .limr-block-tools > button:enabled:hover { color: #f0ebe4; }
+  @media (prefers-color-scheme: dark) {
+    [data-limr-theme='auto'] .limr-block-tools { background: #37332dcc; box-shadow: 0 1px 5px #0002, inset 0 0 0 1px #ffffff10; color: #c7c0b6; }
+    [data-limr-theme='auto'] .limr-block-tools > button:enabled:hover { color: #f0ebe4; }
+  }
+  .limr-callout { border-color: var(--limr-callout-color); background: color-mix(in srgb, var(--limr-callout-color) 8%, transparent); }
+  .limr-callout-title { display: flex; align-items: center; gap: .5em; color: var(--limr-callout-color); text-transform: none; letter-spacing: .02em; font-size: .9em; }
+  .limr-callout-title > svg { width: 18px; height: 18px; flex: none; }
+  .limr-callout-title > span { flex: 1; }
+  .limr-callout-toggle { border: 0; border-radius: 5px; background: transparent; padding: 2px; display: inline-flex; }
+  .limr-callout-toggle:hover { background: color-mix(in srgb, var(--limr-callout-color) 12%, transparent); }
+  .limr-callout-toggle > svg { width: 18px; height: 18px; transition: transform var(--limr-motion) var(--limr-ease); }
+  .limr-callout-toggle[aria-expanded='false'] > svg { transform: rotate(-90deg); }
+  .limr-callout > .limr-collapse > .limr-collapse-inner > .limr-block-content { min-height: 0; }
+  @media (prefers-reduced-motion: reduce) { .limr-mermaid-canvas,.limr-block-tools,.limr-block-tools > button,.limr-callout-toggle > svg { transition: none; } }
+  @media print {
+    .limr-mermaid-viewport { max-height: none; overflow: visible; }
+    .limr-mermaid-canvas { width: 100% !important; }
+    .limr-block-tools { display: none; }
+  }
+}
+
+@layer limr {
+  [data-limr-kp] { white-space: nowrap; text-align: start; text-wrap: nowrap !important; }
+  [data-limr-kp][data-limr-kp-stale='clip'] { overflow-x: clip; }
+  [data-limr-kp][data-limr-kp-stale='wrap'] { white-space: normal; text-wrap: wrap !important; }
+  @media print { [data-limr-kp][data-limr-kp-stale] { overflow: visible; white-space: normal; text-wrap: wrap !important; } }
+  .limr-kp-glue { display: inline-block; font-size: 0; line-height: 0; white-space: pre; }
+  .limr-kp-hyphen::before { content: '-'; }
+}