body,body[data-theme=default],body[data-theme=blue],body[data-theme=yellow],body[data-theme=beige],body[data-theme=green] {
    --primary-red-500: #e5353e;
    --primary-red-300: #ff6f75;
    --primary-red-50: #ffe6e7;
    --secondary-blue-500: #5790df;
    --secondary-blue-300: #84b4f5;
    --secondary-blue-50: #ebeffa;
    --surface-gray-900: #191919;
    --surface-gray-700: #4c4c4c;
    --surface-gray-500: #808080;
    --surface-gray-400: #adadad;
    --surface-gray-300: #ccc;
    --surface-gray-200: #e0e0e0;
    --surface-gray-100: #ebebeb;
    --surface-gray-50: #f5f5f5;
    --surface-bw-white: #fff;
    --background-gray-100: #ebebeb;
    --background-gray-50: #f5f5f5;
    --background-bw-white: #fff;
    --sheet-background-gray-50: #f5f5f5;
    --sheet-background-bw-white: #fff;
    --nav-bar-background-bw-white: #fff;
    --on-image-bw-white: #fff;
    --on-image-white-70: rgba(255, 255, 255, .7);
    --on-image-white-36: rgba(255, 255, 255, .36);
    --on-image-black-90: rgba(0, 0, 0, .9);
    --on-image-black-60: rgba(0, 0, 0, .6);
    --on-image-black-36: rgba(0, 0, 0, .36);
    --outline-black-8: rgba(0, 0, 0, .08);
    --overlay-black-90: rgba(0, 0, 0, .9);
    --overlay-black-60: rgba(0, 0, 0, .6);
    --overlay-black-36: rgba(0, 0, 0, .36);
    --segmentation-black-4: rgba(0, 0, 0, .04);
    --bw-black: #000;
    --bw-white: #fff;
    --sd2: rgba(0, 0, 0, .06);
    --sd3: rgba(0, 0, 0, .06);
    --sd4: rgba(0, 0, 0, .07);
    --sd5: rgba(0, 0, 0, .08);
    --sd6: rgba(0, 0, 0, .09);
    --sd7: rgba(0, 0, 0, .1);
    --sd8: rgba(0, 0, 0, .12);
    --sd12: rgba(0, 0, 0, .16);
    --sd16: rgba(0, 0, 0, .16);
    --on-image-surface-black-4: rgba(0, 0, 0, .04);
    --on-image-surface-black-8: rgba(0, 0, 0, .08)
}

body[data-theme=blue] {
    --surface-gray-900: rgba(0, 0, 0, .9);
    --surface-gray-700: rgba(0, 0, 0, .7);
    --surface-gray-500: rgba(0, 0, 0, .48);
    --surface-gray-400: rgba(0, 0, 0, .36);
    --surface-gray-300: rgba(0, 0, 0, .32);
    --surface-gray-200: rgba(0, 0, 0, .24);
    --surface-gray-100: rgba(0, 0, 0, .12);
    --surface-gray-50: rgba(0, 0, 0, .08);
    --surface-bw-white: rgba(0, 0, 0, .04);
    --background-gray-100: #cedde1;
    --background-gray-50: #dcebef;
    --background-bw-white: #edf5f7;
    --sheet-background-gray-50: #dcebef;
    --sheet-background-bw-white: #edf5f7;
    --nav-bar-background-bw-white: #edf5f7
}

body[data-theme=yellow] {
    --surface-gray-900: rgba(0, 0, 0, .9);
    --surface-gray-700: rgba(0, 0, 0, .7);
    --surface-gray-500: rgba(0, 0, 0, .48);
    --surface-gray-400: rgba(0, 0, 0, .36);
    --surface-gray-300: rgba(0, 0, 0, .32);
    --surface-gray-200: rgba(0, 0, 0, .24);
    --surface-gray-100: rgba(0, 0, 0, .12);
    --surface-gray-50: rgba(0, 0, 0, .08);
    --surface-bw-white: rgba(0, 0, 0, .04);
    --background-gray-100: #e3d0a1;
    --background-gray-50: #efe2c0;
    --background-bw-white: #f4ecd1;
    --sheet-background-gray-50: #efe2c0;
    --sheet-background-bw-white: #f4ecd1;
    --nav-bar-background-bw-white: #f4ecd1
}

