/* ==========================================================================
   Topic CSS - 主题内容样式表
   ==========================================================================
   
   目录：
   1. 基础设置 - 字体、滚动条、列表等基础样式
   2. 面包屑导航 - Breadcrumb 导航样式
   3. 主题内容 - 标题、章节、内容区域样式
   4. 右侧内容 - 目录导航、底部按钮样式
   5. 表格样式 - 表格相关样式
   6. 水印效果 - 文档水印样式
   7. 图片相关 - 图片、轮播、缩放等样式
   8. 视频播放器 - 视频容器和控件样式
   9. 代码块 - 代码高亮和复制按钮样式
   10. 标签页 - Tab 切换组件样式
   ========================================================================== */
 
 @import url("Roboto.css");
 
 /* ==========================================================================
    1. 基础设置
   ========================================================================== */
 html,
 body {
	 min-width: 100%;
	 /* height: 100%; */
	 font-size: 14px;
	 line-height: 24px;
	 font-family: 'Roboto', sans-serif;
 }
 
 a{
	 color: var(--font-color-link-web);
 }
 
 /* 滚动条轨道 */
 ::-webkit-scrollbar { 
	 width: 8px;   
	 height: 8px;
	 border-radius: 4px;
 } 
 
 /* 滚动条滑块 */
 ::-webkit-scrollbar-thumb { 
	 border-radius: 4px; 
	 background-color: var(--background-color-scrollbar-thumb);
 }
 
 /* 列表基础样式 */
 ul {
	 padding-inline-start: 1em
 }
 
 ol {
	 padding-inline-start: 1em
 }
 
 dl dl {
	 padding-inline-start: 2em
 }
 
 li li {
	 font-size: 13px;
	 line-height: 20px;
	 margin-top: 6px;
	 margin-bottom: 6px;
 }
 
 p{
	 margin-top: 8px;
	 margin-bottom: 8px;
 }
 
 .p{
	 margin-top: 8px;
	 margin-bottom: 8px;
 }
 
 li span {
	 margin-top: 8px;
	 margin-bottom: 8px;
 }
 
 li li span {
	 margin-top: 6px !important;
	 margin-bottom: 6px !important;
 }
 
 li li p{
	 margin-top: 6px !important;
	 margin-bottom: 6px !important;
 }
 
 .ol>li, 
 .ul>li{
	 margin-top: 8px!important;
	 /* margin-bottom: 8px!important; */
 }
 
 /* 高亮文本 */
 .highlight{
	 color: var(--font-color-link);
 }
 
 /* 图片基础样式 */
 .image:not([usemap]), .image {
	 max-width: 100%;
 }
 
 /* ==========================================================================
    2. 面包屑导航 (Breadcrumb)
   ========================================================================== */
 /* 选择列表样式 */
 .choicetable {
	 border: none;
	 margin-top: 12px;
	 margin-bottom: 12px;
 }
 
 .choicetable thead {
	 display: none;
 }
 
 .choicetable td {
	 border: none;
 }
 
 /* ==========================================================================
    步骤列表 (Steps)
   ========================================================================== */
 .steps {
	 padding-left: 0px;
 }
 
 .step{
	 margin-left:30px;
 }
 
 .steps>li{
	 margin-top: 8px!important;
	 margin-bottom: 8px!important;
 }
 
 .stepexpand {
	 margin-top: 6px;
	 margin-bottom: 6px;
 }
 
 .example .p {
	 margin-left: 15px;
 }
 
 /* ==========================================================================
    3. 主题内容区域
   ========================================================================== */
 .wt_breadcrumb {
	 display: block;
	 padding: 0px 16px 6px 0px;
	 width: 100%;
 }
 
 .wt_breadcrumb_collapse{
	 display: none;
	 text-align: center;
	 line-height: 2px;
	 padding-top: 2px;
 }
 
 .wt_breadcrumb_collapse_button{
	 content: "";
	 display: inline-block;
	 background-image: url("../images/面包屑-收起@2x.png");
	 background-size: 14px 14px;
	 width: 14px;
	 height: 14px;
	 position: relative;
	 top: 0px;
	 cursor: pointer;
 }
 
 .wt_breadcrumb ol {
	 display: block;
	 color: var(--font-color-content);
	 padding: 0px;
	 margin:0;
	 border-radius: 0;
	 line-height: 8px;  /* 必须小于 字号，才不影响 li 的 line-height */
	 list-style: none;
	 background:none;
	 width: calc(100% - 22px);
 }
 
 .wt_breadcrumb_ellipsis {
	 display: none;
	 position: absolute;
	 float: right;
	 top: 0px;
	 right: 80px;
	 width: 16px;
	 height: 16px;
	 background-image: url(../images/面包屑-更多@2x.png);
	 background-size: 16px 16px;
	 cursor: pointer;
 }
 
 .wt_breadcrumb_li_overflow{
	 display:inline-block;
	 white-space: nowrap;
	 word-break: break-all;
	 overflow: hidden!important;
 }
 
 .wt_breadcrumb li{
	 display:inline-block;
	 overflow: auto;
	 font-size: 12px;
	 line-height: 18px;
 }
 
 .wt_breadcrumb li:not(:last-of-type):after {
	 content: "/";
	 padding: 0 5px;
	 color: var(--font-color-right-content);
 }
 
 .wt_breadcrumb ol a {
	 color: var(--font-color-content);
 }
 
 .wt_breadcrumb ol a:hover {
	 text-decoration: none;
	 color: var(--font-color-link);
 }
 
 .wt_breadcrumb ol .active {
	 color: var(--font-color-topic-content);
 }
 
 /* 文档内容 */
 .wt_topic_content{
	 color: var(--font-color-topic-content);
 }
 
 /* 文档内容 WPP 功能区 */
 .wt_topic_wpp_content{
	 display: block;
	 vertical-align: top;
	 width: 210px;
	 position: absolute;
	 top: 28px;
	 right: 80px;
 }
 
 .wt_topic_wpp_content_flex{
	 display: flex;
	 padding-top: 16px;
 }
 
	.wt_topic_wpp_item{
	display:inline-flex;
	align-items:center;
	font-size:12px;
	line-height:20px;
	cursor:pointer;
	}

 
 /* .wt_topic_wpp_item.like{
	 display: inline-block;
	 width: 60px;
	 height: 20px;
	 background: url("../images/点赞@2x.png") no-repeat;
	 background-size: 20px 20px;
	 padding-left: 24px;
	 margin-right: 70px; 
 } */
 
 .wt_topic_wpp_item.view{
	 display: inline-block;
	 width: 60px;
	 height: 20px;
	 background: url("../images/查看@2x.png") no-repeat;
	 background-size: 20px 20px;
	 padding-left: 24px;
	 margin-right: 50px;
 }
 
 .wt_topic_wpp_item.share{
	 display: inline-block;
	 width: 60px;
	 height: 20px;
	 background: url("../images/分享@2x.png") no-repeat;
	 background-size: 20px 20px;
	 padding-left: 24px;
 }
 
 .wt_topic_wpp_item.share:hover{
	 display: inline-block;
	 width: 60px;
	 height: 20px;
	 background: url("../images/分享1@2x.png") no-repeat;
	 background-size: 20px 20px;
	 padding-left: 24px;
 }
 
 /* 标题样式 */
 h1.title {
	 color: var(--font-color-section-title);
	 text-decoration: none;
	 font-weight: bold;
	 font-size: 30px;
	 line-height: 34px;
	 padding-top: 11px;
	 padding-bottom: 11px;
	 margin-top: 0px;
	 margin-bottom: 0px;
	 width: 65%; /*不占据wpp功能位置*/
 }
 
 h2.title {
	 color: var(--font-color-section-title);
	 font-weight: bold;
	 font-size: 26px;
	 line-height: 26px;
	 padding-top: 0px;
	 padding-bottom: 11px;
	 margin-top: 30px;
	 margin-bottom: 20px;
	 border-bottom: var(--border-section);
	 cursor: pointer;
 }
 
 h3.title {
	 color: var(--font-color-section-title3);
	 font-weight: bold;
	 font-size: 20px;
	 line-height: 24px;
	 padding-top: 0px;
	 padding-bottom: 11px;
	 margin-top: 0px;
	 margin-bottom: 0px;
	 cursor: pointer;
 }
 
 h4.title {
	 color: var(--font-color-section-title3);
	 font-weight: bold;
	 font-size: 18px;
	 line-height: 22px; 
	 padding-top: 0px;
	 padding-bottom: 11px;
	 margin-top: 0px;
	 margin-bottom: 0px;
	 cursor: pointer;
 }
 
 h5.title {
	 color: var(--font-color-section-title3);
	 font-style: italic;
	 font-size: 16px;
	 line-height: 20px; 
	 padding-top: 0px;
	 padding-bottom: 11px;
	 margin-top: 0px;
	 margin-bottom: 0px;
	 cursor: pointer;
 }
 
 .topictitle6 {
	 margin: 1em 0 0.2em 0;
	 font-size: 1em;
	 font-weight: 300;
	 font-style: italic;
	 text-decoration: underline;
 }
 
 .section:first-child{
	 /* 未知的使用场景
	 margin-top: 0px;
	 margin-bottom: 26px; */
 }
 
 .section{
	 margin-top: 6px;
	 margin-bottom: 14px;
 }
 
 .section > *:not(.sectiontitle) {
	 margin-left: 15px;
 }
 
 /* .section > .note {
	 margin-left: 0px;
 } */
 
 /* 图片说明 */
 .fig_caption {
	 margin-top: 8px;
	 margin-bottom: 8px;
	 text-align: center;
 }
 
 /* 图片说明和表格标题 */
 .tablecap,
 .figcap {
	 color: var(--font-color-fig-table);
	 font-size: 14px;
	 line-height: 24px;
	 font-style: unset;
 }
 
 /* ==========================================================================
    4. 右侧内容区域
   ========================================================================== */
 .content_box {
	 width: 100%;
	 height: auto;
	 padding: 16px 40px 0px 40px;
	 position: relative;
	 display: flex;
 }
 
 .middle_view {
	 flex-grow: 1;
	 padding-top: 0px;
	 padding-left: 20px;
	 padding-right: 60px;
	 padding-bottom: 0px;
	 min-height: 0px;
	 font-size: 14px;
	 box-sizing: border-box;
 }
 
 .container{
	 width: 100%;
	 padding-left: 0px;
	 padding-right: 0px;
 }
 
 .link_button {
	 cursor: pointer;
 }
 
 .link_button:hover {
	 color: var(--font-color-link);
 }
 
 .right_content {
	 width: 225px;
	 flex-grow: 0;
	 flex-shrink: 0;
 }
 
 .right_fixed_container{
	 position: fixed;
	 display: flex;
	 flex-direction: column;
	 width: 240px;
 }	
 
 .right_guide{
	 flex-shrink: 1;
	 flex-grow: 1;
	 overflow-x: hidden;
	 overflow-y: auto;
 }	
 
 .feature_guide {
	 width: 100%;
	 display: flex;
	 background: #fff;
	 flex-direction: row;
	 flex-wrap: wrap;
	 align-items: flex-start;
 }
 
 .feature_guide > div {
	 border-left: var(--border-normal);
	 padding: 8px 0px 8px 16px;
	 width: 100%;
	 font-size: 14px;
	 line-height: 24px;
	 color: var(--font-color-right-content-active);
	 overflow: hidden;
 }
 
 .feature_guide > ul {
	 list-style: none;
	 max-height: calc(100vh - 240px);
	 overflow: auto;
	 font-size: 16px;
	 width: 100%;
	 padding: 0px;
 }
 
 .feature_guide ul li.active {
	 border-left: var(--border-menu-active);
	 color: var(--font-color-right-content-active);
 }
 
 .feature_guide li {
	 border-left: var(--border-normal);
	 padding: 8px 0px 8px 16px;
	 list-style-type: none;
	 font-size: 13px;
	 line-height: 22px;
	 color: var(--font-color-right-content);
	 cursor: pointer;
 }
 
 .feature_guide_h2{
 }
 
 .feature_guide_h3{
	 padding-left: 32px !important;
 }
 
 .feature_guide_h4{	
	 padding-left: 48px !important;
 }
 
 /* ==========================================================================
    5. 表格样式
   ========================================================================== */
 .div_table {
	 position: relative;
 }
 
 /* 行悬停高亮（排除 Entry 行） */
 .div_table .table tbody tr:not(.entry):hover {
	 background-color: rgb(239,251,255);
 }
 
 /* 列悬停高亮（排除 Entry 行） */
 .div_table .table td:not(.entry):hover,
 .div_table .table th:not(.entry):hover {
	 background-color: rgb(239,251,255);
 }
 
 .table {
	 border: var(--border-table);
	 font-size: 13px;
	 line-height: 20px;
	 margin-top: 12px;
	 margin-bottom: 12px;
 }
 
 .tablenoborder .table,{
	 margin-top: 12px;
	 margin-bottom: 12px;
 }
 
 /* 边框专用：内嵌套 .table */
 .tableborder {
	 margin-top: 12px;
	 margin-bottom: 12px;
 }
 
 /* 无边框表：.tableborder 内嵌套 .table */
 .tableborder .table{
	 margin-top: 0px;
	 margin-bottom: 0px;
 }
 
 .tablenoborder .table, .tablenoborder td, .tablenoborder tr {
	 border: none !important;
 }
 
 .thead {
	 background-color: var(--background-color-thead);
 }
 
 td, th {
	 padding: 0.5em;
 }
 
 .table>thead>tr>th {
	 font-size: 13px;
	 line-height: 20px;
	 font-weight: bold;
	 color: var(--font-color-fig-table);
	 padding: 2px 10px;
	 border-top: var(--border-table);
	 border-bottom: var(--border-table);
 }
 
 /* 表格单元格通用样式 */
 .table>thead>tr>th, .table>thead>tr>td, 
 .table>tfoot>tr>th, .table>tfoot>tr>td, 
 .table>tbody>tr>th, .table>tbody>tr>td, 
 .table>caption+thead>tr:first-child>td, .table>caption+thead>tr:first-child>th, 
 .table>colgroup+thead>tr:first-child>td, .table>colgroup+thead>tr:first-child>th, 
 .table>thead:first-child>tr:first-child>td, .table>thead:first-child>tr:first-child>th {
	 vertical-align: inherit;
	 border-color: inherit;
	 color: var(--font-color-fig-table);
	 padding: 2px 10px;
	 border-top: var(--border-table);
 }
 
 /* ==========================================================================
    6. 水印效果 (Watermark)
   ========================================================================== */
 .cover {
	 position:absolute;
	 left:0;
	 top:0;
	 z-index:999999999999999;
	 margin-right:60px;
	 margin-left:60px;
	 margin-top:90px;
	 margin-bottom:90px;
	 color: #965454;
	 display:block;
	 padding:2px 1px;
	 /* font-family:'宋体'; */
	 /* font-weight:bold; */
	 font-size:32px;
	 white-space:nowrap;
	 /* text-shadow: 1px 0 0 #eee; */
	 transform:rotate(45deg);
	 -ms-transform:rotate(45deg);
	 -moz-transform:rotate(45deg);
	 -webkit-transform:rotate(45deg);
	 -o-transform:rotate(45deg);
	 -moz-opacity:0.3; opacity:0.3;/*透明*/
	 -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.7071067811865474, M12=-0.7071067811865477, M21=0.7071067811865477, M22=0.7071067811865474, SizingMethod='auto expand')";
 }
 
 .cover-Blink-area { 
	 position:absolute;
	 text-align: center;
	 left:0;
	 top:0;
	 width:100%;
	 height:100%;
	 display:block;
	 z-index:999999999999999;
	 pointer-events: none;
	 overflow: hidden;
 }
 
 .cover-Blink {
	 display:inline-block;
	 margin-right:60px;
	 margin-left:60px;
	 margin-top:90px;
	 margin-bottom:90px;
	 padding:2px 1px;
	 /* font-family:'宋体'; */
	 /* font-weight:bold; */
	 font-size:28px;
	 color:rgba(224, 205, 207, 0.15);/*透明*/
	 white-space:nowrap;
	 /* text-shadow: 1px 0 0 #eee; */
	 transform:rotate(45deg);
	 -ms-transform:rotate(45deg);
	 -moz-transform:rotate(45deg);
	 -webkit-transform:rotate(45deg);
	 -o-transform:rotate(45deg);
 }
 
 /* ==========================================================================
    7. 图片相关样式
   ========================================================================== */
 /* 表格缩放按钮 */
 .table_zoom{
	 position: absolute;
	 float: left;
	 content: "";
	 width: 24px;
	 height: 24px;
	 background-image: url(../images/放大@2x.png);
	 background-size: 24px 24px;
	 cursor: pointer;
 }
 
 #tbl_rowfixed {
	 position: fixed;
	 top: 0px;
	 margin-top: 0px !important;
	 z-index: 1;
	 font-size: 14px;
	 table-layout: fixed;
	 border-color: #DFE1E6;
 }
 
 /* 非轮播图片 */
 .fig .image {
	 display: block;
	 margin: auto;
 }
 
 .fig:not(.carousel) {
	 position: relative;
	 width: auto;
	 margin-top: 6px;
	 margin-bottom: 16px;
 }
 
 /* 图片缩放图标 */
 .img_zoom {
	 position: absolute;
	 float: left;
	 z-index: 10;
	 width: 24px;
	 height: 24px;
	 background-image: url(../images/放大@2x.png);
	 background-size: 24px 24px;
	 cursor: pointer;
 } 
 
 /* 图片热点地图 */
 img.image:not(.icon) {
	 cursor: zoom-in;
 }
 
 .image_usemap{
 }
 
 area{
	 cursor: default;
 }
 
 .img_usemap_tip{
	 display: none;
	 position: fixed;
	 z-index: 1000;
	 border: 1px solid #7b8b6f;
	 border-radius: 5px;
	 padding: 3px 6px;
	 background-color: #FFF;
	 max-width: 300px;
 }
 
 .img_usemap_tip_title{
	 font-size: 14px;
	 font-weight: bold;
	 line-height: 24px;
 }
 
 .img_usemap_tip_text{
	 font-size: 12px;
	 line-height: 20px;
 }
 
 .img_spot{
	 position: absolute;
	 float: left;
	 z-index: 10;
	 width: 20px;
	 height: 20px;
	 background-image:url("../images/spot-grey.gif");
	 background-size: 20px 20px;
	 cursor: pointer;
 }
 
 /* ==========================================================================
    8. 轮播图样式 (Carousel)
   ========================================================================== */
 .carousel-inner{
	 height: auto;
 }
 
 .carousel-inner>.item>img{
	 max-height: 1080px;
 }
 
 .carousel-inner>.item>div>video{
	 max-height: 1080px;
 }
 
 div>video{
	 max-width: 100%;
 }
 
 .fig.carousel.slide{
	 position: relative;
	 background: rgb(239,243,246);
 }
 
 /* 文字模块 */
 .wt_fig_carousel_text_content{
	 position: relative;
	 overflow: hidden;
	 list-style: none;
	 padding: 0;
	 z-index: 1;
 }
 
 .wt_fig_carousel_text_indicators{
	 display: block;
	 overflow-y: auto;
	 position: relative;
	 left: 0;
	 z-index: 1;
	 padding-top: 6px;
	 margin: 10px auto;
	 width: 100%;
	 height: 130px;
	 background: var(--background-color-footer);
	 transition-property: transform;
	 box-sizing: content-box;
	 transform: translate3d(0px, 0px, 0px); 
	 transition-duration: 0ms;
	 transition-timing-function: ease-out;
	 text-align: center;
	 list-style: none;
 }
 
 .wt_fig_carousel_text_slide{
	 width: 100%;
	 height: auto;
 }
 
 .wt_fig_carousel_text_block{
	 position: relative;
	 display: block;
	 width: 100%; 
	 height: auto;
	 padding: 4px 16px;
	 background: var(--background-color-footer);
	 cursor: pointer;
	 box-sizing: border-box;
	 transform: translateZ(0);
	 backface-visibility: hidden;
	 flex-shrink: 0;
	 transition-property: transform;
 }
 
 .wt_fig_carousel_text_block.active .wt_fig_carousel_title{
	 color: red;
 }
 
 .wt_fig_carousel_text_block.active .wt_fig_carousel_para{
	 color: red;
 }
 
 .wt_fig_carousel_title{
	 display: flex;
	 justify-content: left;
	 font-size: 14px;
	 line-height: 24px;
	 color: var(--font-color-fig-carousel-title);
	 padding-bottom: 0px;
 }
 
 .wt_fig_carousel_para{
	 display: flex;
	 justify-content: left;
	 font-size: 12px;
	 line-height: 20px;
	 color: var(--font-color-fig-carousel-para);
	 max-height: 72px;
	 overflow-y: auto;
	 text-align: left;
 }
 
 .wt_fig_carousel_para .p{
	 margin: 0;
 }
 
 /* 左右箭头 */
 .carousel-control{
	 width: 10%;
 }
 
 .carousel-control.left{
	 background-image: none;
	 width: 30px;
	 height: 30px;
	 top: calc(50% - 30px);
	 left: 15px;
 }
 
 .carousel-control.right{
	 background-image: none;
	 width: 30px;
	 height: 30px;
	 top: calc(50% - 30px);
	 right: 15px;
 }
 
 .fig_carousel_left{
	 /* position: absolute;
	 top: calc(50% - 15px);
	 z-index: 5; */
	 display: inline-block;
	 width: 30px;
	 height: 30px;
 }
 
 .fig_carousel_left:before{
	 content: "";
	 display: inline-block;
	 position: relative;
	 background-image:url("../images/图-左滑1@2x.png");
	 background-size: 30px 30px;
	 width: 30px;
	 height: 30px;
 }
 
 .fig_carousel_right{
	 /* position: absolute;
	 top: calc(50% - 15px);
	 z-index: 5; */
	 display: inline-block;
	 width: 30px;
	 height: 30px;
 }
 
 .fig_carousel_right:before{
	 content: "";
	 display: inline-block;
	 position: relative;
	 background-image:url("../images/图-右滑1@2x.png");
	 background-size: 30px 30px;
	 width: 30px;
	 height: 30px;
 }
 
 /* 红点指示器 */
 .carousel-indicators{
	 bottom: 1px;
	 margin-bottom: 0px;
	 background-color: none;
 }
 
 .carousel-indicators li{
	 display: inline-block;
	 width: 32px;
	 height: 4px;
	 border: none;
	 border-radius: 64px;
	 margin: 0px 4px;
	 background-color: var(--background-color-fig-carousel-spot);
 }
 
 .carousel-indicators li.active{
	 display: inline-block;
	 width: 32px;
	 height: 4px;
	 border: none;
	 border-radius: 64px;
	 margin: 0px 4px;
	 background-color: var(--background-color-primary-button);
 }
 
