
        /* 页面整体样式 */
        body {
            font-family: 'Segoe UI', 'Microsoft YaHei', sans-serif;
            margin: 0;
            padding: 0;
            color: #333;
            line-height: 1.6;
            
            /* 添加专业电子元器件背景到整个页面 */
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200' viewBox='0 0 200 200'%3E%3Cdefs%3E%3Cstyle%3E.comp %7B fill:none; stroke:%23c724b1; stroke-width:1; stroke-opacity:0.20; %7D .solid %7B fill:%23c724b1; fill-opacity:0.15; stroke:none; %7D .marker %7B fill:%23c724b1; fill-opacity:0.23; %7D%3C/style%3E%3C/defs%3E%3Cg transform='translate(0, 0)'%3E%3C!-- IC芯片 (DIP封装) --%3E%3Crect class='comp' x='30' y='30' width='60' height='40'/%3E%3Crect class='solid' x='35' y='35' width='50' height='30'/%3E%3Cg class='comp' stroke-width='0.8'%3E%3Cline x1='30' y1='35' x2='20' y2='35'/%3E%3Cline x1='30' y1='45' x2='20' y2='45'/%3E%3Cline x1='30' y1='55' x2='20' y2='55'/%3E%3Cline x1='90' y1='35' x2='100' y2='35'/%3E%3Cline x1='90' y1='45' x2='100' y2='45'/%3E%3Cline x1='90' y1='55' x2='100' y2='55'/%3E%3C/g%3E%3Ccircle class='marker' cx='35' cy='33' r='1.5'/%3E%3C!-- 电阻 (IEC矩形符号) --%3E%3Crect class='comp' x='120' y='40' width='50' height='20'/%3E%3Cline class='comp' x1='120' y1='50' x2='110' y2='50'/%3E%3Cline class='comp' x1='170' y1='50' x2='180' y2='50'/%3E%3Cline class='comp' x1='125' y1='42' x2='125' y2='58' stroke-width='0.8' stroke='%23990000' stroke-opacity='0.20'/%3E%3Cline class='comp' x1='135' y1='42' x2='135' y2='58' stroke-width='0.8' stroke='%23000000' stroke-opacity='0.20'/%3E%3Cline class='comp' x1='145' y1='42' x2='145' y2='58' stroke-width='0.8' stroke='%23ff6600' stroke-opacity='0.20'/%3E%3Cline class='comp' x1='155' y1='42' x2='155' y2='58' stroke-width='0.8' stroke='%23ffcc00' stroke-opacity='0.20'/%3E%3C!-- 电容 (无极性) --%3E%3Cline class='comp' x1='40' y1='100' x2='40' y2='130'/%3E%3Cline class='comp' x1='60' y1='100' x2='60' y2='130'/%3E%3Cline class='comp' x1='20' y1='115' x2='40' y2='115'/%3E%3Cline class='comp' x1='60' y1='115' x2='80' y2='115'/%3E%3C!-- 三极管 (NPN) --%3E%3Ccircle class='comp' cx='150' cy='120' r='15'/%3E%3Cline class='comp' x1='150' y1='105' x2='150' y2='90'/%3E%3Cline class='comp' x1='150' y1='135' x2='150' y2='150'/%3E%3Cline class='comp' x1='165' y1='120' x2='180' y2='120'/%3E%3Cpath class='comp' d='M 165 120 L 158 117 L 158 123 Z'/%3E%3Ctext x='147' y='95' font-size='4' fill='%23c724b1' fill-opacity='0.20' text-anchor='middle'%3EC%3C/text%3E%3Ctext x='147' y='155' font-size='4' fill='%23c724b1' fill-opacity='0.20' text-anchor='middle'%3EB%3C/text%3E%3Ctext x='175' y='125' font-size='4' fill='%23c724b1' fill-opacity='0.20'%3EE%3C/text%3E%3C!-- LED --%3E%3Cpath class='comp' d='M 90 150 L 110 150 L 115 165 L 110 180 L 90 180 L 85 165 Z'/%3E%3Cline class='comp' x1='70' y1='165' x2='85' y2='165'/%3E%3Cline class='comp' x1='115' y1='165' x2='130' y2='165'/%3E%3Cpath class='comp' d='M 115 165 L 122 162 L 122 168 Z' fill='%23c724b1' fill-opacity='0.25'/%3E%3Ctext x='80' y='160' font-size='4' fill='%23c724b1' fill-opacity='0.20'%3E%2B%3C/text%3E%3Cline x1='130' y1='170' x2='135' y2='175' stroke='%23c724b1' stroke-opacity='0.20' stroke-width='0.5'/%3E%3Cline x1='130' y1='175' x2='135' y2='170' stroke='%23c724b1' stroke-opacity='0.20' stroke-width='0.5'/%3E%3C!-- 贴片元件 (0805) --%3E%3Crect class='solid' x='130' y='80' width='40' height='20' rx='3'/%3E%3Crect class='comp' x='125' y='83' width='5' height='14'/%3E%3Crect class='comp' x='170' y='83' width='5' height='14'/%3E%3Ctext x='150' y='93' font-size='5' fill='%23c724b1' fill-opacity='0.20' text-anchor='middle'%3E104%3C/text%3E%3C/g%3E%3C/svg%3E");
            background-repeat: repeat;
            background-size: 200px 200px;
            background-color: rgba(255, 255, 255, 0.95); /* 页面整体背景色 */
        }
        
        /* 内容容器样式 */
        .bom-solution-container {
            max-width: 1200px;
            margin: 0 auto;
            padding: 20px;
            background-color: rgba(255, 255, 255, 0.85); /* 内容区域背景色，带透明度 */
            min-height: 100vh; /* 确保容器高度至少为视口高度 */
            box-shadow: 0 0 30px rgba(0, 0, 0, 0.1); /* 添加阴影突出内容区域 */
            position: relative;
        }
        
        /* 主色调 */
        .bom-solution-container .primary-color {
            color: #c724b1;
        }
        
        .bom-solution-container .primary-border {
            border-color: #c724b1;
        }
        
        .bom-solution-container .primary-bg {
            background-color: #c724b1;
            color: white;
        }
        
        /* 标题样式 */
        .bom-solution-container .main-title {
            text-align: center;
            margin-bottom: 20px;
            padding-bottom: 15px;
            border-bottom: 3px solid #c724b1;
            background-color: rgba(255, 255, 255, 0.95); /* 标题添加背景增强可读性 */
            padding: 20px;
            border-radius: 8px;
        }
        
        .bom-solution-container .vision {
            text-align: center;
            font-size: 18px;
            font-style: italic;
            margin-bottom: 30px;
            color: #666;
            background-color: rgba(255, 255, 255, 0.9); /* 副标题添加背景 */
            padding: 15px;
            border-radius: 6px;
        }
        
        .bom-solution-container .section-title {
            margin-top: 40px;
            margin-bottom: 20px;
            padding-left: 10px;
            border-left: 4px solid #c724b1;
            font-size: 24px;
            background-color: rgba(255, 255, 255, 0.9); /* 章节标题添加背景 */
            padding: 15px;
            border-radius: 6px;
        }
        
        /* 四大物资库新版布局 - 更新部分 */
        .bom-solution-container .material-libraries {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 25px;
            margin-bottom: 40px;
        }
        
        @media (max-width: 768px) {
            .bom-solution-container .material-libraries {
                grid-template-columns: 1fr;
            }
        }
        
        .bom-solution-container .library-card {
            border: 1px solid #e0e0e0;
            border-radius: 8px;
            overflow: visible; /* 改为visible以允许二级分类超出 */
            transition: transform 0.3s, box-shadow 0.3s;
            height: auto; /* 让卡片高度自适应 */
            display: flex;
            flex-direction: column;
            position: relative; /* 添加相对定位 */
            background-color: rgba(255, 255, 255, 0.95); /* 卡片背景增强可读性 */
        }
        
        .bom-solution-container .library-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 10px 20px rgba(199, 36, 177, 0.15);
        }
        
        .bom-solution-container .library-header {
            background-color: #c724b1;
            color: white;
            padding: 15px 20px;
            font-weight: bold;
            font-size: 18px;
            border-radius: 8px 8px 0 0;
            position: relative;
            z-index: 2;
        }
        
        .bom-solution-container .library-content {
            padding: 20px;
            flex: 1;
            display: flex;
            flex-direction: column;
            position: relative;
            z-index: 1;
        }
        
        .bom-solution-container .library-description {
            margin-bottom: 15px;
            color: #555;
            flex-shrink: 0;
        }
        
        /* 分类展示区 - 新版 */
        .bom-solution-container .category-showcase {
            margin-top: 15px;
            flex: 1;
            display: flex;
            flex-direction: column;
            position: relative;
            min-height: 180px; /* 设置最小高度，保证卡片有基本高度 */
        }
        
        .bom-solution-container .category-box-title {
            font-weight: bold;
            margin-bottom: 10px;
            color: #444;
            display: flex;
            align-items: center;
            justify-content: space-between;
        }
        
        .bom-solution-container .click-hint {
            font-size: 12px;
            color: #c724b1;
            font-style: italic;
            background-color: rgba(199, 36, 177, 0.1);
            padding: 3px 8px;
            border-radius: 10px;
        }
        
        .bom-solution-container .primary-categories {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
            margin-bottom: 15px;
            position: relative;
            z-index: 5; /* 确保可以点击 */
        }
        
        .bom-solution-container .primary-category {
            background-color: #f5f5f5;
            padding: 6px 12px;
            border-radius: 4px;
            border: 1px solid #ddd;
            cursor: pointer;
            transition: all 0.2s;
            font-size: 14px;
            position: relative;
            z-index: 5;
        }
        
        .bom-solution-container .primary-category:hover {
            background-color: #e8e8e8;
            border-color: #c724b1;
        }
        
        /* 二级分类点击显示 - 固定在卡片外部 */
        .bom-solution-container .secondary-details {
            display: none;
            background-color: #fafafa;
            border: 1px solid #eee;
            border-radius: 6px;
            padding: 15px;
            max-height: 250px;
            overflow-y: auto;
            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
            position: absolute;
            top: -40px; /* 向上移动到卡片上方 */
            left: 0;
            right: 0;
            z-index: 20; /* 更高的z-index确保显示在最上面 */
        }
        
        .bom-solution-container .secondary-details.active {
            display: block;
        }
        
        .bom-solution-container .secondary-category {
            padding: 3px 0;
            font-size: 13px;
            color: #555;
            border-bottom: 1px solid #f0f0f0;
        }
        
        .bom-solution-container .secondary-category:last-child {
            border-bottom: none;
        }
        
        /* 具体展示示例 */
        .bom-solution-container .concrete-example {
            background-color: rgba(249, 249, 249, 0.9);
            padding: 15px;
            border-radius: 6px;
            border-left: 3px solid #c724b1;
            margin-top: 15px;
            font-style: italic;
            font-size: 14px;
            flex-shrink: 0;
            position: relative;
            z-index: 1;
        }
        
        /* 经验分享 */
        .bom-solution-container .experience-sharing {
            background-color: rgba(255, 255, 255, 0.95);
            padding: 25px;
            border-radius: 8px;
            margin: 30px 0;
            border-left: 4px solid #c724b1;
            box-shadow: 0 3px 10px rgba(0,0,0,0.05);
        }
        
        .bom-solution-container .experience-item {
            margin-bottom: 20px;
        }
        
        .bom-solution-container .experience-item:last-child {
            margin-bottom: 0;
        }
        
        /* 智慧调度中心流程图 */
        .bom-solution-container .smart-center {
            margin: 40px 0;
        }
        
        .bom-solution-container .process-flow {
            display: flex;
            flex-direction: column;
            gap: 25px;
            position: relative;
        }
        
        .bom-solution-container .process-flow::before {
            content: '';
            position: absolute;
            top: 0;
            bottom: 0;
            left: 25px;
            width: 3px;
            background-color: #c724b1;
            z-index: 1;
        }
        
        .bom-solution-container .process-stage {
            display: flex;
            position: relative;
            z-index: 2;
        }
        
        .bom-solution-container .stage-number {
            width: 50px;
            height: 50px;
            background-color: #c724b1;
            color: white;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 20px;
            font-weight: bold;
            flex-shrink: 0;
            margin-right: 20px;
            box-shadow: 0 4px 8px rgba(199, 36, 177, 0.3);
        }
        
        .bom-solution-container .stage-content {
            flex: 1;
            background-color: rgba(255, 255, 255, 0.95);
            border: 1px solid #e8e8e8;
            border-radius: 8px;
            padding: 18px;
            box-shadow: 0 3px 10px rgba(0,0,0,0.05);
        }
        
        .bom-solution-container .stage-title {
            color: #c724b1;
            margin-top: 0;
            margin-bottom: 8px;
            font-size: 18px;
        }
        
        .bom-solution-container .stage-subtitle {
            font-weight: bold;
            margin-bottom: 8px;
            color: #444;
            font-size: 15px;
        }
        
        .bom-solution-container .stage-content p {
            margin: 0;
            font-size: 14px;
        }
        
        /* 响应式设计 */
        @media (max-width: 768px) {
            .bom-solution-container {
                padding: 15px;
            }
            
            .bom-solution-container .process-flow::before {
                left: 20px;
            }
            
            .bom-solution-container .stage-number {
                width: 40px;
                height: 40px;
                font-size: 18px;
                margin-right: 15px;
            }
            
            /* 移动端适配二级分类 */
            .bom-solution-container .secondary-details {
                top: -20px; /* 移动端向上移动少一些 */
                max-height: 200px;
            }
        }
    