body[data-theme=beige] {
    --surface-gray-900: rgba(0, 0, 0, .9);
    --surface-gray-700: rgba(0, 0, 0, .7);
    --surface-gray-500: rgba(0, 0, 0, .48);
    --surface-gray-400: rgba(0, 0, 0, .36);
    --surface-gray-300: rgba(0, 0, 0, .32);
    --surface-gray-200: rgba(0, 0, 0, .24);
    --surface-gray-100: rgba(0, 0, 0, .12);
    --surface-gray-50: rgba(0, 0, 0, .08);
    --surface-bw-white: rgba(0, 0, 0, .04);
    --background-gray-100: #ebe6da;
    --background-gray-50: #f5f1e8;
    --background-bw-white: #faf9f4;
    --sheet-background-gray-50: #f5f1e8;
    --sheet-background-bw-white: #faf9f4;
    --nav-bar-background-bw-white: #faf9f4
}

body[data-theme=green] {
    --surface-gray-900: rgba(0, 0, 0, .9);
    --surface-gray-700: rgba(0, 0, 0, .7);
    --surface-gray-500: rgba(0, 0, 0, .48);
    --surface-gray-400: rgba(0, 0, 0, .36);
    --surface-gray-300: rgba(0, 0, 0, .32);
    --surface-gray-200: rgba(0, 0, 0, .24);
    --surface-gray-100: rgba(0, 0, 0, .12);
    --surface-gray-50: rgba(0, 0, 0, .08);
    --surface-bw-white: rgba(0, 0, 0, .04);
    --background-gray-100: #c9e0cb;
    --background-gray-50: #e0eee1;
    --background-bw-white: #ebfaeb;
    --sheet-background-gray-50: #e0eee1;
    --sheet-background-bw-white: #ebfaeb;
    --nav-bar-background-bw-white: #ebfaeb
}

body[data-theme=dark] {
    --primary-red-500: #ff4d55;
    --primary-red-300: rgba(229, 53, 62, .48);
    --primary-red-50: rgba(229, 53, 62, .16);
    --secondary-blue-500: #6da2ed;
    --secondary-blue-300: rgba(109, 162, 237, .48);
    --secondary-blue-50: rgba(114, 148, 227, .16);
    --surface-gray-900: rgba(255, 255, 255, .6);
    --surface-gray-700: rgba(255, 255, 255, .5);
    --surface-gray-500: rgba(255, 255, 255, .4);
    --surface-gray-400: rgba(255, 255, 255, .36);
    --surface-gray-300: rgba(255, 255, 255, .32);
    --surface-gray-200: rgba(255, 255, 255, .24);
    --surface-gray-100: rgba(255, 255, 255, .12);
    --surface-gray-50: rgba(255, 255, 255, .08);
    --surface-bw-white: rgba(255, 255, 255, .08);
    --background-gray-100: #0a0a0a;
    --background-gray-50: #111;
    --background-bw-white: #191919;
    --sheet-background-gray-50: #191919;
    --sheet-background-bw-white: #1f1f1f;
    --nav-bar-background-bw-white: #1f1f1f;
    --on-image-bw-white: rgba(255, 255, 255, .9);
    --on-image-white-70: rgba(255, 255, 255, .6);
    --on-image-white-36: rgba(255, 255, 255, .36);
    --on-image-black-90: rgba(0, 0, 0, .9);
    --on-image-black-60: rgba(0, 0, 0, .6);
    --on-image-black-36: rgba(0, 0, 0, .36);
    --outline-black-8: rgba(255, 255, 255, .12);
    --overlay-black-90: rgba(0, 0, 0, .9);
    --overlay-black-60: rgba(0, 0, 0, .6);
    --overlay-black-36: rgba(0, 0, 0, .36);
    --segmentation-black-4: rgba(0, 0, 0, .7);
    --bw-black: #000;
    --bw-white: #fff;
    --sd2: rgba(0, 0, 0, 0);
    --sd3: rgba(0, 0, 0, 0);
    --sd4: rgba(0, 0, 0, 0);
    --sd5: rgba(0, 0, 0, 0);
    --sd6: rgba(0, 0, 0, 0);
    --sd7: rgba(0, 0, 0, 0);
    --sd8: rgba(0, 0, 0, 0);
    --sd12: rgba(0, 0, 0, 0);
    --sd16: rgba(0, 0, 0, 0);
    --on-image-surface-black-4: rgba(255, 255, 255, .08);
    --on-image-surface-black-8: rgba(255, 255, 255, .12)
}

