/* =============================================================================
   /research/ 专业研讨·排盘 —— 出生时间「年 月 日 时 分」同行显示修复
   -----------------------------------------------------------------------------
   缺陷现象（老大反馈）：
     「年月日时 在一行，分 在下一行」——表单里「分」被挤到第二行，不美观。

   根因（线上 index-DjIGjZaF.css，已实测确认）：
     .rs-form__grid { display:grid;
                      grid-template-columns:repeat(auto-fit,minmax(72px,1fr));
                      gap:var(--sp-2) }                 [ --sp-2 = 8px ]
     5 个字段并排的最小宽度需求 = 5 × 72px + 4 × 8px = 392px。
     而移动端容器可用宽度约 375 - 30(padding) ≈ 345px < 392px，
     auto-fit 自动减少列数 → 第 5 个字段「分」被折到第二行。
     同时 .rs-form__row 是 flex-direction:column，本身不会横向收缩到 72px 以下。

   修法：
     1. 固定 5 列（repeat(5, minmax(0,1fr))），允许每列压缩到 0 而不折行
     2. 输入框 width:100% + min-width:0，居中数字，左右内边距收紧到 4px
     3. 窄屏分级降级：≤480px 三列、≤340px 两列，保证触控目标仍够大

   用法（二选一）：
     A. 覆盖线上同名文件：把本文件内容追加到
        /research/assets/index-DjIGjZaF.css 末尾（同目录名不变，无需改 HTML）
     B. 独立引入：<link rel="stylesheet" href="/research/assets/research-form-fix.css">
   建议用 A，避免多一次请求；本文件用 !important 提升优先级以覆盖打包后的原规则。
   ========================================================================== */

/* 出生时间：年 月 日 时 分 —— 恒定 5 列同行 */
.rs-form__grid {
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
}

/* 让每一列真正可压缩，避免被内容撑开后又触发换行 */
.rs-form__grid > .rs-form__row {
  min-width: 0;
}

/* 输入框：占满列宽、数字居中、收紧内边距，保证 5 列下仍可读可点 */
.rs-form__grid > .rs-form__row > input {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  text-align: center;
  padding-inline: 4px;
}

/* 分 / 时的数字较长时避免被裁切 */
.rs-form__grid > .rs-form__row > input[type="number"] {
  -moz-appearance: textfield;
  appearance: textfield;
}
.rs-form__grid > .rs-form__row > input[type="number"]::-webkit-outer-spin-button,
.rs-form__grid > .rs-form__row > input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* 移动端（≤480px）：5 列过窄，降为 3 列，分两行但排布均匀 */
@media (max-width: 480px) {
  .rs-form__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

/* 超窄屏（≤340px）：降为 2 列，保证触控目标 ≥ 44px */
@media (max-width: 340px) {
  .rs-form__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* 打印时不显示表单（与原打包 CSS 的 @media print 规则保持一致） */
@media print {
  .rs-form {
    display: none !important;
  }
}