
  .size-chart-wrap{
    width:100%;
    overflow-x:auto;                 /* 窄屏可左右滑动 */
    -webkit-overflow-scrolling:touch;
    margin:20px auto;
  }
  .size-chart{
    width:100%;
    border-collapse:collapse;
    table-layout:fixed;              /* 让 colgroup 生效、稳定分配 */
    background:#fff;
    box-shadow:0 0 8px rgba(0,0,0,.1);
    border-radius:6px;
    overflow:hidden;

    /* 列宽参数 */
    --num-cols: 10;                  /* 除第一列外的列数 */
    --first-col-min: 180px;          /* 第一列最小宽 */
    --first-col-max: 320px;          /* 第一列最大宽 */
    --first-col: clamp(var(--first-col-min), 34vw, var(--first-col-max)); /* 第一列随视口伸缩 */
    --num-col-min: 72px;             /* 其他列的最小宽（防止太窄） */

    /* 其他列 = 在剩余宽度里等分，但不得小于最小宽 */
    --other-col: max(calc((100% - var(--first-col)) / var(--num-cols)), var(--num-col-min));

    /* 整表最小宽 = 第一列最小宽 + 其他列最小宽*数量（避免被挤坏） */
    min-width: calc(var(--first-col-min) + var(--num-cols) * var(--num-col-min));
  }
  /* 用 colgroup 明确每列宽度规则 */
  .size-chart col.col-first{ width: var(--first-col); }
  .size-chart col.col-num{   width: var(--other-col); }

  .size-chart th, .size-chart td{
    border:1px solid #000;
    padding:8px 10px;
    text-align:center;      /* 全部居中 */
    white-space:nowrap;     /* 不换行，单行显示 */
  }
  .size-chart thead th{ background:#f2f2f2; font-weight:bold; }
  .size-chart thead tr:first-child th{ font-size:18px; padding:12px; background:#eaeaea; }

  .size-chart tbody tr:nth-child(even){ background:#fafafa; }
  .size-chart tbody tr:hover{ background:#fdf2f8; }

  /* 超小屏微调：给第一列更多空间，同时允许其他列再小一点 */
  @media (max-width:480px){
    .size-chart th, .size-chart td{ padding:6px 8px; font-size:12px; }
    .size-chart{
      --first-col-min: 170px;
      --first-col: clamp(var(--first-col-min), 40vw, var(--first-col-max));
      --num-col-min: 64px;
      min-width: calc(var(--first-col-min) + var(--num-cols) * var(--num-col-min));
    }
  }