.bann_s {
    position: fixed;
    top: 0
}

.sort_s_6 {
    padding: 0 .12rem;
    position: relative
}

.sort_s_5 {
    margin-top: .12rem;
    padding: .12rem .16rem;
    border-radius: .1rem;
    background-color: #fff;
}

[data-theme=default] .sort_s_5 {
    background-color: #fff
}

[data-theme=blue] .sort_s_5 {
    background-color: #edf5f7
}

[data-theme=yellow] .sort_s_5 {
    background-color: #f4ecd1
}

[data-theme=beige] .sort_s_5 {
    background-color: #faf9f4
}

[data-theme=green] .sort_s_5 {
    background-color: #ebfaeb
}

[data-theme=dark] .sort_s_5 {
    background-color: #191919
}

.sort_s_3 {
    display: flex;
    justify-content: space-between;
    align-items: center
}

.sort_s_4 {
    font-family: PingFang SC;
    font-style: normal;
    font-weight: 600;
    font-size: .16rem;
    line-height: .24rem;
    display: flex;
    align-items: center
}

[data-theme=default] .sort_s_4 {
    color: #191919
}

[data-theme=blue] .sort_s_4,[data-theme=yellow] .sort_s_4,[data-theme=beige] .sort_s_4,[data-theme=green] .sort_s_4 {
    color: rgba(0,0,0,.9)
}

[data-theme=dark] .sort_s_4 {
    color: rgba(255,255,255,.6)
}

.sort_s_4 img {
    vertical-align: text-bottom;
    width: .24rem;
    height: .24rem;
    margin-right: .08rem
}

.sort_s_1 {
    font-family: PingFang SC;
    font-style: normal;
    font-weight: 400;
    font-size: .14rem;
    line-height: .22rem;
    color: #adadad;
}

[data-theme=default] .sort_s_1 {
    color: #adadad
}

[data-theme=blue] .sort_s_1,[data-theme=yellow] .sort_s_1,[data-theme=beige] .sort_s_1,[data-theme=green] .sort_s_1 {
    color: rgba(0,0,0,.36)
}

[data-theme=dark] .sort_s_1 {
    color: rgba(255,255,255,.36)
}

.sort_s_2 {
    display: flex;
    justify-self: space-between;
    flex-wrap: wrap;
    align-items: center;
    text-align: center;
    margin-top: .08rem
}

.sort_s_2 .y-button {
    font-family: PingFang SC;
    font-style: normal;
    font-weight: 400;
    font-size: .13rem;
    line-height: .2rem;
    padding: .04rem .09rem;
    border: none
}

.sort_s_2 .y-button {
    background-color: #f5f5f5
}

[data-theme=blue] .sort_s_2 .y-button {
    background-color: #dcebef
}

[data-theme=yellow] .sort_s_2 .y-button {
    background-color: #efe2c0
}

[data-theme=beige] .sort_s_2 .y-button {
    background-color: #f5f1e8
}

[data-theme=green] .sort_s_2 .y-button {
    background-color: #e0eee1
}

[data-theme=dark] .sort_s_2 .y-button {
    background-color: #111
}

[data-theme=default] .sort_s_2 .y-button {
    color: #191919
}

[data-theme=blue] .sort_s_2 .y-button,[data-theme=yellow] .sort_s_2 .y-button,[data-theme=beige] .sort_s_2 .y-button,[data-theme=green] .sort_s_2 .y-button {
    color: rgba(0,0,0,.9)
}

[data-theme=dark] .sort_s_2 .y-button {
    color: rgba(255,255,255,.6)
}

.sort_s {
    margin: .04rem
}

.sort_s:nth-child(4n-3) {
    margin-left: 0
}

.book_s {
    position: relative;
    margin: .12rem;
    border-radius: .1rem;
    background-color: #fff;
    padding: .16rem
}

.book_s .tagh_s {
    display: flex;
    justify-content: space-between
}

.book_s .titl_s_1 {
    font-family: PingFang SC;
    font-style: normal;
    font-weight: 600;
    font-size: .15rem;
    line-height: .23rem
}

[data-theme=default] .book_s .titl_s_1 {
    color: #191919
}

