@charset "utf-8";
/* ==========================================================================
   fanqie.css —— 番茄小说风格 UI 设计系统
   在 template5_*.css / template3_*.css / style.min.css / footer4.css 之后引入，
   以「同名类覆盖 + 统一设计变量」的方式接管全站视觉，不改动任何 PHP 逻辑。
   单位说明：全站以 px 为主（375px 设计稿），保证各页面渲染尺寸一致。
   ========================================================================== */

:root {
    --fq-red: #FF4D4F;
    --fq-red-deep: #F5222D;
    --fq-orange: #FF7A45;
    --fq-grad: linear-gradient(135deg, #FF7A45 0%, #FF4D4F 100%);
    --fq-grad-soft: linear-gradient(135deg, #FFF1EC 0%, #FFECEC 100%);

    --fq-text: #1F1F1F;
    --fq-text-2: #8A8A8E;
    --fq-text-3: #B8B8BD;
    --fq-line: #F0F1F3;

    --fq-bg: #F5F6F8;
    --fq-card: #FFFFFF;

    --fq-r-sm: 8px;
    --fq-r: 12px;
    --fq-r-lg: 16px;
    --fq-pill: 999px;

    --fq-sd: 0 2px 12px rgba(0, 0, 0, .06);
    --fq-sd-up: 0 -2px 12px rgba(0, 0, 0, .05);
    --fq-tabbar-h: 52px;
}

/* --------------------------------------------------------------------------
   1. 基础重置与全局
   -------------------------------------------------------------------------- */
html, body {
    /* 注意：不加 !important，阅读页需要 JS 动态改 body 背景色 */
    background: var(--fq-bg);
    color: var(--fq-text);
    font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB",
        "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    font-size: 14px;
    overflow-x: hidden;
}

.body_sytle {
    background: var(--fq-bg) !important;
    overflow: visible;
}

/* 统一细边框/圆角基调 */
img { border-radius: 0; }

/* 给有底部 tabbar 的页面留出安全距离 */
body { padding-bottom: 0; }
body.fq-has-tabbar { padding-bottom: var(--fq-tabbar-h) !important; }

/* 通用卡片化容器 */
.fq-card {
    background: var(--fq-card);
    border-radius: var(--fq-r);
    box-shadow: var(--fq-sd);
    overflow: hidden;
}

/* 番茄红文字/按钮工具类 */
.fq-red { color: var(--fq-red) !important; }
.fq-grad-bg { background: var(--fq-grad) !important; color: #fff !important; }

/* 章节/榜单等序号徽标 */
.fq-badge {
    display: inline-block;
    padding: 1px 6px;
    border-radius: 4px;
    font-size: 11px;
    line-height: 16px;
    color: var(--fq-red);
    background: #FFF1F0;
    border: 1px solid #FFD6D6;
}

/* --------------------------------------------------------------------------
   2. 顶部标题栏（header5 的 .head_tit_box）
   -------------------------------------------------------------------------- */
.head_tit_box {
    position: sticky;
    top: 0;
    z-index: 60;
    height: 48px;
    line-height: 48px;
    background: #fff;
    border-bottom: 1px solid var(--fq-line);
    text-align: center;
    box-shadow: none;
}
.head_tit_box h1 {
    height: 48px;
    line-height: 48px;
    font-size: 17px;
    font-weight: 600;
    color: var(--fq-text);
    letter-spacing: .5px;
}
.head_return_page_but {
    position: absolute;
    left: 0;
    top: 0;
    width: 48px;
    height: 48px;
    background: none !important;
}
.head_return_page_but::before {
    content: "";
    position: absolute;
    left: 18px;
    top: 17px;
    width: 11px;
    height: 11px;
    border-left: 2px solid #1F1F1F;
    border-bottom: 2px solid #1F1F1F;
    transform: rotate(45deg);
    border-radius: 1px;
}
.head_menu_but_box {
    position: absolute;
    right: 0;
    top: 0;
    height: 48px;
    padding-right: 14px;
}
.head_menu_but {
    display: inline-block;
    width: 22px;
    height: 22px;
    vertical-align: middle;
    background: none !important;
    position: relative;
}
.head_menu_but::before,
.head_menu_but::after {
    content: "";
    position: absolute;
    left: 2px;
    width: 18px;
    height: 2px;
    border-radius: 2px;
    background: #1F1F1F;
}
.head_menu_but::before { top: 6px; box-shadow: 0 6px 0 #1F1F1F; }
.head_menu_but::after { bottom: 2px; }

/* 侧滑菜单弹层 */
.pop_up_menu_box > i {
    background: rgba(0, 0, 0, .45) !important;
}
.pum_box {
    border-radius: 0 0 var(--fq-r-lg) var(--fq-r-lg);
    overflow: hidden;
}
.pum_tit_box {
    border-bottom: 1px solid var(--fq-line);
}
.pum_nav_list_ul li strong {
    font-size: 13px;
    color: var(--fq-text);
}
.pum_nav_list_ul li .pum_icon {
    border-radius: var(--fq-pill);
    background: #FFF1F0;
    overflow: hidden;
}
.pum_but_box a {
    background: var(--fq-grad) !important;
    color: #fff !important;
    border-radius: var(--fq-pill) !important;
    border: none !important;
}

/* --------------------------------------------------------------------------
   3. 首页顶部：男女 tab + 胶囊搜索框
   -------------------------------------------------------------------------- */
.i_nav_fixed_box {
    position: sticky;
    top: 0;
    z-index: 60;
    background: #fff;
    box-shadow: 0 1px 0 var(--fq-line);
}
.i_nav_box {
    background: #fff !important;
    height: 52px;
    padding: 0 14px;
    display: flex;
    align-items: center;
    box-sizing: border-box;
}
.i_nav_list {
    display: flex;
    align-items: center;
    flex: 0 0 auto;
}
.i_nav_list .nav_but {
    display: inline-block;
    margin-right: 16px;
    padding: 0;
    height: 52px;
    line-height: 52px;
    position: relative;
    background: none !important;
}
.i_nav_list .nav_but strong,
.body_sytle_girl .i_nav_list .nav_but strong {
    font-size: 17px;
    font-weight: 400;
    color: var(--fq-text-3) !important;
    line-height: 52px;
    transition: all .18s;
}
.i_nav_list .nav_but.hover strong,
.body_sytle_girl .i_nav_list .nav_but.hover strong {
    font-size: 19px;
    font-weight: 700;
    color: var(--fq-text) !important;
}
.i_nav_list .nav_but span,
.body_sytle_girl .i_nav_list .nav_but span {
    display: none !important;
    background: none !important;
}
.i_nav_list .nav_but.hover::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 6px;
    transform: translateX(-50%);
    width: 18px;
    height: 3px;
    border-radius: 3px;
    background: var(--fq-grad);
}

/* 胶囊搜索框 */
.i_search_box {
    flex: 1 1 auto;
    margin: 0 0 0 4px !important;
    padding: 0 !important;
    height: 32px !important;
    background: #F2F3F5 !important;
    border-radius: var(--fq-pill) !important;
    overflow: hidden;
}
.i_search_box a {
    display: block;
    height: 32px !important;
    line-height: 32px !important;
    padding-left: 30px !important;
    font-size: 13px !important;
    color: var(--fq-text-3) !important;
    background: none !important;
    position: relative;
    text-align: left;
}
.i_search_box a::before {
    content: "";
    position: absolute;
    left: 10px;
    top: 9px;
    width: 11px;
    height: 11px;
    border: 1.6px solid var(--fq-text-3);
    border-radius: 50%;
}
.i_search_box a::after {
    content: "";
    position: absolute;
    left: 20px;
    top: 20px;
    width: 5px;
    height: 1.6px;
    background: var(--fq-text-3);
    transform: rotate(45deg);
    border-radius: 2px;
}

/* 顶部右侧用户/搜索小图标（老模板残留） */
.i_h_user_but, .i_h_search_but { opacity: .75; }

/* --------------------------------------------------------------------------
   4. Banner 轮播
   -------------------------------------------------------------------------- */
.i_slide_box {
    padding: 12px 12px 4px;
    background: #fff;
}
.i_slide_box .swiper-container {
    border-radius: var(--fq-r);
    overflow: hidden;
    box-shadow: var(--fq-sd);
}
.i_slide_box .swiper-slide img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: var(--fq-r);
}
.i_slide_box .swiper-pagination-bullet {
    width: 5px;
    height: 5px;
    background: rgba(255, 255, 255, .6);
    opacity: 1;
    margin: 0 3px !important;
}
.i_slide_box .swiper-pagination-bullet-active {
    width: 14px;
    border-radius: 3px;
    background: #fff;
}

/* --------------------------------------------------------------------------
   5. 金刚区（分类 / 免费 / 最近阅读 / 充值 / 个人中心）
   -------------------------------------------------------------------------- */
.i_classify {
    background: #fff !important;
    padding: 12px 0 6px !important;
    display: block !important;
    margin-bottom: 8px;
}
.i_classify ul {
    display: flex !important;
    flex-wrap: wrap;
}
.i_classify li {
    display: block !important;
    flex: 1 1 20%;
    max-width: 20%;
    box-sizing: border-box;
}
.i_classify li a {
    padding: 0 !important;
    display: block;
    font-size: 12px !important;
    color: var(--fq-text-2) !important;
    line-height: 1.4;
}
.i_classify li a i {
    width: 42px !important;
    height: 42px !important;
    margin: 0 auto 6px !important;
    border-radius: 50%;
    background-color: #FFF1F0 !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 22px 22px !important;
    position: relative;
}
.i_classify li a i::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 50%;
    background: var(--fq-grad-soft);
    z-index: -1;
}
.i_classify li a i.icon-fl {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FF4D4F' stroke-width='2' stroke-linecap='round'%3E%3Crect x='3' y='3' width='7' height='7' rx='2'/%3E%3Crect x='14' y='3' width='7' height='7' rx='2'/%3E%3Crect x='3' y='14' width='7' height='7' rx='2'/%3E%3Crect x='14' y='14' width='7' height='7' rx='2'/%3E%3C/svg%3E") !important;
}
.i_classify li a i.icon-free {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FF4D4F' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M12 3l2.6 5.3 5.9.9-4.3 4.1 1 5.8-5.2-2.7-5.2 2.7 1-5.8L3.5 9.2l5.9-.9z'/%3E%3C/svg%3E") !important;
}
.i_classify li a i.icon-ranking {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FF4D4F' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M12 7v5l3 2'/%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3C/svg%3E") !important;
}
.i_classify li a i.icon-vip {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FF4D4F' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M3 8l4 3 5-7 5 7 4-3-2 11H5z'/%3E%3C/svg%3E") !important;
}
.i_classify li a i.icon-hd {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FF4D4F' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21c0-4.4 3.6-7 8-7s8 2.6 8 7'/%3E%3C/svg%3E") !important;
}

/* --------------------------------------------------------------------------
   6. 模块标题 + 书籍卡片
   -------------------------------------------------------------------------- */
.i_module_box {
    background: transparent !important;
    margin-bottom: 12px !important;
    overflow: visible;
}
.i_module_tit {
    height: auto !important;
    margin: 0 !important;
    padding: 14px 14px 8px;
    background: #fff;
    text-align: left !important;
}
.i_module_tit h2 {
    height: auto !important;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.i_module_tit h2 strong {
    height: auto !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    color: var(--fq-text) !important;
    line-height: 1.3 !important;
    margin: 0 !important;
    position: relative;
    padding-left: 11px;
}
.i_module_tit h2 strong::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
    height: 15px;
    border-radius: 3px;
    background: var(--fq-grad);
}
.i_module_tit h2 a,
.i_module_list_more {
    float: none !important;
    margin: 0 !important;
    padding: 0 14px 0 0 !important;
    height: auto !important;
    font-size: 13px !important;
    color: var(--fq-text-3) !important;
    background: none !important;
    position: relative;
    line-height: 1.3 !important;
    text-align: right !important;
}
.i_module_tit h2 a::after,
.i_module_list_more::after {
    content: "";
    position: absolute;
    right: 3px;
    top: 50%;
    width: 6px;
    height: 6px;
    margin-top: -4px;
    border-top: 1.5px solid var(--fq-text-3);
    border-right: 1.5px solid var(--fq-text-3);
    transform: rotate(45deg);
    border-radius: 1px;
}
.i_module_list_more strong { color: var(--fq-text-3) !important; background: none !important; padding-right: 14px !important; }

/* 横向封面卡（首页前两个模块） */
.i_images_list {
    background: #fff;
    padding: 4px 6px 14px;
}
.i_images_ul {
    display: flex !important;
    flex-wrap: wrap;
    margin: 0 !important;
    padding: 0 !important;
}
.i_images_ul > li {
    flex: 0 0 25%;
    max-width: 25%;
    box-sizing: border-box;
    padding: 0 6px;
    margin: 0 0 10px !important;
    display: block !important;
    float: none !important;
    width: auto !important;
}
.i_images_img {
    position: relative;
    border-radius: var(--fq-r-sm);
    overflow: hidden;
    box-shadow: 0 3px 10px rgba(0, 0, 0, .12);
    background: #EFEFEF;
    aspect-ratio: 3 / 4.1;
}
.i_images_img img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
    display: block;
    border-radius: 0;
}
.i_images_ul > li h3,
.i_images_list h3 {
    margin: 7px 0 0 !important;
    font-size: 13px !important;
    color: var(--fq-text) !important;
    line-height: 1.35 !important;
    height: 36px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    font-weight: 400;
    text-align: left;
}

