/*
file_name: public.css
from: Static Resource Version Controller
from_url: 
author: https://github.com/laiyuqiang/
update_time: 2026-10-13 04:03:00
User-Agent: Mozilla/5.0 AppleWebKit/537.36 (KHTML, like Gecko; compatible; ClaudeBot/1.0; +claudebot@anthropic.com)
*/
:root{
    --sys_nbc: #4572ad;
    --sys_color: #4572ad;
    --header_hover_nbc0: #3564A0;
    --header_hover_nbc: #3564A0;
    --index_banner_color: #DDD;
    --index_banner_max_600_right: -80px;
    --index_banner_max_600_top: 70px;
    --index_banner_max_855_right: -80px;
    --index_banner_max_855_top: 70px;
    --index_banner_max_1200_right: -30px;
    --index_banner_max_1200_top: 0px;
    --index_banner_smark: block;
    --index_banner_scale: 1;
}
body{
    transition: background-color 0.6s ease;
}
.sys_nbc{
    background:var(--sys_nbc);/*#4c7ab6;*/
}
.sys_color{
    color:var(--sys_nbc);
}
.Tsys_nbc{
    background:var(--sys_nbc)!important;
}
.Tsys_color{
    color:var(--sys_nbc)!important;
}
.header{
    z-index: 100;
    height: 65px;
    transition: all 0.3s;
    margin-top: 0%;
}
.header li{
    letter-spacing: 1.3px;
}
.header_b2{
    background:rgba(76,122,182,1);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}
.header_nav,.mp-footer{
    width:calc(100% - 90px);
    transition: all 0.3s;
}
.header_0{
    margin-top:-100%!important;
}
.siteLogo{
    height:36px;
}
.index_banner{
    height: calc(100vh - 65px);
    padding-top: 65px;
}
.index_bj_n{
    margin:0 45px;
    transition: all 0.3s;
}
.index_banner::after {
    z-index: 2;
    position: absolute;
    content: '';
    height: 100vh;
    top: 0;
    box-shadow: 0px 0px 70px 100px var(--sys_nbc) inset;
    width: 100%;
    padding-bottom: 60px;
    transition: all 0.6s;
    display: var(--index_banner_smark);
}
.index_bj,.index_bj_0{
    z-index: 1;
    min-width: 100%;
    /*left:0;*/
    right: 0;
    /*opacity: 0.3;*/
    opacity: 0;
    object-fit: cover;
}
.index_bj_0{
    scale: var(--index_banner_scale);
}
.index_title{
    font-size: 50px;
    letter-spacing: 3px;
}
.index_banner_n{
    z-index: 3;
    width: calc(100% - 300px);
    height: calc(100% - 65px);
    padding:120px 150px 0 150px;
}
.index_ms{
    font-size: 18px;
}
.index_btn{
    padding: 15px 36px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.07);
    border-radius: 5000px;
    font-size: 15px;
    font-weight: 600;
}
.index_btn:nth-child(1){
    background: #3b7eff;
}
.index_btn:nth-child(2){
    background: #f54291;
}
.index_btn:nth-child(3){
    background: #35ac39;
}
.index_btn:hover{
    background: #fff;
    color:#555;
}
.index_data_n{
    opacity: 1;
}
.index_banner_footer{
    z-index: 3;
    width: calc(100% - 10px);
    padding: 10px 5px;
    font-size: 14px;
}
.header_img,.login_status_img{
    width:22px;
    height:22px;
}
.login_status_img{
    opacity: 0.9;
}
.mu{
    height:50px;
}

/**/
.nav-dropdown {
    position: fixed;
    top: 0px;
    left: 0;
    width: 100%;
    height: calc(50vh - 50px);
    max-height: 290px;
    background: #fff;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    transform: translateY(-150%);
    transition: transform 0.3s ease;
    z-index: 99;
    display: flex;
}
.nav-dropdown.show {
    transform: translateY(0);
}
/* 左侧分类栏 */
.nav-left {
    width: 30%;
    min-width: 80px;
    background: #fafafa;
    border-right: 1px solid #e8e8e8;
    overflow-y: auto;
}
/* 分组标题 */
.nav-group-title {
    padding: 12px 16px;
    color: #999;
    background: #f0f0f0;
    border-bottom: 1px solid #e8e8e8;
    font-size: 14px;
}
/* 一级导航项 */
.nav-level1 {
    padding: 14px 16px;
    color: #333;
    text-decoration: none;
    border-left: 3px solid transparent;
    font-size: 13px;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.nav-level1.active {
    border-left-color: var(--header_hover_nbc);
    color: #fff;
    background: var(--header_hover_nbc0);
}
.nav-level1:not(.active):hover {
    background: #f5f5f5;
}
/* 二级导航项 */
.nav-level2 {
    display: none;
    padding: 14px 24px;
    color: #333;
    text-decoration: none;
    font-size: 13px;
    background: #fff;
}
.nav-level2.active {
    color: #1890ff;
    background: #f0f9ff;
}
.nav-level2:hover {
    background: #f5f5f5;
}
/* 展开箭头 */
.nav-arrow {
    font-size: 12px;
    transition: transform 0.2s;
}
.nav-level1.active .nav-arrow {
    transform: rotate(90deg);
}
/* 右侧内容栏 */
.nav-right {
    width: 70%;
    padding: 16px;
    overflow-y: auto;
}
.content-title {
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 16px;
    padding-bottom: 8px;
    border-bottom: 1px solid #e8e8e8;
    color: #333;
}
.content-list {
    list-style: none;
}
.content-list li {
    margin-bottom: 5px;
}
.content-list li a {
    display: block;
    padding: 10px 12px;
    color: #333;
    text-decoration: none;
    border-radius: 4px;
    transition: background 0.2s;
    font-size: 13px;
}
.content-list li a:hover {
    background: #f5f5f5;
}
.empty-content {
    text-align: center;
    padding: 40px 0;
    color: #999;
}
.nav-right-act{
    background: #f5f5f5;
}
/* 遮罩层 */
.overlay {
    display: none;
    position: fixed;
    top: 56px;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.3);
    z-index: 98;
}
.overlay.show {
    display: block;
}
/**/

