body,html{min-width:100%;min-height:100%}.micropage-templates{background-color:#f5f7fa;min-width:1300px;height:100%;padding:0 20px}.templates-header{background-color:#edfafa;background-image:url(/micropage-templates/img/header/header-background.png);background-repeat:no-repeat;background-size:cover;border-radius:8px;max-width:1600px;height:294px;margin:0 auto;position:relative}.templates-header .templates-header-inner{flex-direction:column;justify-content:center;align-items:center;row-gap:24px;padding-top:60px;display:flex}.templates-header .templates-header-inner .templates-title{color:#333940;margin:0;font-family:Microsoft YaHei UI;font-size:36px;font-style:normal;font-weight:700;line-height:normal}.templates-header .templates-header-inner .templates-search{background-color:#fff;border:2px solid #04bdb2;border-radius:8px;align-items:center;width:576px;height:61px;display:flex;overflow:hidden}.templates-header .templates-header-inner .templates-search .search-icon{flex-grow:0;width:16px;height:16px;margin-left:24px;display:block}.templates-header .templates-header-inner .templates-search .search-input{background-color:#fff;border:none;outline:none;flex-grow:1;height:100%;padding:19px 12px;display:block}.templates-header .templates-header-inner .templates-search .delete-search-icon{cursor:pointer;width:24px;height:24px;margin-right:20px;display:none}.templates-header .templates-header-inner .templates-search .delete-search-icon.show-icon{display:block}.templates-header .templates-header-inner .templates-search .search-button{color:#fff;font-feature-settings:"salt" on, "liga" off;text-align:center;cursor:pointer;background-color:#04bdb2;width:122px;height:60px;font-family:Microsoft YaHei UI;font-size:16px;font-style:normal;font-weight:400;line-height:60px}.templates-header .templates-header-inner .templates-search .search-button:hover{background-color:#00a19b}.templates-header .templates-header-inner .templates-second-title{color:#849f9e;margin:0;font-family:Microsoft YaHei;font-size:14px;font-style:normal;font-weight:400;line-height:20px;display:flex}.templates-header .templates-header-inner .templates-second-title .send-request{color:#04bdb2;cursor:pointer;text-decoration:underline;display:block;position:relative}.templates-header .templates-header-inner .templates-second-title .send-request:hover .qrcode-dialog{display:flex}.templates-header .templates-header-inner .templates-second-title .send-request .qrcode-dialog{z-index:1;background-color:#fff;border:1px solid #eee;border-radius:8px;flex-direction:column;align-items:center;row-gap:16px;margin-top:10px;padding:22px 26px;display:none;position:absolute;right:50%;transform:translate(50%);box-shadow:0 0 8px #00000017}.templates-header .templates-header-inner .templates-second-title .send-request .qrcode-dialog:after{content:" ";border-bottom:8px solid #fff;border-left:8px solid #0000;border-right:8px solid #0000;width:0;height:0;position:absolute;top:0;left:50%;transform:translate(-50%,-100%)}.templates-header .templates-header-inner .templates-second-title .send-request .qrcode-dialog:before{content:" ";position:absolute;inset:-15px 0 0}.templates-header .templates-header-inner .templates-second-title .send-request .qrcode-dialog span{color:#333;white-space:nowrap;font-family:Microsoft YaHei UI;font-size:14px;font-style:normal;font-weight:700;line-height:22px;display:block}.templates-header .templates-header-inner .templates-second-title .send-request .qrcode-dialog .image-container{background-color:#fff;border:1px solid #0076fee6;border-radius:4px;width:124px;height:124px;padding:4px}.templates-header .templates-header-inner .templates-second-title .send-request .qrcode-dialog .image-container img{width:100%;height:100%;display:block}.templates-header .header-tips{cursor:pointer;align-items:center;column-gap:2px;display:flex;position:absolute;bottom:20px;right:20px}.templates-header .header-tips:hover .default{display:none}.templates-header .header-tips:hover .hover{display:block}.templates-header .header-tips:hover span{color:#04bdb2}.templates-header .header-tips .hover{display:none}.templates-header .header-tips img{width:16px;height:16px;display:block}.templates-header .header-tips span{color:#849f9e;font-family:Microsoft YaHei;font-size:14px;font-style:normal;font-weight:400;line-height:20px}.micropage-templates-list{grid-template-columns:repeat(5,1fr);justify-items:center;gap:24px;max-width:1600px;margin:24px auto 0;padding-bottom:40px;display:grid}.micropage-templates-list.hide-list{display:none}@media (max-width: 1650px){.micropage-templates-list{grid-template-columns:repeat(4,1fr);column-gap:30px;max-width:1300px}}.micropage-templates-list .add-new-templates{cursor:pointer;padding-bottom:34px}.micropage-templates-list .add-new-templates .add-new-templates-inner{cursor:pointer;background:#fff;border-radius:8px;flex-direction:column;justify-content:center;align-items:center;row-gap:12px;width:290px;height:390px;transition:all 50ms;display:flex}.micropage-templates-list .add-new-templates .add-new-templates-inner:hover{background-color:#f9fffe;border:2px solid #04bdb2cc;box-shadow:0 0 10px 2px #d1fffc}.micropage-templates-list .add-new-templates .add-new-templates-inner:hover img{width:40px;height:40px}.micropage-templates-list .add-new-templates .add-new-templates-inner img{width:36px;height:36px;transition:width .1s,height .1s;display:block}.micropage-templates-list .add-new-templates .add-new-templates-inner span{color:#333940;text-align:center;text-overflow:ellipsis;white-space:nowrap;font-family:Microsoft YaHei UI;font-size:14px;font-style:normal;font-weight:400;line-height:22px;overflow:hidden}.micropage-templates-list .templates-item{cursor:pointer;border-radius:8px;flex-direction:column;justify-content:space-between;align-items:center;width:290px;transition:bottom .3s;display:flex;position:relative;bottom:0}.micropage-templates-list .templates-item .templates-item-inner{border-radius:8px;flex-direction:column;justify-content:space-between;align-items:center;width:100%;display:flex;position:relative;overflow:hidden}.micropage-templates-list .templates-item .templates-item-inner:hover{box-shadow:0 6px 20px #030c151f}.micropage-templates-list .templates-item:hover{bottom:12px}.micropage-templates-list .templates-item:hover .templates-tips{top:-100px}.micropage-templates-list .templates-item .templates-tips{color:#fff;text-align:center;z-index:10;border-radius:100%;width:100%;height:100px;font-size:14px;line-height:235px;transition:all .3s;position:absolute;top:-156px;left:0;box-shadow:0 0 25px 30px #00000080}.micropage-templates-list .templates-item .image-box{background-color:#fff;border-radius:8px;width:290px;height:390px;padding:20px 20px 0;position:relative;overflow:hidden;box-shadow:0 1px 4px #0000001f}.micropage-templates-list .templates-item .image-box img{object-fit:contain;width:100%;display:block}.micropage-templates-list .templates-item .templates-title{color:#333940;text-align:center;text-overflow:ellipsis;white-space:nowrap;max-width:100%;margin-top:12px;font-family:Microsoft YaHei UI;font-size:14px;font-style:normal;font-weight:400;line-height:22px;display:block;overflow:hidden}.empty-list{flex-direction:column;justify-content:center;align-items:center;row-gap:8px;height:633px;display:flex}.empty-list.hide-list{display:none}.empty-list img{width:92px;height:92px;display:block}.empty-list .no-temp{color:#999;font-feature-settings:"salt" on, "liga" off;align-items:center;column-gap:5px;font-family:Microsoft YaHei UI;font-size:14px;font-style:normal;font-weight:400;line-height:150%;display:flex}.empty-list .no-temp .reload{color:#04bdb2;font-feature-settings:"salt" on, "liga" off;cursor:pointer;font-family:Microsoft YaHei UI;font-size:14px;font-style:normal;font-weight:400;line-height:150%;text-decoration-line:underline}.dialog-background{z-index:1000;background-color:#00000080;width:100%;height:100%;display:none;position:fixed;top:0;left:0}.dialog-background.show-dialog{display:block}.instructions-dialog{background-color:#fff;background-image:linear-gradient(#89eef426 0%,#fff0 96.87%);border-radius:8px;width:536px;height:478px;padding:24px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 1px 4px #0000001f}.instructions-dialog .dialog-header{justify-content:space-between;align-items:center;display:flex}.instructions-dialog .dialog-header .dialog-title{align-items:center;column-gap:8px;display:flex}.instructions-dialog .dialog-header .dialog-title img{width:20px;height:20px;display:block}.instructions-dialog .dialog-header .dialog-title span{color:#333940;font-family:Microsoft YaHei;font-size:18px;font-style:normal;font-weight:700;line-height:normal}.instructions-dialog .dialog-header .close-dialog{cursor:pointer;width:20px;height:20px;display:block}.instructions-dialog .dialog-body{flex-direction:column;row-gap:15px;margin-top:40px;padding:0 24px;display:flex}.instructions-dialog .dialog-body div{color:#666;column-gap:8px;font-family:Microsoft YaHei;font-size:14px;font-style:normal;font-weight:400;line-height:normal;display:flex}.instructions-dialog .dialog-body div a{color:#0076fe}.instructions-dialog .dialog-body div:before{content:"•";color:#666}.preview-dialog{background-color:#fff;border-radius:8px;width:760px;height:630px;padding:24px 0;position:absolute;top:50%;left:50%;overflow:hidden;transform:translate(-50%,-50%);box-shadow:0 1px 4px #0000001f}.preview-dialog .dialog-header{justify-content:space-between;align-items:center;padding:0 24px;display:flex}.preview-dialog .dialog-header .dialog-title{align-items:center;column-gap:8px;display:flex}.preview-dialog .dialog-header .dialog-title img{width:20px;height:20px;display:block}.preview-dialog .dialog-header .dialog-title span{color:#333;font-feature-settings:"salt" on, "liga" off;font-family:Microsoft YaHei UI;font-size:18px;font-style:normal;font-weight:700;line-height:150%}.preview-dialog .dialog-header .close-dialog{cursor:pointer;width:20px;height:20px;display:block}.preview-dialog .dialog-body{border-top:1px solid #f1f1f1;height:calc(100% - 20px);margin-top:20px;display:flex}.preview-dialog .dialog-body .preview-iframe{background-color:#f1f3f5;width:404px;height:100%;padding:26px 52px 0;position:relative}.preview-dialog .dialog-body .preview-iframe img{pointer-events:none;border-radius:42px 42px 0 0;position:absolute;top:16px;left:40px;box-shadow:0 0 10px #3f489617}.preview-dialog .dialog-body .preview-iframe iframe{border-radius:10px;width:300px;height:571px;display:block}.preview-dialog .dialog-body .template-info{flex-direction:column;align-items:center;margin:115px auto 0;padding:0 40px;display:flex}.preview-dialog .dialog-body .template-info .template-title{-webkit-line-clamp:2;color:#333940;text-align:center;-webkit-box-orient:vertical;width:236px;margin-bottom:20px;font-family:Microsoft YaHei UI;font-size:16px;font-style:normal;font-weight:400;line-height:150%;display:-webkit-box;overflow:hidden}.preview-dialog .dialog-body .template-info .qrcode-container{background-color:#f3f3f3;justify-content:center;align-items:center;margin-bottom:8px;padding:24px;display:flex}.preview-dialog .dialog-body .template-info .qrcode-container #template-qrcode{width:160px;height:160px}.preview-dialog .dialog-body .template-info .qrcode-container #template-qrcode img,.preview-dialog .dialog-body .template-info .qrcode-container #template-qrcode canvas{width:100%;height:100%}.preview-dialog .dialog-body .template-info .qrcode-text{align-items:center;column-gap:4px;margin-bottom:20px;display:flex}.preview-dialog .dialog-body .template-info .qrcode-text span{color:#999;font-family:Microsoft YaHei UI;font-size:14px;font-style:normal;font-weight:400;line-height:150%}.preview-dialog .dialog-body .template-info .qrcode-text img{width:8.25px;height:11px;display:block}.preview-dialog .dialog-body .template-info .use-template{color:#fff;text-align:center;cursor:pointer;background-color:#04bdb2;border-radius:3px;justify-content:center;align-items:center;width:200px;padding:8px 32px;font-family:Microsoft YaHei UI;font-size:16px;font-style:normal;font-weight:700;line-height:24px;display:flex}.preview-dialog .dialog-body .template-info .use-template:hover{background-color:#00a19b}@media (max-width: 1299px){.micropage-templates{min-width:0;padding:0 16px}.templates-header{height:auto;padding:40px 16px 56px}.templates-header .templates-header-inner{row-gap:16px;padding-top:0}.templates-header .templates-header-inner .templates-title{text-align:center;font-size:26px}.templates-header .templates-header-inner .templates-search{width:100%;max-width:576px;height:52px}.templates-header .templates-header-inner .templates-search .search-icon{margin-left:16px}.templates-header .templates-header-inner .templates-search .search-input{padding:12px;font-size:16px}.templates-header .templates-header-inner .templates-search .delete-search-icon{margin-right:12px}.templates-header .templates-header-inner .templates-search .search-button{width:88px;height:51px;font-size:15px;line-height:51px}.templates-header .header-tips{bottom:12px;right:16px}.templates-header .header-tips span{font-size:12px}.micropage-templates-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;max-width:980px}.micropage-templates-list .templates-item,.micropage-templates-list .templates-item .image-box,.micropage-templates-list .add-new-templates{width:100%}.micropage-templates-list .templates-item .image-box{aspect-ratio:290/390;height:auto;padding:12px 12px 0}.micropage-templates-list .templates-item:hover{bottom:0}.micropage-templates-list .templates-item .templates-item-inner:hover{box-shadow:none}.micropage-templates-list .templates-item .templates-tips{display:none}.micropage-templates-list .add-new-templates .add-new-templates-inner{aspect-ratio:290/390;width:100%;height:auto}.instructions-dialog{width:min(536px,100vw - 32px);height:auto;max-height:82vh;overflow-y:auto}.preview-template-dialog-background.show-dialog{justify-content:center;align-items:center;display:flex}.preview-dialog{flex-direction:column;width:min(760px,100% - 24px);height:auto;max-height:88vh;display:flex;position:relative;top:auto;left:auto;overflow:hidden;transform:none}.preview-dialog .dialog-body{scrollbar-width:none;flex:1;height:auto;min-height:0;overflow-y:auto}.preview-dialog .dialog-body::-webkit-scrollbar{display:none}.preview-dialog .preview-iframe{overflow:hidden}}@media (max-width: 767px){.templates-header{padding:28px 12px 44px}.templates-header .templates-header-inner .templates-title{font-size:20px}.templates-header .templates-header-inner .templates-search{height:46px}.templates-header .templates-header-inner .templates-search .search-button{height:45px;line-height:45px}.templates-header .templates-header-inner .templates-second-title{text-align:center;flex-direction:column;align-items:center;row-gap:4px}.micropage-templates-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:16px}.micropage-templates-list .templates-item .image-box{padding:8px 8px 0}.micropage-templates-list .templates-item .templates-title{margin-top:8px;font-size:13px}.micropage-templates-list .add-new-templates{padding-bottom:30px}.micropage-templates-list .add-new-templates .add-new-templates-inner{row-gap:8px}.micropage-templates-list .add-new-templates .add-new-templates-inner span{font-size:13px}.empty-list{height:auto;padding:60px 0}.instructions-dialog{padding:16px}.instructions-dialog .dialog-header .dialog-title span{font-size:16px}.instructions-dialog .dialog-body{row-gap:10px;margin-top:20px;padding:0 4px}.instructions-dialog .dialog-body div{font-size:13px}.preview-dialog{padding:16px 0}.preview-dialog .dialog-header{padding:0 16px}.preview-dialog .dialog-body{flex-direction:column;height:auto;margin-top:12px}.preview-dialog .dialog-body .preview-iframe{background-color:#0000;width:100%;height:auto;padding:12px}.preview-dialog .dialog-body .preview-iframe img{display:none}.preview-dialog .dialog-body .preview-iframe iframe{width:100%;height:46vh;min-height:320px}.preview-dialog .dialog-body .template-info{margin-top:20px;padding:0 16px}.preview-dialog .dialog-body .template-info .template-title{width:100%;margin-bottom:12px}.preview-dialog .dialog-body .template-info .qrcode-container{padding:12px}.preview-dialog .dialog-body .template-info .qrcode-container #template-qrcode{width:132px;height:132px}.preview-dialog .dialog-body .template-info .use-template{width:168px}}@media (max-width: 600px){.preview-template-dialog-background.show-dialog,.instructions-dialog-background.show-dialog{justify-content:center;align-items:flex-end;display:flex}.preview-dialog,.instructions-dialog{border-radius:8px 8px 0 0;width:100%;position:relative;top:auto;left:auto;transform:none}}@media (hover:none){.templates-second-title .send-request .qrcode-dialog{display:none!important}}
/*$vite$:1*/