:root{--accent-1:hsl(206,82%,40%);--accent-2:hsl(246,74%,46%);--accent-3:hsl(286,84%,42%);--accent-4:hsl(216,55%,52%);--bg-app:hsl(146,26%,14%);--bg-body:hsl(146,26%,11%);--btn-bg:hsl(326,85%,58%);--card-bg:#f4f6fa;--grad-from:hsl(191,92%,56%);--grad-to:hsl(286,70%,46%);--live:#00FF7C;--nav-active-from:hsl(176,92%,88%);--nav-active-text:#10131f;--nav-active-to:hsl(176,84%,70%);--nav-bg:hsl(146,50%,26%);--nav-text:hsl(146,18%,85%);--text-base:hsl(146,22%,74%);--text-bright:#1c2030;--text-faint:#71798c;--text-muted:#5a6275;--title-color:hsl(146,62%,76%);}
*{margin:0;padding:0;box-sizing:border-box}
a{text-decoration:none;color:var(--text-base)}
img{object-fit:cover}
body{max-width:500px;width:100%;margin:0 auto;color:var(--text-base);background-color:var(--bg-body);font-family:PingFang SC,-apple-system,BlinkMacSystemFont,Microsoft YaHei,Arial,sans-serif;overflow-y:auto}
#app{font-size:.24rem;background-color:var(--bg-app);padding-top:.14rem}
.item-box{margin-bottom:.24rem}
.item-box1{margin-bottom:.24rem;padding:.16rem .16rem 0}
.title-wrap{display:flex;font-size:.28rem;margin-bottom:.16rem}
.t-icon{width:.36rem;height:.36rem}
.t-t{margin:0 .08rem;color:var(--title-color);font-weight:600}
.sub-t{color:var(--text-faint)}
.grid-col-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.1rem}
.grid-col-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.1rem}
.grid-col-5{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));column-gap:.24rem;row-gap:.16rem}
.text{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}
.nav-c{display:flex;position:fixed;left:50%;top:0;height:.72rem;width:100%;max-width:500px;background-color:var(--nav-bg);border-radius:.14rem;z-index:10000;transform:translateX(-50%)}
.nav-c .item{flex:1;height:.72rem;line-height:.72rem;text-align:center;font-size:.28rem;font-weight:600;color:var(--nav-text);-webkit-user-select:none;user-select:none}
.nav-c .item.active{background:linear-gradient(123.64deg,var(--nav-active-from) 19.31%,var(--nav-active-to) 92.79%);border-radius:.12rem;color:var(--nav-active-text)}
#app{padding-top:.86rem}
.qq-item{background-color:var(--card-bg);width:100%;border-radius:.2rem}
.qq-img{width:100%;height:2rem;border-radius:.2rem}
.qq-img2{width:100%;height:3.1rem}
.qq-title{margin-bottom:5px;font-size:.3rem;color:var(--text-bright);text-align:center}
.qq-title2{margin:0 0 5px 10px;font-size:.36rem;color:var(--text-bright)}
.qq-info{display:flex;justify-content:space-between;font-size:.24rem;padding:0 10px 5px}
.qq-pic{font-size:.28rem;color:var(--accent-3);font-weight:600}
.qq-pl{text-align:right;color:var(--text-muted)}
.qq-ys{color:var(--accent-2)}
.gril-item{display:block;width:100%;border-radius:10px;background-color:var(--card-bg)}
.gril-img-wrap{position:relative}
.gril-img{width:100%;height:4.72rem;border-top-left-radius:10px;border-top-right-radius:10px;display:block}
.gril-top{position:absolute;top:0;padding:.08rem;width:100%;display:flex;justify-content:space-between}
.gf-tips{width:1.74rem;height:.6rem;background-color:rgba(0,0,0,.3);border-radius:.64rem;padding:.08rem;display:flex;align-items:center;color:#FFFFFFCC;font-weight:700}
.gf-tips img{margin-right:.08rem}
.like-tips{width:1.16rem;height:.6rem;background-color:rgba(0,0,0,.3);border-radius:.64rem;padding:.08rem;display:flex;align-items:center;justify-content:space-between;color:#FFFFFFCC}
.gril-bottom{position:absolute;bottom:-.3rem;padding:0 .16rem;width:100%;display:flex;justify-content:space-between}
.gril-l img{width:.6rem;height:.6rem}
.gril-text-wrap{margin-top:.3rem;padding:.16rem;overflow:hidden}
.gril-text{display:flex;margin-bottom:.12rem;justify-content:space-between;width:100%;overflow:hidden;white-space:nowrap;font-size:.24rem}
.gril-text:last-child{margin-bottom:0}
.gril-name{flex:0 0 auto;width:1.22rem;font-size:.28rem;font-weight:600;color:var(--text-bright)}
.gril-add{color:var(--accent-4);display:flex;align-items:center}
.gril-add img{width:.2rem;height:.25rem;margin-right:.06rem}
.color1{color:var(--accent-1);font-size:.26rem;font-weight:600;display:block}
.gti{flex:0 0 auto;width:2.7rem;color:var(--text-faint)}
.gtc{white-space:nowrap;margin-right:.08rem;color:var(--accent-2)}
.jgg-item{display:flex;justify-content:center;align-items:center;flex-direction:column;color:var(--card-bg)}
.jgg-img{width:1.32rem;height:1.32rem;border-radius:.2rem;margin-bottom:.12rem}
.icon-carousel{overflow:hidden}
.carousel-pane{display:none;padding:0 .16rem}
.carousel-pane.active{display:block}
.lf-g{border-radius:.2rem;background-color:var(--card-bg);display:flex;align-items:center;position:relative}
.lf-g-img{width:1.1rem;height:1.1rem;border-radius:.2rem;margin-right:.16rem}
.lf-g-d{flex:1;min-width:0}
.ad-name{font-weight:700;font-size:.28rem;margin-bottom:.08rem;color:var(--text-bright)}
.lf-g-load{color:var(--text-muted)}
.go-icon{position:absolute;top:.24rem;right:0}
.overfloat{position:fixed;top:0;left:0;z-index:9;display:none;width:100%;height:100%;background-color:rgba(1,1,1,.5)}
.guize_html{position:fixed;top:21.5%;left:50%;margin-top:-10px;margin-left:-150px;width:300px;height:auto;border-radius:30px;background-color:var(--bg-body);color:#000;text-align:center;font-size:12px}
.guize_html_nei{width:300px;min-height:350px;max-height:500px;height:350px;display:block}
.btnXZ{display:block;margin:10px auto;width:125px;height:40px;border-radius:30px;background-color:var(--btn-bg);color:#fff;text-align:center;line-height:40px;cursor:pointer}
.GB{display:block;margin:10px auto;width:125px;height:40px;border-radius:30px;background-color:#7d7776;color:#fff;text-align:center;line-height:40px;cursor:pointer}