.caidan{
    z-index: 100;
    width: calc(100% - 40px);
    top: 50px;
    padding: 20px;
    box-shadow: 0.2px 2.2px 2.5px -14px rgba(0, 0, 0, 0.031),
                0.4px 5.4px 6px -14px rgba(0, 0, 0, 0.044),
                0.8px 10.1px 11.3px -14px rgba(0, 0, 0, 0.055),
                1.3px 18.1px 20.1px -14px rgba(0, 0, 0, 0.066),
                2.5px 33.8px 37.6px -14px rgba(0, 0, 0, 0.079),
                6px 81px 90px -14px rgba(0, 0, 0, 0.11);
    border-top: 0.5px solid #999;
}
.caidan_n > ul > li{
    min-height: 40px;
    font-size: 14px;
    text-align: center;
    color: #555;
    line-height: 40px;
    background: #fff;
    margin-bottom: 1px;
    cursor: pointer;
}
.caidan_n > ul > li:first-child{
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
}
.caidan_n > ul > li:last-child{
    margin-bottom: 0;
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
    overflow: hidden;
}
.caidan_n > ul > li > ul{
    display: none;
}
.caidan_n > ul > li > ul > li{
    height: 30px;
    line-height: 30px;
}
.caidan_n > ul > li:hover{
    /*background: #DDD;*/
    color:rgba(76,122,182,1);
}
.caidan_n > ul > li:hover ul{
    display: block;
    background: #DDD;
    color: #555;
}
.caidan_n > ul > li > ul > li:hover{
    background: #EEE;
    color:rgba(76,122,182,1);
}

.header_rn li{
    cursor: pointer;
}
.header_rn > ul > li{
    position: relative;
    height: 65px;
    line-height: 65px;
    text-align: center;
    margin-right: 10px;
    color: #fef6f0;
    padding:0 5px;
}
.header_rn > ul > li:last-child{
    margin-right: 0;
}
.header_rn > ul > li > ul{
    display: none;
}
.header_rn > ul > li:hover{
    background: var(--header_hover_nbc);
}
.header_rn > ul > li:hover ul:not(.noView){
    position: absolute;
    display: block;
    border: 1px solid #999;
    left: 50%; /* 相对于父元素左移50% */
    transform: translateX(-50%); /* 相对于自身左移50%（抵消自身宽度的一半） */
}
.header_rn > ul > li > ul > li{
    height:42px;
    line-height: 42px;
    background: var(--sys_nbc);
    padding:0 10px;
    white-space: nowrap;
    border-bottom: 1px solid #999;
}
.header_rn > ul > li > ul > li:last-child{
    border-bottom: 0;
}
.header_rn > ul > li > ul > li:hover{
    background: var(--header_hover_nbc);
}
.index_btnn{
    
}
.mp-main-n,.mp-main{
    z-index: 1;
    height: auto;
    /*transition: all 10s;*/
}
.app{
    width:calc(100% - 90px - 60px - 20px);
    min-height: calc(100% - 65px - 10px - 20px);
    background: #fff;
    border-radius: 10px;
    transition: all 0.3s;
    padding:10px;
    display: flex;
}
.appn{
    width:calc(100% - 2px);
    min-height:calc(100% - 2px);
    border: 1px solid #cacaca;
    border-radius: 10px;
    overflow: hidden;
    /*flex: 1;*/
}
.view_v_more{
    width: 14px;
    height: 16px;
}
.view_v_more img{
    opacity: 0.2;
}
.write-title {
    width: calc(100% - 20px);
    height: 30px;
    line-height: 30px;
    margin-left: 10px;
    margin-top: 10px;
    color: #555;
    font-weight: 600;
    font-size: 1em;
    border-bottom: 1px dashed #aaa;
}
.write_edit{
    min-height: 300px;
    border: 1px solid #cacaca;
}
.write_list{
    padding-bottom: 12px;
}
.write_list_v{
    width: 130px;
    min-width: 130px;
    height: 160px;
    min-height: 156px;
    margin-right: 10px;
    border-radius: 4px;
}
.write_list_v:last-child{
    margin-right: 0;
}
.write_list_v_img{
    height: 130px;
}
.write_list_v_img > .bigImg{
    width: 20px;
    height: 20px;
    top: 2px;
    right: 2px;
    opacity: 0.5;
}
.write_list_v_title{
    height: 30px;
    font-size:14px;
    line-height:30px;
}
.write_list_v_act{
    width: 126px;
    min-width: 126px!important;
    height: 156px;
    border: 2px solid #cacaca;
}
.write_list_v_act > .write_list_v_img{
    height: 126px!important;
}
.write_list_v:hover .write_list_v_title{
    background: var(--sys_nbc);
    color: #fff;
}


