/* 全局布局覆盖 */
        .flexwrapper { background: transparent !important; position: relative; }
        .index-right { margin-left: max(calc(var(--sidebar-width, 260px) + 40px), calc((100% - 1350px + var(--sidebar-width, 260px) + 40px) / 2)); margin-right: auto; max-width: 1350px; }
        @media (max-width: 1000px) { .index-right { margin-left: 0 !important; max-width: 100% !important; } }
        body.dark { background: #0b1120 !important; }

        /* ===== 数学工具核心样式 ===== */
        * { box-sizing: border-box; margin: 0; padding: 0; }
        body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; background: linear-gradient(135deg, #EAF4FC 0%, #E8F2FB 48%, #E6F0F9 100%) !important; margin: 0; }
        .flexwrapper { background: transparent !important; }
        
        .container { 
            width: 100%; 
            max-width: 1350px; 
            padding: 40px; 
            position: relative; 
            display: flex; 
            flex-direction: column; 
            align-items: flex-start; 
            margin: 0 auto; 
            z-index: 1;
        }

        /* 标题 - 改为卡通字体 */
        .header { margin-top: 60px; margin-bottom: 40px; align-self: flex-start; width: 100%; text-align: left; }
        .header h1 { 
            font-family: 'ZCOOL KuaiLe', sans-serif; 
            font-size: 2.2rem; 
            font-weight: 400; 
            color: #1e293b; 
            line-height: 1.2; 
            letter-spacing: 1px;
            display: flex;
            align-items: center;
        }
        .header h1 span { 
            font-size: 1.4rem; 
            color: #64748b; 
            font-weight: 400; 
            display: inline; 
            margin-top: 0; 
            margin-left: 12px; 
        }

        /* 主内容区：左图右卡 - 居中 */
        .main-content { 
            display: flex; 
            align-items: center; 
            justify-content: center; 
            gap: 60px; 
            margin-bottom: 30px; 
            width: 100%; 
            align-self: center; 
            padding-left: 0; 
            position: relative;
        }

        /* 左侧插画：只让狗头动，线不动 */
        .illustration { flex: 0 0 250px; position: relative; margin-top: 0; height: 250px; width: 250px; }
        .illustration .img-bg { 
            position: absolute; 
            top: 0; 
            left: 0; 
            width: 100%; 
            height: 100%; 
            object-fit: contain; 
            z-index: 0; 
            transform: translate(80px, 15px) scale(1.6); 
            opacity: 0.6; 
        }
        .illustration .img-fg { 
            position: absolute; 
            top: 0; 
            left: 0; 
            width: 100%; 
            height: 100%; 
            object-fit: contain; 
            z-index: 2; 
            transform: translate(-5px, 0) scale(0.85);
            animation: floatDecor 4s ease-in-out infinite; /* 仅狗头悬浮 */
        }

        /* 右侧卡片：加入卡通感边框和3D立体阴影 */
        .testimonial-card { 
            background-color: #ffffff; 
            border-radius: 32px; 
            padding: 0; 
            flex: 0 1 700px; 
            width: 100%; 
            max-width: 700px; 
            position: relative; 
            border: 4px solid #60a5fa;
            box-shadow: 0 8px 0 #3b82f6;
            min-width: 450px; 
            display: flex; 
            flex-direction: column; 
            overflow: visible; 
            min-height: auto; 
            margin-left: 60px; 
        }

        /* 右上角图片：像一张贴纸摇摆 */
        .card-corner-icon { 
            position: absolute; 
            top: -32px; 
            right: -8px; 
            width: 64px; 
            height: 64px; 
            background: transparent; 
            padding: 0; 
            border-radius: 8px; 
            transform: rotate(-10deg); 
            z-index: 20;
            box-shadow: none; 
            display: flex; 
            align-items: center; 
            justify-content: center; 
            animation: wiggle 3s ease-in-out infinite;
        }
        @keyframes wiggle {
            0%, 100% { transform: rotate(-10deg) scale(1); }
            50% { transform: rotate(-5deg) scale(1.1); }
        }
        .card-corner-icon img { 
            width: 100%; 
            height: 100%; 
            object-fit: contain; 
            display: block; 
            border-radius: 4px; 
            filter: drop-shadow(0 4px 4px rgba(0,0,0,0.1));
        }

        /* 模块插入区 */
        .module-insert-container iframe { scrollbar-width: none; -ms-overflow-style: none; }
        .module-insert-container iframe::-webkit-scrollbar { display: none; width: 0; height: 0; }
        .module-insert-container { 
            position: relative; 
            width: 100%; 
            height: auto; 
            min-height: 150px; 
            border: none; 
            background: transparent; 
            z-index: 1; 
            border-radius: 24px; 
            overflow: hidden; 
            display: flex;
            flex: 1; 
        }

        /* ============================================= */
        /* 底部：分类名与工具列表顶部对齐                 */
        /* ============================================= */
        .categories-container { 
            display: flex; 
            flex-direction: column; 
            gap: 24px; 
            width: 100%; 
            padding-top: 24px; 
            margin-top: 20px; 
            border-top: 3px dashed #cbd5e1;
        }
        
        /* 每一行分类 */
        .category-row {
            display: flex;
            align-items: flex-start; /* 【修改点】从 center 改为 flex-start，实现顶部对齐 */
            gap: 30px;
            width: 100%;
        }

        /* 分类名变成了彩色立体泡泡 */
        .category-card { 
            padding: 6px 24px; 
            border-radius: 40px; 
            box-shadow: 0 6px 0 rgba(0,0,0,0.15); 
            font-size: 1rem; 
            font-weight: 600; 
            color: #ffffff; 
            letter-spacing: 1px;
            white-space: nowrap; 
            line-height: 1.6;
            font-family: 'ZCOOL KuaiLe', sans-serif;
            flex-shrink: 0; /* 保证卡片不被压缩 */
        }
        .color-1 { background-color: #ff6b6b; box-shadow: 0 6px 0 #cc5555; }
        .color-2 { background-color: #4ecdc4; box-shadow: 0 6px 0 #2f9e97; }
        
        /* 右边的工具彩色小卡片 */
        .category-logos { 
            display: flex; 
            align-items: center; 
            gap: 12px; 
            flex-wrap: wrap; 
        }
        .logo-item { 
            display: flex; 
            align-items: center; 
            gap: 8px; 
            color: #475569; 
            font-weight: 600; 
            font-size: 0.95rem; 
            background: #ffffff;
            padding: 6px 16px 6px 12px;
            border-radius: 30px;
            border: 2px solid #e2e8f0;
            box-shadow: 0 4px 0 #e2e8f0;
            transition: all 0.2s ease;
        }
        .logo-item:hover { 
            transform: translateY(-3px);
            box-shadow: 0 6px 0 #cbd5e1;
        }
        .logo-icon { 
            width: 28px; 
            height: 28px; 
            background: #f1f5f9; 
            border-radius: 50%; 
            display: flex; 
            align-items: center; 
            justify-content: center; 
            font-size: 0.9rem; 
            color: #475569; 
            font-weight: 600; 
        }

        /* ===== 响应式 ===== */
        @media (max-width: 900px) {
            .main-content { flex-direction: column; align-items: center; }
            .illustration { margin-right: 0; margin-bottom: 30px; max-width: 200px; width: 200px; height: 200px; }
            .testimonial-card { min-width: 0; width: 100%; flex: 0 1 100%; max-width: 100%; margin-left: 0; }
            .categories-container { flex-direction: column; gap: 20px; }
            .category-row { flex-direction: column; align-items: flex-start; gap: 12px; }
            .category-logos { gap: 10px; justify-content: flex-start; }
            .header h1 { font-size: 1.8rem; }
            .index-right .flexwrapper::before, .index-right .flexwrapper::after { display: none; }
        }

        /* ===== 深色模式适配 ===== */
        body.dark .container { background: transparent; }
        body.dark .header h1 { color: #f1f5f9; }
        body.dark .header h1 span { color: #94a3b8; }
        body.dark .testimonial-card { background: #1e293b; border-color: #475569; box-shadow: 0 8px 0 #0f172a; }
        body.dark .categories-container { border-top-color: #334155; }
        body.dark .color-1 { background: #e15858; box-shadow: 0 6px 0 #b34141; }
        body.dark .color-2 { background: #3ba89f; box-shadow: 0 6px 0 #227d75; }
        body.dark .logo-item { background: #1e293b; border-color: #334155; box-shadow: 0 4px 0 #0f172a; color: #94a3b8; }
        body.dark .logo-item:hover { box-shadow: 0 6px 0 #020617; }
        body.dark .logo-icon { background: #334155; color: #f1f5f9; }
        body.dark .card-corner-icon img { filter: drop-shadow(0 4px 4px rgba(255,255,255,0.1)); }
    

        /* 全局布局覆盖 */
        .flexwrapper { background: transparent !important; position: relative; }
        .index-right { margin-left: max(calc(var(--sidebar-width, 260px) + 40px), calc((100% - 1350px + var(--sidebar-width, 260px) + 40px) / 2)); margin-right: auto; max-width: 1350px; }
        @media (max-width: 1000px) { .index-right { margin-left: 0 !important; max-width: 100% !important; } }
        body.dark { background: #0b1120 !important; }

        /* ===== 数学工具核心样式 ===== */
        * { box-sizing: border-box; margin: 0; padding: 0; }
        body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; background-color: #f0f5fa; margin: 0; }
        
        .container { 
            width: 100%; 
            max-width: 1350px; 
            padding: 40px; 
            position: relative; 
            display: flex; 
            flex-direction: column; 
            align-items: flex-start; 
            margin: 0 auto; 
            z-index: 1;
        }

        /* 标题 - 改为卡通字体 */
        .header { margin-top: 60px; margin-bottom: 40px; align-self: flex-start; width: 100%; text-align: left; }
        .header h1 { 
            font-family: 'ZCOOL KuaiLe', sans-serif; 
            font-size: 2.2rem; 
            font-weight: 400; 
            color: #1e293b; 
            line-height: 1.2; 
            letter-spacing: 1px;
            display: flex;
            align-items: center;
        }
        .header h1 span { 
            font-size: 1.4rem; 
            color: #64748b; 
            font-weight: 400; 
            display: inline; 
            margin-top: 0; 
            margin-left: 12px; 
        }

        /* 主内容区：左图右卡 - 居中 */
        .main-content { 
            display: flex; 
            align-items: center; 
            justify-content: center; 
            gap: 60px; 
            margin-bottom: 30px; 
            width: 100%; 
            align-self: center; 
            padding-left: 0; 
            position: relative;
        }

        /* 左侧插画：只让狗头动，线不动 */
        .illustration { flex: 0 0 250px; position: relative; margin-top: 0; height: 250px; width: 250px; }
        .illustration .img-bg { 
            position: absolute; 
            top: 0; 
            left: 0; 
            width: 100%; 
            height: 100%; 
            object-fit: contain; 
            z-index: 0; 
            transform: translate(80px, 15px) scale(1.6); 
            opacity: 0.6; 
        }
        .illustration .img-fg { 
            position: absolute; 
            top: 0; 
            left: 0; 
            width: 100%; 
            height: 100%; 
            object-fit: contain; 
            z-index: 2; 
            transform: translate(-5px, 0) scale(0.85);
            animation: floatDecor 4s ease-in-out infinite; /* 仅狗头悬浮 */
        }

        /* 右侧卡片：加入卡通感边框和3D立体阴影 */
        .testimonial-card { 
            background-color: #ffffff; 
            border-radius: 32px; 
            padding: 0; 
            flex: 0 1 700px; 
            width: 100%; 
            max-width: 700px; 
            position: relative; 
            border: 4px solid #60a5fa;
            box-shadow: 0 8px 0 #3b82f6;
            min-width: 450px; 
            display: flex; 
            flex-direction: column; 
            overflow: visible; 
            min-height: auto; 
            margin-left: 60px; 
        }

        /* 右上角图片：像一张贴纸摇摆 */
        .card-corner-icon { 
            position: absolute; 
            top: -32px; 
            right: -8px; 
            width: 64px; 
            height: 64px; 
            background: transparent; 
            padding: 0; 
            border-radius: 8px; 
            transform: rotate(-10deg); 
            z-index: 20;
            box-shadow: none; 
            display: flex; 
            align-items: center; 
            justify-content: center; 
            animation: wiggle 3s ease-in-out infinite;
        }
        @keyframes wiggle {
            0%, 100% { transform: rotate(-10deg) scale(1); }
            50% { transform: rotate(-5deg) scale(1.1); }
        }
        .card-corner-icon img { 
            width: 100%; 
            height: 100%; 
            object-fit: contain; 
            display: block; 
            border-radius: 4px; 
            filter: drop-shadow(0 4px 4px rgba(0,0,0,0.1));
        }

        /* 模块插入区 */
        .module-insert-container iframe { scrollbar-width: none; -ms-overflow-style: none; }
        .module-insert-container iframe::-webkit-scrollbar { display: none; width: 0; height: 0; }
        .module-insert-container { 
            position: relative; 
            width: 100%; 
            height: auto; 
            min-height: 150px; 
            border: none; 
            background: transparent; 
            z-index: 1; 
            border-radius: 24px; 
            overflow: hidden; 
            display: flex;
            flex: 1; 
        }

        /* ============================================= */
        /* 底部：分类名与工具列表顶部对齐                 */
        /* ============================================= */
        .categories-container { 
            display: flex; 
            flex-direction: column; 
            gap: 24px; 
            width: 100%; 
            padding-top: 24px; 
            margin-top: 20px; 
            border-top: 3px dashed #cbd5e1;
        }
        
        /* 每一行分类 */
        .category-row {
            display: flex;
            align-items: flex-start; /* 【修改点】从 center 改为 flex-start，实现顶部对齐 */
            gap: 30px;
            width: 100%;
        }

        /* 分类名变成了彩色立体泡泡 */
        .category-card { 
            padding: 6px 24px; 
            border-radius: 40px; 
            box-shadow: 0 6px 0 rgba(0,0,0,0.15); 
            font-size: 1rem; 
            font-weight: 600; 
            color: #ffffff; 
            letter-spacing: 1px;
            white-space: nowrap; 
            line-height: 1.6;
            font-family: 'ZCOOL KuaiLe', sans-serif;
            flex-shrink: 0; /* 保证卡片不被压缩 */
        }
        .color-1 { background-color: #ff6b6b; box-shadow: 0 6px 0 #cc5555; }
        .color-2 { background-color: #4ecdc4; box-shadow: 0 6px 0 #2f9e97; }
        
        /* 右边的工具彩色小卡片 */
        .category-logos { 
            display: flex; 
            align-items: center; 
            gap: 12px; 
            flex-wrap: wrap; 
        }
        .logo-item { 
            display: flex; 
            align-items: center; 
            gap: 8px; 
            color: #475569; 
            font-weight: 600; 
            font-size: 0.95rem; 
            background: #ffffff;
            padding: 6px 16px 6px 12px;
            border-radius: 30px;
            border: 2px solid #e2e8f0;
            box-shadow: 0 4px 0 #e2e8f0;
            transition: all 0.2s ease;
        }
        .logo-item:hover { 
            transform: translateY(-3px);
            box-shadow: 0 6px 0 #cbd5e1;
        }
        .logo-icon { 
            width: 28px; 
            height: 28px; 
            background: #f1f5f9; 
            border-radius: 50%; 
            display: flex; 
            align-items: center; 
            justify-content: center; 
            font-size: 0.9rem; 
            color: #475569; 
            font-weight: 600; 
        }

        /* ===== 响应式 ===== */
@media (max-width: 900px) {
    .index-right .illustration {
        display: none !important;
    }

    .main-content { flex-direction: column; align-items: center; }
            .illustration { margin-right: 0; margin-bottom: 30px; max-width: 200px; width: 200px; height: 200px; }
            .testimonial-card { min-width: 0; width: 100%; flex: 0 1 100%; max-width: 100%; margin-left: 0; }
            .categories-container { flex-direction: column; gap: 20px; }
            .category-row { flex-direction: column; align-items: flex-start; gap: 12px; }
            .category-logos { gap: 10px; justify-content: flex-start; }
            .header h1 { font-size: 1.8rem; }
            .index-right .flexwrapper::before, .index-right .flexwrapper::after { display: none; }
        }

        /* ===== 深色模式适配 ===== */
        body.dark .container { background: transparent; }
        body.dark .header h1 { color: #f1f5f9; }
        body.dark .header h1 span { color: #94a3b8; }
        body.dark .testimonial-card { background: #1e293b; border-color: #475569; box-shadow: 0 8px 0 #0f172a; }
        body.dark .categories-container { border-top-color: #334155; }
        body.dark .color-1 { background: #e15858; box-shadow: 0 6px 0 #b34141; }
        body.dark .color-2 { background: #3ba89f; box-shadow: 0 6px 0 #227d75; }
        body.dark .logo-item { background: #1e293b; border-color: #334155; box-shadow: 0 4px 0 #0f172a; color: #94a3b8; }
        body.dark .logo-item:hover { box-shadow: 0 6px 0 #020617; }
        body.dark .logo-icon { background: #334155; color: #f1f5f9; }
body.dark .card-corner-icon img { filter: drop-shadow(0 4px 4px rgba(255,255,255,0.1)); }

/* 移动端稳定布局：保留原桌面结构，仅收紧手机端内容 */
@media (max-width: 900px) {
    .index-right .illustration {
        display: none;
    }

    .index-right .main-content {
        width: 100%;
        gap: 20px;
    }

    .index-right .testimonial-card {
        width: 100%;
        min-width: 0;
        max-width: 680px;
        margin-left: 0;
    }

    .index-right .module-insert-container {
        min-height: 0;
    }

    .index-right .category-row {
        display: grid;
        grid-template-columns: minmax(92px, 0.32fr) minmax(0, 1fr);
        align-items: start;
        gap: 14px;
    }

    .index-right .category-logos {
        min-width: 0;
        gap: 10px;
    }
}

@media (max-width: 600px) {
    .index-right .container {
        padding-top: 24px !important;
    }

    .index-right .header {
        margin-top: 0 !important;
    }
}

@media (max-width: 600px) {
    .index-right .container {
        padding: 24px 14px 40px;
    }

    .index-right .header {
        margin-top: 0;
        margin-bottom: 22px;
        text-align: center;
    }

    .index-right .header h1 {
        justify-content: center;
        flex-wrap: wrap;
        gap: 4px 8px;
        font-size: 1.8rem;
    }

    .index-right .header h1 span {
        margin-left: 0;
        font-size: 1rem;
    }

    .index-right .category-row {
        grid-template-columns: minmax(84px, 0.34fr) minmax(0, 1fr);
        gap: 10px;
    }

    .index-right .category-card {
        min-width: 0;
        padding: 7px 6px;
        white-space: normal;
        text-align: center;
        font-size: 0.88rem;
    }

    .index-right .logo-item {
        min-width: 0;
        gap: 5px;
        padding: 5px 8px 5px 6px;
        font-size: 0.78rem;
    }

    .index-right .logo-icon {
        width: 24px;
        height: 24px;
        font-size: 0.78rem;
    }
}