/* clip prevents horizontal overflow without creating a second body scroller. */
body.template-preview-page,body.demo-space-page{overflow-x:clip;overflow-y:visible;height:auto;min-height:100%;}
.template-device-controls{display:flex;align-items:center;gap:4px;}
.template-preview-header .template-device-controls a{display:inline-flex;align-items:center;justify-content:center;width:44px;min-height:44px;padding:8px;border:1px solid transparent;border-radius:8px;font:600 13px/1.4 system-ui,sans-serif;color:inherit;text-decoration:none;}
.template-preview-header .template-device-controls a[aria-current="page"]{border-color:currentColor;background:var(--ui-panel,var(--ut-s-232a3c,#fff));}
.template-preview-header .template-device-controls a:focus-visible{outline:3px solid var(--ui-focus,#0055ff);outline-offset:2px;}
.template-device-view{position:fixed;inset:0;margin:0;height:100dvh;min-height:0;display:flex;flex-direction:column;overflow:hidden;background:var(--ui-page,var(--ut-s-1f2839,#eef1f7));color:var(--ui-text,var(--ut-t-d6def0,#15213b));}
.template-device-view .template-preview-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;flex:none;gap:12px;padding:8px 24px;min-height:60px;background:var(--ui-page,var(--ut-s-20263c,#f7f8fc));color:var(--ui-text,var(--ut-t-d6def0,#15213b));font:500 14px/1.4 system-ui,sans-serif;}
.template-device-view .template-preview-header>a{display:inline-flex;align-items:center;gap:8px;min-height:44px;color:inherit;text-decoration:none;}
.template-device-view .template-preview-use{border:1px solid var(--ui-line,var(--ut-l-69799b,#aab3c6));border-radius:999px;padding:8px 16px;}
.template-device-view .template-preview-label{display:none;}
.template-device-canvas{flex:1;min-height:0;display:flex;justify-content:center;width:100%;padding:0;margin:0;overflow:hidden;}
.template-public-frame{display:block;height:100%;max-width:100%;border:0;background:var(--ui-page,var(--ut-s-232a3c,#fff));flex:none;}
.template-public-frame[data-device="mobile"]{width:390px;}
.template-public-frame[data-device="tablet"]{width:834px;}
.template-public-frame[data-device="desktop"]{width:100%;}
@media(max-width:900px){body:not(.template-device-view) .template-device-controls{display:none;}.template-device-view .template-preview-header{padding:8px 12px;gap:4px;}.template-device-view .template-device-controls{order:3;justify-content:center;flex-basis:100%;}}
@media(min-width:901px){.template-preview-header:has(.template-device-controls)>.template-preview-label{display:none;}}

.template-preview-header .template-device-controls svg{transform:none;width:22px;height:22px;}