.mp-footer-n{
    color: #DDD;
    font-size: 14px;
    line-height: 20px;
}
.mp-footer{
    padding:30px 0;
}
.app_b{
    z-index: 1000;
    background: rgba(0,0,0,.2);
}
.app_b_n{
    width:calc(100% - 90px);
    max-height: 70vh;
    left: 50%;
    transform: translateX(-50%);
    bottom: -100vh;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.b_close,.app_b_close{
  /*padding: 5px;*/
  right: 8px;
  /*top: 5px;*/
  font-size: 14px;
  opacity: 0.6;
}
.app_b_header{
    height: 38px;
    /*margin-top: 5px;*/
}
.app_b_zt{
    position: relative;
}
.b_zt,.app_b_zt{
    width: calc(100% - 40px);
    max-height: calc(60vh - 65px);
    /*padding: 0 20px;*/
    margin: 10px 20px;
}
.app_b_no img,.app_b_loading img{
    max-width: 80px;
}
.app_dzXin_list_act_v{
    width: 80px;
}

.login{
    transition: all 0.3s ease;
}
.login-nav{
    min-height: 60px;
    background: #fff;
    transition: all 0.3s ease;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
}
.login_close{
    padding: 5px;
    right: 8px;
    top: 5px;
    font-size: 14px;
    opacity: 0.6;
}
.login-zt{
    width: calc(100% - 40px);
    height: calc(100% - 60px);
    margin: 30px 20px;
}
.login_n1{
    
}
.login_n1 img{
    width: 60px;
}
.login_n1 span{
    font-size: 1.4em;
    font-weight: 500;
}



.login-logo{
    width: 100%;
}
.login-logo > img{
    width:60px;
    margin-top:30px;
}
.pt1{
    font-size: 1.4em;
    margin-top: 10px;
    font-weight: 500;
}
.pt2{
    font-size: 0.8em;
    font-weight: 400;
}
.login-item1{
    width: 295px;
    height: 40px;
    margin:0 auto 20px auto;
}
.mt301{
    margin-top:30px;
}
.login-item1 > div:nth-child(1){
    width:40px;
    height:40px;
}
.login-item1 > div:nth-child(2){
    width:245px;
    font-size: 0.8em;
    line-height: 40px;
    margin-left: 10px;
}
.login_btn_t{
    width: 295px;
    height: 50px;
    background: var(--sys_nbc);
    line-height: 50px;
    margin: 30px auto 20px auto;
    border-radius: 250px;
    color: #fff;
    font-size: 1em;
}
.login-zt > div{
    max-width: 100%;
    max-height: 100%;
}
.login-n,.login-ms{
    min-width: 100%;
    min-height: 100%;
    transition: all 0.6s ease;
    transform:0;
}
.login-n{
    /*display: none;*/
}
.login_dh1{
    opacity:1;
    transition: all 0.3s ease;
}
.login-inp{
    width: calc(100% - 40px);
    height: 36px;
    border: 1px solid #999;
    border-radius: 4px;
    overflow: hidden;
    max-width: 260px;
    margin: 0 auto;
    padding: 0 10px;
    font-size: 0.8em;
}
.login-inp:nth-child(1){
    margin-top:30px;
    margin-bottom: 10px;
}
.login-inp:nth-child(1) > input{
    width: 100%;
    height: 100%;
    border: 0;
}
.login-inp:nth-child(2) > input:nth-child(1){
    width: calc(100% - 80px);
    height: 100%;
    border: 0;
}
.login-inp:nth-child(2) > input:nth-child(2){
    position: absolute;
    border: 0;
    background: #0000;
    font-size: 14px;
    right: 10px;
    top: 11px;
    color: #555;
}
.login-email{
    background: transparent;
}
.login-btn{
    width: calc(100% - 40px);
    height: 36px;
    border-radius: 4px;
    overflow: hidden;
    max-width: 260px;
    margin: 20px auto 0 auto;
    padding: 0 10px;
    text-align: center;
    line-height: 36px;
    background: var(--sys_nbc);
    color: #fff;
}
.other{
    max-width: 300px;
}
.other-t{
    font-size: 14px;
    color: #666;
    background: #f7fafc;
    padding: 0 10px;
}
.other-item{
    width:40px;
    height:40px;
    padding:5px;
    border:1px solid #ddd;
}
.view_list_v_content p{
    /*text-indent: 32px;*/
}
.view_list_v_content p img{
    width: 100%;
    max-width: 600px;
}
.yzm{
    height: 36px;
}
.pay_btn{
    padding:5px 10px;
}

.view_list{
    width:calc(100% - 20px);
}
.view_list li{
    width:calc(100% - 0px);
    padding: 10px 0;
    border-bottom: 1px solid #aaa;
}
.view_list li:first-child{
    padding-top: 0;
}
.view_list li:last-child{
    border-bottom: 0;
}
.view_list_v_n1{
    min-height:30px;
    font-size: 14px;
}
.view_list_v_n1 span span{
    padding: 0 5px;
}
.view_list_v_content{
    padding: 20px 0 10px 0;
}



/**/
.table {
	width:calc(100% - 20px);
    max-width: 100%;
}
table {
    background-color: transparent;
    border-spacing: 0;
    border-collapse: collapse;
}

.table > caption + thead > tr:first-child > th, .table > colgroup + thead > tr:first-child > th, .table > thead:first-child > tr:first-child > th, .table > caption + thead > tr:first-child > td, .table > colgroup + thead > tr:first-child > td, .table > thead:first-child > tr:first-child > td {
    border-top: 0;
}
.table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td {
    vertical-align: middle;
}
.table > thead{
    position: sticky;/*固定*/
    background: #fff;
    top: 0;
}
.table > thead > tr > th {
    vertical-align: bottom;
    border-bottom: 2px solid #ddd;
}
.table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td {
    padding: 8px;
    line-height: 1.42857143;
    vertical-align: top;
    border-top: 1px solid #ddd;
}
.table > tbody > tr:first-child td{
    border-top: none!important;
}
th {
    text-align: left;
}
td, th {
    padding: 0;
}
.table-hover tbody tr:hover td, .table-hover tbody tr:hover th {
    background-color: #EEE;
}
tr th{
    min-width: 40px;
}
tr td:nth-child(1){
    max-width: 112px;
    flex-flow: row wrap;
    word-break: break-all;
}
tr td:nth-child(2){
    max-width: 200px;
    flex-flow: row wrap;
    word-break: break-all;
}
.view_v_more:hover img{
    opacity: 0.5;
}

.inpn{
    width:calc(100% - 20px);
    margin:10px;
}
.inp{
    margin-bottom: 10px;
}
.inp:last-child{
    margin-bottom: 0;
}
.inp-title{
    min-width: 72.32px;
    font-size: 15px;
    color: #555;
}
.inp-title > span{
    color:red;
    margin-left: 5px;
}
.inp > input,.inp > span > input{
    width: calc(100% - 2px);
    height: 34px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    text-indent: 10px;
    box-shadow: inset 0 1px 1px rgb(0 0 0 / .075);
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}
.inp > input::placeholder{
    color: #999;
}
.inp > input:focus {
    border-color: #66afe9;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgb(0 0 0 / .075),0 0 8px rgb(102 175 233 / .6);
    box-shadow: inset 0 1px 1px rgb(0 0 0 / .075),0 0 8px rgb(102 175 233 / .6);
}
.selectN select{
    width:90px;
    min-width:80px;
    height:34px;
    border-color: #ccc;
    text-indent: 2px;
}
.selectN select option{
    text-indent: 2px;
}
.selectN span{
    font-size: 14px;
    line-height: 18px;
}

.xieyi{
    min-height: 26px;
    font-size: 14px;
}
._fwxy{
    color: blue;
}
.app-tis p{
    font-size: 14px;
    margin: 10px 0;
    color: #555;
}
#edui1{
    width: calc(100% - 2px)!important;
}
#edui1_iframeholder{
    width: 100%!important;
}

