/* ====== 基础重置与全局样式 ====== */
a:link {
  text-decoration: none;
  color: #1a73e8;
  transition: color 0.3s ease;
}
a:visited {
  text-decoration: none;
  color: #673ab7;
}
a:hover {
  text-decoration: none;
  color: #0d62d9;
  transform: translateY(-1px);
}
a:active {
  text-decoration: none;
  color: #0d62d9;
}
*:focus {
  outline: none;
}
*:focus-visible {
  outline: 2px solid #4a90e2;
  outline-offset: 2px;
  border-radius: 4px;
}
* {
  margin: 0;
  color: #202124;
  padding: 0;
  box-sizing: border-box;
}
.hd {
  display: none;
}
dd li, li {
  list-style: none;
}

/* 重复的样式合并 */
a:link, a:visited, a:hover, a:active {
  text-decoration: none;
}

/* ====== body样式优化 ====== */
body {
  margin-left: 0px;
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 0px;
  background-color: #ffffff;
  font-size: 16px;
  margin: 0;
  color: #202124;
  padding: 0;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  line-height: 1.6;
  min-height: 100vh;
  overflow-x: hidden;
}

/* ====== 轮播图优化 ====== */
#gd {
  position: relative;
  display: block;
  margin: 16px 12px 0;
  padding: 0;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}

#gd .sw {
  overflow: hidden;
  visibility: hidden;
  position: relative;
  border-radius: inherit;
}

#gd .sw-wrap {
  overflow: hidden;
  position: relative;
  display: flex;
  transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

#gd .sw-wrap > div {
  float: left;
  width: 100%;
  position: relative;
  flex-shrink: 0;
}

#gd .sw-wrap > div img {
  width: 100%;
  display: block;
  height: auto;
  aspect-ratio: 16/9;
  object-fit: cover;
}

#pos {
  position: absolute;
  bottom: 16px;
  right: 16px;
  padding-right: 8px;
  margin: 0;
  text-align: right;
  display: flex;
  gap: 8px;
}

#pos li {
  width: 10px;
  height: 10px;
  margin: 0 2px;
  display: inline-block;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  background-color: rgba(255, 255, 255, 0.6);
  cursor: pointer;
  transition: all 0.3s ease;
}

#pos li.cur {
  background-color: #ffffff;
  transform: scale(1.2);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

/* ====== 导航菜单优化 ====== */
.wkh {
  font: 14px/1.6 "microsoft yahei", -apple-system, sans-serif;
  color: #5f6368;
  background: #f8f9fa;
  color: #5f6368;
  display: block;
  overflow: hidden;
  padding: 12px 16px 0 16px;
  border-radius: 8px;
  margin: 16px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
}

.wkh a, .wkh em {
  color: #1a73e8;
  margin: 0 8px;
  font-weight: 500;
  transition: color 0.3s ease;
}

.wkh h1 {
  display: inline-table;
  font-weight: 400;
  font: 14px/1.6 "microsoft yahei", -apple-system, sans-serif;
}

/* ====== 分类标签优化 - 响应式设计 ====== */
#tx {
  padding: 16px 0 0 16px;
  clear: both;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 8px;
  margin: 16px;
  background: #f8f9fa;
  border-radius: 12px;
  padding: 16px;
}

#tx a {
  font: 500 14px/40px "微软雅黑", -apple-system, sans-serif;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  margin-left: 0;
  border-bottom: 4px solid transparent;
  box-sizing: border-box;
  text-align: center;
  background-color: #e8f0fe;
  color: #1a73e8;
  border-radius: 8px;
  min-height: 44px;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  padding: 0 8px;
}

#tx a:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
  border-bottom-color: #1a73e8;
}

/* 原有颜色分类保持不变，添加渐变效果 */
#tx a:nth-child(1) {
  background: linear-gradient(135deg, #c1e4d6, #e3f2fd);
  color: #1b8f65;
}

#tx a:nth-child(2) {
  background: linear-gradient(135deg, #cee0ba, #f1f8e9);
  color: #538220;
}

#tx a:nth-child(3) {
  background: linear-gradient(135deg, #c5dce4, #e3f2fd);
  color: #1b6883;
}

#tx a:nth-child(4) {
  background: linear-gradient(135deg, #e5ccc6, #ffebee);
  color: #a63b22;
}

#tx a:nth-child(5) {
  background: linear-gradient(135deg, #eadbcf, #fff3e0);
  color: #c66219;
}

#tx a:nth-child(6) {
  background: linear-gradient(135deg, #d2cfe7, #f3e5f5);
  color: #403879;
}

#tx a:nth-child(7) {
  background: linear-gradient(135deg, #c7d2e1, #e8eaf6);
  color: #40597a;
}

#tx a:nth-child(8) {
  background: linear-gradient(135deg, #f4dada, #ffebee);
  color: #e33d3d;
}

#tx a:nth-child(9) {
  background: linear-gradient(135deg, #c7e4e1, #e0f2f1);
  color: #1d6c64;
}

/* ====== 顶部导航优化 ====== */
#n_v {
  display: none;
  width: 100%;
  overflow: hidden;
  position: fixed;
  top: 0px;
  height: 48px;
  padding: 0px 16px;
  background-color: rgba(255, 255, 255, 0.95);
  border-bottom: #E7E7E7 solid 1px;
  overflow-x: auto;
  white-space: nowrap;
  z-index: 1000;
  backdrop-filter: blur(10px);
}

#n_v a {
  margin-right: 24px;
  color: #5f6368;
  line-height: 48px;
  display: inline-table;
  padding: 0 8px;
  font-weight: 500;
  transition: all 0.3s ease;
  position: relative;
}

#n_v a.hover {
  border-bottom: #1a73e8 solid 3px;
  color: #1a73e8;
  height: 48px;
  line-height: 48px;
}

/* ====== 头部区域优化 ====== */
.ad {
  display: block;
  margin: 8px 16px 0px 16px;
  overflow: hidden;
  z-index: 1;
  border-radius: 8px;
}

.top0 {
  display: block;
  overflow: hidden;
  background-color: rgba(255, 255, 255, 0.95);
  height: auto;
  width: 100%;
  position: fixed;
  top: 0;
  z-index: 99;
  backdrop-filter: blur(10px);
  border-bottom: 1px solid #E6E6E6;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.top1 {
  display: block;
  overflow: hidden;
  background-color: #f8f9fa;
  z-index: 99;
}

.top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  overflow: hidden;
  border-bottom: #E6E6E6 solid 1px;
  padding: 12px 16px;
  background-color: #f8f9fa;
  height: 56px;
}

.topr {
  float: right;
  display: flex;
  align-items: center;
  gap: 16px;
}

.topr img {
  padding-left: 14px;
  width: 24px;
  height: 24px;
  object-fit: contain;
}

.top span {
  float: right;
  width: auto;
  min-width: 80px;
  line-height: 1.5;
  text-align: center;
  border: 2px solid transparent;
  color: #ffffff;
  font-size: 14px;
  margin-top: 0;
  cursor: pointer;
  background: linear-gradient(135deg, #1a73e8, #4285f4);
  padding: 8px 16px;
  border-radius: 8px;
  font-weight: 500;
  transition: all 0.3s ease;
}

.top span:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.top2, .top3, .top4 {
  display: none;
  overflow: hidden;
  padding: 16px;
  background-color: #f8f9fa;
  border-top: 1px solid #E6E6E6;
}

.zoom {
  display: block;
  overflow: hidden;
  text-align: center;
  font-size: 18px;
}

.zoom span {
  color: #5f6368;
}

.zoom i {
  font-style: normal;
  color: #BBBBBB;
}

/* ====== 内容区域优化 ====== */
.c1 {
  display: block;
  overflow: hidden;
  margin: 24px 0px 12px 0px;
  padding: 0px 16px 0px 16px;
  line-height: 1.4;
  font-weight: 600;
  font-size: clamp(20px, 5vw, 28px);
}

.c1 h1 {
  line-height: 1.4;
  font-weight: 600;
  font-size: inherit;
}

.c2 {
  display: block;
  overflow: hidden;
  margin: 0px 0px 24px 0px;
  padding: 0px 16px 0px 16px;
  line-height: 1.5;
  font-size: 14px;
  word-wrap: break-word;
  color: #5f6368;
}

.c2 span {
  margin-right: 16px;
  color: #9aa0a6;
}

.c2 a {
  color: #1a73e8;
  margin-left: 8px;
  font-weight: 500;
}

.c3 {
  display: block;
  overflow: hidden;
  margin: 24px 0px;
  padding: 0px 16px 0px 16px;
  line-height: 1.8;
  word-wrap: break-word;
  color: #202124;
  font-size: 16px;
}

.c3 p, .c3 br {
  color: #202124;
  text-indent: 2em;
  margin-bottom: 24px;
}

.c3 u {
  text-decoration: none;
  font-weight: 600;
  color: #1a73e8;
}

.c3 a {
  color: #1a73e8;
  font-weight: 500;
  position: relative;
}

.c3 a::after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: #1a73e8;
  transform: scaleX(0);
  transition: transform 0.3s ease;
}

.c3 a:hover::after {
  transform: scaleX(1);
}

/* ====== 标题区域优化 ====== */
.t {
  display: block;
  overflow: hidden;
  margin: 16px 16px 0px 16px;
  background-color: #e8f0fe;
  border-left: #1a73e8 solid 4px;
  height: auto;
  min-height: 40px;
  line-height: 1.5;
  text-indent: 12px;
  padding: 12px 16px;
  border-radius: 0 8px 8px 0;
  font-weight: 500;
}

.t a {
  color: #1a73e8;
  font-weight: 600;
}

/* ====== 弹窗和遮罩优化 ====== */
.wxdiv {
  width: 100%;
  overflow-y: auto;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.9);
  position: fixed;
  top: 0px;
  left: 0px;
  display: none;
  z-index: 9999;
  backdrop-filter: blur(5px);
}

.wxdiv1 {
  width: 90%;
  max-width: 400px;
  margin: 40px auto;
  padding: 32px 0px 0px 0px;
  line-height: 2.0;
  background: white;
  border-radius: 16px;
  box-shadow: 0 24px 48px rgba(0, 0, 0, 0.2);
}

.wxdiv2 {
  display: block;
  overflow: hidden;
  text-align: center;
}

.wxdiv1 s {
  display: block;
  overflow: hidden;
  text-align: center;
  margin: 24px 0px;
}

.wxdiv1 s img {
  border: #FFFFFF solid 8px;
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}

.wxdiv1 i {
  display: block;
  overflow: hidden;
  text-align: center;
  font-style: normal;
  color: #5f6368;
  margin-top: 16px;
}

.wxdiv1 u {
  color: #1a73e8;
  text-decoration: none;
  font-weight: 500;
}

#cover {
  display: none;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 18888;
  background-color: rgba(0, 0, 0, 0.7);
  width: 100%;
  height: 100%;
  backdrop-filter: blur(3px);
}

#guide {
  display: none;
  position: fixed;
  right: 24px;
  top: 24px;
  z-index: 19999;
}

#guide img {
  width: 280px;
  height: auto;
  max-width: 90vw;
  border-radius: 12px;
  box-shadow: 0 16px 32px rgba(0, 0, 0, 0.2);
}

/* ====== 字体大小类优化 ====== */
.infof-1 {
  font-size: 14px;
}
.infof0 {
  font-size: 16px;
}
.infof1 {
  font-size: 18px;
}
.infof2 {
  font-size: 20px;
}
.infof3 {
  font-size: 22px;
}
.infof4 {
  font-size: 24px;
}
.infof5 {
  font-size: 28px;
}
.infof6 {
  font-size: 30px;
}

/* ====== 广告区域优化 ====== */
.ad1 {
  display: block;
  overflow: hidden;
  z-index: 1;
  padding-left: 0.5%;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 16px;
  margin: 16px;
}

.ad1 li {
  width: 100%;
  float: left;
  text-align: center;
  margin: 0px 0% 10px 0%;
  font-size: 13px;
  background: #f8f9fa;
  border-radius: 8px;
  padding: 12px;
  transition: all 0.3s ease;
}

.ad1 li:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}

.ad1 li img {
  width: 100%;
  height: 120px;
  object-fit: cover;
  border-radius: 6px;
  margin-bottom: 8px;
}

.ad1 li p {
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: #5f6368;
  font-weight: 500;
}

.ad2 {
  display: flex;
  align-items: center;
  overflow: hidden;
  z-index: 1;
  min-height: 100px;
  position: relative;
  margin: 0px 16px 16px 16px;
  background: #f8f9fa;
  border-radius: 12px;
  padding: 16px;
  gap: 16px;
}

