.type-switch-wrapper[data-v-cfc8c8e1]{align-items:center;background:var(--my-color-bg-3);border-radius:8px;box-sizing:border-box;display:flex;height:32px;justify-content:space-between;padding:2px;position:relative;width:var(--wrapper-width)}.type-switch-wrapper .type-switch-item[data-v-cfc8c8e1]{border-radius:2px;color:var(--my-color-text-2);cursor:pointer;flex:1;font-size:12px;line-height:28px;overflow:hidden;position:relative;text-align:center;-webkit-user-select:none;-moz-user-select:none;user-select:none;z-index:1}.type-switch-wrapper .type-switch-item[data-v-cfc8c8e1]:hover{color:var(--my-color-primary-hover)}.type-switch-wrapper .type-swtich-active[data-v-cfc8c8e1]{color:var(--my-color-primary-base);transition-delay:.15s}.type-switch-wrapper .slider[data-v-cfc8c8e1]{background-color:var(--my-color-bg-1);border-radius:8px;content:"";display:block;height:28px;left:var(--slider-left);position:absolute;text-align:center;top:2px;transition:var(--slider-time) linear;width:var(--slider-width)}.material-list[data-v-92ce95b1]{display:grid;grid-template-columns:repeat(3,1fr);row-gap:0;width:100%}.material-list.is-preview[data-v-92ce95b1]{gap:8px 4px;grid-template-columns:repeat(2,1fr);overflow-y:auto}.material-list.is-preview .box[data-v-92ce95b1]{border-radius:4px;height:180px;width:152px}.material-list.is-preview .box .boxContainer[data-v-92ce95b1]{padding-bottom:27px}.material-list.is-preview .box .boxContainer .background[data-v-92ce95b1]{height:152px;width:100%}.material-list.is-preview .box .boxContainer .background img[data-v-92ce95b1]{border-radius:2px;height:152px;-o-object-fit:cover;object-fit:cover;transform-origin:center;transition:transform .3s cubic-bezier(.2,.8,.9,1),filter .1s ease;width:100%}.material-list.is-preview .box .boxContainer .background img[data-v-92ce95b1]:hover{filter:brightness(1.05);transform:scale(1.1)}.material-list.is-preview .box .boxContainer .typeName[data-v-92ce95b1]{font-size:14px;height:28px;line-height:28px}.material-list .box[data-v-92ce95b1]{border-radius:2px;height:1.2rem}.material-list .box[data-v-92ce95b1],.material-list .box .boxContainer[data-v-92ce95b1]{box-sizing:border-box;overflow:hidden;position:relative;width:100%}.material-list .box .boxContainer[data-v-92ce95b1]{align-items:flex-end;border:1px solid transparent;cursor:pointer;display:flex;flex-direction:column;height:100%;justify-content:center;padding-bottom:20px}.material-list .box .boxContainer .background[data-v-92ce95b1]{height:1rem;width:100%}.material-list .box .boxContainer .background img[data-v-92ce95b1]{border-radius:2px;height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.material-list .box .boxContainer .typeName[data-v-92ce95b1]{background:#1a1a1a;bottom:0;color:#fff;font-family:HarmonyOS Sans SC;font-size:12px;font-variation-settings:"opsz" 400;font-weight:400;height:21px;left:0;letter-spacing:0;line-height:21px;overflow:hidden;position:absolute;text-align:center;text-overflow:ellipsis;white-space:nowrap;width:100%}.material-list .box .boxContainer .selectedIcon[data-v-92ce95b1]{background-color:var(--my-color-primary-base);border-top-left-radius:4px;bottom:0;color:var(--my-color-text-5);font-size:12px;height:12px;position:absolute;right:0;width:12px}.material-list .box .isChecked[data-v-92ce95b1],.material-list .boxContainer[data-v-92ce95b1]:hover{border:1px solid var(--my-color-primary-base)}.materials-preview-container{align-items:center;background:var(--my-color-bg-1);border-radius:4px;box-shadow:0 0 8px var(--my-color-mask-1);box-sizing:border-box;display:flex;flex-direction:column;height:80vh;left:calc(var(--menu-width) + 10px);overflow:hidden;padding:8px 8px 36px;position:fixed;row-gap:8px;top:15vh;width:328px;z-index:100}.materials-preview-container .header{align-items:center;display:flex;font-size:14px;justify-content:space-between;width:100%}.materials-preview-container .header iconpark-icon{color:var(--my-color-text-1);cursor:pointer}.materials-container{align-items:center;display:flex;flex-wrap:wrap;gap:8px;justify-content:start;margin-top:12px;position:relative}.materials-container .tool-item{align-items:center;border-radius:4px;color:#ffffffa6;cursor:pointer;display:flex;flex-direction:column;font-size:12px;gap:2px;height:56px;justify-content:center;line-height:16px;width:60px}.materials-container .tool-item:hover{background-color:#434343;color:#fff}.materials-container .tool-item.active{background:#1a1a1a;color:#fff}.materials-container .custom-material{align-items:center;background:var(--my-color-bg-3);border:1px dashed var(--my-color-border-2);border-radius:2px;box-sizing:border-box;color:var(--ctl-text-color);cursor:pointer;display:flex;font-size:12px;gap:4px;justify-content:center;line-height:16px;padding:4px 2px;position:relative;text-align:center;width:100%}.materials-container .custom-material:hover{color:var(--my-color-primary-hover)}.materials-container .custom-material-box{align-items:center;border:1px solid hsla(0,0%,100%,.1);border-radius:4px;box-sizing:border-box;display:flex;height:44px;justify-content:center;margin-top:8px;position:relative;width:100%}.materials-container .custom-material-box .imgContainer{border:1px dashed hsla(0,0%,100%,.05);border-radius:2px;box-sizing:border-box;height:36px;margin-right:4px;position:relative;width:82px}.materials-container .custom-material-box .imgContainer:hover{cursor:pointer}.materials-container .custom-material-box .imgContainer:hover .text{display:flex}.materials-container .custom-material-box .imgContainer img{height:100%;width:100%}.materials-container .custom-material-box .imgContainer .text{align-items:center;background-color:#0006;color:#fff;display:none;font-size:12px;height:100%;justify-content:center;line-height:16px;position:absolute;top:0;width:100%}.materials-container .custom-material-box .imgContainer .file-input{height:100%;left:0;opacity:0;position:absolute;top:0;width:100%}.materials-container .custom-material-box .inputContainer{align-items:center;background:var(--my-color-bg-2);border-radius:8px;color:var(--my-color-text-1);display:flex;flex:1;font-size:12px;height:36px;justify-content:center;line-height:16px;width:162px}.materials-container .custom-material-box .inputContainer input{background-color:var(--my-color-bg-2);border:0;color:var(--my-color-text-1);font-size:12px;height:100%;line-height:16px;padding:2px 4px;width:100%}.materials-container .custom-material-box .inputContainer input:focus{border:0;box-shadow:none;outline:none}.materials-container .custom-material-box .closeBtnForCM{background-color:var(--my-color-mask-2);border-radius:50%;color:var(--my-color-text-5);font-size:12px;height:14px;position:absolute;right:0;text-align:center;top:0;transform:scale(.8);width:14px}.materials-container .custom-material-box .closeBtnForCM:hover{cursor:pointer}.materials-container .custom-material-box .selectedIconForCM{background-color:var(--my-color-primary-base);border-top-left-radius:4px;bottom:0;color:var(--my-color-text-5);font-size:12px;height:12px;position:absolute;right:0;width:12px}.materials-container .upload-material{cursor:pointer;height:20px;opacity:0;position:absolute;top:0;width:100%}.materials-container .custom-material-box:hover,.materials-container .isSelected{border:1px solid var(--my-color-primary-base)}