:root{--builder-bg:#fff;--builder-panel-bg:#f8f8f8;--builder-canvas-frame:#0f0f11;--builder-border:#00000014;--builder-border-subtle:#0000000f;--builder-text-primary:#111;--builder-text-secondary:#6f6f6f;--builder-text-muted:#9a9a9a;--builder-icon:#a0a0a0;--builder-hover-bg:#0000000a;--builder-active-bg:#00000014;--builder-accent:#2563eb;--builder-accent-subtle:#2563eb1a;--space-xs:4px;--space-s:8px;--space-m:12px;--space-l:16px;--space-xl:20px;--space-2xl:24px;--font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;--font-mono:"SF Mono","Fira Code","Consolas",monospace;--text-title:13px;--text-label:12px;--text-input:12px;--text-tiny:10px;--radius-xs:4px;--radius-s:6px;--radius-m:8px;--input-height:32px;--panel-width:40px;--transition-fast:.15s ease;--transition-smooth:.25s cubic-bezier(.4,0,.2,1);--transition-spring:.3s cubic-bezier(.34,1.56,.64,1);--popup-bg:#fff;--popup-text:#111827;--popup-label:#6b7280;--popup-input-bg:#f3f4f6;--popup-border:#d1d5db;--glass-bg:#fffffffa;--glass-border:#fff6;--glass-shadow:0 8px 32px #0000001a}.dark{--builder-bg:#09090b;--builder-panel-bg:#09090b;--builder-canvas-frame:#18181b;--builder-border:#ffffff14;--builder-border-subtle:#ffffff0a;--builder-text-primary:#f4f4f5;--builder-text-secondary:#a1a1aa;--builder-text-muted:#52525b;--builder-icon:#71717a;--builder-hover-bg:#ffffff08;--builder-active-bg:#ffffff0f;--builder-accent:#3b82f6;--builder-accent-subtle:#3b82f626;--popup-bg:#18181b;--popup-text:#f4f4f5;--popup-label:#a1a1aa;--popup-input-bg:#27272a;--popup-border:#ffffff1a;--glass-bg:#09090bcc;--glass-border:#ffffff14;--glass-shadow:0 4px 20px #00000080}.form-editor-popup{-webkit-backdrop-filter:blur(16px);border:1px solid var(--glass-border);border-radius:var(--radius-m);background:var(--glass-bg)!important;color:var(--popup-text)!important;box-shadow:var(--glass-shadow)!important}.form-editor-popup input{border-radius:var(--radius-s);transition:all .2s;color:var(--popup-text)!important;background:#ffffff08!important;border-color:#ffffff1a!important}.form-editor-popup input:focus{box-shadow:0 0 0 2px var(--builder-accent-subtle);outline:none;border-color:var(--builder-accent)!important;background:#ffffff0d!important}.dark .builder-canvas-area{background:var(--builder-canvas-frame);border-right:none}.dark .builder-canvas-frame{border-color:var(--builder-border);box-shadow:0 0 40px #0003;background:var(--builder-bg)!important}.dark .form-input,.dark .form-select{color:var(--builder-text-primary);background:#ffffff08;border-color:#ffffff14;transition:all .2s}.dark .form-input:hover,.dark .form-select:hover{background:#ffffff0d;border-color:#ffffff26}.dark .form-input:focus,.dark .form-select:focus{border-color:var(--builder-accent);box-shadow:0 0 0 2px var(--builder-accent-subtle);background:#ffffff0d}.dark .section{background:var(--builder-panel-bg);border-color:#0000}.dark .section-header:hover{background:#ffffff0d}.dark .toggle-group{background:#1a1a1a;border-color:#ffffff1a}.dark .toggle-btn.active{background:#252525}.dark .chip{background:#1a1a1a;border-color:#ffffff1a}.dark .chip.active{background:#3b82f6}.dark .btn-secondary{color:#fff;background:#1a1a1a;border-color:#ffffff1f}.dark .btn-secondary:hover{background:#252525}.dark .btn-primary{color:#fff;background:#3b82f6;border-color:#3b82f6}.dark .btn-primary:hover{background:#2563eb;border-color:#2563eb}.dark .color-swatch{border-color:#fff3}.dark .slider-input{background:#ffffff1a}.dark .slider-value{background:#1a1a1a}.dark .segmented-control{background:#1a1a1a;border-color:#ffffff1a}.dark .segmented-control-btn.active{background:#252525}.dark .modal-content{color:#fff;background:#1a1a1a;border:1px solid #ffffff1a}.dark .modal-header{border-bottom-color:#ffffff1a}.dark .modal-footer{border-top-color:#ffffff1a}.dark .builder-sidebar{background:var(--builder-panel-bg);border-right:1px solid var(--builder-border)}.dark .builder-sidebar-header{border-bottom-color:var(--builder-border);background:#ffffff05}.dark .builder-sidebar-type{color:var(--builder-text-secondary);border:1px solid var(--builder-border-subtle);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#ffffff0d}.dark .builder-sidebar-content{background:var(--builder-panel-bg)}.dark .element-btn{border-color:var(--builder-border);color:var(--builder-text-primary);background:#ffffff08;transition:all .2s;box-shadow:0 1px 2px #0000001a}.dark .element-btn:hover{background:#ffffff14;border-color:#ffffff26;transform:translateY(-1px);box-shadow:0 4px 6px #0003}.dark .page-tabs{background:var(--builder-bg);border-bottom-color:var(--builder-border)}.dark .page-tab{color:var(--builder-text-secondary);background:0 0;border-right:1px solid #0000;transition:all .2s}.dark .page-tab:hover{color:var(--builder-text-primary);background:#ffffff08}.dark .page-tab.active{background:var(--builder-panel-bg);color:var(--builder-text-primary);border-right:1px solid var(--builder-border);border-left:1px solid var(--builder-border);border-top:1px solid var(--builder-accent)}.dark .color-picker-btn{transition:all .2s;border-color:var(--builder-border)!important;background:#ffffff0d!important}.dark .color-picker-btn:hover{background:#ffffff14!important;border-color:#fff3!important}.dark select,.dark .form-select{color:#fff!important;background-color:#1a1a1a!important;border-color:#ffffff1f!important}.dark .page-menu{background:#1a1a1a;border-color:#ffffff1a}.dark .page-menu-item:hover{background:#ffffff0d}.dark .slider-input::-webkit-slider-thumb{background:#3b82f6}.dark input[type=text],.dark input[type=number],.dark textarea{color:#fff;background:#1a1a1a;border-color:#ffffff1f!important}.dark input[type=text]:focus,.dark input[type=number]:focus,.dark textarea:focus{border-color:#3b82f6!important}.color-picker-dropdown{border:1px solid var(--builder-border);z-index:100;background:#fff}.color-picker-dropdown label,.color-picker-dropdown p{color:var(--builder-text-secondary)}.dark .color-picker-dropdown{background:#1a1a1a;border-color:#ffffff26}.dark .color-picker-dropdown label,.dark .color-picker-dropdown p{color:#b0b0b0}.color-picker-dropdown .color-picker-tab{color:#6b7280;background:#f3f4f6}.color-picker-dropdown .color-picker-tab.active{color:#fff;background:#000}.dark .color-picker-dropdown .color-picker-tab{color:#a1a1a1;background:#252525}.dark .color-picker-dropdown .color-picker-tab.active{color:#fff;background:#3b82f6}.color-picker-dropdown button:hover{background:#0000000d}.dark .color-picker-dropdown button:hover{background:#ffffff1a}.dark .color-picker-dropdown .text-gray-600{color:#b0b0b0!important}.dark .color-picker-dropdown .text-gray-700{color:#d0d0d0!important}.dark .color-picker-dropdown .text-gray-500{color:gray!important}.dark .color-picker-dropdown .border-gray-200{border-color:#ffffff1a!important}.dark .color-picker-dropdown .bg-gray-100{background-color:#252525!important}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideDown{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.6}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.builder-root{font-family:var(--font-family);font-size:var(--text-label);color:var(--builder-text-primary);background:var(--builder-bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.builder-header{background:var(--builder-bg);border-bottom:1px solid var(--builder-border);height:44px;padding:0 var(--space-m);justify-content:space-between;align-items:center;gap:var(--space-s);display:flex}.dark .builder-header{background:#0a0a0a;border-bottom-color:#ffffff1a}.builder-header-brand{align-items:center;gap:var(--space-xs);display:flex}.builder-header-logo{background:var(--builder-canvas-frame);border-radius:var(--radius-xs);color:#fff;letter-spacing:-.5px;justify-content:center;align-items:center;width:24px;height:24px;font-size:10px;font-weight:800;display:flex}.builder-header-title{color:var(--builder-text-primary);font-size:12px;font-weight:600}.builder-header-actions{align-items:center;gap:2px;display:flex}.save-status{border-radius:var(--radius-xs);transition:all var(--transition-fast);align-items:center;gap:4px;padding:4px 8px;font-size:11px;font-weight:500;display:flex}.save-status-saving{color:var(--builder-accent);align-items:center;gap:4px;display:flex}.save-status-saving svg{animation:1s linear infinite spin}.save-status-unsaved{color:#f59e0b}.save-status-saved{color:#10b981}.icon-btn.active{background:var(--builder-accent-subtle)}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.segmented-control{background:var(--builder-panel-bg);border:1px solid var(--builder-border);border-radius:var(--radius-s);gap:2px;padding:2px;display:flex}.segmented-control-btn{justify-content:center;align-items:center;gap:var(--space-xs);border-radius:var(--radius-xs);color:var(--builder-text-secondary);cursor:pointer;transition:all var(--transition-fast);background:0 0;border:none;padding:6px 12px;font-size:11px;font-weight:500;display:flex}.segmented-control-btn:hover{color:var(--builder-text-primary);background:var(--builder-hover-bg)}.segmented-control-btn:active{transform:scale(.96)}.segmented-control-btn.active{background:var(--builder-bg);color:var(--builder-text-primary);box-shadow:0 1px 3px #00000014}.segmented-control-btn svg{width:14px;height:14px;transition:transform var(--transition-spring)}.segmented-control-btn:hover svg{transform:scale(1.1)}.icon-btn{border-radius:var(--radius-xs);width:32px;height:32px;color:var(--builder-icon);cursor:pointer;transition:all var(--transition-fast);background:0 0;border:none;justify-content:center;align-items:center;display:flex}.icon-btn:hover{background:var(--builder-hover-bg);color:var(--builder-text-primary);transform:scale(1.05)}.icon-btn:active{transform:scale(.95)}.icon-btn:disabled{opacity:.4;cursor:not-allowed;transform:none}.icon-btn svg{width:16px;height:16px;transition:transform var(--transition-spring)}.icon-btn:hover svg{transform:scale(1.1)}.btn-secondary{align-items:center;gap:var(--space-xs);color:var(--builder-text-primary);background:var(--builder-bg);border:1px solid var(--builder-border);border-radius:var(--radius-s);cursor:pointer;padding:8px 14px;font-size:11px;font-weight:500;transition:all .15s;display:flex}.btn-secondary:hover{background:var(--builder-hover-bg);border-color:#00000026}.btn-primary{align-items:center;gap:var(--space-xs);color:#fff;background:var(--builder-text-primary);border:1px solid var(--builder-text-primary);border-radius:var(--radius-s);cursor:pointer;padding:6px 12px;font-size:11px;font-weight:500;transition:all .15s;display:flex}.btn-primary:hover{background:#333}.divider-v{background:var(--builder-border);width:1px;height:20px;margin:0 var(--space-s)}.builder-canvas-area{background:var(--builder-bg);flex-direction:column;flex:1;display:flex;position:relative;overflow:hidden}.builder-canvas-wrapper{flex:1;justify-content:center;align-items:flex-start;min-height:0;padding:0;display:flex;position:relative;overflow:auto}.builder-canvas-frame{background:var(--builder-bg);transition:width .3s;overflow:visible;transform:translate(0)}.builder-sidebar{width:var(--panel-width);background:var(--builder-bg);flex-direction:column;display:flex;overflow:hidden}.builder-sidebar-header{padding:var(--space-m)var(--space-l);border-bottom:1px solid var(--builder-border);z-index:20;justify-content:space-between;align-items:center;display:flex;position:relative}.builder-sidebar-type{text-transform:uppercase;letter-spacing:.5px;color:var(--builder-text-secondary);background:var(--builder-panel-bg);border-radius:var(--radius-xs);padding:4px 8px;font-size:11px;font-weight:600}.builder-sidebar-id{font-size:var(--text-tiny);color:var(--builder-text-muted);font-family:monospace}.builder-sidebar-mode{align-items:center;gap:var(--space-xs);font-size:var(--text-tiny);color:var(--builder-text-secondary);padding:var(--space-s)var(--space-l);background:var(--builder-panel-bg);border-bottom:1px solid var(--builder-border);display:flex}.builder-sidebar-mode-dot{background:#22c55e;border-radius:50%;width:6px;height:6px}.builder-sidebar-content{padding:var(--space-m);scroll-behavior:smooth;flex:1;overflow:hidden auto}.section{background:var(--builder-bg);border:1px solid var(--builder-border);border-radius:var(--radius-s);margin-bottom:var(--space-s);transition:box-shadow var(--transition-fast),border-color var(--transition-fast);overflow:visible}.section:hover{border-color:#0000001f}.section-header{padding:var(--space-l)var(--space-m);cursor:pointer;-webkit-user-select:none;user-select:none;width:100%;transition:background var(--transition-fast);background:0 0;border:none;justify-content:space-between;align-items:center;display:flex}.section-header:hover{background:var(--builder-hover-bg)}.section-header:active{background:var(--builder-active-bg)}.section-title{align-items:center;gap:var(--space-s);font-size:var(--text-title);color:var(--builder-text-primary);font-weight:500;display:flex}.section-title-icon{width:16px;height:16px;color:var(--builder-icon);transition:color var(--transition-fast),transform var(--transition-spring)}.section-header:hover .section-title-icon{color:var(--builder-text-secondary);transform:scale(1.1)}.section-chevron{width:14px;height:14px;color:var(--builder-icon);transition:transform var(--transition-smooth),color var(--transition-fast)}.section-chevron.expanded{transform:rotate(180deg)}.section-header:hover .section-chevron{color:var(--builder-text-secondary)}.section-content-wrapper{grid-template-rows:0fr;transition:grid-template-rows .25s cubic-bezier(0,0,0,0);display:grid}.section-content-wrapper.expanded{grid-template-rows:1fr}.section-content{padding:var(--space-s)var(--space-m)var(--space-l);visibility:hidden;opacity:0;box-sizing:border-box;min-height:0;max-height:40vh;transition:all .3s,opacity .3s;overflow-x:hidden}.section-content-wrapper.expanded .section-content{visibility:visible;opacity:1;width:100%}.section-content::-webkit-scrollbar{width:4px}.section-content::-webkit-scrollbar-track{background:0 0}.section-content::-webkit-scrollbar-thumb{background:#0000001a;border-radius:2px}.section-content::-webkit-scrollbar-thumb:hover{background:#0003}.form-label{align-items:center;gap:var(--space-xs);font-size:var(--text-label);color:var(--builder-text-secondary);margin-bottom:var(--space-s);font-weight:500;display:flex}.form-label-icon{width:12px;height:12px;color:var(--builder-icon)}.form-hint{font-size:var(--text-tiny);color:var(--builder-text-muted);margin-top:2px}.form-input{width:100%;height:var(--input-height);padding:0 var(--space-m);font-size:var(--text-input);font-family:var(--font-family);color:var(--builder-text-primary);background:var(--builder-bg);border:1px solid var(--builder-border);border-radius:var(--radius-xs);transition:border-color var(--transition-fast),box-shadow var(--transition-fast),transform var(--transition-fast);outline:none}.form-input:hover{border-color:#00000026}.form-input:focus{border-color:var(--builder-text-primary);box-shadow:0 0 0 3px #0000000d}.form-input::placeholder{color:var(--builder-text-muted)}.form-input-mono{font-family:SF Mono,Fira Code,monospace}.form-select{width:65%;height:var(--input-height);padding:0 var(--space-s);font-size:var(--text-input);font-family:var(--font-family);color:var(--builder-text-primary);background:var(--builder-bg);border:1px solid var(--builder-border);border-radius:var(--radius-xs);appearance:none;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%236F6F6F' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-position:right 8px center;background-repeat:no-repeat;outline:none;padding-right:24px;transition:border-color .15s}.form-select:focus{border-color:var(--builder-text-primary)}.form-select-full{width:100%}.grid-2{gap:var(--space-s);grid-template-columns:repeat(2,1fr);display:grid}.grid-3{gap:var(--space-s);grid-template-columns:repeat(3,1fr);display:grid}.grid-4{gap:var(--space-s);grid-template-columns:repeat(4,1fr);display:grid}.toggle-group{background:var(--builder-panel-bg);border:1px solid var(--builder-border);border-radius:var(--radius-xs);gap:2px;padding:3px;display:flex}.toggle-btn{justify-content:center;align-items:center;gap:var(--space-xs);color:var(--builder-text-secondary);cursor:pointer;transition:all var(--transition-fast);background:0 0;border:none;border-radius:3px;flex:1;padding:6px 10px;font-size:11px;font-weight:500;display:flex}.toggle-btn svg{width:14px;height:14px;transition:transform var(--transition-spring)}.toggle-btn:hover{color:var(--builder-text-primary);background:var(--builder-hover-bg)}.toggle-btn:hover svg{transform:scale(1.1)}.toggle-btn:active{transform:scale(.97)}.toggle-btn.active{background:var(--builder-bg);color:var(--builder-text-primary);box-shadow:0 1px 3px #00000014}.toggle-btn.active svg{color:var(--builder-accent)}.slider-row{align-items:center;gap:var(--space-s);display:flex}.slider-input{background:var(--builder-border);appearance:none;cursor:pointer;height:4px;transition:background var(--transition-fast);border-radius:2px;flex:1}.slider-input:hover{background:#0000001f}.slider-input::-webkit-slider-thumb{appearance:none;background:var(--builder-text-primary);cursor:pointer;width:14px;height:14px;-webkit-transition:transform var(--transition-spring),box-shadow var(--transition-fast);transition:transform var(--transition-spring),box-shadow var(--transition-fast);border-radius:50%;box-shadow:0 1px 3px #0003}.slider-input::-webkit-slider-thumb:hover{transform:scale(1.15);box-shadow:0 2px 6px #00000040}.slider-input::-webkit-slider-thumb:active{transform:scale(1.05)}.slider-value{font-size:var(--text-tiny);font-family:var(--font-mono);color:var(--builder-text-secondary);text-align:right;background:var(--builder-panel-bg);border-radius:3px;min-width:36px;padding:2px 6px}.color-row{align-items:center;gap:var(--space-s);display:flex}.color-swatch{border-radius:var(--radius-xs);border:2px solid var(--builder-border);cursor:pointer;width:28px;height:28px;transition:transform var(--transition-spring),border-color var(--transition-fast),box-shadow var(--transition-fast);flex-shrink:0}.color-swatch:hover{border-color:#0003;transform:scale(1.1);box-shadow:0 2px 8px #00000026}.color-input{flex:1;max-width:120px}.chip-group{gap:var(--space-xs);flex-wrap:wrap;display:flex}.chip{font-size:var(--text-tiny);color:var(--builder-text-secondary);background:var(--builder-panel-bg);border:1px solid var(--builder-border);border-radius:var(--radius-xs);cursor:pointer;transition:all var(--transition-fast);padding:5px 12px;font-weight:500}.chip:hover{background:var(--builder-hover-bg);border-color:#00000026;transform:translateY(-1px)}.chip:active{transform:translateY(0)scale(.97)}.chip.active{background:var(--builder-text-primary);color:#fff;border-color:var(--builder-text-primary);box-shadow:0 2px 4px #00000026}.add-elements-grid{gap:var(--space-s);grid-template-columns:repeat(3,1fr);display:grid}.add-element-btn{justify-content:center;align-items:center;gap:var(--space-s);padding:var(--space-l)var(--space-m);background:var(--builder-panel-bg);border:1px solid var(--builder-border);border-radius:var(--radius-s);cursor:pointer;transition:all var(--transition-fast);flex-direction:column;display:flex}.add-element-btn:hover{background:var(--builder-bg);border-color:#00000026;transform:translateY(-2px);box-shadow:0 4px 12px #00000014}.add-element-btn:active{transform:translateY(0)scale(.98)}.add-element-icon{transition:transform var(--transition-spring);font-size:20px;line-height:1}.add-element-btn:hover .add-element-icon{transform:scale(1.15)}.add-element-label{font-size:var(--text-tiny);color:var(--builder-text-secondary);transition:color var(--transition-fast);font-weight:500}.add-element-btn:hover .add-element-label{color:var(--builder-text-primary)}.spacing-box{background:var(--builder-panel-bg);border:1px solid var(--builder-border);border-radius:var(--radius-s);padding:var(--space-m)}.spacing-box-label{font-size:var(--text-tiny);color:var(--builder-text-secondary);text-align:center;margin-bottom:var(--space-s);font-weight:600}.spacing-input-sm{width:100%;height:24px;padding:0 var(--space-xs);font-size:var(--text-tiny);text-align:center;color:var(--builder-text-primary);background:var(--builder-bg);border:1px solid var(--builder-border);border-radius:3px;outline:none;font-family:monospace}.spacing-input-sm:focus{border-color:var(--builder-text-primary)}.thin-scrollbar::-webkit-scrollbar{width:4px;height:4px}.thin-scrollbar::-webkit-scrollbar-track{background:0 0}.thin-scrollbar::-webkit-scrollbar-thumb{background:#0000001a;border-radius:10px}.thin-scrollbar:hover::-webkit-scrollbar-thumb{background:#0003}.dark .thin-scrollbar::-webkit-scrollbar-thumb{background:#ffffff1a}.dark .thin-scrollbar:hover::-webkit-scrollbar-thumb{background:#fff3}.builder-scrollbar::-webkit-scrollbar{width:8px;height:8px}.builder-canvas-wrapper::-webkit-scrollbar{width:8px;height:8px}.builder-scrollbar::-webkit-scrollbar-track{background:var(--bg-tertiary,#8080801a);border-radius:4px}.builder-canvas-wrapper::-webkit-scrollbar-track{background:var(--bg-tertiary,#8080801a);border-radius:4px}.builder-scrollbar::-webkit-scrollbar-thumb{background:var(--text-tertiary,#80808080);border-radius:4px}.builder-canvas-wrapper::-webkit-scrollbar-thumb{background:var(--text-tertiary,#80808080);border-radius:4px}.builder-scrollbar::-webkit-scrollbar-thumb:hover{background:var(--text-secondary,#808080b3)}.builder-canvas-wrapper::-webkit-scrollbar-thumb:hover{background:var(--text-secondary,#808080b3)}.builder-canvas-wrapper{scrollbar-width:thin;scrollbar-color:var(--text-tertiary,#80808080)var(--bg-tertiary,#8080801a)}.empty-state{padding:var(--space-2xl);text-align:center;flex-direction:column;justify-content:center;align-items:center;animation:.3s ease-out fadeIn;display:flex}.empty-state-icon{margin-bottom:var(--space-m);opacity:.4;font-size:40px;animation:2s ease-in-out infinite pulse}.empty-state-title{font-size:var(--text-title);color:var(--builder-text-primary);margin-bottom:var(--space-xs);font-weight:500}.empty-state-desc{font-size:var(--text-label);color:var(--builder-text-secondary)}.modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);padding:var(--space-xl);z-index:999999;background:#00000080;justify-content:center;align-items:center;animation:.2s ease-out fadeIn;display:flex;position:fixed;inset:0}.modal-content{background:var(--builder-bg);border-radius:var(--radius-m);flex-direction:column;width:100%;max-width:560px;max-height:80vh;animation:.25s cubic-bezier(.34,1.56,.64,1) scaleIn;display:flex;overflow:hidden;box-shadow:0 25px 50px #0003}.modal-header{padding:var(--space-l);border-bottom:1px solid var(--builder-border);justify-content:space-between;align-items:center;display:flex}.modal-title{color:var(--builder-text-primary);font-size:14px;font-weight:600}.modal-body{padding:var(--space-l);flex:1;overflow-y:auto}.modal-footer{padding:var(--space-l);border-top:1px solid var(--builder-border);justify-content:flex-end;gap:var(--space-s);display:flex}.animate-in{animation:.2s ease-out fadeIn}.animate-slide{animation:.25s ease-out slideDown}.animate-scale{animation:.2s cubic-bezier(.34,1.56,.64,1) scaleIn}.form-row{align-items:center;gap:var(--space-s);display:flex}.form-row-icon{width:16px;height:16px;color:var(--builder-icon);flex-shrink:0}.section-divider{background:var(--builder-border);height:1px;margin:var(--space-m)0}.status-dot{border-radius:50%;flex-shrink:0;width:8px;height:8px}.status-dot.active{background:#22c55e;animation:2s ease-in-out infinite pulse;box-shadow:0 0 0 3px #22c55e33}.status-dot.warning{background:#f59e0b;box-shadow:0 0 0 3px #f59e0b33}.status-dot.error{background:#ef4444;box-shadow:0 0 0 3px #ef444433}.focus-ring:focus{box-shadow:0 0 0 2px var(--builder-bg),0 0 0 4px #00000026;outline:none}.hover-lift{transition:transform var(--transition-fast),box-shadow var(--transition-fast)}.hover-lift:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.shimmer{background:linear-gradient(90deg,var(--builder-panel-bg)25%,var(--builder-bg)50%,var(--builder-panel-bg)75%);background-size:200% 100%;animation:1.5s infinite shimmer}.badge{align-items:center;gap:var(--space-xs);font-size:var(--text-tiny);border-radius:var(--radius-xs);background:var(--builder-panel-bg);color:var(--builder-text-secondary);border:1px solid var(--builder-border);padding:3px 8px;font-weight:500;display:inline-flex}.badge-icon{width:10px;height:10px}.tooltip{position:relative}.tooltip:after{content:attr(data-tooltip);font-size:var(--text-tiny);color:var(--builder-bg);background:var(--builder-text-primary);border-radius:var(--radius-xs);white-space:nowrap;opacity:0;visibility:hidden;transition:opacity var(--transition-fast),transform var(--transition-fast);pointer-events:none;z-index:99999;padding:4px 8px;font-weight:500;position:absolute;top:100%;left:50%;transform:translate(-50%)translateY(4px)}.tooltip:hover:after{opacity:1;visibility:visible;transform:translate(-50%)translateY(8px)}.page-switcher{align-items:center;gap:var(--space-s);display:flex;position:relative}.page-switcher-btn{background:var(--builder-panel-bg);border:1px solid var(--builder-border);border-radius:var(--radius-s);font-size:var(--text-label);color:var(--builder-text-primary);cursor:pointer;transition:all var(--transition-fast);align-items:center;gap:6px;padding:6px 10px;font-weight:500;display:flex}.page-switcher-btn:hover{background:var(--builder-hover-bg);border-color:var(--builder-border-subtle)}.page-switcher-btn svg{color:var(--builder-icon)}.page-url-display{background:var(--builder-hover-bg);border-radius:var(--radius-xs);font-family:var(--font-mono);color:var(--builder-text-secondary);align-items:center;gap:4px;padding:4px 8px;font-size:11px;display:flex}.page-url-display svg{color:var(--builder-icon)}.page-dropdown{background:var(--builder-bg);border:1px solid var(--builder-border);border-radius:var(--radius-m);z-index:1000;min-width:280px;max-width:350px;animation:.15s slideDown;position:absolute;top:calc(100% + 8px);left:0;overflow:hidden;box-shadow:0 4px 24px #0000001f,0 2px 8px #00000014}.page-dropdown-header{border-bottom:1px solid var(--builder-border);color:var(--builder-text-secondary);text-transform:uppercase;letter-spacing:.5px;justify-content:space-between;align-items:center;padding:12px 14px;font-size:11px;font-weight:600;display:flex}.page-add-btn{background:var(--builder-accent);color:#fff;border-radius:var(--radius-xs);cursor:pointer;transition:all var(--transition-fast);border:none;align-items:center;gap:4px;padding:4px 10px;font-size:11px;font-weight:500;display:flex}.page-add-btn:hover{background:#1d4ed8}.page-dropdown-list{max-height:300px;padding:6px;overflow-y:auto}.page-dropdown-item{border-radius:var(--radius-s);transition:background var(--transition-fast);align-items:center;display:flex}.page-dropdown-item:hover{background:var(--builder-hover-bg)}.page-dropdown-item.active{background:var(--builder-accent-subtle)}.page-dropdown-item.active .page-dropdown-item-main{color:var(--builder-accent)}.page-expand-btn{width:20px;height:20px;color:var(--builder-icon);cursor:pointer;border-radius:var(--radius-xs);transition:all var(--transition-fast);background:0 0;border:none;justify-content:center;align-items:center;margin-left:4px;display:flex}.page-expand-btn:hover{background:var(--builder-hover-bg);color:var(--builder-text-primary)}.page-dropdown-item-main{cursor:pointer;font-size:var(--text-label);color:var(--builder-text-primary);text-align:left;background:0 0;border:none;flex:1;align-items:center;gap:8px;padding:10px 8px 10px 4px;display:flex}.page-child-count{background:var(--builder-border);min-width:18px;height:18px;color:var(--builder-text-secondary);border-radius:9px;justify-content:center;align-items:center;padding:0 5px;font-size:10px;font-weight:600;line-height:1;display:inline-flex}.page-dropdown-item-main svg{color:var(--builder-icon);flex-shrink:0}.page-dropdown-item-main .page-name{flex:1;font-weight:500}.page-dropdown-item-main .page-path{font-family:var(--font-mono);color:var(--builder-text-muted);font-size:10px}.page-home-badge{background:var(--builder-accent-subtle);color:var(--builder-accent);border-radius:var(--radius-xs);text-transform:uppercase;letter-spacing:.3px;padding:2px 6px;font-size:9px;font-weight:600}.page-dropdown-item-actions{opacity:0;transition:opacity var(--transition-fast);gap:2px;padding-right:8px;display:flex}.page-dropdown-item:hover .page-dropdown-item-actions{opacity:1}.page-dropdown-item-actions button{border-radius:var(--radius-xs);width:24px;height:24px;color:var(--builder-icon);cursor:pointer;transition:all var(--transition-fast);background:0 0;border:none;justify-content:center;align-items:center;display:flex}.page-dropdown-item-actions button:hover{background:var(--builder-active-bg);color:var(--builder-text-primary)}.page-dropdown-item-actions button:last-child:hover{color:#dc2626}.form-range{appearance:none;background:var(--builder-border);cursor:pointer;border-radius:2px;height:4px}.form-range::-webkit-slider-thumb{appearance:none;background:var(--builder-text-primary);cursor:pointer;width:14px;height:14px;-webkit-transition:transform var(--transition-fast);transition:transform var(--transition-fast);border-radius:50%}.form-range::-webkit-slider-thumb:hover{transform:scale(1.1)}.form-range::-moz-range-thumb{background:var(--builder-text-primary);cursor:pointer;border:none;border-radius:50%;width:14px;height:14px}.page-tabs-container{background:var(--builder-panel-bg);border-bottom:1px solid var(--builder-border);height:36px;padding:0 var(--space-s);align-items:center;display:flex;overflow:hidden}.page-tabs-scroll{scrollbar-width:none;-ms-overflow-style:none;align-items:center;gap:2px;padding:4px 0;display:flex;overflow:auto hidden}.page-tabs-scroll::-webkit-scrollbar{display:none}.page-tab{border-radius:var(--radius-xs);cursor:pointer;transition:all var(--transition-fast);white-space:nowrap;background:0 0;border:1px solid #0000;align-items:center;gap:4px;height:26px;padding:4px 8px;font-size:11px;display:flex;position:relative}.page-tab:hover{background:var(--builder-hover-bg)}.page-tab.active{border-color:var(--builder-border);background:#fff;box-shadow:0 1px 2px #0000000a}.page-tab-expand{width:14px;height:14px;color:var(--builder-icon);cursor:pointer;background:0 0;border:none;border-radius:2px;flex-shrink:0;justify-content:center;align-items:center;padding:0;display:flex}.page-tab-expand:hover{background:var(--builder-active-bg);color:var(--builder-text-primary)}.page-tab-expand-spacer{flex-shrink:0;width:14px}.page-tab-icon{color:var(--builder-icon);flex-shrink:0;justify-content:center;align-items:center;display:flex}.page-tab.active .page-tab-icon{color:var(--builder-accent)}.page-tab-name{color:var(--builder-text-primary);text-overflow:ellipsis;max-width:100px;font-weight:500;overflow:hidden}.page-tab-path{font-size:9px;font-family:var(--font-mono);color:var(--builder-text-muted);text-overflow:ellipsis;max-width:80px;overflow:hidden}.page-tab-count{background:var(--builder-active-bg);min-width:16px;height:14px;color:var(--builder-text-secondary);border-radius:7px;justify-content:center;align-items:center;padding:0 4px;font-size:9px;font-weight:600;display:flex}.page-tab-actions{gap:1px;margin-left:2px;display:flex}.page-tab-actions button{border-radius:var(--radius-xs);width:18px;height:18px;color:var(--builder-icon);cursor:pointer;transition:all var(--transition-fast);background:0 0;border:none;justify-content:center;align-items:center;display:flex}.page-tab-actions button:hover{background:var(--builder-active-bg);color:var(--builder-text-primary)}.page-tab-actions button.delete-btn:hover{color:#dc2626}.page-tab-active-indicator{background:var(--builder-accent);border-radius:1px;height:2px;position:absolute;bottom:-1px;left:8px;right:8px}.page-tab-add{border:1px dashed var(--builder-border);border-radius:var(--radius-xs);width:24px;height:24px;color:var(--builder-text-secondary);cursor:pointer;transition:all var(--transition-fast);background:0 0;flex-shrink:0;justify-content:center;align-items:center;margin-left:4px;display:flex}.page-tab-add:hover{background:var(--builder-hover-bg);border-color:var(--builder-accent);color:var(--builder-accent)}.animation-active-badge{background:var(--builder-accent-subtle);color:var(--builder-accent);text-transform:uppercase;letter-spacing:.3px;border-radius:10px;align-items:center;margin-left:8px;padding:2px 8px;font-size:9px;font-weight:600;display:inline-flex}.animation-categories{background:var(--builder-panel-bg);border-radius:var(--radius-s);gap:4px;margin-bottom:14px;padding:4px;display:flex}.animation-category-btn{border-radius:var(--radius-xs);cursor:pointer;transition:all var(--transition-fast);background:0 0;border:none;flex-direction:column;flex:1;align-items:center;gap:2px;padding:8px 4px;display:flex}.animation-category-btn:hover{background:var(--builder-hover-bg)}.animation-category-btn.active{background:var(--builder-bg);box-shadow:0 1px 3px #00000014}.animation-category-icon{color:var(--builder-icon);transition:color var(--transition-fast);font-size:14px;line-height:1}.animation-category-btn.active .animation-category-icon{color:var(--builder-accent)}.animation-category-label{color:var(--builder-text-muted);text-transform:uppercase;letter-spacing:.3px;transition:color var(--transition-fast);font-size:9px;font-weight:600}.animation-category-btn.active .animation-category-label{color:var(--builder-text-primary)}.animation-grid{grid-template-columns:repeat(2,1fr);gap:8px;margin-bottom:12px;display:grid}.animation-card{background:var(--builder-panel-bg);border:1px solid var(--builder-border);border-radius:var(--radius-s);cursor:pointer;transition:all var(--transition-fast);-webkit-tap-highlight-color:transparent;touch-action:manipulation;flex-direction:column;align-items:center;gap:8px;padding:12px 8px;display:flex;position:relative}.animation-card>*{pointer-events:none}.animation-card:hover{background:var(--builder-bg);border-color:#00000026;transform:translateY(-1px);box-shadow:0 4px 12px #0000000f}.animation-card.active{background:var(--builder-accent-subtle);border-color:var(--builder-accent)}.animation-preview{background:var(--builder-hover-bg);border-radius:var(--radius-xs);justify-content:center;align-items:center;width:32px;height:32px;display:flex;overflow:hidden}.animation-preview-box{background:linear-gradient(135deg,var(--builder-accent)0%,#60a5fa 100%);border-radius:3px;width:16px;height:16px;transition:all .3s}.animation-card:hover .animation-preview-box{transform:scale(1.1)}.animation-card.active .animation-preview{background:#ffffff80}.animation-card-label{color:var(--builder-text-secondary);transition:color var(--transition-fast);font-size:10px;font-weight:500}.animation-card.active .animation-card-label{color:var(--builder-accent);font-weight:600}.animation-card-check{background:var(--builder-accent);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:16px;height:16px;animation:.2s cubic-bezier(.34,1.56,.64,1) scaleIn;display:flex;position:absolute;top:6px;right:6px}.animation-clear-btn{border:1px dashed var(--builder-border);border-radius:var(--radius-xs);width:100%;color:var(--builder-text-muted);cursor:pointer;transition:all var(--transition-fast);background:0 0;justify-content:center;align-items:center;gap:6px;margin-bottom:8px;padding:8px 12px;font-size:11px;font-weight:500;display:flex}.animation-clear-btn:hover{color:#ef4444;background:#ef44440d;border-color:#ef4444}.animation-settings{flex-direction:column;gap:12px;display:flex}.animation-setting-header{color:var(--builder-text-secondary);text-transform:uppercase;letter-spacing:.5px;align-items:center;gap:6px;margin-bottom:4px;font-size:11px;font-weight:600;display:flex}.animation-setting-header svg{color:var(--builder-icon)}.animation-setting-row{flex-direction:column;gap:6px;display:flex}.animation-chips{flex-wrap:wrap;gap:4px;display:flex}.dark .animation-active-badge{background:#3b82f633}.dark .animation-categories{background:#1a1a1a}.dark .animation-category-btn.active{background:#252525}.dark .animation-card{background:#1a1a1a;border-color:#ffffff1a}.dark .animation-card:hover{background:#252525;border-color:#ffffff26}.dark .animation-card.active{background:#3b82f626;border-color:#3b82f6}.dark .animation-preview{background:#ffffff14}.dark .animation-card.active .animation-preview{background:#3b82f633}.dark .animation-clear-btn{border-color:#ffffff1a}.dark .animation-clear-btn:hover{background:#ef44441a}.root-size-notice{background:var(--builder-panel-bg);border:1px solid var(--builder-border);border-radius:var(--radius-xs);color:var(--builder-text-secondary);align-items:center;gap:8px;padding:10px 12px;font-size:11px;display:flex}.root-size-notice svg{color:var(--builder-icon);flex-shrink:0}.dark .root-size-notice{background:#1a1a1a;border-color:#ffffff1a}.resize-handle{cursor:col-resize;border-left:1px solid var(--builder-border);z-index:50;background-color:#0000;justify-content:center;align-items:center;width:6px;transition:border-color .2s,background-color .2s;display:flex;position:relative}.resize-handle:hover{background-color:#0000;border-left-color:#00000040}.resize-handle.resizing{border-left-color:var(--builder-accent);background-color:var(--builder-active-bg)}.resize-handle-indicator{background-color:var(--builder-icon);opacity:0;border-radius:1px;width:2px;height:40px;transition:opacity .2s}.resize-handle:hover .resize-handle-indicator{opacity:0}:root.dark .resize-handle,html.dark .resize-handle,.dark .resize-handle{border-left:1px solid var(--builder-border)}:root.dark .resize-handle:hover,html.dark .resize-handle:hover,.dark .resize-handle:hover{background-color:#0000;border-left-color:#ffffff40}:root.dark .resize-handle.resizing,html.dark .resize-handle.resizing,.dark .resize-handle.resizing{border-left-color:var(--builder-accent);background-color:var(--builder-active-bg)}:root.dark .resize-handle-indicator,html.dark .resize-handle-indicator,.dark .resize-handle-indicator{background-color:#fff6}.builder-toolbar{height:40px;padding:0 var(--space-m);background:var(--builder-bg);border-bottom:1px solid var(--builder-border);align-items:center;gap:var(--space-m);flex-shrink:0;display:flex;overflow-x:auto}.builder-toolbar.empty{color:var(--builder-text-muted);font-size:var(--text-label);justify-content:center}.toolbar-section{align-items:center;gap:var(--space-s);display:flex}.toolbar-label{font-size:var(--text-tiny);color:var(--builder-text-secondary);text-transform:uppercase;letter-spacing:.5px;font-weight:600}.toolbar-divider{background:var(--builder-border);width:1px;height:20px}.toolbar-divider-small{background:var(--builder-border-subtle);width:1px;height:16px;margin:0 var(--space-xs)}.toolbar-group{background:var(--builder-panel-bg);border-radius:var(--radius-s);align-items:center;gap:2px;padding:2px;display:flex}.toolbar-btn{width:28px;height:28px;color:var(--builder-text-secondary);border-radius:var(--radius-xs);cursor:pointer;transition:all var(--transition-fast);background:0 0;border:none;justify-content:center;align-items:center;display:flex}.toolbar-btn:hover{background:var(--builder-hover-bg);color:var(--builder-text-primary)}.toolbar-btn.active{background:var(--builder-bg);color:var(--builder-accent);box-shadow:0 1px 2px #0000000d}.color-swatches{align-items:center;gap:4px;display:flex}.color-swatch{border:1px solid var(--builder-border);cursor:pointer;width:20px;height:20px;transition:transform var(--transition-fast);border-radius:50%}.color-swatch:hover{border-color:var(--builder-text-secondary);transform:scale(1.1)}.section-content-wrapper.expanded{overflow:visible!important}.color-picker-dropdown{background:var(--builder-bg);border:1px solid var(--builder-border);box-shadow:0 10px 25px -5px #0000001a,0 8px 10px -6px #0000001a}.builder-layout{flex-direction:column!important;width:100vw!important;height:100vh!important;display:flex!important;overflow:hidden!important}.builder-header{flex-shrink:0}.builder-header.top-bar{height:48px}.builder-header-row-2{background:var(--builder-bg);border-bottom:1px solid var(--builder-border);height:40px;padding:0 var(--space-l);z-index:90;flex-shrink:0;align-items:center;display:flex}.builder-workspace{flex:1;height:auto!important}.toolbar-select{height:24px;color:var(--builder-text-primary);font-size:var(--text-label);cursor:pointer;border-radius:var(--radius-xs);background:0 0;border:none;outline:none;padding:0 4px}.toolbar-select:hover{background:var(--builder-hover-bg)}.dark .builder-header-row-2{background:var(--builder-bg);border-bottom-color:var(--builder-border)}.dark .toolbar-select{color:var(--builder-text-primary)}.dark .toolbar-select:hover{background:var(--builder-hover-bg)}.dark .toolbar-select option{background:var(--builder-bg);color:var(--builder-text-primary)}.demo-mode .builder-sidebar,.demo-mode .secondary-sidebar{box-shadow:none!important;border-left:none!important;border-right:none!important}.demo-mode .builder-header{border-bottom:1px solid #0000000d!important}.dark .demo-mode .builder-header{border-bottom:1px solid #ffffff0d!important}.demo-mode div[class*=border-r],.demo-mode div[class*=border-l]{border-color:#0000!important}@media (max-width:768px){.builder-header{gap:4px;height:44px;padding:0 10px}.builder-header-row-2,.builder-toolbar,.builder-header .header-center,.builder-header .mobile-hide{display:none!important}.builder-header-title{display:none}.builder-header .btn-primary,.builder-header .btn-secondary{gap:0!important;padding:6px!important}.builder-header [class*=rounded-full][class*=gap-1\.5]{border-radius:6px!important;gap:0!important;padding:6px 8px!important}.builder-canvas-area{-webkit-overflow-scrolling:touch;overflow:hidden auto;flex:1!important}.builder-canvas-wrapper{-webkit-overflow-scrolling:touch;justify-content:flex-start;align-items:flex-start;min-height:100%;padding:0;overflow-x:hidden}.icon-btn{min-width:44px;min-height:44px;padding:0}[data-element-id]{touch-action:manipulation}.builder-canvas-wrapper,.builder-sidebar-content{-webkit-overflow-scrolling:touch}}.mobile-split-panel{border-top:1px solid var(--builder-border);background:var(--builder-bg);flex-direction:column;flex-shrink:0;height:calc(50vh - 22px);display:flex;overflow:hidden}.dark .mobile-split-panel{background:#0a0a0b;border-top-color:#ffffff1a}.mobile-split-tabs{border-bottom:1px solid var(--builder-border);background:var(--builder-panel-bg);flex-shrink:0;height:44px;display:flex}.dark .mobile-split-tabs{background:#111112;border-bottom-color:#ffffff14}.mobile-split-tab{cursor:pointer;color:var(--builder-text-muted);text-transform:uppercase;letter-spacing:.04em;touch-action:manipulation;-webkit-tap-highlight-color:transparent;background:0 0;border:none;border-bottom:2px solid #0000;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:2px;font-size:8px;font-weight:600;line-height:1;transition:color .15s,border-color .15s;display:flex}.mobile-split-tab.active{color:var(--builder-accent);border-bottom-color:var(--builder-accent)}.mobile-split-tab:active{opacity:.7}.mobile-split-content{-webkit-overflow-scrolling:touch;overscroll-behavior:contain;touch-action:pan-y;flex:1;overflow:hidden auto}.mobile-split-inner{will-change:transform;height:100%;transition:transform .28s cubic-bezier(.22,1,.36,1)}@keyframes msSlideFromRight{0%{opacity:0;transform:translate(48px)}to{opacity:1;transform:translate(0)}}@keyframes msSlideFromLeft{0%{opacity:0;transform:translate(-48px)}to{opacity:1;transform:translate(0)}}.mobile-slide-from-right{animation:.36s cubic-bezier(.22,1,.36,1) both msSlideFromRight}.mobile-slide-from-left{animation:.36s cubic-bezier(.22,1,.36,1) both msSlideFromLeft}.mobile-split-empty{height:100%;color:var(--builder-text-muted);opacity:.5;flex-direction:column;justify-content:center;align-items:center;gap:8px;font-size:12px;display:flex}.mobile-bottom-nav{z-index:9000;background:var(--builder-bg);border-top:1px solid var(--builder-border);-webkit-backdrop-filter:blur(20px);height:60px;padding:0 4px;padding-bottom:env(safe-area-inset-bottom,0);justify-content:space-around;align-items:center;display:flex;position:fixed;bottom:0;left:0;right:0}.dark .mobile-bottom-nav{background:#09090bf2;border-top-color:#ffffff1a}.mobile-nav-btn{cursor:pointer;min-width:44px;height:100%;color:var(--builder-text-muted);touch-action:manipulation;-webkit-tap-highlight-color:transparent;background:0 0;border:none;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:3px;padding:6px 0;transition:color .15s;display:flex}.mobile-nav-btn.active{color:var(--builder-accent)}.mobile-nav-btn svg{flex-shrink:0;width:20px;height:20px}.mobile-nav-btn span{letter-spacing:.02em;text-transform:uppercase;font-size:9px;font-weight:600;line-height:1}.mobile-nav-btn:active{opacity:.7}.mobile-sheet-overlay{z-index:9100;-webkit-backdrop-filter:blur(2px);background:#0006;animation:.2s sheetFadeIn;position:fixed;inset:0}@keyframes sheetFadeIn{0%{opacity:0}to{opacity:1}}.mobile-sheet{z-index:9200;background:var(--builder-bg);border-top:1px solid var(--builder-border);max-height:92vh;padding-bottom:env(safe-area-inset-bottom,0);border-radius:20px 20px 0 0;flex-direction:column;animation:.3s cubic-bezier(.32,.72,0,1) sheetSlideUp;display:flex;position:fixed;bottom:0;left:0;right:0;overflow:hidden}.dark .mobile-sheet{background:#0a0a0b;border-top-color:#ffffff1a}@keyframes sheetSlideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.mobile-sheet-handle-row{touch-action:none;flex-shrink:0;justify-content:center;align-items:center;padding:10px 16px 6px;display:flex}.mobile-sheet-handle{background:var(--builder-border);border-radius:2px;width:36px;height:4px}.mobile-sheet-title-row{border-bottom:1px solid var(--builder-border);flex-shrink:0;justify-content:space-between;align-items:center;padding:0 16px 10px;display:flex}.mobile-sheet-title{color:var(--builder-text-primary);letter-spacing:-.01em;font-size:14px;font-weight:700}.mobile-sheet-close{cursor:pointer;width:44px;height:44px;color:var(--builder-text-muted);touch-action:manipulation;-webkit-tap-highlight-color:transparent;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;margin:-8px -8px -8px auto;display:flex}.mobile-sheet-close:active{background:var(--builder-panel-bg)}.mobile-sheet-body{-webkit-overflow-scrolling:touch;overscroll-behavior:contain;flex:1;overflow-y:auto}.mobile-sheet.half{height:55vh}.mobile-sheet.tall{height:80vh}.mobile-sheet.full{max-height:92vh}.mobile-selection-bar{left:8px;right:8px;bottom:calc(60px + env(safe-area-inset-bottom,0px) + 8px);z-index:9050;background:var(--builder-bg);border:1px solid var(--builder-border);border-radius:14px;align-items:center;gap:8px;height:52px;padding:0 8px 0 6px;animation:.22s cubic-bezier(.32,.72,0,1) selBarIn;display:flex;position:fixed;box-shadow:0 8px 28px #0000002e}.dark .mobile-selection-bar{background:#0a0a0b;border-color:#ffffff1f;box-shadow:0 8px 28px #00000080}@keyframes selBarIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.mobile-selbar-deselect{background:var(--builder-panel-bg);width:36px;height:36px;color:var(--builder-text-muted);cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;border:none;border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;display:flex}.mobile-selbar-label{flex-direction:column;flex:1;gap:1px;min-width:0;display:flex}.mobile-selbar-title{color:var(--builder-text-primary);white-space:nowrap;text-overflow:ellipsis;font-size:13px;font-weight:600;overflow:hidden}.mobile-selbar-sub{color:var(--builder-text-muted);white-space:nowrap;text-overflow:ellipsis;font-size:11px;overflow:hidden}.mobile-selbar-actions{flex-shrink:0;align-items:center;gap:4px;display:flex}.mobile-selbar-icon{width:38px;height:38px;color:var(--builder-text-secondary);cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;background:0 0;border:none;border-radius:10px;justify-content:center;align-items:center;display:flex}.mobile-selbar-icon:active{background:var(--builder-panel-bg)}.mobile-selbar-edit{background:var(--builder-accent,#111);color:#fff;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;border:none;border-radius:10px;align-items:center;gap:6px;height:38px;padding:0 14px;font-size:13px;font-weight:600;display:flex}.mobile-selbar-edit:active{opacity:.85}.mobile-sel-pill{z-index:9060;background:#1c1c1e;border-radius:20px;align-items:center;gap:2px;height:40px;padding:0 4px 0 10px;animation:.16s ease-out selPillIn;display:flex;position:fixed;box-shadow:0 6px 20px #00000052}@keyframes selPillIn{0%{opacity:0;transform:translateY(4px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}.mobile-sel-pill-label{color:#fff;align-items:center;gap:6px;max-width:120px;font-size:12px;font-weight:600;display:flex}.mobile-sel-pill-text{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.mobile-sel-pill-divider{background:#ffffff2e;flex-shrink:0;width:1px;height:18px;margin:0 4px}.mobile-sel-pill-icon{color:#ffffffd9;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;width:34px;height:34px;display:flex}.mobile-sel-pill-icon:active{background:#ffffff1f}.mobile-sel-pill-edit{color:#1c1c1e;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;background:#fff;border:none;border-radius:16px;align-items:center;gap:5px;height:32px;margin-left:2px;padding:0 14px;font-size:13px;font-weight:600;display:flex}.mobile-sel-pill-edit:active{opacity:.85}@media (max-width:768px){.builder-canvas-wrapper{padding-bottom:calc(60px + env(safe-area-inset-bottom,0px))!important}.builder-root.mobile-panel-open .builder-canvas-wrapper{padding-bottom:0!important}}.mobile-docked-panel{z-index:30;background:var(--builder-bg);border-top:1px solid var(--builder-border);height:50dvh;padding-bottom:env(safe-area-inset-bottom,0);border-radius:16px 16px 0 0;flex-direction:column;flex-shrink:0;display:flex;position:relative;overflow:hidden;box-shadow:0 -6px 24px #0000001f}.dark .mobile-docked-panel{background:#0a0a0b;border-top-color:#ffffff1a}.mobile-docked-handle-row{touch-action:none;cursor:ns-resize;flex-shrink:0;justify-content:center;align-items:center;padding:8px 16px 5px;display:flex}.mobile-docked-handle{background:var(--builder-border);border-radius:3px;width:40px;height:5px}.mobile-docked-title-row{border-bottom:1px solid var(--builder-border);flex-shrink:0;justify-content:space-between;align-items:center;padding:0 12px 8px;display:flex}.mobile-docked-title{color:var(--builder-text-primary);letter-spacing:-.01em;font-size:14px;font-weight:700}.mobile-docked-close{width:40px;height:40px;color:var(--builder-text-muted);cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;margin:-4px -6px -4px auto;display:flex}.mobile-docked-close:active{background:var(--builder-panel-bg)}.mobile-docked-body{-webkit-overflow-scrolling:touch;overscroll-behavior:contain;flex:1;overflow-y:auto}.mobile-docked-body .builder-sidebar-header{display:none}.mobile-docked-body .builder-sidebar-content{padding:8px 12px 14px}.mobile-docked-panel .mobile-docked-title-row{justify-content:flex-start;gap:4px;padding:0 8px 8px}.mobile-docked-panel .mobile-docked-title{white-space:nowrap;text-overflow:ellipsis;flex:1;min-width:0;overflow:hidden}.mobile-docked-header-actions{align-items:center;gap:2px;display:flex}.mobile-docked-panel .mobile-docked-close{margin:-4px -4px -4px 2px}.mobile-dock-act{width:32px;height:32px;color:var(--builder-text-secondary);cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;display:flex}.mobile-dock-act:active{background:var(--builder-panel-bg)}.mobile-dock-act-danger{color:#ef4444}.mobile-dock-act-divider{background:var(--builder-border);flex-shrink:0;width:1px;height:16px;margin:0 2px}.mobile-sheet-body .section,.mobile-docked-body .section{border-radius:12px;margin-bottom:10px}.mobile-sheet-body .section-header,.mobile-docked-body .section-header{min-height:52px;padding:14px}.mobile-sheet-body .section-title,.mobile-docked-body .section-title{font-size:15px}.mobile-sheet-body .section-title-icon,.mobile-sheet-body .section-chevron,.mobile-docked-body .section-title-icon,.mobile-docked-body .section-chevron{width:18px;height:18px}.mobile-sheet-body .section-content,.mobile-docked-body .section-content{padding:10px 14px 16px;max-height:none!important;overflow:visible!important}.mobile-sheet-body .form-input,.mobile-sheet-body .form-select,.mobile-docked-body .form-input,.mobile-docked-body .form-select{border-radius:10px;height:44px;font-size:16px}.mobile-sheet-body .form-select,.mobile-docked-body .form-select{background-position:right 10px center;padding-right:28px;width:100%!important}.mobile-sheet-body .form-label,.mobile-docked-body .form-label{margin-bottom:8px;font-size:13px}.mobile-sheet-body .section-content input,.mobile-sheet-body .section-content select,.mobile-sheet-body .section-content button,.mobile-docked-body .section-content input,.mobile-docked-body .section-content select,.mobile-docked-body .section-content button{touch-action:manipulation}.mobile-sheet-body .toggle-group,.mobile-docked-body .toggle-group{border-radius:12px;gap:4px;padding:4px}.mobile-sheet-body .toggle-btn,.mobile-docked-body .toggle-btn{border-radius:9px;min-height:44px;padding:8px 10px;font-size:13px}.mobile-sheet-body .toggle-btn svg,.mobile-docked-body .toggle-btn svg{width:18px;height:18px}.mobile-sheet-body .chip,.mobile-docked-body .chip{border-radius:10px;align-items:center;min-height:38px;padding:8px 14px;font-size:13px;display:inline-flex}.mobile-sheet-body .chip-group,.mobile-docked-body .chip-group,.mobile-sheet-body .animation-chips,.mobile-docked-body .animation-chips{gap:8px}.mobile-sheet-body .add-elements-grid,.mobile-docked-body .add-elements-grid{gap:10px}.mobile-sheet-body .add-element-btn,.mobile-docked-body .add-element-btn{border-radius:14px;gap:8px;min-height:86px;padding:16px 10px}.mobile-sheet-body .add-element-icon,.mobile-docked-body .add-element-icon{font-size:24px}.mobile-sheet-body .add-element-label,.mobile-docked-body .add-element-label{font-size:12px}.mobile-sheet-body .slider-input,.mobile-docked-body .slider-input{height:6px}.mobile-sheet-body .slider-input::-webkit-slider-thumb{width:22px;height:22px}.mobile-docked-body .slider-input::-webkit-slider-thumb{width:22px;height:22px}.mobile-sheet-body .slider-value,.mobile-docked-body .slider-value{min-width:44px;font-size:13px}.mobile-sheet-body .animation-grid,.mobile-docked-body .animation-grid{gap:10px}.mobile-sheet-body .animation-card,.mobile-docked-body .animation-card{min-height:72px}.mobile-sheet-body .section-content .icon-btn,.mobile-docked-body .section-content .icon-btn{min-width:40px;min-height:40px}.mobile-sheet-body .section-content .form-label,.mobile-docked-body .section-content .form-label{letter-spacing:.04em;font-size:12px}.mobile-sheet-body .unified-input-container button,.mobile-docked-body .unified-input-container button{min-width:34px;height:30px;font-size:12px!important;right:4px!important}.mobile-sheet-body .unified-input-container .form-input,.mobile-docked-body .unified-input-container .form-input{padding-right:42px}.mobile-sheet-body .unified-input-container,.mobile-docked-body .unified-input-container{margin-bottom:2px}.mobile-sheet-body .section-content input[type=checkbox],.mobile-docked-body .section-content input[type=checkbox]{flex-shrink:0;width:18px!important;height:18px!important}.mobile-sheet-body .grid-2,.mobile-docked-body .grid-2{gap:10px}.mobile-sheet-body .section-content [class*=swatch],.mobile-docked-body .section-content [class*=swatch]{min-width:30px;min-height:30px}@media (min-width:769px) and (max-width:1024px){.builder-header{gap:6px;padding:0 8px}.builder-toolbar{gap:4px;padding:0 8px}.builder-sidebar{min-width:220px;max-width:300px}.builder-canvas-wrapper{-webkit-overflow-scrolling:touch}.builder-canvas-frame{width:100%!important;min-width:0!important}.icon-btn{min-width:44px;min-height:44px}[data-element-id]{touch-action:manipulation}.builder-canvas-wrapper,.builder-sidebar-content{-webkit-overflow-scrolling:touch}.resize-handle{touch-action:none;width:6px}.toolbar-select{padding:2px 4px;font-size:11px}}[data-radix-dialog-overlay]{z-index:99998!important}[data-radix-dialog-content]{z-index:99999!important}