.component-palette[data-v-e8405c2c]{background-color:#171717;padding:8px}.layout-container[data-v-e8405c2c]{display:flex;flex-direction:column;height:100%;width:200px}.group-item .group-title[data-v-e8405c2c]{font-weight:700;margin-bottom:8px}.group-item .group-list[data-v-e8405c2c]{display:flex;flex-wrap:wrap;gap:8px;padding-bottom:16px;border-bottom:1px solid var(--dialog-border);margin-bottom:16px}.component-item[data-v-e8405c2c]{display:flex;align-items:center;padding:0 8px;height:20px;line-height:20px;width:96px;border:1px solid var(--cell-border);border-radius:2px;background-color:#474747;cursor:pointer;transition:all .3s ease}.component-item[data-v-e8405c2c]:hover{background-color:#4d4d4d;border-color:var(--global-color)}.component-item .component-icon[data-v-e8405c2c]{height:12px;width:12px;margin-right:4px}.component-item .component-name[data-v-e8405c2c]{color:--highlight-text;font-size:12px;font-weight:600}.component-lib[data-v-4555c33e]{display:flex;flex-direction:row!important;height:100%}.component-lib[data-v-4555c33e] .design-canvas{flex:1}.layout-components[data-v-4555c33e]{flex:1;position:relative;padding:12px;overflow-y:auto;overflow-x:hidden;border:1px solid var(--input-border);border-radius:4px;background-color:#000;margin:10px;display:flex;flex-direction:column}.components-display[data-v-4555c33e]{display:grid;grid-auto-rows:65px;grid-template-columns:repeat(12,1fr);row-gap:12px;-moz-column-gap:8px;column-gap:8px;height:100%}.displayed-component[data-v-4555c33e]{display:flex;flex-direction:column;padding:4px 8px;border:1px dashed var(--input-border);border-radius:4px;transition:all .3s}.displayed-component.selected[data-v-4555c33e]{border-color:var(--global-color);background-color:#2c2f31;box-shadow:0 2px 12px 0 rgba(64,158,255,.1)}.component-header[data-v-4555c33e]{display:flex;align-items:center;justify-content:space-between;height:24px}.component-header .component-title[data-v-4555c33e]{color:var(--highlight-text);font-size:13px}.component-preview[data-v-4555c33e]{flex:1;display:flex;align-items:center}.empty-state[data-v-4555c33e]{height:100%;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;position:absolute;top:0;left:0;pointer-events:none;color:#909399}.actions i[data-v-4555c33e]{cursor:pointer;padding:5px;color:#909399}.actions i[data-v-4555c33e]:hover{color:#f56c6c}.fade-leave-to[data-v-4555c33e]{transform:translateY(100%);opacity:0}.fade-leave-active[data-v-4555c33e]{transition:all .4s ease;position:absolute;width:100%;z-index:-1}