.ad2 .ad2i, .ad2 .ad2i img {
  width: 80px;
  height: 80px;
  flex-shrink: 0;
  border-radius: 8px;
}

.ad2i {
  float: left;
  position: static;
  top: auto;
  left: 0;
  margin-right: 16px;
}

.ad2 h2, .ad2 p {
  display: block;
  overflow: hidden;
  margin-left: 96px;
  font-weight: 400;
}

.ad2 h2 {
  font-size: 16px;
  color: #202124;
  line-height: 1.4;
  padding-top: 0;
  height: auto;
  min-height: 40px;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.ad2 p {
  font-size: 14px;
  color: #5f6368;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

/*????*/
#f {
  display: block;
  padding: 20px 24px;
  border-top: 2px solid #dadce0;
  font-size: 16px;
  line-height: 1.6;
  color: #1a73e8;
  margin-top: 24px;
  text-align: center;
  background: linear-gradient(135deg, #f8f9fa, #e8f0fe);
  border-radius: 12px;
  margin: 24px 16px;
}

#f span {
  float: right;
  color: #1a73e8;
  font-weight: 500;
}

#f a {
  color: #1a73e8;
  font-weight: 500;
  margin: 0 8px;
}

/* ====== 返回顶部按钮优化 ====== */
#gotop {
  width: 48px;
  height: 48px;
  display: none;
  position: fixed;
  right: 16px;
  bottom: 96px;
  filter: alpha(opacity=90);
  -moz-opacity: 0.9;
  -khtml-opacity: 0.9;
  opacity: 0.9;
  background: linear-gradient(135deg, #1a73e8, #4285f4);
  border-radius: 50%;
  border: none;
  cursor: pointer;
  z-index: 999;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

#gotop:hover {
  opacity: 1;
  transform: translateY(-4px);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.2);
}

#gopl {
  width: 48px;
  height: 48px;
  display: block;
  position: fixed;
  right: 16px;
  bottom: 156px;
  filter: alpha(opacity=90);
  -moz-opacity: 0.9;
  -khtml-opacity: 0.9;
  opacity: 0.9;
  cursor: pointer;
  background: linear-gradient(135deg, #00bcd4, #1de9b6);
  border-radius: 50%;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
  transition: all 0.3s ease;
}

#gopl:hover {
  opacity: 1;
  transform: translateY(-4px);
}

/* ====== 数字和评论区域 ====== */
.num {
  display: none;
}

.pl {
  display: block;
  overflow: hidden;
  margin: 16px 0px 12px 0px;
  padding: 0px 8px 0px 8px;
  line-height: 1.6;
  font-size: 18px;
  font-weight: 600;
  color: #202124;
}

/* ====== 图片标题区域 ====== */
.t img {
  width: 100%;
  border-radius: 8px;
}