/* ==========================================================================
   9. 视频播放器样式 (Video Player)
   ========================================================================== */
/* 视频容器 */
.wt_video_container {
   position: relative;
   display: inline-block;
   width: 100%;
   max-width: 960px;
   margin: 20px 0;
   border-radius: 4px;
   overflow: hidden;
   box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.3);
   background: #000;
   cursor: pointer;
   touch-action: manipulation;
 }

/* 在JS初始化之前，临时隐藏原生视频元素 */
video[data-wt-initialized="false"] {
   visibility: hidden !important;
   opacity: 0 !important;
}

/* JS初始化完成后移除隐藏样式 */
video[data-wt-initialized="true"] {
   visibility: visible !important;
   opacity: 1 !important;
   transition: opacity 0.3s ease;
}

/* 视频加载占位符 - 在自定义播放器初始化前显示 */
/* 使用内联样式设置高度，避免黑帧闪烁 */
.wt_video_placeholder {
   position: relative;
   width: 100%;
   background: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 50%, #1a1a1a 100%);
   background-size: 200% 200%;
   animation: placeholderShimmer 2s ease-in-out infinite;
   z-index: 1;
   display: flex;
   align-items: center;
   justify-content: center;
   /* 默认最小高度，会被JS覆盖 */
   min-height: 200px;
}

