body:before {
  content: '';
  position: absolute;
  top: 0 !important;
  left: 0;
  right: 0;
  width: 100%;
  height: 550px;
  background-image: url(/assets/img/blury-shape-bg-light.png);
  background-size: cover;
  z-index: -1;
}
.io-black-mode body:before {
  background-image: url(/assets/img/blury-shape-bg-dark.png);
}
.page-header {
  background: none !important;
  position: absolute;
}
.io-black-mode .page-header {
  background: rgba(44, 46, 47, 0.7) !important;
}
.url-card .max .url-img {
  width: 40px;
  height: 40px;
}
.card-body .url-img img {
  border: none !important;
}
.customize-width {
  max-width: 1900px;
}
.sidebar-nav {
  width: 220px;
}
@media (min-width: 768px) {
  .main-content {
    margin-left: 220px;
  }
  .main-content .page-header {
    left: 220px;
  }
  .header-big {
    padding-top: 80px;
  }
}
.panel-body a:not(.no-c) {
  color: #5961f9;
}
.panel-body a:not(.no-c):hover {
  color: #ee9ae5;
}
.site-detail-hero .url-img {
  width: 72px;
  height: 72px;
}
.site-detail-hero .url-img img {
  max-width: 100%;
  height: auto;
}

/* 横向子分类 Tab：原站式整片圆角色块底，宽度随 Tab 总长度；超出主栏时再占满并内部滚动（隐藏滚动条避免“细条”） */
/* 分类标题与二级 Tab 间距（贴近原站） */
.category-subtab-row {
  width: 100%;
  margin-top: 0;
}
.content-category-block .category-title-row {
  margin-bottom: 0.25rem !important;
}
.category-subtabs-inline-wrap {
  display: block;
  width: 100%;
  max-width: 100%;
}
.category-subtabs-inline-wrap .slider_menu.category-subtabs {
  display: block;
  width: fit-content;
  max-width: 100%;
}
.category-subtabs-inline-wrap .slider_menu.mini_tab.category-subtabs {
  width: fit-content !important;
  max-width: 100% !important;
}
.category-subtabs {
  min-width: 0;
}
.category-tab-pill-bar {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: stretch;
  box-sizing: border-box;
  position: relative;
  width: max-content;
  max-width: 100%;
  min-height: 32px;
  padding: 0 !important;
  border-radius: 8px;
  background-color: rgba(130, 130, 130, 0.1);
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
  -webkit-overflow-scrolling: touch;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}
.category-subtabs .category-tab-pill-bar.tab-auto-scrollbar.overflow-x-auto {
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}
.category-tab-pill-bar::-webkit-scrollbar,
.category-subtabs .category-tab-pill-bar::-webkit-scrollbar {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  background: transparent !important;
}
.io-black-mode .category-tab-pill-bar {
  background-color: rgba(255, 255, 255, 0.07);
  border: none !important;
  box-shadow: none !important;
}
/* 高度对齐原站 nav-pills：约 0.5rem × 1rem 量级 */
.category-subtabs .category-tab-pill-bar .nav-item {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: stretch;
}
.category-subtabs .category-tab-pill-bar .nav-link {
  display: flex;
  align-items: center;
  box-sizing: border-box;
  min-height: 32px;
  height: 100%;
  padding: 0 12px;
  font-size: 0.875rem;
  line-height: 1.2;
  border-radius: 6px;
  white-space: nowrap;
  background: transparent !important;
  border: none !important;
  color: #282a2d;
  transition: color 0.2s ease;
}
.category-subtabs .category-tab-pill-bar .nav-link.active {
  font-weight: 400 !important;
  background: transparent !important;
}
/* 高亮条下的链接：任意交互状态均白字（盖过 Bootstrap .nav-pills、全局 a:hover） */
.category-subtabs .category-tab-pill-bar.nav-pills .nav-link.category-subtab-pill-on,
.category-subtabs .category-tab-pill-bar.nav-pills .nav-link.category-subtab-pill-on.active,
.category-subtabs .category-tab-pill-bar .nav-link.category-subtab-pill-on:hover,
.category-subtabs .category-tab-pill-bar .nav-link.category-subtab-pill-on:focus,
.category-subtabs .category-tab-pill-bar .nav-link.category-subtab-pill-on:focus-visible,
.category-subtabs .category-tab-pill-bar .nav-link.category-subtab-pill-on:active {
  color: #fff !important;
}
.category-subtabs .category-tab-pill-bar .nav-link:focus,
.category-subtabs .category-tab-pill-bar .nav-link:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}
.io-black-mode .category-subtabs .category-tab-pill-bar .nav-link {
  color: #c6c9cf;
}
.io-black-mode .category-subtabs .category-tab-pill-bar.nav-pills .nav-link.category-subtab-pill-on,
.io-black-mode .category-subtabs .category-tab-pill-bar.nav-pills .nav-link.category-subtab-pill-on.active,
.io-black-mode .category-subtabs .category-tab-pill-bar .nav-link.category-subtab-pill-on:hover,
.io-black-mode .category-subtabs .category-tab-pill-bar .nav-link.category-subtab-pill-on:focus,
.io-black-mode .category-subtabs .category-tab-pill-bar .nav-link.category-subtab-pill-on:focus-visible,
.io-black-mode .category-subtabs .category-tab-pill-bar .nav-link.category-subtab-pill-on:active {
  color: #fff !important;
}

