.app-banner{background-position:50%;background-repeat:no-repeat;background-size:cover;display:block;height:420px;-o-object-fit:cover;object-fit:cover;position:relative;transition:.3s;width:100%;z-index:2}.app-banner:before{background:-webkit-linear-gradient(left,rgba(102,204,255,.31),hsla(0,0%,100%,.35) 100%);content:"";display:block;height:100%;position:absolute;width:100%;z-index:1}@media (max-width:996px){.app-banner{height:220px}}@media (max-width:450px){.app-banner{height:180px}}.app-top{background-color:#fff;z-index:10}.app-top,.app-top .data{position:relative;width:100%}.app-top .data{align-items:center;display:flex;gap:10px;height:52px;margin:0 auto;max-width:1450px;z-index:2}@media (max-width:450px){.app-top .data{gap:0}}.app-top .data .avatar{height:100%;position:relative;width:320px}@media (max-width:996px){.app-top .data .avatar{width:160px}}@media (max-width:450px){.app-top .data .avatar{width:140px}}.app-top .data .avatar>div{background-color:#fff;border:6px solid #fff;border-radius:50%;bottom:-30px;left:50%;position:absolute;transform:translate(-50%);transition:.3s}@media (max-width:996px){.app-top .data .avatar>div{bottom:0;height:160px!important;width:160px!important}}@media (max-width:450px){.app-top .data .avatar>div{height:120px!important;width:120px!important}}.app-top .data .navs{align-items:center;display:flex;gap:20px;height:100%;transition:.3s}.app-top .data .navs .item{align-items:center;display:flex;gap:2px;position:relative}.app-top .data .navs .item:after{background-color:var(--app-theme);border-radius:20px;bottom:-16px;content:"";height:4px;opacity:0;position:absolute;transition:.3s;width:100%}.app-top .data .navs .item:hover:after{opacity:1}.app-top .data .navs .item.router-link-active{color:var(--app-theme)}.app-top .data .navs .item.router-link-active:after{opacity:1}.app-top .data .navs .item i{font-size:15px}.app-top .data .navs .item p{font-size:13px}.app-left{display:flex;flex-direction:column;gap:12px;min-width:320px;width:320px}@media (max-width:996px){.app-left{display:none}}.app-left .title{align-items:center;border-bottom:1px solid #f4f4f4;display:flex;gap:4px;padding:12px}.app-left .title i{font-size:15px}.app-left .title p{font-size:13px;padding-block-start:1px}.app-left .uu{background-color:#fff;border-radius:4px;margin-block-start:40px;padding:12px}.app-left .uu .name{display:flex;flex-direction:column;gap:6px}.app-left .uu .name p:first-child{color:#333;font-size:18px}.app-left .uu .name p:nth-child(2){font-size:13px}.app-left .uu .description{padding:12px 0}.app-left .uu ul{display:flex;flex-direction:column;gap:8px}.app-left .uu ul li{padding-inline-start:16px;position:relative}.app-left .uu ul li:after{background-color:#70e7e5;border:2px solid #a5a5a5;border-radius:50%;content:"";display:inline-block;height:8px;left:0;position:absolute;top:4px;width:8px}.app-left .uu .about{align-items:center;background-color:var(--app-theme);border-radius:4px;color:#fff;display:flex;gap:4px;justify-content:center;margin-block-start:16px;padding:10px;transition:.3s;width:100%}.app-left .uu .about:hover{opacity:.8}.app-left .uu .about i{font-size:14px}.app-left .notice,.app-left .video{background-color:#fff;border-radius:4px}.app-left .video .data{display:flex;flex-wrap:wrap;gap:8px;padding:10px}.app-left .video .data .item a{display:inline-flex;position:relative}.app-left .video .data .item a:hover .overlay,.app-left .video .data .item a:hover i{opacity:1}.app-left .video .data .item a i{color:#fff;font-size:18px;left:50%;opacity:0;position:absolute;top:50%;transform:translate(-50%) translateY(-50%);transition:.3s}.app-left .video .data .item a .overlay{background-color:#0003;border-radius:4px;inset:0;opacity:0;position:absolute;transition:.3s}.app-left .user{background-color:#fff;border-radius:4px;position:sticky;top:60px}.app-left .user .data{display:flex;flex-wrap:wrap;gap:8px;padding:10px}.app-right{display:flex;flex-direction:column;gap:12px;margin-block-start:12px;min-width:300px;width:300px}@media (max-width:1200px){.app-right{display:none}}.app-right .title{align-items:center;border-bottom:1px solid #f4f4f4;display:flex;gap:4px;padding:12px}.app-right .title i{font-size:15px}.app-right .title p{font-size:13px;padding-block-start:1px}.app-right .search{padding:12px}.app-right .counts,.app-right .search{background-color:#fff;border-radius:4px}.app-right .counts .data{display:flex;flex-direction:column;gap:8px;padding:10px}.app-right .counts .data .item{align-items:center;display:flex;gap:4px}.app-right .counts .data .item i{font-size:15px}.app-right .hots{background-color:#fff;border-radius:4px;position:sticky;top:60px}.app-right .hots .data{display:flex;flex-direction:column;gap:8px;padding:10px}.app-right .hots .data .item{display:flex;gap:10px}.app-right .hots .data .item img{border-radius:4px}.app-right .hots .data .item .details{display:flex;flex-direction:column;gap:8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.app-right .hots .data .item .details a{display:flex}.app-right .hots .data .item .details a h3{font-size:13px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.app-right .hots .data .item p{font-size:12px;opacity:.9}