.auth-page{display:flex;justify-content:center;align-items:center;min-height:100vh}.form-container{max-width:320px;width:100%;background-color:var(--color-surface);border:var(--border-main);border-radius:var(--border-radius-main);padding:var(--spacing-md) 20px;display:flex;flex-direction:column}.form-title{margin-top:0;font-size:var(--font-size-md);font-weight:var(--font-weight-medium);letter-spacing:var(--letter-spacing-standard);color:var(--color-text-primary);text-align:left;margin-bottom:var(--spacing-sm)}.login-form{display:flex;flex-direction:column;gap:var(--spacing-sm)}.input-label{display:block;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);letter-spacing:var(--letter-spacing-standard);color:var(--color-text-primary);margin-bottom:var(--spacing-xs)}.input-field{width:100%;min-height:32px;padding:0 var(--spacing-xs);border-radius:var(--border-radius-main);border:var(--border-main);font-size:var(--font-size-sm);font-weight:var(--font-weight-regular);letter-spacing:var(--letter-spacing-standard);box-sizing:border-box;transition:border-color .2s ease-in-out}.input-field:focus{outline:none;border-color:var(--color-primary-accent)}.input-field::placeholder{color:var(--color-text-placeholder)}.forgot-password-link{background:none;border:none;padding:0;color:var(--color-primary);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);cursor:pointer;text-align:left;align-self:flex-start}.forgot-password-link:disabled{color:var(--color-disabled);cursor:not-allowed}.top-nav{height:40px;min-height:40px;max-height:40px;background-color:var(--color-surface);border-bottom:var(--border-main);padding:0 16px;display:flex;align-items:center;justify-content:space-between;box-sizing:border-box;position:fixed;top:0;left:0;width:100vw;z-index:200}.brand{display:flex;align-items:center;gap:16px;height:100%}.workspace-link{font-size:var(--font-size-md);font-weight:var(--font-weight-medium);color:var(--color-text-primary);text-decoration:none}.profile{display:flex;align-items:center;gap:4px}.avatar{width:24px;height:24px;border-radius:50%;background-color:var(--color-accent-yellow);display:flex;align-items:center;justify-content:center;font-size:var(--font-size-md);font-weight:var(--font-weight-medium);letter-spacing:var(--letter-spacing-standard);color:var(--color-text-primary);line-height:1}.profile{cursor:pointer}.profile-container{position:relative}.profile-dropdown{position:fixed;top:36px;right:16px;width:160px;background-color:var(--color-surface);box-shadow:var(--shadow-dropdown);border-radius:var(--border-radius-main);z-index:100;padding-top:var(--spacing-xs);padding-bottom:var(--spacing-xs);display:flex;flex-direction:column}.menu-option{display:flex;width:100%;padding-top:var(--spacing-xs);padding-bottom:var(--spacing-xs);padding-left:var(--spacing-sm);padding-right:var(--spacing-sm);text-align:left;font-family:inherit;background:none;border:none;cursor:pointer}.menu-option:hover{background-color:var(--color-hover-bg, #f5f5f5)}.user-info{flex-direction:column;align-items:flex-start;gap:4px;cursor:default}.user-info:hover{background-color:transparent}.username{display:block;width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;font-size:var(--font-size-sm);font-weight:var(--font-weight-regular);color:var(--color-text-primary)}.email{display:block;width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;font-size:var(--font-size-sm);font-weight:var(--font-weight-regular);color:var(--color-text-secondary)}.dropdown-divider{height:1px;background-color:var(--color-border);margin:4px 0}.logout-text{color:var(--color-error);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium)}.saving-rotate-icon{display:flex;align-items:center;animation:saving-rotate 1s linear infinite}@keyframes saving-rotate{to{transform:rotate(360deg)}}.dashboard-content{flex-grow:1;display:flex;align-items:center;justify-content:center;padding:var(--spacing-sm);margin-top:40px}.dashboard-content.has-templates{align-items:flex-start;justify-content:center}.empty-workspace{display:flex;flex-direction:column;align-items:center;gap:16px}.empty-workspace-text{font-family:Inter,sans-serif;font-size:var(--font-size-sm);font-weight:var(--font-weight-regular);color:var(--color-text-primary);margin:0}.login-button{display:inline-flex;align-items:center;gap:4px}.button-icon-wrapper{width:16px;height:16px;display:flex;align-items:center;justify-content:center}.button-text{line-height:var(--line-height-default)}.template-list-container{width:100%;max-width:960px;text-align:left}.template-list-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.template-list-header h2{margin:0}.template-counter{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.limit-reached-text{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin-top:8px}.template-list{width:100%;display:flex;flex-direction:column;gap:8px;margin-top:16px;margin-bottom:16px}.template-row{background-color:var(--color-surface);display:flex;align-items:center;justify-content:space-between;gap:48px;height:40px;padding:0 var(--spacing-sm);border:var(--border-main);border-radius:var(--border-radius-main);cursor:pointer;transition:background-color .2s}.template-row:hover{background-color:var(--color-surface)}.email-name-section{display:flex;align-items:center;gap:8px;min-width:0}.template-icon{width:24px;height:24px;background-color:var(--color-accent-purple);border-radius:4px;flex-shrink:0}.template-name{max-width:400px;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.template-actions{display:flex;align-items:center;gap:48px;flex-shrink:0}.timestamp{font-size:var(--font-size-sm);color:var(--color-text-secondary);white-space:nowrap;text-align:right}.icon-button{display:flex;align-items:center;justify-content:center;background-color:transparent;border:var(--border-main);border-radius:4px;cursor:pointer;padding:4px;transition:background-color .2s}.icon-button:hover{background-color:var(--color-background)}.template-list-header{display:flex;justify-content:space-between;align-items:center;gap:var(--spacing-xs);margin-bottom:16px}.item-count{font-size:var(--font-size-sm);color:var(--color-text-secondary);white-space:nowrap;flex-grow:1}.search-bar{position:relative}.search-icon{position:absolute;left:10px;top:50%;transform:translateY(-50%);pointer-events:none}.search-input{height:32px;min-width:240px;border:var(--border-main);border-radius:var(--border-radius-main);font-size:var(--font-size-sm);width:200px;transition:border-color .2s;padding-left:28px;padding-right:28px}.search-input:focus{outline:none;border-color:var(--color-primary-accent)}.clear-button{position:absolute;right:8px;top:50%;transform:translateY(-50%);background:none;border:none;padding:0;cursor:pointer;display:flex;align-items:center;justify-content:center}.template-row{position:relative}.icon-button.active{border-color:var(--color-primary-accent);background-color:var(--color-surface)}.template-actions-dropdown{position:absolute;top:calc(100% + 4px);right:0;width:200px;background-color:var(--color-surface);box-shadow:var(--shadow-dropdown);border-radius:var(--border-radius-main);z-index:100;display:flex;flex-direction:column;padding:8px 0}.template-actions-dropdown .menu-option{display:flex;width:100%;padding:8px 16px;text-align:left;font-family:inherit;font-size:var(--font-size-sm);background:none;border:none;cursor:pointer}.template-actions-dropdown .menu-option:hover{background-color:var(--color-hover-bg, #f5f5f5)}.template-actions-dropdown .dropdown-divider{height:1px;background-color:var(--color-border);margin:4px 0}.template-actions-dropdown .delete-option{color:var(--color-error);font-weight:var(--font-weight-medium)}.options-container{position:relative}.dashboard-content{scrollbar-width:thin;scrollbar-color:var(--color-scrollbar) var(--color-surface-main, #fff)}.dashboard-content::-webkit-scrollbar{width:8px;background:transparent}.dashboard-content::-webkit-scrollbar-thumb{background:transparent;border-radius:4px}.dashboard-content:hover::-webkit-scrollbar-thumb{background:var(--color-scrollbar)}.overlay{position:fixed;inset:0;background:#00000080;z-index:1000}.overlay{position:fixed;inset:0;background:#00000080;z-index:1000;display:flex;align-items:center;justify-content:center}.modal-root{display:flex;flex-direction:column;gap:0;background:var(--color-surface, #fff);border-radius:var(--border-radius-main, 8px);box-shadow:var(--shadow-dropdown, 0 2px 8px rgba(0,0,0,.06));min-width:400px;max-width:400px;width:400px;max-height:90vh;overflow:auto;position:relative;margin:0;font-family:var(--font-family-main, "Inter", sans-serif)}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:8px 16px;border-bottom:1px solid var(--color-border, #eee);max-height:40px}.modal-title{font-family:var(--font-family-main, "Inter", sans-serif);font-size:var(--font-size-sm, 11px);font-weight:550;color:var(--color-text-primary, #222);letter-spacing:0;margin:0}.modal-close{background:none;border:none;font-size:1.5rem;line-height:1;color:var(--color-text-secondary, #888);cursor:pointer;padding:0 4px;margin-left:12px}.modal-body{width:100%;min-height:100px;padding:16px;font-size:var(--font-size-sm, 1rem);color:var(--color-text-primary, #222);font-family:var(--font-family-main, "Inter", sans-serif);font-weight:450;letter-spacing:0;line-height:var(--line-height-default, 1.5)}.modal-body span{display:inline-block;min-height:32px;line-height:32px;vertical-align:middle}.modal-footer{display:flex;align-items:center;padding:8px 16px;border-top:1px solid var(--color-border, #eee);max-height:40px}.modal-footer-spacer{flex:1}.modal-footer-actions{display:flex;gap:8px}.button-small{height:24px;padding:0 12px;font-size:var(--font-size-sm, .95rem);border-radius:var(--border-radius-main, 4px);border:none;cursor:pointer;font-weight:var(--font-weight-medium, 500);display:inline-flex;align-items:center;justify-content:center;font-family:var(--font-family-main, "Inter", sans-serif)}.button-primary{background:#047195;color:#fff}.button-primary:hover{background:#035a77}.button-secondary{background:#f5f5f5;color:var(--color-text-primary, #333)}.button-secondary:hover{background:var(--color-hover-bg, #f5f5f5)}.modal-close-btn-no-border{border:none!important;background:none!important;box-shadow:none!important}.modal-close-btn-no-border:hover,.icon-only:hover{background:var(--color-hover-bg, #f5f5f5)!important}.modal-close-btn{background:none;border:none;box-shadow:none;border-radius:var(--border-radius-main, 4px);cursor:pointer;padding:0 4px;margin-left:12px;display:inline-flex;align-items:center;justify-content:center;height:24px;width:24px}.modal-close-btn:hover{background:var(--color-hover-bg, #f5f5f5)}.small-btn{width:auto;height:24px;padding:0 8px;font-family:var(--font-family-default);font-size:11px;font-weight:550;line-height:16px;border-radius:var(--border-radius-main);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:4px;transition:background-color .2s ease-in-out,color .2s;box-sizing:border-box}.small-btn.icon-only{width:24px;height:24px;padding:0}.small-btn-primary{background-color:var(--color-primary);color:var(--color-surface);border:none}.small-btn-secondary{background-color:var(--color-surface);color:var(--color-text-primary);border:var(--border-main);box-sizing:border-box}.small-btn-secondary:hover{background:var(--color-hover-bg, #f5f5f5)}.small-btn-selected{border:1px solid var(--color-primary-accent);background:var(--color-surface);color:var(--color-primary-accent);box-shadow:none}.small-btn:disabled{background-color:var(--color-disabled, #d9d9d9);color:var(--color-surface);cursor:not-allowed;opacity:1;box-sizing:border-box}.small-btn.icon-only.modal-close-btn-no-border{border:none!important;background:none!important;box-shadow:none!important}.small-btn-danger{background:var(--color-error);color:#fff;border:none}.small-btn-danger:hover{background:#c9301a}.editor-layout{display:flex;flex-direction:row;width:100vw;height:100vh;padding-top:40px;justify-content:center;align-items:stretch}.elements-panel{width:240px;background-color:var(--color-surface-main, #fff);border-right:var(--border-main);padding:4px 0;flex-shrink:0;box-sizing:border-box;height:100%;display:flex;flex-direction:column;z-index:100}.editor-canvas{flex:1 0 auto;background-color:var(--color-background);min-height:calc(100vh - 40px);overflow:hidden;display:flex;justify-content:center;align-items:stretch;padding:0;margin:0;z-index:1}.panel-header{display:flex;flex-direction:column;gap:var(--spacing-xs);padding:12px 16px;border-bottom:var(--border-main)}.template-name-label{font-family:inherit;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-primary)}.template-name-input-wrapper{position:relative}.template-name-input{width:100%;height:32px;padding:0 var(--spacing-xs);border-radius:var(--border-radius-main);border:var(--border-main);background-color:var(--color-surface);font-size:var(--font-size-sm);font-weight:var(--font-weight-regular);transition:border-color .2s}.template-name-input:focus{outline:none;border-color:var(--color-primary-accent)}.element-row-clickable:hover{background:var(--color-background)}.layer-header{background:var(--color-surface-main, #fff);padding:12px 16px;display:flex;align-items:center;margin:0;line-height:16px}.template-name-editor,.element-panel,.layer-structure{background:transparent}.layer-structure>div[style*=overflow-y]{scrollbar-width:thin;scrollbar-color:var(--color-scrollbar, #bbb) var(--color-surface-main, #fff)}.layer-structure>div[style*=overflow-y]::-webkit-scrollbar{width:8px;background:transparent}.layer-structure>div[style*=overflow-y]::-webkit-scrollbar-thumb{background:transparent;border-radius:4px}.layer-structure:hover>div[style*=overflow-y]::-webkit-scrollbar-thumb{background:var(--color-scrollbar, #bbb)}.layer-header{border-bottom:none;transition:border-bottom .2s}.settings-panel{width:240px;background-color:var(--color-surface-main, #fff);border-left:var(--border-main);padding-top:4px;height:100%;display:flex;flex-direction:column;z-index:100}.settings-panel-content{padding:0 16px;flex:1;display:flex;flex-direction:column}.email-template{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;width:600px;max-width:600px;min-width:600px;flex:1 1 0;min-height:0;background:transparent;position:static;overflow-y:auto;margin-top:16px;margin-bottom:16px;scrollbar-width:thin;scrollbar-color:var(--color-scrollbar, #bbb) var(--color-surface-main, #fff)}.email-template::-webkit-scrollbar{width:8px;background:transparent}.email-template::-webkit-scrollbar-thumb{background:transparent;border-radius:4px}.email-template:hover::-webkit-scrollbar-thumb{background:var(--color-scrollbar, #bbb)}.HeadingElement{width:100%;height:auto;background:var(--color-padding);display:flex;flex-direction:column}.Heading{font-size:36px;width:100%;background:var(--color-surface, #fff);line-height:45px;margin:0;text-align:left;box-sizing:border-box;height:auto}.canvas-empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;width:100%;height:100%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.canvas-empty-text{font-family:inherit;font-size:var(--font-size-sm);font-weight:var(--font-weight-regular, 450);color:var(--color-text-primary)}.elements-heading{display:flex;flex-direction:column;gap:8px;padding:12px 16px}.elements-title{font-size:var(--font-size-sm, 11px);font-weight:var(--font-weight-medium, 550);color:var(--color-text-primary, #222);letter-spacing:.01em;margin:0}.elements-description{font-size:var(--font-size-sm, 11px);color:var(--color-text-secondary, rgba(0,0,0,.5));line-height:1.5;margin:0}.HeadingElement.selected{border:2px solid var(--color-primary-accent);box-sizing:border-box}.HeadingElement.dragging{opacity:.5;box-shadow:0 4px 16px #0000001f;z-index:10}.HeadingElement.layer-hovered{border:2px solid #FFE0FC;box-sizing:border-box}.HeadingElement:hover{border:2px solid var(--color-primary-accent)}body.preview-active .HeadingElement:hover,.preview-active .HeadingElement:hover{border:none!important}.edit-area{min-width:600px;margin-left:20px;margin-right:20px;flex:1 1 0;overflow-y:auto;display:flex;flex-direction:column;align-items:center;justify-content:flex-start}.element-row-container{padding:8px 16px;box-sizing:border-box;width:100%}.element-row-clickable{display:flex;max-height:32px;align-items:center;padding:4px 8px;border-radius:var(--border-radius-main);border:var(--border-main);cursor:pointer;background:var(--color-surface);gap:8px;transition:background .15s}.element-row-clickable:hover{background:var(--color-hover-bg, #f5f5f5)}.element-row-icon{display:flex;align-items:center}.element-row-text{font-size:var(--font-size-sm);color:var(--color-text-primary);font-weight:var(--font-weight-medium)}.layer-info-row-container{width:100%;box-sizing:border-box}.layer-info-row{display:flex;align-items:center;padding:4px;border-radius:var(--border-radius-main);border:none;cursor:pointer;background:var(--color-surface);gap:8px;transition:background .15s}.layer-info-row:hover{background:var(--color-hover-bg, #f5f5f5)}.layer-info-row.selected{background:#e5f4ff!important}.layer-info-row.layer-hovered{background:#f5f5f5}.layer-info-row-icon{display:flex;align-items:center}.layer-info-row-text{font-size:var(--font-size-sm);color:var(--color-text-primary);font-weight:var(--font-weight-medium)}.layer-header{background:#fff;padding:12px 16px;display:flex;align-items:center;margin:0;line-height:16px}.layer-header span{margin:0;line-height:16px}.layer-structure{display:flex;flex-direction:column;gap:0;padding-bottom:8px;height:100%;background:var(--color-surface-main, #fff)}.layer-header{padding:12px 16px;background:var(--color-surface-main, #fff);position:sticky;top:0;z-index:10;border-bottom:none;transition:border-bottom .2s}.layer-header-text{font-family:inherit;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-primary);margin:0;line-height:16px}.layer-scroll-container{flex:1;overflow-y:auto;background:var(--color-surface-main, #fff);padding-bottom:24px}.layer{padding:4px 16px}.layer-bottom-spacer{min-height:24px}.layer-header.scrolled{border-bottom:var(--border-main)}.layer-scroll-container{scrollbar-width:thin;scrollbar-color:var(--color-scrollbar, #bbb) var(--color-surface-main, #fff)}.layer-scroll-container::-webkit-scrollbar{width:8px;background:transparent}.layer-scroll-container::-webkit-scrollbar-thumb{background:transparent;border-radius:4px}.layer-structure:hover .layer-scroll-container::-webkit-scrollbar-thumb{background:var(--color-scrollbar, #bbb)}.layer.selected{background:var(--color-text-selection-bg)}.settings-panel{width:240px;background-color:var(--color-surface-main, #fff);border-left:var(--border-main);padding-top:4px;height:100%;display:flex;flex-direction:column;z-index:100;justify-content:space-between;box-sizing:border-box}.settings-panel-content{padding:0;flex:unset;display:unset;flex-direction:unset}.settings-panel-title{font-size:var(--font-size-md);font-weight:var(--font-weight-medium);color:var(--color-text-primary);margin-bottom:16px;margin-top:0}.settings-panel-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:var(--border-main);background:transparent}.settings-panel-header-title{font-family:inherit;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-primary)}.settings-panel-share-btn{min-width:64px;padding:4px var(--spacing-xs);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);border-radius:var(--border-radius-main);margin-left:12px;background:none;border:none}.small-primary-btn{padding:4px 8px;border:none;background-color:var(--color-primary);color:var(--color-text-on-primary);font-family:var(--font-family-default);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);border-radius:var(--border-radius-main);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:4px;transition:background-color .2s ease-in-out}.small-primary-btn:disabled{background-color:var(--color-disabled);cursor:not-allowed}.general-settings-row{display:flex;flex-direction:row;align-items:center;justify-content:space-between;padding:12px 16px;gap:auto;max-height:40px;height:40px;box-sizing:border-box}.general-settings-title{font-family:inherit;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-primary)}.preview-row{display:flex;flex-direction:row;align-items:center;justify-content:space-between;height:40px;padding:12px 16px;border-top:var(--border-main);box-sizing:border-box}.preview-label{font-family:inherit;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-primary)}.preview-switch{width:32px;height:16px;background:var(--color-disabled);border-radius:16px;position:relative;border:none;outline:none;display:flex;align-items:center;transition:background .2s;box-sizing:border-box;padding:0}.preview-switch[disabled],.preview-switch[data-disabled]{opacity:1;cursor:not-allowed}.preview-switch .radix-switch-thumb,.preview-switch [data-radix-switch-thumb]{width:14px;height:14px;background:#fff;border-radius:50%;position:absolute;left:1px;top:1px;box-shadow:none;transition:left .2s}.preview-switch[data-state=checked]{background:var(--color-primary)}.preview-switch[data-state=checked] .radix-switch-thumb{left:17px}.settings-panel>*{width:239px;box-sizing:border-box;margin:0 auto}.general-settings-row,.preview-row,.alignment-row,.settings-panel-content{width:239px;box-sizing:border-box;margin:0 auto}.alignment-row{border-bottom:var(--border-main)}.font-component{padding:8px 16px;display:flex;flex-direction:column;gap:8px}.template-title{font-size:var(--template-title-font-size, 16px);font-weight:var(--template-title-font-weight, 600);color:var(--template-title-color, #222)}.font-component .disabled{opacity:.3;pointer-events:none}:root{--dropdown-font-size: 11px;--dropdown-font-weight: 450;--dropdown-line-height: 16px}.dropdown-root{display:flex;align-items:center;justify-content:space-between;padding:8px;border:1px solid var(--border-color, #ddd);border-radius:4px;background:var(--input-bg, #fff);width:100%;max-height:32px}.dropdown-value{font-size:var(--dropdown-font-size, 11px);font-weight:var(--dropdown-font-weight, 450);color:var(--color-text-primary, #222);line-height:var(--dropdown-line-height, 16px);flex:1;min-width:0}.dropdown-icon{display:flex;align-items:center;margin-left:8px}.dropdown-open{border-color:var(--color-primary-accent, #7B61FF);background:var(--color-surface, #f7f7fa)}.dropdown-menu{position:absolute;top:calc(100% + 4px);left:0;width:160px;background:var(--color-surface, #fff);box-shadow:var(--shadow-dropdown, 0 2px 8px rgba(0,0,0,.06));border-radius:var(--border-radius-main, 8px);z-index:10;padding-top:var(--spacing-xs, 4px);padding-bottom:var(--spacing-xs, 4px);border:1px solid var(--border-color, #ddd);display:flex;flex-direction:column}.dropdown-menu-option{display:flex;width:100%;padding-top:var(--spacing-xs, 4px);padding-bottom:var(--spacing-xs, 4px);padding-left:var(--spacing-sm, 16px);padding-right:var(--spacing-sm, 16px);text-align:left;font-family:inherit;background:none;border:none;cursor:pointer;font-size:var(--dropdown-font-size, 11px);font-weight:var(--dropdown-font-weight, 450);color:var(--color-text-primary, #222);line-height:var(--dropdown-line-height, 16px)}.dropdown-menu-option:hover{background:var(--color-hover-bg, #f5f5f5)}.dropdown-menu-option.selected{background:#0d99ff;color:var(--color-text-on-primary, #fff)}.dropdown-menu-option:focus{outline:none;border:1px solid var(--color-primary-accent, #7B61FF);border-radius:var(--border-radius-main, 8px);background:var(--color-hover-bg, #f5f5f5)}.dropdown-root:focus{outline:none;border:1px solid var(--color-primary-accent, #7B61FF);border-radius:var(--border-radius-main, 8px);background:var(--color-surface, #f7f7fa)}.font-size-component{padding:8px 16px;display:flex;flex-direction:column;gap:8px}.font-size-component .disabled{opacity:.3;pointer-events:none}.color-picker-component{padding:8px 16px;display:flex;flex-direction:column;gap:8px}.color-picker-input-row{width:100%;display:flex;align-items:center;gap:4px}.color-picker-preview{width:16px;height:16px;border-radius:4px;border:1px solid var(--color-border);box-sizing:border-box;background:#fff}.color-picker-hex-input{width:100%;height:32px;padding:0 var(--spacing-xs);border-radius:var(--border-radius-main);border:var(--border-main);background-color:var(--color-surface);font-size:var(--font-size-sm);font-weight:var(--font-weight-regular);color:var(--color-text-primary);transition:border-color .2s;box-sizing:border-box;padding-left:28px}.color-picker-hex-input:focus{outline:none;border-color:var(--color-primary-accent)}.color-input-wrapper{position:relative;width:100%;display:flex;align-items:center}.color-picker-preview{position:absolute;left:8px;top:50%;transform:translateY(-50%);width:16px;height:16px;border-radius:4px;border:1px solid var(--color-border);box-sizing:border-box;background:#fff;pointer-events:none}.color-picker-area-wrapper{width:208px;height:auto;display:flex;flex-direction:column;gap:8px;border-radius:var(--border-radius-main);overflow:hidden}.color-picker-area-wrapper .sketch-picker{width:208px!important;height:124px!important;box-shadow:none!important;border-radius:var(--border-radius-main)!important;overflow:hidden!important;padding:0!important}.color-picker-area-wrapper .sketch-picker>.flexbox-fix{display:none!important}.color-picker-area-wrapper .sketch-picker>div:last-child{display:none!important}.color-picker-area-wrapper .sketch-picker>div:first-child{width:100%!important;height:124px!important;padding-bottom:0!important;min-height:0!important;max-height:124px!important}.color-picker-area-wrapper,.color-picker-area-wrapper *{user-select:none;-webkit-user-select:none;-ms-user-select:none}.custom-hue-slider{width:100%;height:12px;border-radius:6px;background:linear-gradient(to right,red,#ff0 17%,#0f0 33%,#0ff,#00f 67%,#f0f 83%,red);position:relative;cursor:pointer}.hue-slider-thumb{position:absolute;top:50%;transform:translateY(-50%);width:12px;height:12px;border-radius:50%;background:transparent;border:3px solid #fff;box-shadow:0 1px 4px #0000001f;pointer-events:none}.color-picker-area-wrapper .sketch-picker [style*="width: 4px"][style*="height: 4px"]{width:12px!important;height:12px!important;border-radius:50%!important;border:3px solid #fff!important;background:transparent!important;box-shadow:none!important;transform:translate(-6px,-6px)!important}.brand-color-info-text{color:var(--color-text-secondary, rgba(0,0,0,.5));font-size:var(--font-size-sm)}.color-input-wrapper.disabled{opacity:.3;pointer-events:none}.actions-panel{display:flex;flex-direction:row;gap:12px;padding:0 12px;height:40px;background:#fff;box-shadow:0 4px 16px #00000014,0 1.5px 4px #0000000a;border-radius:var(--border-radius-main);align-items:center;justify-content:center;width:auto;box-sizing:border-box;z-index:200;position:fixed;left:50%;bottom:16px;transform:translate(-50%);margin:0}.actions-panel.actions-panel-vertical{flex-direction:row;align-items:center;justify-content:center;height:40px;right:unset;top:unset;left:50%;bottom:16px;transform:translate(-50%)}.icon-button{width:24px;height:24px;display:flex;align-items:center;justify-content:center;background-color:transparent;border:var(--border-main);border-radius:var(--border-radius-main);cursor:pointer;padding:0;box-sizing:border-box;transition:background-color .2s}.icon-button:hover{background-color:var(--color-hover-bg, #f5f5f5)}.icon-button:focus{outline:none;border:1px solid var(--color-primary-accent, #7B61FF);border-radius:var(--border-radius-main, 8px);background:var(--color-hover-bg, #f5f5f5)}.icon-button svg{width:16px;height:16px}.divider{width:1px;align-self:stretch;background-color:var(--color-border)}.color-component{padding:8px 16px;display:flex;flex-direction:column;gap:8px}.color-input-row{display:flex;align-items:center;gap:8px}.color-preview{width:16px;height:16px;border-radius:4px;border:1px solid var(--color-border);box-sizing:border-box}.color-hex-input{font-size:11px;font-weight:450;color:var(--color-text-primary, #222);line-height:16px;border:1px solid var(--color-border);border-radius:4px;padding:4px 8px;width:80px;background:var(--input-bg, #fff)}.color-picker-wrapper{margin-top:8px;width:208px;height:104px}.error-notification{position:fixed;bottom:24px;left:50%;display:flex;align-items:center;gap:4px;width:auto;background-color:var(--color-error);color:var(--color-text-on-primary);padding:var(--toast-padding-y) var(--toast-padding-x);border-radius:var(--border-radius-main);font-weight:var(--font-weight-medium);z-index:1000;box-shadow:var(--shadow-dropdown)}.error-message{margin:0;font-size:var(--font-size-sm)}.warning-notification{position:fixed;bottom:24px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:8px;width:auto;padding:var(--toast-padding-y) var(--toast-padding-x);border-radius:var(--border-radius-main);box-shadow:var(--shadow-dropdown);font-weight:var(--font-weight-medium);z-index:1000;background-color:var(--color-accent-yellow);color:var(--color-text-primary)}.warning-notification .toast-message{margin:0;font-size:var(--font-size-sm)}*,*:before,*:after{box-sizing:border-box}:root{--font-family-default: "Inter", sans-serif;--font-size-sm: 11px;--font-size-md: 13px;--font-weight-regular: 450;--font-weight-medium: 550;--letter-spacing-standard: .005em;--line-height-default: 16px;--color-background: #f5f5f5;--color-surface: #ffffff;--color-primary: #047195;--color-primary-accent: #0D99FF;--color-text-selection-bg: rgba(13, 153, 255, .4);--color-disabled: #d9d9d9;--color-error: #F24822;--color-accent-yellow: #FFCD29;--color-accent-purple: #B4B2FF;--color-text-primary: rgba(0, 0, 0, .9);--color-text-secondary: rgba(0, 0, 0, .5);--color-text-placeholder: rgba(0, 0, 0, .4);--color-text-on-primary: #ffffff;--color-border: rgba(0, 0, 0, .1);--color-padding: #FFE0FC;--color-hover-bg: #f5f5f5;--spacing-unit: 8px;--spacing-xs: calc(var(--spacing-unit) * 1);--spacing-sm: calc(var(--spacing-unit) * 2);--spacing-md: calc(var(--spacing-unit) * 3);--toast-padding-y: 12px;--toast-padding-x: 16px;--border-radius-main: 4px;--border-main: 1px solid var(--color-border);--shadow-dropdown: 0 0 .5px rgba(0, 0, 0, .12), 0 10px 16px rgba(0, 0, 0, .12), 0 2px 5px rgba(0, 0, 0, .15)}body{margin:0;font-family:var(--font-family-default);line-height:var(--line-height-default);background-color:var(--color-background);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}button,input,textarea,select{font-family:inherit;line-height:16px;padding:4px var(--spacing-xs)}body [data-sonner-toast][data-type=error]{left:50%;transform:translate(-50%);padding:var(--toast-padding-y) var(--toast-padding-x);width:auto;background-color:var(--color-error);color:var(--color-text-on-primary);border-radius:var(--border-radius-main);border:none}body [data-sonner-toast][data-type=error] [data-icon]{color:var(--color-text-on-primary)}.button-primary{background-color:var(--color-primary);color:var(--color-text-on-primary);min-height:32px;padding:4px 12px;border:none;border-radius:var(--border-radius-main);font-weight:var(--font-weight-medium);font-size:var(--font-size-sm);line-height:var(--line-height-default);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:4px;width:auto;transition:background-color .2s ease-in-out}.button-primary:disabled{background-color:var(--color-disabled);cursor:not-allowed}.full-width{width:100%}.dashboard-layout{display:flex;flex-direction:column;height:100vh;background-color:var(--color-background)}::selection{background-color:var(--color-text-selection-bg)}