[data-theme=blue] .book_s .titl_s_1,[data-theme=yellow] .book_s .titl_s_1,[data-theme=beige] .book_s .titl_s_1,[data-theme=green] .book_s .titl_s_1 {
    color: rgba(0,0,0,.9)
}

[data-theme=dark] .book_s .titl_s_1 {
    color: rgba(255,255,255,.6)
}

.book_s .subt_s {
    font-family: PingFang SC;
    font-style: normal;
    font-weight: 400;
    font-size: .14rem;
    line-height: .22rem
}

[data-theme=default] .book_s .subt_s {
    color: gray
}

[data-theme=blue] .book_s .subt_s,[data-theme=yellow] .book_s .subt_s,[data-theme=beige] .book_s .subt_s,[data-theme=green] .book_s .subt_s {
    color: rgba(0,0,0,.48)
}

[data-theme=dark] .book_s .subt_s {
    color: rgba(255,255,255,.4)
}

.book_s ul {
    display: flex;
    justify-content: space-between;
    margin-top: .12rem
}

.book_s li {
    padding: .08rem .08rem 0;
    width: calc(25% - .06rem);
    box-sizing: border-box;
    border-radius: .06rem;
    text-align: center
}

.book_s li p:nth-of-type(1) {
    font-family: PingFang SC;
    font-style: normal;
    font-weight: 600;
    font-size: .14rem;
    line-height: .18rem
}

.book_s li p:nth-of-type(2) {
    font-family: PingFang SC;
    font-style: normal;
    font-weight: 400;
    font-size: .12rem;
    line-height: .12rem;
    transform: scale(.83);
    transform-origin: center
}

.book_s li:nth-of-type(1) {
    background: rgba(214,218,210,.9)
}

.book_s li:nth-of-type(2) {
    background: rgba(216,231,218,.9)
}

.book_s li:nth-of-type(3) {
    background: rgba(234,229,217,.9)
}

.book_s li:nth-of-type(4) {
    background: rgba(230,217,223,.9)
}

.book_s img {
    display: block;
    width: 54%;
    margin: .04rem auto 0;
    border-radius: .03rem .03rem 0 0
}

.ddlb_s {
    padding: .11rem 0;
    border-radius: 99.99rem
}

[data-theme=default] .ddlb_s,[data-theme=blue] .ddlb_s,[data-theme=yellow] .ddlb_s,[data-theme=beige] .ddlb_s,[data-theme=green] .ddlb_s {
    color: #fff
}

[data-theme=dark] .ddlb_s {
    color: rgba(255,255,255,.9)
}

[data-theme=default] .ddlb_s,[data-theme=blue] .ddlb_s,[data-theme=yellow] .ddlb_s,[data-theme=beige] .ddlb_s,[data-theme=green] .ddlb_s {
    background-color: #e5353e
}

[data-theme=dark] .ddlb_s {
    background-color: #ff4d55
}

.topt_s {
    font-family: PingFang SC;
    font-style: normal;
    font-weight: 500;
    font-size: .14rem;
    line-height: .18rem
}

.bott_s {
    font-family: PingFang SC;
    font-style: normal;
    font-weight: 400;
    font-size: .09rem;
    line-height: .13rem
}

.y-dialog__tit {
    margin: 0 -.06rem
}

.y-dialog__clo {
    bottom: -.56rem
}

.open_s_1 {
    width: .68rem;
    height: .28rem;
    margin-right: .12rem;
    border-radius: .24rem
}

[data-theme=default] .open_s_1,[data-theme=blue] .open_s_1,[data-theme=yellow] .open_s_1,[data-theme=beige] .open_s_1,[data-theme=green] .open_s_1,[data-theme=dark] .open_s_1 {
    background-color: rgba(229,53,62,.1)
}

.open_s {
    position: relative;
    width: 100%;
    height: 100%
}

.open_s:before {
    content: "打开App";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    font-family: PingFang SC;
    font-style: normal;
    font-weight: 600;
    font-size: .12rem;
    line-height: .16rem;
    white-space: nowrap
}

[data-theme=default] .open_s:before {
    color: #e5353e
}

[data-theme=blue] .open_s:before {
    color: #e5353e
}

[data-theme=yellow] .open_s:before {
    color: #e5353e
}

[data-theme=beige] .open_s:before {
    color: #e5353e
}

[data-theme=green] .open_s:before {
    color: #e5353e
}

[data-theme=dark] .open_s:before {
    color: #ff4d55
}