/* 二级菜单追踪：主题色高亮条 + 仅在高亮条下的链接为浅色字（JS: .category-subtab-pill-on） */
.category-tab-pill-bar > .tab-slider-pill {
  z-index: 1;
  bottom: auto !important;
  top: 50%;
  transform: translateY(-50%);
  height: 32px;
  min-height: 0;
  border-radius: 24px;
  background: linear-gradient(90deg, #5961f9, #8b93ff);
  box-shadow: 0 2px 8px rgba(89, 97, 249, 0.35);
  will-change: left, width;
  transition: left 0.3s cubic-bezier(0.2, 0.65, 0.4, 1),
    width 0.3s cubic-bezier(0.2, 0.65, 0.4, 1), opacity 0.15s ease;
}
.io-black-mode .category-tab-pill-bar > .tab-slider-pill {
  background: linear-gradient(90deg, #6b73ff, #8b84d4);
  box-shadow: 0 2px 8px rgba(123, 131, 255, 0.4);
}

/* 首页热门条：与分类二级 Tab 同字号，高亮条上白字且加粗（分类二级仍为常规字重） */
.hot-tools-pills.category-subtabs .category-tab-pill-bar .nav-link.category-subtab-pill-on,
.hot-tools-pills.category-subtabs .category-tab-pill-bar.nav-pills .nav-link.category-subtab-pill-on.active {
  font-weight: 700 !important;
  font-size: 0.875rem !important;
}
.io-black-mode .hot-tools-pills.category-subtabs .category-tab-pill-bar .nav-link.category-subtab-pill-on {
  font-weight: 700 !important;
}

/* 最新收录：与二级 Tab 一致字重字号 */
.latest-tools-pills.category-subtabs .category-tab-pill-bar .nav-link.category-subtab-pill-on {
  font-size: 0.875rem !important;
}

/* 热门区等：保留稍明显的滚动轨道 */
.nav-scroll-track {
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: rgba(89, 97, 249, 0.5) rgba(89, 97, 249, 0.12);
  background: linear-gradient(
    180deg,
    rgba(89, 97, 249, 0.07),
    rgba(89, 97, 249, 0.03)
  );
  border-radius: 10px;
  padding: 8px 12px 14px !important;
  border: 1px solid rgba(89, 97, 249, 0.12);
}
.nav-scroll-track::-webkit-scrollbar {
  height: 8px;
}
.nav-scroll-track::-webkit-scrollbar-track {
  background: rgba(89, 97, 249, 0.1);
  border-radius: 4px;
  margin: 0 4px;
}
.nav-scroll-track::-webkit-scrollbar-thumb {
  background: linear-gradient(
    90deg,
    rgba(89, 97, 249, 0.55),
    rgba(238, 154, 229, 0.55)
  );
  border-radius: 4px;
}
.io-black-mode .nav-scroll-track {
  background: linear-gradient(
    180deg,
    rgba(89, 97, 249, 0.14),
    rgba(89, 97, 249, 0.06)
  );
  border-color: rgba(255, 255, 255, 0.08);
}
.io-black-mode .nav-scroll-track::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.06);
}

