@import"https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap";:root{--main-font: "Poppins", sans-serif;--menu-background: #1A1A1A;--card-background: #1F1F1F;--text-color: rgba(255, 255, 255, .87);--text-color-muted: rgba(255, 255, 255, .6);--text-color-labels: rgba(255, 255, 255, .65);--text-color-headings: rgba(255, 255, 255, .9);--border-color: rgba(255, 255, 255, .12);--accent-color: #669AFF;--accent-color-rgb: 102, 154, 255;--input-background: #2A2A2A;--input-border: #424242;--slider-track-color: #3A3A3A;--slider-thumb-color: #BBBBBB;--card-shadow: 0 6px 16px rgba(0, 0, 0, .35);--error-color: #FF6B6B;--menu-width: 300px;--gap: 20px;--default-banner-bg: #2D2D2D}@keyframes slowAnimatedGradient{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}@keyframes slowAnimatedGradientReverse{0%{background-position:100% 50%}50%{background-position:0% 50%}to{background-position:100% 50%}}body{font-family:var(--main-font);margin:0;background:linear-gradient(135deg,#1f1f22,#2a2a30,#1f1f22,#17171b),linear-gradient(225deg,#1c1e26,#282c34,#1c1e26,#111317),linear-gradient(315deg,#25252b,#17171b,#25252b,#2e2e36),linear-gradient(45deg,#111317,#1c1e26,#111317,#1f1f22);background-size:500% 500%,450% 450%,550% 550%,400% 400%;background-position:0% 50%,100% 50%,25% 75%,75% 25%;animation:slowAnimatedGradient 35s ease-in-out infinite alternate,slowAnimatedGradientReverse 40s ease-in-out infinite alternate,slowAnimatedGradient 45s ease-in-out infinite alternate,slowAnimatedGradientReverse 30s ease-in-out infinite alternate;color:var(--text-color);overflow:hidden;line-height:1.6;font-size:14px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body.is-capturing .editable-canvas [data-block-id],body.is-capturing .editable-canvas .text-block-renderer-class,body.is-capturing .editable-canvas .image-block-renderer-class{border:none!important;padding:0!important}.page-container{display:flex;height:100vh}.black-menu{width:var(--menu-width);background-color:var(--menu-background);color:var(--text-color);padding:20px 25px;position:fixed;top:0;left:0;height:100vh;overflow-y:auto;box-sizing:border-box;z-index:100;border-right:1px solid var(--border-color)}.black-menu h2{margin-top:5px;color:var(--text-color-headings);text-align:center;margin-bottom:25px;font-size:1rem;font-weight:500;text-transform:uppercase;letter-spacing:1.8px}.tabs-nav{display:flex;justify-content:space-around;margin-bottom:20px;padding-bottom:10px;border-bottom:1px solid var(--border-color)}.tab-button{background-color:transparent;color:var(--text-color-muted);border:none;padding:8px 10px;cursor:pointer;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:1.3px;transition:color .2s ease,border-bottom-color .2s ease,opacity .2s ease;border-bottom:2px solid transparent;opacity:.7;margin:0 3px;text-align:center}.tab-button:hover{color:var(--text-color);opacity:1}.tab-button.active{color:var(--text-color);opacity:1;font-weight:700;border-bottom-color:var(--accent-color)}.tab-content{padding-top:15px}.accordion-item{margin-bottom:8px;border-radius:5px;background-color:transparent}.accordion-header{background-color:#ffffff08;color:var(--text-color-muted);padding:10px 15px;width:100%;text-align:left;border:none;border-bottom:1px solid var(--border-color);cursor:pointer;font-size:.8rem;font-weight:500;text-transform:uppercase;letter-spacing:1.3px;transition:background-color .2s ease,color .2s ease;display:flex;justify-content:space-between;align-items:center;border-radius:3px 3px 0 0}.accordion-header:hover{background-color:#ffffff0f;color:var(--text-color)}.accordion-header.active{color:var(--text-color);background-color:rgba(var(--accent-color-rgb),.1);border-bottom-color:rgba(var(--accent-color-rgb),.3)}.accordion-header:after{content:"›";font-size:1.5em;font-weight:700;transition:transform .3s ease;color:var(--text-color-muted);transform:rotate(0)}.accordion-header.active:after{transform:rotate(90deg);color:var(--text-color)}.accordion-content{background-color:transparent;padding:0 15px;max-height:0;overflow:hidden;transition:max-height .35s ease-in-out,padding-top .35s ease-in-out,padding-bottom .35s ease-in-out;border:1px solid var(--border-color);border-top:none;border-radius:0 0 3px 3px}.accordion-content.active{max-height:700px;padding-top:15px;padding-bottom:15px}.setting-group{margin-bottom:16px}.setting-group:last-child{margin-bottom:0}.setting-group label{display:block;margin-bottom:6px;font-weight:500;color:var(--text-color-labels);font-size:.7rem;text-transform:uppercase;letter-spacing:1.3px}.setting-group input[type=number],.setting-group input[type=file],.setting-group input[type=text],.setting-group textarea,.setting-group select{width:100%;padding:8px 10px;border:1px solid var(--input-border);border-radius:3px;background-color:var(--input-background);color:var(--text-color);margin-bottom:5px;box-sizing:border-box;font-size:.8rem;font-family:var(--main-font);transition:border-color .2s ease,box-shadow .2s ease}.setting-group input[type=number]:focus,.setting-group input[type=file]:focus,.setting-group input[type=text]:focus,.setting-group textarea:focus,.setting-group select:focus{outline:none;border-color:var(--accent-color);box-shadow:0 0 0 2px rgba(var(--accent-color-rgb),.25)}.setting-group textarea{min-height:60px;resize:vertical}.setting-group input[type=file]{padding:5px;font-size:.75rem}.setting-group input[type=file]::file-selector-button{padding:6px 10px;margin-right:10px;background-color:var(--slider-track-color);color:var(--text-color-muted);border:none;border-radius:3px;cursor:pointer;transition:background-color .2s}.setting-group input[type=file]::file-selector-button:hover{background-color:var(--input-border);color:var(--text-color)}.setting-group input[type=range]{width:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;height:4px;background:var(--slider-track-color);outline:none;opacity:.8;transition:opacity .2s;border-radius:2px;margin-top:8px;margin-bottom:8px}.setting-group input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:14px;height:14px;border-radius:50%;background:var(--slider-thumb-color);cursor:pointer;box-shadow:none;transition:background-color .2s ease,transform .2s ease}.setting-group input[type=range]::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:var(--slider-thumb-color);cursor:pointer;border:none;box-shadow:none;transition:background-color .2s ease,transform .2s ease}.setting-group input[type=range]::-webkit-slider-thumb:hover,.setting-group input[type=range]::-moz-range-thumb:hover{background:#fff;transform:scale(1.1)}.setting-group span{display:inline-block;margin-left:10px;font-size:.8em;color:var(--text-color-muted);vertical-align:middle}.setting-group input[type=color]{width:100%;height:38px;padding:3px;border:1px solid var(--input-border);border-radius:3px;background-color:var(--input-background);cursor:pointer}.setting-group input[type=color]::-webkit-color-swatch-wrapper{padding:0}.setting-group input[type=color]::-webkit-color-swatch{border:none;border-radius:2px}.banner-preview-area{flex-grow:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--gap) calc(var(--gap) + 10px);padding-left:calc(var(--menu-width) + var(--gap) + 10px);box-sizing:border-box;position:relative;overflow:auto}.banner-preview-area-inner{width:100%;max-width:calc(100vw - var(--menu-width) - (3 * var(--gap)));max-height:calc(100vh - 200px);display:flex;align-items:center;justify-content:center;margin-bottom:var(--gap)}.banner-visual-wrapper{background-image:linear-gradient(45deg,#333 25%,transparent 25%),linear-gradient(-45deg,#333 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#333 75%),linear-gradient(-45deg,transparent 75%,#333 75%);background-size:24px 24px;background-position:0 0,0 12px,12px -12px,-12px 0px;border:1px solid var(--border-color)}.editable-canvas{border:1px solid transparent;color:var(--text-color);box-shadow:0 0 #fff0;transition:border-color .3s ease,box-shadow .3s ease}.editable-canvas.drag-over-active{border-color:var(--accent-color)!important;box-shadow:0 0 15px rgba(var(--accent-color-rgb),.3)!important}.editable-canvas:hover,.editable-canvas.is-editing{border-color:#ffffff40;box-shadow:0 0 12px #ffffff14}.export-settings-card{background-color:var(--card-background);padding:20px 25px;margin-bottom:var(--gap);border-radius:8px;box-shadow:var(--card-shadow);width:100%;max-width:450px;box-sizing:border-box;border:1px solid var(--border-color)}.black-menu .export-settings-card-inner{padding:10px 0 5px}.black-menu .export-settings-card-inner .setting-group{padding-left:15px;padding-right:15px}.export-settings-card h4,.black-menu .accordion-item>.accordion-content .export-settings-card-inner h4{margin-top:0;margin-bottom:18px;color:var(--text-color-headings);font-size:.85rem;font-weight:500;text-transform:uppercase;letter-spacing:1.5px;border-bottom:1px solid var(--border-color);padding-bottom:10px}.export-settings-card .setting-group label,.black-menu .accordion-item .export-settings-card-inner .setting-group label{font-size:.75rem;letter-spacing:1.1px}.export-settings-card .setting-group input[type=checkbox],.black-menu .accordion-item .export-settings-card-inner .setting-group input[type=checkbox]{transform:scale(1);margin-right:8px}.button-group{display:flex;gap:12px;margin-bottom:var(--gap);justify-content:center}.action-buttons-menu{padding:20px 0 10px;border-top:1px solid var(--border-color);margin-top:15px}.action-buttons-menu button{width:100%;margin-bottom:10px}.action-buttons-menu button:last-child{margin-bottom:0}.button-group button,a.button-download,.action-buttons-menu button{padding:9px 18px;border:1px solid transparent;border-radius:5px;cursor:pointer;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:1.3px;transition:all .2s ease;text-decoration:none;display:inline-block;line-height:normal}.button-primary,a.button-download{background-color:var(--text-color);color:var(--background-color);border-color:var(--text-color)}.button-primary:hover,a.button-download:hover{background-color:var(--accent-color);color:var(--text-color);border-color:var(--accent-color);box-shadow:0 2px 8px rgba(var(--accent-color-rgb),.3)}.button-primary:disabled{background-color:#333;color:#666;border-color:#333;cursor:not-allowed;box-shadow:none}.button-secondary{background-color:transparent;color:var(--text-color-muted);border-color:var(--input-border)}.button-secondary:hover{background-color:#ffffff0d;color:var(--text-color);border-color:var(--text-color-muted)}.button-secondary.updated{background-color:var(--accent-color)!important;color:#fff!important;border-color:var(--accent-color)!important}.button-apply-font{background-color:var(--input-background);color:var(--text-color-labels);border:1px solid var(--input-border);padding:8px 12px!important;height:38px!important;text-transform:uppercase;letter-spacing:1.1px;font-size:.7rem;font-weight:600;border-radius:3px}.button-apply-font:hover{background-color:var(--accent-color);color:#fff;border-color:var(--accent-color)}.image-preview-area{text-align:center;margin-top:15px;width:100%;max-width:450px}img.generated-image-preview{max-width:100%;height:auto;border:1px solid var(--border-color);border-radius:5px;margin-bottom:12px;background-color:#222}.github-button{position:fixed;bottom:15px;left:15px;z-index:1001;opacity:.6}.github-button svg{fill:var(--text-color-muted);transition:fill .2s ease}.github-button:hover{opacity:1}.github-button:hover svg{fill:var(--text-color)}.black-menu::-webkit-scrollbar,.added-elements-list-container::-webkit-scrollbar{width:6px}.black-menu::-webkit-scrollbar-track,.added-elements-list-container::-webkit-scrollbar-track{background:#0000001a;border-radius:3px}.black-menu::-webkit-scrollbar-thumb,.added-elements-list-container::-webkit-scrollbar-thumb{background:#383838;border-radius:3px}.black-menu::-webkit-scrollbar-thumb:hover,.added-elements-list-container::-webkit-scrollbar-thumb:hover{background:#4a4a4a}.html-blocks-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:10px;margin-bottom:20px;border-bottom:1px solid var(--border-color);padding-bottom:15px}.draggable-block{background-color:var(--input-background);color:var(--text-color-muted);padding:10px 12px;border-radius:4px;cursor:grab;font-size:.8rem;font-weight:500;text-align:center;transition:background-color .2s ease,transform .1s ease,color .2s ease;border:1px solid var(--input-border);-webkit-user-select:none;user-select:none}.draggable-block:hover{background-color:var(--accent-color);color:#fff;transform:translateY(-2px);border-color:var(--accent-color)}.draggable-block:active{cursor:grabbing;transform:scale(.97)}.added-elements-list-container{max-height:250px;overflow-y:auto;padding-right:5px;margin-top:10px}.added-element-item{background-color:#00000026;padding:12px 15px;margin-bottom:8px;border-radius:4px;border:1px solid var(--input-border);transition:box-shadow .2s ease}.added-element-item:hover{box-shadow:0 0 6px rgba(var(--accent-color-rgb),.2)}.added-element-item h4{margin-top:0;margin-bottom:12px;color:var(--text-color-headings);font-size:.75rem;font-weight:600;display:flex;justify-content:space-between;align-items:center;text-transform:uppercase;letter-spacing:1.1px}.added-element-item .action-buttons{display:flex;gap:8px}.added-element-item .action-buttons button{background-color:transparent;color:var(--text-color-muted);border:none;padding:4px;border-radius:3px;cursor:pointer;font-size:1rem;line-height:1;transition:color .2s ease,transform .2s ease}.added-element-item .action-buttons button:hover{color:var(--text-color);transform:scale(1.1)}.added-element-item .action-buttons button.lock-toggle.active{color:var(--accent-color)}.added-element-item .action-buttons button.remove-block-btn:hover{color:var(--error-color)}.added-element-item .controls{display:grid;grid-template-columns:repeat(auto-fit,minmax(90px,1fr));gap:8px 12px;margin-top:10px}.added-element-item .controls .setting-group{margin-bottom:5px}.added-element-item .controls .setting-group label{font-size:.65rem;margin-bottom:3px}.added-element-item .controls .setting-group input,.added-element-item .controls .setting-group textarea{font-size:.75rem;padding:5px 8px}.added-element-item .controls .setting-group textarea{min-height:40px}.added-element-item .text-format-buttons{display:flex;gap:8px;margin-top:8px;grid-column:1 / -1;justify-content:flex-start}.added-element-item .text-format-buttons button{background-color:var(--input-background);color:var(--text-color-muted);border:1px solid var(--input-border);padding:6px 10px;border-radius:3px;cursor:pointer;font-weight:700;font-size:.8rem;transition:background-color .2s ease,color .2s ease}.added-element-item .text-format-buttons button:hover{background-color:var(--input-border);color:var(--text-color)}.added-element-item .text-format-buttons button.active{background-color:var(--accent-color);color:#fff;border-color:var(--accent-color)}.image-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#000c;display:flex;align-items:center;justify-content:center;z-index:1050;opacity:0;visibility:hidden;transition:opacity .25s ease,visibility 0s linear .25s}.image-modal-overlay.open{opacity:1;visibility:visible;transition-delay:0s;transition:opacity .25s ease}.image-modal-content{background-color:var(--card-background);padding:25px 30px;border-radius:8px;box-shadow:0 8px 25px #00000080;position:relative;max-width:80vw;max-height:85vh;overflow-y:auto;text-align:center;transform:translateY(-20px) scale(.95);transition:transform .25s cubic-bezier(.175,.885,.32,1.275)}.image-modal-overlay.open .image-modal-content{transform:translateY(0) scale(1)}.image-modal-close-btn{position:absolute;top:10px;right:15px;background:none;border:none;color:var(--text-color-muted);font-size:1.8rem;line-height:1;cursor:pointer;transition:color .2s ease,transform .2s ease}.image-modal-close-btn:hover{color:var(--text-color);transform:rotate(90deg) scale(1.1)}.image-modal-content h4{margin-top:0;margin-bottom:20px;color:var(--text-color-headings);font-size:.9rem;font-weight:500;text-transform:uppercase;letter-spacing:1.5px;border-bottom:1px solid var(--border-color);padding-bottom:10px}img.generated-image-in-modal{max-width:100%;max-height:calc(85vh - 150px);height:auto;border:1px solid var(--border-color);border-radius:5px;margin-bottom:20px;display:block;margin-left:auto;margin-right:auto;background-color:#222}.image-modal-actions{display:flex;justify-content:center;gap:15px}@media (max-width: 900px){body{overflow:auto}.page-container{flex-direction:column;height:auto}.black-menu{position:relative;width:100%;height:auto;max-height:none;border-right:none;border-bottom:1px solid var(--border-color);z-index:auto;padding:15px}.black-menu h2{font-size:.9rem;margin-bottom:20px}.tabs-nav{margin-bottom:15px}.tab-button{font-size:.7rem;padding:8px 5px}.accordion-header{font-size:.75rem;padding:10px 12px}.banner-preview-area{padding:var(--gap);min-height:auto;justify-content:flex-start;padding-top:var(--gap)}.banner-preview-area-inner{max-height:50vh;max-width:90vw}.export-settings-card,.image-preview-area,.black-menu .accordion-item>.accordion-content .export-settings-card-inner{max-width:90vw;padding:15px}.export-settings-card h4,.black-menu .accordion-item>.accordion-content .export-settings-card-inner h4{font-size:.8rem}.button-group button,a.button-download,.action-buttons-menu button{font-size:.7rem;padding:8px 15px}.github-button{display:none}}
