*{margin:0;padding:0;box-sizing:border-box;font-family:"Microsoft YaHei",sans-serif;}
body {
    margin: 0;
    background: #0a0a0a;
    background-attachment: fixed; /* 保证滚动时背景固定 */
    background-size: 400% 400%;  /* 为动画效果准备 */
    animation: gradientBG 15s ease infinite;
    color: #fff;      /* 基础文字设为白色 */
    font-family: sans-serif;
    min-height: 100vh;
}

/* @keyframes gradientBG { */
    /* 0% { background-position: 0% 50%; } */
    /* 50% { background-position: 100% 50%; } */
    /* 100% { background-position: 0% 50%; } */
/* } */
.container{max-width:1400px;margin:0 auto;background-color:rgba(255,255,255,0.9);border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,0.15);overflow:hidden;margin-top:35px;margin-bottom:0px;}
header{background:linear-gradient(to right,#ff8c00,#ff6a00);padding:15px 25px;display:flex;align-items:center;justify-content:space-between;}
.logo{display:flex;align-items:center;gap:15px;}
.logo img{height:50px;filter:drop-shadow(0 2px 4px rgba(0,0,0,0.2));}
.logo-text{color:white;font-size:18px;font-weight:bold;text-shadow:0 2px 4px rgba(0,0,0,0.3);}
.header-info{color:white;font-size:14px;text-align:right;}
.summary-box{background-color:#fff0cc;padding:20px;text-align:center;margin:20px;border-radius:8px;border-left:4px solid #ff8c00;font-size:18px;font-weight:bold;color:#d35400;}
.tabs-container{padding:0 20px 20px;}
.tabs-header{display:flex;justify-content:center;margin-bottom:20px;flex-wrap:wrap;}
.tab-label{display:none;}
.tab-button{padding:12px 25px;background:linear-gradient(to bottom,#ffd793,#ffc66d);color:#d35400;border:none;border-radius:6px 6px 0 0;font-weight:bold;font-size:16px;cursor:pointer;transition:all 0.3s ease;margin:0 5px;border:1px solid #ffb347;border-bottom:none;position:relative;top:1px;}
.tab-button:hover{background:linear-gradient(to bottom,#ffc66d,#ffb347);}
.tab-label:checked + .tab-button{background:linear-gradient(to bottom,#fff,#fff9e6);color:#d35400;font-weight:bold;border-bottom:1px solid #fff;z-index:2;}
.tab-content-container{background-color:#fff;border-radius:8px;border:1px solid #ffb347;min-height:500px;padding:25px;position:relative;}
.tab-pane{display:none;min-height:450px;}
.tab-label:checked ~ .tab-content-container .tab-pane{display:block;}
.loading-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background-color:rgba(255,255,255,0.8);display:flex;align-items:center;justify-content:center;z-index:10;border-radius:8px;}
.loading-spinner{font-size:40px;color:#ff8c00;animation:spin 1s linear infinite;}
@keyframes spin{0%{transform:rotate(0deg);}
100%{transform:rotate(360deg);}
}
/**
.log-table{width:100%;border-collapse:collapse;margin-top:20px;}
.log-table thead{background:linear-gradient(to bottom,#ffd793,#ffc66d);}
.log-table th{padding:15px 20px;text-align:left;color:#d35400;font-weight:bold;font-size:16px;}
.log-table tr:nth-child(even){background-color:#fff9e6;}
.log-table tr:hover{background-color:#fff0cc;}
.log-table td{padding:15px 20px;border-bottom:1px solid #ffe8b3;color:#7d5a28;}
**/
.item-cell{display:flex;align-items:center;}
.item-icon{width:40px;height:40px;margin-right:15px;background-size:cover;background-position:center;border:1px solid #ffc66d;border-radius:4px;}
.item-details{flex:1;}
.item-name{font-weight:bold;color:#d35400;font-size:16px;}
.item-meta{font-size:14px;color:#a87d3b;}
.pagination{display:flex;justify-content:center;padding:15px;}
.pagination-button{padding:8px 15px;margin:0 5px;background:linear-gradient(to bottom,#ff8c00,#e67e22);color:white;border:none;border-radius:4px;font-weight:bold;cursor:pointer;transition:all 0.3s ease;min-width:40px;text-align:center;border:1px solid #d35400;}
.pagination-button:hover{background:linear-gradient(to bottom,#ff9e40,#ff8c00);transform:translateY(-2px);}
.pagination-button.active{background:linear-gradient(to bottom,#d35400,#e67e22);transform:scale(1.05);}
.footer{text-align:center;padding:20px;color:#7d5a28;font-size:14px;/* background-color:rgba(255,215,147,0.4); */;border-top:1px solid #ffc66d;}
@media (max-width:768px){.tabs-header{flex-direction:column;align-items:stretch;}
.tab-button{border-radius:6px;margin-bottom:5px;border-bottom:1px solid #ffb347;text-align:center;}
.tab-label:checked + .tab-button{border-bottom:1px solid #ffb347;}
.log-table{font-size:14px;}
.log-table th,.log-table td{padding:10px 5px;}
.item-cell{flex-direction:column;align-items:flex-start;}
.item-icon{margin-right:0;margin-bottom:5px;}
}
/* 搜索框样式 */
 .search-container{flex-grow:1;width:295px;position:relative;}
.search-box{position:relative;width:100%;}
.searchInput{width:100%;padding:12px 20px 12px 50px;border:2px solid #ff8c00;border-radius:30px;background-color:rgba(255,255,255,0.9);color:#d35400;font-size:16px;box-shadow:0 2px 8px rgba(0,0,0,0.2);transition:all 0.3s ease;}
.searchInput:focus{outline:none;border-color:#ff6a00;box-shadow:0 0 12px rgba(255,106,0,0.8);background-color:white;}
.search-icon{position:absolute;left:20px;top:50%;transform:translateY(-50%);color:#ff8c00;font-size:18px;}
.search-results{position:absolute;top:100%;left:0;right:0;background:white;border-radius:0 0 12px 12px;box-shadow:0 8px 20px rgba(0,0,0,0.15);z-index:100;max-height:300px;overflow-y:auto;display:none;margin-top:5px;border:1px solid #ffe8b3;border-top:none;}
.search-result-item{padding:12px 20px;border-bottom:1px solid #ffe8b3;cursor:pointer;color:#7d5a28;transition:all 0.2s ease;display:flex;align-items:center;}
.search-result-item:before{content:"•";color:#ff8c00;font-size:24px;margin-right:10px;}
.search-result-item:hover{background-color:#fff0cc;}
.search-result-item.highlight{background-color:#ffe8b3;}
.no-results{padding:15px;color:#d35400;font-style:italic;text-align:center;}
.search-match{background-color:#ffecb3;color:#d35400;font-weight:bold;padding:0 2px;border-radius:3px;}
.home-shezhibox{width:320px;}
/* 注册 */
.register-container{padding:30px;background-color:#fff;}
.register-header{text-align:center;margin-bottom:30px;}
.register-header h2{color:#d35400;font-size:28px;margin-bottom:10px;}
.register-header p{color:#7d5a28;font-size:16px;}
.register-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px;}
@media (max-width:768px){.register-grid{grid-template-columns:1fr;}
}
.account-section,.register-section{background-color:#fff9e6;border-radius:8px;padding:25px;border:1px solid #ffb347;box-shadow:0 4px 10px rgba(0,0,0,0.05);max-height: 900px; overflow-y: scroll;}
.section-title{color:#d35400;text-align:center;margin-bottom:20px;font-size:22px;padding-bottom:10px;border-bottom:2px solid #ffb347;}
.account-item{padding:12px;margin-bottom:15px;background-color:#fff;border-radius:6px;border:1px solid #ffc66d;display:flex;justify-content:space-between;}
.account-info{flex:1;}
.account-name{font-weight:bold;color:#d35400;font-size:16px;}
.account-server{font-size:14px;color:#7d5a28;}
.no-account{text-align:center;padding:30px 0;color:#d35400;}
.no-account a{color:#ff5722;text-decoration:underline;font-weight:bold;}
.form-group{margin-bottom:20px;}
.form-label{display:block;margin-bottom:8px;font-weight:bold;color:#d35400;font-size:16px;}
.form-input{width:100%;padding:12px 15px;border:1px solid #ffb347;border-radius:6px;font-size:16px;background-color:#fff;transition:all 0.3s ease;color:#333;}
.form-input:focus{outline:none;border-color:#ff8c00;box-shadow:0 0 0 3px rgba(255,140,0,0.2);}
.form-input.readonly{background-color:#f5f5f5;color:#999;}
.agreement-box{background-color:#fff0cc;padding:20px;border-radius:8px;margin:25px 0;max-height:200px;overflow-y:auto;}
.agreement-title{color:#d35400;text-align:center;margin-bottom:15px;font-weight:bold;}
.agreement-content{color:#7d5a28;font-size:14px;line-height:1.6;}
.checkbox-container{display:flex;align-items:center;margin-bottom:20px;}
.checkbox-container input{margin-right:10px;width:18px;height:18px;}
.checkbox-container label{color:#7d5a28;font-size:16px;}
.checkbox-container a{color:#d35400;text-decoration:none;font-weight:bold;}
.checkbox-container a:hover{text-decoration:underline;}
.register-button{display:block;width:100%;padding:14px;background:linear-gradient(to bottom,#ff8c00,#e67e22);color:white;border:none;border-radius:6px;font-weight:bold;font-size:18px;cursor:pointer;transition:all 0.3s ease;border:1px solid #d35400;margin-bottom:20px;}
.register-button:hover{background:linear-gradient(to bottom,#ff9e40,#ff8c00);transform:translateY(-2px);box-shadow:0 4px 8px rgba(0,0,0,0.15);}
.login-link{text-align:center;color:#7d5a28;font-size:16px;}
.login-link a{color:#d35400;text-decoration:none;font-weight:bold;}
.login-link a:hover{text-decoration:underline;}
/* 下载 */
 .download-header{background-color:#ffd793;padding:20px;text-align:center;border-bottom:2px solid #ffb347;}
.download-header h1{color:#d35400;font-size:28px;margin-bottom:10px;text-shadow:0 1px 2px rgba(0,0,0,0.1);}
.download-header p{color:#7d5a28;font-size:16px;max-width:800px;margin:0 auto;}
.download-table{width:100%;border-collapse:collapse;background-color:white;}
.download-table thead{background:linear-gradient(to bottom,#ffa726,#ff8c00);}
.download-table th{padding:15px 25px;text-align:left;color:white;font-weight:bold;font-size:18px;text-shadow:0 1px 2px rgba(0,0,0,0.2);}
.download-table th:first-child{border-top-left-radius:8px;}
.download-table th:last-child{border-top-right-radius:8px;}
.download-table tr:nth-child(even){background-color:#fff9e6;}
.download-table tbody tr:hover{background-color:#fff0cc;}
.download-table td{padding:20px 15px;border-bottom:1px solid #ffe8b3;}
.download-name{font-weight:bold;font-size:18px;color:#d35400;margin-bottom:8px;padding:0px 12px;}
.download-desc{font-size:14px;color:#7d5a28;line-height:1.5;padding:0px 12px;}
.download-size{font-weight:bold;color:#e67e22;font-size:16px;}
.download-links{display:flex;gap:10px;}
.download-link{display:inline-block;padding:10px 18px;background:linear-gradient(to bottom,#ff8c00,#e67e22);color:white;border-radius:6px;text-decoration:none;font-weight:bold;font-size:14px;text-align:center;min-width:100px;box-shadow:0 2px 5px rgba(0,0,0,0.1);transition:all 0.3s ease;border:1px solid #d35400;}
.download-link:hover{background:linear-gradient(to bottom,#ff9e40,#ff8c00);transform:translateY(-2px);box-shadow:0 4px 8px rgba(0,0,0,0.15);}
.download-link i{margin-right:5px;}
.pagination{display:flex;justify-content:center;padding:25px;background-color:#fff9e6;border-top:1px solid #ffe8b3;}
.pagination-content{background:linear-gradient(to bottom,#ffd793,#ffc66d);padding:15px 30px;border-radius:50px;display:inline-flex;align-items:center;gap:20px;box-shadow:0 4px 8px rgba(0,0,0,0.1);}
.pagination-btn{padding:8px 20px;background:linear-gradient(to bottom,#ff8c00,#e67e22);color:white;border:none;border-radius:6px;font-weight:bold;cursor:pointer;transition:all 0.3s ease;box-shadow:0 2px 5px rgba(0,0,0,0.1);}
.pagination-btn:hover{background:linear-gradient(to bottom,#ff9e40,#ff8c00);transform:translateY(-2px);box-shadow:0 4px 8px rgba(0,0,0,0.15);}
.pagination-info{color:#7d5a28;font-weight:bold;font-size:16px;}
@media (max-width:768px){.download-links{flex-direction:column;}
.download-table{display:block;overflow-x:auto;}
.pagination-content{flex-direction:column;gap:10px;}
}
.notice{background-color:#fff0cc;padding:15px;margin:20px;border-radius:8px;border-left:4px solid #ff8c00;}
.notice h3{color:#d35400;margin-bottom:10px;}
.notice p{font-size:14px;line-height:1.6;color:#7d5a28;}
/* 排行 */
.rank-header{background:linear-gradient(to right,#ff8c00,#ff6a00);padding:25px;text-align:center;}
.rank-header h1{color:white;font-size:32px;margin-bottom:15px;text-shadow:0 2px 4px rgba(0,0,0,0.3);}
.rank-header p{color:#fff0cc;font-size:18px;max-width:800px;margin:0 auto;}
.rank-content{padding:30px;}
/* .filter-section{background:linear-gradient(to bottom,#ffd793,#ffc66d);padding:20px;border-radius:10px;margin-bottom:25px;box-shadow:0 4px 15px rgba(0,0,0,0.1);}
*/
.filter-row{display:flex;flex-wrap:wrap;gap:15px;align-items:center;}
.filter-item{flex:1;min-width:200px;}
.filter-label{display:block;margin-bottom:8px;color:#d35400;font-weight:bold;font-size:16px;}
.filter-select,.filter-input{width:100%;padding:15px 15px;border:1px solid #e67e22;border-radius:6px;background:white;font-size:16px;color:#7d5a28;box-shadow:0 2px 5px rgba(0,0,0,0.05);transition:all 0.3s ease;}
.filter-select:focus,.filter-input:focus{border-color:#ff8c00;box-shadow:0 0 0 3px rgba(255,140,0,0.2);outline:none;}
.filter-btn{padding:12px 25px;background:linear-gradient(to bottom,#ff8c00,#e67e22);color:white;border:none;border-radius:6px;font-size:16px;font-weight:bold;cursor:pointer;transition:all 0.3s ease;box-shadow:0 4px 10px rgba(230,126,34,0.3);min-width:150px;}
.filter-btn:hover{background:linear-gradient(to bottom,#ff9e40,#ff8c00);transform:translateY(-2px);box-shadow:0 6px 15px rgba(230,126,34,0.4);}
.rank-table-container{background:white;border-radius:10px;overflow:hidden;box-shadow:0 5px 20px rgba(0,0,0,0.1);}
.table-header{background:linear-gradient(to bottom,#ffa726,#ff8c00);padding:15px 20px;color:white;font-size:18px;font-weight:bold;display:flex;justify-content:space-between;align-items:center;}
.table-header-title{display:flex;align-items:center;gap:10px;}
.table-header-icon{font-size:24px;color:#fff0cc;}
.rank-table{width:100%;border-collapse:collapse;}
.rank-table thead{background:linear-gradient(to bottom,#ffb347,#ff8c00);}
.rank-table th{padding:16px 15px;text-align:left;color:white;font-weight:bold;font-size:16px;text-shadow:0 1px 2px rgba(0,0,0,0.2);}
.rank-table tr:nth-child(even){background-color:#fff9e6;}
.rank-table tbody tr:hover{background-color:#fff0cc;transform:translateY(-1px);box-shadow:0 3px 10px rgba(0,0,0,0.1);}
.rank-table td{padding:20px 15px;border-bottom:1px solid #ffe8b3;color:#7d5a28;}
.rank-number{font-size:20px;font-weight:bold;color:#d35400;text-align:center;width:60px;}
.character-card{display:flex;align-items:center;gap:15px;}
.character-avatar{width:70px;height:70px;border-radius:50%;overflow:hidden;border:3px solid #ffb347;box-shadow:0 3px 8px rgba(0,0,0,0.2);}
.character-avatar img{width:100%;height:100%;object-fit:cover;}
.character-info{flex:1;}
.character-name{font-size:18px;font-weight:bold;color:#d35400;margin-bottom:5px;}
.character-class{font-size:14px;color:#e67e22;margin-bottom:8px;}
.character-level{display:flex;gap:15px;font-size:14px;}
.level-badge{background:#ffd793;padding:4px 10px;border-radius:20px;font-weight:bold;}
.level-info{color:#7d5a28; white-space: nowrap !important;}
.level-trace{background:linear-gradient(to bottom,#27ae60,#219653);color:white;padding:8px 15px;border-radius:6px;font-weight:bold;cursor:pointer;transition:all 0.3s ease;display:inline-block;margin-top:10px;box-shadow:0 2px 5px rgba(0,0,0,0.1);}
.level-trace:hover{background:linear-gradient(to bottom,#2ecc71,#27ae60);transform:translateY(-2px);box-shadow:0 4px 8px rgba(0,0,0,0.15);}
.character-stats{display:flex;gap:30px;}
.stat-item{text-align:center;}
.stat-label{font-size:12px;color:#d35400;font-weight:bold;}
.stat-value{font-size:16px;font-weight:bold;color:#e67e22;}

@media (max-width:768px){.filter-row{flex-direction:column;}
.filter-item{width:100%;}
.character-card{flex-direction:column;align-items:flex-start;}
.character-avatar{width:60px;height:60px;}
.character-level{flex-direction:column;gap:5px;}
}
/* 覆盖layui默认样式 */
 .layui-table th,.layui-table td{border-color:#ffe8b3 !important;}
.layui-table tbody tr:hover{background-color:#fff0cc !important;}
.layui-table-page{background-color:#fff9e6 !important;border-top:1px solid #ffe8b3 !important;}
.layui-laypage a,.layui-laypage span{background-color:#fff9e6 !important;border:1px solid #ffe8b3 !important;}
.layui-laypage a:hover{background-color:#fff0cc !important;}
.layui-laypage .layui-laypage-curr .layui-laypage-em{background-color:#ff8c00 !important;}
/* 溯源 */
.filter-container{padding:25px;background-color:#fff9e6;border-bottom:2px solid #ffb347;}
.filter-section{background-color:#fff0cc;padding:25px;border-radius:8px;margin-bottom:25px;border:1px solid #ffb347;box-shadow:0 4px 10px rgba(0,0,0,0.05);}
.filter-section h3{color:#d35400;margin-bottom:20px;font-size:22px;text-align:center;padding-bottom:10px;border-bottom:2px solid #ffb347;}
.filter-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px;margin-bottom:25px;}
.filter-grid-b{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:20px;margin-bottom:25px;}
.filter-group{margin-bottom:15px;}
.filter-label{display:block;margin-bottom:8px;font-weight:bold;color:#d35400;font-size:16px;}
.filter-btn{display:block;margin:20px auto 0;padding:12px 35px;background:linear-gradient(to bottom,#ff8c00,#e67e22);color:white;border:none;border-radius:6px;font-weight:bold;font-size:18px;cursor:pointer;transition:all 0.3s ease;box-shadow:0 4px 8px rgba(0,0,0,0.1);min-width:200px;border:1px solid #d35400;}
.filter-btn:hover{background:linear-gradient(to bottom,#ff9e40,#ff8c00);transform:translateY(-2px);box-shadow:0 6px 12px rgba(0,0,0,0.15);}
.filter-btn2{display:block;margin:20px auto 0;padding:12px 35px;background:#f2de03;color:black;border:none;border-radius:6px;font-weight:bold;font-size:18px;cursor:pointer;transition:all 0.3s ease;box-shadow:0 4px 8px rgba(0,0,0,0.1);min-width:200px;}
.filter-btn2:hover{background:#fff581;transform:translateY(-2px);box-shadow:0 6px 12px rgba(0,0,0,0.15);}
.filter-btn3{display:block;margin:20px auto 0;padding:12px 35px;background:#7f0000;color:white;border:none;border-radius:6px;font-weight:bold;font-size:18px;cursor:pointer;transition:all 0.3s ease;box-shadow:0 4px 8px rgba(0,0,0,0.1);min-width:200px;}
.filter-btn3:hover{background:#e50000;transform:translateY(-2px);box-shadow:0 6px 12px rgba(0,0,0,0.15);}
.attributes-section{background-color:#fff9e6;padding:20px;border-radius:8px;border:1px solid #ffb347;margin-top:20px;}
.attributes-header{color:#d35400;font-weight:bold;font-size:18px;margin-bottom:15px;text-align:center;}
.attributes-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:15px;}
.attribute-item{display:flex;align-items:center;padding:8px 12px;background-color:#fff;border-radius:6px;border:1px solid #ffc66d;}
.attribute-checkbox{margin-right:10px;width:18px;height:18px;}
.attribute-label{color:#7d5a28;font-weight:500;}
.results-container{padding:25px;}
.results-header{background:linear-gradient(to bottom,#ffa726,#ff8c00);padding:15px 25px;border-top-left-radius:8px;border-top-right-radius:8px;}
.results-header h3{color:white;font-size:20px;text-shadow:0 1px 2px rgba(0,0,0,0.2);}
.results-table{width:100%;border-collapse:collapse;background-color:white;border-bottom-left-radius:8px;border-bottom-right-radius:8px;overflow:hidden;}
.results-table thead{background:linear-gradient(to bottom,#ffd793,#ffc66d);}
.results-table th{padding:15px 20px;text-align:left;color:#d35400;font-weight:bold;font-size:16px;}
.results-table tr:nth-child(even){background-color:#fff9e6;}
.results-table tr:hover{background-color:#fff0cc;}
.results-table td{padding:15px 20px;border-bottom:1px solid #ffe8b3;color:#7d5a28;}
.item-info{display:flex;align-items:center;}
.item-icon{width:50px;height:50px;margin-right:15px;background-size:cover;background-position:center;border:1px solid #ffc66d;border-radius:4px;}
.item-details{flex:1;}
.item-name{font-weight:bold;color:#d35400;font-size:16px;}
.item-meta{font-size:14px;color:#a87d3b;}
@media (max-width:768px){.filter-grid{grid-template-columns:1fr;}
.attributes-grid{grid-template-columns:1fr;}
.item-info{flex-direction:column;align-items:flex-start;}
.item-icon{margin-right:0;margin-bottom:10px;}
}
/* 充值 */
.recharge-container{padding:30px;}
.recharge-header{text-align:center;margin-bottom:30px;}
.recharge-header h2{color:#d35400;font-size:32px;margin-bottom:15px;}
.recharge-header p{color:#7d5a28;font-size:18px;max-width:1400px;margin:0 auto;}
.benefits-container{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin:40px 0;}
@media (max-width:900px){.benefits-container{grid-template-columns:1fr;}
}
.benefits-card{background-color:#fff9e6;border-radius:8px;padding:30px;border:1px solid #ffb347;box-shadow:0 4px 10px rgba(0,0,0,0.05);position:relative;overflow:hidden;}
.benefits-card::before{content:'';position:absolute;top:0;right:0;width:80px;height:80px;background:linear-gradient(to bottom right,transparent 50%,#ff8c00 50%);}
.benefits-card::after{<!-- content:'特惠';--> <!-- position:absolute;--> <!-- top:15px;--> <!-- right:15px;--> <!-- color:white;--> <!-- font-weight:bold;--> <!-- font-size:14px;--> <!-- transform:rotate(45deg);-->}
.card-header{display:flex;align-items:center;margin-bottom:25px;}
.card-icon{width:60px;height:60px;background:linear-gradient(to bottom,#ff8c00,#e67e22);border-radius:50%;display:flex;align-items:center;justify-content:center;margin-right:20px;color:white;font-size:24px;}
.card-title{color:#d35400;font-weight:bold;font-size:24px;}
.card-content{color:#7d5a28;font-size:16px;line-height:1.8;}
.benefits-list{list-style:none;margin:20px 0;}
.benefits-list li{padding:12px 0;border-bottom:1px dashed #ffc66d;position:relative;padding-left:30px;}
.benefits-list li:last-child{border-bottom:none;}
.benefits-list li::before{content:'✓';position:absolute;left:0;top:50%;transform:translateY(-50%);width:22px;height:22px;background:#ff8c00;color:white;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;}
.highlight{color:#d35400;font-weight:bold;}
.recharge-button{display:block;width:100%;max-width:400px;padding:20px;margin:40px auto;background:linear-gradient(to bottom,#ff8c00,#e67e22);color:white;border:none;border-radius:10px;font-weight:bold;font-size:24px;cursor:pointer;transition:all 0.3s ease;border:2px solid #d35400;box-shadow:0 6px 15px rgba(0,0,0,0.2);position:relative;overflow:hidden;}
.recharge-button:hover{background:linear-gradient(to bottom,#ff9e40,#ff8c00);transform:translateY(-5px);box-shadow:0 10px 20px rgba(0,0,0,0.25);}
.recharge-button::after{content:'';position:absolute;top:-50%;left:-60%;width:50px;height:200%;background:rgba(255,255,255,0.3);transform:rotate(25deg);transition:all 0.6s;}
.recharge-button:hover::after{left:120%;}
.notice-box{background-color:#fff0cc;padding:25px;border-radius:8px;margin:30px 0;border-left:5px solid #ff8c00;}
.notice-title{color:#d35400;font-weight:bold;font-size:22px;margin-bottom:20px;display:flex;align-items:center;}
.notice-title i{margin-right:10px;}
.notice-content{color:#7d5a28;font-size:16px;line-height:1.8;}
.notice-list{list-style:none;margin-top:15px;}
.notice-list li{padding:10px 0;padding-left:30px;position:relative;}
.notice-list li::before{content:'•';color:#ff8c00;font-size:24px;position:absolute;left:10px;top:2px;}
/* 动画效果 */
 @keyframes float{0%{transform:translateY(0px);}
50%{transform:translateY(-10px);}
100%{transform:translateY(0px);}
}
.floating{animation:float 3s ease-in-out infinite;}
/* login */
.login-container{width:100%;margin:0 auto;background-color:rgba(255,255,255,0.9);border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,0.15);overflow:hidden;}
.login-title{background:linear-gradient(to right,#ff8c00,#ff6a00);padding:15px 25px;display:flex;align-items:center;justify-content:space-between;}
.login-logo{display:flex;align-items:center;gap:15px;}
.login-logo img{height:50px;filter:drop-shadow(0 2px 4px rgba(0,0,0,0.2));}
.login-logo-text{color:white;font-size:18px;font-weight:bold;text-shadow:0 2px 4px rgba(0,0,0,0.3)}
.header-info{color:white;font-size:14px;text-align:right;margin-right:18px;}
.login-header{background-color:#ffd793;padding:25px 20px;text-align:center;border-bottom:2px solid #ffb347;}
.login-header h1{color:#d35400;font-size:28px;margin-bottom:10px;text-shadow:0 1px 2px rgba(0,0,0,0.1);font-family:"Microsoft YaHei",sans-serif;font-weight:900;}
.login-header p{color:#7d5a28;font-size:16px;max-width:800px;margin:0 auto;}
.login-content{padding:30px;min-height:400px;display:flex;flex-direction:column;align-items:center;}
.login-methods{display:flex;gap:30px;width:100%;max-width:800px;margin-bottom:30px;}
.method-card{flex:1;background:white;border-radius:10px;box-shadow:0 5px 15px rgba(0,0,0,0.1);padding:25px;text-align:center;transition:all 0.3s ease;border:2px solid transparent;}
.method-card:hover{transform:translateY(-5px);box-shadow:0 8px 25px rgba(0,0,0,0.15);border-color:#ff8c00;}
.method-card.active{border-color:#ff8c00;background:#fffaf0;}
.method-icon{font-size:48px;color:#ff8c00;margin-bottom:15px;}
.method-title{font-size:20px;color:#d35400;margin-bottom:15px;font-weight:bold;}
.method-desc{color:#7d5a28;font-size:14px;line-height:1.6;margin-bottom:20px;}
.qr-container{width:200px;height:200px;margin:0 auto 20px;background:#f9f9f9;border-radius:8px;display:flex;align-items:center;justify-content:center;padding:10px;border:1px solid #eee;}
.qr-container img{max-width:100%;height:auto;border-radius:4px;}
.login-form{width:100%;max-width:500px;}
.form-group{margin-bottom:20px;}
.form-group label{display:block;margin-bottom:8px;color:#d35400;font-weight:bold;}
.form-group input{width:100%;padding:12px 15px;border:1px solid #ddd;border-radius:6px;font-size:16px;transition:all 0.3s ease;}
.form-group input:focus{border-color:#ff8c00;box-shadow:0 0 0 3px rgba(255,140,0,0.2);outline:none;}
.login-btn{display:block;width:100%;padding:14px;background:linear-gradient(to bottom,#ff8c00,#e67e22);color:white;border:none;border-radius:6px;font-size:18px;font-weight:bold;cursor:pointer;transition:all 0.3s ease;box-shadow:0 4px 10px rgba(230,126,34,0.3);margin-top:10px;}
.login-btn:hover{background:linear-gradient(to bottom,#ff9e40,#ff8c00);transform:translateY(-2px);box-shadow:0 6px 15px rgba(230,126,34,0.4);}
.account-list{width:100%;max-width:1400px;list-style:none}
.account-table{width:100%;border-collapse:collapse;background-color:white;border-radius:8px;overflow:hidden;box-shadow:0 4px 10px rgba(0,0,0,0.1);}
.account-table thead{background:linear-gradient(to bottom,#ffa726,#ff8c00);}
.account-table th{padding:16px 15px;text-align:left;color:white;font-weight:bold;font-size:18px;text-shadow:0 1px 2px rgba(0,0,0,0.2);text-align:center}
.account-table tr:nth-child(even){background-color:#fff9e6;}
.account-table tbody tr:hover{background-color:#fff0cc;}
.account-table td{padding:10px;border:unset;border-bottom:1px solid #ffe8b3;text-align:center}
.account-info{font-weight:bold;color:#d35400;}
.account-server{color:#7d5a28;float:right;}
.account-status{font-weight:bold;}
.account-status.active{color:#27ae60;display:table-cell;}
.account-action{text-align:right;}
.account-action .layui-disabled{background:#e9e9e9;color:#979797 !important;}
.action-btn{display:inline-block;padding:8px 16px;background:linear-gradient(to bottom,#ff8c00,#e67e22);color:white;border:none;border-radius:4px;font-weight:bold;cursor:pointer;transition:all 0.3s ease;text-decoration:none;}
.action-btn:hover{background:linear-gradient(to bottom,#ff9e40,#ff8c00);transform:translateY(-2px);}
.register-link{text-align:center;margin-top:20px;font-size:16px;}
.register-link a{color:#ff8c00;font-weight:bold;text-decoration:none;transition:all 0.3s ease;}
.register-link a:hover{color:#e67e22;text-decoration:underline;}
.login-notice{background-color:#fff0cc;padding:15px;margin:20px;border-radius:8px;border-left:4px solid #ff8c00;}
.login-notice h3{color:#d35400;margin-bottom:10px;display:flex;align-items:center;gap:8px;font-family:"Microsoft YaHei",sans-serif;font-weight:600;}
.login-notice p{font-size:14px;line-height:1.6;color:#7d5a28;margin-left:28px;}
@media (max-width:768px){.login-methods{flex-direction:column;}
.account-table{display:block;overflow-x:auto;}
}
/* userinfo */
.download-header{background-color:#ffd793;padding:20px;text-align:center;border-bottom:2px solid #ffb347;}
.download-header h1{color:#d35400;font-size:28px;margin-bottom:10px;text-shadow:0 1px 2px rgba(0,0,0,0.1);}
.download-header p{color:#7d5a28;font-size:16px;max-width:800px;margin:0 auto;}
.form-container{padding:30px;max-width:800px;margin:0 auto;}
.form-section{background-color:#fff9e6;border-radius:8px;padding:25px;margin-bottom:25px;border:1px solid #ffb347;box-shadow:0 4px 10px rgba(0,0,0,0.05);}
.form-section h3{color:#d35400;margin-bottom:20px;font-size:22px;text-align:center;padding-bottom:10px;border-bottom:2px solid #ffb347;}
.form-row{margin-bottom:25px;padding:0 15px;}
.form-label{display:block;margin-bottom:8px;font-weight:bold;color:#d35400;font-size:18px;}
.form-input{width:100%;padding:12px 15px;border:1px solid #ffb347;border-radius:6px;font-size:16px;background-color:#fff;transition:all 0.3s ease;}
.form-input:focus{outline:none;border-color:#ff8c00;box-shadow:0 0 0 3px rgba(255,140,0,0.2);}
.form-select{width:100%;padding:12px 15px;border:1px solid #ffb347;border-radius:6px;font-size:16px;background-color:#fff;color:#333;}
.form-select option{padding:8px 12px;background:#fff;}
.form-select option:hover{background-color:#ffd793;}
.submit-btn{display:block;margin:30px auto 0;padding:12px 35px;background:linear-gradient(to bottom,#ff8c00,#e67e22);color:white;border:none;border-radius:6px;font-weight:bold;font-size:18px;cursor:pointer;transition:all 0.3s ease;box-shadow:0 4px 8px rgba(0,0,0,0.1);text-align:center;min-width:200px;border:1px solid #d35400;}
.submit-btn:hover{background:linear-gradient(to bottom,#ff9e40,#ff8c00);transform:translateY(-2px);box-shadow:0 6px 12px rgba(0,0,0,0.15);}
.info-box{background-color:#fff0cc;padding:15px 20px;border-radius:8px;margin-bottom:25px;border-left:4px solid #ff8c00;color:#7d5a28;font-size:16px;line-height:1.6;}
.info-box strong{color:#d35400;}
.info-item{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px dashed #ffc66d;}
.info-item:last-child{border-bottom:none;}
@media (max-width:768px){.form-container{padding:15px;}
.form-section{padding:15px;}
.submit-btn{width:100%;}
}
/* 1) 默认隐藏所有面板 */
.tab-pane { display:none; min-height:450px; }

/* 2) :has() 让父容器感知哪个 radio 被选中，然后只显示对应面板 */
.tabs-container:has(#tab1:checked) #li1 { display:block; }
.tabs-container:has(#tab2:checked) #li2 { display:block; }
.tabs-container:has(#tab3:checked) #li3 { display:block; }
.tabs-container:has(#tab4:checked) #li4 { display:block; }
.tabs-container:has(#tab5:checked) #li5 { display:block; }
.tabs-container:has(#tab6:checked) #li6 { display:block; }
.tabs-container:has(#tab7:checked) #li7 { display:block; }
.tabs-container:has(#tab8:checked) #li8 { display:block; }

/* 3) 隐藏原始 radio，并高亮当前标签按钮 */
.tab-label { position:absolute; opacity:0; pointer-events:none; }
.tabs-header input.tab-label:checked + label.tab-button {
  background:#7d5a28; color:#fff;
}

/* 4) 让加载遮罩能正确覆盖内容区 */
.tab-content-container { position:relative; }
.loading-overlay {position:absolute; inset:0;display:none; align-items:center; justify-content:center;background:rgba(255,255,255,.6); z-index:10;}
.line1:before {content: "青蛙奇迹6周年怀旧版";}
.line2:before {content: "不忘初心，匠心打磨!——始于2019";}
.download-link3{display:inline-block;padding:10px 18px;background:linear-gradient(to bottom,#ff8c00,#e67e22);color:white;border-radius:6px;text-decoration:none;font-weight:bold;font-size:14px;text-align:center;min-width:100px;box-shadow:0 2px 5px rgba(0,0,0,0.1);transition:all 0.3s ease;border:1px solid #d35400;}
.download-link3:hover{background:linear-gradient(to bottom,#ff9e40,#ff8c00);transform:translateY(-2px);box-shadow:0 4px 8px rgba(0,0,0,0.15);}
.download-link3 i{margin-right:5px;}

/* 设置页面 */
.settings-container{padding:20px;}
.settings-section{background-color:#fff9e6;border-radius:10px;box-shadow:0 4px 15px rgba(0,0,0,0.08);margin-bottom:30px;overflow:hidden;border-left:4px solid #ff8c00;}
.section-header{background:linear-gradient(to right,#ffa726,#ff8c00);padding:5px 10px;display:flex;align-items:center;}
.section-header h2{color:white;font-size:22px;margin-left:15px;text-shadow:0 1px 2px rgba(0,0,0,0.2);}
.section-header i{font-size:24px;color:white;background-color:rgba(255,255,255,0.2);width:45px;height:45px;border-radius:50%;display:flex;align-items:center;justify-content:center;}
.section-content{padding:25px;}
.setting-item{padding:5px 0;border-bottom:1px dashed #ffd793;display:flex;}
.setting-item:last-child{border-bottom:none;}
.setting-key{min-width:108px;font-weight:bold;color:#d35400;font-size:14px;}
.setting-key2{min-width:88px;color:#000000;font-size:16px;}
.setting-key3{min-width:88px;color:#666666;font-size:16px;}
.setting-value{flex:1;color:#7d5a28;font-size:15px;line-height:1.6;}
.warning{color:#e74c3c;font-weight:bold;}
.highlight{background-color:#fff0cc;padding:2px 6px;border-radius:4px;font-weight:bold;color:#d35400;}
.qq-group{background-color:#e6f7ff;border:1px solid #91d5ff;border-radius:8px;padding:15px;margin-top:20px;text-align:center;display:flex;align-items:center;justify-content:center;}
.qq-group img{height:80px;margin-right:20px;}
.qq-group-text{font-size:16px;color:#7d5a28;}
.qq-group-text strong{color:#d35400;font-size:18px;}
.footer{text-align:center;padding:20px;color:#7d5a28;font-size:14px;background-color:rgba(255,215,147,0.4);border-top:1px solid #ffc66d;}
@media (max-width:768px){.setting-item{flex-direction:column;}
.setting-key{margin-bottom:8px;}
.setting-key2{margin-bottom:10px;}
.qq-group{flex-direction:column;text-align:center;}
.qq-group img{margin-right:0;margin-bottom:15px;}
}
/* 职业优化 */
/* 职业平衡调整区域样式 */
 .balance-container{background-color:rgba(255,255,255,0.95);padding:0px;min-height:600px;}
.section-title{text-align:center;margin-bottom:18px;padding-bottom:15px;border-bottom:2px solid #ffb347;}
.section-title h2{color:#d35400;font-size:28px;text-shadow:0 1px 2px rgba(0,0,0,0.1);}
.section-title p{color:#7d5a28;font-size:16px;max-width:800px;margin:10px auto 0;}
.job-classes{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:25px;}
.job-section{background:rgba(255,247,230,0.9);border-radius:15px;padding:20px;transition:all 0.3s ease;border:1px solid #ffc66d;position:relative;overflow:hidden;box-shadow:0 5px 15px rgba(0,0,0,0.1);}
.job-section:hover{transform:translateY(-5px);box-shadow:0 10px 25px rgba(255,140,0,0.3);border-color:#ff8c00;}
.job-section::before{content:"";position:absolute;top:0;left:0;width:100%;height:5px;background:linear-gradient(90deg,#ff8c00,#ff6a00);}
.job-title{display:flex;align-items:center;font-size:1.3rem;margin-bottom:20px;padding-bottom:15px;border-bottom:1px solid #ffc66d;color:#d35400;font-weight: 700;}
.title-icon-job{width:30px;height:30px;margin-right:12px;filter:drop-shadow(0 0 3px rgba(255,140,0,0.7));}
.job-features{list-style:none;padding:0;}
/* 为优化条目添加的精美边框 */
 .feature-item{background:rgba(255,235,200,0.7);border-radius:10px;padding:15px;margin-bottom:15px;border:1px solid #ffc66d;position:relative;transition:all 0.3s ease;box-shadow:0 4px 10px rgba(0,0,0,0.08);}
.feature-item:hover{background:rgba(255,240,180,0.9);border-color:#ff8c00;box-shadow:0 0 15px rgba(255,140,0,0.2);}
.feature-item::before{content:"";position:absolute;top:0;left:0;width:5px;height:100%;background:linear-gradient(to bottom,#ff8c00,#ff6a00);border-radius:5px 0 0 5px;}
.feature-item i{margin-right:8px;color:#d35400;font-size:0.9rem;}
/* 不同职业的独特颜色主题 */
 .job-section:nth-child(1) .feature-item::before{background:linear-gradient(to bottom,#ffa726,#fb8c00);}
.job-section:nth-child(1) .feature-item i{color:#ffa726;}
.job-section:nth-child(2) .feature-item::before{background:linear-gradient(to bottom,#ffb74d,#ff9800);}
.job-section:nth-child(2) .feature-item i{color:#ffb74d;}
.job-section:nth-child(3) .feature-item::before{background:linear-gradient(to bottom,#ffcc80,#ffb74d);}
.job-section:nth-child(3) .feature-item i{color:#ffcc80;}
.job-section:nth-child(4) .feature-item::before{background:linear-gradient(to bottom,#ffe0b2,#ffcc80);}
.job-section:nth-child(4) .feature-item i{color:#ffe0b2;}
.job-section:nth-child(5) .feature-item::before{background:linear-gradient(to bottom,#fff3e0,#ffe0b2);}
.job-section:nth-child(5) .feature-item i{color:#fff3e0;}
.job-section:nth-child(6) .feature-item::before{background:linear-gradient(to bottom,#ffecb3,#ffd54f);}
.job-section:nth-child(6) .feature-item i{color:#ffecb3;}
.join-btn{display:inline-block;margin-top:10px;padding:10px 25px;background:linear-gradient(90deg,#ff8c00,#ff6a00);color:white;text-decoration:none;border-radius:50px;font-weight:bold;transition:all 0.3s;border:none;cursor:pointer;box-shadow:0 5px 15px rgba(255,140,0,0.4);}
.join-btn:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(255,140,0,0.6);}
.pulse{animation:pulse 2s infinite;}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(255,140,0,0.4);}
70%{box-shadow:0 0 0 15px rgba(255,140,0,0);}
100%{box-shadow:0 0 0 0 rgba(255,140,0,0);}
}
.floating{animation:floating 3s ease-in-out infinite;}
@keyframes floating{0%{transform:translateY(0px);}
50%{transform:translateY(-10px);}
100%{transform:translateY(0px);}
}
/* 响应式调整 */
 @media (max-width:768px){.job-classes{grid-template-columns:1fr;}
.section-title h2{font-size:1.8rem;}
}
/* 游戏规则 */
.rules-header{background-color:#ffd793;padding:20px;text-align:center;border-bottom:2px solid #ffb347;}
.rules-header h1{color:#d35400;font-size:32px;margin-bottom:10px;text-shadow:0 1px 2px rgba(0,0,0,0.1);}
.rules-header p{color:#7d5a28;font-size:16px;max-width:800px;margin:0 auto;}
.rules-container{padding:20px;}
.rules-tabs{display:flex;margin-bottom:20px;background:linear-gradient(to bottom,#ffd793,#ffc66d);border-radius:8px;overflow:hidden;box-shadow:0 2px 8px rgba(0,0,0,0.1);}
.rules-tab{flex:1;padding:15px;text-align:center;font-weight:bold;font-size:18px;color:#7d5a28;cursor:pointer;transition:all 0.3s ease;border-right:1px solid #ffecd6;}
.rules-tab:last-child{border-right:none;}
.rules-tab.active{background:linear-gradient(to bottom,#ff8c00,#e67e22);color:white;text-shadow:0 1px 2px rgba(0,0,0,0.3);}
.rules-tab:hover:not(.active){background-color:#ffc66d;}
.rules-content{display:none;background-color:white;border-radius:8px;padding:20px;box-shadow:0 3px 10px rgba(0,0,0,0.08);border:1px solid #ffe8b3;}
.rules-content.active{display:block;animation:fadeIn 0.5s ease;}
.rules-content h3{color:#d35400;font-size:20px;margin-bottom:15px;display:flex;align-items:center;padding-bottom:8px;border-bottom:2px dashed #ffb347;}
.rules-content h3 i{margin-right:10px;color:#e67e22;}
.rules-list{list-style-type:none;padding:0 15px;}
.rules-list li{padding:6px 0;border-bottom:1px solid #fff0cc;color:#37332d;font-size:14px;display:flex;align-items:flex-start;}
.rules-list li:last-child{border-bottom:none;}
.rules-list li::before{content:"•";color:#ff8c00;font-weight:bold;display:inline-block;width:25px;font-size:20px;}
.rules-table{width:100%;border-collapse:collapse;margin-top:10px;}
.rules-table th{background:linear-gradient(to bottom,#ffa726,#ff8c00);color:white;padding:12px 15px;text-align:left;font-weight:bold;font-size:16px;}
.rules-table td{padding:6px 15px;border-bottom:1px solid #fbeec3;color:#7d5a28;font-size: 15px;}
.rules-table tr:nth-child(even){background-color:#fff9e6;}
.rules-table tr:hover{background-color:#fff0cc;}
.rules-table .remark{background-color:#fff0cc;font-weight:bold;color:#d35400;}
.footer2{text-align: center;
  padding: 20px;
  color: #7d5a28;
  font-size: 14px;
}
@keyframes fadeIn{from{opacity:0;transform:translateY(10px);}
to{opacity:1;transform:translateY(0);}
}
@media (max-width:768px){.rules-tabs{flex-direction:column;}
.rules-tab{border-right:none;border-bottom:1px solid #ffb347;}
.rules-table{display:block;overflow-x:auto;}
.rules-list li{font-size:14px;}
.rules-content{padding:15px;}
}
/*首页*/
/* 首页 */
.firstPage__computer___2tX18,
.firstPage__computer___2tX19 {
    width: 560px;
    height: 445px;
    z-index: 1;
    opacity: 1;
    background-size: cover;
    background-repeat: no-repeat;
    display: flex;
    justify-content: center;

    position: absolute; 
    top: 206px;
    left: 50%;

    transform: translateX(var(--tx, -50%)) translateY(var(--ty, 0));
    transition: transform .35s ease, box-shadow .35s ease;
    will-change: transform;
    box-shadow: none !important;
}

.firstPage__computer___2tX18:hover,
.firstPage__computer___2tX19:hover {
    --ty: -20px;
    box-shadow: 0 12px 24px rgba(0,0,0,.15);
}
/*通用优化*/
.fl{ float:left; }
.fr{ float:right; }
.ml-10 { margin-left:10px; }
.user-left-account-listbox { height:900px; overflow-y:scroll;}
.w-100{ width:100%; }
.m-0{ margin:0px !important; }
.p-0 { padding:0px !important; }
.p-20 { padding:20px; }
.p-30 { padding:30px; }
/*flex适配*/
.xcc-flex { display: flex !important; }
.xcc-align-items-center { align-items: center !important; }
.xcc-justify-content-between { justify-content: space-between !important; }
.xcc-gap-0 {  gap: 0px !important; }
.xcc-gap-1 {  gap: 10px !important; }
.xcc-gap-2 {  gap: 20px !important; }
.xcc-gap-3 { gap: 30px !important; }
.account-select-btn-n.layui-disabled { background: #e9e9e9; color: #979797 !important; }
.user-right {  height:900px; overflow-y:scroll; margin-bottom:0px !important; }
.datas-foot-box { position: relative; }
.datas-up-time { position: absolute; top:40px; right: 20px;  font-size: 18px; font-weight: bold; color:#999}
        .expiry-notice {
    /* background: rgb(0 0 0 / 60%); */
    /* border: 1px solid #cc6600; */
    border-radius: 5px;
    padding: 15px;
    text-align: center;
    margin-bottom: 20px;
    color: #000000;
        }
        
        .expiry-notice .countdown {
            font-weight: bold;
            color: #ff9900;
            font-size: 18px;
        }
        
        .description {
            font-size: 1.1rem;
            opacity: 0.9;
        }
        
        .content {
            padding: 25px;
        }
        
        .rules-content {
            margin-bottom: 30px;
        }
        
        h3 {
            color: #2c3e50;
            margin-bottom: 15px;
            font-size: 1.5rem;
            display: flex;
            align-items: center;
            gap: 10px;
        }
        
        .rules-table {
            width: 100%;
            border-collapse: collapse;
            margin: 20px 0;
            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
            border-radius: 10px;
            overflow: hidden;
        }
        
        .rules-table th {
            background-color: #4b6cb7;
            color: white;
            padding: 15px;
            text-align: left;
        }
        
        .rules-table td {
            padding: 12px 15px;
            border-bottom: 1px solid #ddd;
        }
        
        .rules-table tr:nth-child(even) {
            background-color: #f8f9fa;
        }
        
        .rules-table tr:last-child td {
            border-bottom: none;
        }
        
        .image-wrapper {
            position: relative;
            margin: 25px auto;
            width: 100%;
            text-align: center;
            cursor: pointer;
            transition: all 0.3s ease;
        }
        
        .image-wrapper img {
            width: 50%;
            height: auto;
            border: 5px solid #fff;
            border-radius: 10px;
            box-shadow: 0 5px 20px rgba(0, 0, 0, 0.2);
            transition: all 0.4s ease;
            transform-origin: center;
        }
        
        .image-wrapper.zoomed img {
            width: 99%;
            transform: scale(1);
        }
        
        .zoom-icon {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            font-size: 3rem;
            color: rgba(255, 255, 255, 0.8);
            background: rgba(0, 0, 0, 0.5);
            border-radius: 50%;
            width: 70px;
            height: 70px;
            display: flex;
            justify-content: center;
            align-items: center;
            opacity: 1;
            transition: all 0.3s ease;
            pointer-events: none;
        }
        
        .image-wrapper.zoomed .zoom-icon {
            opacity: 0;
            pointer-events: none;
        }
        
        .image-caption {
            text-align: center;
            margin-top: 15px;
            font-style: italic;
            color: #6c757d;
        }
        
        
        @media (max-width: 768px) {
            
            h1 {
                font-size: 1.8rem;
            }
            
            .image-wrapper img {
                width: 80%;
            }
        }	


.tab-content-container {color:#333;}		
.tabs-use-2025 .layui-table-page #layui-table-page1 { display: flex !important; justify-content: center !important; margin:10px auto;}
.tabs-use-2025 .layui-table-header .layui-table {}