.st-grid__actions { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 8px 6px; margin-inline-start: auto; }
.st-export-dialog { color: var(--st-text); background: var(--st-panel); border: 1px solid var(--st-line); max-height: 90dvh; overflow: auto; }
.st-export-dialog--desktop { position: fixed; margin: 0; width: min(540px, calc(100vw - 16px)); }
.st-export-dialog--phone { position: fixed; margin: auto 0 0; inset: auto 0 0; width: 100%; max-width: none; border-radius: 16px 16px 0 0; }
.st-export { display: grid; gap: 12px; }
.st-export section { border-top: 1px solid var(--st-line); padding-top: 8px; }
.st-export fieldset { border: 1px solid var(--st-line); display: flex; gap: 8px; }
.st-export label { display: inline-flex; align-items: center; gap: 8px; margin-right: 12px; }
.st-export h3, .st-export p { margin: 4px 0; }
.st-export__scope { color: var(--st-muted); }
.st-export__preview { white-space: pre; overflow: auto; max-height: 240px; background: var(--st-pre-bg); color: var(--st-pre-text); padding: 12px; font: 12px/1.5 monospace; }
.st-grid__actions button[data-icon]::before { content: attr(data-icon); margin-inline-end: 4px; }
/* Grid items must shrink before the preview's own scroller can contain wide text. */
.st-export, .st-export > *, .st-export section { min-width: 0; max-width: 100%; }
.st-export__scope { white-space: normal; overflow-wrap: anywhere; }
.st-export fieldset { flex-wrap: wrap; }
.st-export-dialog .modal-head h2 { white-space: normal; overflow-wrap: anywhere; }

.st-export-dialog .modal-body, .st-export-dialog .st-dialog-scope { min-width: 0; max-width: 100%; }