@keyframes placeholderShimmer {
   0% { background-position: 0% 50%; }
   50% { background-position: 100% 50%; }
   100% { background-position: 0% 50%; }
}

/* 占位符加载完成后隐藏 */
.wt_video_container.wt_ready .wt_video_placeholder {
   display: none;
}

/* 视频容器初始化前显示占位符 */
.wt_video_container:not(.wt_ready) video {
   display: none !important;
}
 
 .wt_video_container video {
   display: block;
   width: 100%;
   height: auto;
 }
 
/* 播放按钮遮罩层*/
.wt_video_play_overlay {
   position: absolute;
   bottom: 62px;
   right: 30px;
   width: auto;
   height: auto;
   display: flex;
   align-items: center;
   justify-content: center;
   background: transparent;
   opacity: 0;
   transition: opacity 0.4s ease;
   pointer-events: none;
   transform: translateY(-50%);
     z-index: 10;   
 }
 
 .wt_video_container:hover .wt_video_play_overlay {
   opacity: 1;
 }
 
/* 播放按钮图标 */
.wt_video_play_icon {
   width: 40px;
   height: 40px;
   background: linear-gradient(135deg, #ff1744 0%, #ff5252 50%, #ff1744 100%);
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
   transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
   box-shadow: 
     0 0 12px rgba(255, 23, 68, 0.5),
     0 0 24px rgba(255, 23, 68, 0.3),
     inset 0 0 12px rgba(255, 255, 255, 0.2);
   position: relative;
   pointer-events: auto;
   cursor: pointer;
 }
 
 .wt_video_play_icon::after {
   content: '';
   position: absolute;
   top: -4px;
   left: -4px;
   right: -4px;
   bottom: -4px;
   border-radius: 50%;
   background: transparent;
   border: 2px solid rgba(255, 23, 68, 0.3);
   animation: pulse-ring 2s ease-out infinite;
 }
 
 @keyframes pulse-ring {
   0% { transform: scale(1); opacity: 1; }
   100% { transform: scale(1.5); opacity: 0; }
 }
 
.wt_video_container:hover .wt_video_play_icon {
   transform: scale(1.15);
   box-shadow: 
     0 0 20px rgba(255, 23, 68, 0.6),
     0 0 40px rgba(255, 23, 68, 0.3),
     inset 0 0 20px rgba(255, 255, 255, 0.3);
 }
 
.wt_video_play_icon::before {
   content: "";
   display: block;
   width: 0;
   height: 0;
   border-left: 12px solid #fff;
   border-top: 7px solid transparent;
   border-bottom: 7px solid transparent;
   margin-left: 2px;
 }
 
 
/* ==========================================================================
    视频控制栏样式
   ========================================================================== */
 .wt_video_controls {
   position: absolute;
   bottom: 0;
   left: 0;
   width: 100%;
   padding: 0 8px 8px 8px;
   background: transparent;
   opacity: 0;
   transition: opacity 0.3s ease;
   box-sizing: border-box;
   pointer-events: none;
   z-index: 20; 
 }
 
 /* 悬停时显示控制栏 */
 .wt_video_container:hover .wt_video_controls {
   opacity: 1;
 }
 
 .wt_video_container.playing .wt_video_play_overlay {
   opacity: 0;
   pointer-events: none;
 }
 
 /* 进度条 */
 .wt_video_progress {
   position: relative;
   width: 100%;
   height: 4px;
   background-color: rgba(255, 255, 255, 0.3);
   cursor: pointer;
   margin-bottom: 8px;
   border-radius: 2px;
   transition: height 0.1s ease, background-color 0.2s ease;
   pointer-events: auto;
 }
 
 .wt_video_container:hover .wt_video_progress {
   background-color: #7A736A;
 }
 
 .wt_video_progress:hover {
   height: 6px;
 }
 
 .wt_video_progress_buffer {
   position: absolute;
   top: 0;
   left: 0;
   height: 100%;
   background-color: rgba(255, 255, 255, 0.4);
   border-radius: 2px;
 }
 
 .wt_video_progress_played {
   position: absolute;
   top: 0;
   left: 0;
   height: 100%;
   background: linear-gradient(90deg, #ff1744 0%, #ff5252 50%, #ff1744 100%);
   border-radius: 2px;
   box-shadow: 
     0 0 10px rgba(255, 23, 68, 0.5),
     0 0 20px rgba(255, 82, 82, 0.3);
 }
 
 .wt_video_progress_handle {
   position: absolute;
   top: 50%;
   transform: translate(-50%, -50%) scale(0);
   width: 14px;
   height: 14px;
   background: linear-gradient(135deg, #ff1744 0%, #ff5252 100%);
   border-radius: 50%;
   transition: all 0.2s ease;
   left: 0;
   box-shadow: 
     0 0 0 3px rgba(255, 23, 68, 0.3),
     0 0 10px rgba(255, 23, 68, 0.5);
 }
 
 .wt_video_progress:hover .wt_video_progress_handle {
   transform: translate(-50%, -50%) scale(1);
   box-shadow: 
     0 0 0 4px rgba(255, 23, 68, 0.2),
     0 0 15px rgba(255, 23, 68, 0.6);
 }
 
 /* 控制栏行容器 */
 .wt_video_controls_row {
   display: flex;
   align-items: center;
   justify-content: space-between;
   width: 100%;
 }
 
 .wt_video_controls_left,
 .wt_video_controls_right {
    display: flex;
    align-items: center;
    gap: 8px;
    height: 36px;
    padding: 0 14px;
    background: rgba(20, 20, 20, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-radius: 18px;
    pointer-events: auto;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
    transition: all 0.2s ease;
}
 
 /* 控制按钮 */
 .wt_video_btn {
   background: none;
   border: none;
   cursor: pointer;
   padding: 4px;
   display: flex;
   align-items: center;
   justify-content: center;
   opacity: 0.9;
   border-radius: 50%;
   transition: all 0.2s ease;
   flex-shrink: 0; /* 禁止按钮被压缩 */
 }
 
 .wt_video_btn:hover {
   opacity: 1;
   transform: scale(1.1);
 }
 
 .wt_video_btn svg {
   width: 20px;
   height: 20px;
   fill: #fff;
   transition: all 0.2s ease;
 }
 
 .wt_video_play_pause svg {
   width: 24px;
   height: 24px;
 }
 
 /* 时间显示 */
 .wt_video_time {
   color: #fff;
   font-size: 11px;
   font-family: Roboto, Arial, sans-serif;
   opacity: 1;
   font-weight: 500;
   margin-left: 2px;
   flex-shrink: 0; /* 禁止按钮被压缩 */
 }
 
 .wt_video_container.playing .wt_video_play_overlay {
   display: none;
 }
 
 /* 音量控制 */
 .wt_video_volume_container {
   display: flex;
   align-items: center;
   gap: 8px;
   height: 100%;
   pointer-events: auto;
 }
 
 .wt_video_volume_btn {
   background: none;
   border: none;
   cursor: pointer;
   padding: 4px;
   display: flex;
   align-items: center;
   justify-content: center;
   opacity: 0.9;
   border-radius: 50%;
   transition: all 0.2s ease;
   height: 100%;
 }
 
 .wt_video_volume_btn:hover {
   opacity: 1;
   transform: scale(1.1);
 }
 
 .wt_video_volume_btn svg {
   width: 22px;
   height: 22px;
   fill: #ffffff;
   filter: drop-shadow(0 0 8px rgba(255, 255, 255, 0.5));
 }
 
 /* 音量滑块 */
 .wt_video_volume_slider {
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
   width: 60px;
   height: 4px;
   background: rgba(255, 255, 255, 0.3);
   border-radius: 2px;
   outline: none;
   cursor: pointer;
   margin: 0;
   padding: 0;
   pointer-events: auto;
   transition: opacity 0.2s ease, transform 0.2s ease;
   opacity: 0;
   transform: scaleX(0);
   transform-origin: left;
   box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.3);
 }
 
 .wt_video_volume_slider.hidden {
   opacity: 0;
   transform: scaleX(0);
 }
 
 .wt_video_volume_slider:not(.hidden) {
   opacity: 1;
   transform: scaleX(1);
 }
 
 /* PC端初始状态：音量滑块收起 */
 .wt_video_volume_slider.initial-hidden {
   opacity: 0;
   transform: scaleX(0);
   transition: opacity 0.2s ease, transform 0.2s ease;
 }
 
 
 .wt_video_volume_slider::-webkit-slider-runnable-track {
   background: #ffffff;
   border-radius: 2px;
   height: 4px;
 }
 
 .wt_video_volume_slider::-moz-range-track {
   background: #ffffff;
   border-radius: 2px;
   height: 4px;
 }
 
 .wt_video_volume_slider::-webkit-slider-thumb {
   -webkit-appearance: none;
   appearance: none;
   width: 12px;
   height: 12px;
   background: #ffffff;
   border-radius: 50%;
   cursor: pointer;
   margin-top: -4px;
   box-shadow: 
     0 0 0 2px rgba(255, 255, 255, 0.2),
     0 0 10px rgba(255, 255, 255, 0.3);
   transition: all 0.2s ease;
 }
 
 .wt_video_volume_slider::-webkit-slider-thumb:hover {
   transform: scale(1.4);
   box-shadow: 
     0 0 0 3px rgba(255, 255, 255, 0.3),
     0 0 15px rgba(255, 255, 255, 0.5);
 }
 
 .wt_video_volume_slider::-moz-range-thumb {
   width: 12px;
   height: 12px;
   background: #ffffff;
   border-radius: 50%;
   cursor: pointer;
   border: none;
   margin-top: -4px;
   box-shadow: 
     0 0 0 2px rgba(255, 255, 255, 0.2),
     0 0 10px rgba(255, 255, 255, 0.3);
   transition: all 0.2s ease;
 }
 
 .wt_video_volume_slider::-moz-range-thumb:hover {
   transform: scale(1.4);
   box-shadow: 
     0 0 0 3px rgba(255, 255, 255, 0.3),
     0 0 15px rgba(255, 255, 255, 0.5);
 }
 
 /* ==========================================================================
    10. 代码块样式
   ========================================================================== */
 /* 代码块容器 */
 .pre.codeblock {
   position: relative; /* 为复制按钮绝对定位提供参考 */
 }
   
 /* 复制按钮样式 */
 .copy-btn {
   position: absolute;
   top: 8px;
   right: 8px;
   background-color: #ffffff;
   border: 1px solid #d1d5da;
   border-radius: 4px;
   padding: 4px 8px;
   font-size: 12px;
   color: #24292e;
   cursor: pointer;
   opacity: 0.7; /* 默认半透明 */
   transition: opacity 0.2s ease-in-out;
   z-index: 10; /* 确保按钮在代码内容之上 */
 }
   
 .copy-btn:hover {
   opacity: 1;
   background-color: #f3f4f6;
 }
 
/* ==========================================================================
    11. 倍速控制样式
   ========================================================================== */
/* 倍速按钮容器 */
.wt_video_speed_container {
   position: relative;
   display: flex;
   align-items: center;
}

/* 倍速按钮 */
.wt_video_speed {
   min-width: 40px;
   height: 100%;
   padding: 4px 8px;
   display: flex;
   align-items: center;
   justify-content: center;
}

.wt_video_speed_text {
   color: #fff;
   font-size: 12px;
   font-weight: 500;
   font-family: Roboto, Arial, sans-serif;
}

/* 倍速下拉菜单 */
.wt_video_speed_dropdown {
   position: absolute;
   bottom: 100%;
   right: 0;
   background: linear-gradient(180deg, rgba(35, 35, 35, 0.98) 0%, rgba(25, 25, 25, 0.98) 50%, rgba(20, 20, 20, 0.98) 100%);
   backdrop-filter: blur(16px);
   -webkit-backdrop-filter: blur(16px);
   border-radius: 12px;
   padding: 8px 0;
   min-width: 90px;
   max-height: 200px;
   overflow-x: hidden;
   overflow-y: auto;
   opacity: 0;
   visibility: hidden;
   transform: translateY(12px) scale(0.95);
   transform-origin: bottom right;
   transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
   box-shadow: 
      0 12px 40px rgba(0, 0, 0, 0.5),
      0 4px 16px rgba(0, 0, 0, 0.3),
      inset 0 1px 0 rgba(255, 255, 255, 0.08),
      inset 0 -1px 0 rgba(0, 0, 0, 0.3),
      0 0 0 1px rgba(255, 255, 255, 0.06);
   border: 1px solid rgba(255, 255, 255, 0.08);
   z-index: 100;
   margin-bottom: 10px;
}

/* 倍速下拉菜单滚动条样式 - 细长简洁设计 */
.wt_video_speed_dropdown::-webkit-scrollbar {
   width: 4px;
   height: 4px;
}

.wt_video_speed_dropdown::-webkit-scrollbar-track {
   background: transparent;
   border-radius: 2px;
}

.wt_video_speed_dropdown::-webkit-scrollbar-thumb {
   background: rgba(255, 255, 255, 0.2);
   border-radius: 2px;
   transition: background 0.2s ease;
}

.wt_video_speed_dropdown::-webkit-scrollbar-thumb:hover {
   background: rgba(255, 255, 255, 0.35);
}

.wt_video_speed_dropdown::-webkit-scrollbar-corner {
   background: transparent;
}

.wt_video_speed_dropdown::before {
   content: '';
   position: absolute;
   bottom: -7px;
   right: 16px;
   width: 14px;
   height: 14px;
   background: linear-gradient(45deg, rgba(25, 25, 25, 0.98) 0%, rgba(35, 35, 35, 0.98) 100%);
   transform: rotate(45deg);
   border-right: 1px solid rgba(255, 255, 255, 0.06);
   border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.wt_video_speed_dropdown.show {
   opacity: 1;
   visibility: visible;
   transform: translateY(0) scale(1);
}

/* 倍速选项 */
.wt_video_speed_option {
   padding: 10px 20px;
   color: rgba(255, 255, 255, 0.9);
   font-size: 14px;
   font-family: Roboto, Arial, sans-serif;
   cursor: pointer;
   text-align: center;
   transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
   position: relative;
   width: 100%;
   margin: 2px auto;
   letter-spacing: 0.5px;
}

.wt_video_speed_option:hover {
   background: linear-gradient(135deg, rgba(255, 255, 255, 0.12) 0%, rgba(255, 255, 255, 0.06) 100%);
   color: #fff;
   transform: scale(1.04);
   box-shadow: 0 2px 12px rgba(0, 0, 0, 0.2);
}

.wt_video_speed_option.active {
   background: rgba(244, 67, 54, 0.3);
  border-left: 3px solid #f44336;
}

 
 /* ==========================================================================
    12. 标签页样式 (Tab)
   ========================================================================== */
/* Tab 容器基础样式 */
 .wt-tabbed {
     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
     margin: 24px 0;
     position: relative;
 }
 
 /* 隐藏原始的列表样式 */
 .wt-tabbed.ul {
     list-style: none;
     padding: 0;
     margin: 0;
 }
 
 .wt-tabbed > .li {
     display: none;
 }
 
 /* Tab 包装容器 - 卡片式设计 */
 .wt-tabbed-wrapper {
     background: #fff;
     border-radius: 12px;
     box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
     padding: 16px;
     margin: 16px 0;
 }
 
 /* Tab 导航栏 */
 .tab-header-container {
     display: flex;
     position: relative;
     padding: 0 10px;
     border-bottom: none;
     margin-bottom: 16px;
     list-style: none;
     gap: 0;
     position: relative;
     z-index: 1;
 }
 
 .tab-header-container .tab-btn {
     background: transparent;
     border: none;
     padding: 12px 28px;
     font-size: 14px;
     font-weight: 500;
     color: #64748b;
     cursor: pointer;
     transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
     position: relative;
     outline: none;
     white-space: nowrap;
     flex: 0 0 auto;
     z-index: 1;
 }
 
 .tab-header-container .tab-btn:hover {
     color: #6366f1;
 }
 
 .tab-header-container .tab-btn.active {
     color: #6366f1;
     font-weight: 600;
     background-color: #fff;
     border-radius: 12px 12px 0 0;
 }
 
 /* 选中的 Tab 形状设计 - 反向圆角融合效果 */
 .tab-header-container .tab-btn.active::before,
 .tab-header-container .tab-btn.active::after {
     content: "";
     position: absolute;
     bottom: 0;
     width: 20px;
     height: 20px;
     background-color: transparent;
     pointer-events: none;
 }
 
 .tab-header-container .tab-btn.active::before {
     left: -20px;
     border-bottom-right-radius: 12px;
     box-shadow: 10px 0 0 0 #fff;
 }
 
 .tab-header-container .tab-btn.active::after {
     right: -20px;
     border-bottom-left-radius: 12px;
     box-shadow: -10px 0 0 0 #fff;
 }
 
 /* 弹性短线指示器 */
 .tab-indicator {
     position: absolute;
     bottom: 8px;
     height: 3px;
     width: 20px;
     background-color: #6366f1;
     border-radius: 2px;
     transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
     z-index: 2;
     pointer-events: none;
 }
 
 /* 流体滑块 - 保留作为背景高亮（可选） */
 .tab-slider {
     position: absolute;
     height: calc(100% - 8px);
     top: 4px;
     background: linear-gradient(135deg, rgb(225, 238, 255) 0%, rgb(210, 230, 255) 100%);
     border-radius: 50px;
     z-index: 0;
     pointer-events: none;
     transition: 
         left 0.5s cubic-bezier(0.34, 1.56, 0.64, 1),
         width 0.5s cubic-bezier(0.34, 1.56, 0.64, 1),
         transform 0.3s ease-out,
         filter 0.3s ease-out,
         border-radius 0.3s ease-out;
     box-shadow: 
         0 2px 8px rgba(0, 102, 204, 0.15),
         0 4px 16px rgba(0, 102, 204, 0.1),
         inset 0 0 0 1px rgba(0, 102, 204, 0.1);
     transform-origin: center center;
     opacity: 0;
 }
 
 /* 滑块拉伸状态 */
 .tab-slider.stretching {
     transform: scaleX(1.2);
     filter: blur(0.5px) brightness(1.05);
     border-radius: 40% 60% 40% 60% / 50% 60% 40% 50%;
 }
 
 /* 滑块恢复状态 */
 .tab-slider.restoring {
     transform: scaleX(1);
     filter: blur(0) brightness(1);
     border-radius: 50px;
     transition: 
         left 0.5s cubic-bezier(0.34, 1.56, 0.64, 1),
         width 0.5s cubic-bezier(0.34, 1.56, 0.64, 1),
         transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1),
         filter 0.4s cubic-bezier(0.34, 1.56, 0.64, 1),
         border-radius 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
 }
 
 /* Tab 内容区域 */
 .tab-content-container {
     position: relative;
 }
 
 .tab-content-container > .tab-pane {
     display: none;
     animation: tabFadeIn 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
 }
 
 .tab-content-container > .tab-pane.active {
     display: block;
 }
 
 @keyframes tabFadeIn {
     0% {
         opacity: 0;
         transform: translateY(20px) scale(0.96) perspective(500px) rotateX(3deg);
         filter: blur(6px);
     }
     50% {
         opacity: 0.7;
         transform: translateY(-5px) scale(1.02) perspective(500px) rotateX(-1deg);
         filter: blur(2px);
     }
     100% {
         opacity: 1;
         transform: translateY(0) scale(1) perspective(500px) rotateX(0);
         filter: blur(0);
     }
 }
 
 /* 内容元素交错动画 - 适用于所有直接子元素 */
 .tab-pane.active > * {
     animation: childFadeIn 0.4s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
     opacity: 0;
 }
 
 .tab-pane.active > *:nth-child(1) { animation-delay: 0.05s; }
 .tab-pane.active > *:nth-child(2) { animation-delay: 0.1s; }
 .tab-pane.active > *:nth-child(3) { animation-delay: 0.15s; }
 .tab-pane.active > *:nth-child(4) { animation-delay: 0.2s; }
 .tab-pane.active > *:nth-child(5) { animation-delay: 0.25s; }
 .tab-pane.active > *:nth-child(6) { animation-delay: 0.3s; }
 .tab-pane.active > *:nth-child(7) { animation-delay: 0.35s; }
 .tab-pane.active > *:nth-child(8) { animation-delay: 0.4s; }
 .tab-pane.active > *:nth-child(9) { animation-delay: 0.45s; }
 .tab-pane.active > *:nth-child(10) { animation-delay: 0.5s; }
 .tab-pane.active > *:nth-child(11) { animation-delay: 0.55s; }
 .tab-pane.active > *:nth-child(12) { animation-delay: 0.6s; }
 .tab-pane.active > *:nth-child(13) { animation-delay: 0.65s; }
 .tab-pane.active > *:nth-child(14) { animation-delay: 0.7s; }
 .tab-pane.active > *:nth-child(15) { animation-delay: 0.75s; }
 .tab-pane.active > *:nth-child(16) { animation-delay: 0.8s; }
 .tab-pane.active > *:nth-child(17) { animation-delay: 0.85s; }
 .tab-pane.active > *:nth-child(18) { animation-delay: 0.9s; }
 .tab-pane.active > *:nth-child(19) { animation-delay: 0.95s; }
 .tab-pane.active > *:nth-child(20) { animation-delay: 1s; }
 
 @keyframes childFadeIn {
     from {
         opacity: 0;
         transform: translateY(8px);
     }
     to {
         opacity: 1;
         transform: translateY(0);
     }
 }
 
 /* 列表内部li保持从左到右动画 */
 .tab-pane.active .li {
     animation: listItemFadeIn 0.4s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
     opacity: 0;
 }
 
 .tab-pane.active .li:nth-child(1) { animation-delay: 0.05s; }
 .tab-pane.active .li:nth-child(2) { animation-delay: 0.1s; }
 .tab-pane.active .li:nth-child(3) { animation-delay: 0.15s; }
 .tab-pane.active .li:nth-child(4) { animation-delay: 0.2s; }
 .tab-pane.active .li:nth-child(5) { animation-delay: 0.25s; }
 .tab-pane.active .li:nth-child(6) { animation-delay: 0.3s; }
 .tab-pane.active .li:nth-child(7) { animation-delay: 0.35s; }
 .tab-pane.active .li:nth-child(8) { animation-delay: 0.4s; }
 .tab-pane.active .li:nth-child(9) { animation-delay: 0.45s; }
 .tab-pane.active .li:nth-child(10) { animation-delay: 0.5s; }
 .tab-pane.active .li:nth-child(11) { animation-delay: 0.55s; }
 .tab-pane.active .li:nth-child(12) { animation-delay: 0.6s; }
 .tab-pane.active .li:nth-child(13) { animation-delay: 0.65s; }
 .tab-pane.active .li:nth-child(14) { animation-delay: 0.7s; }
 .tab-pane.active .li:nth-child(15) { animation-delay: 0.75s; }
 .tab-pane.active .li:nth-child(16) { animation-delay: 0.8s; }
 .tab-pane.active .li:nth-child(17) { animation-delay: 0.85s; }
 .tab-pane.active .li:nth-child(18) { animation-delay: 0.9s; }
 .tab-pane.active .li:nth-child(19) { animation-delay: 0.95s; }
 .tab-pane.active .li:nth-child(20) { animation-delay: 1s; }
 
 @keyframes listItemFadeIn {
     from {
         opacity: 0;
         transform: translateX(-10px);
     }
     to {
         opacity: 1;
         transform: translateX(0);
     }
 }
 
 /* 内容列表样式 */
 .tab-pane .ol {
     margin: 0;
     padding-left: 24px;
     color: #333;
     line-height: 1.8;
 }
 
 .tab-pane .li {
     margin-bottom: 12px;
     list-style-type: decimal;
 }
 
 .tab-pane .p {
     margin: 0;
     line-height: 1.6;
 }
 
 /* ==========================================================================
    13. 底部导航样式
   ========================================================================== */
 /* 上一章/下一章导航 */
 .body_footer {
     text-align: center; 
     width: 100%;
     height: 62px;
     margin-top: 20px;
     padding-top: 16px;
     border-top: var(--border-normal);
     font-size: 12px;
     line-height: 18px;
 }
   
 .body_footer_left {
     display:inline-block;
     float:left;
     color: var(--font-color-body-footer);
     cursor: pointer;
 }
   
 .body_footer_left:before {
     content: "";
     display: inline-block;
     width: 12px;
     height: 12px;
     background-image: url("../images/上一章@2x.png");
     background-size: 12px 12px;
     position: relative;
     top: 2px;
     margin-right: 4px;
     cursor: pointer;
 }
   
 .body_footer_right {
     display:inline-block;
     float:right;
     color: var(--font-color-body-footer);
     cursor: pointer;
 }
   
 .body_footer_right:after {
     content: "";
     display: inline-block;
     width: 12px;
     height: 12px;
     background-image: url("../images/下一章@2x.png");
     background-size: 12px 12px;
     position: relative;
     top: 2px;
     margin-left: 4px;
     cursor: pointer;
 }
   
 /* 回到顶部按钮 */
 .body_to_top {
     position: fixed;
     bottom: 136px;
     right: 20px;
     width: 44px;
     height: 44px;
     cursor: pointer;
     z-index: 10;
     border-radius: 22px 22px 22px 22px;
     background-image: url("../images/返回顶部-无阴影@2x.png");
     background-size: 44px 44px;
 }
   
 .body_to_top:hover{
     background-image: url("../images/返回顶部-无阴影@2x.png");
     background-size: 44px 44px;
 }
   
 /* 反馈按钮
 .body_feedback {
     position: fixed;
     bottom: 76px;
     right:20px;
     width: 44px;
     height: 44px;
     cursor: pointer;
     z-index: 10;
     border-radius: 22px 22px 22px 22px;
     background-image: url("../images/评价反馈-无阴影@2x.png");
     background-size: 44px 44px;
 }
   
 .body_feedback:hover {
     background-image: url("../images/评价反馈-无阴影@2x.png");
     background-size: 44px 44px;
 } */