body {
  background: #f3f6fb;
}

#app {
  background: transparent;
}

/* 366la 品牌 Logo */
.header .logo.logo-366la {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 450px;
  height: 260px;
  margin-left: 12px;
  text-decoration: none;
}

.header .logo.logo-366la img {
  display: block;
  max-width: 100%;
  max-height: 58px;
  object-fit: contain;
}

/* 将 CDN 样式中的图片资源指向本地 images 目录 */
.header .search-container .logo-engine .engine-arrow .icon,
.header .search-container .logo-engine .engine-arrow-down .icon {
  background-image: url(../images/arrow-down.609ff4dd.png);
}

.header .search-container .logo-engine .sogou {
  display: none;
}

.header .search-container .logo-engine .baidu {
  background-image: url(../images/baidu.png);
}

.header .search-container .logo-engine .google {
  background-image: url(../images/google.png);
}

.header .search-container .logo-engine .bing {
  background-image: url(../images/bing.png);
}

.header .search-container .logo-engine .ai {
  background-image: url(../images/ai.png);
}

.header .search-container .logo-engine .deepseek {
  background-image: url(../images/deepseek.png);
}

.header .search-container .logo-engine .soso {
  background-image: url(../images/soso.6bebeff7.png);
}

.header .search-container {
  position: relative;
}

.header .search-container .search-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 78px;
  min-width: 78px;
  white-space: nowrap;
}

.header .search-container .hotrank-btn {
  margin-left: -18px;
  margin-right: 8px;
}

.header .search-container .rank-list {
  display: none;
  position: absolute;
  z-index: 30;
  top: 50px;
  left: 168px;
  width: 360px;
  padding: 14px 16px 12px;
  border: 1px solid #e3e8f2;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 10px 30px rgba(31, 45, 61, 0.12);
}

.header .search-container .rank-list .title {
  margin-bottom: 8px;
}

.header .search-container .rank-list .search-hot-title {
  width: auto;
  height: auto;
  background: none;
  color: #333;
  font-size: 16px;
  font-weight: 600;
  line-height: 1;
}

.header .search-container .rank-list ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.header .search-container .rank-list li {
  height: 30px;
  line-height: 30px;
}

.header .search-container .rank-list a {
  display: block;
  overflow: hidden;
  color: #333;
  text-decoration: none;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.header .search-container .rank-list a:hover {
  color: #205aef;
}

.header .search-container .hotrank-btn .hotrank,
.trending .main-list .title .logo,
.trending .main-list.selected-list .title .logo {
  background-image: url(../images/2x_sprite.4c7b09f5.png);
}

.main > .sidebar {
  margin-top: -44px;
  padding-top: 0;
}

.sidebar #qb-pc-repeat-purchase {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

.trending .main-list .title .hot-title,
.trending .main-list.selected-list .title .hot-title {
  width: auto;
  height: auto;
  background: none;
  color: #333;
  font-size: 16px;
  font-weight: 600;
  line-height: 1;
}

.trending .main-list .title .refresh-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  margin-left: 8px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: #7d8795;
  cursor: pointer;
  font-size: 17px;
  line-height: 1;
}

.trending .main-list .title .refresh-icon::before {
  content: "\21bb";
  display: block;
  transform: translateY(-1px);
}

.trending .main-list .title .refresh-icon:hover {
  background: #eef3ff;
  color: #205aef;
}

.trending .main-list .title .refresh-icon.is-refreshing {
  animation: hot-refresh-rotate 0.8s linear infinite;
  pointer-events: none;
}

.trending .main-list.is-hot-loading ul {
  opacity: 0.38;
  transition: opacity 0.15s ease;
}

.trending .main-list.is-hot-loading ul::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 26px;
  height: 26px;
  margin: -13px 0 0 -13px;
  border: 3px solid #d8e3ff;
  border-top-color: #205aef;
  border-radius: 50%;
  animation: hot-refresh-rotate 0.8s linear infinite;
}

.trending .main-list ul {
  position: relative;
}