.httype {
  display: block;
  overflow: hidden;
  background: linear-gradient(135deg, #1a73e8, #4285f4);
  margin: 16px 0px 24px 0px;
  padding: 12px 16px;
  line-height: 1.5;
  position: relative;
  border-radius: 8px;
  color: white;
}

.httype a {
  color: #ffffff;
  float: left;
  margin: 0px 16px 0px 8px;
  font-size: 16px;
  font-weight: 500;
  transition: opacity 0.3s ease;
}

.httype a:hover {
  opacity: 0.9;
}

.httype i {
  font-style: normal;
  position: absolute;
  bottom: 12px;
  right: 24px;
  color: rgba(255, 255, 255, 0.9);
}

.htimg {
  margin-top: 8px;
}

.wx0 i {
  color: #1a73e8;
  font-style: normal;
  display: inline-table;
}

.wx2 i {
  font-style: normal;
  display: inline-table;
}

.borderb {
  border-bottom: #f0f0f0 solid 1px;
}

.t1 {
  display: block;
  overflow: hidden;
  line-height: 1.5;
  text-align: center;
  font-size: 20px;
  margin: 16px;
  font-weight: 600;
}

.t1 h1 {
  font-weight: 600;
  font-size: 20px;
  color: #202124;
}

.c {
  display: block;
  overflow: hidden;
  line-height: 1.6;
  font-size: 15px;
  margin: 0px 16px 16px 16px;
  text-indent: 2em;
  color: #5f6368;
}

.c1 {
  display: block;
  overflow: hidden;
  line-height: 1.6;
  font-size: 15px;
  margin: 0px 16px 16px 16px;
  color: #5f6368;
}

.c1 a, .t5 a {
  color: #1a73e8;
  font-weight: 500;
}

.t2 {
  display: block;
  overflow: hidden;
  border-left: #1a73e8 solid 5px;
  font-size: 18px;
  line-height: 1.5;
  color: #202124;
  padding-left: 12px;
  margin: 16px;
  font-weight: 600;
  background: #e8f0fe;
  border-radius: 0 8px 8px 0;
  padding: 12px;
}

.t2 i {
  font-style: normal;
  color: #202124;
}

.t2 a {
  color: #202124;
}

/* ====== 漫画信息区域优化 ====== */
.mh-info {
  display: block;
  overflow: hidden;
  line-height: 1.6;
  font-size: 16px;
  margin: 8px 16px 0px 16px;
  color: #1a73e8;
  line-height: 2;
  padding-bottom: 24px;
  background-image: linear-gradient(135deg, #e8f0fe, #f8f9fa);
  background-repeat: no-repeat;
  background-position: 16px bottom;
  font-weight: 400;
  border-radius: 12px;
  padding: 20px;
  position: relative;
}

.mh-info::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 4px;
  height: 100%;
  background: linear-gradient(to bottom, #1a73e8, #00bcd4);
  border-radius: 12px 0 0 12px;
}

.mh-info span {
  font-size: 14px;
}

.mh-info h1 {
  font-size: 18px;
  font-weight: 600;
  color: #202124;
  margin-bottom: 12px;
}

.mh-info i {
  font-size: 14px;
}

.mh-info img {
  float: left;
  border-radius: 8px;
  margin-right: 16px;
  width: 80px;
  height: 100px;
  object-fit: cover;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.mh-info a, .c2 a, .wkc a {
  color: #1a73e8;
  font-weight: 500;
}

.c2 {
  display: block;
  overflow: hidden;
  font-size: 14px;
  color: #202124;
  margin: 0px 16px;
  padding: 12px 20px 16px 20px;
  background-color: #e8f0fe;
  border-radius: 12px;
  line-height: 1.6;
  margin-bottom: 12px;
  margin-top: 24px;
  border-left: 4px solid #1de9b6;
}

.c2 p {
  display: block;
  overflow: hidden;
  width: 100%;
}

.t4 {
  display: block;
  overflow: hidden;
  line-height: 1.5;
  text-align: left;
  font-size: 20px;
  margin: 16px 16px 0px 16px;
  font-weight: 600;
}

.t4 h1 {
  font-weight: 600;
  font-size: 20px;
  color: #202124;
}

.t5 {
  display: block;
  overflow: hidden;
  line-height: 1.5;
  text-align: left;
  font-size: 14px;
  margin: 0px 16px 16px 16px;
  color: #5f6368;
}

.wkc {
  display: block;
  overflow: hidden;
  font-size: 15px;
  color: #202124;
  margin: 0px 16px;
  padding: 12px 20px 16px 20px;
  background-color: #e8f0fe;
  border-radius: 12px;
  line-height: 1.6;
  margin-bottom: 12px;
  border-left: 4px solid #00bcd4;
  margin-top: 15px;
}

.wkc p {
  display: block;
  overflow: hidden;
  width: 100%;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  color: #5f6368;
}

.imgnone {
  pointer-events: none;
}

#tagBox img {
  width: 90%;
  height: 150px;
  border: 1px solid #e0e0e0;
  padding: 8px;
  border-radius: 8px;
  object-fit: cover;
}

/* ====== AC盒子优化 ====== */
.ac-box > .list {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin: 8px 0px 16px 0px;
  gap: 8px;
  justify-content: center;
}

.ac-box > .list.pb-btn{
  padding-bottom: 4rem;
  position: relative;
  z-index: 0;
}

.ac-box > .list .item {
  width: 31.33%;
  margin-top: 10px;
  padding: 0px 1% 0px 1%;
  flex: 0 0 calc(33.333% - 8px);
  max-width: calc(33.333% - 8px);
}

.ac-box > .list > .item a {
  padding: 12px;
  display: block;
  line-height: 1.5;
  border: 1px solid #e0e0e0;
  border-radius: 8px;
  font-size: 14px;
  color: #5f6368;
  position: relative;
  text-align: center;
  background: #f8f9fa;
  transition: all 0.3s ease;
}

.ac-box > .list > .item a span {
  margin-left: 8px;
  color: #ff730a;
  font-size: 12px;
  font-weight: 500;
}

.ac-box > .list > .item a.active {
  border-color: #1a73e8;
  background-color: #1a73e8;
  color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(26, 115, 232, 0.2);
}

.ac-box > .list > .item a:hover:not(.active) {
  border-color: #1a73e8;
  color: #1a73e8;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.ac-box > .list > .unlock a:after, .ac-box > .list > .lock a:after {
  display: block;
  content: " ";
  width: 16px;
  height: 16px;
  position: absolute;
  right: 12px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  background-size: 16px;
}

.ac-box .action {
  padding: 12px 0;
  width: 98%;
  display: none;
  position: absolute;
  z-index: 1;
  bottom: 0;
  left: 1%;
}

.ac-box > .list.pb-btn .action{
  display: block;
}

.ac-box .action .btn {
  display: block;
  border: 0px;
  text-align: center;
  color: #fff;
  background: linear-gradient(135deg, #1a73e8, #4285f4);
  border-radius: 8px;
  padding: 12px;
  color: #fff;
  font-weight: 500;
  transition: all 0.3s ease;
}

.ac-box .action .btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(26, 115, 232, 0.2);
}

.ac-box > .action .icon-arrow {
  background-image: url('../fonts/icon_arrow.svg');
  background-size: cover;
  width: 16px;
  height: 16px;
  display: inline-block;
  vertical-align: middle;
  margin-top: -3px;
  margin-left: 8px;
}

.item-hide {
  display: none;
}

.ac-box {
  padding: 12px 20px 16px 20px;
  background: #f8f9fa;
  border-radius: 12px;
  margin: 16px;
}

.c2 h1 {
  font-size: 16px;
  text-align: center;
  font-weight: 600;
  color: #202124;
}

.info-h2 {
  line-height: 1.5;
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 12px;
}

.total {
  float: right;
  padding-right: 24px;
  color: #1a73e8;
  font-weight: 500;
}

/* 轮播图CSS - 保持原有但优化 */
.slick-slider {
  position: relative;
  display: block;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -khtml-user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent;
  border-radius: 12px;
  overflow: hidden;
}

.slick-list {
  position: relative;
  display: block;
  overflow: hidden;
  margin: 0;
  padding: 0;
  border-radius: inherit;
}

.slide_loading {
  height: 200px;
  background: #f8f9fa;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
}

.slide_loading_box {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: inherit;
}

.slick-list:focus {
  outline: none;
}

.slick-list.dragging {
  cursor: pointer;
  cursor: hand;
}

.slick-slider .slick-track, .slick-slider .slick-list {
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

.slick-track {
  position: relative;
  top: 0;
  left: 0;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.slick-track:before, .slick-track:after {
  display: table;
  content: '';
}

.slick-track:after {
  clear: both;
}

.slick-loading .slick-track {
  visibility: hidden;
}

.slick-slide {
  display: none;
  float: left;
  height: 100%;
  min-height: 1px;
}

[dir='rtl'] .slick-slide {
  float: right;
}

.slick-slide img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
  aspect-ratio: 16/9;
}

.slick-slide.slick-loading img {
  display: none;
}

.slick-slide.dragging img {
  pointer-events: none;
}

.slick-initialized .slick-slide {
  display: block;
}

.slick-loading .slick-slide {
  visibility: hidden;
}

.slick-vertical .slick-slide {
  display: block;
  height: auto;
  border: 1px solid transparent;
}

.slick-arrow.slick-hidden {
  display: none;
}

.portal-slick img {
  display: block;
  width: 100%;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.slick-initialized img {
  opacity: 1;
}

.portal-slick .slick-dots {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 16px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  gap: 8px;
}

.portal-slick .slick-dots li {
  margin: 0 3px;
}

.portal-slick .slick-dots button {
  border: 0;
  background-color: rgba(255, 255, 255, 0.6);
  width: 8px;
  height: 8px;
  border-radius: 50%;
  text-indent: -999px;
  overflow: hidden;
  -webkit-transition: all 0.2s linear;
  transition: all 0.2s linear;
  padding: 0;
  cursor: pointer;
}

.portal-slick .slick-dots .slick-active button {
  width: 20px;
  border-radius: 10px;
  background-color: #1a73e8;
}

.portal-nav {
  background-color: #fff;
  padding: 12px;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  border-radius: 12px;
  margin: 16px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.portal-nav > .item a {
  display: block;
}

.portal-nav > .item {
  width: 25%;
  float: left;
  text-align: center;
  margin: 8px 0 16px 0;
}

.portal-nav > .item i[class^="icon-"] {
  display: block;
  width: 48px;
  height: 48px;
  margin: 0 auto;
  background-size: cover;
  background-repeat: no-repeat;
  border-radius: 50%;
  background-color: #e8f0fe;
  padding: 12px;
}

.portal-nav > .item .title {
  font-size: 14px;
  margin-top: 8px;
  color: #202124;
  font-weight: 500;
}

.links {
  padding: 16px;
  font-size: 15px;
  background: #f8f9fa;
  border-radius: 12px;
  margin: 16px;
}

.portal-nav > .item .title {
  font-size: 14px;
  margin-top: 8px;
  color: #202124;
  font-weight: 500;
}

.item_cate {
  width: 140px;
  border-radius: 12px;
  object-fit: cover;
  text-align: center;
}

.input2 {
  width: 100%;
  line-height: 40px;
  font-size: 16px;
  padding: 0px;
  text-indent: 20px;
  border: 2px solid #e0e0e0;
  border-radius: 8px;
  outline: none;
  transition: all 0.3s ease;
  background: #ffffff;
}

.input2:focus {
  border-color: #1a73e8;
  box-shadow: 0 0 0 3px rgba(26, 115, 232, 0.1);
}

/* 漫画标题区域 */
.mh-t {
  margin-top: 12px;
  display: block;
  padding: 12px 0px 12px 16px;
  line-height: 1.5;
  overflow: hidden;
  border-bottom: 1px solid #e0e0e0;
  margin-bottom: 16px;
  margin-left: 16px;
  margin-right: 16px;
}

.mh-main {
  background-color: #fff;
  margin: 16px;
  border-radius: 12px;
  padding: 16px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.mh-t em, .mh-t h2, .mh-t h1 {
  display: inline-block;
  font-size: 17px;
  color: #202124;
  font-style: normal;
  font-weight: 600;
}

.mh-t .mh-more {
  float: right;
  font-size: 14px;
  padding-right: 16px;
  color: #1a73e8;
  font-weight: 500;
}

.mh-t h2:before {
  display: inline-block;
  width: 4px;
  height: 16px;
  border-radius: 2px;
  background: linear-gradient(to bottom, #1a73e8, #00bcd4);
  vertical-align: middle;
  margin-top: -3px;
  margin-right: 8px;
  content: " ";
}

.mh-nav {
  display: block;
  overflow: hidden;
  height: 56px;
  background-color: rgba(255, 255, 255, 0.95);
  border-bottom: 1px solid #E7E7E7;
  line-height: 56px;
  position: relative;
  text-align: center;
  backdrop-filter: blur(10px);
}

.mh-nav h1 {
  font-size: 18px;
  font-weight: 600;
  color: #202124;
}

.mh-nav s {
  width: 78px;
  height: 18px;
  position: absolute;
  left: 16px;
  margin: 1px 0 0 0px;
}

.mh-nav i {
  width: 20px;
  height: 18px;
  position: absolute;
  right: 80px;
  top: 19px;
}

/* 图片列表优化 */
.imgBox {
  background: #fff;
  height: auto !important;
  min-height: 0px;
  padding: 16px;
}

.imgBox:after {
  display: block;
  clear: both;
  content: ".";
  visibility: hidden;
  height: 0;
}

.imgBox .bg {
  background: #fff;
  padding: 24px 0;
}

.imgBox .col_3_1, 
.imgBox .col_3_2 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
  gap: 16px;
}

.imgBox li {
  background: #f8f9fa;
  border-radius: 8px;
  overflow: hidden;
  transition: all 0.3s ease;
  padding: 12px;
}

.imgBox li:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}

.imgBox li .ImgA img {
  display: block;
  width: 100%;
  height: 150px;
  object-fit: cover;
  border-radius: 6px;
}

.imgBox li .txtA {
  color: #202124;
  font-size: 14px;
  display: block;
  line-height: 1.4;
  height: auto;
  padding-top: 8px;
  overflow: hidden;
  font-weight: 500;
}

.imgBox li .info {
  font-size: 12px;
  display: block;
  opacity: 0.8;
  overflow: hidden;
  height: auto;
  line-height: 1.4;
  margin: 4px 0 5px 0;
  color: #5f6368;
}

.imgBox .col_2 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 16px;
}

.imgBox .col_2 li {
  width: 100%;
  margin: 0;
}

.imgBox .col_2 li .ImgA {
  min-height: 100px;
}

.imgBox li .txtA.hei {
  line-height: 1.6;
  height: auto;
  padding-top: 0px;
  overflow: hidden;
}

.imgBox li span {
  display: block;
  overflow: hidden;
  font-style: normal;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.imgBox li i {
  display: block;
  overflow: hidden;
  line-height: 1.4;
  font-style: normal;
  height: auto;
  font-size: 14px;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #202124;
}

/* 页脚优化 */
.footer {
  width: 100%;
  margin: 24px auto 0px auto;
  clear: both;
  background: linear-gradient(135deg, #1a237e 0%, #0d47a1 100%);
  padding: 24px 0px 20px 0px;
  border-radius: 12px 12px 0 0;
  margin-top: 20px;
}

.ft1 {
  margin: 0px auto 12px auto;
  text-align: center;
  color: #ffffff;
  line-height: 1.6;
  font-size: 16px;
  font-weight: 600;
  padding: 0 16px;
}

.ft1 span {
  float: right;
  color: rgba(255, 255, 255, 0.8);
  font-size: 14px;
  font-weight: 400;
}

.ft2 {
  width: 100%;
  max-width: 1200px;
  margin: 0px auto;
  text-align: center;
  color: rgba(255, 255, 255, 0.8);
  line-height: 1.6;
  font-size: 14px;
  padding: 0 16px;
}

.footer a:link, .footer1 a:visited {
  color: rgba(255, 255, 255, 0.9);
  transition: color 0.3s ease;
}

.footer a:hover {
  color: #ffffff;
  text-decoration: underline;
}

.mh-info span a {
  margin-right: 8px;
  display: inline-block;
  max-width: 120px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.mh-nav h1 {
  font-size: 17px;
}

.mh-nav a {
  display: inline-block;
}

.mh-nav .back {
  width: 35px;
  height: 35px;
  float: left;
  padding: 8px 0px 0px 16px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.mh-nav img:nth-child(1) {
  width: 35px;
  height: 35px;
  object-fit: contain;
}

.mh-nav .search-open {
  width: 40px;
  height: 40px;
  float: right;
  padding: 8px 16px 0px 0px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.mh-chapter a {
  font-size: 14px;
  float: right;
  padding-right: 16px;
  color: #1a73e8;
  font-weight: 500;
}

.hr1 {
  width: 100%;
  padding-top: 20px;
  border-top: 1px solid #e0e0e0;
}

/* 栏目分类优化 */
.cate-top-wr {
  float: left;
  width: 100%;
  background: #f8f9fa;
  border-radius: 12px;
  margin: 16px;
  padding: 16px 0;
}

.cate-selector {
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding: 20px 20px 12px 20px;
  font-size: 14px;
  line-height: 1.6;
  background: #ffffff;
  border-top: 3px solid #1a73e8;
  border-radius: 12px;
  margin: 0 16px;
}

.cate-selector .cate-title {
  padding-bottom: 20px;
  font-weight: 600;
  color: #202124;
}

.cate-selector .cate-item {
  float: left;
  padding: 8px 16px;
  margin-left: 8px;
  margin-bottom: 12px;
  border-radius: 20px;
  color: #5f6368;
  cursor: pointer;
  background: #f8f9fa;
  border: 1px solid #e0e0e0;
  transition: all 0.3s ease;
}

.cate-selector .cate-item.active {
  background: linear-gradient(135deg, #1a73e8, #4285f4);
  border-color: #1a73e8;
}

.cate-selector .cate-item.active a {
  color: #fff;
}

.cate-selector .cate-item:hover {
  border-color: #1a73e8;
  color: #1a73e8;
}

.clearfix {
  clear: left;
}

.cate-list {
  width: 100%;
  margin: 0px auto;
  overflow: hidden;
  text-align: left;
  background-color: #FFFFFF;
  border-radius: 12px;
  padding: 16px;
}

.qrcode-div {
  position: fixed;
  padding: 20px 0px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 90%;
  max-width: 320px;
  height: auto;
  border-radius: 16px;
  background-color: #fff;
  color: #202124;
  text-align: center;
  font-size: 14px;
  box-shadow: 0 24px 48px rgba(0, 0, 0, 0.2);
  z-index: 10000;
}

.qrcode-div p {
  padding: 0 20px;
  text-align: left;
  text-indent: 2em;
  line-height: 1.6;
  color: #5f6368;
}

.qrcode-div_nei {
  width: 100%;
  min-height: 300px;
  max-height: 400px;
  height: auto;
  display: block;
  overflow-y: auto;
  padding: 0 20px;
}

.btn-share {
  display: block;
  margin: 20px auto;
  width: 240px;
  height: 44px;
  border-radius: 8px;
  background: linear-gradient(135deg, #1a73e8, #4285f4);
  color: #fff;
  text-align: center;
  line-height: 44px;
  cursor: pointer;
  font-weight: 500;
  transition: all 0.3s ease;
  border: none;
}

.btn-share:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(26, 115, 232, 0.2);
}

.overfloat {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  display: none;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  backdrop-filter: blur(3px);
}

/* 推荐漫画 */
.wxnewslistp {
  display: block;
  overflow: hidden;
  margin: 0px 16px;
  padding-top: 20px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
  gap: 12px;
}

.wxnewslistp li {
  display: inline-block;
  width: 100%;
  position: relative;
  -webkit-border-radius: 8px;
  border-radius: 8px;
  margin: 0;
  vertical-align: top;
  text-align: center;
  background: #f8f9fa;
  overflow: hidden;
  transition: all 0.3s ease;
}

.wxnewslistp li:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}

.wxnewslistp li img {
  width: 100%;
  display: block;
  -webkit-border-radius: 8px 8px 0 0;
  border-radius: 8px 8px 0 0;
  height: 150px;
  object-fit: cover;
}

.wxnewslistp li i {
  display: block;
  overflow: hidden;
  line-height: 1.4;
  font-style: normal;
  height: auto;
  padding: 12px 8px;
  font-size: 14px;
  font-weight: 500;
  color: #202124;
}

.wxnewslistp li span {
  display: block;
  overflow: hidden;
  font-style: normal;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 0 8px 12px;
  color: #5f6368;
  font-size: 12px;
}

.wxnewslist {
  display: block;
  overflow: hidden;
  margin: 8px 16px 0px 16px;
  border-top: 1px #F6F6F6 solid;
  background: #f8f9fa;
  border-radius: 12px;
  padding: 16px;
}

.wxnewslist li {
  line-height: 1.6;
  float: left;
  width: 100%;
  margin-top: 0;
  padding: 12px 0px;
  border-top: 1px solid #e0e0e0;
  display: flex;
  gap: 12px;
}

.wxnewslist li:first-child {
  border-top: none;
}

.wxnewslist li img {
  width: 60px;
  height: 60px;
  float: left;
  border-radius: 8px;
  margin-right: 0;
  flex-shrink: 0;
  object-fit: cover;
}

.wxnewslist li p {
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-left: 0;
  line-height: 1.4;
  color: #202124;
  margin-bottom: 4px;
  font-size: 15px;
  max-height: none;
  font-weight: 500;
  flex: 1;
}

.wxnewslist li i {
  display: block;
  color: #5f6368;
  line-height: 1.4;
  font-style: normal;
  margin-left: 0;
  font-size: 13px;
  flex: 1;
}

.wxnewslist li u {
  display: block;
  line-height: 1.4;
  color: #202124;
  margin-bottom: 4px;
  font-size: 15px;
  text-decoration: none;
  font-weight: 500;
}

.wxnewslist li span {
  display: block;
  color: #5f6368;
  line-height: 1.4;
  font-style: normal;
  font-size: 13px;
}

/* 分页优化 */
.pagination {
  font-size: 0;
  line-height: normal;
  text-align: center;
  padding: 24px 0;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
}

.pagination a, .pagination span.now-page {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  color: #202124;
  background-color: #f8f9fa;
  margin: 2px;
  height: 40px;
  line-height: 1;
  padding: 0 16px;
  border-radius: 8px;
  border: 1px solid #e0e0e0;
  transition: all 0.3s ease;
  min-width: 40px;
}

.pagination a:hover, .pagination span.now-page {
  background: linear-gradient(135deg, #1a73e8, #4285f4);
  color: #fff;
  border-color: #1a73e8;
}

.pagination .active a {
  background: linear-gradient(135deg, #1a73e8, #4285f4);
  color: #fff;
  border-color: #1a73e8;
}

.pagination span {
  background-color: #f8f9fa;
  color: #5f6368;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  margin: 2px 2.5px;
  height: 40px;
  line-height: 1;
  padding: 0 16px;
  border-radius: 8px;
  border: 1px solid #e0e0e0;
}

/* 搜索优化 */
.serCh {
  display: none;
  width: 100%;
  height: 56px;
  background: #ffffff;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 5;
  background-color: #ffffff;
  width: 100%;
  border-bottom: 1px solid #e0e0e0;
  padding: 8px 16px;
  display: flex;
  align-items: center;
}

.serChinputBox {
  margin-right: 92px;
  height: 40px;
  flex: 1;
  display: flex;
}

.searInput {
  -webkit-appearance: none;
  width: calc(100% - 10px);
  float: left;
  height: 40px;
  border: 2px solid #e0e0e0;
  margin: 0;
  border-radius: 8px 0 0 8px;
  border-right: 0;
  background: #f8f9fa;
  outline: none;
  font-size: 15px;
  padding: 0 0 0 16px;
  transition: all 0.3s ease;
}

.searInput:focus {
  border-color: #1a73e8;
  background: #ffffff;
}

.searBtn {
  width: 40px;
  height: 40px;
  border: 2px solid #e0e0e0;
  float: right;
  margin: 0;
  border-radius: 0 8px 8px 0;
  background: #1a73e8 url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="white"><path d="M15.5 14h-.79l-.28-.27A6.471 6.471 0 0 0 16 9.5 6.5 6.5 0 1 0 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"/></svg>') no-repeat center;
  background-size: 20px 20px;
  background-color: #1a73e8;
  border-left: 0;
  cursor: pointer;
  transition: all 0.3s ease;
}

.searBtn:hover {
  background-color: #0d62d9;
}

.searClose {
  width: 40px;
  height: 40px;
  border: 2px solid #e0e0e0;
  background: #f8f9fa url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%235f6368"><path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"/></svg>') no-repeat center;
  background-size: 20px 20px;
  border-radius: 8px;
  float: right;
  margin: 0 0 0 8px;
  background-color: #f8f9fa;
  cursor: pointer;
  transition: all 0.3s ease;
}

.searClose:hover {
  background-color: #e0e0e0;
}

.footer a {
  color: rgba(255, 255, 255, 0.9);
}

.ad-top-info {
  width: 100%;
  position: fixed;
  height: 80px;
  border-bottom: 1px solid #F4F4F4;
  overflow: hidden;
  bottom: 0px;
  background-color: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(10px);
  padding: 12px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  z-index: 1000;
  box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.1);
}

.ad-top-info-cross {
  height: 16px;
  position: absolute;
  top: 32px;
  left: 20px;
  z-index: 9;
}

.ad-top-info-main {
  padding-left: 40px;
  padding-right: 80px;
  position: relative;
  flex: 1;
}

.ad-top-info-right {
  width: 80px;
  height: 36px;
  line-height: 36px;
  text-align: center;
  position: absolute;
  top: 22px;
  right: 20px;
  background: linear-gradient(135deg, #1a73e8, #4285f4);
  border: none;
  border-radius: 8px;
  font-size: 14px;
  color: #ffffff;
  font-weight: 500;
  transition: all 0.3s ease;
}

.ad-top-info-right:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(26, 115, 232, 0.2);
}

.ad-top-info-main-cover {
  height: 56px;
  width: 56px;
  overflow: hidden;
  position: absolute;
  left: 40px;
  top: 12px;
  border-radius: 8px;
}

.ad-top-info a {
  color: #FFF;
}

.ad-top-info-main-cover.logo {
  width: 56px;
}

.ad-top-info-main-cover img {
  height: 56px;
  width: 100%;
  object-fit: cover;
}

.ad-top-info-main-right {
  padding-left: 72px;
}

.ad-top-info-main-right.logo {
  padding-left: 56px;
}

.ad-top-info-main-right-title {
  font-size: 16px;
  color: #202124;
  padding-top: 8px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-weight: 600;
}

.ad-top-info-main-right-subtitle {
  font-size: 14px;
  color: #5f6368;
  padding-top: 4px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ad-top-info-main-right .swiper-container3 {
  overflow: hidden;
}

.mh-info .pic {
  width: 100%;
  max-width: 300px;
  height: auto;
  border-radius: 12px;
  margin: 0 auto;
  display: block;
}

.control {
  padding: 20px;
  height: auto;
  display: flex;
  gap: 8px;
  justify-content: center;
  margin: 16px;
}

.control a {
  width: 30%;
  float: left;
  font-size: 16px;
  text-align: center;
  background: linear-gradient(135deg, #f8f9fa, #e8f0fe);
  padding: 12px;
  border-radius: 8px;
  font-weight: 500;
  transition: all 0.3s ease;
  border: 1px solid #e0e0e0;
}

.control a:hover {
  background: linear-gradient(135deg, #1a73e8, #4285f4);
  color: white;
  border-color: #1a73e8;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(26, 115, 232, 0.2);
}

.control .item:nth-child(2) a,.control .item:nth-child(3) a {
  margin-left: 0;
}

.control .load {
  text-align: center;
  width: 100%;
  padding: 12px;
}

.copyright-box{
  margin: 0px 16px;
  padding: 12px 20px 16px 20px;
  line-height: 1.6;
  background: linear-gradient(135deg, #fff3e0, #ffecb3);
  border-radius: 12px;
  border-left: 4px solid #ff9800;
}

.copyright-box p{
  color: #f57c00;
  font-weight: 500;
  margin-bottom: 8px;
}

/* ====== 响应式设计优化 ====== */
@media (max-width: 768px) {
  body {
    font-size: 15px;
  }
  
  #gd, .wkh, #tx, .c1, .c2, .c3, .t, .mh-info, .wkc, .ad, .ad1, .ad2, .ac-box,
  .imgBox, .wxnewslistp, .wxnewslist, .cate-top-wr, .footer, .copyright-box,
  .control, .mh-main, .mh-t {
    margin-left: 12px;
    margin-right: 12px;
  }
  
  #tx {
    grid-template-columns: repeat(2, 1fr);
  }
  
  .ac-box > .list .item {
    width: 48%;
    flex: 0 0 calc(50% - 8px);
    max-width: calc(50% - 8px);
  }
  
  .imgBox .col_3_1, 
  .imgBox .col_3_2,
  .imgBox .col_2 {
    grid-template-columns: repeat(2, 1fr);
  }
  
  .ad1 {
    grid-template-columns: repeat(2, 1fr);
  }
  
  .wxnewslistp {
    grid-template-columns: repeat(2, 1fr);
  }
  
  .portal-nav > .item {
    width: 25%;
  }
  
  .control a {
    width: 100%;
    margin-bottom: 8px;
  }
  
  .control {
    flex-direction: column;
  }
  
  #gotop, #gopl {
    width: 40px;
    height: 40px;
    bottom: 80px;
    right: 12px;
  }
  
  #gopl {
    bottom: 130px;
  }
  
  .pagination a, .pagination span.now-page {
    min-width: 36px;
    height: 36px;
    padding: 0 12px;
    font-size: 13px;
  }
}

@media (max-width: 480px) {
  #tx {
    grid-template-columns: 1fr;
  }
  
  .ac-box > .list .item {
    width: 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }
  
  .imgBox .col_3_1, 
  .imgBox .col_3_2,
  .imgBox .col_2 {
    grid-template-columns: 1fr;
  }
  
  .ad1 {
    grid-template-columns: 1fr;
  }
  
  .wxnewslistp {
    grid-template-columns: 1fr;
  }
  
  .portal-nav > .item {
    width: 50%;
    margin-bottom: 16px;
  }
  
  .wxnewslist li {
    flex-direction: column;
    text-align: center;
  }
  
  .wxnewslist li img {
    margin: 0 auto 8px;
    float: none;
  }
  
  .wxnewslist li p,
  .wxnewslist li i {
    margin-left: 0;
    text-align: center;
  }
  
  .ad2 {
    flex-direction: column;
    text-align: center;
  }
  
  .ad2i {
    position: static;
    margin: 0 auto 12px;
    float: none;
  }
  
  .ad2 h2, .ad2 p {
    margin-left: 0;
    text-align: center;
  }
  
  .pagination {
    gap: 4px;
  }
  
  .pagination a, .pagination span.now-page {
    min-width: 32px;
    height: 32px;
    padding: 0 8px;
    font-size: 12px;
  }
}

@media (min-width: 1200px) {
  #gd, .wkh, #tx, .c1, .c2, .c3, .t, .mh-info, .wkc, .ad, .ad1, .ad2, .ac-box,
  .imgBox, .wxnewslistp, .wxnewslist, .cate-top-wr, .footer, .copyright-box,
  .control, .mh-main, .mh-t {
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
  }
}

/* ====== 打印样式优化 ====== */
@media print {
  .ad, #gotop, #gopl, .top, .top0, .top1, #n_v, .ad-top-info, .control {
    display: none !important;
  }
  
  body {
    color: #000;
    background: #fff;
    font-size: 12pt;
  }
  
  a {
    color: #000;
    text-decoration: underline;
  }
  
  #f, .copyright-box {
    border: 1px solid #ddd;
    page-break-inside: avoid;
  }
}

/* ====== 新增：电脑端优化样式 ====== */
@media (min-width: 769px) {
  /* 电脑端图片优化 */
  #gd .sw-wrap > div img {
    max-height: 400px;
    object-fit: contain;
    background-color: #f8f9fa;
  }
  
  .imgBox li .ImgA img {
    height: 200px;
    transition: transform 0.3s ease;
  }
  
  .imgBox li:hover .ImgA img {
    transform: scale(1.05);
  }
  
  .wxnewslistp li img {
    height: 180px;
  }
  
  /* 内容页a标签链接优化 */
  .c3 a {
    padding: 2px 4px;
    border-radius: 3px;
    transition: all 0.3s ease;
  }
  
  .c3 a:hover {
    background-color: rgba(26, 115, 232, 0.1);
    text-decoration: underline;
  }
  
  /* 搜索框优化 - 默认不显示 */
  .serCh {
    display: none !important;
  }
  
  /* 返回上一页图标优化 */
  .mh-nav .back img {
    width: 24px !important;
    height: 24px !important;
    padding: 8px;
    background-color: #e8f0fe;
    border-radius: 50%;
    transition: all 0.3s ease;
  }
  
  .mh-nav .back:hover img {
    background-color: #1a73e8;
    transform: scale(1.1);
  }
  
  .mh-nav .back {
    width: 48px !important;
    height: 48px !important;
    padding: 12px 0px 0px 20px !important;
  }
  
  /* 布局优化 */
  #gd, .wkh, #tx, .c1, .c2, .c3, .t, .mh-info, .wkc, .ad, .ad1, .ad2, .ac-box,
  .imgBox, .wxnewslistp, .wxnewslist, .cate-top-wr, .footer, .copyright-box,
  .control, .mh-main, .mh-t {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
  }
  
  #tx {
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
  }
  
  .ac-box > .list .item {
    width: 23%;
    flex: 0 0 calc(25% - 8px);
    max-width: calc(25% - 8px);
  }
  
  .imgBox .col_3_1, 
  .imgBox .col_3_2 {
    grid-template-columns: repeat(5, 1fr);
  }
  
  .imgBox .col_2 {
    grid-template-columns: repeat(4, 1fr);
  }
  
  .ad1 {
    grid-template-columns: repeat(4, 1fr);
  }
  
  .wxnewslistp {
    grid-template-columns: repeat(6, 1fr);
  }
  
  .wxnewslist li {
    width: 48%;
    float: left;
    margin-right: 2%;
  }
  
  .wxnewslist li:nth-child(2n) {
    margin-right: 0;
  }
  
  .portal-nav > .item {
    width: 12.5%;
  }
}

/* ====== 新增：通用优化样式 ====== */
/* 搜索框优化 - 修正显示问题 */
.serCh {
  position: fixed !important;
  top: 0;
  left: 0;
  z-index: 2000 !important;
  display: none !important;
  opacity: 0;
  transform: translateY(-100%);
  transition: all 0.3s ease;
}

.serCh.active {
  display: flex !important;
  opacity: 1;
  transform: translateY(0);
}

/* 返回按钮通用优化 */
.mh-nav .back {
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.mh-nav .back img {
  width: 20px;
  height: 20px;
  object-fit: contain;
  transition: transform 0.2s ease;
}

.mh-nav .back:hover img {
  transform: translateX(-2px);
}

/* 图片通用优化 */
img {
  max-width: 100%;
  height: auto;
}

/* 链接通用优化 */
a {
  word-break: break-word;
  line-height: 1.5;
}

.c3 a {
  display: inline-block;
  margin: 0 2px;
}

/* 布局稳定性优化 */
* {
  box-sizing: border-box;
}

body {
  overflow-x: hidden;
  width: 100%;
}

/* 防止布局错乱 */
.clearfix::after {
  content: "";
  display: table;
  clear: both;
}

/* 响应式图片容器 */
.img-container {
  position: relative;
  overflow: hidden;
}

/* 导航优化 */
#n_v {
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

#n_v::-webkit-scrollbar {
  display: none;
}

/* 内容区域链接优化 */
.content-links a {
  margin: 0 4px;
  padding: 1px 3px;
}

/* 搜索框触发按钮优化 */
.search-trigger {
  cursor: pointer;
  padding: 8px;
  border-radius: 50%;
  transition: background-color 0.3s ease;
}

.search-trigger:hover {
  background-color: rgba(26, 115, 232, 0.1);
}

/* 新增：搜索框动画 */
@keyframes slideDown {
  from {
    opacity: 0;
    transform: translateY(-20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.serCh.active {
  animation: slideDown 0.3s ease forwards;
}

/* 新增：图片加载优化 */
.img-loading {
  background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
  background-size: 200% 100%;
  animation: loading 1.5s infinite;
}

@keyframes loading {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* 新增：大屏幕阅读优化 */
@media (min-width: 1024px) {
  body {
    font-size: 17px;
    line-height: 1.7;
  }
  
  .c3 {
    font-size: 18px;
    line-height: 1.8;
  }
  
  .c3 p {
    margin-bottom: 28px;
  }
}

/* 新增：打印优化 */
@media print {
  .serCh, .mh-nav .back, .search-trigger {
    display: none !important;
  }
  
  a {
    color: #000 !important;
    text-decoration: underline !important;
  }
  
  a[href^="http"]:after {
    content: " (" attr(href) ")";
    font-size: 12px;
    color: #666;
  }
}

/* 新增：高对比度模式支持 */
@media (prefers-contrast: high) {
  a {
    text-decoration: underline;
  }
  
  a:hover {
    text-decoration: underline;
    outline: 2px solid currentColor;
  }
}

/* 新增：减少动画偏好 */
@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* 修正原有样式中的潜在问题 */
.top0 {
  z-index: 1000;
}

#n_v {
  z-index: 999;
}

.mh-nav {
  z-index: 998;
}

/* 确保搜索框在最顶层 */
.serCh {
  z-index: 2001 !important;
}

/* 内容区域安全边距 */
.content-safe-area {
  padding-left: env(safe-area-inset-left);
  padding-right: env(safe-area-inset-right);
}

/* 修复可能的内容溢出 */
.text-overflow-safe {
  overflow-wrap: break-word;
  word-wrap: break-word;
  hyphens: auto;
}

/* ====== 新增：控制按钮(prev/next)排版优化 ====== */
.control {
  padding: 20px;
  height: auto;
  display: flex;
  gap: 8px;
  justify-content: center;
  margin: 16px;
  flex-wrap: wrap; /* 添加换行支持 */
}

/* 修正原有的control样式 */
.control > .item {
  flex: 1;
  min-width: 120px;
  max-width: 200px;
  margin: 0 !important; /* 清除原有margin */
}

.control > .item a {
  width: 100%; /* 改为100%填充父容器 */
  float: none; /* 清除浮动 */
  font-size: 16px;
  text-align: center;
  background: linear-gradient(135deg, #f8f9fa, #e8f0fe);
  padding: 12px;
  border-radius: 8px;
  font-weight: 500;
  transition: all 0.3s ease;
  border: 1px solid #e0e0e0;
  display: block; /* 改为块级显示 */
  text-decoration: none; /* 移除下划线 */
  color: #202124; /* 添加文字颜色 */
}

.control > .item a:hover {
  background: linear-gradient(135deg, #1a73e8, #4285f4);
  color: white;
  border-color: #1a73e8;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(26, 115, 232, 0.2);
}

/* 电脑端优化：水平排列控制按钮 */
@media (min-width: 769px) {
  .control {
    flex-wrap: nowrap; /* 电脑端不换行 */
    justify-content: space-between; /* 均匀分布 */
    max-width: 800px; /* 限制最大宽度 */
    margin-left: auto;
    margin-right: auto;
    gap: 16px; /* 增大间距 */
  }
  
  .control > .item {
    flex: 1;
    min-width: auto;
    max-width: 250px;
  }
  
  .control > .item.prev {
    order: 1; /* 上一页在左边 */
    text-align: left;
  }
  
  .control > .item.next {
    order: 3; /* 下一页在右边 */
    text-align: right;
  }
  
  .control > .item:not(.prev):not(.next) {
    order: 2; /* 中间按钮在中间 */
    text-align: center;
  }
  
  /* 电脑端按钮更大 */
  .control > .item a {
    padding: 14px 20px;
    font-size: 16px;
  }
  
  /* 悬停效果优化 */
  .control > .item a:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 16px rgba(26, 115, 232, 0.25);
  }
}

/* 手机端优化：垂直或紧凑排列 */
@media (max-width: 768px) {
  .control {
    flex-direction: column; /* 垂直排列 */
    gap: 12px;
    padding: 16px;
    margin: 12px;
  }
  
  .control > .item {
    width: 100%;
    max-width: 100%;
  }
  
  .control > .item a {
    width: 100%;
    margin-bottom: 0; /* 清除原有margin-bottom */
  }
  
  /* 手机端按钮紧凑排列 */
  .control.mobile-compact {
    flex-direction: row;
    flex-wrap: wrap;
  }
  
  .control.mobile-compact > .item {
    flex: 1;
    min-width: 48%; /* 两个按钮并排 */
  }
  
  .control.mobile-compact > .item:last-child {
    flex-basis: 100%; /* 第三个按钮单独一行 */
    margin-top: 12px;
  }
}

/* 新增：特定页面控制按钮样式 */
/* 用于章节导航的control */
.chapter-control {
  margin-top: 24px;
  margin-bottom: 32px;
  background: #f8f9fa;
  border-radius: 12px;
  padding: 20px;
  border: 1px solid #e0e0e0;
}

.chapter-control > .item a {
  background: #ffffff;
  border: 2px solid #e0e0e0;
}

.chapter-control > .item.prev a::before {
  content: "← ";
  font-weight: bold;
}

.chapter-control > .item.next a::after {
  content: " →";
  font-weight: bold;
}

/* 用于分页导航的control */
.pagination-control {
  margin: 32px auto;
  max-width: 600px;
}

/* 确保clearfix正常工作 */
.control.clearfix::after {
  content: "";
  display: table;
  clear: both;
}

/* 兼容旧版浮动布局 */
.control.clearfix > .item {
  float: left;
  box-sizing: border-box;
}

@media (min-width: 769px) {
  .control.clearfix > .item.prev {
    width: 30%;
    float: left;
  }
  
  .control.clearfix > .item:not(.prev):not(.next) {
    width: 30%;
    margin: 0 5% !important;
    float: left;
  }
  
  .control.clearfix > .item.next {
    width: 30%;
    float: right;
  }
}

@media (max-width: 768px) {
  .control.clearfix > .item {
    float: none;
    width: 100%;
    margin-bottom: 12px !important;
  }
  
  .control.clearfix > .item:last-child {
    margin-bottom: 0 !important;
  }
}

/* 按钮状态样式 */
.control > .item a.disabled,
.control > .item a[disabled] {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
  background: linear-gradient(135deg, #f0f0f0, #e0e0e0);
  color: #9aa0a6;
  border-color: #d0d0d0;
}

.control > .item a.active {
  background: linear-gradient(135deg, #1a73e8, #4285f4);
  color: white;
  border-color: #1a73e8;
  font-weight: 600;
}

/* 图标按钮样式 */
.control > .item.icon-btn a {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.control > .item.icon-btn a::before,
.control > .item.icon-btn a::after {
  font-size: 18px;
  line-height: 1;
}

/* 大屏幕下的额外优化 */
@media (min-width: 1200px) {
  .control {
    max-width: 1000px;
  }
  
  .control > .item a {
    padding: 16px 24px;
    font-size: 17px;
  }
}

/* 打印样式 */
@media print {
  .control {
    display: none !important;
  }
}

/* 修复HTML结构可能的问题 */
/* 如果HTML结构是 <div class="control clearfix"> <div class="item prev"> <a>上一页</a> </div> ... */
.control > .item > a {
  display: block;
  width: 100%;
  height: 100%;
  text-decoration: none;
}

/* 确保所有按钮高度一致 */
.control > .item {
  display: flex;
  align-items: stretch;
}

.control > .item > a {
  display: flex;
  align-items: center;
  justify-content: center;
}

/* 文字截断处理 */
.control > .item > a {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* 响应式文字大小 */
@media (max-width: 480px) {
  .control > .item > a {
    font-size: 14px;
    padding: 10px 12px;
  }
}

/* 触摸设备优化 */
@media (hover: none) and (pointer: coarse) {
  .control > .item > a {
    min-height: 44px; /* 最小触摸目标尺寸 */
    padding: 12px 16px;
  }
  
  .control > .item > a:active {
    transform: scale(0.98);
    transition: transform 0.1s ease;
  }
}

/* 加载状态 */
.control > .item.loading a {
  position: relative;
  color: transparent !important;
}

.control > .item.loading a::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 20px;
  height: 20px;
  margin: -10px 0 0 -10px;
  border: 2px solid rgba(255, 255, 255, 0.3);
  border-top-color: white;
  border-radius: 50%;
  animation: button-spinner 0.8s linear infinite;
}

@keyframes button-spinner {
  to { transform: rotate(360deg); }
}

/* ====== 新增：portal-nav导航栏居中优化 ====== */
/* 基础样式保持不变 */
.portal-nav {
  background-color: #fff;
  padding: 12px;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  border-radius: 12px;
  margin: 16px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  display: flex;
  flex-wrap: wrap;
  justify-content: center; /* 保持居中 */
}

.portal-nav > .item a {
  display: block;
  text-decoration: none;
  color: inherit;
}

.portal-nav > .item {
  width: 25%;
  text-align: center;
  margin: 8px 0 16px 0;
  box-sizing: border-box;
  padding: 0 8px;
}

/* 保持原有图标样式 */
.portal-nav > .item i[class^="icon-"] {
  display: block;
  width: 48px;
  height: 48px;
  margin: 0 auto;
  background-size: cover;
  background-repeat: no-repeat;
  border-radius: 50%;
  background-color: #e8f0fe;
  padding: 12px;
}

.portal-nav > .item .title {
  font-size: 14px;
  margin-top: 8px;
  color: #202124;
  font-weight: 500;
}

/* 图片样式保持不变 */
.portal-nav > .item img.item_cate {
  width: 48px;
  height: 48px;
  margin: 0 auto;
  border-radius: 50%;
  background-color: #e8f0fe;
  padding: 10px;
  object-fit: contain;
  display: block;
  transition: all 0.3s ease;
}

/* 悬停效果 */
.portal-nav > .item a:hover img.item_cate {
  transform: translateY(-3px);
  box-shadow: 0 6px 12px rgba(26, 115, 232, 0.2);
  background-color: #1a73e8;
}

.portal-nav > .item a:hover .title {
  color: #1a73e8;
}

/* ====== 电脑端优化：居中显示 ====== */
@media (min-width: 769px) {
  .portal-nav {
    max-width: 800px; /* 限制最大宽度 */
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 20px;
    justify-content: center; /* 强制居中 */
    gap: 0; /* 清除间隙，使用padding控制 */
  }
  
  .portal-nav > .item {
    width: auto !important; /* 不固定宽度 */
    flex: 0 0 auto; /* 不伸缩 */
    margin: 0 !important;
    padding: 0 20px; /* 左右间距 */
  }
  
  .portal-nav > .item img.item_cate {
    width: 60px; /* 电脑端稍微大一点 */
    height: 60px;
    padding: 12px;
  }
  
  .portal-nav > .item .title {
    font-size: 15px;
    margin-top: 10px;
    white-space: nowrap; /* 防止文字换行 */
  }
  
  /* 如果只有4个item，每个占25% */
  .portal-nav > .item:nth-child(1):nth-last-child(4),
  .portal-nav > .item:nth-child(2):nth-last-child(3),
  .portal-nav > .item:nth-child(3):nth-last-child(2),
  .portal-nav > .item:nth-child(4):nth-last-child(1) {
    flex: 1;
    max-width: 25%;
  }
}

/* ====== 大屏幕优化 ====== */
@media (min-width: 1024px) {
  .portal-nav {
    max-width: 1000px;
  }
  
  .portal-nav > .item {
    padding: 0 24px;
  }
  
  .portal-nav > .item img.item_cate {
    width: 64px;
    height: 64px;
  }
  
  .portal-nav > .item .title {
    font-size: 16px;
  }
}

/* ====== 超大屏幕优化 ====== */
@media (min-width: 1200px) {
  .portal-nav {
    max-width: 1200px;
  }
  
  .portal-nav > .item {
    padding: 0 30px;
  }
  
  .portal-nav > .item img.item_cate {
    width: 72px;
    height: 72px;
  }
}

/* ====== 平板端优化 ====== */
@media (min-width: 481px) and (max-width: 768px) {
  .portal-nav {
    margin: 16px 12px;
    padding: 16px;
  }
  
  .portal-nav > .item {
    width: 50% !important; /* 平板端两列 */
    margin-bottom: 20px !important;
    padding: 0 10px;
  }
  
  .portal-nav > .item img.item_cate {
    width: 56px;
    height: 56px;
  }
  
  .portal-nav > .item .title {
    font-size: 14px;
  }
}

/* ====== 手机端保持不变 ====== */
@media (max-width: 480px) {
  .portal-nav {
    margin: 16px 12px;
    padding: 12px;
  }
  
  .portal-nav > .item {
    width: 48% !important; /* 手机端两列 */
    margin-bottom: 16px !important;
    padding: 0 5px;
  }
  
  .portal-nav > .item img.item_cate {
    width: 48px;
    height: 48px;
  }
  
  .portal-nav > .item .title {
    font-size: 13px;
    margin-top: 6px;
  }
}

/* ====== 特殊情况处理：item数量不同时的布局 ====== */
/* 3个item时的布局 */
.portal-nav > .item:nth-child(1):nth-last-child(3),
.portal-nav > .item:nth-child(2):nth-last-child(2),
.portal-nav > .item:nth-child(3):nth-last-child(1) {
  /* 在电脑端，3个item时每个占33.33% */
}

@media (min-width: 769px) {
  .portal-nav > .item:nth-child(1):nth-last-child(3),
  .portal-nav > .item:nth-child(2):nth-last-child(2),
  .portal-nav > .item:nth-child(3):nth-last-child(1) {
    flex: 1;
    max-width: 33.33%;
  }
  
  /* 5个item时的布局 */
  .portal-nav > .item:nth-child(1):nth-last-child(5),
  .portal-nav > .item:nth-child(2):nth-last-child(4),
  .portal-nav > .item:nth-child(3):nth-last-child(3),
  .portal-nav > .item:nth-child(4):nth-last-child(2),
  .portal-nav > .item:nth-child(5):nth-last-child(1) {
    flex: 1;
    max-width: 20%;
  }
  
  /* 6个item时的布局 */
  .portal-nav > .item:nth-child(1):nth-last-child(6),
  .portal-nav > .item:nth-child(2):nth-last-child(5),
  .portal-nav > .item:nth-child(3):nth-last-child(4),
  .portal-nav > .item:nth-child(4):nth-last-child(3),
  .portal-nav > .item:nth-child(5):nth-last-child(2),
  .portal-nav > .item:nth-child(6):nth-last-child(1) {
    flex: 1;
    max-width: 16.666%;
  }
}

/* ====== 确保居中布局的核心样式 ====== */
/* 强制居中容器 */
.portal-nav.center-mode {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  flex-wrap: wrap !important;
}

/* 清除可能影响居中的浮动 */
.portal-nav > .item {
  float: none !important;
  display: inline-block !important;
  vertical-align: top !important;
}

/* 兼容旧版浏览器 */
.portal-nav {
  text-align: center; /* 备用居中方案 */
}

.portal-nav > .item {
  display: inline-block;
  vertical-align: top;
}

/* ====== 动画效果增强 ====== */
.portal-nav > .item {
  transition: transform 0.3s ease;
}

.portal-nav > .item:hover {
  transform: translateY(-5px);
}

/* ====== 打印样式优化 ====== */
@media print {
  .portal-nav {
    display: none !important;
  }
}

/* ====== 触摸设备优化 ====== */
@media (hover: none) and (pointer: coarse) {
  .portal-nav > .item {
    min-height: 100px; /* 增大触摸区域 */
  }
  
  .portal-nav > .item a {
    padding: 10px 0;
  }
  
  .portal-nav > .item a:active img.item_cate {
    transform: scale(0.95);
  }
}

/* ====== 无障碍支持 ====== */
.portal-nav > .item a:focus {
  outline: 2px solid #1a73e8;
  outline-offset: 4px;
  border-radius: 8px;
}

.portal-nav > .item a:focus img.item_cate {
  box-shadow: 0 0 0 3px rgba(26, 115, 232, 0.3);
}

/* ====== 修复可能的冲突 ====== */
/* 确保没有其他样式干扰 */
.portal-nav * {
  box-sizing: border-box;
}

/* 清除可能的外部浮动影响 */
.portal-nav::before,
.portal-nav::after {
  content: "";
  display: table;
  clear: both;
}

/* ====== 手机端专用优化：一行两个数据 ====== */

/* 通用手机端优化 - 针对所有手机设备 */
@media (max-width: 768px) {
  /* 1. 主列表区域优化 - 改为两列布局 */
  .imgBox .col_3_1,
  .imgBox .col_3_2,
  .imgBox .col_2 {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px !important;
  }
  
  /* 2. 列表项尺寸调整 */
  .imgBox li {
    width: 100% !important;
    margin: 0 !important;
    padding: 12px !important;
    float: none !important;
    display: block !important;
  }
  
  /* 3. 图片容器优化 */
  .imgBox li .ImgA {
    position: relative;
    overflow: hidden;
    border-radius: 8px;
    background: #f8f9fa;
    height: 180px;
  }
  
  .imgBox li .ImgA img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
  }
  
  /* 4. 文字信息优化 */
  .imgBox li .txtA {
    font-size: 14px;
    font-weight: 500;
    color: #202124;
    margin-top: 8px;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    height: 2.8em;
    text-align: center;
  }
  
  .imgBox li .info {
    font-size: 12px;
    color: #5f6368;
    margin-top: 4px;
    text-align: center;
  }
  
  /* 5. 分类标签优化 - 改为两列 */
  #tx {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 10px !important;
  }
  
  /* 6. AC盒子优化 - 改为两列 */
  .ac-box > .list {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px !important;
  }
  
  .ac-box > .list .item {
    width: 100% !important;
    flex: none !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  
  /* 7. 广告区域优化 */
  .ad1 {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px !important;
  }
  
  .ad1 li {
    width: 100% !important;
    margin: 0 !important;
  }
  
  /* 8. 推荐漫画优化 */
  .wxnewslistp {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px !important;
  }
  
  .wxnewslistp li {
    width: 100% !important;
    margin: 0 !important;
  }
  
  /* 9. 清除浮动影响 */
  .imgBox::after,
  .ac-box > .list::after,
  .wxnewslistp::after {
    content: "";
    display: table;
    clear: both;
  }
  
  /* 10. 触摸优化 */
  .imgBox li,
  .ac-box > .list .item a,
  .wxnewslistp li {
    min-height: 44px; /* 最小触摸目标尺寸 */
  }
}

/* ====== 小屏手机优化 (iPhone SE, 小屏安卓机) ====== */
@media (max-width: 375px) {
  /* 更紧凑的布局 */
  .imgBox .col_3_1,
  .imgBox .col_3_2,
  .imgBox .col_2 {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px !important;
  }
  
  /* 减少内边距 */
  .imgBox li {
    padding: 8px !important;
  }
  
  /* 图片高度调整 */
  .imgBox li .ImgA {
    height: 160px;
  }
  
  /* 字体大小调整 */
  .imgBox li .txtA {
    font-size: 13px;
    height: 2.6em;
  }
  
  .imgBox li .info {
    font-size: 11px;
  }
}

/* ====== 横屏模式优化 ====== */
@media (max-width: 768px) and (orientation: landscape) {
  /* 横屏时显示3列 */
  .imgBox .col_3_1,
  .imgBox .col_3_2,
  .imgBox .col_2 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
  
  /* 分类标签横屏优化 */
  #tx {
    grid-template-columns: repeat(3, 1fr) !important;
  }
  
  /* AC盒子横屏优化 */
  .ac-box > .list {
    grid-template-columns: repeat(3, 1fr) !important;
  }
  
  /* 图片高度调整 */
  .imgBox li .ImgA {
    height: 150px;
  }
}

/* ====== 专门针对iOS设备的优化 ====== */
@supports (-webkit-touch-callout: none) {
  /* iOS Safari 专属优化 */
  @media (max-width: 768px) {
    .imgBox li,
    .ac-box > .list .item a,
    .wxnewslistp li {
      -webkit-tap-highlight-color: rgba(26, 115, 232, 0.1);
    }
    
    /* iOS 滚动优化 */
    .imgBox,
    .ac-box > .list,
    .wxnewslistp {
      -webkit-overflow-scrolling: touch;
    }
    
    /* iOS 点击反馈 */
    .imgBox li:active,
    .ac-box > .list .item a:active,
    .wxnewslistp li:active {
      opacity: 0.8;
    }
    
    /* iOS 安全区域支持 */
    body {
      padding-left: env(safe-area-inset-left);
      padding-right: env(safe-area-inset-right);
    }
  }
}

/* ====== 专门针对安卓设备的优化 ====== */
@supports not (-webkit-touch-callout: none) {
  /* 安卓设备专属优化 */
  @media (max-width: 768px) {
    .imgBox li:active,
    .ac-box > .list .item a:active,
    .wxnewslistp li:active {
      transform: scale(0.98);
      transition: transform 0.1s ease;
    }
  }
}

/* ====== 确保兼容性的备用方案 ====== */
/* 如果Grid布局不支持，使用浮动作为备用 */
@supports not (display: grid) {
  @media (max-width: 768px) {
    .imgBox .col_3_1,
    .imgBox .col_3_2,
    .imgBox .col_2 {
      display: block !important;
    }
    
    .imgBox .col_3_1 li,
    .imgBox .col_3_2 li,
    .imgBox .col_2 li,
    .ac-box > .list .item,
    .wxnewslistp li {
      width: 48% !important;
      float: left !important;
      margin: 0 1% 12px 1% !important;
      box-sizing: border-box;
    }
    
    .imgBox .col_3_1 li:nth-child(2n+1),
    .imgBox .col_3_2 li:nth-child(2n+1),
    .imgBox .col_2 li:nth-child(2n+1),
    .ac-box > .list .item:nth-child(2n+1),
    .wxnewslistp li:nth-child(2n+1) {
      clear: left;
      margin-left: 0;
    }
    
    .imgBox .col_3_1 li:nth-child(2n),
    .imgBox .col_3_2 li:nth-child(2n),
    .imgBox .col_2 li:nth-child(2n),
    .ac-box > .list .item:nth-child(2n),
    .wxnewslistp li:nth-child(2n) {
      margin-right: 0;
    }
    
    .imgBox::after,
    .ac-box > .list::after,
    .wxnewslistp::after {
      content: "";
      display: table;
      clear: both;
    }
  }
}

/* ====== 性能优化 ====== */
@media (max-width: 768px) {
  /* 减少不必要的动画 */
  .imgBox li,
  .ac-box > .list .item,
  .wxnewslistp li {
    will-change: transform;
  }
  
  /* 图片懒加载优化 */
  .imgBox li .ImgA img {
    background: #f8f9fa;
    min-height: 180px;
  }
}

/* ====== 加载状态指示 ====== */
@media (max-width: 768px) {
  .imgBox li.loading .ImgA {
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: loading 1.5s infinite;
  }
  
  @keyframes loading {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
  }
}

/* ====== 错误状态处理 ====== */
@media (max-width: 768px) {
  .imgBox li.error .ImgA {
    position: relative;
    background: #ffebee;
  }
  
  .imgBox li.error .ImgA::after {
    content: "图片加载失败";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #d32f2f;
    font-size: 12px;
    text-align: center;
    padding: 0 8px;
  }
}

/* ====== 两列布局的特殊调整 ====== */
/* 确保两列布局时，各项内容对齐 */
@media (max-width: 768px) {
  .imgBox li {
    display: flex;
    flex-direction: column;
    height: 100%;
  }
  
  .imgBox li .ImgA {
    flex: 0 0 auto;
  }
  
  .imgBox li .txtA {
    flex: 1;
    margin-bottom: 4px;
  }
  
  .imgBox li .info {
    flex: 0 0 auto;
  }
  
  /* 确保图片比例统一 */
  .imgBox li .ImgA {
    aspect-ratio: 3/4;
  }
}

/* ====== 平板设备优化 ====== */
@media (min-width: 481px) and (max-width: 768px) {
  /* 平板端可以显示更多列 */
  .imgBox .col_3_1,
  .imgBox .col_3_2,
  .imgBox .col_2 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
  
  .ac-box > .list {
    grid-template-columns: repeat(3, 1fr) !important;
  }
  
  .wxnewslistp {
    grid-template-columns: repeat(3, 1fr) !important;
  }
  
  #tx {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

/* ====== 最终修复：确保原有样式不被覆盖 ====== */
/* 如果原有CSS中有强制一列的样式，需要覆盖 */
@media (max-width: 768px) {
  .imgBox .col_3_1 li,
  .imgBox .col_3_2 li,
  .imgBox .col_2 li {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    float: none !important;
  }
}

/* ====== 专门针对 wxnewslist 的手机端优化 ====== */

@media (max-width: 768px) {
  /* 1. 外层容器优化 */
  .wxnewslist {
    margin: 8px 12px !important;
    padding: 12px !important;
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px !important;
    background: #ffffff !important;
    border-radius: 12px !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important;
  }
  
  /* 2. 列表项重置 */
  .wxnewslist li {
    width: 100% !important;
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    border-top: none !important;
    display: block !important;
  }
  
  /* 3. 链接样式优化 */
  .wxnewslist li a {
    display: block !important;
    padding: 16px !important;
    background: #f8f9fa !important;
    border-radius: 12px !important;
    transition: all 0.3s ease !important;
    text-align: center !important;
    border: 1px solid #e8f0fe !important;
    height: 100% !important;
    box-sizing: border-box !important;
  }
  
  .wxnewslist li a:hover {
    background: #e8f0fe !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(26, 115, 232, 0.15) !important;
  }
  
  /* 4. 图片样式优化 */
  .wxnewslist li a img {
    width: 80px !important;
    height: 80px !important;
    float: none !important;
    margin: 0 auto 12px auto !important;
    display: block !important;
    border-radius: 8px !important;
    object-fit: cover !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
  }
  
  /* 5. 标题优化 */
  .wxnewslist li a p {
    display: block !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #202124 !important;
    margin: 0 0 6px 0 !important;
    padding: 0 !important;
    line-height: 1.4 !important;
    height: 2.8em !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    white-space: normal !important;
  }
  
  /* 6. 更新信息优化 */
  .wxnewslist li a i {
    display: block !important;
    font-size: 12px !important;
    color: #5f6368 !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.4 !important;
    font-style: normal !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }
  
  /* 7. 清除原有布局样式 */
  .wxnewslist li:first-child {
    border-top: none !important;
  }
  
  /* 8. 触摸优化 */
  .wxnewslist li a {
    min-height: 44px !important;
    -webkit-tap-highlight-color: rgba(26, 115, 232, 0.1) !important;
  }
}

/* ====== 小屏手机优化 ====== */
@media (max-width: 375px) {
  .wxnewslist {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px !important;
    padding: 8px !important;
  }
  
  .wxnewslist li a {
    padding: 12px !important;
  }
  
  .wxnewslist li a img {
    width: 70px !important;
    height: 70px !important;
    margin-bottom: 8px !important;
  }
  
  .wxnewslist li a p {
    font-size: 13px !important;
    height: 2.6em !important;
  }
  
  .wxnewslist li a i {
    font-size: 11px !important;
  }
}

/* ====== 横屏模式优化 ====== */
@media (max-width: 768px) and (orientation: landscape) {
  .wxnewslist {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 16px !important;
  }
  
  .wxnewslist li a img {
    width: 70px !important;
    height: 70px !important;
  }
}

/* ====== 平板设备优化 ====== */
@media (min-width: 481px) and (max-width: 768px) {
  .wxnewslist {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 16px !important;
    padding: 16px !important;
  }
  
  .wxnewslist li a {
    padding: 20px !important;
  }
  
  .wxnewslist li a img {
    width: 90px !important;
    height: 90px !important;
    margin-bottom: 16px !important;
  }
  
  .wxnewslist li a p {
    font-size: 15px !important;
  }
  
  .wxnewslist li a i {
    font-size: 13px !important;
  }
}

/* ====== 如果没有Grid支持，使用浮动布局 ====== */
@supports not (display: grid) {
  @media (max-width: 768px) {
    .wxnewslist {
      display: block !important;
      padding: 12px !important;
    }
    
    .wxnewslist li {
      width: 48% !important;
      float: left !important;
      margin: 0 1% 12px 1% !important;
      box-sizing: border-box !important;
    }
    
    .wxnewslist li:nth-child(2n+1) {
      clear: left !important;
      margin-left: 0 !important;
    }
    
    .wxnewslist li:nth-child(2n) {
      margin-right: 0 !important;
    }
    
    .wxnewslist::after {
      content: "" !important;
      display: table !important;
      clear: both !important;
    }
  }
}

/* ====== 确保原有样式被完全覆盖 ====== */
/* 这些样式会覆盖原有的一行一个布局 */
@media (max-width: 768px) {
  /* 覆盖原有的浮动布局 */
  .wxnewslist li {
    float: none !important;
    display: block !important;
  }
  
  /* 覆盖原有的flex布局 */
  .wxnewslist li {
    display: block !important;
    flex: none !important;
  }
  
  /* 覆盖原有的边距和内边距 */
  .wxnewslist li {
    padding: 0 !important;
    margin: 0 !important;
  }
  
  /* 覆盖原有的flex gap */
  .wxnewslist li {
    gap: 0 !important;
  }
}

/* ====== 动画效果优化 ====== */
@media (max-width: 768px) {
  .wxnewslist li a {
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    will-change: transform, box-shadow !important;
  }
  
  /* 点击效果 */
  .wxnewslist li a:active {
    transform: scale(0.98) !important;
  }
}

/* ====== 加载状态 ====== */
@media (max-width: 768px) {
  .wxnewslist li.loading a img {
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%) !important;
    background-size: 200% 100% !important;
    animation: loading 1.5s infinite !important;
  }
}

/* ====== 暗色模式适配（可选） ====== */
@media (prefers-color-scheme: dark) and (max-width: 768px) {
  .wxnewslist {
    background: #292a2d !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
  }
  
  .wxnewslist li a {
    background: #3c4043 !important;
    border-color: #5f6368 !important;
  }
  
  .wxnewslist li a:hover {
    background: #4d5054 !important;
  }
  
  .wxnewslist li a p {
    color: #e8eaed !important;
  }
  
  .wxnewslist li a i {
    color: #9aa0a6 !important;
  }
  
  .wxnewslist li a img {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
  }
}

/* ====== 添加一些视觉增强 ====== */
@media (max-width: 768px) {
  /* 添加悬停效果 */
  .wxnewslist li a:hover img {
    transform: scale(1.05) !important;
  }
  
  /* 添加焦点样式 */
  .wxnewslist li a:focus {
    outline: 2px solid #1a73e8 !important;
    outline-offset: 2px !important;
  }
  
  /* 添加卡片阴影效果 */
  .wxnewslist li a {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important;
  }
  
  .wxnewslist li a:hover {
    box-shadow: 0 6px 16px rgba(26, 115, 232, 0.15) !important;
  }
}

/* ====== 针对iOS Safari的优化 ====== */
@supports (-webkit-touch-callout: none) {
  @media (max-width: 768px) {
    .wxnewslist li a {
      -webkit-tap-highlight-color: transparent !important;
    }
    
    .wxnewslist {
      -webkit-overflow-scrolling: touch !important;
    }
  }
}

/* ====== 手机端分类筛选按钮优化 ====== */

@media (max-width: 768px) {
  /* 1. 外层容器优化 */
  .cate-selector {
    padding: 16px 12px !important;
    margin: 0 12px !important;
    border-radius: 12px !important;
    background: #ffffff !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08) !important;
  }
  
  /* 2. 标题优化 */
  .cate-selector .cate-title {
    padding-bottom: 16px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    color: #202124 !important;
    text-align: center !important;
  }
  
  /* 3. 列表容器优化 - 改为四列布局 */
  .cate-selector .cate-list {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 8px !important;
    margin-bottom: 16px !important;
    padding: 0 !important;
  }
  
  /* 4. 清除浮动 */
  .cate-selector .cate-list.clearfix {
    display: grid !important;
    float: none !important;
  }
  
  /* 5. 按钮样式完全重写 */
  .cate-selector .cate-item {
    width: 100% !important;
    float: none !important;
    padding: 0 !important;
    margin: 0 !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    background: #ffffff !important;
    border: 1px solid #e0e0e0 !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important;
  }
  
  /* 6. 按钮链接样式 */
  .cate-selector .cate-item a {
    display: block !important;
    padding: 10px 4px !important;
    font-size: 12px !important;
    color: #5f6368 !important;
    text-align: center !important;
    line-height: 1.3 !important;
    font-weight: 500 !important;
    transition: all 0.3s ease !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
  
  /* 7. 选中状态优化 */
  .cate-selector .cate-item.active {
    background: linear-gradient(135deg, #1a73e8, #4285f4) !important;
    border-color: #1a73e8 !important;
    box-shadow: 0 2px 6px rgba(26, 115, 232, 0.2) !important;
  }
  
  .cate-selector .cate-item.active a {
    color: #ffffff !important;
    font-weight: 600 !important;
  }
  
  /* 8. 悬停效果 */
  .cate-selector .cate-item:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12) !important;
    border-color: #1a73e8 !important;
  }
  
  .cate-selector .cate-item:hover a {
    color: #1a73e8 !important;
  }
  
  .cate-selector .cate-item.active:hover {
    box-shadow: 0 4px 12px rgba(26, 115, 232, 0.3) !important;
  }
  
  /* 9. 隐藏的项目 */
  .cate-selector .cate-item.item-hide {
    display: none !important;
  }
  
  /* 10. 展开按钮特殊样式 */
  .cate-selector .cate-item.show-all {
    grid-column: 1 / -1 !important; /* 横跨所有列 */
    margin-top: 8px !important;
    background: linear-gradient(135deg, #f8f9fa, #e8f0fe) !important;
    border: 1px dashed #1a73e8 !important;
  }
  
  .cate-selector .cate-item.show-all a {
    color: #1a73e8 !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    padding: 12px !important;
  }
  
  .cate-selector .cate-item.show-all:hover {
    background: linear-gradient(135deg, #e8f0fe, #d2e3fc) !important;
  }
  
  /* 11. 分割线优化 */
  .cate-selector hr {
    margin: 20px 0 !important;
    border: none !important;
    border-top: 1px solid #e0e0e0 !important;
    opacity: 0.6 !important;
  }
  
  /* 12. 触摸优化 */
  .cate-selector .cate-item a {
    min-height: 44px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
  
  /* 13. 点击效果 */
  .cate-selector .cate-item:active {
    transform: scale(0.98) !important;
  }
}

/* ====== 小屏手机优化 ====== */
@media (max-width: 375px) {
  .cate-selector {
    padding: 12px 8px !important;
    margin: 0 8px !important;
  }
  
  .cate-selector .cate-list {
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 6px !important;
  }
  
  .cate-selector .cate-item a {
    font-size: 11px !important;
    padding: 8px 2px !important;
    min-height: 40px !important;
  }
  
  .cate-selector .cate-title {
    font-size: 15px !important;
    padding-bottom: 12px !important;
  }
  
  .cate-selector .cate-item.show-all a {
    font-size: 12px !important;
    padding: 10px !important;
  }
  
  .cate-selector hr {
    margin: 16px 0 !important;
  }
}

/* ====== 横屏模式优化 ====== */
@media (max-width: 768px) and (orientation: landscape) {
  .cate-selector .cate-list {
    grid-template-columns: repeat(6, 1fr) !important;
    gap: 10px !important;
  }
  
  .cate-selector .cate-item a {
    font-size: 13px !important;
    padding: 12px 4px !important;
  }
}

/* ====== 平板设备优化 ====== */
@media (min-width: 481px) and (max-width: 768px) {
  .cate-selector .cate-list {
    grid-template-columns: repeat(5, 1fr) !important;
    gap: 10px !important;
  }
  
  .cate-selector .cate-item a {
    font-size: 13px !important;
    padding: 12px 6px !important;
    min-height: 48px !important;
  }
  
  .cate-selector {
    padding: 20px 16px !important;
  }
}

/* ====== 如果没有Grid支持，使用浮动布局 ====== */
@supports not (display: grid) {
  @media (max-width: 768px) {
    .cate-selector .cate-list {
      display: block !important;
    }
    
    .cate-selector .cate-item {
      width: 23% !important; /* 四列布局：100% / 4 = 25%，减去边距 */
      float: left !important;
      margin: 0 1% 8px 1% !important;
      box-sizing: border-box !important;
    }
    
    .cate-selector .cate-item:nth-child(4n+1) {
      clear: left !important;
      margin-left: 0 !important;
    }
    
    .cate-selector .cate-item:nth-child(4n) {
      margin-right: 0 !important;
    }
    
    .cate-selector .cate-item.show-all {
      width: 100% !important;
      float: none !important;
      margin: 8px 0 0 0 !important;
      clear: both !important;
    }
    
    .cate-selector .cate-list::after {
      content: "" !important;
      display: table !important;
      clear: both !important;
    }
  }
}

/* ====== 动画效果增强 ====== */
@media (max-width: 768px) {
  .cate-selector .cate-item {
    will-change: transform, box-shadow !important;
  }
  
  /* 添加微妙的缩放动画 */
  @keyframes buttonPulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.02); }
    100% { transform: scale(1); }
  }
  
  .cate-selector .cate-item.active {
    animation: buttonPulse 2s infinite ease-in-out !important;
  }
}

/* ====== iOS Safari 优化 ====== */
@supports (-webkit-touch-callout: none) {
  @media (max-width: 768px) {
    .cate-selector .cate-item a {
      -webkit-tap-highlight-color: rgba(26, 115, 232, 0.1) !important;
    }
  }
}

/* ====== 安卓设备优化 ====== */
@supports not (-webkit-touch-callout: none) {
  @media (max-width: 768px) {
    .cate-selector .cate-item:active {
      transform: scale(0.95) !important;
      transition: transform 0.1s ease !important;
    }
  }
}

/* ====== 字母和短文本的特殊处理 ====== */
@media (max-width: 768px) {
  /* 单个字母按钮（如A、B、C） */
  .cate-selector .cate-item a[href*="A__"],
  .cate-selector .cate-item a[href*="B__"],
  .cate-selector .cate-item a[href*="C__"],
  .cate-selector .cate-item a[href*="D__"],
  .cate-selector .cate-item a[href*="E__"],
  .cate-selector .cate-item a[href*="F__"],
  .cate-selector .cate-item a[href*="G__"],
  .cate-selector .cate-item a[href*="H__"],
  .cate-selector .cate-item a[href*="I__"],
  .cate-selector .cate-item a[href*="J__"],
  .cate-selector .cate-item a[href*="K__"],
  .cate-selector .cate-item a[href*="L__"],
  .cate-selector .cate-item a[href*="M__"],
  .cate-selector .cate-item a[href*="N__"],
  .cate-selector .cate-item a[href*="O__"],
  .cate-selector .cate-item a[href*="P__"],
  .cate-selector .cate-item a[href*="Q__"],
  .cate-selector .cate-item a[href*="R__"],
  .cate-selector .cate-item a[href*="S__"],
  .cate-selector .cate-item a[href*="T__"],
  .cate-selector .cate-item a[href*="U__"],
  .cate-selector .cate-item a[href*="V__"],
  .cate-selector .cate-item a[href*="W__"],
  .cate-selector .cate-item a[href*="X__"],
  .cate-selector .cate-item a[href*="Y__"],
  .cate-selector .cate-item a[href*="Z__"] {
    font-size: 14px !important;
    font-weight: 700 !important;
  }
  
  /* 地区按钮（日本、大陆等） */
  .cate-selector .cate-item a[href*="日本"],
  .cate-selector .cate-item a[href*="大陆"],
  .cate-selector .cate-item a[href*="香港"],
  .cate-selector .cate-item a[href*="台湾"],
  .cate-selector .cate-item a[href*="欧美"],
  .cate-selector .cate-item a[href*="韩国"],
  .cate-selector .cate-item a[href*="其他"] {
    font-size: 12px !important;
  }
  
  /* 进度按钮（少年、少女等） */
  .cate-selector .cate-item a[href*="少年"],
  .cate-selector .cate-item a[href*="少女"],
  .cate-selector .cate-item a[href*="青年"],
  .cate-selector .cate-item a[href*="儿童"],
  .cate-selector .cate-item a[href*="韩国"] {
    font-size: 12px !important;
  }
}

/* ====== 确保完全覆盖原有样式 ====== */
@media (max-width: 768px) {
  /* 覆盖原有的浮动布局 */
  .cate-selector .cate-item {
    float: none !important;
  }
  
  /* 覆盖原有的边距 */
  .cate-selector .cate-item {
    margin-left: 0 !important;
    margin-bottom: 0 !important;
  }
  
  /* 覆盖原有的圆角样式 */
  .cate-selector .cate-item {
    border-radius: 8px !important;
  }
  
  /* 覆盖原有的边框 */
  .cate-selector .cate-item {
    border: 1px solid #e0e0e0 !important;
  }
  
  /* 覆盖原有的背景色 */
  .cate-selector .cate-item {
    background: #ffffff !important;
  }
  
  .cate-selector .cate-item.active {
    background: linear-gradient(135deg, #1a73e8, #4285f4) !important;
  }
}

/* ====== 暗色模式适配（可选） ====== */
@media (prefers-color-scheme: dark) and (max-width: 768px) {
  .cate-selector {
    background: #292a2d !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.3) !important;
  }
  
  .cate-selector .cate-title {
    color: #e8eaed !important;
  }
  
  .cate-selector .cate-item {
    background: #3c4043 !important;
    border-color: #5f6368 !important;
  }
  
  .cate-selector .cate-item a {
    color: #e8eaed !important;
  }
  
  .cate-selector .cate-item:hover {
    border-color: #8ab4f8 !important;
  }
  
  .cate-selector .cate-item:hover a {
    color: #8ab4f8 !important;
  }
  
  .cate-selector .cate-item.active {
    background: linear-gradient(135deg, #1a73e8, #4285f4) !important;
    border-color: #8ab4f8 !important;
  }
  
  .cate-selector .cate-item.active a {
    color: #ffffff !important;
  }
  
  .cate-selector .cate-item.show-all {
    background: linear-gradient(135deg, #3c4043, #4d5054) !important;
    border-color: #8ab4f8 !important;
  }
  
  .cate-selector .cate-item.show-all a {
    color: #8ab4f8 !important;
  }
  
  .cate-selector .cate-item.show-all:hover {
    background: linear-gradient(135deg, #4d5054, #5f6368) !important;
  }
  
  .cate-selector hr {
    border-top-color: #5f6368 !important;
  }
}

/* ====== 修复展开功能 - 手机端分类筛选按钮优化 ====== */

@media (max-width: 768px) {
  /* 1. 外层容器优化 */
  .cate-selector {
    padding: 16px 12px !important;
    margin: 0 12px !important;
    border-radius: 12px !important;
    background: #ffffff !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08) !important;
  }
  
  /* 2. 标题优化 */
  .cate-selector .cate-title {
    padding-bottom: 16px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    color: #202124 !important;
    text-align: center !important;
  }
  
  /* 3. 列表容器优化 - 改为四列布局 */
  .cate-selector .cate-list {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 8px !important;
    margin-bottom: 16px !important;
    padding: 0 !important;
  }
  
  /* 4. 清除浮动 */
  .cate-selector .cate-list.clearfix {
    display: grid !important;
    float: none !important;
  }
  
  /* 5. 按钮样式完全重写 */
  .cate-selector .cate-item {
    width: 100% !important;
    float: none !important;
    padding: 0 !important;
    margin: 0 !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    background: #ffffff !important;
    border: 1px solid #e0e0e0 !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important;
  }
  
  /* 6. 按钮链接样式 */
  .cate-selector .cate-item a {
    display: block !important;
    padding: 10px 4px !important;
    font-size: 12px !important;
    color: #5f6368 !important;
    text-align: center !important;
    line-height: 1.3 !important;
    font-weight: 500 !important;
    transition: all 0.3s ease !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
  
  /* 7. 选中状态优化 */
  .cate-selector .cate-item.active {
    background: linear-gradient(135deg, #1a73e8, #4285f4) !important;
    border-color: #1a73e8 !important;
    box-shadow: 0 2px 6px rgba(26, 115, 232, 0.2) !important;
  }
  
  .cate-selector .cate-item.active a {
    color: #ffffff !important;
    font-weight: 600 !important;
  }
  
  /* 8. 悬停效果 */
  .cate-selector .cate-item:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12) !important;
    border-color: #1a73e8 !important;
  }
  
  .cate-selector .cate-item:hover a {
    color: #1a73e8 !important;
  }
  
  .cate-selector .cate-item.active:hover {
    box-shadow: 0 4px 12px rgba(26, 115, 232, 0.3) !important;
  }
  
  /* 9. 隐藏的项目 - 初始状态隐藏，但可以显示 */
  .cate-selector .cate-item.item-hide {
    display: none !important;
  }
  
  /* 10. 当列表展开时，显示所有隐藏项目 */
  .cate-selector .cate-list.expanded .cate-item.item-hide {
    display: block !important;
    animation: fadeIn 0.3s ease !important;
  }
  
  @keyframes fadeIn {
    from { opacity: 0; transform: translateY(-5px); }
    to { opacity: 1; transform: translateY(0); }
  }
  
  /* 11. 展开按钮特殊样式 */
  .cate-selector .cate-item.show-all {
    grid-column: 1 / -1 !important; /* 横跨所有列 */
    margin-top: 8px !important;
    background: linear-gradient(135deg, #f8f9fa, #e8f0fe) !important;
    border: 1px dashed #1a73e8 !important;
    cursor: pointer !important;
  }
  
  .cate-selector .cate-item.show-all a {
    color: #1a73e8 !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    padding: 12px !important;
    pointer-events: none !important; /* 让点击事件传递到li元素 */
  }
  
  .cate-selector .cate-item.show-all:hover {
    background: linear-gradient(135deg, #e8f0fe, #d2e3fc) !important;
  }
  
  /* 12. 展开按钮的展开状态 */
  .cate-selector .cate-item.show-all.expanded a::after {
    content: "收起↑" !important;
  }
  
  .cate-selector .cate-item.show-all:not(.expanded) a::after {
    content: "展开↓" !important;
  }
  
  /* 13. 分割线优化 */
  .cate-selector hr {
    margin: 20px 0 !important;
    border: none !important;
    border-top: 1px solid #e0e0e0 !important;
    opacity: 0.6 !important;
  }
  
  /* 14. 触摸优化 */
  .cate-selector .cate-item a {
    min-height: 44px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
  
  /* 15. 点击效果 */
  .cate-selector .cate-item:active {
    transform: scale(0.98) !important;
  }
}

/* ====== 小屏手机优化 ====== */
@media (max-width: 375px) {
  .cate-selector {
    padding: 12px 8px !important;
    margin: 0 8px !important;
  }
  
  .cate-selector .cate-list {
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 6px !important;
  }
  
  .cate-selector .cate-item a {
    font-size: 11px !important;
    padding: 8px 2px !important;
    min-height: 40px !important;
  }
  
  .cate-selector .cate-title {
    font-size: 15px !important;
    padding-bottom: 12px !important;
  }
  
  .cate-selector .cate-item.show-all a {
    font-size: 12px !important;
    padding: 10px !important;
  }
  
  .cate-selector hr {
    margin: 16px 0 !important;
  }
}

/* ====== 横屏模式优化 ====== */
@media (max-width: 768px) and (orientation: landscape) {
  .cate-selector .cate-list {
    grid-template-columns: repeat(6, 1fr) !important;
    gap: 10px !important;
  }
  
  .cate-selector .cate-item a {
    font-size: 13px !important;
    padding: 12px 4px !important;
  }
}

/* ====== 平板设备优化 ====== */
@media (min-width: 481px) and (max-width: 768px) {
  .cate-selector .cate-list {
    grid-template-columns: repeat(5, 1fr) !important;
    gap: 10px !important;
  }
  
  .cate-selector .cate-item a {
    font-size: 13px !important;
    padding: 12px 6px !important;
    min-height: 48px !important;
  }
  
  .cate-selector {
    padding: 20px 16px !important;
  }
}

/* ====== 兼容性优化 ====== */
@supports not (display: grid) {
  @media (max-width: 768px) {
    .cate-selector .cate-list {
      display: block !important;
    }
    
    .cate-selector .cate-item {
      width: 23% !important;
      float: left !important;
      margin: 0 1% 8px 1% !important;
      box-sizing: border-box !important;
    }
    
    .cate-selector .cate-item.show-all {
      width: 100% !important;
      float: none !important;
      margin: 8px 0 0 0 !important;
    }
    
    .cate-selector .cate-list.expanded .cate-item.item-hide {
      display: block !important;
    }
    
    .cate-selector .cate-list::after {
      content: "" !important;
      display: table !important;
      clear: both !important;
    }
  }
}