:root{--primary: #1e40af;--secondary: #3b82f6;--success: #10b981;--danger: #ef4444;--muted: #6b7280}.content-auto{content-visibility:auto}.transition-height{transition:height .3s ease}.shadow-card{box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.form-section{background:#fff;border-radius:.5rem;padding:1rem;margin-bottom:1rem;box-shadow:0 4px 6px -1px #0000000f}.form-section-title{font-size:1.125rem;font-weight:600;color:#374151;margin-bottom:.75rem;padding-bottom:.5rem;border-bottom:1px solid #e5e7eb;display:flex;align-items:center}.form-group{margin-bottom:1rem}.form-label{display:block;font-size:.875rem;font-weight:600;color:#374151;margin-bottom:.25rem}.form-control,.component-select,.preview-input,.preview-select{display:block;width:100%;border:1px solid #d1d5db;border-radius:.375rem;padding:.5rem .75rem;box-shadow:0 1px 2px #00000008;color:#111827}.form-control:focus,.component-select:focus,.preview-input:focus,.preview-select:focus{outline:none;box-shadow:0 0 0 3px #1e40af1f;border-color:var(--primary)}.btn{padding:.5rem 1rem;border-radius:.375rem;font-weight:600;cursor:pointer;border:none;font-size:14px}.btn-primary{background:var(--primary);color:#fff}.btn-primary:hover{opacity:.95}.btn-outline{background:transparent;border:1px solid #d1d5db;color:#374151}.btn-danger{background:var(--danger);color:#fff}.btn-success{background:var(--success);color:#fff}#buttonsList .form-control{padding:.35rem .6rem;height:34px}#buttonsList .component-select{height:34px;padding:.25rem .5rem}.table-config th{padding:.5rem 1rem;text-align:left;font-size:.75rem;color:#6b7280;text-transform:uppercase;letter-spacing:.03em}.table-config td{padding:.5rem 1rem;font-size:.875rem;color:#111827}.table-config tr:nth-child(2n){background:#f9fafb}.table-config tr:hover{background:#f3f4f6}.preview-checkbox,.preview-radio{width:1rem;height:1rem}.action-btn{padding:.25rem;color:#6b7280;cursor:pointer}.action-btn:hover{color:var(--primary)}.action-btn-danger:hover{color:var(--danger)}.badge{display:inline-flex;align-items:center;padding:.125rem .625rem;border-radius:9999px;font-size:.75rem}.badge-primary{background:#ebf5ff;color:#1e3a8a}.badge-secondary{background:#f3f4f6;color:#374151}.tooltip{position:absolute;z-index:10;padding:.25rem .5rem;background:#111827;color:#fff;font-size:.75rem;border-radius:.25rem;opacity:0;visibility:hidden;transition:opacity .2s}.has-tooltip:hover .tooltip{opacity:1;visibility:visible}.generated-table{width:100%;table-layout:auto;border-collapse:collapse}.generated-table th,.generated-table td{padding:.5rem .75rem;border-bottom:1px solid #e5e7eb;text-align:left}.generated-form-buttons{display:flex;justify-content:center;align-items:center;gap:.5rem;margin-top:1rem}.sortable-ghost{opacity:.4;background:#dbeafe!important}.sortable-chosen{background:#eff6ff!important;box-shadow:0 0 0 2px #3b82f6}.sortable-drag{opacity:.9;box-shadow:0 4px 12px #00000026}.drag-handle{cursor:grab;padding:2px 4px;border-radius:3px;transition:background .15s}.drag-handle:hover{background:#e5e7eb}.drag-handle:active{cursor:grabbing}.dashboard-container{max-width:1200px;margin:0 auto;padding:2rem 1.5rem}.dashboard-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1.25rem}.project-card{background:#fff;border:1px solid #e5e7eb;border-radius:.75rem;padding:1.25rem;transition:box-shadow .2s,border-color .2s;display:flex;flex-direction:column;gap:.625rem}.project-card:hover{box-shadow:0 4px 12px #00000014;border-color:#93c5fd}.project-card-header{display:flex;align-items:center;justify-content:space-between;gap:.5rem}.project-card-title{font-size:1rem;font-weight:600;color:#1e293b;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.status-badge{display:inline-block;font-size:.7rem;padding:.15rem .5rem;border-radius:9999px;font-weight:500;white-space:nowrap}.status-draft{background:#fef3c7;color:#92400e}.status-published{background:#d1fae5;color:#065f46}.project-card-desc{font-size:.85rem;color:#64748b;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-height:1.2em}.project-card-meta{display:flex;gap:1rem;font-size:.8rem;color:#94a3b8}.project-card-tags{display:flex;flex-wrap:wrap;gap:.375rem}.tag-badge{display:inline-block;font-size:.7rem;padding:.1rem .45rem;border-radius:4px;background:#eff6ff;color:#1e40af}.project-card-actions{display:flex;gap:.5rem;padding-top:.5rem;border-top:1px solid #f1f5f9;margin-top:auto}.action-btn-main{display:inline-flex;align-items:center;font-size:.78rem;padding:.3rem .6rem;border-radius:.375rem;border:1px solid #e2e8f0;background:#fff;color:#475569;cursor:pointer;transition:all .15s}.action-btn-main:hover{background:#eff6ff;border-color:#93c5fd;color:#1e40af}.action-btn-danger{display:inline-flex;align-items:center;font-size:.78rem;padding:.3rem .6rem;border-radius:.375rem;border:1px solid #e2e8f0;background:#fff;color:#ef4444;cursor:pointer;transition:all .15s;margin-left:auto}.action-btn-danger:hover{background:#fef2f2;border-color:#fca5a5}.stat-card{display:flex;flex-direction:column;align-items:center;background:#fff;border:1px solid #e5e7eb;border-radius:.75rem;padding:.75rem 1.5rem;min-width:100px}.stat-value{font-size:1.5rem;font-weight:700;color:#1e40af}.stat-label{font-size:.78rem;color:#94a3b8}.back-to-dashboard{display:inline-flex;align-items:center;gap:.375rem;font-size:.875rem;color:#6b7280;cursor:pointer;padding:.25rem .5rem;border-radius:.375rem;transition:all .15s;text-decoration:none;border:none;background:none}.back-to-dashboard:hover{color:#1e40af;background:#eff6ff}.project-info-bar{display:flex;align-items:center;gap:.75rem;margin-bottom:1rem;padding:.625rem 1rem;background:#f8fafc;border:1px solid #e2e8f0;border-radius:.5rem}.project-info-bar .project-name-input{font-size:1rem;font-weight:600;color:#1e293b;border:1px solid transparent;background:transparent;padding:.25rem .5rem;border-radius:.375rem;flex:1;min-width:150px}.project-info-bar .project-name-input:hover{border-color:#e2e8f0}.project-info-bar .project-name-input:focus{border-color:#3b82f6;outline:none;background:#fff}.project-info-bar .save-status{font-size:.75rem;color:#94a3b8}.component-palette{display:flex;flex-direction:column;height:100%;overflow:hidden}.palette-search{padding:.75rem;border-bottom:1px solid #e5e7eb;flex-shrink:0}.palette-search-input{width:100%;padding:.375rem .5rem .375rem 2rem;font-size:.8125rem;border:1px solid #e2e8f0;border-radius:.375rem;outline:none;transition:border-color .15s;background:#fff}.palette-search-input:focus{border-color:#3b82f6;box-shadow:0 0 0 2px #3b82f61a}.palette-categories{flex:1;overflow-y:auto;padding:.5rem}.palette-category{margin-bottom:.75rem}.palette-category-title{font-size:.6875rem;font-weight:600;color:#94a3b8;text-transform:uppercase;letter-spacing:.05em;padding:.25rem .5rem;margin-bottom:.375rem}.palette-grid{display:grid;grid-template-columns:1fr 1fr;gap:.375rem}.palette-card{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.25rem;padding:.5rem .25rem;border:1px solid #e5e7eb;border-radius:.375rem;background:#fff;cursor:grab;transition:all .15s;-webkit-user-select:none;user-select:none}.palette-card:hover{border-color:#3b82f6;background:#eff6ff;box-shadow:0 1px 3px #3b82f626}.palette-card:active{cursor:grabbing;transform:scale(.95)}.palette-card-dragging{opacity:.4}.palette-card-icon{font-size:1.125rem;color:#64748b}.palette-card:hover .palette-card-icon{color:#3b82f6}.palette-card-label{font-size:.6875rem;color:#475569;text-align:center;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.palette-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem}.designer-mode-switch{display:flex;background:#f1f5f9;border-radius:.375rem;padding:2px;gap:2px;margin-left:.75rem}.mode-btn{display:flex;align-items:center;gap:.25rem;padding:.25rem .75rem;font-size:.75rem;font-weight:500;color:#64748b;background:transparent;border:none;border-radius:.25rem;cursor:pointer;transition:all .15s;white-space:nowrap}.mode-btn:hover{color:#3b82f6;background:#e2e8f0}.mode-btn.active{color:#fff;background:#3b82f6;box-shadow:0 1px 2px #3b82f64d}.canvas-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4rem 2rem;color:#94a3b8}.canvas-ungrouped{margin-bottom:.75rem;border:2px dashed #e2e8f0;border-radius:8px;min-height:60px}.canvas-ungrouped-header{display:flex;align-items:center;justify-content:space-between;padding:.5rem .75rem;background:#f8fafc;border-bottom:1px solid #e2e8f0;border-radius:6px 6px 0 0}.canvas-ungrouped-title{font-size:.8125rem;font-weight:500;color:#64748b}.canvas-empty-icon{font-size:2.5rem;margin-bottom:.75rem;opacity:.4}.canvas-empty-text{font-size:.875rem;margin-bottom:1rem}.canvas-add-group-btn{display:flex;align-items:center;gap:.375rem;padding:.5rem 1rem;font-size:.8125rem;color:#3b82f6;background:#eff6ff;border:1px dashed #93c5fd;border-radius:.375rem;cursor:pointer;transition:all .15s}.canvas-add-group-btn:hover{background:#dbeafe;border-color:#3b82f6}.canvas-add-group-area{padding:.75rem 0;text-align:center}.canvas-group{margin-bottom:1rem;border:1px solid #e5e7eb;border-radius:.5rem;overflow:hidden;background:#fff}.canvas-group-ghost{opacity:.4;border:2px dashed #3b82f6!important}.canvas-group-header{display:flex;align-items:center;justify-content:space-between;padding:.5rem .75rem;background:#f8fafc;border-bottom:1px solid #e5e7eb;cursor:grab;-webkit-user-select:none;user-select:none}.canvas-group-header:active{cursor:grabbing}.canvas-group-left{display:flex;align-items:center;gap:.5rem}.canvas-group-toggle{display:flex;align-items:center;justify-content:center;width:1.25rem;height:1.25rem;border:none;background:none;color:#64748b;cursor:pointer;transition:transform .2s;font-size:.625rem}.canvas-group-toggle.collapsed{transform:rotate(-90deg)}.canvas-group-icon{color:#3b82f6;font-size:.875rem}.canvas-group-name{font-size:.8125rem;font-weight:600;color:#334155;border:1px solid transparent;background:transparent;padding:2px 6px;border-radius:4px;outline:none;min-width:80px;max-width:200px;transition:border-color .2s,background .2s}.canvas-group-name:hover{border-color:#cbd5e1;background:#f8fafc}.canvas-group-name:focus{border-color:#3b82f6;background:#fff}.canvas-group-actions{display:flex;align-items:center;gap:.5rem}.canvas-group-count{font-size:.6875rem;color:#94a3b8}.canvas-group-add,.canvas-group-delete{display:flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;border:none;border-radius:.25rem;background:none;cursor:pointer;color:#64748b;font-size:.75rem;transition:all .15s}.canvas-group-add:hover{color:#3b82f6;background:#eff6ff}.canvas-group-delete:hover{color:#ef4444;background:#fef2f2}.canvas-group-body{padding:.5rem;transition:max-height .3s ease,padding .3s ease;max-height:2000px;overflow:hidden}.canvas-group-body.collapsed{max-height:0;padding:0 .5rem;border-top:none}.canvas-group-drop-hint{text-align:center;padding:1.5rem 1rem;color:#94a3b8;font-size:.8125rem;border:2px dashed #e2e8f0;border-radius:.375rem;margin:.25rem;transition:all .15s}.canvas-drop-target .canvas-group-drop-hint,.canvas-drop-target{border-color:#3b82f6;background:#eff6ff}.canvas-fields-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:.5rem;min-height:2rem}.canvas-fields-grid.canvas-grid-1{grid-template-columns:1fr}.canvas-fields-grid.canvas-grid-2{grid-template-columns:repeat(2,1fr)}.canvas-fields-grid.canvas-grid-3{grid-template-columns:repeat(3,1fr)}.canvas-fields-grid.canvas-grid-4{grid-template-columns:repeat(4,1fr)}.canvas-fields-grid.canvas-grid-5{grid-template-columns:repeat(5,1fr)}.canvas-field-card{position:relative;border:2px solid #e5e7eb;border-radius:.375rem;padding:.5rem .625rem;background:#fff;cursor:pointer;transition:all .15s;-webkit-user-select:none;user-select:none}.canvas-field-card:hover{border-color:#93c5fd;box-shadow:0 2px 4px #3b82f61a}.canvas-field-card.selected{border-color:#3b82f6;background:#eff6ff;box-shadow:0 0 0 3px #3b82f626}.canvas-field-card.col-span-2{grid-column:span 2}.canvas-field-card.col-span-3{grid-column:span 3}.canvas-field-card.col-span-4{grid-column:span 4}.canvas-field-card.col-span-5{grid-column:span 5}.canvas-field-ghost{opacity:.3;border:2px dashed #3b82f6}.canvas-field-chosen{box-shadow:0 4px 12px #00000026}.canvas-field-drag{opacity:.9}.canvas-field-header{display:flex;align-items:center;gap:.375rem;margin-bottom:.25rem}.canvas-field-type-icon{font-size:.75rem;color:#64748b;flex-shrink:0}.canvas-field-name{font-size:.8125rem;font-weight:500;color:#1e293b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1}.canvas-field-type-label{font-size:.625rem;color:#94a3b8;flex-shrink:0}.canvas-field-meta{display:flex;align-items:center;gap:.375rem;flex-wrap:wrap}.canvas-field-col{font-size:.625rem;color:#94a3b8;background:#f1f5f9;padding:.0625rem .375rem;border-radius:.25rem}.canvas-field-required{font-size:.625rem;color:#ef4444;background:#fef2f2;padding:.0625rem .375rem;border-radius:.25rem}.canvas-field-placeholder{font-size:.625rem;color:#94a3b8;max-width:8rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.canvas-field-actions{position:absolute;top:.25rem;right:.25rem;display:none;gap:.125rem}.canvas-field-card:hover .canvas-field-actions{display:flex}.canvas-field-copy,.canvas-field-delete{display:flex;align-items:center;justify-content:center;width:1.25rem;height:1.25rem;border:none;border-radius:.25rem;background:#ffffffe6;cursor:pointer;font-size:.625rem;color:#64748b;transition:all .1s}.canvas-field-copy:hover{color:#3b82f6;background:#eff6ff}.canvas-field-delete:hover{color:#ef4444;background:#fef2f2}.prop-panel-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;min-height:300px;color:#94a3b8;text-align:center;padding:2rem}.prop-panel-empty-icon{font-size:2rem;margin-bottom:.75rem;opacity:.4}.prop-panel-empty p{font-size:.8125rem;line-height:1.6}.prop-panel{display:flex;flex-direction:column;height:100%}.prop-panel-header{display:flex;align-items:center;gap:.5rem;padding:.75rem;background:#f8fafc;border-bottom:1px solid #e5e7eb;font-size:.8125rem;font-weight:600;color:#334155}.prop-panel-header i{color:#3b82f6}.prop-panel-field-id{margin-left:auto;font-size:.6875rem;color:#94a3b8;font-weight:400}.prop-panel-body{flex:1;overflow-y:auto;padding:.75rem}.prop-section{margin-bottom:1rem}.prop-section-title{font-size:.6875rem;font-weight:600;color:#94a3b8;text-transform:uppercase;letter-spacing:.05em;padding-bottom:.375rem;margin-bottom:.5rem;border-bottom:1px solid #f1f5f9}.prop-row{display:flex;align-items:center;margin-bottom:.5rem;gap:.5rem}.prop-label{font-size:.75rem;color:#475569;width:4.5rem;flex-shrink:0;text-align:right}.prop-value{flex:1;min-width:0}.prop-input{width:100%;padding:.25rem .5rem;font-size:.75rem;border:1px solid #e2e8f0;border-radius:.25rem;outline:none;transition:border-color .15s;background:#fff}.prop-input:focus{border-color:#3b82f6;box-shadow:0 0 0 2px #3b82f61a}.prop-select{width:100%;padding:.25rem .5rem;font-size:.75rem;border:1px solid #e2e8f0;border-radius:.25rem;outline:none;background:#fff;transition:border-color .15s}.prop-select:focus{border-color:#3b82f6;box-shadow:0 0 0 2px #3b82f61a}.prop-switch{position:relative;display:inline-block;width:2rem;height:1.125rem}.prop-switch input{opacity:0;width:0;height:0}.prop-switch-slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#cbd5e1;border-radius:1rem;transition:.2s}.prop-switch-slider:before{content:"";position:absolute;height:.875rem;width:.875rem;left:.125rem;bottom:.125rem;background-color:#fff;border-radius:50%;transition:.2s}.prop-switch input:checked+.prop-switch-slider{background-color:#3b82f6}.prop-switch input:checked+.prop-switch-slider:before{transform:translate(.875rem)}.prop-empty-hint{font-size:.75rem;color:#94a3b8;text-align:center;padding:.5rem}