<style>
    /* 全局样式重置与基础配置 */
    * {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
      font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    }

    :root {
      /* 定义全局颜色变量，方便维护 */
      --color-primary: #1677ff;
      --color-light-gray: #f5f5f5;
      --color-gray-100: #f3f4f6;
      --color-gray-200: #e5e7eb;
      --color-gray-800: #1f2937;
      --color-white: #ffffff;
      --color-border: #e5e7eb;
    }

    /* 页面整体容器 */
    .page-container {
		max-width: 90%;
		margin: 0 auto;
		width: 1560px;
      display: flex;
      
      background-color: var(--color-light-gray);
    }

    /* 左侧侧边栏 */
    .sidebar {
      width: 256px; /* 对应原w-64 */
	  max-width: 87%;
      background-color: var(--color-white);
      box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05); /* 对应原shadow-sm */
    }

    /* 侧边栏标题 */
    .sidebar-title {
      padding: 16px; /* 对应原p-4 */
      font-size: 18px; /* 对应原text-lg */
      font-weight: 500; /* 对应原font-medium */
      color: var(--color-gray-800);
    }

    /* 侧边栏导航列表 */
    .nav-list {
      margin-top: 8px; /* 对应原mt-2 */
      list-style: none;
    }

    /* 导航列表项 */
    .nav-item {
		justify-content: space-between;
		display: flex;
      padding: 12px 16px; /* 对应原py-3 px-4 */
      cursor: pointer;
      transition: all 0.2s ease;
    }
nav-item .t1{
	display: block;
}
.nav-item .t2{
	display: none;
}
    /* 导航项hover效果 */
    .nav-item:hover {
      background-color: var(--color-gray-100); /* 对应原gray-100 */
    }
.nav-item:hover .t1{
	display: none;
}
.nav-item:hover .t2{
	display: block;
}
    /* 导航项激活状态 */
    .nav-item--active {
      background-color: var(--color-primary);
      color: var(--color-white);
      border-left: 4px solid var(--color-primary);
    }

    /* 右侧主内容区 */
    .main-content {
	  background: white;
      flex: 1;
      padding: 32px; /* 对应原p-8 */
    }

    /* 产品模块（内容面板）- 核心：默认隐藏，仅激活的面板显示 */
    .content-panel {
      display: none; /* 默认隐藏所有内容面板 */
    }

    /* 激活的内容面板 - 显示 */
    .content-panel--active {
      display: block;
    }

    /* 产品模块 */
    .product-section {
      margin-bottom: 48px; /* 对应原mb-12，两个系列之间的间距 */
    }

    /* 最后一个产品模块移除底部间距 */
    .product-section:last-child {
      margin-bottom: 0;
    }

    /* 产品模块标题 */
    .product-title {
      font-size: 32px; /* 对应原text-xl */
      font-weight: 600; /* 对应原font-semibold */
      color: #141414;
      margin-bottom: 16px; /* 对应原mb-4 */
    }

    /* 产品卡片容器 */
    .product-card {
      background-color: var(--color-white);
      border-radius: 8px; /* 对应原rounded-lg */
      box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05); /* 对应原shadow-sm */
      overflow: hidden;
    }

    /* 卡片头部 */
    .card-header {
      padding: 20px; /* 对应原p-4 */
      font-weight: 500; /* 对应原font-medium */
	  color: #4B4B4B;
    }

    /* 卡片内容区域（文件列表） */
    .card-content {
      border-top: none;
    }

    /* 文件列表项 */
    .file-item {
		margin: 10px 0px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 12px 16px; /* 对应原py-3 px-4 */
      background-color: #F8F8F8;;
      transition: all 0.2s ease; /* 对应原transition-all duration-200 */
      border-bottom: 1px solid var(--color-border);
    }

    /* 最后一个文件项移除底部边框 */
    .file-item:last-child {
      border-bottom: none;
    }

    /* 文件项hover效果 */
    .file-item:hover {
      background-color: var(--color-gray-200); /* 对应原gray-200 */
    }

    /* 文件名称文本 */
    .file-name {
      color: #828282;
    }

    /* 操作按钮组 */
    .operation-btns {
      display: flex;
      gap: 16px; /* 对应原gap-4 */
    }

    /* 通用按钮样式 */
    .btn {
      display: flex;
      align-items: center;
      gap: 4px; /* 对应原gap-1 */
      color: #828282;;
      background: none;
      border: none;
      cursor: pointer;
      font-size: 14px;
      padding: 4px 8px;
      border-radius: 4px;
      transition: background-color 0.2s ease;
    }

    /* 按钮hover效果 */
    .btn:hover {
      background-color: rgba(22, 119, 255, 0.1);
    }
	
	@media (max-width: 999px) {
	    .file-name{
			font-size: 10px;
		}
		.product-title{
			font-size: 14px;
			
		}
		
		.sidebar-title{
			padding: 9px;
			    font-size: 14px;
		}
		
		
		
		
	    }