.t_t_btn{
    width:calc(100% - 20px);
    border-bottom: 1px dashed #aaa;
}
.t_t_btn li{
    cursor: pointer;
    line-height: 30px;
    padding:0 10px;
    border-radius: 8px;
    border: 1px solid #aaa;
    display: inline-block;
    font-size: 14px;
    margin: 0 10px 5px 0;
}
.t_t_btn li:last-child:not(.view_border){
    border:none;
}
.t_t_btn li:not(:last-child):hover{
    background: #E0E0E0;
}
.t_t_btn li:last-child:hover{
    opacity: 0.8;
}
.tis_box{
    padding: 5px 10px;
    width: calc(100% - 40px);
    background: #60c5ff;
    border-radius: 8px;
    font-size: 14px;
}


.app_yp_t_tab{
    width: calc(100% - 40px);
    display: flex;
    gap: 12px;
    padding: 0 0 10px 0;
}
.tab {
  flex-shrink: 0;
  padding: 5px 10px;
  background: #eee;
  border-radius: 12px;
  font-weight: 500;
  cursor: pointer;
  transition: 0.2s;
  font-size: 15px;
  white-space: nowrap;
}
.tab.active {
  background: var(--sys_nbc);
  color: #fff;
}
.stamp-card {
  max-width: 80px;
  text-align: center;
}
.stamp-card:hover{
    box-shadow: #aaa 0px 0px 10px;
}
.app_yp_list{
    padding:0 0 10px 0;
}
.selectYp_img{
    width: 80px!important;
    height: 102px!important;
    padding-top: 6px!important;
}
.app_xin_pay_n_sub{
    line-height: 36px;
}
.app_xin_pay_box_v{
    width: calc(50% - 7px);
    height: 32px;
    border: 1px solid #ccc;
}
.app_xin_pay_box_v_act{
    border-color: var(--sys_nbc);
    color: var(--sys_color);
}
.jubaoInp{
    width: calc(100% - 20px);
    min-height: 100px;
    padding: 5px;
    border:1px solid #999;
}
.jubaoInp:focus{
    background-color: #fff;
}
.Friendship_Link a{
    margin-right: 20px;
}
.Links-n div:not(:nth-child(1)){
    margin-top:5px;
    cursor: pointer;
}
.Links-site div:nth-child(2){
    max-width: 220px;
}
.Links-n div:nth-child(2){
    margin-top:15px;
}
.record span{
    position: relative;
    margin-right: 10px;
}
.record span img{
    position: absolute;
    width: 16px;
    height: 16px;
    top:2px;
}
.record span a{
    margin-left: 22px;
}
.editor_zz{
    z-index: 10;
}
.upQhNBtn{
    padding: 5px 10px;
    background: var(--sys_nbc);
    border-bottom-left-radius: 4px;
}
.upNav,.recordNav{
    padding:10px;
}

