:root{--primary-color:#6366f1;--primary-light:#a5b4fc;--primary-dark:#4338ca;--success-color:#10b981;--danger-color:#ef4444;--warning-color:#f59e0b;--gray-50:#f9fafb;--gray-100:#f3f4f6;--gray-200:#e5e7eb;--gray-300:#d1d5db;--gray-400:#9ca3af;--gray-500:#6b7280;--gray-600:#4b5563;--gray-700:#374151;--gray-800:#1f2937;--gray-900:#111827;--border-radius:12px;--border-radius-sm:6px;--shadow-sm:0 1px 3px rgba(0,0,0,.1);--shadow-md:0 4px 12px rgba(0,0,0,.1);--shadow-lg:0 10px 25px rgba(0,0,0,.15);--gradient-primary:linear-gradient(135deg,#667eea,#764ba2);--gradient-secondary:linear-gradient(135deg,#f093fb,#f5576c);--transition:all .2s cubic-bezier(.4,0,.2,1)}.modern-card{background:#fff;border:1px solid var(--gray-100);border-radius:var(--border-radius);box-shadow:var(--shadow-md);transition:var(--transition)}.modern-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}.modern-button{border:none;border-radius:var(--border-radius-sm);cursor:pointer;font-size:.875rem;font-weight:600;overflow:hidden;padding:10px 20px;position:relative;transition:var(--transition)}.modern-button:before{background:linear-gradient(90deg,transparent,hsla(0,0%,100%,.2),transparent);content:"";height:100%;left:-100%;position:absolute;top:0;transition:left .5s;width:100%}.modern-button:hover:before{left:100%}.btn-primary{background:var(--gradient-primary);color:#fff}.btn-primary:hover{box-shadow:0 8px 20px #667eea4d;transform:translateY(-2px)}.btn-secondary{background:var(--gray-100);border:1px solid var(--gray-200);color:var(--gray-700)}.btn-secondary:hover{background:var(--gray-200);transform:translateY(-1px)}.btn-danger{background:var(--danger-color);color:#fff}.btn-danger:hover{background:#dc2626;transform:translateY(-1px)}.btn-success{background:var(--success-color);color:#fff}.btn-success:hover{background:#059669;transform:translateY(-1px)}.modern-input{background:#fff;border:2px solid var(--gray-200);border-radius:var(--border-radius-sm);font-size:.875rem;padding:10px 14px;transition:var(--transition)}.modern-input:focus{border-color:var(--primary-color);box-shadow:0 0 0 3px #6366f11a;outline:none}.modern-select{background:#fff;border:2px solid var(--gray-200);border-radius:var(--border-radius-sm);cursor:pointer;font-size:.875rem;padding:10px 14px;transition:var(--transition)}.modern-select:focus{border-color:var(--primary-color);box-shadow:0 0 0 3px #6366f11a;outline:none}.custom-scrollbar::-webkit-scrollbar{height:8px;width:8px}.custom-scrollbar::-webkit-scrollbar-track{background:var(--gray-100);border-radius:4px}.custom-scrollbar::-webkit-scrollbar-thumb{background:var(--gray-300);border-radius:4px;-webkit-transition:var(--transition);transition:var(--transition)}.custom-scrollbar::-webkit-scrollbar-thumb:hover{background:var(--gray-400)}.modern-tabs{background:var(--gray-50);border:1px solid var(--gray-200);border-radius:var(--border-radius);display:flex;gap:4px;padding:4px}.modern-tab{background:transparent;border:none;border-radius:var(--border-radius-sm);color:var(--gray-600);cursor:pointer;font-size:.875rem;font-weight:500;padding:12px 16px;position:relative;transition:var(--transition);white-space:nowrap}.modern-tab:hover{background:#fff;color:var(--gray-700)}.modern-tab.active{background:#fff;box-shadow:var(--shadow-sm);color:var(--primary-color);font-weight:600}.modern-tab.active:after{background:var(--primary-color);border-radius:1px;bottom:-2px;content:"";height:2px;left:50%;position:absolute;transform:translate(-50%);width:20px}.gradient-preview{border:3px solid transparent;border-radius:var(--border-radius-sm);cursor:pointer;height:48px;overflow:hidden;position:relative;transition:var(--transition);width:100%}.gradient-preview:before{background:inherit;bottom:0;content:"";filter:brightness(1.1);left:0;opacity:0;position:absolute;right:0;top:0;transition:var(--transition)}.gradient-preview:hover:before{opacity:1}.gradient-preview:hover{box-shadow:var(--shadow-md);transform:scale(1.05)}.gradient-preview.selected{border-color:var(--primary-color);box-shadow:0 0 0 4px #6366f133;transform:scale(1.02)}.color-palette{align-items:center;display:flex;flex-wrap:wrap;gap:8px}.color-swatch{border:3px solid #fff;border-radius:50%;box-shadow:0 2px 4px #0000001a;cursor:pointer;height:32px;position:relative;transition:var(--transition);width:32px}.color-swatch:hover{transform:scale(1.1)}.color-swatch.selected{box-shadow:0 0 0 3px var(--primary-color)}.color-swatch.selected:after{color:#fff;content:"✓";font-size:14px;font-weight:700;left:50%;position:absolute;text-shadow:1px 1px 2px rgba(0,0,0,.5);top:50%;transform:translate(-50%,-50%)}.control-group{background:#fff;border:1px solid var(--gray-100);border-radius:var(--border-radius);box-shadow:var(--shadow-md);margin-bottom:16px;padding:20px}.control-group h3{align-items:center;color:var(--gray-800);display:flex;font-size:1.125rem;font-weight:700;gap:8px;margin-bottom:16px}.control-group h3:before{background:var(--gradient-primary);border-radius:2px;content:"";height:20px;width:4px}.modern-range{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--gray-200);border-radius:3px;height:6px;outline:none;transition:var(--transition);width:100%}.modern-range::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--primary-color);border-radius:50%;box-shadow:0 2px 4px #0003;cursor:pointer;height:20px;-webkit-transition:var(--transition);transition:var(--transition);width:20px}.modern-range::-webkit-slider-thumb:hover{box-shadow:0 4px 8px #0000004d;transform:scale(1.1)}.modern-range::-moz-range-thumb{background:var(--primary-color);border:none;border-radius:50%;box-shadow:0 2px 4px #0003;cursor:pointer;height:20px;width:20px}.preview-container{background:var(--gray-50);border:1px solid var(--gray-200);border-radius:var(--border-radius);overflow:hidden;padding:20px;position:relative}.preview-container:before{background:var(--gradient-primary);content:"";height:4px;left:0;position:absolute;right:0;top:0}.zoom-indicator{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#000c;border-radius:var(--border-radius-sm);color:#fff;font-size:.75rem;font-weight:600;left:16px;padding:8px 12px;position:absolute;top:16px;z-index:10}.tooltip{position:relative}.tooltip:after{background:var(--gray-800);border-radius:var(--border-radius-sm);bottom:125%;box-shadow:var(--shadow-md);color:#fff;content:attr(data-tooltip);font-size:.75rem;padding:8px 12px;white-space:nowrap;z-index:1000}.tooltip:after,.tooltip:before{left:50%;opacity:0;position:absolute;transform:translate(-50%);transition:var(--transition);visibility:hidden}.tooltip:before{border:4px solid transparent;border-top:4px solid var(--gray-800);bottom:118%;content:""}.tooltip:hover:after,.tooltip:hover:before{opacity:1;visibility:visible}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.fade-in-up{animation:fadeInUp .3s ease-out}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.pulse{animation:pulse 2s infinite}@media (max-width:768px){.modern-card{border-radius:var(--border-radius-sm);margin:8px}.modern-button{font-size:.8rem;padding:8px 16px}.control-group{padding:16px}.modern-tabs{overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}.modern-tabs::-webkit-scrollbar{display:none}}.app-container[data-v-6a01135c]{background:linear-gradient(135deg,#667eea,#764ba2);display:flex;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;gap:24px;min-height:100vh;padding:20px}.preview-section[data-v-6a01135c]{display:flex;flex:1;flex-direction:column;gap:16px}.modern-card[data-v-6a01135c]{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fffffff2;border:1px solid hsla(0,0%,100%,.2);border-radius:16px;box-shadow:0 8px 32px #0000001a;padding:24px}.fade-in-up[data-v-6a01135c]{animation:fadeInUp-6a01135c .6s ease-out}@keyframes fadeInUp-6a01135c{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.preview-header[data-v-6a01135c]{justify-content:space-between;margin-bottom:20px}.preview-header[data-v-6a01135c],.preview-title[data-v-6a01135c]{align-items:center;display:flex}.preview-title[data-v-6a01135c]{color:#1f2937;font-size:1.25rem;font-weight:600;gap:12px;margin:0}.preview-icon[data-v-6a01135c]{font-size:1.5rem}.preview-controls[data-v-6a01135c]{gap:16px}.grid-toggle[data-v-6a01135c],.preview-controls[data-v-6a01135c]{align-items:center;display:flex}.grid-toggle[data-v-6a01135c]{gap:8px}.grid-toggle[data-v-6a01135c],.size-info[data-v-6a01135c]{color:#6b7280;font-size:.875rem}.size-info[data-v-6a01135c]{font-weight:500}.canvas-container[data-v-6a01135c]{align-items:center;background:#f8fafc;border:2px dashed #e2e8f0;border-radius:12px;display:flex;justify-content:center;min-height:400px;overflow:auto;padding:20px;position:relative}.custom-scrollbar[data-v-6a01135c]::-webkit-scrollbar{height:8px;width:8px}.custom-scrollbar[data-v-6a01135c]::-webkit-scrollbar-track{background:#f1f5f9;border-radius:4px}.custom-scrollbar[data-v-6a01135c]::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:4px}.custom-scrollbar[data-v-6a01135c]::-webkit-scrollbar-thumb:hover{background:#94a3b8}.zoom-indicator[data-v-6a01135c]{background:#000000b3;border-radius:6px;color:#fff;font-size:.75rem;padding:4px 8px;position:absolute;right:10px;top:10px;width:-moz-max-content;width:max-content;z-index:10}.main-canvas[data-v-6a01135c]{background:#fff;border:1px solid #e2e8f0;border-radius:8px;box-shadow:0 4px 6px -1px #0000001a;cursor:grab}.main-canvas[data-v-6a01135c]:active{cursor:grabbing}.zoom-controls[data-v-6a01135c]{background:#f8fafccc;border:1px solid #e2e8f0;border-radius:12px;gap:16px;justify-content:space-between;padding:16px}.zoom-controls[data-v-6a01135c],.zoom-slider[data-v-6a01135c]{align-items:center;display:flex}.zoom-slider[data-v-6a01135c]{flex:1;gap:12px}.zoom-slider label[data-v-6a01135c]{color:#374151;font-size:.875rem;font-weight:500;min-width:80px}.modern-range[data-v-6a01135c]{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#e2e8f0;border-radius:3px;flex:1;height:6px;outline:none}.modern-range[data-v-6a01135c]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#3b82f6;border-radius:50%;box-shadow:0 2px 4px #0003;cursor:pointer;height:18px;width:18px}.modern-range[data-v-6a01135c]::-moz-range-thumb{background:#3b82f6;border:none;border-radius:50%;box-shadow:0 2px 4px #0003;cursor:pointer;height:18px;width:18px}.auto-fit-label[data-v-6a01135c],.zoom-value[data-v-6a01135c]{color:#6b7280;font-size:.875rem;font-weight:500;min-width:50px;text-align:right}.auto-fit-label[data-v-6a01135c]{color:#059669;font-style:italic}.zoom-buttons[data-v-6a01135c]{display:flex;gap:8px}.controls-section[data-v-6a01135c]{flex-shrink:0;width:400px}.modern-tabs[data-v-6a01135c]{background:#ffffff1a;border-radius:12px;display:grid;gap:4px;grid-template-columns:repeat(3,1fr);margin-bottom:20px;padding:6px}.modern-tab[data-v-6a01135c]{align-items:center;background:transparent;border:none;border-radius:8px;color:#ffffffb3;cursor:pointer;display:flex;flex-direction:column;font-size:.75rem;font-weight:500;gap:4px;padding:12px 8px;transition:all .2s ease}.modern-tab[data-v-6a01135c]:hover{background:#ffffff1a;color:#ffffffe6}.modern-tab.active[data-v-6a01135c]{background:#fffffff2;box-shadow:0 2px 4px #0000001a;color:#1f2937}.tab-icon[data-v-6a01135c]{font-size:1.25rem}.tab-label[data-v-6a01135c]{white-space:nowrap}.tab-content[data-v-6a01135c]{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fffffff2;border:1px solid hsla(0,0%,100%,.2);border-radius:16px;box-shadow:0 8px 32px #0000001a;max-height:70vh;overflow-y:auto;padding:24px}.control-group[data-v-6a01135c]{margin-bottom:24px}.control-group[data-v-6a01135c]:last-child{margin-bottom:0}.control-title[data-v-6a01135c]{color:#1f2937;font-size:1.125rem;font-weight:600;gap:8px;margin:0 0 16px}.control-title[data-v-6a01135c],.group-header[data-v-6a01135c]{align-items:center;display:flex}.group-header[data-v-6a01135c]{justify-content:space-between;margin-bottom:16px}.control-row[data-v-6a01135c],.form-row[data-v-6a01135c]{align-items:center;display:flex;gap:12px;margin-bottom:12px}.form-row label[data-v-6a01135c]{color:#374151;font-size:.875rem;font-weight:500;min-width:80px}.modern-input[data-v-6a01135c],.modern-select[data-v-6a01135c]{background:#fff;border:1px solid #d1d5db;border-radius:8px;flex:1;font-size:.875rem;padding:8px 12px;transition:all .2s ease}.modern-input[data-v-6a01135c]:focus,.modern-select[data-v-6a01135c]:focus{border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a;outline:none}.modern-input.small[data-v-6a01135c],.modern-select.small[data-v-6a01135c]{flex:none;width:80px}.dimensions-row[data-v-6a01135c]{display:flex;gap:16px;margin-bottom:16px}.dimension-input[data-v-6a01135c]{align-items:center;display:flex;flex:1;gap:8px}.dimension-input label[data-v-6a01135c]{color:#374151;font-size:.875rem;font-weight:500;min-width:40px}.unit[data-v-6a01135c]{color:#6b7280;font-size:.875rem}.modern-button[data-v-6a01135c]{align-items:center;border:none;border-radius:8px;cursor:pointer;display:inline-flex;font-size:.875rem;font-weight:500;gap:8px;padding:10px 16px;text-decoration:none;transition:all .2s ease}.btn-primary[data-v-6a01135c]{background:#3b82f6;color:#fff}.btn-primary[data-v-6a01135c]:hover:not(.disabled){background:#2563eb;box-shadow:0 4px 8px #3b82f64d;transform:translateY(-1px)}.btn-secondary[data-v-6a01135c]{background:#6b7280;color:#fff}.btn-secondary[data-v-6a01135c]:hover:not(.disabled){background:#4b5563;transform:translateY(-1px)}.btn-success[data-v-6a01135c]{background:#10b981;color:#fff}.btn-success[data-v-6a01135c]:hover:not(.disabled){background:#059669;transform:translateY(-1px)}.btn-purple[data-v-6a01135c]{background:#8b5cf6;color:#fff}.btn-purple[data-v-6a01135c]:hover:not(.disabled){background:#7c3aed;transform:translateY(-1px)}.modern-button.disabled[data-v-6a01135c]{cursor:not-allowed;opacity:.5;transform:none!important}.template-grid[data-v-6a01135c]{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));margin-top:16px}.template-button[data-v-6a01135c]{align-items:center;border:2px solid #e5e7eb;border-radius:8px;color:#fff;cursor:pointer;display:flex;font-size:.875rem;font-weight:500;height:80px;justify-content:center;position:relative;text-shadow:0 1px 2px rgba(0,0,0,.5);transition:all .2s ease}.template-button[data-v-6a01135c]:hover{box-shadow:0 4px 8px #0003;transform:translateY(-2px)}.template-button.active[data-v-6a01135c]{border-color:#3b82f6;box-shadow:0 0 0 2px #3b82f633}.template-check[data-v-6a01135c]{align-items:center;background:#3b82f6;border-radius:50%;color:#fff;display:flex;font-size:.75rem;height:20px;justify-content:center;position:absolute;right:4px;top:4px;width:20px}.elements-list[data-v-6a01135c]{border:1px solid #e5e7eb;border-radius:8px;overflow:hidden}.element-item[data-v-6a01135c]{background:#fff;border-bottom:1px solid #e5e7eb}.element-item[data-v-6a01135c]:last-child{border-bottom:none}.element-header[data-v-6a01135c]{align-items:center;background:#f8fafc;border-bottom:1px solid #e5e7eb;display:flex;justify-content:space-between;padding:12px 16px}.element-title[data-v-6a01135c]{color:#374151;font-weight:500}.element-actions[data-v-6a01135c]{display:flex;gap:4px}.action-btn[data-v-6a01135c]{border:none;border-radius:4px;cursor:pointer;font-size:.75rem;padding:4px 8px;transition:all .2s ease}.btn-duplicate[data-v-6a01135c]{background:#ddd6fe;color:#7c3aed}.btn-move[data-v-6a01135c]{background:#dbeafe;color:#2563eb}.btn-delete[data-v-6a01135c]{background:#fecaca;color:#dc2626}.action-btn[data-v-6a01135c]:hover:not(:disabled){filter:brightness(.9);transform:translateY(-1px)}.action-btn[data-v-6a01135c]:disabled{cursor:not-allowed;opacity:.5}.element-controls[data-v-6a01135c]{padding:16px}.control-item[data-v-6a01135c]{display:flex;flex:1;flex-direction:column;gap:4px}.control-item label[data-v-6a01135c]{color:#6b7280;font-size:.75rem;font-weight:500}.text-input[data-v-6a01135c]{margin-bottom:12px;width:100%}.range-value[data-v-6a01135c]{color:#6b7280;font-size:.75rem;min-width:40px;text-align:center}.color-palette[data-v-6a01135c]{align-items:center;display:flex;gap:8px;margin:8px 0}.color-swatch[data-v-6a01135c]{border:2px solid #e5e7eb;border-radius:6px;cursor:pointer;height:32px;transition:all .2s ease;width:32px}.color-swatch[data-v-6a01135c]:hover{transform:scale(1.1)}.color-swatch.active[data-v-6a01135c]{border-color:#3b82f6;box-shadow:0 0 0 2px #3b82f633}.color-picker[data-v-6a01135c]{background:none;border:none;border-radius:6px;cursor:pointer;height:32px;width:32px}.icon-grid[data-v-6a01135c]{display:grid;gap:8px;grid-template-columns:repeat(auto-fill,minmax(50px,1fr));margin-bottom:20px}.icon-button[data-v-6a01135c]{align-items:center;background:#fff;border:1px solid #e5e7eb;border-radius:8px;cursor:pointer;display:flex;font-size:1.5rem;height:50px;justify-content:center;transition:all .2s ease;width:50px}.icon-button[data-v-6a01135c]:hover{border-color:#3b82f6;box-shadow:0 4px 8px #0000001a;transform:translateY(-2px)}.border-control-panel[data-v-6a01135c],.border-controls[data-v-6a01135c]{background:#fafafa;border:1px solid #e5e7eb;border-radius:8px;margin-top:12px;padding:16px}.border-color-section[data-v-6a01135c]{margin-bottom:16px}.border-color-section label[data-v-6a01135c]{color:#374151;display:block;font-size:.875rem;font-weight:500;margin-bottom:8px}.border-settings[data-v-6a01135c]{display:flex;gap:16px;margin-bottom:16px}.border-item[data-v-6a01135c]{display:flex;flex:1;flex-direction:column;gap:4px}.border-item label[data-v-6a01135c]{color:#6b7280;font-size:.75rem;font-weight:500}.border-preview[data-v-6a01135c]{align-items:center;display:flex;gap:12px}.preview-label[data-v-6a01135c]{color:#374151;font-size:.875rem;font-weight:500}.border-preview-box[data-v-6a01135c]{border-radius:4px;height:40px;width:60px}.project-info[data-v-6a01135c]{background:#f0f9ff;border:1px solid #bae6fd;border-radius:8px;margin-bottom:24px;padding:16px}.section-subtitle[data-v-6a01135c]{align-items:center;color:#374151;display:flex;font-size:1rem;font-weight:600;gap:8px;margin:0 0 8px}.section-description[data-v-6a01135c]{color:#6b7280;font-size:.875rem;line-height:1.5;margin:0 0 16px}.export-section[data-v-6a01135c]{background:#f9fafb;border:1px solid #e5e7eb;border-radius:8px;margin-bottom:20px;padding:20px}.export-section[data-v-6a01135c]:last-child{margin-bottom:0}.export-buttons[data-v-6a01135c]{display:flex;flex-direction:column;gap:12px}.export-btn[data-v-6a01135c]{justify-content:flex-start;padding:14px 18px;width:100%}.btn-icon[data-v-6a01135c]{flex-shrink:0;font-size:1.125rem}@media (max-width:1024px){.app-container[data-v-6a01135c]{flex-direction:column;gap:16px}.controls-section[data-v-6a01135c]{width:100%}.modern-tabs[data-v-6a01135c]{grid-template-columns:repeat(2,1fr)}.tab-content[data-v-6a01135c]{max-height:50vh}}@media (max-width:768px){.modern-tabs[data-v-6a01135c]{grid-template-columns:1fr}.template-grid[data-v-6a01135c]{grid-template-columns:repeat(auto-fill,minmax(100px,1fr))}.icon-grid[data-v-6a01135c]{grid-template-columns:repeat(auto-fill,minmax(40px,1fr))}.control-row[data-v-6a01135c],.dimensions-row[data-v-6a01135c]{align-items:stretch;flex-direction:column}.zoom-controls[data-v-6a01135c]{flex-direction:column;gap:12px}}.toast-notification[data-v-6a01135c]{background:#ffffffe6;border:1px solid #e5e7eb;border-radius:8px;box-shadow:0 4px 8px #0000001a;padding:12px 16px;position:fixed;right:20px;top:20px;transition:all .3s ease;z-index:1000}.toast-notification.success[data-v-6a01135c]{border-color:#10b981}.toast-notification.error[data-v-6a01135c]{border-color:#dc2626}.toast-notification.info[data-v-6a01135c]{border-color:#3b82f6}.toast-message[data-v-6a01135c]{color:#374151;font-size:.875rem;margin:0}.app-root[data-v-5dcbb38c]{box-sizing:border-box;display:flex;flex-direction:column;height:100vh;margin:0;max-height:100vh;max-width:100vw;min-height:0;min-width:0;overflow:hidden;padding:0;width:100vw}