body {
    margin: 0 auto;
    color: rgba(0, 0, 0, 0.87);
    font-family: Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 1rem;
    line-height: 1.5;
    letter-spacing: 0.00938em;
    padding: 0;
    max-width: 100vw;
    background-color: rgb(255, 255, 255);
}
div{position:relative;}
form{width:100%;}
pre{
        word-wrap: break-word;
        padding: 10px 0;
        margin: 2% 2% 2% 0;
        white-space: pre-wrap;
}
.main{
    margin: 100px 35px 35px 35px;
    width:100%;
}

.box{
    display: flex;
    min-height: 420px;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    align-items: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    flex-direction: column;
    position: relative;
    color: rgba(0, 0, 0, 0.87);
    transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    overflow: hidden;
    border-radius: 21px;
    width: 100%;
    max-width: 400px;
    height: 100%;
    margin: 0 auto;
    box-shadow: rgba(0, 84, 167, 0.13) 0px 0px 20px 0px;
    background-color: rgb(252, 252, 254);
}
.main1 {
    width: 900px;
    display: flex;
    padding: 55px 35px 35px 35px;
    /*background: #fcfcfe;*/
    margin: 0 auto;
    margin-top: 80px;
    max-height: 600px;
    border-radius: 20px;
}
.uplink{border:1px solid orange;padding: 8px 10px;margin-bottom:10px;background: #fdfaf8b8;color: #9f730d;border-radius: 10px;height: 30px;width:80px;}
.uplink i{color:orange;font-size: 26px;vertical-align: middle;}

.header{
    display: flex;
    background: linear-gradient(90deg, rgb(111, 0, 245) 0%, rgb(146, 67, 254) 100%);
    /*background: linear-gradient(90deg, rgb(0 177 245) 0%, rgb(203 174 66) 100%);*/
    /*padding: 16px 24px;*/
    padding: 16px 0;
    background:rgb(0 215 251 / 88%);
    width: 100%;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    box-shadow: rgba(0, 84, 167, 0.15) 0px 0px 10px 0px;
    cursor: pointer;
    position: absolute;
    top: 0px;
}
.header p{
    margin: 0px;
    font-family: Roboto, Helvetica, Arial, sans-serif;
    line-height: 1.5;
    letter-spacing: 0.00938em;
    font-size: 1rem;
    color: white;
    font-weight: 700;
    width: 95%;
    text-align: center;
}
.page{width:100%;height: calc(100vh - 50px);overflow-y: scroll;}
.footer{position:absolute;bottom:0;width: 100vw;margin:0 auto;text-align:center;line-height: 15px;}
.box{}
.title{
    color: rgb(51, 51, 51);
    font-size: 32px;
    height: 50px;
}
.box .tab{display:flex;flex-wrap: wrap;display: -webkit-flex;font-size: 18px;width: 90%;text-align: center;border-radius: 20px;margin: 5% auto;background: #ddd;font-weight:bold;border: 2px solid #f3ebeb;}
.box .tab span{flex:1;flex-basis: 50%;border-radius: 20px;padding: 10px 0;}
.box .tab span.active{background: rgb(255 255 255);}
.box .tab,.right .tab{display:flex;flex-wrap: wrap;display: -webkit-flex;font-size: 18px;width: 90%;text-align: center;border-radius: 20px;margin: 5% auto;background: #ddd;font-weight:bold;border: 2px solid #f3ebeb;}
.box .tab span,.right .tab span{flex:1;flex-basis: 50%;border-radius: 20px;padding: 10px 0;}
.box .tab span.active,.right .tab span.active{background: rgb(255 255 255);}
.right .tab{margin: 15px 0;width: 100%;font-weight: normal;background: #f5f5f5;justify-content: space-evenly;    border: 1px solid #dddddd;}
.right .tab span{padding: 8px 30px;flex: 1;}
.right .tab span.active{background: #fbfbff;
    border-radius: 20px;
    border: 1px solid #ddddddd4;}
.center{text-align:center;}
.box .line,.lfooter .line,#menu .line{line-height:40px;width:90%;margin: 0 auto;}
input[type="text"],input[type="password"]{width:90%;line-height:35px;margin:10px 0;border-radius:10px;border:1px solid #ddd;padding:0 10px}
.link{text-decoration:none;color:rgb(0, 84, 167)}
.btn{
    width:100%;
    display: inline-flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    position: relative;
    box-sizing: border-box;
    -webkit-tap-highlight-color: transparent;
    outline: 0px;
    border: 0px;
    margin: 16px 0px 8px;
    cursor: pointer;
    user-select: none;
    vertical-align: middle;
    appearance: none;
    text-decoration: none;
    font-family: Roboto, Helvetica, Arial, sans-serif;
    font-weight: 500;
    line-height: 1.75;
    letter-spacing: 0.02857em;
    text-transform: uppercase;
    min-width: 64px;
    padding: 6px 16px;
    transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 1px -2px, rgba(0, 0, 0, 0.14) 0px 2px 2px 0px, rgba(0, 0, 0, 0.12) 0px 1px 5px 0px;
    color: rgb(255, 255, 255);
    font-size: 14px;
    background: linear-gradient(330deg, rgb(51, 154, 240) 0%, rgb(105, 187, 255) 100%);
    width: 100%;
    height: 40px;
    border-radius: 8px;
}
.ad{
    display: flex;
    margin: 0 auto;
    padding: 0;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    align-items: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    flex-direction: column;
    position: relative;
    /* display:none; */
   }
.ad img {
    max-width: 400px;
    margin: 0 auto;
    text-align: center;
    max-height: 420px;
    border-bottom: 2px solid #d5d5d547;
    border-top: 2px solid #d5d5d547;
}
.main .box {background-color: rgb(252, 252, 254);}
.main1 .box{/*background-color:#fff;*/height: auto;}
.main .ad{display:none}
.main1 .ad{display:flex;background: #ffffff52;    border-radius: 20px;padding: 0 20px;
    min-height: 420px;}
.ad .line{width:100%;text-align:center;margin-right: 10px;}
.footer p{line-height:15px;height:15px;color:#737373;margin:8px 0;}
.grey{color:#737373}
.lightgrey{color: #a7a7a7;}
.container{display:flex;height: 100vh;background: linear-gradient(66deg, #e6fbfe 0%, #edddfb 100%);}
.layout{display: flex;width: 100%!important;max-width: 100% !important;}
.side{    min-width: 230px;
    max-width: 280px;background: #fff;/* color:#fff; *//* background: rgb(235 255 229 / 21%); */background: rgb(255 255 255);display: block;}
.side.pop{z-index: 99;
    position: absolute;
    height: 100vh;}
.side header .close{display:none;}
.pop header .close{display:inline-block;font-size: 1.1rem;
    color: #e2761c;}
.side header{padding:10px;text-align: center;font-weight: 600;}
.side ul{display:block;}
.side .topics{margin:0 auto;width: 80%;}
#menu{width:199px;position: relative;display: inline-block;flex: 1 1 auto;white-space: nowrap;height: calc(100vh - 50px);scrollbar-width: none;overflow: hidden auto;margin: 0 auto;padding: 15px 0;text-align: center;border-right: 1px solid #ddd;}
.item{margin: 8px;padding: 10px 5px;}
.item i{margin-right:5px;opacity: 0.9;}
.item.on{background: #effffe;margin: 0 auto;padding-left: 12px;} /*rgb(249 249 249 / 32%)*/
.item .fixr{display:none;}
.intopic input{width: 50% !important;border: none !important;padding: 0 !important;border-bottom: 1px solid #ddd !important;border-radius: 0 !important;background: transparent;line-height: 25px !important;margin: 0 !important;}

.right{width: 100%;padding: 1% 3%;background: rgb(255 255 255 / 81%);max-height: calc(100vh - 100px);
    overflow-y: scroll;}

@media (min-width: 600px)
.inheader {
    padding-left: 24px;
    padding-right: 24px;
}
.inheader {
    position: relative;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    min-height: 48px;
    padding-left: 16px;
    background: #fff;
    padding-right: 16px;
    border-bottom: 1px solid #ddd;
}
.inmain{width:100%;height: auto;}
.infooter {
    text-align: center;
    bottom: 0;
    display: block;
    height: 50px;
    -webkit-box-align: center;
    align-items: center;
    margin: 0 auto;
    margin-top: 100px;
    /*width: calc(100% - 280px);*/
}
.ritem{line-height:50px;border-top: 1px solid #e1e1e1;}
.lfooter{
        position: absolute;
        margin:0 auto;
        bottom: 0;
        text-align:center;
        width: 220px;
        line-height: 15px;
        /*margin-bottom: 50px;*/
        background: #fff;
    z-index: 999;
       }
.buy{
    display: inline-flex;
    position: relative;
    box-sizing: border-box;
    -webkit-tap-highlight-color: transparent;
    outline: 0px;
    border: 0px;
    margin: 0px;
    cursor: pointer;
    user-select: none;
    vertical-align: middle;
    appearance: none;
    text-decoration: none;
    font-family: Roboto, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: 0.975rem;
    line-height: 1.75;
    letter-spacing: 0.02857em;
    text-transform: uppercase;
    min-width: 64px;
    padding: 6px 8px;
    transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    color: #fff;
    background: linear-gradient(330deg, rgb(220 109 53) 0%, rgb(255 195 105) 100%);
    width: 189px;
    height: 48px;
    border-radius: 12px;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    align-items: center;
    }
.fixr{right:5%;position:absolute;}
.fixl{left:5%;position:absolute;}
.usr{font-size:18px;}
.uppic{
    display: inline-flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    position: relative;
    box-sizing: border-box;
    -webkit-tap-highlight-color: transparent;
    background-color: #f7f6f6;
    outline: 0px;
    margin: 0px;
    cursor: pointer;
    user-select: none;
    vertical-align: middle;
    appearance: none;
    text-decoration: none;
    font-family: Roboto, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: 0.875rem;
    line-height: 1.75;
    letter-spacing: 0.02857em;
    min-width: 64px;
    padding: 6px 8px;
    transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    /* color: rgb(105, 187, 255); */
    text-transform: none;
    border: 1px solid #d6cdcd;
    border-radius: 8px;
    width: 188px;
    height: 48px;
    margin-top: 15px;
}
.uppic i{font-size: 18px;margin-left: 5px;}
.uppic span{color:#ffb260}
.logo{height: 150px;color:rgb(51, 154, 240);line-height: 150px;font-size:50px;text-align: center;font-weight:bold;}    color: rgba(0, 0, 0, 0.87);}
.chat textarea{
    font: inherit;
    letter-spacing: inherit;
    color: currentcolor;
    border: 0px;
    box-sizing: content-box;
    background: none;
    margin: 0 auto;
    height:50px;
    -webkit-tap-highlight-color: transparent;
    display: block;
    min-width: 0px;
    width: 100%;
    animation-name: mui-auto-fill-cancel;
    animation-duration: 10ms;
    resize: none;
    padding: 10px;
}

.chat{
    transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    overflow: hidden;
    width: 100%;
    max-width: 800px;
    min-height: 450px;
    background-color: rgb(255 255 255);
    box-shadow: rgb(132 132 132 / 15%) 0px 0px 10px 0px;
    border-radius: 12px;
    padding: 0px 0px 24px;
    margin: 0 auto;
}

#editor{
    font: inherit;
    letter-spacing: inherit;
    color: currentcolor;
    box-sizing: content-box;
    background: none;
    margin-left:auto;
    margin-right:auto;
    height: 90px;
    -webkit-tap-highlight-color: transparent;
    display: block;
    min-width: 0px;
    width: 92% !important;
    animation-name: mui-auto-fill-cancel;
    animation-duration: 10ms;
    resize: none;
    padding: 10px;
    border:1px solid #ddd;
    border-radius:10px;
    margin: 0 auto;
    margin-top: 3%;
    text-align:left;
    margin-bottom: 3%;
}
.chat .up{
    max-width: 800px;
    width: 90%;
    }
.chat1 .up{
    max-width: 800px;
    width: 20%;
    height: 80%;
    padding: 0;
    margin: 3%;
    }
.btn.grey{
    line-height: 1.75;
    letter-spacing: 0.02857em;
    text-transform: uppercase;
    min-width: 45px;
    padding: 6px 16px;
    box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 1px -2px, rgba(0, 0, 0, 0.14) 0px 2px 2px 0px, rgba(0, 0, 0, 0.12) 0px 1px 5px 0px;
    color: #fff;
    font-weight: 600;
    font-size: 18px;
    background: linear-gradient(330deg, rgb(97 167 115) 0%, rgb(137 183 177) 100%);
    width: 50%;
    text-align: center;
    margin: 0 auto !important;
    margin-top: 2% !important;
    border-radius: 8px;
}
.bi-check2{display: none;}
.chat2 {flex-direction:row-reverse;height:80px;overflow:hidden;background: #fff;}
.chat2 button{width: 40px !important;padding: 0 10px !important;height: 35px;top: 30%;right: 0%;position: absolute;transform: translate(-50%, -50%);}
.chat2 #editor{height: 80%;width: 85% !important;margin: 1%;overflow:hidden;}
.chat2 .up{width:40px;height: 40px;margin: 1%;}
.up input, .miniup input {
    opacity: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    left: 0;
    position: absolute;
    pointer-events: auto;
}
.chat1 .up input{
    height:80%;
}
.bot.qa{display:none;}
.rand{height: 90px;}
.randqa{
    border:1px solid #ddd;
    min-width: 120px;
    max-width: 280px;
    background: #ffffff;
    border-radius: 20px;
    line-height: 70px;
    font-size: 20px;
    cursor:pointer;
    }
.randqa:after{
    content: "  ";
    top:100%;
    left: 40%;
    position: absolute;
    border-width: 15px;
    border-style: solid;
    border-color: transparent;
    border-top-color: white;
    }
.m{/*text-align:center;*/margin:0 auto;}
.chat .left{width: 65% !important;border:none;height:100%;}
.list{margin:0 auto;}
.user,.bot{flex-direction: row;border-radius: 20px;min-height:25px;padding: 10px 0;width: 100%;background: rgb(255 255 255 / 56%);margin: 10px 0;}
.user .info,.bot .info{
    max-height: 190px;
    overflow: hidden;
    border-radius: 10px;
    min-height: 25px;
    line-height: 25px;
    /* border: 1px solid #ddd; */
    /* padding: 10px 0; */
}
.clear{clear:both;}
.reverse{flex-direction:row-reverse;}
.user .info{/* background: rgb(210 249 209); *//* text-align: right; */float: right;padding-left: 20px;}
.bot .info{/* background: rgb(253 253 253 / 36%); */float: left;text-align: left;padding: 10px 10px 10px 0;}
.bi-hand-thumbs-up.active{color: #ffa421;}
.bi-hand-thumbs-down.active{color: #5fb682;}
.flex{display:flex;}
.avatar i{padding:10px;color:rgb(51 154 240 / 63%);font-size:40px;}
.user .avatar i{color:#e5c07ce8}
.flex .op{display:inline-block;padding: 3px 5px;border:1px solid #ddd;border-radius: 8px;margin: 4px 4px 0px 0px;background: rgb(209 212 221 / 24%);font-size: 13px;color: #7f7f7fbd;cursor:pointer;}
.flex .op i{padding:0 3px;font-size:13px;}
.chat1 {
    transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    overflow: hidden;
    width: 100%;
    max-width: 800px;
    height: 225px;
    background-color: rgb(255, 255, 253);
    box-shadow: rgba(0, 84, 167, 0.15) 0px 0px 10px 0px;
    border-radius: 12px;
    /* padding: 0px 0px 24px; */
    margin: 0 auto;
    position: relative;
    margin-bottom:20px;
}
.chat #editor {
    height: 300px;
    max-height: 400px;
    /* scrollbar-width: none; */
    overflow: hidden auto;
}
.chat1 #editor {
    width: 80% !important;
    white-space: nowrap;
    height: 80%;
    scrollbar-width: none;
    overflow: hidden auto;
    margin: 3%;
    margin-right: 0;
    padding: 0;
}
#editorbox{text-align:center}
.chat2 {
    transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    overflow: hidden;
    width: 100%;
    max-width: 800px;
    /* background-color: rgb(255, 255, 253); */
    box-shadow: rgba(0, 84, 167, 0.15) 0px 0px 10px 0px;
    border-radius: 12px;
    height: 80px;
    margin: 0 auto;
    position: relative;
}
.up{
    border: 1px dashed rgb(238, 238, 238);
    background-color: rgba(105, 187, 255, 0.05);
    color: rgb(189, 189, 189);
    transition: border 0.24s ease-in-out 0s;
    cursor: pointer;
    min-height: 180px;
    line-height: 10;
    margin-left: auto;
    margin-right: auto;
    justify-content: center;
    border-radius: 10px;
    margin: 0 auto;
    text-align: center;
    max-width: 800px;
    padding: 10px;
    pointer-events: auto;
    /*overflow: hidden;*/
    }
.up .delete {
    position: absolute;
    right:5px;
    height: 50px;
    z-index: 9999;
    font-size: 30px;
    bottom: 100%;
    display: none;
    transform: translate(-50%, -50%);
}
.up .delete:hover{
    cursor:pointer;
 }
 .up img{display:none;max-width: 100%;}
.chat1 .btn.grey{
    min-width: 40px;
    height: 35px;
    margin: 0 auto !important;
    top: 50%;
    right: 25%;
    width: 40px;
    position: absolute;
    transform: translate(-50%, -50%);
}
.lfooter .fixl,.lfooter .fixr{/* transform: translate(10px, 10px); */}
.usr label{line-height:40px;height:40px;display:inline-block;}
.w70{width:70%;}
.w15{width: 10%;}
.avatar{max-width:80px;}
#layout{width: 90%;max-width: 800px;}
.layout1{display:block;}
.layout1 #menu{height: auto;display:flex;width: 100%;border:none;}
.layout1 #menu .link{border-bottom:2px solid}

.credit{
    font-size:13px;
    padding:0 10px;
    border-radius: 15px;
    color: #fb8d6a;
    border: 1px solid #cf5c0d3b;
}

.credit.book{
    color: #5383c7;
    border: 1px solid #2d72d23b;
    margin-right: 10px;
}

.inheader span{padding:0 10px;}
.inheader i{font-size:18px;}
.inheader .fixr i{
    font-size:1rem;
    padding:5px;
}
.lfooter a{/* color:#fff; */}
.ritem a{color:rgba(0, 0, 0, 0.87);text-decoration:none;}
#menu a{text-decoration:none;color:inherit}
.datetime{
    --tw-text-opacity: 1;
    color: #857676;
    font-size: .75rem;
    line-height: 0.2rem;
}
.user .datetime{text-align:right;}
.bot .datetime{text-align:left}
.vditor-toolbar{display:none;overflow:hidden;}
.items::-webkit-scrollbar {
  display: none;
}
.items{
  overflow-y:scroll;
  max-height: 350px;
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
  }
.vditor-sv:focus {
  background-color: #fff !important;
}
.vditor-ir pre.vditor-reset:focus {
  background-color: #fff !important;
}
.vditor-reset pre > code {
    background: #f1fdef !important;
}
#editor{padding:0 !important;}
.vditor-content {
    padding: 10px !important;
    text-align: left !important;
}
.selist{display:none;}
select{border:1px solid #ddd;padding: 0 10px;margin:10px;height:32px;border-radius:5px;}
.chat1 #llm{position:absolute;right: 1.8%;bottom: 5%;width: 18.5%;}
.ritem .list{display: none;}
a{    cursor: pointer;text-decoration:none;color:inherit;}
.vditor-reset{padding: 0 !important;}
.upinfo {
    width: 80%;
    margin: 15px 0;
    border-radius: 15px;
    border: 1px solid #ddd;
    padding: 10px;
}
.uplist .item{padding: 5px 0;line-height: 20px;/*height: 20px;*/border-bottom: 2px solid #f1e8e8a8;}
.uplist .file{width:50%;}
.uplist .status{width:20%;font-size: 14px;}
.uplist .datetime{width: 30%;line-height:25px;font-size: 13px;}

.search{border:1px solid #ddd;border-radius:5px;height:30px;line-height:30px;overflow:hidden;margin:5% 0}
.search input{border:none;padding:0 10px}
.account i{font-size: 18px;}
.account i.on{color: #18bee5;}

.pop{
    position:fixed;
    width:40%;
    left:30%;
    top:30%;
    background: #cdcdcd;
    padding:5% auto;
    border-radius:15px;
    display: none;
    }
.pop input,.pop select,.pop textarea{
    width:90%;
    margin:2% 4%;
    margin-top: 0;
    line-height:30px;
    padding: 0 10px;
    border:1px solid #ddd;
}