/* 图文列表卡（首页后面模块、详情页推荐） */
.i_images_text_list { background: #fff; padding: 0 14px 6px; }
.i_images_text_ul { margin: 0 !important; padding: 0 !important; }
.i_images_text_ul > li {
    display: block !important;
    float: none !important;
    width: auto !important;
    padding: 12px 0 !important;
    border-bottom: 1px solid var(--fq-line);
    margin: 0 !important;
}
.i_images_text_ul > li:last-child { border-bottom: none; }
.i_images_text_ul > li > a {
    display: flex !important;
    align-items: flex-start;
    gap: 12px;
}
.i_images_text_ul .i_images_img {
    flex: 0 0 76px;
    width: 76px !important;
    height: 102px !important;
    aspect-ratio: auto;
    border-radius: var(--fq-r-sm);
    box-shadow: 0 3px 10px rgba(0, 0, 0, .12);
}
.i_images_text_ul .i_images_txt_box {
    flex: 1 1 auto;
    min-width: 0;
    display: block !important;
}
.i_images_text_ul .i_images_txt_box h3 {
    margin: 0 0 6px !important;
    font-size: 15px !important;
    font-weight: 600;
    color: var(--fq-text);
    line-height: 1.35;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}
.i_images_text_ul .i_images_txt_box p {
    margin: 0 0 8px !important;
    font-size: 12.5px !important;
    color: var(--fq-text-2) !important;
    line-height: 1.5;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    height: 38px;
}
.i_images_txt_other {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 12px;
    color: var(--fq-text-3);
    overflow: hidden;
}
.i_images_txt_other strong {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    overflow: hidden;
}
.i_images_txt_other strong i {
    flex: 0 0 auto;
    padding: 1px 6px;
    border-radius: 4px;
    font-size: 11px !important;
    line-height: 16px;
    color: var(--fq-red);
    background: #FFF1F0;
    border: 1px solid #FFDCDC;
}
.i_images_txt_other strong b {
    font-size: 11.5px !important;
    color: var(--fq-text-2);
    font-weight: 400;
    padding: 1px 6px;
    border-radius: 4px;
    background: #F5F6F8;
    white-space: nowrap;
}
.i_images_txt_other em {
    flex: 0 0 auto;
    font-size: 11.5px !important;
    color: var(--fq-text-3) !important;
}

/* --------------------------------------------------------------------------
   7. 榜单 / 列表行（.r_img_ul）
   -------------------------------------------------------------------------- */
.r_img_list_box { background: transparent !important; padding: 0 !important; }
.r_img_ul { padding: 0 !important; margin: 0 !important; background: transparent; }
.r_img_ul > li {
    background: #fff;
    margin: 0 12px 10px;
    padding: 12px;
    border-radius: var(--fq-r);
    box-shadow: var(--fq-sd);
    display: block !important;
    float: none !important;
    width: auto !important;
    border: none !important;
}
.r_img_ul > li > a { display: flex; gap: 12px; align-items: flex-start; }
.r_img {
    position: relative;
    flex: 0 0 74px;
    width: 74px !important;
    height: 99px !important;
    border-radius: var(--fq-r-sm);
    overflow: hidden;
    background: #EFEFEF;
    box-shadow: 0 3px 10px rgba(0, 0, 0, .12);
}
.r_img img { width: 100% !important; height: 100% !important; object-fit: cover; }
.r_img em {
    position: absolute;
    left: 0;
    top: 0;
    min-width: 20px;
    height: 18px;
    line-height: 18px;
    padding: 0 5px;
    font-size: 11px;
    font-style: normal;
    font-weight: 700;
    color: #fff;
    background: linear-gradient(135deg, #FFB36B, #FF7A45);
    border-radius: var(--fq-r-sm) 0 var(--fq-r-sm) 0;
}
.r_img_ul > li:nth-child(1) .r_img em { background: linear-gradient(135deg, #FF7A45, #FF4D4F); }
.r_img_ul > li:nth-child(2) .r_img em { background: linear-gradient(135deg, #FFA940, #FF7A45); }
.r_img_ul > li:nth-child(3) .r_img em { background: linear-gradient(135deg, #FFC069, #FFA940); }
.r_img_text { flex: 1 1 auto; min-width: 0; }
.r_img_text h3 {
    margin: 0 0 6px !important;
    font-size: 15.5px !important;
    font-weight: 600;
    color: var(--fq-text);
    line-height: 1.35;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}
.r_img_text p {
    margin: 0 0 8px !important;
    font-size: 12.5px !important;
    color: var(--fq-text-2) !important;
    line-height: 1.5;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    height: 38px;
}
.r_img_text .i_images_txt_other { justify-content: flex-start; gap: 8px; }

/* --------------------------------------------------------------------------
   8. 分类 / 排行 顶部 tab
   -------------------------------------------------------------------------- */
.c_list_tab_box, .c_list_tab_box_2 {
    display: flex !important;
    align-items: center;
    gap: 8px;
    width: auto !important;
    max-width: none !important;
    height: auto !important;
    margin: 0 !important;
    padding: 12px 14px !important;
    background: #fff !important;
    border: none !important;
    border-bottom: 1px solid var(--fq-line) !important;
    border-radius: 0 !important;
    overflow-x: auto;
    white-space: nowrap;
    position: sticky;
    top: 48px;
    z-index: 50;
    box-sizing: border-box;
}
.c_list_tab_box a, .c_list_tab_box_2 a {
    flex: 0 0 auto !important;
    display: block !important;
    float: none !important;
    width: auto !important;
    padding: 6px 16px !important;
    height: auto !important;
    line-height: 1.3 !important;
    font-size: 14px !important;
    color: var(--fq-text-2) !important;
    background: #F5F6F8 !important;
    border-radius: var(--fq-pill) !important;
    border: none !important;
    box-sizing: border-box;
}
.c_list_tab_box a.hover,
.c_list_tab_box a.active,
.c_list_tab_box_2 a.hover,
.c_list_tab_box_2 a.active {
    color: #fff !important;
    background: var(--fq-grad) !important;
    font-weight: 600;
}

/* 分类页九宫格 */
.c_list_box { padding: 0 !important; background: transparent; }
.c_list_ul {
    display: flex !important;
    flex-wrap: wrap;
    padding: 12px !important;
    margin: 0 !important;
    background: transparent !important;
    overflow: visible !important;
}
.c_list_ul > li {
    height: auto !important;
    overflow: visible !important;
}
.c_list_ul > li > a {
    height: auto !important;
    min-height: 92px;
    overflow: hidden !important;
    background: #fff !important;
    background-image: none !important;
}
.c_list_ul > li > a span {
    display: block !important;
    height: auto !important;
    line-height: 1.3 !important;
    margin: 0 !important;
    overflow: visible !important;
    color: var(--fq-text) !important;
}
.c_list_ul > li {
    flex: 0 0 33.333%;
    max-width: 33.333%;
    box-sizing: border-box;
    padding: 6px;
    display: block !important;
    float: none !important;
}
.c_list_ul > li > a {
    display: block;
    padding: 18px 6px;
    background: #fff;
    border-radius: var(--fq-r);
    box-shadow: var(--fq-sd);
    text-align: center;
    color: var(--fq-text);
    font-size: 15px;
    font-weight: 500;
    transition: transform .15s;
}
.c_list_ul > li > a:active { transform: scale(.96); }
.c_list_ul > li > a span { display: block; }
.c_list_ul > li > a::before {
    content: "";
    display: block;
    width: 34px;
    height: 34px;
    margin: 0 auto 8px;
    border-radius: 50%;
    background: var(--fq-grad-soft);
}

/* 搜索页 */
.s_body_box, .search_box, .s_search_box { background: #fff; }
.s_search_box, .search_box { padding: 10px 14px !important; }
.s_search_box input, .search_box input, .s_body_box input[type=text] {
    height: 36px !important;
    border-radius: var(--fq-pill) !important;
    background: #F2F3F5 !important;
    border: none !important;
    padding: 0 16px !important;
    font-size: 14px;
    color: var(--fq-text);
}
.s_search_box .s_search_but, .search_box .search_but, .s_search_but {
    background: var(--fq-grad) !important;
    color: #fff !important;
    border-radius: var(--fq-pill) !important;
    border: none !important;
}
.s_hot_tit, .s_history_tit { color: var(--fq-text) !important; font-weight: 600; }
.s_hot_ul li a, .s_history_ul li a {
    background: #F5F6F8 !important;
    border-radius: var(--fq-pill) !important;
    color: var(--fq-text-2) !important;
    border: none !important;
    padding: 6px 14px !important;
}

/* --------------------------------------------------------------------------
   9. 书籍详情页（.bd_*）
   结构：.bd_head_box(白卡) > .bd_head_info(封面+标题 横排) + 简介 + 更新 + 目录
   -------------------------------------------------------------------------- */
.bd_head_box {
    background: #fff !important;
    margin: 12px !important;
    padding: 14px !important;
    border-radius: var(--fq-r) !important;
    box-shadow: var(--fq-sd);
    box-sizing: border-box;
    width: auto !important;
}

.bd_head_open_vip {
    margin: 0 0 14px !important;
    height: auto !important;
    border-radius: var(--fq-r) !important;
    overflow: hidden;
    background: var(--fq-grad-soft) !important;
}
.bd_head_open_vip a {
    display: block !important;
    height: 42px !important;
    line-height: 42px !important;
    padding: 0 14px !important;
    text-align: center;
    font-size: 13.5px !important;
    font-weight: 600;
    color: var(--fq-red) !important;
    background: none !important;
    position: relative;
}
.bd_head_open_vip a::after {
    content: "›";
    position: absolute;
    right: 14px;
    font-size: 18px;
    color: var(--fq-red);
}

.bd_head_info {
    background: transparent !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    display: flex;
    gap: 14px;
}
.bd_head_info_img {
    flex: 0 0 96px;
    width: 96px !important;
    height: 128px !important;
    border-radius: var(--fq-r-sm);
    overflow: hidden;
    background: #EFEFEF;
    box-shadow: 0 4px 14px rgba(0, 0, 0, .16);
}
.bd_head_info_img img { width: 100% !important; height: 100% !important; object-fit: cover; }
.bd_head_info_txt { flex: 1 1 auto; min-width: 0; display: block !important; }
.bd_head_info_txt h1 {
    font-size: 19px !important;
    font-weight: 700;
    color: var(--fq-text);
    line-height: 1.35;
    margin: 0 0 8px !important;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}
.bd_head_info .i_images_txt_other { justify-content: flex-start; gap: 8px; margin-bottom: 6px; }
.bd_head_info_other {
    font-size: 12.5px !important;
    color: var(--fq-text-3) !important;
    margin: 3px 0 !important;
}
.bd_head_info_other span, .bd_head_info_other em {
    font-size: 12.5px !important;
    color: var(--fq-text-3) !important;
    font-style: normal;
}

/* 简介 */
.bd_description_box {
    background: #F7F8FA;
    border-radius: var(--fq-r-sm);
    padding: 10px 12px;
    margin: 12px 0 0 !important;
    width: 100% !important;
    box-sizing: border-box;
}
.bd_description_box p {
    font-size: 13px !important;
    color: var(--fq-text-2) !important;
    line-height: 1.6 !important;
    margin: 0 !important;
}
.bd_description_open p {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}
.bd_description_box a {
    display: block;
    clear: both;
    text-align: right;
    margin-top: 6px;
    height: 18px;
    line-height: 18px;
    font-size: 12px;
    color: var(--fq-red) !important;
}
.bd_description_box.bd_description_open p {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    height: auto !important;
    max-height: 66px;
}
.bd_description_box a::after { content: "展开"; }
.bd_description_open a::after { content: "收起"; }

/* 更新行 */
.bd_li_renewal_box {
    margin: 12px 0 0 !important;
    padding: 10px 12px;
    background: #FFF8F5;
    border-radius: var(--fq-r-sm);
    font-size: 13px;
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100% !important;
    box-sizing: border-box;
}
.bd_li_renewal_box strong {
    flex: 0 0 auto;
    padding: 1px 7px;
    border-radius: 4px;
    font-size: 11px;
    color: #fff;
    background: var(--fq-grad);
}
.bd_li_renewal_box a {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 13px !important;
    color: var(--fq-text-2) !important;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/* 目录 */
.bd_directory_tit {
    margin: 18px 0 8px !important;
    font-size: 16px !important;
    font-weight: 700;
    color: var(--fq-text) !important;
    width: 100% !important;
    position: relative;
    padding-left: 11px;
}
.bd_directory_tit::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
    height: 15px;
    border-radius: 3px;
    background: var(--fq-grad);
}
.bd_directory_tit span { font-size: 12.5px !important; color: var(--fq-text-3) !important; font-weight: 400; }

.bd_list_ul {
    display: flex !important;
    flex-wrap: wrap;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}
.bd_list_ul > li {
    flex: 0 0 50%;
    max-width: 50%;
    box-sizing: border-box;
    padding: 0 !important;
    margin: 0 !important;
    float: none !important;
    width: auto !important;
    border: none !important;
}
.bd_list_ul > li a {
    display: block;
    padding: 11px 8px;
    margin: 4px;
    background: #F7F8FA;
    border-radius: var(--fq-r-sm);
    font-size: 13px !important;
    color: var(--fq-text-2) !important;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    text-align: center;
}
.bd_list_ul > li a:active { background: #FFECEC; color: var(--fq-red) !important; }

.bd_list_more {
    display: block;
    margin: 12px 0 0 !important;
    padding: 11px 0 !important;
    text-align: center;
    background: #F7F8FA;
    border-radius: var(--fq-r-sm);
    font-size: 13.5px !important;
    color: var(--fq-text-2) !important;
    width: 100% !important;
    position: relative;
}
.bd_list_more::after {
    content: "";
    display: inline-block;
    width: 6px;
    height: 6px;
    margin-left: 6px;
    vertical-align: 1px;
    border-right: 1.5px solid var(--fq-text-3);
    border-bottom: 1.5px solid var(--fq-text-3);
    transform: rotate(45deg);
}

/* 底部操作条 */
.bd_but_box {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 90;
    background: #fff;
    padding: 8px 12px calc(8px + env(safe-area-inset-bottom));
    box-shadow: var(--fq-sd-up);
    display: flex;
    gap: 10px;
    box-sizing: border-box;
}
.bd_but_box a {
    display: block !important;
    float: none !important;
    width: auto !important;
    flex: 1 1 0;
    height: 42px !important;
    line-height: 42px !important;
    border-radius: var(--fq-pill) !important;
    text-align: center;
    font-size: 15px !important;
    font-weight: 600;
    background: #F5F6F8 !important;
    color: var(--fq-text-2) !important;
}
.bd_but_box a.buts_1 {
    background: var(--fq-grad) !important;
    color: #fff !important;
    box-shadow: 0 6px 16px rgba(255, 77, 79, .3);
}
.bd_but_box a.buts_2 {
    background: #FFF1F0 !important;
    color: var(--fq-red) !important;
}
.bd_but_box a.disabled {
    background: #F5F6F8 !important;
    color: var(--fq-text-3) !important;
}

/* 主编推荐模块（详情页内） */
.main_recommend {
    background: #fff;
    margin: 12px;
    padding: 12px;
    border-radius: var(--fq-r);
    box-shadow: var(--fq-sd);
}
.main_recommend_tit {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
}
.main_recommend_tit h2 {
    font-size: 16px !important;
    font-weight: 700;
    color: var(--fq-text);
    position: relative;
    padding-left: 11px;
}
.main_recommend_tit h2::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
    height: 15px;
    border-radius: 3px;
    background: var(--fq-grad);
}
.main_recommend_but {
    font-size: 12.5px !important;
    color: var(--fq-text-3) !important;
}
.main_recommend .i_images_list { padding: 0 !important; }

/* --------------------------------------------------------------------------
   10. 阅读页（沉浸式）
   重要：阅读页由 JS 通过 $('body div').css('background-color',...) 动态换肤，
        因此本区块一律不写 background / color 的 !important，避免破坏换肤。
   -------------------------------------------------------------------------- */
.v-content { min-height: 100vh; }
.rt-bar {
    backdrop-filter: blur(10px);
    box-shadow: 0 1px 0 rgba(0, 0, 0, .05);
}
.rt-bar .row { height: 46px !important; display: flex; align-items: center; }
.rt-bar .col.title {
    font-size: 15px;
    font-weight: 600;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.rt-bar .col.link a { font-size: 13px; }


/* 正文排版（字号/行高由 JS 换肤控件接管，此处不写 !important） */
.m-box {
    font-size: 18px;
    line-height: 1.9;
    padding: 62px 20px 96px;
    max-width: 720px;
    margin: 0 auto;
    box-sizing: border-box;
}
.m-box p {
    font-size: 18px;
    line-height: 1.9;
    text-indent: 2em;
    margin: 0 0 14px;
    padding: 0;
}
.m-box p img { width: 100%; display: block; }

/* 漫画阅读：图片满屏 */
.m-box.fq-comic {
    padding: 62px 0 96px !important;
    max-width: 100% !important;
}
.m-box.fq-comic p {
    margin: 0 !important;
    text-indent: 0;
}
.m-box.fq-comic img { width: 100%; display: block; }

.novel p { font-size: 17px; line-height: 1.9; }

/* 底部章节控制条 */
.read-footer {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 80;
    backdrop-filter: blur(10px);
    box-shadow: var(--fq-sd-up);
    padding-bottom: env(safe-area-inset-bottom);
}
.read-footer > .control {
    display: flex;
    height: 52px;
    align-items: center;
    max-width: 720px;
    margin: 0 auto;
}
.read-footer > .control .item {
    flex: 1 1 0;
    text-align: center;
}
.read-footer > .control .item a {
    display: block;
    height: 52px;
    line-height: 52px;
    font-size: 15px;
}
.read-footer > .control .item.next a {
    color: var(--fq-red);
    font-weight: 600;
}

/* 上/下一章浮动菜单 */
.chapter-menu {
    backdrop-filter: blur(10px);
    box-shadow: var(--fq-sd-up);
}
.chapter-menu .row { display: flex; height: 52px; align-items: center; }
.chapter-menu .row .col { flex: 1 1 0; text-align: center; }
.chapter-menu .row .col a { font-size: 15px; }
.chapter-menu .row .col a.shelf.active { color: var(--fq-red); }

/* 目录抽屉 */
.m-list ul {
    border-radius: var(--fq-r-lg) !important;
    overflow: hidden;
    box-shadow: 0 10px 40px rgba(0, 0, 0, .2);
}
.m-list ul li {
    font-size: 15px !important;
    color: var(--fq-text) !important;
    border-bottom: 1px solid var(--fq-line) !important;
    height: 50px !important;
    line-height: 50px !important;
}
.m-list ul li:active { background: #F7F8FA; }
.m-list button {
    height: 48px !important;
    line-height: 48px !important;
    font-size: 15px !important;
    color: var(--fq-text-2) !important;
    border-radius: var(--fq-pill) !important;
    font-weight: 600;
}
.m-font-txt ul, .m-color-txt ul {
    border: none !important;
    border-radius: var(--fq-r);
    overflow: hidden;
    background: #F5F6F8 !important;
    height: 46px !important;
}
.m-font-txt ul li, .m-color-txt ul li {
    font-size: 14px !important;
    line-height: 46px !important;
    color: var(--fq-text-2) !important;
    border-right: 1px solid #fff !important;
}
.m-font-txt ul li:active, .m-color-txt ul li:active { background: #FFECEC; color: var(--fq-red) !important; }

/* 追书悬浮球 */
.circle-box .portal {
    background: var(--fq-grad) !important;
    color: #fff !important;
    border-radius: var(--fq-pill) !important;
    box-shadow: 0 6px 18px rgba(255, 77, 79, .35);
}

/* 回到顶部 */
.backtop .top {
    background: rgba(255, 255, 255, .96) !important;
    color: var(--fq-red) !important;
    border: 1px solid #FFDCDC !important;
    border-radius: var(--fq-pill) !important;
    box-shadow: var(--fq-sd);
}

/* --------------------------------------------------------------------------
   11. 书架 / 阅读记录（template3 体系）
   -------------------------------------------------------------------------- */
.w-shelfTab { background: #fff !important; padding: 10px 14px !important; }
.top {
    border: none !important;
    background: #F2F3F5 !important;
    border-radius: var(--fq-pill) !important;
    overflow: hidden;
    height: 36px !important;
    padding: 3px;
    box-sizing: border-box;
}
.top .toptab {
    color: var(--fq-text-2) !important;
    border: none !important;
    font-size: 14px !important;
    line-height: 30px !important;
    border-radius: var(--fq-pill) !important;
}
.top .toptab.active {
    color: #fff !important;
    background: var(--fq-grad) !important;
    font-weight: 600;
}
.w-shelfCleanUp a, .r_img_edit_close, .r_img_edit_open {
    color: var(--fq-red) !important;
}
.r_book_num strong, .r_book_num em { color: var(--fq-text-2) !important; font-size: 13px; }
.r_book_num em { margin-left: 8px; color: var(--fq-text-3) !important; }

/* 书架卡片网格 */
.w-shelfBooklist .item, #shelf-container .item {
    background: #fff;
    border-radius: var(--fq-r) !important;
    box-shadow: var(--fq-sd);
    border: none !important;
    overflow: hidden;
}
.w-shelfBooklist img, #shelf-container img { border-radius: var(--fq-r-sm); }

/* --------------------------------------------------------------------------
   12. 个人中心
   -------------------------------------------------------------------------- */
.person-content { background: var(--fq-bg) !important; margin-bottom: 60px; }
.person-top {
    height: 150px !important;
    background: var(--fq-grad) !important;
    position: relative;
}
.person-top::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 26px;
    background: var(--fq-bg);
    border-radius: 22px 22px 0 0;
}
.person-info {
    background: transparent !important;
    background-image: none !important;
    margin-top: -110px !important;
    padding: 0 14px !important;
    position: relative;
    z-index: 2;
}
.person-info::after {
    content: "";
    position: absolute;
    left: 14px;
    right: 14px;
    top: 68px;
    bottom: 0;
    background: #fff;
    border-radius: var(--fq-r);
    box-shadow: var(--fq-sd);
    z-index: -1;
}
.person-Photo { background: transparent !important; }
.person-Photo img {
    width: 78px !important;
    height: 78px !important;
    margin: 0 auto !important;
    border: 3px solid #fff !important;
    border-radius: 50% !important;
    box-shadow: 0 4px 14px rgba(0, 0, 0, .14);
    display: block;
}
.person-infoRight {
    background: transparent !important;
    height: auto !important;
    padding: 10px 14px 14px;
    text-align: center;
}
.person-userName { font-size: 17px !important; font-weight: 700; color: var(--fq-text) !important; }
.person-id { font-size: 12px !important; color: var(--fq-text-3) !important; margin-top: 4px; }
.person-id span { background: #F2F3F5 !important; color: var(--fq-text-2) !important; }
.person-coin {
    background: #F7F8FA !important;
    border-radius: var(--fq-r-sm);
    margin: 0 14px !important;
    padding: 12px 0 !important;
}
.person-coin span:first-child::after { background: var(--fq-line) !important; }
.person-coin .l-center-pay { font-size: 20px !important; color: var(--fq-text) !important; font-weight: 700; }
.person-coin span var { color: var(--fq-red) !important; font-weight: 700; }
.person-coin span p { color: var(--fq-text-3) !important; }
.y-vip-menu .l-unVip { font-size: 13px !important; color: var(--fq-text-2) !important; }
.person-info .btn-sign, #sign {
    border-radius: var(--fq-pill) !important;
    padding: 5px 16px !important;
    font-size: 13px !important;
    background: var(--fq-grad) !important;
    color: #fff !important;
    border: none !important;
    box-shadow: 0 4px 12px rgba(255, 77, 79, .28);
}
.person-list { margin: 12px 14px 0 !important; border-radius: var(--fq-r); overflow: hidden; box-shadow: var(--fq-sd); background: #fff; }
.person-list .mui-table-view { background: transparent; }
.person-list .mui-table-view::before, .person-list .mui-table-view::after { display: none !important; }
.person-list .person-listLi {
    padding: 0 14px !important;
    border-bottom: 1px solid var(--fq-line) !important;
}
.person-list .person-listLi:last-child { border-bottom: none !important; }
.person-list .person-listLi a {
    font-size: 15px !important;
    color: var(--fq-text) !important;
    line-height: 52px !important;
    height: 52px !important;
    padding: 0 !important;
}
.person-list .person-listLi .mui-navigate-right::after { color: var(--fq-text-3) !important; }
.person-list .person-listLi .icon-source-list {
    display: none !important;
}
.person-list .person-listLi a { padding-left: 4px !important; }
.logout {
    display: block !important;
    background: #fff !important;
    color: var(--fq-red) !important;
    border: 1px solid #FFDCDC !important;
    border-radius: var(--fq-pill) !important;
    width: 100% !important;
    margin: 16px 0 4px !important;
    height: 46px !important;
    line-height: 44px !important;
    font-size: 15px !important;
    font-weight: 600;
    text-align: center !important;
    box-shadow: var(--fq-sd);
    box-sizing: border-box;
}
.logout:link, .logout:visited, .logout:hover, .logout:active { color: var(--fq-red) !important; }
.mui-switch.mui-active { background-color: var(--fq-red) !important; border-color: var(--fq-red) !important; }

/* --------------------------------------------------------------------------
   13. 充值 / VIP / 签到 / 消息 / 客服 / 分享
   -------------------------------------------------------------------------- */
.charge_ul, .pay_list, .vip_list { padding: 12px 14px !important; }
.charge_ul li, .pay_list li, .vip_list li {
    background: #fff !important;
    border-radius: var(--fq-r) !important;
    box-shadow: var(--fq-sd);
    border: 1px solid transparent !important;
    margin-bottom: 10px;
    overflow: hidden;
}
.charge_ul li.hover, .pay_list li.hover, .vip_list li.hover,
.charge_ul li.active, .pay_list li.active, .vip_list li.active {
    border-color: var(--fq-red) !important;
    background: #FFF8F7 !important;
}
.pay_but, .charge_but, .btn-pay, .vip_but {
    background: var(--fq-grad) !important;
    color: #fff !important;
    border-radius: var(--fq-pill) !important;
    border: none !important;
    height: 46px !important;
    line-height: 46px !important;
    font-size: 16px !important;
    font-weight: 600;
    box-shadow: 0 6px 16px rgba(255, 77, 79, .3);
}

/* 客服/消息/账单 通用列表 */
.nav_list_ul li, .umsg_list li, .report_list li, .kefu_list li {
    background: #fff !important;
    border-radius: var(--fq-r) !important;
    box-shadow: var(--fq-sd);
    margin: 10px 14px !important;
    border: none !important;
    overflow: hidden;
}
.nav_list_ul li a, .umsg_list li a { font-size: 15px !important; color: var(--fq-text) !important; }

/* --------------------------------------------------------------------------
   14. 底部导航（番茄四宫格）
   -------------------------------------------------------------------------- */
.footer {
    position: fixed !important;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 100;
    height: calc(var(--fq-tabbar-h) + env(safe-area-inset-bottom));
    padding-bottom: env(safe-area-inset-bottom);
    background: rgba(255, 255, 255, .97) !important;
    backdrop-filter: blur(12px);
    border-top: 1px solid var(--fq-line) !important;
    display: flex !important;
    box-shadow: var(--fq-sd-up);
}
.footer ul { display: flex !important; width: 100%; margin: 0; padding: 0; }
.footer li {
    display: flex !important;
    flex: 1 1 0;
    align-items: center;
    justify-content: center;
    text-align: center;
}
.footer li a {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    width: 100%;
    height: var(--fq-tabbar-h) !important;
    line-height: 1 !important;
    font-size: 10.5px !important;
    color: #9A9A9F !important;
    position: relative;
    background: none !important;
}
.footer li a i,
.footer li a svg {
    width: 23px !important;
    height: 23px !important;
    background: none !important;
    margin: 0 !important;
    top: 0 !important;
    display: block;
    flex: 0 0 auto;
}
.footer li a svg { fill: currentColor; }
.footer li a span { display: block; font-size: 10.5px; line-height: 1; }
.footer li a.active {
    color: var(--fq-red) !important;
    font-weight: 600;
}
.footer li a.active svg { fill: var(--fq-red); }

/* --------------------------------------------------------------------------
   15. 空状态 / 加载 / 提示
   -------------------------------------------------------------------------- */
.content_null_box {
    background: transparent !important;
    padding: 80px 20px !important;
    text-align: center;
}
.content_null_box img { margin: 0 auto 14px; opacity: .5; }
.content_null_box span {
    font-size: 13.5px !important;
    color: var(--fq-text-3) !important;
    line-height: 1.6 !important;
}
.content_null_box span i { color: var(--fq-red) !important; font-style: normal; }
.content_null_but_box { margin-top: 20px; }
.content_null_but_box a {
    display: inline-block;
    padding: 9px 28px;
    border-radius: var(--fq-pill);
    background: var(--fq-grad);
    color: #fff !important;
    font-size: 14px;
    box-shadow: 0 6px 16px rgba(255, 77, 79, .28);
}
.loading_box { padding: 16px 0 !important; }
.loading_box span { font-size: 12.5px !important; color: var(--fq-text-3) !important; }

/* layer 弹窗番茄化 */
.layui-layer, .layui-m-layer {
    border-radius: var(--fq-r-lg) !important;
    overflow: hidden;
}
.layui-m-layerbtn span, .layui-layer-btn a {
    color: var(--fq-red) !important;
    font-weight: 600 !important;
}

/* 二维码/客服区块 */
.i_erweima {
    background: #fff;
    margin: 12px 14px;
    padding: 18px;
    border-radius: var(--fq-r);
    box-shadow: var(--fq-sd);
    text-align: center;
}
.i_erweima img {
    width: 120px !important;
    height: 120px !important;
    margin: 0 auto 10px;
    border-radius: var(--fq-r-sm);
}
.i_erweima p { font-size: 12.5px !important; color: var(--fq-text-3) !important; line-height: 1.8 !important; }

/* --------------------------------------------------------------------------
   16. 滚动条美化（桌面预览用）
   -------------------------------------------------------------------------- */
::-webkit-scrollbar { width: 0; height: 0; }

/* --------------------------------------------------------------------------
   17. 其余内页（账单 / 消息 / 客服 / 修改密码 / 充值 / VIP / 听书 / 搜索 等）
   -------------------------------------------------------------------------- */

/* 内页顶栏（report / profile / umsg / video / lodge 等复用 .rt-bar）
   注意：不加 !important，阅读页需要 JS 动态改背景色 */
.rt-bar {
    background: #fff;
    box-shadow: 0 1px 0 var(--fq-line);
    z-index: 60;
}
.rt-bar .col.icon { flex: 0 0 46px; text-align: center; }
.rt-bar .col.icon a { display: block; height: 46px; line-height: 46px; }
.rt-bar .col.icon svg { display: inline-block; vertical-align: middle; }
.rt-bar .col.title { flex: 1 1 auto; text-align: center; }
.rt-bar .col.link { flex: 0 0 60px; text-align: right; padding-right: 14px; }

/* 账单页 充值/签到/分享 分段器 */
.rt-tabs {
    display: flex;
    gap: 8px;
    padding: 12px 14px;
    background: #fff;
    border-bottom: 1px solid var(--fq-line);
}
.rt-tabs .item { flex: 1 1 0; }
.rt-tabs .item a {
    display: block !important;
    height: auto !important;
    line-height: 1.3 !important;
    min-height: 0 !important;
    padding: 9px 0 !important;
    text-align: center;
    border: none !important;
    border-radius: var(--fq-pill) !important;
    background: #F5F6F8 !important;
    background-image: none !important;
    box-shadow: none !important;
    color: var(--fq-text-2) !important;
    font-size: 14px !important;
    position: relative;
}
.rt-tabs .item a::before, .rt-tabs .item a::after { display: none !important; }
.rt-tabs .item a.active {
    background: var(--fq-grad) !important;
    background-image: var(--fq-grad) !important;
    color: #fff !important;
    font-weight: 600;
}

/* 账单 / 消息列表 */
.rt-list { padding: 10px 0; }
.rt-list ul, ul.notice { padding: 0 !important; margin: 0 !important; }
.rt-list ul > li, ul.notice > li {
    background: #fff;
    border-radius: var(--fq-r);
    box-shadow: var(--fq-sd);
    margin: 0 14px 10px !important;
    padding: 14px !important;
    border: none !important;
    list-style: none;
    font-size: 14px;
    color: var(--fq-text);
    line-height: 1.6;
}

/* 充值页 */
.re_head_box { background: #fff !important; padding: 16px 14px !important; }
.re_user_info_box { background: transparent !important; }
.re_user_info { font-size: 13.5px !important; color: var(--fq-text-2) !important; }
.re_user_info em { font-style: normal; }
.re_user_info strong { color: var(--fq-text) !important; font-weight: 600; }
.re_user_info strong span { color: var(--fq-red) !important; font-weight: 700; }
.re_user_info .line-css { color: var(--fq-line); margin: 0 8px; }
.re_main_box { background: transparent !important; }
.re_list_box { background: #fff; margin: 12px 14px !important; padding: 14px !important; border-radius: var(--fq-r); box-shadow: var(--fq-sd); }
.re_list_tit h2 { font-size: 16px !important; font-weight: 700; color: var(--fq-text); }
.re_list_tit h2 span { font-size: 12.5px !important; color: var(--fq-text-3) !important; font-weight: 400; }
.re_list_ul { display: flex !important; flex-wrap: wrap; gap: 10px; padding: 0 !important; margin: 12px 0 0 !important; }
.re_list_ul > li {
    flex: 0 0 calc(50% - 5px);
    max-width: calc(50% - 5px);
    box-sizing: border-box;
    border: 1.5px solid var(--fq-line) !important;
    border-radius: var(--fq-r) !important;
    background: #fff !important;
    overflow: hidden;
    padding: 0 !important;
    float: none !important;
}
.re_list_ul > li.hover,
.re_list_ul > li.active {
    border-color: var(--fq-red) !important;
    background: #FFF8F7 !important;
}
.re_list_ul > li > a { display: block; padding: 14px 10px !important; text-align: center; }
.re_list_ul > li strong { display: block; font-size: 18px !important; font-weight: 700; color: var(--fq-text); }
.re_list_ul > li em { display: block; font-style: normal; font-size: 12.5px !important; color: var(--fq-text-2) !important; margin-top: 4px; }
.re_list_ul > li b { display: block; font-size: 11.5px !important; color: var(--fq-red) !important; font-weight: 400; margin-top: 6px; }
.re_list_ul > li i { display: inline-block; font-style: normal; font-size: 11px !important; color: #fff; background: var(--fq-grad); border-radius: 4px; padding: 1px 6px; margin-top: 6px; }
.re_but_box { padding: 16px 0 4px !important; }
.re_but_box a {
    display: block;
    height: 46px;
    line-height: 46px;
    text-align: center;
    border-radius: var(--fq-pill);
    background: var(--fq-grad);
    color: #fff !important;
    font-size: 16px;
    font-weight: 600;
    box-shadow: 0 6px 16px rgba(255, 77, 79, .3);
}
.re_rule_box { margin: 12px 14px !important; padding: 14px !important; background: #fff; border-radius: var(--fq-r); box-shadow: var(--fq-sd); }
.re_rule_box p { font-size: 12.5px !important; color: var(--fq-text-3) !important; line-height: 1.8 !important; margin: 0 !important; }

/* VIP 页 */
.y-vip-mian { padding: 0 14px !important; margin: 0 !important; background: transparent !important; }
.y-vip-top { height: 0; overflow: hidden; }
.y-vip-mian > li {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    background: #fff;
    border-radius: var(--fq-r);
    box-shadow: var(--fq-sd);
    padding: 16px 14px;
    margin-bottom: 10px;
}
.y-vip-title span { font-size: 15.5px !important; font-weight: 600; color: var(--fq-text); }
.y-vip-title p { font-size: 12.5px !important; color: var(--fq-text-2) !important; line-height: 1.6 !important; margin: 6px 0 0 !important; }
.y-vip-paymenu { padding: 18px 14px calc(24px + var(--fq-tabbar-h)); }
.y-vip-paymenu a {
    display: block;
    height: 46px;
    line-height: 46px;
    text-align: center;
    border-radius: var(--fq-pill);
    background: var(--fq-grad);
    color: #fff !important;
    font-size: 16px;
    font-weight: 600;
    box-shadow: 0 6px 16px rgba(255, 77, 79, .3);
}

/* 客服页 */
.main .mian-d1 {
    background: #fff !important;
    border-radius: var(--fq-r);
    box-shadow: var(--fq-sd);
    margin: 12px 14px !important;
    height: auto !important;
}
.main .main-txt { padding: 18px 16px !important; font-size: 15px !important; color: var(--fq-text); line-height: 1.7; }

/* 修改账号密码 */
.pcont ul { margin: 14px 0 !important; padding: 0 14px; }
.pcont li { margin: 10px 0 !important; }
.pcont li.mb {
    background: #fff;
    border-radius: var(--fq-r);
    box-shadow: var(--fq-sd);
    border-bottom: none !important;
    overflow: hidden;
}
.pcont li input {
    font-size: 15px !important;
    height: 48px !important;
    line-height: 48px;
    padding: 0 16px !important;
    text-align: left !important;
    background: transparent;
    width: 100% !important;
    box-sizing: border-box;
    color: var(--fq-text);
}
.pcont li button {
    width: 100% !important;
    margin: 20px 0 !important;
    height: 46px !important;
    border-radius: var(--fq-pill) !important;
    background: var(--fq-grad) !important;
    color: #fff !important;
    font-size: 16px !important;
    font-weight: 600;
    box-shadow: 0 6px 16px rgba(255, 77, 79, .3);
}

/* AJAX 片段：限免角标 */
.r_img > strong {
    position: absolute;
    right: 0;
    bottom: 0;
    padding: 1px 6px;
    font-size: 10px;
    font-weight: 400;
    color: #fff;
    background: var(--fq-grad);
    border-radius: var(--fq-r-sm) 0 var(--fq-r-sm) 0;
}

/* AJAX 片段：阅读记录章节行 */
.r_img_chaptername {
    font-size: 12px !important;
    color: var(--fq-text-3) !important;
    line-height: 1.6;
    margin-top: 2px;
}

/* AJAX 片段：分类标签 */
.i_images_txt_other b .tag,
.i_images_txt_other .tag {
    display: inline-block;
    font-size: 11.5px;
    color: var(--fq-text-2);
    background: #F5F6F8;
    border-radius: 4px;
    padding: 1px 6px;
    margin-right: 4px;
}

/* AJAX 片段：书架卡片 */
.w-shelfBooklist ul, #shelf-container { padding: 0 !important; margin: 0 !important; }
.w-shelfBookinfo, #shelf-container > li {
    display: inline-block;
    vertical-align: top;
    width: 33.333%;
    padding: 8px;
    box-sizing: border-box;
    list-style: none;
    background: transparent !important;
    box-shadow: none !important;
    margin: 0 !important;
}
.w-shelfBookinfo .w-bookPic, #shelf-container .w-bookPic {
    position: relative;
    width: 100%;
    aspect-ratio: 3 / 4.1;
    border-radius: var(--fq-r-sm);
    overflow: hidden;
    background: #EFEFEF;
    box-shadow: 0 3px 10px rgba(0, 0, 0, .12);
}
.w-shelfBookinfo .w-bookPic img, #shelf-container .w-bookPic img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
    border-radius: 0 !important;
}
.w-shelfBookinfo .w-bookName, #shelf-container .w-bookName {
    margin-top: 6px;
    font-size: 12.5px !important;
    color: var(--fq-text) !important;
    line-height: 1.35;
    height: 34px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}
.w-shelfBookinfo .w-bookChapter, #shelf-container .w-bookChapter {
    font-size: 11.5px !important;
    color: var(--fq-text-3) !important;
}
.w-bookNew span {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 2;
    padding: 1px 5px;
    font-size: 10px;
    color: #fff;
    background: var(--fq-grad);
    border-radius: var(--fq-r-sm) 0 var(--fq-r-sm) 0;
}
.w-operation1 { background: #fff !important; box-shadow: var(--fq-sd-up); }
.w-Select { color: var(--fq-text-2) !important; }
.w-delete { color: var(--fq-red) !important; }

/* 搜索页输入框 */
.iSearch input[type=text], .search_input, .s_input {
    border-radius: var(--fq-pill) !important;
    background: #F2F3F5 !important;
    border: none !important;
}

/* 听书 / 视频 卡片（btype=3） */
.w-bookPic { position: relative; }

/* 底部 tabbar 页面统一留白 */
.has-footer, body.fq-has-tabbar .body_sytle { padding-bottom: var(--fq-tabbar-h); }

/* --------------------------------------------------------------------------
   18. 番茄首页（真实番茄布局）：顶栏 / 频道 tab / 排行榜卡 / 双列大封面
   -------------------------------------------------------------------------- */

/* 顶栏：搜索胶囊 + 分类按钮 */
.fq-topbar {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 14px 6px;
    background: #fff;
    position: sticky;
    top: 0;
    z-index: 90;
}
.fq-topbar .fq-search {
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    gap: 8px;
    height: 36px;
    padding: 0 14px;
    border-radius: 18px;
    background: #F2F3F5;
    color: #9C9EA5;
    font-size: 14px;
    text-decoration: none;
}
.fq-topbar .fq-search svg { width: 17px; height: 17px; flex: 0 0 17px; }
.fq-topbar .fq-cate {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 5px;
    color: var(--fq-text);
    font-size: 15px;
    text-decoration: none;
    padding-left: 12px;
    border-left: 1px solid var(--fq-line);
    height: 22px;
}
.fq-topbar .fq-cate svg { width: 16px; height: 16px; color: #4E5160; }

/* 频道 tab 行 */
.fq-channels {
    display: flex;
    align-items: center;
    gap: 22px;
    padding: 6px 14px 0;
    background: #fff;
    position: sticky;
    top: 50px;
    z-index: 89;
    overflow-x: auto;
    white-space: nowrap;
}
.fq-channels a {
    position: relative;
    display: inline-block;
    padding: 8px 0 10px;
    font-size: 17px;
    color: #6B6E78;
    text-decoration: none;
    line-height: 1.2;
    flex: 0 0 auto;
}
.fq-channels a.active {
    color: var(--fq-text);
    font-weight: 700;
    font-size: 18px;
}
.fq-channels a.active::after {
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 3px;
    width: 22px;
    height: 3.5px;
    border-radius: 2px;
    background: var(--fq-red);
}

/* 排行榜卡 */
.fq-rank-card {
    margin: 10px 12px 0;
    background: #fff;
    border-radius: var(--fq-r);
    box-shadow: var(--fq-sd);
    padding: 0 12px 4px;
}
.fq-rank-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #F4F5F7;
}
.fq-rank-tabs {
    display: flex;
    align-items: center;
    gap: 16px;
    overflow-x: auto;
}
.fq-rank-tabs span {
    flex: 0 0 auto;
    padding: 13px 0 11px;
    font-size: 15px;
    color: #8A8C93;
    line-height: 1.2;
    cursor: default;
}
.fq-rank-tabs span.active {
    color: var(--fq-red);
    font-weight: 700;
    font-size: 16px;
}
.fq-rank-more {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 2px;
    font-size: 12px;
    color: #9C9EA5;
    text-decoration: none;
}
.fq-rank-more svg { width: 12px; height: 12px; }

.fq-rank-list {
    display: flex;
    flex-wrap: wrap;
    padding: 4px 0 8px;
}
.fq-rank-item {
    display: flex;
    align-items: center;
    width: 50%;
    box-sizing: border-box;
    padding: 9px 4px 9px 0;
    text-decoration: none;
    overflow: hidden;
}
.fq-rank-item .fq-rank-no {
    flex: 0 0 20px;
    width: 20px;
    font-style: normal;
    font-size: 17px;
    font-weight: 800;
    font-family: Georgia, "Times New Roman", serif;
    color: #FFA53F;
    text-align: center;
}
.fq-rank-item .fq-rank-no.fq-top3 { color: var(--fq-red); }
.fq-rank-item .fq-rank-cover {
    flex: 0 0 46px;
    width: 46px;
    height: 62px;
    margin: 0 9px 0 4px;
    border-radius: 5px;
    overflow: hidden;
    background: #F0F1F3;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .12);
}
.fq-rank-item .fq-rank-cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fq-rank-item .fq-rank-txt { flex: 1 1 auto; min-width: 0; }
.fq-rank-item .fq-rank-txt h3 {
    margin: 0 0 6px;
    font-size: 14px;
    font-weight: 600;
    color: var(--fq-text);
    line-height: 1.3;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}
.fq-rank-item .fq-rank-txt p {
    margin: 0;
    font-size: 11px;
    color: #A5A7AE;
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* 双列大封面 */
.fq-big-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    padding: 14px 12px 2px;
}
.fq-big-item {
    flex: 0 0 calc(50% - 6px);
    width: calc(50% - 6px);
    text-decoration: none;
    display: block;
}
.fq-big-item .fq-big-pic {
    position: relative;
    width: 100%;
    aspect-ratio: 3 / 4;
    border-radius: var(--fq-r);
    overflow: hidden;
    background: #F0F1F3;
    box-shadow: 0 4px 14px rgba(0, 0, 0, .14);
}
.fq-big-item .fq-big-pic img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fq-big-item .fq-big-free {
    position: absolute;
    left: 0;
    top: 0;
    padding: 2px 8px;
    font-size: 11px;
    font-weight: 600;
    color: #fff;
    background: var(--fq-grad);
    border-radius: var(--fq-r) 0 var(--fq-r) 0;
}
.fq-big-item h3 {
    margin: 8px 0 3px;
    font-size: 14.5px;
    font-weight: 600;
    color: var(--fq-text);
    line-height: 1.35;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.fq-big-item p {
    margin: 0;
    font-size: 11.5px;
    color: #9C9EA5;
    line-height: 1.4;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.fq-big-item p em {
    font-style: normal;
    color: var(--fq-red);
    font-weight: 700;
    margin-right: 6px;
}

/* 首页分区标题与番茄 tab 的衔接 */
.body_sytle .i_module_box { margin-top: 18px; }

/* 排行榜 meta 分类名：番茄式淡橙 */
.fq-rank-item .fq-rank-txt p .fq-cate-name { color: #C9825F; }

/* 性别选择引导卡 */
.fq-sex-card {
    margin: 12px;
    background: linear-gradient(135deg, #FFF6F5, #FFF0EC);
    border: 1px solid #FFE3DD;
    border-radius: var(--fq-r);
    padding: 16px 14px 18px;
    text-align: center;
}
.fq-sex-card .fq-sex-tit {
    font-size: 17px;
    font-weight: 700;
    color: var(--fq-text);
}
.fq-sex-card > p {
    margin: 6px 0 14px;
    font-size: 12px;
    color: #A5766B;
}
.fq-sex-btns {
    display: flex;
    gap: 12px;
}
.fq-sex-btns a {
    flex: 1 1 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    height: 44px;
    border-radius: var(--fq-pill);
    font-size: 15px;
    font-weight: 600;
    color: #fff !important;
    text-decoration: none;
    background: var(--fq-grad);
    box-shadow: 0 5px 14px rgba(255, 77, 79, .28);
}
.fq-sex-btns a[data-sex="2"] {
    background: linear-gradient(135deg, #FF7DA5, #FF5B8C);
    box-shadow: 0 5px 14px rgba(255, 91, 140, .28);
}
.fq-sex-btns svg { width: 18px; height: 18px; }

/* 大封面区块标题 */
.fq-sec { margin-top: 20px; }
.fq-sec-head {
    display: flex;
    align-items: center;
    padding: 0 14px 2px;
}
.fq-sec-head i {
    width: 4px;
    height: 16px;
    border-radius: 2px;
    background: var(--fq-grad);
    margin-right: 8px;
}
.fq-sec-head b {
    font-size: 17px;
    font-weight: 700;
    color: var(--fq-text);
}

/* --------------------------------------------------------------------------
   19. 番茄书架页
   -------------------------------------------------------------------------- */

/* 顶栏：大标题 + 搜索 */
.fq-shelf-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 14px 4px;
    background: #fff;
    position: sticky;
    top: 0;
    z-index: 90;
}
.fq-shelf-top h1 {
    margin: 0;
    font-size: 21px;
    font-weight: 800;
    color: var(--fq-text);
}
.fq-shelf-top .fq-shelf-search {
    color: #4E5160;
    padding: 4px;
}
.fq-shelf-top .fq-shelf-search svg { width: 21px; height: 21px; display: block; }

/* 副行：统计 + 管理 */
.fq-shelf-sub {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 4px 14px 0;
    background: #fff;
}
.fq-shelf-hist {
    margin-left: 12px;
    font-size: 13px;
    color: #6E6E73 !important;
    text-decoration: none;
}
.fq-shelf-count { font-size: 12.5px; color: #9C9EA5; }
.fq-shelf-ops a {
    font-size: 13.5px;
    color: var(--fq-text);
    text-decoration: none;
    padding: 3px 10px;
    border-radius: 999px;
    background: #F2F3F5;
}
.fq-shelf-ops a.finish { color: var(--fq-red); background: #FFF1F0; }

/* 类型筛选 tab */
.fq-shelf-tabs {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    background: #fff;
    border-bottom: 1px solid var(--fq-line);
    overflow-x: auto;
    white-space: nowrap;
}
.fq-shelf-tabs a {
    flex: 0 0 auto;
    padding: 7px 16px;
    font-size: 14px;
    color: var(--fq-text-2);
    background: #F5F6F8;
    border-radius: 999px;
    text-decoration: none;
}
.fq-shelf-tabs a.active {
    color: var(--fq-red);
    background: #FFECEB;
    font-weight: 600;
}

/* 3 列网格 */
.fq-has-tabbar .w-shelfBooklist { padding: 4px 8px 0; }
.w-shelfBooklist ul, #shelf-container {
    display: flex !important;
    flex-wrap: wrap;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
}
.w-shelfBookinfo, #shelf-container > li {
    display: block !important;
    flex: 0 0 33.333%;
    max-width: 33.333%;
    width: 33.333%;
    box-sizing: border-box;
    padding: 8px 7px !important;
    margin: 0 !important;
    list-style: none;
    background: transparent !important;
    box-shadow: none !important;
}
.w-shelfBookinfo .read_a { display: block; text-decoration: none; }
.w-shelfBookinfo .w-bookPic {
    position: relative;
    width: 100%;
    aspect-ratio: 3 / 4.1;
    border-radius: 8px;
    overflow: hidden;
    background: #F0F1F3;
    box-shadow: 0 3px 10px rgba(0, 0, 0, .12);
}
.w-shelfBookinfo .w-bookPic img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
    border-radius: 0 !important;
    display: block;
}
.w-shelfBookinfo .w-bookPic img[src=""] { visibility: hidden; }
.w-shelfBookinfo .w-bookName {
    margin: 7px 0 3px;
    font-size: 13px !important;
    font-weight: 500;
    color: var(--fq-text) !important;
    line-height: 1.35;
    height: 35px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}
.w-shelfBookinfo .w-bookChapter {
    font-size: 11px !important;
    color: #A5A7AE !important;
    line-height: 1.4;
}
.w-shelfBookinfo .w-bookNew { display: none !important; }

/* 勾选框：仅编辑模式显示 */
.w-shelfBookinfo .mui-checkbox {
    display: none;
    position: absolute;
    left: 5px;
    top: 5px;
    z-index: 3;
    margin: 0 !important;
    padding: 0 !important;
}
.w-shelfBookinfo .mui-checkbox input {
    width: 18px !important;
    height: 18px !important;
    margin: 0 !important;
    -webkit-appearance: none;
    appearance: none;
    border: 1.5px solid #D0D2D8;
    border-radius: 50%;
    background: rgba(255, 255, 255, .9);
    outline: none;
}
.w-shelfBookinfo .mui-checkbox input:checked {
    border-color: var(--fq-red);
    background: var(--fq-red) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m6 12.5 4 4 8-9' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat;
}
#shelf-container.editable .mui-checkbox { display: block; }
#shelf-container.editable .w-bookPic::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, .08);
    border-radius: 8px;
}

/* 编辑操作条 */
.fq-shelf-bar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: var(--fq-tabbar-h);
    z-index: 85;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
    background: rgba(255, 255, 255, .97);
    backdrop-filter: blur(10px);
    box-shadow: var(--fq-sd-up);
}
.fq-shelf-bar .fq-shelf-all {
    flex: 0 0 auto;
    font-size: 14px;
    color: var(--fq-text-2);
}
.fq-shelf-bar .w-delete {
    flex: 1 1 auto;
    text-align: center;
    height: 40px;
    line-height: 40px;
    border-radius: 999px;
    background: var(--fq-grad);
    color: #fff !important;
    font-size: 15px;
    font-weight: 600;
}

/* 空状态 */
.content_null_box {
    background: transparent !important;
    padding: 60px 20px 40px !important;
}
.content_null_box span { color: #9C9EA5 !important; }
.content_null_but_box { margin-top: 16px; }
.content_null_but_box a {
    display: inline-block;
    padding: 9px 28px;
    border-radius: 999px;
    background: var(--fq-grad);
    color: #fff !important;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
}

/* 覆盖 mui checkbox 自带负偏移 */
.w-shelfBookinfo .mui-checkbox input[name=checked] {
    position: static !important;
    left: auto !important;
    top: auto !important;
    float: none !important;
}

/* 番茄风勾选圆圈：压过 mui 黄圈 */
#shelf-container .w-shelfBookinfo .mui-checkbox input[name=checked] {
    border: 2px solid rgba(255, 255, 255, .95) !important;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .25) !important;
    background: rgba(255, 255, 255, .25) !important;
    border-radius: 50% !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}
#shelf-container .w-shelfBookinfo .mui-checkbox input[name=checked]:checked {
    border: 2px solid #fff !important;
    background: var(--fq-red) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m6 12.5 4 4 8-9' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat !important;
    box-shadow: none !important;
}

/* 干掉 mui checkbox 的伪元素黄框 */
#shelf-container .w-shelfBookinfo .mui-checkbox input[name=checked]::before,
#shelf-container .w-shelfBookinfo .mui-checkbox input[name=checked]::after {
    content: none !important;
    display: none !important;
}

/* --------------------------------------------------------------------------
   20. 番茄详情页（奶油底 · 居中封面 · 数据行 · 标签简介 · 书评）
   -------------------------------------------------------------------------- */

.fq-bd {
    min-height: 100vh;
    background: linear-gradient(180deg, #F3EDDD 0%, #F6F2E7 30%, #F6F2E7 100%);
    color: #3B3A34;
    padding-bottom: 88px;
    overflow-x: hidden;
}

/* 顶栏 */
.fq-bd-top {
    position: sticky;
    top: 0;
    z-index: 95;
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 48px;
    padding: 0 12px;
    background: rgba(246, 242, 231, .92);
    backdrop-filter: blur(10px);
}
.fq-bd-back { display: flex; padding: 8px; color: #3B3A34; }
.fq-bd-back svg { width: 21px; height: 21px; }
.fq-bd-top-acts { display: flex; align-items: center; gap: 4px; }
.fq-bd-top-acts .js-join {
    font-size: 14px;
    color: #3B3A34;
    padding: 5px 12px;
    background: rgba(255, 255, 255, .75);
    border-radius: 999px;
    text-decoration: none;
}
.fq-bd-top-acts .js-join.disabled { color: #A9A494; }

/* 主信息区 */
.fq-bd-hero {
    position: relative;
    text-align: center;
    padding: 10px 20px 6px;
    background: linear-gradient(180deg, #EFE7D3 0%, rgba(239, 231, 211, 0) 100%);
}
.fq-bd-cover {
    width: 150px;
    height: 200px;
    margin: 14px auto 0;
    border-radius: 10px;
    overflow: hidden;
    background: #E8E1CE;
    box-shadow: 0 10px 26px rgba(96, 82, 44, .28);
}
.fq-bd-cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fq-bd-title {
    margin: 18px auto 0;
    max-width: 300px;
    font-size: 21px;
    font-weight: 800;
    line-height: 1.45;
    color: #33312A;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}
.fq-bd-author {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 14px;
}
.fq-bd-ava {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: linear-gradient(135deg, #C9A96B, #A9834B);
    color: #fff;
    font-size: 12px;
    overflow: hidden;
}
.fq-bd-author-name { font-size: 14px; color: #55523F; }

/* 数据三栏 */
.fq-bd-stats {
    display: flex;
    margin: 22px 6px 0;
}
.fq-bd-stat {
    flex: 1 1 0;
    display: block;
    text-align: left;
    text-decoration: none;
    padding: 0 10px;
}
.fq-bd-stat + .fq-bd-stat { border-left: 1px solid #E2DAC4; }
.fq-bd-stat b {
    display: block;
    font-size: 19px;
    font-weight: 800;
    color: #33312A;
    line-height: 1.2;
}
.fq-bd-stat b i {
    font-style: normal;
    font-size: 12px;
    font-weight: 500;
    color: #8B8570;
    margin-left: 2px;
}
.fq-bd-stat b em { font-style: normal; }
.fq-bd-stat span {
    display: block;
    margin-top: 4px;
    font-size: 11.5px;
    color: #9A947E;
}

/* 简介 */
.fq-bd-intro { text-align: left; margin-top: 24px; }
.fq-bd-intro-head {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}
.fq-bd-intro-head b { font-size: 16.5px; font-weight: 800; color: #33312A; margin-right: 2px; }
.fq-bd-tag {
    padding: 3px 10px;
    font-size: 11.5px;
    color: #7D7460;
    background: #EDE6D3;
    border-radius: 6px;
}
.fq-bd-tag-hot { color: #B4642D; background: #F3E3CB; }
.fq-bd-intro-txt {
    margin-top: 12px;
    position: relative;
    max-height: 48px;
    overflow: hidden;
    transition: max-height .25s;
}
.fq-bd-intro-txt.open { max-height: 600px; }
.fq-bd-intro-txt p {
    margin: 0;
    font-size: 14.5px;
    line-height: 1.75;
    color: #55523F;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}
.fq-bd-intro-txt.open p { display: block; -webkit-line-clamp: unset; }
.fq-bd-intro-more {
    display: block;
    text-align: right;
    margin-top: 4px;
    font-size: 13.5px;
    color: #8A7B4F !important;
    text-decoration: none;
    font-weight: 600;
}

/* 书评 */
.fq-bd-cmts { text-align: left; margin-top: 26px; }
.fq-bd-cmts-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.fq-bd-cmts-head b { font-size: 16.5px; font-weight: 800; color: #33312A; }
.fq-bd-cmts-head a { font-size: 13px; color: #8A7B4F !important; text-decoration: none; font-weight: 600; }
.fq-bd-cmt-list { list-style: none; margin: 14px 0 0; padding: 0; }
.fq-bd-cmt-list li {
    display: flex;
    gap: 10px;
    margin-bottom: 16px;
}
.fq-bd-cmt-ava {
    flex: 0 0 30px;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    overflow: hidden;
    background: #D9D0B8;
    color: #8A7B4F;
    font-size: 13px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.fq-bd-cmt-ava img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fq-bd-cmt-body { flex: 1 1 auto; min-width: 0; }
.fq-bd-cmt-body p {
    margin: 0;
    font-size: 14.5px;
    line-height: 1.6;
    color: #45433A;
}
.fq-bd-cmt-meta {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 5px;
    font-size: 11.5px;
    color: #A29B85;
}
.fq-bd-cmt-empty {
    margin-top: 14px;
    padding: 22px 0;
    text-align: center;
    font-size: 13px;
    color: #A9A494;
    background: #F0EAD9;
    border-radius: 12px;
}

/* 更新行 + 目录 */
.fq-bd-main { text-align: left; padding: 4px 20px 0; }
.fq-bd-update {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 10px;
    padding: 13px 14px;
    background: #FBF8EF;
    border-radius: 12px;
    text-decoration: none;
    box-shadow: 0 1px 4px rgba(96, 82, 44, .06);
}
.fq-bd-update b {
    flex: 0 0 auto;
    font-size: 13.5px;
    font-weight: 800;
    color: #B4642D;
}
.fq-bd-update span {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 13.5px;
    color: #55523F;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.fq-bd-update i { flex: 0 0 auto; font-style: normal; color: #B9B29B; font-size: 16px; }

.fq-bd-catalog { margin-top: 24px; }
.fq-bd-catalog-head {
    display: flex;
    align-items: baseline;
    gap: 8px;
}
.fq-bd-catalog-head b { flex: 0 0 auto; white-space: nowrap; font-size: 16.5px; font-weight: 800; color: #33312A; }
.fq-bd-catalog-head span {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 11.5px;
    color: #A29B85;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.fq-bd-catalog-head a { flex: 0 0 auto; font-size: 13px; color: #8A7B4F !important; text-decoration: none; font-weight: 600; }
.fq-bd-cata-list {
    list-style: none;
    margin: 12px 0 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0 14px;
}
.fq-bd-cata-list li { min-width: 0; }
.fq-bd-cata-list li a {
    display: block;
    padding: 9px 0;
    font-size: 13px;
    color: #55523F !important;
    text-decoration: none;
    border-bottom: 1px dashed #E5DECA;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* 猜你喜欢 */
.fq-bd-guess { margin-top: 26px; }
.fq-bd-guess-grid {
    display: grid;
    /* minmax(0,1fr)：1fr 隐含 min-content 底限，标题 nowrap 会把列撑宽顶出屏幕 */
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-top: 14px;
}
.fq-bd-guess-item { display: block; min-width: 0; text-decoration: none; }
.fq-bd-guess-pic {
    width: 100%;
    aspect-ratio: 3 / 4;
    border-radius: 10px;
    overflow: hidden;
    background: #E8E1CE;
    box-shadow: 0 4px 12px rgba(96, 82, 44, .14);
}
.fq-bd-guess-pic img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fq-bd-guess-pic.fq-noimg { background: linear-gradient(135deg, #EADFC4, #D9CBA4); }
.fq-bd-guess-item h3 {
    margin: 8px 0 0;
    font-size: 13.5px;
    font-weight: 600;
    color: #45433A;
    line-height: 1.4;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* 底部操作条 */
.fq-bd-bar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 96;
    display: flex;
    gap: 12px;
    padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
    background: rgba(246, 242, 231, .96);
    backdrop-filter: blur(10px);
    box-shadow: 0 -1px 0 rgba(96, 82, 44, .08);
}
.fq-bd-shelf {
    flex: 0 0 112px;
    display: block;
    height: 46px;
    line-height: 46px;
    text-align: center;
    border-radius: 999px;
    background: rgba(255, 255, 255, .85);
    border: 1px solid #D8CDB0;
    color: #6B6552 !important;
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
}
.fq-bd-shelf.disabled { color: #A9A494 !important; border-color: #E2DAC4; }
.fq-bd-read {
    flex: 1 1 auto;
    display: block;
    height: 46px;
    line-height: 46px;
    text-align: center;
    border-radius: 999px;
    background: linear-gradient(135deg, #A9834B, #8A6A3B);
    color: #fff !important;
    font-size: 15.5px;
    font-weight: 700;
    text-decoration: none;
    box-shadow: 0 6px 16px rgba(138, 106, 59, .32);
}

/* --------------------------------------------------------------------------
   21. 番茄个人中心（浅底 · 用户卡 · 金刚区+继续阅读 · 书币福利卡 · 菜单 · 双列推荐）
   -------------------------------------------------------------------------- */

.fq-my {
    min-height: 100vh;
    background: #F6F6F8;
    padding-bottom: calc(16px + var(--fq-tabbar-h));
    overflow-x: hidden;
}

/* 顶栏 */
.fq-my-top {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px 4px;
    background: #F6F6F8;
    position: sticky;
    top: 0;
    z-index: 90;
}
.fq-my-search {
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    gap: 8px;
    height: 36px;
    padding: 0 14px;
    border-radius: 18px;
    background: #FFFFFF;
    color: #9C9EA5;
    font-size: 13.5px;
    text-decoration: none;
}
.fq-my-search svg { width: 16px; height: 16px; flex: 0 0 16px; }
.fq-my-bell { flex: 0 0 auto; display: flex; padding: 7px; color: #3B3B42; }
.fq-my-bell svg { width: 21px; height: 21px; }

/* 用户卡 */
.fq-my-user {
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 16px 16px 14px;
    text-decoration: none;
}
.fq-my-ava {
    flex: 0 0 56px;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    overflow: hidden;
    background: linear-gradient(135deg, #FF9A62, #FF5B8C);
    color: #fff;
    font-size: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.fq-my-ava img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fq-my-user-txt { flex: 1 1 auto; min-width: 0; }
.fq-my-user-txt b {
    display: block;
    font-size: 19px;
    font-weight: 800;
    color: var(--fq-text);
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.fq-my-user-txt em {
    display: block;
    margin-top: 5px;
    font-style: normal;
    font-size: 12.5px;
    color: #85878E;
}
.fq-my-user-txt em i { font-style: normal; font-weight: 700; color: #4E5160; margin: 0 2px; }
.fq-my-arrow { flex: 0 0 auto; font-size: 22px; color: #C2C4CA; line-height: 1; }

/* 白卡通用 */
.fq-my-card {
    background: #fff;
    border-radius: 14px;
    margin: 0 12px 12px;
    padding: 6px 8px;
    box-shadow: 0 1px 6px rgba(0, 0, 0, .04);
}

/* 金刚区 */
.fq-my-grid { display: flex; }
.fq-my-grid a {
    flex: 1 1 0;
    display: block;
    text-align: center;
    text-decoration: none;
    padding: 10px 0 8px;
}
.fq-my-grid i.fq-gi {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    margin: 0 auto 6px;
    border-radius: 13px;
    background: #FFF1F0;
    color: var(--fq-red);
}
.fq-my-grid i.fq-gi svg { width: 21px; height: 21px; }
.fq-my-grid a:nth-child(2) i.fq-gi { background: #FFF6E8; color: #F5A623; }
.fq-my-grid a:nth-child(3) i.fq-gi { background: #EDF3FF; color: #4A7DF0; }
.fq-my-grid a:nth-child(4) i.fq-gi { background: #EFFBF2; color: #34B96F; }
.fq-my-grid a:nth-child(5) i.fq-gi { background: #F3EFFF; color: #8A63E8; }
.fq-my-grid span {
    font-size: 11.5px;
    color: #4E5160;
    display: block;
    white-space: nowrap;
}

/* 继续阅读行 */
.fq-my-continue {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 6px 6px 6px;
    padding: 10px;
    background: #F7F8FA;
    border-radius: 12px;
    text-decoration: none;
}
.fq-my-continue-pic {
    flex: 0 0 38px;
    width: 38px;
    height: 50px;
    border-radius: 6px;
    overflow: hidden;
    background: #ECEDEF;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .12);
}
.fq-my-continue-pic img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fq-my-continue-txt { flex: 1 1 auto; min-width: 0; }
.fq-my-continue-txt b {
    display: block;
    font-size: 14px;
    font-weight: 600;
    color: var(--fq-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.fq-my-continue-txt em {
    display: block;
    margin-top: 4px;
    font-style: normal;
    font-size: 11.5px;
    color: #9C9EA5;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.fq-my-continue-go {
    flex: 0 0 auto;
    font-size: 12.5px;
    color: var(--fq-red);
    font-weight: 600;
}

/* 书币卡 */
.fq-my-coin {
    display: flex;
    align-items: center;
    padding: 14px 10px 12px;
}
.fq-my-coin-item {
    flex: 1 1 0;
    display: flex;
    align-items: baseline;
    gap: 5px;
    text-decoration: none;
    padding-left: 6px;
}
.fq-my-coin-item b {
    font-size: 21px;
    font-weight: 800;
    color: var(--fq-text);
    line-height: 1.1;
    max-width: 110px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.fq-my-coin-item span { font-size: 12px; color: #9C9EA5; }
.fq-my-coin-go {
    flex: 0 0 auto;
    font-size: 13px;
    color: #34B96F;
    font-weight: 600;
    text-decoration: none;
    padding: 0 8px;
}
.fq-my-menu { list-style: none; margin: 0; padding: 2px 6px; }
.fq-my-menu li { border-bottom: 1px solid #F4F5F7; }
.fq-my-menu li:last-child { border-bottom: none; }
.fq-my-menu li > a {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 4px;
    font-size: 14.5px;
    color: var(--fq-text) !important;
    text-decoration: none;
}
.fq-my-arrow2 { margin-left: auto; font-size: 18px; color: #C2C4CA; line-height: 1; }
i.fq-mi {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 9px;
    background: #FFF1F0;
    color: var(--fq-red);
    flex: 0 0 30px;
}
i.fq-mi svg { width: 17px; height: 17px; }
.fq-mi-promo { background: #FFF6E8; color: #F5A623; }
.fq-mi-lock { background: #EDF3FF; color: #4A7DF0; }
.fq-mi-kefu { background: #EFFBF2; color: #34B96F; }
.fq-mi-auto { background: #F3EFFF; color: #8A63E8; }
.fq-my-switch-li {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 4px;
    font-size: 14.5px;
    color: var(--fq-text);
}
.fq-my-switch {
    margin-left: auto;
    width: 46px;
    height: 26px;
    border-radius: 13px;
    background: #E5E6EA;
    position: relative;
    transition: background .2s;
    cursor: pointer;
    flex: 0 0 46px;
}
.fq-my-switch span {
    position: absolute;
    left: 2px;
    top: 2px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .2);
    transition: left .2s;
}
.fq-my-switch.on { background: var(--fq-red); }
.fq-my-switch.on span { left: 22px; }

/* 退出登录 */
.fq-my-logout {
    display: block;
    margin: 2px 12px 12px;
    background: #fff;
    color: var(--fq-red) !important;
    border-radius: 14px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
    box-shadow: 0 1px 6px rgba(0, 0, 0, .04);
}

/* 猜你喜欢双列大图 */
.fq-my-rec { padding: 8px 12px 4px; }
.fq-my-rec-head { padding: 6px 2px 10px; }
.fq-my-rec-head b { font-size: 17px; font-weight: 800; color: var(--fq-text); }
.fq-my-rec-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}
.fq-my-rec-item { display: block; min-width: 0; text-decoration: none; }
.fq-my-rec-pic {
    display: block;
    width: 100%;
    aspect-ratio: 3 / 3.6;
    border-radius: 12px;
    overflow: hidden;
    background: #ECEDEF;
    box-shadow: 0 4px 12px rgba(0, 0, 0, .1);
}
.fq-my-rec-pic img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fq-my-rec-pic.fq-noimg { background: linear-gradient(135deg, #FFE3DD, #FFD1C2); }
.fq-my-rec-item b {
    display: block;
    margin: 8px 0 3px;
    font-size: 14px;
    font-weight: 600;
    color: var(--fq-text);
    line-height: 1.4;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.fq-my-rec-item em {
    display: block;
    font-style: normal;
    font-size: 11.5px;
    color: #9C9EA5;
}

/* ==========================================================================
   22. 榜单页（番茄风：左侧榜单导航 + 右侧排行列表，对照番茄巅峰榜/推荐榜）
   ========================================================================== */
.fq-rk { padding-bottom: calc(var(--fq-tabbar-h) + env(safe-area-inset-bottom)); background: #fff; }

/* ---- 顶部大横幅 ---- */
.fq-rk-hero {
    position: relative;
    padding: 58px 16px 20px;
    text-align: center;
    background:
        radial-gradient(120% 90% at 85% 0%, rgba(255, 214, 165, .55) 0%, rgba(255, 214, 165, 0) 55%),
        radial-gradient(110% 80% at 15% 10%, rgba(255, 228, 200, .6) 0%, rgba(255, 228, 200, 0) 60%),
        linear-gradient(180deg, #FBEEDD 0%, #FDF6EA 60%, #FFFFFF 100%);
}
.fq-rk-back {
    position: absolute;
    left: 8px;
    top: 10px;
    width: 38px;
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #3B2E1E;
    text-decoration: none;
}
.fq-rk-back svg { width: 22px; height: 22px; }
.fq-rk-hero-title {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}
.fq-rk-hero-title b {
    font-size: 27px;
    font-weight: 900;
    letter-spacing: 4px;
    color: #4A3920;
    font-family: "Noto Serif SC", "Songti SC", "SimSun", serif;
}
.fq-rk-laurel { width: 15px; height: 26px; flex-shrink: 0; }
.fq-rk-laurel-r { transform: scaleX(-1); }
.fq-rk-hero-sub {
    margin-top: 7px;
    font-size: 12.5px;
    color: #C9A36B;
    letter-spacing: 2px;
}

/* ---- 频道 tab 行 ---- */
.fq-rk-tabs {
    display: flex;
    align-items: center;
    gap: 22px;
    padding: 13px 16px 11px;
    background: #fff;
    border-bottom: .5px solid var(--fq-line);
    overflow-x: auto;
}
.fq-rk-tabs a,
.fq-rk-tabs span {
    flex-shrink: 0;
    font-size: 15px;
    color: #9A9A9F;
    text-decoration: none;
}
.fq-rk-tabs a.on,
.fq-rk-tabs span.on {
    font-size: 17.5px;
    font-weight: 800;
    color: var(--fq-text);
}

/* ---- 主体：左导航 + 右列表 ---- */
.fq-rk-body {
    display: flex;
    align-items: flex-start;
    background: #fff;
    min-height: 70vh;
}
.fq-rk-side {
    width: 92px;
    flex-shrink: 0;
    position: sticky;
    top: 0;
    align-self: flex-start;
    background: #fff;
    border-right: .5px solid var(--fq-line);
}
.fq-rk-side-item {
    display: block;
    padding: 15px 0;
    text-align: center;
    font-size: 14px;
    color: #6E6E73;
    text-decoration: none;
    position: relative;
}
.fq-rk-side-item.on {
    color: #B08A3E;
    font-weight: 800;
    font-size: 15px;
}
.fq-rk-side-item.on::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 3px;
    height: 18px;
    border-radius: 0 3px 3px 0;
    background: #C89B5A;
}
.fq-rk-main { flex: 1; min-width: 0; }

/* ---- 月榜 / 男生榜 / 女生榜 分栏 ---- */
.fq-rk-sexbar {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 12px 6px;
}
.fq-rk-sexbar a {
    font-size: 14px;
    color: #8A8A8E;
    text-decoration: none;
}
.fq-rk-sexbar a.on {
    color: var(--fq-text);
    font-weight: 800;
}
.fq-rk-sexbar i {
    font-style: normal;
    color: #E5E5E8;
    font-size: 12px;
}
/* ---- 榜单列表 ---- */
.fq-rk-list { list-style: none; margin: 0; padding: 2px 0 10px; }
.fq-rk-item a { display: block; text-decoration: none; }
.fq-rk-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 12px;
}
.fq-rk-num {
    width: 26px;
    flex-shrink: 0;
    text-align: center;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 18px;
    font-style: italic;
    font-weight: 700;
    color: #C9A36B;
}
/* 前三名：金色月桂序号（巅峰榜） */
.fq-rk-num-hot {
    position: relative;
    font-size: 21px;
    color: #A8802F;
}
.fq-rk-num-hot::before,
.fq-rk-num-hot::after {
    content: "";
    position: absolute;
    top: 50%;
    width: 9px;
    height: 22px;
    margin-top: -11px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 30'%3E%3Cpath d='M10 28C4 24 1 15 3 3' fill='none' stroke='%23C89B5A' stroke-width='1.8' stroke-linecap='round'/%3E%3Cpath d='M5 8C3 7 1.5 5.5 1.5 3c2.5 0 4 2 3.5 5zM5.5 15c-2.5 1-5 0-6-2.5 2.5-1 5 0 6 2.5zM7.5 22c-2.5 1.5-5 1-6.5-1.5 2.5-1.5 5-1 6.5 1.5z' fill='%23C89B5A'/%3E%3C/svg%3E") no-repeat center / contain;
    left: -8px;
}
.fq-rk-num-hot::after {
    left: auto;
    right: -8px;
    transform: scaleX(-1);
}
.fq-rk-cover {
    width: 62px;
    height: 84px;
    flex-shrink: 0;
    border-radius: 6px;
    overflow: hidden;
    background: #ECEDEF;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .1);
}
.fq-rk-cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fq-rk-txt { flex: 1; min-width: 0; }
.fq-rk-txt h3 {
    margin: 0;
    font-size: 15px;
    font-weight: 700;
    color: var(--fq-text);
    line-height: 1.4;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.fq-rk-txt p {
    margin: 7px 0 0;
    font-size: 12px;
    color: #9A9A9F;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ---- 巅峰榜：大封面富样式 ---- */
.fq-rk-item-rich .fq-rk-row { padding: 14px 12px 8px; }
.fq-rk-item-rich .fq-rk-num { margin-right: 2px; }
.fq-rk-item-rich .fq-rk-cover { width: 76px; height: 102px; border-radius: 8px; }
.fq-rk-item-rich .fq-rk-txt h3 { font-size: 16px; }
.fq-rk-item-rich .fq-rk-txt p { font-size: 12.5px; margin-top: 9px; }
.fq-rk-reason {
    margin: 0 12px 4px 48px;
    background: #F7F7F8;
    border-radius: 10px;
    padding: 10px 12px;
    font-size: 13px;
    color: #5A5A5F;
    line-height: 1.55;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.fq-rk-reason b { font-weight: 700; color: #3E3E42; }

/* ---- 加载 / 空态 ---- */
.fq-rk-loading {
    text-align: center;
    padding: 12px 0 18px;
    font-size: 12.5px;
    color: #B8B8BD;
}
.fq-rk-empty {
    text-align: center;
    padding: 60px 0 40px;
}
.fq-rk-empty span { display: block; font-size: 14px; color: #9A9A9F; }
.fq-rk-empty a {
    display: inline-block;
    margin-top: 16px;
    padding: 9px 28px;
    border-radius: var(--fq-pill);
    background: var(--fq-grad);
    color: #fff !important;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
}

/* ==========================================================================
   23. 书评页（番茄风：书信息卡 + 书评列表 + 发表面板）
   ========================================================================== */
.fq-cm { padding-bottom: 24px; min-height: 100vh; background: #fff; }

/* ---- 顶栏 ---- */
.fq-cm-top {
    position: sticky;
    top: 0;
    z-index: 20;
    display: flex;
    align-items: center;
    padding: 10px 12px;
    background: #fff;
    border-bottom: .5px solid var(--fq-line);
}
.fq-cm-back {
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--fq-text);
    text-decoration: none;
}
.fq-cm-back svg { width: 22px; height: 22px; }
.fq-cm-top-tit {
    flex: 1;
    font-size: 17px;
    font-weight: 800;
    color: var(--fq-text);
}
.fq-cm-write {
    padding: 6px 14px;
    border-radius: var(--fq-pill);
    background: var(--fq-grad);
    color: #fff !important;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
}

/* ---- 书籍信息卡 ---- */
.fq-cm-book {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 12px;
    padding: 12px;
    border-radius: 14px;
    background: var(--fq-grad-soft);
    text-decoration: none;
}
.fq-cm-book-pic {
    width: 52px;
    height: 70px;
    flex-shrink: 0;
    border-radius: 8px;
    overflow: hidden;
    background: #F3E3DC;
    box-shadow: 0 3px 10px rgba(0, 0, 0, .1);
}
.fq-cm-book-pic img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fq-cm-book-txt { flex: 1; min-width: 0; }
.fq-cm-book-txt h3 {
    margin: 0;
    font-size: 15.5px;
    font-weight: 800;
    color: var(--fq-text);
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.fq-cm-book-txt p {
    margin: 6px 0 0;
    font-size: 12.5px;
    color: #9A9A9F;
}
.fq-cm-book-num { text-align: center; padding-left: 8px; }
.fq-cm-book-num b {
    display: block;
    font-size: 19px;
    font-weight: 800;
    color: var(--fq-red);
    font-family: Georgia, serif;
}
.fq-cm-book-num span { font-size: 11.5px; color: #9A9A9F; }

/* ---- 列表头 ---- */
.fq-cm-head {
    display: flex;
    align-items: center;
    padding: 6px 12px 10px;
}
.fq-cm-head > b { flex: 1; font-size: 16px; font-weight: 800; color: var(--fq-text); }
.fq-cm-sort { display: flex; gap: 8px; }
.fq-cm-sort a {
    padding: 5px 13px;
    border-radius: var(--fq-pill);
    background: #F5F6F8;
    font-size: 13px;
    color: #7A7A80;
    text-decoration: none;
}
.fq-cm-sort a.on { background: var(--fq-grad); color: #fff; font-weight: 600; }

/* ---- 书评列表 ---- */
.fq-cm-list { list-style: none; margin: 0; padding: 0 12px; }
.fq-cm-item { padding: 14px 0; border-bottom: .5px solid var(--fq-line); }
.fq-cm-row { display: flex; gap: 10px; }
.fq-cm-ava {
    width: 36px;
    height: 36px;
    flex-shrink: 0;
    border-radius: 50%;
    overflow: hidden;
    background: linear-gradient(135deg, #FFD9C7, #FFC4B0);
    color: #B4685A;
    font-size: 15px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
}
.fq-cm-ava img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fq-cm-body { flex: 1; min-width: 0; }
.fq-cm-meta { display: flex; align-items: center; gap: 8px; }
.fq-cm-meta b { font-size: 13.5px; font-weight: 700; color: #4A4A4F; }
.fq-cm-meta > span { font-size: 11.5px; color: #B0B0B6; }
.fq-cm-reply {
    margin-left: auto;
    padding: 4px 12px;
    border-radius: var(--fq-pill);
    border: 1px solid #FFD9CF;
    color: var(--fq-red) !important;
    font-size: 12.5px;
    text-decoration: none;
}
.fq-cm-txt {
    margin: 9px 0 0;
    font-size: 14.5px;
    line-height: 1.62;
    color: #2B2B30;
    word-break: break-word;
    white-space: pre-wrap;
}
.fq-cm-sub {
    margin-top: 10px;
    padding: 9px 11px;
    border-radius: 10px;
    background: #F7F7F8;
}
.fq-cm-sub b { font-size: 12.5px; color: #6E6E75; font-weight: 700; }
.fq-cm-sub span { margin-left: 6px; font-size: 11px; color: #B0B0B6; }
.fq-cm-sub p {
    margin: 5px 0 0;
    font-size: 13px;
    line-height: 1.55;
    color: #4A4A4F;
    word-break: break-word;
}

/* ---- 空态 ---- */
.fq-cm-empty { padding: 70px 0 40px; text-align: center; }
.fq-cm-empty span { display: block; font-size: 14px; color: #9A9A9F; }
.fq-cm-empty a {
    display: inline-block;
    margin-top: 16px;
    padding: 9px 26px;
    border-radius: var(--fq-pill);
    background: var(--fq-grad);
    color: #fff !important;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
}

/* ---- 发表面板 ---- */
.fq-cm-sheet {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    z-index: 300;
    background: #fff;
    transform: translateY(100%);
    transition: transform .26s ease;
    display: flex;
    flex-direction: column;
}
.fq-cm-sheet.open { transform: translateY(0); }
.fq-cm-sheet-bar {
    display: flex;
    align-items: center;
    padding: 12px 14px;
    border-bottom: .5px solid var(--fq-line);
}
.fq-cm-close {
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #33333A;
    text-decoration: none;
}
.fq-cm-close svg { width: 20px; height: 20px; }
.fq-cm-sheet-bar > b {
    flex: 1;
    text-align: center;
    font-size: 16.5px;
    font-weight: 800;
    color: var(--fq-text);
}
.fq-cm-send {
    padding: 7px 18px;
    border-radius: var(--fq-pill);
    background: var(--fq-grad);
    color: #fff !important;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
}
.fq-cm-sheet-body { flex: 1; padding: 16px 16px 0; }
.fq-cm-to { margin-bottom: 10px; font-size: 13px; color: #9A9A9F; }
.fq-cm-to b { color: var(--fq-red); }
.fq-cm-sheet-body textarea {
    width: 100%;
    height: 46vh;
    border: 0;
    outline: none;
    resize: none;
    font-size: 15px;
    line-height: 1.7;
    color: #2B2B30;
    background: transparent;
    -webkit-appearance: none;
}
.fq-cm-sheet-body textarea::placeholder { color: #C2C2C8; line-height: 1.7; }
.fq-cm-count { text-align: right; font-size: 12px; color: #C2C2C8; }

/* ==========================================================================
   24. 最近阅读/浏览历史（番茄风：3 列封面网格 + 连载/完结角标 + 进度行）
   ========================================================================== */
.fq-rh { min-height: 70vh; }
.fq-rh-top {
    position: sticky;
    top: 0;
    z-index: 20;
    display: flex;
    align-items: center;
    /* 标题是绝对定位不撑高：无返回键的页（如分类）会塌成 24px，故给最小高度兜底 */
    min-height: 48px;
    box-sizing: border-box;
    padding: 12px 14px;
    background: #fff;
    border-bottom: .5px solid var(--fq-line);
}
.fq-rh-back {
    width: 30px;
    height: 30px;
    margin-left: -6px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--fq-text);
    text-decoration: none;
}
.fq-rh-back svg { width: 22px; height: 22px; }
.fq-rh-top h1 {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    margin: 0;
    font-size: 17px;
    font-weight: 800;
    color: var(--fq-text);
}

/* ---- 副行：频道文字 tab + 计数/编辑（对照番茄浏览历史） ---- */
.fq-rh-sub {
    display: flex;
    align-items: center;
    padding: 12px 14px 6px;
}
.fq-rh-tabnav {
    display: flex;
    align-items: center;
    gap: 20px;
}
.fq-rh-tab {
    font-size: 15px;
    color: #8A8A8F;
    text-decoration: none;
    line-height: 1.3;
}
.fq-rh-tab.active {
    font-size: 16.5px;
    font-weight: 800;
    color: var(--fq-text);
}
.fq-rh-right {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 12px;
}
.fq-rh-count { font-size: 12px; color: #B0B0B6; }
.fq-rh-edit {
    font-size: 14.5px;
    color: #33333A !important;
    text-decoration: none;
}

/* ---- 3 列网格 ---- */
.fq-rh-wrap { padding: 10px 12px calc(var(--fq-tabbar-h) + env(safe-area-inset-bottom)); }
.fq-rh-grid {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    /* minmax(0,1fr)：防 nowrap 文本撑宽列 */
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px 12px;
}
.fq-rh-item a { display: block; text-decoration: none; }
.fq-rh-pic {
    position: relative;
    width: 100%;
    aspect-ratio: 3 / 4;
    border-radius: 5px;
    overflow: hidden;
    background: #ECEDEF;
}
.fq-rh-pic img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fq-rh-pic.fq-noimg { background: linear-gradient(135deg, #FFE3DD, #FFD1C2); }
.fq-rh-badge {
    position: absolute;
    top: 0;
    right: 0;
    padding: 3px 8px;
    font-size: 10.5px;
    font-style: normal;
    font-weight: 500;
    color: #333;
    background: rgba(255, 255, 255, .95);
    border-radius: 0 5px 0 8px;
    line-height: 1.2;
}
/* 选中圈（管理模式） */
.fq-rh-check { position: absolute; top: 6px; left: 6px; right: auto; display: none; }
.fq-rh-check input { display: none !important; }
.fq-rh-check b {
    display: block;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 1.5px solid #fff;
    background: rgba(0, 0, 0, .18);
    box-sizing: border-box;
}
.fq-rh-check input:checked + b {
    border-color: var(--fq-red);
    background: var(--fq-red) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / 12px;
}
/* 编辑态：显示选中圈、压暗角标点击 */
.fq-rh-grid.editable .fq-rh-check { display: block; }

.fq-rh-item h3 {
    margin: 9px 0 0;
    font-size: 15px;
    font-weight: 500;
    color: #1A1A1E;
    line-height: 1.45;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    /* 服务端已截 13 字，双保险 */
    max-height: 2.9em;
}
.fq-rh-item p {
    margin: 6px 0 0;
    font-size: 12.5px;
    color: #9C9CA1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ---- 加载/空态 ---- */
.fq-rh-loading { text-align: center; padding: 18px 0 8px; }
.fq-rh-loading span { font-size: 12.5px; color: #B8B8BD; }
.fq-rh-empty { padding: 70px 0 30px; }
.fq-rh-empty span { display: block; font-size: 14px; color: #9A9A9F; }
.fq-rh-empty span i { font-style: normal; color: var(--fq-red); }
.fq-rh-empty a {
    display: inline-block;
    margin-top: 16px;
    padding: 9px 26px;
    border-radius: var(--fq-pill);
    background: var(--fq-grad);
    color: #fff !important;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
}

/* ==========================================================================
   25. 我的消息 / 系统通知（番茄风）
   ========================================================================== */
.fq-msg { padding-bottom: calc(var(--fq-tabbar-h) + env(safe-area-inset-bottom)); min-height: 70vh; background: #fff; }

/* 聚合页：系统通知行 */
.fq-msg-row {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 10px;
    padding: 15px 14px;
    text-decoration: none;
}
.fq-msg-ico {
    width: 44px;
    height: 44px;
    flex-shrink: 0;
    border-radius: 50%;
    background: #FFF3E3;
    display: flex;
    align-items: center;
    justify-content: center;
}
.fq-msg-ico svg { width: 24px; height: 24px; }
.fq-msg-txt { flex: 1; min-width: 0; }
.fq-msg-txt b {
    display: block;
    font-size: 15.5px;
    font-weight: 700;
    color: var(--fq-text);
}
.fq-msg-txt p {
    margin: 5px 0 0;
    font-size: 13px;
    color: #9A9A9F;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.fq-msg-date { flex-shrink: 0; font-size: 11.5px; color: #C2C2C8; }

/* 通知列表 */
.fq-msg-list { list-style: none; margin: 0; padding: 4px 14px; }
.fq-msg-item a {
    display: block;
    padding: 14px 0;
    border-bottom: .5px solid var(--fq-line);
    text-decoration: none;
}
.fq-msg-item b {
    display: block;
    font-size: 14.5px;
    font-weight: 600;
    color: var(--fq-text);
    line-height: 1.45;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.fq-msg-item span {
    display: block;
    margin-top: 5px;
    font-size: 11.5px;
    color: #B0B0B6;
}

/* 详情 */
.fq-msg-info { padding: 18px 16px; }
.fq-msg-info h2 {
    margin: 0;
    font-size: 19px;
    font-weight: 800;
    color: var(--fq-text);
    line-height: 1.5;
}
.fq-msg-info-date {
    display: block;
    margin-top: 9px;
    font-size: 12px;
    color: #B0B0B6;
}
.fq-msg-body {
    margin-top: 16px;
    font-size: 15px;
    line-height: 1.8;
    color: #33333A;
    word-break: break-word;
}
.fq-msg-body img { max-width: 100% !important; height: auto !important; }
.fq-msg-body p { font-size: 15px !important; line-height: 1.8 !important; }

/* 空态 */
.fq-msg-none { padding: 80px 0 40px; text-align: center; }
.fq-msg-none span { font-size: 14px; color: #9A9A9F; }

/* ==========================================================================
   26. 账单明细（番茄风：书币资产条 + 分类 tab + 流水列表）
   ========================================================================== */

/* ---- 资产条 ---- */
.fq-bill-hero {
    margin: 12px 14px 2px;
    padding: 15px 16px 13px;
    border-radius: 14px;
    background: var(--fq-grad-soft);
}
.fq-bill-hero-top {
    display: flex;
    align-items: center;
}
.fq-bill-hero-num {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    align-items: baseline;
    gap: 8px;
}
.fq-bill-hero-num em {
    font-style: normal;
    font-size: 13px;
    color: #B2735A;
}
.fq-bill-hero-num b {
    font-size: 25px;
    font-weight: 800;
    color: var(--fq-red);
    line-height: 1.1;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.fq-bill-hero-btn {
    flex: 0 0 auto;
    padding: 6px 15px;
    border-radius: 22px;
    background: var(--fq-grad);
    color: #fff !important;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    box-shadow: 0 3px 10px rgba(255, 77, 79, .22);
}
.fq-bill-hero-sub {
    display: flex;
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px dashed rgba(255, 122, 69, .28);
}
.fq-bill-hero-cell {
    flex: 1 1 0;
    min-width: 0;
    text-align: center;
    text-decoration: none;
}
.fq-bill-hero-cell b {
    display: block;
    font-size: 16px;
    font-weight: 800;
    color: var(--fq-text);
}
.fq-bill-hero-cell em {
    display: block;
    margin-top: 4px;
    font-style: normal;
    font-size: 11.5px;
    color: #A8755F;
}

/* ---- 单位提示 ---- */
.fq-bill-unit {
    margin-left: auto;
    font-size: 12px;
    color: var(--fq-text-3);
}

/* ---- 流水列表 ---- */
.fq-bill-list {
    list-style: none;
    margin: 0;
    padding: 4px 14px 0;
    min-height: 58vh;
}
.fq-bill-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 0;
    border-bottom: .5px solid var(--fq-line);
}
.fq-bill-ico {
    flex: 0 0 auto;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.fq-bill-ico svg { width: 22px; height: 22px; }
.fq-bill-ico-t1 { background: #FFF1EC; color: #FF6A3D; }
.fq-bill-ico-t2 { background: #EAF7EF; color: #34B96F; }
.fq-bill-ico-t3 { background: #EEF2FF; color: #5B7BF7; }

.fq-bill-txt { flex: 1 1 0; min-width: 0; }
.fq-bill-txt b {
    display: block;
    font-size: 15px;
    font-weight: 700;
    color: var(--fq-text);
}
.fq-bill-txt em {
    display: block;
    margin-top: 4px;
    font-style: normal;
    font-size: 12px;
    color: #9A9A9F;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.fq-bill-right { flex: 0 0 auto; text-align: right; }
.fq-bill-right b {
    display: block;
    font-size: 16.5px;
    font-weight: 800;
    color: var(--fq-red);
}
.fq-bill-right em {
    display: block;
    margin-top: 4px;
    font-style: normal;
    font-size: 11.5px;
    color: #B8B8BD;
}

/* ---- 空态 ---- */
.fq-bill-empty { padding: 70px 0 40px; text-align: center; }
.fq-bill-empty i {
    display: block;
    width: 58px;
    height: 58px;
    margin: 0 auto 14px;
    color: #DCDCE2;
}
.fq-bill-empty i svg { width: 58px; height: 58px; }
.fq-bill-empty span { font-size: 14px; color: #9A9A9F; }

/* ==========================================================================
   27. 推广有礼 / 修改密码 / 客服帮助 / 充值 / 搜索（番茄风）
   ========================================================================== */

/* ---- 27.1 推广有礼 ---- */
.fq-qr-steps {
    margin: 14px 14px 0;
    padding: 15px 16px;
    border-radius: 14px;
    background: var(--fq-grad-soft);
}
.fq-qr-step {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 5px 0;
}
.fq-qr-step i {
    flex: 0 0 auto;
    width: 19px;
    height: 19px;
    border-radius: 50%;
    background: var(--fq-grad);
    color: #fff;
    font-style: normal;
    font-size: 12px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 1px;
}
.fq-qr-step span { font-size: 13.5px; color: #7A5A48; line-height: 1.6; }
.fq-qr-poster {
    margin: 14px 14px 20px;
    border-radius: 14px;
    background: #fff;
    overflow: hidden;
    box-shadow: 0 4px 16px rgba(31, 31, 31, .06);
}
.fq-qr-poster img { display: block; width: 100%; height: auto; }
.fq-qr-poster p {
    margin: 0;
    padding: 11px 0 13px;
    text-align: center;
    font-size: 12.5px;
    color: #B8B8BD;
}

/* ---- 27.2 修改账号密码 ---- */
.fq-pf-form {
    margin: 14px 14px 0;
    padding: 4px 16px;
    border-radius: 14px;
    background: #fff;
}
.fq-pf-row {
    display: flex;
    align-items: center;
    padding: 15px 0;
    border-bottom: .5px solid var(--fq-line);
}
.fq-pf-row:last-child { border-bottom: none; }
.fq-pf-label {
    flex: 0 0 76px;
    font-size: 14.5px;
    font-weight: 600;
    color: var(--fq-text);
}
.fq-pf-row input {
    flex: 1 1 0;
    min-width: 0;
    border: none;
    outline: none;
    background: none;
    font-size: 14.5px;
    color: var(--fq-text);
    padding: 0;
    margin: 0 !important; /* template5_classify.css 给 input 塞了 margin-bottom:15px，会把文字顶偏 8px */
    -webkit-appearance: none;
}
.fq-pf-row input::placeholder { color: #C2C2C8; }
.fq-pf-submit-box { margin: 30px 14px 0; }
.fq-pf-submit {
    display: block;
    height: 46px;
    line-height: 46px;
    border-radius: 23px;
    background: var(--fq-grad);
    color: #fff !important;
    text-align: center;
    font-size: 16px;
    font-weight: 700;
    text-decoration: none;
    box-shadow: 0 6px 16px rgba(255, 77, 79, .24);
}
.fq-pf-submit:active { opacity: .88; }

/* ---- 27.2.1 更换头像 ---- */
.fq-ava-row { cursor: pointer; }
.fq-ava-right {
    flex: 1 1 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    min-width: 0;
}
.fq-ava-img {
    width: 54px;
    height: 54px;
    border-radius: 50%;
    object-fit: cover;
    display: block;
    background: var(--fq-line);
    border: .5px solid var(--fq-line);
}
.fq-ava-arrow { width: 16px; height: 16px; color: #C2C2C8; flex: none; }
/* 文件域：不能 display:none（部分移动端 WebView 不放行），改为移出屏幕的可视化隐藏 */
.fq-ava-file {
    position: absolute;
    left: -9999px;
    top: 0;
    width: 1px;
    height: 1px;
    opacity: 0;
    overflow: hidden;
    border: none;
}
.fq-pf-tip {
    margin: 8px 18px 0;
    font-size: 12.5px;
    line-height: 1.6;
    color: var(--fq-text-3);
}

/* ---- 27.3 客服帮助 ---- */
.fq-kf-list {
    margin: 14px 14px 0;
    padding: 4px 16px;
    border-radius: 14px;
    background: #fff;
}
.fq-kf-row {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 16px 0;
    border-bottom: .5px solid var(--fq-line);
}
.fq-kf-row:last-child { border-bottom: none; }
.fq-kf-ico {
    flex: 0 0 auto;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.fq-kf-ico svg { width: 24px; height: 24px; }
.fq-kf-ico-wx { background: #EAF7EF; }
.fq-kf-ico-tel { background: #FFF1EC; }
.fq-kf-ico-time { background: #EEF2FF; }
.fq-kf-txt { flex: 1 1 0; min-width: 0; }
.fq-kf-txt em {
    display: block;
    font-style: normal;
    font-size: 12px;
    color: #9A9A9F;
}
.fq-kf-txt b {
    display: block;
    margin-top: 4px;
    font-size: 15.5px;
    font-weight: 700;
    color: var(--fq-text);
    line-height: 1.5;
    word-break: break-all;
}

/* ---- 27.4 充值 ---- */
.fq-ch-hero {
    display: flex;
    align-items: center;
    margin: 12px 14px 2px;
    padding: 15px 16px;
    border-radius: 14px;
    background: var(--fq-grad-soft);
}
.fq-ch-hero-num {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    align-items: baseline;
    gap: 7px;
}
.fq-ch-hero-num em { font-style: normal; font-size: 13px; color: #B2735A; }
.fq-ch-hero-num b {
    font-size: 25px;
    font-weight: 800;
    color: var(--fq-red);
    line-height: 1.1;
}
.fq-ch-hero-num span { font-size: 12px; color: #B2735A; }
.fq-ch-hero-bill {
    flex: 0 0 auto;
    font-size: 13px;
    font-weight: 600;
    color: #B2735A !important;
    text-decoration: none;
}
.fq-ch-sec { margin: 14px 14px 0; }
.fq-ch-sec-tit {
    font-size: 15.5px;
    font-weight: 800;
    color: var(--fq-text);
}
.fq-ch-sec-tit span { font-size: 12px; font-weight: 400; color: #9A9A9F; }
.fq-ch-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 11px;
    margin-top: 12px;
}
.fq-ch-gear {
    position: relative;
    display: block;
    min-width: 0;
    padding: 14px 0 12px;
    border-radius: 12px;
    background: #fff;
    border: 1.5px solid var(--fq-line);
    text-align: center;
    text-decoration: none !important;
    overflow: hidden;
}
.fq-ch-gear.on {
    border-color: var(--fq-red);
    background: #FFF7F6;
    box-shadow: 0 3px 10px rgba(255, 77, 79, .12);
}
.fq-ch-price {
    display: block;
    font-style: normal;
    font-size: 21px;
    font-weight: 800;
    color: var(--fq-text);
    line-height: 1.2;
}
.fq-ch-price i { font-style: normal; font-size: 12.5px; font-weight: 600; margin-left: 1px; }
.fq-ch-gear.on .fq-ch-price { color: var(--fq-red); }
.fq-ch-coin {
    display: block;
    margin-top: 4px;
    font-size: 12px;
    color: #9A9A9F;
}
.fq-ch-give {
    display: inline-block;
    margin-top: 7px;
    padding: 2px 8px;
    border-radius: 9px;
    background: var(--fq-grad);
    color: #fff;
    font-size: 10.5px;
    font-weight: 600;
}
.fq-ch-new {
    position: absolute;
    top: 0;
    right: 0;
    padding: 2px 8px;
    border-radius: 0 10px 0 10px;
    background: var(--fq-grad);
    color: #fff;
    font-size: 10.5px;
    font-weight: 600;
}
.fq-ch-vip {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 11px 14px 0;
    padding: 14px 14px;
    border-radius: 12px;
    background: #fff;
    border: 1.5px solid var(--fq-line);
    text-decoration: none !important;
}
.fq-ch-vip.on {
    border-color: var(--fq-red);
    background: #FFF7F6;
    box-shadow: 0 3px 10px rgba(255, 77, 79, .12);
}
.fq-ch-vip-ico {
    flex: 0 0 auto;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: var(--fq-grad-soft);
    color: #FF6A3D;
    display: flex;
    align-items: center;
    justify-content: center;
}
.fq-ch-vip-ico svg { width: 24px; height: 24px; }
.fq-ch-vip-txt { flex: 1 1 0; min-width: 0; }
.fq-ch-vip-txt b {
    display: block;
    font-size: 15px;
    font-weight: 700;
    color: var(--fq-text);
}
.fq-ch-vip-txt em {
    display: block;
    margin-top: 4px;
    font-style: normal;
    font-size: 12px;
    color: #9A9A9F;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.fq-ch-vip-price {
    flex: 0 0 auto;
    font-size: 17px;
    font-weight: 800;
    color: var(--fq-red);
}
.fq-ch-btn-box { margin: 24px 14px 4px; }
.fq-ch-btn {
    display: block;
    height: 46px;
    line-height: 46px;
    border-radius: 23px;
    background: var(--fq-grad);
    color: #fff !important;
    text-align: center;
    font-size: 16px;
    font-weight: 700;
    text-decoration: none;
    box-shadow: 0 6px 16px rgba(255, 77, 79, .24);
}
.fq-ch-btn:active { opacity: .88; }
.fq-ch-tips {
    margin: 18px 14px 0;
    padding-bottom: 16px;
}
.fq-ch-tips p {
    margin: 0 0 5px;
    font-size: 12px;
    color: #B8B8BD;
    line-height: 1.7;
}
.fq-ch-tips p:first-child { color: #9A9A9F; font-weight: 600; }

/* ---- 27.5 搜索 ---- */
.fq-se-top {
    position: sticky;
    top: 0;
    z-index: 30;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    background: #fff;
    border-bottom: .5px solid var(--fq-line);
}
.fq-se-back {
    flex: 0 0 auto;
    width: 28px;
    height: 28px;
    margin-left: -4px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--fq-text);
    text-decoration: none;
}
.fq-se-back svg { width: 22px; height: 22px; }
.fq-se-box {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 7px;
    height: 36px;
    padding: 0 12px;
    border-radius: 18px;
    background: #F4F5F7;
}
.fq-se-box i { flex: 0 0 auto; color: #9A9A9F; display: flex; }
.fq-se-box i svg { width: 16px; height: 16px; }
.fq-se-box input {
    flex: 1 1 0;
    min-width: 0;
    border: none;
    outline: none;
    background: none;
    font-size: 14px;
    color: var(--fq-text);
    margin: 0;
    padding: 0;
    height: 36px;
    line-height: 36px;
    text-align: left !important;
    -webkit-appearance: none;
}
.fq-se-box input::placeholder { color: #B8B8BD; }
.fq-se-btn {
    flex: 0 0 auto;
    font-size: 15px;
    font-weight: 700;
    color: var(--fq-red) !important;
    text-decoration: none;
    padding: 4px 2px 4px 6px;
}

/* 搜索结果 */
.fq-se-result { padding-bottom: 16px; }
.fq-se-result-tit { padding: 14px 14px 2px; }
.fq-se-result-tit span { font-size: 12.5px; color: #9A9A9F; }
.fq-se-result-tit b { color: var(--fq-red); font-weight: 700; }
.fq-se-res-list { list-style: none; margin: 0; padding: 6px 14px 0; }
.fq-se-res-list li a {
    display: flex;
    gap: 12px;
    padding: 12px 0;
    border-bottom: .5px solid var(--fq-line);
    text-decoration: none;
}
.fq-se-res-pic {
    flex: 0 0 auto;
    display: block;
    width: 74px;
    aspect-ratio: 3 / 4;
    border-radius: 8px;
    overflow: hidden;
    background: #EDEEF2;
    position: relative;
}
.fq-se-res-pic img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fq-se-res-pic em {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-style: normal;
    font-size: 20px;
    color: #C2C2C8;
}
.fq-se-res-txt { flex: 1 1 0; min-width: 0; padding-top: 2px; }
.fq-se-res-txt b {
    display: block;
    font-size: 15.5px;
    font-weight: 700;
    color: var(--fq-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.fq-se-res-txt em {
    display: block;
    margin-top: 5px;
    font-style: normal;
    font-size: 11.5px;
    color: #9A9A9F;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.fq-se-res-txt p {
    margin: 6px 0 0;
    font-size: 12px;
    color: #9A9A9F;
    line-height: 1.6;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}
.fq-se-none { padding: 60px 0 40px; text-align: center; }
.fq-se-none i { display: block; width: 56px; height: 56px; margin: 0 auto 14px; color: #DCDCE2; }
.fq-se-none i svg { width: 56px; height: 56px; }
.fq-se-none span { display: block; font-size: 14px; color: #9A9A9F; }
.fq-se-none a {
    display: inline-block;
    margin-top: 18px;
    padding: 8px 22px;
    border-radius: 20px;
    border: 1px solid var(--fq-red);
    color: var(--fq-red) !important;
    font-size: 13.5px;
    font-weight: 600;
    text-decoration: none;
}

/* 搜索历史 */
.fq-se-his { margin: 16px 14px 0; }
.fq-se-his-tit {
    display: flex;
    align-items: center;
}
.fq-se-his-tit h2 {
    margin: 0;
    font-size: 15.5px;
    font-weight: 800;
    color: var(--fq-text);
}
.fq-se-his-tit a {
    margin-left: auto;
    color: #B8B8BD;
    display: flex;
    padding: 2px;
}
.fq-se-his-tit a svg { width: 18px; height: 18px; }
.fq-se-his-words {
    display: flex;
    flex-wrap: wrap;
    gap: 9px 10px;
    margin-top: 13px;
}
.fq-se-his-word {
    max-width: 100%;
    padding: 6px 13px;
    border-radius: 17px;
    background: #F4F5F7;
    color: #4A4A50 !important;
    font-size: 13px;
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* 热门搜索（封面榜单卡） */
.fq-se-hot {
    margin: 14px 14px 0;
    padding: 2px 14px 1px;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 2px 10px rgba(31, 31, 31, .05);
}
.fq-se-hot-tit {
    padding: 13px 0 3px;
    font-size: 15.5px;
    font-weight: 800;
    color: #3A3A40;
}
.fq-se-hot-list { list-style: none; margin: 0; padding: 0; }
.fq-se-hot-list li a {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 0;
    border-bottom: .5px solid #F2F2F5;
    text-decoration: none;
}
.fq-se-hot-list li:last-child a { border-bottom: none; }
.fq-se-hot-num {
    flex: 0 0 20px;
    font-style: italic;
    font-size: 16px;
    font-weight: 800;
    color: #C8C8CE;
    text-align: center;
}
.fq-se-hot-num.top { color: var(--fq-red); }
.fq-se-hot-pic {
    flex: 0 0 auto;
    display: block;
    width: 38px;
    aspect-ratio: 3 / 4;
    border-radius: 6px;
    overflow: hidden;
    background: #EDEEF2;
    position: relative;
}
.fq-se-hot-pic img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fq-se-hot-pic.fq-noimg { background: linear-gradient(135deg, #EADFC4, #D9CBA4); }
.fq-se-hot-pic em {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-style: normal;
    font-size: 14px;
    color: #B8A87E;
}
.fq-se-hot-txt { flex: 1 1 0; min-width: 0; }
.fq-se-hot-txt b {
    display: block;
    font-size: 15px;
    font-weight: 700;
    color: var(--fq-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.fq-se-hot-txt em {
    display: block;
    margin-top: 3px;
    font-style: normal;
    font-size: 11.5px;
    color: #9A9A9F;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.fq-se-hot-go { flex: 0 0 auto; font-size: 18px; color: #C8C8CE; line-height: 1; }

/* ---- 28. 精彩推荐（搜索页双列大图）+ VIP特权 ---- */
.fq-se-guess { margin: 22px 14px 0; padding-bottom: 16px; }
.fq-se-sec-tit {
    font-size: 15.5px;
    font-weight: 800;
    color: var(--fq-text);
}
.fq-se-rec-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px 12px;
    margin-top: 13px;
}
.fq-se-rec-item { display: block; min-width: 0; text-decoration: none; }
.fq-se-rec-pic {
    display: block;
    aspect-ratio: 3 / 4;
    border-radius: 8px;
    overflow: hidden;
    background: #EDEEF2;
    position: relative;
}
.fq-se-rec-pic img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fq-se-rec-pic.fq-noimg { background: linear-gradient(135deg, #EADFC4, #D9CBA4); }
.fq-se-rec-pic em {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-style: normal;
    font-size: 22px;
    color: #B8A87E;
}
.fq-se-rec-name {
    display: block;
    margin-top: 8px;
    font-size: 12.5px;
    color: #A0784E;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ---- 28.2 VIP 特权 ---- */
.fq-vip-list {
    margin: 14px 14px 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.fq-vip-card {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 16px 15px;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 2px 10px rgba(31, 31, 31, .05);
}
.fq-vip-ico {
    flex: 0 0 auto;
    width: 46px;
    height: 46px;
    border-radius: 50%;
    background: #FFF6E4;
    color: #E8A33C;
    display: flex;
    align-items: center;
    justify-content: center;
}
.fq-vip-ico svg { width: 26px; height: 26px; }
.fq-vip-txt { flex: 1 1 0; min-width: 0; }
.fq-vip-txt b {
    display: block;
    font-size: 15.5px;
    font-weight: 800;
    color: var(--fq-text);
}
.fq-vip-txt p {
    margin: 6px 0 0;
    font-size: 13px;
    color: #9A9A9F;
    line-height: 1.7;
}
.fq-vip-btn-box { margin: 28px 14px 0; }
.fq-vip-btn {
    display: block;
    height: 48px;
    line-height: 48px;
    border-radius: 14px;
    background: linear-gradient(90deg, #FFA03D, #FF4D4F);
    color: #fff !important;
    text-align: center;
    font-size: 16px;
    font-weight: 700;
    text-decoration: none;
    box-shadow: 0 6px 16px rgba(255, 122, 69, .28);
}
.fq-vip-btn:active { opacity: .88; }

/* ==========================================================================
   29. 分类页（终版：左侧榜单导航 + 右侧插画卡片墙，2026-09-18 与 App 端同步）
   ========================================================================== */
/* 页面底色沿用主题 --fq-bg */
.fq-ct-page { min-height: 100vh; }
/* 主体：左导航 + 右卡片墙 */
.fq-ct-body {
    display: flex;
    align-items: stretch;
    min-height: calc(100vh - 48px - 12px);
}
/* 左侧导航 */
.fq-ct-side {
    flex: 0 0 96px;
    background: #F0F1F4;
    padding: 6px 0 24px;
}
.fq-ct-side-item {
    position: relative;
    display: block;
    padding: 13px 0 13px 18px;
    font-size: 14px;
    color: #55575E !important;
    text-decoration: none !important;
}
.fq-ct-side-item.active {
    background: #fff;
    color: var(--fq-red) !important;
    font-weight: 700;
}
.fq-ct-side-item.active:before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    width: 3px;
    height: 18px;
    margin-top: -9px;
    border-radius: 0 2px 2px 0;
    background: var(--fq-red);
}
/* 右侧主区 */
.fq-ct-main {
    flex: 1 1 0;
    min-width: 0;
    background: #fff;
    padding-bottom: 20px;
}
/* 频道切换：文字 tab + 红色短下划线（与排行页 tab 同规范） */
.fq-ct-tabs {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 44px;
    padding: 4px 14px 0;
}
.fq-ct-tab {
    position: relative;
    display: block;
    padding: 10px 2px 12px;
    font-size: 16px;
    font-weight: 500;
    color: #6A6A70 !important;
    text-decoration: none !important;
    transition: color .15s;
}
.fq-ct-tab.active {
    color: var(--fq-red) !important;
    font-weight: 700;
}
.fq-ct-tab.active:after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: 4px;
    width: 20px;
    height: 3px;
    margin-left: -10px;
    border-radius: 2px;
    background: var(--fq-red);
}
/* 卡片墙：2 列插画卡（文字区纯底 + 右侧 55% 水墨插画 + 渐变过渡，永不挡字） */
.fq-ct-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    padding: 10px 12px 0;
}
.fq-ct-card {
    position: relative;
    display: block;
    height: 150px;
    border-radius: 12px;
    overflow: hidden;
    text-decoration: none !important;
}
.fq-ct-card:active { opacity: .88; }
/* 插画只占右侧 55%（略压淡，淡彩水墨自带留白与卡片底自然融合），左侧是纯色文字区 */
.fq-ct-art {
    position: absolute;
    right: 0;
    top: 0;
    width: 55%;
    height: 100%;
    opacity: .85;
    object-fit: cover;
}
/* 渐变蒙版盖整卡：0-62% 全实底（文字区），插画左缘起淡出 */
.fq-ct-veil {
    position: absolute;
    inset: 0;
}
.fq-ct-card-body {
    position: absolute;
    left: 12px;
    top: 16px;
    right: 44%;
    z-index: 1;
}
.fq-ct-card-name {
    display: block;
    font-size: 17px;
    font-weight: 700;
    color: #26262C;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
/* 副标拆两行短词（不省略不截断，实在放不下才换行） */
.fq-ct-card-sub {
    display: block;
    margin-top: 5px;
    font-size: 10.5px;
    color: #55575E;
    line-height: 1.35;
    white-space: normal;
    word-break: break-all;
}
.fq-ct-card-ico {
    position: absolute;
    left: 12px;
    bottom: 12px;
    width: 24px;
    height: 24px;
    z-index: 1;
}
/* ===== 榜单模式：页内书单（复用排行页 fq-rk-* 列表样式） ===== */
.fq-ct-rank { padding: 4px 12px 0; }
.fq-ct-rank-title {
    display: flex;
    align-items: baseline;
    gap: 8px;
    padding: 8px 2px 10px;
    border-bottom: .5px solid var(--fq-line);
}
.fq-ct-rank-title b { font-size: 16px; color: var(--fq-red); }
.fq-ct-rank-sub { font-size: 11.5px; color: #9A9EA5; }
.fq-ct-rank .fq-rk-item { padding: 10px 2px; border-bottom: .5px solid var(--fq-line); }
.fq-ct-rank .fq-rk-row { display: flex; align-items: center; }
.fq-ct-rank .fq-rk-num {
    flex: 0 0 24px;
    font-size: 15px;
    font-weight: 700;
    font-style: italic;
    color: #C6C8CE;
}
.fq-ct-rank .fq-rk-cover {
    flex: 0 0 44px;
    width: 44px;
    height: 60px;
    border-radius: 6px;
    overflow: hidden;
    background: #F0F1F4;
}
.fq-ct-rank .fq-rk-cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fq-ct-rank .fq-rk-txt { flex: 1 1 0; min-width: 0; margin-left: 10px; }
.fq-ct-rank .fq-rk-txt h3 {
    margin: 0;
    font-size: 14.5px;
    font-weight: 600;
    color: var(--fq-text);
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.fq-ct-rank .fq-rk-txt p { margin: 6px 0 0; font-size: 11.5px; color: #9A9EA5; }
.fq-ct-rank-tip { padding: 18px 0; text-align: center; }
.fq-ct-rank-tip span { font-size: 13px; color: #9A9EA5; }
.fq-ct-more {
    display: block;
    padding: 14px 0 4px;
    text-align: center;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--fq-red) !important;
    text-decoration: none !important;
}

/* ==========================================================================
   29b. 账号与安全 / 修改密码 / 绑定手机（2026-09-18 与 App 端同步）
   ========================================================================== */
/* 行值文本（右侧灰字） */
.fq-pf-val {
    flex: 1 1 0;
    min-width: 0;
    text-align: right;
    color: #9A9EA5;
    font-size: 13.5px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
/* 退出登录（危险操作，弱化样式） */
.fq-pf-logout {
    display: block;
    height: 44px; line-height: 44px; text-align: center;
    background: #FFFFFF; border-radius: 12px; color: #FF4D4F;
    font-size: 15px; margin-top: 6px;
    text-decoration: none !important;
}
/* 大标题区（改密 / 绑手机 共用规范） */
.fq-pw-head, .fq-ph-head { margin: 30px 24px 0; }
.fq-pw-title, .fq-ph-title {
    font-size: 24px; font-weight: 700; color: #1F1F1F; line-height: 1.4;
}
.fq-pw-sub, .fq-ph-sub { margin-top: 8px; font-size: 13px; color: #9A9EA5; line-height: 1.6; }
/* 填充式输入：圆角浅灰卡片，聚焦白底红描边 */
.fq-pw-fields, .fq-ph-fields { margin: 34px 24px 0; }
.fq-pw-field, .fq-ph-field {
    display: flex; align-items: center;
    height: 48px; padding: 0 16px; margin-bottom: 14px;
    border-radius: 12px;
    background: #F5F6F8;
    border: 1.5px solid transparent;
    transition: background-color .15s, border-color .15s;
}
.fq-pw-field.is-focus, .fq-ph-field.is-focus {
    background: #FFFFFF;
    border-color: #FF4D4F;
}
.fq-pw-field input, .fq-ph-field input {
    flex: 1 1 0; min-width: 0; margin: 0; border: none; background: none; outline: none;
    font-size: 15px; color: #1F1F1F; padding: 0; height: 26px; line-height: 26px;
    text-align: left !important;
}
.fq-pw-field input::-webkit-input-placeholder,
.fq-ph-field input::-webkit-input-placeholder { color: #B9BDC6; }
/* 获取验证码：红底浅色胶囊 */
.fq-ph-code {
    flex: none; min-width: 92px; text-align: center;
    height: 32px; line-height: 32px; padding: 0 12px; box-sizing: border-box;
    border-radius: 16px;
    background: #FDECEB;
    color: #E8453F; font-size: 12px; font-weight: 600; margin-left: 10px;
    cursor: pointer;
}
.fq-ph-code:active { opacity: .8; }
.fq-ph-code.is-disabled { background: #F0F1F4; color: #B9BDC6; }
/* 确认按钮：未填满为浅红禁用态、填满主题渐变 */
.fq-pw-btn, .fq-ph-btn {
    margin: 34px 24px 0; height: 46px; line-height: 46px; text-align: center;
    border-radius: 23px; background: #FDECEB; color: #F2A09B;
    font-size: 15px; font-weight: 600; cursor: pointer;
}
.fq-pw-btn.is-ok, .fq-ph-btn.is-ok { background: var(--fq-grad); color: #FFFFFF; }
.fq-pw-btn.is-ok:active, .fq-ph-btn.is-ok:active { opacity: .88; }
.fq-pw-tip, .fq-ph-tip { margin: 16px 24px 0; font-size: 12px; color: #B9B9C1; text-align: center; }

/* 主题编辑弹窗（替代系统弹窗的微信蓝样式，与 App 端 fq-dialog 一致） */
.fqdlg-mask {
    position: fixed; left: 0; top: 0; right: 0; bottom: 0;
    background: rgba(0, 0, 0, .45);
    z-index: 99999;
    display: none; align-items: center; justify-content: center;
}
.fqdlg-mask.show { display: flex; }
.fqdlg-card {
    width: 78%; max-width: 320px;
    background: #FFFFFF; border-radius: 18px;
    padding: 24px 20px 18px; box-sizing: border-box;
    box-shadow: 0 12px 40px rgba(0, 0, 0, .18);
}
.fqdlg-title {
    text-align: center; font-size: 16px; font-weight: 700; color: #1F1F1F;
}
.fqdlg-input {
    margin-top: 16px; width: 100%; box-sizing: border-box;
    height: 42px; line-height: 42px; padding: 0 14px;
    background: #F5F6F8; border-radius: 10px;
    border: none; outline: none;
    font-size: 14px; color: #1F1F1F; text-align: left !important;
}
.fqdlg-btns { margin-top: 20px; display: flex; gap: 12px; }
.fqdlg-btn {
    flex: 1 1 0; min-width: 0; height: 40px; line-height: 40px;
    border-radius: 20px; text-align: center; font-size: 14.5px; cursor: pointer;
}
.fqdlg-cancel { background: #F5F6F8; color: #6B6B73; }
.fqdlg-cancel:active { opacity: .85; }
.fqdlg-ok {
    background: var(--fq-grad); color: #FFFFFF; font-weight: 600;
    box-shadow: 0 6px 16px rgba(255, 77, 79, .28);
}
.fqdlg-ok:active { opacity: .88; }

/* ==========================================================================
   30. 分类筛选列表页 + 全部目录页（番茄风）
   ========================================================================== */

/* ---- 分类筛选列表（BookTypeinfo / getBookType5） ---- */
.fq-btl-wrap { padding: 4px 14px calc(var(--fq-tabbar-h, 56px) + env(safe-area-inset-bottom)); }
.fq-btl-list { list-style: none; margin: 0; padding: 0; }
.fq-btl-item a {
    display: flex;
    gap: 12px;
    padding: 13px 0;
    border-bottom: .5px solid var(--fq-line);
    text-decoration: none;
}
.fq-btl-item:last-child a { border-bottom: none; }
.fq-btl-pic {
    flex: 0 0 auto;
    display: block;
    width: 82px;
    aspect-ratio: 3 / 4;
    border-radius: 8px;
    overflow: hidden;
    background: #EDEEF2;
    position: relative;
}
.fq-btl-pic img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fq-btl-pic em {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-style: normal;
    font-size: 22px;
    color: #C2C2C8;
}
.fq-btl-pic.fq-noimg { background: linear-gradient(135deg, #EADFC4, #D9CBA4); }
.fq-btl-txt { flex: 1 1 0; min-width: 0; padding-top: 2px; display: block; }
.fq-btl-txt b {
    display: block;
    font-size: 15.5px;
    font-weight: 700;
    color: var(--fq-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.fq-btl-txt em {
    display: block;
    margin-top: 5px;
    font-style: normal;
    font-size: 11.5px;
    color: #9A9A9F;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.fq-btl-txt p {
    margin: 6px 0 0;
    font-size: 12px;
    color: #9A9A9F;
    line-height: 1.6;
    word-break: break-all;
}
.fq-btl-tags { display: flex; gap: 8px; margin-top: 9px; }
.fq-btl-tags i {
    font-style: normal;
    font-size: 10.5px;
    padding: 2px 8px;
    border-radius: 4px;
    line-height: 1.5;
}
.fq-btl-st-ing { color: #FF4D4F; background: #FFF1F0; }
.fq-btl-st-end { color: #2BA85E; background: #EAF7EF; }
.fq-btl-cate { color: #7A7A80; background: #F4F5F7; }

/* 空态按钮（content_null_box 直下 a） */
.fq-rh-empty > a {
    display: inline-block;
    margin-top: 20px;
    padding: 9px 28px;
    border-radius: var(--fq-pill);
    background: var(--fq-grad);
    color: #fff !important;
    font-size: 14px;
    text-decoration: none;
    box-shadow: 0 6px 16px rgba(255, 77, 79, .28);
}

/* ---- 全部目录（mInfo） ---- */
.fq-mh-wrap { padding: 8px 12px 24px; }
.fq-mh-list {
    list-style: none;
    margin: 0;
    padding: 4px 16px;
    background: #fff;
    border-radius: var(--fq-r-lg, 12px);
}
.fq-mh-item { border-bottom: .5px solid var(--fq-line); }
.fq-mh-item:last-child { border-bottom: none; }
.fq-mh-item a {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 2px;
    text-decoration: none;
}
.fq-mh-name {
    flex: 1 1 0;
    min-width: 0;
    font-size: 14.5px;
    color: var(--fq-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.fq-mh-lock { flex: 0 0 auto; width: 14px; height: 14px; color: #C2C2C8; }
