@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=Outfit:wght@400;500;600;700;800&display=swap";:root{--bg-color:#f1f5f9;--panel-bg:#fff;--text-main:#0f172a;--text-muted:#64748b;--border-color:#e2e8f0;--primary:#2563eb;--primary-hover:#1d4ed8;--primary-light:#eff6ff;--accent-green:#16a34a;--accent-green-light:#f0fdf4;--radius-sm:6px;--radius-md:10px;--radius-lg:14px;--shadow-sm:0 1px 3px 0 #0000000d;--shadow-md:0 4px 8px -1px #0000000f}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-color);color:var(--text-main);-webkit-font-smoothing:antialiased;font-family:Inter,sans-serif}h1,h2,h3,h4,h5,h6{font-family:Outfit,sans-serif}.app-container{width:100%;height:calc(100vh - 48px);display:flex;position:relative;overflow:hidden}.sidebar-wrapper{background-color:var(--panel-bg);border-right:1px solid var(--border-color);z-index:10;flex-direction:column;height:100%;display:flex;overflow-y:auto;box-shadow:2px 0 10px #00000008}.resizer-handle{cursor:ew-resize;z-index:20;background-color:#0000;flex-shrink:0;justify-content:center;align-items:center;width:8px;height:100%;transition:background-color .2s;display:flex;position:relative}.resizer-handle:hover,.resizer-handle:active{background-color:#2563eb26}.resizer-line{background-color:#cbd5e1;border-radius:2px;width:2px;height:40px;transition:background-color .2s}.resizer-handle:hover .resizer-line,.resizer-handle:active .resizer-line{background-color:var(--primary);height:60px}.main-content{background-color:var(--bg-color);flex-direction:column;flex:1;align-items:center;height:100%;padding:16px;display:flex;overflow:hidden}.editor-panel-inner{background-color:#f8fafc;flex-direction:column;gap:16px;width:100%;padding:20px;display:flex}.panel-header{flex-direction:column;gap:4px;display:flex}.panel-header-badge{color:var(--primary);background-color:var(--primary-light);letter-spacing:.05em;border-radius:20px;align-items:center;gap:6px;width:fit-content;padding:4px 10px;font-size:11px;font-weight:700;display:inline-flex}.panel-header-title{color:var(--text-main);font-size:1.4rem;font-weight:700;line-height:1.2}.panel-header-subtitle{color:var(--text-muted);font-size:.85rem;line-height:1.4}.editor-card{border:1.5px solid var(--border-color);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);background-color:#fff;flex-direction:column;transition:border-color .2s,box-shadow .2s;display:flex;overflow:hidden}.editor-card:hover{border-color:#cbd5e1}.editor-card.download-card{background-color:#fff;border-color:#bfdbfe}.card-header{border-bottom:1px solid var(--border-color);background-color:#f8fafc;align-items:center;gap:10px;padding:12px 16px;display:flex}.card-title{color:var(--text-main);font-family:Outfit,sans-serif;font-size:.925rem;font-weight:700}.card-icon{flex-shrink:0}.card-icon.blue{color:#2563eb}.card-icon.green{color:#16a34a}.card-icon.purple{color:#8b5cf6}.card-icon.amber{color:#d97706}.card-icon.emerald{color:#059669}.card-body{flex-direction:column;gap:16px;padding:16px;display:flex}.download-buttons-group{flex-direction:column;gap:10px;padding:16px;display:flex}.btn-download-primary{border-radius:var(--radius-md);color:#fff;cursor:pointer;background:linear-gradient(135deg,#2563eb,#1d4ed8);border:none;justify-content:center;align-items:center;gap:10px;width:100%;padding:13px 18px;font-family:inherit;font-size:.95rem;font-weight:700;transition:all .2s;display:flex;box-shadow:0 4px 12px #2563eb47}.btn-download-primary:hover{transform:translateY(-1px);box-shadow:0 6px 16px #2563eb61}.btn-download-secondary{border-radius:var(--radius-md);width:100%;color:var(--text-main);cursor:pointer;background-color:#fff;border:1.5px solid #cbd5e1;justify-content:center;align-items:center;gap:8px;padding:11px 16px;font-family:inherit;font-size:.875rem;font-weight:600;transition:all .2s;display:flex}.btn-download-secondary:hover{border-color:var(--primary);color:var(--primary);background-color:var(--primary-light)}.field-group{flex-direction:column;gap:6px;width:100%;display:flex}.field-label{color:var(--text-main);font-size:.825rem;font-weight:600}.modern-input{border:1.5px solid var(--border-color);border-radius:var(--radius-md);width:100%;color:var(--text-main);background-color:#fff;padding:10px 13px;font-family:inherit;font-size:.9rem;transition:all .2s}.modern-input:focus{border-color:var(--primary);outline:none;box-shadow:0 0 0 3px #2563eb1f}.field-grid{gap:12px;width:100%;display:grid}.field-grid.two-cols{grid-template-columns:repeat(2,1fr)}.pill-grid{gap:8px;width:100%;display:grid}.pill-grid.two-cols{grid-template-columns:repeat(2,1fr)}.pill-grid.three-cols{grid-template-columns:repeat(3,1fr)}.pill-btn{border-radius:var(--radius-md);border:1.5px solid var(--border-color);color:var(--text-muted);cursor:pointer;text-align:center;background-color:#fff;padding:9px 10px;font-family:inherit;font-size:.85rem;font-weight:600;transition:all .2s}.pill-btn:hover{color:var(--text-main);border-color:#cbd5e1}.pill-btn.active{border-color:var(--primary);background-color:var(--primary-light);color:var(--primary);box-shadow:0 2px 6px #2563eb1f}.pill-btn.full-width{width:100%}.color-pickers-row{grid-template-columns:repeat(2,1fr);gap:10px;display:grid}.color-picker-box{border:1.5px solid var(--border-color);border-radius:var(--radius-md);background-color:#fff;align-items:center;gap:8px;padding:8px 12px;display:flex}.color-picker-input{cursor:pointer;border:none;border-radius:50%;flex-shrink:0;width:30px;height:30px;padding:0;overflow:hidden}.color-picker-input::-webkit-color-swatch-wrapper{padding:0}.color-picker-input::-webkit-color-swatch{border:1px solid var(--border-color);border-radius:50%}.color-info{flex-direction:column;display:flex}.color-name{color:var(--text-muted);font-size:.72rem;font-weight:600}.color-code{color:var(--text-main);font-family:monospace;font-size:.825rem;font-weight:700}.upload-dropzone{border:2px dashed var(--border-color);border-radius:var(--radius-md);color:var(--text-muted);cursor:pointer;background-color:#f8fafc;justify-content:center;align-items:center;gap:8px;width:100%;padding:12px 14px;font-size:.85rem;font-weight:600;transition:all .2s;display:flex}.upload-dropzone:hover{border-color:var(--primary);color:var(--primary);background-color:var(--primary-light)}.file-input-hidden{display:none}.logo-preview-card{border-radius:var(--radius-md);border:1px solid var(--border-color);background-color:#f8fafc;flex-direction:column;gap:10px;margin-top:4px;padding:10px 12px;display:flex}.logo-preview-row{align-items:center;gap:10px;display:flex}.logo-thumbnail{object-fit:contain;max-width:90px;height:32px}.logo-status{flex:1}.badge-ok{color:var(--accent-green);background-color:var(--accent-green-light);border-radius:12px;align-items:center;gap:4px;padding:2px 7px;font-size:.72rem;font-weight:700;display:inline-flex}.btn-remove-logo{color:#ef4444;cursor:pointer;background:0 0;border:none;border-radius:4px;align-items:center;gap:3px;padding:3px 6px;font-size:.78rem;font-weight:700;transition:background .15s;display:flex}.btn-remove-logo:hover{background-color:#fef2f2}.preset-size-wrapper{flex-direction:column;gap:6px;width:100%;display:flex}.preset-label{color:var(--text-muted);font-size:.75rem;font-weight:600}.preset-grid{gap:5px;width:100%;display:grid}.preset-grid.five-cols{grid-template-columns:repeat(5,1fr)}.preset-btn{border-radius:var(--radius-sm);border:1.5px solid var(--border-color);color:var(--text-main);cursor:pointer;background-color:#fff;padding:7px 3px;font-size:.78rem;font-weight:700;transition:all .15s}.preset-btn:hover{border-color:#cbd5e1}.preset-btn.active{border-color:var(--primary);background-color:var(--primary-light);color:var(--primary)}.slider-row{align-items:center;gap:10px;width:100%;display:flex}.custom-range-slider{cursor:pointer;accent-color:var(--primary);flex:1}.slider-val{color:var(--text-muted);text-align:right;min-width:32px;font-size:.78rem;font-weight:700}.gallery-picker-wrapper{flex-direction:column;gap:6px;width:100%;display:flex}.gallery-picker-title{color:var(--text-muted);font-size:.78rem;font-weight:500}.gallery-thumbnails-grid{border:1px solid var(--border-color);border-radius:var(--radius-md);background-color:#fff;grid-template-columns:repeat(4,1fr);gap:6px;max-height:180px;padding:4px;display:grid;overflow-y:auto}.thumb-card{border-radius:var(--radius-sm);cursor:pointer;background-position:50%;background-size:cover;border:2px solid #0000;height:60px;transition:border-color .15s,transform .15s;position:relative}.thumb-card:hover{transform:scale(1.03)}.thumb-card.selected{border-color:var(--accent-green)}.thumb-card.selected-sec{border-color:var(--primary)}.thumb-active-badge{background-color:var(--accent-green);color:#fff;border-radius:2px;padding:1px 4px;font-size:8.5px;font-weight:800;position:absolute;bottom:2px;left:2px}.thumb-active-badge.blue{background-color:var(--primary)}.gallery-extra-images{flex-direction:column;gap:10px;margin-top:2px;display:flex}.preview-container{flex:1;justify-content:center;align-items:center;width:100%;display:flex;overflow:hidden}.post-canvas{background-color:#fff;flex-shrink:0;position:relative;overflow:hidden;box-shadow:0 10px 30px #0000001f}.ratio-square{width:1080px;height:1080px}.ratio-portrait{width:1080px;height:1350px}.ratio-stories{width:1080px;height:1920px}.post-canvas *{box-sizing:border-box}@media (width<=768px){.app-container{flex-direction:column;height:auto;overflow:auto}.sidebar-wrapper{border-right:none;border-bottom:1px solid var(--border-color);height:auto;width:100%!important}.resizer-handle{display:none!important}.main-content{height:auto;min-height:600px;padding:12px}}