/**/
.preview-box {
    border-radius: 8px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}
.preview-head {
    /*background: #27293d;*/
    padding: 5px 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-shrink: 0;
    /*border-bottom: 1px solid #dedede;*/
}
.preview-head-buttons {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}
.preview-btn {
    padding: 5px 8px;
    border-radius: 6px;
    border: none;
    cursor: pointer;
    font-size: 12px;
    transition: 0.2s;
}
.preview-btn-toggle {
    background: #3b82f6;
    color: #fff;
}
.preview-btn-refresh {
    background: #10b981;
    color: #fff;
}
.preview-btn:hover {
    opacity: 0.85;
}

.preview-body {
    width: 100%;
    flex:1;
    display: inherit;
}
.preview-content-item {
    width: calc(100% - 20px);
    padding: 10px;
    display: none;
}
.preview-content-item.active {
    display: block;
}
/* 代码面板父容器：固定最大高度，负责滚动 */
#preview-code-item.ovy {
    max-height: 360px;
    overflow-y: auto;
    flex:1;
}

.preview-code-input {
    width: 100%;
    box-sizing: border-box;
    background: transparent;
    color: #e2e8f0;
    border: none;
    outline: none;
    resize: none;
    font-family: Consolas, Monaco, monospace;
    font-size: 14px;
    line-height: 1.5;
    /* 禁止textarea出现滚动条 */
    overflow-y: hidden !important;
}
.preview-wrap {
    background: #ffffff;
    height: 360px;
}
#preview-frame {
    width: 100%;
    border: none;
    height: 100%;
    display: block;
}
.preview-content-item:nth-child(1){
    max-height: 360px;
}
.preview-content-item:nth-child(2){
    background: #181825;
}
/**/
.btn-group {
    margin-top:36px;
}
button {
    padding:10px 22px;
    border-radius:6px;
    border:none;
    cursor:pointer;
    font-size:15px;
}
.btn-primary {
    background:var(--sys_nbc);
    color:white;
}
.btn-danger {
    background:#dd4444;
    color:white;
}
.help{
    width: 15px;
    min-width: 15px;
    height: 15px;
    min-height: 15px;
    cursor: pointer;
    display: inline-block;
}
.span-tis{
    color:var(--sys_color);
}
.toTop{
    width: 20px;
    height: 20px;
    right: 30px;
    bottom: 10px;
    background: #555;
}
.view_list_v_content img{
    cursor: pointer;
    width: 100%;
    max-width: 560px;
}

.header_hover_nbc{
    background: var(--header_hover_nbc)!important;
}
.LY_date_select_sub,
.daystable td.action,
.jedate .jedate-footbtn .timecon,
.jedate .jedate-footbtn .btnscon span,
.jedate .jedate-footbtn .btnscon span:last-child,
.hmslist ul li.action{
    background: var(--sys_nbc)!important;
    background-color: var(--sys_nbc)!important;
}
.fy_nav .fyAct{
    border-color: var(--sys_nbc);
}
.is_userd{
    padding: 2px 5px;
    background: var(--sys_nbc);
}
.is_userd.no{
    background: #d56464;
}
.write_yuyin{
    min-height: 160px;
}
.write_yuyin img{
    width: 80px;
    height: 80px;
}
.view_music_n{
    height:45px;
    border:1px dashed var(--sys_nbc);
}
.waveform_btn{
    width: 50px;
}
/**/

/*套餐弹窗*/
.package-mask {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.55);
    z-index: 9998;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 16px;
    box-sizing: border-box;
}
/* 弹窗盒子：设置最大高度 */
.package-modal {
    width: 100%;
    max-width: 600px;
    max-height: 75vh; /* 弹窗整体最大高度 */
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}
/* 头部标题：固定，不参与滚动 */
.modal-header {
    flex-shrink: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 20px;
    border-bottom: 1px solid #eee;
}
.modal-title {
    font-size: 17px;
    font-weight: 600;
}
.modal-close {
    border: none;
    background: none;
    font-size: 22px;
    cursor: pointer;
    color: #666;
    padding: 0 4px;
}
/* 列表区域：flex:1占剩余高度，内容过多滚动 */
.package-list-wrap {
    flex: 1;
    overflow-y: auto;
}
.package-item {
    padding: 16px 20px;
    border-bottom: 1px solid #f0f0f0;
    cursor: pointer;
}
.package-item:active {
    background-color: #f7f7f7;
}
/* 当前生效套餐高亮样式 */
.package-item.active-pkg {
    background-color: rgba(var(--sys_nbc_rgb), .1);
    border-left:4px solid var(--header_hover_nbc);
}
.pkg-name {
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 8px;
    display:flex;
    gap:8px;
    align-items:center;
}
.active-tag{
    font-size:12px;
    color:var(--sys_color);
    border:1px solid var(--sys_nbc);
    border-radius:4px;
    padding:2px 6px;
}
.pkg-time {
    font-size: 13px;
    color: #666;
    line-height: 1.6;
}
/*套餐弹窗*/

