/* 1. 基础样式和字体 */
 body {
     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
     background-color: #f7f7f7;
     /* 柔和的背景色 */
     margin: 0;
     padding: 30px 0;
 }

 .container {
     width: 95%;
     max-width: 1200px;
     margin: 0 auto;
 }

 /* 2. 表格样式 */
 .dashboard-table {
     width: 100%;
     min-width: 900px;
     /* 确保在小屏幕下表格有最小宽度，配合 overflow-x: auto 实现滚动 */
     border-collapse: collapse;
     box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
     /* 柔和的阴影 */
     border-radius: 8px;
     overflow: hidden;
     background-color: #fff;
 }

 .dashboard-table thead tr {
     background-color: #eef2f6;
     /* 表头背景色 */
 }

 .dashboard-table th {
     text-align: left;
     padding: 12px 16px;
     font-size: 13px;
     font-weight: 600;
     color: #4a5568;
     /* 深灰色文本 */
     letter-spacing: 0.05em;
     text-transform: uppercase;
 }

 /* 3. 表体行样式 */
 .dashboard-table td {
     padding: 12px 16px;
     border-bottom: 1px solid #edf2f7;
     /* 柔和的行分割线 */
     font-size: 14px;
     color: #2d3748;
     white-space: nowrap;
     vertical-align: middle;
     /* 关键修复：确保徽章垂直居中，解决堆叠问题 */
 }

 /* 4. 列宽优化 */
 .dashboard-table th:nth-child(1),
 .dashboard-table td:nth-child(1) {
     width: 25%;
     /* Package 列分配更多空间 */
 }

 /* 5. 悬停效果 */
 .dashboard-table tbody tr:hover {
     background-color: #f7fafd;
     /* 悬停时变浅蓝色 */
     transition: background-color 0.15s ease-in-out;
 }

 /* 6. 链接样式 */
 .package-link {
     color: #3b82f6;
     /* 链接蓝色 */
     text-decoration: none;
     font-weight: 600;
     /* 突出包名 */
     font-size: 15px;
 }