@drghaliasri/butex 5.6.0 → 5.6.1

package/README.md

@@ -393,6 +393,44 @@ onDocumentChange={(node) => {
 
 Do not call `JSON.stringify(documentNode)` directly. JSON serialization removes `CharNode`, `CommandNode`, and other equation prototypes: the saved TeX source can still render in preview, but the structured equation cannot reopen in the editor. Also do not feed every change callback back into `initialDocument`; that prop is for initial or externally loaded data, and changing it resets the editor state and undo history. Keep the current save snapshot in a ref or separate state that is not passed back as `initialDocument`. Change callbacks run during editing, so debounce network autosaves or save explicitly.
 
+##### Host-driven figure insert
+
+After an external upload (for example S3), insert a figure on the **live** editor without remounting or rewriting `initialDocument`:
+
+```tsx
+'use client';
+
+import { useRef } from 'react';
+import {
+  ButexDocumentEditor2,
+  type ButexDocumentEditor2Ref,
+} from '@drghaliasri/butex/react-document2';
+
+export function ArticleEditorWithUpload() {
+  const editorRef = useRef<ButexDocumentEditor2Ref>(null);
+
+  async function onFileUploaded(uuid: string) {
+    // Sets \\includegraphics{assets/<uuid>.jpg} after the focused block.
+    // Do not call addDocument2ImageBlock outside the component or remount with key++.
+    editorRef.current?.insertImageBlock(`assets/${uuid}.jpg`);
+  }
+
+  return (
+    <ButexDocumentEditor2
+      ref={editorRef}
+      resolveImageUrl={({ assetId, value }) =>
+        assetId ? `https://cdn.example/${assetId}` : value
+      }
+      onDocumentJsonChange={(json) => {
+        /* persist json */
+      }}
+    />
+  );
+}
+```
+
+`insertImageBlock` matches the toolbar figure button (focus-aware insert + undo snapshot). Use `updateImageBlockValue(blockId, value)` to change a path on an existing image block, and `getDocumentJson()` to read the canonical wire JSON without host-side AST mutation.
+
 Host apps still register BuTeX with MathJax before preview rendering. `uiLocale` selects Arabic (`"ar"`, the default) or English (`"en"`) document-editor chrome and is passed to the embedded equation editor. `documentDirection` independently controls prose inputs and preview flow without creating a second document tree. `equationSide` independently controls whether structured equations open, render, and save from the `"english"` or `"arabic"` side. Set `editableEquations={false}` to show math islands without equation insertion, deletion, or editor access. Set `previewOnly={true}` to render only the read-only document preview with no toolbar, editor panel, or equation drawer. Optional `\includegraphics` `asset_id` is preserved on import; pass `resolveImageUrl={({ assetId, value }) => …})` so preview can load S3/CDN/local assets while plain `value` URLs keep working without a resolver. Document JSON may include root `meta` (`title`, `authors`, structured Hijri `date` `{ day, month, year }` with Arabic month names such as `"محرم"`, `abstract`) plus a `references` catalog (`key`, `authors`, `title`, `year`, `url`, `venue`) and `\cite{key1,key2}` spans in text values. Pass `documentMeta` to seed missing meta fields from the host; JSON keys win when present. The editor always centers a fixed basmala line before the title block and a closing ḥamdala after the body (preview + LaTeX). Hijri date uses day/month/year dropdowns (no calendar conversion; default year 1448). The editor shows numeric cite chips and a bibliography block. RTL preview/chips render reversed labels such as `[٣،٢،١]` (Arabic comma); LTR stays `[1, 2, 3]`. Pass `digitForm` (`western` / `arabicIndic` / `persianIndic`, defaulting from `documentDirection`) or use the toolbar digit control. LaTeX export keeps logical `\cite{…}` key order for XeLaTeX; digit shaping and bidi display in PDF belong in the host preamble (`bidi`/polyglossia + font `Mapping`, see `references/commands.py`). Range compression (`[3–7]`) is not implemented yet. Raw-only equations keep their original source because the browser does not parse raw LaTeX into equation ASTs. Document editor v2 defaults to **`tex-svg.js`**; use `tex-chtml.js` only if you pass `mathOutput="chtml"`.
 
 ### Styling/theming contract

package/dist/react-document2.d.mts

@@ -1,3 +1,4 @@
+import * as react from 'react';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 
 type EditorSide = 'english' | 'arabic';
@@ -484,8 +485,17 @@ type Document2InitialState = {
     document: Document2Node;
     error: string | null;
 };
+/** Imperative host API — insert/update figures on the live document without remounting. */
+type ButexDocumentEditor2Ref = {
+    /** Insert image block after focused block (same as toolbar figure button). */
+    insertImageBlock: (srcOrAssetId?: string) => void;
+    /** Set path on an existing image block. */
+    updateImageBlockValue: (blockId: string, value: string) => void;
+    /** Canonical JSON without host-side AST mutation. */
+    getDocumentJson: () => Document2Json;
+};
 declare function resolveInitialDocument2(initialDocument: Document2Json | Document2Node | undefined, uiLocale?: ButexUiLocale, documentMeta?: Document2MetaProp): Document2InitialState;
-declare function ButexDocumentEditor2({ initialDocument, documentMeta, className, debug, documentDirection, equationSide, editableEquations, previewOnly, uiLocale, mathOutput, digitForm: digitFormProp, onDigitFormChange, resolveImageUrl, onDocumentChange, onDocumentJsonChange, onLatexChange, }: ButexDocumentEditor2Props): react_jsx_runtime.JSX.Element;
+declare const ButexDocumentEditor2: react.ForwardRefExoticComponent<ButexDocumentEditor2Props & react.RefAttributes<ButexDocumentEditor2Ref>>;
 
 type DocumentInsertToolbarProps = {
     canUndo: boolean;
@@ -617,4 +627,4 @@ declare function MathIsland({ id, tex, display, output }: MathIslandProps): reac
 declare const DOCUMENT2_WIDGET_CSS = "\n.butex-document2-widget {\n  --butex-document2-bg: var(--butex-bg, #f8fafc);\n  --butex-document2-fg: var(--butex-fg, #0f172a);\n  --butex-document2-muted: var(--butex-muted, #64748b);\n  --butex-document2-panel: var(--butex-panel, #ffffff);\n  --butex-document2-border: var(--butex-border, #e2e8f0);\n  --butex-document2-accent: var(--butex-accent, #0d9488);\n  --butex-document2-accent-bg: var(--butex-toolbar-hover-bg, rgba(13, 148, 136, 0.08));\n  --butex-document2-focus-shadow: var(--butex-focus-shadow, rgba(13, 148, 136, 0.16));\n  --butex-document2-danger: var(--butex-danger, #dc2626);\n  --butex-document2-error: var(--butex-error, #b91c1c);\n  --butex-document2-error-bg: var(--butex-error-bg, #fef2f2);\n  --butex-document2-preview-bg: var(--butex-preview-bg, #ffffff);\n  --butex-document2-preview-fg: var(--butex-preview-fg, var(--butex-document2-fg));\n  --butex-document2-preview-font: \"Amiri\", \"Noto Serif Arabic\", Georgia, \"Times New Roman\", serif;\n  --butex-document2-drawer-bg: var(--butex-document2-panel);\n  --butex-document2-input-bg: #ffffff;\n  --butex-document2-raw-bg: #f8fafc;\n  --butex-document2-math-bg: var(--butex-document2-accent-bg);\n  --butex-document2-math-border: rgba(13, 148, 136, 0.35);\n  --butex-document2-text-token-bg: var(--butex-text-token-bg, color-mix(in srgb, var(--butex-document2-panel) 86%, var(--butex-document2-bg)));\n  --butex-document2-text-token-border: var(--butex-text-token-border, color-mix(in srgb, var(--butex-document2-border) 86%, var(--butex-document2-muted)));\n  --butex-document2-math-inline-bg: var(--butex-math-inline-bg, color-mix(in srgb, var(--butex-document2-accent) 10%, var(--butex-document2-panel)));\n  --butex-document2-math-display-bg: var(--butex-math-display-bg, color-mix(in srgb, var(--butex-document2-accent) 7%, var(--butex-document2-bg)));\n  --butex-document2-collapse-bg: var(--butex-collapse-bg, color-mix(in srgb, var(--butex-document2-muted) 8%, var(--butex-document2-panel)));\n  --butex-document2-dev-bg: var(--butex-dev-bg, #fffbeb);\n  --butex-document2-dev-border: var(--butex-dev-border, #fcd34d);\n  --butex-document2-dev-code-bg: var(--butex-dev-inset-bg, #ffffff);\n  --butex-document2-dev-code-fg: var(--butex-dev-inset-fg, var(--butex-document2-fg));\n  box-sizing: border-box;\n  color: var(--butex-document2-fg);\n  direction: rtl;\n  font-family: ui-sans-serif, system-ui, \"Segoe UI\", Tahoma, Arial, sans-serif;\n  line-height: 1.45;\n}\n\n.butex-document2-widget *,\n.butex-document2-widget *::before,\n.butex-document2-widget *::after {\n  box-sizing: inherit;\n}\n\n.butex-document2-widget__shell,\n.butex-document2-widget__editor-panel,\n.butex-document2-widget__blocks,\n.butex-document2-widget__dev,\n.butex-document2-widget__field {\n  display: grid;\n  gap: 10px;\n  min-width: 0;\n}\n\n.butex-document2-widget__toolbar,\n.butex-document2-widget__panel,\n.butex-document2-widget__block,\n.butex-document2-widget__dev {\n  background: var(--butex-document2-panel);\n  border: 1px solid var(--butex-document2-border);\n  border-radius: 12px;\n  min-width: 0;\n  padding: 12px;\n}\n\n.butex-document2-widget__toolbar {\n  position: sticky;\n  top: 0;\n  z-index: 20;\n  box-shadow: 0 4px 16px color-mix(in srgb, var(--butex-document2-fg) 6%, transparent);\n  gap: 6px;\n}\n\n.butex-document2-widget__toolbar-insert {\n  align-items: center;\n  display: flex;\n  flex: 1 1 auto;\n  flex-wrap: wrap;\n  gap: 6px;\n  min-width: 0;\n}\n\n.butex-document2-widget__toolbar-group {\n  align-items: center;\n  border-inline-start: 1px solid color-mix(in srgb, var(--butex-document2-border) 75%, transparent);\n  display: flex;\n  flex-wrap: wrap;\n  gap: 4px;\n  padding-inline-start: 6px;\n}\n\n.butex-document2-widget__toolbar-group:first-child {\n  border-inline-start: 0;\n  padding-inline-start: 0;\n}\n\n.butex-document2-widget__icon-btn {\n  align-items: center;\n  background: var(--butex-document2-panel);\n  border: 1px solid var(--butex-document2-border);\n  border-radius: 8px;\n  color: var(--butex-document2-fg);\n  cursor: pointer;\n  display: inline-flex;\n  font-weight: 700;\n  justify-content: center;\n  line-height: 1;\n  min-height: 30px;\n  min-width: 30px;\n  padding: 0 6px;\n}\n\n.butex-document2-widget__icon-btn:hover:not(:disabled),\n.butex-document2-widget__icon-btn[aria-pressed=\"true\"] {\n  background: var(--butex-document2-accent-bg);\n  border-color: var(--butex-document2-accent);\n}\n\n.butex-document2-widget__icon-btn:disabled {\n  cursor: not-allowed;\n  opacity: 0.45;\n}\n\n.butex-document2-widget__icon-btn--h1 {\n  font-size: 1.15rem;\n}\n\n.butex-document2-widget__icon-btn--h2 {\n  font-size: 1rem;\n}\n\n.butex-document2-widget__icon-btn--h3 {\n  font-size: 0.88rem;\n}\n\n.butex-document2-widget__icon-math-inline {\n  font-family: ui-monospace, Consolas, monospace;\n  font-size: 0.78rem;\n  font-weight: 600;\n}\n\n.butex-document2-widget__icon-math-display {\n  font-size: 0.82rem;\n  font-weight: 700;\n}\n\n.butex-document2-widget__icon-bibliography {\n  display: inline-flex;\n  line-height: 0;\n}\n\n.butex-document2-widget__icon-bibliography svg {\n  display: block;\n}\n\n.butex-document2-widget__format-btn {\n  font-family: \"Amiri\", \"Noto Serif Arabic\", Georgia, serif;\n  min-width: 36px;\n}\n\n.butex-document2-widget__format-icon {\n  direction: rtl;\n  display: inline-block;\n  font-size: 0.84rem;\n  font-weight: 500;\n}\n\n.butex-document2-widget__format-icon--bold {\n  font-weight: 900;\n}\n\n.butex-document2-widget__format-icon--italic {\n  font-style: italic;\n  transform: skewX(-7deg);\n}\n\n.butex-document2-widget__format-icon--underline {\n  text-decoration: underline;\n  text-underline-offset: 0.12em;\n}\n\n.butex-document2-widget__format-underline,\n.butex-document2-widget__preview-underline {\n  text-decoration: underline;\n  text-underline-offset: 0.12em;\n}\n\n.butex-document2-widget__references-menu {\n  position: relative;\n}\n\n.butex-document2-widget__references-trigger {\n  gap: 5px;\n  white-space: nowrap;\n}\n\n.butex-document2-widget__menu-chevron {\n  color: var(--butex-document2-muted);\n  font-size: 0.8rem;\n}\n\n.butex-document2-widget__references-menu-options {\n  background: var(--butex-document2-panel);\n  border: 1px solid var(--butex-document2-border);\n  border-radius: 8px;\n  box-shadow: 0 8px 24px color-mix(in srgb, var(--butex-document2-fg) 16%, transparent);\n  display: grid;\n  gap: 2px;\n  inset-inline-start: 0;\n  margin-top: 4px;\n  min-width: max-content;\n  padding: 4px;\n  position: absolute;\n  top: 100%;\n  z-index: 30;\n}\n\n.butex-document2-widget__references-menu-options button {\n  align-items: center;\n  background: transparent;\n  border: 0;\n  border-radius: 6px;\n  color: var(--butex-document2-fg);\n  cursor: pointer;\n  display: grid;\n  font: inherit;\n  gap: 8px;\n  grid-template-columns: 18px 1fr;\n  padding: 7px 9px;\n  text-align: start;\n}\n\n.butex-document2-widget__references-menu-options button:hover,\n.butex-document2-widget__references-menu-options button:focus-visible {\n  background: var(--butex-document2-accent-bg);\n  outline: none;\n}\n\n.butex-document2-widget__float-meta {\n  display: grid;\n  gap: 8px;\n  margin-top: 8px;\n}\n\n.butex-document2-widget__float-meta--compact {\n  gap: 4px;\n}\n\n.butex-document2-widget__float-meta-toggle {\n  align-items: center;\n  display: inline-flex;\n  gap: 6px;\n  font-size: 0.9rem;\n}\n\n.butex-document2-widget__preview-paragraph--centered {\n  text-align: center;\n}\n\n.butex-document2-widget__labels-help {\n  color: color-mix(in srgb, var(--butex-document2-fg) 72%, transparent);\n  font-size: 0.9rem;\n  margin: 0 0 10px;\n}\n\n.butex-document2-widget__preview-float {\n  margin: 0.75rem 0;\n  text-align: center;\n}\n\n.butex-document2-widget__preview-float figcaption {\n  color: color-mix(in srgb, var(--butex-document2-fg) 80%, transparent);\n  font-size: 0.92rem;\n  margin-top: 0.4rem;\n  text-align: center;\n}\n\n.butex-document2-widget__preview-float-number {\n  font-weight: 600;\n}\n\n.butex-document2-widget__preview-ref {\n  font-variant-numeric: tabular-nums;\n}\n\n.butex-document2-widget__ref-chip {\n  border-style: dashed;\n}\n\n.butex-document2-widget__block-actions {\n  align-items: center;\n  display: flex;\n  flex-wrap: wrap;\n  gap: 6px;\n}\n\n.butex-document2-widget button.butex-document2-widget__block-collapse {\n  align-items: center;\n  background: var(--butex-document2-collapse-bg);\n  border-color: color-mix(in srgb, var(--butex-document2-border) 70%, var(--butex-document2-muted));\n  display: inline-flex;\n  font-weight: 800;\n  justify-content: center;\n  min-height: 26px;\n  min-width: 26px;\n  padding: 0;\n}\n\n.butex-document2-widget__math-chip-wrap {\n  align-items: center;\n  display: inline-flex;\n  gap: 2px;\n}\n\n.butex-document2-widget__math-chip-wrap[data-display=\"true\"] {\n  flex: 1 1 100%;\n  justify-content: center;\n  width: 100%;\n}\n\n.butex-document2-widget__math-chip-delete {\n  background: transparent;\n  border: 1px solid color-mix(in srgb, var(--butex-document2-danger) 35%, var(--butex-document2-border));\n  border-radius: 6px;\n  color: var(--butex-document2-danger);\n  cursor: pointer;\n  font-size: 0.85rem;\n  line-height: 1;\n  min-height: 24px;\n  min-width: 24px;\n  padding: 0;\n}\n\n.butex-document2-widget__table-cell {\n  flex: 1 1 8rem;\n  min-width: 8rem;\n}\n\n.butex-document2-widget__block--table .butex-document2-widget__inline-text {\n  min-height: 3.5em;\n  min-width: min(12ch, 100%);\n}\n\n.butex-document2-widget__table-popover {\n  display: inline-block;\n  position: relative;\n}\n\n.butex-document2-widget__table-popover-panel {\n  background: var(--butex-document2-panel);\n  border: 1px solid var(--butex-document2-border);\n  border-radius: 10px;\n  box-shadow: 0 8px 24px color-mix(in srgb, var(--butex-document2-fg) 12%, transparent);\n  display: grid;\n  gap: 8px;\n  inset-inline-end: 0;\n  padding: 10px;\n  position: absolute;\n  top: calc(100% + 6px);\n  width: min(220px, 70vw);\n  z-index: 30;\n}\n\n.butex-document2-widget__table-popover-panel label {\n  color: var(--butex-document2-muted);\n  display: grid;\n  font-size: 0.82rem;\n  gap: 4px;\n}\n\n.butex-document2-widget__toolbar-row {\n  align-items: center;\n  border-block-end: 1px solid color-mix(in srgb, var(--butex-document2-border) 70%, transparent);\n  display: flex;\n  flex-wrap: wrap;\n  gap: 8px;\n  margin-block-end: 8px;\n  padding-block-end: 8px;\n  width: 100%;\n}\n\n.butex-document2-widget__toolbar-row:last-child {\n  border-block-end: 0;\n  margin-block-end: 0;\n  padding-block-end: 0;\n}\n\n.butex-document2-widget__toolbar-label {\n  color: var(--butex-document2-muted);\n  font-size: 0.78rem;\n  font-weight: 600;\n  margin-inline-end: 4px;\n  white-space: nowrap;\n}\n\n.butex-document2-widget__block-header {\n  align-items: center;\n  border-block-end: 1px solid color-mix(in srgb, var(--butex-document2-border) 80%, transparent);\n  display: flex;\n  flex-wrap: wrap;\n  gap: 8px;\n  justify-content: space-between;\n  margin-block-end: 10px;\n  padding-block-end: 8px;\n}\n\n.butex-document2-widget__block-select {\n  accent-color: var(--butex-document2-accent);\n  cursor: pointer;\n  flex: 0 0 auto;\n  height: 1rem;\n  margin: 0;\n  width: 1rem;\n}\n\n.butex-document2-widget__block--selected {\n  background: var(--butex-document2-accent-bg);\n  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--butex-document2-accent) 45%, transparent);\n}\n\n.butex-document2-widget__selection-count {\n  color: var(--butex-document2-muted);\n  font-size: 0.78rem;\n  font-weight: 600;\n  padding-inline: 4px;\n  white-space: nowrap;\n}\n\n.butex-document2-widget__block-title {\n  align-items: center;\n  color: var(--butex-document2-fg);\n  display: inline-flex;\n  gap: 8px;\n  font-weight: 700;\n}\n\n.butex-document2-widget__block--section .butex-document2-widget__block-title {\n  font-size: 1.12rem;\n}\n\n.butex-document2-widget__block--subsection .butex-document2-widget__block-title {\n  font-size: 1.04rem;\n}\n\n.butex-document2-widget__block--subsubsection .butex-document2-widget__block-title {\n  font-size: 0.98rem;\n}\n\n.butex-document2-widget__block--paragraph .butex-document2-widget__block-title {\n  color: var(--butex-document2-muted);\n  font-size: 0.86rem;\n  font-weight: 600;\n}\n\n.butex-document2-widget__block--list .butex-document2-widget__block-title,\n.butex-document2-widget__block--table .butex-document2-widget__block-title,\n.butex-document2-widget__block--image .butex-document2-widget__block-title,\n.butex-document2-widget__block--raw .butex-document2-widget__block-title {\n  font-size: 0.9rem;\n}\n\n.butex-document2-widget__block--section {\n  background: color-mix(in srgb, var(--butex-document2-accent) 9%, var(--butex-document2-panel));\n  border-inline-start: 4px solid var(--butex-document2-accent);\n}\n\n.butex-document2-widget__block--subsection {\n  background: color-mix(in srgb, var(--butex-document2-accent) 6%, var(--butex-document2-panel));\n  border-inline-start: 3px solid color-mix(in srgb, var(--butex-document2-accent) 78%, var(--butex-document2-border));\n}\n\n.butex-document2-widget__block--subsubsection {\n  background: color-mix(in srgb, var(--butex-document2-accent) 4%, var(--butex-document2-panel));\n  border-inline-start: 3px solid var(--butex-document2-border);\n}\n\n.butex-document2-widget__block--paragraph {\n  border-inline-start: 2px solid color-mix(in srgb, var(--butex-document2-muted) 35%, transparent);\n}\n\n.butex-document2-widget__block--list {\n  background: color-mix(in srgb, var(--butex-document2-bg) 55%, var(--butex-document2-panel));\n  border-inline-start: 3px solid color-mix(in srgb, var(--butex-document2-accent) 55%, var(--butex-document2-border));\n}\n\n.butex-document2-widget__block--table {\n  background: color-mix(in srgb, var(--butex-document2-bg) 40%, var(--butex-document2-panel));\n  border-inline-start: 3px solid var(--butex-document2-border);\n}\n\n.butex-document2-widget__block--image {\n  background: color-mix(in srgb, var(--butex-document2-muted) 6%, var(--butex-document2-panel));\n  border-inline-start: 3px dashed color-mix(in srgb, var(--butex-document2-muted) 45%, var(--butex-document2-border));\n}\n\n.butex-document2-widget__block--raw {\n  background: color-mix(in srgb, var(--butex-document2-muted) 8%, var(--butex-document2-panel));\n  border-inline-start: 3px dashed var(--butex-document2-muted);\n}\n\n.butex-document2-widget__block--collapsed {\n  background: var(--butex-document2-collapse-bg);\n}\n\n.butex-document2-widget__block--collapsed .butex-document2-widget__block-header {\n  margin-block-end: 8px;\n}\n\n.butex-document2-widget__block-summary {\n  background: color-mix(in srgb, var(--butex-document2-panel) 72%, transparent);\n  border: 1px dashed color-mix(in srgb, var(--butex-document2-border) 70%, var(--butex-document2-muted));\n  border-radius: 8px;\n  color: var(--butex-document2-muted);\n  font-size: 0.86rem;\n  line-height: 1.5;\n  min-width: 0;\n  overflow-wrap: anywhere;\n  padding: 8px 10px;\n}\n\n.butex-document2-widget__list-item-actions {\n  align-items: center;\n  display: flex;\n  flex-wrap: wrap;\n  gap: 6px;\n  margin-block-start: 6px;\n}\n\n.butex-document2-widget__list-item-content {\n  display: grid;\n  gap: 8px;\n  min-width: 0;\n}\n\n.butex-document2-widget__list-footer {\n  border-block-start: 1px dashed color-mix(in srgb, var(--butex-document2-border) 85%, transparent);\n  margin-block-start: 10px;\n  padding-block-start: 10px;\n}\n\n.butex-document2-widget__button--danger:hover {\n  border-color: var(--butex-document2-danger);\n  color: var(--butex-document2-danger);\n}\n\n.butex-document2-widget__image-src-label {\n  color: var(--butex-document2-muted);\n  display: block;\n  font-size: 0.82rem;\n  margin-block-end: 4px;\n}\n\n.butex-document2-widget__toolbar,\n.butex-document2-widget__row {\n  align-items: center;\n  display: flex;\n  flex-wrap: wrap;\n  gap: 8px;\n}\n\n.butex-document2-widget button {\n  background: var(--butex-document2-panel);\n  border: 1px solid var(--butex-document2-border);\n  border-radius: 8px;\n  color: var(--butex-document2-fg);\n  cursor: pointer;\n  min-height: 32px;\n  padding: 0 10px;\n}\n\n.butex-document2-widget button:hover,\n.butex-document2-widget button[aria-pressed=\"true\"] {\n  background: var(--butex-document2-accent-bg);\n  border-color: var(--butex-document2-accent);\n}\n\n.butex-document2-widget button:focus-visible,\n.butex-document2-widget input:focus-visible,\n.butex-document2-widget textarea:focus-visible {\n  border-color: var(--butex-document2-accent);\n  box-shadow: 0 0 0 3px var(--butex-document2-focus-shadow);\n  outline: none;\n}\n\n.butex-document2-widget input {\n  background: var(--butex-document2-input-bg);\n  border: 1px solid var(--butex-document2-border);\n  border-radius: 8px;\n  color: var(--butex-document2-fg);\n  font: inherit;\n  min-height: 34px;\n  padding: 7px 9px;\n}\n\n.butex-document2-widget textarea {\n  background: var(--butex-document2-input-bg);\n  border: 1px solid var(--butex-document2-border);\n  border-radius: 8px;\n  color: var(--butex-document2-fg);\n  font: inherit;\n  line-height: 1.45;\n  padding: 7px 9px;\n}\n\n.butex-document2-widget__layout {\n  align-items: start;\n  display: grid;\n  gap: 12px;\n  grid-template-columns: minmax(0, 1fr) minmax(280px, 0.9fr);\n  transition: grid-template-columns 0.22s ease;\n}\n\n.butex-document2-widget__layout--editor-open.butex-document2-widget__layout--preview-open {\n  grid-template-columns: minmax(0, 1fr) minmax(280px, 0.9fr);\n}\n\n/* One visible panel: a single track so the panel fills the widget (previewOnly / hide editor / hide preview). */\n.butex-document2-widget__layout--editor-open.butex-document2-widget__layout--preview-closed,\n.butex-document2-widget__layout--editor-closed.butex-document2-widget__layout--preview-open,\n.butex-document2-widget__layout--editor-closed.butex-document2-widget__layout--preview-closed {\n  grid-template-columns: minmax(0, 1fr);\n}\n\n.butex-document2-widget__editor-panel,\n.butex-document2-widget__preview-panel {\n  min-width: 0;\n  opacity: 1;\n  overflow-x: hidden;\n  overflow-y: auto;\n  transform: translateX(0);\n  transition:\n    opacity 0.18s ease,\n    transform 0.22s ease,\n    padding 0.22s ease,\n    border-width 0.22s ease,\n    box-shadow 0.22s ease;\n}\n\n/* When previewOnly (or display:none) leaves a lone panel, span the full grid. */\n.butex-document2-widget__editor-panel:only-child,\n.butex-document2-widget__preview-panel:only-child {\n  grid-column: 1 / -1;\n  width: 100%;\n}\n\n.butex-document2-widget__layout--editor-closed .butex-document2-widget__editor-panel,\n.butex-document2-widget__layout--preview-closed .butex-document2-widget__preview-panel {\n  display: none;\n}\n\n.butex-document2-widget__inline-field {\n  align-items: center;\n  display: flex;\n  flex-wrap: wrap;\n  gap: 6px;\n  max-width: 100%;\n  min-width: 0;\n  width: 100%;\n}\n\n.butex-document2-widget__inline-text {\n  background: var(--butex-document2-text-token-bg);\n  border-color: var(--butex-document2-text-token-border);\n  box-sizing: border-box;\n  flex: 0 1 auto;\n  max-width: 100%;\n  min-height: 2.75em;\n  min-width: 3ch;\n  overflow-wrap: break-word;\n  overflow-y: hidden;\n  resize: none;\n  text-align: start;\n  white-space: pre-wrap;\n  width: auto;\n  word-break: break-word;\n}\n\n.butex-document2-widget__inline-text:hover {\n  border-color: color-mix(in srgb, var(--butex-document2-text-token-border) 55%, var(--butex-document2-accent));\n}\n\n.butex-document2-widget__inline-text[data-bold=\"true\"] {\n  font-weight: 700;\n}\n\n.butex-document2-widget__inline-text[data-italic=\"true\"] {\n  font-style: italic;\n}\n\n.butex-document2-widget__inline-text[data-underline=\"true\"] {\n  text-decoration: underline;\n  text-underline-offset: 0.12em;\n}\n\n.butex-document2-widget__inline-field input {\n  min-width: 12ch;\n}\n\n.butex-document2-widget__math-chip {\n  background: var(--butex-document2-math-inline-bg);\n  border-color: color-mix(in srgb, var(--butex-document2-math-border) 70%, var(--butex-document2-accent));\n  border-width: 1.5px;\n  direction: ltr;\n  display: inline-flex;\n  font-family: inherit;\n  gap: 4px;\n  max-width: 100%;\n  min-height: 30px;\n  overflow: visible;\n  padding: 3px 7px;\n  unicode-bidi: isolate;\n}\n\n.butex-document2-widget__math-chip:hover,\n.butex-document2-widget__math-chip:focus-visible {\n  background: color-mix(in srgb, var(--butex-document2-accent) 12%, var(--butex-document2-panel));\n  border-color: var(--butex-document2-accent);\n}\n\n.butex-document2-widget__math-chip[data-editable=\"false\"] {\n  border-style: dashed;\n  color: var(--butex-document2-muted);\n}\n\n.butex-document2-widget__math-chip[data-display=\"true\"] {\n  background: var(--butex-document2-math-display-bg);\n  border-color: color-mix(in srgb, var(--butex-document2-accent) 50%, var(--butex-document2-border));\n  border-width: 1.5px;\n  border-radius: 10px;\n  box-shadow: 0 5px 16px color-mix(in srgb, var(--butex-document2-fg) 8%, transparent);\n  justify-content: center;\n  margin-block: 4px;\n  min-height: 54px;\n  padding: 10px 12px;\n  width: min(100%, 36rem);\n}\n\n.butex-document2-widget__preview {\n  background: var(--butex-document2-preview-bg);\n  color: var(--butex-document2-preview-fg);\n  font-family: var(--butex-document2-preview-font);\n  font-size: 1.08rem;\n  line-height: 1.9;\n  max-width: 100%;\n  min-width: 0;\n  overflow-wrap: break-word;\n  text-align: start;\n  word-break: break-word;\n}\n\n.butex-document2-widget__preview h1,\n.butex-document2-widget__preview h2,\n.butex-document2-widget__preview h3,\n.butex-document2-widget__preview p,\n.butex-document2-widget__preview li {\n  max-width: 100%;\n  overflow-wrap: break-word;\n  white-space: normal;\n  word-break: break-word;\n}\n\n.butex-document2-widget__preview h1 {\n  font-size: 1.75rem;\n  font-weight: 700;\n  line-height: 1.35;\n  margin: 0 0 14px;\n}\n\n.butex-document2-widget__preview h2 {\n  font-size: 1.4rem;\n  font-weight: 600;\n  line-height: 1.4;\n  margin: 0 0 12px;\n}\n\n.butex-document2-widget__preview h3 {\n  font-size: 1.2rem;\n  font-weight: 600;\n  line-height: 1.45;\n  margin: 0 0 10px;\n}\n\n.butex-document2-widget__preview p {\n  margin: 0 0 12px;\n}\n\n.butex-document2-widget__preview ul,\n.butex-document2-widget__preview ol {\n  margin: 0 0 12px;\n  padding-inline-start: 24px;\n}\n\n.butex-document2-widget__preview ul {\n  list-style-type: disc;\n}\n\n.butex-document2-widget__preview ol {\n  list-style-type: decimal;\n}\n\n.butex-document2-widget__preview img {\n  display: block;\n  height: auto;\n  max-width: 100%;\n}\n\n.butex-document2-widget__preview table {\n  border-collapse: collapse;\n  border: 1px solid #000000;\n  margin: 12px 0;\n  max-width: 100%;\n  table-layout: fixed;\n  width: 100%;\n}\n\n.butex-document2-widget__preview td {\n  border: 1px solid #000000;\n  max-width: 100%;\n  overflow-wrap: break-word;\n  padding: 6px 8px;\n  white-space: normal;\n  word-break: break-word;\n}\n\n.butex-document2-widget__math-island {\n  direction: ltr;\n  display: inline-block;\n  line-height: normal;\n  margin: 0 2px;\n  overflow: visible;\n  unicode-bidi: isolate;\n  vertical-align: middle;\n}\n\n/* Guard against host CSS resets (e.g. Tailwind Preflight's `svg { display: block }`).\n * MathJax v4 inline line-breaking emits an equation as several sibling <svg> chunks;\n * a block-level svg reset stacks them vertically inside the island. */\n.butex-document2-widget mjx-container svg {\n  display: inline;\n}\n\n.butex-document2-widget__math-chip .butex-document2-widget__math-island {\n  margin: 0;\n}\n\n.butex-document2-widget__math-island[data-render-state=\"loading\"] {\n  opacity: 0.72;\n}\n\n.butex-document2-widget__math-island[data-render-state=\"error\"] {\n  color: var(--butex-document2-error);\n  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;\n  font-size: 0.88rem;\n  max-width: 100%;\n  overflow-wrap: anywhere;\n  white-space: normal;\n}\n\n.butex-document2-widget__math-island[data-display=\"true\"] {\n  display: block;\n  margin: 10px 0;\n  text-align: center;\n}\n\n.butex-document2-widget__math-chip .butex-document2-widget__math-island[data-display=\"true\"] {\n  margin: 0;\n}\n\n.butex-document2-widget__raw {\n  background: var(--butex-document2-raw-bg);\n  border-radius: 8px;\n  direction: ltr;\n  padding: 8px;\n  text-align: left;\n  white-space: pre-wrap;\n}\n\n.butex-document2-widget__error {\n  background: var(--butex-document2-error-bg);\n  border: 1px solid var(--butex-document2-error);\n  border-radius: 8px;\n  color: var(--butex-document2-error);\n  padding: 10px;\n}\n\n.butex-document2-widget__equation-modal {\n  align-items: center;\n  display: flex;\n  inset: 0;\n  justify-content: center;\n  padding: 16px;\n  position: fixed;\n  z-index: 30;\n}\n\n.butex-document2-widget__equation-modal-backdrop {\n  background: color-mix(in srgb, var(--butex-document2-fg) 34%, transparent);\n  border: 0;\n  cursor: pointer;\n  display: block;\n  height: 100%;\n  inset: 0;\n  margin: 0;\n  padding: 0;\n  position: absolute;\n  width: 100%;\n}\n\n.butex-document2-widget__equation-modal-panel {\n  background: var(--butex-document2-drawer-bg);\n  border: 1px solid var(--butex-document2-border);\n  border-radius: 12px;\n  box-shadow: 0 18px 48px color-mix(in srgb, var(--butex-document2-fg) 18%, transparent);\n  display: grid;\n  gap: 12px;\n  max-height: min(90vh, 900px);\n  max-width: min(720px, 100%);\n  overflow: auto;\n  padding: 14px;\n  position: relative;\n  width: min(680px, 100%);\n  z-index: 1;\n}\n\n/* Map document v2 tokens onto BuTeX equation editor chrome when embedded in this modal. */\n.butex-document2-widget__equation-modal-panel .butex-widget {\n  --butex-bg: var(--butex-document2-bg);\n  --butex-fg: var(--butex-document2-fg);\n  --butex-muted: var(--butex-document2-muted);\n  --butex-accent: var(--butex-document2-accent);\n  --butex-accent-hover: color-mix(in srgb, var(--butex-document2-accent) 82%, #000000);\n  --butex-toolbar-hover-bg: var(--butex-document2-accent-bg);\n  --butex-toolbar-hover-border: var(--butex-document2-accent);\n  --butex-danger: var(--butex-document2-danger);\n  --butex-danger-bg: color-mix(in srgb, var(--butex-document2-danger) 12%, transparent);\n  --butex-danger-border: color-mix(in srgb, var(--butex-document2-danger) 48%, transparent);\n  --butex-on-accent: #ffffff;\n  --butex-border: var(--butex-document2-border);\n  --butex-panel: var(--butex-document2-panel);\n  --butex-preview-bg: var(--butex-document2-preview-bg);\n  --butex-preview-fg: var(--butex-document2-preview-fg);\n  --butex-error: var(--butex-document2-error);\n  --butex-error-bg: var(--butex-document2-error-bg);\n  --butex-error-border: color-mix(in srgb, var(--butex-document2-error) 32%, var(--butex-document2-panel));\n  --butex-shadow-md: 0 4px 14px color-mix(in srgb, var(--butex-document2-fg) 10%, transparent);\n  --butex-dev-bg: var(--butex-document2-dev-bg);\n  --butex-dev-border: var(--butex-document2-dev-border);\n  --butex-dev-badge: var(--butex-dev-badge, #b45309);\n  --butex-dev-badge-fg: var(--butex-dev-badge-fg, #ffffff);\n  --butex-dev-muted: var(--butex-dev-muted, #92400e);\n  --butex-dev-inset-bg: var(--butex-document2-dev-code-bg);\n  --butex-dev-inset-border: color-mix(in srgb, var(--butex-document2-dev-border) 45%, transparent);\n  --butex-dev-inset-fg: var(--butex-document2-dev-code-fg);\n  --butex-surface-bg: linear-gradient(\n    180deg,\n    var(--butex-document2-panel) 0%,\n    color-mix(in srgb, var(--butex-document2-panel) 88%, var(--butex-document2-bg)) 100%\n  );\n  --butex-surface-fg: var(--butex-document2-fg);\n  --butex-focus-border: color-mix(in srgb, var(--butex-document2-accent) 45%, transparent);\n  --butex-focus-shadow: var(--butex-document2-focus-shadow);\n  --butex-slot-hover: var(--butex-document2-accent-bg);\n  --butex-selection-bg: color-mix(in srgb, var(--butex-document2-accent) 34%, transparent);\n  --butex-selection-border: color-mix(in srgb, var(--butex-document2-accent) 90%, #0f172a);\n  --butex-caret: var(--butex-document2-fg);\n  --butex-node-hover: color-mix(in srgb, var(--butex-document2-muted) 14%, transparent);\n  --butex-node-selected-bg: var(--butex-document2-accent-bg);\n  --butex-node-selected-border: color-mix(in srgb, var(--butex-document2-accent) 45%, transparent);\n  --butex-script-border: var(--butex-document2-border);\n  --butex-script-bg: color-mix(in srgb, var(--butex-document2-bg) 35%, var(--butex-document2-panel));\n  --butex-script-color: var(--butex-document2-muted);\n  --butex-delim-color: var(--butex-document2-muted);\n  --butex-frac-bar: currentColor;\n}\n\n.butex-document2-widget__dev {\n  background: var(--butex-document2-dev-bg);\n  border-color: var(--butex-document2-dev-border);\n}\n\n.butex-document2-widget__dev pre {\n  background: var(--butex-document2-dev-code-bg);\n  color: var(--butex-document2-dev-code-fg);\n  direction: ltr;\n  margin: 0;\n  max-height: 220px;\n  overflow: auto;\n  padding: 10px;\n  text-align: left;\n  white-space: pre-wrap;\n}\n\n.butex-document2-widget__dev-actions {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 8px;\n  margin: 0 0 10px;\n}\n\n.butex-document2-widget__dev-import {\n  display: grid;\n  gap: 8px;\n  margin-bottom: 12px;\n}\n\n.butex-document2-widget__dev-import textarea {\n  background: var(--butex-document2-dev-code-bg);\n  border: 1px solid var(--butex-document2-dev-border);\n  border-radius: 8px;\n  color: var(--butex-document2-dev-code-fg);\n  direction: ltr;\n  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;\n  min-height: 180px;\n  padding: 10px;\n  resize: vertical;\n  text-align: left;\n}\n\n.butex-document2-widget__dev-error {\n  background: rgba(254, 226, 226, 0.9);\n  border: 1px solid rgba(220, 38, 38, 0.45);\n  border-radius: 8px;\n  color: #991b1b;\n  margin: 0;\n  padding: 8px 10px;\n  white-space: pre-wrap;\n}\n\n.butex-document2-widget__dev-diagnostic {\n  background: rgba(251, 191, 36, 0.18);\n  border: 1px solid rgba(217, 119, 6, 0.4);\n  border-radius: 8px;\n  color: #92400e;\n  margin: 0;\n  padding: 8px 10px;\n}\n\n@media (max-width: 900px) {\n  .butex-document2-widget__layout,\n  .butex-document2-widget__layout--editor-open.butex-document2-widget__layout--preview-open,\n  .butex-document2-widget__layout--editor-open.butex-document2-widget__layout--preview-closed,\n  .butex-document2-widget__layout--editor-closed.butex-document2-widget__layout--preview-open,\n  .butex-document2-widget__layout--editor-closed.butex-document2-widget__layout--preview-closed {\n    grid-template-columns: minmax(0, 1fr);\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .butex-document2-widget__layout,\n  .butex-document2-widget__editor-panel,\n  .butex-document2-widget__preview-panel {\n    transition: none;\n  }\n}\n\n.butex-document2-widget__cite-chip-wrap {\n  align-items: center;\n  display: inline-flex;\n  gap: 2px;\n  margin-inline: 2px;\n  max-width: 100%;\n  vertical-align: baseline;\n}\n\n.butex-document2-widget__cite-chip {\n  background: color-mix(in srgb, var(--butex-document2-accent) 8%, var(--butex-document2-panel));\n  border: 1.5px solid color-mix(in srgb, var(--butex-document2-accent) 45%, var(--butex-document2-border));\n  border-radius: 6px;\n  color: inherit;\n  cursor: pointer;\n  display: inline-flex;\n  font: inherit;\n  font-variant-numeric: tabular-nums;\n  line-height: 1.3;\n  min-height: 28px;\n  padding: 2px 8px;\n}\n\n.butex-document2-widget__cite-chip[data-editable=\"false\"] {\n  border-style: dashed;\n  cursor: default;\n}\n\n.butex-document2-widget__cite-chip:hover,\n.butex-document2-widget__cite-chip:focus-visible {\n  background: color-mix(in srgb, var(--butex-document2-accent) 14%, var(--butex-document2-panel));\n  border-color: var(--butex-document2-accent);\n}\n\n.butex-document2-widget__cite-chip-delete {\n  background: transparent;\n  border: none;\n  color: var(--butex-document2-muted);\n  cursor: pointer;\n  font: inherit;\n  line-height: 1;\n  padding: 0 4px;\n}\n\n.butex-document2-widget__preview-cite {\n  color: inherit;\n  font-variant-numeric: tabular-nums;\n  white-space: nowrap;\n}\n\n.butex-document2-widget__preview-bibliography,\n.butex-document2-widget__bibliography-editor {\n  display: grid;\n  gap: 0.5rem;\n  list-style: none;\n  margin: 0;\n  padding: 0;\n}\n\n.butex-document2-widget__preview-bibliography li,\n.butex-document2-widget__bibliography-editor li {\n  display: grid;\n  gap: 0.25rem;\n  grid-template-columns: auto 1fr;\n}\n\n.butex-document2-widget__preview-bib-number {\n  font-variant-numeric: tabular-nums;\n}\n\n.butex-document2-widget__block--bibliography {\n  border-color: color-mix(in srgb, var(--butex-document2-accent) 35%, var(--butex-document2-border));\n}\n\n.butex-document2-widget__digit-form-menu {\n  position: relative;\n}\n\n.butex-document2-widget__digit-form-options {\n  background: var(--butex-document2-panel);\n  border: 1px solid var(--butex-document2-border);\n  border-radius: 8px;\n  box-shadow: 0 8px 24px color-mix(in srgb, #000 16%, transparent);\n  display: grid;\n  gap: 2px;\n  inset-inline-start: 0;\n  margin-top: 4px;\n  padding: 4px;\n  position: absolute;\n  top: 100%;\n  z-index: 5;\n}\n\n.butex-document2-widget__digit-form-option {\n  background: transparent;\n  border: none;\n  border-radius: 6px;\n  color: inherit;\n  cursor: pointer;\n  font: inherit;\n  padding: 6px 10px;\n  text-align: start;\n}\n\n.butex-document2-widget__digit-form-option[aria-selected=\"true\"],\n.butex-document2-widget__digit-form-option:hover {\n  background: color-mix(in srgb, var(--butex-document2-accent) 12%, var(--butex-document2-panel));\n}\n\n.butex-document2-widget__cite-picker-backdrop,\n.butex-document2-widget__refs-backdrop {\n  align-items: center;\n  background: color-mix(in srgb, #000 35%, transparent);\n  display: flex;\n  inset: 0;\n  justify-content: center;\n  padding: 1rem;\n  position: fixed;\n  z-index: 40;\n}\n\n.butex-document2-widget__cite-picker,\n.butex-document2-widget__refs-panel {\n  background: var(--butex-document2-panel);\n  border: 1px solid var(--butex-document2-border);\n  border-radius: 12px;\n  box-shadow: 0 16px 40px color-mix(in srgb, #000 22%, transparent);\n  display: grid;\n  gap: 0.75rem;\n  max-height: min(80vh, 640px);\n  max-width: 560px;\n  overflow: auto;\n  padding: 1rem;\n  width: min(100%, 560px);\n}\n\n.butex-document2-widget__cite-picker-header,\n.butex-document2-widget__refs-header,\n.butex-document2-widget__cite-picker-footer,\n.butex-document2-widget__refs-item-head {\n  align-items: center;\n  display: flex;\n  gap: 0.5rem;\n  justify-content: space-between;\n}\n\n.butex-document2-widget__cite-picker-list,\n.butex-document2-widget__refs-list {\n  display: grid;\n  gap: 0.5rem;\n  list-style: none;\n  margin: 0;\n  padding: 0;\n}\n\n.butex-document2-widget__cite-picker-item,\n.butex-document2-widget__refs-field {\n  display: grid;\n  gap: 0.25rem;\n}\n\n.butex-document2-widget__cite-picker-item {\n  align-items: start;\n  grid-template-columns: auto 1fr;\n}\n\n.butex-document2-widget__cite-picker-meta,\n.butex-document2-widget__cite-picker-empty {\n  color: var(--butex-document2-muted);\n  display: block;\n  font-size: 0.92em;\n}\n\n.butex-document2-widget__refs-grid {\n  display: grid;\n  gap: 0.5rem;\n  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));\n}\n\n.butex-document2-widget__refs-field input {\n  background: var(--butex-document2-input-bg, var(--butex-document2-panel));\n  border: 1px solid var(--butex-document2-border);\n  border-radius: 6px;\n  color: inherit;\n  font: inherit;\n  padding: 0.4rem 0.55rem;\n  width: 100%;\n}\n\n.butex-document2-widget__field-error {\n  color: #b42318;\n  font-size: 0.85em;\n  line-height: 1.35;\n  margin: 0;\n}\n\n.butex-document2-widget__field-hint {\n  color: var(--butex-document2-muted);\n  font-size: 0.82em;\n  line-height: 1.35;\n  margin: 0;\n}\n\n.butex-document2-widget__refs-field input[aria-invalid='true'] {\n  border-color: color-mix(in srgb, #b42318 55%, var(--butex-document2-border));\n}\n\n.butex-document2-widget__refs-item {\n  border: 1px solid var(--butex-document2-border);\n  border-radius: 10px;\n  display: grid;\n  gap: 0.5rem;\n  padding: 0.75rem;\n}\n\n.butex-document2-widget__refs-item-key {\n  color: var(--butex-document2-muted);\n  font-size: 0.9em;\n  font-weight: 500;\n}\n\n.butex-document2-widget__modal-preview {\n  background: color-mix(in srgb, var(--butex-document2-panel) 88%, var(--butex-document2-accent-bg));\n  border: 1px dashed color-mix(in srgb, var(--butex-document2-accent) 30%, var(--butex-document2-border));\n  border-radius: 8px;\n  color: inherit;\n  font-size: 0.95em;\n  line-height: 1.55;\n  padding: 0.55rem 0.7rem;\n  text-align: center;\n}\n\n.butex-document2-widget__modal-preview-number {\n  color: var(--butex-document2-muted);\n  font-weight: 600;\n}\n\n.butex-document2-widget__modal-preview-url {\n  color: var(--butex-document2-accent);\n  word-break: break-all;\n}\n\n.butex-document2-widget__refs-separator-toggle {\n  display: inline-flex;\n  gap: 0.35rem;\n}\n\n.butex-document2-widget__refs-separator-toggle button {\n  background: var(--butex-document2-input-bg, var(--butex-document2-panel));\n  border: 1px solid var(--butex-document2-border);\n  border-radius: 6px;\n  color: inherit;\n  cursor: pointer;\n  font: inherit;\n  font-size: 1.15em;\n  line-height: 1;\n  min-width: 2.25rem;\n  padding: 0.35rem 0.55rem;\n}\n\n.butex-document2-widget__refs-separator-toggle button.is-active {\n  background: var(--butex-document2-accent-bg);\n  border-color: color-mix(in srgb, var(--butex-document2-accent) 45%, var(--butex-document2-border));\n  color: var(--butex-document2-accent);\n  font-weight: 700;\n}\n\n.butex-document2-widget__refs-item-actions {\n  display: inline-flex;\n  gap: 0.25rem;\n}\n\n.butex-document2-widget__primary-btn {\n  background: var(--butex-document2-accent);\n  border: none;\n  border-radius: 8px;\n  color: #fff;\n  cursor: pointer;\n  font: inherit;\n  padding: 0.45rem 0.8rem;\n}\n\n.butex-document2-widget__primary-btn:disabled {\n  cursor: not-allowed;\n  opacity: 0.55;\n}\n\n.butex-document2-widget__article-meta {\n  background: color-mix(in srgb, var(--butex-document2-panel) 92%, var(--butex-document2-accent-bg));\n  border: 1px solid var(--butex-document2-border);\n  border-radius: 10px;\n  display: grid;\n  gap: 0.75rem;\n  margin-bottom: 0.85rem;\n  padding: 0.85rem 0.9rem;\n}\n\n.butex-document2-widget__article-meta-header {\n  align-items: center;\n  display: flex;\n  gap: 0.5rem;\n  justify-content: space-between;\n}\n\n.butex-document2-widget__article-meta-badge {\n  background: var(--butex-document2-accent-bg);\n  border: 1px solid color-mix(in srgb, var(--butex-document2-accent) 35%, var(--butex-document2-border));\n  border-radius: 999px;\n  color: var(--butex-document2-accent);\n  font-size: 0.78rem;\n  font-weight: 600;\n  padding: 0.15rem 0.55rem;\n}\n\n.butex-document2-widget__article-meta-date-preview {\n  color: color-mix(in srgb, var(--butex-document2-fg) 70%, transparent);\n  font-size: 0.92rem;\n  margin: 0.15rem 0 0;\n}\n\n.butex-document2-widget__article-meta-fixed {\n  color: color-mix(in srgb, var(--butex-document2-fg) 78%, transparent);\n  font-size: 0.95rem;\n  line-height: 1.7;\n  margin: 0;\n  text-align: center;\n}\n\n.butex-document2-widget__article-meta-grid {\n  display: grid;\n  gap: 0.65rem;\n}\n\n.butex-document2-widget__article-meta-field {\n  display: grid;\n  gap: 0.3rem;\n  font-size: 0.92rem;\n}\n\n.butex-document2-widget__article-meta-field input,\n.butex-document2-widget__article-meta-field textarea {\n  background: var(--butex-document2-input-bg, var(--butex-document2-panel));\n  border: 1px solid var(--butex-document2-border);\n  border-radius: 6px;\n  color: inherit;\n  font: inherit;\n  padding: 0.4rem 0.55rem;\n  width: 100%;\n}\n\n.butex-document2-widget__article-meta-date {\n  display: grid;\n  gap: 0.45rem;\n  grid-template-columns: minmax(4rem, 1fr) minmax(7rem, 2fr) minmax(5rem, 1.2fr);\n}\n\n.butex-document2-widget__hijri-menu {\n  position: relative;\n}\n\n.butex-document2-widget__hijri-menu-trigger {\n  appearance: none;\n  background-color: var(--butex-document2-input-bg, var(--butex-document2-panel));\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%236b7280' d='M1.2 1.3L6 6.1l4.8-4.8 1.2 1.2L6 8.5 0 2.5z'/%3E%3C/svg%3E\");\n  background-position: left 0.65rem center;\n  background-repeat: no-repeat;\n  background-size: 0.7rem;\n  border: 1px solid var(--butex-document2-border);\n  border-radius: 8px;\n  color: inherit;\n  cursor: pointer;\n  font: inherit;\n  min-height: 2.35rem;\n  padding: 0.45rem 0.7rem 0.45rem 1.7rem;\n  text-align: start;\n  transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;\n  width: 100%;\n}\n\n.butex-document2-widget[dir=\"rtl\"] .butex-document2-widget__hijri-menu-trigger {\n  background-position: right 0.65rem center;\n  padding: 0.45rem 1.7rem 0.45rem 0.7rem;\n}\n\n.butex-document2-widget__hijri-menu-trigger:hover,\n.butex-document2-widget__hijri-menu-trigger[aria-expanded=\"true\"] {\n  background-color: color-mix(in srgb, var(--butex-document2-accent-bg) 55%, var(--butex-document2-panel));\n  border-color: color-mix(in srgb, var(--butex-document2-accent) 45%, var(--butex-document2-border));\n}\n\n.butex-document2-widget__hijri-menu-trigger:focus-visible {\n  border-color: var(--butex-document2-accent);\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--butex-document2-accent) 28%, transparent);\n  outline: none;\n}\n\n.butex-document2-widget__hijri-menu-list {\n  background: var(--butex-document2-panel);\n  border: 1px solid var(--butex-document2-border);\n  border-radius: 10px;\n  box-shadow: 0 12px 28px color-mix(in srgb, #000 18%, transparent);\n  inset-inline-start: 0;\n  list-style: none;\n  margin: 0.3rem 0 0;\n  max-height: 14rem;\n  overflow-x: hidden;\n  overflow-y: auto;\n  padding: 0.35rem;\n  position: absolute;\n  scrollbar-color: color-mix(in srgb, var(--butex-document2-muted) 55%, transparent) transparent;\n  scrollbar-width: thin;\n  top: 100%;\n  width: 100%;\n  z-index: 12;\n}\n\n.butex-document2-widget__hijri-menu-list::-webkit-scrollbar {\n  width: 0.55rem;\n}\n\n.butex-document2-widget__hijri-menu-list::-webkit-scrollbar-track {\n  background: transparent;\n  margin: 0.35rem 0;\n}\n\n.butex-document2-widget__hijri-menu-list::-webkit-scrollbar-thumb {\n  background: color-mix(in srgb, var(--butex-document2-muted) 45%, transparent);\n  border: 2px solid transparent;\n  border-radius: 999px;\n  background-clip: padding-box;\n}\n\n.butex-document2-widget__hijri-menu-list::-webkit-scrollbar-thumb:hover {\n  background: color-mix(in srgb, var(--butex-document2-accent) 55%, var(--butex-document2-muted));\n  background-clip: padding-box;\n  border: 2px solid transparent;\n}\n\n.butex-document2-widget__hijri-menu-option {\n  background: transparent;\n  border: none;\n  border-radius: 7px;\n  color: inherit;\n  cursor: pointer;\n  display: block;\n  font: inherit;\n  padding: 0.45rem 0.65rem;\n  text-align: start;\n  width: 100%;\n}\n\n.butex-document2-widget__hijri-menu-option:hover,\n.butex-document2-widget__hijri-menu-option[aria-selected=\"true\"] {\n  background: color-mix(in srgb, var(--butex-document2-accent) 14%, var(--butex-document2-panel));\n}\n\n.butex-document2-widget__hijri-menu-option:focus-visible {\n  outline: 2px solid color-mix(in srgb, var(--butex-document2-accent) 55%, transparent);\n  outline-offset: -2px;\n}\n\n.butex-document2-widget__visually-hidden {\n  border: 0;\n  clip: rect(0, 0, 0, 0);\n  height: 1px;\n  margin: -1px;\n  overflow: hidden;\n  padding: 0;\n  position: absolute;\n  white-space: nowrap;\n  width: 1px;\n}\n\n.butex-document2-widget__preview-basmala,\n.butex-document2-widget__preview-closing {\n  margin: 0.35rem 0 0.85rem;\n}\n\n.butex-document2-widget__preview-basmala .butex-document2-widget__math-island[data-display=\"true\"],\n.butex-document2-widget__preview-closing .butex-document2-widget__math-island[data-display=\"true\"] {\n  margin: 0;\n}\n\n.butex-document2-widget__preview-title-block {\n  background: color-mix(in srgb, var(--butex-document2-accent-bg) 55%, transparent);\n  border: 1px solid color-mix(in srgb, var(--butex-document2-border) 75%, transparent);\n  border-radius: 10px;\n  margin: 0.5rem 0 1rem;\n  padding: 0.85rem 1rem;\n  text-align: center;\n}\n\n.butex-document2-widget__preview-article-title {\n  font-size: 1.45rem;\n  font-weight: 700;\n  line-height: 1.35;\n  margin: 0 0 0.45rem;\n}\n\n.butex-document2-widget__preview-article-authors,\n.butex-document2-widget__preview-article-date {\n  margin: 0.2rem 0;\n}\n\n.butex-document2-widget__preview-article-date {\n  color: color-mix(in srgb, var(--butex-document2-fg) 72%, transparent);\n  font-size: 0.95rem;\n}\n\n.butex-document2-widget__preview-abstract {\n  background: color-mix(in srgb, var(--butex-document2-panel) 88%, var(--butex-document2-muted));\n  border: 1px dashed color-mix(in srgb, var(--butex-document2-border) 85%, transparent);\n  border-radius: 8px;\n  margin: 0.75rem 0 1rem;\n  padding: 0.75rem 0.9rem;\n}\n\n.butex-document2-widget__preview-abstract-label {\n  font-size: 1rem;\n  font-weight: 700;\n  margin: 0 0 0.35rem;\n}\n\n.butex-document2-widget__preview-abstract p {\n  margin: 0;\n}\n\n.butex-document2-widget__preview-empty-body {\n  color: var(--butex-document2-muted);\n  font-style: italic;\n  text-align: center;\n}\n";
 declare function injectBuTeXDocument2Styles(doc?: Document): void;
 
-export { ButexDocumentEditor2, type ButexDocumentEditor2Props, type ButexUiLocale, DOCUMENT2_WIDGET_CSS, type Document2InitialState, DocumentInsertToolbar, type DocumentInsertToolbarProps, DocumentPreview, EquationDrawer, InlineField, MathChip, MathIsland, injectBuTeXDocument2Styles, resolveInitialDocument2 };
+export { ButexDocumentEditor2, type ButexDocumentEditor2Props, type ButexDocumentEditor2Ref, type ButexUiLocale, DOCUMENT2_WIDGET_CSS, type Document2InitialState, DocumentInsertToolbar, type DocumentInsertToolbarProps, DocumentPreview, EquationDrawer, InlineField, MathChip, MathIsland, injectBuTeXDocument2Styles, resolveInitialDocument2 };

package/dist/react-document2.d.ts

@@ -1,3 +1,4 @@
+import * as react from 'react';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 
 type EditorSide = 'english' | 'arabic';
@@ -484,8 +485,17 @@ type Document2InitialState = {
     document: Document2Node;
     error: string | null;
 };
+/** Imperative host API — insert/update figures on the live document without remounting. */
+type ButexDocumentEditor2Ref = {
+    /** Insert image block after focused block (same as toolbar figure button). */
+    insertImageBlock: (srcOrAssetId?: string) => void;
+    /** Set path on an existing image block. */
+    updateImageBlockValue: (blockId: string, value: string) => void;
+    /** Canonical JSON without host-side AST mutation. */
+    getDocumentJson: () => Document2Json;
+};
 declare function resolveInitialDocument2(initialDocument: Document2Json | Document2Node | undefined, uiLocale?: ButexUiLocale, documentMeta?: Document2MetaProp): Document2InitialState;
-declare function ButexDocumentEditor2({ initialDocument, documentMeta, className, debug, documentDirection, equationSide, editableEquations, previewOnly, uiLocale, mathOutput, digitForm: digitFormProp, onDigitFormChange, resolveImageUrl, onDocumentChange, onDocumentJsonChange, onLatexChange, }: ButexDocumentEditor2Props): react_jsx_runtime.JSX.Element;
+declare const ButexDocumentEditor2: react.ForwardRefExoticComponent<ButexDocumentEditor2Props & react.RefAttributes<ButexDocumentEditor2Ref>>;
 
 type DocumentInsertToolbarProps = {
     canUndo: boolean;
@@ -617,4 +627,4 @@ declare function MathIsland({ id, tex, display, output }: MathIslandProps): reac
 declare const DOCUMENT2_WIDGET_CSS = "\n.butex-document2-widget {\n  --butex-document2-bg: var(--butex-bg, #f8fafc);\n  --butex-document2-fg: var(--butex-fg, #0f172a);\n  --butex-document2-muted: var(--butex-muted, #64748b);\n  --butex-document2-panel: var(--butex-panel, #ffffff);\n  --butex-document2-border: var(--butex-border, #e2e8f0);\n  --butex-document2-accent: var(--butex-accent, #0d9488);\n  --butex-document2-accent-bg: var(--butex-toolbar-hover-bg, rgba(13, 148, 136, 0.08));\n  --butex-document2-focus-shadow: var(--butex-focus-shadow, rgba(13, 148, 136, 0.16));\n  --butex-document2-danger: var(--butex-danger, #dc2626);\n  --butex-document2-error: var(--butex-error, #b91c1c);\n  --butex-document2-error-bg: var(--butex-error-bg, #fef2f2);\n  --butex-document2-preview-bg: var(--butex-preview-bg, #ffffff);\n  --butex-document2-preview-fg: var(--butex-preview-fg, var(--butex-document2-fg));\n  --butex-document2-preview-font: \"Amiri\", \"Noto Serif Arabic\", Georgia, \"Times New Roman\", serif;\n  --butex-document2-drawer-bg: var(--butex-document2-panel);\n  --butex-document2-input-bg: #ffffff;\n  --butex-document2-raw-bg: #f8fafc;\n  --butex-document2-math-bg: var(--butex-document2-accent-bg);\n  --butex-document2-math-border: rgba(13, 148, 136, 0.35);\n  --butex-document2-text-token-bg: var(--butex-text-token-bg, color-mix(in srgb, var(--butex-document2-panel) 86%, var(--butex-document2-bg)));\n  --butex-document2-text-token-border: var(--butex-text-token-border, color-mix(in srgb, var(--butex-document2-border) 86%, var(--butex-document2-muted)));\n  --butex-document2-math-inline-bg: var(--butex-math-inline-bg, color-mix(in srgb, var(--butex-document2-accent) 10%, var(--butex-document2-panel)));\n  --butex-document2-math-display-bg: var(--butex-math-display-bg, color-mix(in srgb, var(--butex-document2-accent) 7%, var(--butex-document2-bg)));\n  --butex-document2-collapse-bg: var(--butex-collapse-bg, color-mix(in srgb, var(--butex-document2-muted) 8%, var(--butex-document2-panel)));\n  --butex-document2-dev-bg: var(--butex-dev-bg, #fffbeb);\n  --butex-document2-dev-border: var(--butex-dev-border, #fcd34d);\n  --butex-document2-dev-code-bg: var(--butex-dev-inset-bg, #ffffff);\n  --butex-document2-dev-code-fg: var(--butex-dev-inset-fg, var(--butex-document2-fg));\n  box-sizing: border-box;\n  color: var(--butex-document2-fg);\n  direction: rtl;\n  font-family: ui-sans-serif, system-ui, \"Segoe UI\", Tahoma, Arial, sans-serif;\n  line-height: 1.45;\n}\n\n.butex-document2-widget *,\n.butex-document2-widget *::before,\n.butex-document2-widget *::after {\n  box-sizing: inherit;\n}\n\n.butex-document2-widget__shell,\n.butex-document2-widget__editor-panel,\n.butex-document2-widget__blocks,\n.butex-document2-widget__dev,\n.butex-document2-widget__field {\n  display: grid;\n  gap: 10px;\n  min-width: 0;\n}\n\n.butex-document2-widget__toolbar,\n.butex-document2-widget__panel,\n.butex-document2-widget__block,\n.butex-document2-widget__dev {\n  background: var(--butex-document2-panel);\n  border: 1px solid var(--butex-document2-border);\n  border-radius: 12px;\n  min-width: 0;\n  padding: 12px;\n}\n\n.butex-document2-widget__toolbar {\n  position: sticky;\n  top: 0;\n  z-index: 20;\n  box-shadow: 0 4px 16px color-mix(in srgb, var(--butex-document2-fg) 6%, transparent);\n  gap: 6px;\n}\n\n.butex-document2-widget__toolbar-insert {\n  align-items: center;\n  display: flex;\n  flex: 1 1 auto;\n  flex-wrap: wrap;\n  gap: 6px;\n  min-width: 0;\n}\n\n.butex-document2-widget__toolbar-group {\n  align-items: center;\n  border-inline-start: 1px solid color-mix(in srgb, var(--butex-document2-border) 75%, transparent);\n  display: flex;\n  flex-wrap: wrap;\n  gap: 4px;\n  padding-inline-start: 6px;\n}\n\n.butex-document2-widget__toolbar-group:first-child {\n  border-inline-start: 0;\n  padding-inline-start: 0;\n}\n\n.butex-document2-widget__icon-btn {\n  align-items: center;\n  background: var(--butex-document2-panel);\n  border: 1px solid var(--butex-document2-border);\n  border-radius: 8px;\n  color: var(--butex-document2-fg);\n  cursor: pointer;\n  display: inline-flex;\n  font-weight: 700;\n  justify-content: center;\n  line-height: 1;\n  min-height: 30px;\n  min-width: 30px;\n  padding: 0 6px;\n}\n\n.butex-document2-widget__icon-btn:hover:not(:disabled),\n.butex-document2-widget__icon-btn[aria-pressed=\"true\"] {\n  background: var(--butex-document2-accent-bg);\n  border-color: var(--butex-document2-accent);\n}\n\n.butex-document2-widget__icon-btn:disabled {\n  cursor: not-allowed;\n  opacity: 0.45;\n}\n\n.butex-document2-widget__icon-btn--h1 {\n  font-size: 1.15rem;\n}\n\n.butex-document2-widget__icon-btn--h2 {\n  font-size: 1rem;\n}\n\n.butex-document2-widget__icon-btn--h3 {\n  font-size: 0.88rem;\n}\n\n.butex-document2-widget__icon-math-inline {\n  font-family: ui-monospace, Consolas, monospace;\n  font-size: 0.78rem;\n  font-weight: 600;\n}\n\n.butex-document2-widget__icon-math-display {\n  font-size: 0.82rem;\n  font-weight: 700;\n}\n\n.butex-document2-widget__icon-bibliography {\n  display: inline-flex;\n  line-height: 0;\n}\n\n.butex-document2-widget__icon-bibliography svg {\n  display: block;\n}\n\n.butex-document2-widget__format-btn {\n  font-family: \"Amiri\", \"Noto Serif Arabic\", Georgia, serif;\n  min-width: 36px;\n}\n\n.butex-document2-widget__format-icon {\n  direction: rtl;\n  display: inline-block;\n  font-size: 0.84rem;\n  font-weight: 500;\n}\n\n.butex-document2-widget__format-icon--bold {\n  font-weight: 900;\n}\n\n.butex-document2-widget__format-icon--italic {\n  font-style: italic;\n  transform: skewX(-7deg);\n}\n\n.butex-document2-widget__format-icon--underline {\n  text-decoration: underline;\n  text-underline-offset: 0.12em;\n}\n\n.butex-document2-widget__format-underline,\n.butex-document2-widget__preview-underline {\n  text-decoration: underline;\n  text-underline-offset: 0.12em;\n}\n\n.butex-document2-widget__references-menu {\n  position: relative;\n}\n\n.butex-document2-widget__references-trigger {\n  gap: 5px;\n  white-space: nowrap;\n}\n\n.butex-document2-widget__menu-chevron {\n  color: var(--butex-document2-muted);\n  font-size: 0.8rem;\n}\n\n.butex-document2-widget__references-menu-options {\n  background: var(--butex-document2-panel);\n  border: 1px solid var(--butex-document2-border);\n  border-radius: 8px;\n  box-shadow: 0 8px 24px color-mix(in srgb, var(--butex-document2-fg) 16%, transparent);\n  display: grid;\n  gap: 2px;\n  inset-inline-start: 0;\n  margin-top: 4px;\n  min-width: max-content;\n  padding: 4px;\n  position: absolute;\n  top: 100%;\n  z-index: 30;\n}\n\n.butex-document2-widget__references-menu-options button {\n  align-items: center;\n  background: transparent;\n  border: 0;\n  border-radius: 6px;\n  color: var(--butex-document2-fg);\n  cursor: pointer;\n  display: grid;\n  font: inherit;\n  gap: 8px;\n  grid-template-columns: 18px 1fr;\n  padding: 7px 9px;\n  text-align: start;\n}\n\n.butex-document2-widget__references-menu-options button:hover,\n.butex-document2-widget__references-menu-options button:focus-visible {\n  background: var(--butex-document2-accent-bg);\n  outline: none;\n}\n\n.butex-document2-widget__float-meta {\n  display: grid;\n  gap: 8px;\n  margin-top: 8px;\n}\n\n.butex-document2-widget__float-meta--compact {\n  gap: 4px;\n}\n\n.butex-document2-widget__float-meta-toggle {\n  align-items: center;\n  display: inline-flex;\n  gap: 6px;\n  font-size: 0.9rem;\n}\n\n.butex-document2-widget__preview-paragraph--centered {\n  text-align: center;\n}\n\n.butex-document2-widget__labels-help {\n  color: color-mix(in srgb, var(--butex-document2-fg) 72%, transparent);\n  font-size: 0.9rem;\n  margin: 0 0 10px;\n}\n\n.butex-document2-widget__preview-float {\n  margin: 0.75rem 0;\n  text-align: center;\n}\n\n.butex-document2-widget__preview-float figcaption {\n  color: color-mix(in srgb, var(--butex-document2-fg) 80%, transparent);\n  font-size: 0.92rem;\n  margin-top: 0.4rem;\n  text-align: center;\n}\n\n.butex-document2-widget__preview-float-number {\n  font-weight: 600;\n}\n\n.butex-document2-widget__preview-ref {\n  font-variant-numeric: tabular-nums;\n}\n\n.butex-document2-widget__ref-chip {\n  border-style: dashed;\n}\n\n.butex-document2-widget__block-actions {\n  align-items: center;\n  display: flex;\n  flex-wrap: wrap;\n  gap: 6px;\n}\n\n.butex-document2-widget button.butex-document2-widget__block-collapse {\n  align-items: center;\n  background: var(--butex-document2-collapse-bg);\n  border-color: color-mix(in srgb, var(--butex-document2-border) 70%, var(--butex-document2-muted));\n  display: inline-flex;\n  font-weight: 800;\n  justify-content: center;\n  min-height: 26px;\n  min-width: 26px;\n  padding: 0;\n}\n\n.butex-document2-widget__math-chip-wrap {\n  align-items: center;\n  display: inline-flex;\n  gap: 2px;\n}\n\n.butex-document2-widget__math-chip-wrap[data-display=\"true\"] {\n  flex: 1 1 100%;\n  justify-content: center;\n  width: 100%;\n}\n\n.butex-document2-widget__math-chip-delete {\n  background: transparent;\n  border: 1px solid color-mix(in srgb, var(--butex-document2-danger) 35%, var(--butex-document2-border));\n  border-radius: 6px;\n  color: var(--butex-document2-danger);\n  cursor: pointer;\n  font-size: 0.85rem;\n  line-height: 1;\n  min-height: 24px;\n  min-width: 24px;\n  padding: 0;\n}\n\n.butex-document2-widget__table-cell {\n  flex: 1 1 8rem;\n  min-width: 8rem;\n}\n\n.butex-document2-widget__block--table .butex-document2-widget__inline-text {\n  min-height: 3.5em;\n  min-width: min(12ch, 100%);\n}\n\n.butex-document2-widget__table-popover {\n  display: inline-block;\n  position: relative;\n}\n\n.butex-document2-widget__table-popover-panel {\n  background: var(--butex-document2-panel);\n  border: 1px solid var(--butex-document2-border);\n  border-radius: 10px;\n  box-shadow: 0 8px 24px color-mix(in srgb, var(--butex-document2-fg) 12%, transparent);\n  display: grid;\n  gap: 8px;\n  inset-inline-end: 0;\n  padding: 10px;\n  position: absolute;\n  top: calc(100% + 6px);\n  width: min(220px, 70vw);\n  z-index: 30;\n}\n\n.butex-document2-widget__table-popover-panel label {\n  color: var(--butex-document2-muted);\n  display: grid;\n  font-size: 0.82rem;\n  gap: 4px;\n}\n\n.butex-document2-widget__toolbar-row {\n  align-items: center;\n  border-block-end: 1px solid color-mix(in srgb, var(--butex-document2-border) 70%, transparent);\n  display: flex;\n  flex-wrap: wrap;\n  gap: 8px;\n  margin-block-end: 8px;\n  padding-block-end: 8px;\n  width: 100%;\n}\n\n.butex-document2-widget__toolbar-row:last-child {\n  border-block-end: 0;\n  margin-block-end: 0;\n  padding-block-end: 0;\n}\n\n.butex-document2-widget__toolbar-label {\n  color: var(--butex-document2-muted);\n  font-size: 0.78rem;\n  font-weight: 600;\n  margin-inline-end: 4px;\n  white-space: nowrap;\n}\n\n.butex-document2-widget__block-header {\n  align-items: center;\n  border-block-end: 1px solid color-mix(in srgb, var(--butex-document2-border) 80%, transparent);\n  display: flex;\n  flex-wrap: wrap;\n  gap: 8px;\n  justify-content: space-between;\n  margin-block-end: 10px;\n  padding-block-end: 8px;\n}\n\n.butex-document2-widget__block-select {\n  accent-color: var(--butex-document2-accent);\n  cursor: pointer;\n  flex: 0 0 auto;\n  height: 1rem;\n  margin: 0;\n  width: 1rem;\n}\n\n.butex-document2-widget__block--selected {\n  background: var(--butex-document2-accent-bg);\n  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--butex-document2-accent) 45%, transparent);\n}\n\n.butex-document2-widget__selection-count {\n  color: var(--butex-document2-muted);\n  font-size: 0.78rem;\n  font-weight: 600;\n  padding-inline: 4px;\n  white-space: nowrap;\n}\n\n.butex-document2-widget__block-title {\n  align-items: center;\n  color: var(--butex-document2-fg);\n  display: inline-flex;\n  gap: 8px;\n  font-weight: 700;\n}\n\n.butex-document2-widget__block--section .butex-document2-widget__block-title {\n  font-size: 1.12rem;\n}\n\n.butex-document2-widget__block--subsection .butex-document2-widget__block-title {\n  font-size: 1.04rem;\n}\n\n.butex-document2-widget__block--subsubsection .butex-document2-widget__block-title {\n  font-size: 0.98rem;\n}\n\n.butex-document2-widget__block--paragraph .butex-document2-widget__block-title {\n  color: var(--butex-document2-muted);\n  font-size: 0.86rem;\n  font-weight: 600;\n}\n\n.butex-document2-widget__block--list .butex-document2-widget__block-title,\n.butex-document2-widget__block--table .butex-document2-widget__block-title,\n.butex-document2-widget__block--image .butex-document2-widget__block-title,\n.butex-document2-widget__block--raw .butex-document2-widget__block-title {\n  font-size: 0.9rem;\n}\n\n.butex-document2-widget__block--section {\n  background: color-mix(in srgb, var(--butex-document2-accent) 9%, var(--butex-document2-panel));\n  border-inline-start: 4px solid var(--butex-document2-accent);\n}\n\n.butex-document2-widget__block--subsection {\n  background: color-mix(in srgb, var(--butex-document2-accent) 6%, var(--butex-document2-panel));\n  border-inline-start: 3px solid color-mix(in srgb, var(--butex-document2-accent) 78%, var(--butex-document2-border));\n}\n\n.butex-document2-widget__block--subsubsection {\n  background: color-mix(in srgb, var(--butex-document2-accent) 4%, var(--butex-document2-panel));\n  border-inline-start: 3px solid var(--butex-document2-border);\n}\n\n.butex-document2-widget__block--paragraph {\n  border-inline-start: 2px solid color-mix(in srgb, var(--butex-document2-muted) 35%, transparent);\n}\n\n.butex-document2-widget__block--list {\n  background: color-mix(in srgb, var(--butex-document2-bg) 55%, var(--butex-document2-panel));\n  border-inline-start: 3px solid color-mix(in srgb, var(--butex-document2-accent) 55%, var(--butex-document2-border));\n}\n\n.butex-document2-widget__block--table {\n  background: color-mix(in srgb, var(--butex-document2-bg) 40%, var(--butex-document2-panel));\n  border-inline-start: 3px solid var(--butex-document2-border);\n}\n\n.butex-document2-widget__block--image {\n  background: color-mix(in srgb, var(--butex-document2-muted) 6%, var(--butex-document2-panel));\n  border-inline-start: 3px dashed color-mix(in srgb, var(--butex-document2-muted) 45%, var(--butex-document2-border));\n}\n\n.butex-document2-widget__block--raw {\n  background: color-mix(in srgb, var(--butex-document2-muted) 8%, var(--butex-document2-panel));\n  border-inline-start: 3px dashed var(--butex-document2-muted);\n}\n\n.butex-document2-widget__block--collapsed {\n  background: var(--butex-document2-collapse-bg);\n}\n\n.butex-document2-widget__block--collapsed .butex-document2-widget__block-header {\n  margin-block-end: 8px;\n}\n\n.butex-document2-widget__block-summary {\n  background: color-mix(in srgb, var(--butex-document2-panel) 72%, transparent);\n  border: 1px dashed color-mix(in srgb, var(--butex-document2-border) 70%, var(--butex-document2-muted));\n  border-radius: 8px;\n  color: var(--butex-document2-muted);\n  font-size: 0.86rem;\n  line-height: 1.5;\n  min-width: 0;\n  overflow-wrap: anywhere;\n  padding: 8px 10px;\n}\n\n.butex-document2-widget__list-item-actions {\n  align-items: center;\n  display: flex;\n  flex-wrap: wrap;\n  gap: 6px;\n  margin-block-start: 6px;\n}\n\n.butex-document2-widget__list-item-content {\n  display: grid;\n  gap: 8px;\n  min-width: 0;\n}\n\n.butex-document2-widget__list-footer {\n  border-block-start: 1px dashed color-mix(in srgb, var(--butex-document2-border) 85%, transparent);\n  margin-block-start: 10px;\n  padding-block-start: 10px;\n}\n\n.butex-document2-widget__button--danger:hover {\n  border-color: var(--butex-document2-danger);\n  color: var(--butex-document2-danger);\n}\n\n.butex-document2-widget__image-src-label {\n  color: var(--butex-document2-muted);\n  display: block;\n  font-size: 0.82rem;\n  margin-block-end: 4px;\n}\n\n.butex-document2-widget__toolbar,\n.butex-document2-widget__row {\n  align-items: center;\n  display: flex;\n  flex-wrap: wrap;\n  gap: 8px;\n}\n\n.butex-document2-widget button {\n  background: var(--butex-document2-panel);\n  border: 1px solid var(--butex-document2-border);\n  border-radius: 8px;\n  color: var(--butex-document2-fg);\n  cursor: pointer;\n  min-height: 32px;\n  padding: 0 10px;\n}\n\n.butex-document2-widget button:hover,\n.butex-document2-widget button[aria-pressed=\"true\"] {\n  background: var(--butex-document2-accent-bg);\n  border-color: var(--butex-document2-accent);\n}\n\n.butex-document2-widget button:focus-visible,\n.butex-document2-widget input:focus-visible,\n.butex-document2-widget textarea:focus-visible {\n  border-color: var(--butex-document2-accent);\n  box-shadow: 0 0 0 3px var(--butex-document2-focus-shadow);\n  outline: none;\n}\n\n.butex-document2-widget input {\n  background: var(--butex-document2-input-bg);\n  border: 1px solid var(--butex-document2-border);\n  border-radius: 8px;\n  color: var(--butex-document2-fg);\n  font: inherit;\n  min-height: 34px;\n  padding: 7px 9px;\n}\n\n.butex-document2-widget textarea {\n  background: var(--butex-document2-input-bg);\n  border: 1px solid var(--butex-document2-border);\n  border-radius: 8px;\n  color: var(--butex-document2-fg);\n  font: inherit;\n  line-height: 1.45;\n  padding: 7px 9px;\n}\n\n.butex-document2-widget__layout {\n  align-items: start;\n  display: grid;\n  gap: 12px;\n  grid-template-columns: minmax(0, 1fr) minmax(280px, 0.9fr);\n  transition: grid-template-columns 0.22s ease;\n}\n\n.butex-document2-widget__layout--editor-open.butex-document2-widget__layout--preview-open {\n  grid-template-columns: minmax(0, 1fr) minmax(280px, 0.9fr);\n}\n\n/* One visible panel: a single track so the panel fills the widget (previewOnly / hide editor / hide preview). */\n.butex-document2-widget__layout--editor-open.butex-document2-widget__layout--preview-closed,\n.butex-document2-widget__layout--editor-closed.butex-document2-widget__layout--preview-open,\n.butex-document2-widget__layout--editor-closed.butex-document2-widget__layout--preview-closed {\n  grid-template-columns: minmax(0, 1fr);\n}\n\n.butex-document2-widget__editor-panel,\n.butex-document2-widget__preview-panel {\n  min-width: 0;\n  opacity: 1;\n  overflow-x: hidden;\n  overflow-y: auto;\n  transform: translateX(0);\n  transition:\n    opacity 0.18s ease,\n    transform 0.22s ease,\n    padding 0.22s ease,\n    border-width 0.22s ease,\n    box-shadow 0.22s ease;\n}\n\n/* When previewOnly (or display:none) leaves a lone panel, span the full grid. */\n.butex-document2-widget__editor-panel:only-child,\n.butex-document2-widget__preview-panel:only-child {\n  grid-column: 1 / -1;\n  width: 100%;\n}\n\n.butex-document2-widget__layout--editor-closed .butex-document2-widget__editor-panel,\n.butex-document2-widget__layout--preview-closed .butex-document2-widget__preview-panel {\n  display: none;\n}\n\n.butex-document2-widget__inline-field {\n  align-items: center;\n  display: flex;\n  flex-wrap: wrap;\n  gap: 6px;\n  max-width: 100%;\n  min-width: 0;\n  width: 100%;\n}\n\n.butex-document2-widget__inline-text {\n  background: var(--butex-document2-text-token-bg);\n  border-color: var(--butex-document2-text-token-border);\n  box-sizing: border-box;\n  flex: 0 1 auto;\n  max-width: 100%;\n  min-height: 2.75em;\n  min-width: 3ch;\n  overflow-wrap: break-word;\n  overflow-y: hidden;\n  resize: none;\n  text-align: start;\n  white-space: pre-wrap;\n  width: auto;\n  word-break: break-word;\n}\n\n.butex-document2-widget__inline-text:hover {\n  border-color: color-mix(in srgb, var(--butex-document2-text-token-border) 55%, var(--butex-document2-accent));\n}\n\n.butex-document2-widget__inline-text[data-bold=\"true\"] {\n  font-weight: 700;\n}\n\n.butex-document2-widget__inline-text[data-italic=\"true\"] {\n  font-style: italic;\n}\n\n.butex-document2-widget__inline-text[data-underline=\"true\"] {\n  text-decoration: underline;\n  text-underline-offset: 0.12em;\n}\n\n.butex-document2-widget__inline-field input {\n  min-width: 12ch;\n}\n\n.butex-document2-widget__math-chip {\n  background: var(--butex-document2-math-inline-bg);\n  border-color: color-mix(in srgb, var(--butex-document2-math-border) 70%, var(--butex-document2-accent));\n  border-width: 1.5px;\n  direction: ltr;\n  display: inline-flex;\n  font-family: inherit;\n  gap: 4px;\n  max-width: 100%;\n  min-height: 30px;\n  overflow: visible;\n  padding: 3px 7px;\n  unicode-bidi: isolate;\n}\n\n.butex-document2-widget__math-chip:hover,\n.butex-document2-widget__math-chip:focus-visible {\n  background: color-mix(in srgb, var(--butex-document2-accent) 12%, var(--butex-document2-panel));\n  border-color: var(--butex-document2-accent);\n}\n\n.butex-document2-widget__math-chip[data-editable=\"false\"] {\n  border-style: dashed;\n  color: var(--butex-document2-muted);\n}\n\n.butex-document2-widget__math-chip[data-display=\"true\"] {\n  background: var(--butex-document2-math-display-bg);\n  border-color: color-mix(in srgb, var(--butex-document2-accent) 50%, var(--butex-document2-border));\n  border-width: 1.5px;\n  border-radius: 10px;\n  box-shadow: 0 5px 16px color-mix(in srgb, var(--butex-document2-fg) 8%, transparent);\n  justify-content: center;\n  margin-block: 4px;\n  min-height: 54px;\n  padding: 10px 12px;\n  width: min(100%, 36rem);\n}\n\n.butex-document2-widget__preview {\n  background: var(--butex-document2-preview-bg);\n  color: var(--butex-document2-preview-fg);\n  font-family: var(--butex-document2-preview-font);\n  font-size: 1.08rem;\n  line-height: 1.9;\n  max-width: 100%;\n  min-width: 0;\n  overflow-wrap: break-word;\n  text-align: start;\n  word-break: break-word;\n}\n\n.butex-document2-widget__preview h1,\n.butex-document2-widget__preview h2,\n.butex-document2-widget__preview h3,\n.butex-document2-widget__preview p,\n.butex-document2-widget__preview li {\n  max-width: 100%;\n  overflow-wrap: break-word;\n  white-space: normal;\n  word-break: break-word;\n}\n\n.butex-document2-widget__preview h1 {\n  font-size: 1.75rem;\n  font-weight: 700;\n  line-height: 1.35;\n  margin: 0 0 14px;\n}\n\n.butex-document2-widget__preview h2 {\n  font-size: 1.4rem;\n  font-weight: 600;\n  line-height: 1.4;\n  margin: 0 0 12px;\n}\n\n.butex-document2-widget__preview h3 {\n  font-size: 1.2rem;\n  font-weight: 600;\n  line-height: 1.45;\n  margin: 0 0 10px;\n}\n\n.butex-document2-widget__preview p {\n  margin: 0 0 12px;\n}\n\n.butex-document2-widget__preview ul,\n.butex-document2-widget__preview ol {\n  margin: 0 0 12px;\n  padding-inline-start: 24px;\n}\n\n.butex-document2-widget__preview ul {\n  list-style-type: disc;\n}\n\n.butex-document2-widget__preview ol {\n  list-style-type: decimal;\n}\n\n.butex-document2-widget__preview img {\n  display: block;\n  height: auto;\n  max-width: 100%;\n}\n\n.butex-document2-widget__preview table {\n  border-collapse: collapse;\n  border: 1px solid #000000;\n  margin: 12px 0;\n  max-width: 100%;\n  table-layout: fixed;\n  width: 100%;\n}\n\n.butex-document2-widget__preview td {\n  border: 1px solid #000000;\n  max-width: 100%;\n  overflow-wrap: break-word;\n  padding: 6px 8px;\n  white-space: normal;\n  word-break: break-word;\n}\n\n.butex-document2-widget__math-island {\n  direction: ltr;\n  display: inline-block;\n  line-height: normal;\n  margin: 0 2px;\n  overflow: visible;\n  unicode-bidi: isolate;\n  vertical-align: middle;\n}\n\n/* Guard against host CSS resets (e.g. Tailwind Preflight's `svg { display: block }`).\n * MathJax v4 inline line-breaking emits an equation as several sibling <svg> chunks;\n * a block-level svg reset stacks them vertically inside the island. */\n.butex-document2-widget mjx-container svg {\n  display: inline;\n}\n\n.butex-document2-widget__math-chip .butex-document2-widget__math-island {\n  margin: 0;\n}\n\n.butex-document2-widget__math-island[data-render-state=\"loading\"] {\n  opacity: 0.72;\n}\n\n.butex-document2-widget__math-island[data-render-state=\"error\"] {\n  color: var(--butex-document2-error);\n  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;\n  font-size: 0.88rem;\n  max-width: 100%;\n  overflow-wrap: anywhere;\n  white-space: normal;\n}\n\n.butex-document2-widget__math-island[data-display=\"true\"] {\n  display: block;\n  margin: 10px 0;\n  text-align: center;\n}\n\n.butex-document2-widget__math-chip .butex-document2-widget__math-island[data-display=\"true\"] {\n  margin: 0;\n}\n\n.butex-document2-widget__raw {\n  background: var(--butex-document2-raw-bg);\n  border-radius: 8px;\n  direction: ltr;\n  padding: 8px;\n  text-align: left;\n  white-space: pre-wrap;\n}\n\n.butex-document2-widget__error {\n  background: var(--butex-document2-error-bg);\n  border: 1px solid var(--butex-document2-error);\n  border-radius: 8px;\n  color: var(--butex-document2-error);\n  padding: 10px;\n}\n\n.butex-document2-widget__equation-modal {\n  align-items: center;\n  display: flex;\n  inset: 0;\n  justify-content: center;\n  padding: 16px;\n  position: fixed;\n  z-index: 30;\n}\n\n.butex-document2-widget__equation-modal-backdrop {\n  background: color-mix(in srgb, var(--butex-document2-fg) 34%, transparent);\n  border: 0;\n  cursor: pointer;\n  display: block;\n  height: 100%;\n  inset: 0;\n  margin: 0;\n  padding: 0;\n  position: absolute;\n  width: 100%;\n}\n\n.butex-document2-widget__equation-modal-panel {\n  background: var(--butex-document2-drawer-bg);\n  border: 1px solid var(--butex-document2-border);\n  border-radius: 12px;\n  box-shadow: 0 18px 48px color-mix(in srgb, var(--butex-document2-fg) 18%, transparent);\n  display: grid;\n  gap: 12px;\n  max-height: min(90vh, 900px);\n  max-width: min(720px, 100%);\n  overflow: auto;\n  padding: 14px;\n  position: relative;\n  width: min(680px, 100%);\n  z-index: 1;\n}\n\n/* Map document v2 tokens onto BuTeX equation editor chrome when embedded in this modal. */\n.butex-document2-widget__equation-modal-panel .butex-widget {\n  --butex-bg: var(--butex-document2-bg);\n  --butex-fg: var(--butex-document2-fg);\n  --butex-muted: var(--butex-document2-muted);\n  --butex-accent: var(--butex-document2-accent);\n  --butex-accent-hover: color-mix(in srgb, var(--butex-document2-accent) 82%, #000000);\n  --butex-toolbar-hover-bg: var(--butex-document2-accent-bg);\n  --butex-toolbar-hover-border: var(--butex-document2-accent);\n  --butex-danger: var(--butex-document2-danger);\n  --butex-danger-bg: color-mix(in srgb, var(--butex-document2-danger) 12%, transparent);\n  --butex-danger-border: color-mix(in srgb, var(--butex-document2-danger) 48%, transparent);\n  --butex-on-accent: #ffffff;\n  --butex-border: var(--butex-document2-border);\n  --butex-panel: var(--butex-document2-panel);\n  --butex-preview-bg: var(--butex-document2-preview-bg);\n  --butex-preview-fg: var(--butex-document2-preview-fg);\n  --butex-error: var(--butex-document2-error);\n  --butex-error-bg: var(--butex-document2-error-bg);\n  --butex-error-border: color-mix(in srgb, var(--butex-document2-error) 32%, var(--butex-document2-panel));\n  --butex-shadow-md: 0 4px 14px color-mix(in srgb, var(--butex-document2-fg) 10%, transparent);\n  --butex-dev-bg: var(--butex-document2-dev-bg);\n  --butex-dev-border: var(--butex-document2-dev-border);\n  --butex-dev-badge: var(--butex-dev-badge, #b45309);\n  --butex-dev-badge-fg: var(--butex-dev-badge-fg, #ffffff);\n  --butex-dev-muted: var(--butex-dev-muted, #92400e);\n  --butex-dev-inset-bg: var(--butex-document2-dev-code-bg);\n  --butex-dev-inset-border: color-mix(in srgb, var(--butex-document2-dev-border) 45%, transparent);\n  --butex-dev-inset-fg: var(--butex-document2-dev-code-fg);\n  --butex-surface-bg: linear-gradient(\n    180deg,\n    var(--butex-document2-panel) 0%,\n    color-mix(in srgb, var(--butex-document2-panel) 88%, var(--butex-document2-bg)) 100%\n  );\n  --butex-surface-fg: var(--butex-document2-fg);\n  --butex-focus-border: color-mix(in srgb, var(--butex-document2-accent) 45%, transparent);\n  --butex-focus-shadow: var(--butex-document2-focus-shadow);\n  --butex-slot-hover: var(--butex-document2-accent-bg);\n  --butex-selection-bg: color-mix(in srgb, var(--butex-document2-accent) 34%, transparent);\n  --butex-selection-border: color-mix(in srgb, var(--butex-document2-accent) 90%, #0f172a);\n  --butex-caret: var(--butex-document2-fg);\n  --butex-node-hover: color-mix(in srgb, var(--butex-document2-muted) 14%, transparent);\n  --butex-node-selected-bg: var(--butex-document2-accent-bg);\n  --butex-node-selected-border: color-mix(in srgb, var(--butex-document2-accent) 45%, transparent);\n  --butex-script-border: var(--butex-document2-border);\n  --butex-script-bg: color-mix(in srgb, var(--butex-document2-bg) 35%, var(--butex-document2-panel));\n  --butex-script-color: var(--butex-document2-muted);\n  --butex-delim-color: var(--butex-document2-muted);\n  --butex-frac-bar: currentColor;\n}\n\n.butex-document2-widget__dev {\n  background: var(--butex-document2-dev-bg);\n  border-color: var(--butex-document2-dev-border);\n}\n\n.butex-document2-widget__dev pre {\n  background: var(--butex-document2-dev-code-bg);\n  color: var(--butex-document2-dev-code-fg);\n  direction: ltr;\n  margin: 0;\n  max-height: 220px;\n  overflow: auto;\n  padding: 10px;\n  text-align: left;\n  white-space: pre-wrap;\n}\n\n.butex-document2-widget__dev-actions {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 8px;\n  margin: 0 0 10px;\n}\n\n.butex-document2-widget__dev-import {\n  display: grid;\n  gap: 8px;\n  margin-bottom: 12px;\n}\n\n.butex-document2-widget__dev-import textarea {\n  background: var(--butex-document2-dev-code-bg);\n  border: 1px solid var(--butex-document2-dev-border);\n  border-radius: 8px;\n  color: var(--butex-document2-dev-code-fg);\n  direction: ltr;\n  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;\n  min-height: 180px;\n  padding: 10px;\n  resize: vertical;\n  text-align: left;\n}\n\n.butex-document2-widget__dev-error {\n  background: rgba(254, 226, 226, 0.9);\n  border: 1px solid rgba(220, 38, 38, 0.45);\n  border-radius: 8px;\n  color: #991b1b;\n  margin: 0;\n  padding: 8px 10px;\n  white-space: pre-wrap;\n}\n\n.butex-document2-widget__dev-diagnostic {\n  background: rgba(251, 191, 36, 0.18);\n  border: 1px solid rgba(217, 119, 6, 0.4);\n  border-radius: 8px;\n  color: #92400e;\n  margin: 0;\n  padding: 8px 10px;\n}\n\n@media (max-width: 900px) {\n  .butex-document2-widget__layout,\n  .butex-document2-widget__layout--editor-open.butex-document2-widget__layout--preview-open,\n  .butex-document2-widget__layout--editor-open.butex-document2-widget__layout--preview-closed,\n  .butex-document2-widget__layout--editor-closed.butex-document2-widget__layout--preview-open,\n  .butex-document2-widget__layout--editor-closed.butex-document2-widget__layout--preview-closed {\n    grid-template-columns: minmax(0, 1fr);\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .butex-document2-widget__layout,\n  .butex-document2-widget__editor-panel,\n  .butex-document2-widget__preview-panel {\n    transition: none;\n  }\n}\n\n.butex-document2-widget__cite-chip-wrap {\n  align-items: center;\n  display: inline-flex;\n  gap: 2px;\n  margin-inline: 2px;\n  max-width: 100%;\n  vertical-align: baseline;\n}\n\n.butex-document2-widget__cite-chip {\n  background: color-mix(in srgb, var(--butex-document2-accent) 8%, var(--butex-document2-panel));\n  border: 1.5px solid color-mix(in srgb, var(--butex-document2-accent) 45%, var(--butex-document2-border));\n  border-radius: 6px;\n  color: inherit;\n  cursor: pointer;\n  display: inline-flex;\n  font: inherit;\n  font-variant-numeric: tabular-nums;\n  line-height: 1.3;\n  min-height: 28px;\n  padding: 2px 8px;\n}\n\n.butex-document2-widget__cite-chip[data-editable=\"false\"] {\n  border-style: dashed;\n  cursor: default;\n}\n\n.butex-document2-widget__cite-chip:hover,\n.butex-document2-widget__cite-chip:focus-visible {\n  background: color-mix(in srgb, var(--butex-document2-accent) 14%, var(--butex-document2-panel));\n  border-color: var(--butex-document2-accent);\n}\n\n.butex-document2-widget__cite-chip-delete {\n  background: transparent;\n  border: none;\n  color: var(--butex-document2-muted);\n  cursor: pointer;\n  font: inherit;\n  line-height: 1;\n  padding: 0 4px;\n}\n\n.butex-document2-widget__preview-cite {\n  color: inherit;\n  font-variant-numeric: tabular-nums;\n  white-space: nowrap;\n}\n\n.butex-document2-widget__preview-bibliography,\n.butex-document2-widget__bibliography-editor {\n  display: grid;\n  gap: 0.5rem;\n  list-style: none;\n  margin: 0;\n  padding: 0;\n}\n\n.butex-document2-widget__preview-bibliography li,\n.butex-document2-widget__bibliography-editor li {\n  display: grid;\n  gap: 0.25rem;\n  grid-template-columns: auto 1fr;\n}\n\n.butex-document2-widget__preview-bib-number {\n  font-variant-numeric: tabular-nums;\n}\n\n.butex-document2-widget__block--bibliography {\n  border-color: color-mix(in srgb, var(--butex-document2-accent) 35%, var(--butex-document2-border));\n}\n\n.butex-document2-widget__digit-form-menu {\n  position: relative;\n}\n\n.butex-document2-widget__digit-form-options {\n  background: var(--butex-document2-panel);\n  border: 1px solid var(--butex-document2-border);\n  border-radius: 8px;\n  box-shadow: 0 8px 24px color-mix(in srgb, #000 16%, transparent);\n  display: grid;\n  gap: 2px;\n  inset-inline-start: 0;\n  margin-top: 4px;\n  padding: 4px;\n  position: absolute;\n  top: 100%;\n  z-index: 5;\n}\n\n.butex-document2-widget__digit-form-option {\n  background: transparent;\n  border: none;\n  border-radius: 6px;\n  color: inherit;\n  cursor: pointer;\n  font: inherit;\n  padding: 6px 10px;\n  text-align: start;\n}\n\n.butex-document2-widget__digit-form-option[aria-selected=\"true\"],\n.butex-document2-widget__digit-form-option:hover {\n  background: color-mix(in srgb, var(--butex-document2-accent) 12%, var(--butex-document2-panel));\n}\n\n.butex-document2-widget__cite-picker-backdrop,\n.butex-document2-widget__refs-backdrop {\n  align-items: center;\n  background: color-mix(in srgb, #000 35%, transparent);\n  display: flex;\n  inset: 0;\n  justify-content: center;\n  padding: 1rem;\n  position: fixed;\n  z-index: 40;\n}\n\n.butex-document2-widget__cite-picker,\n.butex-document2-widget__refs-panel {\n  background: var(--butex-document2-panel);\n  border: 1px solid var(--butex-document2-border);\n  border-radius: 12px;\n  box-shadow: 0 16px 40px color-mix(in srgb, #000 22%, transparent);\n  display: grid;\n  gap: 0.75rem;\n  max-height: min(80vh, 640px);\n  max-width: 560px;\n  overflow: auto;\n  padding: 1rem;\n  width: min(100%, 560px);\n}\n\n.butex-document2-widget__cite-picker-header,\n.butex-document2-widget__refs-header,\n.butex-document2-widget__cite-picker-footer,\n.butex-document2-widget__refs-item-head {\n  align-items: center;\n  display: flex;\n  gap: 0.5rem;\n  justify-content: space-between;\n}\n\n.butex-document2-widget__cite-picker-list,\n.butex-document2-widget__refs-list {\n  display: grid;\n  gap: 0.5rem;\n  list-style: none;\n  margin: 0;\n  padding: 0;\n}\n\n.butex-document2-widget__cite-picker-item,\n.butex-document2-widget__refs-field {\n  display: grid;\n  gap: 0.25rem;\n}\n\n.butex-document2-widget__cite-picker-item {\n  align-items: start;\n  grid-template-columns: auto 1fr;\n}\n\n.butex-document2-widget__cite-picker-meta,\n.butex-document2-widget__cite-picker-empty {\n  color: var(--butex-document2-muted);\n  display: block;\n  font-size: 0.92em;\n}\n\n.butex-document2-widget__refs-grid {\n  display: grid;\n  gap: 0.5rem;\n  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));\n}\n\n.butex-document2-widget__refs-field input {\n  background: var(--butex-document2-input-bg, var(--butex-document2-panel));\n  border: 1px solid var(--butex-document2-border);\n  border-radius: 6px;\n  color: inherit;\n  font: inherit;\n  padding: 0.4rem 0.55rem;\n  width: 100%;\n}\n\n.butex-document2-widget__field-error {\n  color: #b42318;\n  font-size: 0.85em;\n  line-height: 1.35;\n  margin: 0;\n}\n\n.butex-document2-widget__field-hint {\n  color: var(--butex-document2-muted);\n  font-size: 0.82em;\n  line-height: 1.35;\n  margin: 0;\n}\n\n.butex-document2-widget__refs-field input[aria-invalid='true'] {\n  border-color: color-mix(in srgb, #b42318 55%, var(--butex-document2-border));\n}\n\n.butex-document2-widget__refs-item {\n  border: 1px solid var(--butex-document2-border);\n  border-radius: 10px;\n  display: grid;\n  gap: 0.5rem;\n  padding: 0.75rem;\n}\n\n.butex-document2-widget__refs-item-key {\n  color: var(--butex-document2-muted);\n  font-size: 0.9em;\n  font-weight: 500;\n}\n\n.butex-document2-widget__modal-preview {\n  background: color-mix(in srgb, var(--butex-document2-panel) 88%, var(--butex-document2-accent-bg));\n  border: 1px dashed color-mix(in srgb, var(--butex-document2-accent) 30%, var(--butex-document2-border));\n  border-radius: 8px;\n  color: inherit;\n  font-size: 0.95em;\n  line-height: 1.55;\n  padding: 0.55rem 0.7rem;\n  text-align: center;\n}\n\n.butex-document2-widget__modal-preview-number {\n  color: var(--butex-document2-muted);\n  font-weight: 600;\n}\n\n.butex-document2-widget__modal-preview-url {\n  color: var(--butex-document2-accent);\n  word-break: break-all;\n}\n\n.butex-document2-widget__refs-separator-toggle {\n  display: inline-flex;\n  gap: 0.35rem;\n}\n\n.butex-document2-widget__refs-separator-toggle button {\n  background: var(--butex-document2-input-bg, var(--butex-document2-panel));\n  border: 1px solid var(--butex-document2-border);\n  border-radius: 6px;\n  color: inherit;\n  cursor: pointer;\n  font: inherit;\n  font-size: 1.15em;\n  line-height: 1;\n  min-width: 2.25rem;\n  padding: 0.35rem 0.55rem;\n}\n\n.butex-document2-widget__refs-separator-toggle button.is-active {\n  background: var(--butex-document2-accent-bg);\n  border-color: color-mix(in srgb, var(--butex-document2-accent) 45%, var(--butex-document2-border));\n  color: var(--butex-document2-accent);\n  font-weight: 700;\n}\n\n.butex-document2-widget__refs-item-actions {\n  display: inline-flex;\n  gap: 0.25rem;\n}\n\n.butex-document2-widget__primary-btn {\n  background: var(--butex-document2-accent);\n  border: none;\n  border-radius: 8px;\n  color: #fff;\n  cursor: pointer;\n  font: inherit;\n  padding: 0.45rem 0.8rem;\n}\n\n.butex-document2-widget__primary-btn:disabled {\n  cursor: not-allowed;\n  opacity: 0.55;\n}\n\n.butex-document2-widget__article-meta {\n  background: color-mix(in srgb, var(--butex-document2-panel) 92%, var(--butex-document2-accent-bg));\n  border: 1px solid var(--butex-document2-border);\n  border-radius: 10px;\n  display: grid;\n  gap: 0.75rem;\n  margin-bottom: 0.85rem;\n  padding: 0.85rem 0.9rem;\n}\n\n.butex-document2-widget__article-meta-header {\n  align-items: center;\n  display: flex;\n  gap: 0.5rem;\n  justify-content: space-between;\n}\n\n.butex-document2-widget__article-meta-badge {\n  background: var(--butex-document2-accent-bg);\n  border: 1px solid color-mix(in srgb, var(--butex-document2-accent) 35%, var(--butex-document2-border));\n  border-radius: 999px;\n  color: var(--butex-document2-accent);\n  font-size: 0.78rem;\n  font-weight: 600;\n  padding: 0.15rem 0.55rem;\n}\n\n.butex-document2-widget__article-meta-date-preview {\n  color: color-mix(in srgb, var(--butex-document2-fg) 70%, transparent);\n  font-size: 0.92rem;\n  margin: 0.15rem 0 0;\n}\n\n.butex-document2-widget__article-meta-fixed {\n  color: color-mix(in srgb, var(--butex-document2-fg) 78%, transparent);\n  font-size: 0.95rem;\n  line-height: 1.7;\n  margin: 0;\n  text-align: center;\n}\n\n.butex-document2-widget__article-meta-grid {\n  display: grid;\n  gap: 0.65rem;\n}\n\n.butex-document2-widget__article-meta-field {\n  display: grid;\n  gap: 0.3rem;\n  font-size: 0.92rem;\n}\n\n.butex-document2-widget__article-meta-field input,\n.butex-document2-widget__article-meta-field textarea {\n  background: var(--butex-document2-input-bg, var(--butex-document2-panel));\n  border: 1px solid var(--butex-document2-border);\n  border-radius: 6px;\n  color: inherit;\n  font: inherit;\n  padding: 0.4rem 0.55rem;\n  width: 100%;\n}\n\n.butex-document2-widget__article-meta-date {\n  display: grid;\n  gap: 0.45rem;\n  grid-template-columns: minmax(4rem, 1fr) minmax(7rem, 2fr) minmax(5rem, 1.2fr);\n}\n\n.butex-document2-widget__hijri-menu {\n  position: relative;\n}\n\n.butex-document2-widget__hijri-menu-trigger {\n  appearance: none;\n  background-color: var(--butex-document2-input-bg, var(--butex-document2-panel));\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%236b7280' d='M1.2 1.3L6 6.1l4.8-4.8 1.2 1.2L6 8.5 0 2.5z'/%3E%3C/svg%3E\");\n  background-position: left 0.65rem center;\n  background-repeat: no-repeat;\n  background-size: 0.7rem;\n  border: 1px solid var(--butex-document2-border);\n  border-radius: 8px;\n  color: inherit;\n  cursor: pointer;\n  font: inherit;\n  min-height: 2.35rem;\n  padding: 0.45rem 0.7rem 0.45rem 1.7rem;\n  text-align: start;\n  transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;\n  width: 100%;\n}\n\n.butex-document2-widget[dir=\"rtl\"] .butex-document2-widget__hijri-menu-trigger {\n  background-position: right 0.65rem center;\n  padding: 0.45rem 1.7rem 0.45rem 0.7rem;\n}\n\n.butex-document2-widget__hijri-menu-trigger:hover,\n.butex-document2-widget__hijri-menu-trigger[aria-expanded=\"true\"] {\n  background-color: color-mix(in srgb, var(--butex-document2-accent-bg) 55%, var(--butex-document2-panel));\n  border-color: color-mix(in srgb, var(--butex-document2-accent) 45%, var(--butex-document2-border));\n}\n\n.butex-document2-widget__hijri-menu-trigger:focus-visible {\n  border-color: var(--butex-document2-accent);\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--butex-document2-accent) 28%, transparent);\n  outline: none;\n}\n\n.butex-document2-widget__hijri-menu-list {\n  background: var(--butex-document2-panel);\n  border: 1px solid var(--butex-document2-border);\n  border-radius: 10px;\n  box-shadow: 0 12px 28px color-mix(in srgb, #000 18%, transparent);\n  inset-inline-start: 0;\n  list-style: none;\n  margin: 0.3rem 0 0;\n  max-height: 14rem;\n  overflow-x: hidden;\n  overflow-y: auto;\n  padding: 0.35rem;\n  position: absolute;\n  scrollbar-color: color-mix(in srgb, var(--butex-document2-muted) 55%, transparent) transparent;\n  scrollbar-width: thin;\n  top: 100%;\n  width: 100%;\n  z-index: 12;\n}\n\n.butex-document2-widget__hijri-menu-list::-webkit-scrollbar {\n  width: 0.55rem;\n}\n\n.butex-document2-widget__hijri-menu-list::-webkit-scrollbar-track {\n  background: transparent;\n  margin: 0.35rem 0;\n}\n\n.butex-document2-widget__hijri-menu-list::-webkit-scrollbar-thumb {\n  background: color-mix(in srgb, var(--butex-document2-muted) 45%, transparent);\n  border: 2px solid transparent;\n  border-radius: 999px;\n  background-clip: padding-box;\n}\n\n.butex-document2-widget__hijri-menu-list::-webkit-scrollbar-thumb:hover {\n  background: color-mix(in srgb, var(--butex-document2-accent) 55%, var(--butex-document2-muted));\n  background-clip: padding-box;\n  border: 2px solid transparent;\n}\n\n.butex-document2-widget__hijri-menu-option {\n  background: transparent;\n  border: none;\n  border-radius: 7px;\n  color: inherit;\n  cursor: pointer;\n  display: block;\n  font: inherit;\n  padding: 0.45rem 0.65rem;\n  text-align: start;\n  width: 100%;\n}\n\n.butex-document2-widget__hijri-menu-option:hover,\n.butex-document2-widget__hijri-menu-option[aria-selected=\"true\"] {\n  background: color-mix(in srgb, var(--butex-document2-accent) 14%, var(--butex-document2-panel));\n}\n\n.butex-document2-widget__hijri-menu-option:focus-visible {\n  outline: 2px solid color-mix(in srgb, var(--butex-document2-accent) 55%, transparent);\n  outline-offset: -2px;\n}\n\n.butex-document2-widget__visually-hidden {\n  border: 0;\n  clip: rect(0, 0, 0, 0);\n  height: 1px;\n  margin: -1px;\n  overflow: hidden;\n  padding: 0;\n  position: absolute;\n  white-space: nowrap;\n  width: 1px;\n}\n\n.butex-document2-widget__preview-basmala,\n.butex-document2-widget__preview-closing {\n  margin: 0.35rem 0 0.85rem;\n}\n\n.butex-document2-widget__preview-basmala .butex-document2-widget__math-island[data-display=\"true\"],\n.butex-document2-widget__preview-closing .butex-document2-widget__math-island[data-display=\"true\"] {\n  margin: 0;\n}\n\n.butex-document2-widget__preview-title-block {\n  background: color-mix(in srgb, var(--butex-document2-accent-bg) 55%, transparent);\n  border: 1px solid color-mix(in srgb, var(--butex-document2-border) 75%, transparent);\n  border-radius: 10px;\n  margin: 0.5rem 0 1rem;\n  padding: 0.85rem 1rem;\n  text-align: center;\n}\n\n.butex-document2-widget__preview-article-title {\n  font-size: 1.45rem;\n  font-weight: 700;\n  line-height: 1.35;\n  margin: 0 0 0.45rem;\n}\n\n.butex-document2-widget__preview-article-authors,\n.butex-document2-widget__preview-article-date {\n  margin: 0.2rem 0;\n}\n\n.butex-document2-widget__preview-article-date {\n  color: color-mix(in srgb, var(--butex-document2-fg) 72%, transparent);\n  font-size: 0.95rem;\n}\n\n.butex-document2-widget__preview-abstract {\n  background: color-mix(in srgb, var(--butex-document2-panel) 88%, var(--butex-document2-muted));\n  border: 1px dashed color-mix(in srgb, var(--butex-document2-border) 85%, transparent);\n  border-radius: 8px;\n  margin: 0.75rem 0 1rem;\n  padding: 0.75rem 0.9rem;\n}\n\n.butex-document2-widget__preview-abstract-label {\n  font-size: 1rem;\n  font-weight: 700;\n  margin: 0 0 0.35rem;\n}\n\n.butex-document2-widget__preview-abstract p {\n  margin: 0;\n}\n\n.butex-document2-widget__preview-empty-body {\n  color: var(--butex-document2-muted);\n  font-style: italic;\n  text-align: center;\n}\n";
 declare function injectBuTeXDocument2Styles(doc?: Document): void;
 
-export { ButexDocumentEditor2, type ButexDocumentEditor2Props, type ButexUiLocale, DOCUMENT2_WIDGET_CSS, type Document2InitialState, DocumentInsertToolbar, type DocumentInsertToolbarProps, DocumentPreview, EquationDrawer, InlineField, MathChip, MathIsland, injectBuTeXDocument2Styles, resolveInitialDocument2 };
+export { ButexDocumentEditor2, type ButexDocumentEditor2Props, type ButexDocumentEditor2Ref, type ButexUiLocale, DOCUMENT2_WIDGET_CSS, type Document2InitialState, DocumentInsertToolbar, type DocumentInsertToolbarProps, DocumentPreview, EquationDrawer, InlineField, MathChip, MathIsland, injectBuTeXDocument2Styles, resolveInitialDocument2 };