.design-preview-fullscreen-button {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    flex: 0 0 auto; margin-left: auto; white-space: nowrap;
}
.design-preview-fullscreen-button svg { flex: 0 0 16px; }
/* Keep the original preview DOM in place so opening/closing cannot reload materials. */
#designPreviewPanel.design-preview-expanded,
#tracePreviewPanel.design-preview-expanded {
    position: fixed !important; inset: 0; z-index: 10000; display: flex; flex-direction: column;
    width: auto; height: 100dvh; max-width: none; max-height: none; min-height: 0;
    margin: 0; border: 0; border-radius: 0; overflow: hidden; background: #fff;
    box-sizing: border-box;
}
.design-preview-expanded > .design-preview-header,
.design-preview-expanded > .trace-preview-header,
.design-preview-expanded > .trace-preview-toolbar,
.design-preview-expanded > .trace-overlay-control,
.design-preview-expanded .design-html-result-bar,
.design-preview-expanded .design-preview-toolbar { flex: 0 0 auto; }
#designPreviewPanel.design-preview-expanded #designPreviewStage,
#tracePreviewPanel.design-preview-expanded #tracePreviewStage {
    display: flex !important; flex-direction: column; flex: 1 1 0; min-height: 0;
}
#designPreviewPanel.design-preview-expanded #designPreviewViewport,
#tracePreviewPanel.design-preview-expanded #tracePreviewViewport {
    flex: 1 1 0; min-height: 0; height: auto; overscroll-behavior: contain;
}
.design-preview-expanded #designPreviewCanvas,
.design-preview-expanded #tracePreviewSizer { margin-left: auto; margin-right: auto; }
.design-preview-expanded #traceImageSlotsMount,
.design-preview-expanded #designImageSlotsMount { display: none; }
.design-preview-expanded .design-html-result-bar { padding: 12px max(16px, calc((100vw - 1100px) / 2)); }
.design-preview-expanded .design-html-replay-label { font-size: 12px; gap: 12px; }
.design-preview-expanded .design-preview-toolbar,
.design-preview-expanded .trace-preview-toolbar { flex-wrap: wrap; }
html[data-ui-theme="dark"] #designPreviewPanel.design-preview-expanded,
html[data-ui-theme="dark"] #tracePreviewPanel.design-preview-expanded { background: #182130; }
html[data-ui-theme="dark"] .design-preview-fullscreen-button { background: #1d2532; border-color: #37465b; color: #cbd5e1; }
@media (max-width: 600px) {
    .design-preview-fullscreen-button { padding-left: 8px; padding-right: 8px; }
    .design-preview-expanded .design-html-result-bar { padding: 10px 12px; }
}
