:root{color-scheme:light dark;--bg:#f4f5f8;--panel:#fff;--text:#1d2230;--muted:#667085;--line:#d8dce6;--accent:#5b55d7;--danger:#b42318;--ok:#067647;--warn:#b54708}@media(prefers-color-scheme:dark){:root{--bg:#11141c;--panel:#1b1f2b;--text:#f3f4f7;--muted:#aab0bf;--line:#363c4c;--accent:#a096ff;--danger:#ff8a80;--ok:#75e0af;--warn:#ffc06a}}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:15px/1.5 system-ui,-apple-system,"Segoe UI",sans-serif}button,input,textarea,select{font:inherit}button{cursor:pointer}header{position:sticky;top:0;z-index:5;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--panel) 94%,transparent);backdrop-filter:blur(14px)}.bar{display:flex;align-items:center;justify-content:space-between;gap:16px;width:min(1380px,calc(100% - 28px));margin:auto;padding:12px 0}.bar h1{margin:0;font-size:1.15rem}.bar small{display:block;color:var(--muted);font-weight:400}.actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}button{min-height:38px;padding:7px 12px;border:1px solid var(--line);border-radius:9px;color:var(--text);background:var(--panel);font-weight:650}button.primary{border-color:var(--accent);color:#fff;background:var(--accent)}button.danger{color:var(--danger)}button:disabled{opacity:.5;cursor:not-allowed}main{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,430px);gap:18px;width:min(1380px,calc(100% - 28px));margin:18px auto 42px}.column{display:grid;align-content:start;gap:18px}.panel{padding:18px;border:1px solid var(--line);border-radius:14px;background:var(--panel)}.panel h2{margin:0 0 14px;font-size:1.05rem}.panel h3{margin:0;font-size:.98rem}.help{margin:-6px 0 14px;color:var(--muted);font-size:.88rem}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.field{display:grid;gap:5px}.field.full{grid-column:1/-1}label{font-size:.82rem;font-weight:700;color:var(--muted)}input,textarea,select{width:100%;border:1px solid var(--line);border-radius:8px;padding:9px 10px;color:var(--text);background:var(--bg)}textarea{min-height:88px;resize:vertical}input:focus,textarea:focus,select:focus{outline:2px solid color-mix(in srgb,var(--accent) 42%,transparent);outline-offset:1px;border-color:var(--accent)}.item{display:grid;gap:12px;padding:14px;border:1px solid var(--line);border-radius:11px;background:color-mix(in srgb,var(--panel) 90%,var(--bg))}.item+.item{margin-top:12px}.item-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.item-actions{display:flex;gap:6px}.item-actions button{min-height:32px;padding:4px 9px}.insert-row{display:grid;grid-template-columns:1fr auto;gap:8px}.answers{min-height:172px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:.88rem}.marker{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--accent)}.type-box{padding:13px;border:1px dashed var(--line);border-radius:10px;background:var(--panel)}.type-description{margin:0 0 11px;color:var(--muted);font-size:.84rem}.scale-preview{display:flex;align-items:center;justify-content:space-between;gap:5px;overflow:auto;margin-top:8px;padding:8px;border-radius:8px;background:var(--bg)}.scale-preview span{display:grid;place-items:center;min-width:28px;height:28px;border:1px solid var(--line);border-radius:7px;font-size:.76rem;font-weight:750}.range-row{display:grid;grid-template-columns:1fr auto;align-items:center;gap:14px}.range-row input[type=range]{padding:0;background:transparent}.range-value{min-width:58px;padding:7px 9px;border:1px solid var(--line);border-radius:8px;background:var(--bg);font-weight:800;text-align:center}.size-summary,.font-summary{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}.size-summary span,.font-summary span{padding:5px 8px;border-radius:7px;background:var(--bg);color:var(--muted);font-size:.8rem}.theme-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.theme-card{position:relative;display:grid;gap:8px;min-height:134px;padding:12px;border:2px solid var(--line);border-radius:12px;text-align:left;overflow:hidden}.theme-card.selected{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 18%,transparent)}.theme-card strong{font-size:.9rem}.theme-card small{color:var(--muted);font-size:.76rem;line-height:1.35}.theme-preview{height:48px;border:1px solid rgba(0,0,0,.18);border-radius:7px;padding:8px;background:var(--preview-bg,#eee);color:var(--preview-text,#222)}.theme-preview::before,.theme-preview::after{content:none}.default-dot{position:absolute;top:10px;right:10px;width:13px;height:13px;border:2px solid rgba(255,255,255,.8);border-radius:50%;background:var(--dot);box-shadow:0 0 0 1px rgba(0,0,0,.2)}.appearance-row{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.appearance-row label{position:relative}.appearance-row input{position:absolute;opacity:0}.appearance-row span{display:block;padding:9px;border:1px solid var(--line);border-radius:8px;text-align:center}.appearance-row input:checked+span{border-color:var(--accent);color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,transparent)}.accent-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(42px,1fr));gap:8px}.accent-swatch{display:grid;place-items:center;min-width:42px;height:42px;padding:0;border:2px solid var(--line);border-radius:11px;background:var(--swatch)}.accent-swatch.selected{border-color:var(--text);box-shadow:0 0 0 3px color-mix(in srgb,var(--swatch) 35%,transparent)}.accent-swatch span{width:14px;height:14px;border:2px solid rgba(255,255,255,.9);border-radius:50%;opacity:0}.accent-swatch.selected span{opacity:1}.default-swatch{background:linear-gradient(135deg,#7658e8,#33b99a,#efad4d)}.custom-row{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:10px}.custom-row input[type=color]{width:52px;height:42px;padding:3px}.checkbox-row{display:flex;align-items:flex-start;gap:9px}.checkbox-row input{width:auto;margin-top:4px}.status{display:grid;gap:8px;margin:0;padding:0;list-style:none}.status li{padding:9px 10px;border-left:4px solid var(--line);border-radius:6px;background:var(--bg);font-size:.88rem}.status .error{border-color:var(--danger)}.status .warning{border-color:var(--warn)}.status .ok{border-color:var(--ok)}#jsonPreview{min-height:460px;font:12px/1.55 ui-monospace,SFMono-Regular,Consolas,monospace;white-space:pre;tab-size:2}.note{margin-top:12px;color:var(--muted);font-size:.82rem}.hidden-file{display:none}.style-preview{position:relative;isolation:isolate;overflow:hidden;margin:0 0 18px;padding:22px;border:1px solid var(--sp-line);border-radius:var(--sp-radius);color:var(--sp-text);background:var(--sp-bg);box-shadow:0 16px 40px rgba(0,0,0,.12);font-family:var(--sp-ui)}.style-preview::before{content:"";position:absolute;z-index:-1;inset:0;background:radial-gradient(circle at 92% 8%,color-mix(in srgb,var(--sp-accent) 20%,transparent),transparent 38%),var(--sp-bg)}.style-preview-kicker{margin:0 0 5px;color:var(--sp-accent);font-size:.7rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.style-preview h3{max-width:620px;margin:0 0 8px!important;color:var(--sp-text);font-family:var(--sp-display);font-size:clamp(1.35rem,4vw,2.2rem);line-height:1.05}.style-preview-intro{margin:0 0 16px;color:var(--sp-muted);font-size:.82rem}.style-preview-story{margin:0 0 17px;font-family:var(--sp-story);font-size:var(--sp-size);line-height:var(--sp-line-height)}.style-preview-token{display:inline;padding:.08em .22em;border:0;border-radius:.36em;color:var(--sp-pending);background:color-mix(in srgb,var(--sp-pending) 13%,transparent);font:700 inherit;text-decoration:underline;text-underline-offset:.12em}.style-preview-footer{display:flex;align-items:center;gap:13px}.style-preview-track{flex:1;height:7px;overflow:hidden;border-radius:999px;background:var(--sp-line)}.style-preview-progress{width:43%;height:100%;background:linear-gradient(90deg,var(--sp-accent),var(--sp-extra))}.style-preview-submit{min-height:34px;padding:6px 12px;border:0;border-radius:var(--sp-button-radius);color:var(--sp-contrast);background:var(--sp-accent);font-family:var(--sp-ui);font-size:.75rem;font-weight:800}.style-preview[data-layout="swiss-grid"],.style-preview[data-layout="neo-brutalist"],.style-preview[data-layout="comic-burst"]{border:3px solid var(--sp-text);box-shadow:7px 7px 0 var(--sp-text)}.style-preview[data-layout="tech-terminal"]{background:repeating-linear-gradient(0deg,transparent 0 19px,color-mix(in srgb,var(--sp-extra) 10%,transparent) 20px),var(--sp-bg)}.style-preview[data-layout="midnight-luxury"],.style-preview[data-layout="soft-wellness"],.style-preview[data-layout="art-deco"]{text-align:center}.style-preview[data-layout="midnight-luxury"] .style-preview-footer,.style-preview[data-layout="soft-wellness"] .style-preview-footer,.style-preview[data-layout="art-deco"] .style-preview-footer{max-width:520px;margin-inline:auto}.style-preview[data-layout="paper-notebook"]{transform:rotate(-.15deg);background:repeating-linear-gradient(0deg,transparent 0 25px,color-mix(in srgb,var(--sp-extra) 14%,transparent) 26px),var(--sp-bg)}.style-preview[data-layout="night-neon"]{box-shadow:0 0 28px color-mix(in srgb,var(--sp-accent) 25%,transparent)}.style-preview[data-layout="memphis-party"],.style-preview[data-layout="retro-pop"]{background:radial-gradient(circle at 92% 4%,var(--sp-extra) 0 42px,transparent 43px),var(--sp-bg)}.editor-tooltip{position:fixed;z-index:1000;max-width:290px;padding:8px 10px;border:1px solid var(--line);border-radius:8px;color:var(--text);background:var(--panel);box-shadow:0 10px 30px rgba(0,0,0,.22);font-size:.78rem;line-height:1.4;pointer-events:none;opacity:0;transform:translateY(3px);transition:opacity .12s,transform .12s}.editor-tooltip.visible{opacity:1;transform:none}@media(max-width:1080px){.theme-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:920px){header{position:static}.bar{align-items:flex-start;flex-direction:column}.actions{justify-content:flex-start}main{grid-template-columns:1fr}.grid{grid-template-columns:1fr}.field.full{grid-column:auto}#jsonPreview{min-height:300px}.theme-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:650px){.theme-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.actions{display:grid;grid-template-columns:1fr 1fr;width:100%}.actions button{width:100%}.panel{padding:14px}.item-head{align-items:flex-start;flex-direction:column}.item-actions{flex-wrap:wrap}.insert-row{grid-template-columns:1fr}.style-preview{padding:17px}.style-preview-footer{align-items:stretch;flex-direction:column}.style-preview-track{width:100%;flex:none}}@media(max-width:400px){.theme-grid{grid-template-columns:1fr}}

.live-preview-panel{position:fixed;z-index:50;right:18px;bottom:18px;width:min(540px,calc(100vw - 36px));overflow:hidden;border:1px solid var(--line);border-radius:14px;background:var(--panel);box-shadow:0 22px 70px rgba(0,0,0,.3)}.live-preview-panel.collapsed{width:auto;min-width:240px}.live-preview-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 10px 9px 13px;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--panel) 94%,var(--bg))}.live-preview-panel.collapsed .live-preview-head{border-bottom:0}.live-preview-title{display:flex;align-items:center;gap:8px;min-width:0;font-weight:800}.live-preview-live-dot{width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 4px color-mix(in srgb,var(--ok) 18%,transparent)}.live-preview-actions{display:flex;align-items:center;gap:5px}.live-preview-actions button{display:grid;place-items:center;min-width:32px;min-height:32px;padding:3px 8px}.live-preview-actions button.active{border-color:var(--accent);color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,transparent)}.live-preview-actions .icon-only{width:32px;padding:0;font-size:1.05rem}.live-preview-body{padding:10px}.live-preview-stage{position:relative;height:400px;overflow:hidden;border:1px solid var(--line);border-radius:9px;background:#cfd3dc}.live-preview-stage iframe{position:absolute;display:block;visibility:hidden;pointer-events:none;border:0;background:var(--preview-bg,#fff)}.live-preview-stage iframe.preview-active{visibility:visible;pointer-events:auto}.live-preview-stage.device-desktop iframe{left:50%;top:50%;width:1120px;height:820px;transform:translate(-50%,-50%) scale(var(--preview-scale,.44));transform-origin:center}.live-preview-stage.device-mobile iframe{left:50%;top:0;width:400px;height:100%;transform:translateX(-50%)}.live-preview-status{position:absolute;inset:auto 8px 8px;display:flex;justify-content:center;pointer-events:none}.live-preview-status span{padding:5px 9px;border:1px solid rgba(0,0,0,.12);border-radius:999px;color:#333;background:rgba(255,255,255,.9);box-shadow:0 4px 15px rgba(0,0,0,.15);font-size:.72rem;font-weight:750;opacity:0;transition:opacity .15s}.live-preview-status span.visible{opacity:1}.live-preview-note{margin:7px 2px 0;color:var(--muted);font-size:.76rem}.editor-tooltip{z-index:1000}@media(max-width:700px){.live-preview-panel{right:9px;bottom:9px;width:calc(100vw - 18px)}.live-preview-stage{height:min(52vh,400px)}.live-preview-title span:last-child{display:none}}@media(prefers-reduced-motion:reduce){.live-preview-status span{transition:none}}

.actions select{width:auto;min-height:38px;padding:7px 32px 7px 10px;border:1px solid var(--line);border-radius:9px;color:var(--text);background-color:var(--panel);font-weight:650}.live-preview-head{cursor:grab;touch-action:none;user-select:none}.live-preview-head:active{cursor:grabbing}.live-preview-actions,.live-preview-actions *{cursor:pointer}.live-preview-switch{position:relative;display:inline-flex;align-items:center;gap:6px;padding:4px 7px;border:1px solid var(--line);border-radius:999px;color:var(--muted);font-size:.73rem;font-weight:750;cursor:pointer}.live-preview-switch input{position:absolute;width:1px;height:1px;opacity:0}.live-preview-switch-track{position:relative;width:28px;height:16px;border-radius:999px;background:var(--line)}.live-preview-switch-track::after{content:"";position:absolute;top:3px;left:3px;width:10px;height:10px;border-radius:50%;background:var(--muted);transition:transform .15s,background .15s}.live-preview-switch input:checked+.live-preview-switch-track{background:color-mix(in srgb,var(--ok) 32%,var(--line))}.live-preview-switch input:checked+.live-preview-switch-track::after{transform:translateX(12px);background:var(--ok)}.live-preview-stage.loading:not(.has-preview) iframe{visibility:hidden}.live-preview-panel.minimized{width:48px!important;height:48px;border-radius:999px}.live-preview-panel.minimized .live-preview-head,.live-preview-panel.minimized .live-preview-body{display:none}.live-preview-restore{display:none;width:48px;height:48px;min-height:48px;padding:0;border:0;border-radius:999px;color:#fff;background:var(--accent)}.live-preview-restore svg{width:22px;height:22px}.live-preview-panel.minimized .live-preview-restore{display:grid;place-items:center}.live-preview-panel.dragging{transition:none}.live-preview-panel.minimized .live-preview-restore{cursor:grab;touch-action:none}.live-preview-panel.minimized.dragging .live-preview-restore{cursor:grabbing}.generated-json-head{margin-bottom:12px}.generated-json-head h2{margin:0}.generated-json-head button{min-height:32px;padding:4px 9px}@media(max-width:650px){.actions select{width:100%}.live-preview-switch span:last-child{display:none}}.bar{max-width:none}.actions{flex-wrap:nowrap}.actions>*{flex:0 0 auto}.live-preview-title{flex:0 0 auto;white-space:nowrap}.live-preview-panel.minimized{left:auto!important;top:auto!important;right:18px!important;bottom:18px!important;width:auto!important;height:48px}.live-preview-restore{align-items:center;grid-template-columns:auto auto;gap:9px;width:auto;min-width:48px;padding:0 15px 0 13px;white-space:nowrap}.live-preview-restore span{font-size:.82rem;font-weight:800}.live-preview-panel.minimized .live-preview-restore{display:inline-grid}.live-preview-panel.minimized .live-preview-restore{cursor:pointer;touch-action:auto}.live-preview-note{display:flex;align-items:center;flex-wrap:wrap;gap:4px 7px}.live-preview-note button{min-height:26px;padding:2px 7px;font-size:.72rem}.live-preview-status{display:none}@media(max-width:1240px){.bar{align-items:stretch;flex-direction:column}.actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}.actions>*{width:100%;min-width:0}}@media(max-width:700px){.live-preview-title span:last-child{display:inline}}@media(max-width:720px){.actions{grid-template-columns:repeat(2,minmax(0,1fr))}.actions .primary{grid-column:1/-1}.live-preview-panel.minimized{right:9px!important;bottom:9px!important}}

.actions #previewButton{border-color:color-mix(in srgb,var(--accent) 68%,var(--line));color:var(--accent);background:color-mix(in srgb,var(--accent) 11%,var(--panel));box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 8%,transparent)}
@media(min-width:721px){.actions{display:flex!important;flex-wrap:wrap!important;overflow:visible;padding:2px}.actions>*{width:auto!important}}
.live-preview-panel:not(.minimized){display:grid;grid-template-rows:auto minmax(0,1fr);min-width:360px;min-height:330px;max-width:calc(100vw - 16px);max-height:calc(100vh - 16px);resize:both}.live-preview-panel.minimized{width:auto!important;min-width:0!important;height:48px!important;min-height:48px!important;max-width:none!important;max-height:48px!important;resize:none!important;overflow:hidden!important}
.live-preview-body{display:grid;grid-template-rows:minmax(210px,1fr) auto;height:auto;min-height:0}.live-preview-stage{height:auto;min-height:210px}.preview-meta{display:flex;align-items:center;gap:6px;min-width:0;color:var(--muted);font-size:.7rem}.preview-meta span{white-space:nowrap}.preview-zoom{width:auto;min-height:28px;padding:2px 23px 2px 7px;font-size:.72rem}.preview-more{position:relative}.preview-more summary{display:grid;place-items:center;width:32px;min-height:32px;border:1px solid var(--line);border-radius:9px;list-style:none;cursor:pointer;font-weight:900}.preview-more summary::-webkit-details-marker{display:none}.preview-more-menu{position:absolute;z-index:5;right:0;top:38px;display:grid;gap:6px;width:180px;padding:8px;border:1px solid var(--line);border-radius:10px;background:var(--panel);box-shadow:0 12px 35px rgba(0,0,0,.25)}.preview-more-menu button{width:100%;text-align:left}.preview-full-button{color:var(--accent)!important;border-color:color-mix(in srgb,var(--accent) 60%,var(--line))!important}.paragraph-state{margin:-3px 0 0;color:var(--muted);font-size:.76rem}.paragraph-state.warning{color:var(--warn)}.insert-row{grid-template-columns:minmax(0,1fr) auto auto}.undo-marker{color:var(--accent)}.question-jump{scroll-margin-top:92px}.question-jump.flash{animation:question-flash 1.5s ease}@keyframes question-flash{0%,100%{box-shadow:none}25%{box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 28%,transparent)}}.return-paragraph{display:none;color:var(--accent);font-size:.78rem}.return-paragraph.visible{display:inline-flex}.scale-preview.slider-mini{position:relative;display:grid;grid-template-columns:1fr;overflow:visible;padding:18px 14px 24px}.scale-preview.slider-mini input{--mini-progress:50%;width:100%;height:24px;margin:0;padding:0;border:0;appearance:none;background:transparent}.scale-preview.slider-mini input::-webkit-slider-runnable-track{height:7px;border-radius:99px;background:linear-gradient(to right,var(--accent) 0 var(--mini-progress),var(--line) var(--mini-progress) 100%)}.scale-preview.slider-mini input::-webkit-slider-thumb{width:22px;height:22px;margin-top:-8px;border:3px solid var(--panel);border-radius:50%;appearance:none;background:var(--accent);box-shadow:0 0 0 2px var(--accent)}.scale-preview.slider-mini .mini-ticks{position:absolute;left:25px;right:25px;bottom:5px;height:15px}.scale-preview.slider-mini .mini-ticks span{position:absolute;left:calc(var(--i)/(var(--n) - 1)*100%);min-width:0;width:auto;height:auto;border:0;transform:translateX(-50%);background:none}.input-grid{margin-top:10px}.required-row{display:flex;align-items:center;gap:9px}.required-row input{width:auto}.input-preview{display:flex;align-items:center;gap:8px;margin-top:9px;padding:9px;border-radius:8px;background:var(--bg);color:var(--muted);font-size:.78rem}.input-preview::before{content:"Aa";display:grid;place-items:center;min-width:32px;height:28px;border:1px solid var(--line);border-radius:6px;color:var(--accent);font-weight:800}
@media(max-width:700px){.live-preview-panel:not(.minimized){min-width:calc(100vw - 18px);max-width:calc(100vw - 18px);resize:vertical}.preview-meta{display:none}.insert-row{grid-template-columns:1fr 1fr}.insert-row select{grid-column:1/-1}}
[hidden]{display:none!important}html[data-editor-mode="light"]{color-scheme:light;--bg:#f4f5f8;--panel:#fff;--text:#1d2230;--muted:#667085;--line:#d8dce6;--accent:#5b55d7;--danger:#b42318;--ok:#067647;--warn:#b54708}html[data-editor-mode="dark"]{color-scheme:dark;--bg:#11141c;--panel:#1b1f2b;--text:#f3f4f7;--muted:#aab0bf;--line:#363c4c;--accent:#a096ff;--danger:#ff8a80;--ok:#75e0af;--warn:#ffc06a}.bar{display:grid;grid-template-columns:auto minmax(0,1fr)}.editor-heading{display:flex;align-items:center;gap:12px;min-width:0}.editor-heading-copy{min-width:0}.editor-appearance{width:auto;min-width:104px;min-height:34px;padding:5px 26px 5px 9px;font-size:.78rem}.actions{min-width:0}.actions select{min-width:150px}.live-preview-panel{container-type:inline-size}.live-preview-stage.device-desktop iframe{top:0;height:var(--preview-virtual-height,820px);transform:translateX(-50%) scale(var(--preview-scale,.44));transform-origin:top center}.live-preview-stage.device-mobile iframe{top:0;height:var(--preview-virtual-height,100%);transform:translateX(-50%) scale(var(--preview-scale,1));transform-origin:top center}.preview-meta span{overflow:hidden;text-overflow:ellipsis}.preview-zoom{width:100%;min-height:32px}.preview-zoom-control{display:grid;gap:4px}.live-preview-panel[data-device="mobile"] .preview-zoom-control{display:none}.preview-full-button{white-space:nowrap}.input-preview{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center}.input-preview::before{display:none}.input-preview-control{width:100%;min-height:36px;padding:6px 8px;border:1px solid var(--line);border-radius:7px;color:var(--text);background:var(--panel);font:inherit}.input-preview textarea{min-height:58px;resize:none}.input-preview-caption{grid-column:1/-1}.input-preview-unit{font-weight:750;color:var(--accent)}.numeric-inline-error{margin:2px 0 0;color:var(--danger);font-size:.74rem}
@media(max-width:1240px) and (min-width:721px){.bar{grid-template-columns:1fr}.actions{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));width:100%}.actions>*{width:100%!important}.actions #exampleSelect{min-width:0}}
@container(max-width:660px){.live-preview-head{display:grid;grid-template-columns:1fr;padding:8px 9px}.live-preview-title{min-height:30px}.live-preview-actions{justify-content:space-between;width:100%}.live-preview-actions button{padding-inline:7px}.preview-meta #previewThemeInfo{display:none}.live-preview-note{white-space:nowrap;overflow:hidden}.live-preview-note>span:first-child{display:none}}
@container(max-width:470px){.live-preview-actions #previewFullButton{padding-inline:6px}.live-preview-actions #previewDesktopButton,.live-preview-actions #previewMobileButton{font-size:.75rem}.live-preview-switch span:last-child{display:none}.preview-zoom-control,.preview-meta{display:none}}

.preview-floating-restore{position:fixed;z-index:60;right:18px;bottom:18px;display:inline-flex;align-items:center;gap:9px;min-height:48px;padding:0 15px 0 13px;border:0;border-radius:999px;color:#fff;background:var(--accent);box-shadow:0 14px 40px rgba(0,0,0,.3);font-weight:800;white-space:nowrap}.preview-floating-restore svg{width:22px;height:22px}@media(max-width:720px){.preview-floating-restore{right:9px;bottom:9px}}
.editor-clearable{position:relative;display:block;min-width:0;width:100%}.editor-clearable>input,.editor-clearable>textarea{padding-right:38px}.editor-clear-field{position:absolute;z-index:2;right:6px;top:6px;display:grid;place-items:center;width:28px;min-width:28px;min-height:28px;padding:0;border:0;border-radius:7px;color:var(--muted);background:color-mix(in srgb,var(--panel) 82%,transparent);font-size:1.15rem;line-height:1}.editor-clear-field:hover,.editor-clear-field:focus-visible{color:var(--danger);background:color-mix(in srgb,var(--danger) 10%,var(--panel))}.editor-clear-field[hidden]{display:none}.editor-clearable>textarea+.editor-clear-field{top:7px}

.editor-header .bar{display:grid;grid-template-columns:minmax(330px,auto) minmax(0,1fr);gap:18px;width:min(1500px,calc(100% - 32px));padding:9px 0}.editor-heading{display:flex;align-items:center;gap:14px;min-width:0}.editor-heading-copy{min-width:0}.editor-heading h1{font-size:1.08rem}.editor-heading small{white-space:nowrap}.version-chip{display:inline-block;margin-left:5px;padding:2px 6px;border-radius:999px;color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,transparent);font-size:.7rem;font-weight:800}.editor-appearance{width:auto;min-width:122px;min-height:36px;padding:6px 28px 6px 9px}.editor-header .actions{display:flex!important;align-items:center;justify-content:flex-end;gap:8px;padding:0!important;overflow:visible}.action-group{display:flex;align-items:center;gap:6px;padding:5px;border:1px solid var(--line);border-radius:12px;background:color-mix(in srgb,var(--panel) 88%,var(--bg))}.action-group button,.action-group select{min-height:36px;padding-top:6px;padding-bottom:6px}.file-actions #exampleSelect{width:clamp(170px,19vw,245px)}.output-actions{border-color:color-mix(in srgb,var(--accent) 28%,var(--line));background:color-mix(in srgb,var(--accent) 5%,var(--panel))}.output-actions #buildButton{box-shadow:0 6px 16px color-mix(in srgb,var(--accent) 18%,transparent)}
.survey-language-field{max-width:none;margin-bottom:16px;padding:12px;border:1px solid var(--line);border-radius:10px;background:color-mix(in srgb,var(--panel) 90%,var(--bg))}.survey-language-field .note{margin:2px 0 0}.deployment-note{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px 10px;margin-top:13px;padding:11px 12px;border-left:4px solid var(--warn);border-radius:7px;background:var(--bg);font-size:.82rem}.deployment-note strong{color:var(--text)}.deployment-note span{color:var(--muted)}.accent-swatch{position:relative}.accent-swatch .swatch-check{display:grid;place-items:center;width:auto;height:auto;border:0;border-radius:0;color:#fff;font-size:1rem;font-weight:1000;line-height:1;text-shadow:0 1px 2px rgba(0,0,0,.55);opacity:0}.accent-swatch.selected .swatch-check{opacity:1}.custom-swatch{margin-left:7px}.custom-swatch::before{content:"";position:absolute;left:-7px;top:5px;bottom:5px;border-left:1px solid var(--line)}.custom-swatch .custom-pencil{position:absolute;right:2px;bottom:2px;display:grid;place-items:center;width:17px;height:17px;border:1px solid rgba(255,255,255,.72);border-radius:5px;color:#fff;background:rgba(0,0,0,.58);font-size:.68rem;font-weight:900;line-height:1;opacity:1;text-shadow:none}.question-title-row{display:flex;align-items:center;gap:10px;min-width:0}.return-paragraph{align-items:center;gap:4px;min-height:0!important;padding:2px 0!important;border:0!important;border-radius:0!important;color:var(--accent)!important;background:transparent!important;font-size:.76rem;font-weight:780;box-shadow:none!important;text-decoration:underline;text-decoration-color:color-mix(in srgb,var(--accent) 42%,transparent);text-underline-offset:3px}.return-paragraph:hover{text-decoration-color:currentColor}.paragraph-return-flash{animation:paragraph-return-flash 1.45s ease}@keyframes paragraph-return-flash{15%{box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 32%,transparent)}100%{box-shadow:none}}
.editor-navigator{position:fixed;z-index:36;top:82px;right:10px;width:230px;max-height:calc(100vh - 100px);overflow:hidden;border:1px solid var(--line);border-radius:13px;background:color-mix(in srgb,var(--panel) 96%,transparent);box-shadow:0 16px 45px rgba(0,0,0,.2);backdrop-filter:blur(14px);transition:width .16s}.navigator-head{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:42px;padding:6px 7px 6px 12px;border-bottom:1px solid var(--line)}.navigator-head strong{font-size:.8rem;letter-spacing:.04em;text-transform:uppercase}.navigator-head button{display:grid;place-items:center;width:30px;min-height:30px;padding:0}.navigator-body{max-height:calc(100vh - 145px);overflow:auto;padding:7px}.navigator-group+.navigator-group{margin-top:5px}.navigator-item{display:flex;align-items:center;width:100%;min-height:30px;padding:4px 7px;border:0;border-radius:7px;color:var(--muted);background:transparent;font-size:.76rem;font-weight:650;text-align:left}.navigator-item:hover,.navigator-item.active{color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,transparent)}.navigator-item.sub{padding-left:20px;font-size:.72rem;font-weight:580}.navigator-item.sub::before{content:"";width:7px;height:1px;margin-right:7px;background:var(--line)}.editor-navigator.collapsed{width:44px}.editor-navigator.collapsed .navigator-head{padding:6px;border-bottom:0}.editor-navigator.collapsed .navigator-head strong,.editor-navigator.collapsed .navigator-body{display:none}.editor-navigator.collapsed #navigatorToggle{transform:rotate(180deg)}.navigator-flash{animation:navigator-flash 1.25s ease}@keyframes navigator-flash{18%{outline:4px solid color-mix(in srgb,var(--accent) 25%,transparent);outline-offset:3px}100%{outline-color:transparent}}
.editor-dialog{width:min(460px,calc(100vw - 28px));padding:0;border:1px solid var(--line);border-radius:15px;color:var(--text);background:var(--panel);box-shadow:0 28px 90px rgba(0,0,0,.38)}.editor-dialog::backdrop{background:rgba(8,10,18,.58);backdrop-filter:blur(3px)}.editor-dialog form{display:grid;grid-template-columns:42px minmax(0,1fr);gap:13px;padding:20px}.editor-dialog-icon{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;color:var(--accent);background:color-mix(in srgb,var(--accent) 13%,var(--panel));font-size:1.05rem;font-weight:900}.editor-dialog[data-tone=destructive] .editor-dialog-icon{color:var(--danger);background:color-mix(in srgb,var(--danger) 12%,var(--panel))}.editor-dialog-copy h2{margin:0 0 5px;font-size:1.04rem}.editor-dialog-copy p{margin:0;color:var(--muted);font-size:.88rem;white-space:pre-line}.editor-dialog-input-label{display:grid;gap:5px;margin-top:13px}.editor-dialog-actions{grid-column:1/-1;display:flex;justify-content:flex-end;gap:8px;margin-top:3px}.editor-dialog[data-tone=destructive] #editorDialogConfirm{border-color:var(--danger);background:var(--danger)}.editor-toast{position:fixed;z-index:1100;left:50%;bottom:20px;max-width:min(420px,calc(100vw - 28px));padding:10px 14px;border:1px solid color-mix(in srgb,var(--ok) 40%,var(--line));border-radius:999px;color:var(--text);background:var(--panel);box-shadow:0 14px 42px rgba(0,0,0,.28);font-size:.83rem;font-weight:750;opacity:0;transform:translate(-50%,7px);transition:opacity .3s ease,transform .3s ease}.editor-toast.visible{opacity:1;transform:translate(-50%,0)}.editor-toast.error{border-color:color-mix(in srgb,var(--danger) 50%,var(--line))}
@media(max-width:1370px){.editor-header .bar{grid-template-columns:1fr}.editor-header .actions{justify-content:space-between}.action-group{flex-wrap:wrap}.file-actions{flex:1}.output-actions{flex:0 0 auto}}@media(max-width:920px){.editor-header .bar{display:grid}.editor-heading{justify-content:space-between;width:100%}.editor-header .actions{display:grid!important;grid-template-columns:1fr!important;width:100%}.action-group{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%}.file-actions #exampleSelect{width:100%;grid-column:span 2}.output-actions{grid-template-columns:1fr 1fr}.editor-navigator{top:auto;right:10px;bottom:10px;max-height:min(65vh,520px)}}@media(max-width:650px){.editor-heading{align-items:flex-start;flex-direction:column;gap:7px}.editor-heading small{white-space:normal}.action-group{grid-template-columns:1fr 1fr}.file-actions #exampleSelect{grid-column:1/-1}.output-actions{grid-template-columns:1fr 1fr}.question-title-row{align-items:flex-start;flex-direction:column;gap:2px}.editor-dialog-actions{display:grid;grid-template-columns:1fr 1fr}.editor-toast{bottom:70px}}@media(prefers-reduced-motion:reduce){.editor-navigator,.navigator-flash,.paragraph-return-flash,.editor-toast{animation:none;transition:none}}

.survey-language-field{min-width:0;max-width:none;margin:0 0 18px;padding:13px 14px 14px;border:1px solid var(--line);border-radius:11px;background:color-mix(in srgb,var(--panel) 90%,var(--bg))}
.survey-language-field legend{display:flex;align-items:center;gap:7px;padding:0 5px;color:var(--muted);font-size:.82rem;font-weight:750}
.tooltip-label{display:inline-flex;align-items:center;border-bottom:1px dotted color-mix(in srgb,var(--muted) 75%,transparent);cursor:help}
.tooltip-label:focus-visible{outline:2px solid color-mix(in srgb,var(--accent) 45%,transparent);outline-offset:3px}
.language-options{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:7px}
.language-options label{position:relative;min-width:0;cursor:pointer}
.language-options input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.language-options label>span{display:flex;align-items:center;justify-content:center;gap:7px;min-height:39px;padding:7px 8px;border:1px solid var(--line);border-radius:9px;color:var(--text);background:var(--bg);font-size:.8rem;font-weight:700;white-space:nowrap;transition:border-color .12s,background .12s,box-shadow .12s}
.language-options label>span b{font-size:1rem;font-weight:400;line-height:1}
.language-options input:checked+span{border-color:var(--accent);color:var(--accent);background:color-mix(in srgb,var(--accent) 11%,var(--panel));box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 14%,transparent)}
.language-options input:focus-visible+span{outline:2px solid color-mix(in srgb,var(--accent) 45%,transparent);outline-offset:2px}
.survey-language-field .note{margin:9px 1px 0}
.custom-swatch{isolation:isolate;background:conic-gradient(from 205deg,#ff5e78,#ffca55,#47d59a,#42a5ff,#8e67ff,#ff5e78)!important}
.custom-swatch::after{content:"";position:absolute;z-index:0;inset:7px;border:2px solid rgba(255,255,255,.82);border-radius:7px;background:var(--swatch);box-shadow:0 1px 3px rgba(0,0,0,.28)}
.custom-swatch .swatch-check{display:none!important}
.custom-swatch .custom-pencil{z-index:2;right:-4px;bottom:-4px;width:18px;height:18px;border:2px solid var(--panel);border-radius:6px;color:#fff;background:#242938;font-size:.65rem}
.custom-row{grid-template-columns:auto auto minmax(0,1fr)}
.custom-row .note{margin:0}
.custom-accent-value{padding:5px 8px;border:1px solid var(--line);border-radius:7px;background:var(--bg);font:700 .78rem/1.2 ui-monospace,SFMono-Regular,Consolas,monospace}
@container(max-width:660px){.live-preview-actions{justify-self:end;justify-content:flex-end;width:auto;max-width:100%;gap:5px}}
@media(max-width:780px){.language-options{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:430px){.language-options{grid-template-columns:repeat(2,minmax(0,1fr))}.custom-row{grid-template-columns:auto 1fr}.custom-row .note{grid-column:1/-1}}

@media(max-width:1370px) and (min-width:921px){.editor-navigator{top:128px;max-height:calc(100vh - 146px)}}

.editor-header .bar{align-items:center}.version-chip{padding:3px 8px;font-size:.72rem}.action-group{gap:7px;border-color:color-mix(in srgb,var(--line) 72%,transparent);background:color-mix(in srgb,var(--panel) 94%,var(--bg))}.output-actions{border-color:color-mix(in srgb,var(--accent) 20%,var(--line));box-shadow:none}.output-actions #buildButton{box-shadow:0 5px 13px color-mix(in srgb,var(--accent) 15%,transparent)}
#metaFields textarea{min-height:72px;max-height:190px}.item[data-paragraph-index] textarea{min-height:94px;max-height:360px}.question-jump textarea[data-f="prompt"]{height:82px;min-height:68px;max-height:180px}.question-jump textarea.answers{height:148px;min-height:112px;max-height:320px}#jsonPreview{max-height:72vh}
.editor-navigator.side-left{left:10px;right:auto}.editor-navigator.side-right{right:10px;left:auto}.navigator-head-actions{display:flex;align-items:center;gap:4px}.navigator-head-actions button{width:30px;min-width:30px}.navigator-head-actions svg{display:block;width:17px;height:17px;overflow:visible;fill:none;stroke:currentColor;stroke-width:1.45;stroke-linecap:round;stroke-linejoin:round}.editor-navigator.side-left #navigatorSideToggle svg{transform:scaleX(1)}.editor-navigator.side-right #navigatorSideToggle svg{transform:scaleX(-1)}.navigator-head-actions .navigator-collapse-icon{width:12px;height:12px;fill:currentColor;stroke:none;transform-origin:50% 50%;transition:transform .15s}.editor-navigator.side-left .navigator-collapse-icon{transform:rotate(0)}.editor-navigator.side-left.collapsed .navigator-collapse-icon{transform:rotate(180deg)}.editor-navigator.side-right .navigator-collapse-icon{transform:rotate(180deg)}.editor-navigator.side-right.collapsed .navigator-collapse-icon{transform:rotate(0)}.editor-navigator.collapsed #navigatorToggle{transform:none!important}.editor-navigator.collapsed #navigatorSideToggle{display:none}.editor-navigator.collapsed .navigator-head-actions{width:100%;justify-content:center}
.navigator-group{border-radius:8px}.navigator-group-toggle{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;width:100%;min-height:30px;padding:4px 7px 4px 9px;border:0;border-radius:7px;color:var(--muted);background:transparent;font-size:.76rem;font-weight:650;text-align:left}.navigator-group-toggle:hover,.navigator-group.has-active>.navigator-group-toggle{color:var(--accent);background:color-mix(in srgb,var(--accent) 9%,transparent)}.navigator-group-arrow{position:absolute;top:50%;left:-2px;display:block;width:9px;height:9px;fill:currentColor;transform:translateY(-50%) rotate(90deg);transition:transform .14s}.navigator-group.folded .navigator-group-arrow{transform:translateY(-50%) rotate(0)}.navigator-group-children{display:grid}.navigator-group.folded .navigator-group-children{display:none}.navigator-group .navigator-item.sub{padding-left:24px}.navigator-group>.navigator-item:not(.sub){font-weight:650}.navigator-group.has-active.folded>.navigator-group-toggle::after{content:"";justify-self:end;width:6px;height:6px;border-radius:50%;background:var(--accent)}
@media(max-width:920px){.editor-navigator.side-left{left:10px;right:auto}.editor-navigator.side-right{right:10px;left:auto}}
@media(prefers-reduced-motion:reduce){.navigator-collapse-icon,.navigator-group-arrow{transition:none!important}}

.scale-preview-label{display:block;margin-top:10px;color:var(--muted);font-size:.78rem;font-weight:700}.scale-preview{margin-top:5px}.scale-preview.slider-mini{padding:8px 14px 24px}
.json-panel{padding:0;overflow:hidden}.json-panel details>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px;cursor:pointer;font-weight:800;list-style:none}.json-panel details>summary::-webkit-details-marker{display:none}.json-panel details>summary small{margin-left:6px;color:var(--muted);font-size:.7rem;font-weight:650}.json-panel details[open]>summary{border-bottom:1px solid var(--line)}.json-summary-icon{transition:transform .15s}.json-panel details[open] .json-summary-icon{transform:rotate(180deg)}.json-panel-body{padding:16px 18px 18px}.generated-json-head{align-items:flex-start}.generated-json-head .help{margin:4px 0 0}.json-head-actions,.json-edit-actions{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:7px}.json-drop-zone{position:relative;border:1px solid transparent;border-radius:10px;transition:border-color .12s,background .12s}.json-drop-zone.editing{border-color:var(--line)}.json-drop-zone.drag-over{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,transparent)}#jsonPreview{display:block;min-height:340px;max-height:62vh;border:0;border-radius:9px;resize:vertical}#jsonPreview:not([readonly]){border:1px solid var(--line);background:var(--bg)}.json-drop-hint{margin:8px 2px;color:var(--muted);font-size:.76rem}.json-edit-error{margin:9px 0 0;padding:8px 10px;border-left:4px solid var(--danger);border-radius:6px;color:var(--danger);background:var(--bg);font-size:.8rem}.json-edit-actions{margin-top:10px}.json-edit-actions #undoJsonButton{margin-right:auto}
@media(max-width:650px){.generated-json-head{align-items:stretch}.json-head-actions{justify-content:stretch}.json-head-actions button{flex:1}.json-panel-body{padding:14px}}

.live-preview-head{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:8px}
.live-preview-top-row{display:contents}
.live-preview-title{grid-column:1}
.live-preview-actions{grid-column:2;justify-self:end}
.preview-window-actions{grid-column:3;display:flex;align-items:center;gap:5px}
.preview-window-actions button{min-width:32px}
.preview-full-button svg{display:block;width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.scale-preview-label,.input-preview-label{display:block;margin-top:10px;color:var(--muted);font-family:inherit;font-size:.82rem;font-weight:700;line-height:1.5}
.input-preview-label+.input-preview{margin-top:5px}
.signed-integer-control{display:grid;grid-template-columns:36px minmax(0,1fr) 36px;align-items:stretch;height:44px;min-height:44px}
.signed-integer-control input{position:relative;z-index:1;height:44px;min-height:44px;border-radius:0;text-align:center;font-variant-numeric:tabular-nums}
.signed-integer-control button{height:44px;min-width:36px;min-height:44px;padding:0;border-radius:8px 0 0 8px}
.signed-integer-control button:last-child{border-radius:0 8px 8px 0}
.signed-integer-control input:focus{z-index:2}
.type-box[data-c="scale"] .grid>.field{align-content:start}
.history-actions{display:inline-flex;gap:4px}
.history-actions button{display:grid;place-items:center;width:36px;min-width:36px;min-height:36px;padding:0;font-size:1.15rem}
.history-actions button:disabled{opacity:.38}
.theme-preview{position:relative;display:grid;grid-template-columns:auto 1fr;grid-template-rows:1fr auto;gap:3px 9px;align-items:center;min-height:50px;padding:8px 10px;overflow:hidden;font-family:var(--theme-display);text-align:left}
.theme-preview b{grid-row:1/-1;font:800 1.15rem/1 var(--theme-display)}
.theme-preview i{height:3px;border-radius:99px;background:var(--preview-accent)}
.theme-preview em{font:700 .62rem/1 var(--theme-display);font-style:normal}
.theme-card[data-layout="swiss-grid"] .theme-preview,.theme-card[data-layout="neo-brutalist"] .theme-preview,.theme-card[data-layout="comic-burst"] .theme-preview{border:2px solid var(--preview-text);border-radius:1px;box-shadow:3px 3px 0 var(--preview-text)}
.theme-card[data-layout="soft-wellness"] .theme-preview,.theme-card[data-layout="nature-organic"] .theme-preview{border-radius:18px}
.theme-card[data-layout="midnight-luxury"] .theme-preview,.theme-card[data-layout="art-deco"] .theme-preview,.theme-card[data-layout="museum-catalogue"] .theme-preview{text-align:center}
.theme-card[data-layout="tech-terminal"] .theme-preview{background:repeating-linear-gradient(0deg,var(--preview-bg) 0 9px,color-mix(in srgb,var(--preview-accent) 12%,var(--preview-bg)) 10px)}
.theme-card[data-layout="paper-notebook"] .theme-preview{transform:rotate(-.5deg);background:repeating-linear-gradient(0deg,var(--preview-bg) 0 13px,color-mix(in srgb,var(--preview-accent) 16%,var(--preview-bg)) 14px)}
.theme-card[data-layout="night-neon"] .theme-preview{box-shadow:inset 0 0 16px color-mix(in srgb,var(--preview-accent) 35%,transparent)}
.theme-card[data-layout="retro-pop"] .theme-preview,.theme-card[data-layout="memphis-party"] .theme-preview{background:radial-gradient(circle at 92% 15%,var(--preview-accent) 0 8px,transparent 9px),var(--preview-bg)}

@container(max-width:660px){
  .live-preview-head{grid-template-columns:minmax(0,1fr);align-items:start}
  .live-preview-top-row{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%}
  .live-preview-title,.preview-window-actions,.live-preview-actions{grid-column:auto}
  .live-preview-actions{justify-self:start;justify-content:flex-start;width:auto;max-width:100%;gap:5px}
  .live-preview-note>span:first-child,#previewThemeInfo{display:none}
  .preview-meta{display:flex}
  #previewDimensions{display:inline!important;overflow:visible;white-space:nowrap}
}

.dev-marker{display:inline-flex;align-items:center;min-height:20px;margin-left:7px;padding:1px 7px;border:1px solid #b86a00;border-radius:999px;color:#6f3d00;background:#ffe2a8;font-size:.64rem;font-weight:900;letter-spacing:.08em;vertical-align:middle}
[data-editor-mode=dark] .dev-marker{color:#ffd99b;background:#553000;border-color:#c77a12}
.dev-environment-bar{display:flex;align-items:center;justify-content:center;gap:16px;min-height:30px;padding:5px 16px;border-top:1px solid #e5ad52;border-bottom:1px solid #d79227;color:#573300;background:#fff0c9;font-size:.76rem;line-height:1.3}
.dev-environment-bar a{color:inherit;font-weight:850;text-decoration:underline;text-underline-offset:2px}
.dev-environment-bar button{min-height:25px;padding:2px 9px;border-color:currentColor;color:inherit;background:transparent;font-size:.72rem}
[data-editor-mode=dark] .dev-environment-bar{border-color:#8d5b16;color:#ffe1a7;background:#3f2a0d}
@media(max-width:700px){.dev-environment-bar{align-items:flex-start;justify-content:space-between;font-size:.7rem}}
#developmentResetDialog form{display:block;padding:22px}#developmentResetDialog h2{margin:0 0 8px}#developmentResetDialog p{color:var(--muted)}#developmentResetDialog label{display:grid;gap:6px;margin-top:14px;font-weight:750}#developmentResetDialog .dialog-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:20px}#developmentResetDialog .dialog-error{min-height:1.3em;color:var(--danger);font-weight:700}
.draft-toolbar{display:flex;align-items:center;gap:10px;padding:8px 12px;border-top:1px solid var(--line);background:color-mix(in srgb,var(--panel) 96%,var(--bg))}
.draft-toolbar>label{display:flex;align-items:center;gap:8px;min-width:0;flex:1}
.draft-toolbar>label>span{font-size:.77rem;font-weight:850;white-space:nowrap}
.draft-toolbar select{width:min(420px,100%);min-height:34px;padding:5px 30px 5px 9px}
.draft-status{min-width:170px;color:var(--muted);font-size:.72rem;white-space:nowrap}
.draft-actions{display:flex;gap:6px}
.creation-actions{display:inline-flex;flex:0 0 auto;white-space:nowrap}
.creation-actions>button{border-radius:0!important}
.creation-actions>button:first-child{border-radius:9px 0 0 9px!important}
.creation-actions>button:last-child{border-left-width:0!important;border-radius:0 9px 9px 0!important}
.creation-actions>button:only-child{border-width:1px!important;border-radius:9px!important}
.draft-actions button{min-height:32px;padding:4px 9px;font-size:.76rem}
.draft-actions .new-draft-button{border-color:color-mix(in srgb,var(--accent) 65%,var(--line));color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,var(--panel));font-weight:850}
.draft-actions .new-draft-button:not(:disabled):hover{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 17%,var(--panel));filter:brightness(1.06);box-shadow:0 5px 16px color-mix(in srgb,var(--accent) 22%,transparent)}
.draft-actions .danger{color:var(--danger)}
@media(max-width:920px){
  .draft-toolbar{align-items:stretch;flex-wrap:wrap}
  .draft-toolbar>label{flex:1 1 420px}
  .draft-status{order:3;min-width:0;flex:1 1 100%}
}
@media(max-width:560px){
  .draft-toolbar>label{align-items:stretch;flex-direction:column;gap:4px}
  .draft-toolbar select{width:100%}
  .draft-actions{display:flex;flex-wrap:wrap;width:100%}
  .creation-actions{flex:1 1 auto}.creation-actions>button{flex:1 1 50%}
  .draft-actions button{width:100%}
}

/* Editor identity and compact mobile action hierarchy — v0.12.0 */
:root,html[data-editor-mode="light"]{--accent:#0362fc}
@media(prefers-color-scheme:dark){:root{--accent:#62a8ff}}
html[data-editor-mode="dark"]{--accent:#62a8ff}
.mobile-file-actions{display:contents}
.mobile-file-actions>summary{display:none}
@media(max-width:650px){
  .editor-header .bar{gap:10px;width:calc(100% - 20px);padding:10px 0}
  .editor-heading{align-items:center;flex-direction:row;gap:9px}
  .editor-heading h1{font-size:1rem}
  .editor-heading small{font-size:.74rem;line-height:1.35}
  .editor-appearance{min-width:126px;min-height:34px;font-size:.74rem}
  .editor-header .actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:7px}
  .mobile-file-actions{display:block;grid-column:1/-1}
  .mobile-file-actions>summary{display:flex;align-items:center;justify-content:center;min-height:38px;padding:6px 10px;border:1px solid var(--line);border-radius:9px;color:var(--text);background:var(--panel);font-weight:700;cursor:pointer;list-style:none}
  .mobile-file-actions>summary::-webkit-details-marker{display:none}
  .mobile-file-actions>summary::after{content:"▾";margin-left:8px;color:var(--muted);font-size:.72rem}
  .mobile-file-actions[open]>summary::after{transform:rotate(180deg)}
  .mobile-file-actions .file-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin-top:7px;padding:7px}
  .editor-header .output-actions{display:contents}
  .editor-header .output-actions button{padding-inline:7px;font-size:.82rem;white-space:nowrap}
  .editor-header .actions button,.editor-header .actions select{width:100%;min-width:0}
  .file-actions #exampleSelect{grid-column:1/-1}
  .output-actions #buildButton{grid-column:auto}
  .draft-toolbar{gap:8px;padding:9px 10px}
  .draft-status{font-size:.69rem}
  .draft-actions{gap:5px}
  .draft-actions button{padding-inline:4px;font-size:.7rem}
  .preview-floating-restore{min-height:42px;padding:0 12px 0 10px;gap:7px;font-size:.76rem}
  .preview-floating-restore svg{width:18px;height:18px}
}

/* Activation and immutable build wizard — v0.16.2 */
html.build-wizard-open,html.build-wizard-open body{overflow:hidden;overscroll-behavior:none}
.build-wizard{width:min(720px,calc(100% - 24px));height:fit-content;max-height:min(1040px,calc(100dvh - clamp(24px,6dvh,72px)));padding:0;border:1px solid var(--line);border-radius:20px;color:var(--text);background:var(--panel);box-shadow:0 30px 100px #08162d55;overflow:hidden}
.build-wizard::backdrop{background:#08101fcc;backdrop-filter:blur(5px)}
.build-wizard>#buildWizardContent{display:flex;width:100%;max-height:inherit}
.wizard-card{display:flex;width:100%;max-height:inherit;margin:0;flex-direction:column;overflow:hidden}.wizard-header{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:22px 24px 16px;border-bottom:1px solid var(--line);flex:0 0 auto}
.wizard-header h2{margin:2px 0 0;font-size:1.25rem}.wizard-eyebrow{color:var(--accent);font-size:.7rem;font-weight:900;letter-spacing:.1em;text-transform:uppercase}
.wizard-close{display:grid;place-items:center;width:38px;min-width:38px;min-height:38px;padding:0;border-radius:50%}.wizard-close .wizard-button-icon{display:block;width:18px;height:18px;transform:none}
.wizard-progress{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin:0;padding:15px 24px;border-bottom:1px solid var(--line);list-style:none;flex:0 0 auto}
.wizard-progress li{position:relative;display:grid;grid-template-rows:25px auto;justify-items:center;gap:5px;color:var(--muted);font-size:.75rem;font-weight:750;text-align:center}
.wizard-progress li:not(:last-child)::after{content:"";position:absolute;z-index:0;top:12px;left:calc(50% + 17px);width:calc(100% - 34px);height:1px;background:var(--line)}
.wizard-step-number{position:relative;z-index:1;display:grid;place-items:center;width:25px;height:25px;border:1px solid var(--line);border-radius:50%;background:var(--panel);font-size:.68rem}
.wizard-step-label{line-height:1.15}.wizard-progress li.done,.wizard-progress li.current{color:var(--text)}.wizard-progress li.done .wizard-step-number,.wizard-progress li.current .wizard-step-number{border-color:var(--accent-border,var(--accent));color:var(--accent-contrast);background:var(--accent)}
.wizard-body{display:flex;min-height:0;padding:24px;overflow-y:auto;overscroll-behavior:contain;flex:1 1 auto;flex-direction:column}.wizard-body h3{margin:0 0 7px;font-size:1.08rem}.wizard-body p{line-height:1.55}
.wizard-lead{display:flex;align-items:flex-start;gap:14px;padding:17px;border:1px solid var(--line);border-radius:14px;background:color-mix(in srgb,var(--accent) 5%,var(--panel))}
.wizard-lead p{margin:0;color:var(--muted)}.wizard-icon{display:grid;place-items:center;flex:0 0 38px;width:38px;height:38px;border-radius:50%;color:white;background:var(--accent);font-size:1.1rem;font-weight:900}
.wizard-icon.mail{font-size:1rem}.wizard-lead:not(.success):not(.paused):not(.closed) .wizard-icon{color:var(--accent-contrast)}.wizard-lead.success{border-color:color-mix(in srgb,#15905c 40%,var(--line));background:color-mix(in srgb,#15905c 7%,var(--panel))}
.wizard-lead.success .wizard-icon{background:#15905c}.wizard-summary{display:grid;gap:0;margin:18px 0;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.wizard-lead.paused{border-color:color-mix(in srgb,var(--warn) 45%,var(--line));background:color-mix(in srgb,var(--warn) 8%,var(--panel))}.wizard-lead.paused .wizard-icon{background:var(--warn)}
.wizard-lead.closed{border-color:color-mix(in srgb,var(--danger) 45%,var(--line));background:color-mix(in srgb,var(--danger) 8%,var(--panel))}.wizard-lead.closed .wizard-icon{background:var(--danger)}
.wizard-summary div{display:grid;grid-template-columns:minmax(125px,.7fr) minmax(0,1.3fr);gap:15px;padding:10px 13px}.wizard-summary div+div{border-top:1px solid var(--line)}
.wizard-summary dt{color:var(--muted);font-size:.77rem;font-weight:750}.wizard-summary dd{min-width:0;margin:0;font-weight:750}.wizard-summary code{overflow-wrap:anywhere}.wizard-summary code.hash{font-size:.72rem;font-weight:600}
.wizard-help{color:var(--muted);font-size:.84rem}.wizard-field{display:grid;gap:7px;margin:18px 0;font-size:.8rem;font-weight:800}
.wizard-hosting-summary{margin-top:18px}
.wizard-field input{width:100%;min-height:46px}.delivery-options{display:grid;gap:8px;margin:18px 0;padding:0;border:0}.delivery-options legend{margin-bottom:8px;font-size:.8rem;font-weight:850}
.delivery-options label{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:11px;padding:12px;border:1px solid var(--line);border-radius:11px;cursor:pointer}
.delivery-options label:has(input:checked){border-color:var(--accent);background:color-mix(in srgb,var(--accent) 7%,var(--panel));box-shadow:0 0 0 1px var(--accent)}
.delivery-options input{width:18px;height:18px}.delivery-options span{display:grid;gap:2px}.delivery-options small{color:var(--muted);font-weight:500}
.wizard-notice{margin:16px 0 0;padding:11px 13px;border-left:4px solid var(--accent);border-radius:8px;background:color-mix(in srgb,var(--accent) 7%,var(--bg));font-size:.82rem}
.wizard-notice.error{border-color:var(--danger);color:var(--danger)}.wizard-notice.warning{border-color:#c17a00}.wizard-notice.success{border-color:#15905c;color:#087447}
.wizard-secondary-actions,.wizard-download{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}.wizard-download>*{flex:1 1 220px}
.wizard-button-icon{display:block;width:17px;height:17px;flex:0 0 17px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.wizard-button-icon-next{width:16px;height:16px;flex-basis:16px}.wizard-actions button,.wizard-secondary-actions button,.wizard-download .button{display:inline-flex;align-items:center;justify-content:center;gap:7px}.wizard-dashboard-button{display:inline-flex;align-items:center;justify-content:center;min-height:43px;padding:7px 14px;border:1px solid color-mix(in srgb,var(--accent) 58%,var(--line));border-radius:9px;color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,var(--panel));font:inherit;font-weight:750;text-align:center;text-decoration:none;cursor:pointer}.wizard-dashboard-button:hover{border-color:var(--accent);color:var(--accent);background:color-mix(in srgb,var(--accent) 14%,var(--panel))}
.wizard-forget-emails{min-height:30px;margin-top:-12px;padding:3px 0;border:0;color:var(--muted);background:transparent;font-size:.76rem;text-decoration:underline}
.wizard-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:24px -24px -24px;padding:16px 24px;border-top:1px solid var(--line);background:color-mix(in srgb,var(--bg) 55%,var(--panel))}
.wizard-actions button{min-height:42px}.wizard-lock-note{color:var(--muted);font-size:.75rem;text-align:right}
.activation-wait{display:flex;align-items:center;gap:12px;margin:18px 0;padding:14px;border:1px solid var(--line);border-radius:12px}
.activation-wait div{display:grid;gap:3px}.activation-wait small{color:var(--muted)}.waiting-pulse{width:14px;height:14px;border:3px solid color-mix(in srgb,var(--accent) 25%,transparent);border-top-color:var(--accent);border-radius:50%;animation:wizard-spin .9s linear infinite}
@keyframes wizard-spin{to{transform:rotate(360deg)}}
@media(max-width:560px){
  .build-wizard{width:calc(100% - 12px);height:calc(100dvh - 12px);max-height:calc(100dvh - 12px);border-radius:16px}
  .wizard-header,.wizard-body{padding:18px}.wizard-progress{padding:12px 18px}.wizard-progress li{gap:4px;font-size:.67rem}
  .wizard-summary div{grid-template-columns:1fr;gap:3px}
  .wizard-actions{margin:20px -18px -18px;padding:14px 18px}.wizard-lock-note{display:none}
  .wizard-download{display:grid}.wizard-download>*{width:100%;flex:none}
}
@media(max-height:680px) and (min-width:561px){.build-wizard{height:fit-content}}
.editor-tooltip[popover]{inset:auto;margin:0}

/* Theme identity cards */
.button-icon{width:16px;height:16px;vertical-align:-3px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.theme-card{overflow:visible;align-content:start;min-height:174px}
.theme-card-meta{display:grid;gap:3px;min-width:0}.theme-accent-badge{display:inline-flex;align-items:center;justify-self:start;gap:5px;max-width:100%;padding:3px 7px;border:1px solid color-mix(in srgb,var(--preview-accent) 42%,var(--line));border-radius:999px;color:var(--text);background:color-mix(in srgb,var(--preview-accent) 10%,var(--panel));font:700 .62rem/1.25 system-ui,sans-serif;white-space:nowrap}.theme-accent-badge>span{width:8px;height:8px;flex:0 0 auto;border-radius:50%;background:var(--preview-accent);box-shadow:0 0 0 1px color-mix(in srgb,var(--text) 22%,transparent)}.theme-font-names{overflow:hidden;color:var(--muted);font:600 .64rem/1.25 var(--theme-story);text-overflow:ellipsis;white-space:nowrap}

#copyJsonButton,#copyJsonPanelButton{white-space:nowrap}
.email-format-options{margin-top:14px}.email-format-options:disabled{opacity:.48}.wizard-attachment-option{display:flex;align-items:flex-start;gap:10px;margin-top:12px;padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--bg)}.wizard-attachment-option input{width:auto;margin-top:4px}.wizard-attachment-option span{display:grid;gap:2px}.wizard-attachment-option small{color:var(--muted);font-size:.78rem;font-weight:400}.wizard-attachment-option:has(input:disabled){opacity:.48}
@media(min-width:1600px){
  .draft-toolbar{min-height:clamp(42px,2.8vw,58px);gap:clamp(10px,.75vw,18px);padding:clamp(8px,.65vw,14px) clamp(12px,1vw,22px)}
  .draft-toolbar>label{gap:clamp(8px,.55vw,14px)}
  .draft-toolbar>label>span{font-size:clamp(.77rem,.5vw,.95rem)}
  .draft-toolbar select{width:clamp(420px,24vw,720px);min-height:clamp(34px,2.1vw,46px);padding-inline:clamp(9px,.65vw,16px) 34px;font-size:clamp(.8rem,.52vw,1rem)}
  .draft-status{font-size:clamp(.72rem,.47vw,.9rem)}
  .draft-actions{gap:clamp(6px,.4vw,10px)}
  .draft-actions button{min-height:clamp(32px,2vw,43px);padding-inline:clamp(9px,.65vw,16px);font-size:clamp(.76rem,.49vw,.92rem)}
}

/* v0.17.1 interface settings, restrained states and consistent interaction */
:root{--accent-soft:color-mix(in srgb,var(--accent) 12%,transparent)}
.settings-button{white-space:nowrap}
button,.button,.wizard-dashboard-button,.mobile-file-actions>summary,.navigator-item,.navigator-group-toggle,.theme-card,.appearance-row label,.language-options label,.delivery-options label,.delimiter-options span{transition:color .16s ease,background-color .16s ease,border-color .16s ease,box-shadow .16s ease,opacity .16s ease}
button:not(:disabled):hover,.button:not([aria-disabled=true]):hover{border-color:color-mix(in srgb,var(--accent) 48%,var(--line));background:color-mix(in srgb,var(--accent) 8%,var(--panel))}
button.primary:not(:disabled):hover{border-color:var(--accent-border,var(--accent));color:var(--accent-contrast);background:var(--accent-hover,var(--accent))}
button.danger{border-color:color-mix(in srgb,var(--danger) 58%,var(--line));color:var(--danger);background:color-mix(in srgb,var(--danger) 5%,var(--panel))}
button.danger:not(:disabled):hover{border-color:var(--danger);color:var(--danger);background:color-mix(in srgb,var(--danger) 12%,var(--panel))}
button:focus-visible,.button:focus-visible,.mobile-file-actions>summary:focus-visible{outline:0;box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 28%,transparent)}
button:disabled,.button[aria-disabled=true]{filter:none;transform:none}
html[data-tooltips=off] .editor-tooltip{display:none!important}
html[data-motion=reduce]{scroll-behavior:auto}
html[data-motion=reduce] *,html[data-motion=reduce] *::before,html[data-motion=reduce] *::after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}

.settings-dialog{width:min(840px,calc(100% - 28px));max-height:calc(100dvh - 36px);padding:0;overflow:hidden}
.settings-dialog>form{display:flex;max-height:inherit;flex-direction:column}
.settings-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:9px 20px 8px;border-bottom:1px solid var(--line)}
.settings-heading h2{margin:2px 0 4px}.settings-heading p{margin:0;color:var(--muted)}
.settings-kicker{color:var(--accent);font-size:.7rem;font-weight:900;letter-spacing:.1em}
.settings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;padding:22px 25px;overflow:auto;overscroll-behavior:contain}
.settings-grid section{display:grid;align-content:start;gap:12px}
.settings-grid section h3{margin:0 0 2px;padding-bottom:8px;border-bottom:1px solid var(--line);font-size:.94rem}
.settings-grid section>label{display:grid;gap:5px;font-size:.78rem;font-weight:750}
.settings-grid section>label.checkbox-row{display:inline-flex}
.settings-grid select,.settings-grid input[type=color]{width:100%;min-height:40px}
.settings-actions-stack{display:grid;gap:8px;margin-top:5px}.settings-actions-stack button{justify-content:flex-start;text-align:left}
.settings-development{grid-column:1/-1;padding:15px;border:1px solid color-mix(in srgb,var(--accent) 24%,var(--line));border-radius:11px;background:color-mix(in srgb,var(--accent) 4%,var(--panel))}
.settings-development dl{display:flex;flex-wrap:wrap;gap:8px 20px;margin:0}.settings-development dl div{display:flex;gap:6px}.settings-development dt{color:var(--muted)}.settings-development dd{margin:0;font-weight:750}.settings-development p{margin:0;color:var(--muted);font-size:.78rem}
.settings-dialog .editor-dialog-actions{margin:0;padding:6px 20px;border-top:1px solid var(--line);background:var(--panel)}

.editor-list-end-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}
.clear-local-dialog{width:min(520px,calc(100% - 28px))}.clear-local-dialog form{display:grid;gap:12px}.clear-local-dialog label{display:grid;gap:6px}.clear-local-dialog input{width:100%}
.help-dialog{width:min(720px,calc(100% - 28px));max-height:calc(100dvh - 36px);padding:0;overflow:hidden}.help-dialog-layout{display:flex;max-height:inherit;flex-direction:column}.help-dialog header{position:static;display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:23px 25px 17px;background:transparent;backdrop-filter:none}.help-dialog header>div{min-width:0}.help-dialog header h2{margin:2px 0 4px}.help-dialog header p{margin:0;color:var(--muted)}.help-dialog-close{flex:0 0 auto}.help-dialog-body{display:grid;gap:8px;padding:18px 25px;overflow:auto;overscroll-behavior:contain}.help-dialog details{padding:11px 13px;border:1px solid var(--line);border-radius:10px}.help-dialog details>summary{display:flex;align-items:flex-start;gap:10px;cursor:pointer;font-weight:800;list-style:none}.help-dialog details>summary::-webkit-details-marker{display:none}.help-dialog details>summary::marker{content:""}.help-dialog details>summary::before{content:"";flex:0 0 auto;width:.45em;height:.45em;margin-top:.34em;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg);transform-origin:center;transition:transform .16s ease}.help-dialog details[open]>summary::before{transform:rotate(45deg)}.help-dialog details p{margin:8px 0 0;color:var(--muted)}.help-dialog footer{display:flex;justify-content:flex-end;padding:15px 25px;border-top:1px solid var(--line)}

.build-wizard{max-height:calc(100dvh - clamp(18px,4dvh,54px))}
.build-wizard>#buildWizardContent,.wizard-card{max-height:inherit}

.draft-option-state-draft{color:var(--muted)}
.draft-option-state-waiting{color:#8067b3}
.draft-option-state-active{color:color-mix(in srgb,var(--accent) 78%,var(--text))}
.draft-option-state-unpublished{color:#a96b0b}
.draft-option-state-paused{color:#b76815}
.draft-option-state-closed{color:var(--danger)}
.draft-toolbar optgroup[data-state=contact]{color:#3398e6!important}.draft-option-state-contact{color:var(--text)!important}
.draft-status[data-state=waiting]{color:#8067b3}.draft-status[data-state=active]{color:var(--accent)}.draft-status[data-state=paused]{color:#b76815}.draft-status[data-state=closed]{color:var(--danger)}

@media(max-width:680px){
  .settings-dialog{width:100%;height:100dvh;max-height:100dvh;border-radius:0}
  .settings-grid{grid-template-columns:1fr;padding:18px}
  .settings-development{grid-column:auto}
}
@media(prefers-reduced-motion:reduce){
  button,.button,.wizard-dashboard-button,.mobile-file-actions>summary,.navigator-item,.navigator-group-toggle,.theme-card,.appearance-row label,.language-options label,.delivery-options label{transition:none}
}

/* v0.17.1 grouped header, settings swatches and complete interaction states */
.header-workspace{display:flex;align-items:center;gap:7px;min-width:0}
.editor-header .bar{grid-template-columns:minmax(550px,auto) minmax(0,1fr)}
.settings-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;background:color-mix(in srgb,var(--bg) 42%,var(--panel))}
.settings-card{padding:16px;border:1px solid var(--line);border-radius:12px;background:var(--panel)}
.settings-section-help{margin:-4px 0 3px;color:var(--muted);font-size:.76rem;font-weight:400}
.settings-accent-field{min-width:0;margin:0;padding:0;border:0}.settings-accent-field legend{margin-bottom:7px;font-size:.78rem;font-weight:750}
.settings-accent-grid{display:grid;grid-template-columns:repeat(5,minmax(44px,1fr));gap:8px}
.settings-accent-grid label{position:relative;display:grid;justify-items:center;gap:4px;min-width:0;cursor:pointer}
.settings-accent-grid input{position:absolute;width:1px;height:1px;opacity:0}
.settings-accent-grid span{display:grid;place-items:center;width:38px;height:38px;border:2px solid var(--line);border-radius:10px;background:var(--swatch);transition:border-color .16s,box-shadow .16s,transform .16s}
.settings-accent-grid span.custom-swatch{color:#fff;background:linear-gradient(135deg,#0362fc,#6558e8,#078f76,#c66a12);font-size:1rem}
.settings-accent-grid small{max-width:100%;overflow:hidden;color:var(--muted);font-size:.61rem;text-overflow:ellipsis;white-space:nowrap}
.settings-accent-grid label:hover span{border-color:color-mix(in srgb,var(--accent) 65%,var(--line));box-shadow:0 5px 13px #0002}
.settings-accent-grid label:hover span:not(.custom-swatch){background:var(--swatch);filter:none;transform:translateY(-1px)}
.settings-accent-grid input:checked+span{border-color:var(--text);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 24%,transparent)}
.settings-accent-grid input:focus-visible+span{box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 35%,transparent)}
.settings-color-input{display:flex;align-items:center;gap:9px}.settings-color-input input{width:54px!important}.settings-color-input output{font-family:ui-monospace,monospace;font-weight:800}
.settings-local-data .settings-actions-stack{margin-top:auto}
.manual-dialog{width:min(820px,calc(100% - 28px))}
.draft-toolbar optgroup[data-state=draft]{color:var(--muted)}.draft-toolbar optgroup[data-state=waiting]{color:#8067b3}.draft-toolbar optgroup[data-state=unpublished]{color:#a96b0b}.draft-toolbar optgroup[data-state=active]{color:var(--accent)}.draft-toolbar optgroup[data-state=paused]{color:#b76815}.draft-toolbar optgroup[data-state=closed]{color:var(--danger)}
.draft-toolbar option[class^=draft-option-state-]{color:var(--text)}
html[data-tooltips=off] [data-tooltip]{cursor:inherit}
html[data-tooltips=off] .tooltip-label{border-bottom-color:transparent;text-decoration:none}
.status .waiting{border-color:#8067b3}.status .active{border-color:var(--accent)}.status .paused{border-color:var(--warn)}.status .closed{border-color:var(--danger)}
button:not(:disabled):active,.button:not([aria-disabled=true]):active,.theme-card:not(:disabled):active,.appearance-row label:active,.language-options label:active,.settings-accent-grid label:active span{filter:brightness(.96)}
select:not(:disabled):hover,input:not(:disabled):hover,textarea:not(:disabled):hover,.theme-card:hover,.appearance-row label:hover span,.language-options label:hover span,.mobile-file-actions>summary:hover,.preview-more>summary:hover,.details>summary:hover{border-color:color-mix(in srgb,var(--accent) 42%,var(--line))}
details>summary{transition:color .16s,background-color .16s,border-color .16s}
details>summary:hover{color:var(--accent)}
@media(max-width:1370px){.editor-header .bar{grid-template-columns:1fr}.header-identity{justify-content:space-between}}
@media(max-width:760px){.header-identity{align-items:flex-start;flex-direction:column}.header-workspace{flex-wrap:wrap}.settings-grid{grid-template-columns:1fr}.settings-accent-grid{grid-template-columns:repeat(5,minmax(40px,1fr))}}

/* v0.17.2 localized workspace, settings and help refinements */
.settings-grid select,.settings-grid option,.settings-grid .checkbox-row span,.settings-accent-grid small{font-weight:500}
.settings-accent-grid{grid-template-columns:repeat(7,minmax(48px,1fr));gap:10px 7px}
.settings-accent-grid label{padding:3px 1px;border-radius:10px}
.settings-accent-grid span{width:40px;height:40px}
.settings-accent-grid label:has(input[value=custom]){padding-left:8px;border-left:1px solid var(--line)}
.settings-accent-grid span.custom-swatch{margin:0;border-color:var(--line);background:conic-gradient(from 45deg,#0362fc,#6558e8,#c93267,#c66a12,#a9e46f,#078f76,#0362fc);box-shadow:inset 0 0 0 5px var(--panel)}
.settings-accent-grid input:checked+span.custom-swatch{border-color:var(--text);box-shadow:inset 0 0 0 5px var(--panel),0 0 0 3px color-mix(in srgb,var(--accent) 24%,transparent)}
.settings-custom-accent{padding:10px;border:1px solid var(--line);border-radius:10px;background:color-mix(in srgb,var(--bg) 52%,var(--panel))}
.settings-custom-accent[hidden]{display:none}
.settings-color-input input[type=color]{padding:3px;border-radius:9px;cursor:pointer}
#settingsButton{border-color:color-mix(in srgb,var(--accent) 48%,var(--line));color:var(--accent);background:color-mix(in srgb,var(--accent) 6%,var(--panel))}
#helpButton{border-color:color-mix(in srgb,var(--ok) 42%,var(--line));color:var(--ok);background:color-mix(in srgb,var(--ok) 6%,var(--panel))}
#manualButton{border-color:color-mix(in srgb,#7357b8 42%,var(--line));color:color-mix(in srgb,#7357b8 75%,var(--text));background:color-mix(in srgb,#7357b8 6%,var(--panel))}
#settingsButton:hover,#helpButton:hover,#manualButton:hover{border-color:currentColor;background:color-mix(in srgb,currentColor 11%,var(--panel))}
.editor-header .bar{align-items:center}.editor-heading{min-width:0}.header-workspace{align-items:center}.editor-header .actions{align-items:center}
.file-actions{padding:4px;border:1px solid var(--line);border-radius:11px;background:color-mix(in srgb,var(--bg) 35%,var(--panel))}
.output-actions{padding:4px;border:1px solid color-mix(in srgb,var(--accent) 25%,var(--line));border-radius:11px;background:color-mix(in srgb,var(--accent) 4%,var(--panel))}
.file-actions button{min-height:34px}.output-actions button{min-height:38px}
.help-dialog-body p{margin:8px 0 0;line-height:1.58}
@media(max-width:980px){.settings-accent-grid{grid-template-columns:repeat(5,minmax(46px,1fr))}.editor-header .bar{align-items:stretch}.editor-heading{align-items:flex-start;flex-direction:column}.editor-header .actions{justify-content:flex-start}}
@media(max-width:520px){.settings-accent-grid{grid-template-columns:repeat(4,minmax(44px,1fr))}.settings-accent-grid label:has(input[value=custom]){padding-left:1px;border-left:0}}

/* v1.0.0 compact workspace, explicit lifecycle and accessible accents */
:root{
  --accent-contrast:#fff;
  --state-active:#18794e;
  --state-active-soft:color-mix(in srgb,#18794e 12%,var(--panel));
}
html[data-editor-mode=dark]{--state-active:#62d99a;--state-active-soft:color-mix(in srgb,#2db879 14%,var(--panel))}
.editor-header .bar{
  display:flex;
  align-items:center;
  gap:12px;
  padding-block:9px;
}
.header-identity{display:flex;align-items:center;min-width:0;flex:1 1 auto;gap:12px}
.editor-heading-copy{display:grid;flex:0 0 auto;gap:1px}
.editor-heading-copy h1{display:flex;align-items:center;gap:6px;margin:0;white-space:nowrap}
.version-chip{order:1}.dev-marker{order:2}
.header-workspace{display:flex;flex-wrap:nowrap;min-width:0;gap:6px}
.header-workspace button,.header-primary-actions button{min-height:35px;padding-inline:10px;white-space:nowrap}
.header-primary-actions{display:flex;flex:0 0 auto;margin-left:auto}
.header-primary-actions .output-actions{display:flex;flex-wrap:nowrap}
.header-appearance-toggle{width:36px;min-width:36px;padding:0!important;font-size:1rem}
.header-appearance-toggle .appearance-light-icon,.header-appearance-toggle .appearance-dark-icon{display:none}
html[data-editor-mode=dark] .header-appearance-toggle .appearance-light-icon,
html:not([data-editor-mode=dark]) .header-appearance-toggle .appearance-dark-icon{display:inline}
.visually-hidden-control{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important}
#previewButton:not(:disabled):hover{border-color:var(--accent);color:var(--accent);background:color-mix(in srgb,var(--accent) 13%,var(--panel));box-shadow:0 4px 14px color-mix(in srgb,var(--accent) 14%,transparent)}
#buildButton{color:var(--accent-contrast)}
#buildButton:not(:disabled):hover{color:var(--accent-contrast);filter:brightness(1.06);box-shadow:0 5px 16px color-mix(in srgb,var(--accent) 22%,transparent)}
button.primary,.button.primary,.new-draft-button,.wizard-actions .primary{color:var(--accent-contrast)}

.survey-state-badge{display:inline-flex;align-items:center;min-height:24px;padding:3px 9px;border:1px solid var(--line);border-radius:999px;color:var(--muted);background:var(--panel);font-size:.7rem;font-weight:850;white-space:nowrap}
.survey-state-badge[data-state=draft]{color:var(--text)}
.survey-state-badge[data-state=unpublished]{border-color:color-mix(in srgb,#b97700 45%,var(--line));color:#a86400;background:color-mix(in srgb,#c98500 8%,var(--panel))}
.survey-state-badge[data-state=waiting]{border-color:color-mix(in srgb,#8067b3 48%,var(--line));color:#8067b3;background:color-mix(in srgb,#8067b3 8%,var(--panel))}
.survey-state-badge[data-state=active]{border-color:color-mix(in srgb,var(--state-active) 48%,var(--line));color:var(--state-active);background:var(--state-active-soft)}
.survey-state-badge[data-state=paused]{border-color:color-mix(in srgb,var(--warn) 55%,var(--line));color:var(--warn);background:color-mix(in srgb,var(--warn) 9%,var(--panel))}
.survey-state-badge[data-state=closed]{border-color:color-mix(in srgb,var(--danger) 55%,var(--line));color:var(--danger);background:color-mix(in srgb,var(--danger) 8%,var(--panel))}
.draft-toolbar optgroup[data-state=active],.draft-option-state-active,.draft-status[data-state=active]{color:var(--state-active)!important}
.draft-toolbar optgroup[data-state=draft]{color:var(--muted)}
.draft-toolbar optgroup[data-state=waiting]{color:#8067b3}
.draft-toolbar optgroup[data-state=unpublished]{color:#a86400}
.draft-toolbar optgroup[data-state=paused]{color:var(--warn)}
.draft-toolbar optgroup[data-state=closed]{color:var(--danger)}

.settings-accent-grid{grid-template-columns:repeat(auto-fit,minmax(74px,1fr));gap:8px}
.settings-accent-grid label{display:grid;align-content:start;justify-items:center;gap:6px;min-height:70px;padding:8px 5px;border:1px solid transparent;border-radius:11px}
.settings-accent-grid label:hover{border-color:color-mix(in srgb,var(--accent) 35%,var(--line));background:color-mix(in srgb,var(--accent) 6%,var(--panel))}
.settings-accent-grid label:has(input:checked){border-color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,var(--panel))}
.settings-accent-grid label:has(input[value=custom]){grid-column:1/-1;display:flex;align-items:center;justify-content:flex-start;min-height:58px;padding:8px 12px;border-left:1px solid transparent}
.settings-accent-grid small{overflow:visible;max-width:none;color:var(--text);font-size:.65rem;line-height:1.22;text-align:center;text-overflow:clip;white-space:normal}
.settings-accent-grid label:has(input[value=custom]) small{font-size:.72rem}
.settings-accent-grid span.custom-swatch{margin:0;box-shadow:inset 0 0 0 4px var(--panel)}
.settings-custom-accent{margin-top:2px}

.new-survey-dialog{width:min(560px,calc(100% - 28px))}
.new-survey-dialog form{display:grid;gap:13px}
.new-survey-dialog label{display:grid;gap:6px;font-size:.8rem;font-weight:800}
.new-survey-dialog select,.new-survey-dialog input{width:100%;min-height:43px}
.json-panel-head{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.json-panel-actions{display:flex;flex-wrap:wrap;gap:7px}

.help-dialog.manual-dialog{width:min(1080px,calc(100% - 28px))}
.manual-dialog .help-dialog-body{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.manual-dialog .help-dialog-body.manual-single-column{grid-template-columns:1fr}
.manual-dialog details{align-self:start}
.manual-dialog details[open]{grid-column:1/-1;padding:16px 18px}
.manual-dialog .manual-chapter>summary>span{display:grid;min-width:0;flex:1;gap:3px}.manual-dialog .manual-chapter>summary small{color:var(--muted);font-size:.77rem;font-weight:600;line-height:1.35}
.manual-chapter-content{display:grid;gap:20px;margin-top:15px}.manual-topic{max-width:900px}.manual-topic+.manual-topic{padding-top:18px;border-top:1px solid var(--line)}.manual-topic h3{margin:0 0 8px;font-size:1rem}.manual-topic p{margin:0 0 10px!important;color:var(--muted);line-height:1.62}.manual-topic ul,.manual-topic ol{display:grid;gap:7px;margin:8px 0 12px;padding-left:24px;color:var(--muted);line-height:1.55}.manual-topic pre{max-width:100%;overflow:auto;padding:11px 13px;border:1px solid var(--line);border-radius:8px;background:var(--bg);white-space:pre-wrap;overflow-wrap:anywhere;color:var(--text);font-size:.8rem}

@media(max-width:1180px){
  .editor-header .bar{flex-wrap:wrap}
  .header-identity{flex:1 1 100%}
  .header-primary-actions{margin-left:auto}
}
@media(min-width:1181px){
  .editor-heading-copy small{display:none}
}
@media(max-width:980px){
  .header-identity{align-items:flex-start;flex-direction:column}
  .header-workspace{flex-wrap:wrap}
  .editor-header .bar{align-items:flex-start}
}
@media(max-width:760px){
  .manual-dialog .help-dialog-body{grid-template-columns:1fr}
  .draft-toolbar{align-items:stretch}
  .survey-state-badge{align-self:flex-start}
}

/* v1.0.0 preview, dialog, accent and native-selector corrections */
:root{--accent-readable:var(--accent)}
#settingsButton,#helpButton,#manualButton,.preview-full-button,.accent-outline{color:var(--accent-readable)!important}
.draft-toolbar optgroup option,.draft-toolbar option[class^=draft-option-state-]{color:var(--text)!important}
.settings-accent-grid{
  grid-template-columns:repeat(auto-fit,minmax(58px,1fr));
  gap:3px;
}
.settings-accent-grid label{
  gap:4px;
  min-height:62px;
  padding:5px 2px;
}
.settings-accent-grid label:has(input[value=custom]){
  grid-column:auto;
  display:grid;
  justify-content:center;
  min-height:62px;
  padding:5px 2px;
  border-left:0;
}
.settings-accent-grid span{width:38px;height:38px}
.settings-accent-grid small{font-size:.61rem}
.new-survey-dialog form{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:14px;
  padding:0;
}
.new-survey-dialog .settings-heading{grid-column:1;padding:22px 24px 17px}
.new-survey-dialog .new-survey-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}
.new-survey-dialog .new-survey-heading>div{min-width:0}
.new-survey-dialog .new-survey-name,
.new-survey-dialog .new-survey-template,
.new-survey-dialog .new-survey-template-note{margin-inline:24px}
.new-survey-dialog .new-survey-template-note{margin-block:0;color:var(--muted);font-size:.8rem}
.new-survey-dialog .editor-dialog-actions{grid-column:1;margin-top:1px;padding:15px 24px;border-top:1px solid var(--line)}
.json-head-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:min(360px,100%)}
.json-head-actions button{min-width:0;width:100%;white-space:normal}
.navigator-group-arrow{margin-top:-2px}
.live-preview-panel[data-device=mobile] .preview-more{display:none}
.live-preview-note>span:first-child{flex:1 1 250px;min-width:0}
.live-preview-note .preview-meta{flex:0 0 auto}
#deleteDraftButton:not(:disabled){border-color:color-mix(in srgb,var(--danger) 58%,var(--line))}
@media (min-height:663px) and (max-height:749px){
  .live-preview-note>span:first-child{display:none}
}
@media(max-width:650px){
  .new-survey-dialog .editor-dialog-actions{display:grid;grid-template-columns:1fr 1fr}
  .json-head-actions{width:100%}
}

/* v1.0.0 interaction, contrast and compact-layout corrections */
.history-actions button svg{display:block;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.live-preview-panel[data-device=mobile] .preview-more{display:block;visibility:hidden;pointer-events:none}
.preview-more-unavailable{visibility:hidden!important;pointer-events:none!important}
.generated-json-head{display:grid;grid-template-columns:minmax(0,1fr);align-items:start}
.generated-json-head .help{grid-row:1;margin:0 0 9px}
.json-head-actions{grid-row:2;width:100%;max-width:360px;justify-self:end}
.json-head-actions button{min-height:34px;padding-inline:8px;line-height:1.2}
.settings-accent-grid .custom-swatch,
.settings-accent-grid input:checked+.custom-swatch,
.settings-accent-grid input:focus-visible+.custom-swatch{border-color:var(--line)!important;box-shadow:none!important}
.settings-accent-grid .custom-swatch::after{content:none!important}
.settings-accent-grid label:has(input[value=custom]):has(input:checked){border-color:var(--accent)}
.clear-local-dialog form{display:block!important;padding:22px!important}
.clear-local-dialog h2{margin:0 0 9px}
.clear-local-dialog p{margin:0 0 14px;color:var(--muted)}
.clear-local-dialog label{margin-top:14px}
.clear-local-dialog .editor-dialog-actions{margin-top:20px}
#deleteDraftButton:not(:disabled),.draft-actions #deleteDraftButton:not(:disabled){border-color:currentColor!important;color:var(--danger)!important}
#previewButton,.accent-outline,#settingsButton,#helpButton,#manualButton{border-color:color-mix(in srgb,var(--accent-readable) 58%,var(--line));color:var(--accent-readable)!important}
#previewButton:not(:disabled):hover,.accent-outline:not(:disabled):hover{border-color:var(--accent-readable);color:var(--accent-readable)!important;background:color-mix(in srgb,var(--accent-readable) 10%,var(--panel))}
.statistics-toggle-label,[role=button],summary{cursor:default;user-select:none}
@container(max-width:850px){.live-preview-note>span:first-child{display:none}}
@container(max-width:710px){.live-preview-note #previewThemeInfo{display:none}}
.live-preview-note #previewDimensions{display:inline!important}
.settings-accent-grid label:has(input[value=custom]) small{font-size:.56rem;letter-spacing:-.025em;line-height:1.1}
.live-preview-restore,.preview-floating-restore{border-color:var(--accent-border,var(--accent))!important;color:var(--accent-on-fill,var(--accent-contrast))!important;background:var(--accent-fill,var(--accent))!important}
.accent-swatch:not(:disabled):hover{border-color:var(--text)!important;background:var(--swatch)!important;filter:none!important}
.editor-heading-copy>small{display:block!important;margin-top:1px;color:var(--muted);font-size:.72rem;line-height:1.25}
.live-preview-panel:not(.minimized){min-width:min(400px,calc(100vw - 16px))}
.settings-accent-grid label:hover{background:transparent}
button.primary,.button.primary,.new-draft-button,.wizard-actions .primary,#buildButton{border-color:var(--accent-border,var(--accent))!important;color:var(--accent-on-fill,var(--accent-contrast))!important;background:var(--accent-fill,var(--accent))!important}
.wizard-progress li.done .wizard-step-number,.wizard-progress li.current .wizard-step-number,.wizard-lead:not(.success):not(.paused):not(.closed) .wizard-icon{border-color:var(--accent-border,var(--accent));color:var(--accent-on-fill,var(--accent-contrast));background:var(--accent-fill,var(--accent))}
.wizard-inline-action{margin-inline-start:.55rem;padding:.35rem .65rem;border:1px solid currentColor;border-radius:.55rem;background:transparent;color:inherit;font:inherit;font-weight:700;cursor:pointer}
.wizard-inline-action:hover{background:color-mix(in srgb,currentColor 10%,transparent)}
.manual-introduction{margin:0 0 1rem;padding:1rem 1.1rem;border:1px solid var(--line);border-radius:.8rem;background:color-mix(in srgb,var(--accent) 7%,transparent)}
.manual-introduction h3{margin:0 0 .55rem}.manual-introduction p{margin:.35rem 0;line-height:1.55}
.manual-dialog .manual-introduction{grid-column:1/-1}

/* v1.0.0 patch 1: stronger, distinct primary header utilities */
:root{--first-steps-action:#087b58;--manual-action:#6842ad}
html[data-editor-mode=dark]{--first-steps-action:#67d9a8;--manual-action:#b89cff}
#settingsButton{
  border-color:color-mix(in srgb,var(--accent-readable) 82%,var(--line))!important;
  color:var(--accent-readable)!important;
  background:color-mix(in srgb,var(--accent-readable) 14%,var(--panel))!important;
}
#helpButton{
  border-color:color-mix(in srgb,var(--first-steps-action) 82%,var(--line))!important;
  color:var(--first-steps-action)!important;
  background:color-mix(in srgb,var(--first-steps-action) 14%,var(--panel))!important;
}
#manualButton{
  border-color:color-mix(in srgb,var(--manual-action) 82%,var(--line))!important;
  color:var(--manual-action)!important;
  background:color-mix(in srgb,var(--manual-action) 14%,var(--panel))!important;
}
#settingsButton,#helpButton,#manualButton{font-weight:800;box-shadow:inset 0 0 0 1px color-mix(in srgb,currentColor 18%,transparent)}
#contactButton{border-color:color-mix(in srgb,#3288d8 58%,var(--line));color:color-mix(in srgb,#3288d8 72%,var(--text));background:color-mix(in srgb,#3288d8 9%,var(--panel));font-weight:800}
#contactButton:hover{border-color:currentColor;background:color-mix(in srgb,#3288d8 18%,var(--panel))}
.survey-state-badge[data-state=contact]{border-color:#388dd2;color:#79bfff;background:color-mix(in srgb,#388dd2 15%,transparent)}
.contact-editor-mode #addParagraphButton,.contact-editor-mode #addQuestionButton,.contact-editor-mode #paragraphEndActions,.contact-editor-mode #questionEndActions,.contact-editor-mode #jsonPanel,
.contact-editor-mode #paragraphList .item-actions,.contact-editor-mode #paragraphList .insert-row,
.contact-editor-mode #questionList .item-actions{display:none!important}
.contact-editor-mode #questionList [data-f=id],.contact-editor-mode #questionList [data-f=type],
.contact-editor-mode #questionList [data-i=subtype],.contact-editor-mode #questionList [data-i=required]{pointer-events:none;opacity:.62}
.contact-form-dirty #saveContactFormButton{box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 22%,transparent)}
.wizard-hosting-summary{display:grid;grid-template-columns:minmax(112px,.35fr) minmax(0,1fr) auto;align-items:center;gap:14px;padding:14px 15px;border:1px solid color-mix(in srgb,var(--accent) 42%,var(--line));border-radius:12px;background:color-mix(in srgb,var(--accent) 7%,var(--panel))}
.wizard-hosting-title{color:var(--accent);font-weight:850}.wizard-hosting-description{color:var(--muted);font-size:.82rem;line-height:1.45}.wizard-hosting-open{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:38px;padding-inline:12px;border-color:color-mix(in srgb,var(--accent) 58%,var(--line));color:var(--accent);background:color-mix(in srgb,var(--accent) 5%,var(--panel));font-size:.82rem;font-weight:800;white-space:nowrap;text-decoration:none}.wizard-hosting-open:hover{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 13%,var(--panel))}
.contact-save-button{box-shadow:none!important}.contact-save-button:not(:disabled):hover{border-color:var(--accent)!important;background:color-mix(in srgb,var(--accent) 14%,var(--panel))!important}
@media(max-width:680px){.wizard-hosting-summary{grid-template-columns:1fr;gap:6px}.wizard-hosting-open{justify-self:start;margin-top:5px}}

/* v1.2.4: make the Distribute step explain both complementary delivery forms. */
.wizard-distribution-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:18px}.wizard-distribution-card{display:grid;align-content:start;gap:12px;min-width:0;padding:15px;border:1px solid var(--line);border-radius:12px;background:color-mix(in srgb,var(--panel) 95%,var(--accent) 5%)}.wizard-distribution-card.active{border-color:color-mix(in srgb,var(--accent) 48%,var(--line));background:color-mix(in srgb,var(--accent) 7%,var(--panel))}.wizard-distribution-card strong{font-size:1rem}.wizard-distribution-card p{margin:5px 0 0;color:var(--muted);font-size:.84rem}.wizard-distribution-card small{color:var(--muted);font-size:.76rem;line-height:1.4}.wizard-card-actions{display:flex;flex-wrap:wrap;gap:8px}.wizard-card-actions>*{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:40px}.wizard-public-settings{border-color:color-mix(in srgb,var(--accent) 64%,var(--line))!important;color:var(--accent-readable,var(--accent))!important;background:color-mix(in srgb,var(--accent) 10%,var(--panel))!important}.wizard-public-settings:hover{border-color:var(--accent)!important;background:color-mix(in srgb,var(--accent) 17%,var(--panel))!important}@media(max-width:720px){.wizard-distribution-choices{grid-template-columns:1fr}}
#settingsButton:not(:disabled):hover,#helpButton:not(:disabled):hover,#manualButton:not(:disabled):hover{border-color:currentColor!important;background:color-mix(in srgb,currentColor 22%,var(--panel))!important}

/* v1.0.0 final interaction polish */
.preview-more-menu{min-width:245px}
#previewResetSizeButton{white-space:normal;line-height:1.25}
.navigator-group-toggle{padding-inline-start:22px}
.navigator-group-arrow{left:7px}
.navigator-group-children{gap:2px;padding-top:3px}
.navigator-group.folded .navigator-group-children{padding-top:0}
.navigator-item,.navigator-group-toggle{border-radius:8px}

/* v1.1.5 hotfix 1: keep the final swatch inside the panel and remove stale grey hover styling. */
.settings-accent-grid{box-sizing:border-box;padding-inline:3px 7px}
.settings-accent-grid label{box-sizing:border-box;max-width:100%}
.settings-accent-grid label:hover span,
.settings-accent-grid label:hover span:not(.custom-swatch),
.settings-accent-grid .custom-swatch:hover{
  border-color:var(--line)!important;
  box-shadow:none!important;
  filter:none!important;
  transform:none!important;
}
.settings-accent-grid label:hover span:not(.custom-swatch){background:var(--swatch)!important}
.settings-accent-grid label:hover .custom-swatch{
  background:conic-gradient(from 45deg,#0362fc,#6558e8,#c93267,#c66a12,#a9e46f,#078f76,#0362fc)!important;
}

/* v1.1.5 hotfix 2: preserve special survey swatches on hover and keep the last cell clear of the panel edge. */
.accent-grid{box-sizing:border-box;padding-inline-end:7px}
.accent-grid .default-swatch:hover{
  background:linear-gradient(135deg,#7658e8,#33b99a,#efad4d)!important;
}
.accent-grid .custom-swatch:hover{
  background:conic-gradient(from 205deg,#ff5e78,#ffca55,#47d59a,#42a5ff,#8e67ff,#ff5e78)!important;
}
.settings-accent-grid label:hover:not(:has(input:checked)){
  border-color:color-mix(in srgb,var(--accent) 72%,var(--line))!important;
}

/* v1.2: the custom colour is a picker, not an extra selected preset. */
.settings-accent-grid label:has(input[value=custom]):not(:has(input:checked)),
.settings-accent-grid label:has(input[value=custom]):not(:has(input:checked)):hover{
  border-color:transparent!important;
  background:transparent!important;
  box-shadow:none!important;
}
.settings-accent-grid label:has(input[value=custom]):not(:has(input:checked)) .custom-swatch{
  border-color:var(--line)!important;
  box-shadow:inset 0 0 0 4px var(--panel)!important;
}

/* v1.2.3: the custom choice follows the same complete focus/hover frame as every accent. */
.settings-accent-grid label:has(input[value=custom]){
  border:1px solid transparent!important;
  border-left-width:1px!important;
  padding:5px!important;
  border-radius:12px!important;
  transition:border-color .16s ease,background-color .16s ease,transform .16s ease!important;
}
.settings-accent-grid label:has(input[value=custom]):hover{
  border-color:color-mix(in srgb,var(--accent) 58%,var(--line))!important;
  background:color-mix(in srgb,var(--accent) 8%,transparent)!important;
  transform:translateY(-1px)!important;
}
.settings-accent-grid label:has(input[value=custom]):has(input:checked){
  border-color:var(--accent)!important;
  background:color-mix(in srgb,var(--accent) 10%,transparent)!important;
  box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 20%,transparent)!important;
}
.settings-accent-grid label:has(input[value=custom]) .custom-swatch,
.settings-accent-grid label:has(input[value=custom]):hover .custom-swatch,
.settings-accent-grid label:has(input[value=custom]):has(input:checked) .custom-swatch{
  border:1px solid color-mix(in srgb,var(--text) 28%,var(--line))!important;
  box-shadow:inset 0 0 0 4px var(--panel)!important;
  transform:none!important;
}

/* v1.2.3: custom accent has the same complete hover feedback as preset accents. */
.settings-accent-grid label:has(input[value=custom]):hover{
  border-color:color-mix(in srgb,var(--accent) 65%,var(--line))!important;
  background:color-mix(in srgb,var(--accent) 8%,var(--panel))!important;
  box-shadow:0 4px 12px #0002!important;
  transform:translateY(-1px)!important;
}
.settings-accent-grid label:has(input[value=custom]):hover .custom-swatch{
  border-color:color-mix(in srgb,var(--accent) 65%,var(--text))!important;
  box-shadow:inset 0 0 0 4px var(--panel),0 5px 13px #0002!important;
  transform:translateY(-1px)!important;
}
.settings-accent-grid label:has(input[value=custom]):has(input:checked):hover{
  border-color:var(--accent)!important;
  box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 24%,transparent),0 5px 13px #0002!important;
}

/* v1.2.3: the custom picker uses the exact stable hover geometry of preset accents. */
.settings-accent-grid label:has(input[value=custom]),
.settings-accent-grid label:has(input[value=custom]):hover,
.settings-accent-grid label:has(input[value=custom]):has(input:checked),
.settings-accent-grid label:has(input[value=custom]):has(input:checked):hover{
  transform:none!important;
  filter:none!important;
}
.settings-accent-grid label:has(input[value=custom]):hover{
  border-color:color-mix(in srgb,var(--accent) 35%,var(--line))!important;
  background:color-mix(in srgb,var(--accent) 6%,var(--panel))!important;
  box-shadow:none!important;
}
.settings-accent-grid label:has(input[value=custom]):hover .custom-swatch{
  border-color:color-mix(in srgb,var(--accent) 65%,var(--line))!important;
  background:conic-gradient(from 45deg,#0362fc,#6558e8,#c93267,#c66a12,#a9e46f,#078f76,#0362fc)!important;
  box-shadow:inset 0 0 0 4px var(--panel)!important;
  transform:none!important;
}
.settings-accent-grid label:has(input[value=custom]):has(input:checked),
.settings-accent-grid label:has(input[value=custom]):has(input:checked):hover{
  border-color:var(--accent)!important;
  background:color-mix(in srgb,var(--accent) 10%,var(--panel))!important;
  box-shadow:none!important;
}

/* v1.2.3 patch: keep the custom swatch stationary, but make its hover as visible as presets. */
.settings-accent-grid label:has(input[value=custom]):hover,
.settings-accent-grid label:has(input[value=custom]):has(input:checked):hover{
  border-color:var(--accent)!important;
  background:color-mix(in srgb,var(--accent) 17%,var(--panel))!important;
  box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 24%,transparent),0 5px 13px #0002!important;
  filter:none!important;
  transform:none!important;
}
.settings-accent-grid label:has(input[value=custom]):hover .custom-swatch,
.settings-accent-grid label:has(input[value=custom]):has(input:checked):hover .custom-swatch{
  border-color:var(--text)!important;
  box-shadow:inset 0 0 0 4px var(--panel),0 0 0 2px color-mix(in srgb,var(--accent) 38%,transparent)!important;
  filter:none!important;
  transform:none!important;
}

/* v1.2.5: custom is a normal accent tile; only its swatch artwork differs. */
.settings-accent-grid label:has(input[value=custom]){
  grid-column:auto!important;
  display:grid!important;
  align-content:start!important;
  justify-items:center!important;
  gap:6px!important;
  min-height:70px!important;
  padding:8px 5px!important;
  border:1px solid transparent!important;
  border-left:1px solid transparent!important;
  border-radius:11px!important;
  outline:0!important;
  background:transparent!important;
  box-shadow:none!important;
  transform:none!important;
}
.settings-accent-grid label:has(input[value=custom]):not(:has(input:checked)):hover{
  border-color:color-mix(in srgb,var(--accent) 35%,var(--line))!important;
  background:color-mix(in srgb,var(--accent) 6%,var(--panel))!important;
  outline:0!important;
  box-shadow:none!important;
}
.settings-accent-grid label:has(input[value=custom]):has(input:checked),
.settings-accent-grid label:has(input[value=custom]):has(input:checked):hover{
  border-color:var(--accent)!important;
  border-left-color:var(--accent)!important;
  background:color-mix(in srgb,var(--accent) 10%,var(--panel))!important;
  outline:0!important;
  box-shadow:none!important;
}
.settings-accent-grid label:has(input[value=custom]) .custom-swatch,
.settings-accent-grid label:has(input[value=custom]):hover .custom-swatch,
.settings-accent-grid label:has(input[value=custom]):has(input:checked) .custom-swatch,
.settings-accent-grid label:has(input[value=custom]):has(input:checked):hover .custom-swatch{
  width:38px!important;
  height:38px!important;
  margin:0!important;
  border:2px solid var(--line)!important;
  box-shadow:inset 0 0 0 4px var(--panel)!important;
  filter:none!important;
  transform:none!important;
}
.settings-accent-grid label:has(input[value=custom]):not(:has(input:checked)):hover .custom-swatch{
  border-color:color-mix(in srgb,var(--accent) 65%,var(--line))!important;
  box-shadow:inset 0 0 0 4px var(--panel),0 5px 13px #0002!important;
}
.settings-accent-grid label:has(input[value=custom]):has(input:checked) .custom-swatch,
.settings-accent-grid label:has(input[value=custom]):has(input:checked):hover .custom-swatch{
  border-color:var(--text)!important;
  box-shadow:inset 0 0 0 4px var(--panel),0 0 0 3px color-mix(in srgb,var(--accent) 24%,transparent)!important;
}
.settings-accent-grid label:has(input[value=custom]) small{font-size:.56rem!important;letter-spacing:-.025em!important;line-height:1.1!important}

/* v1.2.5 patch 2: scroll wide fixed-zoom previews and mark the open menu. */
.live-preview-stage{overflow-x:auto!important;overflow-y:hidden!important}
.live-preview-stage::after{content:"";display:block;width:var(--preview-content-width,100%);height:1px;pointer-events:none}
.live-preview-stage.device-desktop iframe{left:max(0px,calc((100% - var(--preview-content-width,100%))/2))!important;top:0!important;transform:scale(var(--preview-scale,.44))!important;transform-origin:top left!important}
.preview-more[open]>summary{border-color:var(--accent)!important;color:var(--accent)!important;background:color-mix(in srgb,var(--accent) 10%,transparent)!important}
.wizard-distribution-card.wizard-hosting-card{grid-template-rows:auto auto auto}.wizard-distribution-card.wizard-hosting-card .wizard-card-actions{display:grid;grid-template-columns:minmax(0,1fr);align-items:stretch}.wizard-distribution-card.wizard-hosting-card .wizard-card-actions>*{width:100%}.wizard-distribution-card.wizard-hosting-card .wizard-public-settings{font-weight:850}.wizard-distribution-card.wizard-hosting-card .wizard-hosting-open{background:transparent}.wizard-summary:empty,.wizard-notice:empty{display:none}
.accent-grid .custom-swatch:not(:disabled):hover{
  border-color:var(--text)!important;
  box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 30%,transparent),0 5px 13px #0002!important;
  filter:none!important;
  transform:none!important;
}

/* v1.2.4: custom accents use the same stationary hover frame as presets. */
.settings-accent-grid label:has(input[value=custom]){
  overflow:visible!important;
  border:1px solid transparent!important;
  transform:none!important;
  transition:border-color .15s ease,background-color .15s ease,box-shadow .15s ease!important;
}

/* v1.2.5 final patch: one tile model for every editor accent. */
.settings-accent-grid label,
.settings-accent-grid label:has(input[value=custom]){
  display:grid!important;
  align-content:start!important;
  justify-items:center!important;
  gap:6px!important;
  min-height:70px!important;
  padding:8px 5px!important;
  border:1px solid transparent!important;
  border-radius:11px!important;
  background:transparent!important;
  box-shadow:none!important;
  transform:none!important;
}
.settings-accent-grid label:not(:has(input:checked)):hover{
  border-color:color-mix(in srgb,var(--accent) 35%,var(--line))!important;
  background:color-mix(in srgb,var(--accent) 6%,var(--panel))!important;
}
.settings-accent-grid label:has(input:checked),
.settings-accent-grid label:has(input:checked):hover{
  border-color:var(--accent)!important;
  background:color-mix(in srgb,var(--accent) 10%,var(--panel))!important;
}
.settings-accent-grid label span,
.settings-accent-grid label:has(input[value=custom]) .custom-swatch{
  width:38px!important;
  height:38px!important;
  margin:0!important;
  border:2px solid var(--line)!important;
  box-shadow:none!important;
  filter:none!important;
  transform:none!important;
}
.settings-accent-grid label:has(input[value=custom]) .custom-swatch{box-shadow:inset 0 0 0 4px var(--panel)!important}
.settings-accent-grid label:not(:has(input:checked)):hover span{
  border-color:color-mix(in srgb,var(--accent) 65%,var(--line))!important;
  box-shadow:0 5px 13px #0002!important;
}
.settings-accent-grid label:not(:has(input:checked)):hover .custom-swatch{box-shadow:inset 0 0 0 4px var(--panel),0 5px 13px #0002!important}
.settings-accent-grid label:has(input:checked) span,
.settings-accent-grid label:has(input:checked):hover span{
  border-color:var(--text)!important;
  box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 24%,transparent)!important;
}
.settings-accent-grid label:has(input[value=custom]):has(input:checked) .custom-swatch,
.settings-accent-grid label:has(input[value=custom]):has(input:checked):hover .custom-swatch{box-shadow:inset 0 0 0 4px var(--panel),0 0 0 3px color-mix(in srgb,var(--accent) 24%,transparent)!important}

/* Both axes remain reachable at fixed zoom; the scaled document supplies the scroll extent. */
.live-preview-stage{overflow:auto!important;scrollbar-width:thin;cursor:grab}
.live-preview-stage:active{cursor:grabbing}
.live-preview-stage::-webkit-scrollbar{width:8px;height:8px}
.live-preview-stage::-webkit-scrollbar-thumb{border:2px solid transparent;border-radius:999px;background:color-mix(in srgb,var(--muted) 72%,transparent);background-clip:padding-box}
.live-preview-stage::after{content:"";display:block;width:var(--preview-content-width,100%);height:var(--preview-content-height,100%);pointer-events:none}
.live-preview-stage.device-desktop iframe{left:var(--preview-frame-left,0)!important;top:0!important;width:1120px!important;height:var(--preview-virtual-height,820px)!important;overflow:hidden!important;transform:scale(var(--preview-scale,.44))!important;transform-origin:top left!important}
.live-preview-stage.device-mobile iframe{height:var(--preview-virtual-height,820px)!important}
.wizard-distribution-card.wizard-hosting-card .wizard-public-settings{
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  min-height:42px!important;padding:8px 14px!important;border-radius:9px!important;
  text-decoration:none!important
}
.wizard-distribution-card.wizard-hosting-card .wizard-hosting-open{
  display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:8px 14px;
  border:1px solid var(--line);border-radius:9px;text-decoration:none!important;background:transparent
}
.settings-accent-grid label:has(input[value=custom]):hover{
  border-color:color-mix(in srgb,var(--accent) 78%,var(--line))!important;
  background:color-mix(in srgb,var(--accent) 12%,var(--panel))!important;
  box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 22%,transparent)!important;
  filter:none!important;
  transform:none!important;
}
.settings-accent-grid label:has(input[value=custom]):has(input:checked),
.settings-accent-grid label:has(input[value=custom]):has(input:checked):hover{
  border-color:var(--accent)!important;
  background:color-mix(in srgb,var(--accent) 14%,var(--panel))!important;
  box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 30%,transparent)!important;
  transform:none!important;
}
.settings-accent-grid label:has(input[value=custom]) .custom-swatch,
.settings-accent-grid label:has(input[value=custom]):hover .custom-swatch,
.settings-accent-grid label:has(input[value=custom]):has(input:checked):hover .custom-swatch{
  border-color:color-mix(in srgb,var(--text) 42%,var(--line))!important;
  box-shadow:inset 0 0 0 3px var(--panel)!important;
  filter:none!important;
  transform:none!important;
}

/* v1.2.4 patch: visible, stationary custom-accent hover and optical history alignment. */
.settings-accent-grid label:has(input[value=custom]):hover,
.settings-accent-grid label:has(input[value=custom]):has(input:checked):hover{
  outline:2px solid color-mix(in srgb,var(--accent) 62%,transparent)!important;
  outline-offset:1px!important;
  background:color-mix(in srgb,var(--accent) 20%,var(--panel))!important;
  box-shadow:none!important;
  transform:none!important;
}
#undoButton svg{transform:translateX(-2px)}

/* v1.2.4 patch 1: the custom picker has a clear hover without shifting geometry. */
.settings-accent-grid label:has(input[value=custom]):hover .custom-swatch,
.settings-accent-grid label:has(input[value=custom]):has(input:checked):hover .custom-swatch{
  border-color:color-mix(in srgb,var(--accent) 72%,var(--text))!important;
  box-shadow:inset 0 0 0 3px var(--panel),0 0 0 3px color-mix(in srgb,var(--accent) 42%,transparent)!important;
  filter:brightness(1.08) saturate(1.08)!important;
  transform:none!important;
}

/* v1.2.5 final accent state: custom follows the preset tile interaction exactly. */
.settings-accent-grid label,
.settings-accent-grid label:has(input[value=custom]){
  grid-column:auto!important;display:grid!important;align-content:start!important;justify-items:center!important;
  gap:6px!important;min-height:70px!important;padding:8px 5px!important;
  border:1px solid transparent!important;border-left:1px solid transparent!important;border-radius:11px!important;
  outline:0!important;background:transparent!important;box-shadow:none!important;filter:none!important;transform:none!important
}
.settings-accent-grid label:not(:has(input:checked)):hover{
  border-color:color-mix(in srgb,var(--accent) 35%,var(--line))!important;
  background:color-mix(in srgb,var(--accent) 6%,var(--panel))!important;outline:0!important;box-shadow:none!important;transform:none!important
}
.settings-accent-grid label:has(input:checked),
.settings-accent-grid label:has(input:checked):hover{
  border-color:var(--accent)!important;border-left-color:var(--accent)!important;
  background:color-mix(in srgb,var(--accent) 10%,var(--panel))!important;outline:0!important;box-shadow:none!important;transform:none!important
}
.settings-accent-grid label:has(input[value=custom]) .custom-swatch,
.settings-accent-grid label:has(input[value=custom]):hover .custom-swatch{
  width:38px!important;height:38px!important;margin:0!important;border:2px solid var(--line)!important;
  box-shadow:inset 0 0 0 4px var(--panel)!important;filter:none!important;transform:none!important
}
.settings-accent-grid label:not(:has(input:checked)):hover span{
  border-color:color-mix(in srgb,var(--accent) 65%,var(--line))!important;
  box-shadow:0 5px 13px #0002!important;filter:none!important;transform:none!important
}
.settings-accent-grid label:not(:has(input:checked)):hover .custom-swatch{
  box-shadow:inset 0 0 0 4px var(--panel),0 5px 13px #0002!important
}
.settings-accent-grid input:checked+span,
.settings-accent-grid label:has(input:checked):hover span{
  border-color:var(--text)!important;
  box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 24%,transparent)!important;filter:none!important;transform:none!important
}
.settings-accent-grid input:checked+.custom-swatch,
.settings-accent-grid label:has(input:checked):hover .custom-swatch{
  box-shadow:inset 0 0 0 4px var(--panel),0 0 0 3px color-mix(in srgb,var(--accent) 24%,transparent)!important
}
.settings-accent-grid label:has(input[value=custom]) small{font-size:.56rem!important;letter-spacing:-.025em!important;line-height:1.1!important}

/* v1.2.5 patch 5: selected custom accent keeps its resting swatch on hover. */
.settings-accent-grid label:has(input[value=custom]):has(input:checked) .custom-swatch,
.settings-accent-grid label:has(input[value=custom]):has(input:checked):hover .custom-swatch{
  border-color:var(--line)!important;
  box-shadow:inset 0 0 0 4px var(--panel)!important;
  filter:none!important;
  transform:none!important
}
.settings-accent-grid input[value=custom]:focus-visible+.custom-swatch{
  outline:3px solid color-mix(in srgb,var(--accent) 58%,transparent)!important;
  outline-offset:2px!important
}

/* v1.3.4 patch 2: one authoritative custom-accent state model. The tile owns
   selection and hover; the custom swatch keeps only its artwork inset. */
.settings-accent-grid label:has(input[value=custom]),
.settings-accent-grid label:has(input[value=custom]):hover,
.settings-accent-grid label:has(input[value=custom]):has(input:checked),
.settings-accent-grid label:has(input[value=custom]):has(input:checked):hover{
  box-shadow:none!important;outline:0!important;transform:none!important
}
.settings-accent-grid label:has(input[value=custom]) .custom-swatch,
.settings-accent-grid label:has(input[value=custom]):hover .custom-swatch,
.settings-accent-grid label:has(input[value=custom]):has(input:checked) .custom-swatch,
.settings-accent-grid label:has(input[value=custom]):has(input:checked):hover .custom-swatch{
  border-color:var(--line)!important;
  box-shadow:inset 0 0 0 4px var(--panel)!important;
  filter:none!important;transform:none!important
}
.editor-clearable>input+.editor-clear-field{top:50%;transform:translateY(-50%)}
.editor-clearable>textarea+.editor-clear-field{top:7px;transform:none}
.editor-clear-field>span{display:block;transform:translate(0,-1px)}