/* ===== 整体白底 ===== */
body {
    background-color: #ffffff !important;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
}

/* ===== 侧边栏重写 ===== */
.sidebar-menu {
    background: #ffffff !important;
    border-right: 1px solid #f0f0f5 !important;
}
.sidebar-menu .logo-env {
    border-bottom: 1px solid #f0f0f5 !important;
    padding: 16px 14px !important;
}

/* 一级菜单整体 */
#main-menu {
    padding: 8px 10px 100px 10px !important;
}

#main-menu > li {
    margin-bottom: 3px !important;
    list-style: none !important;
}

/* 一级菜单链接 */
#main-menu > li > a {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 9px 12px !important;
    border-radius: 10px !important;
    color: #444 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    transition: all 0.15s ease !important;
    border-bottom: none !important;
    position: relative !important;
}

/* 图标 */
#main-menu > li > a i {
    font-size: 15px !important;
    color: #6366f1 !important;
    width: 20px !important;
    text-align: center !important;
    flex-shrink: 0 !important;
    transition: color 0.15s ease !important;
}

/* 分类名称 */
#main-menu > li > a .title {
    flex: 1 !important;
    color: #444 !important;
    transition: color 0.15s ease !important;
}

/* 展开子菜单的箭头 */
#main-menu > li.has-sub > a::after {
    content: '›' !important;
    font-size: 16px !important;
    color: #bbb !important;
    font-weight: 400 !important;
    margin-left: auto !important;
    transition: transform 0.2s ease, color 0.15s ease !important;
}

#main-menu > li.has-sub.expanded > a::after {
    transform: rotate(90deg) !important;
    color: #6366f1 !important;
}

/* 悬停 */
#main-menu > li > a:hover {
    background: #f5f4ff !important;
    border-bottom: none !important;
}

#main-menu > li > a:hover i {
    color: #4338ca !important;
}

#main-menu > li > a:hover .title {
    color: #4338ca !important;
}

/* 当前激活项 */
#main-menu > li.active > a {
    background: linear-gradient(135deg, rgba(99,102,241,0.12) 0%, rgba(139,92,246,0.08) 100%) !important;
    border-bottom: none !important;
}

#main-menu > li.active > a i {
    color: #6366f1 !important;
}

#main-menu > li.active > a .title {
    color: #4338ca !important;
    font-weight: 600 !important;
}

/* 左侧紫色竖条 */
#main-menu > li.active > a::before {
    content: '' !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 3px !important;
    height: 60% !important;
    background: #6366f1 !important;
    border-radius: 0 3px 3px 0 !important;
}

/* 子菜单区域 */
#main-menu li ul {
    margin: 2px 0 4px 30px !important;
    padding: 0 !important;
    background: #fafafa !important;
    border-radius: 10px !important;
    border: 1px solid #f0f0f8 !important;
    overflow: hidden !important;
}

/* 子菜单项 */
#main-menu li ul li {
    list-style: none !important;
    margin: 0 !important;
    border-bottom: 1px solid #f5f5fa !important;
}

#main-menu li ul li:last-child {
    border-bottom: none !important;
}

/* 子菜单链接 */
#main-menu li ul li a {
    display: block !important;
    padding: 7px 14px !important;
    font-size: 12.5px !important;
    color: #666 !important;
    font-weight: 400 !important;
    text-decoration: none !important;
    transition: all 0.12s ease !important;
    border-bottom: none !important;
}

#main-menu li ul li a:hover {
    color: #6366f1 !important;
    background: #f0efff !important;
    padding-left: 18px !important;
}

#main-menu li ul li.active > a {
    color: #6366f1 !important;
    background: #f0efff !important;
    font-weight: 600 !important;
    border-bottom: none !important;
}

/* 提交网站按钮区域 */
#main-menu li.submit-tag {
    margin-top: 20px !important;
    padding: 0 12px !important;
}

/* ===== 分类标题更醒目 ===== */
h4.text-gray {
    color: #333333 !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    padding-bottom: 8px !important;
    border-bottom: 2px solid #6366f1 !important;
    display: inline-block !important;
    margin-bottom: 16px !important;
}

/* ===== 卡片优化 ===== */
.box2 {
    border: 1px solid #e8e8e8 !important;
    border-radius: 12px !important;
    padding: 12px 14px !important;
    background: #ffffff !important;
    box-shadow: 0 1px 2px rgba(0,0,0,0.04) !important;
}
.box2:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08) !important;
    border-color: #d0d0d0 !important;
}

/* ===== 图标更大 ===== */
.xe-comment-entry img {
    width: 48px !important;
    height: 48px !important;
    border-radius: 10px !important;
}

/* ===== 文字层级优化 ===== */
.xe-comment strong {
    font-size: 14px !important;
    color: #333 !important;
    font-weight: 600 !important;
}
.xe-comment p {
    font-size: 12px !important;
    color: #999 !important;
    margin-top: 2px !important;
}

/* ===== 卡片间距更紧凑 ===== */
.col-md-3 {
    padding-left: 8px !important;
    padding-right: 8px !important;
}
.row {
    margin-left: -8px !important;
    margin-right: -8px !important;
}

