/* One physical right-hand design workspace at every viewport. */
body:has(.visual-editor)>main{max-width:none!important;padding:0!important}
.visual-editor{max-width:1920px;margin:auto;padding:16px;color:#252239}
.editor-heading{padding:0 4px 12px}.editor-heading h1{font-size:26px!important;line-height:1.3;margin:0 0 6px}.editor-heading p{font-size:14px;margin:0}
.editor-layout{position:relative;display:grid;direction:ltr;grid-template-columns:minmax(0,1fr) 320px;gap:12px;height:calc(var(--editor-visible-height,100dvh) - 180px);min-height:260px}
.editor-canvas{min-width:0;min-height:0;overflow:auto;border:1px solid #d3cde2;border-radius:12px;background:#eceaf2}
.editor-canvas iframe{display:block;width:100%;height:100%;min-height:0;border:0;background:#fff}
#editor-design-sidebar{min-width:0;min-height:0;display:flex;flex-direction:column;background:#fcfbff;border:1px solid #d3cde2;border-radius:12px;overflow:hidden;color:#29233d;text-align:start}
.editor-sidebar-heading{display:flex;align-items:center;gap:8px;padding:10px;border-bottom:1px solid #e0daeb;flex:0 0 auto}
.editor-sidebar-heading h2{flex:1;min-width:0;margin:0!important;font:650 16px/1.4 system-ui!important;overflow-wrap:anywhere}
.visual-editor .editor-sidebar-heading button{width:40px!important;min-width:40px;flex:0 0 40px;min-height:40px;padding:6px!important;margin:0;background:#f0ecfa;color:#493c70;border:1px solid #d7cdec;border-radius:9px}
#editor-sidebar-body{min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:14px 14px max(18px,env(safe-area-inset-bottom));flex:1}
#editor-status{font:12px/1.5 system-ui;margin:0;padding:7px 14px;border-bottom:1px solid #e9e3f1;overflow-wrap:anywhere}
.visual-editor [hidden]{display:none!important}
.visual-editor :is(button,a.button){box-sizing:border-box;min-width:0;max-width:100%;height:auto;min-height:44px;display:flex;align-items:center;justify-content:center;gap:7px;margin:0;padding:10px 12px;border-radius:10px;font:600 14px/1.5 system-ui;white-space:normal;overflow-wrap:anywhere;text-align:center;word-break:normal}
.visual-editor button>span{min-width:0}.visual-editor button:disabled{opacity:.5;cursor:not-allowed}
.visual-editor .secondary{background:#f2eff9!important;color:#493e65!important;border:1px solid #d9d1e9!important}
.visual-editor :focus-visible{outline:3px solid #7257cc;outline-offset:2px}
.visual-editor :is(label,input,select,textarea){box-sizing:border-box;max-width:100%;min-width:0}
.visual-editor label{display:block;margin:12px 0;font-size:13px;line-height:1.5}
.visual-editor :is(input:not([type=checkbox]):not([type=color]),select,textarea){display:block;width:100%;min-height:44px;margin-top:5px;padding:9px 10px;border:1px solid #b3a9c8;border-radius:8px;background:#fff;color:#252036;font:16px/1.5 system-ui}
.visual-editor textarea{resize:vertical;white-space:pre-wrap;overflow-wrap:anywhere}
.visual-editor p{font-size:13px;line-height:1.6;overflow-wrap:anywhere}.visual-editor h2{font-size:19px!important;line-height:1.4!important;letter-spacing:normal!important;overflow-wrap:anywhere}
.editor-intro{margin:0 0 14px}.editor-intro p{margin:0 0 8px}.editor-intro p:first-child{font-weight:650}
#editor-tools-home{margin:0}.editor-tools{border:0;background:transparent;box-shadow:none}.editor-history-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-block:12px}
.editor-selected{display:flex;gap:8px;align-items:center;padding:10px 0;border-block:1px solid #e3ddec}.editor-selected>span{flex:1;min-width:0;white-space:normal;font-size:13px;line-height:1.5;overflow-wrap:anywhere}.editor-selected>button{width:44px!important;flex:0 0 44px}
.editor-design-actions{display:grid;gap:8px;margin-block-start:12px}.editor-design-actions button{width:100%;justify-content:flex-start;text-align:start}.editor-design-actions button>span:first-child{font-size:20px;flex:0 0 24px;align-self:center}
.editor-panel{padding:0;border:0;border-radius:0;background:transparent;position:static;max-height:none;overflow:visible;box-shadow:none}
.editor-panel-heading{display:flex;gap:8px;align-items:center}.editor-panel-heading h2{margin:0}.editor-panel-heading #editor-close{width:40px!important;min-width:40px;flex:0 0 40px;padding:4px;font-size:22px}
#editor-quick{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin-block:12px}
.visual-editor details{border-top:1px solid #dfd8eb;padding-block:8px}.visual-editor summary{min-height:44px;font-weight:600;font-size:14px;line-height:1.5;padding-block:10px;cursor:pointer;overflow-wrap:anywhere}
#editor-text-drawer:not([open]),#editor-text-drawer>summary{display:none}
.editor-panel .editor-color{display:flex;gap:10px;align-items:center}.editor-color input{width:48px;height:44px;min-width:48px;padding:3px;margin:0}
.editor-stepper{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin-block:10px}.editor-stepper[aria-label]{grid-template-columns:repeat(4,minmax(0,1fr))}.editor-stepper button{padding:9px 4px}
.editor-structure-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin-block:12px}
#editor-protection,.editor-current,#editor-scope-note{font-size:12px;line-height:1.5;overflow-wrap:anywhere}.editor-current{display:block;color:#686075;margin-top:4px}
.editor-decoration-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-block:12px}.editor-decoration-options button{display:flex;flex-direction:column;min-height:80px;padding:12px 7px;background:#f2eff9;color:#44365f;border:1px solid #d4cbe4}.editor-decoration-options button>span{font-size:24px;line-height:1.2}
.visual-editor #editor-library{width:auto;max-width:none;max-height:none;border:0;border-radius:0;padding:0;margin:0;background:none;box-shadow:none}.editor-library-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.editor-library-grid button{display:flex;flex-direction:column;background:#f5f2fa;color:#332a47;border:1px solid #d8cfe6;text-align:start}.editor-library-grid img{width:100%;height:90px;object-fit:contain}.editor-library-grid span{font-size:12px;line-height:1.5;overflow-wrap:anywhere}.library-top{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.library-top h2{width:100%;margin:0}
.visual-editor #editor-ai-chat{position:static;width:auto;max-width:none;max-height:none;overflow:visible;border:0;border-radius:0;box-shadow:none;padding:0;margin:0;background:none}
.visual-editor #editor-ai-chat>header{position:static!important;display:flex;min-height:44px;padding:0!important;margin:0 0 12px;border:0;background:none!important;gap:8px;view-transition-name:none;backdrop-filter:none}.editor-ai-chat header h2{flex:1;min-width:0;margin:0}.editor-ai-chat header button{width:44px!important;flex:0 0 44px;padding:4px}.editor-ai-chat form{margin-block:14px;display:grid;gap:8px;padding:0;border:0;background:none}.editor-ai-chat label{margin:0}.editor-ai-chat textarea{min-height:100px}.editor-chat-message{padding:12px;margin-top:10px;background:#ede8f8;border-radius:10px;white-space:pre-wrap;overflow-wrap:anywhere;font-size:13px}.editor-chat-message.user{background:#e4dcf6}.editor-chat-message p{margin:6px 0}.editor-chat-message a{display:block;min-height:44px;padding-block:8px;text-decoration:underline}.editor-chat-message label,.editor-review label{display:flex;flex-wrap:wrap;align-items:center;gap:8px}.editor-chat-message input[type=checkbox],.editor-review input[type=checkbox]{width:22px;height:22px;flex:0 0 22px}.editor-image-preview{max-width:100%;height:140px;object-fit:contain;background:repeating-conic-gradient(#eee 0% 25%,#fff 0% 50%) 0/20px 20px}.editor-review{margin-top:14px}.editor-review>button,.editor-review>a{margin-top:10px}.editor-review textarea,.editor-review select{flex:1 0 100%}
body.studio-embedded[data-panel-kind=design] .visual-editor{padding:8px!important}body.studio-embedded[data-panel-kind=design] .editor-heading{display:none}body.studio-embedded[data-panel-kind=design] .editor-layout{height:calc(var(--editor-visible-height,100dvh) - 16px);gap:10px}body.studio-embedded[data-panel-kind=design] .editor-canvas iframe{height:100%;min-height:0}
.visual-editor:not(.sidebar-open) .editor-layout{grid-template-columns:minmax(0,1fr) 48px}.visual-editor:not(.sidebar-open) .editor-sidebar-heading{padding:4px;display:block}.visual-editor:not(.sidebar-open) .editor-sidebar-heading h2,.visual-editor:not(.sidebar-open) .editor-sidebar-heading [data-design-home],.visual-editor:not(.sidebar-open) #editor-status{display:none!important}
@media(min-width:701px) and (max-width:1100px){.editor-layout{grid-template-columns:minmax(0,1fr) 280px;gap:8px}}
@media(prefers-reduced-motion:reduce){.visual-editor *{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
.editor-design-actions{grid-template-columns:repeat(2,minmax(0,1fr))}.editor-design-actions #editor-settings{grid-column:1/-1}.editor-design-actions button{padding:10px 7px;gap:5px;font-size:13px}.editor-design-actions button>span:first-child{flex-basis:18px;font-size:18px}.editor-intro p{margin:0 0 6px}.editor-intro{margin-bottom:8px}
/* Phone: the selected controls follow the edit navigation above the canvas. */
@media(max-width:700px){
 .visual-editor{padding:6px}.visual-editor .editor-layout{display:flex!important;flex-direction:column;gap:8px;min-height:180px}.visual-editor .editor-canvas{order:2;flex:1 1 0;min-height:100px;width:100%;border-radius:10px}.visual-editor #editor-design-sidebar{order:1;position:relative!important;inset:auto!important;flex:0 1 auto;width:100%!important;max-height:48%;min-height:48px;height:auto;border-radius:12px;box-shadow:none;z-index:auto}
 .visual-editor:not(.sidebar-open) #editor-design-sidebar{flex:0 0 auto}.visual-editor .editor-sidebar-heading,.visual-editor:not(.sidebar-open) .editor-sidebar-heading{display:flex;align-items:center;padding:6px 8px;min-height:48px}.visual-editor:not(.sidebar-open) .editor-sidebar-heading h2{display:block!important}.visual-editor:not(.sidebar-open) .editor-sidebar-heading [data-design-home]{display:none!important}
 #editor-sidebar-body{padding:8px 10px 12px;min-height:0;overflow-y:auto}.visual-editor #editor-status{padding:4px 10px;font-size:11px}.editor-sidebar-heading h2{font-size:14px!important}.editor-intro{margin:0 0 6px}.editor-intro p{font-size:12px;margin:0 0 3px}.editor-intro p+ p{display:none}.editor-history-actions{margin:0 0 6px;gap:6px}.editor-history-actions button{min-height:36px;padding:6px}.editor-selected{padding:5px 0}.editor-selected>button{min-height:36px;width:36px!important;flex-basis:36px}
 .editor-design-actions{display:flex;flex-wrap:nowrap;overflow-x:auto;gap:6px;margin-top:7px;padding-bottom:5px;scrollbar-width:thin;overscroll-behavior-x:contain}.editor-design-actions button{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:0 0 104px;width:104px;min-height:64px;padding:7px 6px;font-size:12px;line-height:1.4;text-align:center}.editor-design-actions button>span:first-child{flex:0 0 auto}.visual-editor summary{padding-block:7px;min-height:40px}.editor-panel label{margin:8px 0}.visual-editor[data-design-pane=selection] #editor-design-sidebar{max-height:52%}
}
/* Selected functional controls retain their own public, typed settings. */
#editor-functional-open{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;width:100%;margin-block:8px;white-space:normal}
#editor-functional-open[hidden],#editor-functional-settings[hidden]{display:none!important}
#editor-functional-settings{min-width:0;border:1px solid #d2cbe7;border-radius:10px;padding:12px;margin-block:8px;background:#f6f3fc;color:#242038}
#editor-functional-settings h3{font-size:16px;line-height:1.4;margin:0 0 8px}#editor-functional-settings p{font-size:13px;line-height:1.5;margin-block:8px}#editor-functional-settings form,#editor-functional-settings label,.element-ai-request{display:grid;gap:8px;min-width:0}#editor-functional-settings input,#editor-functional-settings select,#editor-functional-settings textarea{box-sizing:border-box;max-width:100%;width:100%;min-height:44px;font:inherit}#editor-functional-settings textarea{min-height:100px}#editor-functional-settings button{height:auto;min-height:44px;white-space:normal;line-height:1.4;overflow-wrap:anywhere}
#editor-functional-dialog{position:fixed;inset:0;margin:auto;box-sizing:border-box;width:min(520px,calc(100vw - 20px));height:fit-content;max-height:calc(var(--editor-visible-height,100dvh) - 20px - env(safe-area-inset-top) - env(safe-area-inset-bottom));padding:14px;overflow:auto;overscroll-behavior:contain;border:1px solid #c6bfdb;border-radius:16px;background:#fff;color:#242038;text-align:start;z-index:2000}
#editor-functional-dialog::backdrop{background:#17102780}#editor-functional-dialog>header{display:flex;position:sticky;top:-14px;z-index:2;align-items:center;gap:10px;padding:12px 14px;margin:-14px -14px 10px;background:#fff;box-shadow:0 1px 0 #ded8ee}#editor-functional-dialog header h2{flex:1;min-width:0;font-size:20px;line-height:1.4;margin:0}#editor-functional-close{flex:0 0 44px;width:44px!important;height:44px!important;padding:0}#editor-functional-dialog #editor-functional-settings{margin:0;padding:10px;border:0}#editor-functional-dialog :focus-visible{outline:3px solid #6256d9;outline-offset:3px}
@media(max-width:700px){#editor-functional-dialog input,#editor-functional-dialog select,#editor-functional-dialog textarea{font-size:16px}}
/* Resize the phone workspace itself; never reload or transform its site iframe. */
.editor-splitter{display:none}
@media(max-width:700px){
 .visual-editor .editor-layout{gap:0}
 .visual-editor.sidebar-open #editor-design-sidebar{flex:0 0 var(--editor-tools-height,46%);max-height:none;min-height:0}
 .visual-editor .editor-canvas{order:3;min-height:0}
 .editor-splitter{display:flex;order:2;flex:0 0 28px;align-items:center;justify-content:center;position:relative;z-index:9;width:100%;padding:0;border:0;background:transparent;color:#71608e;cursor:row-resize;touch-action:none;user-select:none;-webkit-user-select:none}
 .editor-splitter::before{content:"";width:48px;height:5px;border-radius:4px;background:currentColor;opacity:.65}
 .editor-splitter:focus-visible{outline:2px solid #7257cc;outline-offset:-3px;border-radius:7px;background:#ece6f7}
 .editor-layout[data-resizing=true]{user-select:none;-webkit-user-select:none;cursor:row-resize}
 .editor-layout[data-resizing=true]::after{content:"";position:absolute;inset:0;z-index:8;cursor:row-resize}
}

#editor-functional-dialog #editor-functional-settings h3{display:none}

.editor-live-progress{padding:10px 12px;background:#f0edfc;border:1px solid #d4ccec;border-radius:10px;margin-block:8px}.editor-live-progress p{font-size:14px;line-height:1.5;margin-block:5px}.editor-live-progress button{min-height:44px;width:100%;margin-block:6px}