/*云同步弹窗*/
.cloud-draft-mask {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.5);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}
.cloud-draft-modal {
    width: 1000px;
    max-width: 90vw;
    min-height: 300px;
    max-height: 80vh;
    background: #ffffff;
    border-radius: 8px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}
.modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    border-bottom: 1px solid #eee;
}
.modal-title {
    font-size: 16px;
    font-weight: 600;
}
.modal-close {
    border: none;
    background: transparent;
    font-size: 22px;
    cursor: pointer;
    color: #666;
    padding: 0 6px;
}
.draft-list-wrap {
    flex: 1;
    overflow-y: auto;
    padding: 12px 16px;
}
.draft-item {
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    padding: 12px;
    margin-bottom: 10px;
}
/*.draft-content {
    font-size: 14px;
    color: #333;
    margin-bottom: 6px;
    word-break: break-all;
}*/
/*.draft-content {
    font-size: 14px;
    color: #333;
    margin-bottom: 6px;
    word-break: break-all;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}*/
.draft-content {
    font-size: 14px;
    color: #333;
    margin-bottom: 6px;
    word-break: break-all;
    max-height: 80px; /* 单条内容最大高度 */
    overflow-y: auto; /* 超出垂直滚动 */
}
.draft-time {
    font-size: 12px;
    color: #888;
    line-height: 30px;
}
.draft-buttons-n{
    min-height: 30px;
}
.draft-buttons {
    display: flex;
    gap: 10px;
}
.btn-EEE {
    padding: 5px 14px;
    border: none;
}
.btn-restore {
    padding: 5px 14px;
    border: none;
    background: rgba(var(--sys_nbc_rgb), .8);
}
.btn-delete {
    padding: 5px 14px;
    border: none;
    background: #f56c6c;
}
/*云同步弹窗*/

/*认领时光信弹窗*/
.cl-claim-mask {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0,0,0,0.6);
    z-index: 9998;
}
.cl-claim-pop {
    position: fixed;
    top: 50%;
    left: 50%;
    width: calc(100% - 20px);
    max-width: 360px;
    transform: translate(-50%, -50%);
    background: #fff;
    padding: 15px;
    border-radius: 10px;
    z-index: 9999;
    box-sizing: border-box;
}
.cl-claim-title {
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    margin-bottom: 24px;
}
.cl-claim-item {
    margin-bottom: 16px;
}
.cl-claim-item label {
    display: block;
    margin-bottom: 6px;
    font-size: 14px;
    color: #333;
}
.cl-claim-item input {
    width: 100%;
    box-sizing: border-box;
    padding: 10px 12px;
    border: 1px solid #ddd;
    border-radius: 6px;
    font-size: 14px;
}
.cl-claim-submit {
    width: 100%;
    padding: 11px;
    background-color: var(--sys_nbc);
    color: #fff;
    border: none;
    border-radius: 6px;
    font-size: 15px;
    cursor: pointer;
}
.cl-claim-submit:hover {
    opacity: .9;
}
/*认领时光信弹窗*/

/*自定义分页*/
.my-pager {
    display: flex;
    gap: 6px;
    align-items: center;
}
.my-pager__btn {
    padding: 4px 10px;
    border: 1px solid #ccc;
    background: #fff;
    cursor: pointer;
}
.my-pager__btn:disabled {
    color: #aaa;
    cursor: not-allowed;
}
.my-pager__btn.my-pager__active {
    background: var(--sys_nbc);
    color: white;
    border-color: var(--sys_nbc);
}
.my-pager__ellipsis {
    padding: 0 6px;
}

/*自定义分页*/