/* ===== 搜索框美化 + 隐藏其他引擎 ===== */
.s-type,
.search-group,
.s-type-list {
    display: none !important;
}
.s-search {
    display: flex !important;
    justify-content: center;
    padding: 20px 0 !important;
}
#super-search-fm {
    display: flex !important;
    align-items: center;
    background: #ffffff !important;
    border: 1.5px solid #e8e8e8 !important;
    border-radius: 50px !important;
    padding: 6px 6px 6px 24px !important;
    box-shadow: 0 4px 20px rgba(0,0,0,0.08) !important;
    width: 100% !important;
    max-width: 580px !important;
    margin: 0 auto !important;
    transition: all 0.25s ease !important;
}
#super-search-fm:focus-within {
    border-color: #6366f1 !important;
    box-shadow: 0 4px 24px rgba(99,102,241,0.18) !important;
}
#search-text {
    flex: 1 !important;
    border: none !important;
    background: transparent !important;
    font-size: 16px !important;
    color: #333 !important;
    padding: 12px 0 !important;
    outline: none !important;
    box-shadow: none !important;
}
#search-text::placeholder {
    color: #bbb !important;
}
#super-search-fm button {
    background: #4f46e5 !important;
    color: #fff !important;
    border: none !important;
    border-radius: 50px !important;
    width: 48px !important;
    height: 48px !important;
    font-size: 18px !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: background 0.2s ease !important;
    padding: 0 !important;
    flex-shrink: 0 !important;
}
#super-search-fm button:hover {
    background: #4338ca !important;
}

/* ===== Logo区域优化（更大更靠右） ===== */
.logo-env {
    padding: 20px 15px 20px 15px !important;
    min-height: 80px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
}


.logo-expanded img,
.logo-collapsed img {
    height: 60px !important;
    width: auto !important;
    max-width: 220px !important;
}
.logo a {
    font-size: 24px !important;
    font-weight: 700 !important;
    color: #333 !important;
    letter-spacing: -0.5px !important;
}

/* ===== 侧边栏无分隔线 ===== */
.main-menu li {
    border-bottom: none !important;
}
.main-menu li.active > a::before {
    content: '' !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 3px !important;
    height: 20px !important;
    background: #6366f1 !important;
    border-radius: 0 3px 3px 0 !important;
}
.main-menu a {
    position: relative !important;
    transition: all 0.2s ease !important;
}
/* ===== 顶部导航菜单 ===== */
.top-nav-container {
    display: flex !important;
    align-items: center !important;
    flex: 1 !important;
    justify-content: center !important;
    margin: 0 20px !important;
}
.top-nav-list {
    display: flex !important;
    align-items: center !important;
    gap: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}