@keyframes hot-refresh-rotate {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

.sidebar .coolsite.mini-size .expand-btn .expand-icon,
.sidebar .coolsite.mini-size .fold-btn .fold-icon,
.trending.mini-size .main-list .expand-btn .expand-icon,
.trending.mini-size.expand-list .fold-btn .fold-icon,
.expand-list .main-list .fold-btn .fold-icon,
.header .search-container .logo-engine .menu .arrows:after,
.sidebar .coolsite ul .expand-btn .expand-icon,
.sidebar .coolsite ul .fold-btn .fold-icon,
.sidebar .coolsite ul li:after,
.trending .main-list .expand-btn .expand-icon,
.header .search-container .logo-engine .menu .arrows-down:after,
.pdf-tools .pdf-header .pdf-more:after,
.sidebar .coolsite ul li.curr:after,
.header .search-container .hotrank-btn .arrow,
.header .weather-container .email .list .arrow,
.header .weather-container .email .list .menu:before,
.banner-adv #ninebanner-close .close-icon,
.banner-adv-new #ninebanner-close .close-icon {
  background-image: url(../images/css_sprites.5a658e84.png);
}

.sidebar .news .slider .prev:hover,
.sidebar .news .slider .prev,
.sidebar .news .slider .next:hover,
.sidebar .news .slider .next,
.pdf-tools .pdf-items .pdf-tool1:before,
.pdf-tools .pdf-items .pdf-tool2:before,
.pdf-tools .pdf-items .pdf-tool3:before,
.pdf-tools .pdf-items .pdf-tool4:before,
.pdf-tools .pdf-items .pdf-tool5:before,
.pdf-tools .pdf-items .pdf-tool6:before,
.top1:before, .top2:before, .top3:before, .top4:before, .top5:before,
.top6:before, .top7:before, .top8:before, .top9:before, .top10:before,
.top11:before, .top12:before, .top13:before, .top14:before, .top15:before,
.top16:before, .top17:before, .top18:before, .top19:before, .top20:before,
.top21:before, .top22:before, .top23:before, .top24:before, .top25:before,
.top26:before, .top27:before, .top28:before, .top29:before, .top30:before,
.top0:before {
  background-image: url(../images/css_sprites.5a658e84.png);
}

.gotop {
  background-image: url(../images/gotop.png);
}

.la-bottom-promo {
  width: 888px;
  box-sizing: border-box;
  margin: 8px 0;
  padding: 14px 16px;
  border: 0.5px solid rgba(3, 23, 77, 0.1);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 4px 8px rgba(3, 23, 77, 0.04);
}

.la-bottom-promo .promo-strip-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
}

.la-bottom-promo .promo-strip-title {
  color: #242424;
  font-size: 15px;
  font-weight: 700;
}

.la-bottom-promo .ad-label {
  display: inline-flex;
  align-items: center;
  height: 16px;
  padding: 0 5px;
  border: 1px solid #d8dde8;
  border-radius: 3px;
  color: #8f97a6;
  font-size: 11px;
  line-height: 16px;
}

.la-bottom-promo .promo-more {
  margin-left: auto;
  color: #8f97a6;
  font-size: 12px;
  text-decoration: none;
}

.la-bottom-promo .promo-more:hover {
  color: #205aef;
}

.la-bottom-promo .promo-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 12px;
}

.la-bottom-promo .promo-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 0;
  padding: 8px 4px;
  border-radius: 8px;
  color: #242424;
  text-decoration: none;
  transition: background 0.15s;
}

.la-bottom-promo .promo-card:hover {
  background: #f6f7fa;
}

.la-bottom-promo .promo-icon-wrap {
  position: relative;
  margin-bottom: 6px;
}

.la-bottom-promo .promo-ad-img {
  display: block;
  width: 48px;
  height: 48px;
  border-radius: 10px;
  object-fit: cover;
}

.la-bottom-promo .promo-badge {
  position: absolute;
  top: -5px;
  right: -8px;
  z-index: 1;
  padding: 1px 5px;
  border-radius: 4px;
  background: #ef4444;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  line-height: 14px;
}

.la-bottom-promo .promo-name {
  max-width: 100%;
  overflow: hidden;
  color: #333;
  font-size: 13px;
  font-weight: 600;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 1240px) {
  .la-bottom-promo {
    width: 100%;
  }

  .la-bottom-promo .promo-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