/*背景弹窗*/
.bg-picker-mask{
    position:fixed;
    left:0;top:0;right:0;bottom:0;
    background:rgba(0,0,0,0.6);
    display:none;
    align-items:center;
    justify-content:center;
    z-index:9999;
}
.bg-picker-popup{
    width: calc(100% - 60px);
    max-width:960px;
    max-height: 80vh;
    background:#fff;
    border-radius:8px;
    padding:20px;
}
.bg-picker-title{
    font-size:18px;
    margin-bottom:10px;
    display:flex;
    justify-content:space-between;
}
/* ===== 新增分类标签样式 ===== */
.bg-picker-tabs{
    display:flex;
    gap:8px;
    margin-bottom:10px;
    flex-wrap:wrap;
    font-size: 13px;
}
.bg-picker-tab-item{
    padding:6px 14px;
    border:1px solid #ccc;
    border-radius:4px;
    cursor:pointer;
}
.bg-picker-tab-item.bg-picker-tab-active{
    background:var(--sys_nbc);
    color:#fff;
    border-color:var(--sys_nbc);
}
/* =========================== */
.bg-picker-list{
    display:grid;
    grid-template-columns: repeat(4, 1fr);
    gap:12px;
    max-height:calc(80vh - 118px);
    overflow-y:auto;
    margin-bottom:10px;
}
.bg-picker-item{
    border:2px solid transparent;
    border-radius:6px;
    cursor:pointer;
    overflow:hidden;
}
.bg-picker-item.bg-picker-active{
    border-color:var(--sys_nbc);
}
.bg-picker-item img{
    width:100%;
    height:100px;
    object-fit:cover;
    display:block;
}
.bg-picker-buttons{
    text-align:right;
    gap:10px;
    display:flex;
    justify-content:flex-end;
}
.bg-picker-buttons button{
    padding:6px 16px;
    cursor:pointer;
}
#bg-picker-confirm{
    background: var(--sys_nbc);
    color:#fff;
}
/*背景弹窗*/
/*录上传音区域*/
/* ---------- 录音区域 ---------- */
.record-area {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.record-timer {
    font-size: 3rem;
    font-weight: 300;
    font-variant-numeric: tabular-nums;
    color: var(--sys_color);
    letter-spacing: 2px;
    line-height: 1.2;
    text-align: center;
    font-family: 'SF Mono', 'Fira Code', monospace;
    transition: color 0.2s;
}
.record-timer.recording {
    color: var(--sys_nbc);
    animation: pulse 1.2s ease-in-out infinite;
}
@keyframes pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.6; }
}
.record-hint {
    font-size: 0.78rem;
    color: #6a6a9a;
    text-align: center;
    min-height: 1.2em;
}
.record-buttons {
    display: flex;
    gap: 16px;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 4px;
}

/* ---------- 播放区域 ---------- */
.play-area {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.play-duration-info {
    font-size: 0.9rem;
    color: #a0a0d0;
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.5px;
    font-weight: 500;
}
.play-duration-info span {
    color: #c8c8ff;
    font-weight: 600;
}
.play-position {
    font-size: 1.6rem;
    font-weight: 300;
    font-variant-numeric: tabular-nums;
    color: var(--sys_nbc);
    letter-spacing: 2px;
    font-family: 'SF Mono', 'Fira Code', monospace;
    padding: 6px 20px;
}
.play-position span {
    color: var(--sys_nbc);
}

.progress-visual {
    width: 100%;
    height: 6px;
    border: 1px solid var(--sys_nbc);
    border-radius: 10px;
    overflow: hidden;
}
.progress-visual-inner {
    height: 100%;
    width: 0%;
    background: linear-gradient(90deg, var(--sys_nbc),var(--header_hover_nbc0));
    border-radius: 10px;
    animation: flowLeftToRight 8s linear infinite;
}
@keyframes flowLeftToRight {
  0% {
    background-position: 0% 0%;
  }
  100% {
    background-position: 200% 0%;
  }
}
.play-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: center;
}

/* ---------- 按钮通用 ---------- */
.btnv {
    background: #252538;
    border: 1px solid var(--sys_nbc);
    border-radius: 40px;
    padding: 9px 18px;
    font-size: 0.85rem;
    font-weight: 600;
    color: #e2e2f0;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-width: 104px;
    letter-spacing: 0.3px;
    transition: background 0.15s, opacity 0.15s, border-color 0.15s, color 0.15s;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
}
.btnv:active:not(:disabled) {
    transform: translateY(1px);
}

.btnv:disabled {
    opacity: 0.4;
    filter: grayscale(0.7);
    cursor: not-allowed;
    border-color: #2a2a3a;
    background: #1e1e2a;
    color: #6a6a8a;
}

.btn-record {
    background: var(--sys_nbc);
    border-color: var(--sys_nbc);
    color: #fff;
}
.btn-record:disabled {
    background: var(--sys_nbc);
    border-color: var(--sys_nbc);
    color: #999;
    opacity: .9;
}
.btn-record.active {
    background: #8b2a2a;
    border-color: #c04040;
    color: #ffe0e0;
}

.btn-play {
    background: var(--sys_nbc);
    border-color: var(--sys_nbc);
    color: #fff;
}
.btn-play:disabled {
    background: var(--sys_nbc);
    border-color: var(--sys_nbc);
    color: #999;
    opacity: .9;
}

.btn-stop {
    background: var(--sys_nbc);
    border-color: var(--sys_nbc);
    color: #fff;
}
.btn-stop:disabled {
    background: var(--sys_nbc);
    border-color: var(--sys_nbc);
    color: #999;
    opacity: .9;
}

.btn-reset {
    background: var(--sys_nbc);
    border-color: var(--sys_nbc);
    color: #fff;
}

.btn-done {
    background: var(--sys_nbc);
    border-color: var(--sys_nbc);
    color: #fff;
}
.btn-done:disabled {
    background: #1e1e2a;
    border-color: #2a2a3a;
    color: #6a6a8a;
}

.hidden {
    display: none !important;
}