.top-nav-list li { list-style: none !important; }
.top-nav-list li a {
    display: flex !important;
    align-items: center !important;
    padding: 0 14px !important;
    height: 50px !important;
    color: #555 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    transition: color 0.2s ease, background 0.2s ease !important;
    white-space: nowrap !important;
}
.top-nav-list li a:hover { color: #6366f1 !important; background: transparent !important; }

/* 移动端汉堡按钮 */
.top-nav-mobile-toggle { display: none !important; }
.top-nav-hamburger {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    gap: 5px !important;
    width: 36px !important;
    height: 36px !important;
    padding: 6px !important;
    cursor: pointer !important;
}
.top-nav-hamburger span {
    display: block !important;
    width: 100% !important;
    height: 2px !important;
    background: #555 !important;
    border-radius: 2px !important;
    transition: all 0.3s ease !important;
}
.top-nav-hamburger.active span:nth-child(1) { transform: translateY(7px) rotate(45deg) !important; }
.top-nav-hamburger.active span:nth-child(2) { opacity: 0 !important; }
.top-nav-hamburger.active span:nth-child(3) { transform: translateY(-7px) rotate(-45deg) !important; }

/* 移动端下拉菜单 */
.top-nav-mobile-menu { display: none !important; position: absolute !important; top: 100% !important; left: 0 !important; right: 0 !important; background: #fff !important; border-bottom: 1px solid #eee !important; box-shadow: 0 4px 16px rgba(0,0,0,0.08) !important; z-index: 9999 !important; padding: 8px 0 !important; }
.top-nav-mobile-menu.open { display: block !important; }
.top-nav-mobile-menu li a { display: block !important; padding: 10px 20px !important; color: #555 !important; font-size: 14px !important; text-decoration: none !important; border-bottom: 1px solid #f5f5f5 !important; }
.top-nav-mobile-menu li a:hover { color: #6366f1 !important; background: #f9f9f9 !important; }

@media (max-width: 768px) {
    .top-nav-container { justify-content: flex-end !important; }
    .top-nav-list { display: none !important; }
    .top-nav-mobile-toggle { display: flex !important; align-items: center !important; }
}
/* ===== 搜索区英雄标题 ===== */
.s-search {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
}
.search-hero {
    text-align: center !important;
    padding: 20px 0 24px 0 !important;
    width: 100% !important;
}
.search-hero-title {
    font-size: 36px !important;
    font-weight: 800 !important;
    color: #1a1a2e !important;
    letter-spacing: -1px !important;
    margin: 0 0 8px 0 !important;
    line-height: 1.2 !important;
}
.search-hero-sub {
    font-size: 16px !important;
    color: #888 !important;
    margin: 0 !important;
    font-weight: 400 !important;
    letter-spacing: 0.3px !important;
}

/* ===== 详情页：柔和渐变背景 ===== */
.single-sites .main-content.page {
    background: linear-gradient(135deg, #fef9f6 0%, #f5f0ff 50%, #f0f7ff 100%) !important;
    position: relative !important;
    overflow: hidden !important;
}

/* 装饰性渐变光斑 */
.single-sites .main-content.page::before {
    content: '' !important;
    position: absolute !important;
    top: -100px !important;
    right: -100px !important;
    width: 400px !important;
    height: 400px !important;
    background: radial-gradient(circle, rgba(236, 72, 153, 0.12) 0%, transparent 70%) !important;
    pointer-events: none !important;
}

.single-sites .main-content.page::after {
    content: '' !important;
    position: absolute !important;
    bottom: -50px !important;
    left: -50px !important;
    width: 300px !important;
    height: 300px !important;
    background: radial-gradient(circle, rgba(99, 102, 241, 0.1) 0%, transparent 70%) !important;
    pointer-events: none !important;
}

/* ===== 详情页头部整体布局：左右结构 ===== */
.single-sites .panel-body > .row {
    align-items: center !important;
    position: relative !important;
    z-index: 1 !important;
}

/* 左栏：撑满高度，flex居中 */
.single-sites .panel-body > .row > .col-sm-4,
.single-sites .panel-body > .row > .col-lg-3 {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* siteico 区域：完全居中 */
.siteico-area {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    min-height: unset !important;
}

/* Logo：大圆形容器，logo居中显示在圆形内，无背景无阴影 */
.siteico {
    width: 100px !important;
    height: 100px !important;
    border-radius: 50% !important;
    overflow: hidden !important;
    position: relative !important;
    background: transparent !important;
    box-shadow: none !important;
    flex-shrink: 0 !important;
}

.siteico:before {
    display: none !important;
}

.siteico:hover {
    transform: scale(1.08) !important;
}

.siteico .blur-layer {
    display: none !important;
}

.siteico .img-cover {
    position: absolute !important;
    top: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100px !important;
    height: 100px !important;
    margin: auto !important;
    border-radius: 50% !important;
    object-fit: contain !important;
    padding: 0 !important;
    background: #fff !important;
}

/* 覆盖 black 主题的背景和阴影 */
.black .siteico {
    background: transparent !important;
    box-shadow: none !important;
}

.black .siteico .img-cover {
    background: #fff !important;
}

@keyframes rotate {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* 内容区：左对齐，层次分明 */
.site-body {
    padding: 0 !important;
}

/* 分类标签：彩色 pill，更小更精致 */
.site-body .btn-cat {
    display: inline-flex !important;
    align-items: center !important;
    padding: 4px 12px !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    letter-spacing: 0.3px !important;
    color: #7c3aed !important;
    background: rgba(124, 58, 237, 0.08) !important;
    border: 1px solid rgba(124, 58, 237, 0.15) !important;
    border-radius: 20px !important;
    text-decoration: none !important;
    margin: 0 6px 8px 0 !important;
    transition: all 0.2s ease !important;
}

.site-body .btn-cat:hover {
    background: #7c3aed !important;
    color: #ffffff !important;
    border-color: #7c3aed !important;
    transform: translateY(-1px) !important;
}

/* 站点名称：更大更醒目 */
.site-body .site-name {
    font-size: 28px !important;
    font-weight: 700 !important;
    color: #1a1a2e !important;
    line-height: 1.2 !important;
    margin: 12px 0 8px 0 !important;
    letter-spacing: -0.5px !important;
}

/* 描述文字：柔和灰色 */
.site-body p {
    font-size: 15px !important;
    color: #64748b !important;
    line-height: 1.6 !important;
    margin: 0 0 20px 0 !important;
    max-width: 480px !important;
}

/* 按钮区：水平排列 */
.site-go {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    flex-wrap: wrap !important;
}

/* 主按钮：渐变背景 */
.site-go .btn-arrow {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 12px 28px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    color: #ffffff !important;
    background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%) !important;
    border: none !important;
    border-radius: 12px !important;
    text-decoration: none !important;
    box-shadow: 0 4px 16px rgba(99, 102, 241, 0.35) !important;
    transition: all 0.25s ease !important;
    letter-spacing: 0.2px !important;
}

.site-go .btn-arrow:hover {
    background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%) !important;
    box-shadow: 0 6px 24px rgba(79, 70, 229, 0.45) !important;
    transform: translateY(-2px) !important;
    color: #ffffff !important;
}

.site-go .btn-arrow i {
    font-size: 14px !important;
    transition: transform 0.2s ease !important;
}

.site-go .btn-arrow:hover i {
    transform: translateX(4px) !important;
}

/* 二维码按钮：浅色幽灵 */
.site-go .btn-arrow[data-toggle="tooltip"] {
    background: rgba(255, 255, 255, 0.7) !important;
    color: #6366f1 !important;
    border: 1.5px solid rgba(99, 102, 241, 0.2) !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.05) !important;
    backdrop-filter: blur(8px) !important;
}

.site-go .btn-arrow[data-toggle="tooltip"]:hover {
    background: rgba(255, 255, 255, 0.95) !important;
    border-color: #6366f1 !important;
    box-shadow: 0 4px 16px rgba(99, 102, 241, 0.2) !important;
    transform: translateY(-2px) !important;
}

/* 内容区与相关信息之间的分割线 */
.single-sites .panel-body .border-top {
    border-color: rgba(0,0,0,0.06) !important;
    margin-top: 40px !important;
}

/* 详情页面板：毛玻璃效果 */
.single-sites .panel-default {
    background: rgba(255, 255, 255, 0.85) !important;
    backdrop-filter: blur(20px) !important;
    border: 1px solid rgba(255, 255, 255, 0.5) !important;
    border-radius: 24px !important;
    box-shadow: 0 8px 32px rgba(0,0,0,0.06) !important;
    overflow: hidden !important;
}

.single-sites .panel-body {
    padding: 40px !important;
}

/* ===== 响应式：平板 ===== */
@media (max-width: 991px) {
    .single-sites .panel-body {
        padding: 28px !important;
    }
    .siteico-area {
        min-height: 140px !important;
        padding: 16px !important;
    }
    .site-body .site-name {
        font-size: 22px !important;
    }
}

/* ===== 响应式：手机 ===== */
@media (max-width: 767px) {
    .single-sites .main-content.page::before {
        width: 200px !important;
        height: 200px !important;
        top: -60px !important;
        right: -60px !important;
    }
    .single-sites .main-content.page::after {
        width: 160px !important;
        height: 160px !important;
        bottom: -30px !important;
        left: -30px !important;
    }
    .single-sites .panel-default {
        border-radius: 16px !important;
    }
    .single-sites .panel-body {
        padding: 20px !important;
    }
    /* 手机端：logo 和内容上下排列，居中 */
    .single-sites .panel-body > .row {
        flex-direction: column !important;
        align-items: center !important;
        text-align: center !important;
    }
    .siteico-area {
        padding: 0 0 16px 0 !important;
        justify-content: center !important;
    }
    .site-body .btn-cat {
        margin: 0 4px 8px 4px !important;
    }
    .site-body .site-name {
        font-size: 20px !important;
        text-align: center !important;
    }
    .site-body p {
        text-align: center !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
    .site-go {
        justify-content: center !important;
    }
}

/* ===== more+ 按钮 ===== */
.wb-title-row {
    padding: 8px 0;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
}

.btn-move {
    float: right !important;
    display: inline-flex !important;
    align-items: center !important;
    margin-left: 12px !important;
    gap: 4px !important;
    padding: 5px 14px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #6366f1 !important;
    background: #f0f0ff !important;
    border: 1.5px solid #c7c9f8 !important;
    border-radius: 20px !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
}

.btn-move::after {
    content: '→' !important;
    font-size: 12px !important;
}

.btn-move:hover {
    color: #fff !important;
    background: #6366f1 !important;
    border-color: #6366f1 !important;
    transform: translateX(2px) !important;
}

.btn-move:hover::after {
    transform: translateX(3px) !important;
}

/* ===== 隐藏详情页右侧 WebStack 推广图 ===== */
.single-sites .ad-right {
    display: none !important;
}

/* ===== AI Categories 下拉菜单 ===== */

/* 父级菜单项：相对定位 + 伪元素三角箭头 */
.top-nav-list li.menu-item-has-children {
    position: relative !important;
}

.top-nav-list li.menu-item-has-children > a::after {
    content: '' !important;
    display: inline-block !important;
    width: 0 !important;
    height: 0 !important;
    margin-left: 5px !important;
    vertical-align: middle !important;
    border-left: 4px solid transparent !important;
    border-right: 4px solid transparent !important;
    border-top: 5px solid #6366f1 !important;
    transition: transform 0.2s ease !important;
}

/* 下拉面板默认隐藏 */
.top-nav-list .sub-menu {
    display: none !important;
    position: absolute !important;
    top: 100% !important;
    left: 50% !important;
    transform: translateX(-50%) translateY(8px) !important;
    min-width: 680px !important;
    background: #ffffff !important;
    border: 1px solid #e8e8ee !important;
    border-radius: 14px !important;
    box-shadow: 0 8px 32px rgba(99, 102, 241, 0.15), 0 2px 8px rgba(0,0,0,0.06) !important;
    padding: 16px 20px !important;
    z-index: 9999 !important;
    /* 多列网格：6列 */
    column-count: 6 !important;
    column-gap: 8px !important;
    /* 防止列断行 */
    -webkit-column-break-inside: avoid !important;
    break-inside: avoid !important;
    /* 动画 */
    opacity: 0 !important;
    pointer-events: none !important;
    transition: opacity 0.2s ease, transform 0.2s ease !important;
}

/* 悬停显示 */
.top-nav-list li.menu-item-has-children:hover > .sub-menu,
.top-nav-list li.menu-item-has-children:focus-within > .sub-menu {
    display: block !important;
    opacity: 1 !important;
    transform: translateX(-50%) translateY(0) !important;
    pointer-events: auto !important;
}

/* 子项 <li>：强制不换列，放在块里 */
.top-nav-list .sub-menu li {
    break-inside: avoid !important;
    -webkit-column-break-inside: avoid !important;
    page-break-inside: avoid !important;
    display: block !important;
    margin-bottom: 0 !important;
    list-style: none !important;
}

/* 子项链接 */
.top-nav-list .sub-menu li a {
    display: block !important;
    padding: 7px 10px !important;
    font-size: 12.5px !important;
    font-weight: 500 !important;
    color: #555 !important;
    text-decoration: none !important;
    border-radius: 8px !important;
    transition: all 0.15s ease !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    line-height: 1.3 !important;
}

.top-nav-list .sub-menu li a:hover {
    color: #ffffff !important;
    background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%) !important;
    transform: translateX(2px) !important;
    box-shadow: 0 2px 8px rgba(99, 102, 241, 0.3) !important;
}

/* 分类名称：按类别分组标题（可选，如果你想加分组标题的话） */
/* 如果子分类太多想加分组标题，可以加 .sub-menu-title */

/* ===== 响应式：平板（2列） ===== */
@media (max-width: 1100px) {
    .top-nav-list .sub-menu {
        min-width: 520px !important;
        column-count: 4 !important;
    }
}

/* ===== 响应式：手机 ===== */
@media (max-width: 768px) {
    /* 子菜单在移动端改成垂直列表，不分列 */
    .top-nav-list .sub-menu {
        display: none !important;
        position: static !important;
        transform: none !important;
        min-width: unset !important;
        column-count: unset !important;
        background: #f9f9ff !important;
        border: none !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        padding: 0 12px !important;
        opacity: 1 !important;
        pointer-events: auto !important;
    }

    .top-nav-list li.menu-item-has-children:hover > .sub-menu,
    .top-nav-list li.menu-item-has-children:focus-within > .sub-menu {
        display: block !important;
        transform: none !important;
    }

    .top-nav-list .sub-menu li a {
        padding: 10px 16px !important;
        font-size: 13.5px !important;
        border-bottom: 1px solid #f0f0f8 !important;
    }

    .top-nav-list .sub-menu li:last-child a {
        border-bottom: none !important;
    }
}

/* ===== 分类页描述区域：富文本样式 ===== */
.term-description {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    color: #374151;
    line-height: 1.75;
    margin: 12px 0 20px 0;
    padding: 16px 20px;
    background: linear-gradient(135deg, rgba(99, 102, 241, 0.04) 0%, rgba(139, 92, 246, 0.02) 100%);
    border-radius: 12px;
    border: 1px solid rgba(99, 102, 241, 0.08);
}

/* 底部描述区域：与卡片分界线 */
.term-description-bottom {
    margin-top: 40px !important;
    margin-bottom: 30px !important;
    border-top: 2px solid rgba(99, 102, 241, 0.2) !important;
    border-bottom: none !important;
    border-left: none !important;
    border-right: none !important;
    background: linear-gradient(135deg, rgba(99, 102, 241, 0.02) 0%, rgba(139, 92, 246, 0.01) 100%);
    border-radius: 0 0 12px 12px !important;
    padding-top: 24px !important;
}

/* 分界线上加个装饰性渐变条 */
.term-description-bottom::before {
    content: '' !important;
    display: block !important;
    width: 60px !important;
    height: 3px !important;
    background: linear-gradient(90deg, #6366f1, #8b5cf6) !important;
    border-radius: 3px !important;
    margin-bottom: 16px !important;
}

/* h1：分类描述主标题 */
.term-description h1 {
    font-size: 22px !important;
    font-weight: 700 !important;
    color: #1a1a2e !important;
    line-height: 1.3 !important;
    margin: 0 0 14px 0 !important;
    padding-bottom: 12px !important;
    border-bottom: 2px solid #6366f1 !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}

.term-description h1::before {
    content: '' !important;
    display: inline-block !important;
    width: 5px !important;
    height: 22px !important;
    background: linear-gradient(180deg, #6366f1, #8b5cf6) !important;
    border-radius: 3px !important;
    flex-shrink: 0 !important;
}

/* h2：主标题 — 紫色下划线 + 左侧竖条 */
.term-description h2 {
    font-size: 18px !important;
    font-weight: 700 !important;
    color: #1a1a2e !important;
    line-height: 1.3 !important;
    margin: 0 0 10px 0 !important;
    padding-bottom: 8px !important;
    border-bottom: 2px solid #6366f1 !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}

.term-description h2::before {
    content: '' !important;
    display: inline-block !important;
    width: 4px !important;
    height: 18px !important;
    background: linear-gradient(180deg, #6366f1, #8b5cf6) !important;
    border-radius: 2px !important;
    flex-shrink: 0 !important;
}

/* h3：次级标题 — 左边框 + 浅紫背景 */
.term-description h3 {
    font-size: 15px !important;
    font-weight: 600 !important;
    color: #4338ca !important;
    margin: 16px 0 8px 0 !important;
    padding: 6px 12px !important;
    background: rgba(99, 102, 241, 0.06) !important;
    border-left: 3px solid #6366f1 !important;
    border-radius: 0 6px 6px 0 !important;
    line-height: 1.4 !important;
}

/* h4：三级标题 — 圆点前缀 */
.term-description h4 {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #6366f1 !important;
    margin: 14px 0 6px 0 !important;
    padding-left: 14px !important;
    position: relative !important;
    line-height: 1.4 !important;
}

.term-description h4::before {
    content: '' !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 6px !important;
    height: 6px !important;
    border-radius: 50% !important;
    background: #8b5cf6 !important;
}

/* h5, h6：更小标题 */
.term-description h5,
.term-description h6 {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #64748b !important;
    margin: 12px 0 5px 0 !important;
    line-height: 1.4 !important;
}

/* p：正文段落 */
.term-description p {
    font-size: 14px !important;
    color: #4b5563 !important;
    line-height: 1.8 !important;
    margin: 0 0 10px 0 !important;
}

.term-description p:last-child {
    margin-bottom: 0 !important;
}

/* 链接 */
.term-description a {
    color: #6366f1 !important;
    text-decoration: none !important;
    border-bottom: 1px solid rgba(99, 102, 241, 0.35) !important;
    transition: border-color 0.2s ease !important;
}

.term-description a:hover {
    border-bottom-color: #6366f1 !important;
}

/* 列表 */
.term-description ul,
.term-description ol {
    padding-left: 20px !important;
    margin: 0 0 10px 0 !important;
}

.term-description li {
    font-size: 14px !important;
    color: #4b5563 !important;
    line-height: 1.75 !important;
    margin-bottom: 5px !important;
}

.term-description li::marker {
    color: #8b5cf6 !important;
}

/* 代码 */
.term-description code {
    font-family: 'SF Mono', Monaco, Consolas, monospace !important;
    font-size: 13px !important;
    color: #7c3aed !important;
    background: rgba(124, 58, 237, 0.08) !important;
    padding: 2px 6px !important;
    border-radius: 4px !important;
    border: 1px solid rgba(124, 58, 237, 0.15) !important;
}

.term-description pre {
    background: #1e1e2e !important;
    color: #cdd6f4 !important;
    padding: 16px !important;
    border-radius: 8px !important;
    overflow-x: auto !important;
    margin: 12px 0 !important;
    font-size: 13px !important;
    line-height: 1.6 !important;
}

.term-description pre code {
    color: inherit !important;
    background: none !important;
    padding: 0 !important;
    border: none !important;
}

/* 引用 */
.term-description blockquote {
    margin: 12px 0 !important;
    padding: 12px 16px !important;
    background: rgba(99, 102, 241, 0.04) !important;
    border-left: 3px solid #6366f1 !important;
    border-radius: 0 8px 8px 0 !important;
    color: #6b7280 !important;
    font-style: italic !important;
}

.term-description blockquote p {
    margin: 0 !important;
    color: #6b7280 !important;
}

/* 图片 */
.term-description img {
    max-width: 100% !important;
    height: auto !important;
    border-radius: 8px !important;
    margin: 10px 0 !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06) !important;
}

/* 分隔线 */
.term-description hr {
    border: none !important;
    height: 2px !important;
    background: linear-gradient(90deg, transparent, rgba(99, 102, 241, 0.2), transparent) !important;
    margin: 16px 0 !important;
}

/* 表格 */
.term-description table {
    width: 100% !important;
    border-collapse: collapse !important;
    margin: 12px 0 !important;
    font-size: 13px !important;
}

.term-description th,
.term-description td {
    padding: 10px 12px !important;
    border: 1px solid #e5e7eb !important;
    text-align: left !important;
}

.term-description th {
    background: rgba(99, 102, 241, 0.06) !important;
    font-weight: 600 !important;
    color: #4338ca !important;
}

.term-description tr:hover td {
    background: rgba(99, 102, 241, 0.02) !important;
}

/* 响应式：手机端 */
@media (max-width: 767px) {
    .term-description {
        margin: 10px 0 16px 0 !important;
        padding: 14px 16px !important;
    }
    .term-description h1 {
        font-size: 18px !important;
    }
    .term-description h2 {
        font-size: 16px !important;
    }
    .term-description h3 {
        font-size: 14px !important;
    }
    .term-description h4 {
        font-size: 13px !important;
    }
    .term-description p,
    .term-description li {
        font-size: 13px !important;
    }
}

/* ===== site-desc-rich：描述区富文本样式 ===== */
.site-desc-rich h2 {
    font-size: 20px !important;
    font-weight: 700 !important;
    color: #1a1a2e !important;
    line-height: 1.3 !important;
    margin: 0 0 12px 0 !important;
    padding-bottom: 10px !important;
    border-bottom: 2px solid #6366f1 !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}

.site-desc-rich h2::before {
    content: '' !important;
    display: inline-block !important;
    width: 4px !important;
    height: 20px !important;
    background: linear-gradient(180deg, #6366f1, #8b5cf6) !important;
    border-radius: 2px !important;
    flex-shrink: 0 !important;
}

/* h3：次级标题 — 左边框 + 浅紫背景 */
.site-desc-rich h3 {
    font-size: 16px !important;
    font-weight: 600 !important;
    color: #4338ca !important;
    margin: 24px 0 8px 0 !important;
    padding: 6px 12px !important;
    background: rgba(99, 102, 241, 0.06) !important;
    border-left: 3px solid #6366f1 !important;
    border-radius: 0 8px 8px 0 !important;
    line-height: 1.4 !important;
}

/* h4：三级标题 — 圆点前缀 */
.site-desc-rich h4 {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #6366f1 !important;
    margin: 18px 0 6px 0 !important;
    padding-left: 14px !important;
    position: relative !important;
    line-height: 1.4 !important;
}

.site-desc-rich h4::before {
    content: '' !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 6px !important;
    height: 6px !important;
    border-radius: 50% !important;
    background: #8b5cf6 !important;
}

/* p：正文段落 */
.site-desc-rich p {
    font-size: 14px !important;
    color: #4b5563 !important;
    line-height: 1.8 !important;
    margin: 0 0 12px 0 !important;
}

.site-desc-rich p:last-child {
    margin-bottom: 0 !important;
}

/* 链接 */
.site-desc-rich a {
    color: #6366f1 !important;
    text-decoration: none !important;
    border-bottom: 1px solid rgba(99, 102, 241, 0.35) !important;
    transition: border-color 0.2s ease !important;
}

.site-desc-rich a:hover {
    border-bottom-color: #6366f1 !important;
}

/* 列表 */
.site-desc-rich ul,
.site-desc-rich ol {
    padding-left: 20px !important;
    margin: 0 0 12px 0 !important;
}

.site-desc-rich li {
    font-size: 14px !important;
    color: #4b5563 !important;
    line-height: 1.75 !important;
    margin-bottom: 5px !important;
}

.site-desc-rich li::marker {
    color: #8b5cf6 !important;
}

/* ===== 博客文章内容区域：富文本样式 ===== */

/* h1：文章主标题 */
.panel-body h1 {
    font-size: 28px !important;
    font-weight: 700 !important;
    color: #1a1a2e !important;
    line-height: 1.3 !important;
    margin: 32px 0 18px 0 !important;
    padding-bottom: 14px !important;
    border-bottom: 3px solid #6366f1 !important;
}

/* h2：章节标题 — 紫色下划线 + 左侧竖条 */
.panel-body h2 {
    font-size: 22px !important;
    font-weight: 700 !important;
    color: #1a1a2e !important;
    line-height: 1.35 !important;
    margin: 28px 0 14px 0 !important;
    padding-bottom: 10px !important;
    border-bottom: 2px solid #6366f1 !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}

.panel-body h2::before {
    content: '' !important;
    display: inline-block !important;
    width: 5px !important;
    height: 22px !important;
    background: linear-gradient(180deg, #6366f1, #8b5cf6) !important;
    border-radius: 3px !important;
    flex-shrink: 0 !important;
}

/* h3：次级标题 — 左边框 + 浅紫背景 */
.panel-body h3 {
    font-size: 18px !important;
    font-weight: 600 !important;
    color: #4338ca !important;
    margin: 24px 0 12px 0 !important;
    padding: 8px 16px !important;
    background: rgba(99, 102, 241, 0.06) !important;
    border-left: 4px solid #6366f1 !important;
    border-radius: 0 8px 8px 0 !important;
    line-height: 1.45 !important;
}

/* h4：三级标题 — 圆点前缀 */
.panel-body h4 {
    font-size: 16px !important;
    font-weight: 600 !important;
    color: #6366f1 !important;
    margin: 20px 0 10px 0 !important;
    padding-left: 18px !important;
    position: relative !important;
    line-height: 1.5 !important;
}

.panel-body h4::before {
    content: '' !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 8px !important;
    height: 8px !important;
    border-radius: 50% !important;
    background: #8b5cf6 !important;
}

/* h5, h6：更小标题 */
.panel-body h5,
.panel-body h6 {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #64748b !important;
    margin: 16px 0 8px 0 !important;
    line-height: 1.5 !important;
}

/* p：正文段落 */
.panel-body p {
    font-size: 15px !important;
    color: #4b5563 !important;
    line-height: 1.9 !important;
    margin: 0 0 16px 0 !important;
}

.panel-body p:last-child {
    margin-bottom: 0 !important;
}

/* 链接 */
.panel-body a {
    color: #6366f1 !important;
    text-decoration: none !important;
    border-bottom: 1px solid rgba(99, 102, 241, 0.4) !important;
    transition: all 0.2s ease !important;
    padding-bottom: 1px !important;
}

.panel-body a:hover {
    color: #4338ca !important;
    border-bottom-color: #4338ca !important;
}

/* 列表 ul */
.panel-body ul {
    padding-left: 24px !important;
    margin: 0 0 16px 0 !important;
    list-style: none !important;
}

.panel-body ul li {
    font-size: 15px !important;
    color: #4b5563 !important;
    line-height: 1.8 !important;
    margin-bottom: 8px !important;
    padding-left: 20px !important;
    position: relative !important;
}

.panel-body ul li::before {
    content: '' !important;
    position: absolute !important;
    left: 0 !important;
    top: 10px !important;
    width: 6px !important;
    height: 6px !important;
    background: #8b5cf6 !important;
    border-radius: 50% !important;
}

/* 列表 ol */
.panel-body ol {
    padding-left: 28px !important;
    margin: 0 0 16px 0 !important;
    counter-reset: list-counter !important;
}

.panel-body ol li {
    font-size: 15px !important;
    color: #4b5563 !important;
    line-height: 1.8 !important;
    margin-bottom: 8px !important;
    padding-left: 8px !important;
    position: relative !important;
    list-style: none !important;
}

.panel-body ol li::before {
    content: counter(list-counter) "." !important;
    counter-increment: list-counter !important;
    position: absolute !important;
    left: -24px !important;
    color: #6366f1 !important;
    font-weight: 600 !important;
}

/* 代码 inline */
.panel-body code {
    font-family: 'SF Mono', Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace !important;
    font-size: 13.5px !important;
    color: #7c3aed !important;
    background: rgba(124, 58, 237, 0.08) !important;
    padding: 2px 7px !important;
    border-radius: 5px !important;
    border: 1px solid rgba(124, 58, 237, 0.15) !important;
}

/* 代码块 pre */
.panel-body pre {
    background: #1e1e2e !important;
    color: #cdd6f4 !important;
    padding: 20px !important;
    border-radius: 12px !important;
    overflow-x: auto !important;
    margin: 16px 0 !important;
    font-size: 13.5px !important;
    line-height: 1.7 !important;
    border: 1px solid rgba(255, 255, 255, 0.05) !important;
}

.panel-body pre code {
    color: inherit !important;
    background: none !important;
    padding: 0 !important;
    border: none !important;
    font-size: inherit !important;
}

/* 引用 blockquote */
.panel-body blockquote {
    margin: 20px 0 !important;
    padding: 16px 20px !important;
    background: rgba(99, 102, 241, 0.04) !important;
    border-left: 4px solid #6366f1 !important;
    border-radius: 0 12px 12px 0 !important;
    color: #6b7280 !important;
    font-style: italic !important;
    position: relative !important;
}

.panel-body blockquote::before {
    content: '"' !important;
    position: absolute !important;
    top: 8px !important;
    left: 12px !important;
    font-size: 36px !important;
    color: rgba(99, 102, 241, 0.3) !important;
    font-family: Georgia, serif !important;
    line-height: 1 !important;
}

.panel-body blockquote p {
    margin: 0 0 0 20px !important;
    color: #6b7280 !important;
    font-size: 15px !important;
}

/* 图片 */
.panel-body img {
    max-width: 100% !important;
    height: auto !important;
    border-radius: 12px !important;
    margin: 16px 0 !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08) !important;
}

/* 分隔线 */
.panel-body hr {
    border: none !important;
    height: 2px !important;
    background: linear-gradient(90deg, transparent, rgba(99, 102, 241, 0.3), transparent) !important;
    margin: 28px 0 !important;
}

/* 表格 */
.panel-body table {
    width: 100% !important;
    border-collapse: collapse !important;
    margin: 16px 0 !important;
    font-size: 14px !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    border: 1px solid #e5e7eb !important;
}

.panel-body th,
.panel-body td {
    padding: 12px 16px !important;
    border: 1px solid #e5e7eb !important;
    text-align: left !important;
}

.panel-body th {
    background: rgba(99, 102, 241, 0.08) !important;
    font-weight: 600 !important;
    color: #4338ca !important;
}

.panel-body tr:hover td {
    background: rgba(99, 102, 241, 0.02) !important;
}

/* 按钮 */
.panel-body .btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 10px 20px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #ffffff !important;
    background: linear-gradient(135deg, #6366f1, #8b5cf6) !important;
    border: none !important;
    border-radius: 10px !important;
    text-decoration: none !important;
    transition: all 0.25s ease !important;
    box-shadow: 0 4px 12px rgba(99, 102, 241, 0.3) !important;
}

.panel-body .btn:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(99, 102, 241, 0.4) !important;
    color: #ffffff !important;
}

/* 响应式：手机端 */
@media (max-width: 767px) {
    .panel-body h1 { font-size: 22px !important; }
    .panel-body h2 { font-size: 18px !important; }
    .panel-body h2::before { width: 4px !important; height: 18px !important; }
    .panel-body h3 { font-size: 16px !important; }
    .panel-body h4 { font-size: 14px !important; }
    .panel-body p, .panel-body li { font-size: 14px !important; }
    .panel-body blockquote p { font-size: 14px !important; }
}

/* 响应式：手机端字号稍小 */
@media (max-width: 767px) {
    .site-desc-rich h2 {
        font-size: 17px !important;
    }
    .site-desc-rich h3 {
        font-size: 14px !important;
    }
    .site-desc-rich h4 {
        font-size: 13px !important;
    }
    .site-desc-rich p,
    .site-desc-rich li {
        font-size: 13px !important;
    }
}