/* Tab 下划线：随鼠标/当前项移动 */
.slider_menu.mini_tab ul.nav,
.slider_menu.mini_tab ul.menu {
  position: relative;
}
/* 热门区等：底部横条追踪（非二级菜单） */
.tab-slider-pill {
  position: absolute;
  bottom: 2px;
  left: 0;
  height: 3px;
  border-radius: 2px;
  background: linear-gradient(90deg, #5961f9, #8b93ff);
  box-shadow: 0 0 14px rgba(89, 97, 249, 0.5);
  opacity: 0;
  transition: left 0.22s ease, top 0.22s ease, width 0.22s ease,
    height 0.22s ease, opacity 0.15s ease;
  pointer-events: none;
  z-index: 3;
}
.nav-scroll-track > .tab-slider-pill {
  z-index: 3;
}
.io-black-mode .nav-scroll-track > .tab-slider-pill {
  background: linear-gradient(90deg, #7b83ff, #ee9ae5);
  box-shadow: 0 0 16px rgba(123, 131, 255, 0.45);
}

/* 首页四格推荐（原左侧 Tab + 大图区，现为固定 4 位） */
.home-featured-card {
  min-height: 140px;
}
.home-featured-bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.home-featured-placeholder {
  background: rgba(130, 130, 130, 0.12);
}
.io-black-mode .home-featured-placeholder {
  background: rgba(255, 255, 255, 0.06);
}
.home-featured-caption {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  min-height: 45%;
  padding: 10px 12px;
  display: flex;
  align-items: flex-end;
  background: linear-gradient(transparent, rgba(0, 0, 0, 0.58));
  pointer-events: none;
}
.home-featured-title {
  color: #fff;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.35;
}

/* 滚动时侧栏：须匹配 #sidebar（模板无单独 .sidebar 包裹层） */
#sidebar.sidebar-nav .sidebar-item.active > a,
#sidebar.sidebar-nav .sidebar-item.current > a,
.sidebar .sidebar-item.active > a,
.sidebar .sidebar-item.current > a,
.io-grey-mode #sidebar.sidebar-nav .sidebar-item.active > a,
.io-grey-mode #sidebar.sidebar-nav .sidebar-item.current > a {
  color: #5961f9 !important;
  background: rgba(89, 97, 249, 0.1);
  border-radius: 8px;
  font-weight: 700 !important;
}
#sidebar.sidebar-nav .sidebar-item.active > a span,
#sidebar.sidebar-nav .sidebar-item.current > a span,
#sidebar.sidebar-nav .sidebar-item.active > a i,
#sidebar.sidebar-nav .sidebar-item.current > a i,
.sidebar .sidebar-item.active > a span,
.sidebar .sidebar-item.current > a span,
.sidebar .sidebar-item.active > a i,
.sidebar .sidebar-item.current > a i {
  color: #5961f9 !important;
  font-weight: 700 !important;
}
.io-black-mode #sidebar.sidebar-nav .sidebar-item.active > a,
.io-black-mode #sidebar.sidebar-nav .sidebar-item.current > a,
.io-black-mode .sidebar .sidebar-item.active > a,
.io-black-mode .sidebar .sidebar-item.current > a {
  color: #8b93ff !important;
  background: rgba(89, 97, 249, 0.18);
  font-weight: 700 !important;
}
.io-black-mode #sidebar.sidebar-nav .sidebar-item.active > a span,
.io-black-mode #sidebar.sidebar-nav .sidebar-item.current > a span,
.io-black-mode #sidebar.sidebar-nav .sidebar-item.active > a i,
.io-black-mode #sidebar.sidebar-nav .sidebar-item.current > a i,
.io-black-mode .sidebar .sidebar-item.active > a span,
.io-black-mode .sidebar .sidebar-item.current > a span,
.io-black-mode .sidebar .sidebar-item.active > a i,
.io-black-mode .sidebar .sidebar-item.current > a i {
  color: #8b93ff !important;
  font-weight: 700 !important;
}
#sidebar.sidebar-nav .sidebar-item ul li.active > a,
.sidebar .sidebar-item ul li.active > a {
  color: #5961f9 !important;
  font-weight: 600;
}
.io-black-mode #sidebar.sidebar-nav .sidebar-item ul li.active > a,
.io-black-mode .sidebar .sidebar-item ul li.active > a {
  color: #a5acff !important;
}

/* 右下角：回到顶部在夜间模式按钮之上，始终可见 */
#footer-tools {
  flex-direction: column !important;
  align-items: center;
  z-index: 1002;
}
#go-to-up {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 0 !important;
  margin-bottom: 0.25rem !important;
  background: rgba(89, 97, 249, 0.92) !important;
  color: #fff !important;
  border: none !important;
  box-shadow: 0 2px 10px rgba(89, 97, 249, 0.35);
}
#go-to-up:hover {
  background: #4a52e0 !important;
  color: #fff !important;
}
#go-to-up .iconfont {
  font-size: 1.1rem;
}
.io-black-mode #go-to-up {
  background: rgba(123, 131, 255, 0.95) !important;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.35);
}
.io-black-mode #go-to-up:hover {
  background: #8b93ff !important;
}