.upload-tip {
    font-size: 0.72rem;
    color: #7a7a9a;
    text-align: center;
}
.upload-tip.ok { color: var(--sys_nbc) }
.upload-tip.err { color: #ff8c6c; }
.write_yuyin button:disabled{
    display: none;
}
/*录上传音区域*/

@media screen and (min-width: 1200px) {
    
}
@media screen and (max-width: 1200px) {
    .index_bj,.index_bj_0{
        right: var(--index_banner_max_1200_right)!important;
        /*left: var(--index_banner_max_1200_left)!important;*/
    }
    .index_banner::after{
        transition: all 0.1s;
    }
}
@media screen and (max-width: 1130px) {
    .Links-c{
        padding:0 20px;
    }
}
@media screen and (max-width: 955px) {
    .Links-site div:nth-child(2){
        max-width: 180px;
    }
}
@media screen and (min-width: 855px) {
    .mu{
        display: none!important;
    }
    .caidan,.nav-dropdown,.overlay{
        display: none!important;
    }
    .header_nav,.app_b_n,.mp-footer{
        max-width: calc(1200px + 60px + 20px);
    }
    .app{
        max-width: 1200px;
        margin-top:75px;
    }
    .inp{
        display: flex;
    }
    .inp-title{
        display: flex;
        align-items: center;
    }
    .inp > input,.inp > span > input,.inp > textarea,.selectN{
        margin-top:0!important;
        margin-left: 10px;
    }
    .atpl.view{
        display: flex!important;
    }
    .about-img-l,
    .about-img-r {
        width: 50%;
    }
    .douyin_ewm2{
        display: none;
    }
    .dym_tis1{
        display: inline-block;
    }
    .backup,.qiehuanLz{
        position: absolute;
        top: 30px;
    }
    .backupY{
        position: absolute;
        top: 66px;
    }
    .Links-c{
        gap: 80px;
        justify-content: center;
    }
}
@media screen and (max-width: 855px) {
    body{
        min-height: 100vh;
    }
    .header{
        height:50px;
    }
    .header_nav,.mp-footer{ 
        width:calc(100% - 10px);
    }
    .app_b_n{
        width:100vw;
    }
    .siteLogo{
        height:36px;
    }
    .header_dn{
        display: none;
    }
    .header_rn_ul li:nth-child(2){
        margin-right: 0!important;
    }
    .header_rn > ul > li{
        height: 50px;
        line-height: 50px;
    }
    .index_banner{
        height: calc(100vh - 50px);
        padding-top: 50px;
    }
    .index_banner_n {
        width: calc(100% - 90px);
        height: calc(100% - 65px);
        padding: 120px 45px 0 45px;
    }
    .index_bj_n {
        margin: 0;
    }
    .index_bj,.index_bj_0{
        right: var(--index_banner_max_855_right)!important;
        top: var(--index_banner_max_855_top);
    }
    .index_banner::after{
        box-shadow: 0px 0px 20px 10px var(--sys_nbc) inset;
    }
    .mu{
        height: 40px;
    }
    .app{
        width:calc(100% - 30px - 0px);
        margin-top:60px;
    }
    .yzm_inp{
        margin-top:0!important;
    }
    .mobile_x_nov {
        display: none;
    }
    .yzm_inp,.xieyi,.btn{
        margin-top: 0 !important;
    }
    .selectN,.write_edit,.write_list,.xieyi,.btn,.write_p_vn,.write_yuyin,.yuyinN{
        margin-left: 0 !important;
    }
    .atpl.view{
        display: block!important;
    }
    .app-tis{
        margin-left: 0!important;
    }
    .btn.cz_btn{
        margin-left: 10px!important;
    }
    .about-img-r{
        display: none;
    }
    .douyin_ewm2{
        display: block;
    }
    .dym_tis1{
        display: none;
    }
    .backup,.qiehuanLz{
        display: inline-block;
        margin-left: 10px!important;
    }
    .backupY{
        display: inline-block;
        margin-left: 10px!important;
    }
    .Links-c{
        gap: 20px;
        justify-content: space-between;
        padding: 0!important;
    }
    .Links-site{
        display: none;
    }
    .index_banner_footer{
        position: absolute;
        width: calc(100vw - 10px)!important;
    }
    .btnv{
        font-size: 0.65rem!important;
    }
}
@media screen and (max-width: 730px) {
    .index_title{
        font-size: 48px;
    }
    
}
@media screen and (min-width: 710px) {
    
}
@media screen and (max-width: 710px) {
    .Links-c{
        gap: 20px;
    }
}
@media screen and (max-width: 600px) {
    .index_bj,.index_bj_0{
        right: var(--index_banner_max_600_right)!important;
        top: var(--index_banner_max_600_top);
    }
}
@media screen and (max-height: 550px) {
    .ly_tj{
        display: none;
    }
}
@media screen and (max-height: 495px) {
    .copyright{
        display: none;
    }
}
@media screen and (max-height: 450px) {
    .record{
        display: none;
    }
}
@media screen and (max-width: 398px) {
    .index_title{
        font-size: 46px;
    }
    .index_data_n{
        width: 100%;
        opacity: 0.8;
        margin-left: 10px;
    }
}
@media screen and (max-width: 385px) {
    .index_title{
        font-size: 38px;
    }
}
@media screen and (max-width: 360px) and (max-height: 640px){
    .index_btn{
        padding: 12px 30px;
    }
}
@media screen and (max-width: 335px) {
    .index_banner_n {
        width: calc(100% - 60px);
        padding: 50px 30px 0 30px;
    }
}
@media screen and (max-width: 322px) {
    .nav-dropdown{
        max-height: 245px;
    }
    .nav-left div,.nav-right ul li a{
        padding: 10px;
    }
    .nav-right{
        padding:10px 16px;
    }
    .content-title{
        margin-bottom: 5px;
    }
    .content-list li {
        margin-bottom: 0!important;
    }
}