:root{
    --brand-pink:#d63384;
    --shadow:0 0 10px rgba(0,0,0,0.1);
    --cell-pad:8px 10px;
  }

  body {
    font-family: Arial, sans-serif;
    background: #f9f9f9;
    color: #333;
    margin: 0;
  }

  /* 顶部提示 */
  .notice {
    text-align: center;
    font-size: 14px;
    margin: 16px auto 8px;
    padding: 6px 10px;
    background: none;
    border: none;
    box-shadow: none;
    color: #555;
    max-width: 1100px;
  }
  .notice a {
    color: var(--brand-pink);
    font-weight: bold;
    text-decoration: none;
  }
  .notice a:hover { text-decoration: underline; }

  /* 表格容器：加左右内边距，避免手机贴边 */
  .table-wrap{
    max-width: 1200px;
    margin: 10px auto 40px;
    padding: 0 12px;
  }

  /* 表格样式 */
  table {
    border-collapse: collapse;
    width: 100%;
    background: #fff;
    box-shadow: var(--shadow);
    table-layout: fixed; /* 列宽均匀 */
  }
  td {
    border: 1px solid #000;
    padding: var(--cell-pad);
    vertical-align: top;
    word-wrap: break-word;
    background: #fff;
  }
  .label {
    font-size: 14px;
    margin-bottom: 6px;
    display: block;
    font-weight: normal;
  }
  /* 用 aspect-ratio 让色块随宽度自适应高度 */
  .color-box {
    width: 100%;
    aspect-ratio: 3 / 2;   /* 可按需调成 1/1 或 4/3 */
    border: 1px solid #ccc;
    border-radius: 4px;
  }
  /* 表头行 */
  td[colspan] {
    background: #f0f0f0;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
  }

  /* ——移动端排版优化—— */
  @media (max-width: 900px){
    .label{ font-size: 13px; }
    td{ padding: 8px; }
  }
  @media (max-width: 600px){
    .label{ font-size: 12px; }
    td{ padding: 6px; }
  }